﻿/* Avelle storefront coherence layer â€” kept last in the asset graph on purpose. */
:root {
    --avelle-primary: #DB1215;
    --avelle-secondary: var(--secondary-color, var(--avl-muted));
}

/* Unconditional safety contract: legacy menu rules must not reflow the classic bar. */
#tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic {
    position: fixed !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 2147483000 !important;
    overflow: visible !important;
}

/* Bottom navigation is a deliberate post-viewport affordance: keep it out of
   the first screen on mobile/tablet and expose it after one viewport of scroll. */
@media (max-width: 991.98px) {
    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal] {
        transition: opacity .18s ease, transform .18s ease;
    }

    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal][hidden] {
        display: none !important;
    }
}

/* Tablet landscape is still a compact storefront viewport for the Core
   bottom-menu contract; desktop starts at 1200px for this theme. */
@media (min-width: 992px) and (max-width: 1199.98px) {
    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal] {
        position: fixed !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        z-index: 2147483000 !important;
        display: flex !important;
        justify-content: center;
        padding: 10px max(16px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)) !important;
        background: transparent !important;
        border: 0 !important;
        overflow: visible !important;
    }

    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal].shoper-mobile-bottom-menu--floating {
        right: 18px !important;
        bottom: 18px !important;
        left: 18px !important;
        width: auto !important;
        padding: 6px 8px !important;
        border: 1px solid var(--avl-line) !important;
        border-radius: var(--avl-r-lg) !important;
        background: var(--avl-bg) !important;
        box-shadow: 0 10px 30px rgba(0, 0, 0, .12) !important;
    }

    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal].shoper-mobile-bottom-menu--classic .mobile-menu {
        width: 100%;
        max-width: 32rem;
        padding: 4px;
        background: var(--avl-bg) !important;
        border: 1px solid var(--avl-line) !important;
        border-radius: 8px !important;
        box-shadow: 0 8px 24px rgba(33, 37, 41, .12) !important;
    }

    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal].shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row {
        display: flex;
        align-items: stretch;
        justify-content: center;
        gap: 0;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal].shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row > .shoper-menu-item {
        flex: 1 1 20%;
        min-width: 0;
        max-width: 6.25rem;
        margin: 0;
        padding: 0 5px;
        box-sizing: border-box;
        text-align: center;
    }

    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal].shoper-mobile-bottom-menu--classic .tp-mobile-item-btn {
        display: inline-flex;
        width: 100%;
        min-height: 3.25rem;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        padding: 5px 2px;
        border: 0 !important;
        border-radius: 6px !important;
        background: transparent !important;
        color: var(--avl-muted) !important;
        font-size: 9px;
        font-weight: 600;
        line-height: 1.5;
        text-align: center;
        text-decoration: none;
        text-transform: uppercase;
    }

    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal].shoper-mobile-bottom-menu--classic .tp-mobile-item-btn > [class^="shoper-icon-"],
    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal].shoper-mobile-bottom-menu--classic .tp-mobile-item-btn > [class*=" shoper-icon-"] {
        width: auto;
        height: auto;
        font-size: 22px;
        line-height: 33px;
        color: currentColor !important;
    }

    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal].shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row > .shoper-menu-item.active > .tp-mobile-item-btn {
        background: var(--avl-bg) !important;
        color: var(--avl-muted) !important;
        box-shadow: 0 2px 3px -2px rgba(33, 37, 41, .18);
    }
}

@media (max-width: 991.98px) {
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic {
        display: flex !important;
    }

    body:not([data-customer-dashboard="true"]):has(#tp-bottom-menu-sticky) {
        padding-bottom: max(88px, calc(64px + env(safe-area-inset-bottom))) !important;
    }
}

@media (min-width: 992px) {
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic {
        display: none !important;
    }
}

