/*
Theme Name:     BuildPro Child
Theme URI:      http://demo.oceanthemes.net/buildpro/
Description:    Make your modifications to [Parent Theme] in this child theme.
Author:         OceanThemes
Author URI:     http://oceanthemes.net/
Version:        1.0
Template:       buildpro
*/

@import url("../buildpro/style.css");

/* =Theme customization starts here
------------------------------------------------------- */
/* Aumentar tamaño del texto en el menú principal */
#mainmenu li a {
    font-size: 18px !important;
    /* Cambia el valor según necesites (ej: 16px, 20px, etc.) */
}

/* Agrandar flechas del carrusel de imágenes - Visual Composer BuildPro */

/* Opción 1: Selectores específicos para VC Images Carousel */
.vc_images_carousel .vc_carousel-control .icon-next,
.vc_images_carousel .vc_carousel-control .icon-prev {
    font-size: 90px !important;
    color: #399B9B !important;
}

/* Opción 2: Más específico para OceanWP */
.oceanwp-carousel .icon-next,
.oceanwp-carousel .icon-prev,
.vc_images_carousel .icon-next,
.vc_images_carousel .icon-prev {
    font-size: 90px !important;
    color: #399B9B !important;
}

/* Opción 3: Selector universal para todos los iconos de flecha */
span.icon-next,
span.icon-prev {
    font-size: 90px !important;
    line-height: 1 !important;
    color: #399B9B !important;
}

/* Opción 4: Para carruseles en general */
.vc_carousel-control span[class*="icon-"] {
    font-size: 90px !important;
    color: #399B9B !important;
}

/* ============================================================================
   LOGO para BuildPro - Selector exacto identificado
   ============================================================================ */

/* Para tablet */
@media screen and (max-width: 1024px) and (min-width: 769px) {

    /* Selector exacto del logo */
    #logo>a>img.logo,
    #logo img.logo {
        width: 90px !important;
        height: 90px !important;
        max-width: 90px !important;
        max-height: 90px !important;
    }
}

/* Para móvil */
@media screen and (max-width: 768px) {

    /* Selector exacto del logo */
    #logo>a>img.logo,
    #logo img.logo {
        width: 80px !important;
        height: 80px !important;
        max-width: 80px !important;
        max-height: 80px !important;
    }
}

/* ============================================================================
   Botón Menú Hamburguesa - SOLO tablet y móvil
   ============================================================================ */

/* Para tablet */
@media screen and (max-width: 1024px) and (min-width: 769px) {

    /* Resetear el elemento completamente */
    #menu-btn {
        width: 40px !important;
        height: 40px !important;
        position: relative !important;
        cursor: pointer !important;
        display: inline-block !important;
        background: transparent !important;
        border: none !important;
        outline: none !important;
        padding: 8px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        font-size: 0 !important;
        text-indent: -9999px !important;
        overflow: hidden !important;
    }

    /* Línea superior */
    #menu-btn::before {
        content: '';
        position: absolute;
        top: 12px;
        left: 8px;
        width: 24px;
        height: 3px;
        background-color: #fff;
        display: block;
    }

    /* Línea del medio */
    #menu-btn::after {
        content: '';
        position: absolute;
        top: 19px;
        left: 8px;
        width: 24px;
        height: 3px;
        background-color: #fff;
        display: block;
        box-shadow: 0 7px 0 #fff;
    }

    /* Hover effect */
    #menu-btn:hover {
        opacity: 0.8;
    }
}

/* Para móvil */
@media screen and (max-width: 768px) {

    /* Resetear el elemento completamente */
    #menu-btn {
        width: 40px !important;
        height: 40px !important;
        position: relative !important;
        cursor: pointer !important;
        display: inline-block !important;
        background: transparent !important;
        border: none !important;
        outline: none !important;
        padding: 8px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        font-size: 0 !important;
        text-indent: -9999px !important;
        overflow: hidden !important;
    }

    /* Línea superior */
    #menu-btn::before {
        content: '';
        position: absolute;
        top: 12px;
        left: 8px;
        width: 24px;
        height: 3px;
        background-color: #fff;
        display: block;
    }

    /* Línea del medio */
    #menu-btn::after {
        content: '';
        position: absolute;
        top: 19px;
        left: 8px;
        width: 24px;
        height: 3px;
        background-color: #fff;
        display: block;
        box-shadow: 0 7px 0 #399B9B;
    }

    /* Hover effect */
    #menu-btn:hover {
        opacity: 0.8;
    }
}

/* Para Android - asegurar compatibilidad */
@media screen and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 0) {

    #menu-btn::before,
    #menu-btn::after {
        border-radius: 0;
        transform: none;
    }
}

/* Para móvil */
@media screen and (max-width: 768px) {

    /* Slider COMPLETAMENTE hasta arriba - sin espacios */
    .full-height {
        margin-top: -300px !important;
        padding-top: 300px !important;
        position: relative !important;
        z-index: 1 !important;
        min-height: calc(100vh + 300px) !important;
        height: calc(100vh + 300px) !important;
    }

    /* Background del slider cubriendo absolutamente todo */
    .vc_custom_1750298663819 {
        background-position: center top !important;
        background-size: cover !important;
        background-attachment: scroll !important;
        margin-top: -100px !important;
        padding-top: 100px !important;
        position: relative !important;
        z-index: 0 !important;
    }

    /* Header completamente transparente */
    #wrapper>header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        z-index: 999 !important;
        background: transparent !important;
        transition: background-color 0.3s ease !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* Ocultar TODO lo que cause barras grises */
    #wrapper>header .info {
        display: none !important;
    }

    /* Container del header también transparente */
    #wrapper>header .container {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* Fila del header transparente */
    #wrapper>header .row {
        background: transparent !important;
        border: none !important;
        margin: 0 !important;
    }

    /* Columna del header transparente */
    #wrapper>header .col-md-12 {
        background: transparent !important;
        border: none !important;
        padding: 10px 15px !important;
    }

    /* Logo con z-index alto */
    #logo {
        position: relative !important;
        z-index: 1000 !important;
        background: transparent !important;
    }

    /* Menú hamburguesa con z-index alto */
    #menu-btn {
        position: relative !important;
        z-index: 1000 !important;
        background: transparent !important;
    }

    /* Fondo negro cuando #mainmenu está visible */
    #wrapper>header:has(#mainmenu[style*="block"]) {
        background: black !important;
    }

    /* Alternativa para navegadores que no soportan :has() */
    #wrapper>header:has(nav #mainmenu[style*="block"]) {
        background: black !important;
    }
}

/* ============================================================================
   Texto del slider en color blanco - Todos los dispositivos
   ============================================================================ */

/* Selector específico que proporcionaste */
#contents>div>section.vc_rows.wpb_row.vc_row-fluid.full-height.vc_custom_1750298663819.vc_row-has-fill.parallax>div.container>div>div>div>div>div>div>div>div>div.h2_title.wow.fadeInUp.animated>div>div {
    color: white !important;
}

/* Selectores adicionales para mayor compatibilidad */
.text-item {
    color: white !important;
}

.owl-item .text-item {
    color: white !important;
}

