/* ═══════════════════════════════════════════════════════════════
   ISTEN HOZOTT® — Homepage v5 · "Kinematikus"
   Norris-energia, IH-dignitas. Narratív ritmus, nyers típus.
   ═══════════════════════════════════════════════════════════════ */

@font-face { font-family:'Big Shoulders Display'; font-weight:400; font-display:swap; src:url('../fonts/BigShoulders-Regular.woff2') format('woff2'), url('../fonts/BigShoulders-Regular.ttf') format('truetype'); }
@font-face { font-family:'Big Shoulders Display'; font-weight:700 900; font-display:swap; src:url('../fonts/BigShoulders-Bold.woff2') format('woff2'), url('../fonts/BigShoulders-Bold.ttf') format('truetype'); }

:root {
  --c-black:#070707; --c-white:#F0EDE6; --c-orange:#EC7200; --c-burg:#3A0A18;
  --c-900:#0F0F0F; --c-800:#1A1A1A;
  --accent:var(--c-orange);
  --ff-d:'Big Shoulders Display',Impact,sans-serif;
  --ff-b:'Andada Pro',Georgia,serif;
  --ff-m:'Space Mono',monospace;
  --ease-out:cubic-bezier(.16,1,.3,1); --ease-io:cubic-bezier(.65,0,.35,1);
  --pad:clamp(20px,4vw,64px); --skew:0deg;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:clip;-webkit-font-smoothing:antialiased}
body{background:var(--c-black);color:var(--c-white);font-family:var(--ff-b);overflow-x:clip}
a{color:inherit;text-decoration:none} img{display:block;max-width:100%}
button{cursor:pointer;font:inherit;color:inherit;background:none;border:none}
::selection{background:var(--c-orange);color:var(--c-black)}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
body.no-grain #hero-grain{display:none!important}

@media(hover:hover)and(pointer:fine){
  body.has-cursor,body.has-cursor a,body.has-cursor button{cursor:none!important}
}

/* ─── CURSOR ─── */
#cursor-ring{position:fixed;z-index:9998;pointer-events:none;top:0;left:0;width:44px;height:44px;
  border-radius:50%;border:1px solid rgba(240,237,230,.3);
  display:flex;align-items:center;justify-content:center;
  transition:width .35s var(--ease-out),height .35s var(--ease-out),border-color .3s,background .3s;
  will-change:transform}
#cursor-ring.hovering{width:64px;height:64px;border-color:var(--c-orange);background:rgba(236,114,0,.05)}
#cursor-ring.card-hover{width:96px;height:96px;background:rgba(236,114,0,.11);border-color:transparent}
.cursor-label{font-family:var(--ff-d);font-weight:700;font-size:9px;letter-spacing:.2em;color:var(--c-orange);
  text-transform:uppercase;opacity:0;transition:opacity .2s;white-space:nowrap}
#cursor-ring.card-hover .cursor-label{opacity:1}
#cursor-dot{position:fixed;z-index:9999;pointer-events:none;top:0;left:0;width:5px;height:5px;
  border-radius:50%;background:var(--c-orange);will-change:transform}

/* ─── LOADER ─── */
#loader{position:fixed;inset:0;z-index:9000;background:var(--c-black);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px}
.ld-logo{width:60px;height:60px}
.ld-logo img{width:100%;height:100%;object-fit:contain}
.ld-brand{font-family:var(--ff-d);font-weight:700;font-size:13px;text-transform:uppercase;
  letter-spacing:.16em;color:rgba(240,237,230,.38)}
.ld-num{font-family:var(--ff-d);font-weight:900;font-size:clamp(80px,16vw,220px);line-height:.8;
  letter-spacing:-.04em;display:flex;align-items:baseline;gap:.04em;margin-top:20px}
.ld-num .pct{font-size:.26em;color:var(--c-orange);transform:translateY(-.1em)}
.ld-shutter{position:fixed;inset:0;z-index:8999;background:var(--c-orange);
  transform:scaleY(0);transform-origin:bottom;pointer-events:none}

/* ─── NAV ─── */
#nav{position:fixed;top:0;left:0;right:0;z-index:600;display:flex;align-items:center;
  justify-content:space-between;padding:0 var(--pad);height:68px;mix-blend-mode:difference}
#nav.solid{mix-blend-mode:normal}
.nav-logo{display:flex;align-items:center;gap:10px}
.nav-logo img{width:20px;height:20px;object-fit:contain}
.nav-logo span{font-family:var(--ff-d);font-weight:700;font-size:13px;text-transform:uppercase;
  letter-spacing:.06em;color:var(--c-white)}
.nav-right{display:flex;align-items:center;gap:clamp(16px,2.4vw,36px)}
.nav-clock{font-family:var(--ff-m);font-size:9.5px;letter-spacing:.14em;color:rgba(240,237,230,.42)}
.nav-clock .blink{animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.nav-link{font-family:var(--ff-m);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(240,237,230,.58);position:relative;padding-bottom:2px}
.nav-link::after{content:'';position:absolute;left:0;bottom:0;width:0;height:1px;
  background:var(--c-orange);transition:width .3s var(--ease-io)}
.nav-link:hover::after{width:100%}
.nav-burger{display:flex;flex-direction:column;gap:5px;width:32px;align-items:flex-end;flex-shrink:0}
.nav-burger span{display:block;height:1.5px;background:var(--c-white);
  transition:width .3s,transform .3s,opacity .3s}
.nav-burger span:first-child{width:22px}
.nav-burger span:last-child{width:14px}
.nav-burger.is-open span:first-child{width:20px;transform:rotate(45deg) translate(4px,4px)}
.nav-burger.is-open span:last-child{width:20px;transform:rotate(-45deg) translate(4px,-4px)}

/* ─── NAV OVERLAY ─── */
#nav-overlay{position:fixed;inset:0;z-index:700;background:var(--c-burg);
  clip-path:inset(0 0 100% 0);display:flex;pointer-events:none}
#nav-overlay.is-open{pointer-events:all}
.navo-links{flex:1;display:flex;flex-direction:column;justify-content:center;
  padding:80px var(--pad);gap:2px}
.navo-meta{font-family:var(--ff-m);font-size:9px;letter-spacing:.24em;
  color:rgba(240,237,230,.32);margin-bottom:48px;text-transform:uppercase}
.navo-link{font-family:var(--ff-d);font-weight:900;font-size:clamp(54px,8vw,108px);
  text-transform:uppercase;letter-spacing:-.03em;line-height:.88;
  color:rgba(240,237,230,.18);overflow:hidden;transition:color .25s;width:max-content}
