/* 1. Definisco le variabili globali */
:root {
    --wd-text-font: "Open Sans", Arial, Helvetica, sans-serif;
    --wd-text-font-weight: 400;
    --wd-text-color: rgb(66, 66, 66);
    --wd-text-font-size: 18px;
    --wd-title-font: "Cormorant", Arial, Helvetica, sans-serif;
    --wd-title-font-weight: 500;
    --wd-title-transform: capitalize;
    --wd-title-color: rgb(66, 66, 66);
}

/* 2. Applico gli stili ai paragrafi (e al body per ereditarietà) */


/* 3. Applico gli stili a tutti i titoli */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--wd-title-font);
    font-weight: var(--wd-title-font-weight);
    text-transform: var(--wd-title-transform);
    color: var(--wd-title-color);
}

p {
    font-family: var(--wd-text-font);
    font-weight: var(--wd-text-font-weight);
    font-size: var(--wd-text-font-size);
}

.PON_Intestazione {
    color: var(--wd-text-color) !important;
    font-size: 34px;
    font-weight: var(--wd-title-font-weight) !important;
    font-family: var(--wd-title-font) !important;
    text-align:center;
    margin:40px 0px
}
.PON_BreakLine{display:none!important}
.PON_form {
    padding-left: 0px !important;
    font-family: var(--wd-text-font) !important;
}
hr.spaziatore {
    opacity: 0!important;
}

/* Stile per i cerchietti dei social nel footer */
.social-circle-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    border: 1px solid rgba(255, 255, 255, 0.4); /* Cerchio sottile semi-trasparente */
    border-radius: 50% !important;
    text-decoration: none !important;
    transition: all 0.3s ease;
}

    /* Forza le Bootstrap Icons interne ad essere bianche */
    .social-circle-icon .bi {
        color: #ffffff !important;
        font-size: 16px !important;
        display: flex;
    }

    /* Effetto al passaggio del mouse */
    .social-circle-icon:hover {
        background-color: #ffffff !important;
        border-color: #ffffff !important;
    }

        .social-circle-icon:hover .bi {
            color: #333537 !important; /* L'icona diventa scura quando passi sopra con il mouse */
        }