/* ============ HOMEFIELD — immersive scrollytelling ============ */
@font-face{font-family:"APD";src:url(../assets/fonts/All-ProDisplayC-Bold.ttf) format("truetype");font-weight:700;font-display:block}
@font-face{font-family:"APS";src:url(../assets/fonts/All-ProSans-Light.ttf) format("truetype");font-weight:300}
@font-face{font-family:"APS";src:url(../assets/fonts/All-ProSans-Regular.ttf) format("truetype");font-weight:400}
@font-face{font-family:"APS";src:url(../assets/fonts/All-ProSans-Medium.ttf) format("truetype");font-weight:500}
@font-face{font-family:"APS";src:url(../assets/fonts/All-ProSans-Bold.ttf) format("truetype");font-weight:700}
@font-face{font-family:"APX";src:url(../assets/fonts/All-ProStats.ttf) format("truetype")}

:root{
  --blue:#1d3793;--navy:#1d3767;--impact:#3d6bff;--red:#d63224;--orange:#dc5b14;--yellow:#eeb800;
  --green:#206726;--purple:#4c2085;--ink:#1c1c1b;--night:#08090b;--stone:#d0cdc7;--cream:#f0eae7;--plum:#3e3340;
  --accent:#d63224;--team1:#E31837;--team2:#FFB81C;
  --pad:clamp(16px,3.2vw,48px);
  --hud:64px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--night)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{background:var(--night);color:var(--cream);font-family:"APS",system-ui,sans-serif;font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.locked{overflow:hidden;height:100vh}
img,video{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--accent);color:#fff}

.disp{font-family:"APD",Impact,sans-serif;font-weight:700;text-transform:uppercase;line-height:.84;letter-spacing:-.005em}
.stat{font-family:"APX","APD",sans-serif}
.eyebrow{font-family:"APS";font-weight:700;font-size:12px;letter-spacing:.28em;text-transform:uppercase}
.mono{font-family:"APX";letter-spacing:.06em}

/* ---------- fixed layers ---------- */
#gl{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;pointer-events:none;transition:opacity .6s}
.vignette{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(120% 90% at 50% 50%,transparent 55%,rgba(0,0,0,.65))}
.grain{position:fixed;inset:-50%;z-index:60;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");animation:grain 1s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}}
.flash{position:fixed;inset:0;z-index:1;background:#fff;opacity:0;pointer-events:none;mix-blend-mode:normal}
main{position:relative;z-index:2}

/* ---------- loader ---------- */
#loader{position:fixed;inset:0;z-index:100;background:var(--night);display:grid;place-items:center;align-content:center;gap:28px;text-align:center}
.ld-mark{width:min(560px,78vw);color:var(--cream)}
.ld-mark .hf-logo{width:100%}
.ld-num{font-size:clamp(90px,16vw,220px);color:var(--cream);display:block}
.ld-bar{width:min(560px,78vw);height:2px;background:rgba(240,234,231,.15);position:relative;overflow:hidden}
.ld-bar i{position:absolute;inset:0;background:var(--cream);transform:scaleX(0);transform-origin:left}
.ld-yards{display:flex;justify-content:space-between;width:min(560px,78vw);font-family:"APX";font-size:12px;opacity:.5}
.ld-actions{display:flex;flex-direction:column;align-items:center;gap:14px;opacity:0;pointer-events:none;transition:opacity .6s}
.ld-actions.on{opacity:1;pointer-events:auto}
.ld-enter{font-family:"APD";font-size:clamp(28px,4vw,46px);text-transform:uppercase;padding:16px 34px 12px;background:var(--cream);color:var(--night);position:relative;overflow:hidden}
.ld-enter::after{content:"";position:absolute;inset:0;background:var(--red);transform:scaleX(0);transform-origin:right;transition:transform .45s cubic-bezier(.7,0,.2,1);mix-blend-mode:multiply}
.ld-enter:hover::after{transform:scaleX(1);transform-origin:left}
.ld-mute{font-size:12px;letter-spacing:.24em;text-transform:uppercase;opacity:.55}
.ld-mute:hover{opacity:1}

/* ---------- HUD ---------- */
.hud{position:fixed;top:0;left:0;right:0;height:var(--hud);z-index:50;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad);mix-blend-mode:difference;color:#fff;pointer-events:none}
.hud>*{pointer-events:auto}
.hud-brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}
.hud-brand img{height:34px;width:auto;filter:grayscale(1) brightness(3)}
.hud-brand svg{height:16px;width:auto}
.hud-chapter{display:flex;gap:14px;align-items:baseline;font-weight:700;font-size:12px;letter-spacing:.26em;text-transform:uppercase}
.hud-chapter #hudNum{font-family:"APX";font-size:14px}
.hud-right{display:flex;align-items:center;gap:14px}
.pass-chip{display:flex;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.7);padding:7px 12px 6px;border-radius:40px;font-size:11px;letter-spacing:.18em;font-weight:700;text-transform:uppercase}
.pass-chip i{width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 0 0 #fff;animation:ping 2s infinite}
.pass-chip b{opacity:.6;font-weight:500}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(255,255,255,.7)}100%{box-shadow:0 0 0 10px rgba(255,255,255,0)}}
.snd{display:flex;gap:3px;align-items:flex-end;height:18px;width:26px}
.snd span{flex:1;background:#fff;height:30%;transition:height .2s}
.snd.on span{animation:eq .9s ease-in-out infinite}
.snd.on span:nth-child(2){animation-delay:-.3s}.snd.on span:nth-child(3){animation-delay:-.6s}.snd.on span:nth-child(4){animation-delay:-.15s}
@keyframes eq{0%,100%{height:25%}50%{height:100%}}

/* ---------- yard-line nav ---------- */
.yard{position:fixed;right:calc(var(--pad) - 6px);top:50%;transform:translateY(-50%);z-index:45;height:min(64vh,560px);width:44px;mix-blend-mode:difference;color:#fff}
.yard .rail{position:absolute;right:0;top:0;bottom:0;width:1px;background:rgba(255,255,255,.35)}
.yard .tick{position:absolute;right:0;height:1px;width:10px;background:rgba(255,255,255,.55)}
.yard .tick.major{width:18px}
.yard .tick em{position:absolute;right:24px;top:-6px;font-family:"APX";font-size:11px;font-style:normal;opacity:.75}
.yard .stop{position:absolute;right:-6px;width:13px;height:13px;transform:translateY(-6px);cursor:pointer}
.yard .stop::before{content:"";position:absolute;inset:4px;border-radius:50%;background:#fff;opacity:.5;transition:.3s}
.yard .stop:hover::before,.yard .stop.on::before{opacity:1;inset:2px}
.yard .stop span{position:absolute;right:26px;top:-1px;white-space:nowrap;font-size:10px;letter-spacing:.22em;font-weight:700;opacity:0;transform:translateX(8px);transition:.3s;pointer-events:none}
.yard .stop:hover span,.yard .stop.on span{opacity:1;transform:none}
.yard .ball{position:absolute;right:-7px;width:15px;height:9px;border-radius:50%;background:#fff;transform:translateY(-4px)}

/* ---------- generic ---------- */
.sec{position:relative}
.stage{position:sticky;top:0;height:100vh;width:100%;overflow:hidden}
.center{display:grid;place-items:center;text-align:center}
.lockup{position:absolute;left:var(--pad);bottom:var(--pad);display:flex;gap:14px;align-items:baseline}
.chap-tag{position:absolute;left:var(--pad);top:calc(var(--hud) + 18px);display:flex;gap:12px;align-items:center;font-size:11px;letter-spacing:.28em;font-weight:700;text-transform:uppercase}
.chap-tag b{font-family:"APX";font-size:13px;padding:3px 7px 1px;border:1px solid currentColor}

/* kinetic words — strobing highlight box reveal */
.k .w{position:relative;display:inline-block;white-space:nowrap}
.k .w .bx{position:absolute;left:-.04em;right:-.04em;top:.02em;bottom:.06em;background:var(--accent);transform:scaleX(0);transform-origin:left;z-index:0}
.k .w .t{position:relative;z-index:1;opacity:0;display:inline-block}
.k.lines .w{display:block}

/* duotone media */
.duo{position:relative;overflow:hidden;background:var(--blue)}
.duo>img,.duo>video{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.2) brightness(.95);mix-blend-mode:luminosity;opacity:.9}
.duo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(8,9,11,.55));pointer-events:none}
.duo.red{background:var(--red)}.duo.orange{background:var(--orange)}.duo.green{background:var(--green)}.duo.yellow{background:var(--yellow)}.duo.purple{background:var(--purple)}.duo.ink{background:#222}
.duo.raw>img,.duo.raw>video{filter:none;mix-blend-mode:normal;opacity:1}
.tag{position:absolute;left:10px;bottom:9px;z-index:2;font-size:10px;letter-spacing:.24em;font-weight:700;text-transform:uppercase;color:#fff}
.tag::before{content:"● ";color:var(--accent)}

/* =========== 01 OPENING =========== */
#s-open{height:520vh}
#s-open .stage{perspective:1100px}
.frags{position:absolute;inset:0;transform-style:preserve-3d}
.frag{position:absolute;left:50%;top:50%;transform-style:preserve-3d;will-change:transform,opacity}
.frag .duo{width:100%;height:100%}
.open-copy{position:absolute;inset:0;display:grid;place-items:center;z-index:5;pointer-events:none;padding:0 var(--pad)}
.open-copy .k{font-size:clamp(54px,10.6vw,190px);text-align:center;max-width:15ch}
.open-copy .k .w{margin:0 .08em}
.open-copy .k2{position:absolute;inset:0;display:grid;place-items:center}
.open-cue{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;font-size:10px;letter-spacing:.3em;font-weight:700;opacity:.75}
.open-cue i{width:1px;height:46px;background:linear-gradient(var(--cream),transparent);animation:cue 1.6s infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.cats{position:absolute;inset:0;pointer-events:none}
.cats span{position:absolute;font-family:"APD";font-size:clamp(14px,1.4vw,22px);letter-spacing:.06em;opacity:0}

/* =========== 02 REVEAL =========== */
#s-reveal{height:560vh}
#s-reveal .stage{background:transparent}
.rv-bg{position:absolute;inset:0;background:var(--blue);clip-path:circle(0% at 50% 50%)}
.beams{position:absolute;inset:-20%;background:conic-gradient(from 180deg at 50% 110%,transparent 0 40deg,rgba(255,255,255,.10) 44deg,transparent 50deg 70deg,rgba(255,255,255,.08) 74deg,transparent 80deg 100deg,rgba(255,255,255,.09) 104deg,transparent 110deg 130deg,rgba(255,255,255,.1) 134deg,transparent 140deg);opacity:0;mix-blend-mode:screen}
.rv-welcome{position:absolute;top:22vh;width:100%;text-align:center;font-size:clamp(24px,3vw,44px);letter-spacing:.32em;opacity:0}
.hf-logo{width:min(1500px,90vw);overflow:visible}
.hf-logo .word path{fill:currentColor}
.hf-logo .cls-1{fill:#d63224}.hf-logo .cls-2{fill:#fff}.hf-logo .cls-3{fill:#1d3793}.hf-logo .cls-4{fill:#1d3767}
.hf-logo .word .cls-3{fill:currentColor}
.rv-logo{position:absolute;inset:0;display:grid;place-items:center;color:var(--cream)}
.rv-logo .hf-logo path{transform-box:fill-box;transform-origin:50% 50%}
.rv-sub{position:absolute;bottom:18vh;width:100%;text-align:center;font-size:clamp(26px,3.6vw,64px)}
.rv-list{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.rv-list .item{position:absolute;font-size:clamp(80px,17vw,320px);opacity:0;color:var(--cream)}
.rv-list .item small{display:block;font-family:"APS";font-weight:700;font-size:12px;letter-spacing:.3em;margin-bottom:1.2em}
.rv-insight{position:absolute;left:var(--pad);top:calc(var(--hud) + 60px);max-width:420px;font-size:15px;line-height:1.5;opacity:0}
.rv-insight b{display:block;font-size:11px;letter-spacing:.28em;margin-bottom:10px}
.rv-final{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:0 var(--pad)}
.rv-final .k{font-size:clamp(50px,8.4vw,150px);max-width:14ch}
.rv-tagline{position:absolute;bottom:12vh;left:0;right:0;text-align:center;font-size:clamp(14px,1.3vw,20px);letter-spacing:.24em;font-weight:700;text-transform:uppercase;opacity:0}

/* =========== 03 WORLD =========== */
#s-world{height:520vh}
.world-title{position:absolute;left:var(--pad);bottom:calc(var(--pad) + 10px);font-size:clamp(60px,10vw,170px);max-width:9ch}
.world-copy{position:absolute;right:calc(var(--pad) + 70px);bottom:calc(var(--pad) + 18px);max-width:360px;font-size:15px;line-height:1.55;opacity:0}
.wlabels{position:absolute;inset:0;pointer-events:none}
.wlabel{position:absolute;left:0;top:0;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center;gap:6px;opacity:0;will-change:transform}
.wlabel .verb{font-size:11px;letter-spacing:.3em;font-weight:700;padding:4px 8px 3px;background:var(--cream);color:var(--night)}
.wlabel .name{font-family:"APD";font-size:clamp(26px,3.2vw,52px);white-space:nowrap;text-shadow:0 4px 30px rgba(0,0,0,.6)}
.wlabel .pin{width:1px;height:46px;background:linear-gradient(var(--cream),transparent)}
.wlabel.small .name{font-size:clamp(14px,1.4vw,20px);letter-spacing:.04em}
.wlabel.small .verb{display:none}
.wlabel.small .pin{height:26px}
.wlabel.hot .name{color:var(--accent)}

/* =========== 04 ONEPASS =========== */
#s-pass{min-height:100vh;padding:calc(var(--hud) + 8vh) var(--pad) 14vh;position:relative}
.pass-head{display:grid;grid-template-columns:1.1fr .9fr;gap:6vw;align-items:end;margin-bottom:8vh}
.pass-head h2{font-size:clamp(56px,9vw,160px)}
.pass-head p{font-size:17px;line-height:1.55;max-width:460px;color:rgba(240,234,231,.82)}
.who{font-size:clamp(28px,3.2vw,48px);margin-bottom:28px;display:flex;align-items:baseline;gap:18px}
.who small{font-family:"APS";font-size:12px;letter-spacing:.26em;opacity:.6}
.personas{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;perspective:1200px}
.persona{position:relative;aspect-ratio:3/4.3;border-radius:18px;padding:22px;text-align:left;background:#121318;border:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;transition:transform .5s cubic-bezier(.2,.8,.2,1),background .4s,border-color .4s;transform-style:preserve-3d}
.persona::before{content:"";position:absolute;left:50%;top:14px;width:46px;height:8px;border-radius:8px;transform:translateX(-50%);background:var(--night);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.persona .pc{position:absolute;inset:0;background:var(--pc);opacity:0;transition:opacity .45s;mix-blend-mode:normal}
.persona>*{position:relative;z-index:1}
.persona .pn{font-family:"APX";font-size:13px;opacity:.6;margin-top:18px}
.persona .pt{font-family:"APD";font-size:clamp(34px,3.4vw,58px);line-height:.86}
.persona .pl{font-size:14px;line-height:1.45;opacity:.78}
.persona .proute{font-size:10px;letter-spacing:.2em;font-weight:700;opacity:.7;text-transform:uppercase}
.persona .qr{width:54px;height:54px;background-image:repeating-linear-gradient(90deg,currentColor 0 3px,transparent 3px 5px,currentColor 5px 6px,transparent 6px 9px),repeating-linear-gradient(0deg,transparent 0 4px,rgba(0,0,0,.0) 4px 6px);opacity:.75;align-self:flex-end}
.persona:hover{transform:translateY(-10px) rotateX(6deg)}
.persona.on{border-color:transparent}
.persona.on .pc{opacity:1}
.persona.on .pn,.persona.on .pl,.persona.on .proute{opacity:1}
.stadiums{margin-top:9vh}
.stad-list{display:flex;flex-wrap:wrap;gap:10px}
.stad{padding:12px 18px 9px;border:1px solid rgba(240,234,231,.25);font-family:"APD";font-size:clamp(20px,2vw,30px);border-radius:60px;transition:.3s;position:relative;overflow:hidden}
.stad i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:10px;vertical-align:.12em;background:var(--c1);box-shadow:5px 0 0 var(--c2)}
.stad:hover{border-color:var(--cream)}
.stad.on{background:var(--cream);color:var(--night);border-color:var(--cream)}
.pass-does{margin-top:12vh;display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:center}
.does-list{font-size:clamp(34px,4.6vw,82px)}
.does-list{font-size:clamp(34px,4vw,72px)!important;max-width:12ch}
.pass-card{justify-self:center;width:min(380px,80vw);aspect-ratio:3/4.6;border-radius:24px;background:linear-gradient(160deg,var(--accent),#111 75%);padding:26px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;box-shadow:0 40px 120px -20px rgba(0,0,0,.8);transform:rotate(-4deg)}
.pass-card::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(115deg,transparent 0 22px,rgba(255,255,255,.04) 22px 23px)}
.pass-card::after{content:"";position:absolute;inset:-40%;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.22) 50%,transparent 60%);animation:sheen 4.5s infinite}
@keyframes sheen{0%{transform:translateX(-60%)}60%,100%{transform:translateX(60%)}}
.pass-card>*{position:relative;z-index:1}
.pc-top{display:flex;justify-content:space-between;align-items:center}
.pc-top img{height:40px}
.pc-top span{font-size:10px;letter-spacing:.3em;font-weight:700}
.pc-name{font-family:"APD";font-size:52px;line-height:.86}
.pc-stad{font-size:12px;letter-spacing:.24em;font-weight:700;margin-top:10px;opacity:.85}
.stamps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.stamp{aspect-ratio:1;border-radius:50%;border:1px dashed rgba(255,255,255,.4);display:grid;place-items:center;font-size:8px;letter-spacing:.12em;font-weight:700;text-align:center;line-height:1.2;opacity:.45;transition:.4s}
.stamp.got{background:var(--cream);color:var(--night);border-style:solid;opacity:1;transform:rotate(-12deg) scale(1.05)}

/* =========== 05 TUNNEL =========== */
#s-tunnel{height:900vh}
.tn-sign{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none;opacity:0}
.tn-sign .disp{font-size:clamp(70px,13vw,240px);text-shadow:0 10px 60px rgba(0,0,0,.6)}
.tn-sign .lead{font-size:12px;letter-spacing:.32em;font-weight:700;margin-bottom:18px}
.tn-sign p{max-width:520px;margin:22px auto 0;font-size:16px;line-height:1.55;color:rgba(240,234,231,.88)}
.tn-sign .stadname{color:var(--team2)}
.tn-shield{pointer-events:auto}
.shield-btn{width:170px;height:200px;margin:28px auto 0;position:relative;display:block;-webkit-tap-highlight-color:transparent}
.shield-btn svg{width:100%;height:100%;overflow:visible}

.shield-btn .hint{position:absolute;left:50%;bottom:-34px;transform:translateX(-50%);white-space:nowrap;font-size:10px;letter-spacing:.28em;font-weight:700;opacity:.8}
.shield-btn.done .hint{opacity:0}
.shields-row{display:flex;gap:6px;justify-content:center;margin-top:60px}
.shields-row i{width:16px;height:20px;clip-path:polygon(0 0,100% 0,100% 62%,50% 100%,0 62%);background:var(--c);opacity:.35;transition:.3s}
.shields-row i.lit{opacity:1;box-shadow:0 0 20px var(--c)}
.lower3{position:absolute;left:var(--pad);bottom:16vh;display:flex;align-items:stretch;opacity:0;pointer-events:none}
.lower3 .l3-team{background:var(--team1);width:16px}
.lower3 .l3-box{background:rgba(8,9,11,.85);padding:16px 22px 12px;backdrop-filter:blur(6px)}
.lower3 .l3-k{font-size:10px;letter-spacing:.3em;font-weight:700;color:var(--team2)}
.lower3 .l3-n{font-family:"APD";font-size:clamp(34px,4vw,62px);line-height:.9}
.lower3 .l3-s{font-family:"APX";font-size:13px;opacity:.75;margin-top:4px}
.rec{position:absolute;right:calc(var(--pad) + 60px);top:calc(var(--hud) + 20px);font-family:"APX";font-size:13px;display:flex;gap:10px;align-items:center;opacity:0}
.rec i{width:10px;height:10px;border-radius:50%;background:#ff2b2b;animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.frame-corners{position:absolute;inset:calc(var(--hud) + 6px) calc(var(--pad) + 50px) 40px var(--pad);opacity:0;pointer-events:none;background:
linear-gradient(#fff,#fff) 0 0/34px 2px no-repeat,linear-gradient(#fff,#fff) 0 0/2px 34px no-repeat,
linear-gradient(#fff,#fff) 100% 0/34px 2px no-repeat,linear-gradient(#fff,#fff) 100% 0/2px 34px no-repeat,
linear-gradient(#fff,#fff) 0 100%/34px 2px no-repeat,linear-gradient(#fff,#fff) 0 100%/2px 34px no-repeat,
linear-gradient(#fff,#fff) 100% 100%/34px 2px no-repeat,linear-gradient(#fff,#fff) 100% 100%/2px 34px no-repeat}
.tn-roar{position:absolute;inset:0;display:grid;place-items:center;text-align:center;opacity:0;color:var(--night);pointer-events:none}
.tn-roar .disp{font-size:clamp(60px,10vw,190px);max-width:12ch}

/* =========== 06 THE LOT (horizontal) =========== */
#s-lot{height:900vh;background:var(--cream);color:var(--night)}
#s-lot .stage{background:var(--cream)}
.lot-track{position:absolute;left:0;top:0;height:100%;display:flex;will-change:transform}
.panel{position:relative;height:100%;flex:none;overflow:hidden;padding:calc(var(--hud) + 30px) var(--pad) var(--pad)}
.lot-intro{width:100vw;display:flex;flex-direction:column;justify-content:flex-end}
.lot-intro h2{font-size:clamp(70px,13.5vw,250px)}
.lot-intro h2 span{color:var(--red)}
.lot-intro .row{display:flex;justify-content:space-between;align-items:end;gap:5vw;margin-top:4vh}
.lot-intro p{max-width:420px;font-size:17px;line-height:1.5}
.smoke-list{font-family:"APD";font-size:clamp(20px,2.4vw,40px);line-height:1;text-transform:uppercase;display:flex;flex-wrap:wrap;gap:.2em .5em;max-width:640px;justify-content:flex-end}
.smoke-list span:nth-child(3n){color:var(--orange)}.smoke-list span:nth-child(3n+1){color:var(--blue)}
.lot-collage{width:150vw}
.lot-collage .col{position:absolute;display:flex;flex-direction:column;gap:14px}
.lot-collage .duo{border-radius:6px}
.lot-collage .big{position:absolute;font-size:clamp(90px,16vw,300px);color:var(--night);mix-blend-mode:multiply;opacity:.9;white-space:nowrap}
.lot-32{width:115vw;display:flex;flex-direction:column;justify-content:center}
.lot-32 h3{font-size:clamp(50px,7vw,130px);max-width:13ch;position:relative;z-index:2}
.lot-32 h3 s{text-decoration:none;position:relative;opacity:.45}
.lot-32 h3 s::after{content:"";position:absolute;left:-2%;right:-2%;top:46%;height:.09em;background:var(--red);transform:scaleX(var(--strike,0));transform-origin:left}
.bars{position:absolute;left:var(--pad);right:var(--pad);bottom:0;height:42vh;display:flex;gap:3px;align-items:flex-end}
.bars i{flex:1;background:var(--c);height:100%;transform:scaleY(var(--s,.4));transform-origin:bottom;will-change:transform;border-radius:2px 2px 0 0}
.lot-labs{width:120vw;display:grid;grid-template-columns:1fr 1.15fr;gap:4vw;align-items:center}
.lot-labs h3{font-size:clamp(56px,8vw,150px)}
.lab-tabs{display:flex;flex-direction:column;margin-top:4vh;border-top:2px solid var(--night)}
.lab-tab{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0 10px;border-bottom:1px solid rgba(28,28,27,.2);font-family:"APD";font-size:clamp(28px,3vw,52px);text-align:left;transition:.3s}
.lab-tab small{font-family:"APX";font-size:13px;opacity:.5}
.lab-tab.on{color:var(--red);padding-left:14px}
.monitor{position:relative;aspect-ratio:16/10;background:#000;border-radius:10px;overflow:hidden;box-shadow:0 30px 80px -30px rgba(0,0,0,.6);border:10px solid #111}
.monitor video{width:100%;height:100%;object-fit:cover}
.monitor .ui{position:absolute;inset:0;color:#fff;pointer-events:none}
.monitor .ui .r{position:absolute;left:14px;top:12px;font-family:"APX";font-size:12px;display:flex;gap:8px;align-items:center}
.monitor .ui .r i{width:9px;height:9px;border-radius:50%;background:#ff2b2b;animation:blink 1s steps(2) infinite}
.monitor .ui .out{position:absolute;left:0;right:0;bottom:0;padding:40px 18px 14px;background:linear-gradient(transparent,rgba(0,0,0,.85));font-size:14px;line-height:1.4}
.monitor .ui .out b{display:block;font-size:10px;letter-spacing:.28em;color:var(--yellow);margin-bottom:6px}
.monitor .ui .lab{position:absolute;right:14px;top:10px;font-family:"APD";font-size:26px}
.lot-archive{width:110vw;display:grid;grid-template-columns:1fr 1fr;gap:4vw;align-items:center}
.lot-archive h3{font-size:clamp(44px,5.6vw,104px);max-width:12ch}
.lot-archive p{max-width:440px;font-size:16px;line-height:1.55;margin-top:22px}
.scanner{position:relative;aspect-ratio:1;max-height:70vh;margin:auto;border-radius:50%;background:radial-gradient(circle at 50% 60%,#2a2a2e,#0b0b0c 70%);display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 0 0 2px #333,0 40px 100px -40px rgba(0,0,0,.6)}
.scanner .relic{width:56%;aspect-ratio:1;border-radius:12px;overflow:hidden}
.scanner .scanline{position:absolute;left:10%;right:10%;height:3px;background:var(--impact);box-shadow:0 0 30px 6px var(--impact);top:20%;animation:scan 2.6s ease-in-out infinite}
@keyframes scan{0%,100%{top:18%}50%{top:80%}}
.scanner .ring{position:absolute;inset:6%;border-radius:50%;border:1px dashed rgba(255,255,255,.25);animation:spin 18s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.induct{position:absolute;right:4%;bottom:8%;background:var(--cream);color:var(--night);padding:14px 16px 10px;border-radius:8px;transform:rotate(5deg);box-shadow:0 20px 40px rgba(0,0,0,.4)}
.induct b{display:block;font-size:9px;letter-spacing:.3em}
.induct span{font-family:"APD";font-size:30px;line-height:.9;display:block;margin-top:4px}
.relic-items{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.relic-items span{border:1px solid var(--night);border-radius:30px;padding:7px 14px 5px;font-size:11px;letter-spacing:.2em;font-weight:700;text-transform:uppercase}
.lot-flag{width:120vw;display:flex;flex-direction:column;justify-content:center}
.lot-flag h3{font-size:clamp(56px,8vw,150px)}
.lot-flag p{max-width:520px;font-size:16px;line-height:1.55;margin-top:18px}
.mosaic{display:flex;gap:var(--gap,40px);margin-top:6vh;height:34vh}
.mosaic .flag{flex:1;height:100%;position:relative;overflow:hidden;border-radius:4px;background:var(--night)}
.mosaic .flag::after{content:"";position:absolute;left:50%;bottom:-10px;width:20px;height:40px;background:var(--cream);transform:translateX(-50%);border-radius:10px}
.mosaic .flag .art{position:absolute;top:0;height:100%;width:800%;background:
radial-gradient(circle at 12% 30%,var(--orange) 0 8%,transparent 9%),radial-gradient(circle at 70% 75%,var(--yellow) 0 6%,transparent 7%),
linear-gradient(115deg,var(--blue) 0 22%,var(--red) 22% 40%,var(--purple) 40% 58%,var(--green) 58% 76%,var(--orange) 76%)}
.mosaic .flag .txt{position:absolute;top:50%;transform:translateY(-50%);width:800%;text-align:center;font-family:"APD";font-size:24vh;color:var(--cream);line-height:1;letter-spacing:.02em;text-shadow:6px 6px 0 var(--night);white-space:nowrap}
.lot-lore{width:110vw;display:grid;grid-template-columns:1fr 1fr;gap:4vw;align-items:center}
.lot-lore h3{font-size:clamp(56px,8vw,150px)}
.lot-lore p{max-width:440px;font-size:16px;line-height:1.55;margin-top:18px}
.jersey-wrap{position:relative;height:72vh;display:grid;place-items:center}
.jersey{height:100%;width:auto;overflow:visible}
.jersey .proj{mix-blend-mode:screen}
.jersey-year{position:absolute;bottom:2vh;left:50%;transform:translateX(-50%);font-family:"APX";font-size:13px;letter-spacing:.2em;background:var(--night);color:var(--cream);padding:8px 14px 6px}
.lot-out{width:100vw;display:flex;flex-direction:column;justify-content:center;gap:2vh;overflow:hidden}
.marq{white-space:nowrap;font-family:"APD";font-size:clamp(70px,12vw,220px);line-height:.9;text-transform:uppercase}
.marq span{display:inline-block;padding-right:.3em}
.marq.o{-webkit-text-stroke:2px var(--night);color:transparent}
.marq.r{color:var(--red)}

/* =========== 07 FIELD =========== */
#s-field{height:520vh}
.yardlines{position:absolute;inset:0;pointer-events:none;opacity:.0}
.yardlines i{position:absolute;left:0;right:0;height:2px;background:rgba(255,255,255,.35)}
.yardlines i em{position:absolute;left:var(--pad);top:-28px;font-family:"APD";font-style:normal;font-size:40px;opacity:.6}
.yardlines i em+em{left:auto;right:calc(var(--pad) + 60px)}
.chalk{position:absolute;inset:8vh 8vw;opacity:0}
.chalk svg{width:100%;height:100%}
.chalk .rt{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-dasharray:6 9}
.chalk .rt.solid{stroke-dasharray:none}
.chalk text{font-family:"APD";fill:#fff;font-size:44px}
.fd-copy{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:0 var(--pad)}
.fd-copy .k{font-size:clamp(60px,10.4vw,200px);max-width:12ch}
.fd-copy .k .w{margin:0 .06em}
.fd-a,.fd-b,.fd-c{position:absolute;inset:0;display:grid;place-items:center}

/* =========== 08 GAUNTLET =========== */
#s-gauntlet{height:1100vh}
.g-hud{position:absolute;left:var(--pad);right:calc(var(--pad) + 60px);top:calc(var(--hud) + 18px);display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.28em;font-weight:700}
.g-steps{display:flex;gap:6px}
.g-steps i{width:34px;height:4px;background:rgba(255,255,255,.25)}
.g-steps i.on{background:var(--cream)}
.g-intro{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.g-intro h2{font-size:clamp(90px,16vw,300px)}
.g-intro p{max-width:520px;margin:20px auto 0;font-size:16px;line-height:1.55}
.cond{position:absolute;inset:0;display:grid;place-items:center;text-align:center;opacity:0}
.cond .where{font-size:12px;letter-spacing:.34em;font-weight:700;margin-bottom:12px}
.cond .what{font-family:"APD";font-size:clamp(110px,22vw,420px);line-height:.8;text-transform:uppercase}
.cond .num{font-family:"APX";font-size:clamp(20px,2vw,30px);margin-top:18px;letter-spacing:.1em}
.cond.noise .what{animation:shake .09s infinite}
@keyframes shake{0%{transform:translate(0,0)}25%{transform:translate(-6px,3px)}50%{transform:translate(5px,-4px)}75%{transform:translate(-3px,-2px)}100%{transform:translate(4px,4px)}}
.cond.heat .what{filter:url(#heat)}
.cond.cold .what{color:#e8f4ff;text-shadow:0 0 40px rgba(180,220,255,.6)}
.cond.mist .what{filter:blur(3px);opacity:.9}
.cond.alt .what{letter-spacing:.2em}
.cond.crowd .what{color:var(--red);animation:glitch .5s steps(2) infinite}
@keyframes glitch{0%{text-shadow:6px 0 var(--impact),-6px 0 var(--yellow)}50%{text-shadow:-8px 2px var(--impact),8px -2px var(--yellow)}100%{text-shadow:3px 0 var(--impact),-3px 0 var(--yellow)}}
.meter{display:flex;gap:4px;justify-content:center;margin-top:26px;height:40px;align-items:flex-end}
.meter i{width:6px;background:var(--cream);height:20%;animation:eq .4s infinite ease-in-out}
.frost{position:absolute;inset:0;pointer-events:none;opacity:0;box-shadow:inset 0 0 160px 40px rgba(210,235,255,.5)}
.fogwall{position:absolute;inset:0;pointer-events:none;opacity:0;background:linear-gradient(0deg,rgba(200,210,220,.5),rgba(200,210,220,.05) 70%);backdrop-filter:blur(2px)}
.drills{position:absolute;inset:0;opacity:0}
.drills-track{position:absolute;left:0;top:0;height:100%;display:flex;align-items:center;gap:3vw;padding:0 8vw;will-change:transform}
.drill{flex:none;width:min(560px,80vw);height:62vh;border:1px solid rgba(255,255,255,.18);background:rgba(8,9,11,.55);backdrop-filter:blur(8px);padding:26px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.drill h4{text-transform:uppercase;font-family:"APD";font-size:clamp(44px,5vw,84px);line-height:.86}
.drill .dk{font-size:11px;letter-spacing:.28em;font-weight:700;color:var(--yellow)}
.drill p{font-size:15px;line-height:1.5;opacity:.85;max-width:420px}
.viz{position:relative;height:42%;}
.lane{position:relative;height:34px;margin-bottom:12px;border-bottom:1px dashed rgba(255,255,255,.25)}
.lane b{position:absolute;left:0;top:0;height:22px;width:var(--w,0%);background:var(--c,#fff);transition:width .1s}
.lane span{position:absolute;right:0;top:0;font-family:"APX";font-size:14px}
.lane em{position:absolute;left:0;top:24px;font-style:normal;font-size:9px;letter-spacing:.24em;font-weight:700;opacity:.7}
.windows{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;height:100%}
.windows i{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2)}
.windows i.open{background:var(--impact);box-shadow:0 0 24px var(--impact)}
.kick{position:relative;height:100%;display:grid;place-items:center}
.kick .clock{font-family:"APX";font-size:min(16vh,120px);color:var(--yellow)}
.kick .posts{position:absolute;top:0;left:50%;width:120px;height:100%;transform:translateX(-50%);border:4px solid var(--yellow);border-bottom:0;opacity:.3}
.lb{width:100%;font-family:"APX";font-size:15px}
.lb div{display:grid;grid-template-columns:28px 1fr auto;gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.lb div.me{color:var(--yellow)}
.flagviz{height:100%;display:grid;place-items:center;font-family:"APD";font-size:min(18vh,140px);color:transparent;-webkit-text-stroke:2px var(--cream)}

/* =========== 09 THE 50 =========== */
#s-fifty{height:760vh}
.ff-big{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}
.ff-big .disp{font-size:clamp(160px,34vw,640px);line-height:.75;color:transparent;-webkit-text-stroke:2px rgba(240,234,231,.85);opacity:0}
.ff-copy{position:absolute;left:var(--pad);bottom:var(--pad);max-width:none}
.ff-copy .k{font-size:clamp(46px,7vw,130px)}
.ff-lines{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.ff-lines .l{position:absolute;font-size:clamp(50px,8.4vw,160px);opacity:0}
.ff-lines .l em{font-style:normal;color:var(--accent)}
.ff-halo-note{position:absolute;right:calc(var(--pad) + 70px);top:calc(var(--hud) + 30px);max-width:320px;font-size:14px;line-height:1.55;opacity:0;text-align:right}
.ff-halo-note b{display:block;font-family:"APD";font-size:44px;line-height:.9;margin-bottom:8px}
.ff-you{position:absolute;left:50%;bottom:12vh;transform:translateX(-50%);display:flex;gap:10px;opacity:0}
.ff-you span{padding:8px 14px 6px;border:1px solid rgba(255,255,255,.35);font-size:11px;letter-spacing:.2em;font-weight:700;white-space:nowrap;background:rgba(0,0,0,.4);backdrop-filter:blur(4px)}

/* =========== 10 ECOSYSTEM =========== */
#s-eco{height:420vh}
.eco-head{position:absolute;left:var(--pad);top:calc(var(--hud) + 40px);max-width:560px}
.eco-head h2{font-size:clamp(50px,7vw,130px)}
.eco-head p{font-size:15px;line-height:1.55;margin-top:16px;max-width:400px;opacity:.85}
.eco-card{position:absolute;right:calc(var(--pad) + 70px);bottom:var(--pad);width:min(380px,80vw);background:rgba(8,9,11,.82);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.12);padding:14px;opacity:0;transform:translateY(20px);transition:.4s}
.eco-card.on{opacity:1;transform:none}
.eco-card .duo{aspect-ratio:16/9;border-radius:4px}
.eco-card h4{font-family:"APD";font-size:40px;line-height:.9;margin:14px 0 8px}
.eco-card p{font-size:14px;line-height:1.5;opacity:.85}
.wlabel.eco{pointer-events:auto;cursor:pointer}
.wlabel.eco .name{font-size:clamp(16px,1.5vw,24px);padding:6px 10px 3px;background:rgba(8,9,11,.6);border:1px solid rgba(255,255,255,.2)}
.wlabel.eco:hover .name,.wlabel.eco.on .name{background:var(--cream);color:var(--night)}
.wlabel.eco .verb{background:var(--accent);color:#fff}

/* =========== 11 PARTNERS =========== */
#s-partners{padding:calc(var(--hud) + 14vh) var(--pad) 18vh;background:var(--night);position:relative;z-index:3}
.pt-head{display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:end;margin-bottom:10vh}
.pt-head h2{font-size:clamp(56px,9vw,170px)}
.pt-head p{font-size:clamp(20px,2vw,30px);line-height:1.3;max-width:520px}
.pt-head p em{font-style:normal;color:var(--accent)}
.playcall{position:relative}
.pc-row{display:grid;grid-template-columns:1fr 1.2fr 1fr;align-items:center;padding:18px 0;border-top:1px solid rgba(240,234,231,.18)}
.pc-row:last-child{border-bottom:1px solid rgba(240,234,231,.18)}
.pc-row .a{font-family:"APD";font-size:clamp(30px,3.6vw,64px)}
.pc-row .b{font-family:"APD";font-size:clamp(30px,3.6vw,64px);text-align:right;color:var(--accent)}
.pc-row .line{height:2px;position:relative;margin:0 3vw}
.pc-row .line::before{content:"";position:absolute;inset:0;background:var(--cream);transform:scaleX(var(--d,0));transform-origin:left}
.pc-row .line::after{content:"";position:absolute;right:-2px;top:-6px;border:7px solid transparent;border-left:10px solid var(--cream);border-right:0;opacity:var(--d,0)}
.pc-row .line span{position:absolute;left:50%;top:-24px;transform:translateX(-50%);font-size:10px;letter-spacing:.26em;font-weight:700;opacity:.6;white-space:nowrap}

/* =========== 12 JOURNEYS =========== */
#s-journeys{height:560vh}
.jr-head{position:absolute;left:var(--pad);top:calc(var(--hud) + 30px);max-width:620px}
.jr-head h2{font-size:clamp(50px,7vw,128px)}
.jr-head p{font-size:15px;line-height:1.55;margin-top:14px;max-width:420px;opacity:.85}
.jr-switch{position:absolute;left:var(--pad);bottom:var(--pad);display:flex;flex-direction:column;gap:8px}
.jr-btn{display:flex;align-items:center;gap:12px;text-align:left;padding:10px 14px 8px;border:1px solid rgba(255,255,255,.2);background:rgba(8,9,11,.55);backdrop-filter:blur(6px);min-width:330px;transition:.3s}
.jr-btn i{width:12px;height:12px;border-radius:50%;background:var(--c)}
.jr-btn b{font-family:"APD";font-size:24px;font-weight:700}
.jr-btn span{font-size:10px;letter-spacing:.16em;font-weight:700;opacity:.65;margin-left:auto}
.jr-btn.on{background:var(--cream);color:var(--night);border-color:var(--cream)}
.jr-statement{position:absolute;right:calc(var(--pad) + 70px);bottom:var(--pad);text-align:right;font-size:clamp(40px,5vw,96px);max-width:10ch;opacity:0}

/* =========== 13 BIG PICTURE =========== */
#s-big{height:760vh}
.bp-num{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}
.bp-num .n{position:absolute;font-size:clamp(110px,20vw,400px);opacity:0;text-shadow:0 20px 80px rgba(0,0,0,.6)}
.bp-num .n small{display:block;font-size:.28em;letter-spacing:.06em;margin-top:.1em}
.bp-final{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.bp-final .k{font-size:clamp(46px,6.6vw,124px);max-width:13ch;margin:0 auto}
.bp-end{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5vh;background:var(--blue);clip-path:circle(0% at 50% 50%)}
.bp-end .hf-logo{width:min(1100px,80vw);color:var(--cream)}
.bp-end .lk{display:flex;align-items:center;gap:26px;font-size:11px;letter-spacing:.3em;font-weight:700}
.bp-end .lk img{height:70px}
.bp-end .tagline{font-family:"APD";font-size:clamp(24px,2.6vw,44px);text-transform:uppercase;text-align:center;line-height:1}
.replay{margin-top:3vh;font-size:11px;letter-spacing:.3em;font-weight:700;border-bottom:1px solid;padding-bottom:4px}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .personas{grid-template-columns:repeat(2,1fr)}
  .pass-head,.pass-does,.pt-head,.lot-labs,.lot-archive,.lot-lore{grid-template-columns:1fr}
  .hud-chapter{display:none}
  .yard{display:none}
  .lot-labs,.lot-archive,.lot-lore,.lot-flag{width:100vw}
  .jr-btn{min-width:0}
  .pc-row{grid-template-columns:1fr;gap:10px}.pc-row .b{text-align:left}
  .world-copy,.ff-halo-note{display:none}
}
@media (prefers-reduced-motion:reduce){.grain{animation:none}}

/* ================= v02 — revisions from the review deck ================= */
/* all display numbers use the display face */
@font-face{font-family:"APX";src:url(../assets/fonts/All-ProDisplayC-Bold.ttf) format("truetype");font-weight:400 700}
.stat,.mono{font-family:"APD",Impact,sans-serif}

/* new NFL Homefield lockup (shield above wordmark) */
.hf-logo{width:min(1100px,78vw);overflow:visible}
.hf-logo .word path{fill:currentColor}
.ld-mark{width:min(420px,70vw)}
.ld-mark .hf-logo{width:100%}
.ld-num{font-family:"APD",Impact,sans-serif;font-weight:700}
.hud-brand svg.hf-logo{height:38px;width:auto}
.rv-welcome{top:13vh}
.rv-logo .hf-logo{width:min(980px,72vw)}
.rv-sub{bottom:9vh;font-size:clamp(22px,3vw,52px)}
.bp-end .hf-logo{width:min(760px,64vw)}

/* tunnel film */
.tn-stage{background:#000}
.tn-media{position:absolute;inset:0;transform-origin:50% 46%;will-change:transform,filter}
.tn-media video{width:100%;height:100%;object-fit:cover}
.tn-shade{position:absolute;inset:0;background:radial-gradient(70% 70% at 50% 45%,rgba(0,0,0,.35),rgba(0,0,0,.92));opacity:.62;pointer-events:none}
.tn-sign .disp{text-shadow:0 10px 60px rgba(0,0,0,.75)}
.tn-sign .stadname{color:#FFB81C}

/* Fan Cave slider — pills + dots */
.cave{display:flex;flex-direction:column;gap:18px;align-self:center}
.cave-frame{position:relative;aspect-ratio:16/10;border-radius:18px;overflow:hidden;background:#111;box-shadow:0 40px 100px -40px rgba(0,0,0,.6)}
.cslide{position:absolute;inset:0;opacity:0;transform:scale(1.06);transition:opacity .8s,transform 1.4s cubic-bezier(.2,.8,.2,1)}
.cslide.on{opacity:1;transform:none}
.cslide video,.cslide img{width:100%;height:100%;object-fit:cover}
.cave-frame .scanline{position:absolute;left:0;right:0;height:3px;background:var(--impact);box-shadow:0 0 30px 6px var(--impact);top:20%;animation:scan 3.2s ease-in-out infinite;z-index:3;opacity:.8}
.cave-nav{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.cave-pills{display:flex;flex-wrap:wrap;gap:8px}
.cpill{border:1px solid var(--night);border-radius:40px;padding:8px 14px 6px;font-size:11px;letter-spacing:.2em;font-weight:700;text-transform:uppercase;transition:.3s}
.cpill.on{background:var(--night);color:var(--cream)}
.cave-dots{display:flex;gap:8px}
.cdot{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--night);transition:.3s;padding:0}
.cdot.on{background:var(--red);border-color:var(--red);transform:scale(1.15)}

/* Flagship studio photos */
.lot-flag{width:130vw;display:grid;grid-template-columns:.8fr 1.2fr;gap:4vw;align-items:center}
.flag-media{position:relative;height:72vh}
.fm{position:absolute;margin:0;border-radius:14px;overflow:hidden;box-shadow:0 30px 80px -30px rgba(0,0,0,.55);background:#ddd}
.fm img{width:100%;height:100%;object-fit:cover}
.fm figcaption{position:absolute;left:12px;bottom:10px;font-size:10px;letter-spacing:.24em;font-weight:700;color:#fff;background:rgba(8,9,11,.6);padding:6px 10px 4px;border-radius:30px}
.fm1{left:0;top:4%;width:62%;height:78%;z-index:1}
.fm2{right:0;bottom:0;width:44%;height:70%;z-index:2}

/* Homefield Lore film */
.lore-media{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#000;box-shadow:0 40px 100px -40px rgba(0,0,0,.6)}
.lore-media video{width:100%;height:100%;object-fit:cover}
.lore-tag{position:absolute;left:14px;bottom:12px;font-family:"APD";font-size:13px;letter-spacing:.2em;background:var(--night);color:var(--cream);padding:7px 12px 5px}

/* field copy — no widows */
.fd-copy .k{max-width:none;line-height:.86}

/* partners in upper case */
.pc-row .a,.pc-row .b{text-transform:uppercase}

/* Big picture — full-bleed film behind an LED pixel grid */
.bp-video{position:absolute;inset:0}
.bp-video video{width:100%;height:100%;object-fit:cover}
.bp-pixel{position:absolute;inset:0;pointer-events:none;opacity:.55;background:
  linear-gradient(rgba(8,9,11,.45),rgba(8,9,11,.45)),
  repeating-linear-gradient(0deg,rgba(0,0,0,.9) 0 1px,transparent 1px 4px),
  repeating-linear-gradient(90deg,rgba(0,0,0,.9) 0 1px,transparent 1px 4px)}
.bp-list{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.06em;font-size:clamp(56px,10.5vw,200px);text-align:center}
.bp-line{line-height:.9;white-space:nowrap}
.bp-line .mask{display:block;overflow:hidden;padding:.04em .02em 0}
.bp-line .mask>span{display:inline-flex;align-items:center;gap:.16em}
.bp-line .num{font-weight:700}
.chip{display:inline-block;height:.74em;aspect-ratio:16/10;border-radius:.08em;overflow:hidden;vertical-align:middle;background:#111;transform:translateY(-.03em);box-shadow:0 10px 40px rgba(0,0,0,.5)}
.chip video{width:100%;height:100%;object-fit:cover}
.bp-final .k{font-size:clamp(46px,7vw,134px);max-width:none}

.lot-flag h3{font-size:clamp(46px,5.4vw,104px)}

/* ================= v03 — chapters 03–05 rebuilt from the RFP deck (video-first) ================= */
:root{--hf-yellow:#FFC300;--hf-orange:#FF8E00;--hf-red:#d63224;--hf-green:#00B247;--hf-blue:#0074F5;--hf-navy:#00183F}
img{max-width:100%}
.eyebrow{color:inherit}

/* 03 identity */
#s-identity{height:620vh}
.id-stage{background:#000}
.id-bg{position:absolute;inset:0}
.id-bg video{width:100%;height:100%;object-fit:cover;filter:saturate(1.1)}
.id-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,24,63,.55),rgba(0,24,63,.85));opacity:.6}
.id-intro{position:absolute;left:var(--pad);right:var(--pad);top:50%;transform:translateY(-50%);z-index:3}
.id-intro .eyebrow{margin-bottom:22px;color:var(--hf-blue)}
.id-intro .k{font-size:clamp(54px,8.6vw,170px);max-width:none}
.id-intro p{margin-top:28px;font-size:18px;max-width:440px;color:rgba(240,234,231,.85)}
.id-bars{position:absolute;inset:0;display:flex;z-index:2}
.idb{flex:1;position:relative;background:var(--c);transform:translateY(105%);overflow:hidden;will-change:transform}
.idb-in{position:absolute;inset:0;mix-blend-mode:multiply;opacity:.55}
.idb-in video{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.2)}
.idb:nth-child(5) .idb-in{mix-blend-mode:multiply;opacity:.35}
.idb:nth-child(7) .idb-in,.idb:nth-child(8) .idb-in{mix-blend-mode:screen;opacity:.35}
.idb-hex{position:absolute;left:12px;top:calc(var(--hud) + 24px);font-family:"APS";font-weight:700;font-size:11px;letter-spacing:.2em;color:#fff;mix-blend-mode:difference}
.id-palette-copy{position:absolute;right:calc(var(--pad) + 60px);bottom:var(--pad);z-index:4;max-width:400px;background:#000;color:#fff;padding:22px 24px 20px;font-size:15px;line-height:1.5}
.id-palette-copy b{display:block;font-family:"APD";font-size:30px;line-height:.9;margin-bottom:10px;color:var(--hf-yellow)}
.id-poster{position:absolute;inset:0;z-index:5;background:var(--hf-blue);display:flex;flex-direction:column;justify-content:center;align-items:center;clip-path:inset(100% 0 0 0)}
.id-poster-type{display:flex;flex-direction:column;align-items:center;color:#fff;font-size:clamp(70px,13.5vw,260px);line-height:.82;text-align:center}
.id-poster-type span{display:block;overflow:hidden;padding-top:.04em}
.id-year{margin-top:3vh;color:#fff;font-size:clamp(28px,3vw,52px)}
.id-chalk{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.id-chalk path,.id-chalk circle{fill:none;stroke:#fff;stroke-width:9;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;filter:url(#chalkBrush)}

/* 03b moodboard */
.mood{background:var(--hf-navy);padding:calc(var(--hud) + 14vh) var(--pad) 10vh;overflow:hidden;position:relative;z-index:3}
.mood-head{margin-bottom:8vh}
.mood-head .eyebrow{color:var(--hf-blue);margin-bottom:16px}
.mood-head h2{font-size:clamp(64px,10vw,190px)}
.mood-head h2 span{color:var(--hf-blue)}
.mood-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:start}
.mc{display:flex;flex-direction:column;gap:14px;will-change:transform}
.mc:nth-child(2){margin-top:18vh}
.mi{margin:0;border-radius:10px;overflow:hidden;background:#0b1a3a}
.mi img,.mi video{width:100%;display:block;object-fit:cover}
.mi.is-vid video{aspect-ratio:4/5}
.mc:nth-child(2) .mi.is-vid video{aspect-ratio:16/10}
.mood-foot{display:flex;flex-direction:column;font-size:clamp(90px,17vw,330px);line-height:.82;margin-top:10vh;white-space:nowrap}
.mood-foot span:last-child{color:var(--hf-blue);align-self:flex-end}

/* 04 tunnel — first step home */
#s-tunnel{height:640vh}
.tn2-stage{background:var(--hf-navy)}
.tn2-type{position:absolute;left:var(--pad);top:calc(var(--hud) + 6vh);z-index:3}
.tn2-big{display:flex;flex-direction:column;color:var(--hf-blue);font-size:clamp(90px,15vw,300px);line-height:.84}
.tn2-big span{display:block;overflow:hidden;width:fit-content}
.tn2-the{position:relative;overflow:visible!important}
.tn2-inside{position:absolute;left:calc(100% + .14em);top:.06em;font-style:normal;font-size:.36em;line-height:.9;color:#fff;white-space:nowrap}
.tn2-chalk{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none}
.tn2-chalk *{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-dasharray:400}
.tn2-card{position:absolute;inset:0;z-index:2;clip-path:inset(56% 25% 6% 29% round 28px)}
.tn2-card video{width:100%;height:100%;object-fit:cover;transform-origin:50% 60%}
.tn2-promise{position:absolute;left:var(--pad);bottom:var(--pad);z-index:5;max-width:520px;font-size:clamp(18px,1.5vw,24px);line-height:1.35;background:rgba(0,24,63,.75);backdrop-filter:blur(8px);padding:22px 26px 20px;opacity:0}
.tn2-promise b{display:block;font-family:"APD";font-size:clamp(28px,2.6vw,44px);line-height:.9;margin-bottom:8px;color:var(--hf-blue)}

/* 04b your home is here */
#s-yourhome{height:560vh}
.yh-stage{background:#000}
.yh-slide{position:absolute;inset:0;opacity:0;overflow:hidden}
.yh-slide img{width:100%;height:100%;object-fit:cover;will-change:transform}
.yh-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.65),rgba(0,0,0,.05) 60%),linear-gradient(0deg,rgba(0,0,0,.55),transparent 40%)}
.yh-words{position:absolute;left:var(--pad);bottom:calc(var(--pad) + 4vh)}
.yh-w{position:absolute;left:0;bottom:0;white-space:nowrap;font-size:clamp(70px,11vw,210px);line-height:.84;opacity:0}
.yh-w small{display:block;font-family:"APS";font-weight:700;font-size:12px;letter-spacing:.3em;margin-bottom:18px;color:var(--hf-yellow)}
.yh-count{position:absolute;right:calc(var(--pad) + 70px);bottom:var(--pad);font-family:"APD";font-size:22px;letter-spacing:.1em}

/* 04c facade */
#s-facade{height:380vh}
.fa-stage{background:#000}
.fa-tunnel{position:absolute;inset:0}
.fa-tunnel video{width:100%;height:100%;object-fit:cover}
.fa-img{position:absolute;inset:0;transform-origin:50% 52%;will-change:transform}
.fa-img img{width:100%;height:100%;object-fit:cover}
.fa-title{position:absolute;left:var(--pad);bottom:var(--pad);z-index:2;text-shadow:0 10px 50px rgba(0,0,0,.7)}
.fa-title .eyebrow{color:var(--hf-yellow);margin-bottom:12px}
.fa-title h2{font-size:clamp(54px,7.6vw,150px)}
.fa-in{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(90px,16vw,320px);opacity:0;text-shadow:0 20px 80px rgba(0,0,0,.6)}

/* 04d four moments */
.tn-cards-sec{background:var(--hf-blue);padding:calc(var(--hud) + 12vh) var(--pad) 0;position:relative;z-index:3}
.tnc-head{display:grid;grid-template-columns:1.1fr .9fr;gap:5vw;align-items:end;margin-bottom:8vh}
.tnc-head h2{font-size:clamp(56px,8.4vw,160px)}
.tnc-head p{font-size:18px;line-height:1.5;max-width:460px}
.tnc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.tnc{background:var(--hf-navy);border-radius:16px;overflow:hidden;padding-bottom:22px;position:relative}
.tnc:nth-child(even){margin-top:8vh}
.tnc-m{aspect-ratio:4/5;overflow:hidden}
.tnc-m img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.tnc:hover .tnc-m img{transform:scale(1.07)}
.tnc-n{position:absolute;top:14px;left:16px;font-family:"APD";font-size:30px;color:#fff;text-shadow:0 4px 20px rgba(0,0,0,.5)}
.tnc h3{font-size:clamp(26px,2.3vw,40px);line-height:.9;margin:20px 20px 10px}
.tnc p{font-size:14px;line-height:1.5;margin:0 20px;color:rgba(240,234,231,.85)}
.tnc-roar{padding:22vh 0 24vh;text-align:center}
.tnc-roar .disp{font-size:clamp(60px,9.6vw,190px);color:#fff}

/* 05 the lot — horizontal, dark */
#s-lot{height:1300vh;background:#05070c;color:var(--cream)}
.lot2-stage{background:#05070c}
.lot2-track{position:absolute;left:0;top:0;height:100%;display:flex;will-change:transform}
.lp{position:relative;flex:none;height:100%;overflow:hidden}
.lp [data-px] img{width:100%;height:100%;object-fit:cover}
.lp-grad{position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,7,12,.95) 5%,rgba(5,7,12,.2) 55%,rgba(5,7,12,.35))}
.lp-hero{width:110vw}
.lp-bg{position:absolute;inset:0;will-change:transform}
.lp-hero-copy{position:absolute;left:var(--pad);right:12vw;bottom:var(--pad)}
.lp-hero-copy h2{font-size:clamp(110px,19vw,380px);line-height:.8}
.lp-sub{font-size:clamp(22px,2.2vw,38px);line-height:.95;color:var(--hf-blue);margin-top:10px}
.lp-cols{display:grid;grid-template-columns:1fr 1fr;gap:3vw;margin-top:4vh;max-width:900px;margin-left:auto}
.lp-cols p{font-size:16px;line-height:1.5}
.lp-brands{width:105vw}
.lp-strike{position:absolute;left:var(--pad);bottom:var(--pad);font-size:clamp(50px,7vw,140px);line-height:.88;display:flex;flex-direction:column}
.lp-strike s{text-decoration:none;position:relative;opacity:.5;align-self:flex-start}
.lp-strike s::after{content:"";position:absolute;left:-2%;right:-2%;top:46%;height:.1em;background:var(--hf-red);transform:scaleX(var(--strike,0));transform-origin:left}
.lp-strike span{color:var(--hf-yellow)}
.lp-acts{width:150vw;padding:calc(var(--hud) + 6vh) var(--pad) var(--pad);display:flex;gap:4vw;align-items:center;background:var(--hf-blue)}
.lp-head{flex:none;width:24vw}
.lp-head .eyebrow{margin-bottom:14px}
.lp-head h3{font-size:clamp(56px,7vw,140px);line-height:.86}
.acts{display:flex;gap:18px;flex:1;height:72vh;align-items:center}
.act{flex:1;background:var(--hf-navy);border-radius:16px;overflow:hidden;will-change:transform}
.act-m{height:44vh;overflow:hidden}
.act-m img{width:100%;height:100%;object-fit:cover}
.act p{font-size:14px;line-height:1.5;padding:18px 20px 22px}
.lp-lab{width:140vw;display:grid;grid-template-columns:1.25fr .75fr;gap:3vw;padding:calc(var(--hud) + 4vh) var(--pad) var(--pad);background:#05070c}
.lab-photo{position:relative;border-radius:18px;overflow:hidden;height:100%}
.lab-photo img,.cave-hero img,.flag-big img,.hist-big img,.lp-bg img{will-change:transform}
.lab-side{display:flex;flex-direction:column;justify-content:center;gap:14px}
.lab-side .eyebrow{color:var(--hf-blue)}
.lab-side h3{font-size:clamp(60px,6.6vw,130px);line-height:.84}
.lab-sub{font-size:clamp(20px,1.8vw,30px);color:var(--hf-blue);line-height:.95}
.lp-lab .monitor{border-color:#1a1d26;margin-top:10px}
.lp-lab .lab-tabs{border-top:2px solid var(--cream);margin-top:6px}
.lp-lab .lab-tab{font-size:clamp(20px,1.8vw,32px);border-bottom-color:rgba(240,234,231,.2);padding:9px 0 6px}
.lp-lab .lab-tab.on{color:var(--hf-yellow)}
.lp-cave{width:170vw;display:grid;grid-template-columns:1fr .9fr;grid-template-rows:auto 1fr;gap:2.5vw 3vw;padding:calc(var(--hud) + 4vh) var(--pad) var(--pad);background:#05070c}
.cave-hero{grid-row:1 / span 2;position:relative;border-radius:18px;overflow:hidden}
.cave-hero img{transform:scale(1.15)}
.cave-copy .eyebrow{color:var(--hf-blue);margin-bottom:12px}
.cave-copy h3{font-size:clamp(60px,7vw,140px);line-height:.84}
.cave-copy p{font-size:16px;line-height:1.5;max-width:620px;margin-top:16px;color:rgba(240,234,231,.85)}
.cave-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;position:relative;align-self:end}
.cave-steps::before{content:"";position:absolute;left:0;right:0;top:-18px;height:2px;background:linear-gradient(90deg,var(--cream),transparent)}
.cs-m{aspect-ratio:4/3;border-radius:10px;overflow:hidden;margin-bottom:12px;background:#111}
.cs-m img,.cs-m video{width:100%;height:100%;object-fit:cover}
.cs b{display:block;font-family:"APD";font-size:22px;line-height:.95;text-transform:uppercase;margin-bottom:6px}
.cs p{font-size:13px;line-height:1.45;color:rgba(240,234,231,.75)}
.lp-flag{width:130vw;display:grid;grid-template-columns:1.3fr .7fr;gap:3vw;padding:calc(var(--hud) + 4vh) var(--pad) var(--pad);background:var(--hf-red)}
.flag-big{position:relative;border-radius:18px;overflow:hidden}
.flag-big img{transform:scale(1.15)}
.flag-side{display:flex;flex-direction:column;justify-content:center;gap:14px}
.flag-side h3{font-size:clamp(60px,7vw,140px);line-height:.84;color:var(--hf-yellow)}
.flag-side .lab-sub{color:#fff}
.flag-inset{border-radius:12px;overflow:hidden;aspect-ratio:16/10}
.flag-inset img{width:100%;height:100%;object-fit:cover}
.flag-side p{font-size:15px;line-height:1.5}
.lp-hist{width:125vw}
.hist-big{position:absolute;inset:0}
.hist-copy{position:absolute;left:var(--pad);bottom:var(--pad);right:var(--pad)}
.hist-copy .eyebrow{color:var(--hf-yellow);margin-bottom:12px}
.hist-copy h3{font-size:clamp(80px,11vw,220px);line-height:.82}
.hist-row{display:flex;gap:2.5vw;align-items:flex-end;margin-top:3vh}
.hist-vid{width:min(420px,30vw);aspect-ratio:16/9;border-radius:12px;overflow:hidden;flex:none}
.hist-vid video{width:100%;height:100%;object-fit:cover}
.hist-txt{max-width:560px;display:grid;gap:10px}
.hist-txt p{font-size:15px;line-height:1.5}
.lp-out{width:100vw;display:flex;flex-direction:column;justify-content:center;gap:2vh;background:var(--cream);color:var(--night)}
.lp-out .marq{white-space:nowrap;font-family:"APD";font-size:clamp(70px,12vw,220px);line-height:.9;text-transform:uppercase}
.lp-out .marq span{display:inline-block;padding-right:.3em}
.lp-out .marq.o{-webkit-text-stroke:2px var(--night);color:transparent}
.lp-out .marq.r{color:var(--hf-red)}

@media (max-width:900px){
  .tnc-grid{grid-template-columns:1fr 1fr}.tnc-head{grid-template-columns:1fr}
  .mood-cols{grid-template-columns:1fr 1fr}.mc:nth-child(3){display:none}
  .lp-lab,.lp-flag{grid-template-columns:1fr}.lp-cave{grid-template-columns:1fr}.cave-steps{grid-template-columns:1fr 1fr}
}

.mi img,.mi video{height:100%;aspect-ratio:auto!important}

.lp-lab .monitor{aspect-ratio:16/9;max-height:34vh}
.lab-side h3{font-size:clamp(54px,5.6vw,110px)!important}

/* retícula over stretched, low-resolution films */
.ret::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:2;background-image:radial-gradient(circle at 50% 50%,rgba(0,0,0,.42) 0 .85px,transparent 1.25px);background-size:4px 4px}

/* tunnel film carries the 'your ___' words */
.tn2-shade{position:absolute;inset:0;z-index:3;opacity:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.6),rgba(0,0,0,0) 60%),linear-gradient(0deg,rgba(0,0,0,.55),transparent 45%)}
.tn2-words{z-index:4}
.tn2-count{z-index:4;opacity:0}

/* tunnel: timed word carousel + centred promise + oval reveal */
.tn2-pager{position:absolute;right:calc(var(--pad) + 70px);bottom:calc(var(--pad) + 2vh);z-index:5;display:flex;align-items:center;gap:26px;opacity:0;pointer-events:none;transition:opacity .4s}
.tn2-pager.on{opacity:1;pointer-events:auto}
.tp-dots{display:flex;align-items:center;gap:12px}
.tp-dots i{position:relative;display:block;width:12px;height:12px;border-radius:12px;background:#f0eae7;overflow:hidden;cursor:pointer;transition:width .5s cubic-bezier(.65,0,.35,1),background .3s}
.tp-dots i.on{width:200px;background:rgba(240,234,231,.28)}
.tp-dots i b{position:absolute;inset:0;background:#f0eae7;transform-origin:0 50%;transform:scaleX(0)}
.tp-dots i:not(.on) b{transform:none!important}
.tp-next{width:84px;height:84px;border-radius:50%;border:2px solid rgba(240,234,231,.3);background:none;display:grid;place-items:center;cursor:pointer;transition:border-color .3s}
.tp-next:hover{border-color:#f0eae7}
.tp-next svg{width:28px;height:28px;fill:none;stroke:#f0eae7;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tn2-dark{position:absolute;inset:0;z-index:4;background:#000;opacity:0;pointer-events:none}
.tn2-promise{inset:0!important;left:0!important;bottom:0!important;max-width:none!important;background:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;padding:0 16vw!important;display:grid;place-items:center;text-align:center;z-index:5;font-size:clamp(20px,1.9vw,32px)!important;line-height:1.35;color:#f0eae7}
.tn2-promise>div{max-width:980px}
.tn2-promise b{font-size:clamp(46px,6vw,120px)!important;line-height:.88!important;margin-bottom:22px!important;color:#fff!important}
.tn2-oval{position:absolute;inset:0;z-index:7;visibility:hidden;clip-path:ellipse(0 0 at 50% 52%);will-change:clip-path}
.tn2-oval img{width:100%;height:100%;object-fit:cover;will-change:transform}
@media (max-width:760px){.tn2-pager{right:var(--pad);gap:16px}.tp-dots i.on{width:110px}.tp-next{width:60px;height:60px}}
.tn2-words{bottom:calc(var(--pad) + 13vh)!important}
.tn2-pager{right:auto!important;left:var(--pad);bottom:var(--pad)!important}
.tn2-pager{transition:none!important}

/* ===================== REEL SITE ===================== */
.reel-site .hud{mix-blend-mode:normal;background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,0));height:calc(var(--hud) + 20px)}
.reel-site .hud-chapter{display:none}
.reel-site .hud-brand{position:static!important;transform:none!important}
.reel-site .hud-right{margin-left:auto}
.hud-brand.lockup{display:flex;align-items:center;gap:10px;color:#f0eae7}
.hud-brand.lockup img{height:30px;width:auto;filter:none}
.lockup .x{font-family:"APS";font-weight:300;font-size:16px;opacity:.85}
.lockup .gpj{font-size:26px;line-height:1;letter-spacing:.02em;padding-top:3px}
.hud-hf{display:block;color:#f0eae7}
.hud-hf svg{height:26px;width:auto;display:block}
.hf-word .shield{display:none}
.reel{position:relative;height:100vh;background:#000;overflow:hidden}
.reel-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
.reel.playing .reel-vid{object-fit:contain}
.reel-shade{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,rgba(0,0,0,.1),rgba(0,0,0,.55));transition:opacity .6s}
.reel.playing .reel-shade{opacity:0}
.reel-play{position:absolute;left:50%;top:50%;z-index:3;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;border:2px solid rgba(240,234,231,.6);background:rgba(0,0,0,.22);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:grid;place-items:center;cursor:pointer;color:#f0eae7;transition:transform .6s cubic-bezier(.2,.8,.2,1),opacity .4s,border-color .3s}
.reel-play:hover{transform:scale(1.08);border-color:#fff}
.reel-play svg{width:46px;height:46px;fill:#f0eae7;margin-left:6px}
.reel-play em{position:absolute;top:calc(100% + 22px);left:50%;transform:translateX(-50%);white-space:nowrap;font-style:normal;font-family:"APS";font-weight:700;font-size:12px;letter-spacing:.32em;text-transform:uppercase}
.reel.playing .reel-play{opacity:0;pointer-events:none;transform:scale(.8)}
.reel-ctrl{position:absolute;left:var(--pad);right:var(--pad);bottom:var(--pad);z-index:3;display:flex;align-items:center;gap:16px;opacity:0;pointer-events:none;transition:opacity .4s}
.reel.playing .reel-ctrl{opacity:1;pointer-events:auto}
.reel.playing.idle .reel-ctrl{opacity:0}
.reel.playing.idle{cursor:none}
.rc-btn{flex:none;width:46px;height:46px;border-radius:50%;border:1.5px solid rgba(240,234,231,.35);background:rgba(0,0,0,.3);display:grid;place-items:center;cursor:pointer;transition:border-color .3s}
.rc-btn:hover{border-color:#f0eae7}
.rc-btn svg{width:20px;height:20px;fill:#f0eae7}
.rc-btn .w{fill:none;stroke:#f0eae7;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#reelPP .i-play,#reelPP.is-paused .i-pause,#reelMute .i-off,#reelMute.is-muted .i-on{display:none}
#reelPP.is-paused .i-play,#reelMute.is-muted .i-off{display:block}
.rc-bar{flex:1;position:relative;height:4px;border-radius:4px;background:rgba(240,234,231,.25);cursor:pointer;touch-action:none}
.rc-bar::before{content:'';position:absolute;left:0;right:0;top:-14px;bottom:-14px}
.rc-bar i{position:absolute;inset:0;border-radius:4px;background:#f0eae7;transform-origin:0 50%;transform:scaleX(0)}
.rc-time{flex:none;min-width:104px;text-align:right;font-family:"APD";font-size:17px;letter-spacing:.05em;color:#f0eae7}
.reel-cue{position:absolute;left:50%;bottom:calc(var(--pad) + 4px);transform:translateX(-50%);z-index:3;font-family:"APS";font-weight:700;font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:#f0eae7;opacity:.75;transition:opacity .4s}
.reel.playing .reel-cue{opacity:0}
@media (max-width:760px){.reel-play{width:110px;height:110px;margin:-55px 0 0 -55px}.rc-time{display:none}.hud-hf svg{height:18px}.lockup .gpj{font-size:20px}.hud-brand.lockup img{height:24px}}
.hud-brand.lockup img.gpj{height:32px;width:32px}
@media (max-width:760px){.hud-brand.lockup img.gpj{height:26px;width:26px}}

/* closing card: thank you + contact inside the blue Homefield end frame */
.bp-end{gap:3.2vh!important}
.bp-end .hf-logo{width:min(620px,50vw)!important}
.bp-end .tagline{font-size:clamp(20px,2vw,34px)!important}
.bp-thanks{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;color:#f0eae7}
.bp-thanks .ty-title{font-size:clamp(34px,3.4vw,58px);line-height:.9;margin-bottom:10px}
.bp-thanks .ty-name{font-size:clamp(18px,1.5vw,24px);letter-spacing:.04em;line-height:1}
.bp-thanks .ty-role{font-family:"APS";font-weight:700;font-size:11px;letter-spacing:.3em;text-transform:uppercase;opacity:.75}
.bp-thanks .ty-links{display:flex;gap:12px;align-items:center;margin-top:6px;font-size:clamp(14px,1.05vw,17px)}
.bp-thanks .ty-links a{color:#f0eae7;text-decoration:none;border-bottom:1px solid rgba(240,234,231,.35);padding-bottom:2px;transition:border-color .3s}
.bp-thanks .ty-links a:hover{border-color:#f0eae7}
.bp-thanks .ty-links span{opacity:.5}
@media (max-width:760px){.bp-end .hf-logo{width:78vw!important}.bp-thanks .ty-links{flex-direction:column;gap:4px}.bp-thanks .ty-links span{display:none}}
.bp-thanks{margin-top:2.5vh}