/* Nxtwave Studios — the site's one stylesheet. Built on the Split Screen take:
   a black stage where the films supply the colour, slivers that open, one cyan
   accent. Palette, type and shadow law come from NXT-WEBSITE-BRIEF.md. */
:root{
  --white:#FFFFFF; --ink:#0E1113; --bar:#101010;
  --cy:#5AB1C7; --cy2:#73C4D2; --deep:#2E6FA0; --deepink:#0A2430;
  --mut:#8A979F; --paper:#EFEEEA; --line:#D7D5CF;
  --panel:#141A1D; --rule:#232B30;
  --field:linear-gradient(160deg,#2E6FA0 0%,#5AB1C7 55%,#73C4D2 100%);
  --shTxt:0 3px 6px rgba(0,0,0,.42),0 10px 30px rgba(0,0,0,.34);
  --shSm:0 2px 4px rgba(0,0,0,.40),0 6px 16px rgba(0,0,0,.28);
  --shBox:0 10px 26px rgba(0,0,0,.34),0 34px 70px rgba(0,0,0,.26);
  --sans:'Sora',system-ui,-apple-system,sans-serif;
  --serif:'Playfair Display',Georgia,serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
  --out:cubic-bezier(.16,1,.3,1);          /* exponential ease-out */
  --gut:clamp(18px,4.2vw,64px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--sans);font-size:1rem;line-height:1.55;-webkit-font-smoothing:antialiased}
img,video,canvas{display:block;max-width:100%}
h1,h2,h3,p,ul,ol,figure{margin:0}
ul,ol{list-style:none;padding:0}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--cy2);outline-offset:3px;border-radius:4px}
::selection{background:var(--cy);color:var(--deepink)}
.mono{font-family:var(--mono);font-weight:600;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase}
.it{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:fixed;left:16px;top:-80px;z-index:300;background:var(--white);color:var(--ink);padding:.7em 1.1em;border-radius:999px;font-weight:700}
.skip:focus{top:16px}
.arw{display:inline-block;width:1.05em;height:.72em;vertical-align:-.02em}

/* ------------------------------------------------------------ viewer -- */
.viewer{position:fixed;inset:0;z-index:200;display:grid;place-items:center;
  background:rgba(8,11,13,.965);color:var(--white);
  opacity:0;visibility:hidden;transition:opacity .28s var(--out),visibility 0s .28s}
.viewer.is-open{opacity:1;visibility:visible;transition:opacity .28s var(--out)}
.viewer__in{width:min(1240px,100%);max-height:100dvh;overflow:auto;padding:clamp(14px,2.4vw,32px);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,320px);gap:clamp(18px,3vw,44px);align-items:end}
.viewer[data-wide="false"] .viewer__in{grid-template-columns:auto minmax(250px,340px);justify-content:center}
.viewer__film{position:relative;border-radius:14px;overflow:hidden;background:#000;box-shadow:var(--shBox);
  transform:scale(.965);transition:transform .5s var(--out)}
