/* ============================================================
   vv-overrides.css — Valley Vista Psychiatry accessibility &
   contrast overrides. Loads AFTER assets/index-Bcevf3fn.css.
   Override-only: every rule is safe to no-op if its selector
   stops matching a future build. Do not add layout rules here.
   Sections: 1 focus, 2 reduced motion, 3 contrast, 4 scroll,
   5 tap targets, 6 hover/keyboard affordance, 7 forms, 8 type.
   Maintained via seo-tools workflow (data-vv-seo2 channel).
   ============================================================ */

/* ---- 1. FOCUS VISIBILITY ------------------------------------
   !important required: bundle utilities set focus:outline-none. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--vv-teal, #2DD4BF) !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 6px rgba(15, 79, 74, .45) !important;
}

/* ---- 2. REDUCED MOTION + inline-opacity rescue ---------------
   SSR shells ship style="opacity: 0" that framer-motion animates
   in; with motion reduced we force them visible immediately. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  /* Keep loading spinners meaningful (slower, still spinning). */
  .animate-spin {
    animation-duration: 1.5s !important;
    animation-iteration-count: infinite !important;
  }
  [style*="opacity: 0"] {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ---- 3. CONTRAST FIXES ---------------------------------------
   Escaped Tailwind arbitrary-value class selectors. */
/* Eyebrow labels: 2.0:1 -> 4.99:1 on white. p-scoped so the hero
   span and wordmark are untouched. */
p.text-\[\#5EC8C0\] { color: #0F766E; }
/* Primary CTA: white-on-orange 2.83:1 -> 5.07:1.
   VISUALLY NOTICEABLE change — flagged to owner in commit note. */
.bg-\[\#D4892A\] { background-color: #A05F15; }
.hover\:bg-\[\#bf7a22\]:hover { background-color: #8F5513; }
/* Hero glass pill text on dark backdrop. */
.backdrop-blur-sm .text-\[\#D4892A\] { color: #F0AC5E; }
/* Low-alpha white text on dark surfaces. */
.text-white\/40 { color: rgba(255, 255, 255, .65); }
.text-white\/60 { color: rgba(255, 255, 255, .78); }
.text-white\/70 { color: rgba(255, 255, 255, .85); }
.text-white\/75 { color: rgba(255, 255, 255, .9); }
/* Footer wordmark intentionally untouched (inline, decorative). */

/* ---- 4. SCROLL BEHAVIOR --------------------------------------
   Sticky h-16 header otherwise hides in-page anchor targets. */
html {
  scroll-behavior: smooth;
  scroll-padding-top: 88px;
}

/* ---- 5. TAP TARGETS ------------------------------------------ */
header button[aria-label="Search"],
header button[aria-label="Toggle menu"],
footer button[aria-label="Subscribe"] {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
[role="group"][aria-label="Choose your state"] > button {
  min-height: 32px;
  min-width: 48px;
}
footer ul a {
  display: inline-block;
  padding: .3rem 0;
  margin: -.3rem 0;
}
header nav a {
  padding-top: .625rem;
  padding-bottom: .625rem;
}

/* ---- 6. TOUCH/KEYBOARD AFFORDANCE ----------------------------
   "Learn More" links are hover-revealed; expose them on touch
   devices and on keyboard focus. */
@media (hover: none) {
  .opacity-0.group-hover\:opacity-100 { opacity: 1; }
}
.group a:focus-visible .group-hover\:opacity-100 { opacity: 1; }
/* In-copy links must not rely on color alone. */
main p a {
  text-decoration: underline;
  text-underline-offset: 2px;
}
button,
a { touch-action: manipulation; }

/* ---- 7. FORMS -------------------------------------------------
   16px input text prevents iOS zoom; visible focus affordance;
   readable placeholder on dark footer. */
.input,
footer input[type="email"] { font-size: 1rem; }
.input:focus { box-shadow: 0 0 0 3px rgba(160, 95, 21, .25); }
footer input::placeholder { color: rgba(255, 255, 255, .65); }

/* ---- 8. TYPOGRAPHY MICRO -------------------------------------- */
.text-\[7px\] { font-size: 9px; }
h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }