:root{
  --deep:#0b1b26;
  --panel:#102a38;
  --edge:#1d4257;
  --ink:#e8f1f5;
  --muted:#7fa3b5;
  --sun:#ff8a5b;
  --gold:#ffc46b;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  background:var(--deep);
  color:var(--ink);
  font-family:"Inter","Segoe UI",system-ui,sans-serif;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--sun);text-decoration:none}
a:hover{text-decoration:underline}

.topbar{
  border-bottom:1px solid var(--edge);
  background:var(--panel);
}
.topbar .row{
  max-width:940px;margin:0 auto;padding:14px 20px;
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
}
.logo{
  font-size:15px;font-weight:700;letter-spacing:.02em;
  color:var(--ink);text-decoration:none;
}
.logo:hover{text-decoration:none;color:var(--sun)}
.topbar nav{display:flex;gap:16px;font-size:14px;flex:1}
.topbar nav a{color:var(--muted)}
.topbar nav a:hover{color:var(--ink);text-decoration:none}
.lang{font-size:13px;color:var(--muted)}
.lang a{color:var(--muted)}

main{max-width:940px;margin:0 auto;padding:44px 20px 64px}

h1{font-size:32px;font-weight:700;line-height:1.25;margin-bottom:14px;letter-spacing:-.01em}
h2{font-size:21px;font-weight:600;margin:38px 0 12px}
p{margin-bottom:16px;color:#cfe0e8}
.lead{font-size:17px;color:var(--muted);margin-bottom:28px}
ul{margin:0 0 16px 20px;color:#cfe0e8}
li{margin-bottom:7px}

.cta{
  display:inline-block;margin:10px 0 8px;
  padding:11px 22px;border-radius:9px;
  background:var(--sun);color:#0b1b26;
  font-weight:600;font-size:15px;
}
.cta:hover{text-decoration:none;background:var(--gold)}

.note{
  border-left:2px solid var(--edge);
  padding:2px 0 2px 16px;margin:22px 0;
  color:var(--muted);font-size:14px;
}

.cards{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:14px;margin:24px 0;
}
.card{
  background:var(--panel);border:1px solid var(--edge);
  border-radius:11px;padding:18px;
}
.card h3{font-size:16px;font-weight:600;margin-bottom:6px}
.card p{font-size:14px;color:var(--muted);margin:0}

footer{
  border-top:1px solid var(--edge);
  margin-top:40px;padding:22px 20px;
  text-align:center;font-size:13px;color:var(--muted);
}

@media (max-width:600px){
  h1{font-size:25px}
  main{padding:30px 18px 48px}
}

.count{
  display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  background:var(--panel);border:1px solid var(--edge);
  border-radius:12px;padding:18px 20px;margin:26px 0 30px;
}
.count-num{
  font-size:40px;font-weight:700;line-height:1;color:var(--sun);
  font-variant-numeric:tabular-nums;
}
.count-lab{font-size:15px;color:var(--ink)}
.count-sub{font-size:13px;color:var(--muted);width:100%;margin-top:4px}

.why{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:12px;margin:28px 0 32px;
}
.why-item{
  background:var(--panel);border:1px solid var(--edge);border-radius:12px;
  padding:15px 16px;font-size:13px;line-height:1.55;color:var(--muted);
}
.why-item b{display:block;color:var(--ink);font-size:15px;margin-bottom:5px}