.viewer.is-open .viewer__film{transform:none}
.viewer__film video{width:100%;height:auto;aspect-ratio:16/9;background:#000}
.viewer[data-wide="false"] .viewer__film video{height:min(84dvh,860px);width:auto;aspect-ratio:9/16}
.viewer__rows div[hidden],.viewer__note[hidden]{display:none}
.viewer__img{display:none;width:100%;height:auto;max-height:84dvh;object-fit:contain;background:#000}
.viewer[data-kind="photo"] .viewer__img{display:block}
.viewer[data-kind="photo"] .viewer__film video{display:none}
.viewer[data-kind="photo"][data-wide="false"] .viewer__img{height:min(84dvh,860px);width:auto;max-width:100%}
.viewer__meta{padding-bottom:6px}
.viewer__client{color:var(--cy2)}
.viewer__title{font-weight:800;font-size:clamp(1.5rem,2.6vw,2.2rem);line-height:1.08;letter-spacing:-.02em;margin:.5rem 0 1.1rem;text-wrap:balance}
.viewer__rows{border-top:1px solid var(--rule)}
.viewer__rows div{display:flex;justify-content:space-between;gap:1rem;padding:.62rem 0;border-bottom:1px solid var(--rule);font-size:.9rem}
.viewer__rows dt{color:var(--mut)} .viewer__rows dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}
.viewer__note{color:var(--soft);font-size:.86rem;margin:1rem 0 1.3rem;max-width:34ch}
.viewer__cta{display:inline-flex;align-items:center;gap:.6em;background:var(--white);color:var(--ink);font-weight:700;
  padding:.85em 1.25em;border-radius:999px;transition:transform .25s var(--out),background .2s}
.viewer__cta:hover{background:var(--cy2);transform:translateY(-2px)}
.viewer__cta:active{transform:translateY(0) scale(.98)}
.viewer__nav{display:flex;gap:.5rem;margin-top:1.3rem}
.viewer__nav button{flex:1;display:flex;align-items:center;justify-content:center;gap:.6em;padding:.8em 1em;border-radius:10px;
  background:var(--panel);box-shadow:inset 0 0 0 1px var(--rule);transition:background .2s,transform .2s var(--out)}
.viewer__nav button:hover{background:#1C252A;transform:translateY(-1px)}
.viewer__nav button:active{transform:scale(.98)}
.viewer__close{position:fixed;top:clamp(10px,2vw,22px);right:clamp(10px,2vw,22px);z-index:2;width:46px;height:46px;border-radius:50%;
  background:var(--panel);box-shadow:inset 0 0 0 1px var(--rule);display:grid;place-items:center;transition:background .2s,transform .3s var(--out)}
.viewer__close:hover{background:var(--cy);color:var(--deepink);transform:rotate(90deg)}
@media (max-width:820px){
  .viewer{place-items:start center}
  .viewer__in,.viewer[data-wide="false"] .viewer__in{grid-template-columns:1fr;align-items:start;padding-top:66px}
  .viewer[data-wide="false"] .viewer__film{justify-self:center}
  .viewer[data-wide="false"] .viewer__film video{height:min(62dvh,560px)}
}
@media (prefers-reduced-motion:reduce){
  .viewer,.viewer__film,.viewer__cta,.viewer__nav button,.viewer__close{transition:none}
}

/* ------------------------------------------------- cinematic helpers -- */
.grain{position:absolute;inset:-120px;z-index:8;pointer-events:none;background-size:180px 180px;opacity:.085;mix-blend-mode:overlay;
  animation:grain .7s steps(1) infinite}
@keyframes grain{0%{transform:translate(0,0)}17%{transform:translate(-46px,31px)}34%{transform:translate(38px,-52px)}51%{transform:translate(-71px,-18px)}68%{transform:translate(57px,44px)}85%{transform:translate(-23px,66px)}}
.snd{display:inline-flex;align-items:center;gap:.55em;font-weight:600;font-size:.9rem;padding:.6em .9em;border-radius:999px;color:var(--white);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.34);transition:background .2s,color .2s,box-shadow .2s,transform .3s var(--out)}
.snd:hover{background:rgba(255,255,255,.14);transform:translateY(-1px)} .snd:active{transform:scale(.96)}
.snd[aria-pressed="true"]{background:var(--cy2);color:var(--ink);box-shadow:none}
.snd .snd__on{display:none}.snd[aria-pressed="true"] .snd__on{display:inline}.snd[aria-pressed="true"] .snd__off{display:none}

.end{background:#000;color:var(--white);text-align:center;padding:clamp(72px,14vh,170px) var(--gut) clamp(56px,10vh,120px)}
.end__h{font-weight:800;font-size:clamp(2.6rem,8vw,6rem);line-height:.98;letter-spacing:-.035em}
.end__h .it{font-weight:400;color:var(--cy2);letter-spacing:-.01em}
.end__ways{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(18px,3vw,52px) clamp(28px,5vw,84px);margin:clamp(30px,6vh,64px) auto;max-width:1100px}
.end__ways a{display:block;padding:.3rem 0;transition:color .2s,transform .35s var(--out)}
.end__ways a:hover{color:var(--cy2);transform:translateY(-3px)} .end__ways a:active{transform:scale(.98)}
.end__ways .mono{display:block;color:var(--soft);margin-bottom:.5rem}
.end__ways strong{font-weight:700;font-size:clamp(1.1rem,1.8vw,1.45rem);overflow-wrap:anywhere}
.end__by{color:var(--soft);font-size:.95rem}
.end__by a{text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:4px;transition:color .2s}
.end__by a:hover{color:var(--cy2);text-decoration-color:currentColor}
.end__fin{font-size:clamp(1.3rem,2.4vw,1.9rem);color:var(--cy2);margin-top:clamp(26px,5vh,54px)}
@media (prefers-reduced-motion:reduce){.grain{animation:none}.snd,.end__ways a{transition:none}}

/* ---------------------------------------------------------------- wall -- */
.wall{position:relative;height:100svh;min-height:540px;overflow:hidden;background:#000;isolation:isolate}
.strips{position:absolute;inset:0;display:flex}
.strip{position:relative;flex:1 1 0;min-width:0;height:100%;overflow:hidden;background:#000;text-align:left;
  transition:flex-grow .8s var(--out),filter .5s var(--out);filter:brightness(.8) saturate(.92);will-change:clip-path,flex-grow}
.strip:hover,.strip.is-live{filter:none}
.strip.is-open{filter:none;z-index:2}
.strip.is-dim{flex-grow:.28;filter:brightness(.28) saturate(.3)}
.wall.has-open .strip:not(.is-open){filter:brightness(.5) saturate(.7)}
.wall.has-open .strip.is-dim:not(.is-open){filter:brightness(.22) saturate(.3)}
.strip__pic{position:absolute;left:50%;top:50%;height:100%;transform:translate(-50%,-50%);transition:height .8s var(--out)}
.strip--t .strip__pic{aspect-ratio:9/16}
.strip--w .strip__pic{aspect-ratio:16/9}
.strip--w.is-open .strip__pic{height:var(--oh)}
.strip__pic img,.strip__pic video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.strip__pic video{opacity:0;transition:opacity .4s}
.strip__pic video.is-live{opacity:1}
.strip::after{content:"";position:absolute;inset:auto 0 0 0;height:46%;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.78));pointer-events:none;transition:opacity .4s}
.strip--w.is-open::after{opacity:0}
.strip__tab{position:absolute;z-index:2;left:50%;bottom:13.5svh;writing-mode:vertical-rl;transform:translateX(-50%) rotate(180deg);white-space:nowrap;
  font-family:var(--mono);font-weight:600;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;text-shadow:0 1px 5px rgba(0,0,0,.9);transition:opacity .25s}
.strip.is-open .strip__tab,.strip.is-dim .strip__tab{opacity:0}
.strip__info{position:absolute;z-index:3;left:50%;bottom:clamp(22px,5.4vh,58px);width:var(--ow);padding:0 clamp(18px,2.2vw,34px);
  transform:translate(-50%,16px);opacity:0;pointer-events:none;transition:opacity .3s,transform .6s var(--out)}
.strip.is-open .strip__info{opacity:1;transform:translate(-50%,0);transition-delay:.28s}
.strip--w .strip__info{bottom:auto;top:calc(50% + var(--oh) / 2 + clamp(12px,2.2vh,24px))}
.strip__info b{display:block;font-weight:800;font-size:clamp(1.5rem,2.7vw,2.5rem);line-height:1;letter-spacing:-.03em;text-shadow:var(--shTxt);text-wrap:balance}
.strip__info .it{display:block;font-size:clamp(1rem,1.5vw,1.3rem);margin-top:.3em;color:var(--mist);text-shadow:var(--shSm)}
.strip__meta{display:block;margin-top:.7em;font-family:var(--mono);font-weight:600;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);font-variant-numeric:tabular-nums}
.strip__go{display:inline-flex;align-items:center;gap:.6em;margin-top:1em;background:var(--white);color:var(--ink);font-weight:700;font-size:.9rem;
  padding:.68em 1.1em;border-radius:999px;box-shadow:var(--shSm);transition:background .2s,transform .3s var(--out)}
