:root { color-scheme: light; --ink:#15312b; --muted:#60736e; --green:#0f6b5b; --soft:#edf6f2; --paper:#fbf9f3; --line:#dce7e2; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.7 system-ui,-apple-system,"Segoe UI",sans-serif; }
header,main,footer { width:min(840px,calc(100% - 36px)); margin-inline:auto; }
header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:28px 0; }
.brand { color:var(--green); font-size:19px; font-weight:800; text-decoration:none; }
nav { display:flex; flex-wrap:wrap; gap:14px; }
nav a,footer a { color:var(--green); }
.hero,.card { background:#fff; border:1px solid var(--line); border-radius:24px; box-shadow:0 16px 44px rgba(15,107,91,.07); }
.hero { padding:clamp(30px,7vw,72px); text-align:center; }
.card { margin:18px 0; padding:clamp(22px,5vw,42px); }
h1 { font-size:clamp(32px,7vw,56px); line-height:1.1; margin:0 0 18px; }
h2 { font-size:24px; line-height:1.3; margin:34px 0 8px; }
h2:first-child { margin-top:0; }
p,li { color:var(--muted); }
.lead { font-size:19px; }
.button { display:inline-block; margin-top:14px; padding:13px 20px; border-radius:999px; background:var(--green); color:white; font-weight:750; text-decoration:none; }
.note { padding:15px 18px; border-radius:16px; background:var(--soft); color:var(--ink); }
footer { padding:32px 0 48px; color:var(--muted); font-size:14px; }
@media (max-width:640px) { header { align-items:flex-start; flex-direction:column; } nav { gap:10px 16px; } }