@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root{
    --bg:#030817;--panel:#071126;--text:#fff;--muted:#a9aec0;
    --purple:#8c3cff;--pink:#ff22c8;--orange:#ff8135;--blue:#17a8ff;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;overflow-x:hidden}
a{text-decoration:none;color:inherit}button,input{font:inherit}
.container{width:min(1180px,calc(100% - 40px));margin:auto}
.section{position:relative;padding:105px 0;overflow:hidden}
.eyebrow{font-size:11px;font-weight:800;letter-spacing:2px;color:#d8d9e2;display:flex;align-items:center;gap:10px;justify-content:center}
.eyebrow span{width:28px;height:4px;border-radius:10px;background:linear-gradient(90deg,#a238ff,#ff27bd,#ff9837);box-shadow:0 0 12px #d82bff}
.section-heading{text-align:center;position:relative;z-index:2}
.section-heading h2{font-size:clamp(34px,4vw,58px);line-height:1.05;margin:18px 0 12px;font-weight:900;letter-spacing:-2px}
.section-heading h2 strong,.hero-copy strong{background:linear-gradient(90deg,#e72cff,#ff47a7,#ff963e);-webkit-background-clip:text;background-clip:text;color:transparent}
.section-heading p{color:#a9aec0;font-size:14px}

/* NAV */
.nav-wrapper{position:absolute;top:0;left:0;width:100%;padding:24px 3%;z-index:50}
.navbar{height:74px;width:100%;display:flex;align-items:center;padding:0 20px 0 28px;background:rgba(7,8,25,.72);border:2px solid transparent;border-radius:21px;background-image:linear-gradient(rgba(7,8,25,.8),rgba(7,8,25,.8)),linear-gradient(90deg,#9b43ff,#e833ff,#ff3c9f,#ff8b39);background-origin:border-box;background-clip:padding-box,border-box;backdrop-filter:blur(16px);box-shadow:0 0 28px rgba(150,55,255,.2)}
.nav-logo{font-size:34px;font-weight:900;letter-spacing:-2px}.nav-logo b{color:#ff38a6}
.nav-links{display:flex;align-items:center;gap:38px;margin-left:auto;margin-right:34px}
.nav-links a{font-size:14px;color:#b8bac7;font-weight:600;position:relative}.nav-links a:hover,.nav-links a.active{color:#fff}
.nav-links a.active:after{content:"";position:absolute;width:46px;height:3px;bottom:-12px;left:50%;transform:translateX(-50%);border-radius:10px;background:linear-gradient(90deg,#ff20bf,#ff983a);box-shadow:0 0 10px #ff2cc5}
.nav-actions{display:flex;align-items:center;gap:12px}.round-btn{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(181,65,255,.5);background:rgba(15,10,35,.6);color:#fff;cursor:pointer}.round-btn svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2}
.nav-divider{height:31px;width:1px;background:rgba(255,255,255,.15);margin:0 4px}.talk-btn{height:48px;padding:0 23px;border-radius:30px;display:flex;align-items:center;gap:16px;background:linear-gradient(100deg,#713cff,#e52fc1,#ff9638);font-size:14px;font-weight:800;box-shadow:0 0 25px rgba(209,43,255,.28)}.talk-btn span{font-size:21px}
.mobile-menu{display:none;background:none;border:0}.mobile-menu i{display:block;width:21px;height:2px;background:#fff;margin:4px}
.mobile-drawer{display:none}

/* HERO */
.hero{min-height:760px;padding-top:150px;padding-bottom:30px;background:radial-gradient(circle at 82% 14%,rgba(255,87,36,.24),transparent 25%),radial-gradient(circle at 9% 33%,rgba(136,28,255,.22),transparent 24%),#030817}
.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,transparent 35%,rgba(0,0,0,.22));pointer-events:none}
.hero-grid{display:grid;grid-template-columns:43% 57%;align-items:center;gap:5px;min-height:540px}
.hero-copy{position:relative;z-index:3}.hero-copy .eyebrow{justify-content:flex-start;font-size:10px}.hero-copy h1{font-size:clamp(45px,5.4vw,72px);line-height:.94;letter-spacing:-3px;font-weight:900;margin:19px 0 20px}.hero-copy p{max-width:510px;color:#b6bac9;font-size:14px;line-height:1.55}
.hero-buttons{display:flex;gap:13px;align-items:center;margin:25px 0}.gradient-btn{padding:13px 22px;border-radius:30px;background:linear-gradient(100deg,#8b3cff,#ff25bd,#ff9238);font-size:13px;font-weight:800;box-shadow:0 0 25px rgba(220,43,255,.28)}.gradient-btn span{margin-left:12px;font-size:18px}.watch-btn{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:700}.watch-btn b{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#a33dff,#ff3b9e);box-shadow:0 0 15px rgba(209,50,255,.35)}
.hero-proof{display:flex;align-items:center;gap:8px;color:#fff;font-size:12px}.hero-proof small{color:#a8acba}.proof-dot{width:34px;height:34px;border-radius:50%;border:2px solid #ff4cb3;background:radial-gradient(circle,#fff 5%,#7d3cff 35%,#0d1630 65%);box-shadow:0 0 12px #bd39ff}
.hero-visual{height:510px;position:relative;display:flex;align-items:center;justify-content:center}.hero-image{width:100%;max-width:600px;position:relative;z-index:2;filter:drop-shadow(0 25px 35px rgba(0,0,0,.55))}.hero-glow{position:absolute;width:430px;height:280px;border-radius:50%;background:radial-gradient(circle,#ff2d9b 0,#8d3cff 42%,transparent 70%);filter:blur(30px);opacity:.65}
.metric{position:absolute;z-index:4;min-width:120px;padding:13px 16px;border-radius:12px;background:rgba(16,11,38,.78);border:1px solid rgba(177,66,255,.45);box-shadow:0 0 20px rgba(155,44,255,.18);display:flex;flex-direction:column;gap:4px}.metric b{font-size:20px}.metric small{font-size:9px;color:#b8bdcc}.metric-one{top:62px;right:0}.metric-two{top:166px;right:-10px}.metric-three{top:270px;right:-5px}.annotation{position:absolute;right:-2px;bottom:75px;font-family:cursive;font-size:15px;line-height:1.05;transform:rotate(-8deg);z-index:5}.platform-strip{width:min(1160px,calc(100% - 40px));margin:20px auto 0;height:56px;border:1px solid rgba(170,57,255,.45);border-radius:13px;background:rgba(10,10,32,.7);display:flex;align-items:center;justify-content:space-around;gap:18px;color:#c9cbd5;font-size:13px}.platform-strip span{font-size:8px;letter-spacing:1px;color:#fff}.platform-strip b{font-size:14px}

/* WAVES */
.wave{position:absolute;left:-5%;width:110%;height:120px;pointer-events:none}.wave-top{top:-45px;background:radial-gradient(ellipse at 25% 50%,#6d23ff 0 17%,transparent 18%),radial-gradient(ellipse at 72% 50%,#ff2bbd 0 15%,transparent 16%);filter:blur(2px);opacity:.9}.wave-bottom{bottom:-55px;background:radial-gradient(ellipse at 10% 50%,#ff2bbd 0 15%,transparent 16%),radial-gradient(ellipse at 55% 50%,#ff5a30 0 12%,transparent 13%),radial-gradient(ellipse at 85% 45%,#6535ff 0 16%,transparent 17%);filter:blur(4px);opacity:.9}

/* SERVICES */
.services{background:#041025;padding-top:120px}.service-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:45px}.service-card{min-height:128px;border:1px solid;border-radius:13px;background:linear-gradient(145deg,rgba(16,14,43,.95),rgba(6,15,37,.85));display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transition:.25s}.service-card:hover{transform:translateY(-5px);box-shadow:0 0 24px rgba(160,50,255,.2)}.service-icon{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:25px;color:#fff;margin-bottom:10px;background:currentColor;filter:brightness(1.1);box-shadow:0 0 18px currentColor}.service-icon{color:#b23cff}.service-card h3{font-size:12px}.service-card p{font-size:9px;color:#9ca4b8;margin-top:4px}.c-purple{border-color:#9e35ff}.c-blue{border-color:#009dff}.c-orange{border-color:#ff6c35}.c-violet{border-color:#a13cff}.c-green{border-color:#12dca0}.c-pink{border-color:#ff319e}.c-red{border-color:#ff4848}.c-cyan{border-color:#11bde8}.c-magenta{border-color:#e23bff}.c-lime{border-color:#73dd5c}.c-blue .service-icon{color:#0eaaff}.c-orange .service-icon{color:#ff6c35}.c-green .service-icon{color:#13dca0}.c-pink .service-icon{color:#ff2da6}.c-red .service-icon{color:#ff4545}.c-cyan .service-icon{color:#12c5ee}.c-magenta .service-icon{color:#e33cff}.c-lime .service-icon{color:#73df5b}

/* WORK */
.work{background:linear-gradient(180deg,#031025,#05061a)}.filters{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:26px 0}.filter{border:0;background:#0b2146;color:#c7cad5;padding:10px 19px;border-radius:25px;font-size:10px;cursor:pointer}.filter.active{background:linear-gradient(90deg,#d62cff,#ff9a39);color:#fff}.work-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.work-card{border:1px solid #8a35ff;border-radius:13px;overflow:hidden;background:#07132b;box-shadow:0 0 18px rgba(118,44,255,.12)}.work-preview{height:135px;padding:18px 12px;display:flex;flex-direction:column;justify-content:space-between;font-size:10px}.work-preview span{font-weight:900;letter-spacing:2px}.work-preview b{font-size:15px;line-height:1.1}.car{background:linear-gradient(135deg,#07111d,#285e84)}.shop{background:linear-gradient(135deg,#e8d8cc,#496172);color:#121622}.fit{background:linear-gradient(135deg,#17191c,#695b53)}.news{background:linear-gradient(135deg,#173d5b,#d49d63)}.school{background:linear-gradient(135deg,#173d58,#e4aab5)}.work-info{display:flex;align-items:center;gap:10px;padding:12px}.work-info i{width:33px;height:33px;display:grid;place-items:center;background:#913cff;border-radius:8px;font-style:normal}.work-info h3{font-size:10px}.outline-btn{display:flex;width:max-content;margin:28px auto 0;border:1px solid #bd3dff;padding:12px 24px;border-radius:30px;font-size:11px;background:rgba(98,28,150,.14)}.outline-btn span{margin-left:14px}

/* WHY */
.why{background:#030c1f;padding-top:120px}.why-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:42px}.why-card{min-height:155px;border:1px solid #8b36ff;border-radius:15px;background:rgba(7,15,37,.85);padding:18px;display:flex;flex-direction:column;justify-content:space-between}.why-card>b{font-size:10px;color:#a8aec0}.why-card>span{font-size:28px;color:#e73bff}.why-card h3{font-size:14px;margin-bottom:5px}.why-card p{font-size:9px;color:#9299aa;line-height:1.4}

/* RESULTS */
.results{background:#041027;padding:90px 0}.result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:40px}.result-card{height:90px;border:1px solid;border-radius:15px;background:rgba(8,15,36,.8);display:flex;align-items:center;gap:15px;padding:18px 22px}.result-card b{font-size:25px}.result-card span{font-size:10px;color:#b5bac7;line-height:1.35}.result-card.pink{border-color:#ff2cae}.result-card.blue{border-color:#0caaff}.result-card.orange{border-color:#ff7c22}.result-card.purple{border-color:#a63dff}

/* CONTACT */
.contact{background:#031025;padding-top:115px}.contact-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:38px}.contact-card{min-height:88px;border:1px solid;border-radius:14px;background:rgba(7,15,36,.85);display:flex;align-items:center;gap:12px;padding:14px}.contact-card>i{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:19px;background:#b22eff}.contact-card div{display:flex;flex-direction:column;gap:3px;min-width:0}.contact-card small{font-size:8px}.contact-card b{font-size:10px;white-space:nowrap}.contact-card em{font-size:8px;color:#9aa1b3;font-style:normal}.contact-card>span{margin-left:auto;width:25px;height:25px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font-size:12px}.contact-card.pink{border-color:#ff35b1}.contact-card.green{border-color:#10d9a0}.contact-card.orange{border-color:#ff742c}.contact-card.purple{border-color:#9d3dff}

/* FOOTER */
.footer{background:#020817;padding:70px 0 20px;border-top:1px solid rgba(157,49,255,.4)}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.6fr;gap:30px}.footer-logo{font-size:35px;font-weight:900}.footer-logo span{color:#ff3b9f}.footer-brand p{font-size:10px;line-height:1.6;color:#9198a9;max-width:240px;margin:12px 0}.socials{display:flex;gap:7px}.socials a{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#0b2042;font-size:11px}.footer-grid h4{font-size:11px;color:#d53cff;margin-bottom:14px}.footer-grid>div>a{display:block;font-size:9px;color:#9ba2b3;margin:9px 0}.newsletter p{font-size:9px;color:#9ba2b3;margin-bottom:10px}.newsletter form{display:flex;border:1px solid #2d7fba;border-radius:8px;overflow:hidden}.newsletter input{min-width:0;flex:1;background:#071a35;border:0;color:#fff;padding:10px;font-size:9px;outline:0}.newsletter button{border:0;background:linear-gradient(90deg,#c72cff,#ff893a);color:#fff;padding:0 12px;font-size:9px}.footer-bottom{width:min(1180px,calc(100% - 40px));margin:35px auto 0;padding-top:18px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;color:#7e8698;font-size:8px}

/* RESPONSIVE */
@media(max-width:1000px){.nav-links{gap:18px;margin-right:15px}.nav-links a{font-size:12px}.service-grid,.work-grid{grid-template-columns:repeat(2,1fr)}.why-grid{grid-template-columns:repeat(2,1fr)}.contact-grid{grid-template-columns:repeat(2,1fr)}.result-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}.hero-grid{grid-template-columns:1fr}.hero-copy{text-align:center}.hero-copy .eyebrow{justify-content:center}.hero-copy p{margin:auto}.hero-buttons{justify-content:center}.hero-proof{justify-content:center}.hero-visual{height:420px}.metric{right:2%}.platform-strip{flex-wrap:wrap;height:auto;padding:14px}}
@media(max-width:700px){.nav-wrapper{padding:12px 12px}.navbar{height:62px;padding:0 12px 0 18px;border-radius:17px}.nav-logo{font-size:28px}.nav-links,.nav-divider,.talk-btn{display:none}.round-btn{width:42px;height:42px}.mobile-menu{display:block}.mobile-drawer{position:absolute;top:72px;left:0;right:0;display:flex;flex-direction:column;padding:10px;background:rgba(5,7,22,.97);border:1px solid #8e38ff;border-radius:16px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:.25s}.mobile-drawer.open{opacity:1;visibility:visible;transform:none}.mobile-drawer a{padding:13px;color:#c5c8d3}.section{padding:80px 0}.hero{padding-top:105px}.hero-copy h1{font-size:48px}.hero-visual{height:330px}.metric{display:none}.platform-strip b{font-size:10px}.service-grid,.work-grid,.why-grid,.result-grid,.contact-grid,.footer-grid{grid-template-columns:1fr}.section-heading h2{font-size:36px}.work-preview{height:150px}.footer-bottom{flex-direction:column;gap:8px}.newsletter form{max-width:100%}}