:root{color-scheme:dark;--red:#943b3d;--paper:#f4f5f2;--ink:#101414;--muted:#b5bfbb;--gutter:clamp(22px,4vw,76px)}
*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;background:var(--ink);color:var(--paper);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit}
button:focus-visible,a:focus-visible{outline:3px solid white;outline-offset:5px}
.scene{height:440svh;position:relative}
.hero{position:sticky;top:0;height:100svh;min-height:420px;overflow:hidden;background:#141b1c;isolation:isolate}
.picture{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 48%}
#motion{opacity:0}
.hero[data-ready="true"] #motion{opacity:1}
.shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,12,12,.25),transparent 34%,rgba(5,12,12,.12) 60%,rgba(5,12,12,.78));pointer-events:none}
.masthead{position:absolute;top:0;inset-inline:0;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:28px var(--gutter);z-index:2}
.brand{color:white;text-decoration:none;font-weight:700;font-size:16px;letter-spacing:.1em;white-space:nowrap}
.brand span{color:#b95759}
.study-label,.eyebrow{font-size:10px;letter-spacing:.2em;line-height:1.6;font-weight:700}
.study-label{color:#e4e9e6;white-space:nowrap}
.study-label span{margin:0 8px;color:#a1aaa5}
.hero-copy{position:absolute;inset-inline-start:var(--gutter);bottom:clamp(92px,13vh,155px);max-width:700px;z-index:2}
.hero-copy .eyebrow{margin:0 0 18px}
h1{font-size:clamp(32px,4.4vw,70px);line-height:1.02;letter-spacing:-.035em;margin:0;font-weight:750}
h1 span{color:#b95759}
.support{font-size:clamp(16px,1.6vw,22px);margin:16px 0 0;line-height:1.4}
.hero-foot{position:absolute;bottom:28px;inset-inline:var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:2}
.hero-foot p,.stage{font-size:11px;letter-spacing:.04em;margin:0}
.stage{border:1px solid #ffffff50;border-radius:99px;padding:10px 16px}
.skip{position:absolute;top:90px;right:var(--gutter);background:#0a111142;border:1px solid #ffffff60;color:white;padding:11px 16px;border-radius:99px;cursor:pointer;z-index:3;font-size:12px;text-decoration:none}
.opening{position:absolute;inset:0;background:#000;display:grid;place-items:center;z-index:4;opacity:1;transition:opacity .25s ease}
.opening[hidden]{display:none}
.opening-inner{text-align:center;width:min(280px,75vw)}
.opening-brand{font-size:16px;font-weight:700;letter-spacing:.13em;margin:0 0 28px}
.opening-brand span{color:#b95759}
#load-label{font-size:11px;color:#b5bfbb;letter-spacing:.035em;line-height:1.5}
progress{appearance:none;width:100%;height:2px;border:none;background:#292b2a;margin-top:12px}
progress::-webkit-progress-bar{background:#292b2a}
progress::-webkit-progress-value{background:#a34749}
progress::-moz-progress-bar{background:#a34749}
.notes{padding:85px var(--gutter) 100px;display:grid;grid-template-columns:minmax(0,1fr) minmax(270px,.7fr);gap:clamp(40px,8vw,140px);max-width:1440px;margin:auto}
.notes .eyebrow{color:#a7b7af;margin:0 0 25px}
h2{font-size:clamp(32px,4vw,56px);font-weight:500;letter-spacing:-.04em;line-height:1.08;margin:0 0 30px}
.notes p:not(.eyebrow){color:#bec7c2;line-height:1.7;font-size:14px;max-width:56ch}
.test-card{border:1px solid #ffffff24;border-radius:18px;padding:28px;background:#ffffff03;align-self:start}
h3{margin:0 0 20px;font-size:16px;font-weight:600}
dl{margin:0}
dl div{padding:12px 0;display:flex;justify-content:space-between;gap:22px;border-top:1px solid #ffffff15;font-size:12px;line-height:1.4}
dt{color:#a7b7af}dd{margin:0;text-align:right}
.notes .test-note{font-size:11px!important;line-height:1.6!important}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.actions button{border:1px solid #ffffff40;color:white;background:transparent;border-radius:99px;padding:11px 15px;font-size:12px;cursor:pointer}
.failure{color:#ffb9b9!important}
@media(min-aspect-ratio:19/10){.picture{object-fit:contain}}
@media(max-aspect-ratio:3/2){.picture{object-fit:contain}}
@media(max-width:700px){
 .scene{height:400svh}.hero{min-height:440px}
 .picture{object-fit:contain;object-position:center 40%}
 .shade{background:linear-gradient(180deg,#1014143d,transparent 35%,#10141400 53%,#101414 78%)}
 .masthead{padding-top:23px;gap:12px}.brand{font-size:12px}.study-label{font-size:8px;letter-spacing:.1em}
 .study-label span{margin-inline:3px}.skip{top:68px;font-size:10px;padding:9px 12px}
 .hero-copy{bottom:112px;max-width:calc(100% - var(--gutter)*2)}
 .hero-copy .eyebrow{font-size:8px;letter-spacing:.13em;margin-bottom:13px}
 h1{font-size:clamp(31px,8.4vw,44px)}.support{font-size:16px;margin-top:12px}
 .hero-foot{bottom:26px}.hero-foot p{max-width:22ch;font-size:10px;line-height:1.6}.stage{font-size:10px;padding:9px 13px}
 .notes{grid-template-columns:1fr;padding-top:58px;gap:34px}.test-card{padding:23px}
}
@media(prefers-reduced-motion:reduce){.scene{height:100svh}.opening{display:none}.skip,#scroll-hint{display:none}}
