/* Per-section calm colors. AcePace blue (--accent) stays the brand and button color everywhere.
   Each section only tints headings, the hero band and a thin top rule. Dark = body.lowglare. Contrast checked by tools/contrast_check.js */
body[data-sec="sat"]{ --sec-tint:#E6EDF3; --sec-ink:#334A5F; --sec-rule:#9BAAB8; }
body[data-sec="act"]{ --sec-tint:#E6F0EC; --sec-ink:#346C57; --sec-rule:#9BC5B2; }
body[data-sec="ap"] { --sec-tint:#F7F0E3; --sec-ink:#5D4E27; --sec-rule:#D6B878; }
body.lowglare[data-sec="sat"]{ --sec-tint:#262E36; --sec-ink:#C1CBD3; --sec-rule:#324556; }
body.lowglare[data-sec="act"]{ --sec-tint:#263834; --sec-ink:#C2DBD0; --sec-rule:#33634F; }
body.lowglare[data-sec="ap"] { --sec-tint:#3C3423; --sec-ink:#E4D1A6; --sec-rule:#74581D; }
body[data-sec]:not([data-sec=""]) main h1, body[data-sec]:not([data-sec=""]) main > h2{ color:var(--sec-ink); }
body[data-sec]:not([data-sec=""]) main{ border-top:4px solid var(--sec-rule); }
.sec-hero{ display:flex; flex-direction:column; background:var(--sec-tint,var(--soft)); border-radius:14px; overflow:hidden; margin:0 0 1em; }
.sec-hero img{ display:block; width:100%; height:auto; max-height:200px; object-fit:cover; }
.sec-hero > div{ padding:.6em 1em .9em; color:var(--ink); }
.sec-hero h1{ margin:.1em 0 .2em; }
.sec-hero p{ margin:0; }
body.lowglare .sec-hero img{ filter:brightness(.72) saturate(.8); }
body.sensory .sec-hero img{ display:none; }   /* sensory-friendly hides decorative pictures, like the landing hero */

/* Oct 15: plain-language "Today:" line under each lesson title */
.lesson-today{ margin:.2em 0 .8em; font-size:1.05em; color:var(--ink); max-width:60ch; }
/* Oct 15: Official free resources page, one color theme per section */
.theme-sat{ --sec-tint:#E6EDF3; --sec-ink:#334A5F; --sec-rule:#9BAAB8; }
.theme-act{ --sec-tint:#E6F0EC; --sec-ink:#346C57; --sec-rule:#9BC5B2; }
.theme-ap { --sec-tint:#F7F0E3; --sec-ink:#5D4E27; --sec-rule:#D6B878; }
body.lowglare .theme-sat{ --sec-tint:#262E36; --sec-ink:#C1CBD3; --sec-rule:#324556; }
body.lowglare .theme-act{ --sec-tint:#263834; --sec-ink:#C2DBD0; --sec-rule:#33634F; }
body.lowglare .theme-ap{ --sec-tint:#3C3423; --sec-ink:#E4D1A6; --sec-rule:#74581D; }
.res-sec{ background:var(--sec-tint); border-top:4px solid var(--sec-rule); border-radius:14px; padding:.6em .9em .2em; margin:1.2em 0; }
.res-sec > h2{ color:var(--sec-ink); margin:.2em 0 .5em; }
.res-sec h3, .res-sec h4{ color:var(--sec-ink); }
.res-sec h4{ margin:.8em 0 .2em; }