.owl-wrapper .text-item {
    color: white !important;
}

/* Para el contenedor del h2_title */
.h2_title {
    color: white !important;
}

.h2_title div {
    color: white !important;
}

.h2_title span {
    color: white !important;
}

/* Para cualquier texto dentro del owl-carousel */
.owl-wrapper-outer,
.owl-wrapper-outer * {
    color: white !important;
}

/* Asegurar que todos los elementos del slider sean blancos */
.full-height .owl-carousel,
.full-height .owl-carousel * {
    color: white !important;
}

/* Para el contenido específico dentro del hero */
.full-height .text-item,
.full-height .owl-item span {
    color: white !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3) !important;
}

/* ============================================================================
   Centrar elementos del hero SOLO en móvil
   ============================================================================ */

/* Solo para móvil */
@media screen and (max-width: 768px) {

    /* Centrar la row principal */
    .full-height .row {
        text-align: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 150vh !important;
    }

    /* Centrar la columna */
    .full-height .col-md-8.col-md-offset-2 {
        text-align: center !important;
        width: 100% !important;
        margin: 0 auto !important;
        padding: 20px !important;
    }

    /* Centrar el título "bienvenido" */
    .full-height h1.very-big {
        text-align: center !important;
        margin: 0 auto -50px auto !important;
    }

    /* Centrar el slider de texto */
    .full-height .h2_title {
        text-align: center !important;
        margin: 20px auto !important;
    }

    .full-height .text-slider {
        text-align: center !important;
        margin: 0 auto !important;
    }

    .full-height .owl-wrapper-outer {
        text-align: center !important;
    }

    .full-height .text-item {
        text-align: center !important;
        display: block !important;
        margin: 0 auto !important;
    }

    /* Centrar el botón */
    .full-height .btn-custom {
        display: block !important;
        text-align: center !important;
        margin: 30px auto 0 auto !important;
        max-width: 200px !important;
    }

    /* Container del botón */
    .full-height .font13 {
        text-align: center !important;
        margin: 20px auto !important;
    }

    /* Espaciador */
    .full-height .spacer-double {
        height: 40px !important;
    }
}

/* ============================================================================
   Quitar sticky header - Solo móvil y tablet (sin JavaScript)
   ============================================================================ */

/* Para tablet */
@media screen and (max-width: 1024px) and (min-width: 769px) {
    #wrapper>header {
        position: absolute !important;
        /* Cambia de fixed a absolute */
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        z-index: 999 !important;
        background: transparent !important;
    }
}

/* Para móvil */
@media screen and (max-width: 768px) {
    #wrapper>header {
        position: absolute !important;
        /* Cambia de fixed a absolute */
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        z-index: 999 !important;
        background: transparent !important;
    }

    /* Asegurar que el slider cubra todo */
    .full-height {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
}

/* ============================================================================
   Mover "Nosotros" hacia la IZQUIERDA - Solo en móvil
   ============================================================================ */

/* Solo para móvil */
@media screen and (max-width: 768px) {

    /* Selector específico que proporcionaste */
    #nosotros>div.row>div:nth-child(5)>div>div>div.wpb_text_column.wpb_content_element>div>h2>span {
        text-align: left !important;
        display: block !important;
        margin-left: -20px !important;
        padding-left: 0 !important;
    }

    /* También mover el h2 contenedor */
    #nosotros>div.row>div:nth-child(5)>div>div>div.wpb_text_column.wpb_content_element>div>h2 {
        text-align: left !important;
        margin-left: -20px !important;
        padding-left: 0 !important;
    }

    /* Mover toda la columna de texto */
    #nosotros>div.row>div:nth-child(5)>div>div>div.wpb_text_column.wpb_content_element>div {
        margin-left: -20px !important;
        padding-left: 15px !important;
    }

    /* Mover la columna completa */
    #nosotros>div.row>div:nth-child(5) {
        margin-left: -20px !important;
        padding-left: 0 !important;
    }

    /* Ajustar el tiny-border */
    #nosotros .tiny-border::after {
        left: 0 !important;
        margin-left: 0 !important;
        transform: none !important;
    }
}

/* ============================================================================
   Mover contenido "Más de 10 años de experiencia" hacia la IZQUIERDA - Solo móvil
   ============================================================================ */

/* Solo para móvil */
@media screen and (max-width: 768px) {

    /* Selector específico que proporcionaste */
    #nosotros>div.row>div.wpb_column.vc_column_container.vc_col-sm-5>div>div>div.wpb_text_column.wpb_content_element {
        margin-left: 10px !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
        padding-bottom: -15px !important;
    }

    /* Mover el wrapper interno */
    #nosotros>div.row>div.wpb_column.vc_column_container.vc_col-sm-5>div>div>div.wpb_text_column.wpb_content_element>div.wpb_wrapper {
        margin-left: 10px !important;
        padding-left: 0 !important;
        padding-right: 15px !important;
        padding-top: -15px !important;
    }

    /* Mover el título h3 */
    #nosotros>div.row>div.wpb_column.vc_column_container.vc_col-sm-5>div>div>div.wpb_text_column.wpb_content_element h3 {
        margin-left: 10px !important;
        padding-left: 0 !important;
        padding-right: 15px !important;
        padding-top: -15px !important;
    }

    /* Mover el párrafo */
    #nosotros>div.row>div.wpb_column.vc_column_container.vc_col-sm-5>div>div>div.wpb_text_column.wpb_content_element p {
        margin-left: 10px !important;
        padding-left: 0 !important;
        padding-right: 15px !important;
        padding-top: -15px !important;
    }
}

/* ============================================================================
   Ajustes para TABLET con MÁS separación - Nosotros izquierda, contenido derecha
   ============================================================================ */

/* Para tablet y superiores - 767px mínimo */
@media screen and (min-width: 767px) {

    /* Mover "Nosotros" MÁS hacia la IZQUIERDA */
    #nosotros>div.row>div:nth-child(5)>div>div>div.wpb_text_column.wpb_content_element>div>h2>span {
        margin-left: -25px !important;
        padding-left: 0 !important;
    }

    #nosotros>div.row>div:nth-child(5)>div>div>div.wpb_text_column.wpb_content_element>div>h2 {
        margin-left: -25px !important;
        padding-left: 0 !important;
    }

    #nosotros>div.row>div:nth-child(5)>div>div>div.wpb_text_column.wpb_content_element>div {
        margin-left: -25px !important;
        padding-left: 15px !important;
    }

    #nosotros>div.row>div:nth-child(5) {
        margin-left: -25px !important;
        padding-left: 0 !important;
    }

    /* Mover "Más de 10 años..." MÁS hacia la DERECHA */
    #nosotros>div.row>div.wpb_column.vc_column_container.vc_col-sm-5>div>div>div.wpb_text_column.wpb_content_element>div {
        position: relative !important;
        left: 40px !important;
        margin-left: 40px !important;
        transform: translateX(40px) !important;
    }

    /* También aplicar a elementos internos del wrapper */
    #nosotros>div.row>div.wpb_column.vc_column_container.vc_col-sm-5>div>div>div.wpb_text_column.wpb_content_element>div h3 {
        position: relative !important;
        left: 40px !important;
        margin-left: 40px !important;
    }

    #nosotros>div.row>div.wpb_column.vc_column_container.vc_col-sm-5>div>div>div.wpb_text_column.wpb_content_element>div p {
        position: relative !important;
        left: 40px !important;
        margin-left: 40px !important;
    }
}

