/* Fulldome Cinema — Direction A "Mission Control"
   Poppins (from the A New Blue poster) + JetBrains Mono telemetry labels. */
:root{
  --bg:#05070B; --panel:#0A0E15; --panel-2:#0E131C;
  --line:rgba(140,170,210,.16); --line-2:rgba(140,170,210,.24);
  --text:#E8EEF6; --dim:#B6C1D1; --mute:#8A97AB; --faint:#6F7C93;
  --accent:#5BE7FF; --accent-hi:#A9F3FF; --signal:#FF8A3D; --on-accent:#05070B;
  --f-sans:"Poppins",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --gut:40px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0; background:var(--bg); color:var(--text); font-family:var(--f-sans); font-weight:300; font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden}
img{display:block; max-width:100%}
a{color:var(--accent); text-decoration:none}
a:hover{color:var(--accent-hi)}
h1,h2,h3,p{margin:0}
:focus-visible{outline:2px solid var(--accent); outline-offset:3px}
.wrap{max-width:1360px; margin:0 auto; padding-inline:max(var(--gut), env(safe-area-inset-left,0px))}
@media (max-width:700px){:root{--gut:16px}}

/* type */
.mono{font-family:var(--f-mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:400}
.wide{font-weight:300; letter-spacing:.42em; text-transform:uppercase}
.cap{font-weight:700; letter-spacing:.06em; text-transform:uppercase; line-height:1.08}
.tag{color:var(--accent)}
.badge{display:inline-block; background:#fff; color:var(--bg); font-weight:600; font-size:12px; letter-spacing:.32em; padding:7px 14px 7px 16px; line-height:1.4}
.dot{display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--signal); flex:none}
.h2{font-size:clamp(32px,4.2vw,48px)}

/* buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; font-family:var(--f-mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; padding:17px 24px; border-radius:2px; border:1px solid transparent; cursor:pointer; min-height:48px; text-align:center}
.btn-accent{background:var(--accent); color:var(--on-accent)}
.btn-accent:hover{background:var(--accent-hi); color:var(--on-accent)}
.btn-line{border-color:rgba(232,238,246,.35); color:var(--text)}
.btn-line:hover{border-color:var(--text); color:var(--text)}
.btn-faint{border-color:rgba(232,238,246,.15); color:var(--mute)}
.btn-faint:hover{border-color:rgba(232,238,246,.4); color:var(--text)}

/* header */
.top{position:sticky; top:0; z-index:20; background:rgba(5,7,11,.9); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid var(--line)}
.top .wrap{display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:68px}
.logo{display:flex; align-items:center; gap:12px; color:var(--text); font-size:14px; letter-spacing:.3em; font-weight:700; white-space:nowrap}
.logo:hover{color:var(--text)}
.logo b{font-weight:300}
.nav{display:flex; align-items:center; gap:30px}
.nav a:not(.btn){color:var(--mute)}
.nav a:not(.btn):hover,.nav a[aria-current]{color:var(--text)}
.nav a span{color:var(--accent)}
.nav .btn span{color:inherit}
.nav .btn{padding:13px 18px; min-height:44px; white-space:nowrap}
.nav .btn .sm{display:none}
@media (max-width:560px){.nav .btn .lg{display:none}.nav .btn .sm{display:inline}}
@media (max-width:860px){.nav a:not(.btn){display:none}}
@media (max-width:420px){.logo{font-size:12px; letter-spacing:.2em}.logo svg{width:24px; height:24px}.nav .btn{padding:12px 12px; letter-spacing:.06em}}

/* hero */
.hero{position:relative; overflow:hidden; min-height:820px; border-bottom:1px solid var(--line); display:flex}
.hero-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.hero-shade{position:absolute; inset:0; background:linear-gradient(90deg,rgba(5,7,11,.92) 0%,rgba(5,7,11,.55) 42%,rgba(5,7,11,0) 72%),linear-gradient(0deg,var(--bg) 0%,rgba(5,7,11,0) 40%)}
.grid-bg{background-image:linear-gradient(rgba(140,170,210,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(140,170,210,.07) 1px,transparent 1px); background-size:80px 80px}
.hero-grid{position:absolute; inset:0}
.reticle{position:absolute; right:8%; top:70px; width:560px; height:560px; pointer-events:none}
.deco{position:absolute; pointer-events:none}
.hero .wrap{position:relative; width:100%; display:flex; flex-direction:column; justify-content:flex-end; padding-top:140px; padding-bottom:56px}
.hero h1{font-size:clamp(30px,5.1vw,78px); line-height:1.08; font-weight:700; letter-spacing:.11em; text-transform:uppercase}
.hero .sub{margin-top:22px; font-size:clamp(13px,1.7vw,24px)}
.hero .lede{margin-top:26px; max-width:34em; font-size:18px; line-height:1.65; color:var(--dim)}
.eyebrow-row{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:26px}
.ctas{display:flex; gap:12px; flex-wrap:wrap; margin-top:34px}
.stats{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:56px; border-top:1px solid var(--line-2)}
.stats>div{padding:18px 20px 0; border-left:1px solid var(--line-2)}
.stats>div:first-child{padding-left:0; border-left:0}
.stats dt{color:var(--mute); font-size:11px}
.stats dd{margin:6px 0 0; font-size:28px; font-weight:600; letter-spacing:.02em}
@media (max-width:1000px){.reticle{width:380px; height:380px; right:-60px; opacity:.6}}
@media (max-width:700px){
  .hero{min-height:0}
  .hero .wrap{padding-top:120px; padding-bottom:40px}
  .hero-shade{background:linear-gradient(0deg,var(--bg) 8%,rgba(5,7,11,.55) 60%,rgba(5,7,11,.25) 100%)}
  .reticle{width:300px; height:300px; top:20px; right:-80px}
  .deco-x,.deco-sq{display:none}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:18px}
  .stats>div:nth-child(3){padding-left:0; border-left:0}
  .stats dd{font-size:22px}
}

/* ticker */
.ticker{border-bottom:1px solid var(--line); background:var(--panel); overflow:hidden}
.ticker-track{display:flex; gap:36px; align-items:center; height:56px; white-space:nowrap; color:var(--mute); font-size:11px; width:max-content; animation:tick 60s linear infinite}
.ticker-track .sep{color:#3A4558}
.ticker-track .tag{color:var(--accent)}
.ticker:hover .ticker-track{animation-play-state:paused}
@keyframes tick{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker-track{animation:none}}

/* sections */
section{scroll-margin-top:72px}
.sec{padding:120px 0}
.sec-panel{background:var(--panel); border-block:1px solid var(--line)}
.sec-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; margin-bottom:48px}
.sec-head h2{margin-top:14px}
.sec-head p{max-width:28em; color:var(--mute)}
@media (max-width:700px){.sec{padding:80px 0}}

/* show index */
.idx-head,.idx-row{display:grid; grid-template-columns:120px 64px minmax(0,1fr) 120px 80px 230px 32px; gap:24px; align-items:center}
.idx-head{padding-bottom:14px; color:var(--faint); font-size:11px; border-bottom:1px solid var(--line-2)}
.idx-row{padding:22px 0; border-bottom:1px solid var(--line); color:var(--text); transition:background .25s}
.idx-row:hover{color:var(--text); background:linear-gradient(90deg,rgba(91,231,255,.07),rgba(91,231,255,0))}
.idx-row img{width:120px; height:178px; object-fit:cover; border-radius:2px; border:1px solid var(--line-2); box-shadow:0 18px 40px -20px rgba(0,0,0,.9)}
.idx-row .f{line-height:1.7}
.idx-row .nat{font-weight:500; color:var(--accent)}
.idx-row .n{color:var(--accent); font-size:14px}
.idx-row .t{display:block; font-size:22px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; line-height:1.2}
.idx-row .d{display:block; color:var(--mute); margin-top:6px; font-size:15px}
.idx-row .new{font-family:var(--f-mono); font-size:10px; letter-spacing:.12em; color:var(--bg); background:var(--signal); padding:4px 7px; vertical-align:middle; margin-left:8px; font-weight:500}
.idx-row .f{font-size:12px; color:var(--dim)}
.idx-row .arrow{font-size:22px; color:var(--accent); transition:transform .25s}
.idx-row:hover .arrow{transform:translateX(4px)}
@media (max-width:1100px){
  .idx-head{display:none}
  .idx-row{grid-template-columns:110px minmax(0,1fr); grid-template-areas:"img txt" "img meta"; gap:10px 22px; align-items:start}
  .idx-row img{grid-area:img; width:110px; height:163px}
  .idx-row .n,.idx-row .arrow{display:none}
  .idx-row .txt{grid-area:txt}
  .idx-row .meta{grid-area:meta; display:flex; gap:18px; flex-wrap:wrap; color:var(--mute); font-size:11px}
}
@media (min-width:1101px){.idx-row .meta{display:contents}}
@media (max-width:560px){
  .idx-row{grid-template-columns:88px minmax(0,1fr); gap:8px 16px}
  .idx-row img{width:88px; height:130px}
  .idx-row .d{font-size:14px}
  .idx-row .t{font-size:18px}
}

/* bento */
.bento{display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); grid-auto-rows:150px; gap:12px}
.tile{position:relative; overflow:hidden; border:1px solid rgba(140,170,210,.2); background:var(--panel)}
.tile>img{width:100%; height:100%; object-fit:cover; transition:transform .6s}
.tile:hover>img{transform:scale(1.03)}
.tile .fr{position:absolute; top:16px; left:16px; font-size:10px; color:var(--text)}
.tile-big{grid-column:span 7; grid-row:span 4}
.tile-big .cap-box{position:absolute; left:0; right:0; bottom:0; padding:28px; background:linear-gradient(0deg,rgba(5,7,11,.92),rgba(5,7,11,0))}
.tile-big .q{margin-top:10px; font-size:clamp(20px,2.4vw,32px); line-height:1.25; max-width:15em}
.tile-a{grid-column:span 5; grid-row:span 2}
.tile-b{grid-column:span 2; grid-row:span 2}
.tile-c{grid-column:span 3; grid-row:span 2; padding:22px; display:flex; flex-direction:column; justify-content:space-between}
.telemetry{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 10px}
.telemetry .k{color:var(--faint); font-size:10px}
.telemetry .v{font-size:19px; font-weight:400}
@media (max-width:900px){
  .bento{grid-auto-rows:120px}
  .tile-big{grid-column:1/-1; grid-row:span 3}
  .tile-a{grid-column:span 12}
  .tile-b{grid-column:span 5}
  .tile-c{grid-column:span 7}
}
@media (max-width:520px){.tile-b{display:none}.tile-c{grid-column:1/-1}}

