/* Sound Shine Miami — site */
@font-face{font-family:"Geist";src:url("fonts/Geist-Variable.woff2") format("woff2-variations"),url("fonts/Geist-Variable.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Geist Mono";src:url("fonts/GeistMono-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
:root{
  --size:1440;
  --bg:#000;
  --fg:#fff;
  --mute:rgba(255,255,255,.5);
  --line:rgba(255,255,255,.14);
  --accent:#ef2d7b;
  --ease:cubic-bezier(.19,1,.22,1);
  --px:8rem;
  --py:4rem;
}
@media (max-width:649px){:root{--size:390;--px:2rem;--py:2.4rem}}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:clamp(7px,calc(10 * 100vw / var(--size)),14px);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:transparent;background:var(--bg)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{background:var(--bg);color:var(--fg);font-family:"Geist",system-ui,sans-serif;font-size:1.5rem;line-height:1.45;font-weight:400;overflow-x:hidden}
body.locked{overflow:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;letter-spacing:inherit;text-align:inherit}
img{display:block;max-width:100%}
::selection{background:var(--accent);color:#fff}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.label{font-size:max(1.1rem,10px);font-weight:500;text-transform:uppercase;letter-spacing:.02em;line-height:1.25}
.mute{color:var(--mute)}
.wrap{padding:0 var(--px)}
.hit{position:relative}
.hit::before{content:"";position:absolute;inset:-1.2rem}
.dot{display:inline-block;width:.7rem;height:.7rem;border-radius:50%;background:var(--accent);flex:none}

/* ---------- text reveals ---------- */
.ln{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.ln>span{display:block;transform:translateY(105%);transition:transform 1.3s var(--ease);transition-delay:calc(var(--i,0) * 70ms)}
.in .ln>span,.ln.in>span{transform:none}
.fade{opacity:0;transform:translateY(2rem);transition:opacity 1.2s var(--ease),transform 1.4s var(--ease);transition-delay:calc(var(--i,0) * 70ms)}
.in .fade,.fade.in{opacity:1;transform:none}
.words .w{opacity:.38;transition:opacity .2s linear}

/* ---------- buttons ---------- */
.pill{height:4.6rem;padding:0 2.4rem;border-radius:999px;display:inline-flex;align-items:center;gap:1rem;font-size:1.4rem;letter-spacing:-.02em;white-space:nowrap;transition:background .35s,color .35s,border-color .35s}
.pill.w{background:#fff;color:#000}
.pill.w:hover{background:var(--accent);color:#fff}
.pill.g{border:1px solid rgba(255,255,255,.3)}
.pill.g:hover{background:#fff;color:#000;border-color:#fff}
.pill .ar{display:inline-block;transition:transform .5s var(--ease)}
.pill:hover .ar{transform:translate(.2rem,-.2rem)}

/* ---------- header ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;padding:var(--py) var(--px) 0;display:flex;justify-content:space-between;align-items:flex-start;mix-blend-mode:difference;pointer-events:none}
.nav a,.nav button{pointer-events:auto}
.nav .brand{display:flex;align-items:center}
.nav .brand img{height:3.6rem;width:auto;display:block}
.nav .brand{transition:opacity .6s var(--ease),transform .8s var(--ease)}
.past-hero .nav .brand{opacity:0;transform:translateY(-1.2rem);pointer-events:none}
@media (max-width:649px){.nav .brand img{height:3rem}}
.nav ul{display:flex;gap:3.2rem;list-style:none}
.nav ul a{transition:opacity .3s}
.nav ul a:hover{opacity:.55}
.nav .menu-btn{display:none}
.nav-r{display:flex;align-items:center;gap:3.2rem}
.lang{display:flex;align-items:center;gap:.5rem}
.lang button{transition:opacity .3s}
.lang button[aria-pressed="false"]{opacity:.45}
.lang button:hover{opacity:1}
main,footer{transition:opacity .35s var(--ease)}
.swapping main,.swapping footer{opacity:0}
.menu{position:fixed;inset:0;z-index:49;background:#000;padding:12rem var(--px) var(--py);display:flex;flex-direction:column;justify-content:space-between;visibility:hidden;opacity:0;transition:opacity .5s,visibility 0s .5s}
.menu.open{visibility:visible;opacity:1;transition:opacity .5s}
.menu a.big{display:block;font-size:4.8rem;letter-spacing:-.05em;line-height:1.05;padding:.4rem 0}
@media (max-width:820px){
  .nav ul,.nav .dealer{display:none}
  .nav-r{margin-left:auto;margin-right:2.4rem}
  .nav .menu-btn{display:block}
}

/* ---------- loader ---------- */
.cover{position:fixed;inset:0;z-index:99;background:#000;transition:opacity 1.2s var(--ease)}
.loader{position:fixed;inset:0;z-index:100;display:grid;place-items:center;pointer-events:none;transition:opacity .6s}
.lmark{width:9rem;height:9rem;transition:transform 1.2s var(--ease)}
.lmark svg{width:100%;height:100%;overflow:visible}
.lmark line{transition:opacity .25s}
.loaded .lmark{transform:scale(1.6) rotate(45deg)}
.loader .bar{width:5rem;height:.5rem;border-radius:2rem;background:rgba(255,255,255,.18);overflow:hidden}
.loader .bar i{display:block;height:100%;background:#fff;transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.loaded .cover{opacity:0;pointer-events:none}
.loaded .loader{opacity:0}

/* ---------- hero: live sound field ---------- */
#gl{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.hero{position:relative;height:100svh;min-height:64rem;z-index:3;background:#000;overflow:hidden}
#field{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-glow{position:absolute;left:50%;top:46%;width:70vw;height:50vh;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(239,45,123,.18),rgba(239,45,123,0));pointer-events:none;mix-blend-mode:screen;opacity:0;transition:opacity 2s var(--ease)}
.loaded .hero-glow{opacity:1}
.hero-ui{position:absolute;inset:0;z-index:2;pointer-events:none}
.hero-ui a,.hero-ui button{pointer-events:auto}
.hero-top{position:absolute;left:var(--px);right:var(--px);top:10.5rem;display:grid;grid-template-columns:1fr auto 1fr;gap:2rem}
.hero-top>:nth-child(2){text-align:center}
.hero-top>:last-child{text-align:right}
.mega{position:absolute;left:var(--px);right:var(--px);bottom:9.6rem;display:flex;align-items:center;gap:.1em;font-size:clamp(5rem,12vw,23rem);font-weight:500;letter-spacing:-.055em;line-height:.8;white-space:nowrap;will-change:transform}
.mega .mk{flex:none;width:1.08em;height:1.08em;margin-right:.04em;transform:scale(.3) rotate(-140deg);opacity:0;transition:transform 2s var(--ease),opacity 1s var(--ease);transition-delay:.1s}
.mega .mk svg{width:100%;height:100%;overflow:visible;display:block}
.hero.in .mega .mk{transform:none;opacity:1}
.mega .word{display:inline-block}
.mega .wd{display:inline-block;overflow:hidden;padding:.18em .02em .06em;margin:-.18em -.02em -.06em;vertical-align:bottom}
.mega .ch{display:inline-block;transform-origin:50% 100%;will-change:transform}
.mega .ci{display:inline-block;transform:translateY(110%) rotate(8deg);transform-origin:0 100%;transition:transform 1.5s var(--ease);transition-delay:calc(var(--i) * 45ms + 350ms)}
.hero.in .mega .ci{transform:none}
.mega .tag{align-self:flex-end;margin:0 0 .02em .3em;font-family:"Geist Mono",ui-monospace,monospace;font-size:max(.085em,11px);font-weight:400;letter-spacing:.32em;text-transform:uppercase;color:var(--accent);line-height:1;opacity:0;transition:opacity 1.2s var(--ease) 1.2s}
.hero.in .mega .tag{opacity:1}
.side-h{font-size:3.6rem;font-weight:400;letter-spacing:-.05em;line-height:1;margin-bottom:1.6rem}
.hero-side{position:absolute;right:var(--px);bottom:calc(9.6rem + 12vw * .9 + 3.6rem);width:34rem}
.hero-side p{font-size:1.6rem;line-height:1.4;letter-spacing:-.01em;color:rgba(255,255,255,.8)}
.hero-side .acts{display:flex;gap:.8rem;margin-top:2.4rem;flex-wrap:wrap}
.hero-bar{position:absolute;left:var(--px);right:var(--px);bottom:var(--py);display:flex;justify-content:space-between;align-items:center;gap:2rem}
.hero-bar ul{list-style:none;display:flex;gap:.4rem 2.4rem;flex-wrap:wrap}
.scroll-cue{display:flex;align-items:center;gap:1rem}
.scroll-cue i{display:block;width:1px;height:2.4rem;background:rgba(255,255,255,.25);position:relative;overflow:hidden}
.scroll-cue i::after{content:"";position:absolute;left:0;top:-100%;width:100%;height:100%;background:#fff;animation:cue 2s var(--ease) infinite}
@keyframes cue{to{top:100%}}
.sound{display:flex;align-items:center;gap:1.2rem;height:3.6rem;padding:0 1.6rem;border:1px solid rgba(255,255,255,.25);border-radius:999px;transition:background .3s,color .3s,border-color .3s}
.sound:hover{border-color:#fff}
.sound[aria-pressed="true"]{background:#fff;color:#000;border-color:#fff}
.eq{display:flex;align-items:flex-end;gap:2px;height:1.2rem}
.eq b{display:block;width:2px;height:30%;background:currentColor;border-radius:1px}
.sound[aria-pressed="true"] .eq b{animation:eq .9s ease-in-out infinite alternate}
.eq b:nth-child(2){animation-delay:-.3s!important}
.eq b:nth-child(3){animation-delay:-.6s!important}
.eq b:nth-child(4){animation-delay:-.15s!important}
@keyframes eq{0%{height:20%}100%{height:100%}}
.hero .fade{transition-duration:1.4s}
.hero.in .fade{opacity:1;transform:none}
@media (max-width:649px){
  .hero-top{grid-template-columns:1fr 1fr;top:8.4rem}
  .hero-top>:nth-child(2){display:none}
  .mega{font-size:17.5vw;flex-wrap:wrap;row-gap:.12em;bottom:8.4rem}
  .mega .mk{width:.9em;height:.9em}
  .mega .word{order:3;width:100%}
  .mega .tag{align-self:center;margin-left:.3em}
  .hero-side{left:var(--px);right:var(--px);width:auto;bottom:calc(8.4rem + 17.5vw * 2 + 2.4rem)}
  .side-h{font-size:3rem}
  .hero-side p{font-size:1.5rem}
  .hero-side .acts .g{display:none}
  .hero-bar ul{display:none}
}

/* ---------- reel (card slider) ---------- */
.reel{position:relative;height:84svh;min-height:56rem;z-index:2}
.reel-head{position:absolute;left:var(--px);right:var(--px);top:6rem;display:flex;justify-content:space-between;gap:2rem;z-index:4;pointer-events:none}
.counter{font-variant-numeric:tabular-nums}
.stage{position:absolute;inset:0;z-index:3;overflow:clip;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:pan-y}
.stage.dragging{cursor:grabbing}
.card{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform;border-radius:2rem;cursor:pointer}
.card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;pointer-events:none;-webkit-user-drag:none;transition:opacity .4s}
.card[data-fit="contain"] img{object-fit:contain;background:#fff;padding:8%}
.gl-on .card img{opacity:0}
.card .cap{position:absolute;left:1.8rem;right:1.2rem;bottom:1.2rem;display:flex;justify-content:space-between;align-items:flex-end;pointer-events:none}
.card .t{font-size:1.7rem;letter-spacing:-.05em;white-space:nowrap;line-height:1;transition:transform 1s var(--ease),opacity .6s}
.card[data-tone="dark"] .t{color:#000}
.card .ic{width:2.6rem;height:2.6rem;border-radius:50%;background:#000;color:#fff;display:grid;place-items:center;font-size:1.2rem;transform:scale(0);transition:transform .6s var(--ease)}
.card:hover .ic{transform:scale(1)}
.card.pre .t{transform:translateY(160%);opacity:0}
.detail-open .card .t{opacity:0}
@media (max-width:649px){
  .reel{height:70svh;min-height:46rem}
  .reel-head{top:4rem}
  .card{border-radius:1.4rem}
  .card .t{font-size:1.5rem}
}

/* ---------- cursor ---------- */
.cursor{position:fixed;left:0;top:0;z-index:300;pointer-events:none;mix-blend-mode:difference;display:none}
.has-cursor .cursor{display:block}
.c-dot,.c-ring{position:absolute;left:0;top:0;border-radius:50%;will-change:transform}
.c-dot{width:.6rem;height:.6rem;margin:-.3rem 0 0 -.3rem;background:#fff;transition:opacity .3s}
.c-ring{width:4rem;height:4rem;margin:-2rem 0 0 -2rem;border:1px solid rgba(255,255,255,.6);display:grid;place-items:center;transition:width .5s var(--ease),height .5s var(--ease),margin .5s var(--ease),background .4s,border-color .4s}
.c-ring span{font-size:1rem;font-weight:500;text-transform:uppercase;letter-spacing:.04em;color:#000;opacity:0;transition:opacity .3s}
.cursor.link .c-ring{width:6rem;height:6rem;margin:-3rem 0 0 -3rem;border-color:#fff}
.cursor.label .c-ring{width:8.4rem;height:8.4rem;margin:-4.2rem 0 0 -4.2rem;background:#fff;border-color:#fff}
.cursor.label .c-ring span{opacity:1}
.cursor.label .c-dot{opacity:0}
.cursor.hide{opacity:0}
.has-cursor,.has-cursor a,.has-cursor button,.has-cursor .stage,.has-cursor .card{cursor:none}

/* ---------- sections ---------- */
main>section:not(.hero):not(.reel),footer{position:relative;z-index:2;background:var(--bg)}
.sec{padding:16rem var(--px)}
.sec-head{display:grid;grid-template-columns:24rem 1fr;gap:2.4rem;margin-bottom:8rem}
.sec-head .label{padding-top:1.4rem}
.h2{font-size:clamp(3.6rem,5.6vw,9rem);font-weight:400;letter-spacing:-.055em;line-height:.95;max-width:110rem}
.h2 em{font-style:normal;color:rgba(255,255,255,.55)}
@media (max-width:820px){
  .sec{padding:10rem var(--px)}
  .sec-head{grid-template-columns:1fr;gap:1.6rem;margin-bottom:5rem}
  .sec-head .label{padding-top:0}
}

/* about */
.about .statement{font-size:clamp(2.6rem,3.6vw,5.4rem);letter-spacing:-.045em;line-height:1.08;max-width:118rem}
.facts{display:grid;grid-template-columns:repeat(4,1fr);margin-top:10rem;border-top:1px solid var(--line)}
.facts div{padding:2.4rem 2.4rem 0 0}
.facts b{display:block;font-size:clamp(3.2rem,4vw,6rem);font-weight:400;letter-spacing:-.05em;line-height:1}
.facts span{display:block;margin-top:1rem}
@media (max-width:820px){.facts{grid-template-columns:1fr 1fr;row-gap:3.2rem;margin-top:6rem}}

/* marquee */
.marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:3.2rem 0}
.marquee .track{display:flex;width:max-content;will-change:transform}
.marquee .track span{font-size:clamp(4rem,7vw,11rem);letter-spacing:-.055em;line-height:1;white-space:nowrap;padding-right:4rem;display:flex;align-items:center;gap:4rem}
.marquee .track span::after{content:"";width:1.6rem;height:1.6rem;border-radius:50%;background:var(--accent);flex:none}

/* brands */
.brand-list{list-style:none;border-top:1px solid var(--line)}
.brand-list li{display:grid;grid-template-columns:6rem 1fr auto;align-items:center;gap:2rem;padding:2.4rem 0;border-bottom:1px solid var(--line);cursor:default}
.brand-list .nm{font-size:clamp(3.2rem,5.2vw,8rem);letter-spacing:-.055em;line-height:1;transition:transform .8s var(--ease),color .4s}
.brand-list li:hover .nm{transform:translateX(2rem)}
.brand-list .ct{text-align:right;transition:color .4s}
.brand-list li:hover .ct{color:#fff}
.brand-list li .dot{transform:scale(0);transition:transform .5s var(--ease);margin-right:1rem}
.brand-list li:hover .dot{transform:scale(1)}
@media (max-width:649px){.brand-list li{grid-template-columns:3.6rem 1fr}.brand-list .ct{display:none}}

/* featured — particle assembly */
.featured{padding:0}
.feat-pin{position:relative;height:320svh}
.feat-sticky{position:sticky;top:0;height:100lvh;min-height:56rem;overflow:hidden;background:#000}
.feat-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#pgl{position:absolute;inset:0;width:100%;height:100%;display:block}
.pgl-on .feat-img{opacity:0}
.feat-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35) 0,rgba(0,0,0,0) 25%,rgba(0,0,0,0) 45%,rgba(0,0,0,.8));pointer-events:none;opacity:0;transition:opacity 1.2s var(--ease)}
.feat-sticky.formed .feat-shade{opacity:1}
.feat-copy{position:absolute;left:var(--px);right:var(--px);bottom:6rem;z-index:2;display:grid;grid-template-columns:1fr 44rem;gap:4rem;align-items:end}
.feat-copy h3{font-size:clamp(4.4rem,8vw,13rem);font-weight:400;letter-spacing:-.06em;line-height:.9}
.feat-copy p{font-size:1.6rem;line-height:1.45;color:rgba(255,255,255,.82)}
.feat-copy .acts{margin-top:2.4rem}
.feat-sticky .ln>span{transition-duration:1.2s}
.feat-sticky:not(.formed) .ln>span{transform:translateY(105%);transition-duration:.6s;transition-delay:0s}
.feat-sticky:not(.formed) .fade{opacity:0;transform:translateY(2rem);transition-duration:.5s;transition-delay:0s}
.feat-sticky.formed .ln>span{transform:none}
.feat-sticky.formed .fade{opacity:1;transform:none}
.feat-meter{position:absolute;right:var(--px);top:10.5rem;z-index:2;display:flex;align-items:center;gap:1.2rem}
.feat-meter i{display:block;width:12rem;height:1px;background:rgba(255,255,255,.2);position:relative;overflow:hidden}
.feat-meter b{position:absolute;inset:0;background:var(--accent);transform-origin:left;transform:scaleX(0)}
@media (max-width:820px){.feat-copy{grid-template-columns:1fr;bottom:4rem;gap:2.4rem}.feat-meter{top:8.4rem}.feat-pin{height:260svh}}

/* products index */
.plist{list-style:none;border-top:1px solid var(--line)}
.plist li{border-bottom:1px solid var(--line)}
.plist button{width:100%;display:grid;grid-template-columns:6rem 1fr 24rem 16rem 10rem 3rem;align-items:center;gap:2rem;padding:2.2rem 0;transition:opacity .5s var(--ease)}
.plist .th{display:none}
.plist .nm{font-size:clamp(2.4rem,3.2vw,4.8rem);letter-spacing:-.05em;line-height:1;transition:transform .8s var(--ease)}
.plist .pr{text-align:right;font-size:1.6rem;letter-spacing:-.02em}
.plist .ar{text-align:right;transition:transform .5s var(--ease),color .3s}
.plist.hot button{opacity:.45}
.plist.hot button.on{opacity:1}
.plist button.on .nm{transform:translateX(2rem)}
.plist button.on .ar{transform:translate(.3rem,-.3rem);color:var(--accent)}
.pnote{display:flex;justify-content:space-between;gap:2rem;margin-top:3.2rem;flex-wrap:wrap}
.pnote a{border-bottom:1px solid currentColor}
#products{position:relative;overflow:hidden}
#products>*:not(.pf-ghost){position:relative;z-index:1}
.pf-ghost{position:absolute;left:0;top:0;z-index:0;font-size:22vw;font-weight:500;letter-spacing:-.06em;line-height:1;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.14);pointer-events:none;opacity:0;transition:opacity .6s var(--ease);will-change:transform}
.pf-ghost.on{opacity:1}
.pfloat{position:fixed;left:0;top:0;z-index:30;width:38rem;height:38rem;pointer-events:none;will-change:transform}
.pf-in{position:absolute;inset:0;opacity:0;transform:scale(.6) rotate(-8deg);transition:opacity .45s var(--ease),transform .9s var(--ease)}
.pfloat.on .pf-in{opacity:1;transform:none}
.pf-spot{position:absolute;inset:-20%;background:radial-gradient(closest-side,rgba(255,255,255,.16),rgba(255,255,255,.04) 55%,transparent),radial-gradient(40% 18% at 50% 88%,rgba(239,45,123,.45),transparent 70%);filter:blur(2px)}
.pf-imgs{position:absolute;inset:8%;animation:bob 4s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-2.4%)}}
.pf-imgs img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:translateY(30%) scale(.8) rotate(6deg);filter:blur(16px);transition:opacity .5s var(--ease),transform 1s var(--ease),filter .7s var(--ease)}
.pf-imgs img.in{opacity:1;transform:none;filter:drop-shadow(0 0 .08rem rgba(255,255,255,.55)) drop-shadow(0 2.4rem 3rem rgba(239,45,123,.35))}
.pf-imgs img.out{opacity:0;transform:translateY(-26%) scale(1.08) rotate(-6deg);filter:blur(12px)}
.pf-meta{position:absolute;left:0;right:0;bottom:-2.4rem;display:flex;justify-content:space-between}
@media (max-width:900px){
  .plist button{grid-template-columns:6.4rem 1fr auto;gap:1.4rem;padding:1.4rem 0}
  .plist .th{display:block;width:6.4rem;height:6.4rem;border-radius:.8rem;background:radial-gradient(closest-side,rgba(255,255,255,.16),rgba(255,255,255,.03));overflow:hidden}
  .plist .th img{width:100%;height:100%;object-fit:contain;padding:8%}
  .plist .num,.plist .ct,.plist .sk,.plist .ar{display:none}
  .plist .nm{font-size:2.2rem}
  .plist .sub{display:block}
  .pfloat,.pf-ghost{display:none}
}
.plist .sub{display:none;margin-top:.6rem}

/* audience — interactive */
.aud{display:grid;grid-template-columns:1fr 1fr;gap:8rem;align-items:start}
.aud-media{position:sticky;top:10rem;border-radius:2rem;overflow:hidden;aspect-ratio:4/5;background:#0b0b0b;isolation:isolate}
.aud-media .pz{position:absolute;inset:-4%;transform:translate3d(var(--px,0px),var(--py,0px),0);transition:transform 1.2s var(--ease)}
.aud-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;clip-path:inset(100% 0 0 0);transform:scale(1.22);transition:clip-path 1.15s cubic-bezier(.77,0,.18,1),transform 1.8s var(--ease)}
.aud-media img.on{clip-path:inset(0 0 0 0);transform:scale(1.04)}
.aud-shade{position:absolute;inset:0;z-index:50;background:linear-gradient(180deg,rgba(0,0,0,.25),transparent 30%,transparent 55%,rgba(0,0,0,.7));pointer-events:none}
.aud-cap{position:absolute;left:2.4rem;right:2.4rem;bottom:2.2rem;z-index:51;display:flex;align-items:baseline;gap:1.6rem}
.aud-num{color:var(--accent)}
.aud-name{display:block;overflow:hidden;font-size:clamp(2.2rem,2.4vw,3.6rem);letter-spacing:-.045em;line-height:1.05;padding-bottom:.08em}
.aud-name span{display:block}
.aud-name span.roll{animation:roll .9s var(--ease) both}
@keyframes roll{from{transform:translateY(105%)}to{transform:none}}
.aud-prog{position:absolute;top:2.2rem;left:2.4rem;right:2.4rem;z-index:51;display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem}
.aud-prog i{display:block;height:2px;border-radius:2px;background:rgba(255,255,255,.25);overflow:hidden;position:relative}
.aud-prog i::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease)}
.aud-prog i.done::after{transform:scaleX(1)}
.aud-prog i.on::after{background:var(--accent);transform:scaleX(1)}
.aud .lead{font-size:1.8rem;line-height:1.45;letter-spacing:-.015em;color:rgba(255,255,255,.75);max-width:48rem;margin-top:3.2rem}
.aud-list{list-style:none;border-top:1px solid var(--line);margin-top:6rem}
.aud-list li{position:relative;border-bottom:1px solid var(--line)}
.aud-list li::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 1s var(--ease)}
.aud-list li.on::after{transform:scaleX(1)}
.aud-row{display:grid;grid-template-columns:5rem 1fr auto;gap:2rem;align-items:start;padding:2.8rem 0}
.aud-row .n{padding-top:1.2rem;color:rgba(255,255,255,.4);transition:color .4s}
.aud-row b{display:block;font-size:clamp(2.8rem,3.4vw,5.2rem);font-weight:400;letter-spacing:-.05em;line-height:1;color:rgba(255,255,255,.45);transition:color .5s var(--ease),transform .9s var(--ease)}
.aud-d{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .8s var(--ease),opacity .6s var(--ease),margin .8s var(--ease)}
.aud-d>span{overflow:hidden;min-height:0;font-size:1.6rem;line-height:1.45;color:rgba(255,255,255,.65);max-width:40rem}
.aud-row .ar{font-size:2.4rem;padding-top:.6rem;opacity:0;transform:translate(-.8rem,.8rem);transition:opacity .5s,transform .7s var(--ease)}
.aud-list li.on b{color:#fff;transform:translateX(1.2rem)}
.aud-list li.on .n{color:var(--accent)}
.aud-list li.on .aud-d{grid-template-rows:1fr;opacity:1;margin-top:1.4rem}
.aud-list li.on .ar{opacity:1;transform:none;color:var(--accent)}
@media (max-width:820px){.aud{grid-template-columns:1fr;gap:5rem}.aud-media{position:relative;top:0;aspect-ratio:4/3}.aud-row{grid-template-columns:3.6rem 1fr auto}}

/* contact */
.display{font-weight:400;letter-spacing:-.06em;line-height:.88}
.contact .display{font-size:clamp(5.6rem,12vw,21rem)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:8rem;margin-top:8rem}
.channels{list-style:none;border-top:1px solid var(--line)}
.channels a{display:flex;justify-content:space-between;align-items:center;padding:2.4rem 0;border-bottom:1px solid var(--line);transition:padding .5s var(--ease),color .3s}
.channels a:hover{padding-left:1.2rem;color:var(--accent)}
.channels .v{display:block;font-size:2.4rem;letter-spacing:-.04em;margin-top:.6rem}
.channels .ar{font-size:2rem}
form.cf{display:grid;grid-template-columns:1fr 1fr;gap:3.2rem 2.4rem}
.cf .f{display:flex;flex-direction:column;gap:1rem}
.cf .full{grid-column:1/-1}
.cf input,.cf textarea{font:inherit;font-size:max(1.8rem,16px);letter-spacing:-.02em;color:#fff;background:none;border:0;border-bottom:1px solid var(--line);padding:.6rem 0 1.2rem;outline:none;border-radius:0;transition:border-color .3s;width:100%}
.cf input:focus,.cf textarea:focus{border-color:#fff}
.cf input::placeholder,.cf textarea::placeholder{color:rgba(255,255,255,.5)}
.cf textarea{resize:vertical;min-height:12rem}
.seg{display:flex;gap:.8rem;flex-wrap:wrap}
.seg button{height:3.6rem;padding:0 1.6rem;border-radius:999px;border:1px solid var(--line);transition:background .3s,color .3s,border-color .3s}
.seg button[aria-pressed="true"]{background:#fff;color:#000;border-color:#fff}
.cf .send{display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap}
@media (max-width:820px){.contact-grid{grid-template-columns:1fr;gap:6rem;margin-top:5rem}form.cf{grid-template-columns:1fr}}

/* footer */
footer{padding:12rem var(--px) var(--py);border-top:1px solid var(--line);overflow:hidden}
.foot-top{display:flex;justify-content:space-between;gap:4rem;flex-wrap:wrap}
.foot-top ul{list-style:none;display:flex;gap:3.2rem;flex-wrap:wrap}
.foot-top ul a{transition:opacity .3s}
.foot-top ul a:hover{opacity:.55}
.wordmark{position:relative;margin:8rem 0 3rem}
#ftxt{display:block;width:100%}
.foot-bot{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap}

/* ---------- detail overlay ---------- */
.d-back{position:fixed;inset:0;z-index:60;background:#000;opacity:0;visibility:hidden;transition:opacity .8s var(--ease),visibility 0s .8s}
.detail-open .d-back{opacity:1;visibility:visible;transition:opacity .8s var(--ease)}
.detail-open #gl{z-index:61}
.detail{position:fixed;z-index:62;top:0;bottom:0;right:var(--px);left:58vw;display:flex;flex-direction:column;justify-content:center;visibility:hidden;pointer-events:none}
.detail.show{visibility:visible;pointer-events:auto}
.detail h2{font-size:clamp(4rem,5.4vw,8rem);font-weight:400;letter-spacing:-.055em;line-height:.95;margin-top:1.6rem}
.detail .desc{margin-top:2.4rem;font-size:1.6rem;line-height:1.45;max-width:46rem;color:rgba(255,255,255,.72)}
.detail dl{margin-top:3.2rem;max-width:46rem}
.detail dl div{display:flex;justify-content:space-between;gap:2rem;padding:1.2rem 0;border-top:1px solid var(--line)}
.detail dl div:last-child{border-bottom:1px solid var(--line)}
.detail dd{text-align:right}
.detail .acts{display:flex;gap:.8rem;margin-top:3.2rem;flex-wrap:wrap}
.detail .ln>span,.detail .fade{transition-duration:1.1s}
.detail:not(.show) .ln>span,.detail:not(.show) .fade{transition-duration:.35s;transition-delay:0s}
.show .ln>span{transform:none}
.show .fade{opacity:1;transform:none}
.dbar{position:fixed;z-index:63;left:var(--px);right:var(--px);top:var(--py);display:flex;justify-content:space-between;align-items:center;visibility:hidden;opacity:0;transition:opacity .5s}
.dbar.show{visibility:visible;opacity:1}
.dbar .steps{display:flex;gap:2.4rem;align-items:center}
.dbar button{transition:opacity .3s}
.dbar button:hover{opacity:.55}
@media (max-width:649px){
  .detail{left:var(--px);right:var(--px);top:auto;bottom:0;max-height:calc(100svh - var(--img-bottom,50svh));overflow-y:auto;justify-content:flex-start;padding:2.4rem 0 4rem;overscroll-behavior:contain}
}

@media (prefers-reduced-motion:reduce){
  *{transition-duration:.01ms!important;transition-delay:0s!important}
}
.detail-open.closing .d-back{opacity:0}

/* ---------- accessibility ---------- */
html{scroll-padding-top:10rem}
.skip{position:fixed;left:1.6rem;top:1.6rem;z-index:400;padding:1.2rem 2rem;border-radius:999px;background:#fff;color:#000;font-size:1.4rem;transform:translateY(-200%);transition:transform .3s}
.skip:focus{transform:none}
:focus{outline:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:4px}
.card:focus-visible{outline-offset:6px;border-radius:2rem}
input:focus-visible,textarea:focus-visible{outline:none;border-color:#fff}
.lang button{padding:.6rem .3rem;margin:-.6rem 0}
.foot-top ul a,.foot-top ul button,.legal-links a,.legal-links button{display:inline-block;padding:.6rem 0;margin:-.6rem 0}
.legal-links{display:flex;gap:2.4rem;flex-wrap:wrap}
.legal-links a,.legal-links button{transition:color .3s}
.legal-links a:hover,.legal-links button:hover{color:#fff}
.motion-btn{transition:opacity .3s}
.motion-btn:hover{opacity:.6}
.hero-bar .motion-btn{color:var(--mute)}
.motion-off *,.motion-off *::before,.motion-off *::after{animation-play-state:paused!important}

/* ---------- cookie consent (only shown when analytics IDs are configured) ---------- */
.cc{position:fixed;left:var(--px);right:var(--px);bottom:2.4rem;z-index:350;max-width:56rem;margin-left:auto;background:#0d0d0d;border:1px solid var(--line);border-radius:1.6rem;padding:2.4rem;display:flex;flex-direction:column;gap:1.6rem;font-size:1.4rem;line-height:1.45;color:rgba(255,255,255,.8);box-shadow:0 2rem 6rem rgba(0,0,0,.6)}
.cc[hidden]{display:none}
.cc a{color:#fff;border-bottom:1px solid currentColor}
.cc .row{display:flex;gap:.8rem;flex-wrap:wrap}
.cc button{height:4rem;padding:0 2rem;border-radius:999px;border:1px solid rgba(255,255,255,.3);font-size:1.3rem}
.cc button.ok{background:#fff;color:#000;border-color:#fff}

/* images carry width/height attributes for layout stability; CSS decides the rendered size */
.nav .brand img,.lp-nav img{height:3.6rem;width:auto}

[hidden]{display:none!important}

/* small screens: no loading curtain, headline fades in from the first paint (fast LCP on phones) */
@media (max-width:819px){
  .cover,.loader{display:none}
  .mega .wd{overflow:visible}
  .mega .ci{transform:translateY(.12em);transition:transform 1s var(--ease);transition-delay:calc(var(--i) * 25ms)}
  .hero .fade{opacity:1}
}