:root{
  --navy:#1B1440; --navy-2:#241B54; --navy-3:#2E2468;
  --pink:#FF1F8F; --pink-dim:#c81876;
  --ink:#F3F1FA; --muted:#A79FCB;
  --line:rgba(255,255,255,.09);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--navy); color:var(--ink); font-family:'Inter',sans-serif; min-height:100vh; overflow-x:hidden;}
h1,h2,h3,.logotype{font-family:'Space Grotesk',sans-serif;}
:focus-visible{outline:2px solid var(--pink); outline-offset:2px;}
@media (prefers-reduced-motion: reduce){*{animation:none!important; transition:none!important;}}

.app{display:flex; min-height:100vh;}
.sidebar{width:250px; background:var(--navy-2); border-right:1px solid var(--line); position:fixed; top:0; left:0; height:100vh; display:flex; flex-direction:column; padding:28px 18px; z-index:50; transition:transform .3s ease;}
.brand{display:flex; align-items:center; gap:10px; padding:0 6px 26px; border-bottom:1px solid var(--line); margin-bottom:22px;}
.brand img{width:34px; height:34px; flex-shrink:0; object-fit:contain;}
.brand .name{font-size:15px; font-weight:700; line-height:1.15; color:var(--pink);}
.brand .name span{display:block; font-size:9px; letter-spacing:.14em; color:var(--muted); font-weight:500; font-family:'Inter',sans-serif;}
.nav{display:flex; flex-direction:column; gap:4px; flex:1;}
.nav a{display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--muted); font-size:14.5px; font-weight:500; padding:11px 12px; border-radius:10px; transition:background .15s, color .15s;}
.nav a svg{width:18px; height:18px; flex-shrink:0; stroke:currentColor;}
.nav a:hover{background:rgba(255,255,255,.05); color:var(--ink);}
.nav a.active{background:var(--pink); color:#fff;}
.sidebar-foot{border-top:1px solid var(--line); padding-top:16px; font-size:12px; color:var(--muted);}

.topbar{display:none; align-items:center; justify-content:space-between; padding:16px 18px; background:var(--navy-2); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:40;}
.topbar .brand{border:none; padding:0; margin:0;}
.burger{background:none; border:1px solid var(--line); border-radius:8px; width:40px; height:40px; color:var(--ink); cursor:pointer;}
.burger svg{width:20px; height:20px;}
.scrim{display:none; position:fixed; inset:0; background:rgba(10,7,30,.6); z-index:45;}

.main{margin-left:250px; flex:1; min-width:0;}
section{padding:72px 44px; max-width:1000px; scroll-margin-top:20px;}
section.reveal{opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease;}
section.reveal.in{opacity:1; transform:translateY(0);}

.eyebrow{color:var(--pink); font-size:13px; font-weight:600; margin-bottom:10px;}
h1{font-size:clamp(30px,5vw,46px); line-height:1.1; margin-bottom:18px; font-weight:700;}
h2{font-size:clamp(22px,3.5vw,28px); margin-bottom:14px; font-weight:600;}
.lead{color:var(--muted); font-size:17px; line-height:1.6; max-width:60ch; margin-bottom:28px;}
.btn{display:inline-flex; align-items:center; gap:8px; background:var(--pink); color:#fff; border:none; padding:13px 26px; border-radius:10px; font-weight:600; font-size:15px; cursor:pointer; font-family:inherit; transition:background .15s, transform .15s; text-decoration:none;}
.btn:hover{background:var(--pink-dim); transform:translateY(-1px);}
.btn.ghost{background:transparent; border:1px solid var(--line); color:var(--ink);}
.btn.ghost:hover{border-color:var(--pink); background:rgba(255,31,143,.08);}

.hero-actions{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:8px;}
.badges{display:flex; gap:12px; margin-top:32px; flex-wrap:wrap;}
.badge{display:flex; align-items:center; gap:8px; background:var(--navy-2); border:1px solid var(--line); border-radius:999px; padding:9px 16px; font-size:13px; color:var(--muted);}
.badge svg{width:16px; height:16px; stroke:var(--pink); flex-shrink:0;}

.grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin-top:28px;}
.card{background:var(--navy-2); border:1px solid var(--line); border-radius:14px; padding:22px; transition:transform .2s, border-color .2s;}
.card:hover{transform:translateY(-4px); border-color:var(--pink-dim);}
.card .ic{width:38px; height:38px; border-radius:9px; background:rgba(255,31,143,.12); display:flex; align-items:center; justify-content:center; margin-bottom:14px;}
.card .ic svg{width:19px; height:19px; stroke:var(--pink);}
.card h3{font-size:16px; margin-bottom:8px; font-weight:600;}
.card p{color:var(--muted); font-size:14px; line-height:1.55;}

/* Timeline */
.timeline{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:18px; margin-top:30px; counter-reset:step;}
.step{position:relative; padding-top:44px;}
.step::before{counter-increment:step; content:counter(step); position:absolute; top:0; left:0; width:34px; height:34px; border-radius:50%; background:var(--pink); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:14px;}
.step h3{font-size:15px; margin-bottom:6px; font-weight:600;}
.step p{color:var(--muted); font-size:13.5px; line-height:1.55;}

/* Growth bars */
.growth-bars{display:flex; flex-direction:column; gap:20px; margin-top:28px;}
.growth-bar-top{display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-bottom:7px;}
.growth-bar-top span{font-size:13.5px; color:var(--ink); max-width:70%;}
.growth-bar-top b{font-family:'Space Grotesk',sans-serif; font-size:18px; color:var(--pink); white-space:nowrap;}
.growth-track{height:10px; background:var(--navy-2); border:1px solid var(--line); border-radius:999px; overflow:hidden;}
.growth-fill{height:100%; width:0; background:linear-gradient(90deg, var(--pink-dim), var(--pink)); border-radius:999px; transition:width 1.1s ease;}
.growth-source{font-size:11.5px; color:var(--muted); margin-top:5px;}

/* Carousel */
.carousel{margin-top:30px; position:relative;}
.car-track{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:16px; scrollbar-width:none; -ms-overflow-style:none; padding-bottom:4px;}
.car-track::-webkit-scrollbar{display:none;}
.car-slide{flex:0 0 100%; scroll-snap-align:start; background:var(--navy-2); border:1px solid var(--line); border-radius:14px; padding:24px;}
@media (min-width:640px){.car-slide{flex:0 0 calc(50% - 8px);}}
.car-slide-top{display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:8px; flex-wrap:wrap;}
.car-slide h3{font-size:16.5px; font-weight:600;}
.tag{font-size:11px; color:var(--pink); border:1px solid var(--pink-dim); padding:3px 10px; border-radius:999px; white-space:nowrap;}
.car-slide p{color:var(--muted); font-size:14px; line-height:1.6;}
.car-controls{display:flex; justify-content:center; gap:10px; margin-top:18px;}
.car-btn{width:38px; height:38px; border-radius:50%; border:1px solid var(--line); background:var(--navy-2); color:var(--ink); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:border-color .15s, background .15s;}
.car-btn:hover{border-color:var(--pink); background:rgba(255,31,143,.1);}
.car-btn svg{width:16px; height:16px;}
.car-dots{display:flex; gap:7px; align-items:center;}
.car-dot{width:7px; height:7px; border-radius:50%; background:var(--line); border:none; cursor:pointer; padding:0;}
.car-dot.active{background:var(--pink); width:20px; border-radius:4px; transition:width .2s;}

/* FAQ accordion */
.faq-item{border:1px solid var(--line); border-radius:12px; margin-bottom:10px; overflow:hidden; background:var(--navy-2);}
.faq-q{width:100%; text-align:left; background:none; border:none; color:var(--ink); font:inherit; font-size:15px; font-weight:600; padding:18px 20px; display:flex; justify-content:space-between; align-items:center; cursor:pointer; gap:12px;}
.faq-q svg{width:18px; height:18px; stroke:var(--pink); flex-shrink:0; transition:transform .2s;}
.faq-item.open .faq-q svg{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .25s ease;}
.faq-a p{padding:0 20px 18px; color:var(--muted); font-size:14px; line-height:1.6;}

.contact-wrap{display:grid; grid-template-columns:1fr; gap:28px;}
.field{margin-bottom:16px;}
.field label{display:block; font-size:13px; color:var(--muted); margin-bottom:6px;}
.field input, .field textarea{width:100%; background:var(--navy-2); border:1px solid var(--line); border-radius:9px; color:var(--ink); padding:12px 14px; font:inherit; font-size:14.5px;}
.field textarea{resize:vertical; min-height:100px;}
.field input:focus, .field textarea:focus{border-color:var(--pink); outline:none;}
.contact-info{display:flex; flex-direction:column; gap:14px;}
.contact-info .row{display:flex; gap:12px; align-items:center; color:var(--muted); font-size:14px;}
.contact-info svg{width:18px; height:18px; stroke:var(--pink); flex-shrink:0;}
@media (min-width:760px){.contact-wrap{grid-template-columns:1.2fr .8fr;}}

footer{padding:26px 44px; color:var(--muted); font-size:12.5px; border-top:1px solid var(--line);}

@media (max-width:900px){
  .sidebar{transform:translateX(-100%); box-shadow:0 0 40px rgba(0,0,0,.4);}
  .sidebar.open{transform:translateX(0);}
  .main{margin-left:0;}
  .topbar{display:flex;}
  .scrim.show{display:block;}
  section{padding:48px 20px;}
  footer{padding:22px 20px;}
}