:root {
  color-scheme: light;
  font-family: system-ui, sans-serif;
  color: #143e49;
  background: #d0e9e3;
  line-height: 1.65;
}
body { margin: 0; }
main { width: min(46rem, calc(100% - 2rem)); margin: clamp(1rem, 6vw, 4rem) auto; }
section, article {
  box-sizing: border-box;
  margin-block: 1rem;
  padding: clamp(1.25rem, 5vw, 2.75rem);
  background: #f8f5e9;
  border: 1px solid #eef8f4;
  border-radius: 1.75rem;
  box-shadow: 0 .5rem 1.5rem #143e491a;
}
.icon { display: block; border-radius: 1.25rem; }
h1 { width: fit-content; margin: .7rem 0 0; font-size: clamp(2.4rem, 9vw, 4rem); line-height: 1.1; }
h2 { margin-block: 0 .5rem; line-height: 1.35; }
.lead { font-size: clamp(1.3rem, 4vw, 1.8rem); font-weight: 700; }
a { color: #164d60; text-underline-offset: .2em; }
nav { display: flex; flex-wrap: wrap; align-items: center; gap: .9rem 1.25rem; margin-block-start: 1.5rem; }
.primary { background: #235768; color: #fff; border-radius: .8rem; padding: .65rem 1rem; }
a:focus-visible { outline: 3px solid #235768; outline-offset: 4px; }