.mc-category-showcase-categories {
    --mc-cat-navy: #0b1426;
    --mc-cat-navy-2: #0f2346;
    --mc-cat-blue: #315f9c;
    --mc-cat-lime: #b6d400;
    --mc-cat-white: #ffffff;
    --mc-cat-card-w: clamp(248px, 21.5vw, 322px);
    --mc-cat-card-h: clamp(296px, 25vw, 364px);
    --mc-cat-gap: clamp(16px, 1.5vw, 24px);
    position: relative;
    isolation: isolate;
    overflow: hidden;
    margin-inline: 0;
    padding: clamp(58px, 5vw, 82px) 0 0;
    color: var(--mc-cat-white);
    background:
        radial-gradient(circle at 12% 14%, rgba(49,95,156,.42), transparent 27%),
        radial-gradient(circle at 84% 34%, rgba(182,212,0,.10), transparent 22%),
        linear-gradient(145deg, #0b1426 0%, #10264a 48%, #0b1426 100%);
}

.mc-category-showcase-categories::before,
.mc-category-showcase-categories::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: min(34vw, 520px);
    aspect-ratio: 1;
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 50%;
    pointer-events: none;
}
.mc-category-showcase-categories::before { left: -17vw; top: 2%; }
.mc-category-showcase-categories::after { right: -20vw; bottom: -38%; }

.mc-category-showcase-categories > .container,
.mc-category-showcase-categories .container {
    max-width: 1440px;
}

.mc-category-showcase-categories__header {
    width: min(100% - 40px, 1380px);
    margin: 0 auto clamp(44px, 4.5vw, 66px);
    text-align: center;
}

.mc-category-showcase-categories__kicker {
    display: block;
    margin-bottom: 14px;
    color: rgba(255,255,255,.52);
    font-size: clamp(.66rem, .64vw, .78rem);
    font-weight: 800;
    letter-spacing: .36em;
    text-transform: uppercase;
}

.mc-category-showcase-categories__title {
    margin: 0 auto;
    max-width: 1050px;
    color: #fff;
    font-size: clamp(3rem, 5.6vw, 6rem);
    font-weight: 400;
    line-height: .96;
    letter-spacing: -.045em;
    text-wrap: balance;
}

.mc-category-showcase-categories__nav {
    position: absolute;
    z-index: 8;
    inset: 50% clamp(12px,2vw,30px) auto;
    display: flex;
    justify-content: space-between;
    pointer-events: none;
}

