/* A full-width moon scene contained within the hero and fading into the page. */
body{position:relative;isolation:isolate}
.celestial-scene{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:var(--bg)}
.scene-atmosphere{position:absolute;inset:0;background-image:url('assets/eclipse-dark.jpg');background-size:400% 100%;background-position:left center;opacity:.65}
[data-theme=light] .scene-atmosphere{background-image:url('assets/eclipse-light.jpg');opacity:.55}
.scene-orbit{--diameter:clamp(680px,83vw,1320px);position:absolute;width:var(--diameter);height:var(--diameter);left:calc(77% - var(--diameter)/2);top:calc(51% - var(--diameter)/2)}
.rotating-moon{display:block;width:100%;height:100%;object-fit:contain;transform-origin:50% 50%;animation:moon-rotation 180s linear infinite;will-change:transform;filter:brightness(.9);mask-image:radial-gradient(circle closest-side,#000 85%,#000 87%,transparent 90%)}
[data-theme=light] .rotating-moon{filter:brightness(1.45) saturate(.68);opacity:.85}
.scene-veil{position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 0%,var(--veil-mid) 24%,transparent 75%),linear-gradient(0deg,var(--bg) 0%,transparent 58%)}
.hero{isolation:isolate;overflow:hidden;border-bottom:0;min-height:calc(100svh - 112px);display:flex;align-items:center;width:100%}
.hero:after{display:none}
.hero-copy{padding-block:40px 96px;max-width:none;min-width:0}
.hero .promise{white-space:nowrap;max-width:none;font-size:clamp(.75rem,4.05vw,1.375rem)}
.hero-signup{margin-top:36px;text-align:left;width:max-content;max-width:100%}
.hero-signup .signup-note{margin-top:18px;text-wrap:pretty}
.hero-signup .button{width:auto}
.inside,.editor,.last-call,.site-footer{position:relative}
.inside{padding-top:62px}
.motion-toggle{border:1px solid var(--line);background:var(--bg);color:var(--muted);border-radius:50%;width:44px;height:44px;padding:0;display:grid;place-items:center;cursor:pointer}
.motion-toggle:hover{color:var(--ink);border-color:var(--muted)}
.motion-toggle svg{width:17px;height:17px}
.motion-toggle .play-icon{display:none}
body[data-motion=paused] .rotating-moon{animation-play-state:paused}
body[data-motion=paused] .motion-toggle .pause-icon{display:none}
body[data-motion=paused] .motion-toggle .play-icon{display:block}
.header-right{gap:16px}.header-right .launch-label{margin-right:16px}
@keyframes moon-rotation{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@media(max-width:900px){.scene-orbit{--diameter:clamp(640px,110vw,1000px);left:calc(83% - var(--diameter)/2)}.scene-veil{background:linear-gradient(90deg,var(--bg),var(--veil-mid) 25%,transparent 100%),linear-gradient(0deg,var(--bg),transparent 70%)}.hero-copy{padding-block:40px 80px}}
@media(max-width:600px){.scene-orbit{--diameter:clamp(440px,145vw,780px);left:calc(78% - var(--diameter)/2);top:calc(190px - var(--diameter)/2)}.scene-veil{background:linear-gradient(0deg,var(--bg) 7%,var(--veil-mid) 44%,transparent 100%),linear-gradient(90deg,var(--veil-mid),transparent 80%)}.hero{min-height:calc(100svh - 92px)}.hero-copy{padding:160px 0 64px}.header-right{gap:10px}.inside{padding-top:44px}}
@media(prefers-reduced-motion:reduce){.rotating-moon{animation:none;will-change:auto}.motion-toggle{display:none}}

/* Editorial headline, masthead caption, and a single-line launch note. */
.header-brand{display:flex;align-items:center;gap:24px;min-width:0}
.header-tagline{border-left:1px solid var(--line);padding-left:24px;max-width:190px;color:var(--muted);font-size:.8125rem;line-height:1.5;letter-spacing:.04em}
.hero h1{font-size:clamp(2.35rem,4.35vw,4rem);line-height:1.08;letter-spacing:-.045em}
.headline-line{display:block}
.hero h1 strong{color:var(--accent);font-weight:700}
.hero-signup{width:max-content;max-width:100%}
.hero-signup .signup-note{max-width:none;text-wrap:wrap}
.launch-note{display:block;white-space:nowrap;font-size:clamp(.625rem,3.1vw,.8125rem)}
.subscribe-note{display:block;margin-top:4px}
.footer-end{align-items:center}
.social-x{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;color:var(--muted)}
.social-x:hover{color:var(--ink)}
.social-x svg{width:20px;height:20px}
@media(max-width:600px){.site-header{height:auto;min-height:112px;flex-wrap:wrap;padding-block:18px;gap:12px}.header-brand{width:100%;justify-content:space-between;gap:16px}.header-tagline{max-width:150px;padding-left:16px;font-size:.75rem}.header-right{margin-left:auto}.hero h1{font-size:clamp(2rem,7.9vw,3rem)}.hero-signup{max-width:100%}}

/* Keep the light hero copy legible while preserving the moon on the right. */
[data-theme=light] .hero{--gold:#715a2e}
[data-theme=light] .scene-veil{background:linear-gradient(90deg,var(--bg) 0%,rgba(240,237,246,.96) 35%,rgba(240,237,246,.94) 60%,rgba(240,237,246,.12) 100%),linear-gradient(0deg,var(--bg) 0%,transparent 65%)}
@media(max-width:600px){
  .hero{min-height:0}
  .hero-signup{margin-top:32px}
  [data-theme=light] .scene-veil{background:linear-gradient(0deg,var(--bg) 0%,rgba(240,237,246,.97) 65%,rgba(240,237,246,.94) 80%,rgba(240,237,246,.3) 100%)}
}