/* =========================================
   CSS VARIABLES - CUSTOMIZE YOUR MENU
   ========================================= */

.axis-menu-dropdown {
    /* Colors - Light Theme */
    --amd-bg-light: #ffffff;
    --amd-bg-panel-light: rgba(255, 255, 255, 0.85);
    --amd-text-primary-light: #0a0a0a; /* accent color */
    --amd-text-secondary-light: #1e1e1e; /* #6a6a6a; */
    --amd-text-muted-light: #666666;
    --amd-border-light: #efefef;
    --amd-dropdown-shadow-light: 0 8px 32px rgba(0, 0, 0, 0.12);
    --amd-cta-opacity-hover-light: 0.8;
    --amd-cta-bg-light: #0a0a0a;
    
    /* Colors - Dark Theme */
    --amd-bg-dark: #2b2b2b;
    --amd-bg-panel-dark: rgba(10, 10, 10, 0.85);
    --amd-text-primary-dark: #ffffff;
    --amd-text-secondary-dark: #d1d1d1;
    --amd-text-muted-dark: #c3c3c3;
    --amd-border-dark: rgba(255, 255, 255, 0.12);
    --amd-dropdown-shadow-dark: 0 8px 32px rgba(0, 0, 0, 0.4);
    --amd-cta-opacity-hover-dark:0.95;
    --amd-cta-bg-dark: #ffffff;
    
    /* Dimensions */
    --amd-brand-width: 280px;
    --amd-brand-padding: 28px 40px;
    --amd-nav-padding: 0 48px;
    --amd-nav-gap: 40px;
    --amd-contact-padding: 28px 40px;
    
    /* Typography */
    --amd-logo-size: 16px;
    --amd-logo-weight: 600;
    --amd-tagline-size: 13px;
    --amd-link-size: 14px;
    --amd-link-weight: 400;
    --amd-link-active-weight: 500;
    --amd-cta-size: 14px;
    --amd-cta-weight: 500;
    --amd-cta-padding: 9px 25px;
    --amd-cta-border-radius: 22px;
    
    /* Mobile Typography */
    --amd-mobile-link-size: 18px;
    --amd-mobile-cta-size: 14px;
    --amd-mobile-cta-padding: 14px 28px;
    
    /* Dropdown */
    --amd-dropdown-border-radius: 12px;
    --amd-dropdown-padding: 8px;
    --amd-dropdown-min-width: 200px;
    --amd-dropdown-item-padding: 10px 16px;
    --amd-dropdown-item-radius: 6px;
    --amd-dropdown-offset: 12px;
    --amd-submenu-offset: 8px;
    
    /* Animations */
    --amd-transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --amd-slide-transition: 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    --amd-mobile-transition: 0.4s cubic-bezier(0.77, 0, 0.175, 1);
    --amd-dropdown-transition: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    
    /* Blur effect */
    --amd-blur: 20px;
    
    /* Z-index layers */
    --amd-z-nav: 1000;
    --amd-z-toggle: 1001;
    --amd-z-overlay: 999;
    --amd-z-dropdown: 1010;
    
    /* Hamburger */
    --amd-hamburger-width: 22px;
    --amd-hamburger-height: 2px;
    --amd-hamburger-gap: 6px;
    
    /* Active theme variables (default to light) */
    --amd-bg: var(--amd-bg-light);
    --amd-bg-panel: var(--amd-bg-panel-light);
    --amd-text-primary: var(--amd-text-primary-light);
    --amd-text-secondary: var(--amd-text-secondary-light);
    --amd-text-muted: var(--amd-text-muted-light);
    --amd-border: var(--amd-border-light);
    --amd-dropdown-shadow: var(--amd-dropdown-shadow-light);
}

/* =========================================
   BASE MENU STYLES
   ========================================= */

