*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Nunito,system-ui,sans-serif;color:#1d2433;background:#fff;line-height:1.55}
a{color:#3D7BFF;text-decoration:none}
.wrap{max-width:1100px;margin:0 auto;padding:0 24px}
nav{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:26px;color:#1d2433}
.brand img{width:40px;height:40px;border-radius:10px}
.pill{display:inline-block;background:#3D7BFF;color:#fff;font-weight:800;padding:14px 26px;border-radius:16px;box-shadow:0 5px 0 #2457D6}
.pill.alt{background:#fff;color:#3D7BFF;box-shadow:0 5px 0 #d5def0;border:2px solid #e3e9f5}
.hero{background:radial-gradient(circle at 70% 30%,#5E95FF,#3D7BFF 45%,#2457D6);color:#fff}
.hero .in{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center;padding:50px 0 70px}
.hero h1{font-size:54px;line-height:1.05;font-weight:900;margin-bottom:18px}
.hero p{font-size:20px;opacity:.95;margin-bottom:28px;max-width:520px}
.hero .pill{background:#FFB61E;color:#3b2500;box-shadow:0 5px 0 #D48F00}
.hero nav .brand{color:#fff}
.hero .mascot{width:100%;max-width:420px;justify-self:center;filter:drop-shadow(0 20px 30px rgba(0,0,0,.25))}
.soon{font-size:14px;font-weight:800;opacity:.85;margin-top:14px}
section{padding:70px 0}
h2{font-size:38px;font-weight:900;text-align:center;margin-bottom:12px}
.sub{text-align:center;color:#5b6475;font-size:18px;margin-bottom:40px}
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{border:2px solid #e8edf6;border-radius:22px;padding:24px}
.card h3{font-size:20px;font-weight:900;margin:8px 0}
.card .e{font-size:30px}
.shots{display:flex;gap:18px;overflow-x:auto;padding-bottom:10px}
.shots img{height:520px;border-radius:24px;box-shadow:0 10px 30px rgba(20,40,90,.15)}
.cta{background:#14C38E;color:#fff;text-align:center;border-radius:28px;padding:50px 24px}
.cta h2{color:#fff}
footer{border-top:1px solid #eef1f6;padding:30px 0;color:#6b7385;font-size:14px}
footer .links a{margin-right:18px;font-weight:700}
.doc{max-width:780px;margin:0 auto;padding:30px 24px 70px}
.doc h1{font-size:40px;font-weight:900;margin:10px 0}
.doc h2{font-size:22px;text-align:left;margin:28px 0 8px}
.doc p,.doc li{margin-bottom:10px;color:#333b4d}
.doc ul{padding-left:22px}
@media(max-width:820px){.hero .in{grid-template-columns:1fr}.hero h1{font-size:40px}.feat{grid-template-columns:1fr}.shots img{height:420px}}