.strip.is-open:hover .strip__go{background:var(--cy2);transform:translateY(-2px)}
.strip.is-open:active .strip__go{transform:scale(.97)}
.strip:focus-visible{outline-offset:-4px}

.title{position:absolute;z-index:5;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none;
  padding:0 var(--gut);transition:opacity .5s var(--out),transform .9s var(--out)}
.title__h{font-weight:800;font-size:clamp(3.4rem,13vw,9rem);line-height:.9;letter-spacing:-.04em;color:#fff;mix-blend-mode:difference}
.title__h .it{font-weight:500;letter-spacing:-.02em}
.title__p{margin-top:1.3em;font-weight:500;font-size:clamp(.95rem,1.25vw,1.1rem);background:rgba(0,0,0,.72);padding:.55em 1.1em;border-radius:999px}
.wall.has-open .title{opacity:0;transform:scale(1.04)}
@keyframes titleIn{from{opacity:0;transform:translateY(30px) scale(.97)}to{opacity:1;transform:none}}
.title__h{animation:titleIn 1.3s .2s var(--out) both}

/* -------------------------------------------- phones: slivers become bands -- */
@media (max-width:800px){
  .wall{height:auto;min-height:0;overflow:hidden}
  .title{position:static;display:block;text-align:left;padding:18px var(--gut) 20px}
  .title__h{mix-blend-mode:normal;font-size:clamp(3.2rem,17vw,4.6rem)}
  .title__h .it{color:var(--cy2)}
  .title__p{background:none;padding:0;border-radius:0;color:var(--soft);margin-top:.9em;max-width:34ch}
  .wall.has-open .title{opacity:1;transform:none}
  .strips{position:static;flex-direction:column}
  .strip{flex:none;width:100%;height:66px;transition:height .7s var(--out),filter .5s var(--out)}
  .strip.is-dim{flex-grow:0;height:26px}
  .strip__pic,.strip--w.is-open .strip__pic{left:0;top:0;width:100%;height:100%;transform:none;aspect-ratio:auto;transition:none}
  .strip::after{height:100%;background:linear-gradient(90deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.1) 62%,rgba(0,0,0,0) 100%)}
  .strip.is-open::after,.strip--w.is-open::after{opacity:1;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.86) 100%)}
  .strip__tab{writing-mode:horizontal-tb;transform:translateY(50%);left:var(--gut);bottom:50%;font-family:var(--sans);font-size:1rem;font-weight:700;letter-spacing:-.01em;text-transform:none}
  .strip__info,.strip--w .strip__info{left:0;top:auto;bottom:14px;width:100%;padding:0 var(--gut);transform:translateY(12px)}
  .strip.is-open .strip__info{transform:none}
  .strip__info b{font-size:1.5rem}
  .strip--w .strip__meta{display:none}
}
@media (prefers-reduced-motion:reduce){
  .strip,.strip__pic,.strip__info,.title,.strip__pic video{transition:none}
  .title__h{animation:none}
}

