:root { --ink:#172033; --muted:#526078; --brand:#2457d6; --brand2:#00a3a3; --paper:#fff; --wash:#f4f7fc; --line:#d7deea; --good:#137333; --warn:#9a5b00; font-size:18px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--wash); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:1rem; line-height:1.58; }
a { color:#164dbf; }
button,input,textarea,select { font:inherit; }
button,.button { min-height:48px; min-width:48px; border:0; border-radius:12px; padding:.72rem 1.15rem; font-weight:700; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; gap:.45rem; }
.primary { color:#fff; background:var(--brand); box-shadow:0 7px 22px #2457d62b; }
.secondary { color:var(--brand); background:#e8efff; }
.ghost { color:var(--ink); background:transparent; border:2px solid var(--line); }
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible { outline:4px solid #ffbf47; outline-offset:2px; }
header { background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10; }
.nav { max-width:1180px; margin:auto; padding:.65rem 1rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand { display:flex; align-items:center; gap:.65rem; color:var(--ink); text-decoration:none; font-size:1.15rem; font-weight:800; }
.brand img { width:48px; height:48px; border-radius:12px; }
.nav-links { display:flex; align-items:center; flex-wrap:wrap; gap:.55rem 1rem; }
.nav-links a { color:var(--ink); }
main { max-width:1180px; margin:auto; padding:1rem; }
.hero { margin:1.3rem 0 2rem; padding:clamp(1.3rem,5vw,4rem); border-radius:28px; color:#fff; background:linear-gradient(135deg,#112c72,#2457d6 55%,#008d94); display:grid; grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr); gap:2rem; align-items:center; }
.hero-logo { width:min(100%,320px); margin:auto; border-radius:28%; filter:drop-shadow(0 18px 25px #07193b66); }
h1 { font-size:clamp(2rem,5vw,3.3rem); line-height:1.08; margin:.3rem 0 1rem; }
h2 { font-size:clamp(1.55rem,3vw,2.05rem); line-height:1.25; }
h3 { font-size:1.25rem; }
.eyebrow { font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.lead { font-size:1.15rem; }
.muted { color:var(--muted); }
.hero .muted { color:#e8efff; }
.actions,.platforms { display:flex; flex-wrap:wrap; gap:.75rem; margin:1.2rem 0; }
.platform { flex:1 1 220px; }
.card,.panel { background:var(--paper); border:1px solid var(--line); border-radius:20px; padding:1.35rem; box-shadow:0 10px 28px #263b6410; }
.grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin:1rem 0 2rem; }
.steps { counter-reset:step; }
.steps .card::before { counter-increment:step; content:counter(step); display:grid; place-items:center; width:44px; height:44px; border-radius:50%; color:#fff; background:var(--brand); font-weight:800; }
.download-box { margin:1.5rem 0; }
.field { position:relative; margin:.75rem 0 1rem; }
label { display:block; font-weight:750; margin-bottom:.35rem; }
input,textarea,select { width:100%; min-height:52px; border:2px solid #b7c2d5; border-radius:12px; background:#fff; color:var(--ink); padding:.72rem 3.1rem .72rem .8rem; }
textarea { min-height:120px; resize:vertical; overflow:hidden; }
.clear-field { position:absolute; right:.32rem; top:2.42rem; min-width:44px; min-height:44px; padding:0; border-radius:10px; background:#edf1f7; color:#28354b; display:none; }
.field.has-text .clear-field { display:inline-grid; }
.notice { border-left:6px solid var(--brand); background:#edf3ff; border-radius:8px; padding:.9rem 1rem; }
.notice.error { border-color:#b3261e; background:#fff0ef; }
.notice.success { border-color:var(--good); background:#effbf2; }
.metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; }
.metric { padding:1rem; border-radius:16px; background:#f7f9fd; border:1px solid var(--line); }
.metric strong { display:block; font-size:1.55rem; }
.qr { width:240px; max-width:100%; background:white; padding:10px; border:1px solid var(--line); border-radius:12px; }
table { width:100%; border-collapse:collapse; }
th,td { text-align:left; padding:.75rem; border-bottom:1px solid var(--line); vertical-align:top; }
footer { margin-top:3rem; background:#172033; color:#fff; }
footer .wrap { max-width:1180px; margin:auto; padding:1.6rem 1rem; }
footer a { color:#dce7ff; }
.visually-hidden { position:absolute!important; width:1px!important; height:1px!important; overflow:hidden!important; clip:rect(1px,1px,1px,1px)!important; }
@media (max-width:800px) { .hero { grid-template-columns:1fr; } .hero-logo { max-width:210px; } .grid,.metrics { grid-template-columns:1fr; } .nav-links a:not(.button) { display:none; } }
@media (min-width:801px) and (max-width:1050px) { .grid { grid-template-columns:repeat(2,1fr); } .metrics { grid-template-columns:repeat(2,1fr); } }