/* --- IMPOSTAZIONE FONT GLOBALE --- */
html, body {
    margin: 0;
    padding: 0;
    font-family: 'Century Gothic', AppleGothic, 'CenturyGothic', sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

button, input, select, textarea, a {
    font-family: 'Century Gothic', AppleGothic, 'CenturyGothic', sans-serif !important;
}

.logo {
    display: flex;
    align-items: center;
    margin: 0;
    height: 100%;
}

.logo a {
    position: relative;
    display: flex;
    align-items: center;
    width: 200px;
    height: 80px;
    transition: height 0.6s ease-in-out;
}

.logo img {
    position: absolute;
    left: 0;
    top: 20%;
    transform: translateY(-50%);
    transition: opacity 0.6s ease-in-out, visibility 0.6s !important;
}

/* STATO INIZIALE - CORRETTO DA EM A PX PER EVITARE FLASH GIGANTE */
.logo-large {
     opacity: 1;
     visibility: visible;
     height: auto;
     z-index: 2;
     width: 380px; /* Sostituito 30em con 480px (30*16) */
}

.logo-small {
    opacity: 0;
    visibility: hidden;
    height: auto;
    z-index: 1;
    width: 400px; /* Sostituito 25em con 400px (25*16) */
}

/* STATO DOPO LO SCROLL */
.cbp-af-header-shrink .logo-large {
    opacity: 1; /* Corretto da 9 a 1 (l'opacità massima è 1) */
    visibility: visible;
}

.cbp-af-header-shrink .logo-small {
    opacity: 0;
    visibility: hidden ;
    height: auto;
    z-index: 1;
   /* width: 480px; *//* Uniformato a px */
}

.cbp-af-header-shrink .logo a {
    height: 50px;
}

/* Container principale */
.cbp-af-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    height: 100%;
    min-height: inherit;
}

@font-face {
    font-family: 'Century Gothic';
    src: local('Century Gothic'), local('CenturyGothic'), url(https://fonts.cdnfonts.com/s/14109/GOTHIC.woff) format('woff');
}

.cbp-af-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.main-header.shrink {
    padding: 10px 0;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    height: 30px;
}

.main-header.shrink #logo-img {
    height: 30px;
}

body {
    padding-top: 120px;
}

body {
    padding-top: 80px;
}

nav a {
    text-decoration: none;
    color: #333;
    margin-left: 20px;
    font-weight: 500;
    transition: color 0.3s;
}

nav a:hover {
    color: #007bff;
}

.navbar {
    flex: 1;
    display: flex;
    justify-content: center;
}

.navbar a {
    margin: 0 15px;
    white-space: nowrap;
}

.navbar a.active-link {
    color: #BB1013 !important;
    font-weight: bold;
}

/* --- POSIZIONAMENTO MENU A DESTRA --- */
@media screen and (max-width: 1160px) {
    header {
        display: flex !important;
        align-items: center !important; 
        justify-content: space-between !important; 
        padding: 0 40px !important;
    }

    .logo {
        flex: none !important; 
    }

    .navbar {
        margin-left: auto !important; 
        display: flex !important;
        flex-direction: row !important;
        flex: none !important;
    }

    .navbar a {
        white-space: nowrap !important;
    }
}