/*
Theme Name: Starter Child
Theme URI: https://studiokreacja.pl/
Description: Motyw potomny dla motywu Starter. Zmiany wyglądu karty produktu są rozwijane wyłącznie tutaj.
Author: Studio Kreacja / Mag-Instal 24
Template: starter
Version: 1.10.36
Text Domain: starter-child
*/

:root {
    --site-container-max-width: 1312px;
    --product-story-text: #1d1d1b;
    --product-story-muted: #686864;
    --product-story-soft: #f7f7f5;
    --product-story-brand: #f4d514;
    /* Matches the existing .Container used by the product hero. */
    --product-story-max-width: var(--site-container-max-width);
    /* Figma: two ~600 px columns inside 1312 px, separated by ~112 px. */
    --product-story-column-gap: clamp(4rem, 5.835vw, 7rem);
}

/* Every editorial page uses the same parent geometry as the header Container.
 * This also overrides the narrower parent-theme limit on single-post content. */
.PageContent.Container {
    max-width: var(--site-container-max-width);
    overflow-x: clip;
}

.PageContent.Container > * {
    width: 100%;
    max-width: 100%;
}

/* The page-level container owns the horizontal geometry. Containers emitted
 * by individual Gutenberg/ACF blocks inherit that width without adding a
 * second max-width or another pair of gutters. */
.PageContent.Container .Container {
    max-width: 100%;
    padding-right: 0;
    padding-left: 0;
}

.home .HomeContent .basic-slider {
    width: 100%;
    max-width: 100%;
}

/* Keep every home block in the shared 1312 px grid, but continue the soft
 * section surfaces to both viewport edges. These are the three Kadence
 * sections whose inner columns own #fafafa on page 72, plus the native
 * "Ostatnio oglądane" section using the same utility colour. */
body.home {
    overflow-x: clip;
}

.home .HomeContent {
    overflow-x: visible;
}

.home .HomeContent > .kadence-column72_68a5cf-d2,
.home .HomeContent > .kadence-column72_f8c4b1-2f,
.home .HomeContent > .kadence-column72_48646c-d5,
.home .HomeContent > [class*="bg-[#FAFAFA]"] {
    position: relative;
    isolation: isolate;
}

.home .HomeContent > .kadence-column72_68a5cf-d2::before,
.home .HomeContent > .kadence-column72_f8c4b1-2f::before,
.home .HomeContent > .kadence-column72_48646c-d5::before,
.home .HomeContent > [class*="bg-[#FAFAFA]"]::before {
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100vw;
    background-color: #fafafa;
    content: "";
    pointer-events: none;
    transform: translateX(-50%);
}

.home .HomeContent .basic-slider .swiper-slide-inner {
    background-size: 50% auto;
}

@media (min-width: 768px) {
    .home .HomeContent .basic-slider .swiper-slide-inner > .Container {
        padding-right: clamp(2rem, 8.5366%, 7rem);
        padding-bottom: 3rem;
        padding-left: clamp(2rem, 8.5366%, 7rem);
    }

    .home .HomeContent .basic-slider .swiper-navigation-container {
        right: clamp(2rem, 8.5366%, 7rem);
        bottom: 3rem;
    }
}

.home .HomeContent > .wp-block-kadence-column:has(.trentaContent) > .kt-inside-inner-col {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    column-gap: clamp(2rem, 5.835vw, 7rem);
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 4rem 0 0;
    overflow: hidden;
}

.home .HomeContent > .wp-block-kadence-column:has(.trentaContent) > .kt-inside-inner-col > * {
    min-width: 0;
}

.home .HomeContent > .wp-block-kadence-column:has(.trentaContent) .trentaContent {
    position: static;
    top: auto;
    left: auto;
    width: 100%;
    max-width: 568px;
    margin: 0;
    padding: 0;
    transform: none;
    justify-self: start;
}

.home .HomeContent > .wp-block-kadence-column:has(.trentaContent) > .kt-inside-inner-col > figure.wp-block-kadence-image {
    width: 100%;
    max-width: 600px;
    margin: 0;
    overflow: hidden;
    justify-self: end;
}

.home .HomeContent > .wp-block-kadence-column:has(.trentaContent) > .kt-inside-inner-col > figure.wp-block-kadence-image img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
}

@media (min-width: 900px) {
    .home .HomeContent > .wp-block-kadence-column:has(.trentaContent) > .kt-inside-inner-col {
        padding-top: 2rem;
    }

    .home .HomeContent > .wp-block-kadence-column:has(.trentaContent) > .kt-inside-inner-col > figure.wp-block-kadence-image {
        height: clamp(420px, 38vw, 520px);
    }

    .home .HomeContent > .wp-block-kadence-column:has(.trentaContent) > .kt-inside-inner-col > figure.wp-block-kadence-image img {
        height: 100%;
        object-fit: cover;
        object-position: center top;
    }
}

/* Keep the exact 1.10.20 archive geometry. Only the page canvas inherits the
 * same #fafafa surface that the full-width ArchiveProduct had in 1.10.19. */
body.tax-product_cat {
    background-color: #fafafa;
    overflow-x: clip;
}

.tax-product_cat .ArchiveProduct {
    width: 100%;
    max-width: var(--site-container-max-width);
    margin-right: auto;
    margin-left: auto;
    overflow-x: visible;
}

.tax-product_cat .ArchiveProduct > * {
    width: 100%;
    max-width: 100%;
}

.tax-product_cat .ArchiveProduct .woocommerce-products-header {
    max-width: 100%;
}

/* Paint the catalogue/contact bands outside the constrained archive without
 * changing or clipping the width and position of any inner element. */
.tax-product_cat .ArchiveProduct > .bg-light,
.tax-product_cat .ArchiveProduct .site-main > .bg-light,
.tax-product_cat .ArchiveProduct > [class*="bg-[#F8F8FA]"] {
    position: relative;
    isolation: isolate;
    background-color: #f8f8fa;
}

.tax-product_cat .ArchiveProduct > .bg-light::before,
.tax-product_cat .ArchiveProduct .site-main > .bg-light::before,
.tax-product_cat .ArchiveProduct > [class*="bg-[#F8F8FA]"]::before {
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100vw;
    background-color: #f8f8fa;
    content: "";
    pointer-events: none;
    transform: translateX(-50%);
}

