/* One composition, intrinsically sized text, and a bounded decorative stage. */
.hero{padding:24px 4.2% 20px;scroll-margin-top:0}
.hero-topline,.hero-baseline{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:10px;letter-spacing:.065em;color:var(--muted)}
.hero-topline p{font-size:inherit;line-height:1.5}.hero-topline>span{white-space:nowrap}
.hero-composition{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center;gap:clamp(24px,4vw,72px);padding:30px 0 32px}
.hero-copy{min-width:0;container-type:inline-size}
.hero h1{font-size:clamp(48px,6.2vw,94px);font-weight:600;letter-spacing:-.075em;line-height:1.02;text-transform:uppercase;margin:0}
.hero h1>span{display:block;white-space:nowrap}
@supports(font-size:1cqi){.hero h1{font-size:clamp(32px,13cqi,94px)}}
.hero-payoff{color:var(--muted)}
.hero-copy>p{font-size:16px;line-height:1.65;max-width:48ch;margin:24px 0;color:var(--secondary)}
.hero-actions{display:flex;align-items:center;gap:25px;flex-wrap:wrap}
.hero .button{min-height:48px;padding:15px 18px;font-size:13px}
.hero-secondary{display:inline-flex;align-items:center;gap:12px;font-size:12px;min-height:44px;border-bottom:1px solid var(--line)}
.hero-visual{min-width:0;position:relative;margin:0;padding:0 0 44px;overflow:visible;align-self:center}
.hero-stage{position:relative;width:100%;aspect-ratio:1.25;container-type:size;display:grid;place-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.orbital{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;font-size:min(.91vw,13px);line-height:1;letter-spacing:0;white-space:pre;user-select:none;margin:0;color:var(--secondary);text-align:left;flex-shrink:0}
@supports(font-size:1cqw){.hero-stage .orbital{font-size:min(1.95cqw,2.15cqh)}}

.hero-axis{position:absolute;left:0;right:0;display:flex;justify-content:space-between;gap:12px;font-size:9px;letter-spacing:.07em;color:var(--muted)}
.hero-axis-top{top:10px}.hero-axis-bottom{bottom:10px}
.hero-visual figcaption{position:absolute;bottom:13px;left:0;font-size:8px;color:var(--muted);letter-spacing:.02em}
.motion-control{position:absolute;right:0;bottom:0;min-height:40px;padding:8px 10px;font:inherit;font-size:9px;color:var(--secondary);background:var(--bg);border:1px solid var(--line);cursor:pointer}
.hero-baseline{border-top:1px solid var(--line);padding-top:16px;font-size:9px}.hero-baseline a{min-height:24px;display:flex;align-items:center;gap:12px}
@media(min-width:901px) and (min-height:800px){.hero{padding-top:32px;padding-bottom:24px}.hero-composition{padding-top:45px;padding-bottom:45px}.hero-stage{aspect-ratio:1.1}}
@media(min-width:901px) and (max-height:760px){.hero-composition{padding-top:22px;padding-bottom:24px}.hero h1{font-size:min(12cqi,76px)}.hero-copy>p{margin:18px 0}.hero-stage{aspect-ratio:1.35}}
@media(max-width:900px){.hero{padding:22px 6% 18px}.hero-composition{grid-template-columns:minmax(0,1fr);gap:22px;padding:24px 0 20px}.hero-copy{max-width:650px;width:100%;margin:auto}.hero h1{font-size:clamp(34px,10vw,70px)}@supports(font-size:1cqi){.hero h1{font-size:clamp(30px,12.7cqi,70px)}}.hero-copy>p{font-size:15px;max-width:52ch;margin:18px 0}.hero-visual{width:100%;max-width:650px;margin:auto;padding-bottom:38px}.hero-stage{aspect-ratio:2.4}.hero-stage .orbital{position:absolute;left:0;font-size:min(1.45cqw,2.15cqh)}.hero-axis{font-size:8px}.hero-axis-top{top:7px}.hero-axis-bottom{bottom:7px}.hero-visual figcaption{font-size:7px;bottom:12px}.motion-control{font-size:8px;min-height:34px}.hero-baseline{font-size:8px}.hero-baseline>span{max-width:24ch;line-height:1.6}.hero-baseline a{max-width:23ch;text-align:right;line-height:1.6}}
@media(max-width:400px){.hero{padding-top:16px}.hero-topline{font-size:8px;gap:8px}.hero-composition{padding-top:18px;gap:18px}.hero-copy>p{font-size:14px;line-height:1.6;margin:16px 0}.hero-actions{gap:14px}.hero .button{font-size:11px;padding:13px 12px;gap:15px;min-height:44px}.hero-secondary{font-size:10px;gap:6px}.hero-baseline{font-size:7px;padding-top:12px}.hero-visual figcaption{max-width:23ch;line-height:1.5;bottom:6px}}
@media(max-width:900px) and (orientation:landscape) and (max-height:550px){.hero-composition{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px}.hero h1{font-size:12cqi}.hero-stage{aspect-ratio:1.15}.hero-stage .orbital{position:static;font-size:min(1.95cqw,2.15cqh)}.hero-actions{gap:10px}.hero-visual figcaption{display:none}}
@media(prefers-reduced-motion:reduce){.motion-control{display:none}}
@media(max-width:900px){.hero-baseline{display:none}}
@media(min-width:901px){.hero-stage{max-height:min(480px,calc(100svh - 370px))}}
/* Leave room for Safari's controls and never constrain the actual copy. */
@media(max-width:400px) and (max-height:700px){.hero-composition{padding-top:14px;padding-bottom:12px;gap:14px}.hero h1{font-size:12cqi}.hero-copy>p{margin:14px 0}.hero-stage{aspect-ratio:2.7}.hero{padding-bottom:12px}}
@media(max-width:900px){.system-status{display:none}}
@media(max-width:350px){.hero-actions{gap:10px}.hero-secondary{font-size:9px;letter-spacing:-.02em}.hero .button{font-size:10px;padding:12px 10px;gap:10px}.hero-copy>p{font-size:14px;line-height:1.55}.hero-stage{aspect-ratio:2.9}.hero-visual{padding-bottom:36px}.hero-visual figcaption{font-size:6px}}
@media(max-width:900px) and (orientation:landscape) and (max-height:550px){.header{height:64px}.header nav{top:64px}.hero{padding-top:12px;padding-bottom:12px}.hero-composition{padding-top:12px;padding-bottom:12px}.hero h1{font-size:min(10cqi,44px)}.hero-copy>p{font-size:14px;line-height:1.5;margin:12px 0}.hero .button{min-height:44px;font-size:11px;padding:12px;gap:12px}.hero-secondary{font-size:10px}.hero-stage{max-height:180px}}




/* Quiet technical framing; the ASCII form is the only hero artwork. */
.hero-stage{isolation:isolate}
.hero-stage::before{content:"";position:absolute;inset:24px 0;border:1px solid var(--line);background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:40px 40px;opacity:.22;z-index:-1;pointer-events:none}
.hero-stage::after{content:"";position:absolute;left:15%;right:15%;top:50%;height:1px;background:var(--muted);opacity:0;pointer-events:none}
.js .hero-stage::after{animation:system-scan 9s ease-in-out infinite}
@keyframes system-scan{0%,100%{transform:translateY(-28px);opacity:0}35%{opacity:.25}70%{transform:translateY(28px);opacity:.1}}
.hero-stage .orbital{position:relative;left:auto;z-index:1;font-size:min(1.95cqw,2.15cqh)}
.motion-paused .hero-stage::after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.hero-stage::after{animation:none!important;opacity:0}}
