:root{color-scheme:light;--ink:#193d36;--paper:#f6f4ed;--accent:#8b431f}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:1.05rem/1.7 system-ui,sans-serif}
a{color:inherit;text-underline-offset:.22em;overflow-wrap:anywhere}
a:hover{text-decoration-thickness:3px}
a:focus-visible{outline:3px solid var(--accent);outline-offset:5px}
.skip{position:absolute;left:1rem;top:-6rem;background:white;padding:1rem;z-index:2}
.skip:focus{top:1rem}
.draft{background:var(--ink);color:white;text-align:center;padding:.65rem 1rem;font-size:.8rem;letter-spacing:.09em}
header,main,footer{max-width:1120px;margin:auto;padding:2rem clamp(1rem,4vw,3rem)}
.brand{font-size:1.35rem;font-weight:750;margin:0 0 1rem}
.brand span{display:block;font-weight:400;font-size:.8rem}
nav{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem}
nav a{padding:.35rem 0}
nav [aria-current]{font-weight:750}
main{padding-top:3rem;padding-bottom:5rem}
h1{font-family:Georgia,serif;font-size:clamp(2.1rem,6vw,4.6rem);font-weight:400;line-height:1.12;max-width:16ch;margin:.5rem 0 2rem;overflow-wrap:anywhere}
h2{font-size:1.3rem;line-height:1.3}
p{max-width:72ch}
.eyebrow{text-transform:uppercase;font-size:.75rem;letter-spacing:.12em;font-weight:750}
.notice{border-left:4px solid var(--accent);background:#fffaf1;padding:1rem 1.5rem}
.notice h2{color:var(--accent)}
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;margin-top:2.5rem}
article{border-top:1px solid #9faea3;padding:1rem 0}
footer{border-top:1px solid #9faea3;font-size:.85rem}
.prose{max-width:76ch;margin-top:2rem}
.prose h2{font-family:Georgia,serif;font-size:1.65rem;margin-top:2.5rem}
.prose li{margin-bottom:1rem}
.checklist{list-style-type:square;padding-left:1.5rem}
.checklist li{border-bottom:1px solid #9faea3;padding:.5rem 0 1.1rem;break-inside:avoid}
@media(max-width:600px){.cards{grid-template-columns:1fr}main{padding-top:1rem}nav{gap:.4rem 1rem}}
@media print{.skip,nav{display:none}.draft{color:black;background:white;border:2px solid black}}
/* Original field-guide illustration and a quiet, consistent icon system. */
header{padding-bottom:1.25rem}main{padding-top:2rem}
.hero{display:grid;grid-template-columns:1fr 1.02fr;gap:2rem;align-items:center;margin-bottom:2.6rem}
.hero h1{font-size:clamp(2.4rem,4.2vw,3.9rem);margin-bottom:0;max-width:14ch}
.hero-art{width:100%;aspect-ratio:560/440}
.hero-art>svg{display:block;width:100%;height:auto}
.section-icon{flex:none;vertical-align:middle;color:#8b431f}
.prose h2{display:flex;align-items:flex-start;gap:.7rem}
.prose h2 .section-icon{margin-top:.12em}
.article-opening{position:relative}
.article-opening>.section-icon{width:44px;height:44px;padding:8px;box-sizing:content-box;background:#e8ecdf;border-radius:16px;margin-bottom:.6rem}
.cards{gap:1.3rem}
.cards article{border:1px solid #b1bcae;border-radius:15px;background:#fffcf4;padding:1.5rem;position:relative}
.cards article>.section-icon{width:38px;height:38px;padding:7px;box-sizing:content-box;border-radius:12px;background:#ececda;margin-bottom:.5rem}
.cards h2{margin:.3rem 0 .8rem;font-family:Georgia,serif;font-size:1.5rem;font-weight:400;line-height:1.35}
.cards .eyebrow{margin:.4rem 0}
.notice{border-radius:0 12px 12px 0}
@media(max-width:760px){.hero{grid-template-columns:1fr;gap:1.3rem;margin-bottom:1.8rem}.hero h1{max-width:19ch;font-size:clamp(2.4rem,7vw,3.4rem)}.hero-art{max-width:560px;margin:auto}.hero-copy .eyebrow{margin-top:0}.cards article{padding:1.2rem}.article-opening>.section-icon{width:32px;height:32px}}
@media print{.hero-art{display:none}.hero{display:block}.section-icon{color:#193d36}.cards article{break-inside:avoid}}
.hero-art{border-radius:28px;overflow:hidden}
