/* Estilos para el carrusel con texto */
        .carousel-item {
            position: relative;
            height: 500px;
        }
        .carousel-inner,
        #carouselExampleControls {
            height: 500px;
        }
        

        .carousel-control-prev,
        .carousel-control-next {
            background: none;
            border: none;
            cursor: pointer;
            width: auto;
            height: auto;
        }

        .carousel-item img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            opacity: 0;
            transition: opacity 0.8s ease-in-out; /* Animación suave */
        }
        
        .carousel-item.active img {
            opacity: 1;
        }

        .carousel-caption {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 80%;
            text-align: center;
            padding: 0;
            background: transparent;
            color: #fff;
            /*text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);*/
            opacity: 0;
            transition: all 0.9s ease;
        }
        
        .carousel-item.active .carousel-caption {
            opacity: 1;
        }


        /* Estilos para los primeros dos banners (centrados) */
        .carousel-item:not(:nth-child(3)) .carousel-caption {
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }
        
        /* Estilo específico para el banner de Asesorías Académicas (alineado a la izquierda) */
        .carousel-item:nth-child(3) .carousel-caption {
            top: 50%;
            left: 10%;
            transform: translateY(-50%);
            text-align: left;
            width: 50%;
        }
        
        /* Estilos para el texto */
        .carousel-caption h3 {
            font-family: 'Montserrat', sans-serif;
            font-weight: 700;
            font-size: 100px;
            color: #fff;
            margin-bottom: 20px;
            /*text-transform: uppercase;*/
            letter-spacing: 1.5px;
            animation: fadeInUp 0.8s ease forwards;
        }
        
        .carousel-caption p {
            font-family: 'Open Sans', sans-serif;
            font-weight: 400;
            font-size: 1.5rem;
            color: #fff;
            margin-bottom: 0;
            animation: fadeInUp 1s ease forwards;
        }

        /* Estilo especial para "Primer Contacto en Temas de Género" */
        .primer-contacto-title {
            text-transform: none;
        }

        .primer-contacto-p {
            color: #20568d; /* Morado */
            position: relative;
            display: inline-block;
            text-transform: lowercase;
            font-size: 70px;
        }

        .primer-contacto-p::first-letter {
            text-transform: uppercase;
        }
        
        .primer-contacto-genero {
            color: #f3953d; /* Naranja */
            text-transform: lowercase;
            position: relative;       
            display: inline-block;
            font-size: 70px;
        }
        /*
        .primer-contacto-genero::after {
            content: '';
            position: absolute;
            left: 0;
            bottom: -5px;
            width: 100%;
            height: 3px;
            background-color: #fd007d; /* Rosa */
        }*/

        /* Subrayado rosa para "temas de género" */
        .temas-genero-underline {
            color: #6b2363; /* Morado */
            text-transform: lowercase;
            position: relative;
            display: inline-block;
            font-size: 70px;
        }
        /*
        .temas-genero-underline::after {
            content:'';
            position: absolute;
            left: 0;
            bottom: -5px;
            width: 100%;
            height: 3px;
            background-color: #fd007d; /* Rosa */
        }*/

        /* Estilo especial para "Orientación Psicológica" */
        .orientacion-title {
            text-transform: none;
        }
        
        .orientacion-1 {
            color: #6b2363; /* Rosado */
            position: relative;
            display: inline-block;
            text-transform: lowercase;
        }
        
        .orientacion-1::first-letter {
            text-transform: uppercase;
        }
        
        .orientacion-2 {
            color: #fd007d; /* Rosado */
            position: relative;
            display: inline-block;
            text-transform: lowercase;
        }
        
        .orientacion-2::first-letter {
            text-transform: uppercase;
        }

        .orientacion-2::after {
            content: '';
            position: absolute;
            left: 0;
            bottom: -5px;
            width: 100%;
            height: 3px;
            background-color: #f3953d; /* Naranja */
        }

        /* Estilo especial para "Asesorías Académicas" */
        .asesorias-title {
            text-transform: uppercase;
        }
        
        .asesorias-1 {
            color: #f3953d; /* Naranja */
        }
        
        .asesorias-2 {
            color: #6b2363; /* Morado */
            position: relative;
            display: inline-block;
        }

        .asesorias-2::after {
            content: '';
            position: absolute;
            left: 0;
            bottom: -5px;
            width: 100%;
            height: 3px;
            background-color: #fd007d; /* Rosado */
        }
        
        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* Slide 1: respetar el casing personalizado*/
        .carousel-item:nth-child(1) .carousel-caption h3.primer-contacto-title {
            animation: zoomIn 1.5s ease forwards;
            animation-delay: 0.3s;
            color: #ECD4F0;
            text-transform: none;
        }

        .carousel-item:nth-child(1) .carousel-caption p {
            animation: zoomIn 1.8s ease forwards;
            animation-delay: 0.6s;
        }
        
        .carousel-item:nth-child(2) .carousel-caption h3 {
            animation: zoomIn 1.5s ease forwards;
            animation-delay: 0.3s;
            color: #7E4F85;
            text-transform: uppercase;
        }
        .carousel-item:nth-child(2) .carousel-caption p {
            animation: zoomIn 1.8s ease forwards;
            animation-delay: 0.6s;
        }
        
        .carousel-item:nth-child(3) .carousel-caption h3 {
            animation: zoomIn 1.5s ease forwards;
            animation-delay: 0.3s;
        }
        .carousel-item:nth-child(3) .carousel-caption p {
            animation: zoomIn 1.8s ease forwards;
            animation-delay: 0.6s;
        }

        /* Animación general para todos los banners */
        .carousel-item.active .carousel-caption h3 {
            animation: zoomIn 1.5s ease forwards;
            animation-delay: 0.3s;
        }

        .carousel-item.active .carousel-caption p {
            animation: zoomIn 1.8s ease forwards;
            animation-delay: 0.6s;
        }

        /* Resetear animación al salir del slide */
        .carousel-item .carousel-caption h3,
        .carousel-item .carousel-caption p {
            opacity: 0;
            animation: none;
        }

        .texto-subrayado {
            position: relative;
            display: inline-block;
            white-space: nowrap;
        }

        .texto-subrayado::after {
            content: '';
            position: absolute;
            left: 0;
            bottom: -5px;
            width: 100%;
            height: 3px;
            z-index: 1;
        }

        .texto-morado {
            color: #36306e;
            position: relative;
            z-index: 2;
            font-size: 70px;
        }

        .texto-naranja {
            color: #0885c8;
            position: relative;
            z-index: 2;
            font-size: 70px;
        }

        /* Ajuste responsivo para móviles */
        @media (max-width: 576px) {
            .texto-subrayado {
                white-space: normal;
                display: inline;
            }
        }
        
        @keyframes slideInRight {
            from {
                opacity: 0;
                transform: translateX(50px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }
        
        @keyframes zoomIn {
            from {
                opacity: 0;
                transform: scale(0.8);
            }
            to {
                opacity: 1;
                transform: scale(1);
            }
        }

        /* Ajustes responsivos */
        @media (max-width: 768px) {
            .carousel-caption h3 {
                font-size: 1rem;
            }
            
            .carousel-caption p {
                font-size: 1rem;
            }

            .carousel-item:nth-child(3) .carousel-caption {
                left: 5%;
                width: 90%;
            }


            .texto-morado {
                font-size: 60px;
            }
    
            .texto-naranja {
                font-size: 60px;
            }

            .primer-contacto-p {
                font-size: 60px;
            }

            .carousel-inner, #carouselExampleControls {
                height: 400px;
            }
    
        }



        @media (max-width: 636px) {
           
            .texto-morado {
                font-size: 50px;
            }
    
            .texto-naranja {
                font-size: 50px;
            }

            .primer-contacto-p {
                font-size: 50px;
            }

            .carousel-inner, #carouselExampleControls {
                height: 400px;
            }
    
        }

        @media (max-width: 576px) {
            .carousel-caption h3 {
                font-size: 1.5rem;
            }
            
            .carousel-caption p {
                font-size: 1rem;
            }


        }



        @media (max-width: 536px) {
           
            .texto-morado {
                font-size: 40px;
            }
    
            .texto-naranja {
                font-size: 40px;
            }

            .primer-contacto-p {
                font-size: 40px;
            }

            .carousel-inner, #carouselExampleControls {
                height: 350px;
            }
    
        }

        .carousel a[href="#"] {
            pointer-events: none;
            cursor: default;
        }

        .carousel-control-prev,
        .carousel-control-next {
            pointer-events: auto !important;
        }

        button.carousel-control-prev,
        button.carousel-control-next {
            background: none;
            border: none;
            outline: none;
        }