/* Keep the post-viewport reveal authoritative over legacy display rules. */
@media (max-width: 1199.98px) {
    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal][hidden] {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

/* Header follow-up cascade: hero hover stays transparent; sticky scroll owns
   the white surface and dark contrast. Keep this after legacy inversion rules. */
html body:has(.avr-hero--functional) .avr-functional__curated-menu > li > a {
    text-transform: uppercase !important;
    letter-spacing: .02em;
}

@media (hover: hover) {
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-row,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main-grid,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-grid {
        color: var(--avl-bg) !important;
        background: transparent !important;
        border-color: rgba(255, 255, 255, .24) !important;
    }

    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main a,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main button,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main span,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main strong,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main small,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main svg,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-row a,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-row button,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-row svg {
        color: var(--avl-bg) !important;
        fill: none;
        stroke: currentColor;
    }

    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__brand img,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__brand svg {
        filter: brightness(0) invert(1) !important;
    }
}

html body:has(.avr-hero--functional) .avr-functional__main.sticky-active,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-functional__main-grid,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-functional__nav-grid {
    color: var(--avl-ink) !important;
    background: var(--avl-bg) !important;
    border-bottom-color: var(--avl-line) !important;
}

html body:has(.avr-hero--functional) .avr-functional__main.sticky-active a,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active button,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active span,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active strong,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active small,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active svg,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active i {
    color: var(--avl-ink) !important;
    fill: none;
    stroke: currentColor;
}

html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-functional__brand img,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-functional__brand svg {
    filter: none !important;
}

html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-torque-action__icon-link,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-torque-action__cart-icon,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .tp-header-search-wrapper:not(.is-expanded),
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-icon,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .tp-search-open-btn,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .cartmini-open-btn {
    color: var(--avl-ink) !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

/* Final tablet visibility contract: outrank legacy desktop hide rules while preserving the hidden initial state. */
@media (min-width: 992px) and (max-width: 1199.98px) {
    html body #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal].is-scroll-revealed[aria-hidden="false"]:not([hidden]) {
        display: flex !important;
    }

    html body #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal][hidden][aria-hidden="true"] {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

/* Final cascade: the post-viewport bottom-menu reveal must outrank legacy
   display rules that use !important. */
@media (max-width: 1199.98px) {
    #tp-bottom-menu-sticky[data-avelle-bottom-menu-scroll-reveal][hidden] {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

/* Functional hero campaign selector: the pill track replaces the numeric
   selector on every viewport, including the mobile navigation-style preset. */
html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__dots,
html body:has(.avr-hero--functional) .avr-hero--functional[data-navigation-style="numbers"] .avr-functional-hero__dots {
    display: flex !important;
    right: auto !important;
    left: 50% !important;
    bottom: 30px !important;
    padding: 0 !important;
    background: transparent !important;
    transform: translateX(-50%) !important;
}

html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__dots button {
    background: rgba(255, 255, 255, .4) !important;
    opacity: .4 !important;
}

html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__dots button[aria-selected="true"] {
        background: var(--avr-surface, var(--avl-bg)) !important;
    opacity: 1 !important;
}

html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__controls {
    display: none !important;
}

@media (max-width: 767.98px) {
    html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__dots {
        bottom: 96px !important;
        left: 50% !important;
    }

    html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__dots button {
        width: 14px !important;
        height: 5px !important;
    }

    html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__dots button[aria-selected="true"] {
        width: 28px !important;
    }
}

/* Header follow-up: hover stays transparent over the hero. The white
   conversion belongs to the sticky-on-scroll state, where the header leaves
   the hero and needs a stable high-contrast surface. */
html body:has(.avr-hero--functional) .avr-functional__curated-menu > li > a {
    text-transform: uppercase !important;
    letter-spacing: .02em;
}

@media (hover: hover) {
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__main,
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__nav-row,
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__main-grid,
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__nav-grid {
        color: var(--avl-bg) !important;
        background: transparent !important;
        border-color: rgba(255, 255, 255, .24) !important;
    }

    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__main a,
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__main button,
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__main span,
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__main strong,
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__main small,
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__main svg,
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__nav-row a,
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__nav-row button,
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__nav-row svg {
        color: var(--avl-bg) !important;
        fill: none;
        stroke: currentColor;
    }

    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__brand img,
    html body:has(.avr-hero--functional) .avr-header--functional:hover .avr-functional__brand svg {
        filter: brightness(0) invert(1) !important;
    }
}

html body:has(.avr-hero--functional) .avr-functional__main.sticky-active {
    color: var(--avl-ink) !important;
    background: var(--avl-bg) !important;
    border-bottom-color: var(--avl-line) !important;
}

html body:has(.avr-hero--functional) .avr-functional__main.sticky-active a,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active button,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active span,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active strong,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active small,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active svg {
    color: var(--avl-ink) !important;
    fill: none;
    stroke: currentColor;
}

html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-functional__brand img,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-functional__brand svg {
    filter: none !important;
}

html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-torque-action__icon-link,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-torque-action__cart-icon,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .tp-header-search-wrapper:not(.is-expanded),
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-icon,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .tp-search-open-btn,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .cartmini-open-btn {
    color: var(--avl-ink) !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

/* Functional header over the hero: keep the Nurfia-style separator visible
   at rest and invert the complete header surface when the visitor enters it. */
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__main {
    border-bottom: 1px solid rgba(255, 255, 255, .58) !important;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

@media (hover: hover) {
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-row,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main-grid,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-grid {
        color: var(--avl-ink) !important;
        background: var(--avl-bg) !important;
        border-color: var(--avl-line) !important;
    }

    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main a,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main button,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main span,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main strong,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main small,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main svg,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-row a,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-row button,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-row svg {
        color: var(--avl-ink) !important;
        fill: none;
        stroke: currentColor;
    }

    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__brand img,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__brand svg {
        filter: none !important;
    }

    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__search input,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__search .tp-search-input {
        color: var(--avl-ink) !important;
        background: rgba(0, 0, 0, .03) !important;
        border-color: var(--avl-line) !important;
    }

    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__search input::placeholder,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__search .tp-search-input::placeholder {
        color: var(--avl-muted) !important;
    }

    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-torque-action__icon-link,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-torque-action__cart-icon,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .tp-header-search-wrapper:not(.is-expanded),
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-icon,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .tp-search-open-btn,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .cartmini-open-btn {
        color: var(--avl-ink) !important;
        background: transparent !important;
        border-color: transparent !important;
        box-shadow: none !important;
    }
}

/* Mobile parity contract: Avelle uses the same icon header and category drawer
   interaction as Torque while retaining its own visual tokens. */
@media (max-width: 991.98px) {
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic {
        position: fixed !important;
        inset: auto 0 0 !important;
        z-index: 2147483000 !important;
        display: flex !important;
        justify-content: center;
        padding: 10px max(16px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)) !important;
        background: transparent !important;
        border: 0 !important;
        overflow: visible !important;
    }

    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .mobile-menu {
        width: 100%;
        max-width: 32rem;
        padding: 4px;
        background: var(--avl-bg) !important;
        border: 1px solid var(--avl-line) !important;
        border-radius: 8px !important;
        box-shadow: 0 8px 24px rgba(33, 37, 41, .12) !important;
    }

    .avr-mobile-header-actions {
        display: inline-flex !important;
        align-items: center;
        justify-content: flex-end;
        gap: 4px;
        margin-inline-start: auto;
    }

    .avr-mobile-header-action {
        position: relative;
        display: inline-flex;
        width: 40px;
        height: 40px;
        align-items: center;
        justify-content: center;
        color: var(--avl-ink);
        background: transparent;
        border: 0;
    }

    .avr-mobile-header-action > i {
        font-size: 21px;
        line-height: 1;
    }

    .avr-mobile-header-badge {
        position: absolute;
        top: 3px;
        right: 1px;
        min-width: 15px;
        height: 15px;
        padding: 0 4px;
        border-radius: 999px;
        background: var(--avr-ink);
        color: var(--avr-surface);
        font-size: 9px;
        line-height: 15px;
        text-align: center;
    }

    .avr-functional__search {
        display: none !important;
    }

    .offcanvas__area .avelle-mobile-drawer__section {
        margin: 0 0 28px;
    }

    .avelle-mobile-drawer__heading {
        margin: 0 0 12px;
        color: var(--avl-ink);
        font-size: 12px;
        font-weight: 700;
        letter-spacing: .12em;
        text-transform: uppercase;
    }

    .offcanvas__area .avelle-mobile-drawer__categories > nav > ul,
    .offcanvas__area .avelle-mobile-drawer__categories ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .offcanvas__area .avelle-mobile-drawer__categories > nav > ul > li {
        border-bottom: 1px solid var(--avl-line);
    }

    .offcanvas__area .avelle-mobile-drawer__categories a {
        display: flex;
        min-height: 42px;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        color: var(--avl-ink);
        font-size: 14px;
    }

    .offcanvas__area .avelle-mobile-drawer__categories li.has-dropdown {
        position: relative;
    }

    .offcanvas__area .avelle-mobile-drawer__categories li.has-dropdown > a {
        padding-inline-end: 42px;
    }

    .offcanvas__area .avelle-mobile-drawer__categories li.has-dropdown > ul {
        display: none;
    }

    .offcanvas__area .avelle-mobile-drawer__categories li.has-dropdown.is-expanded > ul {
        display: block;
    }

    .offcanvas__area .avelle-mobile-drawer__category-toggle {
        position: absolute;
        top: 5px;
        inset-inline-end: 0;
        display: inline-flex;
        width: 32px;
        height: 32px;
        align-items: center;
        justify-content: center;
        padding: 0;
        border: 0;
        background: transparent;
        color: var(--avl-ink);
    }

    .offcanvas__area .avelle-mobile-drawer__category-toggle .avelle-icon {
        width: 12px;
        height: 12px;
        font-size: 12px;
        transition: transform .2s ease;
    }

    .offcanvas__area .avelle-mobile-drawer__category-toggle[aria-expanded="true"] .avelle-icon {
        transform: rotate(90deg);
    }

    .offcanvas__area .avelle-mobile-drawer__categories .tp-submenu {
        padding-inline-start: 16px;
    }

    .offcanvas__area .avelle-mobile-drawer__section .tp-main-menu-mobile {
        display: block !important;
        min-height: 0;
        margin: 0 !important;
    }
}

/* Issue #41: one accessible, aligned expand control per mobile menu parent. */
@media (max-width: 767.98px) {
    .tp-main-menu-mobile .has-dropdown > a,
    .tp-main-menu-mobile .has-mega-menu > a {
        padding-right: 64px !important;
    }

    .tp-main-menu-mobile ul li.has-dropdown > .dropdown-toggle-btn,
    .tp-main-menu-mobile ul li.has-mega-menu > .dropdown-toggle-btn {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
        position: absolute;
        z-index: 2;
        top: 4px;
        right: 20px;
        border: 0 !important;
        border-radius: var(--avl-r-control, 6px) !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: var(--avl-ink, var(--tp-heading-primary)) !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .tp-main-menu-mobile .dropdown-toggle-btn > [data-avelle-icon="chevron-down"] {
        width: 18px;
        height: 18px;
        margin: 0;
        transform: rotate(-90deg) !important;
        transition: transform .2s ease, color .2s ease;
    }

    .tp-main-menu-mobile .dropdown-toggle-btn.dropdown-opened > [data-avelle-icon="chevron-down"] {
        transform: rotate(0deg) !important;
    }

    .tp-main-menu-mobile .dropdown-toggle-btn:hover,
    .tp-main-menu-mobile .dropdown-toggle-btn:focus-visible,
    .tp-main-menu-mobile .dropdown-toggle-btn.dropdown-opened {
        color: var(--avl-primary, var(--tp-theme-primary)) !important;
        background: color-mix(in srgb, var(--avl-primary, var(--tp-theme-primary)) 9%, transparent) !important;
        outline: 0;
    }
}

@media (max-width: 991.98px) {
    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] [data-avelle-pdp-surface="ecomus"] > .avelle-product-detail__media-column,
    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] [data-avelle-pdp-surface="ecomus"] > .avelle-product-detail__info-column {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] .avelle-product-detail__summary-column {
        max-width: none;
        position: static;
    }
}

.tp-header-sticky.sticky-active,
.avelle-header,
.avelle-commerce-header {
    --avh-accent: var(--avelle-primary);
}

.tp-header-sticky .tp-header-action-badge,
.avelle-header__actions .tp-header-action-badge,
.avelle-commerce-product-card .avelle-recommended-product__discount,
.avelle-recommended-product__discount,
.avelle-discovery-product__discount,
.tp-product-badge .product-sale,
.tp-product-badge-3 .product-sale {
    background: var(--avl-sale) !important;
    border-color: var(--avl-sale) !important;
    color: var(--avl-bg) !important;
}

.tp-header-sticky a:hover,
.tp-header-sticky button:hover {
    color: var(--avelle-primary);
}

/* A2 campaign stage: premium vertical presence and one owner-selected control language. */
.avr-hero--campaign .avr-campaign-hero__viewport {
    height: clamp(720px, 47vw, 820px);
    min-height: 720px;
}

.avr-functional-hero__campaign {
    height: clamp(720px, 47vw, 820px);
    min-height: 720px;
}

.avr-functional-hero__media img {
    object-position: var(--avr-functional-desktop-position, center top);
}

.avr-functional-hero__controls {
    bottom: 22px;
}

.avelle-commerce-service-carousel { padding: 20px 0 18px !important; background: var(--avl-bg); border-bottom: 1px solid var(--avl-line); }
/* Editorial benefits strip: Avelle font and Phosphor icons, with Nurfia-like rhythm. */
.avelle-commerce-service-carousel .container {
    width: min(1540px, calc(100% - 64px));
    max-width: none;
    padding-inline: 0;
}

.avelle-commerce-service-carousel__track {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: stretch;
    column-gap: clamp(28px, 4vw, 78px);
}

.avelle-commerce-service-carousel__item { 
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: start;
    gap: 16px;
    min-height: 72px;
    padding: 0;
}
.avelle-commerce-service-carousel__item + .avelle-commerce-service-carousel__item { border-left: 0; }
.avelle-commerce-service-carousel__viewport { overflow: hidden; border: 0; border-radius: 0; background: transparent; }
.avelle-commerce-service-carousel__icon { width: 40px; height: 40px; color: var(--avl-muted); }
.avelle-commerce-service-carousel__icon svg { width: 36px; height: 36px; stroke-width: 1.45; }
.avelle-commerce-service-carousel__icon .avelle-icon { display: block; width: auto; height: auto; font-size: 36px; line-height: 1; }
.avelle-commerce-service-carousel__copy { gap: 6px; }
.avelle-commerce-service-carousel__copy strong { font-size: 15px; font-weight: 650; line-height: 1.2; text-transform: none; }
.avelle-commerce-service-carousel__copy span { font-size: 13px; line-height: 1.35; color: var(--avl-muted); }
@media (min-width: 1200px) {
    .avelle-commerce-service-carousel .container { width: min(1540px, calc(100% - 100px)); }
    .avelle-commerce-service-carousel[data-carousel-desktop="true"] .avelle-commerce-service-carousel__viewport { overflow-x: auto; scrollbar-width: none; }
    .avelle-commerce-service-carousel[data-carousel-desktop="true"] .avelle-commerce-service-carousel__viewport::-webkit-scrollbar { display: none; }
    .avelle-commerce-service-carousel[data-carousel-desktop="true"] .avelle-commerce-service-carousel__track { grid-template-columns: repeat(4, minmax(0, 320px)); width: max-content; }
}

@media (min-width: 1600px) {
    .avelle-commerce-service-carousel__track { padding-inline: 50px; }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .avelle-commerce-service-carousel__viewport { overflow-x: auto; scrollbar-width: none; }
    .avelle-commerce-service-carousel__viewport::-webkit-scrollbar { display: none; }
    .avelle-commerce-service-carousel__track { display: flex; width: max-content; gap: 28px; }
    .avelle-commerce-service-carousel__item { flex: 0 0 calc((100vw - 96px) / 2); width: calc((100vw - 96px) / 2); scroll-snap-align: start; }
}

.avr-hero--campaign[data-navigation-style="numbers"] .avr-campaign-hero__dots,
.avr-hero--campaign[data-navigation-style="dots"] .avr-campaign-hero__controls {
    display: none !important;
}

/* The mobile projection contains the same six configured banners as desktop. */
.avelle-fashion6-banner-mosaic__mobile {
    display: none;
}

/* New journal â€” editorial cards, no inherited Multikart ornament. */
.avelle-fashion6-blog {
    padding: clamp(56px, 6vw, 96px) 0;
}

.avelle-fashion6-blog > .container {
    width: min(1824px, calc(100% - clamp(16px, 4.2vw, 80px)));
    max-width: none;
    padding: 0;
}

.avelle-fashion6-blog__heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 32px;
}

.avelle-fashion6-blog__heading span {
    color: var(--avl-accent);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.avelle-fashion6-blog__heading h2 {
    margin: 8px 0 0;
    color: var(--avl-ink);
    font-size: clamp(38px, 4vw, 64px);
    font-weight: 500;
    letter-spacing: -.045em;
    line-height: 1;
}

.avelle-fashion6-blog__heading > a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 5px;
    border-bottom: 1px solid currentColor;
    color: var(--avl-ink);
    font-size: 13px;
    font-weight: 650;
}

.avelle-fashion6-blog__grid {
    overflow: hidden;
}

.avelle-journal-card {
    height: auto;
}

.avelle-fashion6-blog .avelle-journal-card--latest {
    overflow: visible;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent;
}

.avelle-journal-card__media {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: var(--avl-r-lg, 18px);
    background: var(--avl-surface);
}

.avelle-journal-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .55s var(--avl-ease, ease);
}

.avelle-journal-card:hover .avelle-journal-card__media img {
    transform: scale(1.025);
}

.avelle-journal-card__body {
    padding: 18px 2px 0;
}

.avelle-journal-card__body time {
    color: var(--avl-accent);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.avelle-journal-card__body h3 {
    margin: 8px 0 10px;
    color: var(--avl-ink);
    font-size: clamp(19px, 1.6vw, 25px);
    font-weight: 600;
    letter-spacing: -.025em;
    line-height: 1.18;
}

.avelle-journal-card__body p {
    margin: 0;
    color: var(--avl-muted);
    font-size: 13px;
}

/* Newsletter field and CTA are intentionally separate controls. */
.avelle-newsletter__form-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    min-height: 0;
    border: 0;
    background: transparent;
}

.avelle-newsletter__form input[type="email"] {
    height: 58px;
    border: 1px solid var(--avl-line) !important;
    border-radius: var(--avl-r, 12px) !important;
    background: var(--avl-bg);
}

.avelle-newsletter__submit {
    min-height: 58px;
    border-radius: var(--avl-r, 12px) !important;
    padding-inline: 28px;
}

.newsletter-popup {
    --newsletter-popup-primary: var(--avelle-primary) !important;
}

.newsletter-popup .btn-primary,
.newsletter-popup button[type="submit"] {
    border-color: var(--avelle-primary) !important;
    background: var(--avelle-primary) !important;
}

/* Upcoming drops use one full-width editorial stage; tier and consent stay explicit. */
.avelle-upcoming-drops > .container {
    width: min(1824px, calc(100% - clamp(16px, 4.2vw, 80px)));
    max-width: none;
    padding-inline: 0;
}

.avelle-upcoming-drops__rail,
.avelle-upcoming-drops__rail--1,
.avelle-upcoming-drops__rail--2,
.avelle-upcoming-drops__rail--3 {
    grid-template-columns: minmax(0, 1fr);
}

.avelle-upcoming-drop__surface {
    min-height: clamp(540px, 46vw, 760px);
}

.avelle-upcoming-drop__image {
    object-position: center top;
}

.avelle-upcoming-drops__rail--1 .avelle-upcoming-drop__content h3,
.avelle-upcoming-drop__content h3 {
    max-width: none;
    font-size: clamp(17px, 3vw, 3.65rem);
    white-space: nowrap;
}

.avelle-upcoming-drops[data-viewer-access="vip"] .avelle-upcoming-drop__status > span {
    border-color: color-mix(in srgb, #e7c98e 72%, transparent);
    background: rgba(62, 42, 12, .52);
    color: #fff2c9;
}

.avelle-upcoming-drops[data-viewer-access="early_access"] .avelle-upcoming-drop__status > span {
    border-color: color-mix(in srgb, var(--avelle-primary) 72%, transparent);
    background: color-mix(in srgb, var(--avelle-primary) 42%, rgba(15, 14, 13, .42));
}

button.avelle-upcoming-drop__icon {
    border: 0;
    cursor: pointer;
}

.avelle-upcoming-drop__unlock {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-left: auto;
    padding: 7px 7px 7px 15px;
    border: 1px solid rgba(255, 255, 255, .38);
    border-radius: var(--avl-r, 12px);
    background: rgba(12, 11, 10, .58);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .16);
    color: var(--avl-bg);
    backdrop-filter: blur(12px);
    isolation: isolate;
    transition: background .2s ease, box-shadow .2s ease, transform .2s ease;
}

.avelle-upcoming-drop__unlock:hover,
.avelle-upcoming-drop__unlock:focus-visible {
    background: rgba(12, 11, 10, .82);
    box-shadow: 0 14px 32px rgba(0, 0, 0, .24);
    color: var(--avl-bg);
    transform: translateY(-2px);
}

.avelle-upcoming-drop__unlock-copy {
    display: grid;
    gap: 3px;
    line-height: 1;
    text-align: right;
}

.avelle-upcoming-drop__unlock-copy strong {
    color: var(--avl-bg);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.avelle-upcoming-drop__unlock-copy small {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
    color: color-mix(in srgb, var(--avelle-primary) 48%, var(--avl-bg));
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .01em;
    text-transform: none;
}

.avelle-upcoming-drop__unlock-copy small span {
    display: inline-block;
    animation: avelle-unlock-arrow 1.35s ease-in-out infinite;
}

.avelle-upcoming-drop__unlock .avelle-upcoming-drop__icon {
    position: relative;
    flex-basis: 3rem;
    width: 3rem;
    height: 3rem;
    background: var(--avl-bg);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--avelle-primary) 32%, transparent);
}

.avelle-upcoming-drop__unlock .avelle-upcoming-drop__icon::before {
    position: absolute;
    inset: -7px;
    border: 2px solid color-mix(in srgb, var(--avelle-primary) 70%, var(--avl-bg));
    border-radius: inherit;
    content: "";
    pointer-events: none;
    animation: avelle-unlock-pulse 1.65s ease-out infinite;
}

