/* --- HERO (PORTADA) --- */
.hero {
    min-height: 450px;
    padding-top: 8rem; /* Espacio para el header */
    
    /* El usuario pondrá su imagen de fondo aquí */
    background-color: #7abed4; /* Color de fondo de reserva */
    background-image: linear-gradient(90deg, #6bb8d4, #81c784); /* Degradado similar al de la foto */

    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #ffffff;
}

.hero h1 {
    font-size: 3.5rem;
    max-width: 600px;
    margin-bottom: 2rem;
}