/*-----*/
/* v.1 */
/*-----*/

/* Stili per la pagina principale della sezione Grammatica */

.hero-section-grammatica {
    position: relative;
    padding: 8rem 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 50vh;
    background-size: cover;
    background-position: center;
    color: #ffffff; /* Testo bianco per contrasto */
}

/* Aggiungiamo un overlay scuro per migliorare la leggibilità */
.hero-section-grammatica::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(10, 30, 51, 0); /* tonalità velo sopra l'immagine */
}

.hero-section-grammatica .container {
    position: relative;
    z-index: 2;
}

.hero-section-grammatica h1,
.hero-section-grammatica p {
    text-shadow: 2px 2px 8px rgba(0,0,0,0.7);
}

.hero-section-grammatica h1 { font-size: 5rem; font-weight: 800; }
.hero-section-grammatica p { font-size: 1.4rem; max-width: 900px; margin: 1rem auto 0 auto; }

/* Stili per le card degli argomenti di grammatica */
.topic-card {
    background-color: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: .75rem;
    box-shadow: 0 5px 15px rgba(0,0,0,.05);
    text-align: center;
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    height: 100%;
    text-decoration: none;
    color: inherit;
}
.topic-card:hover { 
    transform: translateY(-7px); 
    box-shadow: 0 12px 25px rgba(0,0,0,.1); 
}
.topic-card .card-body { padding: 2rem; }
.topic-card .icon { font-size: 3rem; color: #1A759F; margin-bottom: 1.5rem; }
.topic-card h3 { font-size: 1.5rem; font-weight: 700; color: #333; }