.avelle-upcoming-drop__unlock .avelle-upcoming-drop__icon .avelle-icon {
    animation: avelle-unlock-nudge 3.2s ease-in-out infinite;
}

@keyframes avelle-unlock-pulse {
    0% { opacity: .9; transform: scale(.86); }
    70%, 100% { opacity: 0; transform: scale(1.25); }
}

@keyframes avelle-unlock-arrow {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(4px); }
}

@keyframes avelle-unlock-nudge {
    0%, 68%, 100% { transform: rotate(0) scale(1); }
    74% { transform: rotate(-8deg) scale(1.12); }
    80% { transform: rotate(7deg) scale(1.12); }
    86% { transform: rotate(0) scale(1); }
}

/* Public, data-driven explanation of the existing order-3/order-5 membership journey. */
.avelle-access-program {
    width: min(1824px, calc(100% - clamp(16px, 4.2vw, 80px)));
    margin: 0 auto;
    padding: clamp(48px, 6vw, 96px) 0;
    color: var(--avl-ink, var(--avl-ink));
}

.avelle-access-program__hero {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(300px, .7fr);
    gap: clamp(24px, 4vw, 72px);
    padding: clamp(30px, 5vw, 88px);
    overflow: hidden;
    border-radius: var(--avl-r-lg, 18px);
    background:
        radial-gradient(circle at 86% 12%, color-mix(in srgb, var(--avelle-primary) 24%, transparent), transparent 34%),
        linear-gradient(125deg, #171513, #29231f 72%, #3b2b23);
    color: var(--avl-bg);
}

.avelle-access-program__intro > span,
.avelle-access-program__journey header > span,
.avelle-access-program__levels article > span {
    color: var(--avelle-primary);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.avelle-access-program__intro h1 {
    max-width: 11ch;
    margin: 14px 0 20px;
    color: var(--avl-bg);
    font-size: clamp(44px, 6vw, 100px);
    font-weight: 500;
    letter-spacing: -.06em;
    line-height: .9;
}

.avelle-access-program__intro p {
    max-width: 62ch;
    margin: 0;
    color: rgba(255, 255, 255, .72);
    font-size: clamp(14px, 1.25vw, 18px);
    line-height: 1.65;
}

.avelle-access-program__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 30px;
}

.avelle-access-program__actions a {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding: 0 22px;
    border: 1px solid rgba(255, 255, 255, .34);
    border-radius: var(--avl-r, 12px);
    color: var(--avl-bg);
    font-size: 13px;
    font-weight: 700;
}

.avelle-access-program__actions a.is-primary {
    border-color: var(--avelle-primary);
    background: var(--avelle-primary);
}

.avelle-access-program__status {
    align-self: end;
    padding: 24px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: var(--avl-r-lg, 18px);
    background: rgba(255, 255, 255, .08);
    backdrop-filter: blur(12px);
}

.avelle-access-program__status > span {
    color: rgba(255, 255, 255, .6);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.avelle-access-program__status strong {
    display: block;
    margin: 8px 0 12px;
    color: var(--avl-bg);
    font-size: clamp(28px, 3vw, 48px);
    font-weight: 500;
}

.avelle-access-program__status p {
    margin: 0 0 14px;
    color: rgba(255, 255, 255, .72);
    font-size: 13px;
    line-height: 1.5;
}

.avelle-access-program__status [role="progressbar"] {
    height: 5px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, .18);
}

.avelle-access-program__status [role="progressbar"] span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--avelle-primary);
}

.avelle-access-program__levels {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 16px;
}

