/* =========================================================
   SHAMÁ — MENU TABLET SEMPRE VISIBILE
   iPad Mini / tablet verticale: 651px–880px
   ========================================================= */

@media (min-width: 651px) and (max-width: 880px) {

    /* Header sempre ancorato alla viewport */
    .site-header,
    .site-header.is-scrolled {
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        bottom: auto !important;
        left: 0 !important;

        z-index: 2147483000 !important;

        width: 100% !important;
        height: 74px !important;
        min-height: 74px !important;
        max-height: 74px !important;

        margin: 0 !important;

        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;

        background: #faf8f3 !important;
        border-bottom: 1px solid rgba(53, 99, 71, 0.10) !important;

        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;

        overflow: visible !important;
        contain: none !important;
    }

    /* Spazio per l'header fixed */
    body {
        padding-top: 74px !important;
    }

    .header-container,
    .site-header.is-scrolled .header-container {
        width: calc(100% - 32px) !important;
        height: 74px !important;
        min-height: 74px !important;
        max-height: 74px !important;
        margin: 0 auto !important;

        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;

        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    .site-logo,
    .site-logo img,
    .site-header.is-scrolled .site-logo img {
        opacity: 1 !important;
        visibility: visible !important;
    }

    /* Pulsante hamburger sempre visibile e cliccabile */
    .navigation-toggle {
        position: relative !important;
        z-index: 2147483200 !important;

        display: inline-flex !important;
        width: 42px !important;
        height: 42px !important;
        flex: 0 0 42px !important;

        align-items: center !important;
        justify-content: center !important;
        flex-direction: column !important;
        gap: 5px !important;

        margin: 0 !important;
        padding: 0 !important;

        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;

        background: #fdfcf9 !important;
        border: 1px solid rgba(48, 77, 61, 0.20) !important;
        border-radius: 50% !important;
    }

    .navigation-toggle span {
        display: block !important;
        width: 19px !important;
        height: 2px !important;
        min-height: 2px !important;
        margin: 0 !important;

        opacity: 1 !important;
        visibility: visible !important;

        background: #304d3d !important;
        border-radius: 999px !important;
    }

    .navigation-toggle[aria-expanded="false"] span {
        transform: none !important;
    }

    .navigation-toggle[aria-expanded="true"] span:nth-child(1) {
        transform: translateY(7px) rotate(45deg) !important;
    }

    .navigation-toggle[aria-expanded="true"] span:nth-child(2) {
        opacity: 0 !important;
    }

    .navigation-toggle[aria-expanded="true"] span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg) !important;
    }

    /* Menu ancorato alla viewport, quindi si apre anche in fondo pagina */
    .main-navigation,
    .site-header.is-scrolled .main-navigation {
        position: fixed !important;

        top: 74px !important;
        right: 16px !important;
        bottom: auto !important;
        left: 16px !important;

        z-index: 2147483100 !important;

        width: auto !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: calc(100dvh - 90px) !important;

        margin: 0 !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }
}