/* steps */
.steps{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line-2); border:1px solid var(--line-2)}
.steps>div{background:var(--panel); padding:36px 32px 40px}
.steps .s{color:var(--signal); font-size:13px}
.steps h3{margin:48px 0 12px; font-size:18px}
.steps p{color:var(--mute)}
@media (max-width:860px){.steps{grid-template-columns:minmax(0,1fr)}.steps h3{margin-top:24px}}

/* educators */
.edu{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:center}
.porthole{position:relative; aspect-ratio:1/1; border-radius:50%; overflow:hidden; border:1px solid rgba(91,231,255,.4)}
.porthole img{width:100%; height:100%; object-fit:cover}
.porthole-wrap{position:relative}
.porthole-wrap svg{position:absolute; inset:-4%; width:108%; height:108%; pointer-events:none}
.list{border-top:1px solid var(--line-2); margin-top:32px}
.list>div{display:flex; justify-content:space-between; gap:16px; padding:18px 0; border-bottom:1px solid var(--line-2); align-items:center}
.list .l{font-size:17px; font-weight:400}
.list .r{color:var(--mute); font-size:11px; white-space:nowrap}
.list .r.hot{color:var(--signal)}
@media (max-width:860px){.edu{grid-template-columns:minmax(0,1fr); gap:40px}.porthole-wrap{max-width:420px}}

