
 
@font-face {
    font-family: 'Alice';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/assets/global/fonts/alice-v21-latin-regular.woff2') format('woff2');
}

 
@font-face {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('/assets/global/fonts/nunito-v32-latin-300.woff2') format('woff2');
}
@font-face {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/assets/global/fonts/nunito-v32-latin-regular.woff2') format('woff2');
}
@font-face {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('/assets/global/fonts/nunito-v32-latin-600.woff2') format('woff2');
}
@font-face {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('/assets/global/fonts/nunito-v32-latin-700.woff2') format('woff2');
}

 
@font-face {
    font-family: 'Lora';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/assets/global/fonts/lora-v37-latin-regular.woff2') format('woff2');
}
@font-face {
    font-family: 'Lora';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('/assets/global/fonts/lora-v37-latin-italic.woff2') format('woff2');
}


:root { --bg: #fdfdfb; --text: #2c3e50; --marine: #1a4a6e; --alice: 'Alice', serif; --nunito: 'Nunito', sans-serif; --lora: 'Lora', serif; }
* { box-sizing: border-box; }
 
*,
*::before,
*::after {
    -webkit-tap-highlight-color: transparent;
}
*:focus-visible {
    outline: 2px solid var(--marine);
    outline-offset: 4px;
    border-radius: 2px;
}

html.pre-translate body { opacity: 0; }


html {
    background-color: #ffffff;
    overflow-x: clip;
}

body { 
    opacity: 0; 
    transition: opacity 0.4s ease-in-out; 
    margin: 0; 
    padding: 0;
    font-family: var(--nunito); 
    background-color: var(--bg); 
    color: var(--text); 
    line-height: 1.6; 
}
body.sipario-aperto { opacity: 1; }

 
.lingua-fade {
    opacity: 0;
    transition: opacity 0.2s ease;
}


.skip-link {
    position: absolute;
    top: -100%;
    left: 20px;
    z-index: 9999;
    padding: 10px 20px;
    background: var(--marine);
    color: white;
    font-family: var(--nunito);
    font-size: 0.9rem;
    text-decoration: none;
    border-radius: 0 0 4px 4px;
    transition: top 0.2s ease;
}
.skip-link:focus {
    top: 0;
}

.navbar { display: flex; justify-content: space-between; align-items: center; padding: 15px 5%; background: white; position: sticky; top: 0; z-index: 2000; border-bottom: 1px solid #eee; }
.nav-wrapper { display: flex; align-items: center; gap: 30px; }
.nav-links { display: flex; list-style: none; gap: 25px; margin: 0; padding: 0; }
.nav-links a { text-decoration: none; color: var(--text); font-family: var(--alice); font-size: 0.95rem; transition: color 0.3s; }
.nav-links a:hover { color:#c28f20; }
.lang-switch { display: flex; gap: 5px; align-items: center; border-left: 1px solid #eee; padding-left: 15px; margin-left: 10px; font-family: var(--alice); }
.lang-switch button { background: transparent; border: none; cursor: pointer; font-family: var(--alice); font-size: 0.75rem; font-weight: 600; color: #333; opacity: 0.3; transition: opacity 0.2s, background-color 0.2s; padding: 4px 8px; border-radius: 4px; }
.lang-switch button:hover { opacity: 0.7; background-color: #f8f9fa; }
.lang-switch button.active { opacity: 1; background-color: #ebecee; color: var(--marine); }
.logo { padding: 0; margin: 0; }
.logo-img { height: 40px; width: auto; max-width: 200px; display: block; }

 
.menu-trigger { display: none; background: none; border: none; padding: 0; cursor: pointer; margin-left: 15px; text-align: left; }

.menu-word { font-family: var(--alice); font-size: 0.9rem; color: var(--text); display: block; line-height: 1; letter-spacing: 0.15em; margin: 0; padding: 0; opacity: 1; transform: translateY(0); transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), transform 0.5s cubic-bezier(0.4, 0, 0.2, 1); }
.menu-line { width: calc(100% - 0.15em); height: 1px; background-color: var(--marine); margin: 1px 0 0 0; transform-origin: center; transform: scaleX(1); transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1); }

 
.menu-trigger.menu-open .menu-word { opacity: 0.7; transform: translateY(-2px); }
.menu-trigger.menu-open .menu-line { transform: scaleX(1.15); }

 
.menu-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; height: 100dvh; background-color: var(--bg); z-index: 1500; display: flex; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); overflow-y: auto; }
.menu-overlay.active { opacity: 1; visibility: visible;}
 
.menu-bloccato { position: fixed; left: 0; right: 0; width: 100%; overflow: hidden;}

.overlay-nav ul { list-style: none; padding: 0; text-align: center; }
.overlay-nav li { margin: 16px 0; }
.overlay-nav li a { font-family: var(--alice); font-size: 2rem; text-decoration: none; color: var(--text); transition: opacity 0.3s; }
.close-item { margin-top: 30px !important; }
.close-item a { font-family: var(--nunito) !important; font-size: 0.8rem !important; letter-spacing: 0.2em; opacity: 0.7; text-transform: uppercase; }


.pre-title { font-family: var(--nunito); font-weight: 400; font-size: 0.8rem; letter-spacing: 0.2em; color: var(--marine); opacity: 0.74; text-transform: uppercase; }
.main-title { font-family: var(--alice); font-size: 3rem; margin: 10px 0; letter-spacing: 0.01em; }


.main-footer {  padding: 40px 5% 50px; background: #fff; border-top: 1px solid #eee; text-align: center; }
.main-footer p { color:#577794;font-family: var(--alice); font-weight: 400; font-size: 1rem; line-height: 1.5; }
.social-links { margin-top: 20px; display: flex; justify-content: center; gap: 30px; }
.social-icon {padding: 5px 0px; color:#2d5579; text-decoration: none; font-family: var(--alice); font-size: 0.9rem; opacity: 0.8; transition: 0.3s; }
.social-icon:hover { opacity: 1; color: var(--marine); }

.btn-outline-dark { display: inline-block; padding: 10px 20px; border: 1px solid var(--text); text-decoration: none; color: var(--text); font-family: var(--nunito); font-weight: 400; font-size: 0.8rem; margin: 5px; transition: 0.3s; }
.btn-outline-dark:hover { background: var(--text); color: white; }

.has-dropdown { position: relative; }
.dropdown { position: absolute; top: 100%; left: 0; background-color: white; min-width: 250px; padding: 15px 0; list-style: none; border: 1px solid #eee; box-shadow: 0 10px 25px rgba(0,0,0,0.05); opacity: 0; visibility: hidden; transform: translateY(10px); transition: all 0.3s ease; }
.dropdown li { margin: 0; text-align: left; }
.dropdown li a { padding: 10px 25px; display: block; font-size: 0.9rem !important; font-family: var(--alice) !important; white-space: nowrap; transition: background-color 0.5s ease, color 0.5s ease; }
.dropdown li a:hover { background-color: #f9f9f7; color: #c28f20; }
.has-dropdown:hover .dropdown,
.has-dropdown:focus-within .dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
 
.has-dropdown.touch-open .dropdown { opacity: 1; visibility: visible; transform: translateY(0); }


 
.noscript-banner {
    background: var(--bg, #fdfdfb);
    border-bottom: 1px solid #eee;
    padding: 16px 5%;
    text-align: center;
    font-family: var(--nunito);
    font-size: 0.85rem;
    color: var(--text, #2c3e50);
    letter-spacing: 0.02em;
}

.noscript-banner span {
    opacity: 0.7;
}

.noscript-banner a {
    margin-left: 8px;
    font-family: var(--alice);
    color: var(--text);
    text-decoration: none;
    text-transform: uppercase;
    text-decoration: underline;
}

 
@media (max-width: 900px) {
    .nav-links { display: none; }
    .menu-trigger { display: block; }
    .lang-switch { border-left: none; padding-left: 0; }
    .nav-wrapper { gap: 10px; }
    .logo-img { height: 30px; }
    .pre-title { font-size: 0.7rem; letter-spacing: 3px; margin-bottom: 5px; }
    .main-title { font-size: 2.5rem; line-height: 1.2; margin: 5px 0; }
    .btn-group { display: flex; flex-direction: column; width: 100%; }
    .btn-outline-dark, .btn-filled { width: 100%; display: block; text-align: center; margin: 5px 0; }
        .social-icon { 
        display: block; 
        padding: 12px; 
        background: #f9f9f9; 
        width: 100%; 
        max-width: 280px; 
        margin: 0 auto; 
        border-radius: 4px; 
        text-align: center;
        transition: background-color 0.3s ease, color 0.3s ease, transform 0.15s ease;
    }
    .social-icon:hover {
        background-color: #ebecee; 
        color: var(--marine);
        opacity: 1;
    }
    .social-icon:active {
        background-color: #e0e1e3;
        transform: scale(0.98); 
    }
    .dropdown { display: none; }
    .mobile-subitem { margin: 10px 0 !important; }
    .mobile-subitem a { font-size: 1.1rem !important; opacity: 0.7; font-family: var(--nunito) !important; }
    .main-footer { padding: 40px 15px; }
    .social-links { flex-direction: column; align-items: center; gap: 10px; }
    .footer-legal-row { font-size: 0.7rem; word-wrap: break-word; overflow-wrap: break-word; padding: 0 10px; }
    .overlay-nav ul { padding-top: 60px; }
    .overlay-nav li a {
        display: inline-block;
        transition: opacity 0.8s ease-out,
                    transform 0.8s ease-out,
                    color 0.8s ease-out;
    }
    .overlay-nav li a:active {
        opacity: 0.4;
        transform: scale(0.93);
        color: var(--marine);
        transition: opacity 0.15s ease,
                    transform 0.15s ease,
                    color 0.15s ease;
    }
}

@media (orientation: landscape) and (max-height: 500px) {
    .menu-overlay { align-items: flex-start; padding: 20px 0; }
}

 
.footer-legal-row {
    color: #a4b9cd;
    margin-top: 35px;
    font-family: var(--nunito);
    font-size: 0.8rem;
}
.footer-legal-link {
    padding: 5px 0px 0px ;
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid rgba(141, 168, 193, 0.8);
    transition: opacity 0.4s ease, border-bottom-color 0.4s ease, color 0.4s ease;
}
.footer-legal-link:hover {
    opacity: 0.8;
    color: var(--marine);
    border-bottom-color:rgba(26, 74, 110, 0.8);
}


@media (min-width: 600px) and (max-width: 900px) and (orientation: portrait) {
    .overlay-nav { margin-bottom: 5vh; }
    .overlay-nav ul { gap: clamp(15px, 3vh, 35px); }
    .overlay-nav li a { font-size: clamp(2.2rem, 4.5vw, 2.6rem); padding: 10px 30px; }
    .mobile-subitem a { font-size: clamp(1.1rem, 2vw, 1.3rem) !important; padding-left: 35px !important; }
    .close-item { margin-top: clamp(20px, 4vh, 50px) !important; }
}

 
.has-dropdown > a {
    display: flex;
    align-items: center;
    gap: 4px;
}

 
.has-dropdown > a::after {
    content: '';
    width: 5px;
    height: 5px;
    border-bottom: 1.5px solid currentColor;
    border-right: 1.5px solid currentColor;
    transform: rotate(45deg);
    margin-top: 1px;
    transition: transform 0.4s ease, opacity 0.3s ease;
}

 
.has-dropdown:hover > a::after,
.has-dropdown:focus-within > a::after {
    transform: rotate(-45deg);
}
