/* Base responsive, SEO-friendly, accessible */
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;color:#0f172a;background:#fff;line-height:1.65}
a{color:#0b57d0;text-decoration:none}a:hover{text-decoration:underline}
.container{max-width:1200px;margin:0 auto;padding:16px}
header{position:sticky;top:0;z-index:50;background:#0b57d0;color:#fff;border-bottom:1px solid #0849ad}
.header-wrap{display:flex;align-items:center;justify-content:space-between;padding:12px 16px}
nav ul{display:flex;gap:14px;margin:0;padding:0;list-style:none}
.logo{font-weight:800;letter-spacing:.4px}
.hero{background:linear-gradient(180deg,#e8f0fe,#fff);padding:56px 16px;text-align:center}
.hero h1{margin:0 0 8px}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.card{border:1px solid #e5e7eb;border-radius:12px;padding:16px;background:#fff;box-shadow:0 12px 30px rgba(2,6,23,.06)}
.card h3{margin:0 0 8px}
img{max-width:100%;border-radius:10px;height:auto}
footer{background:#0b1220;color:#c7d2fe;padding:22px;margin-top:32px}
small{color:#94a3b8}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.grid{grid-template-columns:1fr}}