.elementor-12 .elementor-element.elementor-element-05c28cf{--display:flex;--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;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:20;}.elementor-12 .elementor-element.elementor-element-9ca6765{--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:space-evenly;--align-items:center;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-12 .elementor-element.elementor-element-293c3fa{width:var( --container-widget-width, 10% );max-width:10%;--container-widget-width:10%;--container-widget-flex-grow:0;}.elementor-12 .elementor-element.elementor-element-293c3fa img{width:100%;}.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-12 .elementor-element.elementor-element-12b51c1 .elementor-menu-toggle{margin:0 auto;}.elementor-12 .elementor-element.elementor-element-12b51c1 .elementor-nav-menu .elementor-item{font-family:"Jost", Sans-serif;font-size:16px;font-weight:300;}.elementor-12 .elementor-element.elementor-element-12b51c1 .elementor-nav-menu--main .elementor-item{color:#FFFFFF;fill:#FFFFFF;}.elementor-12 .elementor-element.elementor-element-12b51c1 .elementor-nav-menu--main .elementor-item:hover, .elementor-12 .elementor-element.elementor-element-12b51c1 .elementor-nav-menu--main .elementor-item.elementor-item-active, .elementor-12 .elementor-element.elementor-element-12b51c1 .elementor-nav-menu--main .elementor-item.highlighted, .elementor-12 .elementor-element.elementor-element-12b51c1 .elementor-nav-menu--main .elementor-item:focus{color:#A16207;fill:#A16207;}.elementor-12 .elementor-element.elementor-element-12b51c1 .elementor-nav-menu--main .elementor-item.elementor-item-active{color:#A16207;}.elementor-widget-icon-box.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon-box.elementor-view-framed .elementor-icon, .elementor-widget-icon-box.elementor-view-default .elementor-icon{fill:var( --e-global-color-primary );color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon-box .elementor-icon-box-title, .elementor-widget-icon-box .elementor-icon-box-title a{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-icon-box .elementor-icon-box-title{color:var( --e-global-color-primary );}.elementor-widget-icon-box:has(:hover) .elementor-icon-box-title, .elementor-widget-icon-box:has(:focus) .elementor-icon-box-title{color:var( --e-global-color-primary );}.elementor-widget-icon-box .elementor-icon-box-description{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-12 .elementor-element.elementor-element-cb5daa1 .elementor-icon-box-wrapper{align-items:center;gap:10px;}.elementor-12 .elementor-element.elementor-element-cb5daa1 .elementor-icon-box-title{margin-block-end:5px;color:#FFFFFF;}.elementor-12 .elementor-element.elementor-element-cb5daa1.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-12 .elementor-element.elementor-element-cb5daa1.elementor-view-framed .elementor-icon, .elementor-12 .elementor-element.elementor-element-cb5daa1.elementor-view-default .elementor-icon{fill:#FFFFFF;color:#FFFFFF;border-color:#FFFFFF;}.elementor-12 .elementor-element.elementor-element-cb5daa1 .elementor-icon{font-size:16px;}.elementor-12 .elementor-element.elementor-element-cb5daa1 .elementor-icon-box-title, .elementor-12 .elementor-element.elementor-element-cb5daa1 .elementor-icon-box-title a{font-family:"Jost", Sans-serif;font-size:16px;font-weight:600;}.elementor-12 .elementor-element.elementor-element-cb5daa1:has(:hover) .elementor-icon-box-title, .elementor-12 .elementor-element.elementor-element-cb5daa1:has(:focus) .elementor-icon-box-title{color:#FFFFFF;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-12 .elementor-element.elementor-element-1483d18 .elementor-button{background-color:#A16207;font-family:"Jost", Sans-serif;font-size:14px;font-weight:400;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-12 .elementor-element.elementor-element-05c28cf{--content-width:1280px;}}/* Start custom CSS for container, class: .elementor-element-05c28cf *//* ============================================================ HEADER PERGOFAM - ELEMENTOR PRO CSS COMPLETO ============================================================ */ /* ------------------------------------------------------------ 1. ESTADO INICIAL (Transparente sobre el Hero) ------------------------------------------------------------ */ /* Contenedor principal */ .elementor-12 .elementor-element.elementor-element-05c28cf { background-color: transparent !important; border-bottom: 1px solid transparent !important; box-shadow: none !important; transition: all 0.45s cubic-bezier(0.22, 0.61, 0.36, 1) !important; } /* Enlaces del menú de navegación de Elementor */ .elementor-12 .elementor-element.elementor-element-05c28cf .elementor-nav-menu a, .elementor-12 .elementor-element.elementor-element-05c28cf .elementor-nav-menu--main .elementor-item { color: rgba(255, 255, 255, 0.95) !important; transition: color 0.35s ease !important; } /* Caja de icono del Teléfono (.nav-phone): Icono (FontAwesome y SVG) */ .elementor-12 .elementor-element.elementor-element-05c28cf .nav-phone .elementor-icon-box-icon i, .elementor-12 .elementor-element.elementor-element-05c28cf .nav-phone .elementor-icon-box-icon svg, .elementor-12 .elementor-element.elementor-element-05c28cf .nav-phone .elementor-icon i, .elementor-12 .elementor-element.elementor-element-05c28cf .nav-phone .elementor-icon svg { color: #FFFFFF !important; fill: #FFFFFF !important; stroke: #FFFFFF !important; transition: all 0.35s ease !important; } /* Caja de icono del Teléfono (.nav-phone): Título y textos */ .elementor-12 .elementor-element.elementor-element-05c28cf .nav-phone .elementor-icon-box-title, .elementor-12 .elementor-element.elementor-element-05c28cf .nav-phone .elementor-icon-box-title a, .elementor-12 .elementor-element.elementor-element-05c28cf .nav-phone .elementor-icon-box-description, .elementor-12 .elementor-element.elementor-element-05c28cf .nav-phone, .elementor-12 .elementor-element.elementor-element-05c28cf .logo-txt { color: #FFFFFF !important; transition: color 0.35s ease !important; } /* Icono del menú hamburguesa en móvil */ .elementor-12 .elementor-element.elementor-element-05c28cf .elementor-menu-toggle svg, .elementor-12 .elementor-element.elementor-element-05c28cf .elementor-menu-toggle i { fill: #FFFFFF !important; color: #FFFFFF !important; transition: all 0.35s ease !important; } /* Logotipo: Si tu imagen/SVG es oscura, la forzamos a blanco en estado transparente */ .elementor-12 .elementor-element.elementor-element-05c28cf .header-logo img, .elementor-12 .elementor-element.elementor-element-05c28cf .header-logo svg { filter: brightness(0) invert(1); transition: filter 0.4s ease !important; } /* ------------------------------------------------------------ 2. ESTADO AL HACER SCROLL (.elementor-sticky--effects) ------------------------------------------------------------ */ /* Fondo blanco/crema con desenfoque de cristal */ .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects { background-color: rgba(250, 250, 249, 0.92) !important; backdrop-filter: blur(16px) !important; -webkit-backdrop-filter: blur(16px) !important; border-bottom: 1px solid #E4DFD8 !important; box-shadow: 0 4px 20px rgba(28, 25, 23, 0.06) !important; padding-top: 12px !important; padding-bottom: 12px !important; } /* Enlaces del menú pasan a color carbón (#1C1917) */ .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .elementor-nav-menu a, .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .elementor-nav-menu--main .elementor-item { color: #1C1917 !important; } /* Caja de icono del teléfono pasa a color carbón (#1C1917) */ .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .nav-phone .elementor-icon-box-icon i, .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .nav-phone .elementor-icon-box-icon svg, .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .nav-phone .elementor-icon i, .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .nav-phone .elementor-icon svg { color: #1C1917 !important; fill: #1C1917 !important; stroke: #1C1917 !important; } .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .nav-phone .elementor-icon-box-title, .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .nav-phone .elementor-icon-box-title a, .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .nav-phone .elementor-icon-box-description, .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .nav-phone, .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .logo-txt { color: #1C1917 !important; } /* Menú hamburguesa móvil pasa a color carbón */ .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .elementor-menu-toggle svg, .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .elementor-menu-toggle i { fill: #1C1917 !important; color: #1C1917 !important; } /* Restaurar los colores originales del logotipo */ .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .header-logo img, .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .header-logo svg { filter: none !important; } /* ------------------------------------------------------------ 3. INTERACCIONES HOVER (Dorado corporativo Pergofam #A16207) ------------------------------------------------------------ */ .elementor-12 .elementor-element.elementor-element-05c28cf .elementor-nav-menu a:hover, .elementor-12 .elementor-element.elementor-element-05c28cf.elementor-sticky--effects .elementor-nav-menu a:hover { color: #A16207 !important; } .elementor-12 .elementor-element.elementor-element-05c28cf .nav-phone:hover .elementor-icon-box-icon i, .elementor-12 .elementor-element.elementor-element-05c28cf .nav-phone:hover .elementor-icon-box-icon svg, .elementor-12 .elementor-element.elementor-element-05c28cf .nav-phone:hover .elementor-icon-box-title, .elementor-12 .elementor-element.elementor-element-05c28cf .nav-phone:hover .elementor-icon-box-title a { color: #A16207 !important; fill: #A16207 !important; stroke: #A16207 !important; }/* End custom CSS */