/*--------------------------------------------------------------
# Nosotros Seccion
--------------------------------------------------------------*/

.about,
#mainCarousel .carousel-item .about {
}

.about .section-title,
#mainCarousel .carousel-item .about .section-title {
    padding-bottom: 0;  /* Eliminado el padding para que la raya esté más cerca */
    position: relative;   /* Necesario para la línea decorativa */
}

.about .section-title h2,
#mainCarousel .carousel-item .about .section-title h2 {
    font-size: 3rem; /* Aumentado el tamaño de la fuente a 3rem */
    font-weight: 700;
    margin: 0;  /* Elimina márgenes adicionales */
}

.about .section-title p,
#mainCarousel .carousel-item .about .section-title p {
    color: #c2bdbd;
    font-size: 18px; /* Hice el texto más pequeño */
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'Arial', sans-serif; /* Fuente para "La Empresa" */
    position: relative; /* Necesario para colocar la línea después del p */
}

.about .section-title h2::after,
#mainCarousel .carousel-item .about .section-title h2::after {
    content: "";
    width: 220px; /* Ajusté el ancho de la línea */
    height: 2px;  /* Ajusté el grosor de la línea */
    display: block;
    background: #FFB319; /* Color amarillo */
    margin-top: 0; /* Sin espacio entre el p y la línea */
}

/* Agregar margen entre el h2 y el contenido siguiente */
.container[data-aos="fade-up"] {
    margin-top: 80px; /* Ajusta este valor según lo que necesites */
}

/*--------------------------------------------------------------
# Estilos para la lista y los íconos
--------------------------------------------------------------*/
.about .content ul,
#mainCarousel .carousel-item .about .content ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.about .content ul li,
#mainCarousel .carousel-item .about .content ul li {
    padding: 10px 0 0 0;
    display: flex;
    align-items: center;
}

.about .content ul i,
#mainCarousel .carousel-item .about .content ul i {
    color: #FFB319;
    margin-right: 10px;
    font-size: 1.25rem;
}

/* Estilos específicos para la lista en el slide 2 */
#mainCarousel .carousel-item .about .content ul li {
    color: white;
}

#mainCarousel .carousel-item .about .content ul li span {
    color: white;
}

/* Forzar eliminación de puntos en la lista del slide 2 */
#mainCarousel .carousel-item .about .content ul,
#mainCarousel .carousel-item .about .content ul li {
    list-style: none !important;
    list-style-type: none !important;
}

/*--------------------------------------------------------------
# Variable de colores
--------------------------------------------------------------*/
/* Asegúrate de tener estas variables definidas */
:root {
    --default-color: #333;  /* Color oscuro por defecto */
    --accent-color: #FFB319;  /* Color amarillo de acento */
    --heading-color: #000;  /* Color de texto del encabezado */
    --contrast-color: #FFF;  /* Color contrastante para el texto */
}

/*--------------------------------------------------------------
# Estilos para el slide 2 del carrusel
--------------------------------------------------------------*/

/* Estilos base para el carrusel */
#mainCarousel .carousel-item .about {
    height: 100%;
    width: 100%;
    display: flex;
}

#mainCarousel .carousel-item .about .row {
    margin: 0;
    height: 100%;
    width: 100%;
}

#mainCarousel .carousel-item .about .col-lg-6 {
    height: 100%;
    padding: 2rem;
}

/* Título de la sección */
#mainCarousel .carousel-item .about .section-title {
    padding-bottom: 0;
    position: relative;
}

#mainCarousel .carousel-item .about .section-title h2 {
    font-size: 2.2rem;
    font-weight: 700;
    margin: 0;
    color: white;
}

#mainCarousel .carousel-item .about .section-title p {
    color: #c2bdbd;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    position: relative;
}

#mainCarousel .carousel-item .about .section-title h2::after {
    content: "";
    width: 160px;
    height: 2px;
    display: block;
    background: #FFB319;
    margin-top: 0;
}

/* Contenido de texto y lista */
#mainCarousel .carousel-item .about .col-lg-6 {
    color: white;
}

#mainCarousel .carousel-item .about .col-lg-6 p {
    font-size: 1.0rem;
    line-height: 1.6;
    margin-bottom: 1rem;
}

#mainCarousel .carousel-item .about .col-lg-6 p.fst-italic {
    font-style: italic;
    font-size: 0.95rem;
    margin-bottom: 1.2rem;
}

#mainCarousel .carousel-item .about .col-lg-6 ul {
    list-style: none;
    padding: 0;
    margin: 1rem 0;
}

#mainCarousel .carousel-item .about .col-lg-6 ul li {
    padding: 8px 0;
    display: flex;
    align-items: center;
    font-size: 0.9rem;
}

#mainCarousel .carousel-item .about .col-lg-6 ul li span {
    font-size: 0.9rem;
    line-height: 1.6;
}

#mainCarousel .carousel-item .about .col-lg-6 ul i {
    color: #FFB319;
    margin-right: 10px;
    font-size: 1.1rem;
}

/* Forzar color blanco en la lista */
#mainCarousel .carousel-item .about .col-lg-6 ul li,
#mainCarousel .carousel-item .about .col-lg-6 ul li span {
    color: white !important;
}

/* Responsive */
@media (max-width: 768px) {
    #mainCarousel .carousel-item .about .row {
        flex-direction: column;
    }

    #mainCarousel .carousel-item .about .col-lg-6 {
        width: 100%;
        padding: 1rem;
        height: auto;
    }

    #mainCarousel .carousel-item .about .section-title h2 {
        font-size: 1.8rem;
    }
}
