/* op-heading-levels-ua */
:where(h2.rt-h4){display:block;font-size:1em;margin-block-start:1.33em;margin-block-end:1.33em;font-weight:bold}
/* op-heading-levels-ua:end */
/* =========================================================================
   Autism Learning Felt — shared stylesheet
   Botanical: forest & sage greens on warm cream, honey accent
   Type: Newsreader (serif) + Mulish (humanist sans)
   ========================================================================= */



:root{
  --cream:#f3efe3;
  --cream-2:#ede8d8;
  --paper:#fbfaf3;
  --forest:#1e3a2b;
  --forest-2:#2c5540;
  --moss:#43684d;
  --sage:#7b9a74;
  --sage-soft:#d8e2cd;
  --sage-tint:#e6ecdc;
  --ink:#243029;
  --ink-soft:#4c5a4f;
  --honey:#bd7a25;
  --honey-2:#a5661a;
  --honey-soft:#e6c789;
  --line:rgba(30,58,43,.16);
  --line-soft:rgba(30,58,43,.09);
  --shadow:0 1px 2px rgba(30,58,43,.05), 0 14px 40px -22px rgba(30,58,43,.35);
  --shadow-sm:0 1px 2px rgba(30,58,43,.06), 0 8px 20px -16px rgba(30,58,43,.4);
  --serif:'Newsreader',Georgia,serif;
  --sans:'Mulish',system-ui,-apple-system,sans-serif;
  --maxw:1180px;
  --read:43rem;
  --r:14px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--sans);
  font-size:1.0625rem;
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%;display:block;height:auto}
a{color:var(--honey-2);text-decoration:none}
a:hover{color:var(--forest);text-decoration:underline;text-underline-offset:3px}
h1,h2,h3,h4{font-family:var(--serif);color:var(--forest);font-weight:500;line-height:1.12;margin:0 0 .5em;letter-spacing:-.01em}
p{margin:0 0 1.1em}
strong{font-weight:700;color:var(--forest)}
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}
::selection{background:var(--honey-soft);color:var(--forest)}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(1.1rem,4vw,2.4rem)}
.eyebrow{font-family:var(--sans);font-weight:700;font-size:.9rem;letter-spacing:.18em;text-transform:uppercase;color:var(--honey-2)}
.eyebrow.sage{color:var(--moss)}
.center{text-align:center}
.lead{font-family:var(--serif);font-size:clamp(1.3rem,2.6vw,1.7rem);line-height:1.5;color:var(--forest-2)}

