/* =====================================================================
   ACCESSIBILITY WIDGET STYLES + THE SETTINGS IT APPLIES
   Works on any page. Uses the site's colours if present, with fallbacks.
   ===================================================================== */
.a11y-widget {
  --a11y-accent: var(--green, #609d35);
  --a11y-ink: #0B0B0B;
  --a11y-surface: #fff;
  --a11y-line: #d0d5ca;
  /* Sits above the mobile call bar (--callbar-h is set in styles.css) */
  --a11y-bottom: calc(var(--callbar-h, 0px) + 16px + env(safe-area-inset-bottom, 0px));
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 16px; /* widget stays the same size when page text is enlarged */
  line-height: 1.4;
  color: var(--a11y-ink);
}
.a11y-sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.a11y-fab {
  position: fixed; left: 16px; bottom: var(--a11y-bottom); z-index: 950;
  display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%;
  background: var(--a11y-ink); color: #fff; border: 2px solid var(--a11y-accent); cursor: pointer;
  box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
.a11y-fab:hover { background: #222; }
.a11y-fab:focus-visible, .a11y-panel button:focus-visible { outline: 3px solid var(--a11y-accent); outline-offset: 3px; }
.a11y-fab:focus-visible { outline-color: #fff; box-shadow: 0 0 0 6px var(--a11y-ink); }

.a11y-panel {
  position: fixed; left: 16px; bottom: calc(var(--a11y-bottom) + 64px); z-index: 960;
  width: min(320px, calc(100vw - 32px)); max-height: calc(100vh - var(--a11y-bottom) - 88px); overflow-y: auto;
  background: var(--a11y-surface); border: 2px solid var(--a11y-ink); border-radius: 16px;
  padding: 16px; box-shadow: 0 18px 50px rgba(0,0,0,.35);
}
.a11y-panel[hidden] { display: none; }
.a11y-panel__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.a11y-panel h2 { margin: 0; font: 700 1.25rem/1.2 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; text-transform: none; letter-spacing: 0; }
.a11y-panel button { font: inherit; color: inherit; cursor: pointer; }
.a11y-close { width: 44px; height: 44px; border-radius: 50%; border: 2px solid var(--a11y-line); background: none; font-size: 1.6rem !important; line-height: 1; }
.a11y-label { display: block; font-weight: 700; margin-bottom: 8px; }
.a11y-group { padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px solid var(--a11y-line); }
.a11y-size { display: grid; grid-template-columns: 56px 1fr 56px; gap: 8px; align-items: center; }
.a11y-size button { height: 48px; border-radius: 10px; border: 2px solid var(--a11y-ink); background: #fff; font-weight: 700; font-size: 1.05rem; }
.a11y-size button:disabled { opacity: .4; cursor: not-allowed; }
.a11y-size__value { text-align: center; font-weight: 700; }
.a11y-toggles { display: grid; gap: 8px; }
.a11y-toggle {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 8px 12px; text-align: left;
  border-radius: 10px; border: 2px solid var(--a11y-line); background: #fff; font-weight: 600;
}
.a11y-toggle__box { flex: none; width: 22px; height: 22px; border-radius: 6px; border: 2px solid var(--a11y-ink); display: grid; place-items: center; }
.a11y-toggle[aria-pressed="true"] { border-color: var(--a11y-ink); background: #eef5e8; }
.a11y-toggle[aria-pressed="true"] .a11y-toggle__box { background: var(--a11y-ink); }
.a11y-toggle[aria-pressed="true"] .a11y-toggle__box::after { content: ""; width: 6px; height: 11px; border: solid #fff; border-width: 0 3px 3px 0; transform: translateY(-1px) rotate(45deg); }
.a11y-reset { width: 100%; min-height: 48px; margin-top: 14px; border-radius: 10px; border: 2px solid var(--a11y-ink); background: var(--a11y-ink); color: #fff !important; font-weight: 700; }
.a11y-reset:hover { background: #2a2a2a; }

/* =====================================================================
   SETTINGS (classes added to <html>)
   ===================================================================== */

/* Text size: everything on the site is sized in rem, so this scales it all */
html.a11y-text-1 { font-size: 112.5%; }
html.a11y-text-2 { font-size: 125%; }
html.a11y-text-3 { font-size: 137.5%; }
html.a11y-text-4 { font-size: 150%; }

/* High contrast */
html.a11y-contrast {
  --green: #8fdc5c;
  --green-bright: #a8f070;
  --green-text: #1d3a0d;
  --text: #000;
  --text-muted: #000;
  --muted-on-dark: #fff;
  --text-on-dark: #fff;
  --line: #000;
  --ink-3: #fff;
  --fog: #fff;
}
html.a11y-contrast body { background: #fff; }
html.a11y-contrast .hero::before, html.a11y-contrast .hero::after,
html.a11y-contrast .cta-band::before, html.a11y-contrast .contact__direct::before,
html.a11y-contrast .page-hero::before, html.a11y-contrast .final-cta::before { display: none; }
html.a11y-contrast a { text-decoration: underline !important; }
html.a11y-contrast .field input, html.a11y-contrast .field select, html.a11y-contrast .field textarea,
html.a11y-contrast .radios label { border-color: #000; }

/* Grayscale (applied to page content, not to the widget itself) */
html.a11y-grayscale body > *:not(.a11y-widget) { filter: grayscale(1); }

/* Highlight links */
html.a11y-links a:not(.btn):not(.skip-link) {
  background: #fff200 !important; color: #000 !important; text-decoration: underline !important;
  text-decoration-thickness: 2px !important; outline: 2px solid #000; outline-offset: 1px;
}
html.a11y-links a:not(.btn):not(.skip-link) * { color: #000 !important; }
html.a11y-links a.btn { outline: 3px dashed #fff200; outline-offset: 3px; }

/* Readable (dyslexia-friendly) font: plain, wide, upright letterforms with extra spacing */
html.a11y-font {
  --font-body: Verdana, Tahoma, "Segoe UI", Arial, sans-serif;
  --font-display: Verdana, Tahoma, "Segoe UI", Arial, sans-serif;
}
html.a11y-font body { letter-spacing: 0.03em; word-spacing: 0.12em; line-height: 1.8; }
html.a11y-font h1, html.a11y-font h2, html.a11y-font h3, html.a11y-font .btn,
html.a11y-font .plan-card__amount, html.a11y-font .facts dd, html.a11y-font .step-list__num {
  font-style: normal; text-transform: none; letter-spacing: 0; line-height: 1.2;
}
html.a11y-font .hero__title { font-size: clamp(2rem, 1.4rem + 3.5vw, 3.75rem); }
html.a11y-font .review-card--short blockquote { font-style: normal; text-transform: none; font-size: 1.375rem; line-height: 1.4; }

/* Pause animations */
html.a11y-pause *, html.a11y-pause *::before, html.a11y-pause *::after {
  animation: none !important; transition: none !important; scroll-behavior: auto !important;
}
html.a11y-pause { scroll-behavior: auto !important; }

@media print { .a11y-widget { display: none !important; } }