/*
Theme Name: Bootstrap Epa Theme
Author: Enzo Paliotti
Description: Un tema leggero basato su Bootstrap 5.
Version: 1.0
*/
/* --- Colori Istituzionali della Campagna --- */
body {
    background-color: #1D3557; /* Questo è il blu scuro del manifesto */
    color: #F1FAEE;          /* Testo chiaro di default (bianco crema) */
    padding-top: 0px;
    padding-bottom: 70px;     /* Spazio per la fixed-bottom bar */
}

/* --- Assicuriamoci che i link non svaniscano --- */
a {
    color: #A8DADC;          /* Azzurro per i link sullo sfondo blu */
}
a:hover {
    color: #F1FAEE;          /* Bianco crema quando ci passi sopra */
}

.fixed-bottom {
    background-color: #111 !important; /* Un nero ancora più profondo per staccare dal blu notte */
    z-index: 1030; /* Assicura che stia sopra a tutto */
}

.fixed-bottom .nav-link:active, .fixed-bottom .nav-link:focus {
    color: #dc3545 !important; /* Effetto "clic" rosso */
}

/* --- Rendi i titoli chiari per contrasto --- */
h1, h2, h3, h4, h5, h6 {
    color: #F1FAEE !important;
}

/* Feedback al tocco: Giallo Oro */
.fixed-bottom .nav-link:active, 
.fixed-bottom .nav-link:focus,
.fixed-bottom .dropdown-toggle:after {
    color: #ffc107 !important; /* Il giallo 'warning' di Bootstrap */
    transition: color 0.2s ease-in-out;
}

/* Anche le icone dentro il tasto premuto diventano gialle */
.fixed-bottom .nav-link:active i, 
.fixed-bottom .nav-link:focus i {
    color: #ffc107 !important;
}

/* Cambiamo il colore di selezione del menu Dropup */
.dropdown-item:active {
    background-color: #ffc107 !important;
    color: #000 !important; /* Testo nero su fondo giallo per leggibilità */
}

.card-nappi {
    background-color: #162a44 !important; /* Blu notte */
    border: 1px solid rgba(255,255,255,0.1); /* Bordino sottile */
    transition: transform 0.3s ease; /* Effetto movimento al passaggio mouse */
}

.card-nappi:hover {
    transform: translateY(-10px); /* La card si alza quando ci passi sopra */
    background-color: #1d3557 !important; /* Diventa leggermente più chiara */
}

/* --- HERO HOME PAGE --- */

/* Default per MOBILE (Smartphone) */
.hero-nappi {
    height: 250px;
    margin-top: 0 !important; /* Spinge la foto verso l'alto */
}

.hero-title { font-size: 2.2rem !important; } /* Più piccolo su mobile */
.hero-subtitle { font-size: 1.1rem !important; }

/* Regole per DESKTOP (Computer) */
@media (min-width: 992px) {
    .hero-nappi {
        height: 500px; /* Qui impostiamo i 500px che volevi */
    }
    .hero-title { 
        font-size: 4.5rem !important; /* Bello grande su PC */
    }
    .hero-subtitle { 
        font-size: 2rem !important; 
    }
}

/* Rimuove lo spazio bianco che vedi sopra la foto */
.site-content, main, .entry-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* Stile base per il motto */
.hero-motto {
    font-style: italic; /* Lo rende più suggestivo essendo una citazione */
    font-weight: 300;   /* Più leggero per non appesantire */
    opacity: 0.9;
}

/* Regola specifica per MOBILE (sotto i 768px) */
@media (max-width: 768px) {
    .hero-motto {
        font-size: 0.9rem !important; /* Ridotto rispetto all'h5 standard */
        line-height: 1.2;
        margin-top: 5px;
    }
}

/* Regola per DESKTOP (sopra i 992px) */
@media (min-width: 992px) {
    .hero-motto {
        font-size: 1.5rem !important; /* Più leggibile su schermi grandi */
    }
}

.entry-content {
    margin-top: -20px !important; /* Regola questo valore se serve salire ancora di più */
}

/*
#content, .site-content, main {
    padding-top: 0 !important;
    margin-top: 0 !important;
}