/* self-hosted fonts */
/* latin-ext */
@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/fraunces-italic-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/fraunces-italic-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/fraunces-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/fraunces-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/fraunces-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/fraunces-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/fraunces-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/fraunces-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Abq Reclaimed — shared stylesheet */
:root{
  --paper:#FBF8F1; --cream:#F2EBDB; --cream-2:#EAE0CC;
  --forest:#2F5D3A; --forest-deep:#1F4128; --moss:#5B7F4E;
  --terracotta:#C2683D; --terracotta-deep:#A8542E;
  --kraft:#D8C4A0; --bark:#2A251F; --bark-soft:#5E564B; --line:#E3D8C2;
  --shadow:0 18px 40px -22px rgba(42,37,31,.45);
  --shadow-sm:0 8px 20px -14px rgba(42,37,31,.45);
  --radius:20px; --radius-lg:30px; --maxw:1140px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--bark);background:var(--paper);line-height:1.65;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:'Fraunces',Georgia,serif;font-weight:600;line-height:1.12;margin:0 0 .4em;letter-spacing:-.01em}
h1{font-size:clamp(2.3rem,5.4vw,4rem)}
h2{font-size:clamp(1.8rem,3.6vw,2.7rem)}
h3{font-size:1.22rem}
p{margin:0 0 1rem}
a{color:var(--forest);text-decoration:none}
a:hover{text-decoration:underline}
img,svg{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.narrow{max-width:760px}
.eyebrow{font-size:.82rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--terracotta-deep);margin-bottom:.7rem}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.55rem;font-weight:600;font-size:1.02rem;padding:.92rem 1.6rem;border-radius:999px;border:2px solid transparent;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,background .2s ease;white-space:nowrap;text-decoration:none}
.btn:hover{text-decoration:none}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--terracotta-deep);color:#fff;box-shadow:var(--shadow-sm)}
.btn-primary:hover{background:var(--terracotta-deep);transform:translateY(-2px);color:#fff}
.btn-ghost{background:transparent;color:var(--forest-deep);border-color:var(--forest)}
.btn-ghost:hover{background:var(--forest);color:#fff}
.btn-lg{font-size:1.1rem;padding:1.05rem 1.9rem}

/* Header */
header.site{position:sticky;top:0;z-index:50;background:rgba(251,248,241,.86);backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:70px}
.brand{display:flex;align-items:center;gap:.6rem;font-family:'Fraunces',serif;font-weight:600;font-size:1.28rem;color:var(--forest-deep);letter-spacing:-.01em}
.brand:hover{text-decoration:none}
.brand .mark{width:38px;height:38px;flex:0 0 auto}
.nav-links{display:flex;align-items:center;gap:1.6rem}
.nav-links a{color:var(--bark-soft);font-weight:500;font-size:.97rem}
.nav-links a:hover{color:var(--forest-deep)}
.nav-cta{display:flex;align-items:center;gap:1rem}
.menu-btn{display:none;background:none;border:0;cursor:pointer;padding:8px}
.menu-btn span{display:block;width:24px;height:2px;background:var(--bark);margin:5px 0;border-radius:2px;transition:.25s}

/* Sections */
section{padding:74px 0}
.section-head{max-width:64ch;margin:0 auto 46px;text-align:center}
.section-head p{color:var(--bark-soft);font-size:1.06rem}
.tight{padding:52px 0}

/* Page hero (interior) */
.page-hero{background:linear-gradient(165deg,#33623E 0%,#274E31 60%,#1F4128 100%);color:#F4EFE3;position:relative;overflow:hidden}
.page-hero .blob{position:absolute;border-radius:50%;filter:blur(8px);opacity:.4}
.page-hero .pb1{width:360px;height:360px;background:#3E7349;top:-130px;right:-90px}
.page-hero .pb2{width:240px;height:240px;background:#C2683D;bottom:-130px;left:-70px;opacity:.3}
.page-hero .inner{position:relative;padding:62px 0 66px}
.page-hero h1{color:#FBF8F1;max-width:18ch}
.page-hero p.lead{font-size:1.15rem;color:#E4DCC9;max-width:54ch;margin:.2rem 0 0}
.breadcrumbs{font-size:.85rem;color:#CDC3AC;margin-bottom:1rem}
.breadcrumbs a{color:#E4DCC9}
.breadcrumbs span{opacity:.6;margin:0 .35rem}

/* Steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.steps.four{grid-template-columns:repeat(4,1fr)}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px 26px;box-shadow:var(--shadow-sm);position:relative}
.step .num{font-family:'Fraunces',serif;font-size:1rem;font-weight:600;color:#fff;background:var(--forest);width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.step h3{margin-bottom:.35em}
.step p{color:var(--bark-soft);margin:0;font-size:.98rem}

/* Accept lists */
.accept{background:var(--cream)}
.accept-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.accept-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:30px 30px 26px}
.accept-card.yes{border-top:5px solid var(--moss)}
.accept-card.no{border-top:5px solid var(--kraft)}
.accept-card h3{display:flex;align-items:center;gap:.5rem}
.accept-card ul{list-style:none;margin:.4rem 0 0;padding:0;columns:2;column-gap:22px}
.accept-card ul.one{columns:1}
.accept-card li{padding:.28rem 0 .28rem 1.5rem;position:relative;font-size:.97rem;break-inside:avoid}
.accept-card.yes li::before{content:"";position:absolute;left:0;top:.62em;width:13px;height:7px;border-left:2.5px solid var(--moss);border-bottom:2.5px solid var(--moss);transform:rotate(-45deg)}
.accept-card.no li::before{content:"–";position:absolute;left:.15rem;top:.05em;color:var(--terracotta-deep);font-weight:700}
.accept-note{margin-top:18px;text-align:center;color:var(--bark-soft);font-size:.96rem}

/* Impact */
.impact{background:linear-gradient(160deg,#2F5D3A,#1F4128);color:#F4EFE3}
.impact .section-head h2{color:#FBF8F1}
.impact .section-head p{color:#D7CDB7}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:8px}
.stat{text-align:center;padding:26px 18px;background:rgba(251,248,241,.06);border:1px solid rgba(244,239,227,.16);border-radius:var(--radius)}
.stat .big{font-family:'Fraunces',serif;font-size:2.5rem;color:var(--kraft);line-height:1;margin-bottom:.3rem}
.stat .lbl{font-size:.96rem;color:#E4DCC9}

/* Pills / areas */
.pills{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}
.pill{background:#fff;border:1px solid var(--line);border-radius:999px;padding:.42rem 1rem;font-size:.92rem;color:var(--bark-soft);box-shadow:var(--shadow-sm)}
.area-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}

/* Prose (content + articles) */
.prose{max-width:720px;margin:0 auto;font-size:1.06rem;color:#3c352c}
.prose h2{margin:2.2rem 0 .7rem}
.prose h3{font-size:1.25rem;margin:1.8rem 0 .5rem}
.prose p{margin:0 0 1.15rem}
.prose ul,.prose ol{margin:0 0 1.2rem;padding-left:1.3rem}
.prose li{margin:.4rem 0}
.prose a{color:var(--terracotta-deep);font-weight:600}
.prose blockquote{margin:1.6rem 0;padding:.6rem 1.3rem;border-left:4px solid var(--moss);background:var(--cream);border-radius:0 12px 12px 0;color:#3c352c;font-style:italic}
.prose .lead{font-size:1.18rem;color:var(--bark-soft)}
.callout{background:var(--cream);border:1px solid var(--line);border-left:5px solid var(--terracotta);border-radius:0 16px 16px 0;padding:18px 22px;margin:1.6rem 0}
.callout p:last-child{margin:0}

/* Blog cards */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.post-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .15s ease,box-shadow .2s ease}
.post-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);text-decoration:none}
.post-thumb{height:150px;background:var(--forest);background-size:cover;background-position:center;background-repeat:no-repeat;position:relative}.post-thumb::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 20% 0,rgba(255,255,255,.14),transparent 60%)}
.thumb-clothes{background:linear-gradient(135deg,#33623E,#1F4128)}
.thumb-recycle{background:linear-gradient(135deg,#5B7F4E,#33623E)}
.thumb-shoes{background:linear-gradient(135deg,#C2683D,#9C4E2C)}
.thumb-box{background:linear-gradient(135deg,#CDB892,#A98C5C)}
.thumb-season{background:linear-gradient(135deg,#33623E,#1F4128)}
.thumb-tag{background:linear-gradient(135deg,#C2683D,#9C4E2C)}
.thumb-kids{background:linear-gradient(135deg,#5B7F4E,#33623E)}
.thumb-sort{background:linear-gradient(135deg,#CDB892,#A98C5C)}
.thumb-hanger{background:linear-gradient(135deg,#33623E,#1F4128)}
.thumb-house-valley{background:linear-gradient(135deg,#5B7F4E,#33623E)}
.thumb-house-mesa{background:linear-gradient(135deg,#C2683D,#9C4E2C)}
.thumb-house-mountain{background:linear-gradient(135deg,#33623E,#1F4128)}
.post-card .pc-body{padding:22px 22px 24px}
.post-card h3{margin:0 0 .4rem;color:var(--forest-deep)}
.post-card p{margin:0;color:var(--bark-soft);font-size:.96rem}
.post-meta{font-size:.82rem;color:var(--moss);font-weight:600;letter-spacing:.04em;text-transform:uppercase;margin-bottom:.5rem}

/* FAQ */
.faq-list{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:.2rem .4rem;box-shadow:var(--shadow-sm)}
summary{cursor:pointer;font-weight:600;padding:1rem 1rem;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:'Fraunces',serif;font-size:1.5rem;color:var(--terracotta);transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}
details .ans{padding:0 1rem 1rem;margin:0;color:var(--bark-soft)}

/* CTA band */
.cta-band{background:var(--terracotta);color:#fff;text-align:center}
.cta-band h2{color:#fff}
.cta-band p{color:#FBEAD9;max-width:50ch;margin:0 auto 1.6rem}
.cta-band .btn-primary{background:#fff;color:var(--terracotta-deep)}
.cta-band .btn-primary:hover{background:#FBF8F1;color:var(--terracotta-deep)}

/* Footer */
footer.site{background:var(--forest-deep);color:#CDC3AC;padding:54px 0 30px;font-size:.95rem}
.foot-grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:30px;margin-bottom:34px}
footer .brand{color:#F4EFE3}
footer a{color:#CDC3AC}
footer a:hover{color:#fff}
.foot-col h4{font-family:'Inter',sans-serif;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:var(--kraft);margin:0 0 .8rem}
.foot-col a{display:block;margin-bottom:.4rem}
.foot-bottom{border-top:1px solid rgba(244,239,227,.15);padding-top:22px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:.86rem;color:#9D947F}

@media(max-width:860px){
  .steps,.steps.four,.stats{grid-template-columns:1fr}
  .accept-grid,.area-grid{grid-template-columns:1fr}
  .accept-card ul{columns:1}
  .posts{grid-template-columns:1fr}
  .nav-links{display:none}
  .menu-btn{display:block}
  .nav-links.open{display:flex;position:absolute;top:70px;left:0;right:0;flex-direction:column;background:var(--paper);border-bottom:1px solid var(--line);padding:18px 22px;gap:1rem}
  .nav-cta .btn-header{display:none}
}


/* ===================== PREMIUM PASS (v3) ===================== */
/* =====================================================================
   ABQ RECLAIMED — PREMIUM DESIGN SYSTEM :root ADDITIONS (consolidated)
   Paste this token block in BOTH places (the two files do NOT share CSS):
     1) public/assets/styles.css  — inside the existing :root{...} (append)
     2) public/index.html         — inside the inline <style> :root{...} (append)
   Everything here is ADDITIVE. No existing token is renamed or changed.
   The legacy --shadow / --shadow-sm are RE-ALIASED to the new elevation
   scale so all 100+ pages inherit the upgrade with zero markup edits.
   ===================================================================== */
:root{
  /* ---------- Fluid type scale (modular, tuned to land on today's max sizes) ---------- */
  --step--1: clamp(.86rem,.83rem + .14vw,.94rem);   /* meta / breadcrumbs */
  --step-0:  clamp(1rem,.97rem + .16vw,1.09rem);    /* body baseline */
  --step-1:  clamp(1.13rem,1.06rem + .34vw,1.32rem);/* lead / large body */
  --step-2:  clamp(1.22rem,1.13rem + .44vw,1.5rem); /* h3 */
  --step-3:  clamp(1.7rem,1.42rem + 1.4vw,2.7rem);  /* h2 (max = today's 2.7rem) */
  --step-4:  clamp(2.3rem,1.7rem + 3vw,4rem);       /* h1 (max = today's 4rem) */
  --step-5:  clamp(2.5rem,1.9rem + 4vw,4.2rem);     /* hero display */

  /* Optical-size + tracking ramp for Fraunces (axis is already loaded) */
  --opsz-display:144; --opsz-text:32;
  --track-display:-.022em; --track-h2:-.014em; --track-h3:-.006em; --track-eyebrow:.14em;

  /* Reading measure */
  --measure:66ch; --measure-tight:42ch;

  /* ---------- Fluid spacing scale ---------- */
  --space-3xs:.25rem; --space-2xs:.5rem; --space-xs:.75rem;
  --space-s:1rem; --space-m:1.5rem; --space-l:2rem; --space-xl:3rem;
  --space-2xl:clamp(3.5rem,7vw,5.5rem); --space-3xl:clamp(4.5rem,9vw,7rem);
  --section-y:clamp(3.5rem,4vw + 1.5rem,5.75rem);
  --section-y-tight:clamp(2.75rem,3vw + 1rem,4rem);
  --gutter:clamp(1.25rem,4vw,2rem);
  --grid-gap:clamp(1.25rem,2.2vw,1.75rem);
  --maxw-prose:clamp(38ch,60vw,72ch); /* capped 72ch so Inter line length stays comfortable */

  /* ---------- Warm-tinted elevation scale (ambient + contact, bark hue) ---------- */
  --e1:0 1px 2px -1px rgba(42,37,31,.10),0 2px 6px -2px rgba(42,37,31,.10);
  --e2:0 2px 4px -2px rgba(42,37,31,.10),0 8px 18px -10px rgba(42,37,31,.20);
  --e3:0 4px 8px -3px rgba(42,37,31,.12),0 18px 38px -18px rgba(42,37,31,.30);
  --e4:0 8px 16px -6px rgba(42,37,31,.14),0 30px 60px -28px rgba(42,37,31,.38);
  --shadow-art:0 2px 4px rgba(31,65,40,.10),0 12px 24px -10px rgba(31,65,40,.34),0 38px 70px -34px rgba(20,42,28,.55);
  /* Re-alias the legacy tokens onto the new scale (global upgrade, no markup edits) */
  --shadow:var(--e3); --shadow-sm:var(--e2);

  /* Surface detail tokens */
  --line-soft:#ECE3D0; --line-warm:#E0D4BC;
  --ridge:inset 0 1px 0 rgba(255,255,255,.6);      /* lit top edge on light cards */
  --ridge-dark:inset 0 1px 0 rgba(244,239,227,.10);/* lit top edge on dark tiles */
  --hi:rgba(255,255,255,.55);
  --on-dark-fill:rgba(251,248,241,.055); --on-dark-fill-2:rgba(251,248,241,.09);
  --on-dark-line:rgba(244,239,227,.14);

  /* Signature desert accents reused by hero + page-hero motif */
  --sun:#E8C36B; --ridge-green:#23492E; --ridge-green-deep:#1E3F27;
  --hero-ink:#FBF8F1; --hero-lead:#E7DFCD; --eyebrow-on-dark:#E8A07B;

  /* ---------- Motion vocabulary (single source of truth) ---------- */
  --ease-out:cubic-bezier(.22,.61,.36,1);
  --ease-spring:cubic-bezier(.34,1.32,.55,1);
  --ease-inout:cubic-bezier(.65,.05,.36,1);
  --dur-fast:.18s; --dur-mid:.32s; --dur-slow:.6s;
  --reveal-rise:22px;

  /* ---------- Accessibility / finishing inks (contrast-checked) ---------- */
  --ring:#A8542E;            /* terracotta-deep: 5.4:1 white text, 4.98:1 ring on paper */
  --ring-on-dark:#E7C9A6;    /* warm sand: AA on forest-deep */
  --select-bg:rgba(194,104,61,.20); --select-fg:var(--bark);
  --scroll-thumb:#C9B68F; --scroll-thumb-hover:#5B7F4E;
  --foot-faint:#B6AC93;     /* 4.9:1 on forest-deep — fixes the failing #9D947F (3.78:1) */
}

/* --- base/type --- */
/* Engage Fraunces optical axis + size-graded tracking; wire headings to the modular scale.
   NOTE: add font-optical-sizing to html in BOTH styles.css and the homepage inline block. */
html{font-optical-sizing:auto}
body{line-height:1.62;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{background:radial-gradient(1200px 680px at 50% -8%,#FFFDF7 0%,rgba(255,253,247,0) 60%),var(--paper)}
h1,h2,h3,h4{text-wrap:balance;font-optical-sizing:auto}
h1{font-size:var(--step-4);letter-spacing:var(--track-display);line-height:1.06}
h2{font-size:var(--step-3);letter-spacing:var(--track-h2);line-height:1.1}
h3{font-size:var(--step-2);letter-spacing:var(--track-h3);line-height:1.18}
p{text-wrap:pretty}
.section-head h2{max-width:20ch;margin-left:auto;margin-right:auto}
.section-head p{font-size:var(--step-1);line-height:1.55;color:var(--bark-soft)}
/* Eyebrow → signature label with a hairline tab */
.eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-size:.8rem;letter-spacing:var(--track-eyebrow);line-height:1;font-feature-settings:"case" 1}
.eyebrow::before{content:"";width:1.6rem;height:1px;background:currentColor;opacity:.55;flex:0 0 auto}
.section-head .eyebrow{justify-content:center}
.section-head .eyebrow::after{content:"";width:1.6rem;height:1px;background:currentColor;opacity:.55;flex:0 0 auto}
/* Warm paper grain — inlined SVG, behind everything, cannot intercept clicks */
body{position:relative}
body::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* --- base/prose --- */
.prose{max-width:var(--maxw-prose);margin:0 auto;font-size:var(--step-0);line-height:1.7;color:#37302a}
.prose p{margin:0 0 1.25rem;text-wrap:pretty}
.prose h2{margin:2.4rem 0 .6rem;letter-spacing:var(--track-h2)}
.prose h3{margin:1.9rem 0 .45rem}
.prose .lead{font-size:var(--step-1);line-height:1.5;color:var(--bark-soft);font-weight:400}
/* Beautiful Fraunces italic (already loaded) for prose emphasis + quotes */
.prose em,.prose blockquote{font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:500;font-optical-sizing:auto}
.prose strong{font-weight:600}
/* Animated prose/callout link underline (draws in) */
.prose a,.callout a{text-decoration:none;background-image:linear-gradient(var(--terracotta-deep),var(--terracotta-deep));background-repeat:no-repeat;background-position:0 100%;background-size:100% 1px;padding-bottom:1px}
.prose a:hover,.callout a:hover{text-decoration:none}
@media (prefers-reduced-motion:no-preference){.prose a,.callout a{transition:background-size var(--dur-mid) var(--ease-out)}.prose a:hover,.callout a:hover,.prose a:focus-visible,.callout a:focus-visible{background-size:100% 2px}}
/* Optional editorial drop-cap (opt-in via .has-dropcap, or the JS feature-detect) */
@supports (initial-letter:2) or (-webkit-initial-letter:2){.prose>p.has-dropcap::first-letter,article .prose>p.has-dropcap::first-letter{-webkit-initial-letter:2.6;initial-letter:2.6;font-family:'Fraunces',Georgia,serif;font-weight:600;color:var(--terracotta-deep);margin-right:.12em;padding-right:.04em}}
/* Tabular figures for any stat number */
.stat .big{font-variant-numeric:lining-nums tabular-nums}

/* --- header --- */
header.site{transition:background var(--dur-mid) var(--ease-out),box-shadow var(--dur-mid) var(--ease-out),border-color var(--dur-mid) ease}
header.site.scrolled{background:rgba(251,248,241,.94);backdrop-filter:saturate(180%) blur(16px);box-shadow:0 1px 0 rgba(227,216,194,.9),0 10px 30px -22px rgba(42,37,31,.5);border-bottom-color:transparent}
/* Center-out nav underline (replaces the default text-decoration on nav) */
.nav-links a{position:relative;padding-bottom:2px;text-decoration:none}
.nav-links a:hover{text-decoration:none}
.nav-links a::after{content:"";position:absolute;left:50%;right:50%;bottom:-1px;height:2px;border-radius:2px;background:var(--terracotta)}
.nav-links a[aria-current="page"]::after{left:0;right:0}
@media (prefers-reduced-motion:no-preference){.nav-links a::after{transition:left .28s var(--ease-out),right .28s var(--ease-out)}.brand .mark{transition:transform var(--dur-mid) var(--ease-inout)}header.site.scrolled .brand .mark{transform:scale(.92)}}
.nav-links a:hover::after,.nav-links a:focus-visible::after{left:0;right:0}
.nav-links a:focus-visible{outline:none;color:var(--forest-deep)}

/* --- buttons --- */
.btn{position:relative;overflow:hidden;transition:transform var(--dur-fast) var(--ease-spring),box-shadow var(--dur-mid) var(--ease-out),background var(--dur-fast) ease,border-color var(--dur-fast) ease}
.btn-primary{background:var(--terracotta-deep);color:#fff;box-shadow:var(--e2),var(--ridge),inset 0 1px 0 rgba(255,255,255,.22);text-shadow:0 1px 0 rgba(120,52,26,.25)}
.btn-primary:hover{background:#8F4626;color:#fff;box-shadow:var(--e3),var(--ridge),inset 0 1px 0 rgba(255,255,255,.28);transform:translateY(-3px)}
.btn-ghost:hover{transform:translateY(-3px)}
.btn:active{transform:translateY(1px) scale(.985);transition-duration:.07s}
.btn-lg{font-size:1.1rem;padding:1.05rem 1.9rem}
.btn{min-height:44px}
/* Sheen wipe — gated */
@media (prefers-reduced-motion:no-preference){.btn::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.32) 48%,transparent 66%);transform:translateX(-120%);transition:transform var(--dur-slow) var(--ease-out);pointer-events:none}.btn-primary:hover::after{transform:translateX(120%)}}
/* CTA-band white button keeps physicality, inverted */
.cta-band .btn-primary{background:linear-gradient(180deg,#fff,#FBF3E9);color:var(--terracotta-deep);box-shadow:0 1px 1px rgba(42,37,31,.12),0 10px 24px -10px rgba(42,37,31,.45),inset 0 1px 0 #fff;text-shadow:none}
.cta-band .btn-primary:hover{background:linear-gradient(180deg,#fff,#F4EBDD);color:var(--terracotta-deep);transform:translateY(-2px)}

/* --- page-hero (shared styles.css — 57 interior pages) --- */
/* Same desert-light language, applied conservatively. Reuses existing selectors. */
.page-hero{position:relative;overflow:hidden;color:#F4EFE3;background:radial-gradient(110% 75% at 80% -12%,rgba(232,195,107,.16) 0%,rgba(232,195,107,0) 48%),radial-gradient(700px 600px at 6% 116%,rgba(194,104,61,.16) 0%,rgba(194,104,61,0) 60%),linear-gradient(165deg,#33623E 0%,#274E31 60%,#1F4128 100%);box-shadow:inset 0 1px 0 rgba(244,239,227,.08),inset 0 -40px 60px -40px rgba(0,0,0,.30)}
.page-hero::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.45;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='160' height='160' filter='url(%23n)' opacity='.045'/></svg>")}
.page-hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:70px;pointer-events:none;opacity:.85;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1440' height='70' viewBox='0 0 1440 70' preserveAspectRatio='none'><path d='M0 50 L180 36 L340 52 L500 28 L660 50 L820 24 L980 50 L1140 30 L1300 50 L1440 38 L1440 70 L0 70 Z' fill='%231E3F27'/></svg>") bottom/cover no-repeat}
.page-hero .blob{filter:blur(46px)}
.page-hero .pb1{opacity:.5}
.page-hero .pb2{opacity:.34}
.page-hero .inner{position:relative;z-index:1}
.page-hero h1{letter-spacing:var(--track-display);text-wrap:balance;text-shadow:0 1px 0 rgba(20,42,28,.16);font-variation-settings:"opsz" var(--opsz-display);max-width:16ch}
.page-hero p.lead{font-size:var(--step-1)}
.page-hero .eyebrow,.hero .eyebrow{color:var(--eyebrow-on-dark)}
@media (prefers-reduced-motion:no-preference){
  .page-hero .inner>*{transform:translateY(10px);animation:phRise .6s var(--ease-out) forwards}
  .page-hero .breadcrumbs{animation-delay:.04s}
  .page-hero h1{animation-delay:.10s}
  .page-hero .lead{animation-delay:.16s}
  @keyframes phRise{to{transform:none}}
}
@media (prefers-reduced-motion:reduce){.page-hero .inner>*{opacity:1;transform:none}}

/* --- cards --- */
/* Elevation + lit top edge + refined hover lift. Routes through new --e* scale. */
.step,.accept-card{border-color:var(--line-warm);box-shadow:var(--e2),var(--ridge);transition:transform var(--dur-mid) var(--ease-out),box-shadow var(--dur-mid) var(--ease-out),border-color var(--dur-mid) ease}
.step{position:relative}
.step .num{background:linear-gradient(180deg,#3A6E47,var(--forest));box-shadow:0 4px 10px -4px rgba(31,65,40,.55),inset 0 1px 0 rgba(255,255,255,.25)}
.step::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;border-radius:var(--radius) var(--radius) 0 0;background:linear-gradient(90deg,var(--moss),var(--forest));opacity:0;transition:opacity var(--dur-mid) ease}
.post-card{border-color:var(--line-warm);box-shadow:var(--e2),var(--ridge);transition:transform var(--dur-mid) var(--ease-out),box-shadow var(--dur-mid) var(--ease-out),border-color var(--dur-mid) ease}
.pill{border-color:var(--line-warm);box-shadow:var(--e1),var(--ridge)}
.stat{background:linear-gradient(180deg,var(--on-dark-fill-2),var(--on-dark-fill));border-color:var(--on-dark-line);box-shadow:var(--ridge-dark),0 14px 30px -20px rgba(0,0,0,.55);border-radius:var(--radius-lg)}
@media (prefers-reduced-motion:no-preference){
  .step:hover,.accept-card:hover{transform:translateY(-4px);box-shadow:var(--e4),var(--ridge);border-color:#E6DCC6}
  .step:hover::before{opacity:1}
  .post-card:hover{transform:translateY(-5px);box-shadow:var(--e4),var(--ridge)}
  .pill:hover{transform:translateY(-1px);box-shadow:var(--e2),var(--ridge)}
}
/* Accept yes/no top accent → soft gradient bar via double-background (preserves radius) */
.accept-card.yes{border-top:4px solid transparent;background-image:linear-gradient(var(--paper),var(--paper)),linear-gradient(90deg,var(--moss),#6E9460);background-origin:border-box;background-clip:padding-box,border-box}
.accept-card.no{border-top:4px solid transparent;background-image:linear-gradient(var(--paper),var(--paper)),linear-gradient(90deg,var(--kraft),#C7B083);background-origin:border-box;background-clip:padding-box,border-box}

/* --- cta-band --- */
.cta-band{background:radial-gradient(120% 140% at 50% -20%,#D27A4D 0%,var(--terracotta) 45%,#B85F35 100%);position:relative;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 -40px 80px -40px rgba(120,52,26,.35)}
.cta-band::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 80% at 50% 120%,rgba(120,52,26,.35),transparent 70%);pointer-events:none}
.cta-band .wrap{position:relative;z-index:1}
.cta-band p{color:#FFF1E2}

/* --- forms (PROMOTE to shared styles.css + elevate) --- */
/* CRITICAL: form CSS currently lives ONLY inline on index.html — styles.css has none.
   Add this to styles.css so any future generated form is styled, AND it elevates the look. */
.form-section{background:var(--cream)}
.form-card{background:linear-gradient(180deg,#FFFDF8,var(--paper));border:1px solid var(--line-warm);border-radius:var(--radius-lg);box-shadow:var(--e3),inset 0 1px 0 #fff;padding:clamp(26px,4vw,46px);max-width:760px;margin:0 auto;position:relative}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field{display:flex;flex-direction:column;gap:.4rem}
.field.full{grid-column:1 / -1}
label{font-weight:600;font-size:.92rem;color:var(--bark)}
label .req{color:var(--terracotta-deep)}
input,select,textarea{font-family:inherit;font-size:1rem;color:var(--bark);background:#FFFEFB;border:1.5px solid var(--line-warm);border-radius:12px;padding:.8rem .9rem;box-shadow:inset 0 1px 2px rgba(42,37,31,.05);transition:border-color var(--dur-fast) ease,box-shadow var(--dur-fast) ease,background var(--dur-fast) ease}
input:hover,select:hover,textarea:hover{border-color:#CBBC9E;background:#fff}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--forest);background:#fff;box-shadow:0 0 0 3px rgba(47,93,58,.15),inset 0 1px 2px rgba(42,37,31,.03)}
input::placeholder,textarea::placeholder{color:#A89C86}
textarea{resize:vertical;min-height:96px;line-height:1.55}
select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23A8542E' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.6rem}
input[type=file]{padding:.55rem .6rem;font-size:.95rem}
input[type=file]::file-selector-button{font-family:inherit;font-weight:600;font-size:.9rem;color:var(--forest-deep);background:linear-gradient(180deg,#fff,#F2EBDB);border:1.5px solid var(--line-warm);border-radius:9px;padding:.5rem .9rem;margin-right:.8rem;cursor:pointer;transition:background var(--dur-fast) ease,border-color var(--dur-fast) ease}
input[type=file]::file-selector-button:hover{background:var(--cream);border-color:#CBBC9E}
.checks{display:flex;flex-wrap:wrap;gap:.5rem .9rem}
.check{display:inline-flex;align-items:center;gap:.5rem;font-size:.95rem;font-weight:500;color:var(--bark-soft);background:linear-gradient(180deg,#fff,#FCFAF4);border:1.5px solid var(--line-warm);border-radius:11px;padding:.55rem .85rem;cursor:pointer;transition:border-color var(--dur-fast) ease,background var(--dur-fast) ease,color var(--dur-fast) ease}
.check:hover{border-color:var(--moss);color:var(--bark)}
.check:has(input:checked){border-color:var(--forest);background:rgba(91,127,78,.08);color:var(--forest-deep)}
.check input{width:16px;height:16px;accent-color:var(--forest)}
.form-foot{margin-top:22px;display:flex;flex-direction:column;gap:.8rem;align-items:flex-start}
.form-note{font-size:.86rem;color:var(--bark-soft)}
.hp{position:absolute;left:-9999px;top:-9999px}

/* --- faq --- */
/* Covers BOTH markups: generated pages use .ans, homepage uses bare details>p. */
details{border-color:var(--line-warm);box-shadow:var(--e1),var(--ridge);overflow:hidden;transition:box-shadow var(--dur-mid) ease,border-color var(--dur-mid) ease}
details[open]{box-shadow:var(--e3),var(--ridge);border-color:#D8C9AC}
summary{border-radius:12px;transition:background var(--dur-fast) ease}
summary::after{transition:transform var(--dur-mid) var(--ease-spring),color var(--dur-fast) ease}
details[open] summary::after{color:var(--terracotta-deep)}
summary:hover::after{color:var(--terracotta-deep)}
@media (prefers-reduced-motion:no-preference){
  .faq-list summary:hover,details:hover summary{background:rgba(194,104,61,.05)}
  details .ans,details>p{overflow:hidden;transition:height var(--dur-mid) var(--ease-inout)}
  details[open] .ans,details[open]>p{animation:faqAnsIn var(--dur-mid) var(--ease-out)}
  @keyframes faqAnsIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
}

/* --- footer --- */
footer.site{position:relative;background:radial-gradient(1100px 380px at 50% -40%,rgba(91,127,78,.22) 0%,rgba(91,127,78,0) 60%),var(--forest-deep);box-shadow:inset 0 1px 0 rgba(244,239,227,.08)}
footer.site::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--moss),var(--kraft) 50%,var(--terracotta));opacity:.85}
.foot-col h4{position:relative;padding-bottom:.55rem}
.foot-col h4::after{content:"";position:absolute;left:0;bottom:0;width:22px;height:2px;background:var(--kraft);border-radius:2px;opacity:.7}
.foot-col a{display:block;position:relative}
.foot-col a::after{content:"";position:absolute;left:0;bottom:-1px;height:1.5px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:left;opacity:.6}
footer a:hover{text-decoration:none}
.foot-bottom{color:var(--foot-faint)}
.foot-bottom a{color:var(--foot-faint)}
.foot-bottom a:hover{color:#fff}
@media (prefers-reduced-motion:no-preference){.foot-col a::after{transition:transform var(--dur-mid) var(--ease-out)}.foot-col a:hover::after{transform:scaleX(1)}}

/* --- motion + a11y (shared, with CSS hooks for siteJs) --- */
/* Scroll-reveal hidden state — armed ONLY under html.reveal-on (JS adds it after
   confirming IntersectionObserver + no reduced-motion). No JS = always visible. */
@media (prefers-reduced-motion:no-preference){
  html.reveal-on .reveal{opacity:0;transform:translateY(var(--reveal-rise));transition:opacity var(--dur-slow) var(--ease-out),transform var(--dur-slow) var(--ease-out);will-change:opacity,transform}
  html.reveal-on .reveal.is-in{opacity:1;transform:none}
}
html.reveal-off .reveal{opacity:1!important;transform:none!important}
/* Gate smooth-scroll behind motion preference (live CSS sets it unconditionally) */
html{scroll-behavior:auto}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
:target{scroll-margin-top:84px}
/* Universal keyboard focus ring (box-shadow hugs every radius). Surface-aware. */
*:focus{outline:none}
:where(a,button,.btn,summary,input,select,textarea,details,[tabindex]):focus-visible{outline:none;box-shadow:0 0 0 3px var(--paper),0 0 0 5px var(--ring);border-radius:6px}
.btn:focus-visible{border-radius:999px}
summary:focus-visible{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--ring);border-radius:10px}
.btn-primary:focus-visible{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--ring)}
.page-hero :focus-visible,.impact :focus-visible,footer.site :focus-visible{box-shadow:0 0 0 3px var(--forest-deep),0 0 0 5px var(--ring-on-dark)}
.cta-band :focus-visible{box-shadow:0 0 0 3px var(--terracotta),0 0 0 5px #FFF4E8}
/* Branded selection + scrollbar */
::selection{background:var(--select-bg);color:var(--select-fg)}
::-moz-selection{background:var(--select-bg);color:var(--select-fg)}
.page-hero ::selection,.impact ::selection,footer.site ::selection,.cta-band ::selection{background:rgba(216,196,160,.30);color:#FBF8F1}
html{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) transparent}
@media (pointer:fine){::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border:3px solid var(--paper);border-radius:999px;background-clip:padding-box}::-webkit-scrollbar-thumb:hover{background:var(--scroll-thumb-hover)}}
/* Global reduced-motion safety net */
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.btn:hover,.step:hover,.accept-card:hover,.post-card:hover,.pill:hover{transform:none!important}}

/* --- print + finishing (shared) --- */
@media print{
  *{box-shadow:none!important;text-shadow:none!important}
  html{scroll-behavior:auto}
  body{background:#fff;color:#000}
  body::before{display:none}
  header.site,.menu-btn,.btn{display:none!important}
  .page-hero,.impact,.cta-band{background:#fff!important;color:#000!important}
  .page-hero h1,.impact .section-head h2,.cta-band h2,.cta-band p{color:#000!important}
  .page-hero .blob,.page-hero::before,.page-hero::after{display:none}
  a{color:#000;text-decoration:underline}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:.85em;color:#555;word-break:break-all}
  .step,.accept-card,.post-card,details,.callout{border:1px solid #ccc!important;break-inside:avoid;page-break-inside:avoid}
  section{padding:18px 0!important}
  footer.site{background:#fff!important;color:#000!important;border-top:1px solid #999}
  footer.site::before{display:none}
}
/* Optical alignment cleanup */
.eyebrow,.breadcrumbs{margin-left:0;padding-left:0}

/* --- responsive --- */
/* Fluid section rhythm replaces the fixed 74px / 52px */
section{padding:var(--section-y) 0}
.tight{padding:var(--section-y-tight) 0}
.section-head{margin:0 auto clamp(2rem,3.5vw,3rem)}
.wrap{padding:0 var(--gutter)}
/* Unified grid gaps */
.steps,.posts,.stats{gap:var(--grid-gap)}
.accept-grid{gap:var(--grid-gap)}
.area-grid{gap:clamp(2rem,4vw,2.75rem)}
/* Intermediate tablet tier so 3-col doesn't crash straight to 1-col */
@media(min-width:621px) and (max-width:860px){
  .steps,.steps.four,.posts{grid-template-columns:repeat(2,1fr)}
}
/* Mobile nav: real 48px tap targets + animated drop + hamburger→X */
@media(max-width:860px){
  .nav-links.open{display:flex;position:absolute;top:70px;left:0;right:0;flex-direction:column;background:var(--paper);border-bottom:1px solid var(--line);padding:var(--space-s) var(--gutter) var(--space-m);gap:0}
  .nav-links.open a{padding:.85rem .25rem;font-size:1.05rem;border-bottom:1px solid var(--line);min-height:48px;display:flex;align-items:center}
  .nav-links.open a:last-child{border-bottom:0}
  .nav-links.open a::after{display:none}
}
@media(max-width:860px) and (prefers-reduced-motion:no-preference){
  .nav-links.open{animation:navDrop .26s var(--ease-out)}
  @keyframes navDrop{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
  .menu-btn span{transition:transform .25s var(--ease-out),opacity .2s ease}
  .menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0}
  .menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}

/* skip link */
.skip-link{position:absolute;left:-9999px;top:0;z-index:100}.skip-link:focus{left:8px;top:8px;width:auto;padding:.6rem 1rem;background:var(--paper);color:var(--forest-deep);border:2px solid var(--ring);border-radius:8px;box-shadow:var(--e3)}
