/* Orisa desktop mega menu */
.at-main-menu nav > ul {
    position: relative;
}

.at-main-menu nav > ul > .at-mega-menu-item {
    position: static;
}

.at-main-menu nav > ul > .at-mega-menu-item > .at-mega-menu {
    position: absolute;
    z-index: 1050;
    top: 100%;
    left: 50%;
    width: min(1140px, calc(100vw - 40px));
    padding-top: 12px;
    color: var(--at-mega-menu-text, #1d1d1d);
    background-color: transparent;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 18px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, 10px);
    transition: opacity .22s ease, visibility .22s ease, transform .22s ease;
}

.at-main-menu nav > ul > .at-mega-menu-item:hover > .at-mega-menu,
.at-main-menu nav > ul > .at-mega-menu-item:focus-within > .at-mega-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate(-50%, 0);
}

.at-main-menu .at-mega-menu--width-boxed {
    max-width: min(900px, calc(100vw - 40px));
}

.at-main-menu .at-mega-menu--width-wide {
    max-width: min(1200px, calc(100vw - 40px));
}

.at-main-menu .at-mega-menu--width-full {
    width: calc(100vw - 32px);
    max-width: 1440px;
}

.at-mega-menu__inner {
    position: relative;
    z-index: 1;
    padding: clamp(24px, 3vw, 42px);
    color: var(--at-mega-menu-text, #1d1d1d);
    background-color: var(--at-mega-menu-background, #fff);
    border: 1px solid color-mix(in srgb, var(--at-mega-menu-text, #1d1d1d) 9%, transparent);
    border-radius: 18px;
    box-shadow: 0 24px 70px rgb(17 24 39 / 18%);
}

.at-mega-menu--has-image::before {
    position: absolute;
    z-index: 0;
    inset: 12px 0 0;
    content: "";
    background: var(--at-mega-menu-background, #fff);
    border-radius: 18px;
    opacity: .82;
}

.at-mega-menu--has-image .at-mega-menu__inner {
    background-color: transparent;
    backdrop-filter: blur(8px);
}

.at-mega-menu--glass .at-mega-menu__inner {
    background-color: color-mix(in srgb, var(--at-mega-menu-background, #fff) 86%, transparent);
    backdrop-filter: blur(18px);
}

.at-mega-menu__grid {
    display: grid;
    grid-template-columns: repeat(var(--at-mega-menu-columns, 4), minmax(0, 1fr));
    gap: clamp(20px, 3vw, 44px);
}

.at-mega-menu__column {
    min-width: 0;
}

.at-main-menu .at-mega-menu .at-mega-menu__heading,
.at-main-menu .at-mega-menu .at-mega-menu__links a {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    width: auto;
    padding: 0;
    color: var(--at-mega-menu-text, #1d1d1d);
    background: transparent;
    text-transform: none;
    white-space: normal;
}

.at-main-menu .at-mega-menu .at-mega-menu__heading {
    margin-bottom: 13px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
}

.at-main-menu .at-mega-menu .at-mega-menu__heading--standalone {
    padding: 10px 13px;
    border-radius: 10px;
}

.at-main-menu .at-mega-menu .at-mega-menu__heading:hover,
.at-main-menu .at-mega-menu .at-mega-menu__heading--standalone:hover,
.at-main-menu .at-mega-menu .at-mega-menu__links a:hover,
.at-main-menu .at-mega-menu a.active {
    color: var(--at-mega-menu-accent, #f0460e);
}

.at-main-menu .at-mega-menu ul.at-mega-menu__links {
    position: static;
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: auto;
    min-width: 0;
    margin: 0;
    padding: 0;
    overflow: visible;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    transform: none;
}

.at-main-menu .at-mega-menu__links li {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
}

.at-main-menu .at-mega-menu .at-mega-menu__links a {
    padding: 7px 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.45;
    opacity: .82;
    transition: color .18s ease, opacity .18s ease, transform .18s ease;
}

.at-main-menu .at-mega-menu .at-mega-menu__links a:hover {
    opacity: 1;
    transform: translateX(3px);
}

.at-mega-menu--brand .at-mega-menu__inner {
    border-color: color-mix(in srgb, var(--at-mega-menu-background, #f0460e) 65%, #fff);
}

@media (prefers-reduced-motion: reduce) {
    .at-main-menu nav > ul > .at-mega-menu-item > .at-mega-menu,
    .at-main-menu .at-mega-menu .at-mega-menu__links a {
        transition: none;
    }
}