.navo-link .li{display:inline-block;transform:translateY(110%)}
.navo-link:hover{color:var(--c-white)}
.navo-link .idx{font-family:var(--ff-m);font-size:11px;vertical-align:super;
  color:var(--c-orange);letter-spacing:0;margin-right:14px}
.navo-img{flex:0 0 40%;position:relative;overflow:hidden}
.navo-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transform:scale(1.08);
  transition:opacity .5s var(--ease-io),transform .8s var(--ease-io);
  filter:grayscale(.3) contrast(1.05)}
.navo-img img.on{opacity:1;transform:scale(1)}
.navo-close{position:absolute;top:28px;right:var(--pad);font-family:var(--ff-m);
  font-size:10px;letter-spacing:.16em;color:rgba(240,237,230,.45)}
.navo-close:hover{color:var(--c-orange)}
.navo-socials{position:absolute;bottom:36px;left:var(--pad);display:flex;gap:28px;align-items:center}
.navo-socials a{font-family:var(--ff-m);font-size:9px;letter-spacing:.15em;
  text-transform:uppercase;color:rgba(240,237,230,.32)}
.navo-socials a:hover{color:var(--c-orange)}
#lang-btn{font-family:var(--ff-m);font-size:9px;letter-spacing:.15em;
  border:1px solid rgba(240,237,230,.2);border-radius:2px;color:var(--c-white);padding:5px 9px;
  transition:border-color .2s,color .2s}
#lang-btn:hover{border-color:var(--c-orange);color:var(--c-orange)}

/* ─── HERO ─── */
#hero{position:relative;height:100svh;min-height:640px;overflow:hidden}
.hero-bg{position:absolute;inset:0}
.hero-img{width:100%;height:118%;object-fit:cover;object-position:center 32%;
  filter:grayscale(.2) contrast(1.04) brightness(.88) blur(calc(var(--velo,0) * 1.6px));will-change:transform}
.hero-scrim{position:absolute;inset:0;
  background:linear-gradient(155deg,rgba(7,7,7,.80) 0%,rgba(7,7,7,.32) 55%,rgba(7,7,7,.66) 100%)}
/* hero canvas — flow field sits above photo, below scrim */
#hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;
  mix-blend-mode:screen;pointer-events:none;opacity:.55}
#hero-grain{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:.07;
  background-repeat:repeat;animation:grain .4s steps(1) infinite}
@keyframes grain{0%{background-position:0 0}20%{background-position:-40px -20px}
  40%{background-position:24px -50px}60%{background-position:-60px 30px}
  80%{background-position:48px 40px}100%{background-position:0 0}}
.hero-meta-top{position:absolute;top:92px;left:var(--pad);right:var(--pad);
  z-index:5;display:flex;justify-content:space-between;align-items:baseline}
.hero-eyebrow{font-family:var(--ff-m);font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--c-orange)}
.hero-loc{font-family:var(--ff-m);font-size:10px;letter-spacing:.18em;
  color:rgba(240,237,230,.42);text-transform:uppercase}
.hero-body{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;
  justify-content:flex-end;padding-bottom:8vh}
.hm-track{white-space:nowrap;overflow:hidden;width:100%}
.hm-line{display:inline-block;font-family:var(--ff-d);font-weight:900;
  font-size:clamp(120px,21vw,340px);line-height:.78;text-transform:uppercase;
  letter-spacing:-.04em;will-change:transform;padding-left:var(--pad)}
.hm-line .reg{color:var(--c-orange);font-size:.2em;vertical-align:super}
.hm-line .out{-webkit-text-stroke:1.5px rgba(240,237,230,.48);color:transparent}
.hm-sub{padding:26px var(--pad) 0;max-width:520px;font-style:italic;
  font-size:clamp(14px,1.4vw,17px);line-height:1.72;color:rgba(240,237,230,.58)}
.scroll-cue{position:absolute;bottom:34px;right:var(--pad);z-index:5;
  display:flex;align-items:center;gap:10px}
.scroll-cue-line{width:1px;height:30px;background:rgba(240,237,230,.22);
  position:relative;overflow:hidden}
.scroll-cue-line::after{content:'';position:absolute;inset:0;background:var(--c-orange);
  transform:translateY(-100%);animation:cue 1.8s var(--ease-io) infinite}
@keyframes cue{0%{transform:translateY(-100%)}50%{transform:translateY(0)}100%{transform:translateY(100%)}}
.scroll-cue span{font-family:var(--ff-m);font-size:8px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(240,237,230,.42)}

/* ─── VELOCITY STRIP ─── */
.velo-strip{border-top:1px solid rgba(240,237,230,.07);border-bottom:1px solid rgba(240,237,230,.07);
  padding:22px 0;overflow:hidden;white-space:nowrap;background:var(--c-black)}
.velo-track{display:inline-flex;align-items:center;gap:40px;will-change:transform}
.velo-item{font-family:var(--ff-d);font-weight:900;font-size:clamp(28px,4.4vw,58px);
  text-transform:uppercase;letter-spacing:-.02em;color:rgba(240,237,230,.13)}
.velo-item.alt{color:transparent;-webkit-text-stroke:1px rgba(240,237,230,.18)}
.velo-dot{width:8px;height:8px;border-radius:50%;background:var(--c-orange);flex-shrink:0}

/* ─── SECTION HEADINGS ─── */
.sec-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  padding:clamp(70px,9vw,120px) var(--pad) clamp(36px,4vw,56px)}
.sec-head-l{display:flex;align-items:baseline;gap:16px}
.sec-eyebrow{font-family:var(--ff-m);font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--c-orange)}
.sec-title{font-family:var(--ff-d);font-weight:900;font-size:clamp(40px,6.5vw,96px);
  text-transform:uppercase;letter-spacing:-.03em;line-height:.88;transform:skewX(var(--skew))}
.sec-count{font-family:var(--ff-m);font-size:12px;letter-spacing:.12em;color:rgba(240,237,230,.28)}
.sec-note{font-family:var(--ff-b);font-style:italic;font-size:14px;color:rgba(240,237,230,.38);
  max-width:280px;text-align:right;line-height:1.6}

/* ─── WORKS (horizontal pin) ─── */
#works{position:relative;background:var(--c-black)}
.works-stage{height:100svh;position:relative;overflow:hidden;display:flex;align-items:center}
.works-ghost{position:absolute;left:var(--pad);top:50%;transform:translateY(-50%);
  font-family:var(--ff-d);font-weight:900;font-size:clamp(280px,52vh,620px);
  line-height:.8;color:rgba(240,237,230,.028);z-index:0;pointer-events:none;user-select:none}
.works-head{position:absolute;top:88px;left:var(--pad);right:var(--pad);z-index:5;
  display:flex;align-items:baseline;gap:16px}
