@font-face{font-family:"Anton";src:url(fonts/anton-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(fonts/instrument-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(fonts/instrument-sans-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(fonts/instrument-sans-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url(fonts/instrument-serif-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url(fonts/instrument-serif-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(fonts/jetbrains-mono-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(fonts/jetbrains-mono-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
/* =========================================================
   Gaze Media — styles
   Brand: Kumari third eye. Red #c32026, deep red #7d1518, yellow #ffd23a.
   ========================================================= */
:root{
  --red:#c32026; --red-2:#a3181e; --red-d:#7d1518; --blood:#2a0a0b;
  --yellow:#ffd23a; --yellow-2:#ffe46b;
  --ink:#140a0a; --ink-2:#221313; --ink-3:#2e1a1a;
  --paper:#f6efe4; --paper-2:#efe5d5; --line-l:#e2d6c3; --line-d:#3a2323;
  --mute-l:#76695c; --mute-d:#b59d95;
  --display:"Anton","Impact","Haettenschweiler","Arial Narrow Bold",sans-serif;
  --serif:"Instrument Serif",Georgia,serif;
  --body:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --gut:16px; --r:28px;
  --ease:cubic-bezier(.2,.8,.2,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
  color-scheme:light;
}
@media (min-width:760px){:root{--gut:28px}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img,video{max-width:100%;display:block}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--yellow);outline-offset:3px;border-radius:6px}
::selection{background:var(--yellow);color:var(--ink)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--red);flex:none}
.eyebrow{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 18px;color:var(--mute-l)}
.h2{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(40px,6vw,88px);line-height:.92;letter-spacing:-.005em;margin:0}
.h2.big{font-size:clamp(48px,8.4vw,132px)}
.h2 em,.def-list em,.statement em{font-family:var(--serif);font-style:italic;text-transform:none;font-weight:400;letter-spacing:-.01em;color:var(--red)}
section{position:relative}

/* ---------- grain ---------- */
.grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-2%)}60%{transform:translate(-2%,-4%)}80%{transform:translate(4%,2%)}100%{transform:translate(0,0)}}

/* ---------- pills ---------- */
.pill{position:relative;display:inline-flex;align-items:center;justify-content:center;height:52px;padding:0 26px;border-radius:999px;font-weight:600;font-size:15px;overflow:hidden;isolation:isolate;white-space:nowrap;transition:transform .4s var(--ease)}
.pill .t{position:relative;z-index:1;transition:color .4s var(--ease)}
.pill::before{content:"";position:absolute;inset:0;border-radius:inherit;transform:translateY(101%);transition:transform .5s var(--ease-io);z-index:0}
.pill:hover::before{transform:none}
.pill-yellow{background:var(--yellow);color:var(--ink)}.pill-yellow::before{background:#fff}
.pill-red{background:var(--red);color:#fff}.pill-red::before{background:var(--ink)}
.pill-ink{background:var(--ink);color:var(--paper)}.pill-ink::before{background:var(--red)}
.pill-ghost{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.6)}.pill-ghost::before{background:#fff}.pill-ghost:hover .t{color:var(--ink)}

/* ---------- cursor ---------- */
.cursor{position:fixed;left:0;top:0;z-index:100;pointer-events:none;display:none;mix-blend-mode:normal}
@media (pointer:fine){.cursor{display:block}}
.cursor .pt{position:absolute;width:6px;height:6px;margin:-3px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 1.5px var(--ink)}
.cursor .ring{position:absolute;width:38px;height:38px;margin:-19px;border-radius:50%;border:1.5px solid rgba(255,210,58,.9);display:grid;place-items:center;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .35s,border-color .35s}
.cursor .label{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);opacity:0;transition:opacity .2s}
.cursor.on .ring{width:86px;height:86px;margin:-43px;background:var(--yellow);border-color:var(--yellow)}
.cursor.on .label{opacity:1}
.cursor.hide{opacity:0}

/* ---------- intro ---------- */
.intro{position:fixed;inset:0;z-index:200;background:#050202;display:grid;place-items:center;color:var(--paper);overflow:hidden}
.no-intro .intro,.no-intro .iris-wipe{display:none}
.intro-eye{width:min(72vw,480px);overflow:visible;will-change:transform}
.intro-words{position:absolute;left:0;right:0;bottom:16vh;display:flex;justify-content:center;gap:.25em;font-family:var(--display);font-size:clamp(34px,6vw,72px);text-transform:uppercase;letter-spacing:.01em}
.intro-words span{display:inline-block;opacity:0;transform:translateY(40%)}
.intro-words span:last-child{color:var(--yellow)}
.intro-meta{position:absolute;left:var(--gut);right:var(--gut);bottom:var(--gut);display:flex;justify-content:space-between;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#8d7a74}
.intro-skip{position:absolute;top:var(--gut);right:var(--gut);font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#8d7a74;padding:8px 12px}
.iris-wipe{position:fixed;left:50%;top:50%;width:10px;height:10px;margin:-5px;border-radius:50%;background:#000;z-index:199;pointer-events:none;transform:scale(0)}
body.intro-on{overflow:hidden}

/* ---------- nav ---------- */
.nav{position:fixed;top:12px;left:var(--gut);right:var(--gut);z-index:60;display:flex;align-items:center;gap:14px;padding:8px 8px 8px 14px;border-radius:999px;
  background:rgba(246,239,228,.86);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);box-shadow:0 10px 30px -18px rgba(20,10,10,.5);transition:transform .5s var(--ease)}
.nav.hidden{transform:translateY(-140%)}
.logo img{height:40px;width:auto}
.links{display:none;margin:0 auto;gap:4px}
.links a{position:relative;padding:8px 13px;border-radius:999px;font-size:14px;font-weight:500;transition:background .3s}
.links a:hover,.links a.on{background:var(--ink);color:var(--paper)}
.nav-cta{display:none;height:44px;padding:0 20px;font-size:14px}
.menu-btn{margin-left:auto;display:flex;align-items:center;gap:10px;height:44px;padding:0 18px;border-radius:999px;background:var(--ink);color:var(--paper);font-size:14px;font-weight:500}
.menu-btn i{position:relative;width:14px;height:8px}
.menu-btn i::before,.menu-btn i::after{content:"";position:absolute;left:0;right:0;height:1.6px;background:currentColor;transition:transform .4s var(--ease),top .4s var(--ease)}
.menu-btn i::before{top:0}.menu-btn i::after{top:6px}
.menu-btn[aria-expanded="true"] i::before{top:3px;transform:rotate(45deg)}
.menu-btn[aria-expanded="true"] i::after{top:3px;transform:rotate(-45deg)}
@media (min-width:1000px){.links{display:flex}.nav-cta{display:inline-flex}.menu-btn{display:none}}
.drawer{position:fixed;inset:0;z-index:55;background:var(--red);color:#fff;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:90px var(--gut) 40px;
  clip-path:circle(0 at calc(100% - 50px) 34px);transition:clip-path .7s var(--ease-io);visibility:hidden}
.drawer.open{clip-path:circle(150% at calc(100% - 50px) 34px);visibility:visible}
.drawer a{font-family:var(--display);font-size:clamp(44px,13vw,80px);text-transform:uppercase;line-height:1.02}
.drawer a:last-child{font-family:var(--mono);font-size:14px;margin-top:20px;color:var(--yellow)}

/* ---------- hero ---------- */
.hero{padding:var(--gut);padding-top:var(--gut)}
.hero-stage{position:relative;min-height:calc(100svh - var(--gut)*2);border-radius:var(--r);background:var(--red);color:#fff;overflow:hidden;
  display:flex;flex-direction:column;padding:clamp(80px,11vh,110px) clamp(16px,3vw,40px) clamp(20px,3vw,36px);transform-origin:50% 0;isolation:isolate}
.hero-stage::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(120% 80% at 50% 45%,transparent 30%,rgba(60,4,6,.55) 100%)}
.hero-rays{position:absolute;inset:0;width:100%;height:100%;z-index:-1;opacity:.9}
.hero-top{display:flex;justify-content:flex-end;align-items:flex-start;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.hero-top .live{display:flex;align-items:center;gap:8px}
.hero-top .live .dot{background:var(--yellow);animation:recblink 1.2s steps(1) infinite}
@keyframes recblink{50%{opacity:.2}}
.hero-loc{text-align:right}
.hero-title{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:24px 0 clamp(24px,8vh,120px);font-family:var(--display);font-weight:400;line-height:.82;text-align:center;font-size:clamp(84px,27vw,200px);letter-spacing:-.01em}
.ht-row{display:block;overflow:hidden;padding:.04em .02em 0}
.ht-word{display:inline-block;color:var(--paper)}
.ht-2 .ht-word{color:var(--yellow)}
.ht-word .ch{display:inline-block;will-change:transform}
.ht-eye-row{display:block;padding:.04em 0}
.eye{display:inline-block;width:1.52em;height:1em;vertical-align:middle;position:relative;perspective:600px}
.eye svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 18px 26px rgba(50,0,4,.45)) drop-shadow(0 0 36px rgba(255,210,58,.35));transform-origin:50% 40%;will-change:transform}
@media (min-width:900px){
  .hero-title{flex-direction:row;flex-wrap:nowrap;gap:.12em;font-size:clamp(90px,min(12vw,23vh),230px);margin-top:0}
  .ht-eye-row{order:0}
}
.hero-bottom{display:grid;gap:22px;align-items:end;position:relative;z-index:2}
.hero-copy{max-width:44ch;margin:0;font-size:clamp(16px,1.35vw,19px);color:rgba(255,255,255,.9)}
.hero-btns{display:flex;flex-wrap:wrap;gap:10px}
@media (min-width:900px){.hero-bottom{grid-template-columns:auto 1fr;gap:40px}.hero-btns{justify-content:flex-start}}

.reel{margin:0;position:absolute;width:clamp(120px,11vw,180px);aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:#000;
  box-shadow:0 30px 60px -20px rgba(30,0,0,.7),0 0 0 3px rgba(255,255,255,.12);z-index:1}
.reel video{width:100%;height:100%;object-fit:cover}
.reel figcaption{position:absolute;left:8px;right:8px;bottom:8px;display:flex;gap:6px;align-items:center;font-family:var(--mono);font-size:9.5px;line-height:1.3;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.reel figcaption .dot{width:6px;height:6px;background:var(--yellow)}
.reel-a{right:clamp(160px,14vw,250px);bottom:-70px;transform:rotate(-7deg)}
.reel-b{right:clamp(20px,2.5vw,44px);bottom:-20px;transform:rotate(6deg)}
@media (min-width:900px){.hero-bottom{padding-right:clamp(300px,26vw,440px)}}
@media (max-width:899px){
  .hero-stage{padding-bottom:20px}
  .reel{position:relative;right:auto;bottom:auto;width:42%;max-width:200px}
  .reel-row{display:flex;justify-content:center;gap:4%;margin-top:28px}
  .reel-a{transform:rotate(-5deg)}.reel-b{transform:rotate(4deg) translateY(16px)}
}
.scroll-hint{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);display:none;flex-direction:column;align-items:center;gap:8px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.scroll-hint i{width:1px;height:34px;background:linear-gradient(to bottom,rgba(255,255,255,.7),transparent);animation:hint 1.8s var(--ease) infinite;transform-origin:top}
@keyframes hint{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
@media (min-width:900px){.scroll-hint{display:flex}}

/* ---------- marquee ---------- */
.marquee{overflow:hidden;padding:26px 0;border-bottom:1px solid var(--line-l)}
.marquee-track{display:flex;width:max-content}
.marquee-track span{display:flex;align-items:center;gap:.6em;padding-right:.6em;font-family:var(--display);font-size:clamp(34px,5vw,64px);text-transform:uppercase;white-space:nowrap;line-height:1}
.marquee-track b{color:var(--red);font-weight:400;font-size:.7em}

/* ---------- definition ---------- */
.define{display:grid;gap:clamp(40px,6vw,90px);padding:clamp(70px,10vw,140px) var(--gut);max-width:1400px;margin:0 auto}
@media (min-width:980px){.define{grid-template-columns:.9fr 1.1fr;align-items:center}}
.def-card{background:var(--ink);color:var(--paper);border-radius:var(--r);padding:clamp(26px,4vw,48px);transform:rotate(-2deg);box-shadow:0 40px 70px -40px rgba(20,10,10,.8)}
.def-head{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;border-bottom:1px solid var(--line-d);padding-bottom:18px;margin-bottom:22px}
.def-word{font-family:var(--display);font-weight:400;font-size:clamp(80px,12vw,170px);line-height:.85;margin:0;color:var(--yellow)}
.def-ipa{font-family:var(--mono);font-size:14px;color:var(--mute-d)}
.def-list{list-style:none;margin:0;padding:0;font-size:clamp(22px,2.6vw,34px);line-height:1.25}
.def-list li{display:flex;gap:16px}
.def-list li span{font-family:var(--mono);font-size:.5em;color:var(--mute-d);padding-top:.5em}
.def-list em{color:var(--yellow)}
.statement{font-family:var(--serif);font-size:clamp(26px,3.3vw,48px);line-height:1.12;letter-spacing:-.01em;margin:0}
.statement .w{opacity:.16;transition:opacity .25s}
.statement .w.lit{opacity:1}

/* ---------- third eye ---------- */
.thirdeye{padding:0 var(--gut) clamp(70px,10vw,140px)}
.te-grid{display:grid;gap:clamp(30px,5vw,70px);max-width:1400px;margin:0 auto;background:var(--paper-2);border-radius:var(--r);padding:clamp(16px,3vw,40px);align-items:center}
@media (min-width:900px){.te-grid{grid-template-columns:.8fr 1.2fr}}
.te-img{border-radius:20px;overflow:hidden;aspect-ratio:4/5;background:var(--red-d)}
.te-img img{width:100%;height:115%;object-fit:cover;will-change:transform}
.te-copy p{font-size:clamp(16px,1.3vw,18px);max-width:52ch;color:#4a3d36}
.te-copy .h2{margin-bottom:20px}
.te-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:34px}
.te-stats div{border-top:2px solid var(--ink);padding-top:12px}
.te-stats b{display:block;font-family:var(--display);font-weight:400;font-size:clamp(38px,5vw,72px);line-height:1;color:var(--red)}
.te-stats span{display:block;font-size:13px;line-height:1.35;color:var(--mute-l);margin-top:6px}

/* ---------- section heads ---------- */
.sec-head{max-width:1400px;margin:0 auto clamp(34px,5vw,64px);padding:0 var(--gut)}
.sec-sub{max-width:48ch;font-size:clamp(16px,1.3vw,18px);color:var(--mute-l);margin:18px 0 0}

/* ---------- services ---------- */
.services{background:var(--ink);color:var(--paper);border-radius:var(--r);margin:0 var(--gut);padding:clamp(60px,8vw,120px) 0}
.services .eyebrow{color:var(--mute-d)}
.services .eyebrow .dot{background:var(--yellow)}
.services .h2 em{color:var(--yellow)}
.svc-list{max-width:1400px;margin:0 auto;padding:0 var(--gut)}
.svc{border-top:1px solid var(--line-d)}
.svc:last-child{border-bottom:1px solid var(--line-d)}
.svc-row{width:100%;display:grid;grid-template-columns:48px 1fr 40px;align-items:center;gap:12px;padding:clamp(18px,2.4vw,30px) 0;text-align:left;position:relative}
.svc-row .idx{font-family:var(--mono);font-size:13px;color:var(--mute-d)}
.svc-row .name{font-family:var(--display);font-size:clamp(30px,4.6vw,72px);text-transform:uppercase;line-height:.95;transition:transform .5s var(--ease),color .3s}
.svc-row:hover .name{transform:translateX(14px);color:var(--yellow)}
.plus{position:relative;width:36px;height:36px;border-radius:50%;box-shadow:inset 0 0 0 1.5px currentColor;justify-self:end;transition:transform .5s var(--ease),background .3s}
.plus::before,.plus::after{content:"";position:absolute;left:50%;top:50%;width:13px;height:1.6px;margin:-.8px -6.5px;background:currentColor}
.plus::after{transform:rotate(90deg);transition:transform .5s var(--ease)}
.svc.open .plus,.fq.open .plus{transform:rotate(180deg);background:var(--yellow);color:var(--ink);box-shadow:none}
.svc.open .plus::after,.fq.open .plus::after{transform:rotate(0)}
.svc-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease)}
.svc.open .svc-body{grid-template-rows:1fr}
.svc-body>div{overflow:hidden}
.svc-inner{display:grid;gap:18px;padding:0 0 30px 60px;max-width:900px}
.svc-inner p{margin:0;font-size:17px;color:#d8c9c3;max-width:56ch}
.tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.tags li{font-family:var(--mono);font-size:12px;padding:7px 12px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-d);color:#e9dcd4}
.good span{display:block;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--yellow);margin-bottom:4px}
@media (max-width:640px){.svc-inner{padding-left:0}.svc-row{grid-template-columns:34px 1fr 40px}}

/* ---------- work (horizontal) ---------- */
.work{padding:clamp(70px,10vw,140px) 0}
.work-pin{overflow:hidden}
.work-head{max-width:1400px;margin:0 auto 40px;padding:0 var(--gut);display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px}
.work-head .eyebrow{width:100%;margin-bottom:-4px}
.work-track{display:flex;gap:var(--gut);padding:0 var(--gut);width:max-content;will-change:transform}
.pcard{position:relative;flex:none;width:min(78vw,460px);aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;color:#fff;background:var(--tint,#333);display:flex;flex-direction:column;justify-content:space-between;padding:20px;isolation:isolate}
.pcard .cover{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.pcard::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.15),transparent 40%,rgba(0,0,0,.7))}
.pcard .art{position:absolute;inset:0;z-index:-2;overflow:hidden}
.pcard .art i{position:absolute;border-radius:50%;filter:blur(30px);opacity:.7}
.pcard .art .vf{position:absolute;inset:18px;border:1px solid rgba(255,255,255,.25);border-radius:14px}
.pcard .art .big-eye{position:absolute;right:-12%;top:18%;width:70%;opacity:.16;transition:transform 1s var(--ease)}
.pcard:hover .cover,.pcard:hover .big-eye{transform:scale(1.06)}
.pc-top{display:flex;justify-content:space-between;gap:10px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.pc-top .tag{padding:6px 10px;border-radius:999px;background:rgba(0,0,0,.35);backdrop-filter:blur(6px)}
.pc-top .num{opacity:.75}
.pcard h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(36px,4vw,56px);line-height:.92;margin:0 0 10px}
.pcard p{margin:0;font-size:15px;max-width:34ch;opacity:.92}
.pcard .open{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--yellow)}
.pcard.more{background:var(--yellow);color:var(--ink);justify-content:center;align-items:flex-start}
.pcard.more::before{display:none}
.pcard.more h3{font-size:clamp(46px,5vw,72px)}
@media (max-width:999px){.work-track{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:none}.work-track::-webkit-scrollbar{display:none}.pcard{scroll-snap-align:center}}

/* ---------- team ---------- */
.team{padding:clamp(40px,6vw,80px) 0 clamp(70px,10vw,140px)}
.team-grid{max-width:1400px;margin:0 auto;padding:0 var(--gut);display:grid;gap:var(--gut);grid-template-columns:repeat(2,1fr)}
@media (min-width:900px){.team-grid{grid-template-columns:repeat(3,1fr)}}
.member{position:relative;border-radius:22px;overflow:hidden;background:var(--paper-2);aspect-ratio:3/4;isolation:isolate;transform-style:preserve-3d}
.member .ph{position:absolute;inset:0;z-index:-1}
.member .ph img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;transition:transform .9s var(--ease)}
.member:hover .ph img{transform:scale(1.06)}
.member .ph::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--gx,50%) var(--gy,0%),rgba(255,230,140,.35),transparent 45%);opacity:0;transition:opacity .4s;pointer-events:none}
.member:hover .ph::after{opacity:1}
.member .mono{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--display);font-size:clamp(70px,11vw,160px);color:var(--red);opacity:.9;transition:transform .8s var(--ease)}
.member .mono::after{content:"";position:absolute;width:62%;aspect-ratio:1;border-radius:50%;border:1.5px dashed rgba(195,32,38,.35);animation:spin 18s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.member:nth-child(3n+2){background:var(--red)}.member:nth-child(3n+2) .mono{color:var(--yellow)}.member:nth-child(3n+2) .mono::after{border-color:rgba(255,210,58,.4)}
.member:nth-child(3n+3){background:var(--ink)}.member:nth-child(3n+3) .mono{color:var(--paper)}.member:nth-child(3n+3) .mono::after{border-color:rgba(246,239,228,.25)}
.member .info{position:absolute;left:10px;right:10px;bottom:10px;padding:14px;border-radius:16px;background:rgba(246,239,228,.94);backdrop-filter:blur(8px);color:var(--ink)}
.member h3{margin:0;font-size:clamp(15px,1.4vw,19px);font-weight:600;line-height:1.2}
.member .role{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--red);margin-top:4px}
.member .note{margin:0;font-size:14px;line-height:1.4;color:#4a3d36;max-height:0;overflow:hidden;opacity:0;transition:max-height .5s var(--ease),opacity .4s,margin .4s}
.member:hover .note,.member:focus-within .note{max-height:80px;opacity:1;margin-top:8px}
.member .num{position:absolute;top:14px;left:14px;font-family:var(--mono);font-size:11px;opacity:.6}
.member:nth-child(3n+2) .num,.member:nth-child(3n+3) .num{color:#fff}
@media (max-width:600px){.member .info{padding:10px}.member h3{font-size:14px}.member .role{font-size:9.5px}}

/* ---------- process ---------- */
.process{background:var(--red);color:#fff;border-radius:var(--r);margin:0 var(--gut);overflow:hidden}
.process .eyebrow{color:rgba(255,255,255,.75)}.process .eyebrow .dot{background:var(--yellow)}
.process .h2 em{color:var(--yellow)}

/* ---------- faq ---------- */
.faq-sec{padding:clamp(70px,10vw,140px) 0}
.faq{max-width:1100px;margin:0 auto;padding:0 var(--gut)}
.fq{border-top:1px solid var(--line-l)}.fq:last-child{border-bottom:1px solid var(--line-l)}
.fq-btn{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:24px 0;text-align:left;font-size:clamp(19px,2vw,26px);font-weight:500}
.fq-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
.fq.open .fq-body{grid-template-rows:1fr}
.fq-body>div{overflow:hidden}
.fq-body p{margin:0 0 24px;max-width:60ch;color:#4a3d36;font-size:17px}

/* ---------- contact ---------- */
.contact{background:var(--ink);color:var(--paper);border-radius:var(--r);margin:0 var(--gut);padding:clamp(60px,8vw,110px) var(--gut)}
.contact .eyebrow{color:var(--mute-d)}.contact .eyebrow .dot{background:var(--yellow)}
.contact .h2 em{color:var(--yellow)}
.contact-grid{display:grid;gap:50px;max-width:1400px;margin:0 auto}
@media (min-width:1000px){.contact-grid{grid-template-columns:1fr 1fr;gap:80px}}
.reach{margin-top:36px}
.reach>*{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-top:1px solid var(--line-d);font-size:16px}
.reach>* span:first-child{color:var(--mute-d)}
.reach a:hover span:last-child{color:var(--yellow)}
.form-grid{display:grid;gap:14px}
@media (min-width:600px){.form-grid{grid-template-columns:1fr 1fr}.field.full{grid-column:1/-1}}
.field{position:relative}
.field input,.field select{width:100%;height:60px;border-radius:14px;border:1px solid var(--line-d);background:var(--ink-2);color:var(--paper);font:inherit;font-size:16px;padding:22px 16px 6px;outline:none;transition:border-color .3s,background .3s;-webkit-appearance:none;appearance:none}
.field select{cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--mute-d) 50%),linear-gradient(135deg,var(--mute-d) 50%,transparent 50%);background-position:calc(100% - 22px) 28px,calc(100% - 17px) 28px;background-size:5px 5px;background-repeat:no-repeat}
.field input:focus,.field select:focus{border-color:var(--yellow);background:var(--ink-3)}
.field label{position:absolute;left:16px;top:19px;font-size:15px;color:var(--mute-d);pointer-events:none;transition:all .25s var(--ease)}
.field input:focus+label,.field input:not(:placeholder-shown)+label,.field.sel label{top:8px;font-size:11px;font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase}
.form .pill{margin-top:20px}
.form-msg{min-height:1.5em;margin:14px 0 0;font-size:14px;color:var(--yellow)}

/* ---------- footer ---------- */
.foot{padding:clamp(50px,7vw,90px) var(--gut) 20px;overflow:hidden}
.foot-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;max-width:1400px;margin:0 auto}
.foot-row nav{display:flex;flex-wrap:wrap;gap:6px 22px;font-weight:500}
.foot-row nav a:hover{color:var(--red)}
.socials{display:flex;gap:8px}
.socials a{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-family:var(--mono);font-size:13px;box-shadow:inset 0 0 0 1px var(--line-l);transition:background .3s,color .3s}
.socials a:hover{background:var(--red);color:#fff;box-shadow:none}
.legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;max-width:1400px;margin:0 auto;font-family:var(--mono);font-size:11px;color:var(--mute-l);border-top:1px solid var(--line-l);padding-top:16px}
.legal a{text-decoration:underline;text-underline-offset:3px}

/* =========================================================
   Sub-pages: work index + project
   ========================================================= */
.sub .nav{background:rgba(246,239,228,.9)}
.page-head{max-width:1400px;margin:0 auto;padding:clamp(120px,16vh,170px) var(--gut) clamp(30px,4vw,50px)}
.page-head .h2{font-size:clamp(64px,13vw,210px)}
.page-head p{max-width:48ch;font-size:clamp(16px,1.4vw,19px);color:var(--mute-l);margin:20px 0 0}
.filters{display:flex;flex-wrap:wrap;gap:8px;max-width:1400px;margin:0 auto;padding:0 var(--gut) 30px}
.filters button{height:40px;padding:0 16px;border-radius:999px;font-size:14px;font-weight:500;box-shadow:inset 0 0 0 1px var(--line-l);transition:background .3s,color .3s}
.filters button.on,.filters button:hover{background:var(--ink);color:var(--paper);box-shadow:none}
.wgrid{max-width:1400px;margin:0 auto;padding:0 var(--gut) clamp(70px,10vw,140px);display:grid;gap:var(--gut)}
@media (min-width:700px){.wgrid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.wgrid{grid-template-columns:repeat(3,1fr)}}
.wgrid .pcard{width:auto}
.wgrid .pcard.hide{display:none}

.proj-hero{margin:var(--gut);margin-top:calc(var(--gut) + 76px);border-radius:var(--r);background:var(--tint,#333);color:#fff;min-height:72svh;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(20px,4vw,50px);isolation:isolate}
.proj-hero .art{position:absolute;inset:0;z-index:-1}
.proj-hero .art img{width:100%;height:100%;object-fit:cover;opacity:.45}
.proj-hero .art .big-eye{position:absolute;right:-6%;top:-10%;width:min(70vw,760px);opacity:.14}
.proj-hero .crumb{position:absolute;top:clamp(20px,4vw,40px);left:clamp(20px,4vw,50px);font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.08em;opacity:.8}
.proj-hero .crumb a:hover{color:var(--yellow)}
.proj-hero h1{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(56px,11vw,180px);line-height:.88;margin:0}
.proj-hero .sum{max-width:46ch;font-size:clamp(17px,1.5vw,21px);margin:18px 0 0;opacity:.92}
.meta-row{max-width:1400px;margin:0 auto;padding:clamp(30px,4vw,50px) var(--gut);display:grid;gap:18px;grid-template-columns:repeat(2,1fr)}
@media (min-width:900px){.meta-row{grid-template-columns:repeat(4,1fr)}}
.meta-row div{border-top:2px solid var(--ink);padding-top:12px}
.meta-row span{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute-l);margin-bottom:6px}
.meta-row b{font-weight:500;font-size:16px}
.proj-body{max-width:1400px;margin:0 auto;padding:clamp(20px,4vw,50px) var(--gut);display:grid;gap:40px}
@media (min-width:900px){.proj-body{grid-template-columns:1.3fr 1fr;gap:80px}}
.proj-body .lead{font-family:var(--serif);font-size:clamp(26px,3vw,42px);line-height:1.15;margin:0}
.did{list-style:none;margin:0;padding:0}
.did li{display:flex;gap:14px;align-items:baseline;padding:14px 0;border-top:1px solid var(--line-l);font-size:18px}
.did li span{font-family:var(--mono);font-size:12px;color:var(--red)}
.results{margin-top:30px;padding:20px;border-radius:18px;background:var(--yellow)}
.results span{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}
.film{max-width:1400px;margin:0 auto;padding:clamp(20px,4vw,40px) var(--gut)}
.film .frame{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:var(--ink)}
.film iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.film .soon{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:var(--mute-d);font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.film .soon b{display:block;font-family:var(--display);font-size:clamp(40px,6vw,90px);color:var(--paper);font-weight:400;letter-spacing:0;margin-bottom:10px}
.gallery{max-width:1400px;margin:0 auto;padding:clamp(20px,4vw,40px) var(--gut);display:grid;gap:var(--gut);grid-template-columns:repeat(2,1fr)}
@media (min-width:900px){.gallery{grid-template-columns:repeat(3,1fr)}}
.gallery figure{margin:0;border-radius:18px;overflow:hidden;background:var(--paper-2)}
.gallery img{width:100%;height:auto;transition:transform .8s var(--ease)}
.gallery figure:hover img{transform:scale(1.03)}
.next{display:block;margin:clamp(40px,6vw,80px) var(--gut) 0;border-radius:var(--r);background:var(--ink);color:var(--paper);padding:clamp(30px,5vw,70px);position:relative;overflow:hidden}
.next span{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute-d)}
.next b{display:block;font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(50px,9vw,150px);line-height:.9;margin-top:10px;transition:transform .6s var(--ease),color .3s}
.next:hover b{transform:translateX(20px);color:var(--yellow)}

.no-gsap .work-track,.no-gsap /* reveal helper */
.rv{opacity:0;transform:translateY(30px)}
.no-js .rv,.reduce .rv{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  .grain,.hero-top .live .dot,.member .mono::after,.scroll-hint i{animation:none}
}
@media (max-width:899px){.eye{width:2.1em;height:1.38em}}

/* ---------- form extras ---------- */
.field.area textarea{width:100%;min-height:130px;resize:vertical;border-radius:14px;border:1px solid var(--line-d);background:var(--ink-2);color:var(--paper);font:inherit;font-size:16px;padding:26px 16px 12px;outline:none;transition:border-color .3s,background .3s}
.field.area textarea:focus{border-color:var(--yellow);background:var(--ink-3)}
.field.area textarea:focus+label,.field.area textarea:not(:placeholder-shown)+label{top:8px;font-size:11px;font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.form button[disabled]{opacity:.6;pointer-events:none}
.form-msg.ok{color:var(--live,#7fe0a8)}
.form-msg a{text-decoration:underline;text-underline-offset:3px}

/* ---------- project videos ---------- */
.film .frame.tall{aspect-ratio:auto;max-width:400px;margin:0 auto;background:transparent}
.film .frame.tall iframe{position:relative;inset:auto;display:block;width:100%;height:min(80svh,700px);border-radius:var(--r);background:var(--ink)}
.film .watch{display:flex;justify-content:center;margin-top:14px}
.film-head{max-width:1400px;margin:0 auto;padding:clamp(30px,5vw,60px) var(--gut) 0}
.pcard .play{display:inline-flex;align-items:center;gap:6px}
.pcard .play::before{content:"";width:0;height:0;border-left:8px solid currentColor;border-top:5px solid transparent;border-bottom:5px solid transparent}

/* film thumbnails: player loads on click */
.vfacade{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:hidden;border-radius:inherit;background:var(--ink);color:#fff;text-align:left}
.film .frame.tall .vfacade{position:relative;height:min(80svh,700px);border-radius:var(--r)}
.vfacade img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;max-width:none;transition:transform 1s var(--ease)}
.vfacade:hover img{transform:scale(1.04)}
.vshade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.55))}
.vplay{position:absolute;left:50%;top:50%;width:clamp(72px,9vw,110px);aspect-ratio:1;margin:0;transform:translate(-50%,-50%);border-radius:50%;background:var(--yellow);display:grid;place-items:center;box-shadow:0 0 0 0 rgba(255,210,58,.6);animation:vpulse 2.2s var(--ease) infinite;transition:transform .5s var(--ease)}
.vfacade:hover .vplay{transform:translate(-50%,-50%) scale(1.1)}
.vplay svg{width:38%;height:38%;fill:var(--ink);margin-left:6%}
@keyframes vpulse{0%{box-shadow:0 0 0 0 rgba(255,210,58,.55)}70%{box-shadow:0 0 0 26px rgba(255,210,58,0)}100%{box-shadow:0 0 0 0 rgba(255,210,58,0)}}
.vlabel{position:absolute;left:20px;bottom:18px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.film .frame .soon-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.22;max-width:none}
.film .frame .soon{z-index:1}
@media (prefers-reduced-motion:reduce){.vplay{animation:none}}



/* ---------- process: an edit timeline ---------- */
.proc-pin{padding:clamp(40px,6vw,70px) clamp(16px,3vw,40px);min-height:0}
.proc-grid{width:100%;max-width:1400px;margin:0 auto;display:grid;gap:clamp(24px,3vw,44px);align-items:center}
@media (min-width:1000px){.proc-grid{grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr)}.proc-pin{min-height:100svh;display:flex;align-items:center}}
.proc-title{font-size:clamp(52px,6.2vw,104px)}
.proc-title .nw{white-space:nowrap}
.proc-sub{margin:16px 0 0;max-width:34ch;font-size:clamp(15px,1.3vw,18px);color:rgba(255,255,255,.88)}
.proc-ctrl{display:flex;align-items:center;gap:10px;margin-top:26px}
.pc-btn{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55);transition:background .3s,transform .3s var(--ease)}
.pc-btn:hover{background:rgba(0,0,0,.2);transform:translateY(-2px)}
.pc-btn svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pc-play{height:52px;padding:0 22px 0 18px;border-radius:999px;display:flex;align-items:center;gap:10px;background:var(--yellow);color:var(--ink);font-weight:600;transition:transform .3s var(--ease)}
.pc-play:hover{transform:translateY(-2px)}
.pc-play svg{width:18px;height:18px;fill:var(--ink)}
.pc-play .i-pause,.pc-play.on .i-play{display:none}.pc-play.on .i-pause{display:block}
.editor{background:#100909;border-radius:22px;padding:clamp(10px,1.4vw,16px);display:grid;gap:12px;min-width:0;box-shadow:0 40px 80px -40px rgba(40,0,0,.8)}
.monitor{border-radius:14px;overflow:hidden;background:#000;box-shadow:inset 0 0 0 1px #2a1818}
.mon-bar{display:flex;justify-content:space-between;gap:10px;padding:8px 12px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#a38c86;background:#160d0d;border-bottom:1px solid #2a1818}
.mon-bar span:first-child{display:flex;align-items:center;gap:8px}
.mon-bar i{width:7px;height:7px;border-radius:50%;background:#e33}
.mon-bar #monTc{color:var(--yellow);font-variant-numeric:tabular-nums}
.mon-screen{position:relative;aspect-ratio:16/8;overflow:hidden;background:radial-gradient(120% 120% at 20% 0%,#2a1212,#060303 70%)}
.mon-screen::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px)}
.mon-screen::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:#fff;opacity:0}
.mon-screen.cut::after{animation:cutflash .32s ease-out}
@keyframes cutflash{0%{opacity:.55}100%{opacity:0}}
.mon-step{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;gap:clamp(10px,2vw,30px);padding:clamp(16px,3vw,40px)}
.mon-big{position:absolute;right:-.04em;bottom:-.18em;font-family:var(--display);font-size:clamp(140px,22vw,340px);line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(255,210,58,.16);pointer-events:none;z-index:0}
.mon-art{position:relative;z-index:1;width:100%;max-width:340px;justify-self:center}
.mon-art svg{width:100%;height:auto;overflow:visible}
.mon-art .s{fill:none;stroke:var(--yellow);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.mon-art .f{fill:var(--yellow)}
.mon-art .soft{stroke:rgba(255,210,58,.4)}
.mon-copy{position:relative;z-index:1;min-width:0}
.mon-copy .k{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#a38c86}
.mon-copy h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(44px,6vw,96px);line-height:.9;margin:8px 0 10px;color:var(--paper)}
.mon-copy p{margin:0;font-size:clamp(14px,1.25vw,17px);line-height:1.45;color:#d8c9c3;max-width:32ch}
.art-talk .dots circle{animation:typing 1.2s infinite}
.art-talk .dots circle:nth-child(2){animation-delay:.15s}.art-talk .dots circle:nth-child(3){animation-delay:.3s}
@keyframes typing{0%,60%,100%{opacity:.25}30%{opacity:1}}
.art-shoot .ring{transform-origin:90px 76px;animation:spin 6s linear infinite}
.art-shoot .recdot{animation:recblink 1.2s steps(1) infinite;fill:#ff3b3b}
.art-edit .ph{animation:phmove 3.4s cubic-bezier(.6,0,.4,1) infinite alternate}
@keyframes phmove{from{transform:translateX(-50px)}to{transform:translateX(60px)}}
.art-plan .pen{animation:penwiggle 2.4s ease-in-out infinite}
@keyframes penwiggle{0%,100%{transform:translate(0,0)}50%{transform:translate(-22px,4px)}}
.art-deliver .chk{stroke:#7fe0a8}

.tl{position:relative;border-radius:12px;background:#160d0d;padding:4px 8px 8px 38px;user-select:none;-webkit-user-select:none;touch-action:pan-y;cursor:ew-resize}
.tl-ruler{position:relative;height:20px;margin-bottom:4px}
.tl-ruler span{position:absolute;bottom:0;width:1px;height:5px;background:#4a3232}
.tl-ruler span.big{height:9px;background:#7a5a5a}
.tl-ruler b{position:absolute;top:0;transform:translateX(-50%);font-family:var(--mono);font-size:9px;font-weight:400;color:#8d7a74}
.tl-track{position:relative;height:46px;margin-top:4px}
.tl-track.a{height:30px}
.tl-lab{position:absolute;left:-32px;top:50%;transform:translateY(-50%);font-family:var(--mono);font-size:10px;color:#8d7a74;width:26px;text-align:center;padding:3px 0;border-radius:4px;background:#241515}
.tl-clips{display:flex;height:100%;gap:2px}
.clip{position:relative;height:100%;border-radius:6px;padding:0 8px;display:flex;align-items:center;gap:6px;min-width:0;overflow:hidden;color:var(--ink);font-size:12.5px;font-weight:600;white-space:nowrap;text-align:left;opacity:.55;transition:opacity .3s,box-shadow .3s,transform .3s var(--ease)}
.clip small{font-family:var(--mono);font-size:10px;font-weight:400;opacity:.7}
.clip::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(0,0,0,.18)}
.clip.on{opacity:1;box-shadow:inset 0 0 0 2px #fff;transform:translateY(-2px)}
.clip.done{opacity:.85}
.clip:hover{opacity:1}
#tlWave{display:block;width:100%;height:100%}
.tl-head{position:absolute;top:2px;bottom:6px;left:38px;width:0;z-index:5;pointer-events:none}
.tl-head i{position:absolute;left:-1px;top:16px;bottom:0;width:2px;background:var(--yellow);box-shadow:0 0 12px rgba(255,210,58,.8)}
.tl-eye{position:absolute;left:-11px;top:-6px;width:22px;height:28px;pointer-events:auto;cursor:grab;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}
.tl-eye svg{width:100%;height:100%}
.tl.dragging .tl-eye{cursor:grabbing;transform:scale(1.2)}
@media (max-width:999px){
  .proc-pin{padding-bottom:20px}
  .mon-screen{aspect-ratio:auto;min-height:300px}
  .mon-step{grid-template-columns:1fr;align-content:center;text-align:left;gap:10px}
  .mon-art{max-width:200px;justify-self:start}
  .clip span.nm{display:none}
  .clip{justify-content:center;padding:0 2px}
  .proc-ctrl{margin-top:18px}
  .tl-track{height:52px}
}
@media (prefers-reduced-motion:reduce){.art-talk .dots circle,.art-shoot .ring,.art-shoot .recdot,.art-edit .ph,.art-plan .pen{animation:none}}

/* ---------- footer ---------- */
.foot{margin-top:clamp(40px,6vw,80px);background:var(--red);color:#fff;border-radius:var(--r) var(--r) 0 0;padding:clamp(50px,7vw,100px) var(--gut) 20px;overflow:hidden;position:relative}
.foot-cta{max-width:1400px;margin:0 auto clamp(50px,7vw,90px);display:flex;flex-direction:column;align-items:center;text-align:center}
.foot-logo{width:clamp(96px,10vw,140px);height:auto;background:#fffaf0;border-radius:18px;padding:10px 14px;transform:rotate(-4deg);box-shadow:0 20px 40px -20px rgba(40,0,0,.7);margin-bottom:clamp(20px,3vw,34px);transition:transform .6s var(--ease)}
.foot-logo:hover{transform:rotate(4deg) scale(1.06)}
.foot-say{margin:0;font-weight:400;line-height:.9;cursor:default}
.foot-say .l1{display:block;font-family:var(--display);text-transform:uppercase;font-size:clamp(56px,11vw,190px);color:var(--paper)}
.foot-say .l2{display:block;font-family:var(--serif);font-style:italic;font-size:clamp(50px,9.5vw,170px);color:var(--yellow);letter-spacing:-.01em;margin-top:.04em}
.foot-say .lt{display:inline-block;will-change:transform;transition:color .3s}
.foot-say .lt.sp{width:.25em}
.foot-live{display:flex;align-items:center;justify-content:center;gap:10px;margin:clamp(20px,3vw,32px) 0 0;font-family:var(--mono);font-size:clamp(12px,1.1vw,14px);letter-spacing:.04em;color:rgba(255,255,255,.9)}
.foot-live .dot{background:var(--yellow);animation:recblink 1.4s steps(1) infinite}
.foot-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:26px}
.foot .foot-row nav a:hover{color:var(--yellow)}
.foot .socials a{box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.foot .socials a:hover{background:var(--yellow);color:var(--ink)}
.foot .legal{color:rgba(255,255,255,.7);border-top-color:rgba(255,255,255,.2)}

/* ---------- one frame, every format ---------- */
.fmt{background:var(--ink);color:var(--paper);border-radius:var(--r);margin:clamp(30px,5vw,60px) var(--gut) 0;overflow:hidden}
.fmt-pin{padding:clamp(28px,5vw,64px) clamp(16px,3vw,40px)}
.fmt-grid{width:100%;max-width:1400px;margin:0 auto;display:grid;gap:clamp(18px,3vw,48px);align-items:center}
@media (min-width:1000px){.fmt-grid{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr)}.fmt-pin{min-height:100svh;display:flex;align-items:center}}
.fmt .eyebrow{color:var(--mute-d)}.fmt .eyebrow .dot{background:var(--yellow)}
.fmt-title{font-size:clamp(46px,6vw,96px)}
.fmt-title em{color:var(--yellow)}
.fmt-sub{margin:14px 0 0;max-width:36ch;font-size:clamp(15px,1.3vw,18px);color:#d8c9c3}
.fmt-list{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:2px;position:relative}
.fmt-list li{position:relative;display:grid;grid-template-columns:70px 1fr;gap:4px 14px;padding:10px 0 10px 16px;border-left:2px solid #3a2626;transition:border-color .4s,opacity .4s;opacity:.45}
.fmt-list li b{font-family:var(--display);font-weight:400;font-size:24px;line-height:1;color:var(--paper);font-variant-numeric:tabular-nums}
.fmt-list li span{font-weight:600;font-size:15px}
.fmt-list li p{grid-column:2;margin:0;font-size:14px;line-height:1.4;color:#c9b7ae;max-height:0;overflow:hidden;opacity:0;transition:max-height .5s var(--ease),opacity .4s}
.fmt-list li.on{opacity:1;border-left-color:var(--yellow)}
.fmt-list li.on b{color:var(--yellow)}
.fmt-list li.on p{max-height:80px;opacity:1}

.fmt-stage{position:relative;height:min(78svh,720px);min-height:360px;border-radius:20px;background:#0a0606;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:40px 40px;background-position:center;overflow:hidden}
.fmt-lines{position:absolute;inset:0;pointer-events:none}
.fmt-lines i{position:absolute;left:50%;top:50%;border:1px dashed rgba(255,210,58,.22);border-radius:4px;transform:translate(-50%,-50%);transition:border-color .4s}
.fmt-lines i.on{border-color:rgba(255,210,58,0)}
.fmt-lines i em{position:absolute;left:6px;top:4px;font-style:normal;font-family:var(--mono);font-size:10px;color:rgba(255,210,58,.45)}
.fmt-frame{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:10px;overflow:hidden;box-shadow:0 0 0 2px var(--yellow),0 40px 80px -30px rgba(0,0,0,.9);background:#000;will-change:width,height}
.fmt-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;max-width:none;object-position:var(--ox,40%) 50%}
.fmt-c{position:absolute;width:18px;height:18px;border:2.5px solid #fff;z-index:3;opacity:.9}
.fmt-c.tl{left:10px;top:10px;border-right:0;border-bottom:0}.fmt-c.tr{right:10px;top:10px;border-left:0;border-bottom:0}
.fmt-c.bl{left:10px;bottom:10px;border-right:0;border-top:0}.fmt-c.br{right:10px;bottom:10px;border-left:0;border-top:0}
.fmt-read{position:absolute;left:16px;bottom:14px;z-index:4;display:flex;align-items:baseline;gap:10px;font-family:var(--mono);color:#b59d95;font-size:12px}
.fmt-read b{font-family:var(--display);font-weight:400;font-size:clamp(30px,3.4vw,46px);color:var(--yellow);line-height:1;font-variant-numeric:tabular-nums}

/* platform hints inside the frame */
.fmt-ov{position:absolute;inset:0;z-index:2;pointer-events:none}
.fmt-ov .ov{position:absolute;inset:0;opacity:0;transition:opacity .45s var(--ease)}
.fmt-ov .ov.on{opacity:1}
.ov .sh{position:absolute;background:rgba(255,255,255,.88);border-radius:999px}
.ov .grad-b{position:absolute;left:0;right:0;bottom:0;height:40%;background:linear-gradient(transparent,rgba(0,0,0,.6))}
.ov .grad-t{position:absolute;left:0;right:0;top:0;height:22%;background:linear-gradient(rgba(0,0,0,.5),transparent)}
.ov .pill-t{position:absolute;font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:4px 8px;border-radius:999px;background:rgba(0,0,0,.55);color:#fff}
.ov .bar{position:absolute;left:4%;right:4%;bottom:7%;height:4px;border-radius:4px;background:rgba(255,255,255,.35)}
.ov .bar i{position:absolute;left:0;top:0;bottom:0;width:38%;border-radius:4px;background:#ff3b3b}
.ov .bar i::after{content:"";position:absolute;right:-6px;top:-4px;width:12px;height:12px;border-radius:50%;background:#ff3b3b}
.ov .sub{position:absolute;left:0;right:0;bottom:11%;text-align:center;font-family:var(--serif);font-style:italic;font-size:clamp(14px,1.6vw,22px);color:#ffe9a8;text-shadow:0 2px 10px rgba(0,0,0,.8)}
@media (max-width:999px){
  .fmt-stage{height:56svh;min-height:300px}
  .fmt-list{margin-top:16px}
  .fmt-list li{padding:6px 0 6px 12px;grid-template-columns:58px 1fr}
  .fmt-list li b{font-size:20px}
  .fmt-sub{display:none}
  .fmt-list li:not(.on){display:none}
  .fmt-list li{border-left-color:var(--yellow)}
  .fmt-list li p{font-size:13px}
  .fmt-grid{gap:14px}
  .fmt-title{font-size:clamp(38px,11vw,56px)}
  .fmt-list li.on p{max-height:60px}
}

/* ---------- trusted by: a logo belt with a lens in the middle ---------- */
.trust{padding:clamp(40px,7vw,100px) 0 clamp(20px,4vw,50px);overflow:hidden}
.trust-head{max-width:1400px;margin:0 auto clamp(26px,4vw,48px);padding:0 var(--gut);display:grid;gap:18px;align-items:end}
@media (min-width:900px){.trust-head{grid-template-columns:1.1fr .9fr;gap:60px}}
.trust-head .sec-sub{margin:0}
.belt{position:relative;display:grid;gap:clamp(10px,1.5vw,16px);padding:clamp(14px,2vw,22px) 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.belt-row{overflow:visible}
.belt-track{display:flex;gap:clamp(10px,1.5vw,16px);width:max-content;will-change:transform}
.logo-tile{--k:0;flex:none;width:clamp(150px,17vw,230px);height:clamp(92px,9vw,120px);border-radius:18px;display:grid;place-items:center;padding:16px 22px;
  background:color-mix(in srgb,var(--paper-2) calc(100% - var(--k) * 100%),#fff);
  box-shadow:0 0 0 1px rgba(20,10,10,calc(.04 + var(--k) * .08)),0 calc(var(--k) * 24px) calc(var(--k) * 40px) calc(var(--k) * -18px) rgba(60,10,10,.45);
  transform:scale(calc(1 + var(--k) * .12));transition:background .2s}
.logo-tile img{max-width:100%;max-height:clamp(50px,5.4vw,72px);width:auto;height:auto;object-fit:contain;
  filter:grayscale(calc(1 - var(--k))) contrast(calc(1.15 - var(--k) * .15));opacity:calc(.62 + var(--k) * .38);mix-blend-mode:multiply}
.logo-tile .word{font-family:var(--display);text-transform:uppercase;font-size:clamp(18px,1.8vw,24px);line-height:1;text-align:center;color:color-mix(in srgb,var(--mute-l) calc(100% - var(--k) * 100%),var(--red));letter-spacing:.01em}
.logo-tile .word small{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.08em;margin-top:6px;color:var(--mute-l)}
.lens{position:absolute;left:50%;top:0;bottom:0;width:clamp(170px,19vw,260px);transform:translateX(-50%);pointer-events:none}
.lc.c3{left:0;bottom:4px;border-right:0;border-top:0;border-radius:0 0 0 6px}.lc.c4{right:0;bottom:4px;border-left:0;border-top:0;border-radius:0 0 6px 0}
.trust{padding-bottom:clamp(60px,8vw,110px)}
.trust-list{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);margin:0;padding:0}
.reduce .belt{-webkit-mask-image:none;mask-image:none}
.reduce .belt-row+.belt-row,.reduce .lens{display:none}
.reduce .belt-track{flex-wrap:wrap;justify-content:center;width:auto;padding:0 var(--gut)}
.reduce .logo-tile{--k:1}

/* images fade in once loaded; team cards show their own orange while photos arrive */
img.ld{opacity:0;transition:opacity .6s var(--ease)}
img.ld.in{opacity:1}
.logo-tile img.ld.in{opacity:calc(.62 + var(--k) * .38)}
.member .ph{background:#c4501f}