/* screener */
.req{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:64px}
.req h2{font-size:clamp(36px,4.6vw,54px)}
.req .intro p.mono{margin:0; font-size:12px}
.req .intro p:not(.mono){margin-top:22px; color:var(--dim); font-size:18px; max-width:26em}
.req .intro ul{list-style:none; padding:0; margin:36px 0 0; display:grid; gap:12px}
.req .intro li{display:flex; gap:12px; align-items:baseline; color:var(--dim)}
.req .intro li span{color:var(--accent)}
form.panel{background:var(--panel); border:1px solid var(--line-2); padding:36px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px}
.field{display:flex; flex-direction:column; gap:8px}
.field.full{grid-column:1/-1}
.field>span{color:var(--mute); font-size:11px}
.field input,.field select,.field textarea{background:var(--bg); border:1px solid rgba(140,170,210,.25); color:var(--text); padding:14px; font:400 15px/1.4 var(--f-sans); border-radius:2px; width:100%}
.field textarea{min-height:100px; resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--accent)}
fieldset{grid-column:1/-1; border:0; margin:0; padding:0}
fieldset legend{color:var(--mute); font-size:11px; margin-bottom:10px; padding:0}
.picks{display:flex; flex-wrap:wrap; gap:10px}
.pick{position:relative}
.pick input{position:absolute; opacity:0; inset:0; cursor:pointer}
.pick span{display:flex; align-items:center; gap:8px; border:1px solid rgba(140,170,210,.3); color:var(--dim); padding:12px 14px; font-size:11px; min-height:44px}
.pick span::before{content:""; width:10px; height:10px; border:1px solid currentColor}
.pick input:checked+span{border-color:var(--accent); color:var(--accent)}
.pick input:checked+span::before{background:var(--accent)}
.pick input:focus-visible+span{outline:2px solid var(--accent); outline-offset:2px}
form.panel .btn{grid-column:1/-1; font-size:13px; padding:20px}
.form-note{grid-column:1/-1; color:var(--mute); font-size:13px}
.form-ok{grid-column:1/-1; border:1px solid var(--accent); padding:16px; color:var(--text)}
@media (max-width:860px){.req{grid-template-columns:minmax(0,1fr); gap:40px}}
@media (max-width:560px){form.panel{grid-template-columns:minmax(0,1fr); padding:22px}}

/* footer */
.foot{border-top:1px solid var(--line); padding:48px 0 56px}
.foot .wrap{display:flex; justify-content:space-between; gap:32px; flex-wrap:wrap}
.foot p{max-width:36em; color:var(--mute); font-size:14px}
.foot .links{display:flex; gap:24px; flex-wrap:wrap; font-size:11px}
.foot .links a{color:var(--mute)}
.foot .links a:hover{color:var(--text)}
.foot .c{color:var(--faint); font-size:11px; margin-top:18px}