.works-head .sec-count{margin-left:auto}
.works-track{display:flex;gap:28px;padding:0 var(--pad);will-change:transform;align-items:center;z-index:2}
.work-card{flex:0 0 clamp(300px,30vw,460px);position:relative;display:block}
.work-card-media{position:relative;height:62vh;max-height:640px;overflow:hidden}
.work-card-img{width:100%;height:112%;object-fit:cover;filter:grayscale(.3) contrast(1.04);
  transition:filter .5s;will-change:transform}
.work-card:hover .work-card-img{filter:grayscale(0) contrast(1.05)}
.work-card-scrim{position:absolute;inset:0;
  background:linear-gradient(to top,rgba(7,7,7,.88) 0%,transparent 55%)}
.work-card-num{position:absolute;top:16px;left:16px;font-family:var(--ff-m);
  font-size:10px;letter-spacing:.16em;color:var(--c-white)}
.work-card-arrow{position:absolute;top:16px;right:18px;font-family:var(--ff-m);
  font-size:14px;color:rgba(240,237,230,0);transition:color .3s,transform .3s}
.work-card:hover .work-card-arrow{color:var(--c-orange);transform:translate(3px,-3px)}
.work-card-foot{padding:18px 2px 0;display:flex;align-items:baseline;justify-content:space-between;
  gap:12px;border-top:1px solid rgba(240,237,230,.1);margin-top:14px}
.work-card-cat{font-family:var(--ff-m);font-size:9px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--c-orange)}
.work-card-title{font-family:var(--ff-d);font-weight:700;font-size:clamp(18px,1.7vw,24px);
  text-transform:uppercase;line-height:1;letter-spacing:-.01em;flex:1}
.work-card-year{font-family:var(--ff-m);font-size:9px;color:rgba(240,237,230,.32)}
.works-hint{position:absolute;bottom:36px;right:var(--pad);z-index:5;font-family:var(--ff-m);
  font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:rgba(240,237,230,.32);
  display:flex;align-items:center;gap:10px}
.works-hint .bar{width:40px;height:1px;background:rgba(240,237,230,.18);
  position:relative;overflow:hidden}
#works-prog{position:absolute;inset:0;background:var(--c-orange);
  transform:scaleX(0);transform-origin:left}

/* ─── MANIFESTO (split — dramatic) ─── */
#manifesto{background:var(--c-black);position:relative}
.mani-pin{min-height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden}

/* Giant watermark number */
.mani-pin::before{content:'02';position:absolute;right:-1vw;top:50%;transform:translateY(-50%);
  font-family:var(--ff-d);font-weight:900;font-size:clamp(260px,36vw,540px);
  letter-spacing:-.06em;line-height:1;color:rgba(240,237,230,.025);
  pointer-events:none;user-select:none;z-index:0}

.mani-wrap{display:grid;grid-template-columns:1.25fr .75fr;
  gap:clamp(40px,5vw,80px);padding:clamp(90px,10vw,140px) var(--pad);
  align-items:start;width:100%;max-width:1580px;position:relative;z-index:1}

.mani-eyebrow{display:block;margin-bottom:clamp(28px,3.5vw,52px)}
.mani-body{font-family:var(--ff-d);font-weight:900;
  font-size:clamp(38px,6.2vw,92px);
  text-transform:uppercase;line-height:.92;letter-spacing:-.035em}
.mani-body .w{display:inline-block;margin-right:.22em;
  color:rgba(240,237,230,.07);transition:color .08s}
.mani-body .w.lit{color:var(--c-white)}
.mani-body .w.acc{color:var(--c-orange)}

/* Decorative divider between eyebrow and body */
.mani-eyebrow{position:relative;padding-bottom:24px}
.mani-eyebrow::after{content:'';position:absolute;bottom:0;left:0;
  width:clamp(40px,5vw,72px);height:2px;background:var(--c-orange)}

.mani-foot{margin-top:clamp(36px,4.5vw,64px);display:flex;align-items:center;gap:22px}
.mani-foot .bar{width:28px;height:1px;background:var(--c-orange);flex-shrink:0}
.mani-foot p{font-style:italic;font-size:13.5px;color:rgba(240,237,230,.32);line-height:1.6}

/* Right column — photo stacked with a small stat */
.mani-right{position:relative;display:flex;flex-direction:column;gap:24px;padding-top:clamp(40px,6vw,90px)}
.mani-photo-wrap{position:relative;aspect-ratio:4/5;overflow:hidden}
.mani-photo{width:100%;height:120%;object-fit:cover;
  filter:grayscale(.25) contrast(1.06) blur(calc(var(--velo,0) * 1.6px));will-change:transform}
.mani-photo-cap{position:absolute;bottom:14px;left:14px;font-family:var(--ff-m);
  font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(240,237,230,.52)}

/* Accent band below photo */
.mani-aside{display:flex;align-items:center;gap:18px;padding:22px 0 0;
  border-top:1px solid rgba(240,237,230,.07)}
.mani-aside-num{font-family:var(--ff-d);font-weight:900;
  font-size:clamp(36px,4vw,58px);letter-spacing:-.03em;color:var(--c-orange);line-height:1}
.mani-aside-label{font-family:var(--ff-m);font-size:9px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(240,237,230,.36);line-height:1.5}

/* Rotated vertical label left edge */
.mani-vline{position:absolute;left:calc(var(--pad) - 10px);top:50%;transform:translateY(-50%) rotate(-90deg);
  transform-origin:center;font-family:var(--ff-m);font-size:7.5px;letter-spacing:.28em;
  text-transform:uppercase;color:rgba(240,237,230,.14);white-space:nowrap;z-index:2}

/* ─── FORMATS ─── */
#formats{background:var(--c-900)}
.fmt-list{border-top:1px solid rgba(240,237,230,.1);margin:0 var(--pad) clamp(60px,8vw,110px)}
.fmt-row{display:flex;align-items:center;gap:clamp(16px,3vw,48px);
  padding:clamp(22px,2.6vw,38px) 4px;border-bottom:1px solid rgba(240,237,230,.1);
  position:relative;transition:padding-left .4s var(--ease-io)}
.fmt-row:hover{padding-left:24px}
.fmt-row::before{content:'';position:absolute;left:0;top:0;bottom:0;width:0;
  background:var(--c-orange);transition:width .4s var(--ease-io)}
.fmt-row:hover::before{width:4px}
.fmt-num{font-family:var(--ff-m);font-size:11px;letter-spacing:.14em;color:var(--c-orange);min-width:34px}
.fmt-name{font-family:var(--ff-d);font-weight:900;font-size:clamp(28px,4.6vw,68px);
  text-transform:uppercase;letter-spacing:-.025em;line-height:.92;flex:1;
  color:rgba(240,237,230,.48);transition:color .3s}