/* =====================================================================
   The site. A black stage, hairlines instead of boxes, media for colour.
   ===================================================================== */
:root{--hair:#1E262A;--soft:#B9C4C9;--mist:#E3EAED;--dim:#8A979F;--card:#0D1214;--max:1320px}
html{background:#000;scrollbar-color:#2A3940 #000;scroll-behavior:smooth}
body{background:#000;color:var(--white);caret-color:var(--cy2);accent-color:var(--cy)}
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
[id]{scroll-margin-top:88px}
.ngn{font-family:var(--mono)}

/* --------------------------------------------------------------- header -- */
.hud{position:relative;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:clamp(10px,1.5vw,18px) var(--gut)}
.hud--over{position:absolute;inset:0 0 auto 0;pointer-events:none}
.hud--over>*{pointer-events:auto}
.hud__logo{flex:0 0 auto}
.hud__logo img{height:clamp(28px,3vw,38px);width:auto}
.hud__cta,.snd,.hud__menu{white-space:nowrap;flex:0 0 auto}
.hud--over .hud__logo img{filter:drop-shadow(0 2px 8px rgba(0,0,0,.7))}
.hud__nav{display:flex;align-items:center;gap:clamp(6px,1.4vw,20px);font-weight:600;font-size:.92rem}
.hud__nav>a:not(.hud__cta){padding:.5em .4em;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:6px;text-decoration-thickness:2px;transition:text-decoration-color .2s}
.hud--over .hud__nav>a:not(.hud__cta){text-shadow:0 1px 8px rgba(0,0,0,.8)}
.hud__nav>a:not(.hud__cta):hover,.hud__nav>a[aria-current="page"]{text-decoration-color:var(--cy2)}
.hud__cta{background:var(--white);color:var(--ink);padding:.62em 1.1em;border-radius:999px;transition:transform .3s var(--out),background .2s}
.hud__cta:hover{background:var(--cy2);transform:translateY(-2px)} .hud__cta:active{transform:scale(.97)}
.hud__menu{display:none;align-items:center;gap:.5em;font-weight:600;padding:.6em .95em;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.34);background:rgba(0,0,0,.45)}
.hud__menu i{display:block;width:16px;height:8px;border-top:2px solid currentColor;border-bottom:2px solid currentColor}
.snd{background:rgba(0,0,0,.45);padding:.52em .85em;font-size:.86rem}
.cats{display:flex;gap:5px;flex-wrap:nowrap}
.cats button{font-size:.8rem;font-weight:600;padding:.44em .85em;border-radius:999px;background:rgba(0,0,0,.55);color:var(--mist);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);white-space:nowrap;transition:background .2s,color .2s,transform .3s var(--out)}
.cats button:hover{background:rgba(255,255,255,.16);transform:translateY(-1px)} .cats button:active{transform:scale(.96)}
.cats button[aria-pressed="true"]{background:var(--white);color:var(--ink);box-shadow:none}
.cats sup{font-size:.7em;margin-left:.3em;opacity:.7}

.menu{position:fixed;inset:0;z-index:150;background:#000;display:flex;flex-direction:column;opacity:0;visibility:hidden;transition:opacity .25s var(--out),visibility 0s .25s}
.menu.is-open{opacity:1;visibility:visible;transition:opacity .25s var(--out)}
.menu__top{display:flex;justify-content:space-between;align-items:center;padding:14px var(--gut)}
.menu__top img{height:30px;width:auto}
.menu__close{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.34)}
.menu__links{flex:1;display:flex;flex-direction:column}
.menu__links a{flex:1;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0 var(--gut);border-top:1px solid var(--hair);
  font-weight:800;font-size:clamp(2rem,10vw,3.2rem);letter-spacing:-.035em;transform:translateY(14px);opacity:0;transition:transform .6s var(--out),opacity .4s,background .2s}
.menu.is-open .menu__links a{transform:none;opacity:1}
.menu.is-open .menu__links a:nth-child(2){transition-delay:.04s}.menu.is-open .menu__links a:nth-child(3){transition-delay:.08s}
.menu.is-open .menu__links a:nth-child(4){transition-delay:.12s}.menu.is-open .menu__links a:nth-child(5){transition-delay:.16s}
.menu__links a:active{background:var(--card)}
.menu__links a[aria-current="page"]{color:var(--cy2)}
.menu__links .arw{color:var(--dim);font-size:1.1rem}
.menu__foot{display:flex;justify-content:space-between;gap:1rem;padding:16px var(--gut) 22px;border-top:1px solid var(--hair);color:var(--soft);font-size:.92rem}
.menu__foot a:hover{color:var(--cy2)}

/* ------------------------------------------------------ shared pieces -- */
.sec{padding:clamp(64px,11vh,136px) 0}
.sec--line{border-top:1px solid var(--hair)}
.sec__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1rem 3rem;margin-bottom:clamp(26px,4.6vh,52px)}
.kick{color:var(--cy2);display:block;margin-bottom:1rem}
.h2{font-weight:800;font-size:clamp(2.3rem,5.6vw,4.6rem);line-height:.96;letter-spacing:-.04em;text-wrap:balance}
.h2 .it,.h3 .it{font-weight:400;color:var(--cy2);letter-spacing:-.01em}
.h3{font-weight:800;font-size:clamp(1.5rem,2.6vw,2.2rem);line-height:1.04;letter-spacing:-.03em}
.lede{color:var(--soft);max-width:46ch;text-wrap:pretty}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;font-weight:700;padding:.85em 1.3em;border-radius:999px;background:var(--white);color:var(--ink);
  transition:background .2s,color .2s,transform .3s var(--out)}
