:root { --white:#fff; }
* { box-sizing:border-box; }
html, body { margin:0; min-height:100%; background:#000; }
body { color:#fff; font-family:"DM Sans",system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
.skip-link { position:fixed; left:1rem; top:-4rem; z-index:100; background:#fff; color:#000; padding:.75rem 1rem; }
.skip-link:focus { top:1rem; }
.site-header { position:absolute; inset:0 0 auto 0; z-index:20; display:flex; align-items:center; justify-content:space-between; padding:1.35rem clamp(1.25rem,4vw,4rem); color:#fff; border-bottom:1px solid rgba(255,255,255,.16); background:linear-gradient(to bottom,rgba(0,0,0,.58),transparent); }
.wordmark { font-size:.95rem; font-weight:700; letter-spacing:.16em; text-decoration:none; white-space:nowrap; }
.wordmark span { font-weight:400; opacity:.72; }
.site-nav { display:flex; gap:2rem; align-items:center; }
.site-nav a { text-decoration:none; font-size:.88rem; opacity:.82; }
.site-nav a:hover,.site-nav a:focus-visible { opacity:1; }
.menu-toggle { display:none; }
.hero { position:relative; min-height:100svh; background:#000; overflow:hidden; color:#fff; padding-top:5.4rem; }
.hero-video-stage { position:relative; height:clamp(430px,67svh,760px); overflow:hidden; background:#000; isolation:isolate; }
.hero-video-backdrop,.hero-video-main { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.hero-video-backdrop { z-index:0; object-fit:cover; transform:scale(1.18); filter:blur(44px) brightness(.48) saturate(.85); opacity:.92; }
.hero-video-main { z-index:1; object-fit:contain; background:transparent; -webkit-mask-image:radial-gradient(ellipse 83% 78% at 50% 54%,#000 62%,rgba(0,0,0,.92) 72%,rgba(0,0,0,.45) 87%,transparent 100%); mask-image:radial-gradient(ellipse 83% 78% at 50% 54%,#000 62%,rgba(0,0,0,.92) 72%,rgba(0,0,0,.45) 87%,transparent 100%); }
.hero-shade { position:absolute; inset:0; z-index:2; background:linear-gradient(to bottom,rgba(0,0,0,.82) 0%,rgba(0,0,0,.15) 24%,transparent 46%),linear-gradient(to top,rgba(0,0,0,.94) 0%,rgba(0,0,0,.12) 30%,transparent 58%),linear-gradient(to right,rgba(0,0,0,.18),transparent 45%,rgba(0,0,0,.18)); pointer-events:none; }
.hero-title { position:absolute; z-index:3; top:clamp(1.2rem,3.4vh,2.5rem); left:50%; transform:translateX(-50%); margin:0; width:100%; padding:0 1.25rem; text-align:center; font-family:"Newsreader",Georgia,serif; font-size:clamp(3rem,7vw,7rem); font-weight:500; line-height:.9; letter-spacing:-.03em; text-shadow:0 3px 28px rgba(0,0,0,.76); }
.hero-copy { position:relative; z-index:4; width:min(760px,calc(100% - 2.5rem)); margin:clamp(-1.35rem,-1.8vh,-.7rem) 0 0 clamp(1.25rem,6vw,6rem); padding-bottom:clamp(3rem,7vh,5rem); }
.eyebrow { margin:0 0 1rem; text-transform:uppercase; letter-spacing:.18em; font-size:.74rem; font-weight:700; }
.hero-copy>p:not(.eyebrow) { max-width:720px; margin:1.4rem 0 2rem; font-size:clamp(1.35rem,3vw,2.8rem); line-height:1.35; color:rgba(255,255,255,.78); }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:58px; padding:0 2rem; border:2px solid rgba(255,255,255,.35); border-radius:999px; background:rgba(0,0,0,.28); backdrop-filter:blur(12px); color:rgba(255,255,255,.94); text-decoration:none; font-size:clamp(1rem,1.5vw,1.35rem); font-weight:700; transition:.2s ease; }
.button:hover,.button:focus-visible { transform:translateY(-1px); border-color:rgba(255,255,255,.65); background:rgba(255,255,255,.08); }
.sound-toggle { position:absolute; z-index:6; right:clamp(1rem,3vw,2.5rem); bottom:clamp(1rem,3vh,2rem); display:grid; place-items:center; width:44px; height:44px; padding:0; border:1px solid rgba(255,255,255,.34); border-radius:50%; background:rgba(0,0,0,.38); backdrop-filter:blur(12px); color:rgba(255,255,255,.92); cursor:pointer; }
.speaker-icon { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.speaker-body { fill:currentColor; stroke:none; }
.sound-toggle[aria-pressed="false"] .sound-wave { display:none; }
.sound-toggle[aria-pressed="true"] .mute-mark { display:none; }
.visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
@media (max-width:780px) {
  .site-header { align-items:flex-start; }
  .menu-toggle { display:block; border:1px solid rgba(255,255,255,.35); background:rgba(0,0,0,.25); color:#fff; border-radius:999px; padding:.55rem .8rem; }
  .site-nav { display:none; position:absolute; top:4.6rem; left:1rem; right:1rem; flex-direction:column; align-items:stretch; gap:0; padding:.75rem; border:1px solid rgba(255,255,255,.18); background:rgba(3,5,7,.96); backdrop-filter:blur(18px); }
  .site-nav.open { display:flex; }
  .site-nav a { padding:.95rem; border-bottom:1px solid rgba(255,255,255,.12); }
  .site-nav a:last-child { border-bottom:0; }
  .hero { padding-top:5rem; }
  .hero-video-stage { height:clamp(390px,57svh,570px); }
  .hero-title { top:1.5rem; font-size:clamp(2.7rem,14vw,4.6rem); }
  .hero-copy { margin:-.75rem 1.25rem 0; width:auto; padding-bottom:3rem; }
  .hero-copy>p:not(.eyebrow) { font-size:clamp(1.15rem,5vw,1.75rem); margin:1rem 0 1.5rem; }
  .button { min-height:52px; padding:0 1.5rem; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; } }