/* ============================================================================
   Centrar botón "CONTRÁTANOS AHORA" - Tablet y móvil
   ============================================================================ */

/* Para tablet y superiores - 767px mínimo */
@media screen and (min-width: 767px) {

    /* Selector exacto proporcionado */
    #contents>div>section:nth-child(9)>div.container>div>div>div>div>div>div.col-md-4.text-right>a {
        display: block !important;
        text-align: center !important;
        margin: 0 auto !important;
        width: fit-content !important;
        max-width: 300px !important;
    }

    /* También centrar la columna contenedora */
    #contents>div>section:nth-child(9)>div.container>div>div>div>div>div>div.col-md-4.text-right {
        text-align: center !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    /* Asegurar que el botón se vea bien centrado */
    #contents>div>section:nth-child(9) .btn-line-black {
        margin-left: auto !important;
        margin-right: auto !important;
        display: inline-block !important;
    }
}

/* Para móvil - máximo 766px */
@media screen and (max-width: 766px) {

    /* Selector exacto para móvil */
    #contents>div>section:nth-child(9)>div.container>div>div>div>div>div>div.col-md-4.text-right>a {
        display: block !important;
        text-align: center !important;
        margin: 20px auto !important;
        width: fit-content !important;
        max-width: 280px !important;
        padding: 15px 30px !important;
    }

    /* Centrar la columna contenedora en móvil */
    #contents>div>section:nth-child(9)>div.container>div>div>div>div>div>div.col-md-4.text-right {
        text-align: center !important;
        width: 100% !important;
        float: none !important;
        margin: 0 auto !important;
        padding: 20px 15px !important;
    }

    /* Botón optimizado para móvil */
    #contents>div>section:nth-child(9) .btn-line-black {
        margin-left: auto !important;
        margin-right: auto !important;
        display: block !important;
        font-size: 14px !important;
        min-height: 44px !important;
        /* Touch-friendly */
    }
}

/* ============================================================================
   Ocultar espaciador del footer - Solo móvil y tablet
   ============================================================================ */

/* Para tablet */
@media screen and (max-width: 1024px) and (min-width: 767px) {

    /* Selector exacto proporcionado */
    #wrapper>footer>div.container.top-80>div>div:nth-child(2) {
        display: none !important;
    }

    /* También ocultar el spacer interno por si acaso */
    #wrapper>footer .wp-block-spacer[style*="height:100px"] {
        display: none !important;
    }

    /* Ocultar cualquier widget block vacío */
    #wrapper>footer #block-13 {
        display: none !important;
    }
}

/* Para móvil */
@media screen and (max-width: 766px) {

    /* Selector exacto proporcionado */
    #wrapper>footer>div.container.top-80>div>div:nth-child(2) {
        display: none !important;
    }

    /* También ocultar el spacer interno */
    #wrapper>footer .wp-block-spacer[style*="height:100px"] {
        display: none !important;
    }

    /* Ocultar cualquier widget block vacío */
    #wrapper>footer #block-13 {
        display: none !important;
    }

    /* Reducir padding general del footer en móvil */
    #wrapper>footer .container.top-80 {
        padding-top: 40px !important;
    }
}

/* ============================================================================
   Ocultar widget WhatsApp del footer - Solo móvil y tablet
   ============================================================================ */

/* Para tablet */
@media screen and (max-width: 1024px) and (min-width: 767px) {

    /* Selector exacto proporcionado */
    #wrapper>footer>div.container.top-80>div>div:nth-child(4) {
        display: none !important;
    }

    /* También ocultar el widget específico por si acaso */
    #wrapper>footer #block-18 {
        display: none !important;
    }

    /* Ocultar el widget de WhatsApp específico */
    #wrapper>footer .elfsight-widget-whatsapp-chat {
        display: none !important;
    }

    /* Ocultar cualquier instancia del widget */
    #wrapper>footer .eapp-whatsapp-chat-root-layout-component {
        display: none !important;
    }
}

/* Para móvil */
@media screen and (max-width: 766px) {

    /* Selector exacto proporcionado */
    #wrapper>footer>div.container.top-80>div>div:nth-child(4) {
        display: none !important;
    }

    /* También ocultar el widget específico */
    #wrapper>footer #block-18 {
        display: none !important;
    }

    /* Ocultar el widget de WhatsApp específico */
    #wrapper>footer .elfsight-widget-whatsapp-chat {
        display: none !important;
    }

    /* Ocultar cualquier instancia del widget */
    #wrapper>footer .eapp-whatsapp-chat-root-layout-component {
        display: none !important;
    }

    /* Ocultar elementos específicos del plugin */
    #wrapper>footer .elfsight-widget {
        display: none !important;
    }

    #wrapper>footer #eapps-whatsapp-chat-1 {
        display: none !important;
    }
}

/* ============================================================================
   Header NEGRO corregido para página /nosotros/ (ID 619)
   ============================================================================ */

/* Para tablet */
@media screen and (max-width: 1024px) and (min-width: 767px) {

    /* Solo en la página /nosotros/ (ID 619) */
    .page-id-619 #wrapper>header {
        background: #000 !important;
        background-color: #000 !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: auto !important;
        min-height: 110px !important;
        max-height: 130px !important;
        z-index: 999 !important;
        padding: 0px 0 20px 0 !important;
        /* Menos arriba, más abajo */
        transition: background-color 0.3s ease !important;
    }

    /* Header negro cuando menú está expandido */
    .page-id-619 #wrapper>header:has(#mainmenu[style*="block"]),
    .page-id-619 #wrapper>header.menu-open,
    .page-id-619 #wrapper>header.active {
        background: #000 !important;
        background-color: #000 !important;
        min-height: 100vh !important;
        max-height: none !important;
    }

    /* Logo blanco */
    .page-id-619 #wrapper>header #logo img {
        filter: brightness(0) invert(1) !important;
    }

    /* Container del header */
    .page-id-619 #wrapper>header .container {
        height: auto !important;
        padding: 15px 20px !important;
    }

    /* Hamburguesa a la derecha */
    .page-id-619 #wrapper>header #menu-btn {
        float: right !important;
        position: absolute !important;
        right: 20px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
    }
}