.fmt-row:hover .fmt-name{color:var(--c-white)}
.fmt-desc{font-family:var(--ff-b);font-style:italic;font-size:13.5px;line-height:1.6;
  color:rgba(240,237,230,.38);max-width:300px}
.fmt-arrow{font-family:var(--ff-m);font-size:15px;color:var(--c-orange);
  opacity:0;transform:translateX(-10px);transition:opacity .3s,transform .3s}
.fmt-row:hover .fmt-arrow{opacity:1;transform:translateX(0)}
#fmt-cursor-img{position:fixed;z-index:500;width:240px;height:300px;pointer-events:none;
  overflow:hidden;opacity:0;transform:translate(-50%,-50%) scale(.85);
  transition:opacity .35s var(--ease-io),transform .35s var(--ease-io)}
#fmt-cursor-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(.2) contrast(1.05)}
#fmt-cursor-img.on{opacity:1;transform:translate(-50%,-50%) scale(1)}

/* ─── NARRATIVE STRIP ─── */
#narrative{background:#0A0A0A;position:relative}
.narr-stage{height:100svh;position:relative;overflow:hidden;display:flex;align-items:center}
.narr-head{position:absolute;top:88px;left:var(--pad);right:var(--pad);z-index:5;
  display:flex;align-items:baseline;gap:16px}
.narr-track{display:flex;gap:clamp(24px,3vw,44px);padding:0 var(--pad) 0 var(--pad);
  will-change:transform;align-items:center;height:100%;padding-right:calc(var(--pad) * 2)}

.narr-intro{flex:0 0 clamp(260px,26vw,400px);padding-right:clamp(24px,3vw,48px);
  border-right:1px solid rgba(240,237,230,.08)}
.narr-intro-label{font-family:var(--ff-m);font-size:9px;letter-spacing:.24em;
  text-transform:uppercase;color:rgba(240,237,230,.32);margin-bottom:22px;display:block}
.narr-intro-text{font-family:var(--ff-b);font-style:italic;font-size:clamp(14px,1.4vw,18px);
  line-height:1.7;color:rgba(240,237,230,.52)}

.narr-photo{flex:0 0 clamp(220px,22vw,320px);display:flex;flex-direction:column}
.narr-img-wrap{position:relative;aspect-ratio:2/3;overflow:hidden}
.narr-img-wrap img{width:100%;height:120%;object-fit:cover;
  filter:grayscale(.45) contrast(1.05);will-change:transform}
.narr-num{position:absolute;top:12px;left:12px;font-family:var(--ff-m);
  font-size:9px;letter-spacing:.18em;color:rgba(240,237,230,.45)}
.narr-meta{padding:14px 0 0;display:flex;gap:10px;align-items:baseline}
.narr-year{font-family:var(--ff-m);font-size:10px;letter-spacing:.2em;color:var(--c-orange)}
.narr-loc{font-family:var(--ff-m);font-size:9px;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(240,237,230,.32)}
.narr-caption{font-family:var(--ff-b);font-style:italic;
  font-size:clamp(12px,1.1vw,13.5px);line-height:1.62;
  color:rgba(240,237,230,.48);padding-top:8px}

.narr-quote{flex:0 0 clamp(320px,34vw,500px);display:flex;align-items:center;
  padding:0 clamp(24px,3.5vw,56px);border-left:1px solid rgba(240,237,230,.07)}
.narr-quote-inner::before{content:'';display:block;width:28px;height:2px;
  background:var(--c-orange);margin-bottom:22px}
.narr-quote-text{font-family:var(--ff-d);font-weight:900;
  font-size:clamp(26px,3.4vw,50px);text-transform:uppercase;
  letter-spacing:-.025em;line-height:.94;color:rgba(240,237,230,.8)}

/* ─── STATS ─── */
#stats{background:var(--c-burg);overflow:hidden}
.stats-inner{display:grid;grid-template-columns:repeat(3,1fr)}
.stat{padding:clamp(60px,8vw,110px) var(--pad);text-align:center;
  border-right:1px solid rgba(240,237,230,.1)}
.stat:last-child{border-right:none}
.stat-num{font-family:var(--ff-d);font-weight:900;font-size:clamp(56px,9vw,128px);
  letter-spacing:-.04em;line-height:.9}
.stat-num .u{color:var(--c-orange);font-size:.42em}
.stat-label{font-family:var(--ff-m);font-size:9.5px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(240,237,230,.42);margin-top:16px;display:block}

/* ─── ESSAYS HALL OF FAME ─── */
#essays{background:var(--c-black)}
.essays-hall{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;
  padding:0 var(--pad) clamp(60px,8vw,110px)}
.essay-card{position:relative;aspect-ratio:3/4;overflow:hidden}
.essay-card-img{position:absolute;inset:0;width:100%;height:118%;object-fit:cover;
  will-change:transform,filter,opacity;
  transition:opacity .65s var(--ease-io),filter .7s var(--ease-io),transform .9s var(--ease-io)}
.essay-base{filter:grayscale(.55) contrast(1.05);transform:scale(1.04);opacity:1}
.essay-hover{filter:grayscale(.05) contrast(1.06);transform:scale(1);opacity:0}
.essay-card:hover .essay-base{opacity:0}
.essay-card:hover .essay-hover{opacity:1}
.essays-hall:has(.essay-card:hover) .essay-card:not(:hover){opacity:.44;transition:opacity .4s}
.essay-card-scrim{position:absolute;inset:0;
  background:linear-gradient(to top,rgba(7,7,7,.96) 0%,rgba(7,7,7,.12) 55%,transparent 100%)}
.essay-card-top{position:absolute;top:0;left:0;right:0;height:2px;background:var(--c-orange);
  transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease-io)}
.essay-card:hover .essay-card-top{transform:scaleX(1)}
.essay-card-body{position:absolute;bottom:0;left:0;right:0;
  padding:clamp(18px,2vw,28px);transform:translateY(10px);transition:transform .45s var(--ease-io)}
.essay-card:hover .essay-card-body{transform:translateY(0)}
.essay-card-issue{font-family:var(--ff-m);font-size:9px;letter-spacing:.2em;
  color:var(--c-orange);margin-bottom:10px}
.essay-card-title{font-family:var(--ff-d);font-weight:900;
  font-size:clamp(16px,1.8vw,26px);text-transform:uppercase;letter-spacing:-.015em;line-height:1.02}

