.elementor-2071 .elementor-element.elementor-element-706a88e8{--display:flex;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}/* Start custom CSS for text-editor, class: .elementor-element-ba26972 *//* Importa la fuente Inter de Google Fonts para una tipografía moderna */
        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');

        /* Estilos generales del cuerpo de la página */
        body {
            font-family: 'Inter', sans-serif; /* Usa la fuente Inter */
            line-height: 1.6; /* Espaciado de línea para mejor legibilidad */
            margin: 0; /* Elimina el margen predeterminado del body */
            padding: 0; /* Elimina el padding predeterminado del body */
            color: #333; /* Color de texto principal */
            background-color: #f4f4f4; /* Un ligero color de fondo para el body */
        }

        /* Contenedor principal para centrar el contenido y limitar su ancho */
        .contenedor {
            max-width: 960px; /* Ancho máximo del contenido */
            margin: 0 auto; /* Centra el contenedor horizontalmente */
            padding: 20px; /* Espaciado interno del contenedor */
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Sombra sutil para destacar el contenido */
            background-color: #fff; /* Fondo blanco para el contenedor principal */
        }

        /* Estilos para la cabecera de la página */
        header {
            text-align: center; /* Centra el contenido de la cabecera */
            padding: 40px 20px; /* Espaciado interno de la cabecera */
            background-color: #FFFFFF; /* Fondo blanco para la cabecera */
            border-bottom: 1px solid #eee; /* Línea divisoria sutil */
        }

        /* Estilos para la imagen principal en la cabecera */
        header img {
            max-width: 100%; /* Asegura que la imagen sea responsive */
            height: auto; /* Mantiene la proporción de la imagen */
            display: block; /* Elimina el espacio extra debajo de la imagen */
            margin: 0 auto 30px; /* Centra la imagen y añade margen inferior */
            border-radius: 10px; /* Esquinas redondeadas para la imagen */
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15); /* Sombra para la imagen */
        }

        /* Estilos para los títulos principales (h1, h2, h3) */
        h1, h2, h3 {
            color: #FF0000; /* Color rojo para todos los títulos */
            margin-bottom: 15px; /* Margen inferior para los títulos */
            font-weight: 700; /* Negrita para los títulos */
        }

        h1 {
            font-size: 2.8em; /* Tamaño de fuente para el título principal */
            margin-top: 0; /* Elimina el margen superior predeterminado */
        }

        h2 {
            font-size: 2.2em; /* Tamaño de fuente para los subtítulos de sección */
        }

        h3 {
            font-size: 1.8em; /* Tamaño de fuente para títulos de subsección */
        }

        /* Estilos base para todas las secciones */
        section {
            padding: 60px 20px; /* Mayor espaciado interno para las secciones */
            margin-bottom: 0; /* No hay margen entre secciones */
            border-radius: 8px; /* Esquinas ligeramente redondeadas para las secciones */
            transition: background-color 0.3s ease-in-out; /* Transición suave para el cambio de color */
        }

        /* Clase para las secciones con fondo blanco */
        .seccion-blanca {
            background-color: #FFFFFF; /* Fondo blanco */
            color: #333; /* Color de texto oscuro para contraste */
        }

        /* Clase para las secciones con fondo verde */
        .seccion-verde {
            background-color: #1ABC9C; /* Fondo verde */
            color: #FFF; /* Color de texto blanco para contraste */
        }

        /* Asegura que los títulos dentro de las secciones verdes sigan siendo rojos */
        .seccion-verde h2,
        .seccion-verde h3 {
            color: #FF0000; /* Color rojo para los títulos en secciones verdes */
        }

        /* Estilos para párrafos */
        p {
            margin-bottom: 1.2em; /* Espaciado inferior para párrafos */
            font-size: 1.1em; /* Tamaño de fuente ligeramente más grande para párrafos */
            line-height: 1.7; /* Mayor espaciado de línea para párrafos */
        }

        /* Estilos para listas */
        ul {
            list-style: disc; /* Tipo de viñeta */
            margin-left: 25px; /* Sangría para la lista */
            margin-bottom: 1.5em; /* Margen inferior */
        }

        ul li {
            margin-bottom: 0.8em; /* Espaciado entre elementos de la lista */
            font-size: 1.1em; /* Tamaño de fuente para elementos de la lista */
        }

        /* Estilos para el botón de llamada a la acción */
        .boton {
            display: inline-block; /* Permite aplicar padding y margin */
            background-color: #FF0000; /* Fondo rojo */
            color: #FFF; /* Texto blanco */
            padding: 15px 30px; /* Espaciado interno del botón */
            text-decoration: none; /* Elimina el subrayado del enlace */
            border-radius: 8px; /* Esquinas redondeadas */
            margin-top: 30px; /* Margen superior */
            font-size: 1.2em; /* Tamaño de fuente del botón */
            font-weight: 600; /* Negrita */
            transition: background-color 0.3s ease, transform 0.2s ease; /* Transiciones suaves */
            box-shadow: 0 4px 10px rgba(255, 0, 0, 0.3); /* Sombra para el botón */
        }

        .boton:hover {
            background-color: #CC0000; /* Rojo más oscuro al pasar el ratón */
            transform: translateY(-2px); /* Ligero efecto de elevación */
            box-shadow: 0 6px 15px rgba(255, 0, 0, 0.4); /* Sombra más pronunciada al pasar el ratón */
        }

        /* Estilos para bloques de código pre-formateado */
        pre {
            background-color: #f8f8f8; /* Fondo claro para el bloque de código */
            border: 1px solid #ddd; /* Borde sutil */
            border-left: 5px solid #1ABC9C; /* Borde izquierdo verde para destacar */
            padding: 15px; /* Espaciado interno */
            margin: 20px 0; /* Margen superior e inferior */
            overflow-x: auto; /* Permite desplazamiento horizontal si el código es muy largo */
            font-family: 'Courier New', Courier, monospace; /* Fuente monoespaciada para código */
            font-size: 0.95em; /* Tamaño de fuente ligeramente más pequeño */
            line-height: 1.4; /* Espaciado de línea */
            border-radius: 5px; /* Esquinas redondeadas */
        }

        code {
            font-family: 'Courier New', Courier, monospace; /* Fuente monoespaciada para código en línea */
        }

        /* Estilos responsive básicos */
        @media (max-width: 768px) {
            h1 {
                font-size: 2.2em;
            }
            h2 {
                font-size: 1.8em;
            }
            h3 {
                font-size: 1.5em;
            }
            section {
                padding: 40px 15px; /* Menos padding en pantallas pequeñas */
            }
            .contenedor {
                padding: 10px; /* Menos padding en el contenedor */
            }
        }

        @media (max-width: 480px) {
            h1 {
                font-size: 1.8em;
            }
            h2 {
                font-size: 1.5em;
            }
            p, ul li {
                font-size: 1em;
            }
            .boton {
                padding: 12px 25px;
                font-size: 1em;
            }
        }/* End custom CSS */