:root{
  --navy:#002F6C;--gold:#EAB308;--off:#F7F6F2;--charcoal:#111827;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  color:var(--charcoal);background:var(--off)}
nav{background:var(--navy);color:white;padding:12px 20px;display:flex;gap:16px;align-items:center}
nav a{color:white;text-decoration:none;margin-right:14px}
nav .brand{font-weight:700;letter-spacing:.3px}
.container{max-width:980px;margin:24px auto;padding:0 16px}
.hero{background:linear-gradient(120deg,var(--navy),#0b396f);color:white;padding:64px 16px}
.hero h1{margin:0 0 10px}
.cardgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.card{background:white;border-radius:12px;padding:16px;box-shadow:0 2px 10px rgba(0,0,0,.06)}
footer{margin-top:40px;background:#0f172a;color:#cbd5e1;padding:24px 16px}
.btn{display:inline-block;background:var(--gold);color:#111827;padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:600}
label{display:block;margin:.5rem 0 .25rem}
input,textarea{width:100%;padding:.6rem;border:1px solid #cbd5e1;border-radius:8px;background:white}
button{background:var(--gold);border:0;padding:.6rem 1rem;border-radius:10px;font-weight:700;cursor:pointer}
small.muted{color:#6b7280}