.btn:hover{background:var(--cy2);transform:translateY(-2px)} .btn:active{transform:scale(.97)}
.btn--ghost{background:none;color:var(--white);box-shadow:inset 0 0 0 1px rgba(255,255,255,.34)}
.btn--ghost:hover{background:rgba(255,255,255,.12);color:var(--white)}
.btns{display:flex;flex-wrap:wrap;gap:10px}
.more{display:inline-flex;align-items:center;gap:.55em;font-weight:700;padding:.3em 0;text-decoration:underline;text-decoration-color:rgba(255,255,255,.3);text-underline-offset:7px;text-decoration-thickness:2px;transition:text-decoration-color .2s,color .2s}
.more:hover{color:var(--cy2);text-decoration-color:var(--cy2)}

/* inner-page masthead: big type over a ribbon of slivers from the films */
.mast{padding-top:clamp(34px,7vh,84px)}
.mast__h{font-weight:800;font-size:clamp(3rem,9.6vw,6rem);line-height:.94;letter-spacing:-.04em;text-wrap:balance}
.mast__h .it{font-weight:500;color:var(--cy2);letter-spacing:-.02em}
.mast__p{color:var(--soft);max-width:60ch;margin-top:1.4rem;font-size:clamp(1rem,1.3vw,1.15rem);text-wrap:pretty}
.mast__row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1.4rem 3rem}
.ribbon{display:flex;gap:3px;height:clamp(54px,9vh,92px);margin-top:clamp(28px,5vh,56px);overflow:hidden}
.ribbon span{flex:1 1 0;min-width:0;background-size:cover;background-position:center;filter:brightness(.78) saturate(.92)}

/* ------------------------------------------------------------- home -- */
.wall__more{position:absolute;z-index:6;right:var(--gut);bottom:clamp(14px,3vh,26px);font-size:.9rem;text-shadow:0 1px 8px rgba(0,0,0,.9);transition:opacity .4s}
.wall.has-open .wall__more{opacity:0;pointer-events:none}

.roll{padding:clamp(56px,9vh,112px) 0}
/* client marks: one white treatment, sized to equal area (--k = sqrt(aspect) x optical weight), on an endless strip.
   home.js clones the list once (aria-hidden) and sets --dur from the strip's width so the speed holds steady. */
