/* Smartteller – WCAG 2.2 AA / BFSG layer. Loaded last on every page shell. */

/* 2.4.7 / 2.4.11 / 2.4.13 – clearly visible focus, never hidden behind sticky UI */
:where(a,button,input,select,textarea,summary,[tabindex]:not([tabindex="-1"])):focus-visible{
  outline:3px solid #0b6b37;outline-offset:3px;box-shadow:0 0 0 2px #fff,0 0 0 5px rgba(11,107,55,.35)
}
:where(.footer,.st-footer,.en-footer,.st-mega,.hero-dark,[class*="--dark"],[class*="-dark"]) :where(a,button,input,select,textarea,summary):focus-visible{
  outline-color:#fff;box-shadow:0 0 0 2px #0b3d24
}
html{scroll-padding-top:calc(var(--st-nav-height,78px) + 1.5rem);scroll-padding-bottom:7rem}
:where(main,[id]):target{scroll-margin-top:calc(var(--st-nav-height,78px) + 1.5rem)}

/* 2.5.8 – minimum target size (24x24 CSS px) for inline footer/nav/utility controls */
:where(.footer,.st-footer,.en-footer) button{min-height:24px;min-width:24px}
.st-footer__col a,.en-footer__grid a{min-height:24px}
:where(.lang-option,.nav-link,.st-nav__trigger,.consent-choice,.cookie-actions .btn){min-height:44px}
.en-footer__consent,.st-footer__legal button{background:none;border:0;padding:.25rem 0;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:.2em;cursor:pointer}

/* 1.4.4 / 1.4.10 – reflow and text resize */
img,video{max-width:100%}
:where(table){max-width:100%}

/* 2.3.3 / 2.2.2 – respect reduced motion completely */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .hero-mockup{animation:none!important}
}

/* Keyboard-reachable scroll containers (set up by a11y-enhance.js) */
[data-a11y-scroll]:focus-visible{outline:3px solid #0b6b37;outline-offset:-3px}

/* Consent dialog on localized shells */
.cookie-consent[hidden],.consent-backdrop[hidden]{display:none!important}

/* High contrast / forced colours */
@media (forced-colors:active){
  :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid Highlight!important;box-shadow:none!important}
  .consent-switch{border:1px solid CanvasText}
}