.axis-menu-dropdown {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: var(--amd-z-nav);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.axis-menu-dropdown *,
.axis-menu-dropdown *::before,
.axis-menu-dropdown *::after {
    box-sizing: border-box;
}

/* Custom adjustment for section after the menu to make it fully visible on viewport */
.axis-menu-dropdown + .is-section-10 { min-height: calc(10vh - 96px) !important; }
.axis-menu-dropdown + .is-section-15 { min-height: calc(15vh - 96px) !important; }
.axis-menu-dropdown + .is-section-20 { min-height: calc(20vh - 96px) !important; }
.axis-menu-dropdown + .is-section-25 { min-height: calc(25vh - 96px) !important; }
.axis-menu-dropdown + .is-section-30 { min-height: calc(30vh - 96px) !important; }
.axis-menu-dropdown + .is-section-40 { min-height: calc(40vh - 96px) !important; }
.axis-menu-dropdown + .is-section-50 { min-height: calc(50vh - 96px) !important; }
.axis-menu-dropdown + .is-section-60 { min-height: calc(60vh - 96px) !important; }
.axis-menu-dropdown + .is-section-70 { min-height: calc(70vh - 96px) !important; }
.axis-menu-dropdown + .is-section-75 { min-height: calc(75vh - 96px) !important; }
.axis-menu-dropdown + .is-section-80 { min-height: calc(80vh - 96px) !important; }
.axis-menu-dropdown + .is-section-85 { min-height: calc(85vh - 96px) !important; }
.axis-menu-dropdown + .is-section-90 { min-height: calc(90vh - 96px) !important; }
.axis-menu-dropdown + .is-section-100 { min-height: calc(100vh - 96px) !important; }

.axis-menu-dropdown + .box-canvas.is-section-10 { height: calc(10vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-15 { height: calc(15vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-20 { height: calc(20vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-25 { height: calc(25vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-30 { height: calc(30vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-40 { height: calc(40vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-50 { height: calc(50vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-60 { height: calc(60vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-70 { height: calc(70vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-75 { height: calc(75vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-80 { height: calc(80vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-85 { height: calc(85vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-90 { height: calc(90vh - 96px) !important; }
.axis-menu-dropdown + .box-canvas.is-section-100 { height: calc(100vh - 96px) !important; }
/* =========================================
   INNER GRID CONTAINER
   ========================================= */

.axis-menu-dropdown__inner {
    display: grid;
    grid-template-columns: var(--amd-brand-width) 1fr auto;
    background: var(--amd-bg-panel);
    backdrop-filter: blur(var(--amd-blur));
    -webkit-backdrop-filter: blur(var(--amd-blur));
    border-bottom: 1px solid var(--amd-border);
    transition: background var(--amd-transition),
                border-color var(--amd-transition);
}

/* =========================================
   BRAND SECTION
   ========================================= */

.axis-menu-dropdown__brand {
    padding: var(--amd-brand-padding);
    border-right: 1px solid var(--amd-border);
    display: flex;
    flex-direction: column;
    gap: 4px;
    background: transparent; /* var(--amd-bg); */
    transition: background var(--amd-transition),
                border-color var(--amd-transition),
                padding var(--amd-transition);
}

.axis-menu-dropdown__logo {
    font-size: var(--amd-logo-size);
    font-weight: var(--amd-logo-weight);
    letter-spacing: -0.02em;
    color: var(--amd-text-primary);
    text-decoration: none;
    transition: opacity var(--amd-transition),
                color var(--amd-transition);
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.axis-menu-dropdown__logo:focus-visible {
    outline: 2px solid var(--amd-text-primary);
    outline-offset: 4px;
    border-radius: 2px;
}

.axis-menu-dropdown__tagline {
    font-size: var(--amd-tagline-size);
    font-weight: 400;
    color: var(--amd-text-muted);
    letter-spacing: 0.02em;
    transition: color var(--amd-transition);
}

/* Logo with image support */
.axis-menu-dropdown__logo-combo {
    display: flex;
    align-items: center;
    gap: 12px;
}

.axis-menu-dropdown__logo-image {
    height: 47px;
    width: auto;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    transition: all var(--amd-transition);
}

.axis-menu-dropdown__logo-image img {
    height: 100%;
    width: auto;
    object-fit: contain;
    display: block;
}

.axis-menu-dropdown__logo-image--rounded {
    width: 47px;
    border-radius: 50%;
    aspect-ratio: 1 / 1;
}

.axis-menu-dropdown__logo-image--rounded img {
    width: 100%;
    object-fit: cover;
}

.axis-menu-dropdown__logo-text {
    display: flex;
    flex-direction: column;
}

/* =========================================
   MENU TOGGLE (Hidden Checkbox)
   ========================================= */

.axis-menu-dropdown__toggle {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

/* =========================================
   HAMBURGER BUTTON
   ========================================= */

.axis-menu-dropdown__toggle-button {
    display: none;
    cursor: pointer;
    z-index: var(--amd-z-toggle);
    padding: 10px;
    margin-right: -10px;
    user-select: none;
    background: none;
    border: none;
    position: relative;
}

.axis-menu-dropdown__toggle-button:focus-visible {
    outline: 2px solid var(--amd-text-primary);
    outline-offset: 4px;
    border-radius: 2px;
}

.axis-menu-dropdown__hamburger {
    width: var(--amd-hamburger-width);
    height: var(--amd-hamburger-height);
    background: var(--amd-text-primary);
    display: block;
    position: relative;
    transition: var(--amd-transition);
}

.axis-menu-dropdown__hamburger::before,
.axis-menu-dropdown__hamburger::after {
    content: '';
    width: var(--amd-hamburger-width);
    height: var(--amd-hamburger-height);
    background: var(--amd-text-primary);
    position: absolute;
    left: 0;
    transition: var(--amd-transition);
}

.axis-menu-dropdown__hamburger::before {
    top: calc(-1 * var(--amd-hamburger-gap));
}

.axis-menu-dropdown__hamburger::after {
    bottom: calc(-1 * var(--amd-hamburger-gap));
}

/* =========================================
   NAVIGATION SECTION
   ========================================= */

.axis-menu-dropdown__nav {
    display: flex;
    align-items: center;
    padding: var(--amd-nav-padding);
    gap: var(--amd-nav-gap);
}

.axis-menu-dropdown__nav-list {
    display: contents;
    list-style: none;
    margin: 0;
    padding: 0;
}

.axis-menu-dropdown__nav-item {
    display: flex;
    align-items: center;
    position: relative;
}

/* Wrapper for positioning dropdown */
.axis-menu-dropdown__nav-item-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

/* =========================================
   NAVIGATION LINKS
   ========================================= */

.axis-menu-dropdown__link {
    font-size: var(--amd-link-size);
    font-weight: var(--amd-link-weight);
    color: var(--amd-text-secondary);
    text-decoration: none;
    letter-spacing: -0.01em;
    transition: color var(--amd-transition);
    position: relative;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    line-height: 3;
}

.axis-menu-dropdown__link:hover,
.axis-menu-dropdown__link:focus-visible {
    color: var(--amd-text-primary);
}

.axis-menu-dropdown__link:focus-visible {
    outline: 2px solid var(--amd-text-primary);
    outline-offset: 4px;
    border-radius: 2px;
}

.axis-menu-dropdown__link--active {
    color: var(--amd-text-primary);
    font-weight: var(--amd-link-active-weight);
}

/* =========================================
   LINK WRAPPER (for split click targets on mobile)
   ========================================= */

.axis-menu-dropdown__link-wrapper {
    display: contents;
}

.axis-menu-dropdown__dropdown-link-wrapper {
    display: contents;
}

/* Dropdown chevron icon */
.axis-menu-dropdown__chevron {
    width: 10px;
    height: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform var(--amd-dropdown-transition);
    flex-shrink: 0;
}

.axis-menu-dropdown__chevron svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Mobile chevron toggle button - hidden on desktop */
.axis-menu-dropdown__chevron-toggle {
    display: none;
}

/* =========================================
   DROPDOWN MENU
   ========================================= */

.axis-menu-dropdown__dropdown {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    min-width: var(--amd-dropdown-min-width);
    background: var(--amd-bg);
    border: 1px solid var(--amd-border);
    border-radius: var(--amd-dropdown-border-radius);
    padding: var(--amd-dropdown-padding);
    box-shadow: var(--amd-dropdown-shadow);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity var(--amd-dropdown-transition),
                transform var(--amd-dropdown-transition),
                visibility 0s linear 0.2s;
    z-index: var(--amd-z-dropdown);
    margin-top: var(--amd-dropdown-offset);
}

/* Dropdown open state */
.axis-menu-dropdown__nav-item-wrapper--open > .axis-menu-dropdown__dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
    transition: opacity var(--amd-dropdown-transition),
                transform var(--amd-dropdown-transition),
                visibility 0s linear 0s;
}

/* Chevron rotation when open */
.axis-menu-dropdown__nav-item-wrapper--open > .axis-menu-dropdown__link .axis-menu-dropdown__chevron,
.axis-menu-dropdown__nav-item-wrapper--open > .axis-menu-dropdown__link-wrapper > .axis-menu-dropdown__link .axis-menu-dropdown__chevron {
    transform: rotate(180deg);
}

/* Dropdown list */
.axis-menu-dropdown__dropdown-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Dropdown item */
.axis-menu-dropdown__dropdown-item {
    position: relative;
}

/* Dropdown link */
.axis-menu-dropdown__dropdown-link {
    font-size: var(--amd-link-size);
    font-weight: var(--amd-link-weight);
    color: var(--amd-text-secondary);
    text-decoration: none;
    padding: var(--amd-dropdown-item-padding);
    border-radius: var(--amd-dropdown-item-radius);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    transition: all var(--amd-transition);
    cursor: pointer;
    white-space: nowrap;
}

.axis-menu-dropdown__dropdown-link:hover {
    color: var(--amd-text-primary);
    background: var(--amd-border);
}

.axis-menu-dropdown__dropdown-link:focus-visible {
    outline: 2px solid var(--amd-text-primary);
    outline-offset: -2px;
}

/* Submenu chevron (points right) */
.axis-menu-dropdown__dropdown-link .axis-menu-dropdown__chevron {
    transform: rotate(-90deg);
}

.axis-menu-dropdown__dropdown-item--open > .axis-menu-dropdown__dropdown-link .axis-menu-dropdown__chevron,
.axis-menu-dropdown__dropdown-item--open > .axis-menu-dropdown__dropdown-link-wrapper > .axis-menu-dropdown__dropdown-link .axis-menu-dropdown__chevron {
    transform: rotate(90deg);
}

/* =========================================
   NESTED DROPDOWN (SUBMENU)
   ========================================= */

.axis-menu-dropdown__submenu {
    position: absolute;
    top: 0;
    left: 100%;
    margin-left: var(--amd-submenu-offset);
    min-width: var(--amd-dropdown-min-width);
    background: var(--amd-bg);
    border: 1px solid var(--amd-border);
    border-radius: var(--amd-dropdown-border-radius);
    padding: var(--amd-dropdown-padding);
    box-shadow: var(--amd-dropdown-shadow);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity var(--amd-dropdown-transition),
                transform var(--amd-dropdown-transition),
                visibility 0s linear 0.2s;
    z-index: var(--amd-z-dropdown);
    transform: translateX(-8px);
}

/* Submenu open state */
.axis-menu-dropdown__dropdown-item--open > .axis-menu-dropdown__submenu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
    transition: opacity var(--amd-dropdown-transition),
                transform var(--amd-dropdown-transition),
                visibility 0s linear 0s;
}

/* =========================================
   CONTACT/CTA SECTION
   ========================================= */

/* Mobile CTA (hidden by default, shown in mobile nav) */
.axis-menu-dropdown__nav-cta {
    display: none;
}

.axis-menu-dropdown__contact {
    padding: var(--amd-contact-padding);
    border-left: 1px solid var(--amd-border);
    display: flex;
    align-items: center;
    background: transparent; /* var(--amd-bg); */
    transition: background var(--amd-transition),
                border-color var(--amd-transition),
                padding var(--amd-transition);
}

.axis-menu-dropdown__cta {
    font-size: var(--amd-cta-size);
    font-weight: var(--amd-cta-weight);
    color: var(--amd-bg);
    background: var(--amd-cta-bg);
    text-decoration: none;
    padding: var(--amd-cta-padding);
    letter-spacing: -0.01em;
    transition: all var(--amd-transition);
    border: 2px solid var(--amd-cta-bg);
    border-radius: var(--amd-cta-border-radius);
    white-space: nowrap;
}

/* .axis-menu-dropdown__cta:hover {
    background: transparent;
    color: var(--amd-text-primary);
} */
.axis-menu-dropdown__cta:hover {
    opacity: var(--amd-cta-opacity-hover);
}
.axis-menu-dropdown__cta:focus-visible {
    outline: 2px solid var(--amd-text-primary);
    outline-offset: 4px;
}

/* =========================================
   THEME VARIATIONS
   ========================================= */

/* Dark Theme Override */
.axis-menu-dropdown--theme-dark {
    --amd-bg: var(--amd-bg-dark);
    --amd-bg-panel: var(--amd-bg-panel-dark);
    --amd-text-primary: var(--amd-text-primary-dark);
    --amd-text-secondary: var(--amd-text-secondary-dark);
    --amd-text-muted: var(--amd-text-muted-dark);
    --amd-border: var(--amd-border-dark);
    --amd-dropdown-shadow: var(--amd-dropdown-shadow-dark);
    --amd-cta-opacity-hover: var(--amd-cta-opacity-hover-dark);
    --amd-cta-bg: var(--amd-cta-bg-dark);
}

/* Light Theme (Explicit) */
.axis-menu-dropdown--theme-light {
    --amd-bg: var(--amd-bg-light);
    --amd-bg-panel: var(--amd-bg-panel-light);
    --amd-text-primary: var(--amd-text-primary-light);
    --amd-text-secondary: var(--amd-text-secondary-light);
    --amd-text-muted: var(--amd-text-muted-light);
    --amd-border: var(--amd-border-light);
    --amd-dropdown-shadow: var(--amd-dropdown-shadow-light);
    --amd-cta-opacity-hover: var(--amd-cta-opacity-hover-light);
    --amd-cta-bg: var(--amd-cta-bg-light);
}

/* =========================================
   SCROLLED STATE
   ========================================= */

.axis-menu-dropdown--scrolled .axis-menu-dropdown__brand,
.axis-menu-dropdown--scrolled .axis-menu-dropdown__contact {
    padding-top: 18px;
    padding-bottom: 18px;
}

.axis-menu-dropdown--scrolled .axis-menu-dropdown__logo-image {
    height: 38px;
}

.axis-menu-dropdown--scrolled .axis-menu-dropdown__logo-image--rounded {
    width: 38px;
}

/* =========================================
   RESPONSIVE / TABLET
   ========================================= */

@media (max-width: 1200px) {
    .axis-menu-dropdown {
        --amd-brand-width: 240px;
        --amd-brand-padding: 24px 32px;
        --amd-nav-padding: 0 32px;
        --amd-nav-gap: 32px;
        --amd-contact-padding: 24px 32px;
    }
}

/* =========================================
   RESPONSIVE / MOBILE
   ========================================= */

@media (max-width: 900px) {
    .axis-menu-dropdown__toggle-button {
        display: block;
    }
    
    .axis-menu-dropdown__inner {
        grid-template-columns: 1fr auto;
        grid-template-rows: auto;
    }
    
    .axis-menu-dropdown__brand {
        border-right: none;
        padding: 20px 24px;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
    }
    
    .axis-menu-dropdown__logo {
        flex-direction: row;
        align-items: center;
        gap: 8px;
    }
    
    .axis-menu-dropdown__tagline {
        display: none;
    }
    
    /* Contact section becomes the toggle container */
    .axis-menu-dropdown__contact {
        border-left: none;
        padding: 20px 24px;
        background: transparent;
    }
    
    /* Hide CTA in header on mobile */
    .axis-menu-dropdown__contact .axis-menu-dropdown__cta {
        display: none;
    }
    
    /* Navigation becomes full-screen overlay */
    .axis-menu-dropdown__nav {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: var(--amd-bg);
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        gap: 0;
        padding: 100px 24px 40px;
        transform: translateY(-100%);
        transition: transform var(--amd-mobile-transition);
        z-index: var(--amd-z-nav);
        overflow-y: auto;
    }
    
    .axis-menu-dropdown__nav-list {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        width: 100%;
    }
    
    .axis-menu-dropdown__nav-item {
        display: block;
    }
    
    .axis-menu-dropdown__nav-item-wrapper {
        flex-direction: column;
        align-items: stretch;
        border-bottom: 1px solid var(--amd-border);
    }

    /* =========================================
       MOBILE LINK WRAPPER - Split click targets
       ========================================= */
    
    .axis-menu-dropdown__link-wrapper {
        display: flex;
        align-items: stretch;
        width: 100%;
    }

    .axis-menu-dropdown__dropdown-link-wrapper {
        display: flex;
        align-items: stretch;
        width: 100%;
    }
    
    .axis-menu-dropdown__link {
        font-size: var(--amd-mobile-link-size);
        font-weight: 500;
        color: var(--amd-text-primary);
        padding: 20px 0;
        justify-content: space-between;
        width: 100%;
        line-height: 1.2;
    }

    /* Link inside wrapper - flex grow */
    .axis-menu-dropdown__link-wrapper .axis-menu-dropdown__link {
        flex: 1;
        padding-right: 12px;
    }

    /* Hide inline chevron on mobile when wrapper is used */
    .axis-menu-dropdown__link-wrapper .axis-menu-dropdown__link .axis-menu-dropdown__chevron {
        display: none;
    }

    /* Mobile chevron toggle button */
    .axis-menu-dropdown__chevron-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50px;
        min-width: 50px;
        background: transparent;
        border: none;
        border-left: 1px solid var(--amd-border);
        cursor: pointer;
        color: var(--amd-text-primary);
        padding: 0;
        transition: background var(--amd-transition);
    }

    .axis-menu-dropdown__chevron-toggle:hover {
        background: var(--amd-border);
    }

    .axis-menu-dropdown__chevron-toggle:focus-visible {
        outline: 2px solid var(--amd-text-primary);
        outline-offset: -4px;
    }

    .axis-menu-dropdown__chevron-toggle .axis-menu-dropdown__chevron {
        width: 12px;
        height: 12px;
        transition: transform var(--amd-dropdown-transition);
    }

    /* Rotate chevron when open */
    .axis-menu-dropdown__nav-item-wrapper--open > .axis-menu-dropdown__link-wrapper .axis-menu-dropdown__chevron-toggle .axis-menu-dropdown__chevron {
        transform: rotate(180deg);
    }
    
    /* Mobile Dropdown - accordion style */
    .axis-menu-dropdown__dropdown {
        position: static;
        transform: none;
        min-width: 100%;
        border: none;
        border-radius: 0;
        padding: 0;
        padding-left: 16px;
        box-shadow: none;
        margin: 0;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        max-height: 0;
        overflow: hidden;
        transition: max-height var(--amd-mobile-transition);
        background: transparent;
    }
    
    .axis-menu-dropdown__nav-item-wrapper--open > .axis-menu-dropdown__dropdown {
        max-height: 500px;
        padding-bottom: 0; /*16px;*/
        transform: none;
    }
    
    /* Mobile Submenu */
    .axis-menu-dropdown__submenu {
        position: static;
        transform: none;
        min-width: 100%;
        border: none;
        border-radius: 0;
        padding: 0;
        padding-left: 16px;
        box-shadow: none;
        margin: 0;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        max-height: 0;
        overflow: hidden;
        transition: max-height var(--amd-mobile-transition);
        background: transparent;
    }
    
    .axis-menu-dropdown__dropdown-item--open > .axis-menu-dropdown__submenu {
        max-height: 500px;
        padding-bottom: 0; /* 8px; */
        transform: none;
    }
    
    /* Mobile dropdown items */
    .axis-menu-dropdown__dropdown-link {
        font-size: 16px;
        padding: 14px 0;
        border-radius: 0;
        color: var(--amd-text-secondary);
    }

    /* Dropdown link inside wrapper */
    .axis-menu-dropdown__dropdown-link-wrapper .axis-menu-dropdown__dropdown-link {
        flex: 1;
        padding-right: 12px;
    }

    /* Hide inline chevron on mobile when wrapper is used */
    .axis-menu-dropdown__dropdown-link-wrapper .axis-menu-dropdown__dropdown-link .axis-menu-dropdown__chevron {
        display: none;
    }

    /* Dropdown chevron toggle */
    .axis-menu-dropdown__dropdown-link-wrapper .axis-menu-dropdown__chevron-toggle {
        width: 44px;
        min-width: 44px;
    }

    /* Rotate chevron when open for nested items */
    .axis-menu-dropdown__dropdown-item--open > .axis-menu-dropdown__dropdown-link-wrapper .axis-menu-dropdown__chevron-toggle .axis-menu-dropdown__chevron {
        transform: rotate(180deg);
    }
    
    .axis-menu-dropdown__dropdown-link:hover {
        background: transparent;
        color: var(--amd-text-primary);
    }
    
    /* Mobile chevron adjustments for non-wrapper links */
    .axis-menu-dropdown__dropdown-link .axis-menu-dropdown__chevron {
        transform: rotate(0deg);
    }
    
    .axis-menu-dropdown__dropdown-item--open > .axis-menu-dropdown__dropdown-link .axis-menu-dropdown__chevron {
        transform: rotate(180deg);
    }
    
    /* Mobile CTA inside nav */
    .axis-menu-dropdown__nav-cta {
        display: block;
        margin-top: 32px;
        text-align: center;
    }
    
    .axis-menu-dropdown__nav-cta .axis-menu-dropdown__cta {
        font-size: var(--amd-mobile-cta-size);
        padding: var(--amd-mobile-cta-padding);
        min-width: 200px;
        display: inline-block;
    }
    
    /* Menu Open State */
    .axis-menu-dropdown__toggle:checked ~ .axis-menu-dropdown__inner .axis-menu-dropdown__nav {
        transform: translateY(0);
    }
    
    .axis-menu-dropdown__toggle:checked ~ .axis-menu-dropdown__inner .axis-menu-dropdown__contact .axis-menu-dropdown__hamburger {
        background: transparent;
    }
    
    .axis-menu-dropdown__toggle:checked ~ .axis-menu-dropdown__inner .axis-menu-dropdown__contact .axis-menu-dropdown__hamburger::before {
        transform: rotate(45deg) translate(4px, 4px);
    }
    
    .axis-menu-dropdown__toggle:checked ~ .axis-menu-dropdown__inner .axis-menu-dropdown__contact .axis-menu-dropdown__hamburger::after {
        transform: rotate(-45deg) translate(4px, -5px);
    }
    
    /* Prevent body scroll when menu is open */
    body:has(.axis-menu-dropdown__toggle:checked) {
        overflow: hidden;
    }
    
    /* Scrolled state on mobile */
    .axis-menu-dropdown--scrolled .axis-menu-dropdown__brand,
    .axis-menu-dropdown--scrolled .axis-menu-dropdown__contact {
        padding-top: 12px;
        padding-bottom: 12px;
    }
    
    .axis-menu-dropdown--scrolled .axis-menu-dropdown__logo-image {
        height: 40px;
    }
    
    .axis-menu-dropdown--scrolled .axis-menu-dropdown__logo-image--rounded {
        width: 40px;
    }
}

@media (max-width: 480px) {
    .axis-menu-dropdown__brand {
        padding: 16px 20px;
    }
    
    .axis-menu-dropdown__contact {
        padding: 16px 20px;
    }
    
    .axis-menu-dropdown__nav {
        padding: 80px 20px 40px;
    }
    
    .axis-menu-dropdown__link {
        font-size: 20px;
    }
    
    .axis-menu-dropdown--scrolled .axis-menu-dropdown__brand,
    .axis-menu-dropdown--scrolled .axis-menu-dropdown__contact {
        padding-top: 10px;
        padding-bottom: 10px;
    }
}

/* =========================================
   ACCESSIBILITY ENHANCEMENTS
   ========================================= */

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
    .axis-menu-dropdown,
    .axis-menu-dropdown *,
    .axis-menu-dropdown *::before,
    .axis-menu-dropdown *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .axis-menu-dropdown__inner {
        border-bottom-width: 2px;
    }
    
    .axis-menu-dropdown__brand {
        border-right-width: 2px;
    }
    
    .axis-menu-dropdown__contact {
        border-left-width: 2px;
    }
    
    .axis-menu-dropdown__dropdown,
    .axis-menu-dropdown__submenu {
        border-width: 2px;
    }
    
    .axis-menu-dropdown__link:focus-visible,
    .axis-menu-dropdown__logo:focus-visible,
    .axis-menu-dropdown__cta:focus-visible,
    .axis-menu-dropdown__toggle-button:focus-visible,
    .axis-menu-dropdown__dropdown-link:focus-visible,
    .axis-menu-dropdown__chevron-toggle:focus-visible {
        outline-width: 3px;
    }
}

/* Screen reader only class */
.axis-menu-dropdown__sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* =========================================
   OPTIONAL MODIFIERS
   ========================================= */

/* Fixed position variant */
.axis-menu-dropdown--fixed {
    position: fixed;
}

/* Compact variant */
.axis-menu-dropdown--compact {
    --amd-brand-padding: 20px 32px;
    --amd-contact-padding: 20px 32px;
    --amd-logo-size: 14px;
    --amd-link-size: 13px;
}

/* Rounded CTA variant */
.axis-menu-dropdown--cta-rounded .axis-menu-dropdown__cta {
    border-radius: 4px;
}

.axis-menu-dropdown--cta-pill .axis-menu-dropdown__cta {
    border-radius: 100px;
}

/* =========================================
   PRINT STYLES
   ========================================= */

@media print {
    .axis-menu-dropdown {
        display: none;
    }
}

/* =========================================================================
   NESTED MENU FIX (repo-hosted) — added by Midas
   Open on CSS :hover, map the markup's "__sub-dropdown*" classes onto the
   template's existing submenu styles, remove stray list markers, hide the raw
   toggle buttons, and add hover bridges across the panel gaps so the menu does
   not close before the cursor can reach the (nested) items.
   ========================================================================= */

.axis-menu-dropdown__dropdown,
.axis-menu-dropdown__sub-dropdown,
.axis-menu-dropdown__dropdown-item,
.axis-menu-dropdown__sub-dropdown-item { list-style: none; }

.axis-menu-dropdown__dropdown-toggle,
.axis-menu-dropdown__sub-dropdown-toggle { display: none; }

.axis-menu-dropdown__link--has-dropdown::after,
.axis-menu-dropdown__dropdown-link--has-dropdown::after {
    content: '';
    width: 6px; height: 6px;
    border: solid currentColor;
    border-width: 0 1.5px 1.5px 0;
    transform: rotate(45deg);
    transform-origin: center;
    opacity: .6;
    margin-top: -2px;
    flex-shrink: 0;
    transition: transform .2s ease;
}
.axis-menu-dropdown__dropdown-link--has-dropdown::after { transform: rotate(-45deg); margin-top: 0; }

.axis-menu-dropdown__sub-dropdown {
position: absolute;
    top: 0;
    left: 100%;
    /*
     * Overlap the parent panel by 1px instead of leaving a transparent gap. A
     * transparent hover-bridge across a real gap loses the hit-test to page
     * content painted in a transformed stacking context (e.g. a hero slider),
     * so the flyout would close as the cursor crossed. Touching opaque panels
     * never expose that seam. The widened ::before below is a second safety net.
     */
    margin-left: -1px;
    min-width: var(--amd-dropdown-min-width);
    background: var(--amd-bg);
    border: 1px solid var(--amd-border);
    border-radius: var(--amd-dropdown-border-radius);
    padding: var(--amd-dropdown-padding);
    box-shadow: var(--amd-dropdown-shadow);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity var(--amd-dropdown-transition),
                transform var(--amd-dropdown-transition),
                visibility 0s linear 0.2s;
    z-index: var(--amd-z-dropdown);
    transform: translateX(-8px);
}
.axis-menu-dropdown__sub-dropdown-item {
position: relative;
}
.axis-menu-dropdown__sub-dropdown-link {
font-size: var(--amd-link-size);
    font-weight: var(--amd-link-weight);
    color: var(--amd-text-secondary);
    text-decoration: none;
    padding: var(--amd-dropdown-item-padding);
    border-radius: var(--amd-dropdown-item-radius);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    transition: all var(--amd-transition);
    cursor: pointer;
    white-space: nowrap;
}
.axis-menu-dropdown__sub-dropdown-link:hover {
color: var(--amd-text-primary);
    background: var(--amd-border);
}

.axis-menu-dropdown__dropdown-item--open > .axis-menu-dropdown__sub-dropdown {
    opacity: 1; visibility: visible; pointer-events: auto; transform: none;
}

@media (min-width: 769px) {
    .axis-menu-dropdown__nav-item:hover > .axis-menu-dropdown__dropdown {
        opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0);
    }
    .axis-menu-dropdown__nav-item:hover > .axis-menu-dropdown__link-wrapper > .axis-menu-dropdown__link--has-dropdown::after {
        transform: rotate(225deg); margin-top: 2px;
    }
    .axis-menu-dropdown__dropdown-item:hover > .axis-menu-dropdown__sub-dropdown {
        opacity: 1; visibility: visible; pointer-events: auto; transform: none;
    }
    /* Hover bridge: first-level dropdown (fills the gap below the trigger) */
    .axis-menu-dropdown__dropdown::before {
        content: '';
        position: absolute;
        left: 0; right: 0;
        bottom: 100%;
        height: calc(var(--amd-dropdown-offset) + 8px);
    }
    /*
     * Hover bridge: second-level flyout. Reaches ~10px back into the parent
     * panel's opaque area (which itself wins the hit-test over page content) so
     * the cursor path from row to flyout is continuously backed and never falls
     * through onto whatever sits behind the menu.
     */
    .axis-menu-dropdown__sub-dropdown::before {
        content: '';
        position: absolute;
        top: 0; bottom: 0;
        left: -10px;
        width: 14px;
    }
}


/* MIDAS first-level hover bridge */
/*
 * The gap between a top-level item and its dropdown sits inside the nav bar/pill,
 * where the item's own hover box does not reach (and a backdrop-filter pill paints
 * over any bridge placed on the panel). This pseudo-element fills that gap with a
 * z-index above the bar, and — being part of the item — keeps the item hovered so
 * the dropdown stays open while the cursor crosses to it. Only present while the
 * item is hovered/open, so it never intercepts the page otherwise.
 */
@media (min-width: 769px) {
    .axis-menu-dropdown__nav-item { position: relative; }
    .axis-menu-dropdown__nav-item:hover::after,
    .axis-menu-dropdown__nav-item--open::after {
        content: '';
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        height: 22px;
        z-index: 2000;
    }
}
