@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");
:root{--navy:#00205b;--blue:#005587;--cyan:#0085ad;--steel:#6399ae;--mist:#b7c9d3;--white:#fff}
*{box-sizing:border-box}
body{margin:0;background:#001842;color:var(--white);font-family:Inter,Arial,Helvetica,sans-serif}
h1,h2{font-family:Inter,Arial,Helvetica,sans-serif;letter-spacing:2px;text-transform:uppercase}
.landing-hero{display:flex;align-items:center;gap:24px;padding:44px 28px;background:linear-gradient(90deg,var(--mist),var(--cyan));color:var(--navy);border-bottom:3px solid var(--blue)}
.landing-hero h1{margin:0;font-size:46px}.landing-hero p{margin:8px 0 0;font-size:18px}
.landing-actions{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}
.button-link{display:inline-block;padding:11px 14px;background:var(--blue);color:var(--white);border:1px solid var(--mist);text-decoration:none;font-weight:700;text-transform:uppercase}
.button-link.ghost{background:transparent;color:var(--navy);border-color:var(--navy)}
.landing-main{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;padding:22px}
.landing-main section{border:1px solid var(--steel);background:rgba(0,85,135,.72);padding:16px}
.landing-main h2{margin-top:0}
@media (max-width:520px){
  .landing-hero{display:block;padding:26px 18px}
  .landing-hero h1{font-size:34px}
  .landing-actions{margin-top:18px}
}