/* OJEMA PREMIUM MOBILE EXPERIENCE */

.ojema-menu-toggle {
    display: none !important;
}

@media (max-width: 760px) {

    .ojema-site-header {
        position: relative !important;
        z-index: 1000 !important;
        overflow: visible !important;
    }

    .ojema-site-header .ojema-header-inner {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        flex-wrap: nowrap !important;
        gap: 12px !important;
        padding: 12px 16px !important;
        position: relative !important;
    }

    .ojema-site-header .ojema-brand {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        max-width: calc(100% - 58px) !important;
        justify-content: flex-start !important;
    }

    .ojema-site-header .ojema-header-logo {
        width: min(220px, 65vw) !important;
        max-width: 100% !important;
        height: auto !important;
    }

    /* Hamburger button */

    .ojema-site-header .ojema-menu-toggle {
        display: inline-flex !important;
        flex: 0 0 46px !important;
        width: 46px !important;
        height: 46px !important;
        align-items: center !important;
        justify-content: center !important;
        flex-direction: column !important;
        gap: 5px !important;
        padding: 0 !important;
        background: #123e2c !important;
        border: 1px solid #c9a052 !important;
        border-radius: 9px !important;
        cursor: pointer !important;
        box-shadow: 0 3px 10px rgba(0,0,0,.10) !important;
    }

    .ojema-menu-toggle span {
        display: block !important;
        width: 21px !important;
        height: 2px !important;
        border-radius: 2px !important;
        background: #ffffff !important;
        transition: transform .2s ease, opacity .2s ease !important;
    }

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

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

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

    /* Mobile dropdown */

    .ojema-site-header .ojema-main-navigation {
        display: none !important;
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        max-width: none !important;
        flex: none !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
        gap: 0 !important;
        margin: 0 !important;
        padding: 8px 16px 16px !important;
        background: #ffffff !important;
        border-top: 1px solid #e9e5dc !important;
        box-shadow: 0 12px 22px rgba(0,0,0,.13) !important;
        z-index: 1001 !important;
        overflow: visible !important;
    }

    .ojema-site-header .ojema-main-navigation.is-open {
        display: flex !important;
    }

    .ojema-site-header .ojema-main-navigation a {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 48px !important;
        padding: 13px 12px !important;
        margin: 0 !important;
        color: #123e2c !important;
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 15px !important;
        font-weight: 700 !important;
        line-height: 1.4 !important;
        white-space: normal !important;
        border-bottom: 1px solid #edf0ec !important;
        text-decoration: none !important;
    }

    .ojema-site-header .ojema-main-navigation a:last-child {
        border-bottom: 0 !important;
    }

    .ojema-site-header .ojema-main-navigation a:hover,
    .ojema-site-header .ojema-main-navigation a:focus-visible {
        color: #a77d35 !important;
        background: #f7f8f5 !important;
        outline-offset: -2px !important;
    }
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
    .ojema-menu-toggle span {
        transition: none !important;
    }
}
