.elementor-15 .elementor-element.elementor-element-15c63cb{--display:flex;--min-height:119px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-15 .elementor-element.elementor-element-7e4d687{--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;}.elementor-widget-theme-site-logo .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-15 .elementor-element.elementor-element-1096bc9{--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;}.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-15 .elementor-element.elementor-element-1765eaf .elementor-menu-toggle{margin:0 auto;}.elementor-15 .elementor-element.elementor-element-1765eaf .elementor-nav-menu .elementor-item{font-family:"Poppins", Sans-serif;font-weight:700;}.elementor-15 .elementor-element.elementor-element-2bd8f9e{--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-15 .elementor-element.elementor-element-2bd8f9e.e-con{--flex-grow:0;--flex-shrink:0;}.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-15 .elementor-element.elementor-element-bef09d1 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-15 .elementor-element.elementor-element-bef09d1 .elementor-button .elementor-button-content-wrapper{gap:16px;}.elementor-15 .elementor-element.elementor-element-854503e{--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;}.elementor-15 .elementor-element.elementor-element-2754317{--grid-template-columns:repeat(0, auto);text-align:center;--grid-column-gap:5px;--grid-row-gap:0px;}.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-15 .elementor-element.elementor-element-15c63cb{--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-15 .elementor-element.elementor-element-7e4d687{--width:79%;--min-height:76px;}.elementor-15 .elementor-element.elementor-element-1096bc9{--width:100%;}}@media(min-width:768px){.elementor-15 .elementor-element.elementor-element-15c63cb{--content-width:1441px;}.elementor-15 .elementor-element.elementor-element-7e4d687{--width:17%;}.elementor-15 .elementor-element.elementor-element-1096bc9{--width:50%;}.elementor-15 .elementor-element.elementor-element-2bd8f9e{--width:15%;}.elementor-15 .elementor-element.elementor-element-854503e{--width:25%;}}/* Start custom CSS for social-icons, class: .elementor-element-2754317 *//* ========================================================= YOUR WAY CLEANING - SOCIAL MENU Para widget Social Icons de Elementor Clase del widget: yw-social-menu ========================================================= */ .yw-social-menu { display: flex !important; align-items: center !important; justify-content: center !important; gap: 12px !important; margin: 0 !important; padding: 0 !important; } /* contenedor interno del widget */ .yw-social-menu .elementor-widget-container, .yw-social-menu .elementor-social-icons-wrapper { display: flex !important; align-items: center !important; justify-content: center !important; gap: 12px !important; margin: 0 !important; padding: 0 !important; } /* cada icono */ .yw-social-menu .elementor-social-icon { width: 52px !important; height: 52px !important; min-width: 52px !important; min-height: 52px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 14px !important; text-decoration: none !important; border: 1px solid #dfe7f1 !important; background: #ffffff !important; color: #124394 !important; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06) !important; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease !important; margin: 0 !important; padding: 0 !important; } /* tamaño del icono */ .yw-social-menu .elementor-social-icon i, .yw-social-menu .elementor-social-icon svg { font-size: 22px !important; width: 22px !important; height: 22px !important; } /* hover general */ .yw-social-menu .elementor-social-icon:hover { transform: translateY(-2px) !important; box-shadow: 0 10px 22px rgba(0, 0, 0, 0.10) !important; border-color: #18b9ec !important; } /* ========================================================= COLORES POR RED ========================================================= */ /* Facebook */ .yw-social-menu .elementor-social-icon-facebook { background: linear-gradient(135deg, #1877f2 0%, #124394 100%) !important; color: #ffffff !important; border: none !important; } /* X / Twitter */ .yw-social-menu .elementor-social-icon-twitter, .yw-social-menu .elementor-social-icon-x-twitter { background: #111111 !important; color: #ffffff !important; border: none !important; } /* YouTube */ .yw-social-menu .elementor-social-icon-youtube { background: linear-gradient(135deg, #ff3b30 0%, #c61d1d 100%) !important; color: #ffffff !important; border: none !important; } /* Instagram */ .yw-social-menu .elementor-social-icon-instagram { background: linear-gradient(135deg, #f58529 0%, #dd2a7b 45%, #8134af 75%, #515bd4 100%) !important; color: #ffffff !important; border: none !important; } /* TikTok */ .yw-social-menu .elementor-social-icon-tiktok { background: #111111 !important; color: #ffffff !important; border: none !important; } /* Google */ .yw-social-menu .elementor-social-icon-google, .yw-social-menu .elementor-social-icon-google-plus { background: #ffffff !important; color: #4285f4 !important; border: 1px solid #dfe7f1 !important; } /* WhatsApp */ .yw-social-menu .elementor-social-icon-whatsapp { background: linear-gradient(135deg, #25d366 0%, #169c4f 100%) !important; color: #ffffff !important; border: none !important; } /* ========================================================= OPCIONAL: SI QUIERES QUE SE VEAN MÁS "MENÚ" ========================================================= */ .yw-social-menu.is-menu-style .elementor-social-icon { width: 56px !important; height: 44px !important; min-width: 56px !important; min-height: 44px !important; border-radius: 10px !important; } /* ========================================================= TABLET ========================================================= */ @media (max-width: 1024px) { .yw-social-menu, .yw-social-menu .elementor-social-icons-wrapper { gap: 10px !important; } .yw-social-menu .elementor-social-icon { width: 48px !important; height: 48px !important; min-width: 48px !important; min-height: 48px !important; border-radius: 12px !important; } .yw-social-menu .elementor-social-icon i, .yw-social-menu .elementor-social-icon svg { font-size: 20px !important; width: 20px !important; height: 20px !important; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 767px) { .yw-social-menu, .yw-social-menu .elementor-social-icons-wrapper { gap: 8px !important; justify-content: center !important; flex-wrap: wrap !important; } .yw-social-menu .elementor-social-icon { width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important; border-radius: 10px !important; } .yw-social-menu .elementor-social-icon i, .yw-social-menu .elementor-social-icon svg { font-size: 18px !important; width: 18px !important; height: 18px !important; } }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-854503e *//* ========================================================= SOCIAL ICONS - SOLO VERDES ========================================================= */ .yw-social .elementor-social-icons-wrapper { display: flex !important; align-items: center !important; gap: 10px !important; } /* BASE GENERAL */ .yw-social .elementor-social-icon { width: 48px !important; height: 48px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 14px !important; color: #ffffff !important; border: 1px solid rgba(255,255,255,.20) !important; background: linear-gradient( 135deg, #3fae2a 0%, #67c74a 52%, #a8db63 100% ) !important; box-shadow: 0 6px 16px rgba(92, 172, 56, 0.20), inset 0 1px 0 rgba(255,255,255,.18) !important; position: relative !important; overflow: hidden !important; transition: transform .25s ease, box-shadow .25s ease, filter .25s ease !important; } /* VARIACIONES SUAVES */ .yw-social .elementor-social-icon-facebook, .yw-social .elementor-social-icon-facebook-f { background: linear-gradient( 135deg, #49b534 0%, #7ccc57 58%, #b7e27a 100% ) !important; } .yw-social .elementor-social-icon-instagram { background: linear-gradient( 135deg, #56b83f 0%, #86cf5d 50%, #c0e98a 100% ) !important; } .yw-social .elementor-social-icon-tiktok, .yw-social .elementor-social-icon-youtube { background: linear-gradient( 135deg, #43a92d 0%, #6bc64d 50%, #9fdb66 100% ) !important; } /* ICONO INTERNO */ .yw-social .elementor-social-icon i { color: #ffffff !important; font-size: 20px !important; } .yw-social .elementor-social-icon svg { fill: #ffffff !important; color: #ffffff !important; width: 20px !important; height: 20px !important; } /* BRILLO SUTIL */ .yw-social .elementor-social-icon::before { content: ""; position: absolute; width: 70px; height: 70px; top: -48px; left: -42px; border-radius: 50%; background: rgba(255,255,255,.18); pointer-events: none; transition: transform .35s ease !important; } /* HOVER */ .yw-social .elementor-social-icon:hover { transform: translateY(-3px) scale(1.05) !important; filter: saturate(1.08) brightness(1.03) !important; box-shadow: 0 10px 22px rgba(92, 172, 56, 0.26), inset 0 1px 0 rgba(255,255,255,.22) !important; } .yw-social .elementor-social-icon:hover::before { transform: translate(28px, 28px) !important; } /* MOBILE */ @media (max-width: 767px) { .yw-social .elementor-social-icon { width: 42px !important; height: 42px !important; border-radius: 12px !important; } .yw-social .elementor-social-icon i { font-size: 18px !important; } .yw-social .elementor-social-icon svg { width: 18px !important; height: 18px !important; } }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-15c63cb *//* ========================================================= YOUR WAY CLEANING LLC HEADER RESPONSIVE - VERSION FINAL ========================================================= */ /* ========================================================= 1. HEADER GENERAL ========================================================= */ .yw-header { width: 100% !important; min-height: 76px !important; margin: 0 !important; padding: 0 4% !important; display: flex !important; align-items: center !important; position: relative !important; z-index: 99999 !important; overflow: visible !important; box-sizing: border-box !important; background: rgba(255,255,255,.98) !important; border-bottom: 1px solid rgba(23,63,145,.06) !important; box-shadow: 0 5px 20px rgba(23,63,145,.045) !important; } /* ========================================================= 2. CONTENEDOR INTERNO DE ELEMENTOR ========================================================= */ .yw-header > .e-con-inner, .yw-header > .elementor-container { width: 100% !important; max-width: 1500px !important; min-height: 76px !important; margin: 0 auto !important; padding: 0 !important; display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; gap: 22px !important; box-sizing: border-box !important; overflow: visible !important; } /* ========================================================= 3. LIMPIEZA DE MARGENES DE ELEMENTOR ========================================================= */ .yw-header .elementor-widget, .yw-header .elementor-widget-container { margin-bottom: 0 !important; } .yw-header .elementor-element { --margin-top: 0px !important; --margin-bottom: 0px !important; } /* ========================================================= 4. LOGO ========================================================= */ .yw-logo { flex: 0 0 auto !important; width: auto !important; margin: 0 !important; padding: 0 !important; position: relative !important; z-index: 100002 !important; } .yw-logo img { width: 175px !important; max-width: 175px !important; height: auto !important; display: block !important; object-fit: contain !important; margin: 0 !important; } /* ========================================================= 5. CONTENEDOR DEL MENU ========================================================= */ .yw-menu { flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; margin: 0 25px !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; position: static !important; overflow: visible !important; z-index: 100003 !important; } .yw-menu .elementor-widget-container { position: static !important; overflow: visible !important; } /* ========================================================= 6. MENU PRINCIPAL - SOLO DESKTOP ========================================================= */ .yw-menu .elementor-nav-menu--main > .elementor-nav-menu { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: center !important; gap: 4px !important; margin: 0 !important; padding: 0 !important; } .yw-menu .elementor-nav-menu--main > .elementor-nav-menu > li { margin: 0 !important; padding: 0 !important; } /* LINKS DESKTOP */ .yw-menu .elementor-nav-menu--main > .elementor-nav-menu > li > a { min-height: 76px !important; padding: 0 16px !important; display: flex !important; align-items: center !important; justify-content: center !important; color: #30343a !important; background: transparent !important; font-family: "Manrope", sans-serif !important; font-size: 16px !important; font-weight: 600 !important; line-height: 1 !important; white-space: nowrap !important; transition: color .22s ease !important; } /* HOVER */ .yw-menu .elementor-nav-menu--main > .elementor-nav-menu > li > a:hover { color: #168fd5 !important; } /* PAGINA ACTIVA */ .yw-menu .elementor-nav-menu--main .elementor-item-active { color: #168fd5 !important; } /* LINEA ACTIVA / HOVER */ .yw-menu .elementor-nav-menu--main .elementor-item::after { height: 2px !important; bottom: 13px !important; } /* ========================================================= 7. BOTON GET A FREE QUOTE ========================================================= */ .yw-quote { flex: 0 0 auto !important; width: auto !important; margin: 0 !important; position: relative !important; z-index: 100002 !important; } .yw-quote .elementor-button { min-width: 178px !important; min-height: 44px !important; padding: 12px 23px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; color: #ffffff !important; font-family: "Manrope", sans-serif !important; font-size: 14px !important; font-weight: 700 !important; line-height: 1 !important; border: none !important; border-radius: 999px !important; background: linear-gradient( 90deg, #0872c7 0%, #17b8e7 100% ) !important; box-shadow: 0 7px 18px rgba(10,126,201,.18) !important; transition: transform .22s ease, box-shadow .22s ease !important; } .yw-quote .elementor-button:hover { transform: translateY(-2px) !important; box-shadow: 0 11px 24px rgba(10,126,201,.25) !important; } /* ========================================================= 8. REDES SOCIALES ========================================================= */ .yw-social { flex: 0 0 auto !important; width: auto !important; margin: 0 !important; position: relative !important; z-index: 100002 !important; } .yw-social .elementor-social-icons-wrapper { display: flex !important; align-items: center !important; gap: 8px !important; } .yw-social .elementor-social-icon { width: 43px !important; height: 43px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 13px !important; color: #ffffff !important; background: linear-gradient( 135deg, #3fae2d 0%, #68c748 52%, #9ada5e 100% ) !important; box-shadow: 0 6px 15px rgba(79,164,52,.18) !important; transition: transform .2s ease, box-shadow .2s ease !important; } .yw-social .elementor-social-icon:hover { transform: translateY(-2px) !important; box-shadow: 0 9px 19px rgba(79,164,52,.24) !important; } .yw-social .elementor-social-icon i { color: #ffffff !important; } .yw-social .elementor-social-icon svg { color: #ffffff !important; fill: #ffffff !important; } /* ========================================================= TABLET ========================================================= */ @media (max-width: 1024px) { .yw-header { min-height: 72px !important; padding: 0 24px !important; } .yw-header > .e-con-inner, .yw-header > .elementor-container { min-height: 72px !important; gap: 15px !important; } .yw-logo img { width: 148px !important; max-width: 148px !important; } /* En tablet quitamos elementos secundarios y damos prioridad a logo + menú. */ .yw-quote, .yw-social { display: none !important; } .yw-menu { flex: 0 0 auto !important; margin: 0 0 0 auto !important; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 767px) { /* ===================================================== HEADER MOBILE ===================================================== */ .yw-header { width: 100% !important; height: 82px !important; min-height: 82px !important; margin: 0 !important; padding: 0 16px !important; display: flex !important; align-items: center !important; position: relative !important; z-index: 999999 !important; overflow: visible !important; background: #ffffff !important; box-sizing: border-box !important; } /* ===================================================== INNER MOBILE ===================================================== */ .yw-header > .e-con-inner, .yw-header > .elementor-container { width: 100% !important; max-width: 100% !important; height: 74px !important; min-height: 74px !important; margin: 0 !important; padding: 0 !important; display: grid !important; grid-template-columns: minmax(0, 1fr) 48px !important; align-items: center !important; gap: 12px !important; position: static !important; overflow: visible !important; } /* ===================================================== LOGO MOBILE ===================================================== */ .yw-logo { grid-column: 1 !important; justify-self: start !important; width: auto !important; max-width: 150px !important; min-width: 0 !important; margin: 0 !important; } .yw-logo img { width: 140px !important; max-width: 140px !important; height: auto !important; } /* ===================================================== OCULTAR CTA + REDES ===================================================== */ .yw-quote, .yw-social { display: none !important; } /* ===================================================== WIDGET MENU MOBILE ===================================================== */ .yw-menu { grid-column: 2 !important; justify-self: end !important; flex: none !important; width: 48px !important; min-width: 48px !important; max-width: 48px !important; margin: 0 !important; padding: 0 !important; position: static !important; overflow: visible !important; z-index: 1000001 !important; } .yw-menu .elementor-widget-container { width: 48px !important; max-width: 48px !important; position: static !important; overflow: visible !important; } /* ===================================================== HAMBURGER ===================================================== */ .yw-menu .elementor-menu-toggle { width: 46px !important; height: 46px !important; min-width: 46px !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; border: 1px solid rgba(95,185,61,.24) !important; border-radius: 13px !important; color: #173f91 !important; background: linear-gradient( 145deg, #ffffff, #f4faef ) !important; box-shadow: 0 5px 15px rgba(23,63,145,.09) !important; font-size: 23px !important; position: relative !important; z-index: 1000005 !important; } .yw-menu .elementor-menu-toggle:hover { color: #58b83b !important; } /* ===================================================== DROPDOWN MOBILE ANCHO COMPLETO REAL ===================================================== */ .yw-menu .elementor-nav-menu--dropdown { position: fixed !important; top: 74px !important; left: 0 !important; right: auto !important; width: 100vw !important; min-width: 100vw !important; max-width: 100vw !important; margin: 0 !important; padding: 14px 16px 18px !important; box-sizing: border-box !important; transform: none !important; background: rgba(255,255,255,.995) !important; border-top: 1px solid rgba(23,63,145,.055) !important; border-bottom: 1px solid rgba(23,63,145,.08) !important; border-radius: 0 0 22px 22px !important; box-shadow: 0 20px 38px rgba(23,63,145,.14) !important; overflow-x: hidden !important; overflow-y: auto !important; max-height: calc(100dvh - 74px) !important; z-index: 999998 !important; } /* ===================================================== UL DEL DROPDOWN ===================================================== */ .yw-menu .elementor-nav-menu--dropdown > .elementor-nav-menu, .yw-menu .elementor-nav-menu--dropdown .elementor-nav-menu { width: 100% !important; min-width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; gap: 6px !important; box-sizing: border-box !important; } /* ===================================================== LI ===================================================== */ .yw-menu .elementor-nav-menu--dropdown li { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; display: block !important; box-sizing: border-box !important; } /* ===================================================== LINKS DEL MENU MOBILE ===================================================== */ .yw-menu .elementor-nav-menu--dropdown a { width: 100% !important; max-width: 100% !important; min-height: 51px !important; margin: 0 !important; padding: 14px 16px !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; box-sizing: border-box !important; border: 1px solid rgba(23,63,145,.055) !important; border-radius: 13px !important; background: #ffffff !important; color: #173f91 !important; font-family: "Manrope", sans-serif !important; font-size: 16px !important; font-weight: 600 !important; line-height: 1.2 !important; text-align: left !important; white-space: normal !important; word-break: normal !important; overflow-wrap: normal !important; box-shadow: 0 3px 10px rgba(23,63,145,.025) !important; transition: color .2s ease, background .2s ease, transform .2s ease !important; } /* ===================================================== HOVER MOBILE ===================================================== */ .yw-menu .elementor-nav-menu--dropdown a:hover { color: #4c9f35 !important; background: #f7fbf4 !important; transform: translateX(3px) !important; } /* ===================================================== PAGINA ACTIVA ===================================================== */ .yw-menu .elementor-nav-menu--dropdown .elementor-item-active { color: #4c9f35 !important; background: linear-gradient( 90deg, rgba(96,187,61,.12), rgba(96,187,61,.04) ) !important; border-color: rgba(96,187,61,.16) !important; } /* ===================================================== QUITAR EFECTOS DESKTOP EN MOBILE ===================================================== */ .yw-menu .elementor-nav-menu--dropdown a::before, .yw-menu .elementor-nav-menu--dropdown a::after { display: none !important; } /* ===================================================== FLECHAS ===================================================== */ .yw-menu .elementor-nav-menu--dropdown .sub-arrow { margin-left: auto !important; } } /* ========================================================= TELEFONOS PEQUEÑOS ========================================================= */ @media (max-width: 480px) { .yw-header { padding: 0 14px !important; } .yw-logo img { width: 132px !important; max-width: 132px !important; } .yw-menu { width: 44px !important; min-width: 44px !important; max-width: 44px !important; } .yw-menu .elementor-widget-container { width: 44px !important; max-width: 44px !important; } .yw-menu .elementor-menu-toggle { width: 44px !important; height: 44px !important; min-width: 44px !important; } .yw-menu .elementor-nav-menu--dropdown { padding: 12px 13px 16px !important; } .yw-menu .elementor-nav-menu--dropdown a { min-height: 49px !important; padding: 13px 15px !important; font-size: 15px !important; } }/* ========================================================= YOUR WAY CLEANING MOBILE HEADER + MENU ABRE Y CIERRA CORRECTAMENTE ========================================================= */ @media (max-width: 767px) { /* ===================================================== HEADER ===================================================== */ .yw-header { width: 100% !important; height: 74px !important; min-height: 74px !important; margin: 0 !important; padding: 0 16px !important; position: relative !important; z-index: 999999 !important; overflow: visible !important; background: #ffffff !important; box-sizing: border-box !important; border-bottom: 1px solid rgba(23,63,145,.06) !important; } /* ===================================================== INNER ===================================================== */ .yw-header > .e-con-inner, .yw-header > .elementor-container { width: 100% !important; max-width: 100% !important; height: 74px !important; min-height: 74px !important; margin: 0 !important; padding: 0 !important; display: grid !important; grid-template-columns: minmax(0,1fr) 48px !important; align-items: center !important; gap: 12px !important; position: static !important; overflow: visible !important; } /* ===================================================== LOGO ===================================================== */ .yw-logo { grid-column: 1 !important; justify-self: start !important; width: auto !important; max-width: 150px !important; margin: 0 !important; padding: 0 !important; position: relative !important; z-index: 1000002 !important; } .yw-logo img { width: 140px !important; max-width: 140px !important; height: auto !important; display: block !important; } /* ===================================================== OCULTAR CTA Y REDES ===================================================== */ .yw-quote, .yw-social { display: none !important; } /* ===================================================== CONTENEDOR MENU ===================================================== */ .yw-menu { grid-column: 2 !important; justify-self: end !important; flex: none !important; width: 48px !important; min-width: 48px !important; max-width: 48px !important; margin: 0 !important; padding: 0 !important; position: static !important; overflow: visible !important; z-index: 1000003 !important; } .yw-menu .elementor-widget-container { width: 48px !important; max-width: 48px !important; margin: 0 !important; position: static !important; overflow: visible !important; } /* ===================================================== HAMBURGER ===================================================== */ .yw-menu .elementor-menu-toggle { width: 46px !important; height: 46px !important; min-width: 46px !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; border: 1px solid rgba(95,185,61,.25) !important; border-radius: 13px !important; color: #173f91 !important; background: linear-gradient( 145deg, #ffffff, #f4faef ) !important; box-shadow: 0 5px 15px rgba(23,63,145,.09) !important; font-size: 23px !important; position: relative !important; z-index: 1000005 !important; } .yw-menu .elementor-menu-toggle:hover { color: #58b83b !important; } /* ===================================================== DROPDOWN ESTADO CERRADO ===================================================== */ .yw-menu .elementor-nav-menu__container { position: fixed !important; top: 74px !important; left: 0 !important; right: 0 !important; width: 100vw !important; min-width: 100vw !important; max-width: 100vw !important; margin: 0 !important; padding: 0 16px !important; box-sizing: border-box !important; background: rgba(255,255,255,.995) !important; border-bottom: 1px solid rgba(23,63,145,.07) !important; box-shadow: 0 18px 35px rgba(23,63,145,.13) !important; border-radius: 0 0 22px 22px !important; /* ----------------------------------------------- CERRADO ----------------------------------------------- */ max-height: 0 !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; overflow: hidden !important; transform: translateY(-8px) !important; transition: max-height .35s ease, opacity .22s ease, transform .30s ease, visibility .22s ease !important; z-index: 999998 !important; } /* ===================================================== DROPDOWN ESTADO ABIERTO ===================================================== */ .yw-menu .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container { max-height: calc(100dvh - 74px) !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; overflow-x: hidden !important; overflow-y: auto !important; transform: translateY(0) !important; padding: 14px 16px 18px !important; } /* ===================================================== UL ===================================================== */ .yw-menu .elementor-nav-menu__container .elementor-nav-menu { width: 100% !important; min-width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; gap: 6px !important; box-sizing: border-box !important; } /* ===================================================== ITEMS ===================================================== */ .yw-menu .elementor-nav-menu__container li { width: 100% !important; max-width: 100% !important; display: block !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; } /* ===================================================== LINKS ===================================================== */ .yw-menu .elementor-nav-menu__container a { width: 100% !important; min-height: 50px !important; margin: 0 !important; padding: 14px 16px !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; box-sizing: border-box !important; border: 1px solid rgba(23,63,145,.06) !important; border-radius: 13px !important; background: #ffffff !important; color: #173f91 !important; font-family: "Manrope", sans-serif !important; font-size: 16px !important; font-weight: 600 !important; line-height: 1.2 !important; text-align: left !important; white-space: normal !important; word-break: normal !important; overflow-wrap: normal !important; box-shadow: 0 3px 10px rgba(23,63,145,.025) !important; transition: transform .20s ease, background .20s ease, color .20s ease !important; } /* ===================================================== HOVER ===================================================== */ .yw-menu .elementor-nav-menu__container a:hover { color: #4d9f35 !important; background: #f7fbf4 !important; transform: translateX(3px) !important; } /* ===================================================== ACTIVO ===================================================== */ .yw-menu .elementor-nav-menu__container .elementor-item-active { color: #4d9f35 !important; background: linear-gradient( 90deg, rgba(96,187,61,.12), rgba(96,187,61,.04) ) !important; border-color: rgba(96,187,61,.16) !important; } /* ===================================================== QUITAR EFECTOS DESKTOP ===================================================== */ .yw-menu .elementor-nav-menu__container a::before, .yw-menu .elementor-nav-menu__container a::after { display: none !important; } } /* ========================================================= TELEFONOS PEQUEÑOS ========================================================= */ @media (max-width: 480px) { .yw-header { padding: 0 14px !important; } .yw-logo img { width: 132px !important; max-width: 132px !important; } .yw-menu, .yw-menu .elementor-widget-container { width: 44px !important; min-width: 44px !important; max-width: 44px !important; } .yw-menu .elementor-menu-toggle { width: 44px !important; height: 44px !important; min-width: 44px !important; } .yw-menu .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container { padding: 12px 13px 16px !important; } .yw-menu .elementor-nav-menu__container a { min-height: 48px !important; padding: 13px 15px !important; font-size: 15px !important; } }/* End custom CSS */