.marquee{position:relative;overflow:hidden;margin-top:clamp(22px,4vh,40px);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.marquee__track{display:flex;width:max-content;animation:marquee var(--dur,60s) linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
@keyframes marquee{to{transform:translate3d(-50%,0,0)}}
.logos{--u:clamp(58px,5.8vw,82px);display:flex;align-items:center;flex:none}
.logos li{flex:none;display:grid;place-items:center;height:clamp(108px,10vw,150px);padding:0 clamp(28px,3.4vw,56px)}
.logos img{width:calc(var(--u) * var(--k));max-height:calc(var(--u) * 1.06);height:auto;object-fit:contain;opacity:.9}
@media (max-width:800px){
  .logos{--u:clamp(46px,13vw,62px)}
  .logos li{height:112px;padding:0 22px}
  .marquee{-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
}
@media (prefers-reduced-motion:reduce){
  .marquee__track{animation:none}
  .marquee{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:none;mask-image:none}
  .marquee::-webkit-scrollbar{display:none}
  .logos[aria-hidden]{display:none}
}

.bands{display:flex;flex-direction:column;height:min(92svh,860px);min-height:540px;border-top:1px solid var(--hair)}
.band{position:relative;flex:1 1 0;min-height:0;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) auto;align-items:center;
  gap:clamp(12px,2.4vw,40px);padding:0 var(--gut);border-bottom:1px solid var(--hair);transition:flex-grow .7s var(--out)}
.band__bg{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center 35%;opacity:.26;transform:scale(1.05);filter:saturate(.85);transition:opacity .6s,transform 1.4s var(--out)}
.band::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.45) 55%,rgba(0,0,0,.2) 100%)}
.band--field .band__bg{background:var(--field);opacity:.34}
.band__t{font-weight:800;font-size:clamp(1.55rem,3.5vw,3.1rem);line-height:1;letter-spacing:-.035em;text-shadow:var(--shTxt)}
.band__d{color:var(--mist);font-size:.98rem;max-width:40ch;text-shadow:var(--shSm);opacity:.7;transition:opacity .4s}
.band__go{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.4);transition:background .2s,color .2s,transform .4s var(--out)}
@media (hover:hover){
  .band:hover,.band:focus-visible{flex-grow:2.3}
  .band:hover .band__bg,.band:focus-visible .band__bg{opacity:.62;transform:none}
  .band--field:hover .band__bg{opacity:.5}
  .band:hover .band__d{opacity:1}
  .band:hover .band__go{background:var(--white);color:var(--ink);transform:translateX(4px)}
}
.band:focus-visible{outline-offset:-4px}

.stills__row{display:flex;gap:3px;height:clamp(320px,64vh,640px)}
.still{position:relative;flex:1 1 0;min-width:0;overflow:hidden;border-radius:4px;background:var(--card);filter:brightness(.72) saturate(.9);transition:flex-grow .8s var(--out),filter .5s var(--out)}
.still img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.still span{position:absolute;left:14px;bottom:12px;font-size:.74rem;text-shadow:0 1px 6px rgba(0,0,0,.9);opacity:0;transition:opacity .3s;white-space:nowrap}
.still.is-open{flex-grow:var(--g,5);filter:none}
.still.is-open span{opacity:1;transition-delay:.3s}
.still:focus-visible{outline-offset:-4px}

/* ------------------------------------------------------------- work -- */
.reel{margin-bottom:clamp(34px,6vh,70px)}
.reel__head{display:flex;align-items:baseline;gap:.9rem;margin-bottom:12px}
.reel__n{color:var(--dim)}
.reel__row{display:flex;gap:3px;height:clamp(260px,46vh,440px);padding:0 var(--gut)}
.sl{position:relative;flex:1 1 0;min-width:0;overflow:hidden;background:var(--card);border-radius:4px;text-align:left;filter:brightness(.72) saturate(.9);
  transition:flex-grow .7s var(--out),filter .4s var(--out)}
.sl.is-live{filter:none}
.sl__pic{position:absolute;left:50%;top:0;height:100%;min-width:100%;transform:translateX(-50%)}
.sl--t .sl__pic{aspect-ratio:9/16}.sl--w .sl__pic{aspect-ratio:16/9}
.sl__pic img,.sl__pic video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sl__pic video{opacity:0;transition:opacity .35s}
.sl__pic video.is-live{opacity:1}
.sl::after{content:"";position:absolute;inset:auto 0 0 0;height:55%;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.82));pointer-events:none}
.sl__tab{position:absolute;z-index:2;left:50%;bottom:14px;writing-mode:vertical-rl;transform:translateX(-50%) rotate(180deg);white-space:nowrap;max-height:70%;overflow:hidden;
  font-family:var(--mono);font-weight:600;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;text-shadow:0 1px 5px rgba(0,0,0,.9);transition:opacity .2s}
.sl__info{position:absolute;z-index:3;left:0;bottom:0;width:var(--ow,100%);padding:0 18px 16px;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .25s,transform .5s var(--out)}
.sl__info b{display:block;font-weight:800;font-size:clamp(1.15rem,1.7vw,1.6rem);line-height:1.05;letter-spacing:-.025em;text-shadow:var(--shTxt)}
.sl__info .it{display:block;margin-top:.2em;color:var(--mist);text-shadow:var(--shSm)}
.sl__info .mono{display:flex;align-items:center;gap:.6em;margin-top:.7em;color:var(--mist);font-size:.72rem;white-space:nowrap}
.sl.is-live .sl__tab{opacity:0}
.sl.is-live .sl__info{opacity:1;transform:none;transition-delay:.22s}
.sl.is-dim{display:none}
.sl:focus-visible{outline-offset:-4px}
.reel.is-off{display:none}
.stills-sec{padding-top:clamp(40px,7vh,80px);border-top:1px solid var(--hair)}
.stills-sec.is-off{display:none}
.stills-sec .reel__head h3{font-weight:800}
.workbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:clamp(22px,4vh,40px) 0 clamp(26px,5vh,52px)}
.workbar .cats{flex-wrap:wrap}
.workbar .cats button{background:none}
.workbar .cats button[aria-pressed="true"]{background:var(--white)}


