/**
 * Skorpion — Off-Canvas Menu (stile)
 * Estratto verbatim dallo snippet skorpion-offcanvas-menu.php (nessuna modifica di stile).
 * Enqueue globale via includes/functions-offcanvas.php — il menu vive nel footer di ogni pagina.
 * Font (Season-Mix-Trial / Geist / sweet-sans-pro) gia caricati dal tema: non ricaricare.
 */

        /* Token locali scoped — non inquinano il DS globale. */
        #slide-out-widget-area {
            --sk-fs-eyebrow-menu: 10.5px;
            --sk-fs-contact: 15px;
            --sk-fs-sub-item: 18px;
            --sk-fs-main-item: clamp(20px, 1.40vw, 22px);
            --sk-fs-sub-title: clamp(20px, 2vw, 24px);
            --sk-lh-menu-item: 1.08;
            --sk-hair-soft: rgba(27, 43, 50, .08);
            --sk-hair-strong: rgba(27, 43, 50, .16);
            --sk-dur-fast: .28s;
            --sk-dur-slow: .55s;
            --sk-dur-reveal: .7s;
            --sk-dur-kenburns: 8s;
            --sk-ease-out: cubic-bezier(.16, 1, .3, 1);
        }

        #slide-out-widget-area-bg,
        .slide-out-widget-area-bg {
            background-color: rgba(0, 38, 90, 0.45) !important;
            -webkit-backdrop-filter: blur(12px) saturate(110%) !important;
            backdrop-filter: blur(12px) saturate(110%) !important;
            z-index: 9997 !important;
        }
		
		 /* .bg-inner è il layer figlio di Salient che copre il parent — va sovrascritto */                                                                                                                                                                    
      #slide-out-widget-area-bg .bg-inner {
		    background: rgba(0, 38, 90, 0.45) !important;
		} 

        #slide-out-widget-area {
            background-color: #C1DFDE !important;
            padding: 0 !important;
            width: 440px !important;
            max-width: 92vw !important;
            box-shadow: var(--sk-shadow-lg, 0 24px 60px rgba(0, 38, 90, .18)) !important;
            transition: width var(--sk-dur-slow, .55s) var(--sk-ease, cubic-bezier(.22, 1, .36, 1)) !important;
        }

        #slide-out-widget-area.sk-expanded {
            width: clamp(850px, 95vw, 1400px) !important;
            max-width: 96vw !important;
        }

        #slide-out-widget-area .inner-wrap,
        #slide-out-widget-area .inner {
            padding: 0 !important;
            height: 100% !important;
            width: 100% !important;
            max-width: 100% !important;
            min-height: unset !important;
            display: block !important;
            overflow: hidden !important;
            position: relative !important;
            box-sizing: border-box !important;
            background: transparent !important;
        }



        body #slide-out-widget-area .inner .off-canvas-menu-container {
            display: block !important;
            width: 100% !important;
            max-width: 100% !important;
            height: 100% !important;
            margin: 0 !important;
            padding: 0 !important;
            box-sizing: border-box !important;
            text-align: left !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-viewport {
            position: relative !important;
            width: 100% !important;
            height: 100% !important;
            overflow: hidden !important;
            display: flex !important;
            align-items: stretch !important;
            background: transparent !important;
            font-family: var(--sk-font-sans, "Geist", system-ui, sans-serif) !important;
            box-sizing: border-box !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-nav-col {
            flex: 0 0 440px !important;
            max-width: 440px !important;
            height: 100% !important;
            overflow-y: auto !important;
            -webkit-overflow-scrolling: touch !important;
            scrollbar-width: thin !important;
            scrollbar-color: var(--sk-border, rgba(27, 43, 50, .12)) transparent !important;
            padding: 2rem 2rem 2rem !important;
            background: #fff !important;
            position: relative !important;
            z-index: 2 !important;
            box-sizing: border-box !important;
            counter-reset: sk-sec !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-nav-col::-webkit-scrollbar {
            width: 4px !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-nav-col::-webkit-scrollbar-thumb {
            background: var(--sk-border, rgba(27, 43, 50, .12)) !important;
            border-radius: var(--sk-radius-pill, 999px) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-head {
            display: block !important;
            margin: 0 0 var(--sk-space-6, 2rem) !important;
            padding-bottom: var(--sk-space-5, 1.5rem) !important;
            padding-top: var(--sk-space-5, 1.5rem) !important;
            border-bottom: 1px solid var(--sk-hair-strong, rgba(27, 43, 50, .16)) !important;
            text-decoration: none !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-logo {
            display: block !important;
            height: 36px !important;
            width: auto !important;
            max-width: 100% !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-reveal-col {
            flex: 1 1 auto !important;
            min-width: 0 !important;
            height: 100% !important;
            position: relative !important;
            border-left: 1px solid var(--sk-hair-strong, rgba(27, 43, 50, .16)) !important;
            background: var(--sk-surface, #ffffff) !important;
            box-shadow: -1px 0 0 0 rgba(255, 255, 255, .6), inset 18px 0 32px -24px rgba(27, 43, 50, .10) !important;
            opacity: 0 !important;
            transform: translateX(18px) !important;
            pointer-events: none !important;
            transition: opacity var(--sk-dur-reveal, .7s) var(--sk-ease-out, cubic-bezier(.16, 1, .3, 1)), transform var(--sk-dur-reveal, .7s) var(--sk-ease-out, cubic-bezier(.16, 1, .3, 1)) !important;
            transition-delay: 0s !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container.sk-expanded .sk-reveal-col {
            opacity: 1 !important;
            transform: translateX(0) !important;
            pointer-events: auto !important;
            transition-delay: calc(var(--sk-dur-slow, .55s) * .55) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-sub {
            position: absolute !important;
            inset: 0 !important;
            height: 100% !important;
            width: 100% !important;
            display: flex !important;
            box-sizing: border-box !important;
            opacity: 0 !important;
            visibility: hidden !important;
            transition: opacity .4s var(--sk-ease, cubic-bezier(.22, 1, .36, 1)) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-sub.active {
            opacity: 1 !important;
            visibility: visible !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-sub-list-col {
            flex: 0 0 480px !important;
            min-width: 480px !important;
            height: 100% !important;
            overflow-y: auto !important;
            scrollbar-width: thin !important;
            scrollbar-color: var(--sk-border, rgba(27, 43, 50, .12)) transparent !important;
            /* padding: top  right  bottom  left */
            padding: 2rem  !important;
            box-sizing: border-box !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-sub-list-col::-webkit-scrollbar {
            width: 4px !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-sub-list-col::-webkit-scrollbar-thumb {
            background: var(--sk-border, rgba(27, 43, 50, .12)) !important;
            border-radius: var(--sk-radius-pill, 999px) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-sub-media {
            flex: 1 1 auto !important;
            height: 100% !important;
            position: relative !important;
            overflow: hidden !important;
            background: var(--sk-shell, #EDE6DD) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-sub-media::after {
            content: '' !important;
            position: absolute !important;
            inset: 0 !important;
            pointer-events: none !important;
            z-index: 1 !important;
            background: linear-gradient(180deg, transparent 38%, color-mix(in srgb, var(--sk-deep-teal, #005F6A) 32%, transparent) 100%) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-sub-media img {
            position: absolute !important;
            inset: 0 !important;
            width: 100% !important;
            height: 100% !important;
            object-fit: cover !important;
            display: block !important;
            box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .10), inset 0 0 70px -30px rgba(0, 38, 90, .45) !important;
            transform: scale(1.06) !important;
            opacity: 0 !important;                       /* crossfade a 2 layer: nascosto di base */
            transition: transform var(--sk-dur-kenburns, 8s) var(--sk-ease-out, cubic-bezier(.16, 1, .3, 1)), opacity .55s var(--sk-ease-out, cubic-bezier(.16, 1, .3, 1)) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-sub-media img.is-active {
            opacity: 1 !important;                       /* layer visibile */
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-sub.active .sk-sub-media img {
            transform: scale(1) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-section-label {
            display: block !important;
            font-size: 13px !important;
            font-family: "sweet-sans-pro", sans-serif;
            font-weight: 700 !important;
            line-height: 1 !important;
            text-transform: uppercase !important;
            color: #09264B70 !important;
            margin: 0 0 var(--sk-space-5, 1.5rem) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-section-label::before {
            content: none !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-list~.sk-section-label {
            margin-top: var(--sk-space-7, 3rem) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-list {
            list-style: none !important;
            margin: 0 !important;
            padding: 0 !important;
            font-variant-ligatures: common-ligatures contextual !important;
            font-feature-settings: "liga" 1, "clig" 1, "kern" 1, "calt" 1 !important;
            text-rendering: optimizeLegibility !important;
            -webkit-font-smoothing: antialiased !important;
            -moz-osx-font-smoothing: grayscale !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-list li {
            margin: 0 !important;
            padding: 0 !important;
            list-style: none !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-list li a {
            display: flex !important;
            justify-content: space-between !important;
            align-items: center !important;
            padding: var(--sk-space-4, 1rem) 0 !important;
            width: 100% !important;
            box-sizing: border-box !important;
            font-size: var(--sk-fs-main-item, clamp(22px, 1.45vw, 26px)) !important;
            font-weight: 400 !important;
            line-height: var(--sk-lh-menu-item, 1.08) !important;
            color: var(--sk-ocean-navy, #00265A) !important;
            text-decoration: none !important;
            text-transform: none !important;
            background: transparent !important;
            opacity: 1 !important;
            border-bottom: 1px solid var(--sk-hair-soft, rgba(27, 43, 50, .08)) !important;
            transition: opacity var(--sk-dur, .35s) ease, border-color var(--sk-dur, .35s) ease !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-list li a span {
            font-family: "Season-Mix-Trial", serif !important;
            font-weight: 400 !important;
            letter-spacing: -.01em !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-list li:last-child a {
            border-bottom: none !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-list li a:hover {
            opacity: .5 !important;
            transform: none !important;
            text-decoration: none !important;
            color: var(--sk-ocean-navy, #00265A) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-list li a:hover::after,
        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-list li a:hover::before {
            display: none !important;
            content: none !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-list li a.is-active {
            opacity: 1 !important;
            transform: none !important;
            color: var(--sk-ocean-navy, #00265A) !important;
            border-bottom-color: #09264B70 !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-arrow-svg {
            flex-shrink: 0 !important;
            display: block !important;
            margin-left: 14px !important;
            stroke: var(--sk-text-muted, #5a6b72) !important;
            opacity: .5 !important;
            transition: opacity var(--sk-dur-fast, .28s) ease, stroke var(--sk-dur, .35s) ease !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-menu-list li a.is-active .sk-arrow-svg {
            opacity: 1 !important;
            stroke: #09264B70 !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-rule {
            display: block !important;
            width: 48px !important;
            height: 2px !important;
            border: none !important;
            background: linear-gradient(90deg, var(--sk-copper-sand, #C96F4A), color-mix(in srgb, var(--sk-copper-sand, #C96F4A) 0%, transparent)) !important;
            margin: var(--sk-space-7, 3rem) 0 !important;
            opacity: 1 !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-contact-block {
            margin-top: var(--sk-space-5, 3rem) !important;
			margin-bottom: var(--sk-space-5, 3rem) !important;
            padding: var(--sk-space-5, 1.5rem) !important;
            border: 1px solid var(--sk-hair-strong, rgba(27, 43, 50, .16)) !important;
            background: #09264B !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-contact-eyebrow {
            display: block !important;
            margin: 0 0 12px !important;
            font-family: "sweet-sans-pro", sans-serif;
            font-size: 10.5px !important;
            font-weight: 700 !important;
            text-transform: uppercase !important;
            color: #C1DFDE !important;
        }

        .sk-contact-grid{
            margin-bottom: 14px !important;
        }

        /* 3 righe (Telefono, Email, Dove trovarci): stessa gerarchia label+valore,
           spaziate in modo uniforme. */
        body #slide-out-widget-area .off-canvas-menu-container .sk-contact-grid > div + div {
            margin-top: 14px !important;
        }

        /* Orari: nota a parte sotto le 3 righe (non più incollata al numero
           di telefono), leggibile come le altre info del riquadro. */
        body #slide-out-widget-area .off-canvas-menu-container .sk-contact-hours {
            margin-bottom: 14px !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-contact-sub {
            display: block !important;
            margin-top: 4px !important;
            font-size: 13px !important;
            color: #fff !important;
        }


        body #slide-out-widget-area .off-canvas-menu-container .sk-contact-label {
			font-family: "sweet-sans-pro", sans-serif;
    font-size: 10.5px !important;
    font-weight: 700 !important;
            display: block !important;
            margin-bottom: 3px !important;
            text-transform: uppercase !important;
            color: #fff !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-contact-val {
            display: block !important;
            font-size: 12px !important;
            font-weight: 400 !important;
            line-height: 1.35 !important;
            color: #C1DFDE !important;
            text-decoration: none !important;
            word-break: break-word !important;
            transition: color .2s ease !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container a.sk-contact-val:hover {
            color: var(--sk-active-blue, #0068B1) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-cta-btn {
            display: block !important;
            width: 100% !important;
            box-sizing: border-box !important;
            padding: 13px 20px !important;
            background: #ffffff !important;
            color: var(--sk-ocean-navy, #00265A) !important;
            font-size: 14px !important;
            letter-spacing: .0em !important;
            text-transform: uppercase !important;
            text-align: center !important;
            text-decoration: none !important;
            border: 1px solid var(--sk-ocean-navy, #00265A) !important;
            border-radius: 0 !important;
            cursor: pointer !important;
            transition: background .25s ease, color .25s ease !important;
			font-family: "sweet-sans-pro", sans-serif;
            font-weight: 700 !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-cta-btn:hover {
            background: var(--sk-ocean-navy, #00265A) !important;
            color: #ffffff !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-view-all-btn {
            display: block !important;
            width: 100% !important;
            box-sizing: border-box !important;
            margin-bottom: var(--sk-space-6, 2rem) !important;
            padding: 13px 24px !important;
            background: #ffffff !important;
            color: var(--sk-ocean-navy, #00265A) !important;
            font-size: 12px !important;
            font-weight: 700 !important;
            text-transform: uppercase !important;
            text-decoration: none !important;
            text-align: center !important;
            border: 1px solid var(--sk-ocean-navy, #00265A) !important;
            border-radius: 0 !important;
            cursor: pointer !important;
            transition: background .25s ease, color .25s ease !important;
        }

        .sk-view-all-btn span {
            font-family: "sweet-sans-pro", sans-serif !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-view-all-btn:hover {
            background: var(--sk-ocean-navy, #00265A) !important;
            color: #ffffff !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-view-all-btn .menu-title-text {
            display: block !important;
            color: inherit !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-back-btn {
            display: none !important;
            align-items: center !important;
            gap: 9px !important;
            background: none !important;
            border: none !important;
            cursor: pointer !important;
            padding: 0 0 24px 0 !important;
            font-size: 11px !important;
            font-weight: 500 !important;
            letter-spacing: .14em !important;
            text-transform: uppercase !important;
            color: var(--sk-text-muted, #5a6b72) !important;
            opacity: 1 !important;
            transition: color .2s ease, transform .2s ease !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-back-btn:hover {
            color: var(--sk-active-blue, #0068B1) !important;
            transform: translateX(-4px) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-back-btn svg {
            stroke: currentColor !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-submenu-title {
            font-family: "Season-Mix-Trial", serif !important;
            font-weight: 500 !important;
            font-size: var(--sk-fs-sub-title, clamp(30px, 2.4vw, 36px)) !important;
            line-height: 1.04 !important;
            letter-spacing: -.02em !important;
            text-wrap: balance !important;
            color: var(--sk-ocean-navy, #00265A) !important;
            margin: 0 0 var(--sk-space-6, 2rem) !important;
            text-rendering: optimizeLegibility !important;
            opacity: 0 !important;
            transform: translateY(15px) !important;
            transition: opacity .5s cubic-bezier(.16, 1, .3, 1), transform .5s cubic-bezier(.16, 1, .3, 1) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-submenu-list {
            list-style: none !important;
            margin: 0 !important;
            padding: 0 !important;
            font-variant-ligatures: common-ligatures contextual !important;
            font-feature-settings: "liga" 1, "clig" 1, "kern" 1, "calt" 1 !important;
            text-rendering: optimizeLegibility !important;
            -webkit-font-smoothing: antialiased !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-submenu-list li {
            margin: 0 !important;
            padding: 0 !important;
            list-style: none !important;
            border-bottom: 1px solid var(--sk-hair-soft, rgba(27, 43, 50, .08)) !important;
            opacity: 0 !important;
            transform: translateY(15px) !important;
            transition: opacity .4s cubic-bezier(.16, 1, .3, 1), transform .4s cubic-bezier(.16, 1, .3, 1) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-submenu-list li:last-child {
            border-bottom: none !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-submenu-list li a {
            display: flex !important;
            justify-content: space-between !important;
            align-items: center !important;
            padding: var(--sk-space-4, 1rem) 0 !important;
            width: 100% !important;
            box-sizing: border-box !important;
            font-family: "Season-Mix-Trial", serif !important;
            font-size: var(--sk-fs-sub-item, 18px) !important;
            font-weight: 400 !important;
            text-transform: none !important;
            line-height: var(--sk-lh-menu-item, 1.08) !important;
            letter-spacing: -.01em !important;
            text-wrap: pretty !important;
            color: var(--sk-ocean-navy, #00265A) !important;
            text-decoration: none !important;
            background: transparent !important;
            opacity: 1 !important;
            transition: opacity var(--sk-dur, .35s) ease !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-submenu-list li a:hover {
            opacity: .5 !important;
            color: var(--sk-ocean-navy, #00265A) !important;
            transform: none !important;
            background: transparent !important;
        }

        /* Stagger d'ingresso */
        body #slide-out-widget-area .off-canvas-menu-container .sk-sub.active .sk-submenu-title {
            opacity: 1 !important;
            transform: translateY(0) !important;
            transition-delay: .35s !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-sub.active .sk-submenu-list li {
            opacity: 1 !important;
            transform: translateY(0) !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-sub.active .sk-submenu-list li:nth-child(1) { transition-delay: .40s !important; }
        body #slide-out-widget-area .off-canvas-menu-container .sk-sub.active .sk-submenu-list li:nth-child(2) { transition-delay: .45s !important; }
        body #slide-out-widget-area .off-canvas-menu-container .sk-sub.active .sk-submenu-list li:nth-child(3) { transition-delay: .50s !important; }
        body #slide-out-widget-area .off-canvas-menu-container .sk-sub.active .sk-submenu-list li:nth-child(4) { transition-delay: .55s !important; }
        body #slide-out-widget-area .off-canvas-menu-container .sk-sub.active .sk-submenu-list li:nth-child(5) { transition-delay: .60s !important; }
        body #slide-out-widget-area .off-canvas-menu-container .sk-sub.active .sk-submenu-list li:nth-child(n+6) { transition-delay: .65s !important; }

        body #slide-out-widget-area .off-canvas-menu-container a:focus-visible,
        body #slide-out-widget-area .off-canvas-menu-container button:focus-visible {
            outline: 2px solid var(--sk-active-blue, #0068B1) !important;
            outline-offset: 3px !important;
            border-radius: 2px !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-main-close-btn {

            background: transparent !important;
            border: none !important;
            cursor: pointer !important;
            color: var(--sk-ocean-navy, #00265A) !important;
            padding: 8px !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            opacity: .5 !important;
            transition: opacity .3s ease, transform .3s ease !important;
            z-index: 100 !important;
        }

        body #slide-out-widget-area .off-canvas-menu-container .sk-main-close-btn:hover {
            opacity: 1 !important;
            transform: rotate(90deg) !important;
        }

        /* Blur del sito quando il menu è aperto */
        #ajax-content-wrap,
        #header-outer {
            transition: filter .5s ease, -webkit-filter .5s ease !important;
            will-change: filter;
        }

        html.slide-out-widget-area-open #ajax-content-wrap,
        html.slide-out-widget-area-open #header-outer,
        body.slide-out-widget-area-open #ajax-content-wrap,
        body.slide-out-widget-area-open #header-outer,
        body.material-slide-out-open #ajax-content-wrap,
        body.material-slide-out-open #header-outer,
        body:has(.slide-out-widget-area-bg.open) #ajax-content-wrap,
        body:has(.slide-out-widget-area-bg.open) #header-outer,
        body:has(#slide-out-widget-area.open) #ajax-content-wrap,
        body:has(#slide-out-widget-area.open) #header-outer {
            -webkit-filter: blur(12px) !important;
            filter: blur(12px) !important;
            pointer-events: none !important;
            transform: translateZ(0);
        }

        @media (max-width: 1024px) {
            #slide-out-widget-area,
            #slide-out-widget-area.sk-expanded {
                width: 88vw !important;
                max-width: 480px !important;
            }

            body #slide-out-widget-area .off-canvas-menu-container .sk-nav-col {
                flex: 0 0 100% !important;
                max-width: 100% !important;
            }

            body #slide-out-widget-area .off-canvas-menu-container .sk-reveal-col {
                position: absolute !important;
                inset: 0 !important;
                z-index: 5 !important;
                border-left: none !important;
                box-shadow: none !important;
                transform: translateX(100%) !important;
                background: #fff !important;
                transition-delay: 0s !important;
            }

            body #slide-out-widget-area .off-canvas-menu-container.sk-expanded .sk-reveal-col {
                transform: translateX(0) !important;
                transition-delay: 0s !important;
            }

            body #slide-out-widget-area .off-canvas-menu-container .sk-sub-media {
                display: none !important;
            }

            body #slide-out-widget-area .off-canvas-menu-container .sk-sub-list-col {
                /* BUG: la regola base piu' sopra ha flex:0 0 480px + min-width:480px
                   (pensata per stare accanto a .sk-sub-media, qui sopra nascosta).
                   Il pannello #slide-out-widget-area e' pero' 88vw con tetto 480px,
                   quindi su un telefono (343px a 390 di viewport) la colonna restava
                   fissa a 480px e uno sconfinamento di ~140px veniva tagliato in
                   silenzio dall'overflow:hidden dell'antenato .inner-wrap: da qui sia
                   il testo troncato ("TUTTE LE DESTINAZIONI...") sia la sensazione di
                   tipografia enorme, perche' si vedeva solo un ritaglio zoomato della
                   colonna. .sk-sub-media e' nascosta per tutta questa media query,
                   quindi la colonna testo puo' sempre prendersi il 100%. */
                flex: 1 1 100% !important;
                min-width: 0 !important;
                width: 100% !important;
                max-width: 100% !important;
                /* padding: top  right  bottom  left  (mobile/tablet ≤ 1024px) */
                padding: 4rem 1.5rem 2rem 1.5rem !important;
            }

            body #slide-out-widget-area .off-canvas-menu-container .sk-back-btn {
                display: inline-flex !important;
            }

            /* Font piu' grande su mobile/tablet, chiesto dall'utente dopo il fix
               della larghezza: 28px su ENTRAMBI i livelli (voci principali e
               destinazioni nel sotto-pannello), line-height 1 per compattare
               un font cosi' grande. Il cambio del solo token NON bastava: Salient
               ha una sua regola nativa, piu' specifica della nostra, che vince a
               prescindere -- l'ho trovata col Chrome DevTools Protocol
               (CSS.getMatchedStylesForNode), non a occhio:
                 body #slide-out-widget-area.slide-out-from-right-hover .inner-wrap
                   > .inner .off-canvas-menu-container li > a { font-size: 42px !important }
               (colors.php del tema, skin "slide-out-from-right-hover" che questo
               sito usa). 4 classi + 1 id contro le nostre 2 classi + 1 id: a
               parita' di !important vince lei. Sotto, stessa identica catena di
               Salient ma con in piu' .sk-menu-list/.sk-submenu-list (che nel DOM
               ci sono sempre): specificita' netta piu' alta, vince noi senza
               dover contare sull'ordine di caricamento dei due fogli. */
            #slide-out-widget-area {
                --sk-fs-main-item: 28px;
                --sk-fs-sub-item: 28px;
                --sk-lh-menu-item: 1;
            }
            body #slide-out-widget-area.slide-out-from-right-hover .inner-wrap > .inner
                .off-canvas-menu-container .sk-menu-list li > a,
            body #slide-out-widget-area.slide-out-from-right-hover .inner-wrap > .inner
                .off-canvas-menu-container .sk-submenu-list li > a {
                font-size: 28px !important;
                line-height: 1 !important;
            }
        }

        @media (max-width: 480px) {
            body #slide-out-widget-area .off-canvas-menu-container .sk-nav-col {
                padding: var(--sk-space-7, 3rem) var(--sk-space-6, 2rem) !important;
            }
        }

        @media (prefers-reduced-motion: reduce) {
            #slide-out-widget-area,
            body #slide-out-widget-area .off-canvas-menu-container .sk-reveal-col,
            body #slide-out-widget-area .off-canvas-menu-container .sk-sub,
            body #slide-out-widget-area .off-canvas-menu-container .sk-sub-media img,
            body #slide-out-widget-area .off-canvas-menu-container .sk-submenu-title,
            body #slide-out-widget-area .off-canvas-menu-container .sk-submenu-list li,
            body #slide-out-widget-area .off-canvas-menu-container .sk-menu-list li a {
                transition-duration: .001s !important;
                transition-delay: 0s !important;
                animation: none !important;
                transform: none !important;
            }

            body #slide-out-widget-area .off-canvas-menu-container .sk-submenu-title,
            body #slide-out-widget-area .off-canvas-menu-container .sk-submenu-list li {
                opacity: 1 !important;
            }
        }

        /* Preview foto destinazione all'hover (additivo: non tocca la logica click). */
        body #slide-out-widget-area .off-canvas-menu-container.sk-previewing .sk-reveal-col {
            opacity: 1 !important;
            transform: translateX(0) !important;
            pointer-events: none !important;
            transition-delay: 0s !important;
        }
        body #slide-out-widget-area .off-canvas-menu-container .sk-hover-preview {
            position: absolute !important;
            inset: 0 !important;
            z-index: 2 !important;
            overflow: hidden !important;
            background: var(--sk-shell, #EDE6DD) !important;
            opacity: 0 !important;
            visibility: hidden !important;
            transition: opacity .4s var(--sk-ease, cubic-bezier(.22, 1, .36, 1)) !important;
        }
        body #slide-out-widget-area .off-canvas-menu-container .sk-hover-preview img {
            position: absolute !important;
            inset: 0 !important;
            width: 100% !important;
            height: 100% !important;
            object-fit: cover !important;
            display: block !important;
            opacity: 0 !important;                       /* crossfade a 2 layer */
            transition: opacity .55s var(--sk-ease-out, cubic-bezier(.16, 1, .3, 1)) !important;
        }
        body #slide-out-widget-area .off-canvas-menu-container .sk-hover-preview img.is-active {
            opacity: 1 !important;
        }
        body #slide-out-widget-area .off-canvas-menu-container .sk-hover-preview::after {
            content: '' !important;
            position: absolute !important;
            inset: 0 !important;
            pointer-events: none !important;
            background: linear-gradient(180deg, transparent 38%, color-mix(in srgb, var(--sk-deep-teal, #005F6A) 32%, transparent) 100%) !important;
        }
        body #slide-out-widget-area .off-canvas-menu-container.sk-previewing:not(.sk-expanded) .sk-hover-preview {
            opacity: 1 !important;
            visibility: visible !important;
        }
        @media (max-width: 1024px) {
            body #slide-out-widget-area .off-canvas-menu-container .sk-hover-preview { display: none !important; }
        }

        /* =============================================================
           ERGONOMIA TOUCH — ottimizzazione mobile/tablet.
           Solo sotto i 1024px: il drawer desktop resta identico.
           Nota: le larghezze fisse 440/480px piu' sopra valgono solo da
           1025px in su, qui il pannello e' gia' fluido (88vw), quindi non
           erano un difetto mobile: verificato a misura, non dedotto.
           ============================================================= */
        @media (max-width: 1024px) {
            /* 10.5px e' sotto la soglia leggibile su schermo piccolo. */
            body #slide-out-widget-area .off-canvas-menu-container .sk-contact-label {
                font-size: 12px !important;
            }
            /* Telefono ed email sono link veri e venivano misurati alti 16px.
               Flex invece di padding: il testo resta dov'e', cresce l'area. */
            body #slide-out-widget-area .off-canvas-menu-container a.sk-contact-val {
                display: flex !important;
                align-items: center !important;
                min-height: 44px !important;
                font-size: 13px !important;
            }
        }