.mc-category-showcase-categories__arrow {
    width: 48px;
    height: 48px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 50%;
    color: #fff;
    background: rgba(7,18,37,.54);
    backdrop-filter: blur(8px);
    cursor: pointer;
    pointer-events: auto;
    transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.mc-category-showcase-categories__arrow:hover,
.mc-category-showcase-categories__arrow:focus-visible {
    transform: scale(1.05);
    border-color: rgba(182,212,0,.75);
    background: rgba(12,30,58,.92);
    outline: none;
}
.mc-category-showcase-categories__arrow[disabled] { opacity: .22; cursor: default; transform: none; }

.mc-category-showcase-categories__viewport {
    position: relative;
    width: 100%;
    min-height: calc(var(--mc-cat-card-h) + 38px);
    overflow: visible;
    touch-action: pan-y;
    user-select: none;
    cursor: grab;
}
.mc-category-showcase-categories__viewport.is-dragging { cursor: grabbing; }

.mc-category-showcase-categories__track {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center;
    gap: var(--mc-cat-gap) !important;
    width: max-content !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 16px 0 22px !important;
    transform: translate3d(var(--mc-cat-x, 0px),0,0);
    transition: transform 720ms cubic-bezier(.22,.82,.22,1);
    will-change: transform;
    scroll-snap-type: none !important;
    overflow: visible !important;
}
.mc-category-showcase-categories__track.is-dragging { transition: none; }

.mc-category-showcase-categories__item {
    flex: 0 0 var(--mc-cat-card-w);
    width: var(--mc-cat-card-w);
    display: grid;
    gap: 11px;
    align-content: end;
}
.mc-category-showcase-categories__item-label {
    min-height: 1.2em;
    padding-inline: 6px;
    overflow: hidden;
    color: rgba(255,255,255,.56);
    font-size: clamp(.62rem,.58vw,.74rem);
    font-weight: 800;
    letter-spacing: .27em;
    line-height: 1.2;
    text-align: center;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
    transition: color .35s ease, opacity .35s ease;
}
.mc-category-showcase-categories__item.is-active .mc-category-showcase-categories__item-label { color: rgba(255,255,255,.88); }

.mc-category-showcase-categories .mc-category-showcase-card {
    position: relative !important;
    box-sizing: border-box;
    flex: 0 0 var(--mc-cat-card-w) !important;
    width: var(--mc-cat-card-w) !important;
    min-width: var(--mc-cat-card-w) !important;
    height: var(--mc-cat-card-h) !important;
    min-height: var(--mc-cat-card-h) !important;
    display: block !important;
    overflow: hidden !important;
    padding: clamp(18px, 1.8vw, 28px) !important;
    border: 1px solid rgba(255,255,255,.09) !important;
    border-radius: clamp(22px, 2vw, 34px) !important;
    color: #fff !important;
    background: linear-gradient(148deg, rgba(24,52,95,.98), rgba(12,28,54,.98)) !important;
    box-shadow: 0 24px 60px rgba(0,0,0,.19) !important;
    text-decoration: none !important;
    transform: scale(.90) translateY(10px);
    transform-origin: center center;
    opacity: .67;
    transition:
        transform 720ms cubic-bezier(.22,.82,.22,1),
        opacity 520ms ease,
        border-color 520ms ease,
        box-shadow 520ms ease;
    scroll-snap-align: none !important;
}
.mc-category-showcase-categories .mc-category-showcase-card.is-near { opacity: .87; transform: scale(.955) translateY(4px); }
.mc-category-showcase-categories .mc-category-showcase-card.is-active {
    z-index: 4;
    opacity: 1;
    transform: scale(1.075) translateY(-4px);
    border-color: rgba(182,212,0,.38) !important;
    box-shadow: 0 30px 75px rgba(0,0,0,.30) !important;
}
.mc-category-showcase-categories .mc-category-showcase-card:focus-visible {
    outline: 3px solid rgba(182,212,0,.9) !important;
    outline-offset: 5px;
}

.mc-category-showcase-categories .mc-category-showcase-card .mc-category-showcase-orb {
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 54%;
    width: min(76%, 220px);
    aspect-ratio: 1;
    border-radius: 50%;
    transform: translate(-50%,-50%);
    background:
        radial-gradient(circle at 32% 28%, rgba(255,255,255,.24), transparent 18%),
        var(--mc-cat-lime);
    box-shadow: inset 0 -18px 38px rgba(65,82,0,.14);
    transition: transform 720ms cubic-bezier(.22,.82,.22,1);
}
.mc-category-showcase-categories .mc-category-showcase-card.is-active .mc-category-showcase-orb { transform: translate(-50%,-50%) scale(1.08); }

.mc-category-showcase-categories .mc-category-showcase-card .mc-category-showcase-product {
    position: absolute !important;
    z-index: 2 !important;
    left: 50% !important;
    top: 51% !important;
    width: 72% !important;
    height: 64% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    object-fit: contain !important;
    transform: translate(-50%,-50%) rotate(-2deg) !important;
    filter: drop-shadow(0 18px 15px rgba(0,0,0,.34));
    transition: transform 720ms cubic-bezier(.22,.82,.22,1), filter 520ms ease;
    pointer-events: none;
}
.mc-category-showcase-categories .mc-category-showcase-card.is-active .mc-category-showcase-product {
    transform: translate(-50%,-53%) rotate(-1deg) scale(1.07) !important;
    filter: drop-shadow(0 24px 18px rgba(0,0,0,.38));
}

.mc-category-showcase-categories .mc-category-showcase-card .mc-category-showcase-card-meta {
    position: absolute;
    z-index: 3;
    right: clamp(18px,1.7vw,26px);
    bottom: clamp(16px,1.4vw,23px);
    padding: 5px 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.78);
    background: rgba(4,12,25,.62);
    font-size: .60rem;
    font-weight: 800;
    letter-spacing: .10em;
    text-transform: uppercase;
}

.mc-category-showcase-categories .mc-category-showcase-card > :not(.mc-category-showcase-orb):not(.mc-category-showcase-card-name):not(.mc-category-showcase-card-meta):not(.mc-category-showcase-product),
.mc-category-showcase-categories .mc-category-showcase-card .mc-category-showcase-original-content {
    visibility: hidden !important;
}
.mc-category-showcase-categories .mc-category-showcase-card .mc-category-showcase-product { visibility: visible !important; }