/* ─── PARTNERS ─── */
#partners{background:var(--c-900)}
.partners-list{border-top:1px solid rgba(240,237,230,.1);
  margin:0 var(--pad) clamp(60px,8vw,110px)}
.partner-row{display:flex;align-items:center;gap:clamp(14px,2vw,30px);
  padding:clamp(14px,1.8vw,24px) 0;border-bottom:1px solid rgba(240,237,230,.1);
  position:relative;transition:padding-left .4s var(--ease-io)}
.partner-row:hover{padding-left:22px}
.partner-row::before{content:'';position:absolute;left:0;top:0;bottom:0;
  width:0;background:var(--c-orange);transition:width .4s var(--ease-io)}
.partner-row:hover::before{width:3px}
.partner-num{font-family:var(--ff-m);font-size:10px;letter-spacing:.16em;
  color:rgba(236,114,0,.4);min-width:28px;flex-shrink:0}
.partner-name{font-family:var(--ff-d);font-weight:900;
  font-size:clamp(32px,5.5vw,80px);text-transform:uppercase;
  letter-spacing:-.025em;line-height:.88;flex:1;
  color:rgba(240,237,230,.16);transition:color .3s}
.partner-row:hover .partner-name{color:var(--c-white)}
.partner-name.outline{color:transparent;-webkit-text-stroke:1px rgba(240,237,230,.22);
  transition:color .3s,-webkit-text-stroke-color .3s}
.partner-row:hover .partner-name.outline{-webkit-text-stroke-color:rgba(240,237,230,.8)}
.partner-type{font-family:var(--ff-m);font-size:9px;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(240,237,230,.24);flex-shrink:0}

/* ─── CTA ─── */
#contact{min-height:100svh;background:var(--c-black);display:flex;flex-direction:column;
  align-items:center;justify-content:center;padding:120px var(--pad);
  text-align:center;position:relative;overflow:hidden}
.cta-bg{position:absolute;inset:0;z-index:0}
.cta-bg img{width:100%;height:110%;object-fit:cover;filter:grayscale(.4) contrast(1.04) blur(calc(var(--velo,0) * 1.6px));will-change:transform}
.cta-bg-scrim{position:absolute;inset:0;
  background:linear-gradient(160deg,rgba(7,7,7,.9) 0%,rgba(7,7,7,.72) 100%)}
.cta-content{position:relative;z-index:2}
.cta-label{font-family:var(--ff-m);font-size:10px;letter-spacing:.26em;
  text-transform:uppercase;color:rgba(236,114,0,.65);margin-bottom:34px;display:block}
.cta-title{font-family:var(--ff-d);font-weight:900;
  font-size:clamp(64px,12vw,172px);text-transform:uppercase;
  letter-spacing:-.035em;line-height:.82}
.cta-title .line{overflow:hidden;display:block;mix-blend-mode:screen}
.cta-title .li{display:block;will-change:transform}
.cta-title .reg{color:var(--c-orange);font-size:.24em;vertical-align:super}
.cta-divider{width:28px;height:1px;background:var(--c-orange);margin:48px auto 36px}
.cta-email{font-family:var(--ff-b);font-style:italic;
  font-size:clamp(18px,2.6vw,32px);color:var(--c-orange);
  border-bottom:1px solid rgba(236,114,0,.38);padding-bottom:4px;display:inline-block}
.cta-email:hover{border-color:var(--c-orange)}
.cta-marquee-wrap{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);
  white-space:nowrap;overflow:hidden;pointer-events:none;opacity:.04;z-index:1}
.cta-marquee-wrap span{font-family:var(--ff-d);font-weight:900;
  font-size:clamp(180px,30vw,460px);text-transform:uppercase;
  letter-spacing:-.03em;will-change:transform;display:inline-block}

/* ─── FOOTER STATEMENT ─── */
.foot-statement{padding:clamp(80px,10vw,140px) var(--pad);
  border-top:1px solid rgba(240,237,230,.07);text-align:center}
.foot-statement p{font-family:var(--ff-b);font-style:italic;
  font-size:clamp(22px,3.6vw,50px);color:rgba(240,237,230,.48);
  line-height:1.3;max-width:820px;margin:0 auto;text-wrap:pretty}
.foot-statement em{color:var(--c-white);font-style:italic}

/* ─── FOOTER ─── */
footer{padding:28px var(--pad);border-top:1px solid rgba(240,237,230,.08);
  background:var(--c-900);display:flex;align-items:center;
  justify-content:space-between;gap:20px;flex-wrap:wrap}
.foot-brand{display:flex;align-items:center;gap:9px}
.foot-brand img{width:16px;height:16px}
.foot-brand span{font-family:var(--ff-d);font-weight:700;font-size:12px;
  text-transform:uppercase;letter-spacing:.06em}
.foot-copy{font-family:var(--ff-m);font-size:9px;letter-spacing:.14em;color:rgba(240,237,230,.28)}
.foot-links{display:flex;gap:24px}
.foot-links a{font-family:var(--ff-m);font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(240,237,230,.32)}
.foot-links a:hover{color:var(--c-orange)}

/* ─── TWEAKS ─── */
#tweaks{position:fixed;bottom:20px;right:20px;z-index:9500;width:252px;
  background:rgba(12,12,12,.96);border:1px solid rgba(240,237,230,.12);
  backdrop-filter:blur(14px);padding:18px;display:none}
#tweaks.show{display:block}
.tw-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.tw-title{font-family:var(--ff-d);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.1em}
.tw-close{font-family:var(--ff-m);font-size:14px;color:rgba(240,237,230,.42);line-height:1}
.tw-close:hover{color:var(--c-orange)}
.tw-sec{font-family:var(--ff-m);font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(240,237,230,.32);margin:14px 0 8px}
.tw-seg{display:flex;gap:3px}
.tw-seg button{flex:1;font-family:var(--ff-m);font-size:9px;letter-spacing:.08em;text-transform:uppercase;
  padding:8px 4px;border:1px solid rgba(240,237,230,.13);color:rgba(240,237,230,.52);transition:all .2s}
.tw-seg button.on{background:var(--c-orange);border-color:var(--c-orange);color:var(--c-black)}
.tw-swatches{display:flex;gap:8px}
.tw-sw{width:28px;height:28px;border-radius:50%;border:2px solid transparent;transition:border-color .2s}
.tw-sw.on{border-color:var(--c-white)}
.tw-toggle{display:flex;align-items:center;justify-content:space-between}
.tw-toggle span{font-family:var(--ff-m);font-size:10px;letter-spacing:.06em;color:rgba(240,237,230,.62)}
.tw-switch{width:38px;height:20px;border-radius:10px;background:rgba(240,237,230,.13);
  position:relative;transition:background .2s}
