/* ========================================================= ASEOQUAT / PROAQ — HOJA DE ESTILOS DE MARCA PARA DIVI Tipografía: Poppins (Google Fonts) Colores corporativos: Azul Profundo / Azul Brillante / Verde Menta ========================================================= */ /* ----------------------------------------------------------- 1) IMPORTAR LA FUENTE (solo si NO agregaste el snippet PHP) ----------------------------------------------------------- Recomendación: usa el método PHP (functions-poppins-enqueue.php) porque carga más rápido. Si prefieres la vía simple, descomenta la línea de abajo y bórrala del vía Theme Builder si ya la agregaste ahí. ------------------------------------------------------------ */ /* @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap'); */ /* ----------------------------------------------------------- 2) VARIABLES DE COLOR CORPORATIVO ------------------------------------------------------------ */ :root { --azul-profundo: #003393; --azul-brillante: #0081e9; --verde-menta: #54bf9d; --blanco: #ffffff; --gris-claro: #f7f7f7; --texto-oscuro: #1a1a1a; --fuente-marca: 'Poppins', sans-serif; } /* ----------------------------------------------------------- 3) TIPOGRAFÍA GLOBAL (todo el sitio, incluidos pop-ups/modales) ------------------------------------------------------------ */ body, h1, h2, h3, h4, h5, h6, .et_pb_module, .et-l--header, .et-l--footer, .et-l--body, .et_pb_popup, .et_pb_modal_overlay_container, .et_pb_toggle_title, .et_pb_toggle_content, .et_pb_button, .et_pb_promo_button, .et_pb_contact_form input, .et_pb_contact_form textarea, .et_pb_contact_form select, .et-menu-nav li a, .et_pb_blurb_content, .et_pb_testimonial_description, .et_pb_pricing_content, input, textarea, select, button { font-family: var(--fuente-marca) !important; } body { color: var(--texto-oscuro); } h1, h2, h3, h4, h5, h6 { font-weight: 700; color: var(--azul-profundo); } /* Peso más ligero para textos largos de párrafo */ p, li, .et_pb_text_inner { font-weight: 400; } /* ----------------------------------------------------------- 4) COLOR CORPORATIVO — ENCABEZADOS Y ENLACES ------------------------------------------------------------ */ a, .et_pb_text_inner a { color: var(--azul-brillante); } a:hover, .et_pb_text_inner a:hover { color: var(--azul-profundo); } /* ----------------------------------------------------------- 5) BOTONES (CTA "Cotiza Ahora", "Solicita tu Cotización", etc.) ------------------------------------------------------------ */ .et_pb_button, .et_pb_promo_button, .et_pb_contact_submit { background-color: var(--azul-brillante) !important; border: 2px solid var(--azul-brillante) !important; color: var(--blanco) !important; border-radius: 6px; font-weight: 600; letter-spacing: 0.3px; transition: all 0.25s ease-in-out; } .et_pb_button:hover, .et_pb_promo_button:hover, .et_pb_contact_submit:hover { background-color: var(--azul-profundo) !important; border-color: var(--azul-profundo) !important; color: var(--blanco) !important; } /* Botón secundario (ej. "Agenda una llamada") — usa el verde menta */ .et_pb_button.boton-secundario { background-color: var(--verde-menta) !important; border-color: var(--verde-menta) !important; } .et_pb_button.boton-secundario:hover { background-color: #3fa287 !important; border-color: #3fa287 !important; } /* ----------------------------------------------------------- 6) POP-UPS / MODALES DE DIVI ------------------------------------------------------------ */ .et_pb_popup, .et_pb_modal_overlay_container .et_pb_popup { background-color: var(--blanco) !important; border-top: 6px solid var(--azul-brillante); border-radius: 8px; } .et_pb_popup h1, .et_pb_popup h2, .et_pb_popup h3 { color: var(--azul-profundo); } .et_pb_modal_overlay_container { background-color: rgba(0, 51, 147, 0.75); /* overlay con azul profundo semitransparente */ } .et_pb_popup .et_pb_button { background-color: var(--verde-menta) !important; border-color: var(--verde-menta) !important; } /* ----------------------------------------------------------- 7) ACORDEÓN FAQ (Sección 6 del plan SEO) ------------------------------------------------------------ */ .et_pb_toggle_title { color: var(--azul-profundo); font-weight: 600; } .et_pb_toggle_open .et_pb_toggle_title { color: var(--azul-brillante); } .et_pb_toggle { border-bottom: 1px solid #e2e2e2; } /* ----------------------------------------------------------- 8) FONDOS DE SECCIÓN SUGERIDOS ------------------------------------------------------------ */ .seccion-fondo-claro { background-color: var(--gris-claro) !important; } .seccion-fondo-oscuro { background-color: var(--azul-profundo) !important; } .seccion-fondo-oscuro h1, .seccion-fondo-oscuro h2, .seccion-fondo-oscuro h3, .seccion-fondo-oscuro p { color: var(--blanco) !important; } /* ----------------------------------------------------------- 9) BLURBS (Beneficios, Casos de uso) ------------------------------------------------------------ */ .et_pb_blurb_content h4 { color: var(--azul-profundo); font-weight: 600; } .et_pb_blurb .et-pb-icon { color: var(--verde-menta) !important; } /* ----------------------------------------------------------- 10) TESTIMONIOS ------------------------------------------------------------ */ .et_pb_testimonial { border-left: 4px solid var(--verde-menta); } .et_pb_testimonial_meta { color: var(--azul-brillante); } /* ----------------------------------------------------------- 11) FORMULARIO DE COTIZACIÓN ------------------------------------------------------------ */ .et_pb_contact_form input, .et_pb_contact_form textarea, .et_pb_contact_form select { border: 1px solid #d5d5d5; border-radius: 4px; } .et_pb_contact_form input:focus, .et_pb_contact_form textarea:focus { border-color: var(--azul-brillante); outline: none; } /* ----------------------------------------------------------- 12) LOGO EN EL HEADER (ajuste fino opcional) ------------------------------------------------------------ */ #logo, .logo_container img { max-height: 60px; width: auto; }