*{box-sizing:border-box}
body{margin:0;font-family:Inter,Arial,sans-serif;color:#172033;background:#f6f8fb;line-height:1.65}
a{text-decoration:none;color:#2563eb}
.nav{background:#0f172a;color:white;padding:22px 8%;display:flex;justify-content:space-between;align-items:center}
.logo{font-size:28px;font-weight:800}
.nav a{color:#dbeafe;margin-left:24px;font-weight:600}
.hero{padding:90px 8%;background:linear-gradient(135deg,#0f172a,#1d4ed8);color:white}
.hero h1{font-size:52px;max-width:850px;line-height:1.1;margin:0 0 24px}
.hero p{font-size:20px;max-width:760px;color:#dbeafe}
.btn{display:inline-block;background:#2563eb;color:white;padding:14px 24px;border-radius:10px;margin:16px 12px 0 0;font-weight:700}
.btn.light{background:white;color:#1e3a8a}
main{max-width:1120px;margin:auto;padding:56px 24px}
section{margin-bottom:60px}
h2{font-size:34px;color:#0f172a}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px}
.card{background:white;padding:28px;border-radius:16px;box-shadow:0 10px 28px rgba(15,23,42,.08)}
.card h3{margin-top:0;color:#0f172a}
.notice{border-left:5px solid #2563eb;background:#eef2ff}
.workflow{display:flex;flex-wrap:wrap;gap:12px}
.step{background:white;border-radius:999px;padding:12px 18px;box-shadow:0 4px 16px #0001}
footer{background:#0f172a;color:#cbd5e1;padding:42px 8%}
footer a{color:#93c5fd}
@media(max-width:720px){.hero h1{font-size:36px}.nav{display:block}.nav a{display:inline-block;margin:12px 14px 0 0}}
