/* === Integración de la portada con Salient ===
   La portada trae su propio header y su propio bloque de contacto, así que en
   la portada se ocultan los del tema y se saca el contenido del contenedor
   central para que las franjas lleguen de borde a borde.
   En móvil se hace al revés: se usa el header del tema, que trae el menú
   desplegable, y se esconde el nuestro.                                       */

body:has(.hdr) #header-outer,
body:has(.hdr) #header-space,
body:has(.hdr) #footer-outer,
body:has(.hdr) .container.main-content > .row > p.yoast {
    display: none !important;
}

body:has(.hdr) .container-wrap,
body:has(.hdr) .container.main-content,
body:has(.hdr) .container.main-content > .row,
body:has(.hdr) .wpb_row,
body:has(.hdr) .vc_column-inner,
body:has(.hdr) .wpb_wrapper {
    padding: 0 !important;
    margin: 0 !important;
    max-width: none !important;
    width: 100% !important;
}

body:has(.hdr) .row_col_wrap_12,
body:has(.hdr) .wpb_column {
    width: 100% !important;
    padding: 0 !important;
    /* Salient le pone margen negativo de 19px y corría toda la portada
       hacia la izquierda */
    margin: 0 !important;
}

/* cada franja rompe el contenedor y ocupa todo el ancho de la ventana */
.hdr,
.hero,
.qs,
.areas,
.amp,
.plomo,
.eq,
.oficina,
.cto {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}

/* el .hdr va absoluto: se ancla a la ventana, no al contenedor */
.hdr {
    position: absolute;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
    width: 100%;
}

body:has(.hdr) {
    overflow-x: hidden;
}

@media (max-width: 900px) {
    /* en móvil manda el header del tema, que trae el menú desplegable */
    body:has(.hdr) #header-outer {
        display: block !important;
    }
    .hdr {
        display: none !important;
    }
    .hero,
    .qs,
    .areas,
    .amp,
    .plomo,
    .eq,
    .oficina,
    .cto {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
}

/* Salient deja sus contenedores en position:relative y el header absoluto se
   anclaba a ellos, quedando 19px corrido. Se fuerzan a estático. */
body:has(.hdr) .container-wrap,
body:has(.hdr) .container.main-content,
body:has(.hdr) .container.main-content > .row,
body:has(.hdr) .wpb_row,
body:has(.hdr) .row_col_wrap_12,
body:has(.hdr) .wpb_column,
body:has(.hdr) .vc_column-inner,
body:has(.hdr) .wpb_wrapper,
body:has(.hdr) .wpb_raw_html {
    position: static !important;
}