:root{
  --mag:#EC008C;
  --vio:#6B10C4;
  --orn:#FF6600;
  --bg:#0A0410;
  --surf:#170A22;
  --tx:#F6F2FA;
  --mut:#B9A9C9;
  --grad:linear-gradient(135deg,#EC008C,#6B10C4);
  --jost:'Jost',system-ui,sans-serif;
  --inter:'Inter',system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--tx);font-family:var(--inter);font-size:1.05rem;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-wrap:break-word}
img,svg,video,iframe{max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{margin:0}
ul{margin:0;padding:0;list-style:none}
figure{margin:0}
:focus-visible{outline:2px solid var(--mag);outline-offset:3px;border-radius:2px}
.wrap{width:min(1240px,92vw);margin-inline:auto}
.skip{position:absolute;left:-9999px;top:0;background:var(--mag);color:#fff;padding:.7rem 1rem;z-index:200}
.skip:focus{left:8px;top:8px}

.label{font-family:var(--jost);font-weight:400;text-transform:uppercase;letter-spacing:.22em;font-size:.72rem;margin:0 0 1.1rem}
.label.mag{color:var(--mag)}
.h1{font-family:var(--jost);font-weight:200;text-transform:uppercase;font-size:clamp(2.5rem,7.6vw,6.4rem);letter-spacing:.09em;line-height:.98;margin:0}
.h1 em{font-style:normal;color:var(--mag);text-shadow:0 0 42px rgba(236,0,140,.55)}
.h2{font-family:var(--jost);font-weight:300;text-transform:uppercase;font-size:clamp(1.65rem,3.5vw,2.9rem);letter-spacing:.1em;line-height:1.14}
.h2.xl{font-size:clamp(2.4rem,8vw,5.5rem);font-weight:200;letter-spacing:.14em}
.lead{max-width:62ch;font-size:1.05rem;line-height:1.75;margin:1.2rem 0 0}

/* progress */
.progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--grad);z-index:120}

