:root {
  color-scheme: light;
  font-family: Inter, system-ui, "Malgun Gothic", sans-serif;
  color: #1c2723;
  background: #f7f9f6;
  line-height: 1.7;
}
* { box-sizing: border-box; }
body { margin: 0; word-break: keep-all; overflow-wrap: anywhere; }
a { color: #205344; text-underline-offset: .2em; }
a:focus-visible { outline: 3px solid #205344; outline-offset: 4px; }
.top, .bottom, .page {
  width: min(calc(100% - 2.5rem), 46rem);
  margin-inline: auto;
}
.top { padding-block: .75rem; border-bottom: 1px solid #d8e0da; }
.top a { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; }
.top a, .brand { font-weight: 700; }
.top span, .brand span, .eyebrow { color: #496058; font-size: .875rem; }
.page { padding-block: clamp(1.75rem, 5vw, 3.5rem); }
h1, h2 { line-height: 1.35; }
h1 { font-size: clamp(1.75rem, 5vw, 2.55rem); margin: .2rem 0 1rem; }
h2 { font-size: 1.25rem; margin-block: 0 .5rem; }
p { margin: .625rem 0; }
.intro { max-width: 39rem; color: #394c44; }
section { margin-top: 1.65rem; padding-top: 1.45rem; border-top: 1px solid #d8e0da; }
li + li { margin-top: .45rem; }
ul { padding-inline-start: 1.25rem; }
.routes { display: flex; flex-wrap: wrap; gap: .75rem; margin-block: 1.5rem; }
.routes a, .button {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: .45rem .8rem;
  border: 1px solid #aebfb6;
  border-radius: .4rem;
  font-weight: 650;
}
.action { margin-block: 1rem; }
.button { color: #fff; background: #205344; border-color: #205344; }
.note { border-inline-start: 3px solid #879d92; padding-inline-start: .75rem; }
.bottom { border-top: 1px solid #d8e0da; padding-block: .75rem 1.5rem; }
.bottom a { display: inline-flex; align-items: center; min-height: 44px; }