.tw-switch.on{background:var(--c-orange)}
.tw-switch::after{content:'';position:absolute;top:3px;left:3px;width:14px;height:14px;
  border-radius:50%;background:var(--c-white);transition:transform .22s var(--ease-io)}
.tw-switch.on::after{transform:translateX(18px)}

/* ─── RESPONSIVE ─── */
@media(max-width:1100px){
  .mani-wrap{grid-template-columns:1fr}
  .mani-right{display:none}
  .essays-hall{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
  .stats-inner{grid-template-columns:1fr}
  .stat{border-right:none;border-bottom:1px solid rgba(240,237,230,.1)}
  .navo-img{display:none}
  .fmt-desc{display:none}
}
@media(max-width:768px){
  .nav-link,.nav-clock{display:none}
  #cursor-ring,#cursor-dot,#fmt-cursor-img{display:none!important}
  .sec-note{display:none}
  .partner-type{display:none}
  .essays-hall{grid-template-columns:repeat(2,1fr)}
  .narr-stage{height:auto;overflow:visible}
  .narr-track{overflow-x:auto;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;padding-bottom:24px;height:auto}
  .narr-photo,.narr-intro,.narr-quote{scroll-snap-align:start}
  .split-photo{width:34vw;opacity:.5}
  .split-quote{font-size:clamp(30px,8vw,52px)}
  .sign{width:90vw}
}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important}}

/* ═══════════════════ EXTRAS v5.1 ═══════════════════ */

/* ─── Cursor trail ─── */
.cursor-trail-dot{position:fixed;z-index:9996;pointer-events:none;border-radius:50%;
  background:var(--c-orange);left:-200px;top:-200px}

/* ─── Vertical edge text ─── */
.edge-text-wrap{position:fixed;right:14px;top:0;bottom:0;z-index:200;pointer-events:none;
  display:flex;align-items:center;justify-content:center}
.edge-text{font-family:var(--ff-m);font-size:7.5px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(240,237,230,.1);white-space:nowrap;
  writing-mode:vertical-rl;text-orientation:mixed}

/* ─── Formats — OFF-WHITE inversion ─── */
#formats{background:var(--c-white)}
#formats .sec-head .sec-eyebrow{color:rgba(7,7,7,.38)}
#formats .sec-head .sec-title{color:var(--c-black)}
#formats .sec-note{color:rgba(7,7,7,.32)}
#formats .fmt-list{border-top-color:rgba(7,7,7,.1)}
#formats .fmt-row{border-bottom-color:rgba(7,7,7,.08)}
#formats .fmt-row::before{background:var(--c-black)}
#formats .fmt-row:hover{padding-left:24px}
#formats .fmt-num{color:rgba(236,114,0,.7)}
#formats .fmt-name{color:rgba(7,7,7,.32);-webkit-text-stroke:0}
#formats .fmt-row:hover .fmt-name{color:var(--c-black)}
#formats .fmt-desc{color:rgba(7,7,7,.55)}
#formats .fmt-arrow{color:rgba(7,7,7,.6)}
#formats .fmt-row:hover .fmt-arrow{opacity:1;transform:translateX(0);color:var(--c-black)}

/* ═══════════════════ v5.2 — SPLIT · MARQUEE · SIGN · FOOTER ═══════════════════ */

/* ─── PARALLAX SPLIT ─── */
#split{position:relative;min-height:100svh;background:var(--c-black);
  overflow:hidden;display:flex;align-items:center;justify-content:center}
.split-photo{position:absolute;top:-9%;height:118%;
  width:clamp(180px,23vw,360px);overflow:hidden;z-index:1}
.split-photo img{width:100%;height:100%;object-fit:cover;
  filter:grayscale(.5) contrast(1.05) brightness(.82)}
.split-photo.split-l{left:0}
.split-photo.split-r{right:0}
.split-scrim{position:absolute;inset:0;
  background:linear-gradient(160deg,rgba(7,7,7,.74) 0%,rgba(7,7,7,.5) 100%)}
.split-l .split-scrim{background:linear-gradient(90deg,rgba(7,7,7,.35) 0%,rgba(7,7,7,.82) 100%)}
.split-r .split-scrim{background:linear-gradient(270deg,rgba(7,7,7,.35) 0%,rgba(7,7,7,.82) 100%)}
.split-center{position:relative;z-index:3;text-align:center;
  max-width:min(760px,72vw);padding:0 var(--pad)}
.split-bar{display:block;width:32px;height:2px;background:var(--c-orange);margin:0 auto clamp(28px,3.5vw,44px)}
.split-quote{font-family:var(--ff-d);font-weight:900;
  font-size:clamp(34px,5.4vw,82px);text-transform:uppercase;
  letter-spacing:-.03em;line-height:.92;color:var(--c-white);text-wrap:balance}
.split-attr{display:block;font-family:var(--ff-m);font-size:10px;
  letter-spacing:.22em;text-transform:uppercase;
  color:rgba(240,237,230,.4);margin-top:clamp(28px,3.5vw,44px)}

/* ─── LOGO MARQUEE (hover-slow) ─── */
.logo-marquee{margin-top:clamp(40px,5vw,72px);overflow:hidden;white-space:nowrap;
  border-top:1px solid rgba(240,237,230,.1);border-bottom:1px solid rgba(240,237,230,.1);
  padding:clamp(20px,2.4vw,32px) 0}
.logo-track{display:inline-flex;align-items:center;gap:clamp(28px,3.6vw,56px);will-change:transform}
.logo-mq-item{font-family:var(--ff-d);font-weight:900;
  font-size:clamp(24px,3.2vw,46px);text-transform:uppercase;letter-spacing:-.02em;
  color:transparent;-webkit-text-stroke:1px rgba(240,237,230,.28);
  transition:color .3s,-webkit-text-stroke-color .3s}
.logo-marquee:hover .logo-mq-item{-webkit-text-stroke-color:rgba(240,237,230,.5)}
.logo-mq-dot{width:7px;height:7px;border-radius:50%;background:var(--c-orange);flex-shrink:0}
#partners .logo-marquee{margin-left:var(--pad);margin-right:var(--pad)}

/* (signature removed) */
#contact .cta-content{position:relative;z-index:auto}
#contact{isolation:isolate}

/* ─── FOOTER (clip reveal base) ─── */
.foot-statement{position:relative;z-index:1}

/* ─── SOCIAL — Instagram grid (inside rounded footer panel) ─── */
#social{padding:clamp(60px,8vw,110px) var(--pad) clamp(40px,5vw,72px)}
.social-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px}
.social-item{position:relative;aspect-ratio:1;overflow:hidden;display:block;background:var(--c-black)}
.social-img{width:100%;height:100%;object-fit:cover;
  filter:grayscale(.4) contrast(1.05) brightness(.86)}