.mc-category-showcase-categories__footer {
    width: 100%;
    margin-top: clamp(22px,2.4vw,36px);
}
.mc-category-showcase-categories__collection {
    min-height: 70px;
    display: grid;
    place-items: start center;
    padding: 8px 20px 30px;
}
.mc-category-showcase-categories__cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--mc-cat-lime) !important;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-decoration: none !important;
    text-transform: uppercase;
    white-space: nowrap;
    transition: gap .2s ease, color .2s ease;
}
.mc-category-showcase-categories__cta:hover,
.mc-category-showcase-categories__cta:focus-visible { gap: 16px; color: #fff !important; outline: none; }
.mc-category-showcase-categories__active-strip {
    min-height: clamp(132px,14vw,205px);
    display: grid;
    place-items: center;
    align-content: center;
    gap: clamp(12px,1.5vw,20px);
    padding: clamp(25px,3vw,42px) 18px clamp(30px,3.2vw,48px);
    border-top: 1px solid rgba(255,255,255,.06);
    background: linear-gradient(180deg,rgba(14,43,81,.78),rgba(10,31,61,.96));
}
.mc-category-showcase-categories__counter {
    color: rgba(255,255,255,.48);
    font-size: .72rem;
    font-variant-numeric: tabular-nums;
    letter-spacing: .16em;
    white-space: nowrap;
}
.mc-category-showcase-categories__active-name {
    max-width: calc(100vw - 34px);
    overflow: hidden;
    color: #fff;
    font-size: clamp(2.1rem,5.8vw,5.2rem);
    font-weight: 300;
    line-height: .92;
    letter-spacing: .17em;
    text-align: center;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.mc-category-showcase-categories.is-showcase-enhanced > .mc-category-showcase-original { display: none !important; }
.mc-category-showcase-categories .mc-category-showcase-hide-original { display: none !important; }

@media (max-width: 1100px) {
    .mc-category-showcase-categories {
        --mc-cat-card-w: clamp(218px, 28vw, 274px);
        --mc-cat-card-h: clamp(282px, 35vw, 338px);
        --mc-cat-gap: 22px;
    }
    .mc-category-showcase-categories__title { font-size: clamp(2.7rem, 7.2vw, 5rem); }
    .mc-category-showcase-categories__active-name { font-size: clamp(2rem, 8.5vw, 5.4rem); }
}

@media (max-width: 760px) {
    .mc-category-showcase-categories {
        --mc-cat-card-w: min(72vw, 276px);
        --mc-cat-card-h: min(92vw, 348px);
        --mc-cat-gap: 16px;
        padding: 50px 0 52px;
    }
    .mc-category-showcase-categories__header { width: min(100% - 30px, 1380px); margin-bottom: 34px; }
    .mc-category-showcase-categories__title {
        max-width: 12ch;
        font-size: clamp(2.45rem, 12vw, 4.2rem);
        line-height: .92;
    }
    .mc-category-showcase-categories__nav { display: flex; inset: 50% 8px auto; }
    .mc-category-showcase-categories__arrow { width: 44px; height: 44px; }
    .mc-category-showcase-categories__viewport { min-height: calc(var(--mc-cat-card-h) + 30px); }
    .mc-category-showcase-categories .mc-category-showcase-card { transform: scale(.91); opacity: .62; }
    .mc-category-showcase-categories .mc-category-showcase-card.is-near { transform: scale(.95); opacity: .82; }
    .mc-category-showcase-categories .mc-category-showcase-card.is-active { transform: scale(1) translateY(-2px); }
    .mc-category-showcase-categories__footer { margin-top: 22px; }
    .mc-category-showcase-categories__active-strip { min-height: 128px; }
    .mc-category-showcase-categories__active-name { font-size: clamp(1.85rem, 9.2vw, 3.3rem); letter-spacing: .10em; }
    .mc-category-showcase-categories__cta { font-size: .69rem; }
}

@media (max-width: 430px) {
    .mc-category-showcase-categories {
        --mc-cat-card-w: min(74vw, 265px);
        --mc-cat-card-h: min(96vw, 332px);
        --mc-cat-gap: 13px;
    }
    .mc-category-showcase-categories__header { width: calc(100% - 26px); }
    .mc-category-showcase-categories__title { font-size: clamp(2.25rem, 12.4vw, 3.35rem); }
    .mc-category-showcase-categories__active-name { font-size: clamp(1.7rem, 8.8vw, 2.7rem); }
}

@media (min-width: 1600px) {
    .mc-category-showcase-categories {
        --mc-cat-card-w: 324px;
        --mc-cat-card-h: 370px;
        --mc-cat-gap: 24px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mc-category-showcase-categories__track,
    .mc-category-showcase-categories .mc-category-showcase-card,
    .mc-category-showcase-categories .mc-category-showcase-orb,
    .mc-category-showcase-categories .mc-category-showcase-product,
    .mc-category-showcase-categories__arrow,
    .mc-category-showcase-categories__cta { transition-duration: .01ms !important; }
}