/* Para móvil */
@media screen and (max-width: 766px) {

    /* Solo en la página /nosotros/ (ID 619) */
    .page-id-619 #wrapper>header {
        background: #000 !important;
        background-color: #000 !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: auto !important;
        min-height: 120px !important;
        max-height: 130px !important;
        z-index: 999 !important;
        padding: 22px 0 !important;
        transition: all 0.3s ease !important;
    }

    /* Header negro cuando menú está expandido - SIN MONTAJE */
    .page-id-619 #wrapper>header:has(#mainmenu[style*="block"]),
    .page-id-619 #wrapper>header.menu-open,
    .page-id-619 #wrapper>header.active {
        background: #000 !important;
        background-color: #000 !important;
        min-height: 100vh !important;
        max-height: none !important;
        z-index: 9999 !important;
    }

    /* Logo blanco */
    .page-id-619 #wrapper>header #logo img {
        filter: brightness(0) invert(1) !important;
    }

    /* Container del header - NO flexbox que los centra */
    .page-id-619 #wrapper>header .container {
        height: auto !important;
        padding: 12px 15px !important;
        position: relative !important;
        z-index: 10000 !important;
    }

    /* Logo SUBIDO - mucho más arriba */
    .page-id-619 #wrapper>header #logo {
        position: absolute !important;
        left: 15px !important;
        top: -15px !important;
        /* Subido de 5px a -5px */
        z-index: 10001 !important;
        margin: 0 !important;
        float: none !important;
    }

    /* Hamburguesa SUBIDA - mucho más arriba */
    .page-id-619 #wrapper>header #menu-btn {
        position: absolute !important;
        right: 15px !important;
        top: -20px !important;
        /* Subido de 10px a 0px */
        z-index: 10001 !important;
        margin: 0 !important;
        float: none !important;
    }

    /* Menú principal MÁS ABAJO - más espacio para logo y hamburguesa */
    .page-id-619 #wrapper>header #mainmenu {
        padding-top: 120px !important;
        /* Aumentado de 80px a 120px */
        z-index: 10000 !important;
        position: relative !important;
    }

    /* Row del header - quitar flexbox */
    .page-id-619 #wrapper>header .row {
        height: auto !important;
        margin: 0 !important;
        position: relative !important;
        z-index: 10000 !important;
    }

    /* Columna sin flexbox */
    .page-id-619 #wrapper>header .col-md-12 {
        position: relative !important;
        height: auto !important;
        z-index: 10000 !important;
    }

    /* Nav contenedor */
    .page-id-619 #wrapper>header nav {
        position: relative !important;
        z-index: 10000 !important;
    }

    /* Ajustar el contenido */
    .page-id-619 #contents {
        padding-top: 90px !important;
    }
}

/* ============================================================================
   Subir slide completo para eliminar espacio blanco - Solo móvil y tablet
   ============================================================================ */

/* Para tablet */
@media screen and (max-width: 1024px) and (min-width: 767px) {

    /* Selector exacto proporcionado - slide completo */
    #SR7_2_1-3 {
        margin-top: -80px !important;
        transform: translateY(-80px) !important;
        position: relative !important;
        z-index: 1 !important;
    }

    /* Máscara interna también */
    #SR7_2_1-3>sr7-mask {
        margin-top: -50px !important;
        transform: translateY(-50px) !important;
    }
}

/* Para móvil */
@media screen and (max-width: 766px) {

    /* Selector exacto proporcionado - slide completo */
    #SR7_2_1-3 {
        margin-top: -160px !important;
        transform: translateY(-160px) !important;
        position: relative !important;
        z-index: 1 !important;
    }

    /* Máscara interna también */
    #SR7_2_1-3>sr7-mask {
        margin-top: -80px !important;
        transform: translateY(-80px) !important;
    }

    /* Imagen sr7-img también */
    #SR7_2_1-3>sr7-img {
        margin-top: -50px !important;
        transform: translateY(-50px) !important;
    }

    /* Fondo sr7-bg */
    #SR7_2_1-3>sr7-mask>sr7-bg {
        margin-top: -30px !important;
        transform: translateY(-30px) !important;
    }
}

/* CSS para subir el elemento específico en dispositivos móviles y tablets */

/* Para tablets (768px a 1024px) */
@media only screen and (max-width: 1024px) and (min-width: 768px) {
    #contents>div>section.vc_rows.wpb_row.vc_row-fluid.vc_custom_1481614324254.vc_row-o-equal-height.vc_row-o-content-middle.vc_row-flex>div.row>div.padd70.wpb_column.vc_column_container.vc_col-sm-12.vc_col-md-6>div>div>div>div {
        margin-top: -350px;
        /* Ajusta este valor según necesites */
        position: relative;
        z-index: 2;
        /* Para asegurar que esté por encima de otros elementos */
    }
}

/* Para móviles (hasta 767px) */
@media only screen and (max-width: 767px) {
    #contents>div>section.vc_rows.wpb_row.vc_row-fluid.vc_custom_1481614324254.vc_row-o-equal-height.vc_row-o-content-middle.vc_row-flex>div.row>div.padd70.wpb_column.vc_column_container.vc_col-sm-12.vc_col-md-6>div>div>div>div {
        margin-top: -720px;
        /* Valor menor para móviles */
        position: relative;
        z-index: 2;
    }

    /* Opcional: Ajustar padding interno en móviles para mejor espaciado */
    #contents>div>section.vc_rows.wpb_row.vc_row-fluid.vc_custom_1481614324254.vc_row-o-equal-height.vc_row-o-content-middle.vc_row-flex>div.row>div.padd70.wpb_column.vc_column_container.vc_col-sm-12.vc_col-md-6 {
        padding-left: 15px;
        padding-right: 15px;
    }
}

/* Alternativa usando transform (si margin-top no funciona bien) */
/*
@media only screen and (max-width: 1024px) and (min-width: 768px) {
    #contents > div > section.vc_rows.wpb_row.vc_row-fluid.vc_custom_1481614324254.vc_row-o-equal-height.vc_row-o-content-middle.vc_row-flex {
        transform: translateY(-50px);
        position: relative;
        z-index: 2;
    }
}

@media only screen and (max-width: 767px) {
    #contents > div > section.vc_rows.wpb_row.vc_row-fluid.vc_custom_1481614324254.vc_row-o-equal-height.vc_row-o-content-middle.vc_row-flex {
        transform: translateY(-30px);
        position: relative;
        z-index: 2;
    }
}
*/
/* CSS para centrar el botón CONTÁCTANOS en móviles y tablets */

/* Para tablets (768px a 1024px) */
@media only screen and (max-width: 1024px) and (min-width: 768px) {
    #contents>div>section.vc_rows.wpb_row.vc_row-fluid.vc_custom_1481614324254.vc_row-o-equal-height.vc_row-o-content-middle.vc_row-flex>div.row>div.padd70.wpb_column.vc_column_container.vc_col-sm-12.vc_col-md-6>div>div>a {
        display: block;
        margin: 20px auto 0 auto;
        /* 20px arriba, centrado horizontalmente */
        text-align: center;
        width: fit-content;
        /* Para que el botón mantenga su tamaño natural */
    }
}

/* Para móviles (hasta 767px) */
@media only screen and (max-width: 767px) {
    #contents>div>section.vc_rows.wpb_row.vc_row-fluid.vc_custom_1481614324254.vc_row-o-equal-height.vc_row-o-content-middle.vc_row-flex>div.row>div.padd70.wpb_column.vc_column_container.vc_col-sm-12.vc_col-md-6>div>div>a {
        display: block;
        margin: 15px auto 0 auto;
        /* 15px arriba, centrado horizontalmente */
        text-align: center;
        width: fit-content;
    }
}

