/* Seed-to-Harvest Lab — plain CSS, no framework, system fonts only.
   Palette (all text pairs verified WCAG AA in QA_REPORT.md):
   --ink #20301E on --paper #FAF6EE / --sand #F0E8D8
   --green #1E5631 (headings, links) · --earth #7A4E1D (accents)
   --btn #256B2B with #FFFFFF text · focus ring #B3541E */
:root{
  --paper:#FAF6EE; --sand:#F0E8D8; --card:#FFFFFF;
  --ink:#20301E; --green:#1E5631; --green-mid:#256B2B; --earth:#7A4E1D;
  --line:#D8CCAF; --focus:#B3541E;
  --max:68rem;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:1.0625rem; line-height:1.65;
}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif; color:var(--green); line-height:1.2; margin:1.4em 0 .5em}
h1{font-size:2.1rem; margin-top:.4em}
h2{font-size:1.55rem; border-bottom:2px solid var(--line); padding-bottom:.25em}
h3{font-size:1.2rem}
p{margin:.7em 0}
a{color:var(--green); text-underline-offset:.18em}
a:hover{color:var(--earth)}
:focus-visible{outline:3px solid var(--focus); outline-offset:2px; border-radius:2px}
img{max-width:100%; height:auto; display:block}
.wrap{max-width:var(--max); margin:0 auto; padding:0 1rem}

/* Skip link */
.skip-link{position:absolute; left:-999px; top:0; background:var(--green); color:#fff; padding:.6rem 1rem; z-index:50}
.skip-link:focus{left:.5rem; top:.5rem; color:#fff}

/* Header */
.site-header{background:var(--green); color:#fff}
.site-header .wrap{display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-top:.7rem; padding-bottom:.7rem; flex-wrap:wrap}
.logo{color:#fff; text-decoration:none; display:flex; align-items:center; gap:.6rem}
.logo:hover{color:#fff}
.logo .sprout{font-size:1.7rem; line-height:1}
.logo .wordmark{display:flex; flex-direction:column; line-height:1.05}
.logo .wordmark .brand{font-family:Georgia,"Times New Roman",serif; font-weight:700; font-size:1.15rem; letter-spacing:.02em; text-transform:uppercase}
.logo .wordmark .sub{font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:#DCEBD8}
.main-nav ul{list-style:none; display:flex; gap:1.1rem; margin:0; padding:0; flex-wrap:wrap}
.main-nav a{color:#fff; text-decoration:none; font-weight:600; font-size:.98rem}
.main-nav a:hover{text-decoration:underline; color:#fff}
.nav-toggle{display:none; background:transparent; border:2px solid #fff; color:#fff; border-radius:.4rem; padding:.35rem .8rem; font-weight:700; cursor:pointer}
@media (max-width:44rem){
  .nav-toggle{display:block}
  .main-nav{display:none; width:100%}
  .main-nav.open{display:block}
  .main-nav ul{flex-direction:column; gap:.4rem; padding:.5rem 0}
}

/* Hero + cards */
.hero{padding:2.2rem 0 1rem}
.hero .kicker{color:var(--earth); font-weight:700; letter-spacing:.12em; text-transform:uppercase; font-size:.85rem; margin:0}
.hero h1{font-size:2.5rem; margin:.3em 0}
.hero .lede{font-size:1.2rem; max-width:44rem}
.formats{display:grid; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr)); gap:1rem; margin:1.2rem 0}
.format-card{background:var(--card); border:1px solid var(--line); border-top:4px solid var(--green-mid); border-radius:.5rem; padding:1rem 1.1rem}
.format-card h3{margin-top:.2em}
.cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr)); gap:1.1rem; margin:1rem 0 2rem; padding:0; list-style:none}
.card{background:var(--card); border:1px solid var(--line); border-radius:.6rem; overflow:hidden}
.card a{text-decoration:none; color:var(--ink); display:block}
.card a:hover h3{color:var(--earth)}
.card img{aspect-ratio:4/5; object-fit:cover; width:100%}
.card .card-body{padding:.8rem 1rem 1rem}
.card h3{margin:.1em 0 .3em; font-size:1.12rem}
.card p{margin:.2em 0; font-size:.95rem}
.card .days{color:var(--earth); font-weight:700; font-size:.85rem; letter-spacing:.06em; text-transform:uppercase}

/* Article */
.breadcrumb{font-size:.92rem; margin:1rem 0 0; color:var(--ink)}
.breadcrumb ol{list-style:none; display:flex; flex-wrap:wrap; gap:.4rem; margin:0; padding:0}
.breadcrumb li+li::before{content:"›"; margin-right:.4rem; color:var(--earth)}
.lede{font-size:1.18rem; line-height:1.6}
figure{margin:1.4rem auto; max-width:26rem}
figure img{border-radius:.6rem; border:1px solid var(--line)}
figcaption{font-size:.9rem; color:var(--ink); margin-top:.5rem; line-height:1.5}
.stage-table{border-collapse:collapse; width:100%; margin:1rem 0; background:var(--card); font-size:.98rem}
.stage-table th,.stage-table td{border:1px solid var(--line); padding:.55rem .7rem; text-align:left; vertical-align:top}
.stage-table th{background:var(--sand); color:var(--green); font-family:Georgia,serif}
.watch-box,.product-box,.fact-box{background:var(--sand); border:1px solid var(--line); border-left:5px solid var(--earth); border-radius:.5rem; padding:.4rem 1.1rem 1rem; margin:1.4rem 0}
.watch-box{border-left-color:var(--green-mid)}
.product-box h2,.watch-box h2{border-bottom:none; margin-top:.6em}
.disclosure{font-size:.92rem; font-weight:600}
.sources{font-size:.95rem}
.sources ul{padding-left:1.2rem}
.keep-exploring{background:var(--card); border:1px solid var(--line); border-radius:.5rem; padding:.4rem 1.1rem 1rem; margin:1.4rem 0}

/* Forms */
.contact-form{display:grid; gap:.9rem; max-width:34rem; margin:1rem 0}
.contact-form label{font-weight:600; display:grid; gap:.3rem}
.contact-form input,.contact-form textarea{font:inherit; padding:.55rem .7rem; border:1.5px solid var(--green); border-radius:.4rem; background:#fff; color:var(--ink); width:100%}
.btn{background:var(--green-mid); color:#fff; border:none; border-radius:.45rem; padding:.7rem 1.4rem; font:inherit; font-weight:700; cursor:pointer; justify-self:start}
.btn:hover{background:var(--green)}

/* Footer */
.site-footer{background:var(--green); color:#fff; margin-top:3rem}
.site-footer a{color:#fff}
.site-footer .cols{display:grid; grid-template-columns:repeat(auto-fit,minmax(13rem,1fr)); gap:1.2rem; padding:2rem 0 1rem}
.site-footer h2{color:#fff; border-bottom-color:#3E7049; font-size:1.1rem; margin-top:0}
.site-footer ul{list-style:none; margin:0; padding:0}
.site-footer li{margin:.35rem 0}
.site-footer .fineprint{border-top:1px solid #3E7049; padding:1rem 0 1.6rem; font-size:.92rem}
.site-footer .fineprint p{margin:.35rem 0}