/* header */
.hdr{position:fixed;inset:0 0 auto;z-index:100;background:rgba(10,4,16,.62);backdrop-filter:blur(14px);border-bottom:1px solid rgba(246,242,250,.09);transition:background .3s}
.hdr-in{width:min(1240px,92vw);margin-inline:auto;display:flex;align-items:center;gap:1rem;padding:1.05rem 0;transition:padding .3s}
.hdr.small .hdr-in{padding:.6rem 0}
.brand img{width:150px;display:block;transition:width .3s}
.hdr.small .brand img{width:124px}
.nav-d{display:flex;gap:2rem;margin-left:auto}
.nav-l{font-family:var(--jost);text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;text-decoration:none;padding:.4rem 0;position:relative;color:var(--tx)}
.nav-l::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;background:var(--mag);transition:right .3s}
.nav-l:hover::after,.nav-l.is-active::after{right:0}
.hdr-r{display:flex;align-items:center;gap:.9rem;margin-left:auto}
.nav-d + .hdr-r{margin-left:2.4rem}
.soc{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px}
.soc svg{width:22px;height:22px;fill:none;stroke:var(--tx);stroke-width:1.5;display:block}
.soc svg .f{fill:var(--tx);stroke:none}
.soc:hover svg{stroke:var(--mag)}
.soc:hover svg .f{fill:var(--mag)}
.cta-sm{font-family:var(--jost);text-transform:uppercase;letter-spacing:.16em;font-size:.7rem;text-decoration:none;border:1px solid var(--mag);color:#fff;padding:.62rem 1rem;border-radius:2px;background:rgba(236,0,140,.12);white-space:nowrap}
.cta-sm:hover{background:var(--mag);box-shadow:0 0 26px rgba(236,0,140,.5)}
.burger{display:none;width:44px;height:44px;background:none;border:0;cursor:pointer;flex-direction:column;justify-content:center;gap:6px;align-items:center}
.burger span{display:block;width:24px;height:1.5px;background:var(--tx)}

@media(max-width:960px){
  .nav-d{display:none}
  .cta-sm{display:none}
  .burger{display:flex}
  .brand img{width:124px}
  .hdr.small .brand img{width:112px}
  .hdr-r{gap:.3rem}
}

/* mobile menu */
.mob{position:fixed;inset:0;z-index:150;background:radial-gradient(120% 90% at 50% 0%,#1B0726,#0A0410 70%);display:flex;align-items:center;justify-content:center;overflow-y:auto}
.mob[hidden]{display:none}
.mob-in{width:min(520px,88vw);text-align:center;padding:5rem 0 4rem}
.mob-logo{width:min(230px,62%);margin:0 auto 2.6rem;display:block;opacity:.9}
.mob-x{position:absolute;top:14px;right:5vw;width:44px;height:44px;background:none;border:0;color:var(--tx);font-size:2rem;line-height:1;cursor:pointer}
.mob nav{display:flex;flex-direction:column;gap:.2rem}
.mob nav a{font-family:var(--jost);font-weight:200;text-transform:uppercase;letter-spacing:.14em;font-size:clamp(1.7rem,8vw,2.2rem);text-decoration:none;padding:.6rem 0}
.mob nav a:hover{color:var(--mag)}
.mob-cta{display:inline-block;margin-top:2.2rem;font-family:var(--jost);text-transform:uppercase;letter-spacing:.18em;font-size:.85rem;text-decoration:none;background:var(--grad);color:#fff;padding:1rem 1.6rem}
.mob-soc{display:flex;gap:1.6rem;justify-content:center;margin-top:2.4rem;font-family:var(--jost);text-transform:uppercase;letter-spacing:.18em;font-size:.72rem}
.mob-soc a{text-decoration:none;color:var(--mut);padding:.4rem}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;padding:8rem 0 6.5rem}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:drift 24s ease-in-out infinite alternate}
@keyframes drift{from{transform:scale(1.05)}to{transform:scale(1.18)}}
.hero-scrim{position:absolute;inset:0;background:
  radial-gradient(85% 70% at 26% 52%,rgba(10,4,16,.24),rgba(10,4,16,.88) 72%),
  linear-gradient(to bottom,rgba(10,4,16,.8),rgba(10,4,16,.2) 38%,rgba(10,4,16,.97))}
.hero-in{position:relative;z-index:2}
.hero-glow{position:absolute;left:-6%;top:-26%;width:min(520px,74%);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(236,0,140,.42),transparent 66%);filter:blur(34px);animation:pulse 7s ease-in-out infinite alternate;pointer-events:none}
@keyframes pulse{from{opacity:.45;transform:scale(.9)}to{opacity:1;transform:scale(1.1)}}
.hero-logo{width:min(320px,62vw);display:block;margin-bottom:2rem;filter:drop-shadow(0 0 30px rgba(236,0,140,.45))}
.hero-act{display:flex;flex-wrap:wrap;align-items:center;gap:1.4rem 2.2rem;margin-top:2.4rem}
.hero-meta{display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;margin-top:2.6rem;font-family:var(--jost);text-transform:uppercase;letter-spacing:.18em;font-size:.66rem;color:var(--mut)}
.hero-meta li{position:relative;padding-left:1.1rem}
.hero-meta li::before{content:"◆";position:absolute;left:0;top:0;color:var(--mag);font-size:.55rem}
.btn{display:inline-block;font-family:var(--jost);text-transform:uppercase;letter-spacing:.2em;font-size:.8rem;text-decoration:none;color:#fff;background:var(--mag);padding:1.05rem 1.8rem;box-shadow:0 0 34px rgba(236,0,140,.4);transition:background .25s,box-shadow .25s,transform .25s}
.btn:hover{background:var(--orn);box-shadow:0 0 40px rgba(255,102,0,.5);transform:translateY(-2px)}
.tlink{display:inline-block;font-family:var(--jost);text-transform:uppercase;letter-spacing:.2em;font-size:.76rem;text-decoration:none;color:var(--tx);border-bottom:1px solid rgba(246,242,250,.4);padding-bottom:.35rem}
.tlink:hover{color:var(--mag);border-color:var(--mag)}
.tlink.dark{margin-top:2rem;color:#fff;border-color:rgba(255,255,255,.6)}
.tlink.dark:hover{color:#fff;border-color:#fff}
.scroll-cue{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:.3rem;text-decoration:none;color:var(--mut);font-family:var(--jost);text-transform:uppercase;letter-spacing:.2em;font-size:.62rem}
.scroll-cue svg{width:20px;fill:none;stroke:currentColor;stroke-width:1.4;animation:bob 2s infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}

/* positioning */
.pos{background:var(--grad);padding:clamp(4rem,9vw,7rem) 0;position:relative;overflow:hidden}
.pos::after{content:"";position:absolute;right:-10%;top:-20%;width:min(520px,60%);aspect-ratio:1;border:1px solid rgba(255,255,255,.18);transform:rotate(45deg);pointer-events:none}
.pos-grid{display:grid;gap:clamp(2.2rem,5vw,3.6rem);align-items:center;grid-template-columns:1fr;position:relative;z-index:1}
.pos-copy{min-width:0}
.pos-copy .label{color:rgba(255,255,255,.85)}
.pos-copy .h2{color:#fff;max-width:20ch}
.pos-copy .lead{color:rgba(255,255,255,.96)}
.pos-fig{min-width:0;position:relative}
.pos-fig img{width:100%;display:block;aspect-ratio:4/3;object-fit:cover;border:1px solid rgba(255,255,255,.4);box-shadow:0 34px 70px rgba(10,4,16,.55)}
.pos-fig figcaption{margin-top:.9rem;font-family:var(--jost);text-transform:uppercase;letter-spacing:.18em;font-size:.66rem;color:rgba(255,255,255,.85)}
@media(min-width:900px){
  .pos-grid{grid-template-columns:6.4fr 5.6fr}
  .pos-fig img{transform:translate(clamp(0px,2.4vw,42px),18px)}
  .pos-fig figcaption{transform:translate(clamp(0px,2.4vw,42px),18px)}
}

/* marquee */
.marq-wrap{width:100%;overflow:hidden;border-block:1px solid rgba(236,0,140,.35);background:#0A0410;padding:1.05rem 0}
.marq{display:flex;width:max-content;animation:scroll 38s linear infinite}
.marq-t{font-family:var(--jost);font-weight:300;text-transform:uppercase;letter-spacing:.2em;font-size:clamp(.78rem,1.5vw,1.02rem);color:var(--mut);white-space:nowrap}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* services */
.svc{padding:clamp(4rem,9vw,8rem) 0}
.svc-head{margin-bottom:clamp(2.2rem,4.5vw,3.4rem)}
.h2.light{color:var(--tx)}
.cards{display:grid;gap:1px;background:rgba(246,242,250,.1);border:1px solid rgba(246,242,250,.1)}
@media(min-width:640px){.cards{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.cards{grid-template-columns:repeat(3,1fr)}}
.card{position:relative;background:var(--surf);padding:clamp(1.5rem,2.6vw,2.2rem);min-height:clamp(140px,16vw,190px);display:flex;flex-direction:column;gap:.9rem;min-width:0;overflow:hidden;transition:transform .3s,background .3s,box-shadow .3s}
.card::before{content:"";position:absolute;right:-30px;top:-30px;width:130px;height:130px;border:1px solid rgba(236,0,140,.35);transform:rotate(45deg);opacity:0;transition:opacity .35s,transform .45s}
.card:hover{background:#1E0C2C;transform:translateY(-6px);box-shadow:0 0 0 1px var(--mag),0 24px 50px rgba(236,0,140,.22);z-index:2}
.card:hover::before{opacity:1;transform:rotate(45deg) scale(1.12)}
.num{font-family:var(--jost);font-weight:200;font-size:clamp(2.3rem,4.4vw,3.1rem);color:var(--mag);line-height:1;letter-spacing:.02em}
.card h3{font-family:var(--jost);font-weight:300;text-transform:uppercase;letter-spacing:.11em;font-size:clamp(.98rem,1.5vw,1.18rem);line-height:1.35;margin-top:auto;position:relative}
.svc-cta{margin-top:clamp(2rem,4vw,3rem)}

/* credibility */
.cred{background:linear-gradient(160deg,#6B10C4,#4A0B90);padding:clamp(6rem,12vw,10rem) 0 clamp(4rem,8vw,7rem);clip-path:polygon(0 4vw,100% 0,100% 100%,0 100%);margin-top:-2vw;position:relative}
.cred-grid{display:grid;gap:clamp(2rem,4.5vw,4rem);grid-template-columns:1fr;align-items:start}
@media(min-width:900px){.cred-grid{grid-template-columns:5fr 7fr}}
.cred-stat{min-width:0}
.big{display:block;font-family:var(--jost);font-weight:200;font-size:clamp(5.5rem,15vw,11.5rem);line-height:.85;color:#fff;letter-spacing:-.01em;text-shadow:0 0 60px rgba(236,0,140,.55)}
.stat-lbl{font-family:var(--jost);text-transform:uppercase;letter-spacing:.18em;font-size:.74rem;color:rgba(255,255,255,.92);max-width:24ch;margin:1.1rem 0 0;line-height:1.9}
.cred-fig{margin-top:2.2rem}
.cred-fig img{width:100%;display:block;aspect-ratio:16/10;object-fit:cover;border:1px solid rgba(255,255,255,.35);box-shadow:0 26px 54px rgba(10,4,16,.45)}
.cred-copy .label{color:rgba(255,255,255,.8)}
.cred-copy .lead{color:#fff;margin-top:0}
.ticks{margin-top:2.2rem;display:flex;flex-wrap:wrap;gap:.8rem 2rem}
.ticks li{font-family:var(--jost);text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;color:#fff;border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:.5rem}

/* team */
.team{padding:clamp(4rem,9vw,8rem) 0;background:var(--bg)}
.team-top{max-width:34ch;margin-bottom:clamp(2.6rem,5vw,4rem)}
.fusion{margin:0;font-family:var(--jost);font-weight:200;font-size:clamp(1.5rem,3.6vw,2.6rem);line-height:1.3;letter-spacing:.01em;color:var(--tx)}
.team-grid{display:grid;gap:clamp(2rem,4.5vw,3.5rem);grid-template-columns:1fr;align-items:start}
@media(min-width:900px){.team-grid{grid-template-columns:5fr 6fr}}
.team-visual{position:relative;min-width:0;padding:0 0 0 14px}
.tv-glow{position:absolute;inset:-8% -4% -8% -4%;overflow:hidden;z-index:0;pointer-events:none}
.tv-glow img{width:100%;height:100%;object-fit:cover;object-position:48% 38%;transform:scale(1.15);filter:blur(46px) saturate(1.5);opacity:.4}
.portrait{position:relative;z-index:1}
.portrait::before{content:"";position:absolute;left:-14px;bottom:-14px;width:52%;height:52%;background:var(--grad);z-index:0}
.portrait img{position:relative;z-index:1;width:100%;display:block;aspect-ratio:1/1;object-fit:cover;object-position:48% 38%;border:1px solid rgba(236,0,140,.55);box-shadow:0 0 70px rgba(107,16,196,.45)}
.portrait figcaption{position:relative;z-index:2;margin-top:1rem;font-family:var(--jost);text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;color:var(--mut)}
.team-copy{min-width:0;padding-top:.4rem}
.team-copy .lead{color:var(--mut);font-size:1.08rem;margin-top:0}
.team-mark{display:block;width:min(210px,52%);margin-top:2.4rem;opacity:.45}
.team-cta{margin-top:2rem;color:var(--tx)}

/* connect */
.connect{background:var(--grad);padding:clamp(4.5rem,10vw,8.5rem) 0;text-align:center;position:relative;overflow:hidden}
.connect::before{content:"";position:absolute;left:50%;top:-18%;width:min(680px,120%);aspect-ratio:1;transform:translateX(-50%) rotate(45deg);border:1px solid rgba(255,255,255,.16);pointer-events:none}
.connect-in{position:relative;z-index:1}
.connect-logo{width:min(240px,58%);margin:0 auto 2.2rem;display:block;opacity:.92}
.connect .h2{color:#fff}
.lead.wide{margin:1.4rem auto 0;color:rgba(255,255,255,.96)}
.mail{display:inline-block;margin-top:2.2rem;font-family:var(--jost);font-weight:300;letter-spacing:.04em;font-size:clamp(1.2rem,4.2vw,2.5rem);color:#fff;text-decoration:none;border-bottom:2px solid rgba(255,255,255,.55);padding-bottom:.3rem;word-break:break-word}
.mail:hover{border-color:var(--orn)}
.sub{margin:2.6rem 0 1rem;font-family:var(--jost);text-transform:uppercase;letter-spacing:.18em;font-size:.7rem;color:rgba(255,255,255,.92)}
.connect-soc{display:flex;justify-content:center;gap:1.2rem}
.connect-soc a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px}
.connect-soc svg{width:26px;height:26px;fill:none;stroke:#fff;stroke-width:1.5}
.connect-soc svg .f{fill:#fff;stroke:none}
.connect-soc a:hover svg{stroke:#0A0410}
.connect-soc a:hover svg .f{fill:#0A0410}

/* footer */
.ftr{background:var(--bg);padding:clamp(2.8rem,6vw,4.5rem) 0 2rem}
.ftr-in{display:grid;gap:1.6rem;grid-template-columns:1fr;align-items:center}
@media(min-width:880px){.ftr-in{grid-template-columns:auto 1fr auto auto;gap:2.4rem}}
.ftr-brand img{width:132px;display:block}
.ftr-nav,.ftr-c{display:flex;flex-wrap:wrap;gap:1rem 1.4rem;font-family:var(--jost);text-transform:uppercase;letter-spacing:.16em;font-size:.7rem}
.ftr-nav a,.ftr-c a{text-decoration:none;color:var(--mut);padding:.25rem 0}
.ftr-nav a:hover,.ftr-c a:hover{color:var(--mag)}
.ftr-mark{display:block;width:84px}
.ftr-mark img{display:block;width:100%;opacity:.9}
.copy{width:min(1240px,92vw);margin:2.4rem auto 0;padding-top:1.3rem;border-top:1px solid rgba(246,242,250,.1);font-family:var(--jost);text-transform:uppercase;letter-spacing:.16em;font-size:.64rem;color:var(--mut)}

/* reveal */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}

@media(max-width:640px){
  .hero{padding:7rem 0 5.5rem;min-height:92svh}
  .team-visual{padding-left:10px}
  .fusion{font-size:clamp(1.35rem,6vw,1.9rem)}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
  .marq{width:100%;overflow:hidden}
  .marq-t:nth-child(2){display:none}
}