/* ---------- show page ---------- */
.crumbs{padding-top:40px; color:var(--faint); font-size:11px}
.crumbs a{color:var(--mute)}
.crumbs b{color:var(--text); font-weight:400}
.show-head{display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:48px; align-items:end; margin-top:40px}
.show-head h1{margin-top:22px; font-size:clamp(46px,8.6vw,128px); line-height:1.02; font-weight:700; letter-spacing:.32em; text-transform:uppercase}
.show-head h1.long{font-size:clamp(38px,6vw,88px); letter-spacing:.2em}
.show-head .subrow{display:flex; align-items:center; gap:18px; margin-top:22px; flex-wrap:wrap}
.show-head .subrow .wide{font-size:clamp(14px,2vw,26px)}
.show-head .actions{display:flex; flex-direction:column; gap:12px}
@media (max-width:960px){.show-head{grid-template-columns:minmax(0,1fr); gap:32px}.show-head .actions{flex-direction:row; flex-wrap:wrap}}
@media (max-width:560px){.show-head h1{letter-spacing:.2em}.show-head .actions .btn{flex:1 1 100%}}

.stage-h{display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; margin-top:48px}
.stage{position:relative; aspect-ratio:16/9; overflow:hidden; border:1px solid var(--line-2); margin-top:14px; background:#000}
.stage img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.stage::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at 50% 50%,rgba(5,7,11,0) 30%,rgba(5,7,11,.6) 100%); pointer-events:none}
.stage .play{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:2; width:104px; height:104px; border-radius:50%; border:1px solid var(--accent); background:rgba(5,7,11,.55); color:var(--accent); display:grid; place-items:center; cursor:pointer}
.stage .play:hover{background:rgba(91,231,255,.15)}
.stage .lbl{position:absolute; top:18px; z-index:2; font-size:10px; color:var(--text)}
.stage .lbl.l{left:20px}.stage .lbl.r{right:20px}
.stage .bar{position:absolute; left:20px; right:20px; bottom:18px; height:2px; background:rgba(232,238,246,.2); z-index:2}
.stage iframe{position:absolute; inset:0; width:100%; height:100%; border:0; z-index:3}
@media (max-width:700px){.stage{aspect-ratio:4/3}.stage .play{width:76px; height:76px}.stage .lbl.r{display:none}}

.syn{display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:72px; align-items:start}
.syn .q{font-size:clamp(22px,2.6vw,32px); line-height:1.3; margin:22px 0 26px}
.syn .body p{font-size:18px; line-height:1.7; color:var(--dim)}
.syn .body p+p{margin-top:18px}
.chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:32px}
.chip{border:1px solid rgba(140,170,210,.3); padding:9px 12px; font-size:10px; color:var(--dim)}
.chip.award{border-color:rgba(255,138,61,.6); color:var(--signal)}
.spec{border:1px solid var(--line-2); background:var(--panel)}
.spec-h{display:flex; justify-content:space-between; padding:16px 22px; border-bottom:1px solid var(--line-2); font-size:11px}
.spec-h span:last-child{color:var(--faint)}
.spec dl{margin:0}
.spec dl>div{display:grid; grid-template-columns:150px minmax(0,1fr); border-bottom:1px solid rgba(140,170,210,.14)}
.spec dl>div:last-child{border-bottom:0}
.spec dt{padding:16px 22px; font-size:11px; color:var(--mute)}
.spec dd{margin:0; padding:14px 22px; font-size:17px; font-weight:400; line-height:1.45}
@media (max-width:960px){.syn{grid-template-columns:minmax(0,1fr); gap:48px}}
@media (max-width:420px){.spec dl>div{grid-template-columns:120px minmax(0,1fr)}.spec dt,.spec dd{padding-inline:14px}}

