.elementor-kit-6{--e-global-color-primary:#087B35;--e-global-color-secondary:#12314A;--e-global-color-text:#536474;--e-global-color-accent:#087B35;--e-global-color-683b89c:#087B35;--e-global-color-253e988:#05632B;--e-global-color-20bc740:#12314A;--e-global-color-b594bb4:#D2E65A;--e-global-color-9e3e740:#F4F8F6;--e-global-color-80ab0b8:#FFFFFF;--e-global-color-005d8ea:#536474;--e-global-color-315e122:#DFE9E2;--e-global-typography-primary-font-family:"Manrope";--e-global-typography-primary-font-size:48px;--e-global-typography-primary-font-weight:800;--e-global-typography-secondary-font-family:"Manrope";--e-global-typography-secondary-font-size:30px;--e-global-typography-secondary-font-weight:700;--e-global-typography-text-font-family:"Manrope";--e-global-typography-text-font-size:18px;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Manrope";--e-global-typography-accent-font-weight:500;font-family:"Manrope", Sans-serif;font-size:16px;font-weight:400;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 h1{font-family:"Manrope", Sans-serif;font-size:52px;font-weight:800;}.elementor-kit-6 h2{font-family:"Manrope", Sans-serif;font-size:34px;font-weight:700;}.elementor-kit-6 h3{font-family:"Manrope", Sans-serif;font-size:22px;font-weight:700;}.elementor-kit-6 h4{font-family:"Manrope", Sans-serif;font-size:19px;font-weight:700;}.elementor-kit-6 h6{font-family:"Manrope", Sans-serif;font-size:16px;font-weight:600;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-6{--e-global-typography-primary-font-size:32px;--e-global-typography-secondary-font-size:26px;--e-global-typography-text-font-size:16px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ============================================ SR ENERGÍA SISTEMA GLOBAL DE DISEÑO Y ANIMACIONES WordPress + Hello Elementor + Elementor Pro ============================================ */ /* ============================================ 01. VARIABLES GLOBALES ============================================ */ :root { /* Colores corporativos */ --sr-primary: #087B35; --sr-primary-hover: #05632B; --sr-navy: #12314A; --sr-accent: #D2E65A; /* Colores de interfaz */ --sr-bg: #F4F8F6; --sr-white: #FFFFFF; --sr-text: #12314A; --sr-muted: #536474; --sr-border: #DFE9E2; /* Tipografía */ --sr-font: "Manrope", system-ui, sans-serif; /* Estructura */ --sr-max-width: 1340px; /* Animaciones */ --sr-motion-ease: cubic-bezier(.22, 1, .36, 1); --sr-motion-duration: 520ms; /* Sombras */ --sr-shadow-soft: 0 4px 18px rgba(18, 49, 74, .05); --sr-shadow-hover: 0 12px 30px rgba(18, 49, 74, .10); } /* ============================================ 02. CONTENEDOR GENERAL ============================================ */ .sr-container { width: 100%; max-width: var(--sr-max-width); margin-inline: auto; padding-inline: 24px; box-sizing: border-box; } /* ============================================ 03. APARICIÓN EN SCROLL FADE + ZOOM OUT + DESPLAZAMIENTO ============================================ */ .sr-reveal { opacity: 1; transform: none; transition: opacity var(--sr-motion-duration) var(--sr-motion-ease), transform var(--sr-motion-duration) var(--sr-motion-ease); } /* Estado inicial: solo cuando JS está activo */ html.sr-motion-ready body:not(.elementor-editor-active) .sr-reveal:not(.sr-inview) { opacity: 0; transform: translate3d(0, 12px, 0) scale(1.025); } /* Estado visible */ html.sr-motion-ready .sr-reveal.sr-inview { opacity: 1; transform: none; } /* ============================================ 04. ANIMACIONES ESCALONADAS ============================================ */ .sr-reveal.sr-delay-1 { transition-delay: 80ms; } .sr-reveal.sr-delay-2 { transition-delay: 160ms; } .sr-reveal.sr-delay-3 { transition-delay: 240ms; } .sr-reveal.sr-delay-4 { transition-delay: 320ms; } /* ============================================ 05. TARJETAS ELEVACIÓN + SOMBRA ============================================ */ .sr-card { transition: transform 260ms var(--sr-motion-ease), box-shadow 260ms var(--sr-motion-ease); } /* ============================================ 06. BOTONES ============================================ */ /* Botones nativos Elementor */ .sr-button .elementor-button { transition: transform 200ms ease, background-color 200ms ease, border-color 200ms ease, box-shadow 200ms ease; } /* Botones HTML personalizados */ a.sr-button, button.sr-button { transition: transform 200ms ease, background-color 200ms ease, border-color 200ms ease, box-shadow 200ms ease; } /* ============================================ 07. IMÁGENES ZOOM SUAVE ============================================ */ .sr-image, .sr-image .elementor-widget-container { overflow: hidden; } .sr-image img { display: block; transition: transform 350ms var(--sr-motion-ease); } /* ============================================ 08. INTERACCIONES HOVER SOLO DISPOSITIVOS CON RATÓN ============================================ */ @media (hover: hover) and (pointer: fine) { /* Tarjetas */ .sr-card:hover { transform: translateY(-4px); box-shadow: var(--sr-shadow-hover); } /* Botones Elementor */ .sr-button .elementor-button:hover { transform: translateY(-2px); } /* Botones HTML */ a.sr-button:hover, button.sr-button:hover { transform: translateY(-2px); } /* Imágenes */ .sr-image:hover img { transform: scale(1.035); } } /* ============================================ 09. RESPONSIVE MÓVIL ============================================ */ @media (max-width: 767px) { .sr-container { padding-inline: 16px; } /* Entrada más discreta en móvil */ html.sr-motion-ready body:not(.elementor-editor-active) .sr-reveal:not(.sr-inview) { transform: translate3d(0, 8px, 0) scale(1.015); } } /* ============================================ 10. ACCESIBILIDAD REDUCIR MOVIMIENTO ============================================ */ @media (prefers-reduced-motion: reduce) { html.sr-motion-ready .sr-reveal { opacity: 1 !important; transform: none !important; } .sr-reveal, .sr-card, .sr-image img, .sr-button .elementor-button, a.sr-button, button.sr-button { transition: none !important; animation: none !important; } }/* End custom CSS */