/*
 * WCAG 2.1 AA colour-contrast overrides (added 2026-09-21).
 *
 * Loaded AFTER the compiled Tailwind bundle (/_astro/about.*.css), which we
 * don't hand-edit. Each rule darkens a utility colour that measured below
 * 4.5:1 against the light backgrounds it is used on (axe-core audit of every
 * public page). Ratios are against white; all also pass on the site's light
 * tints (gray-50/100, slate-50, pw-50, orange/green/amber-50).
 *
 *   text-gray-400/500  #9ca3af/#6b7280 -> #5f6773   (2.5:1 / 4.4:1 -> 5.9:1)
 *   text-slate-500     #64748b         -> #556479
 *   text-orange-600    #ea580c         -> #c2410c   (3.6:1 -> 5.2:1)
 *   text-green-600     #16a34a         -> #15803d   (3.3:1 -> 5.0:1)
 *   text-amber-600     #d97706         -> #b45309
 *   text-red-500/600   #ef4444/#dc2626 -> #dc2626/#b91c1c
 *   bg-green-600       #16a34a         -> #15803d   (white text 3.3:1 -> 5.0:1)
 *   bg-amber-500/600   #f59e0b/#d97706 -> #b45309   (white text 2.1-3.2:1 -> 5.0:1)
 *   text-blue-500      #3b82f6         -> #2563eb
 *   bg-red-500/green-500  -> #dc2626/#15803d   (white 9px menu badges "HOT"/"FREE", 3.8/2.3:1 -> 4.8/5.0:1)
 */
.text-gray-400,.text-gray-500{color:#5f6773}
.text-slate-500{color:#556479}
.text-orange-600{color:#c2410c}
.text-green-600{color:#15803d}
.text-amber-600{color:#b45309}
.text-red-500{color:#dc2626}
.text-red-600{color:#b91c1c}
.bg-green-600{background-color:#15803d}
.bg-amber-500,.bg-amber-600{background-color:#b45309}
.bg-red-500{background-color:#dc2626}
.bg-green-500{background-color:#15803d}
.text-blue-500{color:#2563eb}
/* WCAG 1.4.10 reflow: long footer links (e.g. the info@ email address) must wrap inside their column at 320px */
footer a,footer li{overflow-wrap:anywhere}
/* WCAG 1.4.10 reflow at 320px: flex inputs must be allowed to shrink; tighten the header row on very narrow screens */
input.flex-1,select.flex-1{min-width:0}
@media (max-width:400px){
  /* Spanish header has no hamburger: logo + Contacto + region + language can't share one 320px row, so stack them */
  html[lang^="es"] nav > div > div.flex.justify-between{flex-wrap:wrap;height:auto;padding-top:.25rem;padding-bottom:.25rem;row-gap:.25rem}
  html[lang^="es"] nav > div > div.flex.justify-between > .flex.items-center.gap-3{width:100%;flex-wrap:wrap;justify-content:flex-start;gap:.35rem .75rem}
}
/* WCAG 2.2.2: nothing may blink/pulse indefinitely (was on the HOT badge; the pulse also dropped its contrast) */
.animate-pulse{animation:none}
/* menu category labels */
.text-purple-500{color:#9333ea}
.text-indigo-500{color:#4f46e5}
.text-orange-500{color:#c2410c}
.text-green-500{color:#15803d}
/* classes used in markup but never generated into the compiled bundle (text rendered black on dark hero bands) */
.text-blue-100{color:#dbeafe}
.text-blue-200{color:#bfdbfe}
/* light tints for stat text on dark panels (canada-crtc latency card): >=4.5:1 on the dark gradient */
.text-red-300{color:#fca5a5}
.text-green-300{color:#86efac}
.text-amber-300{color:#fcd34d}
/* placeholder text must meet 4.5:1 too (was #9ca3af, 2.5:1) */
input::placeholder,textarea::placeholder,.placeholder\:text-gray-400::placeholder{color:#6b7280;opacity:1}
/* these classes are also used on the dark navy hero band, where the original light gray is correct */
.bg-pw-950 .text-gray-400,.bg-pw-950 .text-gray-500{color:#9ca3af}
