/* Definicion de la paleta de colores y tipografias */
        :root {
            --primary-blue: #007BFF;
            --dark-blue: #0A1931;
            --accent-cyan: #00C8FF;
            --light-gray: #F4F6F8;
            --dark-gray: #1F1F1F;
            --white: #FFFFFF;
        }

        body {
            font-family: 'Inter', sans-serif;
            color: var(--dark-gray);
            background-color: var(--white);
        }

        h1, h2, h3, h4, h5, h6 {
            font-family: 'Poppins', sans-serif;
        }

        /* Estilos para animaciones de scroll */
        .fade-in-section {
            opacity: 0;
            transform: translateY(20px);
            transition: opacity 0.6s ease-out, transform 0.6s ease-out;
        }

        .fade-in-section.is-visible {
            opacity: 1;
            transform: translateY(0);
        }
        
        /* Estilos para el carrusel */
        .carousel-container {
            position: relative;
            overflow: hidden;
        }
        .carousel-track {
            display: flex;
            transition: transform 0.5s ease-in-out;
        }
        .carousel-slide {
            min-width: 100%;
            box-sizing: border-box;
        }
        @media (min-width: 768px) {
            .carousel-slide {
                min-width: 50%;
            }
        }
        @media (min-width: 1024px) {
            .carousel-slide {
                min-width: 33.3333%;
            }
        }

        /* Estilos para el timeline */
        .timeline-item {
            position: relative;
            padding-bottom: 2.5rem;
            padding-left: 2.5rem;
        }
        .timeline-item:last-child {
            padding-bottom: 0;
        }
        .timeline-item::before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            height: 100%;
            width: 2px;
            background-color: #e2e8f0;
        }
         .timeline-item:last-child::before {
            height: 0.5rem;
        }
        .timeline-dot {
            position: absolute;
            left: -0.6rem;
            top: 0.25rem;
            height: 1.25rem;
            width: 1.25rem;
            background-color: var(--primary-blue);
            border-radius: 9999px;
            border: 3px solid var(--light-gray);
        }