:root{
  --ink:#18352d; --muted:#587068; --paper:#f5f1e7; --card:#fffdf7;
  --river:#1f6570; --land:#6d7850; --line:#d7d4c6; --dark:#102923;
}
*{box-sizing:border-box}
body{margin:0;font:18px/1.65 system-ui,-apple-system,Segoe UI,sans-serif;background:var(--paper);color:var(--ink);line-height:1.65}
header{background:var(--dark);color:#fff;padding:18px 5%}
nav{max-width:1100px;margin:auto;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.brand{font-weight:bold;font-size:1.15rem;margin-right:auto}
nav a{color:#fff;text-decoration:none}
nav a:hover{text-decoration:underline}
main{max-width:1100px;margin:auto;padding:54px 5%}
.hero{padding:42px 0 34px}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;font-weight:bold;color:var(--river)}
h1{font-size:clamp(2.4rem,7vw,5.4rem);line-height:.98;margin:.15em 0 .25em}
h2{font-size:2rem;margin-top:2.1em}
h3{margin-bottom:.25em}
.lede{font-size:1.25rem;max-width:760px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:18px;margin:28px 0}
.card,.stat,.portal{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px}
.stat strong{display:block;font-size:2.25rem;color:var(--river);line-height:1.1}
.callout{border-left:5px solid var(--river);padding:5px 0 5px 20px;margin:30px 0;font-size:1.12rem}
.portal{background:var(--dark);color:#fff;padding:30px}
.button{display:inline-block;background:var(--river);color:white!important;text-decoration:none;padding:12px 18px;border-radius:8px;font-weight:bold}
.portal .button{background:#fff;color:var(--dark)!important}
small,.note{color:var(--muted)}
footer{border-top:1px solid var(--line);padding:28px 5%;color:var(--muted);max-width:1100px;margin:auto}
a{color:var(--river)}
ul{padding-left:1.25rem}
.source{padding:16px 0;border-bottom:1px solid var(--line)}
@media(max-width:650px){main{padding-top:28px} nav{gap:11px} h1{font-size:2.8rem}}