:root {
  --teal: #075d61;
  --teal-dark: #073f45;
  --amber: #e6a03e;
  --blue-aura: #8c98d6;
  --mint: #b8d8d1;
  --ivory: #f8f7f1;
  --ink: #17373c;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  background: var(--ivory);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.landing {
  width: min(100%, 1120px);
  min-height: 100vh;
  margin: 0 auto;
  padding: 48px clamp(28px, 7vw, 96px) 28px;
  display: flex;
  flex-direction: column;
}

.brand-header { display: flex; justify-content: center; padding: 8px 0 38px; }
.logo { width: min(100%, 620px); height: auto; display: block; }

.intro {
  position: relative;
  max-width: 760px;
  padding: 74px 0 68px;
}
.intro::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 5px;
  background: linear-gradient(90deg, var(--teal) 0 84%, var(--amber) 84% 100%);
}
.eyebrow {
  margin: 0 0 22px;
  color: var(--teal);
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
}
h1 {
  margin: 0 0 30px;
  color: var(--teal-dark);
  font-size: clamp(2.6rem, 6vw, 5.4rem);
  line-height: .98;
  letter-spacing: -.055em;
  font-weight: 650;
}
h1 span { color: var(--amber); }
.lead {
  max-width: 650px;
  margin: 0 0 20px;
  font-size: clamp(1.12rem, 2vw, 1.42rem);
  line-height: 1.5;
  color: var(--teal-dark);
}
.body-copy { max-width: 650px; margin: 0; line-height: 1.75; color: #4b676b; }

.contact {
  margin-top: auto;
  padding: 28px 0 24px;
  border-top: 1px solid rgba(7, 93, 97, .22);
}
.contact h2 { margin: 0 0 17px; font-size: 1.25rem; color: var(--teal-dark); }
.contact-grid { display: flex; flex-wrap: wrap; gap: 10px 34px; font-size: .96rem; }
.contact a { color: var(--teal); text-decoration: none; font-weight: 650; }
.contact a:hover { color: var(--amber); }
.contact span { color: #688083; }
footer { padding-top: 17px; color: #799093; font-size: .75rem; letter-spacing: .04em; }

@media (max-width: 620px) {
  .landing { padding-top: 28px; }
  .brand-header { padding-bottom: 25px; }
  .intro { padding: 52px 0 50px; }
  .contact-grid { flex-direction: column; gap: 9px; }
}