.elementor-61 .elementor-element.elementor-element-c2d7dd7 > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-61 .elementor-element.elementor-element-c2d7dd7:not(.elementor-motion-effects-element-type-background), .elementor-61 .elementor-element.elementor-element-c2d7dd7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-597ef89 );}.elementor-61 .elementor-element.elementor-element-c2d7dd7 > .elementor-container{max-width:1300px;}.elementor-61 .elementor-element.elementor-element-c2d7dd7{border-style:solid;border-width:0px 0px 0px 0px;border-color:#d6d6d6;transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:-125px;margin-bottom:0px;padding:5px 020px 5px 20px;z-index:1000;}.elementor-61 .elementor-element.elementor-element-c2d7dd7 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.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-61 .elementor-element.elementor-element-4309812 img{width:43%;}.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-61 .elementor-element.elementor-element-277fdc8 .elementor-menu-toggle{margin-left:auto;background-color:#16445700;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu .elementor-item{font-family:"DM Sans", Sans-serif;font-size:19px;font-weight:500;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-cffb0f8 );fill:var( --e-global-color-cffb0f8 );padding-left:30px;padding-right:30px;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--main .elementor-item:hover, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--main .elementor-item.elementor-item-active, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--main .elementor-item.highlighted, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-0740c90 );fill:var( --e-global-color-0740c90 );}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--main .elementor-item.elementor-item-active{color:var( --e-global-color-0740c90 );}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown a, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-menu-toggle{color:var( --e-global-color-597ef89 );fill:var( --e-global-color-597ef89 );}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown{background-color:var( --e-global-color-0740c90 );border-radius:12px 12px 12px 12px;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown a:hover, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown a:focus, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown a.elementor-item-active, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown a.highlighted, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-menu-toggle:hover, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-menu-toggle:focus{color:var( --e-global-color-cffb0f8 );}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown a:hover, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown a:focus, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown a.elementor-item-active, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown a.highlighted{background-color:var( --e-global-color-597ef89 );}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown .elementor-item, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown .elementor-sub-item{font-family:"DM Sans", Sans-serif;font-size:16px;font-weight:500;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown li:first-child a{border-top-left-radius:12px;border-top-right-radius:12px;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown li:last-child a{border-bottom-right-radius:12px;border-bottom-left-radius:12px;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--main .elementor-nav-menu--dropdown, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu__container.elementor-nav-menu--dropdown{box-shadow:2px 6px 40px 0px rgba(0, 0, 0, 0.15);}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown li:not(:last-child){border-style:solid;border-color:#C3C3C3;border-bottom-width:1px;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu__container.elementor-nav-menu--dropdown{margin-top:15px !important;}.elementor-61 .elementor-element.elementor-element-277fdc8 div.elementor-menu-toggle{color:var( --e-global-color-cffb0f8 );}.elementor-61 .elementor-element.elementor-element-277fdc8 div.elementor-menu-toggle svg{fill:var( --e-global-color-cffb0f8 );}.elementor-61 .elementor-element.elementor-element-277fdc8 div.elementor-menu-toggle:hover, .elementor-61 .elementor-element.elementor-element-277fdc8 div.elementor-menu-toggle:focus{color:var( --e-global-color-0740c90 );}.elementor-61 .elementor-element.elementor-element-277fdc8 div.elementor-menu-toggle:hover svg, .elementor-61 .elementor-element.elementor-element-277fdc8 div.elementor-menu-toggle:focus svg{fill:var( --e-global-color-0740c90 );}.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-61 .elementor-element.elementor-element-26e573b .elementor-button{background-color:var( --e-global-color-cffb0f8 );font-family:"Roboto", Sans-serif;font-weight:500;fill:var( --e-global-color-597ef89 );color:var( --e-global-color-597ef89 );border-style:none;border-radius:25px 25px 25px 25px;padding:15px 40px 015px 40px;}.elementor-61 .elementor-element.elementor-element-26e573b .elementor-button:hover, .elementor-61 .elementor-element.elementor-element-26e573b .elementor-button:focus{background-color:var( --e-global-color-0740c90 );color:var( --e-global-color-597ef89 );border-color:#000000;}.elementor-61 .elementor-element.elementor-element-26e573b .elementor-button:hover svg, .elementor-61 .elementor-element.elementor-element-26e573b .elementor-button:focus svg{fill:var( --e-global-color-597ef89 );}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:1024px){.elementor-61 .elementor-element.elementor-element-c2d7dd7{padding:20px 20px 20px 20px;}}@media(max-width:767px){.elementor-61 .elementor-element.elementor-element-c2d7dd7{padding:5px 5px 5px 05px;}.elementor-61 .elementor-element.elementor-element-72e73ca{width:70%;}.elementor-61 .elementor-element.elementor-element-72e73ca > .elementor-element-populated{padding:0px 0px 0px 0px;}.elementor-61 .elementor-element.elementor-element-4309812 > .elementor-widget-container{padding:0px 0px 0px 20px;}.elementor-61 .elementor-element.elementor-element-4309812{text-align:start;}.elementor-61 .elementor-element.elementor-element-70cce62{width:30%;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown .elementor-item, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown .elementor-sub-item{font-size:20px;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown{border-radius:20px 20px 20px 20px;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown li:first-child a{border-top-left-radius:20px;border-top-right-radius:20px;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown li:last-child a{border-bottom-right-radius:20px;border-bottom-left-radius:20px;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--dropdown a{padding-top:17px;padding-bottom:17px;}.elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown, .elementor-61 .elementor-element.elementor-element-277fdc8 .elementor-nav-menu__container.elementor-nav-menu--dropdown{margin-top:35px !important;}.elementor-61 .elementor-element.elementor-element-dbd5951{width:50%;}}@media(min-width:768px){.elementor-61 .elementor-element.elementor-element-72e73ca{width:18.663%;}.elementor-61 .elementor-element.elementor-element-70cce62{width:65.394%;}.elementor-61 .elementor-element.elementor-element-dbd5951{width:15.607%;}}@media(max-width:1024px) and (min-width:768px){.elementor-61 .elementor-element.elementor-element-70cce62{width:35%;}.elementor-61 .elementor-element.elementor-element-dbd5951{width:30%;}}/* Start custom CSS for nav-menu, class: .elementor-element-277fdc8 */.header-flotante .elementor-nav-menu--main .elementor-item::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 6px; height: 2px; border-radius: 999px; background: linear-gradient(90deg, rgba(27, 116, 144, 0) 0%, #0B2D3A 20%, #164457 80%, rgba(40, 62, 76, 0) 100%); transform: scaleX(0); opacity: 0; transform-origin: right center; transition: transform .55s cubic-bezier(.16, 1, .3, 1), opacity .4s ease; } .header-flotante .elementor-nav-menu--main .elementor-item:hover::after, .header-flotante .elementor-nav-menu--main .elementor-item:focus-visible::after, .header-flotante .elementor-nav-menu--main .elementor-item.elementor-item-active::after { transform: scaleX(1); opacity: 1; transform-origin: left center; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-26e573b *//* ============================================================ BOTONES "boton-oscuro" + "boton-claro" — versión premium ------------------------------------------------------------ Sustituye los dos CSS anteriores por ESTE archivo (las clases no cambian: nada que tocar en los widgets). Toques premium añadidos al barrido original: · Destello de luz que cruza el botón justo después del barrido (con un pequeño retardo, como un acabado pulido). · Lift al hover con easing tipo "settle" y estado :active que se hunde ligeramente → tacto físico. · Keyline interior de 1px + luz superior inset, como un borde de joyería en la píldora. · Barrido con cubic-bezier (arranca rápido, asienta suave). · letter-spacing fino, focus visible accesible y respeto de prefers-reduced-motion. USO: igual que antes — clase en Avanzado > Clases CSS y este CSS en Ajustes del sitio > CSS personalizado. ============================================================ */ /* ---- Base común ---- */ .boton-oscuro .elementor-button, .boton-claro .elementor-button { position: relative; overflow: hidden; z-index: 1; border: none; border-radius: 30em; padding: 0.95em 2.3em; font-family: 'DM Sans', sans-serif; font-size: 18px; font-weight: 500; letter-spacing: 0.02em; transition: transform .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s cubic-bezier(.22,.61,.36,1); will-change: transform; } /* Capa de barrido izquierda → derecha */ .boton-oscuro .elementor-button::before, .boton-claro .elementor-button::before { content: ''; position: absolute; top: 0; left: 0; width: 0; height: 100%; border-radius: 30em; transition: width .55s cubic-bezier(.22,.61,.36,1); display: block; z-index: -1; } /* Destello que cruza el botón */ .boton-oscuro .elementor-button::after, .boton-claro .elementor-button::after { content: ''; position: absolute; top: 0; left: 0; width: 45%; height: 100%; transform: translateX(-160%) skewX(-18deg); z-index: -1; pointer-events: none; } /* ---- Interacción común ---- */ .boton-oscuro .elementor-button:hover, .boton-claro .elementor-button:hover, .boton-oscuro .elementor-button:focus, .boton-claro .elementor-button:focus { transform: translateY(-2px); } .boton-oscuro .elementor-button:hover::before, .boton-claro .elementor-button:hover::before, .boton-oscuro .elementor-button:focus::before, .boton-claro .elementor-button:focus::before { width: 100%; } .boton-oscuro .elementor-button:hover::after, .boton-claro .elementor-button:hover::after, .boton-oscuro .elementor-button:focus::after, .boton-claro .elementor-button:focus::after { animation: boton-brillo .9s ease .15s 1; } .boton-oscuro .elementor-button:active, .boton-claro .elementor-button:active { transform: translateY(0) scale(.985); } @keyframes boton-brillo { from { transform: translateX(-160%) skewX(-18deg); } to { transform: translateX(320%) skewX(-18deg); } } /* Anillo de foco solo con teclado */ .boton-oscuro .elementor-button:focus-visible, .boton-claro .elementor-button:focus-visible { outline: 2px solid rgba(27, 116, 144, .6); outline-offset: 3px; } /* ============ BOTÓN OSCURO ============ */ .boton-oscuro .elementor-button { background-color: #0B2D3A !important; color: #ffffff; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10), /* luz superior */ inset 0 0 0 1px rgba(164, 216, 229, .14), /* keyline */ 0 8px 20px rgba(11, 45, 58, .28); } .boton-oscuro .elementor-button::before { background-image: linear-gradient(to right, #0B2D3A 0%, #164457 100%); } /* Destello blanco (luz sobre superficie oscura) */ .boton-oscuro .elementor-button::after { background: linear-gradient(105deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.20) 45%, rgba(255,255,255,.38) 50%, rgba(255,255,255,.20) 55%, rgba(255,255,255,0) 100%); } .boton-oscuro .elementor-button:hover, .boton-oscuro .elementor-button:focus { background-color: #0B2D3A !important; color: #ffffff; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10), inset 0 0 0 1px rgba(164, 216, 229, .14), 0 12px 28px rgba(11, 45, 58, .40); } /* ============ BOTÓN CLARO ============ */ .boton-claro .elementor-button { background-color: #ffffff !important; color: #0B2D3A; box-shadow: inset 0 1px 0 #ffffff, /* luz superior */ inset 0 0 0 1px rgba(11, 45, 58, .08), /* keyline */ 0 8px 20px rgba(11, 45, 58, .22); } .boton-claro .elementor-button::before { background-image: linear-gradient(to right, #ffffff 0%, #F7F5EFEB 100%); } /* Destello teal muy tenue (blanco sobre blanco no se vería) */ .boton-claro .elementor-button::after { background: linear-gradient(105deg, rgba(22, 68, 87, 0) 0%, rgba(22, 68, 87, .05) 45%, rgba(22, 68, 87, .09) 50%, rgba(22, 68, 87, .05) 55%, rgba(22, 68, 87, 0) 100%); } .boton-claro .elementor-button:hover, .boton-claro .elementor-button:focus { background-color: #ffffff !important; color: #0B2D3A; box-shadow: inset 0 1px 0 #ffffff, inset 0 0 0 1px rgba(11, 45, 58, .08), 0 12px 28px rgba(11, 45, 58, .30); } /* ---- Accesibilidad: sin movimiento ---- */ @media (prefers-reduced-motion: reduce) { .boton-oscuro .elementor-button, .boton-claro .elementor-button, .boton-oscuro .elementor-button::before, .boton-claro .elementor-button::before { transition-duration: 0s; } .boton-oscuro .elementor-button:hover, .boton-claro .elementor-button:hover, .boton-oscuro .elementor-button:focus, .boton-claro .elementor-button:focus { transform: none; } .boton-oscuro .elementor-button::after, .boton-claro .elementor-button::after { animation: none !important; } } /* ------------------------------------------------------------ Variantes rápidas: · Barrido oscuro más visible: cambia el 0% de su gradiente por #1B7490. · Barrido claro más visible: cambia #F7F5EFEB por #EAE6D8. · Sombra neumórfica (solo sobre fondo crema): 6px 6px 12px rgba(0,0,0,.12), -6px -6px 12px #ffffff; ------------------------------------------------------------ *//* End custom CSS */ /* Start custom CSS for section, class: .elementor-element-c2d7dd7 *//* Header flotante tipo píldora — v2 */ .header-flotante { position: fixed !important; top: 24px !important; left: 0 !important; right: 0 !important; margin-left: auto !important; margin-right: auto !important; transform: none !important; width: min(1280px, calc(100% - 48px)) !important; z-index: 999; background: #F2EFE9; border-radius: 999px; box-shadow: 0 10px 30px rgba(40, 62, 76, .14); padding: 10px 36px; } body.admin-bar .header-flotante { top: 56px !important; } /* Que el botón no parta "Reservar cita" en dos líneas */ .header-flotante .elementor-button { white-space: nowrap; } @media (max-width: 767px) { .header-flotante { top: 12px !important; width: calc(100% - 24px) !important; padding: 8px 18px; } body.admin-bar .header-flotante { top: 58px !important; /* en móvil la barra de admin mide 46px */ } }/* End custom CSS */