/* Herramienta de accesibilidad: estilos que aplica cada ajuste del panel (assets/js/accesibilidad.js).
   Basado en el bloque «Accesibilidad» de web-arelance/public/assets/css/arelance.css. En la web el zoom y los
   filtros van sobre [data-site-root]; aquí, sobre los hijos del <body> salvo el propio botón, para que la
   herramienta no se amplíe ni se vuelva gris con la página.
   Lo propio de cada landing (colores del panel, capa, efectos de aparición) va al final, en «Esta landing». */

/* Tamaño del texto: los diseños van en px, así que se amplía con zoom (A+ = 115 %, A++ = 130 %). */
html[data-a11y-texto="1"]{--a11y-zoom:1.15}
html[data-a11y-texto="2"]{--a11y-zoom:1.3}
@media (max-width:389.98px){html[data-a11y-texto="2"]{--a11y-zoom:1.2}}
@media (max-width:359.98px){html[data-a11y-texto="1"]{--a11y-zoom:1.07}html[data-a11y-texto="2"]{--a11y-zoom:1.1}}
html[data-a11y-texto] body>:not(a11y-tools){zoom:var(--a11y-zoom)}
/* En escritorio el panel también crece; en móvil no, para que quepa en la pantalla. */
@media (min-width:860px){
  html[data-a11y-texto]{--a11y-zoom-ui:var(--a11y-zoom)}
  html[data-a11y-texto] a11y-tools{zoom:var(--a11y-zoom-ui)}
}
html:is([data-a11y-legible],[data-a11y-texto]) body *{overflow-wrap:anywhere}
html:is([data-a11y-legible],[data-a11y-texto]) :is(td,th),html:is([data-a11y-legible],[data-a11y-texto]) :is(td,th) *{overflow-wrap:break-word}

/* Alto contraste */
html[data-a11y-contraste] body,html[data-a11y-contraste] body *{background-color:#000!important;background-image:none!important;color:#fff!important;border-color:#fff!important;box-shadow:none!important;text-shadow:none!important}
html[data-a11y-contraste] a,html[data-a11y-contraste] a *{color:#ffd54a!important;text-decoration:underline!important}
html[data-a11y-contraste] button,html[data-a11y-contraste] input,html[data-a11y-contraste] select,html[data-a11y-contraste] textarea{border:2px solid #fff!important}
html[data-a11y-contraste] svg{color:#fff!important;stroke:#fff}
html[data-a11y-contraste] img{opacity:1!important}
html[data-a11y-contraste] ::placeholder{color:#c9c9c9!important}

/* Escala de grises */
html[data-a11y-grises] body>:not(a11y-tools){filter:grayscale(1)}

/* Subrayar enlaces */
html[data-a11y-enlaces] a{text-decoration:underline!important;text-underline-offset:3px;text-decoration-thickness:2px}

/* Tipografía legible */
html[data-a11y-legible] body,html[data-a11y-legible] body *{font-family:Verdana,Arial,"Helvetica Neue",sans-serif!important;letter-spacing:.04em!important;word-spacing:.1em!important;line-height:1.75!important}
html[data-a11y-legible] :is(h1,h2,h3,h4,h5,h6),html[data-a11y-legible] :is(h1,h2,h3,h4,h5,h6) *{line-height:1.3!important;letter-spacing:0!important;word-spacing:.05em!important}

/* Detener animaciones */
html[data-a11y-animaciones] *{animation:none!important;transition:none!important;scroll-behavior:auto!important}

/* Cursor grande */
html[data-a11y-cursor],html[data-a11y-cursor] body *{cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'><path d='M4 2l16 9-7 2-3 8z' fill='%23152238' stroke='%23fff' stroke-width='1.5' stroke-linejoin='round'/></svg>") 4 2,auto!important}

/* ── Esta landing: Noria ── */
a11y-tools{--a11y-marino:#1E2A3E;--a11y-acento:#EE7317}
html[data-a11y-animaciones] [data-reveal]{opacity:1!important;transform:none!important}
/* El logo es marino: en alto contraste se pasa a blanco para que se vea sobre el negro. */
html[data-a11y-contraste] img[src*="noria-logo.png"]{background-color:transparent!important;filter:brightness(0) invert(1)}
/* Con el texto ampliado en móvil no caben logo, botón y menú en la cabecera: el botón pasa dentro del menú. */
.menu-demo{display:none}
@media (max-width:560px){
  html[data-a11y-texto].menu-compacto .cta-cabecera{display:none!important}
  html[data-a11y-texto].menu-compacto .menu-boton{margin-left:auto}
  html[data-a11y-texto].menu-compacto #menu-principal .menu-demo{display:block;color:#B85409;font-weight:700}
}