body {
    font-family: 'Inter', sans-serif;
}

/* Stili per il dropdown al passaggio del mouse (desktop) */
@media (min-width: 768px) {

    /* Applica solo su schermi >= md (desktop) */
    .dropdown:hover .dropdown-menu {
        display: block;
    }
}

/* Stili per la navbar che scompare */
.navbar-hidden {
    transform: translateY(-100%);
}

.navbar-transition {
    transition: transform 0.7s ease-in-out;
}

/* Stili per il testo nella sezione HERO (ombre per leggibilità) */
.hero h1,
.hero h2,
.hero h3 {
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
    /* Ombra leggermente più scura */
}

/* NUOVI STILI PER IL BOTTONE HERO */
.hero-button {
    background-color: #3385D9;
    /* Il tuo colore primary */
    color: #FFFFFF;
    /* Testo bianco */
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
    /* Ombra nera al testo per leggibilità */
    border: 3px solid transparent;
    /* Bordo trasparente iniziale per l'outline */
    box-shadow: 0 0 0 3px #FFFFFF;
    /* L'outline bianco spesso 3px */
}

.hero-button:hover {
    background-color: #2a72c0;
    /* Una sfumatura leggermente più scura del primary al hover */
    box-shadow: 0 0 0 3px #FFFFFF, 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    /* Mantiene il bordo bianco e migliora l'ombra */
}

/* NUOVI STILI PER IL CERCHIO DELLE ICONE */
.icon-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.8rem;
    height: 1.8rem;
    background-color: white;
    color: #22c55e;
    /* verde tipo Tailwind: green-500 */
    border-radius: 9999px;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
    font-weight: bold;
    margin-right: 0.5rem;
}