/* --------------------------------------------------------- services -- */
.svc{border-top:1px solid var(--hair)}
.svc>li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(18px,4vw,72px);align-items:start;padding:clamp(30px,5vh,52px) 0;border-bottom:1px solid var(--hair)}
.svc__head p{color:var(--soft);max-width:40ch;margin-top:.8rem}
.svc__head .svc__more{margin-top:1.2rem}
.svc__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(18px,2.6vw,40px);padding-top:.35rem}
.svc__list li{padding:.72em 0;border-top:1px solid var(--hair);color:var(--mist);font-weight:500;font-size:clamp(.95rem,1.15vw,1.06rem);line-height:1.35}
.split2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:center}
.split2__film{position:relative;border-radius:6px;overflow:hidden;background:var(--card);aspect-ratio:16/10}
.split2__film img,.split2__film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.split2__film figcaption{position:absolute;left:14px;top:12px;right:14px;font-size:.72rem;text-shadow:0 1px 6px rgba(0,0,0,.9)}
.split2 p+p{margin-top:1rem}
.cols{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.col{padding:clamp(20px,2.6vw,36px);border-left:1px solid var(--hair);display:flex;flex-direction:column;gap:.9rem}
.col:first-child{border-left:0;padding-left:0}
.col .mono{color:var(--cy2)}
.col p{color:var(--soft)}
.col dl{margin:.4rem 0 0;border-top:1px solid var(--hair)}
.col dl div{display:flex;justify-content:space-between;gap:1rem;padding:.6rem 0;border-bottom:1px solid var(--hair);font-size:.92rem}
.col dt{color:var(--dim)} .col dd{margin:0;text-align:right}
.col .more{margin-top:auto;align-self:flex-start}
.col__big{font-weight:800;font-size:clamp(2.2rem,4vw,3.4rem);line-height:1;letter-spacing:-.04em}
.note{color:var(--dim);font-size:.92rem;max-width:70ch;margin-top:1.4rem}
.terms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(24px,5vw,80px);border-top:1px solid var(--hair)}
.terms div{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--hair);font-size:.95rem}
.terms dt{color:var(--dim)} .terms dd{margin:0}
.cta{text-align:center;padding:clamp(70px,13vh,150px) var(--gut)}
.cta .h2{font-size:clamp(2.6rem,8vw,6rem)}
.cta p{color:var(--soft);margin:1.1rem auto 1.8rem}
.cta .btns{justify-content:center}

/* ----------------------------------------------------------- rentals -- */
.rentnav{position:sticky;top:0;z-index:30;background:rgba(0,0,0,.92);border-bottom:1px solid var(--hair)}
.rentnav .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:10px;padding-bottom:10px}
.rentnav ul{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none}
.rentnav ul::-webkit-scrollbar{display:none}
.rentnav a{display:block;font-size:.84rem;font-weight:600;padding:.46em .9em;border-radius:999px;color:var(--mist);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);white-space:nowrap;transition:background .2s,color .2s}
.rentnav a:hover{background:rgba(255,255,255,.12)}
.rentnav a[aria-current="true"]{background:var(--white);color:var(--ink);box-shadow:none}
.rentnav .mono{color:var(--dim);white-space:nowrap}
.kit{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:clamp(16px,4vw,64px);padding:clamp(30px,5vh,56px) 0;border-bottom:1px solid var(--hair)}
.kit__n{color:var(--dim);display:block;margin-top:.6rem}
.kit__rows{columns:2;column-gap:clamp(20px,4vw,56px)}
.kit__rows li{break-inside:avoid;padding:.62rem 0;border-bottom:1px solid var(--hair);font-size:.98rem}
.kit__rows li i{font-style:normal;color:var(--dim);font-size:.88em;margin-left:.4em}
.kit__rows .kit__sub{border-bottom:0;padding-top:1.5rem;font-family:var(--mono);font-weight:600;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cy2)}