/* Alternativa usando transform (si margin-top no funciona bien) */
/*
@media only screen and (max-width: 1024px) and (min-width: 768px) {
    #contents > div > section.vc_rows.wpb_row.vc_row-fluid.vc_custom_1481614324254.vc_row-o-equal-height.vc_row-o-content-middle.vc_row-flex {
        transform: translateY(-50px);
        position: relative;
        z-index: 2;
    }
}

@media only screen and (max-width: 767px) {
    #contents > div > section.vc_rows.wpb_row.vc_row-fluid.vc_custom_1481614324254.vc_row-o-equal-height.vc_row-o-content-middle.vc_row-flex {
        transform: translateY(-30px);
        position: relative;
        z-index: 2;
    }
}
*/

/* CSS para centrar el contenedor del carrusel de testimoniales en tablets */

/* Para tablets (768px a 1024px) */
@media only screen and (max-width: 1024px) and (min-width: 768px) {
    #contents>div>section.vc_rows.wpb_row.vc_row-fluid.vc_custom_1710229700411.vc_row-has-fill.vc_row-o-equal-height.vc_row-o-content-middle.vc_row-flex.parallax>div.container>div>div.text-light.wpb_column.vc_column_container.vc_col-sm-12.vc_col-md-6>div>div>div.testimonial-list.wow.fadeIn.owl-carousel.owl-theme.animated {
        margin: 0 auto;
        display: block;
    }

    /* Mantener el texto de los testimonios alineado a la izquierda */
    #contents>div>section.vc_rows.wpb_row.vc_row-fluid.vc_custom_1710229700411.vc_row-has-fill.vc_row-o-equal-height.vc_row-o-content-middle.vc_row-flex.parallax>div.container>div>div.text-light.wpb_column.vc_column_container.vc_col-sm-12.vc_col-md-6>div>div>div.testimonial-list.wow.fadeIn.owl-carousel.owl-theme.animated .testi-item {
        text-align: left;
        margin: 0 auto;
    }

    /* Centrar los controles de paginación del carrusel */
    #contents>div>section.vc_rows.wpb_row.vc_row-fluid.vc_custom_1710229700411.vc_row-has-fill.vc_row-o-equal-height.vc_row-o-content-middle.vc_row-flex.parallax>div.container>div>div.text-light.wpb_column.vc_column_container.vc_col-sm-12.vc_col-md-6>div>div>div.testimonial-list.wow.fadeIn.owl-carousel.owl-theme.animated .owl-controls {
        text-align: center;
    }
}

/* CSS para centrar el call-to-action en móviles y tablets */

/* Para tablets (768px a 1024px) */
@media only screen and (max-width: 1024px) and (min-width: 768px) {
    #contents>div>section>div.container>div>div>div>div>div.row.call-to-action {
        text-align: center;
        margin: 0 auto;
        display: block;
    }

    /* Centrar el título en tablets */
    #contents>div>section>div.container>div>div>div>div>div.row.call-to-action .col-md-8 h3 {
        text-align: center;
        margin: 0 auto;
    }

    /* Centrar el botón en tablets */
    #contents>div>section>div.container>div>div>div>div>div.row.call-to-action .col-md-4 {
        text-align: center;
    }

    /* Asegurar que el botón esté centrado */
    #contents>div>section>div.container>div>div>div>div>div.row.call-to-action .col-md-4 a {
        display: inline-block;
        margin: 10px auto 0 auto;
    }
}

/* Para móviles (hasta 767px) */
@media only screen and (max-width: 767px) {
    #contents>div>section>div.container>div>div>div>div>div.row.call-to-action {
        text-align: center;
        margin: 0 auto;
        display: block;
    }

    /* Centrar el título en móviles */
    #contents>div>section>div.container>div>div>div>div>div.row.call-to-action .col-md-8 h3 {
        text-align: center;
        margin: 0 auto;
    }

    /* Centrar el botón en móviles */
    #contents>div>section>div.container>div>div>div>div>div.row.call-to-action .col-md-4 {
        text-align: center;
    }

    /* Asegurar que el botón esté centrado y con margen superior */
    #contents>div>section>div.container>div>div>div>div>div.row.call-to-action .col-md-4 a {
        display: inline-block;
        margin: 15px auto 0 auto;
    }

    /* Opcional: Ajustar padding en móviles para mejor espaciado */
    #contents>div>section>div.container>div>div>div>div>div.row.call-to-action .col-md-8,
    #contents>div>section>div.container>div>div>div>div>div.row.call-to-action .col-md-4 {
        padding: 10px 15px;
    }
}

/* CSS con Z-INDEX SÚPER ALTOS - Especialmente para segunda imagen */

