:root {
  color-scheme: light;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #18332e;
  background: #f5f8f4;
}

* { box-sizing: border-box; }

body { margin: 0; line-height: 1.65; }

header, main, footer { max-width: 760px; margin: 0 auto; padding: 0 24px; }

header { padding-top: 44px; }

nav { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }

nav strong { font-size: 1.05rem; letter-spacing: .02em; margin-right: auto; }

main { padding-top: 40px; padding-bottom: 72px; }

h1, h2 { line-height: 1.18; letter-spacing: -.025em; }

h1 { font-size: clamp(2.2rem, 7vw, 3.6rem); margin: 0 0 18px; }

h2 { font-size: 1.35rem; margin: 38px 0 12px; }

p, li { font-size: 1.04rem; }

ul { padding-left: 23px; }

li + li { margin-top: 10px; }

a { color: #176f59; text-underline-offset: 3px; }

a:hover, a:focus-visible { color: #0b4d3b; }

.eyebrow { color: #387263; font-size: .84rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }

.lead { color: #415a52; font-size: 1.2rem; max-width: 620px; }

.notice { background: #e7f2eb; border: 1px solid #b9d7c4; border-radius: 16px; padding: 22px 24px; margin-top: 30px; }

.notice h2 { margin-top: 0; }

.notice p:last-child { margin-bottom: 0; }

.muted { color: #52655d; }

footer { border-top: 1px solid #d9e3db; color: #52655d; font-size: .9rem; padding-top: 24px; padding-bottom: 40px; }

@media (max-width: 560px) {
  header { padding-top: 24px; }
  nav strong { width: 100%; }
  main { padding-top: 28px; }
  .notice { padding: 18px; }
}