/* ---- Buttons ---- */
.btn{display:inline-flex;align-items:center;gap:.5em;font-family:var(--sans);font-weight:700;font-size:1rem;
  padding:.85em 1.5em;border-radius:999px;border:1.5px solid transparent;cursor:pointer;transition:.18s;line-height:1;text-decoration:none}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn-primary{background:var(--forest);color:#fbfaf3}
.btn-primary:hover{background:var(--forest-2);color:#fff}
.btn-honey{background:var(--honey);color:#fff}
.btn-honey:hover{background:var(--honey-2);color:#fff}
.btn-ghost{background:transparent;border-color:var(--forest);color:var(--forest)}
.btn-ghost:hover{background:var(--forest);color:#fbfaf3}
.link-arrow{font-family:var(--sans);font-weight:700;color:var(--honey-2);display:inline-flex;gap:.4em;align-items:center}
.link-arrow:hover{color:var(--forest);text-decoration:none;gap:.65em}

/* =========================================================================
   HEADER / NAV
   ========================================================================= */
.site-header{position:sticky;top:0;z-index:50;background:rgba(243,239,227,.9);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-soft)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:74px}
.brand{display:flex;flex-direction:column;line-height:.98;text-decoration:none}
.brand:hover{text-decoration:none}
.brand b{font-family:var(--serif);font-weight:600;font-size:1.42rem;color:var(--forest);letter-spacing:-.02em}
.brand span{font-family:var(--sans);font-weight:700;font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--honey-2);margin-top:3px}
.nav-links{display:flex;align-items:center;gap:.35rem;list-style:none;margin:0;padding:0}
.nav-links a{font-family:var(--sans);font-weight:600;font-size:1rem;color:var(--forest);padding:.55em .9em;border-radius:999px;transition:.15s}
.nav-links a:hover{background:var(--sage-tint);color:var(--forest);text-decoration:none}
.nav-links a.cta{background:var(--honey);color:#fff}
.nav-links a.cta:hover{background:var(--honey-2)}
.nav-toggle,.nav-check{display:none}
.nav-burger{display:none;cursor:pointer;width:44px;height:44px;border:1px solid var(--line);border-radius:10px;
  align-items:center;justify-content:center;background:var(--paper)}
.nav-burger span,.nav-burger span::before,.nav-burger span::after{content:'';display:block;width:20px;height:2px;background:var(--forest);position:relative;transition:.2s}
.nav-burger span::before{position:absolute;top:-6px}
.nav-burger span::after{position:absolute;top:6px}

@media(max-width:860px){
  .nav-burger{display:flex}
  .nav-links{position:absolute;top:74px;left:0;right:0;flex-direction:column;align-items:stretch;gap:.2rem;
    background:var(--paper);border-bottom:1px solid var(--line);padding:.8rem clamp(1.1rem,4vw,2.4rem) 1.2rem;
    box-shadow:var(--shadow);transform:translateY(-140%);transition:transform .28s ease;visibility:hidden}
  .nav-check:checked ~ .nav-links{transform:translateY(0);visibility:visible}
  .nav-links a{padding:.85em 1em;font-size:1.1rem;border-radius:10px}
  .nav-links a.cta{text-align:center;margin-top:.3rem}
}

/* =========================================================================
   HERO (home)
   ========================================================================= */
.hero{position:relative;background:
    radial-gradient(120% 90% at 82% 8%,rgba(123,154,116,.28),transparent 55%),
    linear-gradient(180deg,var(--cream) 0%,var(--cream-2) 100%);
  padding:clamp(2.6rem,6vw,5.2rem) 0 clamp(3rem,6vw,5rem);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.8rem,4vw,3.5rem);align-items:center}
.hero h1{font-size:clamp(2.5rem,6vw,4.5rem);font-weight:500;line-height:1.03;margin:.5rem 0 .1rem}
.hero h1 em{font-style:italic;color:var(--moss)}
.hero .lead{margin:1.3rem 0 2rem;max-width:34rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem}
.hero-media{position:relative}
.hero-media .frame{border-radius:22px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/5;background:var(--sage-soft)}
.hero-media .frame img{width:100%;height:100%;object-fit:cover}
.hero-media .badge{position:absolute;left:-18px;bottom:26px;background:var(--paper);border:1px solid var(--line);
  border-radius:16px;padding:1rem 1.2rem;box-shadow:var(--shadow);max-width:15rem}
.hero-media .badge b{font-family:var(--serif);font-size:2rem;color:var(--honey-2);display:block;line-height:1}
.hero-media .badge span{font-size:.9rem;color:var(--ink-soft);display:block;margin-top:.25rem}
.leaf-tag{display:inline-flex;align-items:center;gap:.55em;font-family:var(--sans);font-weight:700;font-size:.9rem;
  color:var(--moss);background:var(--sage-tint);border-radius:999px;padding:.45em 1em}
.leaf-tag::before{content:'';width:9px;height:9px;border-radius:50%;background:var(--sage)}
@media(max-width:820px){
  .hero-grid{grid-template-columns:1fr;text-align:left}
  .hero-media{order:-1}
  .hero-media .frame{aspect-ratio:16/11;max-height:340px}
  .hero-media .badge{max-width:13rem}
}

/* ---- generic section ---- */
.section{padding:clamp(3rem,7vw,6rem) 0}
.section.tint{background:var(--sage-tint)}
.section.paper{background:var(--paper)}
.section.forest{background:var(--forest);color:#e9efe6}
.section.forest h1,.section.forest h2,.section.forest h3{color:#fbfaf3}
.section.forest .eyebrow{color:var(--honey-soft)}
.section-head{max-width:40rem;margin-bottom:clamp(2rem,4vw,3rem)}
.section-head.center{margin-left:auto;margin-right:auto}
.section-head h2{font-size:clamp(2rem,4.5vw,3rem);margin:.4rem 0 .3rem}
.section-head p{font-size:1.15rem;color:var(--ink-soft);margin:0}

/* =========================================================================
   JOURNEY PATH
   ========================================================================= */
.journey{display:grid;gap:1.1rem}
.step{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(1rem,3vw,2rem);align-items:center;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.3rem,3vw,2rem);
  box-shadow:var(--shadow-sm);transition:.2s;position:relative}
.step:hover{border-color:var(--sage);transform:translateX(4px)}
.step-num{font-family:var(--serif);font-size:clamp(2.2rem,5vw,3.2rem);color:var(--honey);line-height:1;width:2.4ch;
  font-weight:500;font-style:italic}
.step-body h3{font-size:clamp(1.35rem,3vw,1.7rem);margin:0 0 .3rem}
.step-body p{margin:0;color:var(--ink-soft);font-size:1.05rem;max-width:44rem}
.step-body .refs{margin-top:.7rem;display:flex;flex-wrap:wrap;gap:.5rem}
.step-body .refs a{font-size:.9rem;font-weight:700;color:var(--moss);background:var(--sage-tint);
  padding:.35em .85em;border-radius:999px}
.step-body .refs a:hover{background:var(--sage-soft);text-decoration:none;color:var(--forest)}
.step-go{font-size:1.6rem;color:var(--sage);align-self:center}
@media(max-width:680px){
  .step{grid-template-columns:auto 1fr;padding:1.2rem}
  .step-go{display:none}
}

/* =========================================================================
   FEATURED LONG-READ
   ========================================================================= */
.feature{display:grid;grid-template-columns:1.1fr 1fr;gap:0;border-radius:22px;overflow:hidden;
  background:var(--forest);color:#e9efe6;box-shadow:var(--shadow)}
.feature .fig{background:var(--sage-soft);min-height:340px}
.feature .fig img{width:100%;height:100%;object-fit:cover}
.feature .body{padding:clamp(1.8rem,4vw,3.4rem)}
.feature .eyebrow{color:var(--honey-soft)}
.feature h2{color:#fbfaf3;font-size:clamp(1.9rem,4vw,2.8rem);margin:.5rem 0 .8rem}
.feature p{color:#cdd8c9;font-size:1.12rem;margin-bottom:1.5rem}
.feature .btn-honey{color:#fff}
@media(max-width:760px){.feature{grid-template-columns:1fr}.feature .fig{min-height:220px}}

/* =========================================================================
   LIBRARY / ARTICLE CARDS
   ========================================================================= */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}
.acard{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-sm);transition:.2s}
.acard:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--sage)}
.acard .thumb{aspect-ratio:16/10;background:var(--sage-soft);overflow:hidden}
.acard .thumb img{width:100%;height:100%;object-fit:cover;transition:.4s}
.acard:hover .thumb img{transform:scale(1.05)}
.acard .c-body{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;flex:1}
.acard .kicker{font-family:var(--sans);font-weight:700;font-size:.9rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--honey-2);margin-bottom:.5rem}
.acard h3{font-size:1.4rem;line-height:1.15;margin:0 0 .5rem}
.acard h3 a{color:var(--forest)}
.acard h3 a:hover{color:var(--honey-2);text-decoration:none}
.acard p{font-size:1rem;color:var(--ink-soft);margin:0 0 1rem}
.acard .c-foot{margin-top:auto}

/* =========================================================================
   PARTNERS
   ========================================================================= */
/* Section 1: row of cards on tint */
.partner-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.3rem}
.partner{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:1.5rem;box-shadow:var(--shadow-sm)}
.partner-logo{width:100%;height:66px;display:flex;align-items:center;justify-content:center;
  background:var(--cream);border-radius:10px;margin-bottom:1.1rem;padding:.6rem 1rem;border:1px solid var(--line-soft)}
.partner-logo img{max-width:100%;max-height:100%;width:auto;object-fit:contain}
.partner-name{font-size:1.3rem;margin:0 0 .5rem}
.partner-name a{color:var(--forest)}
.partner-name a:hover{color:var(--honey-2);text-decoration:none}
.partner-desc{font-size:1rem;color:var(--ink-soft);margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pm-toggle{position:absolute;opacity:0;pointer-events:none}
.pm-toggle:checked ~ .partner-desc{-webkit-line-clamp:unset;overflow:visible}
.pm-more{font-family:var(--sans);font-weight:700;font-size:.9rem;color:var(--honey-2);cursor:pointer;
  margin-top:.55rem;display:inline-block;user-select:none}
.pm-more:hover{color:var(--forest)}
.pm-more::after{content:'Read more +'}
.pm-toggle:checked ~ .pm-more::after{content:'Read less –'}
.partner-cta{margin-top:1.1rem;font-family:var(--sans);font-weight:700;font-size:.95rem;color:var(--forest);
  align-self:flex-start;border-bottom:2px solid var(--honey-soft);padding-bottom:2px}
.partner-cta:hover{color:var(--honey-2);border-color:var(--honey);text-decoration:none}

/* Section 2: strip variant on forest */
.partner-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem}
.partner.on-forest{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14)}
.partner.on-forest .partner-logo{background:#fbfaf3;border-color:transparent}
.partner.on-forest .partner-name a{color:#fbfaf3}
.partner.on-forest .partner-name a:hover{color:var(--honey-soft)}
.partner.on-forest .partner-desc{color:#c3d0c0}
.partner.on-forest .partner-cta{color:var(--honey-soft);border-color:rgba(230,199,137,.5)}
.partner.on-forest .partner-cta:hover{color:#fff}
.partner.on-forest .pm-more{color:var(--honey-soft)}

/* =========================================================================
   MISSION / VISION TRIPTYCH
   ========================================================================= */
.triptych{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.trip{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:1.8rem;position:relative;
  box-shadow:var(--shadow-sm)}
.trip .num{font-family:var(--serif);font-style:italic;color:var(--sage);font-size:1.1rem;font-weight:500}
.trip h3{font-size:1.5rem;margin:.3rem 0 .6rem}
.trip p{margin:0;color:var(--ink-soft);font-size:1.03rem}
@media(max-width:760px){.triptych{grid-template-columns:1fr}}

/* =========================================================================
   ARTICLE / POST LAYOUT
   ========================================================================= */
.post-hero{background:var(--forest);color:#e9efe6;padding:clamp(2.6rem,6vw,4.6rem) 0 clamp(2.4rem,5vw,3.6rem)}
.post-hero .wrap{max-width:52rem}
.post-hero .crumbs{font-size:.9rem;color:#a9bba6;margin-bottom:1.2rem}
.post-hero .crumbs a{color:#cdd8c9}
.post-hero .crumbs a:hover{color:#fff}
.post-hero .tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}
.post-hero .tags span{font-family:var(--sans);font-weight:700;font-size:.85rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--honey-soft);background:rgba(230,199,137,.14);padding:.4em .9em;border-radius:999px}
.post-hero h1{color:#fbfaf3;font-size:clamp(2.1rem,5.2vw,3.5rem);font-weight:500;line-height:1.06;margin:0}
.post-hero .dek{font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,2.6vw,1.5rem);color:#cdd8c9;
  margin:1.1rem 0 0;line-height:1.45}

.post-figure-full{margin:0;background:var(--sage-soft)}
.post-figure-full img{width:100%;max-height:520px;object-fit:cover}
.post-figure-full figcaption,.figure figcaption{font-family:var(--sans);font-size:.95rem;color:var(--ink-soft);
  padding:.7rem clamp(1.1rem,4vw,2.4rem);background:var(--cream-2);text-align:center;font-style:normal}

.article{padding:clamp(2.4rem,5vw,4rem) 0 clamp(3rem,6vw,5rem)}
.article .wrap{max-width:var(--read)}
.article p,.article li{font-size:1.5rem;line-height:1.75}
.article > .wrap > p:first-of-type::first-letter,.article .lead-drop::first-letter{
  font-family:var(--serif);float:left;font-size:4.6rem;line-height:.78;font-weight:500;color:var(--honey);
  margin:.35rem .55rem 0 0}
.article h2{font-size:clamp(1.7rem,3.6vw,2.3rem);margin:2.4rem 0 .9rem;font-weight:500}
.article h2::before{content:'';display:block;width:44px;height:3px;background:var(--honey);border-radius:2px;margin-bottom:.9rem}
.article h3{font-size:clamp(1.35rem,2.8vw,1.7rem);margin:1.8rem 0 .6rem;color:var(--forest-2)}
.article a{border-bottom:1px solid var(--honey-soft)}
.article a:hover{text-decoration:none;border-color:var(--honey)}
.article ul,.article ol{margin:0 0 1.4rem;padding-left:0;list-style:none}
.article ul li,.article ol li{font-size:1.5rem;line-height:1.65;padding-left:2.2rem;position:relative;margin-bottom:.9rem}
.article ul li::before{content:'';position:absolute;left:.4rem;top:.72em;width:9px;height:9px;border-radius:50%;
  background:var(--sage)}
.article ol{counter-reset:li}
.article ol li{counter-increment:li}
.article ol li::before{content:counter(li);position:absolute;left:0;top:.05em;width:1.5rem;height:1.5rem;
  background:var(--honey);color:#fff;border-radius:50%;font-family:var(--sans);font-weight:700;font-size:.85rem;
  display:flex;align-items:center;justify-content:center;line-height:1}

/* figures inside body */
.figure{margin:2.2rem 0;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.figure img{width:100%}
.figure.right{float:right;width:min(46%,320px);margin:.4rem 0 1.4rem 2rem}
.figure.left{float:left;width:min(46%,320px);margin:.4rem 2rem 1.4rem 0}
@media(max-width:640px){.figure.right,.figure.left{float:none;width:100%;margin:2rem 0}}

/* pull quote */
.pullquote{margin:2.4rem 0;padding:0 0 0 1.6rem;border-left:4px solid var(--honey);
  font-family:var(--serif);font-size:clamp(1.5rem,3.4vw,2rem);line-height:1.32;color:var(--forest);font-style:italic}
.pullquote cite{display:block;font-family:var(--sans);font-style:normal;font-weight:700;font-size:.95rem;
  color:var(--honey-2);margin-top:.8rem;letter-spacing:.02em}

/* callout / takeaways */
.callout{margin:2.2rem 0;background:var(--sage-tint);border:1px solid var(--sage-soft);border-radius:var(--r);
  padding:clamp(1.4rem,3vw,2rem)}
.callout .eyebrow{color:var(--moss);margin-bottom:.6rem;display:block}
.callout h4{font-family:var(--serif);font-size:1.4rem;margin:0 0 .8rem;color:var(--forest)}
.callout ul{margin:0;padding:0}
.callout ul li{font-size:1.12rem;line-height:1.5;padding-left:1.9rem;margin-bottom:.7rem}
.callout ul li::before{content:'✓';color:var(--moss);background:none;width:auto;height:auto;font-weight:800;
  left:0;top:.05em;font-size:1.05rem}
.callout p:last-child{margin-bottom:0}

.factbox{margin:2.2rem 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.factbox .fact{background:var(--paper);padding:1.4rem 1.2rem;text-align:center}
.factbox .fact b{display:block;font-family:var(--serif);font-size:2.2rem;color:var(--honey-2);line-height:1;font-weight:500}
.factbox .fact span{display:block;font-size:.95rem;color:var(--ink-soft);margin-top:.5rem;line-height:1.35}

/* end / share row */
.post-foot{border-top:1px solid var(--line);margin-top:3rem;padding-top:1.8rem;display:flex;flex-wrap:wrap;
  gap:1rem;justify-content:space-between;align-items:center}
.post-foot .who{display:flex;gap:.9rem;align-items:center}
.post-foot .who img{width:52px;height:52px;border-radius:50%;object-fit:cover;background:var(--sage-soft)}
.post-foot .who b{color:var(--forest);font-family:var(--serif);font-size:1.15rem}
.post-foot .who span{display:block;font-size:.92rem;color:var(--ink-soft)}

/* related */
.related{background:var(--cream-2);padding:clamp(2.6rem,5vw,4rem) 0}

/* =========================================================================
   ABOUT PAGE
   ========================================================================= */
.about-hero{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.8rem,4vw,3.5rem);align-items:center}
.about-hero .portrait{border-radius:20px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:1/1;background:var(--sage-soft)}
.about-hero .portrait img{width:100%;height:100%;object-fit:cover}
@media(max-width:760px){.about-hero{grid-template-columns:1fr}}
.belief-band{display:grid;grid-template-columns:repeat(2,1fr);gap:1.4rem}
@media(max-width:760px){.belief-band{grid-template-columns:1fr}}
.prose{max-width:var(--read)}
.prose p{font-size:1.45rem;line-height:1.72}

/* =========================================================================
   CONTACT PAGE
   ========================================================================= */
.contact-split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.8rem,4vw,3.5rem);align-items:start}
@media(max-width:800px){.contact-split{grid-template-columns:1fr}}
.contact-card{background:var(--forest);color:#e9efe6;border-radius:20px;padding:clamp(1.8rem,4vw,2.8rem);
  box-shadow:var(--shadow)}
.contact-card h3{color:#fbfaf3}
.contact-lines{list-style:none;margin:1.6rem 0 0;padding:0;display:grid;gap:1.2rem}
.contact-lines li{display:flex;gap:1rem;align-items:flex-start}
.contact-lines .ico{flex:none;width:44px;height:44px;border-radius:12px;background:rgba(230,199,137,.16);
  display:flex;align-items:center;justify-content:center;font-size:1.3rem}
.contact-lines .lbl{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--honey-soft);font-weight:700}
.contact-lines a,.contact-lines .val{color:#fbfaf3;font-size:1.2rem;font-family:var(--serif)}
.contact-lines a:hover{color:var(--honey-soft)}
.ask-list{list-style:none;margin:1.4rem 0 0;padding:0;display:grid;gap:.8rem}
.ask-list li{padding-left:1.9rem;position:relative;font-size:1.12rem;color:var(--ink-soft)}
.ask-list li::before{content:'→';position:absolute;left:0;color:var(--honey);font-weight:800}

/* =========================================================================
   STATEMENT FOOTER
   ========================================================================= */
.site-footer{background:var(--forest);color:#dbe4d3;padding:clamp(3rem,7vw,5.5rem) 0 2rem;position:relative;overflow:hidden}
.footer-statement{font-family:var(--serif);font-weight:500;font-size:clamp(2.2rem,6.5vw,5rem);line-height:1.02;
  color:#fbfaf3;letter-spacing:-.02em;max-width:20ch}
.footer-statement em{font-style:italic;color:var(--honey-soft)}
.footer-cta{margin:2rem 0 3rem;display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}
.footer-bar{border-top:1px solid rgba(255,255,255,.14);padding-top:1.6rem;display:flex;flex-wrap:wrap;gap:1rem 2rem;
  align-items:center;justify-content:space-between}
.footer-nav{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;list-style:none;margin:0;padding:0}
.footer-nav a{color:#c3d0c0;font-weight:600;font-size:.95rem}
.footer-nav a:hover{color:var(--honey-soft);text-decoration:none}
.footer-brand b{font-family:var(--serif);font-size:1.2rem;color:#fbfaf3}
.footer-fine{color:#8ea08a;font-size:.9rem;margin-top:1.4rem}
.footer-fine a{color:#a9bba6}
@media(max-width:600px){
  .footer-bar{flex-direction:column;align-items:flex-start;gap:1.2rem}
}

/* utility */
.mt0{margin-top:0}.mb0{margin-bottom:0}
.stack-sm{display:grid;gap:.4rem}
.divide-note{font-size:.95rem;color:var(--ink-soft)}

/* sp-roll-normalize: a logo roll keeps object-fit and loses its geometry.
   It used to set width:auto, height:46px, max-width:172px and min-width:30px, which let
   every plate in the roll shrink-wrap its own artwork — evbb measured 62px next to 204px
   in the SAME ROW. The operator's rule is that the dark ground is unified whatever the
   logo's size, so the plate cannot be sized by the logo. Geometry belongs to Design. */
[class~="roll"] .sponsor img,[class*="roll-"] .sponsor img,[class*="-roll"] .sponsor img{object-fit:contain}

/* sp-contain-guard: sponsor logos are wordmarks — never object-fit:cover (crops).
   object-fit ONLY. This block used to also set width:auto, padding:4px 10px,
   max-width:calc(100% - 20px) and min/max-height, which overrode Design's own frame and
   let every plate shrink-wrap its logo — the recurring "inconsistent sizing" and
   "lacks padding". Geometry belongs to Design. */
.sponsor img,.sponsor-box img,.sp-logo img{object-fit:contain!important;display:block;margin-left:auto;margin-right:auto;align-self:center}

/* sp-mark-align: marks sit CENTRED in their box. Placement only — Design's size,
   padding, panel and object-fit are untouched. */
.sponsor img,.sponsor-box img,.sp-logo img{object-position:center!important;margin-left:auto!important;margin-right:auto!important;display:block}
.sponsor .sp-logo,.sponsor-box{display:flex;align-items:center;justify-content:center}

/* sp-tile-uniform: a slot never grows to fill its row — every tile the same width in
   every row, whatever the count. Only flex-grow is touched. */
.sponsor{flex-grow:0!important}
.sponsor.lead-line,.sponsor.feat.lead-line{flex-grow:1!important}
.sponsor:not(.lead-line){flex-basis:var(--sp-tile,232px)!important}
.partner > .sponsor{flex:0 0 auto!important}
.partner-logo{flex-wrap:wrap!important}
.partner-logo > .sponsor{flex:1 1 var(--sp-min,220px)!important;min-width:min(220px,100%)!important}
.sponsor:not(.lead-line){grid-column:span 1!important;grid-row:span 1!important}

/* sp-blurb-stack: a slot holding BOTH a mark and our copy stacks them —
   a fixed-height row clips the mark once the copy is un-hidden. */
.sponsor:has(> img):has(> .sponsor-blurb:not(:empty)){flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;height:auto!important;min-height:0!important;overflow:visible!important;gap:8px}
.sponsor:has(> img):has(> .sponsor-blurb:not(:empty)) > img{align-self:flex-start}

/* sp-blurb-unhide: every supporter slot shows its text — no half-texted grids */
.sponsor-blurb:not(:empty){display:block!important;line-height:1.5}

/* sp-blurb-size: the design never sized .sponsor-blurb, so it inherited body copy.
   Relative, so it still follows the design's scale. */
.sponsor .sponsor-blurb{font-size:.8em;line-height:1.45}
.sponsor .sp-brand{font-weight:700}

/* sp-tile-fit: a slot fills its track, keeps a symmetric inset, and cannot be inflated
   by one long line of our copy. */
.sponsor.sponsor{width:100%!important;box-sizing:border-box!important;align-self:stretch!important;align-items:center!important;height:auto!important;min-height:0!important;overflow:hidden}
.sponsor.sponsor{justify-content:center!important}
:has(> .sponsor.sponsor){align-items:stretch!important}
.sponsor.sponsor .sponsor-name{min-width:0!important;overflow-wrap:anywhere}
.sponsor.sponsor > img{flex:0 0 auto!important;align-self:center!important}
.sponsor.sponsor > .sponsor-txt,.sponsor.sponsor > span:not(.sponsor-name):not(.sponsor-box):not(.sp-logo):not(.sponsor__logo){flex:1 1 auto!important;min-width:0!important}
.sponsor.sponsor .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;margin:0!important}
/* the mobile un-clamp is retired: the operator asked for "2-3 rows max" on phones, which is
   what the desktop rule above already does — so mobile simply keeps it. */
@media (max-width:640px){.sponsor.sponsor .sponsor-blurb{-webkit-line-clamp:3!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;overflow:hidden!important}}

/* sp-blurb-link: money-link anchors in blurbs must inherit the blurb colour (readable on dark OR light tiles) */
.sponsor-blurb a{color:inherit;text-decoration:underline;text-underline-offset:2px}
/* sp-text-contrast: sponsor copy measured against its OWN ground as a WCAG contrast RATIO, not as a
   luminance subtraction. The subtraction passed capitanalatriste's blurbs at a 75-point gap
   while they sat at 2.8:1 and could not be read. Bar is 4.5:1 for body copy, 3:1 for large or
   bold; opacity is folded in, because it compounds down the tree and computed colour ignores
   it. The lift keeps Design's hue and saturation and moves lightness only, by the smallest
   step that clears the bar, so a warm blurb on near-black stays warm. Colour only — size,
   weight, family and spacing are exactly as delivered. */
.sp-brand.sp-brand{color:rgb(117,184,148)!important;opacity:1!important}

/* sp-mark-frame: a uniform plate for the money mark, in the tiers where Design sized the plate
   to the artwork instead. Operator's rule: the dark ground is unified whatever the logo's
   size. width:100% (or one fixed width where copy shares the row) + one height for the tier
   + object-fit:contain, so the plate is the same box everywhere and the artwork fits inside
   it. A ground and an inset are added ONLY where none exists — adding a second ground gives
   co-cure's rectangle-inside-a-rectangle. Design's framed tiers are not touched at all. */
.partner-grid .partner .partner-logo.partner-logo{background:#121013!important;padding:8px 12px!important;box-sizing:border-box!important}
.partner-grid .partner .partner-logo.partner-logo{display:block!important;width:100%!important}
.partner-grid .partner.partner img{height:44px!important;display:block!important;width:100%!important;background:transparent!important;width:100%!important;padding:0!important}
.partner-strip .on-forest.partner .partner-logo.partner-logo{background:#121013!important;padding:8px 12px!important;box-sizing:border-box!important}
.partner-strip .on-forest.partner .partner-logo.partner-logo{display:block!important;width:100%!important}
.partner-strip .on-forest.partner.on-forest.partner img{height:44px!important;display:block!important;width:100%!important;background:transparent!important;width:100%!important;padding:0!important}

/* op-money-columns: the supporters block ran one tile per row — 11 tiles,
   3434px at 390, 23% of the whole page. Two columns bring it to
   2000px (42% shorter). Checked before writing: no new overflow, smallest mark still
   93px wide, longest blurb 2 lines, tile heights 297-345px.
   A block that fails any of those is left in one column — two narrow columns can make a block
   TALLER once the copy rewraps, which is the case the operator warned about.
   An odd tile count means the lead tile spans the whole row, so the block does not end on an empty cell. Only the tier(s) that were one-per-row are touched (.partner-grid, .partner-strip), never the section
   that holds several tiers: forcing a grid on that would put a featured row and a regulars run
   side by side. Phone widths only. */
@media (max-width:640px){
  .partner-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:21px!important}
    .partner-grid > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .partner-grid > * *{min-width:0!important;max-width:100%}
    .partner-grid img,.partner-grid svg{max-width:100%;height:auto}
  .partner-strip{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:21px!important}
    .partner-strip > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .partner-strip > * *{min-width:0!important;max-width:100%}
    .partner-strip img,.partner-strip svg{max-width:100%;height:auto}

}

/* op-odd-tier-lead: .partner-strip (5 tiles) lay out two per row with an ODD tile count, so the
   block ended on a lone tile beside an empty cell. The lead tile takes the whole row instead —
   operator: "the 1st item in such rows to be 100% width, then split" — so the grid reads as
   complete. These tiers were already two-per-row, which is why the column pass never wrote the
   rule for them. Checked before writing: no new horizontal overflow, block not more than 15%
   taller. Phone widths only; desktop keeps Design's layout. */
@media (max-width:640px){
  .partner-strip:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
}
/* op-heading-levels */
h3:where(.rt-h4){font-family: var(--serif); color: var(--forest); font-weight: 500; line-height: 1.12; margin: 0px 0px 0.5em; letter-spacing: -0.01em;}
h2:where(.rt-h4){font-family: var(--serif); color: var(--forest); font-weight: 500; line-height: 1.12; margin: 0px 0px 0.5em; letter-spacing: -0.01em;}
.callout h3:where(.rt-h4){font-family: var(--serif); font-size: 1.4rem; margin: 0px 0px 0.8rem; color: var(--forest);}
.callout h2:where(.rt-h4){font-family: var(--serif); font-size: 1.4rem; margin: 0px 0px 0.8rem; color: var(--forest);}
h2.rt-h4.rt-h4{height:25.0938px}
/* op-heading-levels:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(article.acard > a.thumb > img,
  div.about-hero.wrap > div.portrait > img,
  div.card-grid > article.acard > img,
  div.feature > div.fig > img,
  div.hero-media > div.frame > img,
  div.post-foot > div.who > img,
  div.wrap > figure.figure > img,
  div.wrap > figure.figure.left > img,
  div.wrap > figure.figure.right > img,
  main > figure.post-figure-full > img){height:auto}
/* op-img-dims:end */