/* ==========================================================================
   Acessibilidade (A11Y) — Meira Climatização / Solano Studio
   Componente padrão reaproveitado de outros projetos (painel de 16 recursos)
   ========================================================================== */

.visually-hidden{
  position: absolute !important; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

.skip-link{
  position: fixed; top: -80px; left: 16px; z-index: 500;
  background: var(--gradient-accent); color: #f2fbff;
  padding: 14px 22px; border-radius: var(--radius-md);
  font-family: var(--font-head); font-weight: 600; font-size: .9rem;
  text-decoration: none; transition: top .25s ease; box-shadow: var(--shadow-md);
}
.skip-link:focus{ top: 16px; }

.a11y-toggle{
  position: fixed; left: 24px; bottom: 26px; z-index: 190;
  width: 56px; height: 56px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--gradient-accent); color: #f2fbff;
  border: 2px solid rgba(255,255,255,.5); box-shadow: var(--shadow-md);
  transition: transform .2s ease, box-shadow .2s ease;
}
.a11y-toggle:hover{ transform: translateY(-2px) scale(1.05); box-shadow: 0 14px 34px rgba(14,127,166,.36); }
.a11y-toggle svg{ width: 28px; height: 28px; }
@media (max-width: 680px){
  .a11y-toggle{ left: 16px; bottom: 16px; width: 50px; height: 50px; }
  .a11y-toggle svg{ width: 24px; height: 24px; }
}

.a11y-overlay{ position: fixed; inset: 0; z-index: 191; background: rgba(10,25,36,.45); backdrop-filter: blur(2px); }

.a11y-panel{
  position: fixed; top: 0; left: 0; z-index: 192; width: min(380px, 100vw); height: 100%;
  background: var(--surface); border-right: 1px solid var(--border-soft);
  box-shadow: 20px 0 60px -20px rgba(19,40,58,.35);
  flex-direction: column; transform: translateX(-100%);
}
.a11y-panel:not([hidden]){ display: flex; animation: a11yPanelIn .3s ease forwards; }
@keyframes a11yPanelIn{ from{ transform: translateX(-100%); } to{ transform: translateX(0); } }

.a11y-panel__header{
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 22px 22px 18px; border-bottom: 1px solid var(--border-soft); flex-shrink: 0;
}
.a11y-panel__title{ font-family: var(--font-head); font-weight: 600; font-size: 1.15rem; margin: 0; display: flex; align-items: center; gap: 10px; color: var(--white); }
.a11y-panel__title svg{ color: var(--accent); flex-shrink: 0; }
.a11y-panel__close{
  width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: var(--surface-2); border: 1px solid var(--border); color: var(--white); font-size: 1.25rem; line-height: 1;
}
.a11y-panel__close:hover{ background: var(--border-soft); }

.a11y-panel__body{ padding: 20px 22px 28px; overflow-y: auto; flex: 1; }
.a11y-group{ margin-bottom: 26px; }
.a11y-group__label{
  display: block; font-family: var(--font-head); font-size: .68rem; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase; color: var(--text-dim); margin-bottom: 12px;
}
.a11y-group__row{ display: flex; align-items: center; gap: 10px; }
.a11y-chip{
  flex: 1; height: 44px; border-radius: var(--radius-sm); background: var(--surface-2);
  border: 1px solid var(--border); color: var(--text); font-weight: 600; font-size: .92rem;
  display: flex; align-items: center; justify-content: center;
}
.a11y-chip:hover{ border-color: var(--accent); }
.a11y-font-value{ min-width: 52px; text-align: center; font-size: .8rem; color: var(--text-dim); }

