/* VERDANT Organics: shared accessibility layer.
   Linked after each page's inline <style> so these rules win.
   Visual and CSS only: focus ring and text contrast fixes. */

:root{--mocha-text:#896251;--focus-ring:var(--teal)}

/* 1. Keyboard focus ring (keyboard only, mouse styling unchanged) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible,summary:focus-visible{
  outline:2px solid var(--focus-ring) !important;outline-offset:2px}

/* Dark grounds: white ring */
#hdr:not(.scrolled),.nav-links.open,
footer,.hero,.phero,.post-hero,.doc-head,.contact-top,.news-top,.press-top,
.zimmern:not(:has(.zimmern-body)),.marquee,.facility,.split .panel.teal,.split2 .panel.dark,.diff-card.photo,
.aud-chefs .panel,.location,.howard,.statement,.excited,.cta,.revelation,.turning,section.pillars,.ip,
.how,.advantage,.validation,.cea,.contact,.band,.lb,.g-item,.kit-cta,.upanel.dark,.tile .prev.dark,
.usage .panel.dark,.tile.teal,.cipa.c1,.name-tile{--focus-ring:#fff}
/* White cards that sit inside dark sections go back to teal */
.form-shell,.contact-card{--focus-ring:var(--teal)}
/* Desktop dropdown submenu sits on a light panel inside the transparent header */
@media(min-width:901px){#hdr .submenu{--focus-ring:var(--teal)}}

/* 2. Newsletter form controls */
.nl-name input,.nl-row input[type=email]{border-color:#556677}
.nl-name input:focus,.nl-row input[type=email]:focus{border-color:var(--teal)}
.nl-name input:focus-visible,.nl-row input[type=email]:focus-visible{outline:2px solid var(--teal) !important;outline-offset:2px}

/* 3. Lime text on light grounds: teal */
.team-sub,.kit-sub,.fact span,.contact-card span,.phase .num,
.sec-head .eyebrow,.hier th,.toc a::before{color:var(--teal)}

/* 4. Colored titles on plain white difference cards (photo cards stay white) */
.diff-card:not(.photo):nth-child(2) h3,.diff-card:not(.photo):nth-child(3) h3{color:var(--teal)}

/* 5. Small mocha text on paper, mist and white: deeper text-only mocha */
.member .role,.bio-head .bio-id .role,.head .meta span,.market .tag,.aqua-mark .cap,.explore-card .go,
.eyebrow.mocha,.story-block .step,.release .date,.quote .who span,.pull-quote .attr,.quote .attr,
.f-game .accent-word,.room-caption,.prec-protect,.cipa-protect,.cov .outlet{color:var(--mocha-text)}
.body-link:hover,.ind-link:hover,.pc-more:hover,.post-body a:hover,.g-credit a:hover,.contact-card a.mail:hover{color:var(--mocha-text)}