/* ===================================================================
 *  index.css
 *  Estilos específicos para la página de inicio (index.html)
 * =================================================================== */

/* --- Slideshow / Hero Slider --- */
#hero-slider {
    height: 95vh;
    max-height: 900px;
    min-height: 600px;
}
#hero-slider .carousel-inner,
#hero-slider .carousel-item {
    height: 100%;
}
#hero-slider .carousel-item img {
    height: 100%;
    object-fit: cover;
    object-position: center;
}
#hero-slider .carousel-item::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.45);
}
#hero-slider .carousel-caption {
    top: 50%;
    transform: translateY(-50%);
    bottom: auto;
    text-align: center;
}
#hero-slider .carousel-caption h1 {
    font-family: 'Rubik', sans-serif;
    font-weight: 700;
    font-size: 3.8rem;
    color: #fff;
}
#hero-slider .carousel-caption p {
    font-size: 1.25rem;
    color: rgba(255, 255, 255, 0.9);
    margin: 20px auto 0 auto;
    max-width: 700px;
}

/* --- Estilos Generales de Sección --- */
.section-padding {
    padding-top: 100px;
    padding-bottom: 100px;
}
.section-title {
    font-size: 2.8rem;
    margin-bottom: 1rem;
}
.subtitle {
    display: block;
    color: #011954;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
    letter-spacing: 1px;
}

/* --- Secciones --- */
.feature-box { padding: 30px; background-color: #fff; }
.feature-icon {
    width: 70px; height: 70px; margin: 0 auto 25px auto;
    background-color: #0119541a; color: #011954;
    border-radius: 50%; display: flex; align-items: center; justify-content: center;
    font-size: 2rem;
}
.feature-box h3 { font-size: 1.25rem; margin-bottom: 15px; }
.checklist { list-style: none; padding-left: 0; }
.checklist li { padding: 8px 0; font-size: 1.1rem; }
.checklist li i { color: #011954; margin-right: 15px; }
.info-box { padding: 30px; background-color: #fff; border-radius: 8px; height: 100%; }
.info-box h4 { font-size: 1.2rem; margin-bottom: 10px; }
.stats-section { padding: 80px 0; background-color: #f8f9fa; border-top: 1px solid #e9ecef; border-bottom: 1px solid #e9ecef; }
.stat-item h3 { font-family: 'Rubik', sans-serif; font-size: 3.5rem; font-weight: 700; margin-bottom: 0; }
.stat-item p { font-size: 1rem; color: #6c757d; }

/* --- Responsive --- */
@media (max-width: 768px) {
    #hero-slider .carousel-caption h1 { font-size: 2.5rem; }
    #hero-slider .carousel-caption p { font-size: 1.1rem; }
    .section-padding { padding-top: 80px; padding-bottom: 80px; }
    .section-title { font-size: 2.2rem; }
}