.elementor-72707 .elementor-element.elementor-element-b66d14e{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--background-transition:0.3s;--overlay-opacity:0.22;}.elementor-72707 .elementor-element.elementor-element-b66d14e::before, .elementor-72707 .elementor-element.elementor-element-b66d14e > .elementor-background-video-container::before, .elementor-72707 .elementor-element.elementor-element-b66d14e > .e-con-inner > .elementor-background-video-container::before, .elementor-72707 .elementor-element.elementor-element-b66d14e > .elementor-background-slideshow::before, .elementor-72707 .elementor-element.elementor-element-b66d14e > .e-con-inner > .elementor-background-slideshow::before, .elementor-72707 .elementor-element.elementor-element-b66d14e > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-72707 .elementor-element.elementor-element-b66d14e:not(.elementor-motion-effects-element-type-background), .elementor-72707 .elementor-element.elementor-element-b66d14e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background:url("https://puente-colgante.com/wp-content/uploads/2025/03/puente-bizkaia-historia.avif") 50% 50%;background-size:cover;}.elementor-72707 .elementor-element.elementor-element-b66d14e, .elementor-72707 .elementor-element.elementor-element-b66d14e::before{--border-transition:0.3s;}.elementor-72707 .elementor-element.elementor-element-a789038 .elementor-button{background-color:#02010100;font-size:18px;border-style:solid;border-width:3px 3px 3px 3px;padding:30px 30px 30px 30px;}.elementor-72707 .elementor-element.elementor-element-9c6b4c5{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:120px 0px 0px 0px;}.elementor-72707 .elementor-element.elementor-element-9c6b4c5 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-72707 .elementor-element.elementor-element-a9d1609.elementor-column > .elementor-widget-wrap{justify-content:center;}.elementor-72707 .elementor-element.elementor-element-5bb0c36 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-bottom:12px;}.elementor-72707 .elementor-element.elementor-element-1cfcc47 > .elementor-widget-container{padding:0% 0% 2% 0%;}.elementor-72707 .elementor-element.elementor-element-ffe1e69 > .elementor-widget-container{padding:0% 20% 0% 20%;}.elementor-72707 .elementor-element.elementor-element-08fa16f{width:var( --container-widget-width, 685px );max-width:685px;--container-widget-width:685px;--container-widget-flex-grow:0;text-align:left;color:#000000;}.elementor-72707 .elementor-element.elementor-element-08fa16f.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-72707 .elementor-element.elementor-element-d8a95e1 > .elementor-container{max-width:1433px;}.elementor-72707 .elementor-element.elementor-element-d8a95e1{margin-top:60px;margin-bottom:0px;}.elementor-72707 .elementor-element.elementor-element-cdb5074{padding:50px 0px 50px 0px;}.elementor-72707 .elementor-element.elementor-element-ee24eab:not(.elementor-motion-effects-element-type-background), .elementor-72707 .elementor-element.elementor-element-ee24eab > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FDF9F8;}.elementor-72707 .elementor-element.elementor-element-ee24eab{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:80px 0px 80px 0px;}.elementor-72707 .elementor-element.elementor-element-ee24eab > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-72707 .elementor-element.elementor-element-e86cfa7.elementor-column > .elementor-widget-wrap{justify-content:center;}.elementor-72707 .elementor-element.elementor-element-177b211{width:var( --container-widget-width, 990px );max-width:990px;--container-widget-width:990px;--container-widget-flex-grow:0;text-align:center;}.elementor-72707 .elementor-element.elementor-element-177b211 .elementor-heading-title{color:inherit;font-family:"Rozha One", Sans-serif;font-size:50px;}.elementor-72707 .elementor-element.elementor-element-40a3d32:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, .elementor-72707 .elementor-element.elementor-element-40a3d32 > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#9E2A40;}.elementor-72707 .elementor-element.elementor-element-40a3d32 > .elementor-element-populated{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:0% 0% 0% 0%;}.elementor-72707 .elementor-element.elementor-element-40a3d32 > .elementor-element-populated > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-72707 .elementor-element.elementor-element-cbc4a04:not(.elementor-motion-effects-element-type-background), .elementor-72707 .elementor-element.elementor-element-cbc4a04 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#9E2A40;}.elementor-72707 .elementor-element.elementor-element-cbc4a04{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-72707 .elementor-element.elementor-element-cbc4a04 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-bc-flex-widget .elementor-72707 .elementor-element.elementor-element-b0d5ba4.elementor-column .elementor-widget-wrap{align-items:center;}.elementor-72707 .elementor-element.elementor-element-b0d5ba4.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}.elementor-72707 .elementor-element.elementor-element-b0d5ba4 > .elementor-element-populated{padding:0% 20% 0% 20%;}.elementor-72707 .elementor-element.elementor-element-0170e12{color:#FFFCFC;}.elementor-72707 .elementor-element.elementor-element-82b64cf .elementor-icon-list-icon i{color:#FFFFFF;transition:color 0.3s;}.elementor-72707 .elementor-element.elementor-element-82b64cf .elementor-icon-list-icon svg{fill:#FFFFFF;transition:fill 0.3s;}.elementor-72707 .elementor-element.elementor-element-82b64cf{--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-72707 .elementor-element.elementor-element-82b64cf .elementor-icon-list-item > .elementor-icon-list-text, .elementor-72707 .elementor-element.elementor-element-82b64cf .elementor-icon-list-item > a{font-size:16px;}.elementor-72707 .elementor-element.elementor-element-82b64cf .elementor-icon-list-text{color:#FFFFFF;transition:color 0.3s;}.elementor-72707 .elementor-element.elementor-element-dc3bfb7 > .elementor-element-populated{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:0px 0px 0px 0px;}.elementor-72707 .elementor-element.elementor-element-dc3bfb7 > .elementor-element-populated > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-72707 .elementor-element.elementor-element-06d2601 > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-72707 .elementor-element.elementor-element-06d2601{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:0% 0% 0% 0%;}.elementor-72707 .elementor-element.elementor-element-06d2601 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-72707 .elementor-element.elementor-element-b64faef iframe{height:100vh;}@media(min-width:768px){.elementor-72707 .elementor-element.elementor-element-e86cfa7{width:100%;}}@media(max-width:1024px){.elementor-72707 .elementor-element.elementor-element-08fa16f{width:100%;max-width:100%;text-align:center;}.elementor-72707 .elementor-element.elementor-element-cbc4a04{padding:0px 0px 0px 0px;}.elementor-72707 .elementor-element.elementor-element-b0d5ba4 > .elementor-element-populated{padding:6% 6% 6% 6%;}.elementor-72707 .elementor-element.elementor-element-6e99f7b > .elementor-widget-container{padding:0% 3% 0% 3%;}.elementor-72707 .elementor-element.elementor-element-0170e12 > .elementor-widget-container{padding:0% 20% 0% 3%;}}@media(max-width:767px){.elementor-72707 .elementor-element.elementor-element-9c6b4c5{padding:60px 0px 60px 0px;}.elementor-72707 .elementor-element.elementor-element-ffe1e69 > .elementor-widget-container{padding:0% 10% 0% 10%;}.elementor-72707 .elementor-element.elementor-element-08fa16f{text-align:center;}.elementor-72707 .elementor-element.elementor-element-ee24eab{padding:60px 10px 60px 10px;}.elementor-72707 .elementor-element.elementor-element-177b211 > .elementor-widget-container{margin:0vw 0vw 4vw 0vw;}.elementor-72707 .elementor-element.elementor-element-177b211 .elementor-heading-title{font-size:25px;}.elementor-72707 .elementor-element.elementor-element-40a3d32 > .elementor-element-populated{padding:12% 3% 12% 3%;}.elementor-72707 .elementor-element.elementor-element-06d2601{padding:50px 0px 50px 0px;}}/* Start custom CSS for container, class: .elementor-element-b66d14e */#grve-main-header {
    background-color: #9E2A40 !important;
}

