div:not(.category-description-bottom)>.magezon-builder {
    max-width: none;
    font-size: .875em;
    line-height: 1.75;
}
.mgz-element-inner {
    height: 100%;
    position: relative;
}
.mgz-parallax .mgz-parallax-inner {
    background-repeat: no-repeat;
}
.mgz-parallax-inner {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

/* ==========================================================================
   USP Slider (header + footer)
   ==========================================================================
   !important is required here: this is inlined critical CSS that must
   override Tailwind utilities loaded async. Without it, the USP items
   flash visible before the slider initializes (CLS / layout shift).
   Alpine toggles .usp-visible on the active item.
   ========================================================================== */
@media (max-width: 639px) {
    .info-links {
        display: block !important;
        height: 24px;
        overflow: hidden;
    }
    .info-links > div {
        display: none !important;
    }
    .info-links > div.usp-visible {
        display: flex !important;
        justify-content: center;
        align-items: center;
        height: 100%;
        animation: slideUp 0.3s ease-out;
    }
}

@keyframes slideUp {
    from { opacity: 0; transform: translateY(100%); }
    to { opacity: 1; transform: translateY(0); }
}

@media (min-width: 640px) {
    .info-links > .links3 {
        display: none !important;
    }
}

@media (min-width: 1280px) {
    .info-links > .links3 {
        display: flex !important;
    }
}

/* Footer USP even distribution on SM+ */
@media (min-width: 640px) {
    footer .info-links > div {
        flex: 1;
        justify-content: center;
    }
}

/* ==========================================================================
   Spacing system
   ==========================================================================
   One pattern for all full-bleed content (Magezon, Hub CMS, category desc):
   1. Parent .columns loses max-width (via body class in structure.css)
   2. Full-bleed element negates .columns padding with negative margin
   3. Contained content re-adds max-width + padding via its own container

   No width:100vw anywhere — avoids the scrollbar-width overflow issue.
   ========================================================================== */

/* Site spacing variables */
:root {
    --site-max-width: 1280px;
    --site-padding: 0.5rem;
}

@media (min-width: 768px) {
    :root {
        --site-padding: 1rem;
    }
}

/* Container and column padding */
.container,
.columns {
    padding-left: var(--site-padding);
    padding-right: var(--site-padding);
}

/* Horizontal scroll prevention (safety net) */
.page-wrapper {
    overflow-x: clip;
}

/* ── Full-bleed pattern ─────────────────────────────────────────────
 * Negates .columns padding to reach the viewport edge.
 * Works because structure.css removes .columns max-width for:
 *   - page-main-full-width (Hub CMS pages)
 *   - page-layout-cms-full-width (Magezon CMS pages)
 *   - product-main-full-width (product pages)
 */
.rrc-content--page,
.page-layout-cms-full-width .full_width_row,
.page-layout-1column .category-description-bottom {
    margin-left: calc(-1 * var(--site-padding));
    margin-right: calc(-1 * var(--site-padding));
}

/* Reset full-bleed inside Magezon contained elements */
.contained .full_width_row {
    margin-left: 0;
    margin-right: 0;
}

/* ── Contained content pattern ──────────────────────────────────────
 * Re-adds max-width + padding for content that shouldn't be full-bleed.
 */
.rrc-container,
.page-layout-cms-full-width .full_width_row > .mgz-element-inner {
    max-width: var(--site-max-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--site-padding);
    padding-right: var(--site-padding);
}

/* Magezon contained rows */
.contained.mgz-container {
    max-width: calc(var(--site-max-width) - var(--site-padding) * 2);
    margin-left: auto;
    margin-right: auto;
}

/* Magezon default: full_width_row stays within container */
.full_width_row {
    width: 100%;
}

button[aria-expanded="true"] .mega-menu-chevron {
    transform: rotate(180deg);
}

@media (min-width: 1024px) {
    .product-description [data-role="product-description-content"] {
        max-height: none !important;
        overflow: visible !important;
    }

    .product-description [data-role="product-description-fade"],
    .product-description [data-role="product-description-toggle"] {
        display: none !important;
    }
}

@media (min-width: 1024px) {
    #cross-sell-list [data-role="bundle-deal-list"] {
        margin-top: -1.25rem;
    }
}

#cross-sell-list [data-role="bundle-main-hero"] {
    align-items: end;
    display: grid;
    gap: 0;
    grid-template-columns: 8rem minmax(0, 1fr);
    margin-top: -0.5rem;
}

#cross-sell-list [data-role="bundle-main-image"] {
    justify-content: flex-start;
    min-height: 10rem;
    transform: translateY(0.5rem);
}

#cross-sell-list [data-role="bundle-main-image"] img {
    max-height: 10rem;
}

#cross-sell-list [data-role="bundle-main-info"] {
    transform: translateY(-0.5rem);
}

#cross-sell-list [data-role="bundle-deal-card"] {
    grid-template-columns: 7.5rem minmax(0, 1fr);
    min-height: 9rem;
    padding: 1rem;
}

#cross-sell-list [data-role="bundle-deal-list"] {
    margin-left: 0.5rem;
}

#cross-sell-list [data-role="bundle-card-media"] {
    align-content: start;
    flex-direction: column;
    gap: 0.75rem;
    min-height: 10rem;
}

#cross-sell-list [data-role="bundle-card-media"] img {
    max-height: 7.5rem;
}

#cross-sell-list [data-role="bundle-card-actions"] {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 1fr);
}

#cross-sell-list [data-role="bundle-card-edit-panel"] {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
}

#cross-sell-list [data-role="bundle-card-buy-panel"] {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
}

@media (min-width: 640px) {
    #cross-sell-list [data-role="bundle-deal-list"] {
        margin-left: 0;
    }

    #cross-sell-list [data-role="bundle-main-hero"] {
        align-items: end;
        grid-template-columns: 11rem minmax(0, 1fr);
        gap: 0;
    }

    #cross-sell-list [data-role="bundle-main-image"] {
        min-height: 13rem;
        justify-content: flex-start;
        transform: translateY(0.75rem);
    }

    #cross-sell-list [data-role="bundle-main-image"] img {
        max-height: 13rem;
    }

    #cross-sell-list [data-role="bundle-main-info"] {
        transform: translateY(-0.75rem);
    }

    #cross-sell-list [data-role="bundle-deal-card"] {
        grid-template-columns: 9rem minmax(0, 1fr);
        min-height: 13rem;
    }

    #cross-sell-list [data-role="bundle-card-actions"] {
        display: grid;
        gap: 0.75rem;
        grid-template-columns: minmax(0, 1fr) 13.5rem;
    }

    #cross-sell-list [data-role="bundle-card-edit-panel"] {
        grid-column: 1;
        grid-row: auto;
        justify-self: stretch;
    }

    #cross-sell-list [data-role="bundle-card-media"] {
        align-content: normal;
        flex-direction: row;
        gap: 0;
        min-height: 11rem;
    }

    #cross-sell-list [data-role="bundle-card-media"] img {
        max-height: 11rem;
    }

    #cross-sell-list [data-role="bundle-card-buy-panel"] {
        grid-column: 2;
        grid-row: auto;
        width: 13.5rem;
    }
}
