.wp-block-rolnik-product-category-showcase.rolnik-product-category-showcase {
    --rolnik-product-category-showcase-accent: #c21e50;
    --rolnik-product-category-showcase-container-width: calc(1732 * var(--scaled-px));
    --rolnik-product-category-showcase-gap: calc(22 * var(--scaled-px));
    color: #171717;
    overflow-x: clip;
    padding-block: var(--rolnik-product-category-showcase-padding-top, calc(96 * var(--scaled-px))) var(--rolnik-product-category-showcase-padding-bottom, calc(96 * var(--scaled-px)));
    position: relative;
}

/* Product details uses a narrow content area. The carousel itself must opt out
 * of that area when the Gutenberg full-width alignment is selected. */
.wp-block-rolnik-product-category-showcase.rolnik-product-category-showcase.alignfull {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    max-width: 100vw;
    width: 100vw;
}

.rolnik-product-category-showcase__header {
    margin: 0 auto calc(64 * var(--scaled-px));
    max-width: calc(950 * var(--scaled-px));
    padding-inline: calc(24 * var(--scaled-px));
    text-align: center;
}

.rolnik-product-category-showcase__eyebrow {
    font-family: var(--rolnik-font, Arial, sans-serif);
    font-size: calc(21 * var(--scaled-px));
    line-height: 1.2;
    margin: 0 0 calc(12 * var(--scaled-px));
}

.rolnik-product-category-showcase__title {
    display: grid;
    font-family: "yorkten-slab-condensed", "Yorkten Slab", "Roboto Slab", Georgia, serif;
    font-size: clamp(calc(50 * var(--scaled-px)), 4.35vw, calc(78 * var(--scaled-px)));
    font-stretch: condensed;
    font-weight: 700;
    letter-spacing: 0;
    line-height: .92;
    margin: 0;
}

.rolnik-product-category-showcase__title-accent {
    color: var(--rolnik-product-category-showcase-accent);
}

.rolnik-product-category-showcase__description {
    font-family: var(--rolnik-font, Arial, sans-serif);
    font-size: calc(21 * var(--scaled-px));
    line-height: 1.12;
    margin: calc(32 * var(--scaled-px)) auto 0;
    max-width: calc(800 * var(--scaled-px));
}

.rolnik-product-category-showcase__description p {
    margin: 0;
}

.rolnik-product-category-showcase__viewport {
    /* The slide itself owns the fade. Do not crop it here, otherwise the
     * entering card is cut before Swiper can animate its visibility. */
    overflow: visible;
    position: relative;
    width: 100%;
}

.rolnik-product-category-showcase__swiper {
    --rolnik-product-category-showcase-small-width: calc((100% - (2 * var(--rolnik-product-category-showcase-gap))) / 3);
    --rolnik-product-category-showcase-large-width: calc((200% - var(--rolnik-product-category-showcase-gap)) / 3);
    margin: 0 auto;
    max-width: var(--rolnik-product-category-showcase-container-width);
    overflow: visible;
    width: calc(100% - calc(48 * var(--scaled-px)));
}

.rolnik-product-category-showcase__slide {
    flex: 0 0 var(--rolnik-product-category-showcase-small-width);
    height: auto;
    width: var(--rolnik-product-category-showcase-small-width);
}

.rolnik-product-category-showcase__slide--large {
    flex-basis: var(--rolnik-product-category-showcase-large-width);
    width: var(--rolnik-product-category-showcase-large-width);
}

/* Swiper adds this class according to the real viewport intersection. It
 * keeps the edge cards from appearing cropped while they enter or leave. */
@media (min-width: 821px) {
    .swiper-initialized .rolnik-product-category-showcase__slide {
        opacity: 0;
        pointer-events: none;
        transition: opacity .26s ease;
    }

    .swiper-initialized .rolnik-product-category-showcase__slide.swiper-slide-visible {
        opacity: 1;
        pointer-events: auto;
    }
}

.rolnik-product-category-showcase__card {
    background: var(--rolnik-product-category-showcase-accent);
    border-radius: calc(40 * var(--scaled-px));
    color: #fff;
    min-width: 0;
    overflow: hidden;
}

/* The desktop sizes follow the established 2+1+1 home-slider grid. An aspect
 * ratio makes the card grow with its available width instead of fixing pixels. */
.rolnik-product-category-showcase__card--large {
    aspect-ratio: 1.435 / 1;
    display: grid;
    grid-template-columns: minmax(0, 1.19fr) minmax(0, 1fr);
}

