
:root{--navy:#071b45;--blue:#155eef;--ink:#12264b;--bg:#f2f6ff}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.75 Inter,Segoe UI,Arial,sans-serif}
.top{background:linear-gradient(115deg,#06163b,#102f70 55%,#2367b8);color:white}.wrap{max-width:1120px;margin:auto;padding:24px}
.brand{font-weight:800;display:flex;align-items:center;gap:10px}.brand-mark{width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,#56d7e6,#2367e8);display:grid;place-items:center;font-size:20px}
.hero{display:grid;grid-template-columns:1.3fr .7fr;gap:32px;align-items:center;padding:42px 0 48px}.eyebrow{text-transform:uppercase;letter-spacing:1.5px;font-size:12px;color:#b9d6ff;font-weight:700}
h1{font-size:clamp(28px,4vw,44px);line-height:1.13;margin:12px 0}.lead{color:#e3edff}.hero-art{min-height:190px;border-radius:28px;background:linear-gradient(140deg,#477bf1,#28b9d1);display:grid;place-items:center;box-shadow:0 18px 40px #001b4d55}
.shield{width:120px;height:140px;background:linear-gradient(145deg,#fff,#dceaff);clip-path:polygon(50% 0,93% 17%,88% 68%,50% 100%,12% 68%,7% 17%);display:grid;place-items:center;color:#155eef;font-size:55px}
.buttons{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.btn{display:inline-flex;text-decoration:none;color:#071b45;font-weight:800;background:linear-gradient(#fff,#dce8ff);border:1px solid white;border-bottom:4px solid #9bb7ee;padding:12px 18px;border-radius:13px;box-shadow:0 7px 0 #071b4540,0 12px 20px #001b4d33}.btn.primary{background:linear-gradient(#ffe58b,#ffb52e);border-bottom-color:#d88a0c}
main{max-width:900px;margin:32px auto;padding:0 20px}.article,.index-card{background:white;border:1px solid #e0e8f7;border-radius:22px;padding:38px 42px;box-shadow:0 14px 45px #173d7510}
.tip{background:#eef4ff;border-left:4px solid #2868ed;padding:15px 18px;border-radius:10px;margin-bottom:24px}
h2{font-size:23px;line-height:1.3;margin:30px 0 10px;color:#0b2b66}h3{font-size:18px;margin:22px 0 6px}p{margin:0 0 15px}
.index{max-width:1120px;margin:30px auto;padding:0 24px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 22px}.grid a{padding:10px 12px;text-decoration:none;border:1px solid #e7edf8;border-radius:10px;color:#17396f}.grid a:hover{background:#f1f6ff}
footer{text-align:center;color:#687895;padding:28px 16px;font-size:13px}
@media(max-width:720px){.hero{grid-template-columns:1fr}.hero-art{min-height:140px}.article,.index-card{padding:25px 22px}.grid{grid-template-columns:1fr}}