/* Cambiar el logo central solo en esta página específica */
.page-id-72210 .grve-center-area .grve-logo img {
    content: url('https://puente-colgante.com/wp-content/uploads/2026/03/logo-horizontal.png') !important;
}

/* 1. Anclar el header al borde absoluto de la pantalla */
.page-id-72210 #grve-header {
    position: fixed !important; 
    top: 0 !important; 
    left: 0 !important;
    width: 100% !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    z-index: 99999 !important; /* Asegura que flote por encima de todo */
}


/* 3. Tamaño y color del header interior */
.page-id-72210 #grve-main-header,
.page-id-72210 .grve-header-inner,
.page-id-72210 .grve-header-row {
    height: 100px !important;
    min-height: 100px !important;
    background-color: #9E2A3D !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Cambiar textos, bordes e iconos del área derecha a blanco */
.page-id-72210 .grve-right-area .grve-header-elements a,
.page-id-72210 .grve-right-area .grve-header-elements .grve-btn {
    color: #ffffff !important;
    border-color: #ffffff !important;
}

/* Forzar que los iconos (como el carrito o el lápiz de tickets) también sean blancos */
.page-id-72210 .grve-right-area .grve-header-elements i,
.page-id-72210 .grve-right-area .grve-header-elements svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* Efecto al pasar el ratón: texto y bordes en rosa */
.page-id-72210 .grve-right-area .grve-header-elements a:hover,
.page-id-72210 .grve-right-area .grve-header-elements .grve-btn:hover {
    background-color: #D39996 !important;
    border-color: #D39996 !important;
}

/* 1. Contenedores del logo: sin restricciones de ancho y sin guillotina (overflow) */
.page-id-72210 .grve-logo,
.page-id-72210 .grve-logo-inner,
.page-id-72210 .grve-logo a {
    width: auto !important;
    max-width: none !important;
    height: 100% !important;
    overflow: visible !important; /* Clave para que la parte baja del puente no se corte */
    /* No forzamos el display aquí para evitar que salgan los dos logos a la vez */
}

/* 2. Tamaño y centrado para TODOS los logos (normal y sticky) */
.page-id-72210 .grve-logo img {
    max-height: 100px !important; /* Tamaño fijo para que encaje en la barra de 70px */
    width: auto !important;
    margin: 0 auto !important; 
    padding: 0 !important;
    /* No forzamos display: block !important para que el tema pueda ocultar el fantasma */
}

/* 3. Evitar que el logo sticky sea empujado hacia abajo y se corte */
.page-id-72210 .grve-logo img.grve-sticky {
    margin-top: 0px !important; 
}

/* 1. Atacar exactamente a las clases de los items y su wrapper interno para forzar el blanco */
.page-id-72210 ul#menu-menu-central-menu-escritorio li.menu-item a,
.page-id-72210 ul#menu-menu-central-menu-escritorio li.menu-item .grve-link-wrapper {
    color: #ffffff !important;
    opacity: 1 !important;
}