/* ----------------------------------------------------------- contact -- */
.contact{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(28px,6vw,96px);padding-bottom:clamp(64px,10vh,120px)}
.form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form label{display:flex;flex-direction:column;gap:.45rem;font-size:.86rem;font-weight:600;color:var(--soft)}
.form .full{grid-column:1 / -1}
.form input,.form select,.form textarea{font:inherit;font-weight:400;color:var(--white);background:var(--card);border:0;border-radius:6px;padding:.85em 1em;box-shadow:inset 0 0 0 1px #263136;width:100%}
.form textarea{min-height:9.5rem;resize:vertical}
.form input::placeholder,.form textarea::placeholder{color:#74828A}
.form input:focus-visible,.form select:focus-visible,.form textarea:focus-visible{outline:2px solid var(--cy2);outline-offset:1px}
.form input[type="date"]{color-scheme:dark}
.form select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#B9C4C9 50%),linear-gradient(135deg,#B9C4C9 50%,transparent 50%);background-position:calc(100% - 20px) 55%,calc(100% - 14px) 55%;background-size:6px 6px;background-repeat:no-repeat}
.form__foot{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px}
.form__foot p{color:var(--dim);font-size:.88rem}
.form .err{color:#FF9D9D;font-weight:500;font-size:.82rem;min-height:1.1em}
.ways{border-top:1px solid var(--hair)}
.ways li{border-bottom:1px solid var(--hair)}
.ways a,.ways div{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:1rem 0;transition:color .2s}
.ways a:hover{color:var(--cy2)}
.ways .mono{color:var(--dim)}
.ways strong{font-weight:700;text-align:right;overflow-wrap:anywhere}

/* ------------------------------------------------------------ footer -- */
.foot{border-top:1px solid var(--hair);padding:22px var(--gut) 30px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 28px;color:var(--dim);font-size:.88rem}
.foot nav{display:flex;flex-wrap:wrap;gap:6px 20px}
.foot a{color:var(--soft);transition:color .2s}
.foot a:hover{color:var(--cy2)}

/* ------------------------------------------------------------ phones -- */
@media (max-width:1240px){
  .snd span{display:none}.snd{padding:.6em .7em}
}
@media (max-width:1000px){
  .hud__nav>a:not(.hud__cta){display:none}
  .hud__menu{display:inline-flex}
  .band{grid-template-columns:minmax(0,1fr) auto}
  .band__d{grid-column:1 / 2;grid-row:2;opacity:.85}
  .band{row-gap:.4rem;align-content:center}
  .split2,.contact{grid-template-columns:1fr}
  .cols{grid-template-columns:1fr}
  .col{border-left:0;border-top:1px solid var(--hair);padding-left:0;padding-right:0}
  .col:first-child{border-top:0}
  .kit{grid-template-columns:1fr}
}
@media (max-width:800px){
  .hud--over{position:relative;flex-wrap:wrap;padding-top:14px;pointer-events:auto}
  .hud--over .cats{order:3;flex:1 0 100%;overflow-x:auto;scrollbar-width:none;margin:2px calc(var(--gut) * -1) 0;padding:4px var(--gut) 6px}
  .hud--over .cats::-webkit-scrollbar{display:none}
  .hud--over .cats button{background:var(--panel);font-size:.84rem;padding:.5em .95em}
  .hud--over .cats button[aria-pressed="true"]{background:var(--white)}
  .wall__more{position:static;display:inline-flex;margin:14px var(--gut) 4px}
  .bands{height:auto;min-height:0}
  .band{flex:none;padding-top:22px;padding-bottom:22px}
  .stills__row{height:auto;overflow-x:auto;scroll-snap-type:x mandatory;gap:8px;margin:0 calc(var(--gut) * -1);padding:0 var(--gut);scrollbar-width:none}
  .stills__row::-webkit-scrollbar{display:none}
  .still,.still.is-open{flex:0 0 78vw;height:auto;aspect-ratio:4/5;filter:none;scroll-snap-align:center}
  .still span{opacity:1}
  .reel__row{height:auto;overflow-x:auto;scroll-snap-type:x proximity;gap:8px;scrollbar-width:none}
  .reel__row::-webkit-scrollbar{display:none}
  .sl{flex:0 0 auto;height:250px;filter:none;scroll-snap-align:start}
  .sl--t{width:150px}.sl--w{width:300px}
  .sl__pic{left:0;width:100%;transform:none;aspect-ratio:auto!important}
  .sl__tab{display:none}
  .sl__info{opacity:1;transform:none;padding:0 12px 12px;width:100%}
  .sl__info b{font-size:1rem}
  .sl__info .it{font-size:.84rem}
  .sl__info .mono{display:none}
  .sl--t .sl__info b{font-size:.92rem}
  .sl--t .sl__info .it{font-size:.8rem;line-height:1.2}
  .svc>li{grid-template-columns:1fr;row-gap:1.4rem}
  .terms{grid-template-columns:1fr}
  .terms div{grid-template-columns:minmax(0,8.5rem) minmax(0,1fr)}
  .kit__rows{columns:1}
  .form{grid-template-columns:1fr}
  .rentnav .mono{display:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .band,.band__bg,.band__d,.band__go,.still,.sl,.sl__info,.menu,.menu__links a,.btn,.hud__cta,.ix{transition:none}
}
.stills__more{margin-top:clamp(18px,3vh,28px)}
