:root{--navy:#0b2236;--navy2:#123552;--red:#ED1C24;--red-d:#c8141b;--ink:#17222d;--mut:#5d6b78;--line:#e2e7ec;--bg:#f5f7f9;--card:#fff;--ok:#1d7a46}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15.5px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
a{color:inherit}
.bar{background:#fff;border-bottom:1px solid var(--line)}
.bar-in{display:flex;align-items:center;gap:12px;height:64px}
.logo{height:38px}.co{display:flex;flex-direction:column;line-height:1.2;flex:1;min-width:0}.co b{font-size:16px}.co span{font-size:12px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ghost{border:1px solid #c9d2da;border-radius:8px;padding:8px 12px;font-size:13.5px;font-weight:600;text-decoration:none;white-space:nowrap}.ghost:hover{background:#f1f4f7}
.hero{background:linear-gradient(135deg,var(--navy) 0%,var(--navy2) 100%);color:#fff;border-bottom:4px solid var(--red)}
.hero-in{display:flex;gap:40px;align-items:center;padding-top:48px;padding-bottom:48px}
.hero-text{flex:1;min-width:0}
.eyebrow{display:inline-block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#ffd5d6;background:rgba(237,28,36,.18);border:1px solid rgba(237,28,36,.45);padding:3px 10px;border-radius:20px;margin-bottom:14px}
h1{font-size:40px;line-height:1.1;margin:0 0 12px;letter-spacing:-.01em}
.lead{font-size:17px;color:#d7e2ec;margin:0 0 26px;max-width:580px}
.primary{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.skeleton{height:56px;width:300px;border-radius:12px;background:rgba(255,255,255,.12)}
.btn{display:inline-flex;align-items:center;gap:12px;background:var(--red);color:#fff;text-decoration:none;border-radius:12px;padding:14px 22px;font-weight:700;font-size:17px;box-shadow:0 6px 18px rgba(237,28,36,.35);transition:background .15s,transform .15s}
.btn:hover{background:var(--red-d)}.btn:active{transform:translateY(1px)}
.btn small{display:block;font-weight:500;font-size:12.5px;opacity:.9}
.btn svg{width:26px;height:26px;flex:none}
.btn.alt{background:rgba(255,255,255,.1);box-shadow:none;border:1px solid rgba(255,255,255,.35)}.btn.alt:hover{background:rgba(255,255,255,.18)}
.meta{color:#aebfce;font-size:13.5px;margin:14px 0 0}
.qr-card{background:#fff;color:var(--ink);border-radius:16px;padding:18px;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.qr-card div{display:flex;flex-direction:column;font-size:13px;color:var(--mut)}.qr-card b{color:var(--ink);font-size:14px}
.steps{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px 26px;margin:-28px 0 30px;position:relative;box-shadow:0 8px 24px rgba(11,34,54,.08)}
.steps h2{margin:0 0 14px;font-size:19px}
.steps ol{margin:0;padding:0;list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.steps li{counter-increment:s;position:relative;padding:12px 14px 12px 50px;background:var(--bg);border-radius:12px;font-size:14.5px}
.steps li::before{content:counter(s);position:absolute;left:14px;top:12px;width:26px;height:26px;border-radius:50%;background:var(--navy);color:#fff;font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center}
.steps .tip{margin:14px 0 0;font-size:13.5px;color:var(--mut)}
.sec{font-size:20px;margin:6px 0 14px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin-bottom:34px}
.dev{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:6px}
.dev.me{border-color:var(--red);box-shadow:0 0 0 2px rgba(237,28,36,.15)}
.dev .hd{display:flex;align-items:center;gap:10px}.dev .hd svg{width:24px;height:24px;color:var(--navy)}
.dev h3{margin:0;font-size:16.5px}.dev .tag{margin-left:auto;font-size:10.5px;font-weight:700;letter-spacing:.06em;color:var(--red)}
.dev .v{font-size:12.5px;color:var(--mut)}.dev p{margin:2px 0 6px;font-size:13.5px;color:var(--mut)}
.dev a.dl{margin-top:auto;display:block;text-align:center;text-decoration:none;font-weight:700;font-size:14px;padding:10px;border-radius:9px;background:var(--navy);color:#fff}.dev a.dl:hover{background:var(--navy2)}
.dev a.dl+a.dl{margin-top:6px}
.dev .how{font-size:13px;margin-top:auto;color:var(--ink);background:var(--bg);border-radius:9px;padding:9px 10px}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-bottom:40px}
.facts div{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px}
.facts h3{margin:0 0 6px;font-size:15.5px}.facts p{margin:0;font-size:14px;color:var(--mut)}
.foot{border-top:1px solid var(--line);background:#fff;color:var(--mut);font-size:12.5px;padding:18px 0}
@media (max-width:760px){.hero-in{flex-direction:column;align-items:stretch;gap:24px;padding-top:32px;padding-bottom:44px}h1{font-size:31px}.lead{font-size:16px}.qr-card{display:none}.btn{width:100%;justify-content:center}.steps{padding:18px}.ghost{display:none}}
