:root{
  --navy:#0b2545;
  --navy-700:#0f305e;
  --cream:#f7f9fc;
  --paper:#ffffff;
  --gold:#c9a227;
  --text:#0b1736;
  --muted:#5b6b7e;
  --shadow: 0 6px 24px rgba(11,23,54,.12), 0 2px 8px rgba(11,23,54,.08);
  --gutter: 1rem;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  color:var(--text);
  line-height:1.6;
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3{
  font-family:Merriweather, Georgia, 'Times New Roman', serif;
  line-height:1.25;
  margin:0 0 .6rem;
}
h1{font-size:clamp(2rem, 4vw + 1rem, 3rem); font-weight:900;}
h2{font-size:clamp(1.6rem, 2vw + .8rem, 2.2rem); font-weight:900;}
h3{font-size:1.15rem; font-weight:700;}
p{margin:.25rem 0 1rem;}
.section-intro{color:var(--muted);max-width:80ch}

.container{
  width:min(1100px, 92vw);
  margin-inline:auto;
  padding: 0 var(--gutter);
}
.section{padding: clamp(2.5rem, 4vw, 4rem) 0;}
.section-alt{background:var(--cream)}
.section-cta{
  background:linear-gradient(180deg, var(--cream), #fff);
  border-top:1px solid #e7ecf3;
}

.btn{
  display:inline-block;
  padding:.7rem 1rem;
  border-radius:.5rem;
  border:1px solid transparent;
  text-decoration:none;
  font-weight:700;
  transition:.2s ease;
}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-gold{background:var(--gold);color:#111; border-color:var(--gold)}
.btn-gold:hover{filter:brightness(.95)}
.btn-outline{background:#f8fafc; color:var(--navy); border-color:#cbd5e1}
.btn-sm{padding:.5rem .75rem; font-size:.9rem}

.skip-link{
  position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;
}
.skip-link:focus{position:fixed;left:1rem;top:1rem;width:auto;height:auto;padding:.5rem .75rem;background:#fff;z-index:1000}

.site-header{
  position:sticky; top:0; z-index:100;
  background: rgba(255,255,255,.9);
  backdrop-filter: blur(8px);
  border-bottom:1px solid #e7ecf3;
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:.75rem 1rem;
}
.brand{display:flex; align-items:center; gap:.6rem; text-decoration:none; color:var(--text)}
.brand-mark{display:grid; place-items:center}
.brand-text{font-weight:800; letter-spacing:.2px}
.brand-sub{display:none; color:var(--muted); font-size:.85rem}
@media (min-width:800px){ .brand-sub{display:inline-block} }

.nav-toggle{
  width:44px; height:44px; display:grid; place-items:center;
  background:transparent; border:1px solid #e1e6ef; border-radius:.5rem; cursor:pointer;
}
.nav-toggle-bar{width:22px; height:2px; background:var(--text); position:relative}
.nav-toggle-bar::before,.nav-toggle-bar::after{
  content:""; position:absolute; left:0; width:22px; height:2px; background:var(--text);
}
.nav-toggle-bar::before{top:-6px} .nav-toggle-bar::after{top:6px}
.nav-menu{
  list-style:none; padding:0; margin:0; display:none; gap:1rem; align-items:center;
}
.nav-menu a{color:var(--text); text-decoration:none; font-weight:600}
.nav-menu .btn{color:#111}
@media (min-width:960px){
  .nav-toggle{display:none}
  .nav-menu{display:flex}
}
.nav.open #nav-menu{
  display:flex; position:absolute; top:64px; right:var(--gutter);
  flex-direction:column; background:#fff; padding:1rem; border:1px solid #e7ecf3; border-radius:.75rem; box-shadow:var(--shadow); width:min(280px, 86vw)
}

.hero{
  background: radial-gradient(1200px 600px at 85% -10%, #143a66 0%, transparent 60%), linear-gradient(180deg, var(--navy), var(--navy-700));
  color:#fff;
  padding: clamp(2rem, 4vw, 4rem) 0 clamp(2.5rem, 6vw, 5rem);
  border-bottom:1px solid #0a2140;
}
.hero-inner{
  display:grid; gap:2rem; align-items:center;
  grid-template-columns: 1fr;
  padding: 0;
}
@media (min-width:960px){
  .hero-inner{grid-template-columns: 1.2fr .8fr}
}
.kicker{opacity:.9; font-weight:700; letter-spacing:.3px; margin-top:.4rem}
.lead{font-size:clamp(1rem, 1.2rem, 1.25rem); color:#e6edf6; max-width:64ch}
.hero-cta{display:flex; gap:.75rem; margin: 1rem 0 1.25rem; flex-wrap:wrap}
.hero-highlights{list-style:none; padding:0; margin:0; display:flex; gap:1rem; color:#d9e3f2; flex-wrap:wrap}
.hero-highlights li{display:flex; gap:.4rem}
.hero-media{display:grid; place-items:center}
.portrait{
  width:min(380px, 78vw);
  aspect-ratio: 3 / 4;
  border-radius:1rem;
  overflow:hidden;
  box-shadow: var(--shadow);
  border:2px solid #ffffff22;
  background:#0a1f3a;
}
.portrait img{width:100%; height:100%; object-fit:cover; display:block}

.grid{display:grid; gap:1rem; padding: 0}

.cards-3{grid-template-columns: 1fr; }
.cards-4{grid-template-columns: 1fr; }
@media (min-width:700px){ .cards-3{grid-template-columns: repeat(3, 1fr)} }
@media (min-width:900px){ .cards-4{grid-template-columns: repeat(4, 1fr)} }

.card{
  background:#fff; border:1px solid #e7ecf3; border-radius:.9rem; padding:1rem;
  box-shadow: var(--shadow);
}
.split{
  display:grid; gap:1.25rem; padding: 0;
  grid-template-columns: 1fr;
}
@media (min-width:980px){ .split{grid-template-columns: 1.2fr .8fr} }
.aside .quote{
  background:#fff; border:1px solid #e7ecf3; border-radius:.9rem; padding:1rem; box-shadow: var(--shadow);
}
.quote blockquote{margin:0; font-style:italic}
.quote-meta{margin-top:.5rem; color:var(--muted)}

.checklist{list-style:none; padding:0; margin:1rem 0; display:grid; gap:.5rem}
.checklist li{position:relative; padding-left:1.5rem}
.checklist li::before{
  content:"✓"; position:absolute; left:0; color:var(--gold); font-weight:900;
}

.socials{display:flex; gap:.75rem; flex-wrap:wrap; margin-top:1rem}
.socials a{color:var(--navy); text-decoration:none; font-weight:700; border-bottom:2px solid transparent}
.socials a:hover{border-color:var(--gold)}

.steps{counter-reset:step; list-style:none; padding:0; display:grid; gap:.75rem; max-width:65ch}
.steps li{position:relative; padding-left:2.2rem}
.steps li::before{
  counter-increment:step; content:counter(step);
  position:absolute; left:0; top:.1rem; width:1.6rem; height:1.6rem;
  border-radius:50%; background:var(--navy); color:#fff; display:grid; place-items:center; font-weight:700;
}
.note{color:var(--muted); margin-top:.75rem}

.faq details{
  background:#fff; border:1px solid #e7ecf3; border-radius:.75rem; padding:.75rem 1rem; box-shadow: var(--shadow);
}
.faq details+details{margin-top:.6rem}
.faq summary{cursor:pointer; font-weight:700}

.site-footer{
  border-top:1px solid #e7ecf3; background:#fff;
}
.footer-inner{
  display:flex; align-items:center; justify-content:space-between; padding:1rem; gap:1rem;
}
.footer-links{display:flex; gap:1rem; flex-wrap:wrap}
.footer-links a{text-decoration:none; color:var(--muted)}
.footer-links a:hover{color:var(--text)}

:focus-visible{outline:3px solid var(--gold); outline-offset:2px}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}

.callout{
  background:#fffaf0;
  border:1px solid #e7ecf3;
  border-left:4px solid var(--gold);
  border-radius:.5rem;
  padding: .75rem 1rem;
  box-shadow: var(--shadow);
  margin: 0 0 1rem;
}

section[id]{ scroll-margin-top: 80px; }