/* ============ Tokens ============ */
:root{
  --bg:#08080b; --bg2:#0e0e13; --line:rgba(255,255,255,.09);
  --fg:#f4f2ee; --muted:#8f8d99;
  --a1:#ff8a3d; --a2:#ff3d8b; --a3:#7a5cff;
  --grad:linear-gradient(110deg,var(--a1),var(--a2) 55%,var(--a3));
  --r:22px;
  --font-d:'Syne',system-ui,sans-serif;
  --font-b:'Inter',system-ui,sans-serif;
  --font-m:'JetBrains Mono',ui-monospace,monospace;
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--fg);font-family:var(--font-b);line-height:1.6;overflow-x:clip;max-width:100vw;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
main{overflow-x:clip}
::selection{background:var(--a2);color:#fff}
.container{width:min(1280px,100% - 48px);margin-inline:auto}
:focus-visible{outline:2px solid var(--a2);outline-offset:3px;border-radius:6px}

.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.grad--alt{background-image:linear-gradient(110deg,var(--a3),var(--a2) 50%,var(--a1))}

/* ============ Overlays ============ */
#bg{position:fixed;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none}
.grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.06;
  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'/%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(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
.progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:var(--grad);z-index:120}

.cursor{position:fixed;top:0;left:0;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fff;mix-blend-mode:difference;z-index:200;pointer-events:none;opacity:0;transition:width .3s var(--ease),height .3s var(--ease),margin .3s var(--ease),opacity .3s}
.cursor.is-on{opacity:1}
.cursor.is-link{width:56px;height:56px;margin:-28px 0 0 -28px}
.cursor.is-view{width:84px;height:84px;margin:-42px 0 0 -42px;mix-blend-mode:normal;background:var(--grad);display:grid;place-items:center}
.cursor span{font:600 11px var(--font-m);letter-spacing:.08em;text-transform:uppercase;color:#fff;opacity:0}
.cursor.is-view span{opacity:1}
@media (hover:none),(pointer:coarse){.cursor{display:none}}

/* ============ Loader ============ */
.loader{position:fixed;inset:0;z-index:300;background:var(--bg);display:grid;place-content:center;justify-items:center;gap:22px;transition:transform 1s var(--ease)}
.loader.is-done{transform:translateY(-100%)}
.loader__logo{height:74px;animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(1.08);opacity:.7}}
.loader__count{font:800 clamp(56px,10vw,110px)/1 var(--font-d);letter-spacing:-.04em}
.loader__count i{font-style:normal;color:var(--a2);font-size:.4em;margin-left:4px}
.loader__bar{width:min(260px,60vw);height:2px;background:var(--line);overflow:hidden;border-radius:2px}
.loader__bar span{display:block;height:100%;width:0;background:var(--grad)}

/* ============ Nav ============ */
.nav{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:100;width:min(1100px,100% - 28px);
  display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 12px 10px 20px;border-radius:999px;
  background:rgba(14,14,19,.55);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid var(--line);transition:transform .5s var(--ease),background .3s}
.nav.is-hidden{transform:translate(-50%,-140%)}
.nav__brand{display:flex;align-items:center;gap:10px;font:600 15px var(--font-d);letter-spacing:.01em;white-space:nowrap}
.nav__brand img{height:26px;width:auto}
.nav__brand b{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.nav__links{display:flex;gap:6px}
.nav__links a{padding:8px 14px;border-radius:999px;font-size:14px;color:var(--muted);transition:.25s}
.nav__links a:hover,.nav__links a.is-active{color:var(--fg);background:rgba(255,255,255,.07)}
.nav__burger{display:none;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);position:relative}
.nav__burger i{position:absolute;left:12px;right:12px;height:2px;background:var(--fg);transition:.35s var(--ease)}
.nav__burger i:first-child{top:16px}.nav__burger i:last-child{top:24px}
.nav__burger[aria-expanded=true] i:first-child{top:20px;transform:rotate(45deg)}
.nav__burger[aria-expanded=true] i:last-child{top:20px;transform:rotate(-45deg)}
.drawer{position:fixed;inset:0;z-index:95;background:rgba(8,8,11,.96);backdrop-filter:blur(20px);display:flex;flex-direction:column;justify-content:center;gap:6px;padding:0 32px;
  clip-path:circle(0 at calc(100% - 44px) 40px);transition:clip-path .7s var(--ease);pointer-events:none}