.social-ov{position:absolute;inset:0;background:rgba(7,7,7,.5);
  opacity:0;transition:opacity .16s ease;
  display:flex;align-items:center;justify-content:center;gap:10px}
.social-item:hover .social-ov{opacity:1}
.social-tag{font-family:var(--ff-d);font-weight:700;font-size:clamp(13px,1.4vw,17px);
  text-transform:uppercase;letter-spacing:.04em;color:var(--c-white)}
.social-arrow{font-family:var(--ff-m);font-size:14px;color:var(--c-orange)}
.social-follow{display:inline-flex;align-items:center;gap:10px;
  margin-top:clamp(28px,3.4vw,44px);
  font-family:var(--ff-m);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(240,237,230,.6);transition:color .16s ease}
.social-follow span{color:var(--c-orange);transition:transform .2s ease}
.social-follow:hover{color:var(--c-white)}
.social-follow:hover span{transform:translateX(5px)}
@media (max-width:640px){.social-grid{grid-template-columns:repeat(2,1fr)}}

/* ─── BLOB / CONTOUR TEXTURE (adapted: monochrome, quiet) ─── */
.split-contours{position:absolute;inset:0;z-index:2;pointer-events:none;
  background:url('../assets/contours.svg') center/min(132vh,1240px) no-repeat;
  opacity:.16;mix-blend-mode:screen}

/* ─── ROUNDED FOOTER PANEL (adapted: restrained radius, clip-reveal) ─── */
.site-foot{position:relative;z-index:1;background:var(--c-900);
  border-radius:clamp(20px,3vw,40px) clamp(20px,3vw,40px) 0 0;
  overflow:hidden}
.site-foot .foot-statement{border-top:none}
.site-foot footer{border-top:1px solid rgba(240,237,230,.08)}

/* ── notch bite at top-center of footer panel ── */
.site-foot::before{content:'';position:absolute;top:0;left:50%;
  transform:translateX(-50%);
  width:clamp(90px,12vw,160px);height:clamp(26px,3.2vw,44px);
  background:var(--c-black);border-radius:0 0 50% 50%;z-index:5;pointer-events:none}

/* ══════════════════════════════════════════
   CTA — pure black, no image, bigger title
   ══════════════════════════════════════════ */
.cta-bg{display:none!important}
#contact{background:var(--c-black)!important;min-height:0!important;padding:clamp(64px,8vw,120px) var(--pad)!important;position:relative!important}
.cta-title{font-size:clamp(100px,17vw,260px)!important}


/* ══════════════════════════════════════════
   FOOTER V2 — LN-STYLE 3-COLUMN
   ══════════════════════════════════════════ */
.foot-main{display:grid;grid-template-columns:1fr 1fr 1fr;
  position:relative;min-height:clamp(380px,44vw,640px)}

.foot-col{padding:clamp(32px,4vw,56px) var(--pad);display:flex;flex-direction:column;
  justify-content:space-between}

.foot-col-label{font-family:var(--ff-m);font-size:9px;letter-spacing:.24em;
  text-transform:uppercase;color:rgba(240,237,230,.26)}

/* left nav links */
.foot-nav-big{display:flex;flex-direction:column;gap:0}
.foot-nav-big a{font-family:var(--ff-d);font-weight:900;
  font-size:clamp(22px,2.8vw,44px);text-transform:uppercase;
  letter-spacing:-.03em;line-height:.96;
  color:rgba(240,237,230,.18);transition:color .22s;padding:.14em 0;
  border-bottom:1px solid rgba(240,237,230,.06)}
.foot-nav-big a:last-child{border-bottom:none}
.foot-nav-big a:hover{color:var(--c-white)}
.foot-nav-accent{color:var(--c-orange)!important}
.foot-nav-accent:hover{color:var(--c-white)!important}

/* center column — full-bleed image */
.foot-col-c{padding:0;position:relative;overflow:hidden;
  border-left:1px solid rgba(240,237,230,.07);
  border-right:1px solid rgba(240,237,230,.07)}
.foot-vis{position:absolute;inset:0}
.foot-vis img{width:100%;height:100%;object-fit:cover;
  filter:grayscale(.6) contrast(1.1) brightness(.55);
  transition:filter .5s}
.foot-col-c:hover .foot-vis img{filter:grayscale(.3) contrast(1.08) brightness(.65)}
.foot-vis-scrim{position:absolute;inset:0;
  background:linear-gradient(180deg,
    rgba(7,7,7,.3) 0%,
    rgba(7,7,7,0) 40%,
    rgba(7,7,7,.7) 100%)}
.foot-contact-btn{position:absolute;bottom:clamp(20px,3vw,36px);left:50%;
  transform:translateX(-50%);
  display:inline-flex;align-items:center;gap:10px;white-space:nowrap;
  padding:.55em 1.4em;
  font-family:var(--ff-d);font-weight:900;
  font-size:clamp(12px,1.2vw,16px);text-transform:uppercase;letter-spacing:.12em;
  color:var(--c-black);background:var(--c-orange);
  border-radius:999px;transition:background .2s,transform .2s;z-index:2}
.foot-contact-btn:hover{background:var(--c-white);transform:translateX(-50%) translateY(-2px)}
.foot-btn-arrow{transition:transform .2s}
.foot-contact-btn:hover .foot-btn-arrow{transform:translateX(3px)}

/* left brand mark */
.foot-brand-mark{display:flex;align-items:center;gap:10px}
.foot-brand-mark img{width:28px;height:28px;object-fit:contain}
.foot-brand-mark .foot-col-label{margin:0;line-height:1}

/* right social */
.foot-col-r{align-items:flex-end;text-align:right}
.foot-tagline{font-family:var(--ff-d);font-weight:900;
  font-size:clamp(16px,2vw,28px);text-transform:uppercase;
  letter-spacing:-.02em;line-height:.95;
  color:rgba(240,237,230,.55);margin:0}
.foot-social-wrap{display:flex;flex-direction:column;align-items:flex-end;gap:16px}
.foot-social-big{display:flex;flex-direction:column;align-items:flex-end;gap:0}
.foot-social-big a{font-family:var(--ff-d);font-weight:900;
  font-size:clamp(22px,2.8vw,44px);text-transform:uppercase;
  letter-spacing:-.03em;line-height:.96;
  color:rgba(240,237,230,.18);transition:color .22s;padding:.14em 0;
  border-bottom:1px solid rgba(240,237,230,.06)}