/* Para tablets (768px a 1024px) - Solo página de Servicios */
@media only screen and (max-width: 1024px) and (min-width: 768px) {
    
    /* ===== PRIMER SERVICIO: RESTAURACIÓN ===== */
    body.postid-265 #contents > div > section > div.container > div > div > div > div > div:nth-child(1) > div:nth-child(1) > a.read_more {
        position: relative !important;
        z-index: 50000 !important; /* SÚPER ALTO */
        display: inline-block !important;
        padding: 12px 20px !important;
        background: #007cba !important;
        color: white !important;
        border-radius: 5px !important;
        text-decoration: none !important;
        touch-action: manipulation !important;
        min-height: 44px !important;
        min-width: 120px !important;
        text-align: center !important;
        cursor: pointer !important;
        font-weight: bold !important;
        border: 2px solid transparent !important;
        transition: all 0.3s ease !important;
    }
    
    body.postid-265 #contents > div > section > div.container > div > div > div > div > div:nth-child(1) > div:nth-child(1) {
        position: relative !important;
        z-index: 49000 !important; /* SÚPER ALTO */
        cursor: pointer !important;
    }
    
    body.postid-265 #contents > div > section > div.container > div > div > div > div > div:nth-child(1) > div:nth-child(1)::before {
        content: '' !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        z-index: 48000 !important; /* SÚPER ALTO */
        cursor: pointer !important;
        background: transparent !important;
        pointer-events: auto !important;
    }
    
    /* ===== SEGUNDO SERVICIO: AISLAMIENTO TERMOACÚSTICO - Z-INDEX AÚN MÁS ALTOS ===== */
    body.postid-265 #contents > div > section > div.container > div > div > div > div > div:nth-child(2) > div:nth-child(1) > a.read_more {
        position: relative !important;
        z-index: 100000 !important; /* EXTREMADAMENTE ALTO */
        display: inline-block !important;
        padding: 12px 20px !important;
        background: #007cba !important;
        color: white !important;
        border-radius: 5px !important;
        text-decoration: none !important;
        touch-action: manipulation !important;
        min-height: 44px !important;
        min-width: 120px !important;
        text-align: center !important;
        cursor: pointer !important;
        font-weight: bold !important;
        border: 2px solid transparent !important;
        transition: all 0.3s ease !important;
    }
    
    body.postid-265 #contents > div > section > div.container > div > div > div > div > div:nth-child(2) > div:nth-child(1) {
        position: relative !important;
        z-index: 99000 !important; /* EXTREMADAMENTE ALTO */
        cursor: pointer !important;
    }
    
    body.postid-265 #contents > div > section > div.container > div > div > div > div > div:nth-child(2) > div:nth-child(1)::before {
        content: '' !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        z-index: 98000 !important; /* EXTREMADAMENTE ALTO */
        cursor: pointer !important;
        background: transparent !important;
        pointer-events: auto !important;
    }
    
    /* ===== SELECTORES ADICIONALES para mayor especificidad ===== */
    /* Segundo servicio con selectores alternativos */
    body.postid-265 #contents div:nth-child(2) div:nth-child(1),
    body.postid-265 .wpb_column:nth-child(2) div:nth-child(1) {
        position: relative !important;
        z-index: 99000 !important;
        cursor: pointer !important;
    }
    
    body.postid-265 #contents div:nth-child(2) div:nth-child(1) a.read_more,
    body.postid-265 .wpb_column:nth-child(2) div:nth-child(1) a.read_more {
        position: relative !important;
        z-index: 100000 !important;
    }
    
    /* ===== CONFIGURACIÓN DE HEADER Y MENÚ ===== */
    body.postid-265 #wrapper > header,
    body.postid-265 header.transparent.de_header_2.header-mobile.sticky,
    body.postid-265 header.sticky {
        z-index: 500 !important; /* Mantener bajo cuando menú cerrado */
    }
    
    /* Header alto cuando menú está abierto - MÁS ALTO QUE TODO */
    body.postid-265 #wrapper > header:has(#mainmenu[style*="block"]),
    body.postid-265 header.transparent.de_header_2.header-mobile.sticky:has(#mainmenu[style*="block"]),
    body.postid-265 header.sticky:has(#mainmenu[style*="block"]),
    body.postid-265 #wrapper > header.menu-open,
    body.postid-265 header.menu-open,
    body.postid-265.menu-is-open #wrapper > header,
    body.postid-265.menu-is-open header.sticky {
        z-index: 200000 !important; /* MÁS ALTO QUE LOS SERVICIOS */
    }
    
    /* Servicios bajan cuando menú está abierto */
    body.postid-265.menu-is-open #contents,
    body.postid-265.menu-is-open #contents > div > section,
    body.postid-265.menu-is-open a.read_more,
    body.postid-265.menu-is-open div:nth-child(1) > div:nth-child(1),
    body.postid-265.menu-is-open div:nth-child(2) > div:nth-child(1) {
        z-index: 100 !important;
    }
}

/* Para móviles (hasta 767px) - Solo página de Servicios */
@media only screen and (max-width: 767px) {
    
    /* ===== PRIMER SERVICIO: RESTAURACIÓN ===== */
    body.postid-265 #contents > div > section > div.container > div > div > div > div > div:nth-child(1) > div:nth-child(1) > a.read_more {
        position: relative !important;
        z-index: 50000 !important;
        display: block !important;
        padding: 18px 30px !important;
        margin: 20px auto !important;
        background: #007cba !important;
        color: white !important;
        border-radius: 8px !important;
        text-decoration: none !important;
        touch-action: manipulation !important;
        min-height: 50px !important;
        text-align: center !important;
        cursor: pointer !important;
        font-weight: bold !important;
        width: 85% !important;
        max-width: 250px !important;
        font-size: 16px !important;
        border: 3px solid white !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
        transition: all 0.3s ease !important;
    }
    
    body.postid-265 #contents > div > section > div.container > div > div > div > div > div:nth-child(1) > div:nth-child(1) {
        position: relative !important;
        z-index: 49000 !important;
        cursor: pointer !important;
    }
    
    body.postid-265 #contents > div > section > div.container > div > div > div > div > div:nth-child(1) > div:nth-child(1)::before {
        content: '' !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        z-index: 48000 !important;
        cursor: pointer !important;
        background: transparent !important;
        pointer-events: auto !important;
    }
    
    /* ===== SEGUNDO SERVICIO: AISLAMIENTO TERMOACÚSTICO - Z-INDEX EXTREMOS ===== */
    body.postid-265 #contents > div > section > div.container > div > div > div > div > div:nth-child(2) > div:nth-child(1) > a.read_more {
        position: relative !important;
        z-index: 100000 !important; /* EXTREMADAMENTE ALTO */
        display: block !important;
        padding: 18px 30px !important;
        margin: 20px auto !important;
        background: #007cba !important;
        color: white !important;
        border-radius: 8px !important;
        text-decoration: none !important;
        touch-action: manipulation !important;
        min-height: 50px !important;
        text-align: center !important;
        cursor: pointer !important;
        font-weight: bold !important;
        width: 85% !important;
        max-width: 250px !important;
        font-size: 16px !important;
        border: 3px solid white !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
        transition: all 0.3s ease !important;
    }
    
    body.postid-265 #contents > div > section > div.container > div > div > div > div > div:nth-child(2) > div:nth-child(1) {
        position: relative !important;
        z-index: 99000 !important; /* EXTREMADAMENTE ALTO */
        cursor: pointer !important;
    }
    
    body.postid-265 #contents > div > section > div.container > div > div > div > div > div:nth-child(2) > div:nth-child(1)::before {
        content: '' !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        z-index: 98000 !important; /* EXTREMADAMENTE ALTO */
        cursor: pointer !important;
        background: transparent !important;
        pointer-events: auto !important;
    }
    
    /* ===== SELECTORES ADICIONALES para móvil ===== */
    body.postid-265 #contents div:nth-child(2) div:nth-child(1),
    body.postid-265 .wpb_column:nth-child(2) div:nth-child(1) {
        position: relative !important;
        z-index: 99000 !important;
        cursor: pointer !important;
    }
    
    body.postid-265 #contents div:nth-child(2) div:nth-child(1) a.read_more,
    body.postid-265 .wpb_column:nth-child(2) div:nth-child(1) a.read_more {
        position: relative !important;
        z-index: 100000 !important;
    }
    
    /* ===== CONFIGURACIÓN DE HEADER Y MENÚ ===== */
    body.postid-265 #wrapper > header,
    body.postid-265 header.transparent.de_header_2.header-mobile.sticky,
    body.postid-265 header.sticky {
        z-index: 500 !important;
    }
    
    /* Header súper alto cuando menú está abierto */
    body.postid-265 #wrapper > header:has(#mainmenu[style*="block"]),
    body.postid-265 header.transparent.de_header_2.header-mobile.sticky:has(#mainmenu[style*="block"]),
    body.postid-265 header.sticky:has(#mainmenu[style*="block"]),
    body.postid-265 #wrapper > header.menu-open,
    body.postid-265 header.menu-open,
    body.postid-265.menu-is-open #wrapper > header,
    body.postid-265.menu-is-open header.sticky {
        z-index: 200000 !important; /* MÁS ALTO QUE TODO */
    }
    
    /* Todos los servicios bajan cuando menú está abierto */
    body.postid-265.menu-is-open #contents,
    body.postid-265.menu-is-open #contents > div > section,
    body.postid-265.menu-is-open a.read_more,
    body.postid-265.menu-is-open div:nth-child(1) > div:nth-child(1),
    body.postid-265.menu-is-open div:nth-child(2) > div:nth-child(1) {
        z-index: 100 !important;
    }
}

/* Forzar z-index específico para segunda imagen si nada más funciona */
@media only screen and (max-width: 1024px) {
    /* Fuerza bruta para segunda imagen */
    body.postid-265 div:nth-child(2) {
        position: relative !important;
        z-index: 95000 !important;
    }
    
    body.postid-265 div:nth-child(2) > div {
        position: relative !important;
        z-index: 96000 !important;
    }
    
    body.postid-265 div:nth-child(2) > div > div {
        position: relative !important;
        z-index: 97000 !important;
    }
    
    body.postid-265 div:nth-child(2) img {
        position: relative !important;
        z-index: 98000 !important;
        cursor: pointer !important;
    }
}

/* CSS OPTIMIZADO PARA TODAS LAS PÁGINAS DE SERVICES Y PORTFOLIOS */

@media screen and (max-width: 1024px) {
    
    /* HEADER NATURAL (SIN FONDO NEGRO) SOLO EN MÓVILES/TABLETS */
    .single-service #wrapper > header,
    .post-type-service #wrapper > header,
    .single-portfolio #wrapper > header,
    .post-type-portfolio #wrapper > header,
    .single-service header.transparent,
    .post-type-service header.transparent,
    .single-portfolio header.transparent,
    .post-type-portfolio header.transparent,
    .single-service header.de_header_2,
    .post-type-service header.de_header_2,
    .single-portfolio header.de_header_2,
    .post-type-portfolio header.de_header_2,
    .single-service header.header-mobile,
    .post-type-service header.header-mobile,
    .single-portfolio header.header-mobile,
    .post-type-portfolio header.header-mobile,
    .single-service header.sticky,
    .post-type-service header.sticky,
    .single-portfolio header.sticky,
    .post-type-portfolio header.sticky {
        background-color: transparent !important;
        background: transparent !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        z-index: 50 !important;
        pointer-events: auto !important;
    }

    /* Texto en su color natural en el header */
    .single-service header .info,
    .post-type-service header .info,
    .single-portfolio header .info,
    .post-type-portfolio header .info,
    .single-service header .info *,
    .post-type-service header .info *,
    .single-portfolio header .info *,
    .post-type-portfolio header .info *,
    .single-service header .container,
    .post-type-service header .container,
    .single-portfolio header .container,
    .post-type-portfolio header .container,
    .single-service header .col,
    .post-type-service header .col,
    .single-portfolio header .col,
    .post-type-portfolio header .col,
    .single-service header a,
    .post-type-service header a,
    .single-portfolio header a,
    .post-type-portfolio header a,
    .single-service header span,
    .post-type-service header span,
    .single-portfolio header span,
    .post-type-portfolio header span {
        color: inherit !important;
    }

    /* Enlaces en el header con hover */
    .single-service header a:hover,
    .post-type-service header a:hover,
    .single-portfolio header a:hover,
    .post-type-portfolio header a:hover {
        color: #00d4ff !important;
    }

    /* Iconos en su color natural */
    .single-service header i,
    .post-type-service header i,
    .single-portfolio header i,
    .post-type-portfolio header i {
        color: inherit !important;
    }

    /* Menú de navegación en su color natural */
    .single-service #mainmenu li a,
    .post-type-service #mainmenu li a,
    .single-portfolio #mainmenu li a,
    .post-type-portfolio #mainmenu li a,
    .single-service nav ul li a,
    .post-type-service nav ul li a,
    .single-portfolio nav ul li a,
    .post-type-portfolio nav ul li a {
        color: inherit !important;
    }

    .single-service #mainmenu li a:hover,
    .post-type-service #mainmenu li a:hover,
    .single-portfolio #mainmenu li a:hover,
    .post-type-portfolio #mainmenu li a:hover,
    .single-service nav ul li a:hover,
    .post-type-service nav ul li a:hover,
    .single-portfolio nav ul li a:hover,
    .post-type-portfolio nav ul li a:hover {
        color: #00d4ff !important;
    }

    /* Botón del menú hamburguesa ajustado para fondo natural */
    .single-service #menu-btn,
    .post-type-service #menu-btn,
    .single-portfolio #menu-btn,
    .post-type-portfolio #menu-btn {
        background-color: rgba(255,255,255,0.9) !important;
        border: 2px solid rgba(0,0,0,0.8) !important;
        cursor: pointer !important;
        z-index: 100000 !important;
        position: relative !important;
    }

    .single-service #menu-btn::before,
    .post-type-service #menu-btn::before,
    .single-portfolio #menu-btn::before,
    .post-type-portfolio #menu-btn::before,
    .single-service #menu-btn::after,
    .post-type-service #menu-btn::after,
    .single-portfolio #menu-btn::after,
    .post-type-portfolio #menu-btn::after,
    .single-service #menu-btn span::before,
    .post-type-service #menu-btn span::before,
    .single-portfolio #menu-btn span::before,
    .post-type-portfolio #menu-btn span::before {
        background-color: #000000 !important;
    }

    /* Logo en su estado natural */
    .single-service #logo img,
    .post-type-service #logo img,
    .single-portfolio #logo img,
    .post-type-portfolio #logo img {
        filter: none !important;
    }

    /* MOVER LA IMAGEN DEL LOGO HACIA LA IZQUIERDA EN MÓVILES/TABLETS */
    .single-service #logo > a > img.logo,
    .post-type-service #logo > a > img.logo,
    .single-portfolio #logo > a > img.logo,
    .post-type-portfolio #logo > a > img.logo {
        transform: translateX(10px) !important;
        margin-left: -20px !important;
    }

    /* Z-INDEX FIXES PARA QUE EL CONTENIDO SEA CLICKEABLE */
    
    /* Reducir z-index del contenido principal pero que sea mayor al header */
    .single-service #contents > div > section,
    .post-type-service #contents > div > section,
    .single-portfolio #contents > div > section,
    .post-type-portfolio #contents > div > section {
        position: relative;
        z-index: 200 !important;
    }

    /* Elementos dentro de la sección con z-index mayor al header */
    .single-service .service-item,
    .post-type-service .service-item,
    .single-portfolio .service-item,
    .post-type-portfolio .service-item,
    .single-service .portfolio-item,
    .post-type-service .portfolio-item,
    .single-portfolio .portfolio-item,
    .post-type-portfolio .portfolio-item {
        position: relative;
        z-index: 201 !important;
    }

    .single-service .call-to-action,
    .post-type-service .call-to-action,
    .single-portfolio .call-to-action,
    .post-type-portfolio .call-to-action {
        position: relative;
        z-index: 201 !important;
    }

    /* Asegurar que todos los elementos clickeables tengan z-index alto */
    .single-service .pic-hover,
    .post-type-service .pic-hover,
    .single-portfolio .pic-hover,
    .post-type-portfolio .pic-hover,
    .single-service .read_more,
    .post-type-service .read_more,
    .single-portfolio .read_more,
    .post-type-portfolio .read_more,
    .single-service .btn,
    .post-type-service .btn,
    .single-portfolio .btn,
    .post-type-portfolio .btn,
    .single-service a[href],
    .post-type-service a[href],
    .single-portfolio a[href],
    .post-type-portfolio a[href],
    .single-service img,
    .post-type-service img,
    .single-portfolio img,
    .post-type-portfolio img {
        position: relative !important;
        z-index: 202 !important;
        pointer-events: auto !important;
    }

    /* OCULTAR ESPECÍFICAMENTE EL ELEMENTO PROBLEMÁTICO (como Hide Element en inspect) */
    .single-service header nav,
    .post-type-service header nav,
    .single-portfolio header nav,
    .post-type-portfolio header nav,
    .single-service header #mainmenu,
    .post-type-service header #mainmenu,
    .single-portfolio header #mainmenu,
    .post-type-portfolio header #mainmenu,
    .single-service header ul#mainmenu,
    .post-type-service header ul#mainmenu,
    .single-portfolio header ul#mainmenu,
    .post-type-portfolio header ul#mainmenu,
    .single-service header nav ul#mainmenu,
    .post-type-service header nav ul#mainmenu,
    .single-portfolio header nav ul#mainmenu,
    .post-type-portfolio header nav ul#mainmenu {
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        position: absolute !important;
        top: -9999px !important;
        left: -9999px !important;
        z-index: -9999 !important;
        max-height: 0 !important;
        overflow: hidden !important;
    }

    /* BLOQUEO ULTRA AGRESIVO DEL MENÚ ORIGINAL DEL TEMA */
    .single-service .sidr,
    .post-type-service .sidr,
    .single-portfolio .sidr,
    .post-type-portfolio .sidr,
    .single-service #sidr-main,
    .post-type-service #sidr-main,
    .single-portfolio #sidr-main,
    .post-type-portfolio #sidr-main,
    .single-service .mobile-menu:not(#custom-menu-overlay),
    .post-type-service .mobile-menu:not(#custom-menu-overlay),
    .single-portfolio .mobile-menu:not(#custom-menu-overlay),
    .post-type-portfolio .mobile-menu:not(#custom-menu-overlay) {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transform: translateX(-100%) !important;
        position: absolute !important;
        top: -9999px !important;
        left: -9999px !important;
        width: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
        z-index: -9999 !important;
    }

    /* Asegurar que elementos con z-index muy alto del contenido sean normales */
    .single-service [style*="z-index: 95"],
    .post-type-service [style*="z-index: 95"],
    .single-portfolio [style*="z-index: 95"],
    .post-type-portfolio [style*="z-index: 95"] {
        z-index: 150 !important;
    }

    /* INCLUIR TAMBIÉN LAS PÁGINAS PRINCIPALES DE SERVICIOS Y PROYECTOS */
    .page-id-265 #wrapper > header,
    .page-id-160 #wrapper > header,
    .page-id-265 header.transparent,
    .page-id-160 header.transparent,
    .page-id-265 header.de_header_2,
    .page-id-160 header.de_header_2,
    .page-id-265 header.header-mobile,
    .page-id-160 header.header-mobile,
    .page-id-265 header.sticky,
    .page-id-160 header.sticky {
        background-color: transparent !important;
        background: transparent !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        z-index: 50 !important;
        pointer-events: auto !important;
    }

    .page-id-265 header .info,
    .page-id-160 header .info,
    .page-id-265 header .info *,
    .page-id-160 header .info *,
    .page-id-265 header .container,
    .page-id-160 header .container,
    .page-id-265 header .col,
    .page-id-160 header .col,
    .page-id-265 header a,
    .page-id-160 header a,
    .page-id-265 header span,
    .page-id-160 header span {
        color: inherit !important;
    }

    .page-id-265 header a:hover,
    .page-id-160 header a:hover {
        color: #00d4ff !important;
    }

    .page-id-265 header i,
    .page-id-160 header i {
        color: inherit !important;
    }

    .page-id-265 #mainmenu li a,
    .page-id-160 #mainmenu li a,
    .page-id-265 nav ul li a,
    .page-id-160 nav ul li a {
        color: inherit !important;
    }

    .page-id-265 #mainmenu li a:hover,
    .page-id-160 #mainmenu li a:hover,
    .page-id-265 nav ul li a:hover,
    .page-id-160 nav ul li a:hover {
        color: #00d4ff !important;
    }

    .page-id-265 #menu-btn,
    .page-id-160 #menu-btn {
        background-color: rgba(255,255,255,0.9) !important;
        border: 2px solid rgba(0,0,0,0.8) !important;
        cursor: pointer !important;
        z-index: 100000 !important;
        position: relative !important;
    }

    .page-id-265 #menu-btn::before,
    .page-id-160 #menu-btn::before,
    .page-id-265 #menu-btn::after,
    .page-id-160 #menu-btn::after,
    .page-id-265 #menu-btn span::before,
    .page-id-160 #menu-btn span::before {
        background-color: #000000 !important;
    }

    .page-id-265 #logo img,
    .page-id-160 #logo img {
        filter: none !important;
    }

    .page-id-265 #logo > a > img.logo,
    .page-id-160 #logo > a > img.logo {
        transform: translateX(10px) !important;
        margin-left: -20px !important;
    }

    .page-id-265 #contents > div > section,
    .page-id-160 #contents > div > section {
        position: relative;
        z-index: 200 !important;
    }

    .page-id-265 .service-item,
    .page-id-160 .service-item,
    .page-id-265 .portfolio-item,
    .page-id-160 .portfolio-item {
        position: relative;
        z-index: 201 !important;
    }

    .page-id-265 .call-to-action,
    .page-id-160 .call-to-action {
        position: relative;
        z-index: 201 !important;
    }

    .page-id-265 .pic-hover,
    .page-id-160 .pic-hover,
    .page-id-265 .read_more,
    .page-id-160 .read_more,
    .page-id-265 .btn,
    .page-id-160 .btn,
    .page-id-265 a[href],
    .page-id-160 a[href],
    .page-id-265 img,
    .page-id-160 img {
        position: relative !important;
        z-index: 202 !important;
        pointer-events: auto !important;
    }

    .page-id-265 header nav,
    .page-id-160 header nav,
    .page-id-265 header #mainmenu,
    .page-id-160 header #mainmenu,
    .page-id-265 header ul#mainmenu,
    .page-id-160 header ul#mainmenu,
    .page-id-265 header nav ul#mainmenu,
    .page-id-160 header nav ul#mainmenu {
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        position: absolute !important;
        top: -9999px !important;
        left: -9999px !important;
        z-index: -9999 !important;
        max-height: 0 !important;
        overflow: hidden !important;
    }

    .page-id-265 .sidr,
    .page-id-160 .sidr,
    .page-id-265 #sidr-main,
    .page-id-160 #sidr-main,
    .page-id-265 .mobile-menu:not(#custom-menu-overlay),
    .page-id-160 .mobile-menu:not(#custom-menu-overlay) {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transform: translateX(-100%) !important;
        position: absolute !important;
        top: -9999px !important;
        left: -9999px !important;
        width: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
        z-index: -9999 !important;
    }

    .page-id-265 [style*="z-index: 95"],
    .page-id-160 [style*="z-index: 95"] {
        z-index: 150 !important;
    }

}