.rolnik-product-category-showcase__card--small {
    aspect-ratio: .704 / 1;
    display: flex;
    flex-direction: column;
}

.rolnik-product-category-showcase__media {
    background: #f3f0ec;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
}

.rolnik-product-category-showcase__media img,
.rolnik-product-category-showcase__placeholder {
    display: block;
    height: 100%;
    object-fit: cover;
    object-position: center;
    width: 100%;
}

.rolnik-product-category-showcase__placeholder {
    background: linear-gradient(135deg, #f3efed, #ded8d5);
}

.rolnik-product-category-showcase__card--large .rolnik-product-category-showcase__media {
    order: 2;
}

.rolnik-product-category-showcase__content {
    background: var(--rolnik-product-category-showcase-accent);
    background-image: var(--rolnik-featured-card-background, none);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.rolnik-product-category-showcase__card--large .rolnik-product-category-showcase__content {
    border-radius: calc(40 * var(--scaled-px)) 0 0 calc(40 * var(--scaled-px));
    min-height: 0;
    order: 1;
    padding: clamp(calc(42 * var(--scaled-px)), 3.45vw, calc(60 * var(--scaled-px))) clamp(calc(50 * var(--scaled-px)), 4.7vw, calc(81 * var(--scaled-px))) clamp(calc(30 * var(--scaled-px)), 2vw, calc(34 * var(--scaled-px))) clamp(calc(42 * var(--scaled-px)), 3.35vw, calc(57 * var(--scaled-px)));
}

.rolnik-product-category-showcase__meta {
    align-items: flex-start;
    display: flex;
    font-family: var(--rolnik-font, Arial, sans-serif);
    font-size: calc(21 * var(--scaled-px));
    gap: calc(18 * var(--scaled-px));
    justify-content: space-between;
    line-height: .95;
    text-transform: uppercase;
}

.rolnik-product-category-showcase__meta p {
    margin: 0;
}

.rolnik-product-category-showcase__card--large .rolnik-product-category-showcase__meta {
    padding-right: calc(20 * var(--scaled-px));
}

.rolnik-product-category-showcase__card-title {
    font-family: "yorkten-slab-condensed", "Yorkten Slab", "Roboto Slab", Georgia, serif;
    font-size: clamp(calc(34 * var(--scaled-px)), 2.55vw, calc(48 * var(--scaled-px)));
    font-stretch: condensed;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1;
    margin: clamp(calc(64 * var(--scaled-px)), 8vw, calc(138 * var(--scaled-px))) 0 0;
}

.rolnik-product-category-showcase__card-description {
    font-family: var(--rolnik-font, Arial, sans-serif);
    font-size: clamp(calc(18 * var(--scaled-px)), 1.35vw, calc(23 * var(--scaled-px)));
    line-height: 1.12;
    margin-top: clamp(calc(34 * var(--scaled-px)), 4.4vw, calc(76 * var(--scaled-px)));
}

.rolnik-product-category-showcase__card-description p {
    margin: 0 0 calc(22 * var(--scaled-px));
}

.rolnik-product-category-showcase__card-description p:last-child {
    margin-bottom: 0;
}

.rolnik-product-category-showcase__button {
    align-items: center;
    align-self: flex-start;
    background: #fff;
    border-radius: calc(999 * var(--scaled-px));
    box-sizing: border-box;
    color: var(--rolnik-product-category-showcase-accent);
    display: inline-flex;
    flex-shrink: 0;
    font-family: var(--rolnik-font, Arial, sans-serif);
    font-size: calc(22 * var(--scaled-px));
    justify-content: center;
    line-height: 1;
    margin-top: auto;
    max-width: 100%;
    min-height: max(2.75rem, calc(73 * var(--scaled-px)));
    min-width: calc(220 * var(--scaled-px));
    padding: 0 calc(34 * var(--scaled-px));
    text-decoration: none;
    transition: background-color .18s ease, color .18s ease;
    width: fit-content;
}

.rolnik-product-category-showcase__button:hover,
.rolnik-product-category-showcase__button:focus-visible {
    background: #171717;
    color: #fff;
    outline: 0;
}

.rolnik-product-category-showcase__card--small .rolnik-product-category-showcase__media {
    flex: 0 0 65.7%;
}

.rolnik-product-category-showcase__card--small .rolnik-product-category-showcase__content {
    border-radius: 0 0 calc(40 * var(--scaled-px)) calc(40 * var(--scaled-px));
    flex: 1 1 auto;
    margin-top: clamp(calc(-43 * var(--scaled-px)), -2.5vw, calc(-24 * var(--scaled-px)));
    min-height: 0;
    padding: clamp(calc(34 * var(--scaled-px)), 2.8vw, calc(48 * var(--scaled-px))) clamp(calc(38 * var(--scaled-px)), 3.5vw, calc(60 * var(--scaled-px))) clamp(calc(28 * var(--scaled-px)), 1.8vw, calc(31 * var(--scaled-px)));
    position: relative;
}

.rolnik-product-category-showcase__card--small .rolnik-product-category-showcase__card-title {
    font-size: clamp(calc(30 * var(--scaled-px)), 2.3vw, calc(43 * var(--scaled-px)));
    margin-top: calc(36 * var(--scaled-px));
}

.rolnik-product-category-showcase__nav {
    align-items: center;
    background: #fff;
    border: 0;
    border-radius: 50%;
    box-shadow: 0 calc(3 * var(--scaled-px)) calc(10 * var(--scaled-px)) rgba(23, 23, 23, .16);
    cursor: pointer;
    display: flex;
    height: calc(76 * var(--scaled-px));
    justify-content: center;
    padding: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: background-color .18s ease, opacity .18s ease, transform .18s ease;
    width: calc(76 * var(--scaled-px));
    z-index: 3;
}

.rolnik-product-category-showcase__prev {
    left: max(calc(20 * var(--scaled-px)), calc((100% - var(--rolnik-product-category-showcase-container-width)) / 2 - calc(38 * var(--scaled-px))));
}

.rolnik-product-category-showcase__next {
    right: max(calc(20 * var(--scaled-px)), calc((100% - var(--rolnik-product-category-showcase-container-width)) / 2 - calc(38 * var(--scaled-px))));
}

.rolnik-product-category-showcase__nav span {
    display: block;
    height: 0;
    width: 0;
}

.rolnik-product-category-showcase__prev span {
    border-bottom: calc(13 * var(--scaled-px)) solid transparent;
    border-right: calc(22 * var(--scaled-px)) solid var(--rolnik-product-category-showcase-accent);
    border-top: calc(13 * var(--scaled-px)) solid transparent;
    margin-left: calc(-4 * var(--scaled-px));
}

.rolnik-product-category-showcase__next span {
    border-bottom: calc(13 * var(--scaled-px)) solid transparent;
    border-left: calc(22 * var(--scaled-px)) solid var(--rolnik-product-category-showcase-accent);
    border-top: calc(13 * var(--scaled-px)) solid transparent;
    margin-right: calc(-4 * var(--scaled-px));
}

.rolnik-product-category-showcase__nav:hover,
.rolnik-product-category-showcase__nav:focus-visible {
    background: var(--rolnik-product-category-showcase-accent);
    outline: 0;
    transform: translateY(-50%) scale(1.04);
}

.rolnik-product-category-showcase__prev:hover span,
.rolnik-product-category-showcase__prev:focus-visible span {
    border-right-color: #fff;
}

.rolnik-product-category-showcase__next:hover span,
.rolnik-product-category-showcase__next:focus-visible span {
    border-left-color: #fff;
}

.rolnik-product-category-showcase__nav.swiper-button-disabled {
    cursor: default;
    opacity: 0;
    pointer-events: none;
}

.rolnik-product-category-showcase__pagination {
    display: none;
}

.rolnik-product-category-showcase__empty {
    color: #5c5c5c;
    font-family: var(--rolnik-font, Arial, sans-serif);
    margin: 0 auto;
    max-width: calc(820 * var(--scaled-px));
    text-align: center;
}

.rolnik-product-category-showcase--editor .rolnik-product-category-showcase__editor-track {
    display: grid;
    gap: calc(22 * var(--scaled-px));
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
    margin: 0 auto;
    max-width: calc(1200 * var(--scaled-px));
}

.rolnik-product-category-showcase--editor .rolnik-product-category-showcase__card--large {
    grid-column: span 2;
}

@media (max-width: 820px) {
    .rolnik-product-category-showcase__viewport {
        overflow: hidden;
    }

    .wp-block-rolnik-product-category-showcase.rolnik-product-category-showcase {
        padding-block: min(var(--rolnik-product-category-showcase-padding-top), calc(72 * var(--scaled-px))) min(var(--rolnik-product-category-showcase-padding-bottom), calc(72 * var(--scaled-px)));
    }

    /* The carousel already has bottom spacing; do not stack another desktop-sized gap. */
    .rolnik-product-category-showcase + .wp-block-rolnik-product-catalog.rolnik-product-catalog {
        padding-top: min(var(--rolnik-product-catalog-padding-top, 0px), calc(24 * var(--scaled-px)));
    }

    .rolnik-product-category-showcase__header {
        margin-bottom: calc(38 * var(--scaled-px));
    }

    .rolnik-product-category-showcase__eyebrow,
    .rolnik-product-category-showcase__description {
        font-size: calc(16 * var(--scaled-px));
    }

    .rolnik-product-category-showcase__swiper {
        margin-left: calc(16 * var(--scaled-px));
        width: calc(100% - calc(16 * var(--scaled-px)));
    }

    .rolnik-product-category-showcase__swiper .swiper-wrapper {
        /* Also applies when initialized on desktop, then resized to mobile. */
        align-items: flex-start;
    }

    .rolnik-product-category-showcase__slide,
    .rolnik-product-category-showcase__slide--large {
        flex-basis: calc(100vw - calc(32 * var(--scaled-px)));
        height: auto;
        width: calc(100vw - calc(32 * var(--scaled-px)));
    }

    .rolnik-product-category-showcase__card,
    .rolnik-product-category-showcase__card--large,
    .rolnik-product-category-showcase__card--small {
        aspect-ratio: auto;
        display: flex;
        flex-direction: column;
    }

    .rolnik-product-category-showcase__card--large .rolnik-product-category-showcase__media,
    .rolnik-product-category-showcase__card--small .rolnik-product-category-showcase__media {
        aspect-ratio: 499 / 525;
        flex: 0 0 auto;
        height: auto;
        order: 1;
    }

    .rolnik-product-category-showcase__card--large .rolnik-product-category-showcase__content,
    .rolnik-product-category-showcase__card--small .rolnik-product-category-showcase__content {
        border-radius: 0 0 calc(40 * var(--scaled-px)) calc(40 * var(--scaled-px));
        flex: 1 1 auto;
        margin-top: 0;
        min-height: 0;
        order: 2;
        padding: calc(32 * var(--scaled-px)) calc(30 * var(--scaled-px)) calc(30 * var(--scaled-px));
    }

    .rolnik-product-category-showcase__card--large .rolnik-product-category-showcase__meta {
        padding-right: 0;
    }

    .rolnik-product-category-showcase__card-title,
    .rolnik-product-category-showcase__card--small .rolnik-product-category-showcase__card-title {
        font-size: calc(36 * var(--scaled-px));
        margin-top: calc(28 * var(--scaled-px));
    }

    .rolnik-product-category-showcase__card-description {
        font-size: calc(17 * var(--scaled-px));
        margin-top: calc(28 * var(--scaled-px));
    }

    .rolnik-product-category-showcase__button {
        font-size: calc(18 * var(--scaled-px));
        margin-top: calc(24 * var(--scaled-px));
        min-height: max(2.75rem, calc(58 * var(--scaled-px)));
        min-width: calc(174 * var(--scaled-px));
    }

    .rolnik-product-category-showcase__nav {
        display: none;
    }

    .rolnik-product-category-showcase__pagination {
        /* Swiper centers and offsets an inline bullet strip, not flex items. */
        bottom: auto;
        display: block;
        height: calc(32 * var(--scaled-px));
        line-height: calc(32 * var(--scaled-px));
        margin-top: calc(22 * var(--scaled-px));
        position: relative;
        text-align: center;
    }

    .rolnik-product-category-showcase__pagination.swiper-pagination-lock {
        display: none;
    }

    .rolnik-product-category-showcase__pagination .swiper-pagination-bullet {
        background: var(--rolnik-product-category-showcase-accent);
        height: calc(8 * var(--scaled-px));
        margin: 0 calc(5 * var(--scaled-px)) !important;
        opacity: .28;
        transition: opacity .2s ease, transform .2s ease;
        vertical-align: middle;
        width: calc(8 * var(--scaled-px));
    }

    .rolnik-product-category-showcase__pagination .swiper-pagination-bullet-active {
        opacity: 1;
        transform: scale(1.3);
    }

    .rolnik-product-category-showcase--editor .rolnik-product-category-showcase__editor-track {
        grid-template-columns: 1fr;
        padding-inline: calc(24 * var(--scaled-px));
    }

    .rolnik-product-category-showcase--editor .rolnik-product-category-showcase__card--large {
        grid-column: auto;
    }
}
