:root {
  color-scheme: light;
  --ink: #163b2e;
  --forest: #0e6244;
  --orange: #ef6f24;
  --cream: #fffaf0;
  --mint: #dff3e8;
  --line: #c8ded2;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  color: var(--ink);
  background: linear-gradient(145deg, #f7fff9 0%, var(--cream) 58%, #fff2e7 100%);
  font: 17px/1.65 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a { color: var(--forest); text-underline-offset: 3px; }
a:hover { color: var(--orange); }

.site-header,
footer {
  width: min(1120px, calc(100% - 40px));
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.site-header { padding: 24px 0; }
.site-header nav { display: flex; gap: 22px; }
.site-header nav a { text-decoration: none; font-weight: 700; }

.wordmark {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--ink);
  font-size: 1.15rem;
  font-weight: 850;
  letter-spacing: -.02em;
  text-decoration: none;
}

.wordmark span {
  display: grid;
  width: 37px;
  height: 37px;
  place-items: center;
  border-radius: 13px 13px 18px 18px;
  color: white;
  background: var(--orange);
  transform: rotate(-8deg);
}

.hero {
  width: min(1120px, calc(100% - 40px));
  min-height: calc(100vh - 190px);
  margin: 0 auto;
  padding: 9vh 0;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(290px, .8fr);
  align-items: center;
  gap: clamp(40px, 8vw, 110px);
}

h1, h2 { line-height: 1.1; letter-spacing: -.035em; }
h1 { max-width: 760px; margin: 0 0 22px; font-size: clamp(3rem, 8vw, 6.8rem); }
h2 { margin-top: 2.25em; font-size: 1.55rem; }

.eyebrow { margin-bottom: 10px; color: var(--orange); font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.lede { max-width: 720px; font-size: clamp(1.2rem, 2.3vw, 1.55rem); line-height: 1.5; }
.beta { max-width: 670px; padding: 14px 18px; border-left: 4px solid var(--orange); background: rgb(255 255 255 / 62%); }

.summary-card {
  padding: 28px;
  overflow: hidden;
  border: 2px solid var(--forest);
  border-radius: 30px;
  background: rgb(255 255 255 / 86%);
  box-shadow: 0 30px 80px rgb(14 98 68 / 14%);
}

.route-line { height: 150px; margin: -28px -28px 22px; background: radial-gradient(circle at 25% 30%, #fff 0 3px, transparent 4px), linear-gradient(145deg, var(--mint), #b6ded0); }
.summary-card p { margin: 0; font-weight: 750; }
.summary-card strong { display: block; margin: 8px 0 20px; font-size: 3.5rem; line-height: 1; }
.summary-card small { font-size: .8rem; font-weight: 750; text-transform: uppercase; }
.metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding-top: 18px; border-top: 1px solid var(--line); font-weight: 800; }

.policy {
  width: min(780px, calc(100% - 40px));
  margin: 0 auto;
  padding: 70px 0 90px;
}

.policy h1 { font-size: clamp(3rem, 9vw, 5.5rem); }
.policy p, .policy li { color: #294a3e; }
.policy strong { color: var(--ink); }

footer { padding: 26px 0 40px; border-top: 1px solid var(--line); }

@media (max-width: 720px) {
  .hero { grid-template-columns: 1fr; padding-top: 7vh; }
  .site-header { align-items: flex-start; }
  .site-header nav { gap: 13px; font-size: .92rem; }
  .policy { padding-top: 45px; }
}