.avelle-access-program__levels article {
    padding: clamp(26px, 4vw, 54px);
    border: 1px solid var(--avl-line, #e6e1dc);
    border-radius: var(--avl-r-lg, 18px);
    background: var(--avl-bg, var(--avl-bg));
}

.avelle-access-program__levels article.is-vip {
    background: color-mix(in srgb, var(--avelle-primary) 7%, var(--avl-bg));
}

.avelle-access-program__levels h2 {
    margin: 12px 0 8px;
    font-size: clamp(34px, 4vw, 64px);
    font-weight: 500;
    letter-spacing: -.05em;
}

.avelle-access-program__levels article > strong {
    color: var(--avelle-primary);
    font-size: 14px;
}

.avelle-access-program__levels p {
    max-width: 58ch;
    margin: 18px 0;
    color: var(--avl-muted, #6f6a66);
    line-height: 1.65;
}

.avelle-access-program__levels ul {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.avelle-access-program__levels li::before {
    margin-right: 9px;
    color: var(--avelle-primary);
    content: "âœ“";
    font-weight: 800;
}

.avelle-access-program__journey {
    display: grid;
    grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr);
    gap: clamp(28px, 5vw, 80px);
    margin-top: clamp(52px, 7vw, 100px);
}

.avelle-access-program__journey h2 {
    margin: 12px 0 18px;
    font-size: clamp(34px, 4vw, 64px);
    font-weight: 500;
    letter-spacing: -.05em;
    line-height: .98;
}

.avelle-access-program__journey header p {
    margin: 0;
    color: var(--avl-muted, #6f6a66);
    line-height: 1.65;
}

.avelle-access-program__journey ol {
    display: grid;
    margin: 0;
    padding: 0;
    list-style: none;
}

.avelle-access-program__journey ol > li {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: start;
    gap: 18px;
    padding: 22px 0;
    border-bottom: 1px solid var(--avl-line, #e6e1dc);
}

.avelle-access-program__journey ol > li > span {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid var(--avl-line, #e6e1dc);
    border-radius: var(--avl-r, 12px);
    font-size: 12px;
    font-weight: 800;
}

.avelle-access-program__journey ol > li.is-reached > span {
    border-color: var(--avelle-primary);
    background: var(--avelle-primary);
    color: var(--avl-bg);
}

.avelle-access-program__threshold-copy > small {
    display: block;
    margin-top: 5px;
    color: var(--avl-muted, #6f6a66);
    line-height: 1.5;
}

.avelle-access-program__threshold-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.avelle-access-program__threshold-heading strong {
    font-size: 16px;
}

.avelle-access-program__threshold-heading em {
    padding: 5px 9px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--avelle-primary) 12%, var(--avl-bg));
    color: var(--avelle-primary);
    font-size: 10px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.avelle-access-program__threshold-perks {
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

.avelle-access-program__threshold-perks > div {
    display: grid;
    grid-template-columns: minmax(150px, .62fr) minmax(0, 1.38fr);
    gap: 18px;
    padding-top: 10px;
    border-top: 1px solid color-mix(in srgb, var(--avl-line, #e6e1dc) 72%, transparent);
}

.avelle-access-program__threshold-perks b,
.avelle-access-program__threshold-perks span {
    font-size: 13px;
    line-height: 1.5;
}

.avelle-access-program__threshold-perks b {
    font-weight: 700;
}

.avelle-access-program__threshold-perks span {
    color: var(--avl-muted, #6f6a66);
}

@media (min-width: 1200px) {
    .avelle-access-program__journey {
        grid-template-columns: minmax(280px, .55fr) minmax(0, 1.45fr);
    }

    .avelle-access-program__journey ol {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: clamp(24px, 2.2vw, 40px);
    }

    .avelle-access-program__journey ol > li:last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }

    .avelle-access-program__threshold-perks > div {
        grid-template-columns: minmax(0, 1fr);
        gap: 3px;
    }

    .avelle-access-program__journey ol > li:last-child:nth-child(odd) .avelle-access-program__threshold-perks {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: clamp(24px, 2.2vw, 40px);
    }
}

.avelle-upcoming-drop__consent {
    position: absolute;
    z-index: 4;
    right: 50%;
    bottom: 28px;
    width: min(520px, calc(100% - 40px));
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: var(--avl-r, 12px);
    background: rgba(12, 11, 10, .82);
    box-shadow: 0 18px 45px rgba(0, 0, 0, .2);
    text-align: center;
    transform: translateX(50%);
    backdrop-filter: blur(14px);
}

.avelle-upcoming-drop__consent[hidden] {
    display: none;
}

.avelle-upcoming-drop__consent p {
    margin: 0 0 12px;
    color: var(--avl-bg);
    font-size: 14px;
}

.avelle-upcoming-drop__consent > div {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.avelle-upcoming-drop__consent button {
    min-height: 42px;
    padding: 0 18px;
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: var(--avl-r, 12px);
    background: var(--avl-bg);
    color: var(--avl-ink);
    font-size: 12px;
    font-weight: 700;
}

.avelle-upcoming-drop__consent button[value="decline"] {
    background: transparent;
    color: var(--avl-bg);
}

.avelle-upcoming-drop__consent > span {
    display: block;
    min-height: 18px;
    margin-top: 8px;
    color: rgba(255, 255, 255, .84);
    font-size: 11px;
}

.avelle-upcoming-drop__surface,
.avelle-upcoming-drop__surface:hover,
.avelle-upcoming-drop__content h3,
.avelle-upcoming-drop__status > span,
.avelle-upcoming-drop__status time,
.avelle-upcoming-drop__footer > span:first-child {
    color: var(--avl-bg);
}

/* Footer: brand + four functional groups + a dedicated policy group. */
.avelle-fashion6-footer__grid {
    grid-template-columns: minmax(240px, 1.45fr) repeat(4, minmax(120px, 1fr));
    gap: clamp(28px, 3vw, 52px);
}

.avelle-fashion6-footer__policies {
    grid-column: 2 / -1;
}

.avelle-fashion6-footer__policies ul {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px 24px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.avelle-fashion6-footer__policies a {
    color: rgb(255 255 255 / 82%);
    font-size: 14px;
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .avr-hero--campaign .avr-campaign-hero__viewport {
        height: 720px;
        min-height: 720px;
    }

    .avr-functional-hero__campaign {
        height: 720px;
        min-height: 720px;
    }

    .avelle-fashion6-footer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .avelle-fashion6-footer__brand,
    .avelle-fashion6-footer__policies {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    /* A2: image-led mobile stage, kept inside the first viewport with a usable CTA. */
    .avr-hero--campaign .avr-campaign-hero__slide.is-active {
        grid-template-rows: minmax(400px, 106vw) auto;
    }

    .avr-hero--campaign .avr-campaign-hero__copy {
        min-height: 204px;
        padding: 24px 22px 28px;
    }

    .avr-hero--campaign .avr-campaign-hero__copy h1,
    .avr-hero--campaign .avr-campaign-hero__copy h2 {
        font-size: clamp(31px, 8.7vw, 38px);
    }

    .avr-hero--campaign .avr-campaign-hero__controls {
        right: 14px;
        bottom: 246px;
        display: flex !important;
    }

    .avr-hero--campaign[data-navigation-style="dots"] .avr-campaign-hero__controls {
        display: none !important;
    }

    .avr-hero--campaign .avr-campaign-hero__dots {
        top: max(400px, 106vw);
    }

    .avr-functional-hero__campaign {
        height: clamp(540px, 145vw, 620px);
        min-height: 540px;
    }

    .avr-hero--functional[data-navigation-style="numbers"] .avr-functional-hero__dots,
    .avr-hero--functional[data-navigation-style="dots"] .avr-functional-hero__controls {
        display: none !important;
    }

    .avr-hero--functional .avr-functional-hero__controls {
        right: 14px;
        bottom: 8px;
        display: flex;
    }

    /* Functional-rich categories duplicate navigation and are intentionally absent on mobile. */
    .avr-functional-hero__category-access {
        display: none !important;
    }

    /* Benefits: native swipe carousel on tablet and mobile. */
    .avelle-commerce-service-carousel {
        padding: 18px 0 16px !important;
    }

    .avelle-commerce-service-carousel .container {
        width: calc(100% - 32px) !important;
        max-width: none !important;
        padding-inline: 0;
    }

    .avelle-commerce-service-carousel__viewport {
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .avelle-commerce-service-carousel__viewport::-webkit-scrollbar {
        display: none;
    }

    .avelle-commerce-service-carousel__track {
        display: flex;
        width: max-content;
        gap: 24px;
    }

    .avelle-commerce-service-carousel__item {
        flex: 0 0 calc((100vw - 80px) / 2);
        width: calc((100vw - 80px) / 2);
        min-height: 72px;
        grid-template-columns: 32px minmax(0, 1fr);
        gap: 12px;
        padding: 0;
        scroll-snap-align: start;
    }

    .avelle-commerce-service-carousel__item + .avelle-commerce-service-carousel__item {
        border-left: 0;
    }

    .avelle-commerce-service-carousel__icon,
    .avelle-commerce-service-carousel__icon svg {
        width: 32px;
        height: 32px;
    }

    .avelle-commerce-service-carousel__icon .avelle-icon { font-size: 30px; }

    .avelle-commerce-service-carousel__copy strong {
        font-size: 13px;
        font-weight: 650;
    }

    .avelle-commerce-service-carousel__copy span {
        font-size: 12px;
        line-height: 1.25;
    }

    /* Same desktop banner set, now a one-card mobile carousel. */
    .avelle-fashion6-banner-mosaic__desktop {
        display: none !important;
    }

    .avelle-fashion6-banner-mosaic__mobile {
        display: block;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .avelle-fashion6-banner-mosaic__mobile::-webkit-scrollbar {
        display: none;
    }

    .avelle-fashion6-banner-mosaic__mobile-track {
        display: flex;
        gap: 10px;
        width: max-content;
    }

    .avelle-fashion6-banner-mosaic .avelle-fashion6-banner-mosaic__mobile-slide {
        flex: 0 0 calc(100vw - 16px);
        min-height: 470px;
        scroll-snap-align: start;
    }

    /* Product cards: more portrait media, quieter titles. */
    .avelle-fashion6-products .img-wrapper,
    .avelle-fashion6-products-sidebar .img-wrapper,
    .avelle-product-discovery .img-wrapper,
    .avelle-commerce-product-card .img-wrapper {
        aspect-ratio: var(--avelle-product-media-ratio-tall) !important;
    }

    .avelle-product-style--2 .tp-product-thumb-2,
    .avelle-product-style--3 .tp-product-thumb-3,
    .avelle-product-style--5 .tp-product-thumb-5 {
        aspect-ratio: var(--avelle-product-media-ratio-compact) !important;
    }

    .avelle-product-style--1 .tp-product-thumb,
    .avelle-product-style--4 .tp-product-thumb-4 {
        aspect-ratio: var(--avelle-product-media-ratio-tall) !important;
    }

    .avelle-fashion6-products .product-title,
    .avelle-fashion6-products-sidebar .product-title,
    .avelle-product-discovery .product-title,
    .avelle-commerce-product-card .product-title,
    .avelle-fashion6-products .avelle-commerce-product-card .product-title {
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    .avelle-product-card--shared.avelle-product-style--1 .tp-product-title,
    .avelle-product-card--shared.avelle-product-style--2 .tp-product-title-2,
    .avelle-product-card--shared.avelle-product-style--3 .tp-product-title-3,
    .avelle-product-card--shared.avelle-product-style--4 .tp-product-title-4,
    .avelle-product-card--shared.avelle-product-style--5 .tp-product-title-2 {
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    .avelle-product-discovery__intro h2,
    .avelle-product-section-heading h2,
    .avelle-trending-products-heading h2,
    .avelle-upcoming-drops__heading h2,
    .avelle-newsletter h2 {
        font-size: clamp(25px, 6.2vw, 30px) !important;
        line-height: 1.02 !important;
    }

    .avelle-upcoming-drops > .container {
        width: calc(100% - 16px);
    }

    .avelle-upcoming-drops__rail {
        display: grid;
        margin-inline: 0;
        padding-inline: 0;
        overflow: visible;
    }

    .avelle-upcoming-drop {
        width: 100%;
    }

    .avelle-upcoming-drop__surface {
        min-height: 600px;
    }

    .avelle-upcoming-drop__consent {
        bottom: 20px;
        width: calc(100% - 24px);
    }

    .avelle-upcoming-drop__consent > div {
        flex-direction: column;
    }

    .avelle-upcoming-drop__content h3 {
        font-size: clamp(16px, 4.45vw, 18px);
    }

    .avelle-upcoming-drop__footer {
        flex-wrap: wrap;
        padding-inline-end: 0;
    }

    .avelle-upcoming-drop__unlock {
        margin-left: auto;
    }

    .avelle-access-program {
        width: calc(100% - 16px);
        padding: 28px 0 56px;
    }

    .avelle-access-program__hero,
    .avelle-access-program__levels,
    .avelle-access-program__journey {
        grid-template-columns: minmax(0, 1fr);
    }

    .avelle-access-program__hero {
        padding: 28px 20px;
    }

    .avelle-access-program__intro h1 {
        font-size: clamp(42px, 15vw, 62px);
    }

    .avelle-access-program__status {
        padding: 20px;
    }

    .avelle-access-program__levels article {
        padding: 26px 20px;
    }

    .avelle-access-program__journey {
        margin-top: 56px;
    }

    .avelle-access-program__threshold-perks > div {
        grid-template-columns: minmax(0, 1fr);
        gap: 2px;
    }

    .avelle-onsale-products__banner {
        justify-self: stretch;
        width: 100%;
        max-width: none;
        aspect-ratio: 16 / 10;
    }

    /* The old second benefits block immediately before Journal is not part of the composition. */
    .avelle-usp-strip:has(+ .container + .avelle-fashion6-blog) {
        display: none !important;
    }

    .avelle-fashion6-blog {
        padding: 52px 0;
    }

    .avelle-fashion6-blog > .container {
        width: calc(100% - 16px);
    }

    .avelle-fashion6-blog__heading {
        align-items: flex-start;
        margin-bottom: 22px;
    }

    .avelle-fashion6-blog__heading h2 {
        font-size: 32px;
    }

    .avelle-fashion6-blog__heading > a {
        font-size: 0;
        width: 42px;
        height: 42px;
        justify-content: center;
        padding: 0;
        border: 1px solid var(--avl-line);
        border-radius: 12px;
    }

    .avelle-journal-card__media {
        aspect-ratio: 4 / 3.25;
    }

    .avelle-newsletter__form-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .avelle-newsletter__submit {
        width: 100%;
    }

    .avelle-fashion6-footer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 28px 18px !important;
    }

    .avelle-fashion6-footer__brand,
    .avelle-fashion6-footer__policies {
        grid-column: 1 / -1;
    }

    .avelle-fashion6-footer__policies ul {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px 18px;
    }
}

.avelle-product-card--shared.avelle-product-style--4 .tp-product-action-3 .tp-product-action-btn-3,
.bb-product-items-wrapper.avelle-unified-product-cards .avelle-product-card--shared.avelle-product-style--4 .tp-product-action-3 .tp-product-action-btn-3 {
    border-radius: 8px !important;
}

@media (prefers-reduced-motion: reduce) {
    .avelle-journal-card__media img,
    .avelle-upcoming-drop__unlock-copy small span,
    .avelle-upcoming-drop__unlock .avelle-upcoming-drop__icon,
    .avelle-upcoming-drop__unlock .avelle-upcoming-drop__icon::before,
    .avelle-upcoming-drop__unlock .avelle-upcoming-drop__icon .avelle-icon {
        animation: none;
        transition: none;
    }
}

/*
 * Homepage section titles should read as premium editorial section headings,
 * not as hero copy. This late-loaded file owns the final scale because the
 * homepage modules define their own heading sizes across several CSS bundles.
 */
.avelle-product-section-heading h2,
.avelle-fashion6-featured-offer__copy h2,
.avelle-product-discovery__intro h2,
.avelle-static-promo__copy h2,
.avelle-upcoming-drops__heading h2,
.avelle-fashion6-blog__heading h2,
.avelle-social-proof__intro h2,
.avelle-newsletter h2 {
    font-family: var(--avl-font-body, var(--avelle-body-font, Arial, sans-serif)) !important;
    font-size: 31px !important;
    line-height: 1.04 !important;
    letter-spacing: -0.035em;
}

@media (max-width: 991.98px) {
    .avelle-product-section-heading h2,
    .avelle-fashion6-featured-offer__copy h2,
    .avelle-product-discovery__intro h2,
    .avelle-static-promo__copy h2,
    .avelle-upcoming-drops__heading h2,
    .avelle-fashion6-blog__heading h2,
    .avelle-social-proof__intro h2,
    .avelle-newsletter h2 {
        font-size: 28px !important;
    }
}

.avr-nav .tp-main-menu-content a,
.avelle-header .tp-main-menu-content a,
.avelle-mobile-bottom-nav a,
.avelle-fashion6-footer a,
.avelle-fashion6-footer button,
.avelle-fashion6-footer select,
.avelle-fashion6-footer summary {
    font-family: var(--avl-font-body, var(--avelle-body-font, Arial, sans-serif)) !important;
}

.avelle-footer-register__brand-panel .avelle-fashion6-footer__wordmark,
.avelle-footer-register__brand-panel .avelle-fashion6-footer__wordmark span {
    font-family: Georgia, "Times New Roman", serif !important;
}

@media (max-width: 767.98px) {
    .avelle-fashion6-footer a,
    .avelle-fashion6-footer button,
    .avelle-fashion6-footer select,
    .avelle-fashion6-footer summary,
    .avelle-mobile-bottom-nav a,
    .avr-nav .tp-main-menu-content a,
    .avelle-header .tp-main-menu-content a {
        align-items: center;
        display: inline-flex;
        min-height: 44px;
        min-width: 44px;
    }

    .avelle-fashion6-footer .footer-content a,
    .avelle-fashion6-footer__legal a,
    .avelle-fashion6-footer__policies a {
        justify-content: flex-start;
        width: fit-content;
    }

    .avelle-fashion6-footer__social a,
    .avelle-footer-compliance__withdrawal,
    .avelle-footer-compliance__sal,
    .avelle-footer-anpc-sal,
    .avelle-footer-compliance__card,
    .avelle-footer-compliance__netopia-chip {
        min-height: 44px;
        min-width: 44px;
    }

    .offcanvas__close-btn,
    .tp-main-menu-mobile .dropdown-toggle-btn,
    .tp-category-mobile-menu .dropdown-toggle-btn,
    .offcanvas__currency-selected-currency,
    .offcanvas__lang-selected-lang,
    .offcanvas__currency-list a,
    .offcanvas__lang-list a,
    .language-switcher-wrapper button,
    .language-switcher-wrapper a,
    .tp-header-currency-toggle,
    .tp-header-currency a {
        align-items: center;
        display: inline-flex;
        justify-content: center;
        min-height: 44px;
        min-width: 44px;
    }
}

@media (max-width: 767.98px) {
    .avelle-product-section-heading h2,
    .avelle-fashion6-featured-offer__copy h2,
    .avelle-product-discovery__intro h2,
    .avelle-static-promo__copy h2,
    .avelle-upcoming-drops__heading h2,
    .avelle-fashion6-blog__heading h2,
    .avelle-social-proof__intro h2,
    .avelle-newsletter h2 {
        font-size: 23px !important;
        line-height: 1.06 !important;
    }
}

@media (max-width: 991.98px) {
    #tp-bottom-menu-sticky.tp-mobile-menu,
    .tp-mobile-menu#tp-bottom-menu-sticky {
        display: block !important;
        position: fixed !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        z-index: 2147483000 !important;
        overflow: hidden !important;
        background: var(--avl-bg) !important;
        isolation: isolate !important;
        pointer-events: auto !important;
        transform: translateZ(0) !important;
    }

    /* The functional tablet header hides the legacy mobile menu by default;
       the Core floating preset is an explicit tablet navigation surface. */
    body:has([data-avelle-header-preset="functional-rich"]) #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating {
        display: block !important;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating {
        right: 18px !important;
        bottom: 18px !important;
        left: 18px !important;
        width: auto !important;
        padding: 6px 8px !important;
        border: 1px solid var(--avl-line) !important;
        border-radius: var(--avl-r-lg) !important;
        box-shadow: 0 10px 30px rgba(0, 0, 0, .12) !important;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .container {
        max-width: none;
        padding: 0;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-item-btn {
        position: relative;
        min-height: 44px;
        border-radius: var(--avl-r);
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-item-btn:hover,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-item-btn:focus-visible {
        background: transparent !important;
        color: var(--avl-ink) !important;
        border-radius: 0 !important;
        outline: 0;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-item-btn[aria-current="page"] {
        background: var(--avl-ink);
        color: var(--avl-bg);
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-item-btn[aria-current="page"]:hover,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-item-btn[aria-current="page"]:focus-visible {
        background: var(--avl-ink) !important;
        color: var(--avl-bg) !important;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating {
        overflow: visible !important;
        padding: 0 8px !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: var(--avl-bg) !important;
        box-shadow: 0 10px 30px rgba(0, 0, 0, .18) !important;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .row {
        position: relative;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        align-items: stretch;
        height: 68px;
        margin: 0;
        padding: 0 12px;
        border-radius: 999px;
        background: transparent;
        box-shadow: none;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .row::before {
        position: absolute;
        top: 0;
        left: 50%;
        width: 0;
        height: 0;
        border-radius: 0;
        background: transparent;
        content: "";
        transform: translateX(-50%);
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .row > .col {
        min-width: 0;
        width: 100% !important;
        padding: 0;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-1 {
        grid-column: 1;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-2 {
        grid-column: 2;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-4 {
        grid-column: 4;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-5 {
        grid-column: 5;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-item {
        height: 68px;
        width: 100%;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-item-btn {
        display: flex;
        width: 100%;
        height: 68px;
        align-items: center;
        justify-content: center;
        padding: 12px 8px;
        gap: 4px;
        border-radius: 0 !important;
        background: transparent !important;
        color: var(--avl-muted) !important;
        font-size: 12px;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-item-btn > .avelle-icon {
        width: 24px;
        height: 24px;
        color: currentColor !important;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-item-btn > span {
        display: none;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-item-btn[aria-current="page"] {
        color: var(--avl-ink) !important;
        background: var(--avl-bg) !important;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-item-btn[aria-current="page"] > span {
        display: block;
    }

    /* Floating navigation states belong to the full grid slot, not to a
       rounded badge around the icon. Keep the outer pill corners only on
       the two edge slots. */
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-1 .tp-mobile-item,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-2 .tp-mobile-item,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-4 .tp-mobile-item,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-5 .tp-mobile-item {
        height: 68px;
        border-radius: 0;
        transition: background-color .2s ease, color .2s ease;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-1 .tp-mobile-item {
        border-radius: 999px 0 0 999px;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-5 .tp-mobile-item {
        border-radius: 0 999px 999px 0;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-1 .tp-mobile-item:has(.tp-mobile-item-btn:hover),
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-1 .tp-mobile-item:has(.tp-mobile-item-btn:focus),
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-2 .tp-mobile-item:has(.tp-mobile-item-btn:hover),
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-2 .tp-mobile-item:has(.tp-mobile-item-btn:focus),
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-4 .tp-mobile-item:has(.tp-mobile-item-btn:hover),
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-4 .tp-mobile-item:has(.tp-mobile-item-btn:focus),
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-5 .tp-mobile-item:has(.tp-mobile-item-btn:hover),
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-5 .tp-mobile-item:has(.tp-mobile-item-btn:focus) {
        background: transparent !important;
        color: var(--avl-ink) !important;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-1 .tp-mobile-item-btn:hover,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-1 .tp-mobile-item-btn:focus,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-2 .tp-mobile-item-btn:hover,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-2 .tp-mobile-item-btn:focus,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-4 .tp-mobile-item-btn:hover,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-4 .tp-mobile-item-btn:focus,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-5 .tp-mobile-item-btn:hover,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-slot-5 .tp-mobile-item-btn:focus {
        background: transparent !important;
        border-radius: 0 !important;
        color: inherit !important;
        outline: 0;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-center {
        position: absolute;
        top: 9px;
        left: 50%;
        z-index: 2;
        width: 50px !important;
        height: 50px;
        padding: 0;
        transform: translateX(-50%);
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .row > .tp-mobile-bottom-center {
        width: 50px !important;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-center .tp-mobile-item,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-center .tp-mobile-item-btn {
        width: 50px;
        height: 50px;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-center .tp-mobile-item-btn {
        padding: 0;
        border: 2px solid var(--avl-line-2) !important;
        border-radius: 50% !important;
        background: var(--avl-bg) !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, .20);
        color: var(--avl-ink) !important;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-center .tp-mobile-item-btn > span {
        display: none !important;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-center .tp-mobile-item-btn > .avelle-icon {
        width: 22px;
        height: 22px;
    }

    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-center .tp-mobile-item-btn:hover,
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--floating .tp-mobile-bottom-center .tp-mobile-item-btn:focus-visible {
        background: var(--avl-bg) !important;
        color: var(--avl-ink) !important;
        transform: translateY(-1px);
    }

    /* Core classic preset: the Torque mobile-bottom-menu contract, with Avelle actions/icons. */
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic {
        position: fixed !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        display: flex !important;
        justify-content: center;
        width: auto !important;
        padding: 10px max(16px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)) !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .mobile-menu {
        width: 100%;
        max-width: 32rem;
        padding: 4px;
        background: var(--avl-bg) !important;
        border: 1px solid var(--avl-line) !important;
        border-radius: 8px !important;
        box-shadow: 0 8px 24px rgba(33, 37, 41, .12) !important;
    }

    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row {
        display: flex;
        align-items: stretch;
        justify-content: center;
        gap: 0;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row > .shoper-menu-item {
        flex: 1 1 20%;
        min-width: 0;
        max-width: 6.25rem;
        margin: 0;
        padding: 0 5px;
        box-sizing: border-box;
        text-align: center;
    }

    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row > .tp-mobile-bottom-order-1 { order: 1; }
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row > .tp-mobile-bottom-order-2 { order: 2; }
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row > .tp-mobile-bottom-order-3 { order: 3; }
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row > .tp-mobile-bottom-order-4 { order: 4; }
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row > .tp-mobile-bottom-order-5 { order: 5; }

    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-item-btn {
        display: inline-flex;
        width: 100%;
        min-height: 3.25rem;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        padding: 5px 2px;
        border: 0 !important;
        border-radius: 6px !important;
        background: transparent !important;
        color: var(--avl-muted) !important;
        font-size: 9px;
        font-weight: 600;
        line-height: 1.5;
        text-align: center;
        text-decoration: none;
        text-transform: uppercase;
        transition: color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease;
    }

    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-item-btn > [class^="shoper-icon-"],
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-item-btn > [class*=" shoper-icon-"] {
        width: auto;
        height: auto;
        font-size: 22px;
        line-height: 33px;
        color: currentColor !important;
    }

    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row > .shoper-menu-item.active > .tp-mobile-item-btn {
        background: var(--avl-bg) !important;
        color: var(--avl-muted) !important;
        box-shadow: 0 2px 3px -2px rgba(33, 37, 41, .18);
    }

    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row > .shoper-menu-item.active > .tp-mobile-item-btn > [class^="shoper-icon-"],
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-bottom-row > .shoper-menu-item.active > .tp-mobile-item-btn > [class*=" shoper-icon-"] {
        color: var(--avl-ink) !important;
    }

    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-item-btn:hover,
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .tp-mobile-item-btn:focus-visible {
        background: transparent !important;
        color: var(--avl-ink) !important;
        transform: translateY(-1px);
        box-shadow: 0 2px 3px -2px rgba(33, 37, 41, .18);
        outline: 0;
    }

    /* Keep the old selectors inert for Classic; Floating owns the Bootstrap grid. */
    #tp-bottom-menu-sticky.shoper-mobile-bottom-menu--classic > .container {
        width: 100%;
        max-width: 512px;
    }

    body:not([data-customer-dashboard="true"]):has(#tp-bottom-menu-sticky) footer {
        margin-bottom: 0 !important;
        padding-bottom: 5.5rem !important;
    }

    .bb-product-items-wrapper.avelle-unified-product-cards .tp-product-badge,
    .bb-product-items-wrapper.avelle-unified-product-cards .tp-product-action,
    .bb-product-items-wrapper.avelle-unified-product-cards .tp-product-action-2,
    .bb-product-items-wrapper.avelle-unified-product-cards .tp-product-action-3,
    .bb-product-items-wrapper.avelle-unified-product-cards .tp-product-action-4,
    .bb-product-items-wrapper.avelle-unified-product-cards .tp-product-action-5,
    .avelle-product-card--shared .tp-product-badge,
    .avelle-product-card--shared .tp-product-action,
    .avelle-product-card--shared .tp-product-action-2,
    .avelle-product-card--shared .tp-product-action-3,
    .avelle-product-card--shared .tp-product-action-4,
    .avelle-product-card--shared .tp-product-action-5 {
        z-index: 1 !important;
    }

    .avelle-product-card--shared.avelle-product-style--4 .tp-product-action-btn,
    .avelle-product-card--shared.avelle-product-style--4 .tp-product-action-btn-2,
    .avelle-product-card--shared.avelle-product-style--4 .tp-product-action-btn-3,
    .bb-product-items-wrapper.avelle-unified-product-cards .avelle-product-style--4 .tp-product-action-btn,
    .bb-product-items-wrapper.avelle-unified-product-cards .avelle-product-style--4 .tp-product-action-btn-2,
    .bb-product-items-wrapper.avelle-unified-product-cards .avelle-product-style--4 .tp-product-action-btn-3 {
        border-radius: 8px !important;
    }
}

.bb-product-items-wrapper.avelle-unified-product-cards .avelle-product-card--shared.avelle-product-style--1 .tp-product-thumb img,
.bb-product-items-wrapper.avelle-unified-product-cards .avelle-product-card--shared.avelle-product-style--2 .tp-product-thumb-2 img,
.bb-product-items-wrapper.avelle-unified-product-cards .avelle-product-card--shared.avelle-product-style--3 .tp-product-thumb-3 img,
.bb-product-items-wrapper.avelle-unified-product-cards .avelle-product-card--shared.avelle-product-style--4 .tp-product-thumb-4 img,
.bb-product-items-wrapper.avelle-unified-product-cards .avelle-product-card--shared.avelle-product-style--5 .tp-product-thumb-5 img,
.bb-product-items-wrapper.avelle-unified-product-cards .avelle-product-card--shared.avelle-product-style--6 .theme-product-6 .img-wrapper img,
.avelle-product-card--shared.avelle-product-style--1 .tp-product-thumb img,
.avelle-product-card--shared.avelle-product-style--2 .tp-product-thumb-2 img,
.avelle-product-card--shared.avelle-product-style--3 .tp-product-thumb-3 img,
.avelle-product-card--shared.avelle-product-style--4 .tp-product-thumb-4 img,
.avelle-product-card--shared.avelle-product-style--5 .tp-product-thumb-5 img,
.avelle-product-card--shared.avelle-product-style--6 .theme-product-6 .img-wrapper img {
    object-fit: cover !important;
    object-position: center center !important;
}

@media (max-width: 767.98px) {
    .avelle-product-card--shared.avelle-product-style--6 .product-title,
    .avelle-fashion6-products .avelle-product-card--shared.avelle-product-style--6 .product-title,
    .avelle-fashion6-products-sidebar .avelle-product-card--shared.avelle-product-style--6 .product-title,
    .avelle-product-discovery .avelle-product-card--shared.avelle-product-style--6 .product-title {
        font-size: 16px !important;
        line-height: 19.2px !important;
    }
}

@media (max-width: 767.98px) {
    .tp-shop-area.avelle-plp-area > .container {
        padding-bottom: 92px !important;
    }

    .avelle-plp-ecomus {
        margin-bottom: 24px !important;
    }

    .avelle-plp-ecomus .avelle-plp-header__banner {
        aspect-ratio: 390 / 260;
        border-radius: var(--avelle-radius-card, 10px);
    }

    .avelle-plp-ecomus .avelle-plp-header__banner-copy {
        gap: 7px;
        left: 20px;
        max-width: calc(100% - 40px);
    }

    .avelle-plp-ecomus .avelle-plp-header__banner-copy strong {
        font-size: 34px;
        line-height: 1.02;
    }

    .avelle-plp-ecomus .avelle-plp-header__banner-copy p {
        display: none;
    }

    .avelle-plp-ecomus__chips {
        flex-wrap: nowrap;
        gap: 8px;
        margin-top: 12px;
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: none;
    }

    .avelle-plp-ecomus__chips::-webkit-scrollbar {
        display: none;
    }

    .avelle-plp-ecomus__chips a {
        flex: 0 0 auto;
        min-height: 34px;
        padding-inline: 14px;
    }

    .avelle-multikart-collection .product-top-filter {
        margin-bottom: 24px !important;
        padding-bottom: 14px !important;
    }

.avelle-multikart-collection .product-filter-content {
        align-items: stretch !important;
        display: grid !important;
        grid-template-columns: 1fr auto;
    width: 100%;
}

    .avelle-multikart-collection .product-filter-content__summary,
    .avelle-multikart-collection .product-filter-content__controls {
        grid-column: 1 / -1;
    }

    .avelle-multikart-collection .product-filter-content__controls {
        display: grid !important;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .avelle-multikart-collection .tp-shop-top-select {
        width: 100%;
    }

    .avelle-multikart-collection .tp-shop-top-select select,
    .avelle-multikart-collection .tp-shop-top-select .nice-select,
    .avelle-multikart-collection .product-filter-content .form-select {
        width: 100% !important;
    }

    .avelle-multikart-collection .filter-btn {
        grid-column: 1 / -1;
        justify-content: center;
        width: 100%;
    }

    .bb-filter-offcanvas-wrapper {
        padding-bottom: 96px;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] [data-avelle-pdp-surface="ecomus"] {
        row-gap: 28px;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] [data-avelle-pdp-surface="ecomus"] > .avelle-product-detail__media-column,
    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] [data-avelle-pdp-surface="ecomus"] > .avelle-product-detail__info-column {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] .avelle-product-detail__summary-column {
        max-width: none;
        position: static;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] .avelle-product-gallery {
        display: grid;
        gap: 12px;
        grid-template-columns: 1fr;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] .avelle-product-gallery .product-slick,
    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] .avelle-product-gallery > .row {
        grid-column: 1;
        grid-row: auto;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] .avelle-product-gallery > .row {
        order: 2;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] .avelle-product-gallery-thumbnails .slick-track {
        flex-direction: row;
        gap: 8px;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] .avelle-product-gallery-thumbnails .slick-slide {
        flex: 0 0 64px;
        max-width: 64px;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] .avelle-product-detail__title {
        font-size: 24px !important;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] .product-page-details.product-description-box .avelle-product-detail__title.main-title {
        font-size: 24px !important;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] .avelle-product-form-inline .avelle-product-detail__variations .attribute-swatches-wrapper {
        gap: 10px !important;
        grid-template-columns: 1fr !important;
    }

    body.single-product .avelle-pdp-mode[data-avelle-pdp-layout="accordion"] .sticky-bottom-cart {
        bottom: 78px;
    }
}

/* Final mobile parity overrides must remain after legacy Avelle rules. */
@media (max-width: 991.98px) {
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic {
        position: fixed !important;
        inset: auto 0 0 !important;
        z-index: 2147483000 !important;
        display: flex !important;
        justify-content: center;
        padding: 10px max(16px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)) !important;
        background: transparent !important;
        border: 0 !important;
        overflow: visible !important;
    }

    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic .mobile-menu {
        width: 100%;
        max-width: 32rem;
        padding: 4px;
        background: var(--avl-bg) !important;
        border: 1px solid var(--avl-line) !important;
        border-radius: 8px !important;
        box-shadow: 0 8px 24px rgba(33, 37, 41, .12) !important;
    }

    .avr-functional__search { display: none !important; }
    .avr-mobile-header-actions { display: inline-flex !important; align-items: center; justify-content: flex-end; gap: 4px; margin-inline-start: auto; }
    .avr-mobile-header-action { position: relative; display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; color: var(--avl-ink); background: transparent; border: 0; }
    .avr-mobile-header-action > i { font-size: 21px; line-height: 1; }
    .avr-mobile-header-badge { position: absolute; top: 3px; right: 1px; min-width: 15px; height: 15px; padding: 0 4px; border-radius: 999px; background: var(--avr-ink); color: var(--avr-surface); font-size: 9px; line-height: 15px; text-align: center; }
    .avr-header--functional .avr-functional__main-grid { grid-template-columns: 44px minmax(0, 1fr) auto !important; }
    .avr-header--functional .tp-offcanvas-open-btn.avr-mobile-only { display: inline-flex !important; grid-column: 1 !important; grid-row: 1 !important; }
    .avr-header--functional .avr-functional__brand { grid-column: 2 !important; grid-row: 1 !important; justify-self: center !important; }
    .avr-header--functional .avr-mobile-header-actions { display: inline-flex !important; grid-column: 3 !important; grid-row: 1 !important; justify-self: end !important; }
    .offcanvas__area .avelle-mobile-drawer__section { margin: 0 0 28px; }
    .avelle-mobile-drawer__heading { margin: 0 0 12px; color: var(--avl-ink); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
    .offcanvas__area .avelle-mobile-drawer__categories ul { list-style: none; margin: 0; padding: 0; }
    .offcanvas__area .avelle-mobile-drawer__categories > nav > ul > li { border-bottom: 1px solid var(--avl-line); }
    .offcanvas__area .avelle-mobile-drawer__categories a { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 12px; color: var(--avl-ink); font-size: 14px; }
    .offcanvas__area .avelle-mobile-drawer__categories .tp-submenu { padding-inline-start: 16px; }
    .offcanvas__area .avelle-mobile-drawer__section .tp-main-menu-mobile { display: block !important; min-height: 0; margin: 0 !important; }
}

/* Desktop guard must come after all legacy display rules. */
@media screen and (min-width: 992px) {
    #tp-bottom-menu-sticky.mobile-bottom-menu.shoper-mobile-bottom-menu--classic {
        display: none !important;
    }
}

/* Final responsive contract: the Avelle header follows Torque's menu/logo/
   search/cart composition on phones and tablets. */
@media screen and (max-width: 991px) {
    html body .avr-header--functional .tp-offcanvas-open-btn.avr-mobile-only {
        display: inline-flex !important;
        grid-column: 1 !important;
        grid-row: 1 !important;
    }
    html body .avr-header--functional .avr-mobile-header-actions {
        display: inline-flex !important;
        grid-column: 3 !important;
        grid-row: 1 !important;
        justify-self: end !important;
    }
}

/* Tablet header: keep menu, logo, search and actions in separate columns. */
@media screen and (min-width: 768px) and (max-width: 991px) {
    html body .avr-header--functional ~ .avr-hero--functional .avr-functional-hero__copy,
    html body .avr-hero--functional .avr-functional-hero__copy { top: auto !important; right: auto !important; bottom: 48px !important; left: 28px !important; width: min(390px, calc(100% - 56px)) !important; transform: none !important; }
    html body .avr-header--functional .avr-functional__main-grid {
        grid-template-columns: 44px 120px minmax(0, 1fr) 36px 84px !important;
        column-gap: 10px !important;
    }
    html body .avr-header--functional .avr-functional__brand {
        grid-column: 2 !important;
        justify-self: start !important;
        width: 120px !important;
        max-width: 120px !important;
    }
    html body .avr-header--functional .avr-functional__brand img {
        width: 120px !important;
        max-width: 120px !important;
    }
    html body .avr-header--functional .avr-functional__search {
        display: block !important;
        grid-column: 3 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
    html body .avr-header--functional .avr-mobile-header-actions {
        grid-column: 5 !important;
        justify-self: end !important;
    }
    html body .avr-header--functional .avr-functional__torque-actions {
        display: flex !important;
        grid-column: 4 !important;
        grid-row: 1 !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 36px !important;
        width: 36px !important;
        margin: 0 !important;
    }
    html body .avr-header--functional .avr-functional__torque-actions .avr-torque-action--wishlist {
        left: 0 !important;
    }
    html body .avr-header--functional .avr-functional__torque-actions .avr-torque-action--cart {
        display: none !important;
    }
}
/* The open Avelle drawer must cover the fixed mobile bottom bar. */
@media screen and (max-width: 991px) {
    html body .avr-header--functional .avr-functional__compact-utility,
    html body .avr-header--functional .avr-functional__torque-actions .avr-torque-action--wishlist {
        display: none !important;
    }
    html:root body[data-avelle-ui-preset] .offcanvas__area {
        inset-inline: 0 auto !important;
        width: calc(100vw - 56px) !important;
        max-width: none !important;
        border-radius: 0 26px 26px 0 !important;
        color: var(--avl-ink) !important;
        background: var(--avl-bg) !important;
        box-shadow: 12px 0 30px rgba(0, 0, 0, .18) !important;
        transform: translateX(calc(-100% - 24px)) !important;
    }
    html:root body[data-avelle-ui-preset] .offcanvas__area.offcanvas__radius { border-radius: 0 26px 26px 0 !important; }
    html:root body[data-avelle-ui-preset][data-avelle-ui-button][data-avelle-ui-border][data-avelle-ui-field][data-avelle-ui-icon][data-avelle-ui-hover] .offcanvas__area.offcanvas__radius { border-radius: 0 26px 26px 0 !important; }
    html:root body[data-avelle-ui-preset] .offcanvas__area.offcanvas-opened { transform: translateX(0) !important; }

    html body .offcanvas__area .offcanvas__wrapper { height: 100%; overflow: hidden; }
    html body .offcanvas__area .offcanvas__content { height: calc(100% - 76px); overflow-y: auto; padding: 0 22px 28px; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.25) transparent; }
    html body .offcanvas__area .offcanvas__top { min-height: 76px; margin: 0 !important; padding: 0 22px; }
    html body .offcanvas__area .offcanvas__logo img,
    html body .offcanvas__area .offcanvas__logo svg { filter: none; }
    html body .offcanvas__area .offcanvas__close { position: absolute; z-index: 2; top: 22px; left: 22px; }
    html:root body[data-avelle-ui-preset] .offcanvas__area .offcanvas__close-btn { border: 0 !important; color: var(--avl-ink) !important; background: transparent !important; box-shadow: none !important; }
    html:root body[data-avelle-ui-preset][data-avelle-ui-button][data-avelle-ui-border][data-avelle-ui-field][data-avelle-ui-icon][data-avelle-ui-hover] .offcanvas__area .offcanvas__close-btn { background: transparent !important; }

    /* The drawer is the full-screen stage; the active page is the upper layer. */
    html:root body[data-avelle-ui-preset] .offcanvas__area { width: 100vw !important; z-index: 1000 !important; }
    html:root body[data-avelle-ui-preset] .offcanvas__area .offcanvas__wrapper { width: calc(100vw - 56px); }
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > .tp-search-area,
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > .avr-header,
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > #main,
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > footer { position: relative; z-index: 2147483646 !important; }
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > .tp-search-area,
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > .avr-header,
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > #main,
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > footer { transform: translateX(calc(100vw - 96px)) scale(.90) !important; }
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) .offcanvas__content > *,
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) .offcanvas__bottom { animation: avelle-sidebar-item-rise .34s cubic-bezier(.2,.8,.2,1) both; }
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) .offcanvas__content > *:nth-child(2) { animation-delay: .06s; }
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) .offcanvas__content > *:nth-child(3) { animation-delay: .11s; }
    @keyframes avelle-sidebar-item-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
    html body .offcanvas__area .offcanvas__close-btn:hover { color: var(--avl-ink) !important; background: transparent !important; }
    html body .offcanvas__area .offcanvas__logo { margin-left: 34px; }
    html body .offcanvas__area .avelle-mobile-drawer__heading { color: var(--avl-muted) !important; font-size: 10px; letter-spacing: .16em; }
    html body:has(.offcanvas__area.offcanvas-opened) > .tp-search-area,
    html body:has(.offcanvas__area.offcanvas-opened) > .avr-header,
    html body:has(.offcanvas__area.offcanvas-opened) > footer { display: none !important; }
    html body:has(.offcanvas__area.offcanvas-opened) > #main {
        height: calc(100vh - 48px) !important;
        max-height: calc(100vh - 48px) !important;
        margin-top: 24px !important;
        overflow: hidden !important;
        border-radius: 18px;
    }
    html body .offcanvas__area .tp-main-menu-mobile .tp-main-menu-content > ul { padding-inline-start: 0 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li { padding-inline: 0 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li > a {
        font-size: 14px !important;
        line-height: 1.35 !important;
    }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-group-label {
        min-height: 0 !important; margin: 22px 0 6px !important; padding: 0 18px !important; border: 0 !important;
        color: var(--avl-muted) !important; font-size: 10px !important; font-weight: 700; letter-spacing: .16em; line-height: 1.2 !important; text-transform: uppercase;
    }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-group-label::after { display: none !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category {
        display: block; margin: 0 !important; padding: 0 !important; background: transparent; border: 0 !important; border-radius: 0; overflow: visible;
    }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category::after { display: none !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category > a { align-items: center; display: flex; min-height: 50px; padding: 12px 64px 12px 18px !important; font-weight: 500; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category > .dropdown-toggle-btn { min-width: 48px; min-height: 50px; padding: 0 18px !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category > .dropdown-toggle-btn { width: 32px !important; height: 32px !important; min-width: 32px !important; min-height: 32px !important; position: absolute !important; z-index: 2; top: 9px !important; right: 18px !important; display: inline-flex !important; align-items: center; justify-content: center; padding: 0 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category > .dropdown-toggle-btn > [data-avelle-icon="chevron-down"],
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category > .dropdown-toggle-btn > .avelle-icon { width: 12px !important; height: 12px !important; font-size: 12px !important; line-height: 1 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.has-mega-menu:not(.dropdown-opened) > .dropdown-toggle-btn { width: 32px !important; height: 32px !important; min-width: 32px !important; min-height: 32px !important; top: 9px !important; right: 18px !important; padding: 0 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.has-mega-menu:not(.dropdown-opened) > .dropdown-toggle-btn > [data-avelle-icon="chevron-down"],
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.has-mega-menu:not(.dropdown-opened) > .dropdown-toggle-btn > .avelle-icon { width: 12px !important; height: 12px !important; font-size: 12px !important; line-height: 1 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category > .tp-submenu,
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category > .avelle-mega-menu { grid-column: 1 / -1; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened {
        margin: 8px 0 0 !important; background: transparent; border: 0 !important; border-radius: 0; overflow: visible;
    }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened::after { display: none !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > a { background: transparent; border-bottom: 0 !important; font-weight: 600; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .dropdown-toggle-btn { width: 32px !important; height: 32px !important; min-width: 32px !important; min-height: 32px !important; top: 9px !important; right: 18px !important; padding: 0 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .dropdown-toggle-btn > [data-avelle-icon="chevron-down"],
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .dropdown-toggle-btn > .avelle-icon { width: 12px !important; height: 12px !important; font-size: 12px !important; line-height: 1 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .tp-submenu,
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu { position: static !important; inset: auto !important; width: auto !important; height: auto !important; visibility: visible !important; opacity: 1 !important; transform: none !important; margin: 0 0 12px; padding: 10px 0; border: 0 !important; background: transparent; border-radius: 0; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu > li > .row { display: block !important; margin: 0 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .col-xl-4 { width: 100% !important; max-width: 100% !important; padding: 0 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .link-section { margin-inline: -12px; padding: 8px 0; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .col-xl-4:not(:last-child) .link-section { border-bottom: 0; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .menu-title h5 { margin: 0 0 4px !important; padding-inline: 18px; color: var(--avl-muted) !important; font-size: 12px !important; line-height: 1.25 !important; font-weight: 700 !important; letter-spacing: .1em; text-transform: uppercase; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .menu-content { margin: 0 !important; padding: 0 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .menu-content > ul { display: block !important; margin: 0 !important; padding: 0 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .menu-content > ul > li { display: block !important; width: auto !important; margin: 0 !important; padding: 0 !important; border: 0 !important; }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .menu-content > ul > li > a { display: block !important; width: auto !important; min-height: 32px !important; padding: 7px 18px !important; font-size: 13px !important; line-height: 1.35 !important; }
    html body .offcanvas__area .avelle-mobile-drawer__categories > nav > ul > li,
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li { border-bottom: 0 !important; position: relative; }
    html body .offcanvas__area .avelle-mobile-drawer__categories > nav > ul > li:not(:last-child)::after,
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li:not(:last-child)::after { content: ''; position: absolute; inset-inline: 18px; bottom: 0; border-bottom: 1px solid var(--avl-line); }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category::after { content: none !important; display: none !important; border: 0 !important; }
    html body .offcanvas__area .avelle-mobile-drawer__categories a,
    html body .offcanvas__area .tp-main-menu-mobile a { color: var(--avl-ink) !important; }
    html body .offcanvas__area .avelle-mobile-drawer__categories a:hover,
    html body .offcanvas__area .tp-main-menu-mobile a:hover { color: var(--avl-ink) !important; background: transparent !important; }
    html body .offcanvas__area .avelle-mobile-drawer__categories svg,
    html body .offcanvas__area .tp-main-menu-mobile svg,
    html body .offcanvas__area .dropdown-toggle-btn { color: var(--avl-muted) !important; }
    html body .offcanvas__area .offcanvas__bottom { border-top: 1px solid var(--avl-line); padding: 18px 22px 24px; }
    html body .offcanvas__area .offcanvas__bottom,
    html body .offcanvas__area .offcanvas__bottom a,
    html body .offcanvas__area .offcanvas__bottom button { color: var(--avl-muted) !important; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-links { margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--avl-line); }
    /* Keep the lowered logo/close row clear of the first drawer section. */
    html body .offcanvas__area .avelle-mobile-drawer__quick-links { margin-top: 40px; margin-bottom: 24px; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-card { min-width: 0; padding: 13px 12px 14px; border: 1px solid var(--avl-line); border-radius: 14px; background: var(--avl-bg); box-shadow: 0 5px 14px rgba(31, 31, 31, .05); }
    html body .offcanvas__area .avelle-mobile-drawer__footer-card-head { display: flex; align-items: baseline; gap: 7px; margin-bottom: 9px; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-card-index { color: var(--avl-muted); font-size: 9px; letter-spacing: .1em; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-card h3 { margin: 0; color: var(--avl-ink); font-size: 12px; font-weight: 700; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-card ul { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-card li { margin: 0; padding: 0; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-card a { display: block; color: var(--avl-muted) !important; font-size: 11px; line-height: 1.35; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-card a:hover { color: var(--avl-ink) !important; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-action { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 7px; min-height: 48px; padding: 9px 10px; border: 1px solid var(--avl-line); border-radius: 12px; background: var(--avl-bg); box-shadow: 0 5px 14px rgba(31, 31, 31, .05); color: var(--avl-ink) !important; font-size: 11px; font-weight: 600; line-height: 1.2; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-action:hover { color: var(--avl-ink) !important; border-color: var(--avl-line); background: var(--avl-bg) !important; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-action-icon { display: inline-flex; align-items: center; justify-content: center; color: var(--avl-muted); }
    html body .offcanvas__area .avelle-mobile-drawer__footer-action-icon svg { width: 16px; height: 16px; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-lists { display: grid; gap: 8px; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-list { border: 1px solid var(--avl-line); border-radius: 12px; background: var(--avl-bg); overflow: hidden; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-list summary { display: flex; align-items: center; justify-content: space-between; padding: 11px 12px; color: var(--avl-ink); cursor: pointer; font-size: 12px; font-weight: 700; list-style: none; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-list summary::-webkit-details-marker { display: none; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-list summary span:last-child { color: var(--avl-muted); font-size: 18px; font-weight: 400; line-height: 1; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-list[open] summary span:last-child { transform: rotate(45deg); }
    html body .offcanvas__area .avelle-mobile-drawer__footer-list ul { display: grid; gap: 5px; margin: 0; padding: 0 12px 12px; list-style: none; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-list li { margin: 0; padding: 0; }
    html body .offcanvas__area .avelle-mobile-drawer__footer-list a { color: var(--avl-muted) !important; font-size: 11px; line-height: 1.35; }
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) { overflow: hidden !important; overscroll-behavior: none !important; }
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > .tp-search-area,
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > .avr-header,
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > #main,
    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > footer { overflow: hidden !important; overscroll-behavior: none !important; }

    html body .offcanvas__area.offcanvas-opened {
        transform: translateX(0) !important;
    }

    html body:has(.offcanvas__area.offcanvas-opened) > .tp-search-area,
    html body:has(.offcanvas__area.offcanvas-opened) > .avr-header,
    html body:has(.offcanvas__area.offcanvas-opened) > #main,
    html body:has(.offcanvas__area.offcanvas-opened) > footer {
        border-radius: 18px;
        overflow: hidden;
        transform: translateX(calc(100vw - 96px)) scale(.90) !important;
        transform-origin: right top !important;
        transition: transform .3s ease-out, border-radius .3s ease-out;
        box-shadow: -10px 0 24px rgba(31, 31, 31, .12);
    }

    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) > .tp-search-area {
        position: fixed !important;
    }

    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) .body-overlay.opened {
        z-index: 900 !important;
    }

    html:root body[data-avelle-ui-preset]:has(.offcanvas__area.offcanvas-opened) .offcanvas__area.offcanvas-opened {
        z-index: 1000 !important;
    }

    html body:has(.offcanvas__area.offcanvas-opened) .body-overlay.opened {
        background: rgba(31, 31, 31, .08) !important;
        opacity: 1 !important;
    }

    html body:has(.offcanvas__area.offcanvas-opened) #tp-bottom-menu-sticky {
        visibility: hidden !important;
        pointer-events: none !important;
    }

    html body .offcanvas__area.offcanvas-opened,
    html body .offcanvas__area.offcanvas-opened + .offcanvas-backdrop,
    html body .offcanvas-backdrop.show {
        z-index: 2147483647 !important;
    }
}

@media screen and (min-width: 768px) and (max-width: 991.98px) {
    /* Center the tablet Close control on the logo instead of above it. */
    html body .offcanvas__area .offcanvas__close { top: 49px; }
    html body .offcanvas__area .avelle-mobile-drawer__quick-links { margin-top: 24px; }

    /* Tablet has enough horizontal space for the three top-level submenu groups. */
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu > li > .row {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 16px;
        margin: 0 !important;
    }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .col-xl-4 {
        width: auto !important;
        max-width: none !important;
        padding: 0 !important;
    }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .link-section {
        margin-inline: 0;
    }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .menu-title h5,
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .menu-content > ul > li > a {
        padding-inline: 0 !important;
    }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .menu-content > ul > li,
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .menu-content > ul > li > a {
        border: 0 !important;
    }
    html body .offcanvas__area .tp-main-menu-mobile > .tp-main-menu-content > ul > li.avelle-mobile-menu-category.dropdown-opened > .avelle-mega-menu .menu-content > ul > li::after {
        content: none !important;
        display: none !important;
    }
}

@media (max-width: 767.98px) {
    html body .offcanvas__area .offcanvas__close { top: 71px; }
    html body .offcanvas__area .offcanvas__logo { transform: translateY(34px); }
    /* The shared logo partial carries an inline max-height; scale only the
       sidebar mark so its visible height matches the 44px Close target. */
    html body .offcanvas__area .offcanvas__logo img,
    html body .offcanvas__area .offcanvas__logo svg { transform: scale(1.25); transform-origin: center; }
    html body .avr-header--functional .avr-functional__main-grid { grid-template-columns: 44px 78px minmax(0, 1fr) 40px 40px 40px !important; column-gap: 10px !important; }
    html body .avr-header--functional .avr-functional__brand { grid-column: 2 !important; justify-self: start !important; width: 96px !important; max-width: 96px !important; }
    html body .avr-header--functional .avr-functional__brand img { width: 96px !important; max-width: 96px !important; transform: scale(1.15); transform-origin: left center; }
    html body .avr-header--functional .avr-mobile-header-actions { display: contents !important; }
    html body .avr-header--functional .avr-mobile-header-actions .tp-search-open-btn { grid-column: 5 !important; grid-row: 1 !important; }
    html body .avr-header--functional .avr-mobile-header-actions .cartmini-open-btn { grid-column: 6 !important; grid-row: 1 !important; }
    html body .avr-header--functional .avr-functional__torque-actions { display: contents !important; }
    html body .avr-header--functional .avr-functional__torque-actions .avr-torque-action--account,
    html body .avr-header--functional .avr-functional__torque-actions .avr-torque-action--cart { display: none !important; }
    html body .avr-header--functional .avr-functional__torque-actions .avr-torque-action--wishlist { display: inline-flex !important; grid-column: 4 !important; grid-row: 1 !important; align-items: center !important; justify-content: center !important; width: 40px !important; height: 40px !important; margin: 0 !important; }
    html body .avr-header--functional .avr-functional__torque-actions .avr-torque-action--wishlist .avr-torque-action__icon-link { display: inline-flex !important; width: 40px !important; height: 40px !important; align-items: center !important; justify-content: center !important; }
}

/* Avelle functional hero: Nurfia-inspired full-scene composition. The image
   owns the complete viewport and the functional header is layered above it. */
html body:has(.avr-hero--functional) .avr-header--functional {
    position: absolute !important;
    inset: 0 0 auto !important;
    z-index: 30 !important;
    color: var(--avl-bg) !important;
    background: transparent !important;
    border-color: rgba(255, 255, 255, .24) !important;
    box-shadow: none !important;
}

html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__utility,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__compact-utility,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__main,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__nav-row,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__main-grid,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__nav-grid {
    color: var(--avl-bg) !important;
    background: transparent !important;
    border-color: rgba(255, 255, 255, .24) !important;
    box-shadow: none !important;
}

/* The utility strip remains a separate white topbar; only the main header and
   navigation are transparent layers over the hero scene. */
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__utility,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__compact-utility {
    color: var(--avl-ink) !important;
    background: var(--avl-bg) !important;
    border-color: var(--avl-line) !important;
}

html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__utility a,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__utility span,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__compact-utility a,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__compact-utility span,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__utility svg,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__compact-utility svg {
    color: var(--avl-ink) !important;
    stroke: currentColor;
}

html body:has(.avr-hero--functional) .avr-header--functional a,
html body:has(.avr-hero--functional) .avr-header--functional button,
html body:has(.avr-hero--functional) .avr-header--functional span,
html body:has(.avr-hero--functional) .avr-header--functional strong,
html body:has(.avr-hero--functional) .avr-header--functional small,
html body:has(.avr-hero--functional) .avr-header--functional svg {
    color: var(--avl-bg) !important;
    fill: none;
    stroke: currentColor;
}

html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__brand img,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__brand svg {
    filter: brightness(0) invert(1) !important;
}

html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__search input,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__search .tp-search-input {
    color: var(--avl-bg) !important;
    background: rgba(255, 255, 255, .08) !important;
    border-color: rgba(255, 255, 255, .58) !important;
    box-shadow: none !important;
}

html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__search input::placeholder,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__search .tp-search-input::placeholder {
    color: rgba(255, 255, 255, .82) !important;
}

html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__search .tp-header-search-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none;
}

html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__search .tp-header-search-btn {
    background: rgba(255, 255, 255, .18) !important;
    color: var(--avl-bg) !important;
}

html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-functional__search .tp-header-search-box input,
html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-functional__search .tp-header-search-btn button {
    background: rgba(255, 255, 255, .10) !important;
    color: var(--avl-bg) !important;
}

html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-functional__search .tp-header-search-btn,
html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-functional__search .tp-header-search-btn button {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: var(--avl-bg) !important;
}

html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__search button,
html body:has(.avr-hero--functional) .avr-header--functional .avr-functional__departments {
    color: var(--avl-bg) !important;
    background: transparent !important;
    border-color: rgba(255, 255, 255, .58) !important;
}

@media screen and (max-width: 991.98px) {
    html body:has(.avr-hero--functional) .avr-header--functional .avr-icon,
    html body:has(.avr-hero--functional) .avr-header--functional .tp-search-open-btn,
    html body:has(.avr-hero--functional) .avr-header--functional .cartmini-open-btn,
    html body:has(.avr-hero--functional) .avr-header--functional .avr-torque-action__icon-link {
        color: var(--avl-bg) !important;
        background: rgba(255, 255, 255, .10) !important;
        background-color: rgba(255, 255, 255, .10) !important;
        border: 0 !important;
        box-shadow: none !important;
    }
}

/* Mobile functional header: retain the compact icon geometry while giving
   every visible control the same subtle white 10% surface over the hero. */
@media screen and (max-width: 767.98px) {
    html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-icon,
    html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-mobile-header-actions .tp-search-open-btn,
    html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-mobile-header-actions .cartmini-open-btn,
    html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-torque-action__icon-link {
        background: rgba(255, 255, 255, .10) !important;
        background-color: rgba(255, 255, 255, .10) !important;
    }
}

html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__campaign {
    width: 100%;
    height: 100svh;
    min-height: 620px;
}

html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__slide::after {
    background: linear-gradient(90deg, rgba(0, 0, 0, .58) 0%, rgba(0, 0, 0, .34) 31%, rgba(0, 0, 0, .08) 64%, rgba(0, 0, 0, .18) 100%), linear-gradient(180deg, rgba(0, 0, 0, .22) 0%, transparent 38%, rgba(0, 0, 0, .24) 100%);
}

html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__copy {
    top: auto !important;
    bottom: clamp(112px, 13vh, 150px) !important;
    transform: none !important;
}

html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__copy > span,
html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__copy h1,
html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__copy h2,
html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__copy p {
    color: var(--avl-bg) !important;
    text-shadow: 0 1px 18px rgba(0, 0, 0, .2);
}

html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__controls {
    bottom: 96px;
}

@media screen and (max-width: 991.98px) {
    html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__campaign {
        min-height: 560px;
    }
}

@media screen and (max-width: 767.98px) {
    html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__campaign {
        min-height: 540px;
    }
    html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__copy {
        left: 28px !important;
        width: min(390px, calc(100% - 56px)) !important;
        bottom: 150px !important;
    }
    html body:has(.avr-hero--functional) .avr-hero--functional .avr-functional-hero__dots {
        bottom: 96px;
    }
}

@media screen and (min-width: 768px) {
    html body .avr-header--functional .avr-functional__search {
        width: 33px !important;
        min-width: 33px !important;
    }

    html body .avr-header--functional .avr-functional__search:has(.is-expanded) {
        width: min(700px, 48vw) !important;
    }

    html body .avr-header--functional .avr-functional__search .tp-header-search-wrapper:not(.is-expanded) {
        border: 1px solid rgba(255, 255, 255, .36) !important;
    }

    html body .avr-header--functional .avr-functional__search .tp-header-search-wrapper:not(.is-expanded) .tp-header-search-box input {
        width: 0 !important;
        min-width: 0 !important;
        padding-inline: 0 !important;
    }
}

@media screen and (min-width: 768px) and (max-width: 991.98px) {
    html body .avr-header--functional .avr-functional__search:has(.is-expanded) {
        width: 100% !important;
    }
}

@media screen and (min-width: 768px) {
    html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-functional__search .tp-header-search-wrapper:not(.is-expanded) {
        border: 1px solid rgba(255, 255, 255, .42) !important;
        background: rgba(255, 255, 255, .10) !important;
    }
}

/* Tablet header contract: keep search beside cart in the compact action
   group; the expanded inline search remains a desktop-only treatment. */
@media screen and (min-width: 768px) and (max-width: 991.98px) {
    html body:has(.avr-hero--functional) .avr-header.avr-header--functional {
        --avl-ui-icon-bg: rgba(255, 255, 255, .10);
        --avl-ui-icon-border: rgba(255, 255, 255, .22);
        --avl-ui-icon-hover-bg: transparent;
        --avl-ui-icon-hover-border: transparent;
        --avl-ui-icon-hover-color: var(--avl-bg);
        --avl-ui-button-hover-bg: transparent;
        --avl-ui-button-hover-border: transparent;
        --avl-ui-button-hover-color: var(--avl-bg);
    }

    html body .avr-header--functional .avr-functional__search {
        display: none !important;
    }

    html body .avr-header--functional .avr-mobile-header-actions {
        display: inline-flex !important;
        width: 84px !important;
        min-width: 84px !important;
        gap: 4px !important;
    }

    html body .avr-header--functional .avr-mobile-header-actions .tp-search-open-btn,
    html body .avr-header--functional .avr-mobile-header-actions .cartmini-open-btn {
        display: inline-flex !important;
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1px solid rgba(255, 255, 255, .22) !important;
        border-radius: 8px !important;
        background: rgba(255, 255, 255, .10) !important;
    }

    html body .avr-header--functional:has(.avr-functional__search .is-expanded) .avr-functional__search {
        display: block !important;
        position: absolute !important;
        top: 11px !important;
        right: auto !important;
        left: 200px !important;
        width: calc(100% - 284px) !important;
        min-width: 0 !important;
        z-index: 12 !important;
    }

    html body .avr-header--functional:has(.avr-functional__search .is-expanded) .avr-functional__search .tp-header-search-wrapper {
        width: 100% !important;
    }

    html body .avr-header--functional:has(.avr-functional__search .is-expanded) .avr-mobile-header-actions .tp-search-open-btn {
        opacity: 0 !important;
        pointer-events: none !important;
    }

    html body .avr-header--functional .avr-icon:hover,
    html body .avr-header--functional .avr-icon:focus-visible,
    html body .avr-header--functional .avr-mobile-header-actions .tp-search-open-btn:hover,
    html body .avr-header--functional .avr-mobile-header-actions .tp-search-open-btn:focus-visible,
    html body .avr-header--functional .avr-mobile-header-actions .cartmini-open-btn:hover,
    html body .avr-header--functional .avr-mobile-header-actions .cartmini-open-btn:focus-visible {
        background: transparent !important;
        background-color: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    html:root body[data-avelle-ui-preset][data-avelle-ui-button][data-avelle-ui-border][data-avelle-ui-field][data-avelle-ui-icon][data-avelle-ui-hover]:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-icon:is(:hover, :focus-visible),
    html:root body[data-avelle-ui-preset][data-avelle-ui-button][data-avelle-ui-border][data-avelle-ui-field][data-avelle-ui-icon][data-avelle-ui-hover]:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-mobile-header-actions .tp-search-open-btn:is(:hover, :focus-visible),
    html:root body[data-avelle-ui-preset][data-avelle-ui-button][data-avelle-ui-border][data-avelle-ui-field][data-avelle-ui-icon][data-avelle-ui-hover]:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-mobile-header-actions .cartmini-open-btn:is(:hover, :focus-visible) {
        background: transparent !important;
        background-color: transparent !important;
        border: 0 !important;
        border-color: transparent !important;
        box-shadow: none !important;
        color: var(--avl-bg) !important;
    }

    html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-icon,
    html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-mobile-header-actions .tp-search-open-btn,
    html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-mobile-header-actions .cartmini-open-btn {
        background: rgba(255, 255, 255, .10) !important;
        background-color: rgba(255, 255, 255, .10) !important;
        border: 1px solid rgba(255, 255, 255, .22) !important;
        border-radius: 8px !important;
        color: var(--avl-bg) !important;
    }

    html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-icon > i,
    html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-mobile-header-actions .tp-search-open-btn > i,
    html body:has(.avr-hero--functional) .avr-header.avr-header--functional .avr-mobile-header-actions .cartmini-open-btn > i {
        color: var(--avl-bg) !important;
    }
}

/* Inline desktop search controls remain icon-only when the main menu compacts. */
html body .avr-header--functional .avr-functional__nav-toggle,
html body .avr-header--functional .avr-functional__search-close {
    background: rgba(255, 255, 255, .10) !important;
    background-color: rgba(255, 255, 255, .10) !important;
    border: 1px solid rgba(255, 255, 255, .36) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

@media (min-width: 992px) {
    html body .avr-header--functional:has(.avr-functional__search .is-expanded) .avr-functional__search {
        width: 100% !important;
        min-width: 0 !important;
        justify-self: stretch !important;
    }

    html body .avr-header--functional:has(.avr-functional__search .is-expanded) .avr-functional__search .tp-header-search-wrapper {
        width: 100% !important;
    }

    html body .avr-header--functional:has(.avr-functional__search .is-expanded) .avr-functional__nav-toggle,
    html body .avr-header--functional:has(.avr-functional__search .is-expanded) .avr-functional__search-close {
        background: rgba(255, 255, 255, .10) !important;
        background-color: rgba(255, 255, 255, .10) !important;
        border: 1px solid rgba(255, 255, 255, .36) !important;
        border-radius: 8px !important;
    }
}

/* Final cascade for the current header contract. */
html body:has(.avr-hero--functional) #header-sticky.header-sticky,
html body:has(.avr-hero--functional) #header-sticky.header-sticky .avr-functional__main-grid,
html body:has(.avr-hero--functional) #header-sticky.header-sticky .avr-functional__nav-grid {
    color: var(--avl-ink) !important;
    background: var(--avl-bg) !important;
    border-bottom-color: var(--avl-line) !important;
}

html body:has(.avr-hero--functional) #header-sticky.header-sticky a,
html body:has(.avr-hero--functional) #header-sticky.header-sticky button,
html body:has(.avr-hero--functional) #header-sticky.header-sticky span,
html body:has(.avr-hero--functional) #header-sticky.header-sticky strong,
html body:has(.avr-hero--functional) #header-sticky.header-sticky small,
html body:has(.avr-hero--functional) #header-sticky.header-sticky svg,
html body:has(.avr-hero--functional) #header-sticky.header-sticky i {
    color: var(--avl-ink) !important;
    fill: none;
    stroke: currentColor;
}

html body:has(.avr-hero--functional) #header-sticky.header-sticky .avr-functional__brand img,
html body:has(.avr-hero--functional) #header-sticky.header-sticky .avr-functional__brand svg {
    filter: none !important;
}

html body:has(.avr-hero--functional) .avr-functional__main.header-sticky {
    color: var(--avl-ink) !important;
    background: var(--avl-bg) !important;
    border-bottom-color: var(--avl-line) !important;
}

html body:has(.avr-hero--functional) .avr-functional__main.header-sticky a,
html body:has(.avr-hero--functional) .avr-functional__main.header-sticky button,
html body:has(.avr-hero--functional) .avr-functional__main.header-sticky span,
html body:has(.avr-hero--functional) .avr-functional__main.header-sticky strong,
html body:has(.avr-hero--functional) .avr-functional__main.header-sticky small,
html body:has(.avr-hero--functional) .avr-functional__main.header-sticky svg,
html body:has(.avr-hero--functional) .avr-functional__main.header-sticky i {
    color: var(--avl-ink) !important;
    fill: none;
    stroke: currentColor;
}

html body:has(.avr-hero--functional) .avr-functional__main.header-sticky .avr-functional__brand img,
html body:has(.avr-hero--functional) .avr-functional__main.header-sticky .avr-functional__brand svg {
    filter: none !important;
}

html body:has(.avr-hero--functional) .avr-functional__main.header-sticky .avr-torque-action__icon-link,
html body:has(.avr-hero--functional) .avr-functional__main.header-sticky .avr-torque-action__cart-icon,
html body:has(.avr-hero--functional) .avr-functional__main.header-sticky .tp-header-search-wrapper:not(.is-expanded),
html body:has(.avr-hero--functional) .avr-functional__main.header-sticky .avr-icon,
html body:has(.avr-hero--functional) .avr-functional__main.header-sticky .tp-search-open-btn,
html body:has(.avr-hero--functional) .avr-functional__main.header-sticky .cartmini-open-btn {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

html body:has(.avr-hero--functional) .avr-functional__curated-menu > li > a {
    text-transform: uppercase !important;
    letter-spacing: .02em;
}

@media (hover: hover) {
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-row,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main-grid,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-grid {
        color: var(--avl-bg) !important;
        background: transparent !important;
        border-color: rgba(255, 255, 255, .24) !important;
    }

    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main a,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main button,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main span,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main strong,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main small,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__main svg,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-row a,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-row button,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__nav-row svg {
        color: var(--avl-bg) !important;
        fill: none;
        stroke: currentColor;
    }

    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__brand img,
    html body:has(.avr-hero--functional) .avr-header--functional:is(:hover, :focus-within) .avr-functional__brand svg {
        filter: brightness(0) invert(1) !important;
    }
}

html body:has(.avr-hero--functional) .avr-functional__main.sticky-active,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-functional__main-grid,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-functional__nav-grid {
    color: var(--avl-ink) !important;
    background: var(--avl-bg) !important;
    border-bottom-color: var(--avl-line) !important;
}

html body:has(.avr-hero--functional) .avr-functional__main.sticky-active a,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active button,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active span,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active strong,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active small,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active svg,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active i {
    color: var(--avl-ink) !important;
    fill: none;
    stroke: currentColor;
}

html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-functional__brand img,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-functional__brand svg {
    filter: none !important;
}

html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-torque-action__icon-link,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-torque-action__cart-icon,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .tp-header-search-wrapper:not(.is-expanded),
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .avr-icon,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .tp-search-open-btn,
html body:has(.avr-hero--functional) .avr-functional__main.sticky-active .cartmini-open-btn {
    color: var(--avl-ink) !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

/* Keep mobile/tablet PLP controls on the shared compact catalog contract. */
@media (max-width: 991.98px) {
    .avelle-multikart-collection .product-filter-content__summary,
    .avelle-multikart-collection .collection-grid-view,
    .avelle-multikart-collection .tp-shop-top-select.sort-by {
        display: none !important;
    }

    .avelle-multikart-collection .product-filter-content {
        align-items: center !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 10px;
    }

    .avelle-multikart-collection .product-filter-content__controls {
        display: block !important;
        margin-left: auto;
        width: auto !important;
    }

    .avelle-multikart-collection .tp-shop-top-select,
    .avelle-multikart-collection .tp-shop-top-select .nice-select,
    .avelle-multikart-collection .tp-shop-top-select select {
        width: auto !important;
    }

    .avelle-multikart-collection .tp-shop-top-select select,
    .avelle-multikart-collection .tp-shop-top-select .nice-select,
    .avelle-multikart-collection .product-filter-content .form-select {
        min-width: 154px;
        width: 154px !important;
    }

    .avelle-multikart-collection .filter-btn {
        background: var(--avl-bg);
        border: 1px solid var(--avl-line-2);
        border-radius: 8px;
        color: var(--avl-ink);
        flex: 0 0 auto;
        min-height: 40px;
        padding: 0 14px;
        text-transform: none;
        width: auto !important;
    }
}
