/* НАА 23 / SELENE v8 — original six-layer Earthrise restored.
   Same-sized transparent cuts are ALWAYS registered to one shared camera.
   We never translate the moonscape, frame or ground independently. */
.selene-earthrise.earthrise{
  position:relative; height:170svh !important; min-height:0; overflow:clip;
  background:#070b13; isolation:isolate;
}
.selene-earthrise .hero-sticky{
  position:sticky;top:0;height:100svh;min-height:0;overflow:hidden;
  background:#05070c;isolation:isolate;
}
.selene-earthrise .selene-stage{
  position:absolute;inset:0;isolation:isolate;overflow:hidden;
  transform-origin:50% 50%;transform:scale(1.015)!important;
  will-change:transform;
}
.selene-earthrise .selene-layer{
  position:absolute;inset:0;width:100%;height:100%;
  display:block;opacity:1;will-change:transform,opacity;pointer-events:none;
}
.selene-earthrise .selene-layer picture,
.selene-earthrise .selene-layer img{
  display:block;position:absolute;inset:0;width:100%;height:100%;max-width:none;
}
.selene-earthrise .selene-layer img{
  object-fit:cover;object-position:58% 50%;
  user-select:none;-webkit-user-drag:none;
}
@media(min-width:768px){
  .selene-earthrise .selene-layer img{object-position:center center}
}
.selene-earthrise .selene-layer-sky{z-index:1;transform:scale(1.09)}
.selene-earthrise .selene-layer-earth{z-index:2;transform:translate3d(0,25svh,0) scale(.92)}
.selene-earthrise .selene-layer-moonscape{z-index:3;transform:none}
.selene-earthrise .selene-layer-frame{z-index:4;transform:none}
.selene-earthrise .selene-layer-astronaut{z-index:5;transform:none;opacity:1}
.selene-earthrise .selene-layer-ground{z-index:6;transform:none}
/* One decorative gradient, no opaque slices/black stripes. */
.selene-earthrise .hero-sticky:after{
  content:"";position:absolute;inset:0;z-index:10;pointer-events:none;
  background:linear-gradient(180deg,rgba(3,6,15,.25),transparent 30%,
    rgba(4,7,13,.04) 60%,rgba(4,7,13,.32) 100%);
}
.selene-earthrise .hero-veil{
  z-index:11;pointer-events:none;opacity:.22;
  background:radial-gradient(ellipse at 30% 38%,rgba(151,179,222,.25),transparent 55%),
    radial-gradient(ellipse at 70% 70%,rgba(80,114,177,.14),transparent 60%);
}
.selene-earthrise .selene-dust{
  position:absolute;inset:0;width:100%;height:100%;z-index:12;
  pointer-events:none;opacity:.7;
}
.selene-earthrise .hero-exit{
  position:absolute;inset:0;z-index:13;pointer-events:none;
  background:#070b13;opacity:0;
}
.selene-earthrise .hero-title{
  position:absolute;z-index:20;top:49%;left:5%;right:5%;
  transform:translateY(-50%);opacity:1;
  max-width:1450px;margin-inline:auto;
  text-shadow:0 5px 26px #020409dd;
}
.selene-earthrise .hero-title .eyebrow{
  display:block;color:#b9d6f8;letter-spacing:.23em;
}
.selene-earthrise .hero-title h1{
  font-size:clamp(2rem,6.2vw,7.2rem);line-height:1.12;
  letter-spacing:-.052em;margin:20px auto 17px;
}
.selene-earthrise .hero-title p{color:#dfeafa;text-wrap:balance}
.selene-earthrise .hero-hud{z-index:22;bottom:4.5%;font-family:"IBM Plex Mono",monospace;font-weight:500}
.selene-earthrise .hero-scroll{z-index:22;top:50%;right:21px;font-family:"IBM Plex Mono",monospace}
.selene-earthrise .hero-scroll b{font-size:1.1rem;font-weight:400;display:inline-block;animation:selene-scroll-cue 1.8s ease-in-out infinite}
@keyframes selene-scroll-cue{50%{transform:translateY(8px);opacity:.55}}
.selene-earthrise .selene-telemetry{
  position:absolute;z-index:21;top:105px;left:5%;right:5%;
  display:flex;justify-content:space-between;align-items:start;gap:20px;
  color:#d9e8fa;font:500 .73rem/1.4 "IBM Plex Mono",monospace;
  letter-spacing:.08em;text-shadow:0 2px 9px #000c;
}
.selene-earthrise .selene-telemetry-left,.selene-earthrise .selene-telemetry-right{display:flex;flex-direction:column;gap:5px}
.selene-earthrise .selene-telemetry-right{text-align:right}
.selene-earthrise .selene-telemetry strong{color:#9fc9ff;font-weight:500}
.selene-earthrise .selene-telemetry small{font-size:.56rem;letter-spacing:.17em;color:#b6c9e3}
/* subtle decorative frame brackets from SELENE's telemetry UI */
.selene-earthrise .hero-sticky:before{
  content:"";position:absolute;z-index:19;pointer-events:none;
  inset:90px 3% 28px;
  background:linear-gradient(#cfe8ff66,#cfe8ff66) top left/20px 1px,
    linear-gradient(#cfe8ff66,#cfe8ff66) top left/1px 20px,
    linear-gradient(#cfe8ff66,#cfe8ff66) top right/20px 1px,
    linear-gradient(#cfe8ff66,#cfe8ff66) top right/1px 20px,
    linear-gradient(#cfe8ff66,#cfe8ff66) bottom left/20px 1px,
    linear-gradient(#cfe8ff66,#cfe8ff66) bottom left/1px 20px,
    linear-gradient(#cfe8ff66,#cfe8ff66) bottom right/20px 1px,
    linear-gradient(#cfe8ff66,#cfe8ff66) bottom right/1px 20px;
  background-repeat:no-repeat;opacity:.48;
}
/* Keep hero buttons visible with enough spacing without altering v7 buttons elsewhere. */
.selene-earthrise .hero-title .button{margin-top:5px;position:relative;z-index:1}
/* Standalone at no-JS/reduced motion: static, fully aligned scene, all labels visible. */
@media(max-width:820px){
  .selene-earthrise.earthrise{height:155svh !important}
  .selene-earthrise .hero-title{top:52%;left:5%;right:5%}
  .selene-earthrise .hero-title h1{font-size:clamp(2.05rem,8vw,4.4rem)}
  .selene-earthrise .selene-telemetry{top:85px;left:6%;right:6%;font-size:.62rem}
  .selene-earthrise .hero-scroll{display:none}
  .selene-earthrise .hero-sticky:before{inset:75px 4% 30px}
}
@media(max-width:520px){
  .selene-earthrise.earthrise{height:145svh !important}
  .selene-earthrise .hero-title h1{font-size:clamp(2rem,9.6vw,3.3rem)}
  .selene-earthrise .hero-title .eyebrow{font-size:.54rem;line-height:1.7}
  .selene-earthrise .hero-title p{font-size:.84rem;line-height:1.6}
  .selene-earthrise .selene-telemetry{top:89px;font-size:.57rem}
  .selene-earthrise .selene-telemetry small{font-size:.44rem;letter-spacing:.1em}
  .selene-earthrise .hero-hud{left:6%;right:6%;font-size:.45rem;bottom:5%}
}
@media(prefers-reduced-motion:reduce){
  .selene-earthrise .selene-stage{transform:none!important;will-change:auto}
  .selene-earthrise .selene-layer{transform:none!important;opacity:1!important;will-change:auto}
  .selene-earthrise .hero-exit,.selene-earthrise .hero-veil,.selene-earthrise .selene-dust{display:none!important}
  .selene-earthrise .hero-title{opacity:1!important;transform:translateY(-50%)!important}
  .selene-earthrise .hero-scroll b{animation:none}
}


/* v8.1 logo/header refinement */
.site-header .brand.brand-full{
  display:flex;align-items:center;min-width:0;max-width:min(48vw, 34rem);
  text-decoration:none;
}
.site-header .brand.brand-full .brand-full-text{
  display:block;
  color:#f2f7ff;
  font-family:"Michroma", system-ui, sans-serif;
  font-size:clamp(.62rem, .56rem + .34vw, .9rem);
  line-height:1.22;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-wrap:balance;
}
@media (max-width: 1400px){
  .site-header .desktop-nav{gap:1.25rem}
  .site-header .desktop-nav a{font-size:.75rem}
  .site-header .brand.brand-full{max-width:min(42vw, 28rem)}
}
@media (max-width: 1180px){
  .site-header .brand.brand-full .brand-full-text{font-size:.68rem;letter-spacing:.06em}
  .site-header .desktop-nav{gap:1rem}
}
@media (max-width: 960px){
  .site-header .brand.brand-full{max-width:min(58vw, 24rem)}
  .site-header .brand.brand-full .brand-full-text{font-size:.62rem;line-height:1.18}
}
@media (max-width: 767px){
  .site-header .brand.brand-full{
    max-width:calc(100vw - 7rem);
    align-items:flex-start;
  }
  .site-header .brand.brand-full .brand-full-text{
    font-size:.58rem;
    line-height:1.3;
    letter-spacing:.06em;
  }
}
@media (max-width: 460px){
  .site-header .brand.brand-full{max-width:calc(100vw - 6.3rem)}
  .site-header .brand.brand-full .brand-full-text{
    font-size:.52rem;
    line-height:1.28;
    letter-spacing:.045em;
  }
}