/* FAQ block (includes/faq-extra) */
.st-faq-extra{padding:clamp(2.5rem,6vw,4.5rem) 0;background:var(--surface-soft,#f7faf7)}
.st-faq-extra__inner{max-width:52rem}
.st-faq-extra h2{margin-bottom:1.25rem}
.st-faq-extra__item{background:var(--surface,#fff);border:1px solid var(--border,rgba(15,107,53,.2));border-radius:14px;margin:0 0 .75rem;overflow:hidden}
.st-faq-extra__item summary{cursor:pointer;padding:1rem 1.25rem;font-weight:700;color:var(--text,#102015);min-height:44px;display:flex;align-items:center}
.st-faq-extra__answer{padding:0 1.25rem 1rem}
.st-faq-extra__answer p{margin:0;color:var(--text-soft,#4d5c52)}

/* ===== Contrast layer (WCAG 1.4.3 / 1.4.11) =====
 * Brand green #24a148 only reaches 3.2:1 on white. Solid #0f6b35 reaches 6.6:1 and keeps the brand look.
 * Dark sections declare color:#fff on the container, but the global h1-h6/p rules colour the children
 * directly, so headings/labels there inherit nothing. The rules below restore the intended light text. */
:root{--st-a11y-green:#0f6b35;--st-a11y-green-deep:#083f24;--st-a11y-muted:#4d5c52;--st-a11y-on-dark:#d7efde;--st-a11y-accent-on-dark:#8ee0ab}
.btn-primary,a.btn-primary,button.btn-primary,.btn.btn-primary{background:var(--st-a11y-green)!important;background-image:none!important;color:#fff!important;border-color:var(--st-a11y-green)!important}
.btn-primary:hover,.btn-primary:focus-visible{background:var(--st-a11y-green-deep)!important;color:#fff!important}
.btn-outline-light{color:#fff!important;border-color:#fff!important}

/* green text on light backgrounds */
.st-editorial-context__label,.pa-eyebrow,.pa-textlink,.breadcrumbs a,.breadcrumb-wrap a,.home-showcase__index{color:var(--st-a11y-green)}
.pa-flow__num{background:var(--st-a11y-green)!important;color:#fff!important}

/* muted grey text below 4.5:1 */
.st-editorial-context small{color:var(--st-a11y-muted)!important}
.st-editorial-context small,.pseo-score small,.pseo-preset-grid small,.platform-card small,.help-pagination span,.season-result span,.season-grid article>span,.usecase-switcher__card span,.home-seo-links a,.home-knowledge-grid span,.home-trust__panel>span,.home-trust__panel span,.home-trust__panel p,.pseo-preset-grid span,.home-kicker{color:var(--st-a11y-muted)}

/* section labels (designed for dark heroes) on light sections */
.season-label,.sds-label,.pseo-label,.sdl-label,.sdmp-label,.sdn-label,.sd-compare-label,.sd-label{color:var(--st-a11y-green)}
:is([class*="-hero"],[class*="-cta"],[class*="-tool"],.sd-section--dark,.en-section--dark,.intent-section--dark) :is(.season-label,.sds-label,.pseo-label,.sdl-label,.sdmp-label,.sdn-label,.sd-compare-label,.sd-label,.sd-ing-label,.help-eyebrow,.section-kicker){color:var(--st-a11y-accent-on-dark)}

/* chips that assumed a dark section */
.kh-topic-cloud a{background:#103c2c;border-color:#103c2c;color:#fff}
.kh-topic-cloud a:hover,.kh-topic-cloud a:focus-visible{background:#fff;color:#103c2c;border-color:#103c2c}

/* dark containers: headings, labels and emphasis inherit the container's light colour */
:is(.en-section--dark,.help-contact,.season-tool,.sdl-tool,.sdmp-tool,.sds-tool,.sdn-tool,.qai-tool,.trust-cta,.pseo-cta,.season-cta,.sdmp-cta,.qai-cta,.sdn-cta,.sdl-cta,.sds-cta,.sd-ing-tool__shell,.sd-ing-related,.reference-cta,.sd-section--dark,.intent-section--dark,.related,.senior-cta,.final-cta-section,.content-cta,.knowledge-cta,.kh-trust-box,.lm-section--dark,.faq-knowledge,.budget-cta,.ita-related,.st-tool-cta,.home-gallery) :is(h1,h2,h3,h4,h5,h6,label,strong){color:#fff!important}
:is(.en-section--dark,.help-contact,.trust-cta,.pseo-cta,.season-cta,.sdmp-cta,.qai-cta,.sdn-cta,.sdl-cta,.sds-cta,.sd-ing-tool__shell,.sd-ing-related,.reference-cta,.sd-section--dark,.intent-section--dark,.related,.senior-cta,.final-cta-section,.content-cta,.knowledge-cta,.kh-trust-box,.lm-section--dark,.faq-knowledge,.budget-cta,.ita-related,.st-tool-cta) :is(p,li,.ita-output p){color:var(--st-a11y-on-dark)}
:is(.en-section--dark,.help-contact,.trust-cta,.pseo-cta,.season-cta,.sdmp-cta,.qai-cta,.sdn-cta,.sdl-cta,.sds-cta,.sd-ing-tool__shell,.sd-ing-related,.reference-cta,.sd-section--dark,.intent-section--dark,.related,.senior-cta,.final-cta-section,.content-cta,.knowledge-cta,.kh-trust-box,.lm-section--dark,.faq-knowledge,.budget-cta,.ita-related,.st-tool-cta) a:not(.btn){color:var(--st-a11y-accent-on-dark)!important}
.section-kicker{color:var(--st-a11y-green)}
:is([class*="-cta"],.reference-cta,.intent-section--dark,.sd-section--dark,.en-section--dark,.help-contact,.budget-cta) .section-kicker{color:var(--st-a11y-accent-on-dark)}
.help-eyebrow{color:var(--st-a11y-accent-on-dark)}
.ita-output p{color:var(--st-a11y-on-dark)}
.sdn-plan strong,.sdmp-plan strong,.mistakes strong,.source-list strong{color:inherit}

.intent-steps li>span{color:var(--st-a11y-green)}
.intent-section--dark .intent-steps li>span{color:var(--st-a11y-accent-on-dark)}
.qai-primary{background:#fff!important;color:#083f24!important}
.qai-secondary{color:#fff!important;border-color:#fff!important}
.lm-downloads a{color:#fff!important}
.sd-ing-tool__shell h2{color:#fff!important}

.sd-house-related :is(h1,h2,h3,label,strong),.sd-ing-cta :is(h1,h2,h3,strong),.sd-ing-hero :is(h1,h2,h3,strong),.sd-section--dark .sd-heading :is(h2,h3){color:#fff!important}
.sd-house-related p,.sd-ing-cta p,.sd-ing-hero p{color:var(--st-a11y-on-dark)}
.sd-section--dark .sd-heading>span,.faq-knowledge .eyebrow{color:var(--st-a11y-accent-on-dark)}
.home-gallery .home-kicker--light{color:var(--st-a11y-accent-on-dark)}
.senior-section.related a:not(.btn){color:var(--st-a11y-accent-on-dark)!important}
.intent-steps li>span{color:var(--st-a11y-green)}

.home-section-head p:not(.home-kicker--light),.home-faq__intro .home-kicker{color:var(--st-a11y-muted)}
.home-showcase__copy .home-text-link{color:var(--st-a11y-accent-on-dark)}

.related-grid>a,.content-card,.cta-actions .btn,.final-cta .btn{min-height:48px}
