:root{--navy:#061329;--blue:#087ef5;--cyan:#15baff;--paper:#f4f7fb;--ink:#0b1730;--muted:#66748a;--line:#dce5ee}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"DM Sans",sans-serif;color:var(--ink);background:var(--paper)}
a{text-decoration:none;color:inherit}
h1,h2,h3,p{margin:0}
header{height:84px;position:absolute;z-index:5;left:50%;transform:translateX(-50%);width:min(1180px,calc(100% - 40px));display:flex;align-items:center;justify-content:space-between;color:#fff}
.brand{display:flex;align-items:center;gap:10px;font:600 13px "Manrope";letter-spacing:.15em}
.brand img{width:48px;height:48px;object-fit:cover;border-radius:50%}
.outline{padding:11px 17px;border:1px solid #ffffff55;border-radius:99px;font-size:12px;font-weight:700}
.hero{min-height:750px;padding:150px max(24px,calc((100% - 1180px)/2)) 80px;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;color:#fff;background:radial-gradient(circle at 75% 44%,#0a438066,transparent 26%),linear-gradient(120deg,#040b19,#071a34)}
.pill{display:flex;align-items:center;gap:9px;width:max-content;margin-bottom:24px;padding:8px 13px;border:1px solid #128ffc55;border-radius:99px;color:#8ed4ff;font-size:11px;font-weight:800;letter-spacing:.12em}
.pill i{width:7px;height:7px;border-radius:50%;background:#79edbd;box-shadow:0 0 12px #79edbd}
.hero h1{font:700 clamp(40px,4.3vw,67px)/1.08 "Manrope";letter-spacing:-.045em}
.hero h1 em{font-style:normal;color:var(--cyan)}
.hero-copy>p{max-width:620px;margin:25px 0;color:#afbed1;font-size:17px;line-height:1.65}
.cta{display:flex;width:max-content;gap:25px;padding:16px 20px;border-radius:8px;background:linear-gradient(135deg,#078cff,#0669dd);font-weight:700}
.hero-copy>small{display:block;margin-top:13px;color:#71849d}
.visual{position:relative;height:470px;display:grid;place-items:center}
.ring{position:absolute;width:440px;height:440px;border:1px solid #168df533;border-radius:50%}
.analysis{position:relative;z-index:2;width:min(380px,90%);padding:25px;border:1px solid #5f9edb55;border-radius:17px;background:linear-gradient(145deg,#102d54,#07172e);box-shadow:0 30px 70px #0008;transform:rotate(-2deg)}
.top{display:flex;justify-content:space-between;color:#6f8faf;font-size:9px;letter-spacing:.1em}
.top b{color:#70e5b7}
.analysis>small{display:block;margin:28px 0 7px;color:#42afff;font-size:9px;font-weight:800;letter-spacing:.13em}
.analysis h2{font:700 21px "Manrope"}
.answer{display:flex;align-items:center;gap:13px;margin:20px 0;padding:13px;border:1px solid #50dca855;border-radius:9px;background:#20b67e16}
.answer>i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#189c70;font-style:normal}
.answer span{display:grid;font-size:11px}
.answer span small{color:#829bb6}
.answer strong{margin-left:auto;color:#69e7b8}
.line{display:flex;align-items:center;gap:10px;margin:24px 0 17px;color:#17a9ff;font-size:11px;font-weight:800}
.line span{height:1px;flex:1;background:#1a5480}
.analysis footer{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.analysis footer p{display:grid;font-size:11px}
.analysis footer small{color:#64809e;font-size:8px}
.float{position:absolute;z-index:3;display:flex;gap:10px;padding:11px 14px;border:1px solid #559bd855;border-radius:9px;background:#0b213e;color:#39b1ff}
.float span{display:grid;color:#fff;font-size:10px}
.float small{color:#6c88a7;font-size:7px}
.f1{top:55px;right:0}
.f2{bottom:48px;left:0}
.features{max-width:1230px;margin:auto;padding:95px 25px}
.kicker{color:#087ef5!important;font-size:11px!important;font-weight:800;letter-spacing:.18em}
.heading{display:grid;grid-template-columns:1fr 420px;gap:60px;align-items:end;margin:15px 0 45px}
.heading h2,.signup h2{font:700 clamp(32px,3.2vw,48px)/1.13 "Manrope";letter-spacing:-.035em}
.heading p{color:var(--muted);line-height:1.7}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.grid article{position:relative;min-height:300px;padding:25px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 10px 32px #1234570c}
.grid article:first-child{background:var(--navy);color:#fff}
.grid article>i{position:absolute;right:22px;color:#aab7c7;font-size:10px}
.grid article>span{display:grid;place-items:center;width:42px;height:42px;margin-bottom:26px;border-radius:10px;background:#e8f4ff;color:#087ef5;font-size:18px}
.grid article:first-child>span{background:#0b75d933}
.grid h3{font:700 19px "Manrope"}
.grid p{margin-top:13px;color:var(--muted);font-size:14px;line-height:1.65}
.grid article:first-child p{color:#92a7bf}
.signup{padding:85px max(25px,calc((100% - 1180px)/2));display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:center;color:#fff;background:linear-gradient(135deg,#07152c,#09213f)}
.signup>div>p:last-child{margin-top:20px;color:#9bacc0;line-height:1.7}
.box{padding:29px;border:1px solid #69a7dc33;border-radius:15px;background:#06132699}
.prize{display:flex;gap:13px;align-items:center;margin-bottom:23px}
.prize>b{display:grid;place-items:center;width:50px;height:50px;border-radius:12px;background:linear-gradient(135deg,#087ef5,#14b8fa)}
.prize span{display:grid}
.prize small{color:#7189a5}
form label{display:block;margin-bottom:8px;color:#b6c5d7;font-size:11px;font-weight:700}
.website-field{position:absolute;left:-9999px}
.input{display:grid;grid-template-columns:1fr auto;gap:8px}
.input input{min-width:0;padding:14px;border:1px solid #2b4563;border-radius:8px;background:#0c203a;color:#fff;font:inherit;outline:none}
.input input:focus{border-color:#168df5}
.input button{padding:0 17px;border:0;border-radius:8px;background:#087ef5;color:#fff;font-weight:700;cursor:pointer}
.input button:disabled{opacity:.6}
#form-message{min-height:16px;margin-top:10px;color:#71849a;font-size:10px}
#form-message.success{color:#70e5b7}
#form-message.error{color:#ff9696}
body>footer{min-height:105px;padding:25px max(25px,calc((100% - 1180px)/2));display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background:#040d1c;color:#71849b;font-size:10px}
body>footer .brand{color:#dce8f5}
body>footer .brand img{width:38px;height:38px}
body>footer>p{letter-spacing:.1em}
body>footer>p b{color:#16a9ff}
body>footer>small{text-align:right}
.numbers{padding:76px max(25px,calc((100% - 1180px)/2));display:grid;grid-template-columns:.8fr 1.2fr;gap:75px;align-items:center;background:#fff;border-bottom:1px solid var(--line)}
.numbers-intro h2{margin:13px 0 16px;font:700 clamp(29px,3vw,43px)/1.15 "Manrope";letter-spacing:-.035em}
.numbers-intro>p:last-child{color:var(--muted);line-height:1.7}
.number-grid{display:grid;grid-template-columns:1.15fr 1fr 1fr;border:1px solid var(--line);border-radius:15px;overflow:hidden;box-shadow:0 18px 45px #1234570d}
.number-grid article{min-height:170px;padding:25px 22px;display:flex;flex-direction:column;justify-content:center;background:#f8fbfe;border-left:1px solid var(--line)}
.number-grid article:first-child{border-left:0}
.number-grid .number-main{color:#fff;background:linear-gradient(145deg,#071831,#0a3763)}
.number-grid small{color:#6c8096;font-size:8px;font-weight:800;letter-spacing:.13em}
.number-main small{color:#6fbef5}
.number-grid strong{margin:9px 0 3px;font:800 clamp(30px,3.3vw,46px) "Manrope";letter-spacing:-.04em;color:#0a79e8}
.number-main strong{color:#fff}
.number-grid span{color:#8492a2;font-size:10px}
.number-main span{color:#86a3bf}
@media(max-width:900px){.numbers{grid-template-columns:1fr;gap:35px}}
@media(max-width:600px){.numbers{padding:60px 20px}.number-grid{grid-template-columns:1fr}.number-grid article{min-height:130px;border-left:0;border-top:1px solid var(--line)}.number-grid article:first-child{border-top:0}}
@media(max-width:900px){.hero{grid-template-columns:1fr}
.grid{grid-template-columns:1fr 1fr}
.heading{grid-template-columns:1fr}
.signup{grid-template-columns:1fr}
.float{display:none}
}
@media(max-width:600px){header{width:calc(100% - 30px)}
.brand{font-size:10px}
.brand img{width:40px;height:40px}
.outline{font-size:10px}
.hero{padding:135px 20px 65px;gap:25px}
.hero h1{font-size:39px}
.visual{height:390px}
.ring{width:370px;height:370px}
.features{padding:70px 20px}
.grid{grid-template-columns:1fr}
.signup{padding:65px 20px;gap:40px}
.input{grid-template-columns:1fr}
.input button{padding:14px}
body>footer{grid-template-columns:1fr;justify-items:center;gap:17px}
body>footer>small{text-align:center}
}