.frames-h{display:flex; justify-content:space-between; align-items:baseline; gap:16px; flex-wrap:wrap; margin-bottom:24px}
.frames{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
.frames button{position:relative; padding:0; border:1px solid rgba(140,170,210,.2); background:var(--panel); aspect-ratio:4/3; overflow:hidden; cursor:zoom-in; color:var(--text)}
.frames button:first-child{grid-column:span 2; grid-row:span 2}
.frames button img{width:100%; height:100%; object-fit:cover; transition:transform .5s}
.frames button:hover img{transform:scale(1.04)}
.frames button:hover{border-color:var(--accent)}
.frames button::after{content:""; position:absolute; left:0; right:0; bottom:0; height:55%; background:linear-gradient(0deg,rgba(5,7,11,.85),rgba(5,7,11,0)); pointer-events:none}
.frames .fl{z-index:1; position:absolute; left:12px; bottom:12px; right:12px; font-size:10px; text-align:left; text-shadow:0 1px 6px rgba(0,0,0,.8)}
@media (max-width:760px){.frames{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (prefers-reduced-motion:reduce){.frames button img,.tile>img,.idx-row,.idx-row .arrow{transition:none}}

.edu3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line-2); border:1px solid var(--line-2)}
.edu3>div{background:var(--panel); padding:36px 32px; display:flex; flex-direction:column; gap:14px}
.edu3 h2{font-size:clamp(24px,2.4vw,30px); line-height:1.15}
.edu3 h3{font-size:18px}
.edu3 .st{color:var(--signal); font-size:11px}
.edu3 p{color:var(--mute)}
.edu3 a.mono{margin-top:auto; font-size:11px}
@media (max-width:860px){.edu3{grid-template-columns:minmax(0,1fr)}}

.more{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px}
.more a{display:flex; flex-direction:column; color:var(--text); border:1px solid rgba(140,170,210,.2); transition:border-color .25s}
.more a:hover{border-color:var(--accent); color:var(--text)}
.more img{width:100%; aspect-ratio:16/9; object-fit:cover}
.more span.row{padding:18px 20px; display:flex; justify-content:space-between; gap:12px; align-items:baseline}
.more .t{font-size:15px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; line-height:1.3}
.more .n{color:var(--mute); font-size:11px}
@media (max-width:860px){.more{grid-template-columns:minmax(0,1fr)}}

.cta-band{border-top:1px solid var(--line); padding:100px 0}
.cta-band .wrap{display:flex; justify-content:space-between; align-items:center; gap:32px; flex-wrap:wrap}
.cta-band h2{font-size:clamp(30px,4.2vw,48px); max-width:14em}

/* lightbox */
dialog.lb{padding:0; border:0; background:transparent; width:100vw; height:100vh; max-width:100vw; max-height:100vh; color:var(--text)}
dialog.lb::backdrop{background:rgba(3,4,8,.95)}
.lb-in{position:relative; width:100%; height:100%; display:grid; grid-template-rows:minmax(0,1fr) auto; padding:60px max(16px,4vw) 20px}
.lb-in figure{margin:0; display:grid; place-items:center; min-height:0}
.lb-in img{max-width:100%; max-height:calc(100vh - 160px); max-height:calc(100dvh - 160px); object-fit:contain; border:1px solid var(--line-2)}
.lb-bar{display:flex; justify-content:space-between; align-items:center; gap:16px; padding-top:16px}
.lb-cap{font-size:15px; font-weight:400}
.lb-cap .mono{display:block; color:var(--accent); font-size:11px; margin-bottom:4px}
.lb-nav{display:flex; gap:8px}
.lb button{font-family:var(--f-mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--text); background:var(--panel); border:1px solid var(--line-2); padding:12px 16px; min-height:44px; min-width:44px; cursor:pointer; border-radius:2px}
.lb button:hover{border-color:var(--accent); color:var(--accent)}
.lb .x{position:absolute; top:12px; right:max(16px,4vw)}

/* educator guide cover */
.gcover{display:block; width:120px; margin-bottom:6px; border:1px solid var(--line-2); transition:border-color .25s, transform .25s}
.gcover:hover{border-color:var(--accent); transform:translateY(-2px)}
.gcover img{width:100%; height:auto}
.list a.l:hover{color:var(--accent)!important}

/* trailer modes */
.modes{display:inline-flex; border:1px solid var(--line-2); border-radius:2px; overflow:hidden}
.modes button{font:inherit; letter-spacing:inherit; text-transform:inherit; font-size:11px; color:var(--mute); background:transparent; border:0; padding:12px 16px; min-height:44px; cursor:pointer}
.modes button+button{border-left:1px solid var(--line-2)}
.modes button[aria-pressed="true"]{background:var(--accent); color:var(--on-accent)}
.modes button:not([aria-pressed="true"]):hover{color:var(--text)}
.modes-note{font-size:11px; color:var(--mute)}
.stage img{transition:opacity .4s, filter .4s}
.stage .dome-ring{position:absolute; top:0; bottom:0; left:50%; height:100%; width:auto; aspect-ratio:1/1; transform:translateX(-50%); z-index:4; pointer-events:none; opacity:0; transition:opacity .4s}
.stage.is-dome .dome-ring{opacity:1}
.stage.is-dome img{opacity:.22; filter:blur(3px)}
.stage.playing img,.stage.playing .play,.stage.playing .bar{display:none}
.stage.playing::after{display:none}
.stage.playing .lbl{display:none}
@media (prefers-reduced-motion:reduce){.stage img,.stage .dome-ring{transition:none}}

/* licensing heading row */
.lic-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; margin:14px 0 56px}
.lic-head h2{max-width:16em}

/* native-format callout on show pages */
.native{display:inline-flex; flex-wrap:wrap; margin:22px 0 0; border:1px solid var(--line-2); font-size:11px}
.native b{font-weight:500; background:rgba(91,231,255,.12); color:var(--accent); padding:9px 12px}
.native span{color:var(--dim); padding:9px 12px; border-left:1px solid var(--line-2)}

