:root{
  --mag:linear-gradient(to right,#7E0DB3,#AE00A2,#CF0090,#E7137E,#F73C6E);
  --mag-soft:linear-gradient(135deg,#7E0DB3,#F73C6E);
  --blue:linear-gradient(to right,#06C6ED,#00B3EE,#009EEC,#0088E7,#0070DB);
  --blue-soft:linear-gradient(135deg,#0088E7,#06C6ED);
  --ink:#212529; --muted:#5a6573; --line:rgba(0,0,0,.09);
  --bg:#fff; --bg-soft:linear-gradient(90deg,#FFFCF2,#F0F7FF,#F8F1FF);
  --bg-rose:#FAF2F2; --bg-blue:#F2F8FF;
  --card-sh:0 6px 22px rgba(20,20,50,.07);
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
 
img{max-width:100%;display:block} 
.wrap{max-width:1180px;margin:0 auto;padding:0 22px}
section{padding:70px 0} 
h2.st .k{background:var(--mag);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{max-width:720px;margin:14px auto 0;text-align:center;color:var(--muted);font-size:17px}
.eyebrow{display:inline-block;font-size:12.5px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:#F73C6E;margin-bottom:14px}
.center{text-align:center}
.accent{width:54px;height:4px;border-radius:4px;background:var(--mag);margin:16px auto 0}
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;border:none;cursor:pointer;border-radius:40px;padding:13px 26px;transition:.2s;white-space:nowrap}
.btn svg{width:16px;height:16px}
.btn-primary{background:var(--mag);color:#fff;box-shadow:0 8px 20px rgba(207,0,144,.28)}
.btn-primary:hover{filter:brightness(1.07);transform:translateY(-1px)}
.btn-ghost{background:#fff;color:#212529;border:1.5px solid var(--line)}
.btn-ghost:hover{border-color:#CF0090;color:#CF0090}
.cta-row{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:34px}
.icon{width:26px;height:26px;stroke:#fff;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.chip-ic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:var(--mag);flex:none;box-shadow:0 8px 16px rgba(207,0,144,.22)}
.chip-ic.blue{background:var(--blue)}
.grid{display:grid;gap:22px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px 24px;box-shadow:var(--card-sh);transition:.2s}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(20,20,50,.12)}
.card h3{font-size:18px;font-weight:700;margin:25px 0 7px}
.card p{font-size:14.5px;color:var(--muted);line-height:1.55}
.tag{display:inline-block;margin-top:12px;font-size:11.5px;font-weight:700;letter-spacing:.4px;color:#0088E7;background:#EAF4FF;padding:4px 10px;border-radius:20px}
.bestfor{display:block;margin-top:10px;font-size:13px;font-weight:600;color:#AE00A2}
/* HEADER */
.topbar{background:var(--mag);color:#fff;font-size:13.5px}
.topbar .wrap{display:flex;gap:26px;align-items:center;justify-content:flex-end;height:40px}
.topbar a{display:inline-flex;align-items:center;gap:7px;color:#fff;opacity:.96}
.topbar svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:1.8}
header{position:sticky;top:0;z-index:50;background:#fff;box-shadow:0 2px 14px rgba(0,0,0,.06)}
.nav{display:flex;align-items:center;justify-content:space-between;height:70px}
.nav .logo img{height:46px;width:auto}
.menu{display:flex;gap:24px;align-items:center}
.menu a{font-size:13.5px;font-weight:600;color:#15151c;display:inline-flex;align-items:center;gap:5px}
.menu a:hover{color:#CF0090}
.menu a .ca{font-size:9px;opacity:.5}
.qbtn{background:var(--mag);color:#fff;font-weight:600;font-size:14px;padding:10px 22px;border-radius:30px 0 0 30px;margin-right:-22px}
/* HERO */
.hero{background:radial-gradient(900px 500px at 80% -10%,rgba(231,19,126,.35),transparent 60%),radial-gradient(700px 500px at 10% 110%,rgba(0,136,231,.32),transparent 55%),#0b0b14;color:#fff;padding:150px 0 92px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:46px;align-items:center}
.hero h1{font-size:46px;line-height:1.1;font-weight:700; color:#fff; padding: 0!important;}
.hero h1 .k{background:linear-gradient(90deg,#F73C6E,#CF0090,#06C6ED);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.lead{margin-top:20px;font-size:18px;line-height:1.65;color:#DBDDE3;max-width:560px}
.pills{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.pills span{font-size:13px;font-weight:600;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);padding:8px 15px;border-radius:30px;backdrop-filter:blur(4px)}
.hero .cta-row{justify-content:flex-start}
.hero-art{filter:drop-shadow(0 24px 60px rgba(0,0,0,.5))}
/* trust bar */
.trust{background:var(--bg-soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trust .wrap{padding:50px 22px 30px;display:flex;flex-wrap:wrap;gap:18px 40px;align-items:center;justify-content:center;text-align:center}
.stat strong{display:block;font-size:30px;font-weight:800;background:var(--mag);-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1}
.stat span{font-size:12.5px;color:var(--muted);font-weight:600}
.divv{width:1px;height:38px;background:var(--line)}
.badges{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;align-items:center;margin-top:6px}
.bdg{font-size:12px;font-weight:700;color:#212529;background:#fff;border:1px solid var(--line);border-radius:10px;padding:9px 14px;box-shadow:0 3px 10px rgba(0,0,0,.05);display:flex;gap:8px;align-items:center}
.bdg .star{color:#F7B500}
.logos{display:flex;gap:26px;flex-wrap:wrap;justify-content:center;align-items:center;margin-top:22px;opacity:.85}
.logos span {
    font-weight: 600;
    font-size: 15px;
    color: #424b5a;
    letter-spacing: .3px;
}
/* answer block */
.answer{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.answer .lead{font-size:18px;line-height:1.7;color:#2a2f3a}
.answer .lead .hl{font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.chips strong{font-size:13.5px;font-weight:600;background:#fff;border:1px solid var(--line);border-radius:30px;padding:9px 15px;box-shadow:0 3px 9px rgba(0,0,0,.04);display:flex;gap:8px;align-items:center}
.chips strong svg{width:16px;height:16px;stroke:#CF0090;fill:none;stroke-width:1.8}
/* pain */
.pain .card{border-left:4px solid #F73C6E}
.pain .card .q{font-weight:700;font-size:15.5px;color:#1c1c24}
.pain .card p{margin-top:6px}
/* timeline */
.flow{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:18px}
.step{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px 16px;box-shadow:var(--card-sh);position:relative}
.step .n{width:38px;height:38px;border-radius:50%;background:var(--mag);color:#fff;font-weight:800;display:grid;place-items:center;font-size:16px;margin-bottom:12px}
.step h3{font-size:15px;font-weight:700;margin-bottom:6px}
.step p {
    font-size: 13px;
    color: var(--muted);
    line-height: 20px;
    margin-bottom: 0;
}
.step p b, .step p strong{color:#0088E7}
/* cost */
.cost{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:stretch}
.cost .panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:30px;box-shadow:var(--card-sh)}
.driver{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px dashed var(--line);font-weight:600;font-size:15px}
.driver:last-child{border-bottom:none}
.driver .d{width:34px;height:34px;border-radius:9px;background:#F3E9FF;display:grid;place-items:center;flex:none}
.driver .d svg{width:18px;height:18px;stroke:#AE00A2;fill:none;stroke-width:1.8}
.range{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);    gap: 15px;    line-height: 20px;}
.range:last-child{border-bottom:none}
.range strong{font-weight:700}
.range .v{font-weight:800;background:var(--blue);-webkit-background-clip:text;background-clip:text;color:transparent; text-align: right;}
.note {
    font-size: 13px;
    color: #5b626e;
    margin-top: 14px;
}
/* roles */
.roles{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:8px}
.role{display:flex;gap:10px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 18px;font-weight:600;font-size:14.5px;box-shadow:0 3px 10px rgba(0,0,0,.04)}
.role .d{width:32px;height:32px;border-radius:8px;background:var(--blue);display:grid;place-items:center}
.role .d svg{width:17px;height:17px;stroke:#fff;fill:none;stroke-width:1.8}
 
.src{margin-left:auto;font-size:11px;font-weight:700;color:#0088E7;background:#EAF4FF;padding:4px 9px;border-radius:20px}
 
.bg_blue{background:var(--bg-blue)}
.bg_soft{background:var(--bg-soft)}
.bg_g{background: linear-gradient(135deg, #AE00A2, #06C6ED);    border: 0; color: #fff;}
.bg_rose{background:var(--bg-rose)}

  .final {
                background: radial-gradient(700px 400px at 85% 0,rgba(231,19,126,.4),transparent 60%),#0b0b14;
                color: #fff;
                text-align: center;
                border-radius: 0
            }
 

            .final p {
                color: #cfd2de;
                margin-top: 14px;
                font-size: 17px
            }

            .final .contact {
                margin-top: 22px;
                font-size: 14px;
                color: #aeb4c4
            }

            /* section label index */
            .slab {
                display: inline-block;
                font-size: 11px;
                font-weight: 800;
                letter-spacing: 1.5px;
                color: #c9ccd6;
                border: 1px solid #e6e8ef;
                border-radius: 20px;
                padding: 3px 11px;
                margin-bottom: 10px
            }
.final .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.3)}
@media(max-width:900px){
 .hero-grid,.answer,.cost{grid-template-columns:1fr}.hero-art{order:-1;max-width:420px;margin:0 auto}
 .g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}.flow{grid-template-columns:repeat(2,1fr)}
 .fgrid{grid-template-columns:1fr 1fr}.menu{display:none}.hero h1{font-size:34px}h2.st{font-size:27px}
 .cost .panel { 
    padding: 16px; 
}
.awards{ flex-wrap:wrap;}
}
@media(max-width:560px){.g4,.g3,.g2,.flow{grid-template-columns:1fr}.topbar .wrap{justify-content:center;gap:16px}.fgrid{grid-template-columns:1fr}
.role {width: 100%;}
section{padding:45px 0} 
}