/* Arreglos de la auditoría del 24/10/2026 (técnica, legal y accesibilidad), comunes a las 5 páginas.
   Va el último: no cambia el diseño, solo corrige. */

/* Texto solo para Google y lectores de pantalla (H1 de la portada, H2 del carrusel) */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}

/* Las 19 capas de la palabra BOAFE. las pinta el CSS: se ven igual, pero no cuentan como texto */
[data-t]::before{content:attr(data-t)}

/* Contraste: el gris de las etiquetas pasa de 0,40 a 0,5 de opacidad (4,5 a 1 sobre el negro) */
:root{--ink-3:rgba(242,239,232,.5)}

/* Aviso de IA (art. 50.4 del Reglamento de IA) en la entrada: lo más pequeña posible pero legible,
   a 7vh del borde de abajo para que no la tape el carrusel que sube por encima (.ring-top) */
.dg-ia{left:50%;bottom:7vh;transform:translateX(-50%);z-index:7;margin:0;white-space:nowrap;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.6);text-shadow:0 0 4px #0a0a0a,0 0 12px #0a0a0a}
/* en el móvil, arriba, bajo el menú: abajo la taparían el aviso de cookies (primera visita) y el botón verde de WhatsApp */
@media (max-width:820px){.dg-ia{bottom:auto;top:calc(var(--navh,56px) + 10px)}}

/* Ordenador y móvil: el carrusel sube hasta quedar fijo justo cuando se apaga el logo, sin tramo negro.
   La entrada mide 155vh y el logo se apaga al 84 % de su recorrido (55vh): 0,84 x 55 = 46vh, así que el carrusel empieza
   en 155 - 109 = 46vh. Mientras tanto está invisible (lo funde v12.js) y no hace falta el velo negro.
   En el ordenador el fundido no baja del 1 % para que el lienzo 3D siga compuesto (pasar de oculto a visible daba un parón). */
.ring{margin-top:-109vh}.ring-velo{display:none}

/* Móvil: deslizar el dedo sobre un objeto baja la página (arrastrar queda para el ratón) */
.obj{touch-action:pan-y pinch-zoom}
@media (hover:none){.obj{cursor:default}}

/* Altos de pantalla con svh (no salta al esconderse la barra del navegador del móvil) */
.dg-stick,.ring-stick{height:100vh;height:100svh}
.ring.muro .ring-stick{height:auto;min-height:100vh;min-height:100svh}

/* Foco visible en las casillas del cierre */
.chips input:focus-visible+span{outline:3px solid #0a0a0a;outline-offset:3px}

/* Enlaces del pie de 24 px de alto como mínimo en el móvil */
@media (max-width:820px){.foot a{min-height:24px}}

/* Botón pequeño para pausar el movimiento (tira del pie y giro del carrusel) */
.pausa-mov{display:inline-flex;align-items:center;gap:8px;margin-top:14px;min-height:24px;padding:4px 0;background:none;border:0;color:var(--ink-3);cursor:pointer}
.pausa-mov::before{content:"";flex:none;box-sizing:border-box;width:8px;height:10px;border-left:3px solid currentColor;border-right:3px solid currentColor}
.sin-mov .pausa-mov::before{width:0;height:0;border-right:0;border-left:9px solid currentColor;border-top:5px solid transparent;border-bottom:5px solid transparent}
.pausa-mov:hover{color:var(--ink)}
.pausa-mov:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.ring-pausa{position:absolute;left:var(--pad,24px);bottom:24px;z-index:19;margin:0}
@media (max-width:820px){.ring-pausa{bottom:22px}}   /* a la izquierda del botón verde y por debajo de 'Ver todos los clientes' */
.sin-mov .strip-row{animation-play-state:paused}

/* Botones del aviso de cookies con la letra de la página */
.cookie-consent__btn{font-family:inherit}

/* Carrusel: aire entre el botón Anillo / Muro y la cifra y los móviles (Sergio, 24/10) */
.ring-top{padding-bottom:clamp(28px,4.5vh,48px)}
@media (max-width:820px){.ring-top{padding-bottom:clamp(24px,4vh,40px)}}

/* Contraste de la nota bajo el botón del cierre (4,24 a 1 -> por encima de 4,5) */
.ci-note{color:rgba(10,10,10,.68)}

/* Móvil: el bloque del carrusel repartido (Sergio, 24/10): la cifra arriba, los móviles en el centro y el botón debajo,
   sin pisarse y por encima de "Pausar movimiento" y del botón verde */
@media (max-width:820px){
  .ring-stage .ring-center{justify-content:flex-start;padding-top:16px}
  .ring:not(.muro) .ring-mas{white-space:nowrap;bottom:92px}
}

/* enlace al cuestionario bajo el botón de WhatsApp */
.ci-note a{color:inherit;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.ci-note a:hover{color:#0a0a0a}