/* trailer playback: black bars, no overlay */
.stage iframe{background:#000}
.stage.playing .dome-ring{display:none}
@media (max-width:700px){.hero h1 br{display:none}}

/* ---------- nav links + mobile menu ---------- */
.nav-links{display:flex; align-items:center; gap:26px}
.menu-btn{display:none; font:inherit; letter-spacing:inherit; text-transform:inherit; font-size:12px; color:var(--text); background:transparent; border:1px solid rgba(232,238,246,.3); border-radius:2px; padding:12px 14px; min-height:44px; cursor:pointer}
.menu-btn:hover{border-color:var(--text)}
@media (max-width:1180px){
  .nav-links{display:none}
  .menu-btn{display:inline-flex; align-items:center}
  .nav{gap:10px}
  .top.open .nav-links{display:flex; flex-direction:column; align-items:stretch; gap:0; position:absolute; left:0; right:0; top:100%; background:rgba(5,7,11,.97); border-bottom:1px solid var(--line); padding:8px var(--gut) 16px}
  .top.open .nav-links a{display:block; padding:16px 0; border-bottom:1px solid var(--line); font-size:13px}
}
@media (max-width:860px){.nav a:not(.btn){display:revert}}
@media (max-width:420px){.menu-btn{padding:12px 10px}}

/* ---------- home teasers ---------- */
.ip-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px}
.ip-card{position:relative; display:flex; flex-direction:column; gap:14px; color:var(--text)}
.ip-card:hover{color:var(--text)}
.ip-card img{width:100%; aspect-ratio:2/3; object-fit:cover; border:1px solid var(--line-2); transition:transform .4s, border-color .25s}
.ip-card:hover img{transform:translateY(-4px); border-color:var(--accent)}
.ip-card .t{font-weight:700; letter-spacing:.08em; text-transform:uppercase; font-size:15px; line-height:1.3}
.ip-tag{position:absolute; top:12px; left:12px; background:rgba(5,7,11,.8); border:1px solid rgba(91,231,255,.5); color:var(--accent); padding:6px 9px; font-size:10px}
@media (max-width:860px){.ip-grid{grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px}}
.cal-teaser{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:64px; align-items:center}
.cal-teaser-art{display:block; border:1px solid var(--line-2); transition:border-color .25s}
.cal-teaser-art:hover{border-color:var(--accent)}
.cal-teaser-art img{width:100%; height:auto}
@media (max-width:860px){.cal-teaser{grid-template-columns:minmax(0,1fr); gap:36px}}

/* ---------- in production page ---------- */
.ip-hero{padding:48px 0 72px; border-bottom:1px solid var(--line); background-size:60px 60px}
.ip-h1{margin-top:20px; font-size:clamp(44px,8vw,120px); line-height:1.02; font-weight:700; letter-spacing:.2em; text-transform:uppercase}
.ip-tagline{margin-top:20px; font-size:clamp(12px,1.6vw,20px)}
.ip-list{padding-top:72px; padding-bottom:40px; display:grid; gap:96px}
.ip-row{scroll-margin-top:90px}
.ip-banner{position:relative; aspect-ratio:3/1; overflow:hidden; border:1px solid var(--line-2); border-left:3px solid var(--signal)}
.ip-banner img{width:100%; height:100%; object-fit:cover}
.ip-banner::after{content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(5,7,11,.75),rgba(5,7,11,0) 45%)}
.ip-n{position:absolute; left:28px; top:50%; transform:translateY(-50%); z-index:1; font-size:clamp(40px,7vw,96px); letter-spacing:0; color:transparent; -webkit-text-stroke:1.5px var(--signal); font-weight:500}
.ip-flag{position:absolute; right:18px; top:16px; z-index:1; font-size:10px; color:var(--text); background:rgba(5,7,11,.6); padding:6px 9px; border:1px solid var(--line-2)}
.ip-body{display:grid; grid-template-columns:200px minmax(0,1fr); gap:40px; align-items:end; margin-top:-80px; position:relative; z-index:2; padding-left:40px}
.ip-poster{width:200px; height:auto; aspect-ratio:2/3; object-fit:cover; border:1px solid var(--line-2); box-shadow:0 30px 60px -20px rgba(0,0,0,.9)}
.ip-title{margin-top:12px; font-size:clamp(26px,3.6vw,48px); letter-spacing:.1em}
.ip-sub{margin-top:12px; font-size:clamp(12px,1.4vw,17px); color:var(--text)}
@media (max-width:760px){
  .ip-banner{aspect-ratio:2/1}
  .ip-n{left:16px}
  .ip-body{grid-template-columns:110px minmax(0,1fr); gap:20px; margin-top:-50px; padding-left:12px; align-items:end}
  .ip-poster{width:110px}
  .ip-list{gap:72px}
}

