:root {
  --navy:#082e5d;
  --teal:#0099aa;
  --orange:#ff8900;
  --ink:#243c50;
  --cream:#faf8f3;
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:110px;
}

body {
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.65;
}

a {
  color:inherit;
}

a:focus-visible {
  outline:3px solid var(--orange);
  outline-offset:5px;
}

.wrap {
  width:min(1120px,90%);
  margin:auto;
}

header {
  background:#fff;
  border-bottom:1px solid #dae4e6;
}

.nav {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:20px 0;
}

.brand {
  text-decoration:none;
  font-weight:800;
  font-size:25px;
  letter-spacing:-1px;
  color:var(--navy);
}

.brand span {
  color:#b85b00;
}

nav {
  display:flex;
  gap:26px;
  flex-wrap:wrap;
}

nav a {
  text-decoration:none;
  font-size:15px;
  font-weight:700;
}

nav a:hover {
  color:#007986;
}

.hero {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,330px);
  align-items:center;
  gap:40px;
  padding:30px 0 35px;
}

.eyebrow {
  text-transform:uppercase;
  font-size:12px;
  font-weight:800;
  letter-spacing:2px;
  color:#007b87;
}

h1,h2,h3 {
  color:var(--navy);
  line-height:1.1;
}

h1 {
  font-size:clamp(32px,4vw,46px);
  letter-spacing:-1.5px;
  margin:12px 0 16px;
}

h1 span {
  color:#007f8c;
}

p {
  max-width:600px;
}

.intro {
  font-size:17px;
  margin:12px 0;
}

.button {
  display:inline-block;
  background:var(--navy);
  color:white;
  padding:14px 24px;
  border-radius:6px;
  text-decoration:none;
  font-weight:700;
  margin-top:18px;
}

.button:hover {
  background:#005f70;
}

.text-link {
  display:inline-block;
  margin-left:20px;
  font-weight:700;
  text-underline-offset:5px;
}

.logo-panel {
  background:#fff;
  border-radius:12px;
  border-bottom:6px solid var(--orange);
}

.logo-panel img {
  display:block;
  width:100%;
  height:auto;
}

.ribbon {
  background:var(--navy);
  color:white;
}

.ribbon .wrap {
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:21px 0;
  font-size:14px;
}

.ribbon span::before {
  content:'+';
  color:#ffad2f;
  font-weight:bold;
  margin-right:12px;
}

section {
  padding:75px 0;
}

h2 {
  font-size:clamp(30px,4vw,43px);
  letter-spacing:-1px;
  margin:12px 0 22px;
}

.section-top {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:35px;
  margin-bottom:30px;
}

.section-top p {
  max-width:370px;
}

.cards {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}

.card {
  background:#fff;
  border:1px solid #dce4e4;
  border-radius:8px;
  padding:30px;
}

.number {
  font-size:14px;
  font-weight:bold;
  color:#007f8c;
}

.card h3 {
  font-size:23px;
  margin:20px 0 12px;
}

.card p {
  font-size:16px;
  margin-bottom:0;
}

.about {
  background:#eaf3f2;
}

.split {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:start;
}

.note {
  border-left:4px solid var(--orange);
  padding-left:24px;
}

.locations {
  border-bottom:1px solid #dce4e4;
}

.contact {
  background:var(--navy);
  color:#e0eaf2;
}

.contact h2,.contact .eyebrow {
  color:white;
}

.contact p {
  font-size:18px;
}

.pending {
  padding:20px 24px;
  background:#ffffff0d;
  border:1px solid #ffffff30;
  border-radius:6px;
}

.pending strong {
  color:#ffc06e;
}

footer {
  background:#052347;
  color:#d7e3ed;
  padding:24px 0;
  font-size:13px;
}

footer .wrap {
  display:flex;
  justify-content:space-between;
  gap:20px;
}

footer a {
  text-underline-offset:4px;
}

@media(max-width:760px) {
  .nav {
    align-items:flex-start;
    flex-direction:column;
    gap:12px;
  }
  nav {
    gap:12px 22px;
  }
  .hero {
    grid-template-columns:1fr;
    padding:24px 0;
    gap:20px;
  }
  .logo-panel {
    width:min(220px,100%);
    margin:auto;
  }
  h1 {
    letter-spacing:-1.5px;
  }
  .ribbon .wrap {
    flex-wrap:wrap;
    gap:8px 24px;
  }
  .cards,.split {
    grid-template-columns:1fr;
    gap:20px;
  }
  .section-top {
    display:block;
  }
  .section-top p {
    max-width:none;
  }
  section {
    padding:48px 0;
  }
  .card {
    padding:25px;
  }
  .text-link {
    margin-left:15px;
  }
  footer .wrap {
    flex-direction:column;
    gap:8px;
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
}

.location-link {
  margin-left:0;
}

