/* ==========================================================================
   Accesibilidade (WCAG 2.2 AA) — complemento de site.css
   ========================================================================== */

/* Texto só para lectores de pantalla (BeTheme oculta .screen-reader-text). */
.texto-oculto {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* Enlace de salto ao contido (2.4.1). */
.salto-contido {
    position: fixed;
    top: 0.75rem;
    left: 0.75rem;
    z-index: 100000;
    padding: 0.75rem 1.25rem;
    background: var(--white);
    color: var(--black) !important;
    font-weight: 600;
    text-decoration: none;
    transform: translateY(-200%);
    transition: transform 0.15s ease;
}

.salto-contido:focus,
.salto-contido:focus-visible {
    transform: none;
    outline: 2px solid var(--rec) !important;
    outline-offset: 2px;
}

#Content:focus {
    outline: none;
}

/* Foco visible (2.4.7): BeTheme pon outline:0 a todos os enlaces. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible,
[role="button"]:focus-visible {
    outline: 2px solid var(--white) !important;
    outline-offset: 3px;
}

/* Campos do formulario de contacto: site.css quítalles todo indicador. */
.fluentform .ff-el-form-control:focus-visible,
.fluentform .choices.is-focused .choices__inner {
    outline: 2px solid var(--white) !important;
    outline-offset: 4px;
}

.fluentform input[type="checkbox"]:focus-visible {
    outline-offset: 2px;
}

/* Ligazóns dentro do texto dos documentos legais: non se distinguen só pola cor (1.4.1). */
#cmplz-document :is(p, li, td) a {
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

/* O nome das casillas de Complianz vai nun .screen-reader-text, que BeTheme oculta (4.1.2). */
.cmplz-label .screen-reader-text {
    display: block !important;
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* Fondos claros (banner de cookies, barra de Pojo activa). */
.cmplz-cookiebanner a:focus-visible,
.cmplz-cookiebanner button:focus-visible {
    outline-color: var(--black) !important;
}

/* Botóns de pausa do movemento automático (2.2.2). */
.pausa-movemento {
    position: absolute;
    z-index: 5;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    padding: 0;
    border: 1px solid rgba(252, 252, 252, 0.5);
    border-radius: 50%;
    background: rgba(10, 10, 10, 0.6);
    color: var(--white);
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease;
}

.pausa-movemento:hover {
    background: rgba(10, 10, 10, 0.85);
    border-color: var(--white);
}

.pausa-movemento svg {
    display: block;
}

/* A esquerda: á dereita están a barra de Pojo e o botón de cookies. */
.pausa-movemento--slider {
    left: 1.5rem;
    bottom: 1.5rem;
}

.pausa-movemento--video {
    left: 1.5rem;
    /* Na primeira pantalla aínda que a sección sexa máis alta ca a xanela. */
    top: min(calc(100svh - 4.5rem), calc(100% - 4.25rem));
}

.carrusel {
    position: relative;
}

.pausa-movemento--carrusel {
    left: 0.75rem;
    bottom: 0.75rem;
}

.carrusel.is-pausado .carrusel__pista {
    animation-play-state: paused;
}

@media (max-width: 767px) {
    .pausa-movemento--slider {
        left: 1rem;
        bottom: 1rem;
    }
}

/* Contraste do texto sobre vídeo/foto (1.4.3): velo radial suave detrás do bloque
   de texto. Medido fotograma a fotograma: sen el, o clip de Hierro deixa o título
   en 2,3:1 e o subtítulo en 1,9:1; con el, mínimo 5,7:1 e 4,9:1. */
.invbit-slider .invbit-slider-content::before,
.mcb-section-sec000010 .mcb-wrap-inner-wrp000005::before {
    content: "";
    position: absolute;
    z-index: -1;
    pointer-events: none;
    background: radial-gradient(closest-side, rgba(10, 10, 10, 0.5), rgba(10, 10, 10, 0.42) 55%, rgba(10, 10, 10, 0));
}

.invbit-slider .invbit-slider-content::before {
    inset: -70% -45%;
}

/* Cabeceira de Bio: a etiqueta «Biografía» quedaba en 3,6:1 (en móbil, o
   subtítulo en 4,2:1, que alí xa non é texto grande e cae noutro bloque). */
.mcb-section-sec000010 .mcb-wrap-inner-wrp000005::before {
    inset: -30% -12%;
}

@media (max-width: 767px) {
    .mcb-section-sec000010 .mcb-wrap-inner-wrp000005::before {
        content: none;
    }

    .mcb-section-sec000010 .mcb-wrap-wrp000005::before {
        content: "";
        position: absolute;
        inset: -5% -15%;
        z-index: -1;
        pointer-events: none;
        background: radial-gradient(closest-side, rgba(10, 10, 10, 0.5), rgba(10, 10, 10, 0.42) 60%, rgba(10, 10, 10, 0));
    }
}

/* Cierres de páxina sobre foto: en móbil a frase (20 px, texto normal) de
   Traballos quedaba en 4,4:1 co velo ao 40 %. */
@media (max-width: 767px) {
    .cta-prefooter .mcb-background-overlay {
        background-color: rgba(0, 0, 0, 0.5) !important;
    }
}

/* Etiqueta «Erro 404» en vermello: 4,28:1 sobre negro non chega a 4,5:1. */
body.error404 .mcb-column-inner-ph2pcg1s .title {
    color: #ff3b3b;
}

/* Créditos: as ligazóns de contacto de Invbit medían menos de 24 px de alto (2.5.8). */
.invbit-credits-container .invbit-credits-company a {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
}