/* ---------- calendar page ---------- */
.cal-intro{padding:48px 0 40px}
.cal-intro-row{display:flex; justify-content:space-between; align-items:flex-end; gap:32px; flex-wrap:wrap}
.cal-h1{margin-top:20px; font-size:clamp(40px,7vw,104px); line-height:1.02; font-weight:700; letter-spacing:.14em; text-transform:uppercase}
.cal-intro .sub{margin-top:18px; font-size:clamp(12px,1.5vw,19px)}
.cal-lede{max-width:28em; color:var(--dim); font-size:17px}
.cal{--cal-accent:#5BE7FF; padding-bottom:96px}
.cal-bar{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 0; border-top:1px solid var(--line-2); border-bottom:1px solid var(--line-2)}
.cal-bar-r{display:flex; gap:10px; align-items:center}
.cal-where{font-size:13px; color:var(--text); text-align:center}
.cal-where span:last-child{color:var(--cal-accent)}
.cal-nav{width:52px; height:48px; font-size:20px; color:var(--text); background:var(--panel); border:1px solid var(--line-2); border-radius:2px; cursor:pointer}
.cal-nav:hover:not(:disabled){border-color:var(--cal-accent); color:var(--cal-accent)}
.cal-nav:disabled{opacity:.3; cursor:default}
.cal-today{font-size:11px; color:var(--cal-accent); background:transparent; border:1px solid var(--line-2); padding:0 14px; height:48px; cursor:pointer; border-radius:2px}
.cal-stage{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px; margin-top:32px; align-items:start}
.cal-art{margin:0; position:sticky; top:96px; border:1px solid var(--line-2); background:var(--panel); touch-action:pan-y}
.cal-art img{width:100%; height:auto; aspect-ratio:1/1; transition:opacity .35s}
.cal-art.swap img{opacity:.35}
.cal-side .tag{color:var(--cal-accent)}
.cal-month{margin-top:12px; font-size:clamp(36px,4.6vw,64px); font-weight:700; letter-spacing:.08em; text-transform:uppercase; line-height:1; color:var(--cal-accent)}
.cal-month span{color:var(--text); font-weight:300}
.cal-film{margin-top:16px; display:flex; flex-wrap:wrap; align-items:center; gap:10px 12px; font-size:16px; color:var(--dim)}
.cal-film a{color:var(--text); font-weight:600; letter-spacing:.08em; text-transform:uppercase; font-size:14px}
.cal-film a:hover{color:var(--cal-accent)}
.cal-dash{width:22px; height:1px; background:var(--cal-accent)}
.cal-film em{font-style:normal}
.cal-grid{margin-top:26px; border:1px solid var(--line-2)}
.cal-row{display:grid; grid-template-columns:repeat(7,minmax(0,1fr))}
.cal-dow span{padding:10px 8px; font-size:10px; color:var(--mute); border-bottom:1px solid var(--line-2); text-align:left}
.cal-cell{min-height:74px; padding:7px 8px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); display:flex; flex-direction:column; gap:3px; position:relative}
.cal-row .cal-cell:nth-child(7){border-right:0}
.cal-row:last-child .cal-cell{border-bottom:0}
.cal-cell.we{background:rgba(140,170,210,.04)}
.cal-cell.empty{background:transparent}
.cal-cell b{font-weight:500; font-size:14px}
.cal-cell em{font-style:normal; font-size:10px; line-height:1.25; color:var(--dim)}
.cal-cell.hol b{color:var(--cal-accent)}
.cal-cell.hol::before{content:""; position:absolute; left:8px; top:27px; width:16px; height:1px; background:var(--cal-accent)}
.cal-cell.hol em{margin-top:6px}
.cal-cell i{font-style:normal; font-size:9px; color:#05070B; background:var(--cal-accent); align-self:flex-start; padding:2px 5px; margin-top:auto}
.cal-cell.today{outline:2px solid var(--cal-accent); outline-offset:-2px; background:rgba(255,255,255,.04)}
.cal-cell.today::after{content:"TODAY"; position:absolute; right:6px; top:7px; font-family:var(--f-mono); font-size:9px; color:var(--cal-accent)}
.cal-notes{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:28px; margin-top:28px}
.cal-nh{font-size:11px; color:var(--cal-accent); margin-bottom:12px}
.cal-notes ul{list-style:none; margin:0; padding:0; display:grid; gap:12px}
.cal-notes li{display:grid; grid-template-columns:62px minmax(0,1fr); gap:10px; font-size:15px; color:var(--dim); line-height:1.45}
.cal-notes li .mono{color:var(--text); font-size:11px; padding-top:3px}
.cal-none{color:var(--mute); font-size:15px}
.cal-filmcard{display:flex; gap:14px; align-items:center; color:var(--text); border:1px solid var(--line-2); padding:10px; transition:border-color .25s}
.cal-filmcard:hover{border-color:var(--cal-accent); color:var(--text)}
.cal-filmcard img{width:52px; height:77px; object-fit:cover}
.cal-filmcard b{display:block; font-weight:700; letter-spacing:.08em; text-transform:uppercase; font-size:13px; line-height:1.3}
.cal-filmcard .mono{font-size:10px; color:var(--cal-accent)}
.cal-link{display:inline-block; margin-top:12px; font-size:11px; color:var(--cal-accent)}
.cal-dl{display:flex; flex-wrap:wrap; gap:8px}
.cal-dl a{font-size:11px; color:var(--text); border:1px solid var(--line-2); padding:12px 12px; min-height:44px; display:inline-flex; align-items:center}
.cal-dl a:hover{border-color:var(--cal-accent); color:var(--cal-accent)}
.cal-films{list-style:none; padding:0; margin:28px 0 0; border-top:1px solid var(--line-2)}
.cal-films li{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:14px 0; border-bottom:1px solid var(--line-2)}
.cal-films a{color:var(--text); font-weight:600; letter-spacing:.08em; text-transform:uppercase; font-size:14px}
.cal-films a:hover{color:var(--accent)}
.cal-films .mono{font-size:11px; color:var(--mute)}
.cal-strip{display:flex; gap:10px; overflow-x:auto; margin-top:36px; padding:4px 2px 12px; scrollbar-width:thin; scrollbar-color:var(--line-2) transparent}
.cal-th{flex:0 0 92px; display:flex; flex-direction:column; gap:6px; padding:0; background:transparent; border:0; color:var(--mute); cursor:pointer}
.cal-th img{width:92px; height:92px; object-fit:cover; border:1px solid var(--line-2); opacity:.6; transition:opacity .2s, border-color .2s}
.cal-th span{font-size:10px; text-align:left}
.cal-th:hover img{opacity:1}
.cal-th.on img{opacity:1; border-color:var(--cal-accent); outline:1px solid var(--cal-accent)}
.cal-th.on span{color:var(--cal-accent)}
@media (max-width:1000px){
  .cal-stage{grid-template-columns:minmax(0,1fr); gap:28px}
  .cal-art{position:relative; top:0; max-width:620px}
}
@media (max-width:640px){
  .cal-cell{min-height:52px; padding:5px}
  .cal-cell em{display:none}
  .cal-cell.hol::before{left:5px; top:23px; width:12px}
  .cal-cell i{font-size:0; width:6px; height:6px; padding:0; border-radius:50%}
  .cal-cell.today::after{display:none}
  .cal-dow span{padding:8px 5px; font-size:9px}
  .cal-notes{grid-template-columns:minmax(0,1fr)}
  .cal-where span:last-child{display:none}
  .cal-today{padding:0 10px}
}
@media (prefers-reduced-motion:reduce){.cal-art img,.cal-th img,.ip-card img{transition:none}}
@media (max-width:760px){
  .ip-h1{font-size:clamp(34px,10vw,60px); letter-spacing:.1em}
  .ip-body{align-items:start}
  .ip-body > div{padding-top:62px}
  .ip-title{font-size:24px}
}
.ip-card img{height:auto}
.top.open .nav-links{background:#05070B}

/* catalog: posters +50%, type rebalanced */
.idx-head,.idx-row{grid-template-columns:180px 72px minmax(0,1fr) 140px 90px 270px 40px; gap:28px}
.idx-row{padding:28px 0}
.idx-row img{width:180px; height:267px}
.idx-row .n{font-size:18px}
.idx-row .t{font-size:30px; letter-spacing:.07em}
.idx-row .new{font-size:11px; padding:5px 8px; margin-left:10px}
.idx-row .d{font-size:18px; margin-top:10px; line-height:1.55; max-width:30em}
.idx-row .meta .mono{font-size:14px}
.idx-row .f{font-size:13px; line-height:1.8}
.idx-row .arrow{font-size:30px}
.idx-head{font-size:12px}
@media (max-width:1100px){
  .idx-row{grid-template-columns:165px minmax(0,1fr); gap:12px 28px}
  .idx-row img{width:165px; height:245px}
  .idx-row .t{font-size:26px}
  .idx-row .meta{gap:10px 20px; font-size:13px; margin-top:6px}
}
@media (max-width:560px){
  .idx-row{grid-template-columns:132px minmax(0,1fr); gap:10px 18px; padding:22px 0}
  .idx-row img{width:132px; height:196px}
  .idx-row .t{font-size:20px}
  .idx-row .d{font-size:15px}
  .idx-row .meta .mono{font-size:12px}
  .idx-row .f{font-size:11px}
}

/* studio links */
.studio-line{display:flex; justify-content:space-between; align-items:center; gap:24px 40px; flex-wrap:wrap; margin-top:40px; padding-top:32px; border-top:1px solid var(--line-2)}
.studio-line p{max-width:46em; color:var(--dim); font-size:17px}
.studio-line .tag{display:block; font-size:11px; margin-bottom:8px}
.foot-studio{max-width:40em}
.foot-k{font-size:10px; color:var(--faint)}
.foot-name{margin-top:6px!important; font-size:18px; letter-spacing:.3em; font-weight:700; color:var(--text)!important}
.foot-name b{font-weight:300}
.foot-studio p:not(.mono){margin-top:12px}
.foot-btn{margin-top:22px}
.foot .links{display:grid; grid-template-columns:repeat(2,auto); gap:16px 40px; align-content:start; padding-top:30px}
@media (max-width:700px){.foot .links{grid-template-columns:minmax(0,1fr); padding-top:8px}}