:root{
  --navy:#023361;
  --navy-dark:#042F5A;
  --text-dark:#39454C;
  --text-light:#5C676D;
  --bg-light:#F7F8FA;
  --border-light:#E2E6EA;
  --radius:10px;
  --shadow:0 14px 40px rgba(2,51,97,0.10);
}

*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text-dark);
  background:#fff;
  line-height:1.7;
}

.container{max-width:1200px;margin:0 auto;padding:0 24px}
.container.narrow{max-width:820px}

.header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,0.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border-light);
}
.header-inner{
  height:80px; display:flex; align-items:center; justify-content:space-between; gap:18px;
}
.logo{height:44px; width:auto; display:block}
.nav{display:flex; align-items:center; gap:22px; flex-wrap:wrap; justify-content:flex-end}
.nav a{
  text-decoration:none; color:var(--text-dark);
  font-weight:500; font-size:0.98rem;
}
.nav a:hover{color:var(--navy)}
.nav-secondary{opacity:.85}

.hero--image{
  position:relative;
  min-height:78vh;
  display:grid;
  align-items:center;
  padding:120px 0;
  background-image:url("images/hero.jpg");
  background-size:cover;
  background-position:center;
}
.hero-overlay{
  position:absolute; inset:0;
  background:linear-gradient(
    90deg,
    rgba(2,51,97,0.80) 0%,
    rgba(2,51,97,0.62) 35%,
    rgba(2,51,97,0.36) 60%,
    rgba(2,51,97,0.16) 100%
  );
}
.hero-inner{position:relative; z-index:1; max-width:780px}
.hero h1{
  font-size:3.15rem;
  color:#fff;
  margin-bottom:14px;
  letter-spacing:-0.02em;
  line-height:1.08;
}
.hero p{
  font-size:1.15rem;
  color:rgba(255,255,255,0.88);
  margin-bottom:28px;
  max-width:60ch;
}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap; align-items:center}
.btn-primary{
  display:inline-block;
  background:var(--navy);
  color:#fff;
  padding:14px 28px;
  border-radius:var(--radius);
  text-decoration:none;
  font-weight:600;
  box-shadow:0 12px 22px rgba(0,0,0,0.14);
}
.btn-primary:hover{background:var(--navy-dark)}
.btn-secondary{
  display:inline-block;
  border:1px solid rgba(255,255,255,0.55);
  color:#fff;
  padding:14px 24px;
  border-radius:var(--radius);
  text-decoration:none;
  font-weight:600;
  background:rgba(255,255,255,0.06);
}
.btn-secondary:hover{background:rgba(255,255,255,0.12); border-color:rgba(255,255,255,0.75)}
.trust-line{
  margin-top:22px;
  font-size:0.98rem;
  color:rgba(255,255,255,0.82);
}

.section{padding:96px 0}
.section.light{background:var(--bg-light)}
.section h2{font-size:2.25rem;color:var(--navy);margin-bottom:44px;letter-spacing:-0.01em}
.section h1{font-size:2.6rem;color:var(--navy);margin-bottom:18px;letter-spacing:-0.01em}
.section p{margin:14px 0}

.cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:28px;
}
.card{
  background:#fff;
  border:1px solid var(--border-light);
  border-radius:var(--radius);
  padding:30px;
  transition:transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}
.card h3{color:var(--navy);margin-bottom:10px}
.card:hover{transform:translateY(-4px); box-shadow:var(--shadow); border-color:rgba(2,51,97,0.18)}

.subtle-link{margin-top:34px;color:var(--text-light)}
.subtle-link a{color:var(--navy);text-decoration:none;font-weight:600}
.subtle-link a:hover{text-decoration:underline}

.contact-box{
  background:#fff;
  border:1px solid var(--border-light);
  border-radius:var(--radius);
  padding:30px;
}
.contact-row{
  display:flex; justify-content:space-between; gap:18px;
  padding:14px 0;
  border-bottom:1px solid var(--border-light);
}
.contact-row:last-child{border-bottom:none}
.contact-label{color:var(--text-light); font-weight:600}
.contact-box a{color:var(--navy); text-decoration:none; font-weight:600}
.contact-box a:hover{text-decoration:underline}

.bullets{margin:14px 0 10px 18px}
.bullets li{margin:8px 0}

.trust-line-dark{
  margin:16px 0 32px;
  font-size:0.98rem;
  color:var(--text-light);
}

.note{
  margin-top:16px;
  padding:14px 16px;
  background:var(--bg-light);
  border:1px solid var(--border-light);
  border-radius:var(--radius);
  color:var(--text-light);
}

.cta-box{
  margin-top:34px;
  padding:26px;
  border:1px solid var(--border-light);
  border-radius:var(--radius);
  background:#fff;
}
.cta-box h3{color:var(--navy); margin-bottom:8px}

.footer{
  border-top:1px solid var(--border-light);
  padding:34px 0;
  color:var(--text-light);
  font-size:0.95rem;
}
.footer-inner{display:flex; justify-content:center}

.reveal{
  opacity:0;
  transform:translateY(14px);
  transition:opacity 650ms ease, transform 650ms ease;
  will-change:opacity, transform;
}
.reveal.is-visible{opacity:1; transform:translateY(0)}

@media (max-width: 900px){
  .hero h1{font-size:2.4rem}
  .hero--image{min-height:72vh; padding:100px 0}
  .nav{gap:14px}
  .nav-secondary{display:none}
}