/* The parent theme changes its catalogue and recommended-products layouts at
 * 1024 px, although their desktop columns only have enough room from the next
 * 1280 px breakpoint. Keep the tablet composition through that transition:
 * filters stay above the catalogue, products use two readable columns and the
 * Home recommendation slider receives the whole shared container. */
@media (min-width: 1024px) and (max-width: 1279px) {
    .tax-product_cat .ArchiveProduct__container.show-filters {
        flex-direction: column;
        gap: 3rem;
    }

    .tax-product_cat .ArchiveProduct__sidebar {
        width: 100%;
        min-width: 0;
    }

    .tax-product_cat .ArchiveProduct__container.show-filters .ArchiveContainer__content,
    .tax-product_cat .ArchiveProduct__container.show-filters .products {
        width: 100%;
        min-width: 0;
    }

    .tax-product_cat .ArchiveProduct .products.columns-3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home .RecommendedProducts {
        flex-direction: column;
        align-items: stretch;
        column-gap: 0;
    }

    .home .RecommendedProducts > .lg\:max-w-\[320px\] {
        width: 100%;
        max-width: none;
    }

    .home .RecommendedProducts .products-recommended-slider {
        width: 100%;
        min-width: 0;
    }
}

.PrefooterMedia {
    width: 100%;
    height: min(16.6667vw, 320px);
    overflow: hidden;
    background: #1d1d1b;
}

.PrefooterMedia__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

@media (max-width: 899px) {
    .home .HomeContent > .wp-block-kadence-column:has(.trentaContent) > .kt-inside-inner-col {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 2rem;
    }

    .home .HomeContent > .wp-block-kadence-column:has(.trentaContent) .trentaContent,
    .home .HomeContent > .wp-block-kadence-column:has(.trentaContent) > .kt-inside-inner-col > figure.wp-block-kadence-image {
        max-width: 568px;
        justify-self: center;
    }
}

/* Dynamic product-category mega menus. Regały work immediately and other
 * configured parent categories (including Akcesoria) become expandable when
 * WooCommerce contains direct child categories. */
.RacksMegaMenu__toggle {
    cursor: pointer;
}

.RacksMegaMenu__chevron {
    width: 10px;
    height: 6px;
    margin-left: 2px;
    transition: transform 180ms ease;
}

.RacksMegaMenu__toggle > img:first-child {
    transition: none;
}

.Navigation__item--categoryMenu.is-open .RacksMegaMenu__toggle {
    color: #1d1d1b;
}

.Navigation__item--categoryMenu.is-open .RacksMegaMenu__chevron {
    transform: rotate(180deg);
}

.Navigation__item--categoryMenu.is-open .RacksMegaMenu__toggle > img:first-child {
    filter: brightness(0) saturate(100%) invert(84%) sepia(95%) saturate(1042%) hue-rotate(348deg) brightness(100%) contrast(92%);
}

/* Global WooCommerce product filters.
 * BeRocket still owns the live values and AJAX filtering. The child theme
 * presents that single dynamic source as a left desktop side panel and a
 * focused mobile drawer without duplicating inputs or hard-coding terms. */
.ArchiveProduct .ArchiveProduct__container.show-filters {
    position: relative;
    z-index: 2;
    flex-direction: column;
    gap: 0;
}

.ArchiveProduct .ArchiveProduct__sidebar,
.ArchiveProduct .ArchiveContainer__content {
    width: 100%;
    min-width: 0;
}

.ProductFilters {
    position: relative;
    z-index: 40;
    margin-bottom: 2rem;
}

.ProductFilters__toolbar {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #ecece8;
}

.ProductFilters__trigger,
.ProductFilters .bapf_head,
.ProductFilters .orderby {
    min-height: 3.25rem;
    border: 1px solid transparent;
    border-radius: 0.75rem;
    background-color: #fff;
    color: #1d1d1b;
    box-shadow: none;
    font-family: inherit;
    font-size: 0.875rem;
    font-weight: 600;
}

.ProductFilters__trigger {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    padding: 0 1rem;
    cursor: pointer;
}

.ProductFilters__trigger:hover,
.ProductFilters__trigger:focus-visible,
.ProductFilters .bapf_head:hover,
.ProductFilters .bapf_head:focus-visible,
.ProductFilters .berocket_single_filter_widget.is-open .bapf_head {
    border-color: #e8ca22;
    outline: none;
}

.ProductFilters__trigger img {
    width: 1.125rem;
    height: 1.125rem;
    margin: 0;
}

.ProductFilters__activeCount,
.ProductFilters__groupCount {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 0.35rem;
    border-radius: 999px;
    background: #e8ca22;
    color: #1d1d1b;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1;
}

.ProductFilters__activeCount[hidden],
.ProductFilters__groupCount[hidden] {
    display: none !important;
}

.ProductFilters__panel {
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 0;
}

.ProductFilters__panelHeader {
    display: contents;
}

.ProductFilters__panelContent {
    order: 1;
    flex: 1 1 auto;
}

.ProductFilters__reset {
    order: 2;
}

.ProductFilters__panelTitle,
.ProductFilters__close,
.ProductFilters__panelFooter,
.ProductFilters__backdrop {
    display: none;
}

