/* Hero Section - CORRETTO PER NGINX */
.hero { 
    height: 70vh; 
    /* Rimosso /local/ e aggiunto fallback per mobile */
    background: url('img/hero-bg.jpg') center/cover no-repeat; 
    background-color: #333; 
    position: relative; 
}

.hero-overlay { 
    background: rgba(0, 0, 0, 0.7); 
    height: 100%; 
    width: 100%; 
    display: flex; 
    align-items: center; 
}

.hero-content { 
    color: var(--white); 
    text-align: center; 
    width: 100%; 
    padding: 0 20px; /* Aggiunto padding per non far toccare i bordi su smartphone */
}

.hero-content h1 { 
    font-size: 2.8rem; 
    margin-bottom: 20px; 
    line-height: 1.2; /* Migliora la leggibilità su mobile */
}

/* Ottimizzazione specifica per Smartphone */
@media (max-width: 768px) {
    .hero {
        height: 60vh; /* Leggermente più bassa su mobile per vedere subito i servizi */
    }
    .hero-content h1 { 
        font-size: 1.8rem; /* Testo più piccolo per non andare su troppe righe */
    }
    .btn-outline {
        margin-left: 0;
        margin-top: 10px; /* Distanzia i bottoni quando vanno uno sotto l'altro */
    }
}