.drawer.is-open{clip-path:circle(150% at calc(100% - 44px) 40px);pointer-events:auto}
.drawer a{font:700 clamp(36px,10vw,64px)/1.15 var(--font-d);letter-spacing:-.02em}
.drawer a:hover{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ============ Buttons ============ */
.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 28px;border-radius:999px;font-weight:600;font-size:15px;
  background:var(--grad);color:#fff;position:relative;overflow:hidden;isolation:isolate;transition:box-shadow .3s,transform .3s var(--ease);will-change:transform;box-shadow:0 10px 40px -12px rgba(255,61,139,.55)}
.btn::after{content:"";position:absolute;inset:0;background:#fff;transform:translateY(101%);transition:transform .45s var(--ease);z-index:-1;border-radius:inherit}
.btn:hover{color:#08080b;box-shadow:0 14px 50px -10px rgba(255,138,61,.6)}
.btn:hover::after{transform:none}
.btn--ghost{background:transparent;border:1px solid var(--line);box-shadow:none;color:var(--fg)}
.btn--ghost:hover{border-color:#fff}
.btn--sm{padding:11px 20px;font-size:14px}

/* ============ Type ============ */
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:500 12px var(--font-m);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.eyebrow .num{color:var(--a2)}
.dot{width:8px;height:8px;border-radius:50%;background:#35e08a;box-shadow:0 0 0 0 rgba(53,224,138,.6);animation:ping 2s infinite}
@keyframes ping{70%{box-shadow:0 0 0 12px rgba(53,224,138,0)}100%{box-shadow:0 0 0 0 rgba(53,224,138,0)}}
.h2{font:800 clamp(34px,5.4vw,72px)/1.04 var(--font-d);letter-spacing:-.03em;margin-top:14px}
.h2 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{color:var(--muted);max-width:520px;margin-top:18px}
.section{padding-block:clamp(80px,12vw,150px)}
.section__head{margin-bottom:clamp(32px,5vw,56px)}

/* ============ Reveal ============ */
.js .reveal{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.js .reveal.is-in{opacity:1;transform:none}

/* ============ Hero ============ */
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:space-between;padding-top:110px;position:relative}
.hero__inner{display:grid;grid-template-columns:1.25fr .85fr;align-items:center;gap:40px;flex:1}
.hero__title{font:800 clamp(38px,5vw,82px)/.98 var(--font-d);letter-spacing:-.045em;margin:22px 0 26px}
.line{display:block;overflow:hidden;padding-bottom:.08em}
.line>span{display:inline-block;transform:translateY(110%) rotate(3deg);transform-origin:0 100%;transition:transform 1.1s var(--ease)}
.js .hero.is-live .line>span{transform:none}
.hero.is-live .line:nth-child(2)>span{transition-delay:.1s}
.hero.is-live .line:nth-child(3)>span{transition-delay:.2s}
.hero.is-live .line:nth-child(4)>span{transition-delay:.3s}
.hero__lead{max-width:520px;color:#bdbbc6;font-size:clamp(15px,1.3vw,18px)}
.hero__lead strong{color:var(--fg);font-weight:600}
.hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.hero .reveal{transition-delay:.5s}

.hero__stage{position:relative;aspect-ratio:1/1.05;width:100%;max-width:560px;justify-self:center;perspective:1200px}
.orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55}
.orb--1{width:55%;height:55%;left:-5%;top:5%;background:var(--a2)}
.orb--2{width:50%;height:50%;right:0;bottom:0;background:var(--a3)}
.float{position:absolute;border-radius:24px;overflow:hidden;box-shadow:0 30px 80px -20px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.1);
  transform:translate3d(var(--tx,0px),calc(var(--ty,0px) + var(--sy,0px)),0) rotate(var(--rot,0deg));transition:transform .25s ease-out;
  animation:bob 7s ease-in-out infinite;animation-delay:var(--bd,0s);will-change:transform}
.float img{width:100%;height:100%;object-fit:cover}
@keyframes bob{50%{margin-top:-14px}}
.f1{width:46%;aspect-ratio:1;left:6%;top:4%;--rot:-6deg;--bd:0s}
.f2{width:38%;aspect-ratio:1;right:2%;top:0;--rot:7deg;--bd:-2s}
.f3{width:42%;aspect-ratio:1;left:31%;top:41%;--rot:3deg;--bd:-4s;z-index:3}
.f4{width:36%;aspect-ratio:1;left:0;bottom:2%;--rot:-8deg;--bd:-1s}
.f5{width:40%;aspect-ratio:1;right:0;bottom:0;--rot:6deg;--bd:-3s}
.js .float{opacity:0;scale:.8;transition:transform .25s ease-out,opacity 1s var(--ease) .6s,scale 1.2s var(--ease) .6s}
.js .hero.is-live .float{opacity:1;scale:1}

.hero__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;padding-block:40px 30px;flex-wrap:wrap}
.scroll{display:flex;align-items:center;gap:12px;font:500 12px var(--font-m);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.scroll span{width:1px;height:46px;background:linear-gradient(var(--a2),transparent);animation:drop 2s infinite;transform-origin:top}
@keyframes drop{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.stats{display:flex;gap:clamp(20px,4vw,56px);flex-wrap:wrap}
.stats li{display:flex;flex-direction:column;max-width:150px}
.stats b{font:800 clamp(30px,3.4vw,46px)/1 var(--font-d);letter-spacing:-.03em}
.stats span{font-size:12px;color:var(--muted);margin-top:6px;line-height:1.35}

/* ============ Marquee ============ */
.marquee{border-block:1px solid var(--line);background:rgba(14,14,19,.6);overflow:hidden;padding:26px 0;transform:rotate(-1.2deg) skewX(var(--skew,0deg));margin:40px -20px 0;position:relative;z-index:2}
.marquee__track{display:flex;gap:56px;width:max-content;animation:slide 45s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__item{display:flex;align-items:center;gap:56px;font:700 clamp(22px,3vw,38px) var(--font-d);letter-spacing:-.02em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.45);transition:.3s}
.marquee__item:hover{color:var(--fg);-webkit-text-stroke-color:transparent}
.marquee__item::after{content:"✦";font-size:.6em;-webkit-text-stroke:0;color:var(--a2)}
@keyframes slide{to{transform:translateX(-50%)}}

/* ============ Work grid ============ */
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:34px}
.chip{padding:11px 20px;border-radius:999px;border:1px solid var(--line);font-size:14px;color:var(--muted);transition:.3s var(--ease)}
.chip i{font-style:normal;font:500 11px var(--font-m);margin-left:6px;color:var(--a2)}
.chip:hover{color:var(--fg);border-color:rgba(255,255,255,.35)}
.chip.is-active{background:var(--fg);color:#08080b;border-color:var(--fg)}
.chip.is-active i{color:#08080b}


/* ============ Archive ============ */
.ulink{color:var(--fg);border-bottom:1px solid var(--a2);transition:color .3s}
.ulink:hover{color:var(--a2)}
.atools{display:grid;gap:18px;margin-bottom:14px}
.search{display:flex;align-items:center;gap:12px;padding:0 20px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.04);max-width:560px;transition:.3s;color:var(--muted)}
.search:focus-within{border-color:var(--a2);box-shadow:0 0 0 4px rgba(255,61,139,.12);color:var(--fg)}
.search input{flex:1;min-width:0;background:none;border:0;outline:0;color:var(--fg);font:inherit;padding:15px 0}
.search input::-webkit-search-cancel-button{filter:invert(1);opacity:.6;cursor:pointer}
.atools .filters{margin:0}
.chip em{font-style:normal;font:500 11px var(--font-m);margin-left:6px;color:var(--a2)}
.chip.is-active em{color:#08080b}
.acount{font:500 12px var(--font-m);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:22px 0 16px}
.agrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.atile{position:relative;aspect-ratio:1;border-radius:14px;overflow:hidden;cursor:pointer;background:#15151b;border:1px solid var(--line);
  transition:transform .4s var(--ease),border-color .3s,box-shadow .3s;animation:pop .6s var(--ease) both;content-visibility:auto;contain-intrinsic-size:170px 170px}
@keyframes pop{from{opacity:0;transform:translateY(16px) scale(.96)}}
.atile img,.atile video{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.lb__fig video{max-width:min(92vw,880px);max-height:76vh;border-radius:20px;background:#000;margin:auto}
.atile.contain img{object-fit:contain;padding:4%}
.atile.svg{background:linear-gradient(135deg,#8a8a98,#6f6f7d)}
.atile.svg img{object-fit:contain;padding:10%}
.atile:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.35);box-shadow:0 18px 40px -16px rgba(255,61,139,.45);z-index:2}
.atile:hover img{transform:scale(1.06)}
.atile figcaption{position:absolute;inset:auto 0 0 0;padding:28px 10px 9px;background:linear-gradient(transparent,rgba(5,5,8,.92));font:600 12px var(--font-b);line-height:1.25;transform:translateY(100%);transition:transform .35s var(--ease)}
.atile:hover figcaption,.atile:focus-visible figcaption{transform:none}
.atile figcaption small{display:block;font:500 9px var(--font-m);letter-spacing:.1em;text-transform:uppercase;color:#ffb3c9;margin-top:2px}
.atile .tag{position:absolute;top:8px;left:8px;font:600 9px var(--font-m);letter-spacing:.1em;padding:3px 7px;border-radius:999px;background:#08080b;color:#fff}
.amore{display:flex;justify-content:center;margin-top:34px}
.aempty{grid-column:1/-1;text-align:center;color:var(--muted);padding:60px 0}

/* ============ Cards ============ */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{position:relative;padding:34px 30px 36px;border-radius:var(--r);border:1px solid var(--line);background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.01));overflow:hidden;transform-style:preserve-3d;--mx:50%;--my:50%;transition:border-color .3s}
.card::before{content:"";position:absolute;inset:0;opacity:0;transition:opacity .3s;background:radial-gradient(380px circle at var(--mx) var(--my),rgba(255,61,139,.16),transparent 60%);pointer-events:none}
.card:hover{border-color:rgba(255,255,255,.25)}
.card:hover::before{opacity:1}
.card__no{position:absolute;top:26px;right:28px;font:500 12px var(--font-m);color:var(--muted)}
.card__ico{width:48px;height:48px;color:var(--a2);margin-bottom:56px}
.card h3{font:700 24px var(--font-d);letter-spacing:-.02em;margin-bottom:10px}
.card p{color:var(--muted);font-size:15px}

/* ============ Steps ============ */
.split{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(30px,6vw,90px);align-items:start}
.split .section__head{position:sticky;top:120px;margin:0}
.steps{position:relative;display:grid;gap:0}
.steps__line{position:absolute;left:21px;top:20px;bottom:20px;width:2px;background:var(--line)}
.steps__line span{display:block;width:100%;height:100%;transform-origin:50% 0;transform:scaleY(0);background:var(--grad)}
.step{display:flex;gap:30px;padding:0 0 54px;position:relative}
.step:last-child{padding-bottom:0}
.step>b{flex:0 0 44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--bg);border:1px solid var(--line);font:500 12px var(--font-m);color:var(--muted);transition:.5s var(--ease);position:relative;z-index:1}
.step.is-in>b{border-color:var(--a2);color:#fff;background:var(--a2);box-shadow:0 0 30px rgba(255,61,139,.5)}
.step h3{font:700 clamp(24px,3vw,36px) var(--font-d);letter-spacing:-.02em;margin-bottom:8px}
.step p{color:var(--muted);max-width:520px}

/* ============ FAQ ============ */
.acc{border-top:1px solid var(--line)}
.acc details{border-bottom:1px solid var(--line)}
.acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 0;font:600 clamp(18px,2vw,24px) var(--font-d);transition:color .3s}
.acc summary::-webkit-details-marker{display:none}
.acc summary:hover{color:var(--a2)}
.acc summary i{flex:0 0 32px;height:32px;border-radius:50%;border:1px solid var(--line);position:relative;transition:.4s var(--ease)}
.acc summary i::before,.acc summary i::after{content:"";position:absolute;left:9px;right:9px;top:15px;height:2px;background:currentColor;transition:.4s var(--ease)}
.acc summary i::after{transform:rotate(90deg)}
.acc details[open] summary i{background:var(--fg);color:#08080b;transform:rotate(180deg)}
.acc details[open] summary i::after{transform:rotate(0)}
.acc p{color:var(--muted);padding:0 60px 28px 0;max-width:680px;animation:fadeDown .5s var(--ease)}
@keyframes fadeDown{from{opacity:0;transform:translateY(-8px)}}

/* ============ Contact ============ */
.contact{position:relative;padding-block:clamp(90px,12vw,150px);background:radial-gradient(900px 500px at 80% 0%,rgba(122,92,255,.22),transparent 70%),radial-gradient(800px 500px at 0% 100%,rgba(255,61,139,.18),transparent 70%);border-top:1px solid var(--line)}
.contact__title{font:800 clamp(44px,8vw,128px)/.95 var(--font-d);letter-spacing:-.045em;margin:18px 0 clamp(40px,6vw,72px)}
.contact__grid{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(24px,5vw,70px);align-items:start}
.form{display:grid;gap:18px;padding:clamp(22px,3vw,38px);border-radius:28px;border:1px solid var(--line);background:rgba(14,14,19,.7);backdrop-filter:blur(14px)}
.form label{display:grid;gap:8px}
.form label span{font:500 11px var(--font-m);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.form input,.form select,.form textarea{width:100%;font:inherit;color:var(--fg);background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:14px;padding:15px 16px;transition:.3s;resize:vertical}
.form select option{background:#14141a}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--a2);background:rgba(255,61,139,.06);box-shadow:0 0 0 4px rgba(255,61,139,.12)}
.form .invalid{border-color:#ff5252!important;animation:shake .4s}
@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.form__row{display:flex;flex-wrap:wrap;gap:12px}
.form__note{font-size:13px;min-height:20px;color:#35e08a}
.form__note.err{color:#ff7b7b}
.reach{display:grid;gap:12px}
.reach h3{font:700 22px var(--font-d);margin-bottom:6px}
.reach a{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:20px 22px;border-radius:18px;border:1px solid var(--line);font-size:14px;color:var(--muted);transition:.35s var(--ease);position:relative}
.reach a b{color:var(--fg);font-weight:600;font-size:15px;margin-left:auto}
.reach a i{font-style:normal;color:var(--a2);transition:.35s}
.reach a:hover{border-color:var(--a2);transform:translateX(6px);background:rgba(255,61,139,.06)}
.reach a:hover i{transform:translate(3px,-3px)}
.reach__small{font-size:13px;color:var(--muted);margin-top:6px}

/* ============ Footer ============ */
.footer{display:flex;align-items:center;gap:18px;padding-block:34px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}
.footer img{height:30px;opacity:.9}
.footer p{flex:1}
.totop{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--fg);transition:.3s}
.totop:hover{background:var(--fg);color:#08080b}

/* ============ Lightbox ============ */
.lb{position:fixed;inset:0;z-index:400;background:rgba(5,5,8,.94);backdrop-filter:blur(16px);display:grid;place-items:center;padding:20px;opacity:0;transition:opacity .35s}
.lb[hidden]{display:none}
.lb.is-open{opacity:1}
.lb__fig{max-width:min(92vw,880px);display:grid;gap:16px;transform:scale(.94);transition:transform .5s var(--ease);touch-action:pan-y}
.lb.is-open .lb__fig{transform:none}
.lb__fig img{width:auto;height:auto;max-width:min(92vw,880px);max-height:76vh;object-fit:contain;border-radius:20px;box-shadow:0 40px 120px -20px #000;background:#111;margin:auto;min-width:min(60vw,320px)}
.lb figcaption{display:flex;gap:14px;align-items:baseline;justify-content:center;flex-wrap:wrap;text-align:center}
.lb figcaption b{font:700 22px var(--font-d)}
.lb figcaption span{font:500 11px var(--font-m);letter-spacing:.12em;text-transform:uppercase;color:#ffb3c9}
.lb figcaption em{font:500 12px var(--font-m);font-style:normal;color:var(--muted)}
.lb__close,.lb__nav{position:absolute;width:52px;height:52px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.05);font-size:20px;display:grid;place-items:center;transition:.3s;z-index:2}
.lb__close:hover,.lb__nav:hover{background:#fff;color:#08080b}
.lb__close{top:20px;right:20px}
.lb__nav{top:50%;margin-top:-26px}
.lb__nav--prev{left:20px}.lb__nav--next{right:20px}

/* ============ Responsive ============ */
@media (max-width:1000px){
  .nav__links{display:none}
  .nav .btn--sm{display:none}
  .nav__burger{display:block}
  .hero__inner{grid-template-columns:1fr;gap:10px;padding-top:10px}
  .hero__stage{max-width:440px;margin-top:20px}
  .cards{grid-template-columns:repeat(2,1fr)}
  .contact__grid{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .split .section__head{position:static}
}
@media (max-width:680px){
  .container{width:calc(100% - 32px)}
  .agrid{grid-template-columns:repeat(3,1fr);gap:6px}
  .atile{border-radius:10px}
  .atile figcaption{display:none}
  .search{max-width:none}
  .cards{grid-template-columns:1fr}
  .card__ico{margin-bottom:34px}
  .stats{gap:22px}
  .stats li{max-width:130px}
  .step{gap:18px}
  .steps__line{left:21px}
  .acc p{padding-right:0}
  .lb__nav{top:auto;bottom:24px;margin:0}
  .lb__nav--prev{left:calc(50% - 64px)}.lb__nav--next{right:calc(50% - 64px)}
  .footer{flex-wrap:wrap}
  .marquee{transform:rotate(-2deg)}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
  .js .reveal,.line>span{opacity:1;transform:none}
  .js .float{opacity:1;scale:1}
}

/* ============ Motion upgrade ============ */
/* aurora that drifts and shifts hue while you scroll */
:root{--sp:0}
body::before{content:"";position:fixed;inset:-20%;z-index:-3;pointer-events:none;
  background:radial-gradient(40% 35% at 18% 22%,rgba(255,61,139,.20),transparent 70%),
             radial-gradient(38% 40% at 85% 30%,rgba(122,92,255,.22),transparent 70%),
             radial-gradient(45% 40% at 55% 95%,rgba(255,138,61,.16),transparent 70%);
  filter:hue-rotate(calc(var(--sp) * 170deg));
  transform:translate3d(0,calc(var(--sp) * -6%),0) rotate(calc(var(--sp) * 14deg));
  animation:aurora 22s ease-in-out infinite alternate}
@keyframes aurora{to{scale:1.12}}

/* shimmering gradient text */
.grad,.h2 em{background-size:220% 100%;animation:shine 6s linear infinite}
@keyframes shine{to{background-position:-220% 0}}

/* word-by-word headline reveal */
.words .w{display:inline-block;overflow:hidden;vertical-align:top;padding:.04em .02em .14em;margin:-.04em -.02em -.14em}
.words .w>span{display:inline-block;transform:translateY(112%) rotate(5deg);transform-origin:0 100%;opacity:0;
  transition:transform 1s var(--ease),opacity .6s;transition-delay:calc(var(--i) * 70ms)}
.words.is-in .w>span{transform:none;opacity:1}
.words em,.words .grad{background:none;animation:none;color:inherit}
.words em .w>span,.words .grad .w>span{background:var(--grad);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 6s linear infinite}

/* sticky glass toolbar */
.gallery .atools{position:sticky;top:84px;z-index:30;padding:14px 16px;margin:0 -16px 14px;border-radius:24px;
  background:rgba(10,10,14,.62);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);border:1px solid var(--line)}
.gallery .atools .filters{margin:0}
.gallery .sub b{color:var(--fg);font-weight:700}
.gallery .agrid{grid-auto-flow:dense;gap:12px;perspective:1400px}

/* tiles: staggered reveal, tilt + spotlight, shine sweep */
.atile{--mx:50%;--my:50%;content-visibility:visible;animation:none;border-radius:16px;
  opacity:0;translate:0 56px;scale:.9;filter:blur(6px);
  transition:opacity .8s var(--ease) var(--d,0s),translate .9s var(--ease) var(--d,0s),scale .9s var(--ease) var(--d,0s),filter .8s var(--ease) var(--d,0s),
             transform .25s ease-out,border-color .3s,box-shadow .4s}
.atile.is-in{opacity:1;translate:0 0;scale:1;filter:none}
.atile.is-out{opacity:0;translate:0 -18px;scale:.88;filter:blur(6px);transition:opacity .28s ease var(--d,0s),translate .28s ease var(--d,0s),scale .28s ease var(--d,0s),filter .28s ease var(--d,0s)}
.atile.big{grid-column:span 2;grid-row:span 2;border-radius:22px}
.atile.big figcaption{font-size:16px;padding:46px 18px 16px}
.atile:hover{transform:none;box-shadow:0 26px 60px -20px rgba(255,61,139,.55),0 0 0 1px rgba(255,255,255,.3);z-index:3}
.atile::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;transition:opacity .3s;
  background:radial-gradient(240px circle at var(--mx) var(--my),rgba(255,255,255,.28),transparent 60%)}
.atile::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;z-index:2;pointer-events:none;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-18deg);opacity:0}
.atile:hover::before{opacity:1}
.atile:hover::after{opacity:1;animation:sweep .9s var(--ease)}
@keyframes sweep{to{left:130%}}
.atile .tag{z-index:3;background:linear-gradient(110deg,var(--a1),var(--a2));}

/* chips pop */
.chip{position:relative;overflow:hidden}
.chip.is-active{box-shadow:0 8px 30px -10px rgba(255,255,255,.5)}
.chip:active{transform:scale(.94)}
.acount{transition:opacity .3s}

/* lightbox image swap */
.lb__fig img.swap{animation:lbIn .55s var(--ease)}
@keyframes lbIn{from{opacity:0;transform:scale(.92) translateY(14px);filter:blur(8px)}}

/* hero copy parallax is driven by JS */
.hero__copy{will-change:transform,opacity}

@media (max-width:680px){
  .gallery .atools{top:74px;padding:12px;margin-inline:-10px}
  .gallery .agrid{gap:6px}
  .atile{border-radius:10px;translate:0 34px}
  .atile.big{border-radius:14px}
}
@media (prefers-reduced-motion:reduce){
  body::before,.grad,.h2 em{animation:none!important}
  .atile{opacity:1;translate:none;scale:1;filter:none}
  .words .w>span{transform:none;opacity:1}
}

/* compact one-row toolbar that tucks up when the nav hides */
.gallery .atools{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;transition:top .5s var(--ease)}
.gallery .atools .search{flex:1 1 280px;max-width:420px}
.gallery .atools .search input{padding:12px 0}
.nav-hidden .gallery .atools{top:14px}
@media (max-width:680px){
  .gallery .atools{position:static;padding:0;margin:0 0 6px;background:none;border:0;backdrop-filter:none;-webkit-backdrop-filter:none}
}