.ProductFilters__panelContent {
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.ProductFilters__panelContent::-webkit-scrollbar {
    display: none;
}

.ProductFilters .FiltersContainer {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.ProductFilters .FiltersContainer > .berocket_single_filter_widget,
.ProductFilters .FiltersContainer > div {
    position: relative;
    flex: 0 0 auto;
    margin: 0;
}

.ProductFilters .bapf_sfilter {
    margin: 0;
}

.ProductFilters .bapf_head {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 2rem 0.75rem 0.75rem;
    cursor: pointer;
    white-space: nowrap;
}

.ProductFilters .bapf_head::after {
    position: absolute;
    top: 50%;
    right: 0.75rem;
    width: 0.625rem;
    height: 0.375rem;
    background: url("dist/images/icons/ui/chevron-down.svg") center / contain no-repeat;
    content: "";
    transform: translateY(-50%);
    transition: transform 160ms ease;
}

.ProductFilters .is-open .bapf_head::after {
    transform: translateY(-50%) rotate(180deg);
}

.ProductFilters .bapf_head h3 {
    margin: 0;
    color: inherit;
    font: inherit;
}

.ProductFilters .bapf_body {
    position: fixed;
    z-index: 1002;
    top: var(--product-filter-popover-top, 0);
    left: var(--product-filter-popover-left, 0);
    display: none;
    width: min(21.25rem, calc(100vw - 2rem));
    max-height: min(26rem, calc(100vh - var(--product-filter-popover-top, 0px) - 1rem));
    padding: 1rem;
    overflow-y: auto;
    border: 1px solid #ecece8;
    border-radius: 0.875rem;
    background: #fff;
    box-shadow: 0 1.125rem 3rem rgba(29, 29, 27, 0.14);
}

.ProductFilters .berocket_single_filter_widget.is-open .bapf_body {
    display: block;
}

.ProductFilters .bapf_body ul {
    display: grid;
    align-items: stretch;
    gap: 0;
    margin: 0;
    padding: 0;
}

.ProductFilters .bapf_body li {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 2.75rem;
    margin: 0;
    padding: 0.25rem 0;
    border-bottom: 1px solid #f1f1ee;
    list-style: none;
}

.ProductFilters .bapf_body li:last-child {
    border-bottom: 0;
}

.ProductFilters .bapf_ckbox.bapf_hideckbox .bapf_body input[type="checkbox"],
.ProductFilters .bapf_body input[type="checkbox"] {
    appearance: auto;
    display: block !important;
    flex: 0 0 auto;
    width: 1.125rem;
    height: 1.125rem;
    margin: 0 !important;
    accent-color: #e8ca22;
    cursor: pointer;
}

.ProductFilters .FiltersContainer .bapf_body li label,
.ProductFilters .FiltersContainer .bapf_body li:hover label,
.ProductFilters .FiltersContainer .bapf_body li.checked label {
    flex: 1 1 auto;
    margin: 0;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #686864 !important;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.35;
}

.ProductFilters .FiltersContainer .bapf_body li.checked label {
    color: #1d1d1b !important;
    font-weight: 650;
}

.ProductFilters__reset {
    position: absolute;
    top: calc(100% + 0.375rem);
    right: 0;
    flex: 0 0 auto;
    margin: 0;
}

.ProductFilters.has-active-filters {
    margin-bottom: 3.5rem;
}

.ProductFilters__reset .berocket_single_filter_widget,
.ProductFilters__reset .bapf_sfilter,
.ProductFilters__reset .bapf_body {
    position: static;
    display: block;
    width: auto;
    max-height: none;
    margin: 0;
    padding: 0 !important;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.ProductFilters__reset .bapf_rst_sel {
    display: none !important;
}

.ProductFilters.has-active-filters .ProductFilters__reset .bapf_rst_sel {
    display: block !important;
}

.ProductFilters__reset .bapf_button {
    appearance: none;
    padding: 0.65rem 0.25rem !important;
    border: 0 !important;
    background: transparent !important;
    color: #8f7d00 !important;
    cursor: pointer;
    font-family: inherit;
    font-size: 0.75rem !important;
    font-weight: 650;
    white-space: nowrap;
}

.ProductFilters__sortSlot {
    min-width: 12rem;
}

.ProductFilters__sortSlot .woocommerce-ordering,
.ProductFilters__sortSlot .orderby {
    width: 100%;
    margin: 0;
}

.ProductFilters .orderby {
    padding: 0.75rem 2.75rem 0.75rem 1rem;
    background-position-x: calc(100% - 1rem);
    font-size: 0.875rem;
}

.ProductFilters__orderingOrigin {
    display: none !important;
}

html.is-product-filters-open,
html.is-product-filters-open body {
    overflow: hidden;
}

@media (max-width: 1279px) {
    .ProductFilters {
        z-index: 80;
        margin-bottom: 1.5rem;
    }

    .ProductFilters__toolbar {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 0.75rem;
        padding-bottom: 1.25rem;
    }

    .ProductFilters__trigger {
        width: 100%;
    }

    .ProductFilters__sortSlot {
        min-width: 0;
    }

    .ProductFilters__panel {
        position: fixed;
        z-index: 1001;
        top: 0;
        right: 0;
        bottom: 0;
        display: grid;
        grid-template-rows: auto minmax(0, 1fr) auto;
        align-items: stretch;
        width: min(26rem, 100%);
        background: #fff;
        box-shadow: -1rem 0 3rem rgba(29, 29, 27, 0.16);
        visibility: hidden;
        pointer-events: none;
        transform: translateX(100%);
        transition: transform 220ms ease, visibility 220ms step-end;
    }

    .ProductFilters.is-panel-open .ProductFilters__panel {
        visibility: visible;
        pointer-events: auto;
        transform: translateX(0);
        transition: transform 220ms ease, visibility 0ms step-start;
    }

    .ProductFilters__panelHeader {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto auto;
        align-items: center;
        gap: 0.75rem;
        min-height: 4.75rem;
        padding: 1rem 1.25rem;
        border-bottom: 1px solid #ecece8;
    }

    .ProductFilters__panelTitle {
        display: inline-flex;
        align-items: center;
        gap: 0.625rem;
        font-size: 1.125rem;
        font-weight: 650;
    }

    .ProductFilters__panelTitle img {
        width: 1rem;
        height: 1rem;
        margin: 0;
    }

    .ProductFilters__close {
        appearance: none;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 2.5rem;
        height: 2.5rem;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: #f7f7f5;
        cursor: pointer;
    }

    .ProductFilters__close svg {
        width: 0.75rem;
        height: 0.75rem;
    }

    .ProductFilters__close svg path {
        fill: #1d1d1b;
    }

    .ProductFilters__panelContent {
        order: initial;
        min-height: 0;
        padding: 0 1.25rem;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .ProductFilters .FiltersContainer {
        display: block;
    }

    .ProductFilters .FiltersContainer > .berocket_single_filter_widget {
        border-bottom: 1px solid #ecece8;
    }

    .ProductFilters .bapf_head {
        min-height: 4rem;
        padding: 1rem 2.25rem 1rem 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        font-size: 0.875rem;
        text-transform: uppercase;
    }

    .ProductFilters .bapf_head:hover,
    .ProductFilters .bapf_head:focus-visible,
    .ProductFilters .berocket_single_filter_widget.is-open .bapf_head {
        border-color: transparent;
    }

    .ProductFilters .bapf_head::after {
        right: 0.25rem;
    }

    .ProductFilters .bapf_body {
        position: static;
        width: auto;
        max-height: none;
        padding: 0 0 1rem;
        overflow: visible;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .ProductFilters .bapf_body li {
        min-height: 2.875rem;
    }

    .ProductFilters__reset {
        position: static;
        order: initial;
        margin-left: 0;
    }

    .ProductFilters.has-active-filters {
        margin-bottom: 1.5rem;
    }

    .ProductFilters__reset .bapf_button {
        color: #8f7d00 !important;
    }

    .ProductFilters__panelFooter {
        display: block;
        padding: 1rem 1.25rem max(1rem, env(safe-area-inset-bottom));
        border-top: 1px solid #ecece8;
        background: #fff;
    }

    .ProductFilters__apply {
        appearance: none;
        width: 100%;
        min-height: 3.5rem;
        padding: 0.875rem 1.25rem;
        border: 0;
        border-radius: 999px;
        background: #e8ca22;
        color: #1d1d1b;
        cursor: pointer;
        font-family: inherit;
        font-size: 0.9375rem;
        font-weight: 700;
    }

    .ProductFilters__backdrop {
        appearance: none;
        position: fixed;
        z-index: 1000;
        inset: 0;
        display: block;
        padding: 0;
        border: 0;
        background: rgba(29, 29, 27, 0.42);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 220ms ease, visibility 220ms step-end;
    }

    .ProductFilters.is-panel-open .ProductFilters__backdrop {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition: opacity 220ms ease, visibility 0ms step-start;
    }
}

@media (max-width: 479px) {
    .ProductFilters__toolbar {
        gap: 0.5rem;
    }

    .ProductFilters__trigger,
    .ProductFilters .orderby {
        min-height: 3rem;
        font-size: 0.8125rem;
    }

    .ProductFilters__trigger {
        padding: 0 0.75rem;
    }

    .ProductFilters .orderby {
        padding-right: 2rem;
        padding-left: 0.75rem;
        background-position-x: calc(100% - 0.75rem);
    }

    .ProductFilters__panel {
        width: 100%;
    }
}

/* Full desktop keeps the filters in their established left-hand position.
 * The visual language follows the reference side panel: one compact header,
 * collapsible categories and native checkbox rows. */
@media (min-width: 1280px) {
    .ArchiveProduct .ArchiveProduct__container.show-filters {
        flex-direction: row;
        align-items: flex-start;
        gap: 6rem;
    }

    .ArchiveProduct .ArchiveProduct__sidebar.ProductFilters {
        flex: 0 0 22.5rem;
        width: 22.5rem;
        min-width: 22.5rem;
        margin-top: var(--product-filters-desktop-offset, 0);
        margin-bottom: 0;
    }

    .ArchiveProduct .ArchiveContainer__content {
        flex: 1 1 auto;
        width: auto;
    }

    .ProductFilters__toolbar {
        display: block;
        padding-bottom: 0;
        border-bottom: 0;
    }

    .ProductFilters__trigger,
    .ProductFilters__sortSlot,
    .ProductFilters__close,
    .ProductFilters__panelFooter,
    .ProductFilters__backdrop {
        display: none;
    }

    .ProductFilters__panel {
        position: sticky;
        top: 1.5rem;
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        align-items: stretch;
        width: 100%;
        max-height: calc(100vh - 3rem);
        overflow: hidden;
        border: 1px solid #ecece8;
        border-radius: 1rem;
        background: #fff;
        box-shadow: 0 1rem 2.5rem rgba(29, 29, 27, 0.06);
        visibility: visible;
        pointer-events: auto;
        transform: none;
    }

    .ProductFilters__panelHeader {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 0.75rem;
        min-height: 4.75rem;
        padding: 1rem 1.25rem;
        border-bottom: 1px solid #ecece8;
    }

    .ProductFilters__panelTitle {
        display: inline-flex;
        align-items: center;
        gap: 0.625rem;
        font-size: 1rem;
        font-weight: 650;
    }

    .ProductFilters__panelTitle img {
        width: 1rem;
        height: 1rem;
        margin: 0;
    }

    .ProductFilters__panelContent {
        order: initial;
        min-height: 0;
        padding: 0 1.25rem;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .ProductFilters .FiltersContainer {
        display: block;
    }

    .ProductFilters .FiltersContainer > .berocket_single_filter_widget {
        border-bottom: 1px solid #ecece8;
    }

    .ProductFilters .FiltersContainer > .berocket_single_filter_widget:last-child {
        border-bottom: 0;
    }

    .ProductFilters .bapf_head {
        min-height: 4rem;
        padding: 1rem 2.25rem 1rem 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        font-size: 0.8125rem;
        text-transform: uppercase;
    }

    .ProductFilters .bapf_head:hover,
    .ProductFilters .bapf_head:focus-visible,
    .ProductFilters .berocket_single_filter_widget.is-open .bapf_head {
        border-color: transparent;
    }

    .ProductFilters .bapf_head::after {
        right: 0.25rem;
    }

    .ProductFilters .bapf_body {
        position: static;
        width: auto;
        max-height: none;
        padding: 0 0 1rem;
        overflow: visible;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .ProductFilters__reset {
        position: static;
        order: initial;
        margin: 0;
    }

    .ProductFilters.has-active-filters {
        margin-bottom: 0;
    }

    .ProductFilters__reset .bapf_button {
        padding-right: 0 !important;
        padding-left: 0 !important;
        font-size: 0.6875rem !important;
    }
}

.RacksMegaMenu[hidden] {
    display: none !important;
}

.RacksMegaMenu {
    color: #1d1d1b;
    background: #fff;
}

.RacksMegaMenu__close {
    appearance: none;
    display: block;
    margin: 0 0 0.75rem auto;
    border: 0;
    background: transparent;
    color: #686864;
    cursor: pointer;
    font: inherit;
    font-size: 0.8125rem;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.RacksMegaMenu__layout {
    display: grid;
    gap: 1.25rem;
}

.Navigation__item .RacksMegaMenu__category {
    color: #1d1d1b;
    text-decoration: none;
}

.RacksMegaMenu__categories {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
}

.RacksMegaMenu__category {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 4.25rem;
    padding: 0.9rem 1rem;
    border-bottom: 1px solid #e7e7e3;
    border-radius: 0;
    background: transparent;
    transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.RacksMegaMenu__categoryName {
    font-size: 0.875rem;
    font-weight: 650;
    line-height: 1.35;
}

.RacksMegaMenu__categoryCount {
    flex: 0 0 auto;
    color: #b59d00;
    font-size: 0.75rem;
    font-weight: 650;
    line-height: 1.3;
    transition: color 180ms ease;
}

.RacksMegaMenu__category.is-current {
    border-color: #f4d514;
    color: #1d1d1b;
}

.Navigation__item .RacksMegaMenu__category:hover,
.Navigation__item .RacksMegaMenu__category:focus-visible {
    border-color: #f4d514;
    border-radius: 0;
    color: #fff;
    background: #f4d514;
}

.RacksMegaMenu__category:hover .RacksMegaMenu__categoryCount,
.RacksMegaMenu__category:focus-visible .RacksMegaMenu__categoryCount {
    color: #fff;
}

.RacksMegaMenu__category:focus-visible,
.RacksMegaMenu__toggle:focus-visible,
.RacksMegaMenu__close:focus-visible {
    outline: 3px solid rgba(244, 213, 20, 0.55);
    outline-offset: 3px;
}

/* Header navigation already provides category entry points. Do not repeat
 * them as the legacy WooCommerce category carousel on any category archive. */
.tax-product_cat .archive-categories-slider {
    display: none !important;
}

@media (min-width: 1025px) {
    .Header__menu {
        position: relative;
    }

    .Navigation__item--categoryMenu {
        position: static !important;
    }

    .Navigation__item--categoryMenu.is-open .RacksMegaMenu__toggle {
        box-shadow: none;
    }

    .RacksMegaMenu {
        position: absolute;
        z-index: 60;
        top: 100%;
        right: 0;
        left: var(--product-category-menu-start, 0);
        width: auto;
        padding-top: 0;
        padding-right: clamp(1.5rem, 2.2vw, 2.25rem);
        padding-bottom: clamp(1.5rem, 2.2vw, 2.25rem);
        padding-left: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .RacksMegaMenu__close {
        display: none;
    }

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

    .RacksMegaMenu__categories {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: clamp(2rem, 3vw, 3.5rem);
    }

}

@media (min-width: 1280px) {
    .RacksMegaMenu__categories {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1024px) {
    .Header__menu.Header__menu--active {
        overflow-x: hidden;
        overflow-y: auto;
    }

    body.product-category-mega-menu-open .Header__menu .Navigation {
        justify-content: flex-start;
        min-height: 100%;
        height: auto;
        padding-top: 7rem;
        padding-bottom: 2.5rem;
    }

    .Navigation__item--categoryMenu {
        width: 100%;
    }

    .RacksMegaMenu {
        margin-top: 1.25rem;
        padding: 1.25rem;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

}

@media (prefers-reduced-motion: reduce) {
    .RacksMegaMenu__toggle > img:first-child,
    .RacksMegaMenu__chevron,
    .RacksMegaMenu__category {
        transition: none;
    }
}

/* Defensive fallback: the parent theme previously rendered product tabs
 * directly inside the purchase summary, beside the add-to-cart form. */
.single-product .SingleProductContainer__top .WoocommerceTabs,
.single-product .SingleProductContainer__top .woocommerce-tabs,
.single-product .SingleProductContainer__top .wc-tabs-wrapper {
    display: none !important;
}

/* Close the add-to-cart control into one rounded panel: the quantity row owns
 * the top corners, while the yellow submit button keeps the bottom corners. */
.single-product .SingleProductContainer .qty-section {
    border-radius: 28px 28px 0 0 !important;
}

.single-product .SingleProductContainer .qty-wrapper .increase-qty.is-disabled,
.single-product .SingleProductContainer .qty-wrapper .decrease-qty.is-disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

/* The visible minus/plus controls own quantity changes. Keep the semantic
 * number input (and its numeric keyboard) but remove browser-native steppers. */
.single-product .SingleProductContainer .qty-wrapper input[type="number"] {
    appearance: textfield;
    -moz-appearance: textfield;
}

.single-product .SingleProductContainer .qty-wrapper input[type="number"]::-webkit-inner-spin-button,
.single-product .SingleProductContainer .qty-wrapper input[type="number"]::-webkit-outer-spin-button {
    margin: 0;
    -webkit-appearance: none;
}

@media (max-width: 899px) {
    .single-product .SingleProductContainer .qty-section,
    .single-product .SingleProductContainer form.cart .single_add_to_cart_button {
        box-sizing: border-box;
        width: 100%;
        min-height: 84px;
    }

    .single-product .SingleProductContainer .qty-section {
        margin-bottom: 0;
    }

    .single-product .SingleProductContainer form.cart .single_add_to_cart_button {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .single-product .SingleProductContainer .qty-section .qty-wrapper {
        display: grid;
        grid-template-columns: 44px 45px 44px;
        align-items: center;
        column-gap: 14px;
    }

    .single-product .SingleProductContainer .qty-section .qty-wrapper .increase-qty,
    .single-product .SingleProductContainer .qty-section .qty-wrapper .decrease-qty {
        width: 44px;
        height: 44px;
        min-width: 44px;
        touch-action: manipulation;
    }

    .single-product .SingleProductContainer .qty-section .qty-wrapper .decrease-qty {
        margin-right: 0;
        background-color: #fff;
    }

    .single-product .SingleProductContainer .qty-section .qty-wrapper .quantity,
    .single-product .SingleProductContainer .qty-section .qty-wrapper input.qty {
        width: 45px;
        max-width: 45px;
        margin: 0;
    }

    .single-product .SingleProductContainer .qty-section .qty-wrapper input.qty {
        display: block;
        text-align: center;
    }
}

/* The parent theme adds vertical padding around gallery thumbnails. Keep the
 * large product image untouched, but let every thumbnail bitmap own the full
 * square tile on desktop and mobile. */
.SingleProductContainer__gallery .single-product-slider-thumbnails .swiper-thumbnail {
    aspect-ratio: 1 / 1;
    padding: 0;
    border: 0;
    overflow: hidden;
}

.SingleProductContainer__gallery .single-product-slider-thumbnails .ProductGalleryThumbnail__image {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0;
    object-fit: cover;
}

.ProductContactCta {
    background: #fafafa;
    padding-block: 3rem;
}

@media (min-width: 768px) {
    .ProductContactCta {
        padding-block: 6rem;
    }
}

.ProductStory {
    color: var(--product-story-text);
    background: #fff;
    padding-block: clamp(3.75rem, 8vw, 7rem);
    overflow: hidden;
    overflow: clip;
}

.ProductStoryDescription,
.ProductStorySection {
    padding-inline: 1rem;
}

.ProductStoryDescription__content {
    width: 100%;
    max-width: 58rem;
    margin-inline: auto;
    color: var(--product-story-muted);
    font-size: clamp(0.9375rem, 0.9rem + 0.2vw, 1rem);
    line-height: 1.68;
    overflow-wrap: anywhere;
}

.ProductStoryDescription__content > :first-child {
    margin-top: 0;
}

.ProductStoryDescription__content > :last-child {
    margin-bottom: 0;
}

.ProductStoryDescription__content h2,
.ProductStoryDescription__content h3,
.ProductStoryDescription__content h4 {
    margin-block: 1.4em 0.65em;
    color: var(--product-story-text);
    font-weight: 650;
    letter-spacing: -0.015em;
    line-height: 1.25;
    text-wrap: balance;
}

.ProductStoryDescription__content h2 {
    font-size: clamp(1.375rem, 1.15rem + 0.9vw, 1.75rem);
}

.ProductStoryDescription__content h3 {
    font-size: clamp(1.1875rem, 1.05rem + 0.55vw, 1.4375rem);
}

.ProductStoryDescription__content h4 {
    font-size: 1rem;
}

.ProductStoryDescription__content p,
.ProductStoryDescription__content ul,
.ProductStoryDescription__content ol,
.ProductStoryDescription__content figure,
.ProductStoryDescription__content blockquote {
    margin-block: 0 1rem;
}

.ProductStoryDescription__content ul,
.ProductStoryDescription__content ol {
    list-style-position: outside;
    padding-inline-start: 1.5rem;
}

.ProductStoryDescription__content ul {
    list-style-type: disc;
}

.ProductStoryDescription__content ol {
    list-style-type: decimal;
}

.ProductStoryDescription__content ul ul {
    list-style-type: circle;
}

.ProductStoryDescription__content ul ul ul {
    list-style-type: square;
}

.ProductStoryDescription__content ol ol {
    list-style-type: lower-alpha;
}

.ProductStoryDescription__content ol ol ol {
    list-style-type: lower-roman;
}

.ProductStoryDescription__content li {
    display: list-item;
    padding-inline-start: 0.125rem;
}

.ProductStoryDescription__content li > ul,
.ProductStoryDescription__content li > ol {
    margin-block: 0.4rem 0;
}

.ProductStoryDescription__content li + li {
    margin-top: 0.4rem;
}

.ProductStoryDescription__content img {
    max-width: 100%;
    height: auto;
}

.ProductStorySections {
    width: 100%;
}

.ProductStoryDescription + .ProductStorySections {
    margin-top: clamp(4rem, 8vw, 7rem);
}

.ProductStorySections:not(.ProductStorySections--masonry-ready) > .ProductStorySection:first-child {
    margin-top: var(--product-section-offset-y, 0px);
}

.ProductStorySections:not(.ProductStorySections--masonry-ready) > .ProductStorySection + .ProductStorySection {
    margin-top: calc(
        var(--product-story-row-gap, clamp(4.5rem, 8vw, 7.5rem))
        + var(--product-section-offset-y, 0px)
    );
}

.ProductStorySection__container {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(1.75rem, 6vw, 3rem);
    width: 100%;
    max-width: var(--product-story-max-width);
    margin-inline: auto;
}

.ProductStorySection--spacing-compact {
    --product-story-row-gap: clamp(3rem, 6vw, 5rem);
}

.ProductStorySection--spacing-standard {
    --product-story-row-gap: clamp(4.5rem, 8vw, 7.5rem);
}

.ProductStorySection--spacing-spacious {
    --product-story-row-gap: clamp(6rem, 10vw, 10rem);
}

.ProductStorySection--background-white {
    background: #fff;
}

.ProductStorySection--background-soft-gray {
    background: var(--product-story-soft);
    padding-block: clamp(2rem, 4vw, 3rem);
}

.ProductStorySection--background-brand-yellow {
    background: var(--product-story-brand);
    padding-block: clamp(2rem, 4vw, 3rem);
}

.ProductStoryColumn {
    min-width: 0;
}

/* Keep every column in the responsive document flow while allowing the
 * editor to position its complete contents with a small, reversible offset.
 * Positive Y consumes space above; negative Y is compensated below so the
 * following content cannot collide with the lifted column. */
.ProductStoryColumn__content {
    width: 100%;
    margin-top: max(var(--product-column-offset-y, 0px), 0px);
    margin-bottom: max(calc(var(--product-column-offset-y, 0px) * -1), 0px);
    transform: translate(
        var(--product-column-offset-x, 0px),
        min(var(--product-column-offset-y, 0px), 0px)
    );
}

.ProductStoryColumn--empty {
    display: none;
}

.ProductStoryColumn__text {
    width: 100%;
    max-width: 40rem;
}

.ProductStoryColumn__eyebrow {
    margin: 0 0 0.75rem;
    color: #8f7c00;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 1.4;
    text-transform: uppercase;
}

.ProductStoryColumn__heading {
    margin: 0;
    font-size: clamp(1.375rem, 1.15rem + 0.9vw, 1.75rem);
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.22;
    text-wrap: balance;
}

.ProductStoryColumn__body {
    margin-top: 1rem;
    color: var(--product-story-muted);
    font-size: clamp(0.9375rem, 0.9rem + 0.2vw, 1rem);
    line-height: 1.68;
    overflow-wrap: anywhere;
}

.ProductStoryColumn__text > .ProductStoryColumn__body:first-child {
    margin-top: 0;
}

.ProductStoryColumn__body > :first-child {
    margin-top: 0;
}

.ProductStoryColumn__body > :last-child {
    margin-bottom: 0;
}

.ProductStoryColumn__body p,
.ProductStoryColumn__body ul,
.ProductStoryColumn__body ol {
    margin-block: 0 1rem;
}

.ProductStoryColumn__body h2,
.ProductStoryColumn__body h3,
.ProductStoryColumn__body h4 {
    margin-block: 1.35em 0.65em;
    color: var(--product-story-text);
    font-weight: 650;
    letter-spacing: -0.015em;
    line-height: 1.25;
    text-wrap: balance;
}

.ProductStoryColumn__body h2 {
    font-size: clamp(1.375rem, 1.15rem + 0.9vw, 1.75rem);
}

.ProductStoryColumn__body h3 {
    font-size: clamp(1.1875rem, 1.05rem + 0.55vw, 1.4375rem);
}

.ProductStoryColumn__body h4 {
    font-size: 1rem;
}

.ProductStoryColumn__body ul,
.ProductStoryColumn__body ol {
    list-style-position: outside;
    padding-inline-start: 1.5rem;
}

.ProductStoryColumn__body ul {
    list-style-type: disc;
}

.ProductStoryColumn__body ol {
    list-style-type: decimal;
}

.ProductStoryColumn__body ul ul {
    list-style-type: circle;
}

.ProductStoryColumn__body ul ul ul {
    list-style-type: square;
}

.ProductStoryColumn__body ol ol {
    list-style-type: lower-alpha;
}

.ProductStoryColumn__body ol ol ol {
    list-style-type: lower-roman;
}

.ProductStoryColumn__body li {
    display: list-item;
    padding-inline-start: 0.125rem;
}

.ProductStoryColumn__body li > ul,
.ProductStoryColumn__body li > ol {
    margin-block: 0.4rem 0;
}

.ProductStoryColumn__body li + li {
    margin-top: 0.4rem;
}

.ProductStoryColumn__body strong {
    color: var(--product-story-text);
    font-weight: 650;
}

.ProductStoryColumn__link {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    margin-top: 1.5rem;
    padding: 0.7rem 1.15rem;
    border: 1px solid var(--product-story-text);
    border-radius: 999px;
    color: var(--product-story-text);
    font-size: 0.875rem;
    font-weight: 650;
    line-height: 1;
    text-decoration: none;
    transition: background-color 180ms ease, color 180ms ease, transform 180ms ease;
}

.ProductStoryColumn__link:hover,
.ProductStoryColumn__link:focus-visible {
    color: #fff;
    background: var(--product-story-text);
    transform: translateY(-1px);
}

.ProductStoryColumn__link:focus-visible {
    outline: 3px solid rgba(244, 213, 20, 0.75);
    outline-offset: 3px;
}

.ProductStoryColumn__figure {
    width: min(var(--product-image-width, 100%), 100%);
    max-width: min(var(--product-image-max-width, 44rem), 100%);
    margin-top: max(var(--product-image-offset-y, 0px), 0px);
    margin-bottom: max(calc(var(--product-image-offset-y, 0px) * -1), 0px);
    transform: translate(
        var(--product-image-offset-x, 0px),
        min(var(--product-image-offset-y, 0px), 0px)
    );
}

.ProductStoryColumn__media {
    width: 100%;
}

.ProductStoryColumn__image {
    display: block;
    width: 100%;
    height: auto;
}

.ProductStoryColumn__figure--contain .ProductStoryColumn__image {
    object-fit: contain;
}

.ProductStoryColumn__figure--cover .ProductStoryColumn__image {
    object-fit: cover;
}

.ProductStoryColumn__figure:not(.ProductStoryColumn__figure--ratio-natural) .ProductStoryColumn__media {
    overflow: hidden;
    background: var(--product-story-soft);
}

.ProductStoryColumn__figure:not(.ProductStoryColumn__figure--ratio-natural) .ProductStoryColumn__image {
    height: 100%;
}

.ProductStoryColumn__figure--ratio-1-1 .ProductStoryColumn__media {
    aspect-ratio: 1 / 1;
}

.ProductStoryColumn__figure--ratio-4-3 .ProductStoryColumn__media {
    aspect-ratio: 4 / 3;
}

.ProductStoryColumn__figure--ratio-3-4 .ProductStoryColumn__media {
    aspect-ratio: 3 / 4;
}

.ProductStoryColumn__figure--ratio-16-9 .ProductStoryColumn__media {
    aspect-ratio: 16 / 9;
}

.ProductStoryColumn__figure--anchor-top-left .ProductStoryColumn__image {
    object-position: left top;
}

.ProductStoryColumn__figure--anchor-top .ProductStoryColumn__image {
    object-position: center top;
}

.ProductStoryColumn__figure--anchor-top-right .ProductStoryColumn__image {
    object-position: right top;
}

.ProductStoryColumn__figure--anchor-left .ProductStoryColumn__image {
    object-position: left center;
}

.ProductStoryColumn__figure--anchor-center .ProductStoryColumn__image {
    object-position: center center;
}

.ProductStoryColumn__figure--anchor-right .ProductStoryColumn__image {
    object-position: right center;
}

.ProductStoryColumn__figure--anchor-bottom-left .ProductStoryColumn__image {
    object-position: left bottom;
}

.ProductStoryColumn__figure--anchor-bottom .ProductStoryColumn__image {
    object-position: center bottom;
}

.ProductStoryColumn__figure--anchor-bottom-right .ProductStoryColumn__image {
    object-position: right bottom;
}

.ProductStoryColumn__caption {
    margin-top: 0.75rem;
    color: var(--product-story-muted);
    font-size: 0.8125rem;
    line-height: 1.5;
}

@media (min-width: 900px) {
    .ProductStorySection__container {
        gap: var(--product-story-column-gap);
    }

    .ProductStorySection--layout-50-50 .ProductStorySection__container {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ProductStorySection--layout-40-60 .ProductStorySection__container {
        grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
    }

    .ProductStorySection--layout-60-40 .ProductStorySection__container {
        grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    }

    .ProductStorySection--direction-vertical .ProductStorySection__container {
        grid-template-columns: minmax(0, 1fr);
    }

    .ProductStorySection--direction-vertical .ProductStoryColumn {
        width: 100%;
    }

    .ProductStorySection--order-reverse .ProductStoryColumn--left {
        order: 2;
    }

    .ProductStorySection--order-reverse .ProductStoryColumn--right {
        order: 1;
    }

    .ProductStorySection--align-start .ProductStorySection__container {
        align-items: start;
    }

    .ProductStorySection--align-center .ProductStorySection__container {
        align-items: center;
    }

    .ProductStorySection--align-end .ProductStorySection__container {
        align-items: end;
    }

    .ProductStoryColumn--empty {
        display: block;
    }

    .ProductStoryColumn--left .ProductStoryColumn__text,
    .ProductStoryColumn--left .ProductStoryColumn__figure {
        margin-right: auto;
        margin-left: 0;
    }

    .ProductStoryColumn--right .ProductStoryColumn__text,
    .ProductStoryColumn--right .ProductStoryColumn__figure {
        margin-right: 0;
        margin-left: auto;
    }

    .ProductStoryColumn .ProductStoryColumn__figure--align-left {
        margin-right: auto;
        margin-left: 0;
    }

    .ProductStoryColumn .ProductStoryColumn__figure--align-center {
        margin-right: auto;
        margin-left: auto;
    }

    .ProductStoryColumn .ProductStoryColumn__figure--align-right {
        margin-right: 0;
        margin-left: auto;
    }

    /* Progressive masonry enhancement. Until the script adds the ready class,
     * these sections keep the regular two-column row layout above. */
    .ProductStorySections--weave.ProductStorySections--masonry-ready {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 1px;
        column-gap: var(--product-story-column-gap);
        width: 100%;
        max-width: var(--product-story-max-width);
        margin-inline: auto;
        padding-inline: 1rem;
    }

    .ProductStorySections--masonry-ready > .ProductStorySection:not(.ProductStorySection--direction-vertical),
    .ProductStorySections--masonry-ready > .ProductStorySection:not(.ProductStorySection--direction-vertical) > .ProductStorySection__container {
        display: contents;
    }

    .ProductStorySections--masonry-ready > .ProductStorySection--direction-vertical {
        grid-column: 1 / -1;
        align-self: start;
        transform: translateY(var(--product-story-weave-overflow-y, 0px));
        margin-top: 0;
        margin-bottom: var(--product-story-weave-gap, clamp(2.5rem, 4vw, 3.5rem));
        padding-inline: 0;
    }

    .ProductStorySections--masonry-ready > .ProductStorySection--direction-vertical > .ProductStorySection__container {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: var(--product-story-column-gap);
    }

    .ProductStorySections--masonry-ready .ProductStorySection--direction-vertical .ProductStoryColumn {
        grid-column: 1;
        margin-bottom: 0;
    }

    .ProductStorySections--masonry-ready .ProductStoryColumn {
        align-self: start;
        margin-bottom: var(--product-story-weave-gap, clamp(2.5rem, 4vw, 3.5rem));
        transform: translateY(var(--product-story-weave-overflow-y, 0px));
    }

    .ProductStorySections--masonry-ready .ProductStoryColumn--left {
        grid-column: 1;
    }

    .ProductStorySections--masonry-ready .ProductStoryColumn--right {
        grid-column: 2;
    }

    .ProductStorySections--masonry-ready .ProductStoryColumn--empty {
        display: none;
    }

    .ProductStorySections--masonry-ready .ProductStorySection--spacing-compact {
        --product-story-weave-gap: clamp(1.5rem, 2.5vw, 2.5rem);
    }

    .ProductStorySections--masonry-ready .ProductStorySection--spacing-standard {
        --product-story-weave-gap: clamp(2.5rem, 4vw, 3.5rem);
    }

    .ProductStorySections--masonry-ready .ProductStorySection--spacing-spacious {
        --product-story-weave-gap: clamp(4rem, 6vw, 6rem);
    }

    .ProductStorySections--masonry-ready > .ProductStorySection:last-child .ProductStoryColumn {
        margin-bottom: 0;
    }
}

@media (min-width: 1344px) {
    .ProductStoryDescription,
    .ProductStorySection,
    .ProductStorySections--weave.ProductStorySections--masonry-ready {
        padding-inline: 0;
    }
}

@media (max-width: 899px) {
    .ProductStory {
        padding-block: 3rem;
    }

    .ProductStoryDescription + .ProductStorySection {
        margin-top: clamp(3.5rem, 14vw, 5rem);
    }

    .ProductStorySection__container {
        gap: clamp(1.5rem, 7vw, 2.25rem);
    }

    .ProductStorySections:not(.ProductStorySections--masonry-ready) > .ProductStorySection:first-child {
        margin-top: 0;
    }

    .ProductStorySections:not(.ProductStorySections--masonry-ready) > .ProductStorySection + .ProductStorySection {
        margin-top: var(--product-story-row-gap, clamp(4.5rem, 8vw, 7.5rem));
    }

    /* Mobile sequence is content-driven, not side-driven. Every product-story
     * pair starts with its image even when the editor placed it on the right. */
    .ProductStorySection__container > .ProductStoryColumn--type-image {
        order: 1;
    }

    .ProductStorySection__container > .ProductStoryColumn--type-text {
        order: 2;
    }

    .ProductStorySection__container > .ProductStoryColumn--type-empty {
        order: 3;
    }

    .ProductStoryColumn__text,
    .ProductStoryColumn__figure {
        max-width: none;
    }

    /* Desktop composition offsets must never leak into the single-column
     * mobile reading order (image, then text). */
    .ProductStoryColumn__content {
        margin-top: 0;
        margin-bottom: 0;
        transform: none;
    }

    .ProductStoryColumn__figure {
        width: min(var(--product-image-mobile-width, 100%), 100%);
        margin-top: 0;
        margin-bottom: 0;
        transform: none;
    }

    .ProductStoryColumn .ProductStoryColumn__figure--mobile-align-left {
        margin-right: auto;
        margin-left: 0;
    }

    .ProductStoryColumn .ProductStoryColumn__figure--mobile-align-center {
        margin-right: auto;
        margin-left: auto;
    }

    .ProductStoryColumn .ProductStoryColumn__figure--mobile-align-right {
        margin-right: 0;
        margin-left: auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ProductStoryColumn__link {
        transition: none;
    }
}