@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&family=Stack+Sans+Headline:wght@600;700;800&display=swap');
:root{--blue:#12377a;--red:#ef4b2e}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Arial,sans-serif;color:#111}
h1,h2,h3{font-family:'Stack Sans Headline',Inter,sans-serif}
.header{background:var(--blue);color:white}
.top{background:#050505;padding:8px 5%;font-size:13px}
.brand{padding:20px 5%;text-align:center}
.logo{font-size:36px;font-weight:800}
.logo span{background:var(--red);font-size:14px;padding:3px 5px;border-radius:5px}
nav{padding:12px 5%;border-top:1px solid #ffffff33}
.container{width:min(1200px,92%);margin:30px auto}
.hero{height:420px;border-radius:14px;background:#ddd;padding:40px;display:flex;flex-direction:column;justify-content:end}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}
article{border:1px solid #ddd;border-radius:12px;padding:15px}
article img{width:100%;height:200px;object-fit:cover}
footer{background:#10285c;color:#fff;padding:40px}
@media(max-width:768px){.grid{grid-template-columns:repeat(2,1fr)}.logo{font-size:26px}}