.elementor-173 .elementor-element.elementor-element-5ab23c94{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;border-style:solid;--border-style:solid;border-width:0px 0px 1px 0px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:1px;--border-left-width:0px;border-color:#E2E8F0;--border-color:#E2E8F0;--border-radius:0px 0px 25px 25px;box-shadow:0px 8px 30px -24px rgba(15,23,42,0.35);--z-index:9999;}.elementor-173 .elementor-element.elementor-element-5ab23c94:not(.elementor-motion-effects-element-type-background), .elementor-173 .elementor-element.elementor-element-5ab23c94 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-173 .elementor-element.elementor-element-4547d1fe{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover, .elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active, .elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted, .elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before, .elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before, .elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-menu-toggle{margin-left:auto;background-color:#F1F5F9;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu .elementor-item{font-family:"Inter", Sans-serif;font-weight:700;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--main .elementor-item{color:#6E6E6F;fill:#6E6E6F;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--main .elementor-item:hover, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--main .elementor-item.elementor-item-active, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--main .elementor-item.highlighted, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--main .elementor-item:focus{color:#000000;fill:#000000;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--main .elementor-item.elementor-item-active{color:#2563EB;}.elementor-173 .elementor-element.elementor-element-156aa3e5{--e-nav-menu-horizontal-menu-item-margin:calc( 24px / 2 );--nav-menu-icon-size:20px;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--main:not(.elementor-nav-menu--layout-horizontal) .elementor-nav-menu > li:not(:last-child){margin-bottom:24px;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown a, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-menu-toggle{color:#334155;fill:#334155;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown a:hover, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown a:focus, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown a.elementor-item-active, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown a.highlighted, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-menu-toggle:hover, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-menu-toggle:focus{color:#2563EB;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown a:hover, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown a:focus, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown a.elementor-item-active, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown a.highlighted{background-color:#F8FAFC;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown a.elementor-item-active{color:#2563EB;background-color:#EFF6FF;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown{border-style:solid;border-width:1px 1px 1px 1px;border-color:#E2E8F0;border-radius:12px 12px 12px 12px;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown li:first-child a{border-top-left-radius:12px;border-top-right-radius:12px;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-nav-menu--dropdown li:last-child a{border-bottom-right-radius:12px;border-bottom-left-radius:12px;}.elementor-173 .elementor-element.elementor-element-156aa3e5 div.elementor-menu-toggle{color:#0F172A;}.elementor-173 .elementor-element.elementor-element-156aa3e5 div.elementor-menu-toggle svg{fill:#0F172A;}.elementor-173 .elementor-element.elementor-element-156aa3e5 div.elementor-menu-toggle:hover, .elementor-173 .elementor-element.elementor-element-156aa3e5 div.elementor-menu-toggle:focus{color:#2563EB;}.elementor-173 .elementor-element.elementor-element-156aa3e5 div.elementor-menu-toggle:hover svg, .elementor-173 .elementor-element.elementor-element-156aa3e5 div.elementor-menu-toggle:focus svg{fill:#2563EB;}.elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-menu-toggle:hover, .elementor-173 .elementor-element.elementor-element-156aa3e5 .elementor-menu-toggle:focus{background-color:#EFF6FF;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:767px){.elementor-173 .elementor-element.elementor-element-4547d1fe{--width:100%;}}@media(min-width:768px){.elementor-173 .elementor-element.elementor-element-5ab23c94{--width:100%;}.elementor-173 .elementor-element.elementor-element-4547d1fe{--width:100%;}}@media(max-width:1024px) and (min-width:768px){.elementor-173 .elementor-element.elementor-element-4547d1fe{--width:100%;}}/* Start custom CSS for container, class: .elementor-element-5ab23c94 *//* ========================================================= HEADER COMPLETO ========================================================= NORMAL - Fondo blanco - Logo 125px centrado - Línea separadora - Menú centrado SCROLL - Fondo negro translúcido - Logo 72px izquierda - Línea desaparece - Menú blanco derecha ========================================================= */ /* ========================================================= 1. HEADER NORMAL ========================================================= */ .elementor-173 .elementor-element.elementor-element-5ab23c94 { background: #ffffff !important; padding: 16px 24px 14px !important; z-index: 9999 !important; border-bottom: 1px solid #e2e8f0 !important; transition: background-color .35s ease, padding .35s ease, border-color .35s ease, box-shadow .35s ease, backdrop-filter .35s ease !important; } /* ========================================================= 2. CONTENEDOR INTERIOR ========================================================= */ .elementor-173 .elementor-element.elementor-element-5ab23c94 > .header-layout { width: 100% !important; display: flex !important; flex-direction: column !important; justify-content: center !important; align-items: center !important; flex-wrap: nowrap !important; gap: 12px !important; transition: gap .35s ease !important; } /* ========================================================= 3. LOGO NORMAL PRIMER ELEMENTO DEL CONTENEDOR ========================================================= */ .elementor-173 .elementor-element.elementor-element-5ab23c94 > .header-layout > :first-child { width: 125px !important; min-width: 125px !important; max-width: 125px !important; flex: 0 0 125px !important; margin: 0 auto !important; display: flex !important; justify-content: center !important; align-items: center !important; transition: width .35s ease, min-width .35s ease, max-width .35s ease, flex-basis .35s ease !important; } /* Contenedor interno del logo */ .elementor-173 .elementor-element.elementor-element-5ab23c94 > .header-layout > :first-child .elementor-widget-container { width: 100% !important; max-width: 100% !important; display: flex !important; justify-content: center !important; align-items: center !important; } /* Imagen del logo */ .elementor-173 .elementor-element.elementor-element-5ab23c94 > .header-layout > :first-child img { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; object-fit: contain !important; transition: width .35s ease, max-width .35s ease !important; } /* ========================================================= 4. MENÚ NORMAL ÚLTIMO ELEMENTO DEL CONTENEDOR ========================================================= */ .elementor-173 .elementor-element.elementor-element-5ab23c94 > .header-layout > :last-child { width: 100% !important; flex: 0 0 auto !important; margin: 0 !important; /* ----------------------------------------- LÍNEA SEPARADORA ----------------------------------------- */ border-top: 1px solid #e2e8f0 !important; padding-top: 12px !important; transition: width .35s ease, padding .35s ease, border-color .25s ease, margin .35s ease !important; } /* Menú ancho completo */ .elementor-173 .elementor-element.elementor-element-5ab23c94 .header-nav .elementor-nav-menu--main { width: 100% !important; } /* Menú centrado */ .elementor-173 .elementor-element.elementor-element-5ab23c94 .header-nav .elementor-nav-menu--main > .elementor-nav-menu { justify-content: center !important; } /* ========================================================= 5. HEADER AL HACER SCROLL NEGRO TRANSLÚCIDO ========================================================= */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects { background: rgba(10, 10, 10, 0.88) !important; padding: 7px 24px !important; -webkit-backdrop-filter: blur(14px) !important; backdrop-filter: blur(14px) !important; border-bottom: 1px solid rgba(255,255,255,.10) !important; box-shadow: 0 8px 30px rgba(0,0,0,.22) !important; } /* ========================================================= 6. CONTENEDOR COLUMNA -> FILA ========================================================= */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects > .header-layout { flex-direction: row !important; justify-content: space-between !important; align-items: center !important; flex-wrap: nowrap !important; gap: 28px !important; } /* ========================================================= 7. LOGO STICKY 125px -> 72px ========================================================= */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects > .header-layout > :first-child { width: 72px !important; min-width: 72px !important; max-width: 72px !important; flex: 0 0 72px !important; margin: 0 !important; justify-content: flex-start !important; } /* Contenedor interno */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects > .header-layout > :first-child .elementor-widget-container { width: 72px !important; min-width: 72px !important; max-width: 72px !important; justify-content: flex-start !important; } /* Imagen */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects > .header-layout > :first-child img { width: 72px !important; min-width: 72px !important; max-width: 72px !important; height: auto !important; object-fit: contain !important; } /* ========================================================= 8. MENÚ -> DERECHA ========================================================= */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects > .header-layout > :last-child { width: auto !important; max-width: none !important; flex: 0 1 auto !important; margin-left: auto !important; /* ----------------------------------------- DESAPARECE LA LÍNEA ----------------------------------------- */ border-top: 0 solid transparent !important; padding-top: 0 !important; } /* Menú interno */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects .header-nav .elementor-nav-menu--main { width: auto !important; } /* Menú a la derecha */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects .header-nav .elementor-nav-menu--main > .elementor-nav-menu { justify-content: flex-end !important; } /* ========================================================= 9. COLORES DEL MENÚ SOBRE NEGRO ========================================================= */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects .header-nav .elementor-nav-menu--main .elementor-item { color: rgba(255,255,255,.86) !important; transition: color .25s ease !important; } /* Hover */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects .header-nav .elementor-nav-menu--main .elementor-item:hover { color: #ffffff !important; } /* Página activa */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects .header-nav .elementor-nav-menu--main .elementor-item.elementor-item-active { color: #ffffff !important; } /* ========================================================= 10. FLECHAS SUBMENÚ ========================================================= */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects .header-nav .sub-arrow, .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects .header-nav .sub-arrow svg { color: #ffffff !important; fill: #ffffff !important; } /* ========================================================= 11. HAMBURGUESA ========================================================= */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects .header-nav .elementor-menu-toggle { color: #ffffff !important; background: rgba(255,255,255,.10) !important; } .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects .header-nav .elementor-menu-toggle:hover { color: #ffffff !important; background: rgba(255,255,255,.18) !important; } /* ========================================================= 12. DROPDOWN ========================================================= */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects .header-nav .elementor-nav-menu--dropdown { background: rgba(15,15,15,.97) !important; border-color: rgba(255,255,255,.10) !important; } .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects .header-nav .elementor-nav-menu--dropdown .elementor-item { color: rgba(255,255,255,.88) !important; } .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects .header-nav .elementor-nav-menu--dropdown .elementor-item:hover { color: #ffffff !important; background: rgba(255,255,255,.08) !important; } /* ========================================================= 13. TABLET ========================================================= */ @media (max-width: 1024px) { .elementor-173 .elementor-element.elementor-element-5ab23c94 { padding-left: 16px !important; padding-right: 16px !important; } .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects { padding-left: 16px !important; padding-right: 16px !important; } } /* ========================================================= 14. MÓVIL ========================================================= */ @media (max-width: 767px) { .elementor-173 .elementor-element.elementor-element-5ab23c94 { padding: 10px 14px !important; } .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects { padding: 6px 14px !important; background: rgba(10,10,10,.92) !important; } .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects > .header-layout { gap: 12px !important; } /* Logo móvil sticky */ .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects > .header-layout > :first-child { width: 58px !important; min-width: 58px !important; max-width: 58px !important; flex: 0 0 58px !important; } .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects > .header-layout > :first-child .elementor-widget-container { width: 58px !important; min-width: 58px !important; max-width: 58px !important; } .elementor-173 .elementor-element.elementor-element-5ab23c94.elementor-sticky--effects > .header-layout > :first-child img { width: 58px !important; min-width: 58px !important; max-width: 58px !important; } }/* End custom CSS */