/* * Overrides propios del tema Histhana. * * Se carga DESPUES del CSS espejado de Elementor (ver histhana_enqueue_custom en * functions.php), asi que gana sin necesidad de !important salvo donde se indica. * Todo lo que se toque aqui sobrevive a una regeneracion con tools/clone.mjs. * * Indice: * 0. Botones - grosor de la flecha * 0b. Movimiento - curvas, aparicion al hacer scroll, parallax * 1. Navbar - el boton verde no se estira * 2. Hero - video de fondo self-hosted * 3. Carrusel "A quien acompanamos" - 3 tarjetas estables * 4. Carrusel de fotos - marquee movido por scroll * 5. Nuestro Modelo - foto de fondo */ /* --------------------------------------------------------------------------- * 0. FLECHA DE LOS BOTONES * El icono es un path relleno muy fino. Se engorda con un stroke del mismo * color siguiendo su contorno (paint-order lo pinta por debajo del relleno para * que no le coma las puntas). El stroke escala con el viewBox del SVG, asi que * el grosor se mantiene proporcional en todos los tamanos de boton. * ------------------------------------------------------------------------- */ /* * non-scaling-stroke es la clave: el icono es un viewBox de 512 unidades que se * pinta a 12px dentro de los botones redondos, asi que un stroke "normal" se * encogia a 0,3px y la flecha se veia como un pelo. Con este vector-effect el * grosor se mide en pixeles de pantalla y queda igual en todos los tamanos, * a la altura del trazo del texto. */ .elementor-button-icon svg[viewBox="0 0 512 376.83"] path { stroke: currentColor; stroke-width: 1.7px; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; paint-order: stroke fill; } /* * Hover de los botones con circulo (.button-cta y variantes). * * El gesto original se queda tal cual: al pasar el raton la flecha se encoge por * la derecha y aparece un circulo por la izquierda. Lo unico que fallaba es que * ese circulo (un ::before) era de color liso, SIN flecha dentro, asi que la * flecha parecia esfumarse. Aqui se le dibuja la flecha como imagen de fondo. * * Selectores largos y !important porque los snapshots pintan ese ::before con * `background: !important` desde un