.a11y-toggles{ display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.a11y-option{
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; text-align: left;
  padding: 14px; border-radius: var(--radius-md); background: var(--surface-2); border: 1px solid var(--border);
  color: var(--text); transition: background .18s ease, border-color .18s ease;
}
.a11y-option svg{ width: 20px; height: 20px; color: var(--text-dim); flex-shrink: 0; transition: color .18s ease; }
.a11y-option span{ font-size: .78rem; font-weight: 600; line-height: 1.3; }
.a11y-option:hover{ border-color: var(--accent); }
.a11y-option.is-active{ background: rgba(14,127,166,.14); border-color: var(--accent); }
.a11y-option.is-active svg{ color: var(--accent); }
.a11y-option.is-active span{ color: var(--white); }
.a11y-option.is-active::after{ content:'✓'; margin-left: auto; color: var(--accent); font-weight: 700; }

.a11y-reset-btn{
  width: 100%; margin-top: 6px; padding: 13px; border-radius: var(--radius-sm);
  background: var(--surface-2); border: 1px solid var(--border); color: var(--text);
  font-weight: 600; font-size: .85rem; display: flex; align-items: center; justify-content: center; gap: 8px;
}
.a11y-reset-btn:hover{ background: rgba(201,122,106,.14); border-color: var(--danger); }

@media (max-width: 420px){ .a11y-panel{ width: 100vw; } }

/* ---------- Efeitos aplicados via classe em <html> ---------- */

html.a11y-contrast-high{
  --bg: #fff; --bg-alt: #fff; --surface: #fff; --surface-2: #f2f2f2;
  --border: #000; --border-soft: #000; --text: #000; --text-muted: #000; --text-dim: #111; --white: #000;
}
html.a11y-contrast-high a, html.a11y-contrast-high .btn{ text-decoration: underline; text-underline-offset: 3px; }
html.a11y-contrast-high .btn-primary{ background: #064a63 !important; color: #fff !important; }
html.a11y-contrast-high .card, html.a11y-contrast-high .form-panel{ border: 1px solid #000 !important; }

html.a11y-invert{ filter: invert(1) hue-rotate(180deg); }
html.a11y-invert img, html.a11y-invert video, html.a11y-invert iframe,
html.a11y-invert .a11y-toggle, html.a11y-invert .wpp-float, html.a11y-invert .a11y-panel{ filter: invert(1) hue-rotate(180deg); }

html.a11y-grayscale{ filter: grayscale(100%); }

html.a11y-theme-dark{
  --bg: #0d1820; --bg-alt: #0a131a; --surface: #13222d; --surface-2: #1a2c38;
  --border: #2c4555; --border-soft: #223845;
  --text: #e4eef3; --text-muted: #a9bfcc; --text-dim: #7d96a5; --white: #f4fafc;
}
html.a11y-theme-dark .hero::before, html.a11y-theme-dark .hero::after{ opacity: .6; }
html.a11y-theme-dark .site-header{ background: rgba(13,24,32,.86); }
html.a11y-theme-dark .hero-visual-badge{ background: rgba(13,24,32,.78); }
html.a11y-theme-dark .hero-visual-panel.is-illustration{ background: linear-gradient(160deg, #12303e 0%, var(--surface) 60%, #10262f 100%); }

html.a11y-link-highlight a:not(.btn):not(.wpp-float):not(.skip-link){
  text-decoration: underline !important; text-underline-offset: 4px; text-decoration-thickness: 2px;
  background: rgba(14,127,166,.14); padding: 1px 3px; border-radius: 3px;
}

html.a11y-btn-highlight :is(.btn, button, .wpp-float){ outline: 3px solid var(--accent) !important; outline-offset: 2px; }

html.a11y-line-height :is(p, li, .hero-lead, .card p){ line-height: 2 !important; }
html.a11y-letter-spacing :is(p, li, h1, h2, h3, h4, a, button, label, span){ letter-spacing: .06em !important; }

@font-face{
  font-family: "OpenDyslexic";
  src: url("https://cdn.jsdelivr.net/gh/antijingoist/opendyslexic/compiled/OpenDyslexic-Regular.woff") format("woff");
  font-weight: normal; font-style: normal; font-display: swap;
}
html.a11y-dyslexia-font :is(body, p, li, h1, h2, h3, h4, a, button, label, span, input, textarea){
  font-family: "OpenDyslexic", "Comic Sans MS", Verdana, sans-serif !important; letter-spacing: .03em;
}

html.a11y-big-cursor, html.a11y-big-cursor *{
  cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 24 24"><path d="M3 2l7 19 2.5-7.5L20 11z" fill="black" stroke="white" stroke-width="1.5" stroke-linejoin="round"/></svg>') 4 4, auto !important;
}
html.a11y-big-cursor a, html.a11y-big-cursor button, html.a11y-big-cursor [role="button"]{
  cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 24 24"><path d="M3 2l7 19 2.5-7.5L20 11z" fill="%230e7fa6" stroke="black" stroke-width="1.5" stroke-linejoin="round"/></svg>') 4 4, pointer !important;
}

.a11y-reading-mask{ position: fixed; left: 0; width: 100%; background: rgba(19,40,58,.75); pointer-events: none; z-index: 185; }
#a11yReadingMaskTop{ top: 0; }
#a11yReadingMaskBottom{ bottom: 0; }
.a11y-reading-guide{
  position: fixed; left: 0; width: 100%; height: 44px; transform: translateY(-50%);
  border-top: 3px solid var(--accent); border-bottom: 3px solid var(--accent);
  background: rgba(14,127,166,.12); pointer-events: none; z-index: 186;
}

html.a11y-pause-animations *, html.a11y-pause-animations *::before, html.a11y-pause-animations *::after,
html.a11y-reduce-motion *, html.a11y-reduce-motion *::before, html.a11y-reduce-motion *::after{
  animation-duration: .001ms !important; animation-iteration-count: 1 !important;
  transition-duration: .001ms !important; scroll-behavior: auto !important;
}

html.a11y-hide-decorative .hero::before, html.a11y-hide-decorative .hero::after{ display: none !important; }
html.a11y-theme-dark .brand-logo img{ filter: grayscale(1) invert(1); }
html.a11y-pause-animations .brands-track, html.a11y-reduce-motion .brands-track{ animation-play-state: paused !important; }