@media all {
    .site-header { position: relative; z-index: 1000; color: var(--testo); background: var(--bianco); }
    .topbar { height: 34px; color: var(--bianco); background: var(--viola); font-size: 11px; line-height: 34px; }
    .topbar-riga, .brandbar-riga { display: flex; align-items: center; justify-content: space-between; }
    .topbar p, .topbar a { color: var(--bianco); }
    .topbar a { text-decoration: none; }
    .topbar a + a { margin-left: 20px; }
    .topbar a:hover { text-decoration: underline; }
    .brandbar { height: 79px; }
    .brandbar-riga { height: 100%; }
    .logo { display: block; width: 190px; height: 53px; }
    .logo img { width: 190px; height: 53px; object-fit: contain; }
    .brandbar-destra { display: flex; align-items: center; gap: 42px; font-size: 12px; }
    .brandbar-destra p { color: #797780; }
    .brandbar-destra a { color: var(--testo); font-weight: 700; text-decoration: none; }
    .brandbar-destra a:hover { color: var(--arancio); }
    .header-prenota, .menu-toggle, .menu-mobile-testata { display: none; }
    .menu-principale { position: relative; height: 49px; border-top: 1px solid #e7e6e9; background: var(--bianco); }
    .menu-livelli { height: 100%; }
    .livello-1 { display: flex; height: 100%; align-items: stretch; justify-content: space-between; }
    .livello-1 > li { display: flex; }
    .voce-menu { display: flex; align-items: stretch; }
    .livello-1 > li > a, .livello-1 > li > .voce-menu > a { position: relative; display: flex; min-height: 48px; padding: 0 1px; align-items: center; color: var(--testo); font-size: 11px; font-weight: 800; text-decoration: none; }
    .livello-1 > li > a::after, .livello-1 > li > .voce-menu > a::after { position: absolute; right: 0; bottom: 0; left: 0; height: 3px; background: var(--arancio); content: ""; transform: scaleX(0); transition: transform 160ms ease; }
    .livello-1 > li:hover > a::after, .livello-1 > li:hover > .voce-menu > a::after, .livello-1 > li.open > .voce-menu > a::after, .livello-1 > li.attivo > a::after, .livello-1 > li.attivo > .voce-menu > a::after, .livello-1 > li.attivo-parent > .voce-menu > a::after { transform: scaleX(1); }
    .livello-1 > li:last-child > a { color: var(--arancio); }
    .submenu-toggle { width: 25px; min-height: 44px; padding: 0; border: 0; background: transparent; cursor: pointer; }
    .submenu-icona { display: inline-block; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-2px) rotate(45deg); }
    .open > .voce-menu .submenu-icona { transform: translateY(2px) rotate(225deg); }
    .livello-2 { position: absolute; top: 49px; right: 0; left: 0; z-index: 30; display: none; max-height: calc(100vh - 162px); padding: 34px max(24px, calc((100vw - 1320px) / 2)) 38px; overflow-y: auto; grid-template-columns: repeat(5, minmax(150px, 1fr)); gap: 30px; border-top: 1px solid #e4e2e8; background: var(--bianco); box-shadow: 0 18px 35px rgba(23,19,39,.14); }
    .livello-1 > li.open > .livello-2 { display: grid; }
    .livello-2 > li > a, .livello-2 > li > .voce-menu > a { color: var(--viola); font-size: 15px; font-weight: 800; text-decoration: none; }
    .livello-2 > li > .voce-menu { min-height: 30px; }
    .livello-2 .submenu-toggle { display: none; }
    .livello-3 { display: block; margin-top: 10px; }
    .livello-3 li { margin: 0 0 5px; }
    .livello-3 a { color: #5f5d69; font-size: 12px; text-decoration: none; }
    .livello-2 > li > a:hover, .livello-2 > li > .voce-menu > a:hover, .livello-3 a:hover, .livello a[aria-current="page"] { color: var(--arancio-scuro); text-decoration: underline; text-underline-offset: 3px; }
}

@media all and (max-width: 1180px) {
    .topbar, .brandbar-destra, .header-prenota { display: none; }
    .brandbar { height: 80px; border-bottom: 1px solid #e7e6e9; }
    .logo, .logo img { width: 164px; height: 46px; }
    .js .menu-toggle { display: inline-flex; width: 48px; height: 48px; padding: 0; border: 0; align-items: center; justify-content: center; background: transparent; cursor: pointer; }
    .hamburger { display: block; width: 25px; }
    .hamburger span { display: block; height: 3px; margin: 5px 0; background: var(--viola); }
    .menu-principale { height: auto; border: 0; }
    .js .menu-principale { position: fixed; top: 0; right: 0; z-index: 1100; display: none; width: min(92vw, 440px); height: 100vh; height: 100dvh; overflow-y: auto; box-shadow: -12px 0 35px rgba(16,12,35,.24); }
    .js .menu-principale.open { display: block; }
    .js .menu-mobile-testata { position: sticky; top: 0; z-index: 5; display: flex; min-height: 80px; padding: 0 24px; align-items: center; justify-content: space-between; color: var(--bianco); background: var(--viola); font-weight: 800; }
    .menu-close { width: 48px; height: 48px; padding: 0; border: 0; color: var(--bianco); background: transparent; font-size: 38px; line-height: 1; cursor: pointer; }
    .menu-livelli, .livello-1 { display: block; width: 100%; height: auto; }
    .menu-livelli { padding: 14px 24px 36px; }
    .livello-1 > li { display: block; }
    .livello-1 > li > a, .livello-1 > li > .voce-menu > a { min-height: 54px; flex: 1 1 auto; border-bottom: 1px solid #e7e6e9; font-size: 16px; }
    .livello-1 > li > a::after, .livello-1 > li > .voce-menu > a::after { display: none; }
    .livello-1 .submenu-toggle { display: block; width: 48px; border-bottom: 1px solid #e7e6e9; }
    .livello-2, .livello-3 { position: static; display: none; max-height: none; padding: 5px 0 10px 18px; overflow: visible; border: 0; background: #f6f5f8; box-shadow: none; }
    .livello-1 > li.open > .livello-2, .livello-2 > li.open > .livello-3 { display: block; }
    .livello-2 > li > a, .livello-2 > li > .voce-menu > a { display: flex; min-height: 47px; flex: 1 1 auto; align-items: center; border-bottom: 1px solid #dedde3; color: var(--viola); font-size: 14px; font-weight: 800; text-decoration: none; }
    .livello-2 .submenu-toggle { display: block; border-bottom: 1px solid #dedde3; }
    .livello-3 { margin: 0; padding-left: 18px; background: #eceaf1; }
    .livello-3 li { margin: 0; }
    .livello-3 a { display: flex; min-height: 43px; align-items: center; border-bottom: 1px solid #d8d6df; color: #55525f; font-size: 13px; text-decoration: none; }
    body.menu-open::after { position: fixed; inset: 0; z-index: 900; background: rgba(18,14,38,.58); content: ""; }
    html:not(.js) .menu-livelli { padding-top: 0; }
    html:not(.js) .livello-2, html:not(.js) .livello-3 { display: block; }
}

@media all and (max-width: 420px) {
    .brandbar { height: 72px; }
    .logo, .logo img { width: 148px; height: 42px; }
    .js .menu-mobile-testata { min-height: 72px; padding-right: 18px; padding-left: 18px; }
    .menu-livelli { padding-right: 18px; padding-left: 18px; }
}
