/* =========================================================================
   COEXIST COFFEE CO. — ACCESSIBILITY BASICS
   -------------------------------------------------------------------------
   Sitewide: a skip-to-content link, and a visible focus state for every
   interactive element (product cards, cart/menu icons, filter & enquiry
   chips, nav links...). None of the page's own inline <style> blocks
   define a general focus treatment, so this doesn't fight any existing
   rule — it's pure addition.

   Uses `currentColor` for the outline so it automatically follows each
   section's text color (paper on dark sections, ink on light ones)
   instead of needing separate rules per background.
   ========================================================================= */

.skip-link{
  position:fixed;top:-100px;left:12px;z-index:3000;
  background:#0e0e0d;color:#faf9f6;
  font-family:'Urbanist',sans-serif;font-weight:600;font-size:13px;
  padding:12px 20px;border-radius:6px;
  transition:top .2s ease;
}
.skip-link:focus{top:12px;}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible{
  outline:2px solid currentColor;
  outline-offset:3px;
  border-radius:2px;
}

/* a couple of components sit on decorative/graphic backgrounds where
   currentColor isn't reliably legible — pin those to explicit colors */
.product-card:focus-visible,
.product-figure:focus-visible{
  outline-color:#0e0e0d;
}
.section-inverted .product-card:focus-visible{
  outline-color:#faf9f6;
}