:root{--blue:#1120dc;--cyan:#00cbea;--ink:#10152a;--muted:#697087;--paper:#f7f9fc;--line:#dfe3ed;--sans:'DM Sans',sans-serif;--display:'Plus Jakarta Sans',sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:white;font:16px/1.6 var(--sans)}
a{color:inherit}
header{height:86px;padding:0 5vw;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:42px;background:rgba(255,255,255,.94);position:relative;z-index:9}
.brand{display:flex;align-items:center;text-decoration:none;gap:9px;font:700 22px var(--display);letter-spacing:-1.2px}
.brand b span{color:var(--blue)}
.pencil{display:grid;place-items:center;width:37px;height:37px;background:var(--blue);color:white;border-radius:10px;transform:rotate(-4deg)}
nav{margin-left:auto;display:flex;gap:32px}
nav a{text-decoration:none;font-size:14px;font-weight:600;color:#4e566e}
nav a:hover{color:var(--blue)}
.header-cta,.primary{background:var(--blue);color:white;text-decoration:none;padding:13px 19px;border-radius:9px;font-weight:700;display:inline-flex;gap:20px;align-items:center;box-shadow:0 8px 20px rgba(17,32,220,.16);transition:.2s}
.header-cta:hover,.primary:hover{transform:translateY(-2px);background:#0714ba}
.menu{display:none}
.hero{padding:88px 5vw 76px;background:linear-gradient(135deg,#fbfcff 50%,#f1f5ff);display:grid;grid-template-columns:1.05fr .95fr;align-items:center;min-height:720px;overflow:hidden}
.hero-copy{max-width:730px}
.pill{display:inline-flex;gap:9px;align-items:center;background:#ecf0ff;color:var(--blue);padding:8px 13px;border-radius:30px;font-size:12px;font-weight:700}
.pill i{width:7px;height:7px;background:var(--cyan);border-radius:50%;box-shadow:0 0 0 4px rgba(0,203,234,.15)}
h1,h2{font-family:var(--display);letter-spacing:-.055em;line-height:1.03}
h1{font-size:clamp(53px,5.5vw,82px);margin:25px 0}
h1 em,h2 em{font-style:normal;color:var(--blue)}
.hero-copy>p{font-size:19px;color:var(--muted);max-width:620px}
.actions{display:flex;gap:18px;align-items:center;margin-top:34px}
.primary{padding:16px 22px}
.secondary{font-weight:700;text-decoration:none;padding:15px}
.proof{display:flex;margin-top:55px;padding-top:25px;border-top:1px solid var(--line);gap:34px}
.proof>div{display:flex;align-items:center;gap:10px;padding-right:30px;border-right:1px solid var(--line)}
.proof>div:last-child{border:0}
.proof strong{font:700 25px var(--display);color:var(--blue)}
.proof span{font-size:11px;line-height:1.35;color:#777e90}
.hero-art{height:600px;position:relative}
.blue-panel{width:83%;height:82%;background:var(--blue);border-radius:32px;position:absolute;right:-2%;top:0;box-shadow:0 30px 70px rgba(19,33,140,.25);padding:25px;color:white;overflow:hidden}
.blue-panel:after{content:'';position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(0,203,234,.18))}
.panel-top,.panel-foot{position:relative;z-index:2;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.12em}
.panel-top span:last-child{color:#86f7d0}
.panel-foot{position:absolute;bottom:25px;left:25px;right:25px;color:#b8c0ff}
.rings{position:absolute;width:430px;height:430px;border:1px solid rgba(255,255,255,.2);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center}
.rings:before,.rings:after{content:'';position:absolute;border:1px solid rgba(255,255,255,.2);border-radius:50%}
.rings:before{width:320px;height:320px}
.rings:after{width:210px;height:210px}
.core{width:115px;height:115px;border-radius:50%;background:var(--cyan);color:var(--ink);display:grid;place-content:center;text-align:center;font:800 36px var(--display);z-index:3;box-shadow:0 0 50px rgba(0,203,234,.55)}
.core span{display:block;font:700 8px var(--sans);letter-spacing:.12em}
.float-card{position:absolute;left:0;bottom:10px;background:white;border-radius:15px;padding:18px 22px;display:flex;gap:14px;align-items:center;box-shadow:0 20px 50px rgba(20,30,80,.22)}
.float-card>span{width:38px;height:38px;border-radius:10px;background:#e7fbff;color:#00a4c1;display:grid;place-items:center;font-weight:800}
.float-card b,.float-card small{display:block}
.float-card small{color:var(--muted)}
.client-strip{min-height:92px;padding:20px 5vw;display:flex;align-items:center;justify-content:space-between;border-block:1px solid var(--line);gap:30px;color:#9197a8}
.client-strip>span{font-size:10px;letter-spacing:.12em;color:#5e667d}
.client-strip div{font:600 13px var(--display)}
.section{padding:110px 5vw}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:70px;margin-bottom:60px}
.section-head h2{font-size:clamp(42px,4.5vw,67px);margin:15px 0 0}
.section-head>p{max-width:480px;color:var(--muted);font-size:17px}
.kicker{font-size:11px;letter-spacing:.15em;font-weight:700;color:var(--blue)}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.cards article{background:var(--paper);border:1px solid #e8eaf0;border-radius:18px;padding:26px;min-height:380px;position:relative;transition:.2s}
.cards article:hover{background:white;transform:translateY(-6px);box-shadow:0 20px 45px rgba(26,38,90,.1);border-color:#cad0ef}
.num{font-size:11px;color:#9299aa}
.ico{margin:40px 0 25px;width:54px;height:54px;border-radius:14px;background:#e9edff;color:var(--blue);display:grid;place-items:center;font-size:25px}
.cards h3{font:700 21px var(--display)}
.cards p{font-size:14px;color:var(--muted)}
.cards a{position:absolute;bottom:25px;text-decoration:none;font-size:13px;font-weight:700;color:var(--blue)}
.difference{background:var(--blue);color:white;padding:110px 5vw;display:grid;grid-template-columns:1fr 1fr;gap:9vw}
.difference .kicker{color:var(--cyan)}
.diff-copy h2{font-size:clamp(45px,5vw,72px);margin:18px 0}
.diff-copy h2 em{color:var(--cyan)}
.diff-copy>p{color:#c0c5f2;max-width:580px;font-size:17px}
.light{background:white;color:var(--blue);margin-top:25px}
.benefits>div{border-top:1px solid rgba(255,255,255,.25);padding:28px 0;display:grid;grid-template-columns:50px 1fr;gap:10px}
.benefits b{font-size:11px;color:var(--cyan)}
.benefits h3{font:700 22px var(--display);margin:0}
.benefits p{grid-column:2;color:#c0c5f2;margin:0}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.steps>div{padding-right:35px;position:relative}
.steps span{font-size:11px;font-weight:700;color:var(--blue)}
.steps i{display:block;height:2px;background:var(--line);margin:20px 0 35px;position:relative}
.steps i:before{content:'';width:10px;height:10px;border-radius:50%;background:var(--cyan);position:absolute;top:-4px}
.steps h3{font:700 18px var(--display)}
.steps p{font-size:14px;color:var(--muted)}
.contact{text-align:left;padding:120px 5vw;background:#0f1530;color:white;display:grid;grid-template-columns:.75fr 1.25fr;gap:8vw;align-items:start}
.contact .kicker{color:var(--cyan)}
.contact h2{font-size:clamp(44px,5vw,72px);margin:20px 0}
.contact p{color:#aeb5cd;font-size:18px}
.contact-form{background:white;color:var(--ink);padding:34px;border-radius:22px;box-shadow:0 28px 70px rgba(0,0,0,.22)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-form label{display:block;font-size:13px;font-weight:700;margin-bottom:18px}
.contact-form label>span{float:right;color:#9299aa;font-size:11px;font-weight:500}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;margin-top:8px;border:1px solid #dce0ea;border-radius:9px;padding:13px 14px;background:#f8f9fc;color:var(--ink);font:15px var(--sans);outline:none;transition:.2s}
.contact-form textarea{resize:vertical;min-height:130px}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--blue);background:white;box-shadow:0 0 0 3px rgba(17,32,220,.1)}
.contact-form button{width:100%;border:0;border-radius:9px;background:var(--blue);color:white;padding:16px 20px;font:700 15px var(--sans);display:flex;justify-content:space-between;cursor:pointer;transition:.2s}
.contact-form button:hover{background:#0714ba;transform:translateY(-2px)}
.contact-form .form-note{font-size:11px;color:#858c9f;margin:12px 0 0;text-align:center}
.website-field{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.turnstile-wrap{min-height:65px;display:flex;align-items:center}
.contact-form .form-note.success{color:#087f5b}
.contact-form .form-note.error{color:#c92a2a}
.contact-form button:disabled{opacity:.65;cursor:wait;transform:none}
footer{height:105px;padding:0 5vw;display:flex;align-items:center;gap:50px}
footer p{margin-left:auto;color:var(--muted);font-size:12px}
footer small{color:#999faf}
@media(max-width:1000px){nav{display:none}
.header-cta{margin-left:auto}
.hero{grid-template-columns:1fr}
.hero-art{margin-top:55px}
.cards{grid-template-columns:1fr 1fr}
.difference{grid-template-columns:1fr}
.contact{grid-template-columns:1fr;gap:45px}
.steps{grid-template-columns:1fr 1fr;gap:35px}
.client-strip{overflow:hidden;justify-content:flex-start}
}
@media(max-width:650px){header{height:76px;padding:0 20px}
.header-cta{display:none}
.menu{display:block;margin-left:auto;background:white;border:1px solid var(--line);border-radius:7px;padding:8px 11px}
.open nav{display:flex;position:absolute;top:76px;left:0;right:0;background:white;padding:25px;flex-direction:column;border-bottom:1px solid var(--line)}
.hero{padding:60px 20px}
.hero h1{font-size:48px}
.actions{flex-direction:column;align-items:flex-start}
.proof{flex-wrap:wrap}
.proof>div{border:0}
.hero-art{height:470px}
.blue-panel{width:96%;height:360px}
.rings{width:320px;height:320px}
.rings:before{width:240px;height:240px}
.rings:after{width:160px;height:160px}
.float-card{bottom:10px}
.section,.difference,.contact{padding:80px 20px}
.section-head{display:block}
.cards{grid-template-columns:1fr}
.steps{grid-template-columns:1fr}
.client-strip{padding-inline:20px}
.field-row{grid-template-columns:1fr}
.contact-form{padding:24px 18px;border-radius:16px}
footer{height:auto;padding:30px 20px;flex-direction:column;align-items:flex-start;gap:8px}
footer p{margin:0}
.benefits>div{grid-template-columns:35px 1fr}
}