.foot-social-big a:last-child{border-bottom:none}
.foot-social-big a:hover{color:var(--c-white)}
.foot-social-stats{display:flex;flex-direction:column;
  align-items:flex-end;gap:5px;font-family:var(--ff-m);font-size:9px;
  letter-spacing:.18em;text-transform:uppercase;color:rgba(240,237,230,.24)}

/* partner logos strip inside footer */
.foot-logos-strip{overflow:hidden;white-space:nowrap;
  border-top:1px solid rgba(240,237,230,.08);
  border-bottom:1px solid rgba(240,237,230,.08);
  padding:clamp(16px,2.2vw,26px) 0}
.foot-logos-track{display:inline-flex;align-items:center;
  gap:clamp(24px,3.2vw,48px);will-change:transform;
  animation:footMQ 26s linear infinite}
.foot-logos-strip:hover .foot-logos-track{animation-play-state:paused}
@keyframes footMQ{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* footer bottom strip */
.site-foot footer{padding:clamp(18px,2.2vw,28px) var(--pad);
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* mobile */
@media(max-width:860px){
  .foot-main{grid-template-columns:1fr;min-height:auto}
  .foot-col-c{min-height:80vw;border:none;
    border-top:1px solid rgba(240,237,230,.07);
    border-bottom:1px solid rgba(240,237,230,.07)}
  .foot-col-r{align-items:flex-start;text-align:left}
  .foot-social-big{align-items:flex-start}
  .foot-social-big a{border-bottom:1px solid rgba(240,237,230,.06)}
  .foot-social-stats{align-items:flex-start}
  .site-foot::before{display:none}
}

/* ═══════════════════════════════════════════════════════════════
   v6 — MOTION SYSTEM: WebGL · blur-reveal · hover-zoom · depth
   ═══════════════════════════════════════════════════════════════ */

/* ─── WebGL hero depth layer (sits above photo, below scrim) ─── */
#hero-webgl{position:absolute;inset:0;width:100%;height:100%;z-index:1;
  mix-blend-mode:screen;pointer-events:none;opacity:.92;display:none}
body.webgl-on #hero-webgl{display:block}
body.webgl-on #hero-canvas{display:none}      /* 2D canvas is the fallback only */
.hero-scrim{z-index:2}
#hero-canvas{z-index:1}
#hero-grain{z-index:4}

/* ─── Text reveal — blur + y + opacity (SplitText-style words) ─── */
.reveal-line{display:block;overflow:hidden}
.reveal-w{display:inline-block;will-change:transform,filter,opacity}
.reveal-pending .reveal-w{opacity:0;transform:translateY(0.5em);filter:blur(11px)}
@media(prefers-reduced-motion:reduce){
  .reveal-pending .reveal-w{opacity:1;transform:none;filter:none}
}

/* ─── Scene exit (set as will-change targets) ─── */
.scene-content{will-change:transform,filter,opacity}

/* ─── 3-layer parallax targets ─── */
[data-depth]{will-change:transform}

/* ─── HOVER-ZOOM (cinematic) — overrides DS color-only when body.zoom-hover ─── */
body.zoom-hover .work-card-media,
body.zoom-hover .narr-img-wrap,
body.zoom-hover .mani-photo-wrap,
body.zoom-hover .social-item{overflow:hidden}

body.zoom-hover .work-card-img{transition:filter .5s,transform .85s var(--ease-out)}
body.zoom-hover .work-card:hover .work-card-img{transform:scale(1.08)}
body.zoom-hover .work-card-foot{transition:transform .5s var(--ease-out)}
body.zoom-hover .work-card:hover .work-card-foot{transform:translateX(6px)}

body.zoom-hover .narr-img-wrap img{transition:filter .5s,transform .9s var(--ease-out)}
body.zoom-hover .narr-photo:hover .narr-img-wrap img{transform:scale(1.07)}

body.zoom-hover .mani-photo{transition:filter .6s,transform .9s var(--ease-out)}
body.zoom-hover .mani-photo-wrap:hover .mani-photo{transform:scale(1.06)}

body.zoom-hover .social-img{transition:filter .5s,transform .8s var(--ease-out)}
body.zoom-hover .social-item:hover .social-img{transform:scale(1.09)}

/* essay cards already crossfade; add a touch more travel on hover */
body.zoom-hover .essay-card:hover .essay-hover{transform:scale(1.06)}

/* calm motion → kill skew + soften parallax (driven by tweak) */
body.motion-calm .sec-title{transform:none}

/* ═══════════════════════════════════════════════════════════════
   v6.1 — CINEMA LAYER: char/line type · magnetic · cursor states ·
          continuous ambient · velocity blur · camera
   ═══════════════════════════════════════════════════════════════ */

/* ─── Typography: character-level (hero) + line-level (sec titles) ─── */
.hc{display:inline-block;will-change:transform,opacity}
.reveal-line{display:block;overflow:hidden}
.reveal-li{display:inline-block;will-change:transform,filter,opacity}

/* ─── Cursor ecosystem — labelled state (view/read/explore/watch) ─── */
#cursor-ring{transition:width .4s var(--ease-out),height .4s var(--ease-out),
  border-color .3s,background .3s,rotate .5s var(--ease-out)}
#cursor-ring.labelled{width:96px;height:96px;background:rgba(236,114,0,.12);
  border-color:transparent;rotate:6deg}
#cursor-ring.labelled .cursor-label{opacity:1}

/* ─── Continuous ambient: breathing media (uses standalone `scale` so it
       composes with GSAP transform parallax instead of fighting it) ─── */
@keyframes ihBreath{from{scale:1}to{scale:1.035}}
.breathe{animation:ihBreath 11s ease-in-out infinite alternate}

/* ─── Ambient accent layer — slow drifting warm light per scene ─── */
@keyframes ihDrift{
  0%{translate:-3% -2%;opacity:.5}
  100%{translate:4% 3%;opacity:.9}
}
.ambient-glow{position:absolute;inset:-10%;z-index:0;pointer-events:none;
  background:radial-gradient(48% 42% at 34% 38%,rgba(236,114,0,.07),transparent 72%);
  animation:ihDrift 19s ease-in-out infinite alternate;mix-blend-mode:screen}
.mani-pin{position:relative}
#stats{position:relative;overflow:hidden}
#stats .stats-inner{position:relative;z-index:1}

/* ─── Scroll-velocity blur — appended to each graded image's own filter via
       the --velo var (set 0..1 in JS); defaults to 0 so grading is untouched ─── */

@media(prefers-reduced-motion:reduce){
  .breathe{animation:none!important}
  .ambient-glow{display:none}
}
body.motion-calm .breathe{animation:none}
body.motion-calm .ambient-glow{opacity:.25;animation:none}