:root{--bg:#07090d;--bg2:#0d1118;--tx:#fff;--mu:#9aa5b4;--ac:#7cc4ff;--ac2:#3d8bff;--bd:rgba(255,255,255,.1);--lt:#E8EFF6;--li:#0a0f18;color-scheme:dark;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(76px + env(safe-area-inset-top,0px))}
body{margin:0;background:var(--bg);color:var(--tx);font:300 17px/1.65 "DM Sans",system-ui,sans-serif;overflow-x:hidden}
h1,h2,h3{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-weight:500;letter-spacing:-.03em;line-height:1;margin:0}
a{color:inherit}:focus-visible{outline:2px solid var(--ac);outline-offset:3px}
.w{max-width:1240px;margin:0 auto;padding:0 22px}.sec{padding:clamp(80px,12vw,150px) 0;position:relative}
h2{font-size:clamp(2.4rem,6.5vw,5rem)}.mu{color:var(--mu)}
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 30px;border-radius:99px;font:500 15px "DM Sans";text-decoration:none;border:1px solid var(--bd);background:none;color:var(--tx);cursor:pointer;overflow:hidden;transition:.35s}
.btn.p{background:linear-gradient(135deg,var(--ac),var(--ac2));color:#04101f;border:0;box-shadow:0 0 0 0 rgba(124,196,255,.5)}
.btn.p:hover{box-shadow:0 0 40px -4px rgba(124,196,255,.55);transform:translateY(-2px)}.btn.g:hover{border-color:var(--ac);background:rgba(124,196,255,.08)}
.btn i{font-style:normal;transition:transform .35s}.btn:hover i{transform:translateX(5px)}
header{position:fixed;top:0;left:0;right:0;z-index:50;padding:18px 0;padding-top:calc(18px + env(safe-area-inset-top,0px));transition:.4s}
header.s{background:rgba(7,9,13,.78);backdrop-filter:blur(14px);border-bottom:1px solid var(--bd);padding-top:calc(10px + env(safe-area-inset-top,0px));padding-bottom:10px}
nav{display:flex;align-items:center;justify-content:space-between}.logo{font:700 15px "Bricolage Grotesque";letter-spacing:.28em;text-decoration:none}.logo b{color:var(--ac);font-weight:700}
.nl{display:none;gap:34px;list-style:none;margin:0;padding:0;font-size:15px}.nl a{text-decoration:none;color:var(--mu);position:relative;transition:.3s}.nl a:hover{color:#fff}
.nl a::after{content:"";position:absolute;left:0;bottom:-6px;height:1px;width:100%;background:var(--ac);transform:scaleX(0);transform-origin:left;transition:.4s}.nl a:hover::after{transform:scaleX(1)}
.nc{display:none}.bg{background:none;border:0;color:#fff;width:48px;height:48px;margin-right:-10px;cursor:pointer}.bg span{display:block;width:24px;height:1.5px;background:#fff;margin:6px auto;transition:.35s}
.bg[aria-expanded=true] span:first-child{transform:translateY(3.75px) rotate(45deg)}.bg[aria-expanded=true] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
@media(min-width:960px){.nl,.nc{display:flex}.bg{display:none}}
#mn{position:fixed;inset:0;z-index:49;background:var(--bg);padding:110px 26px 30px;display:flex;flex-direction:column;gap:6px;clip-path:circle(0 at calc(100% - 40px) 40px);transition:clip-path .6s cubic-bezier(.7,0,.2,1);visibility:hidden}
#mn.o{clip-path:circle(150% at calc(100% - 40px) 40px);visibility:visible}#mn a.m{font:500 clamp(2.4rem,11vw,3.4rem) "Bricolage Grotesque";letter-spacing:-.03em;text-decoration:none;padding:6px 0;border-bottom:1px solid var(--bd)}#mn .btn{margin-top:auto}
/* hero */
.hero{min-height:100svh;display:flex;align-items:center;padding:120px 0 90px;overflow:hidden;position:relative}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(600px circle at var(--mx,70%) var(--my,30%),rgba(61,139,255,.22),transparent 60%),radial-gradient(900px 500px at 10% 100%,rgba(124,196,255,.08),transparent 70%);pointer-events:none}
.hero::after{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--bd) 1px,transparent 1px),linear-gradient(90deg,var(--bd) 1px,transparent 1px);background-size:80px 80px;opacity:.35;mask-image:radial-gradient(ellipse at 60% 40%,#000,transparent 70%);-webkit-mask-image:radial-gradient(ellipse at 60% 40%,#000,transparent 70%);animation:drift 30s linear infinite}
@keyframes drift{to{background-position:80px 80px}}
.hg{position:relative;z-index:2;display:grid;gap:40px;align-items:center}@media(min-width:960px){.hg{grid-template-columns:7fr 5fr}}
h1{font-size:clamp(3.1rem,10.5vw,8.2rem);font-weight:700;line-height:.93;letter-spacing:-.045em}
.ln{display:block;overflow:hidden;padding-bottom:.08em}.ln>span{display:block;transform:translateY(110%);animation:up 1.1s cubic-bezier(.2,.8,.2,1) forwards}.ln:nth-child(2)>span{animation-delay:.12s}.ln:nth-child(3)>span{animation-delay:.24s}
@keyframes up{to{transform:none}}
.acc{background:linear-gradient(100deg,#fff 0%,var(--ac) 45%,var(--ac2) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;font-style:italic;font-weight:300;padding-right:.1em}
.fd{opacity:0;animation:fd 1s .7s ease forwards}@keyframes fd{to{opacity:1}}
.lead{max-width:540px;font-size:clamp(1.05rem,2vw,1.25rem);color:var(--mu);margin:30px 0}.row{display:flex;flex-wrap:wrap;gap:12px}
.viz{width:100%;max-width:470px;margin:0 auto;opacity:0;animation:fd 1.4s .5s ease forwards}.viz svg{width:100%;height:auto;overflow:visible}
.vt{font:400 13px "DM Sans";fill:#cfd8e3}.dash{stroke-dasharray:6 8;animation:dsh 2.5s linear infinite}@keyframes dsh{to{stroke-dashoffset:-28}}
.pulse{transform-origin:center;transform-box:fill-box;animation:pl 2.8s ease-out infinite}@keyframes pl{from{transform:scale(1);opacity:.7}to{transform:scale(3.2);opacity:0}}
.sc{position:absolute;left:50%;bottom:calc(26px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:13px;color:var(--mu);text-decoration:none}
.sc i{width:1px;height:46px;background:linear-gradient(var(--ac),transparent);animation:sl 2s ease-in-out infinite;transform-origin:top}@keyframes sl{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.rv{opacity:0;transform:translateY(34px);transition:opacity .9s,transform .9s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;transform:none}
/* services */
.sg{display:grid;gap:18px;margin-top:60px}@media(min-width:760px){.sg{grid-template-columns:1fr 1fr}}
.cd{position:relative;border:1px solid var(--bd);border-radius:26px;padding:clamp(26px,4vw,42px);background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.01));overflow:hidden;transition:.5s;min-height:100%}
.cd::before{content:"";position:absolute;inset:0;background:radial-gradient(380px circle at var(--cx,50%) var(--cy,0%),rgba(124,196,255,.16),transparent 65%);opacity:0;transition:.4s}
.cd:hover{border-color:rgba(124,196,255,.5);transform:translateY(-6px)}.cd:hover::before{opacity:1}.cd>*{position:relative}
.ic{width:54px;height:54px;border-radius:16px;border:1px solid var(--bd);display:grid;place-items:center;color:var(--ac);margin-bottom:30px;background:rgba(124,196,255,.06);transition:.5s}.cd:hover .ic{transform:rotate(-8deg) scale(1.08);background:rgba(124,196,255,.14)}
.ic svg{width:26px;height:26px}.cd h3{font-size:clamp(1.7rem,3vw,2.3rem)}.cd p{color:var(--mu);margin:14px 0 22px}
.cd ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}.cd li{font-size:13.5px;padding:6px 14px;border-radius:99px;border:1px solid var(--bd);color:#cfd8e3}
.cd .n{position:absolute;right:26px;top:22px;font:300 14px "DM Sans";color:var(--mu)}
/* process */
.pg{display:grid;gap:50px}@media(min-width:960px){.pg{grid-template-columns:5fr 7fr;gap:90px}.pg .stk{position:sticky;top:130px;align-self:start}}
.tl{position:relative;padding-left:56px}.tl::before,.tl .fl{content:"";position:absolute;left:15px;top:8px;width:2px;bottom:8px;background:var(--bd);border-radius:2px}
.tl .fl{background:linear-gradient(var(--ac),var(--ac2));height:0;bottom:auto;box-shadow:0 0 16px var(--ac)}
.st{position:relative;padding:0 0 clamp(50px,8vw,90px);opacity:.35;transition:.6s}.st.on{opacity:1}.st:last-child{padding-bottom:0}
.st .d{position:absolute;left:-49px;top:4px;width:18px;height:18px;border-radius:50%;background:var(--bg);border:2px solid var(--bd);transition:.5s}.st.on .d{border-color:var(--ac);background:var(--ac);box-shadow:0 0 22px var(--ac)}
.st .no{font:300 15px "DM Sans";color:var(--ac)}.st h3{font-size:clamp(1.8rem,4vw,2.9rem);margin:8px 0 12px}.st p{color:var(--mu);max-width:480px;margin:0}
/* who (light) */
.lt{background:var(--lt);color:var(--li)}.lt .mu{color:#4d5b6e}
.px{display:flex;flex-direction:column;gap:12px;margin-top:56px}@media(min-width:960px){.px{flex-direction:row;height:520px}}
.pn{position:relative;border-radius:26px;overflow:hidden;flex:1;min-height:150px;cursor:pointer;background:var(--li);color:#fff;transition:flex .7s cubic-bezier(.2,.8,.2,1),min-height .6s;border:0;text-align:left;font:inherit;padding:0}
.pn .art{position:absolute;inset:0;opacity:.9;transition:transform 1s}.pn:hover .art{transform:scale(1.06)}
.pn .tx{position:absolute;left:0;right:0;bottom:0;padding:26px;background:linear-gradient(transparent,rgba(5,9,16,.92) 60%)}.pn h3{font-size:clamp(1.5rem,2.4vw,2rem)}
.pn .ds{max-height:0;overflow:hidden;opacity:0;transition:.6s;color:#c4cfdd;font-size:15.5px}
.pn.o{min-height:330px}.pn.o .ds{max-height:220px;opacity:1;margin-top:12px}@media(min-width:960px){.pn.o{flex:2.6;min-height:0}.pn:not(.o) h3{writing-mode:vertical-rl;transform:rotate(180deg)}.pn:not(.o) .tx{padding:26px 22px}}
/* approach */
.big{font:500 clamp(2rem,5.6vw,4.6rem)/1.08 "Bricolage Grotesque";letter-spacing:-.035em;max-width:1000px}.big span{opacity:.2;transition:opacity .4s}.big span.on{opacity:1}
.tri{display:grid;gap:0;margin-top:70px;border-top:1px solid var(--bd)}@media(min-width:760px){.tri{grid-template-columns:repeat(3,1fr)}}
.tri div{padding:30px 0;border-bottom:1px solid var(--bd)}@media(min-width:760px){.tri div{padding:34px 34px 0 0;border:0}.tri div+div{padding-left:34px;border-left:1px solid var(--bd)}}.tri h3{font-size:1.7rem}.tri p{color:var(--mu);margin:10px 0 0}
/* contact */
.ct{background:radial-gradient(800px 500px at 80% 0,rgba(61,139,255,.2),transparent 70%),var(--bg2);border-top:1px solid var(--bd)}
.cg{display:grid;gap:50px}@media(min-width:960px){.cg{grid-template-columns:5fr 7fr;gap:80px;align-items:start}}
.fm{display:grid;gap:18px;padding:clamp(24px,4vw,40px);border:1px solid var(--bd);border-radius:28px;background:rgba(255,255,255,.03);backdrop-filter:blur(10px)}@media(min-width:640px){.fm{grid-template-columns:1fr 1fr}.fw{grid-column:1/-1}}
.dm{font-size:13.5px;padding:10px 14px;border-radius:12px;background:rgba(124,196,255,.08);border:1px dashed rgba(124,196,255,.4);color:#cfe6fb}
label{display:block;font-size:14px;margin-bottom:7px;color:#cfd8e3}.fi{width:100%;min-height:54px;background:rgba(255,255,255,.04);border:1px solid var(--bd);border-radius:14px;color:#fff;padding:0 16px;font:inherit;transition:.3s}
textarea.fi{padding:14px 16px;min-height:120px;resize:vertical}select.fi option{background:#10151d}.fi:focus{outline:0;border-color:var(--ac);box-shadow:0 0 0 4px rgba(124,196,255,.15)}
.fi[aria-invalid=true]{border-color:#ff7b8a}.fi.ok{border-color:rgba(124,230,170,.6)}.er{color:#ff9aa6;font-size:13px;margin:6px 0 0;min-height:0}
#res{display:none;padding:16px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid var(--ac)}#res.o{display:block}
footer{background:var(--bg);border-top:1px solid var(--bd);padding:70px 0 40px}.fg{display:grid;gap:36px}@media(min-width:800px){.fg{grid-template-columns:2fr 1fr 1fr}}
footer ul{list-style:none;padding:0;margin:0;line-height:2.2}footer a{text-decoration:none;color:var(--mu)}footer a:hover{color:var(--ac)}.fine{margin-top:46px;padding-top:24px;border-top:1px solid var(--bd);font-size:13px;color:var(--mu)}
.tag{position:fixed;left:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:40;font-size:12px;padding:7px 13px;border-radius:99px;background:rgba(13,17,24,.85);border:1px solid var(--bd);backdrop-filter:blur(8px);color:var(--mu)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important}.ln>span{transform:none}.rv,.fd,.viz{opacity:1;transform:none}.big span{opacity:1}.st{opacity:1}}