/* 2. Mantener el hover en rosa apuntando también al wrapper */
.page-id-72210 ul#menu-menu-central-menu-escritorio li.menu-item a:hover,
.page-id-72210 ul#menu-menu-central-menu-escritorio li.menu-item a:hover .grve-link-wrapper {
    color: #FFB6C1 !important; 
}

/* 1. Pegar el submenú a la barra principal (eliminar el hueco) */
.page-id-72210 .grve-classic-sub-menu {
    top: 100% !important; /* Obliga al submenú a empezar exactamente donde termina el header */
    margin-top: 0 !important;
    padding-top: 0 !important; /* Elimina el hueco invisible (la zona verde de tu captura) */
}

/* 2. Poner el fondo del submenú en granate */
.page-id-72210 .grve-classic-sub-menu,
.page-id-72210 .grve-classic-sub-menu ul.sub-menu {
    background-color: #a52a3e !important;
    border: none !important; /* Por si el tema le pone un borde grisecillo por defecto */
}

/* 3. Letras del submenú en blanco para que destaquen sobre el granate */
.page-id-72210 .grve-classic-sub-menu li.menu-item a,
.page-id-72210 .grve-classic-sub-menu li.menu-item .grve-link-wrapper {
    color: #ffffff !important;
    opacity: 1 !important;
}

/* 4. Efecto hover rosa también para las opciones del submenú */
.page-id-72210 .grve-classic-sub-menu li.menu-item a:hover,
.page-id-72210 .grve-classic-sub-menu li.menu-item a:hover .grve-link-wrapper {
    color: #FFB6C1 !important; 
    background-color: transparent !important; /* Evita que el fondo se ponga gris al pasar el ratón */
}

/* ======================================================= */
/* AJUSTES SOLO PARA MÓVIL Y TABLETS (Pantallas < 1024px)  */
/* ======================================================= */

@media screen and (max-width: 1024px) {

  /* 1. Forzar el color granate en TODAS las capas del header móvil */
    .page-id-72210 #grve-responsive-header,
    .page-id-72210 #grve-main-responsive-header {
        background-color: #9E2A3D !important; /* El color rojo/granate */
        background-image: none !important;
        padding: 5 !important; /* Evita que asomen franjas por dentro */
        margin: 0 !important;
    }

    /* 2. Cambiar la imagen del logo por una específica para móvil */
    .page-id-72210 .grve-logo img,
    .page-id-72210 .grve-logo img.grve-sticky {
        content: url('https://puente-colgante.com/wp-content/uploads/2026/03/logo-horizontal.png') !important;
        max-height: 100px !important; /* Un poco más pequeño para que no ocupe toda la pantalla */
        width: auto !important;
        padding: 0 !important;
        margin: 0 auto !important;
    }
}/* End custom CSS */
/* Start custom CSS */.contenedor-botones-menu {
    display: flex !important;
    gap: 0px !important;
    align-items: center !important;
}

.menu-btn-esencial {
        display: grid !important;
        grid-template-columns: auto !important;
        gap: 0rem !important;
        margin-right: 10px !important;
    }
    
    a.grve-btn {
    padding: 10px !important;
}
 .grve-sticky-header a{
     color: white;
 }/* End custom CSS */