:root {
    --ra-comfort-blue: var(--ra-primary, #0271ba);
    --ra-airflow-blue: #069dff;
    --ra-heat-pink: var(--ra-error, #ff0066);
    --ra-solar-yellow: #fba819;
    --ra-brand-black: #001a35;
    --ra-badge-green: var(--ra-success, #8cc63f);
    --ra-component-text: var(--ra-text, #303a50);
    --ra-component-muted: var(--ra-text-muted, #969da9);
    --ra-component-border: var(--ra-border, #d3d8df);
    --ra-component-radius-card: var(--ra-radius-card, 12px);
    --ra-radius-pill: var(--ra-radius-button, 999px);
    --ra-font: var(--ra-font-family, Montserrat, sans-serif);
}

.ra-featured-slider,
.ra-featured-slider * { box-sizing: border-box; }

.ra-featured-slider {
    --ra-grid-gap: clamp(16px, 1.35vw, 28px);
    --ra-card-height: 460px;
    width: min(100%, 1880px);
    margin: 0 auto;
    padding: clamp(20px, 2.4vw, 46px) clamp(14px, 1.9vw, 36px) clamp(18px, 2vw, 36px);
    font-family: var(--ra-font) !important;
    color: var(--ra-component-text);
}

.ra-slider-top {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: var(--ra-grid-gap);
    align-items: start;
    margin: 0 0 clamp(18px, 1.4vw, 28px);
}

.ra-slider-heading {
    grid-column: 1 / span 2;
    min-width: 0;
}

.ra-slider-callout {
    display: block;
    margin: 0 0 clamp(4px, .42vw, 8px) !important;
    padding: 0 !important;
    color: var(--ra-slide-callout-color, var(--ra-text)) !important;
    font-family: var(--ra-font) !important;
    font-size: clamp(28px, 2.25vw, 46px) !important;
    line-height: .94 !important;
    font-weight: 900 !important;
    letter-spacing: -0.045em !important;
    text-transform: uppercase !important;
}

.ra-slider-byline {
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--ra-slide-byline-color, var(--ra-component-muted)) !important;
    font-family: var(--ra-font) !important;
    font-size: clamp(16px, 1.22vw, 25px) !important;
    line-height: 1.05 !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
}

.ra-slider-tabs {
    grid-column: 3 / span 2;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: flex-start;
    align-content: flex-start;
    gap: 11px 14px;
    min-width: 0;
}

.ra-slider-tab {
    position: relative;
    isolation: isolate;
    min-width: clamp(142px, 8.9vw, 178px);
    min-height: clamp(28px, 1.62vw, 34px);
    border: 1px solid #e2e6eb !important;
    border-radius: var(--ra-radius-pill) !important;
    background: #fff !important;
    color: var(--ra-text) !important;
    overflow: hidden;
    padding: 0 clamp(14px, .98vw, 20px) !important;
    font-family: var(--ra-font) !important;
    font-size: clamp(11px, .78vw, 15px) !important;
    line-height: 1 !important;
    font-weight: 500 !important;
    letter-spacing: .02em !important;
    text-transform: uppercase !important;
    cursor: pointer;
    box-shadow: none !important;
}

.ra-slider-tab__label {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    white-space: nowrap;
}

.ra-slider-tab__progress {
    position: absolute;
    z-index: 1;
    inset: 0 auto 0 0;
    width: 0;
    background: var(--ra-airflow-blue);
    opacity: 0;
}

.ra-slider-tab.is-active {
    background: var(--ra-comfort-blue) !important;
    border-color: var(--ra-comfort-blue) !important;
    color: #fff !important;
}

.ra-slider-tab.is-active .ra-slider-tab__progress {
    opacity: 1;
    animation: ra-tab-progress var(--ra-tab-duration, 6s) linear forwards;
}

@keyframes ra-tab-progress { from { width: 0; } to { width: 100%; } }

.ra-slider-panel { display: none; }
.ra-slider-panel.is-active { display: block; }

.ra-slider-layout {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: var(--ra-grid-gap);
    align-items: stretch;
    height: var(--ra-card-height);
    max-height: var(--ra-card-height);
    overflow: visible;
}

.ra-slider-block {
    min-width: 0;
    min-height: 0;
    height: 100%;
}

.ra-slider-block--promo { grid-column: 1; }
.ra-slider-block--products { grid-column: 2 / span 3; overflow: hidden; }
.ra-slider-block--brands { grid-column: 5; }

.ra-promo-panel {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    overflow: hidden;
    background: #f6f8fb;
    text-decoration: none !important;
}

.ra-promo-panel__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ra-promo-panel__placeholder {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: var(--ra-comfort-blue);
    font-weight: 800;
}

.ra-slider-products-viewport {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.ra-slider-products-track {
    display: flex;
    gap: var(--ra-grid-gap);
    width: 100%;
    height: 100%;
    transition: transform 450ms ease;
    will-change: transform;
}

.ra-product-surface .ra-product-card {
    position: relative;
    min-width: 0;
    min-height: 0;
    display: grid !important;
    grid-template-rows: 56% 44% !important;
    padding: 0 !important;
    border: 1px solid var(--ra-component-border) !important;
    border-radius: var(--ra-component-radius-card) !important;
    background: #fff !important;
    overflow: hidden !important;
    box-shadow: none !important;
}

.ra-slider-products-track .ra-product-card {
    flex: 0 0 calc((100% - (var(--ra-grid-gap) * 2)) / 3);
    width: calc((100% - (var(--ra-grid-gap) * 2)) / 3);
    height: 100% !important;
}

.ra-product-card__badges {
    position: absolute;
    z-index: 5;
    inset: clamp(7px, .62vw, 12px) clamp(7px, .62vw, 12px) auto clamp(7px, .62vw, 12px);
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    pointer-events: none;
}

.ra-product-badge,
.ra-product-card .awl-label-text {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: clamp(16px, 1.05vw, 22px) !important;
    padding: 4px clamp(8px, .72vw, 14px) !important;
    border-radius: var(--ra-radius-pill) !important;
    font-family: var(--ra-font) !important;
    font-size: clamp(7px, .52vw, 10px) !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: .01em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    color: #fff !important;
}

.ra-product-badge--discount,
.ra-product-card .awl-label-id-8588 .awl-label-text {
    background: var(--ra-badge-green) !important;
    color: #fff !important;
}

.ra-product-badge--sale,
.ra-product-card .awl-label-id-8831 .awl-label-text {
    background: var(--ra-heat-pink) !important;
    color: #fff !important;
}

.ra-awl-source { display: none !important; }
.ra-product-card .awl-inner-text br { display: none !important; }

.ra-product-card__image {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: clamp(24px, 2.35vw, 46px) clamp(5px, .45vw, 10px) clamp(4px, .3vw, 8px) !important;
    text-decoration: none !important;
    overflow: hidden !important;
}

/* The stage, rather than the inline link, is the first Product Card grid
 * child. This keeps WordPress/Divi auto-paragraph formatting from inserting a
 * paragraph around the link and breaking the card's image/body row contract. */
.ra-product-card__image-stage {
    grid-row: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 0;
    height: 100%;
    overflow: hidden;
}

.ra-product-card__image img,
.ra-product-card__image-el {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 98% !important;
    max-height: 88% !important;
    object-fit: contain !important;
    margin: auto !important;
    transform: none !important;
}

.ra-product-card__body {
    display: grid !important;
    grid-row: 2;
    align-self: stretch;
    grid-template-rows: minmax(34px, auto) 1fr auto auto auto !important;
    gap: clamp(4px, .36vw, 7px) !important;
    min-height: 0;
    height: 100%;
    padding: 0 clamp(8px, .7vw, 13px) clamp(7px, .62vw, 12px) !important;
}

.ra-product-card__title {
    grid-row: 1;
    align-self: start;
    min-height: 0;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--ra-text) !important;
    font-family: var(--ra-font) !important;
    font-size: clamp(10px, .78vw, 15px) !important;
    line-height: 1.16 !important;
    font-weight: 500 !important;
    letter-spacing: -0.01em !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
}

.ra-product-card__title a {
    color: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: inherit !important;
    text-decoration: none !important;
}

.ra-product-card__variations {
    grid-row: 3;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: clamp(3px, .28vw, 5px) clamp(4px, .36vw, 6px) !important;
    align-items: flex-start !important;
    align-content: flex-start !important;
    min-height: 0;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.ra-variation-pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: clamp(15px, .95vw, 20px) !important;
    padding: 2px clamp(6px, .48vw, 9px) !important;
    border: 1px solid #cfd5dd !important;
    border-radius: var(--ra-radius-pill) !important;
    background: #fff !important;
    color: var(--ra-text) !important;
    font-family: var(--ra-font) !important;
    font-size: clamp(7px, .46vw, 9px) !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    cursor: pointer;
    transition: background-color 140ms ease, border-color 140ms ease;
}

/* The room-size label is a separate flex item so HTML whitespace cannot create
 * the visible inline space. Keep the space everywhere except the explicitly
 * stacked mobile two-column card layout. */
.ra-variation-pill--room-size .ra-variation-pill__room-size {
    margin-left: .28em !important;
}

.ra-variation-pill:hover,
.ra-variation-pill:focus {
    background: #eef0f3 !important;
    border-color: #d9dde3 !important;
}

.ra-variation-pill.is-active {
    background: #d9dde3 !important;
    border-color: #d9dde3 !important;
    color: var(--ra-text) !important;
}

.ra-product-card__price {
    grid-row: 4;
    display: flex !important;
    align-items: baseline !important;
    gap: clamp(6px, .55vw, 11px) !important;
    flex-wrap: nowrap !important;
    min-width: 0;
    min-height: clamp(17px, 1.1vw, 23px);
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    color: var(--ra-text) !important;
    line-height: 1 !important;
}

.ra-price-current,
.ra-product-card__price ins .woocommerce-Price-amount,
.ra-product-card__price > .woocommerce-Price-amount {
    color: var(--ra-text) !important;
    font-family: var(--ra-font) !important;
    font-size: clamp(13px, .9vw, 18px) !important;
    line-height: 1 !important;
    font-weight: 600 !important;
    letter-spacing: -0.015em !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.ra-price-original,
.ra-product-card__price del {
    color: #667085 !important;
    font-family: var(--ra-font) !important;
    font-size: clamp(6px, .42vw, 8px) !important;
    line-height: 1 !important;
    font-weight: 400 !important;
    opacity: 1 !important;
    white-space: nowrap !important;
}

.ra-product-card__price del { order: 2; }
.ra-product-card__price ins { order: 1; text-decoration: none !important; }
.ra-product-card__price .woocommerce-Price-amount { white-space: nowrap !important; }

.ra-product-card__actions {
    grid-row: 5;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: clamp(6px, .6vw, 10px) !important;
    align-self: end;
    min-width: 0;
}

.ra-product-card__action-item {
    display: flex;
    min-width: 0;
    min-height: 0;
}

.ra-product-card__action-item .ra-button {
    flex: 1 1 auto;
    width: 100%;
}

.ra-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: clamp(30px, 2vw, 40px) !important;
    min-height: clamp(30px, 2vw, 40px) !important;
    padding: 4px 8px !important;
    border: 0 !important;
    border-radius: var(--ra-radius-pill) !important;
    color: #fff !important;
    font-family: var(--ra-font) !important;
    font-size: clamp(10px, .76vw, 14px) !important;
    line-height: 1.05 !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: none !important;
    white-space: nowrap;
}

.ra-button--quote { background: #48a0dc !important; }
.ra-button--cart { background: var(--ra-comfort-blue) !important; }

.ra-brand-panel {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: clamp(18px, 1.35vw, 26px);
    width: 100%;
    height: 100%;
    padding: 10% 8.5%;
    background: transparent;
    overflow: hidden;
}

.ra-brand-logo {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    text-decoration: none !important;
}

.ra-brand-logo__image {
    height: var(--ra-logo-height, 45px);
    width: auto;
    max-width: 100%;
    object-fit: contain;
}

@media (max-width: 1180px) {
    .ra-featured-slider { width: min(100%, 960px); }
    .ra-slider-top,
    .ra-slider-layout {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        height: auto;
        max-height: none;
    }
    .ra-slider-heading,
    .ra-slider-tabs,
    .ra-slider-block--promo,
    .ra-slider-block--products,
    .ra-slider-block--brands { grid-column: auto; }
    .ra-slider-heading { grid-column: 1 / -1; }
    .ra-slider-tabs { grid-column: 1 / -1; justify-content: flex-start; }
    .ra-slider-block--promo,
    .ra-slider-block--brands { aspect-ratio: 4 / 5; height: auto; }
    .ra-slider-block--products { grid-column: 1 / -1; height: auto; overflow: visible; }
    .ra-slider-products-viewport { height: auto; overflow: visible; }
    .ra-slider-products-track {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        height: auto;
        transform: none !important;
    }
    .ra-slider-products-track .ra-product-card {
        flex-basis: auto;
        width: auto;
        aspect-ratio: 4 / 5;
        height: auto !important;
    }
}

@media (max-width: 640px) {
    .ra-slider-top,
    .ra-slider-layout,
    .ra-slider-products-track {
        grid-template-columns: 1fr;
    }
    .ra-slider-tab { width: 100%; }
    .ra-slider-block--promo,
    .ra-slider-block--brands,
    .ra-slider-products-track .ra-product-card { aspect-ratio: 4 / 5; }
}

/* v0.4.3 - RightAir exact frontend refinements */
.ra-featured-slider {
    --ra-badge-green: #8cc63f;
}

.ra-slider-heading {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.ra-slider-callout {
    display: block !important;
    min-height: 1em;
    font-size: clamp(28px, 2.15vw, 44px) !important;
    line-height: .94 !important;
    font-weight: 900 !important;
    color: var(--ra-text) !important;
}

.ra-slider-byline {
    display: block !important;
    min-height: 1em;
    font-size: clamp(15px, 1.14vw, 23px) !important;
    line-height: 1.05 !important;
    font-weight: 800 !important;
    color: var(--ra-component-muted) !important;
}

.ra-slider-tab {
    min-width: clamp(118px, 8vw, 164px) !important;
    min-height: clamp(24px, 1.42vw, 30px) !important;
    padding: 0 clamp(10px, .72vw, 15px) !important;
    font-size: clamp(10px, .68vw, 13px) !important;
    font-weight: 500 !important;
    outline: none !important;
    box-shadow: none !important;
}

.ra-slider-tab.is-active {
    border-color: transparent !important;
    border-width: 0 !important;
}

.ra-slider-tab:focus,
.ra-slider-tab:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

.ra-slider-products-track .ra-product-card {
    grid-template-rows: 57% 43% !important;
}

.ra-product-card__badges {
    inset: clamp(7px, .55vw, 10px) clamp(7px, .55vw, 10px) auto clamp(7px, .55vw, 10px) !important;
}

.ra-product-badge,
.ra-product-card .awl-label-text {
    min-height: clamp(16px, .92vw, 20px) !important;
    padding: 3px clamp(7px, .54vw, 10px) !important;
    font-size: clamp(7px, .45vw, 9px) !important;
    font-weight: 800 !important;
}

.ra-product-card__image {
    padding: clamp(22px, 1.85vw, 36px) 2px 0 !important;
}

.ra-product-card__image img,
.ra-product-card__image-el {
    max-width: 110% !important;
    max-height: 98% !important;
}

.ra-product-card__body {
    grid-template-rows: auto 1fr auto auto auto !important;
    gap: clamp(3px, .28vw, 5px) !important;
    padding: 0 clamp(7px, .48vw, 10px) clamp(6px, .42vw, 9px) !important;
}

.ra-product-card__title {
    font-size: clamp(10px, .68vw, 13px) !important;
    line-height: 1.12 !important;
    font-weight: 500 !important;
    letter-spacing: -0.006em !important;
}

.ra-product-card__variations {
    gap: clamp(3px, .24vw, 5px) !important;
}

.ra-variation-pill {
    min-height: clamp(14px, .82vw, 18px) !important;
    padding: 1px clamp(6px, .42vw, 8px) !important;
    font-size: clamp(7px, .42vw, 8px) !important;
    font-weight: 700 !important;
    background: #fff !important;
    border-color: #d4d9df !important;
}

.ra-variation-pill:hover,
.ra-variation-pill:focus {
    background: #eef0f3 !important;
    border-color: #d4d9df !important;
}

.ra-variation-pill.is-active {
    background: #d9dde3 !important;
    border-color: #d9dde3 !important;
}

.ra-product-card__price {
    gap: clamp(5px, .44vw, 9px) !important;
    min-height: clamp(15px, .92vw, 19px) !important;
}

.ra-price-current,
.ra-product-card__price ins .woocommerce-Price-amount,
.ra-product-card__price > .woocommerce-Price-amount {
    font-size: clamp(12px, .78vw, 16px) !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
}

.ra-price-original,
.ra-product-card__price del {
    font-size: clamp(6px, .38vw, 8px) !important;
    font-weight: 400 !important;
}

.ra-product-card__actions {
    gap: clamp(6px, .52vw, 9px) !important;
}

.ra-button {
    height: clamp(27px, 1.72vw, 35px) !important;
    min-height: clamp(27px, 1.72vw, 35px) !important;
    padding: 3px 7px !important;
    font-size: clamp(9px, .62vw, 12px) !important;
    font-weight: 600 !important;
    line-height: 1.05 !important;
}

/* v0.4.4 - exact card/header refinements */
.ra-slider-top {
    align-items: start !important;
}

.ra-slider-heading {
    display: block !important;
    grid-column: 1 / span 2 !important;
    min-height: clamp(58px, 4.6vw, 92px) !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 3;
}

.ra-slider-callout,
.ra-slider-callout h2 {
    display: block !important;
    margin: 0 0 clamp(4px, .38vw, 7px) !important;
    padding: 0 !important;
    color: var(--ra-text) !important;
    font-family: var(--ra-font) !important;
    font-size: clamp(30px, 2.22vw, 46px) !important;
    line-height: .92 !important;
    font-weight: 900 !important;
    letter-spacing: -0.045em !important;
    text-transform: uppercase !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.ra-slider-byline,
.ra-slider-byline p {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--ra-component-muted) !important;
    font-family: var(--ra-font) !important;
    font-size: clamp(16px, 1.18vw, 24px) !important;
    line-height: 1.02 !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.ra-slider-tab {
    border: 0 !important;
    min-width: clamp(110px, 7.55vw, 154px) !important;
    min-height: clamp(24px, 1.34vw, 28px) !important;
    padding: 0 clamp(9px, .62vw, 13px) !important;
    font-size: clamp(10px, .64vw, 13px) !important;
    line-height: 1 !important;
}

.ra-slider-products-track .ra-product-card {
    grid-template-rows: 57.5% 42.5% !important;
}

.ra-product-card__badges {
    inset: clamp(6px, .46vw, 9px) clamp(6px, .46vw, 9px) auto clamp(6px, .46vw, 9px) !important;
}

.ra-product-badge,
.ra-product-card .awl-label-text {
    min-height: clamp(15px, .86vw, 18px) !important;
    padding: 3px clamp(6px, .42vw, 8px) !important;
    font-size: clamp(7px, .4vw, 8px) !important;
    font-weight: 800 !important;
}

.ra-product-badge--discount,
.ra-product-card .awl-label-id-8588 .awl-label-text {
    background: #8cc63f !important;
    color: #104820 !important;
}

.ra-product-card__image {
    padding: clamp(18px, 1.45vw, 30px) 0 0 !important;
}

.ra-product-card__image img,
.ra-product-card__image-el {
    max-width: 112% !important;
    max-height: 100% !important;
    object-fit: contain !important;
}

.ra-product-card__body {
    grid-template-rows: auto 1fr auto auto auto !important;
    gap: clamp(3px, .22vw, 4px) !important;
    padding: 0 clamp(6px, .38vw, 8px) clamp(5px, .34vw, 7px) !important;
}

.ra-product-card__title {
    font-size: clamp(9.5px, .62vw, 12px) !important;
    line-height: 1.13 !important;
    font-weight: 500 !important;
    letter-spacing: -0.004em !important;
}

.ra-product-card__variations {
    gap: clamp(3px, .22vw, 4px) clamp(3px, .25vw, 5px) !important;
}

.ra-variation-pill {
    min-height: clamp(15px, .86vw, 18px) !important;
    padding: 3px clamp(5px, .34vw, 7px) !important;
    font-size: clamp(7px, .4vw, 8px) !important;
    font-weight: 700 !important;
    border-color: #d4d9df !important;
    background: #fff !important;
}

.ra-variation-pill:hover,
.ra-variation-pill:focus {
    background: #eef0f3 !important;
    border-color: #d4d9df !important;
}

.ra-variation-pill.is-active {
    background: #d9dde3 !important;
    border-color: #d9dde3 !important;
    color: var(--ra-text) !important;
}

.ra-product-card__price {
    gap: clamp(5px, .4vw, 8px) !important;
    min-height: clamp(16px, .94vw, 20px) !important;
}

.ra-price-current,
.ra-product-card__price ins .woocommerce-Price-amount,
.ra-product-card__price > .woocommerce-Price-amount {
    font-size: clamp(11px, .72vw, 15px) !important;
    font-weight: 600 !important;
}

.ra-price-original,
.ra-product-card__price del {
    font-size: clamp(7px, .46vw, 9px) !important;
    font-weight: 400 !important;
}

.ra-product-card__actions {
    gap: clamp(4px, .35vw, 7px) !important;
}

.ra-button {
    height: clamp(25px, 1.58vw, 32px) !important;
    min-height: clamp(25px, 1.58vw, 32px) !important;
    padding: 2px 6px !important;
    font-size: clamp(8.5px, .55vw, 11px) !important;
    font-weight: 500 !important;
    line-height: 1.05 !important;
}

/* v0.4.5 - layout/header exacting refinements */
.ra-featured-slider {
    --ra-grid-gap: clamp(10px, .95vw, 18px) !important;
}

.ra-slider-top {
    align-items: end !important;
    margin-bottom: clamp(12px, 1.05vw, 20px) !important;
}

.ra-slider-heading {
    min-height: auto !important;
    align-self: end !important;
}

.ra-slider-callout {
    display: block !important;
    min-height: 0 !important;
}

.ra-slider-callout--empty,
.ra-slider-byline--empty {
    display: none !important;
}

.ra-slider-byline {
    display: block !important;
    min-height: 0 !important;
}

.ra-slider-tabs {
    align-self: end !important;
    align-items: flex-end !important;
    align-content: flex-end !important;
    padding-bottom: 0 !important;
    gap: clamp(6px, .55vw, 10px) clamp(8px, .7vw, 12px) !important;
}

.ra-slider-tab {
    min-width: clamp(100px, 7vw, 145px) !important;
    min-height: clamp(22px, 1.22vw, 26px) !important;
    padding: 0 clamp(7px, .5vw, 10px) !important;
    border: 0 !important;
    outline: 0 !important;
}

.ra-slider-tab:not(.is-active) {
    border: 1px solid #e4e7eb !important;
}

.ra-slider-products-track .ra-product-card {
    grid-template-rows: 54% 46% !important;
}

.ra-product-card__image {
    padding: clamp(16px, 1.22vw, 25px) 0 0 !important;
}

.ra-product-card__image img,
.ra-product-card__image-el {
    max-width: 116% !important;
    max-height: 103% !important;
}

.ra-product-card__body {
    padding: 0 clamp(5px, .34vw, 7px) clamp(5px, .32vw, 7px) !important;
    gap: clamp(2px, .2vw, 4px) !important;
}

.ra-product-card__variations {
    gap: clamp(3px, .22vw, 4px) clamp(3px, .24vw, 5px) !important;
}

.ra-variation-pill {
    padding: 3px clamp(4px, .28vw, 6px) !important;
    min-height: clamp(15px, .84vw, 18px) !important;
}

.ra-product-card__actions {
    gap: clamp(3px, .25vw, 5px) !important;
}

/* v0.4.6 - slide header, variation pricing and final card tuning */
.ra-slider-heading,
.ra-slider-callout,
.ra-slider-byline {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.ra-slider-callout:not(.ra-slider-callout--empty) {
    display: block !important;
    margin: 0 0 clamp(4px, .34vw, 7px) !important;
    color: var(--ra-text) !important;
}

.ra-slider-byline:not(.ra-slider-byline--empty) {
    display: block !important;
    margin: 0 !important;
    color: var(--ra-component-muted) !important;
}

.ra-featured-slider {
    --ra-grid-gap: clamp(8px, .78vw, 15px) !important;
}

.ra-product-card__badges {
    inset: clamp(6px, .45vw, 9px) clamp(6px, .45vw, 9px) auto clamp(6px, .45vw, 9px) !important;
}

.ra-product-badge,
.ra-product-card .awl-label-text {
    min-height: clamp(16px, .95vw, 20px) !important;
    padding: 4px clamp(6px, .44vw, 9px) !important;
    font-size: clamp(8px, .46vw, 9px) !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
}

.ra-product-card__body {
    padding: 0 clamp(5px, .3vw, 7px) clamp(5px, .3vw, 7px) !important;
    gap: clamp(2px, .18vw, 4px) !important;
}

.ra-product-card__title {
    font-size: clamp(9.5px, .6vw, 12px) !important;
    line-height: 1.13 !important;
    font-weight: 500 !important;
}

.ra-product-card__variations {
    gap: clamp(3px, .2vw, 4px) clamp(3px, .2vw, 4px) !important;
}

.ra-variation-pill {
    min-height: clamp(16px, .9vw, 19px) !important;
    padding: 4px clamp(4px, .28vw, 6px) !important;
    font-size: clamp(7px, .4vw, 8px) !important;
    font-weight: 700 !important;
}

.ra-product-card__price {
    margin-top: clamp(3px, .25vw, 6px) !important;
    gap: clamp(5px, .36vw, 8px) !important;
}

.ra-price-current,
.ra-product-card__price ins .woocommerce-Price-amount,
.ra-product-card__price > .woocommerce-Price-amount {
    font-size: clamp(10px, .68vw, 14px) !important;
    font-weight: 600 !important;
}

.ra-price-original,
.ra-product-card__price del {
    font-size: clamp(8px, .5vw, 10px) !important;
    font-weight: 400 !important;
}

.ra-product-card__actions {
    gap: clamp(3px, .22vw, 5px) !important;
}

.ra-button {
    font-size: clamp(8px, .52vw, 10.5px) !important;
    font-weight: 500 !important;
    height: clamp(24px, 1.45vw, 30px) !important;
    min-height: clamp(24px, 1.45vw, 30px) !important;
}


/* v0.4.7 - card typography and native YITH quote integration */
.ra-slider-callout,
.ra-slider-callout h2 {
    font-size: clamp(28px, 1.95vw, 40px) !important;
}

.ra-slider-byline,
.ra-slider-byline p {
    font-size: clamp(15px, 1.16vw, 25px) !important;
}

.ra-product-card__title {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
    line-clamp: 3 !important;
    max-height: calc(1.13em * 3) !important;
}

.ra-product-card__title a {
    display: inherit !important;
}

.ra-price-current,
.ra-product-card__price ins .woocommerce-Price-amount,
.ra-product-card__price > .woocommerce-Price-amount {
    font-size: clamp(11px, .72vw, 15px) !important;
}

.ra-price-original {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 0 !important;
    line-height: .92 !important;
}

.ra-price-original__label,
.ra-price-original__amount {
    display: block !important;
    line-height: .92 !important;
}


/* v0.4.8 - header specificity, restored pricing, stable title clamp and YITH loader */
.ra-featured-slider .ra-slider-top .ra-slider-heading > h2.ra-slider-callout,
body .ra-featured-slider .ra-slider-top .ra-slider-heading > h2.ra-slider-callout {
    font-size: clamp(28px, 1.95vw, 40px) !important;
    line-height: .92 !important;
}

.ra-featured-slider .ra-slider-top .ra-slider-heading > p.ra-slider-byline,
body .ra-featured-slider .ra-slider-top .ra-slider-heading > p.ra-slider-byline {
    font-size: clamp(15px, 1.16vw, 25px) !important;
    line-height: 1.02 !important;
}

.ra-product-card__title {
    display: block !important;
    overflow: hidden !important;
    max-height: calc(1.13em * 3) !important;
}

.ra-product-card__title > a {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
    line-clamp: 3 !important;
    max-height: calc(1.13em * 3) !important;
}

.ra-price-current,
.ra-product-card__price ins .woocommerce-Price-amount,
.ra-product-card__price > .woocommerce-Price-amount {
    font-size: clamp(10px, .68vw, 14px) !important;
}

.ra-price-original {
    display: inline !important;
    flex-direction: initial !important;
    align-items: initial !important;
    justify-content: initial !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

.ra-product-card__actions {
    position: relative !important;
}

.ra-product-card__actions > img.ajax-loading,
.ra-product-card__actions > .ajax-loading,
.ra-product-card__actions img.yith-ywraq-loader {
    position: absolute !important;
    top: 50% !important;
    left: 25% !important;
    z-index: 4 !important;
    width: 14px !important;
    height: 14px !important;
    margin: 0 0 0 42px !important;
    transform: translate(-50%, -50%) !important;
    object-fit: contain !important;
    pointer-events: none !important;
}

.ra-button--quote.loading,
.ra-button--quote.adding-to-quote {
    gap: 7px !important;
}

/* v0.4.9 - exact header sizing and contained YITH quote loader */
html body .ra-featured-slider .ra-slider-top .ra-slider-heading > h2.ra-slider-callout {
    font-size: 40px !important;
    line-height: .92 !important;
}

html body .ra-featured-slider .ra-slider-top .ra-slider-heading > p.ra-slider-byline {
    font-size: 25px !important;
    line-height: 1.02 !important;
}

.ra-product-card__actions .ra-button--quote {
    position: relative !important;
}

html body .ra-featured-slider .ra-product-card__actions > img,
html body .ra-featured-slider .ra-product-card__actions > span.ajax-loading,
html body .ra-featured-slider .ra-product-card__actions > .yith-ywraq-loader,
html body .ra-featured-slider .ra-product-card__actions > .yith_ywraq_loader {
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.ra-button--quote > img.ajax-loading,
.ra-button--quote > img.yith-ywraq-loader,
.ra-button--quote > img.yith_ywraq_loader,
.ra-button--quote > .ajax-loading {
    position: static !important;
    display: inline-block !important;
    flex: 0 0 13px !important;
    width: 13px !important;
    height: 13px !important;
    min-width: 13px !important;
    min-height: 13px !important;
    margin: 0 0 0 7px !important;
    padding: 0 !important;
    opacity: 1 !important;
    transform: none !important;
    object-fit: contain !important;
    vertical-align: middle !important;
    pointer-events: none !important;
}

@media (max-width: 767px) {
    html body .ra-featured-slider .ra-slider-top .ra-slider-heading > h2.ra-slider-callout {
        font-size: clamp(28px, 8vw, 40px) !important;
    }

    html body .ra-featured-slider .ra-slider-top .ra-slider-heading > p.ra-slider-byline {
        font-size: clamp(17px, 5vw, 25px) !important;
    }
}


/* v0.5.1 - simplified button hover feedback */
html body .ra-featured-slider .ra-slider-top .ra-slider-heading > h2.ra-slider-callout {
    font-size: 34px !important;
}

html body .ra-featured-slider .ra-slider-top .ra-slider-heading > p.ra-slider-byline {
    font-size: 21px !important;
}

.ra-product-card__actions .ra-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    transition: filter .18s ease !important;
}

.ra-product-card__actions .ra-button:hover,
.ra-product-card__actions .ra-button:focus-visible {
    filter: brightness(.92) !important;
    transform: none !important;
    box-shadow: none !important;
}

.ra-product-card__actions .ra-button:active {
    filter: brightness(.86) !important;
    transform: translateY(0) !important;
    box-shadow: none !important;
}

.ra-button__label {
    display: inline-block !important;
}

.ra-button__spinner {
    display: inline-block !important;
    flex: 0 0 0 !important;
    width: 0 !important;
    height: 0 !important;
    margin-left: 0 !important;
    border: 0 solid rgba(255, 255, 255, .45) !important;
    border-top-color: #fff !important;
    border-radius: 50% !important;
    opacity: 0 !important;
    animation: ra-button-spin .7s linear infinite;
    transition: width .15s ease, height .15s ease, margin-left .15s ease, opacity .15s ease !important;
}

.ra-button.is-loading .ra-button__spinner {
    flex-basis: 12px !important;
    width: 12px !important;
    height: 12px !important;
    margin-left: 7px !important;
    border-width: 2px !important;
    opacity: 1 !important;
}

.ra-button.is-loading {
    cursor: progress !important;
}

/* Leave YITH's loader untouched functionally, but keep its injected element from
   becoming a third item in the two-column action grid. */
.ra-product-card__actions > img.ajax-loading,
.ra-product-card__actions > img.yith-ywraq-loader,
.ra-product-card__actions > img.yith_ywraq_loader,
.ra-product-card__actions > .ajax-loading,
.ra-product-card__actions > .yith-ywraq-loader,
.ra-product-card__actions > .yith_ywraq_loader {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

@keyframes ra-button-spin {
    to { transform: rotate(360deg); }
}

@media (max-width: 767px) {
    html body .ra-featured-slider .ra-slider-top .ra-slider-heading > h2.ra-slider-callout {
        font-size: clamp(24px, 7vw, 34px) !important;
    }

    html body .ra-featured-slider .ra-slider-top .ra-slider-heading > p.ra-slider-byline {
        font-size: clamp(15px, 4.5vw, 21px) !important;
    }
}

/* v0.5.2 - authoritative slider typography and tighter variation rows */
html body .ra-featured-slider .ra-slider-top .ra-slider-heading > h2.ra-slider-callout {
    font-size: 29px !important;
    line-height: .94 !important;
}

html body .ra-featured-slider .ra-slider-top .ra-slider-heading > p.ra-slider-byline {
    font-size: 18px !important;
    line-height: 1.05 !important;
}

.ra-featured-slider .ra-product-card__variations {
    row-gap: 2px !important;
}

.ra-featured-slider .ra-variation-pill {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

@media (max-width: 767px) {
    html body .ra-featured-slider .ra-slider-top .ra-slider-heading > h2.ra-slider-callout {
        font-size: 29px !important;
    }

    html body .ra-featured-slider .ra-slider-top .ra-slider-heading > p.ra-slider-byline {
        font-size: 18px !important;
    }
}

/* v0.5.3 - swapped button hover colours and centred price row */
.ra-featured-slider .ra-product-card__actions .ra-button {
    transition: background-color .18s ease !important;
}

.ra-featured-slider .ra-product-card__actions .ra-button:hover,
.ra-featured-slider .ra-product-card__actions .ra-button:focus-visible,
.ra-featured-slider .ra-product-card__actions .ra-button:active {
    filter: none !important;
    transform: none !important;
    box-shadow: none !important;
}

.ra-featured-slider .ra-product-card__actions .ra-button--quote:hover,
.ra-featured-slider .ra-product-card__actions .ra-button--quote:focus-visible,
.ra-featured-slider .ra-product-card__actions .ra-button--quote:active {
    background-color: var(--ra-comfort-blue) !important;
}

.ra-featured-slider .ra-product-card__actions .ra-button--cart:hover,
.ra-featured-slider .ra-product-card__actions .ra-button--cart:focus-visible,
.ra-featured-slider .ra-product-card__actions .ra-button--cart:active {
    background-color: #48a0dc !important;
}

.ra-featured-slider .ra-product-card__price {
    justify-content: center !important;
    text-align: center !important;
}


/* v0.6.17 - Font Awesome action icons */
.ra-featured-slider .ra-product-card__actions .ra-button {
    gap: 0 !important;
}

.ra-featured-slider .ra-button__icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 14px !important;
    width: 14px !important;
    margin-right: 7px !important;
    overflow: hidden !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: normal !important;
    line-height: 1 !important;
    speak: none;
    transition: flex-basis .15s ease, width .15s ease, margin-right .15s ease, opacity .15s ease !important;
}

.ra-featured-slider .ra-button__spinner {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.ra-featured-slider .ra-button.is-loading .ra-button__icon {
    flex-basis: 0 !important;
    width: 0 !important;
    margin-right: 0 !important;
    opacity: 0 !important;
}

.ra-featured-slider .ra-button.is-loading .ra-button__spinner {
    margin-left: 0 !important;
    margin-right: 7px !important;
}


/* Button icons
 * Max Mega Menu loads Font Awesome 5, but applies its icons through ::before.
 * Use the same rendering method here instead of relying on <i> class rules
 * that may be scoped to the menu wrapper.
 */
.ra-product-card .ra-button__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 1em;
    height: 1em;
    margin-right: 0.42em;
    font-style: normal;
    line-height: 1;
}

.ra-product-card .ra-button__icon::before {
    display: block;
    font-family: "Font Awesome 5 Free" !important;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    line-height: 1;
}

.ra-product-card .ra-button__icon--quote::before {
    content: "\f022";
    font-weight: 400;
}

.ra-product-card .ra-button__icon--cart::before {
    content: "\f07a";
    font-weight: 900;
}

/* Keep the existing loader replacement transition working with span icons. */
.ra-product-card .ra-button.is-loading .ra-button__icon {
    display: none;
}


/* v0.6.17 - Refined button icon sizing and outline cart */
.ra-product-card .ra-button__icon {
    width: 1.15em;
    height: 1em;
    margin-right: 0.38em;
    overflow: visible;
}

.ra-product-card .ra-button__icon::before {
    font-size: 0.88em;
}

/* Keep the quote icon in Font Awesome 5, but slightly smaller. */
.ra-product-card .ra-button__icon--quote::before {
    content: "\f022";
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 400;
    font-size: 0.86em;
}

/* Use a lightweight outline cart to match the quote icon's visual weight. */
.ra-product-card .ra-button__icon--cart::before {
    content: "";
    width: 1.08em;
    height: 1.08em;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='18' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.4 10.2a2 2 0 0 0 2 1.5h7.8a2 2 0 0 0 2-1.6L21 7H6'/%3E%3C/svg%3E");
}


/* v0.6.17 - Final button icon sizing before product-label work */
.ra-product-card .ra-button__icon--quote::before {
    font-size: 0.93em;
}

.ra-product-card .ra-button__icon--cart::before {
    width: 1.25em;
    height: 1.25em;
}


/* v0.6.17 - Exact user-supplied SVG icons */
.ra-product-card .ra-button__icon {
    width: 1.15em;
    height: 1.15em;
    margin-right: 0.42em;
    overflow: visible;
}

.ra-product-card .ra-button__icon::before {
    content: "" !important;
    display: block;
    width: 100%;
    height: 100%;
    background-color: currentColor;
    background-image: none !important;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.ra-product-card .ra-button__icon--quote::before {
    -webkit-mask-image: url("../icons/ra-quote.svg");
    mask-image: url("../icons/ra-quote.svg");
}

.ra-product-card .ra-button__icon--cart::before {
    -webkit-mask-image: url("../icons/ra-cart.svg");
    mask-image: url("../icons/ra-cart.svg");
}




/* ==========================================================================
   v0.6.17 - AWL logic, RightAir markup and positioning
   ========================================================================== */

.ra-product-card__labels {
    position: absolute;
    z-index: 8;
    inset: 0;
    pointer-events: none;
}

.ra-product-labels {
    position: absolute;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    max-width: 48%;
    margin: 0;
    padding: 0;
    pointer-events: none;
}

.ra-product-labels[hidden] {
    display: none !important;
}

.ra-product-labels--top-left {
    top: clamp(7px, .62vw, 12px);
    left: clamp(7px, .62vw, 12px);
}

.ra-product-labels--top-right {
    top: clamp(7px, .62vw, 12px);
    right: clamp(7px, .62vw, 12px);
    align-items: flex-end;
}

.ra-product-labels--center-right {
    top: 28%;
    right: clamp(7px, .62vw, 12px);
    transform: translateY(-50%);
    align-items: flex-end;
    max-width: 34%;
}

.ra-product-labels--bottom-left {
    left: clamp(7px, .62vw, 12px);
    top: calc(56% - clamp(7px, .62vw, 12px));
    transform: translateY(-100%);
    max-width: 48%;
}

.ra-card-label {
    box-sizing: border-box;
    margin: 0;
    border: 0;
    box-shadow: none;
    font-family: var(--ra-font);
}

.ra-card-label--discount,
.ra-card-label--text {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: clamp(16px, 1.05vw, 22px);
    padding: 4px clamp(8px, .72vw, 14px);
    border-radius: var(--ra-radius-pill);
    font-size: clamp(7px, .52vw, 10px);
    line-height: 1;
    font-weight: 800;
    letter-spacing: .01em;
    text-transform: uppercase;
    white-space: nowrap;
}

.ra-card-label--discount {
    background: var(--ra-badge-green);
    color: #fff;
}

/* All configured text labels share the approved Heat Pink pill treatment.
 * Individual IDs remain available for a future intentional exception, but a
 * valid text label must never fall back to unstyled plain text. */
.ra-card-label--text {
    background: var(--ra-heat-pink);
    color: #fff;
}

.ra-card-label--8831,
.ra-card-label--8587,
.ra-card-label--287176 {
    background: var(--ra-heat-pink);
    color: #fff;
}

.ra-card-label--image {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    padding: 0;
    background: transparent;
}

.ra-card-label--image img {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: clamp(28px, 3vw, 56px);
    margin: 0;
    padding: 0;
    object-fit: contain;
}


/* v0.6.17 - Label positions already sit inside the card padding box.
 * Do not add a second edge offset.
 */
.ra-product-labels--top-left {
    top: 0;
    left: 0;
}

.ra-product-labels--top-right {
    top: 0;
    right: 0;
}

.ra-product-labels--center-right {
    right: 0;
}

.ra-product-labels--bottom-left {
    left: 0;
}


/* v0.6.17 - Restore card-edge spacing and tighten label pills */
.ra-product-labels--top-left {
    top: 8px;
    left: 8px;
}

.ra-product-labels--top-right {
    top: 8px;
    right: 8px;
}

.ra-product-labels--center-right {
    right: 8px;
}

.ra-product-labels--bottom-left {
    left: 8px;
}

.ra-card-label--discount,
.ra-card-label--text {
    min-height: 0;
    padding: 3px 10px;
}


/* v0.6.17 - Corrected top labels only
 * Match the established card edge spacing while keeping the lower card untouched.
 */
.ra-product-labels--top-left {
    top: 6px;
    left: 6px;
}

.ra-product-labels--top-right {
    top: 6px;
    right: 6px;
}

.ra-card-label--discount,
.ra-card-label--text {
    min-height: 0;
    padding: 5px 6px;
}


/* v0.6.17 - Restore full button-row width inside the card padding */
.ra-product-card__actions {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
}

.ra-product-card__actions .ra-button {
    min-width: 0;
}


/* v0.6.17 - Label pill inner-padding ratio from approved reference */
.ra-card-label--discount,
.ra-card-label--text {
    min-height: 0;
    padding: 4px 12px;
}


/* v0.6.17 - Approved top pill proportions and discount colours */
.ra-card-label--8588,
.ra-card-label--8831,
.ra-card-label--8587,
.ra-card-label--287176,
.ra-card-label--fallback {
    min-height: 0;
    padding: 6px 9px;
}

/* Canonical discount pill: the green follows the shared Product Card palette
 * and its text remains white on every Product Card surface. */
.ra-card-label--8588,
.ra-card-label--fallback {
    background: #8bc63f;
    color: #fff;
}


/* v0.6.17 - Final agreed refinements */
.ra-card-label--8588,
.ra-card-label--8831,
.ra-card-label--8587,
.ra-card-label--287176,
.ra-card-label--fallback {
    font-weight: 700;
}

/* The cart SVG has a wider visual footprint than the quote icon.
 * Nudge only the cart button's content group left without changing button width.
 */
.ra-button--cart .ra-button__icon {
    transform: translateX(-2px);
}

.ra-button--cart .ra-button__label {
    transform: translateX(-2px);
}


/* v0.6.17 - Final top-pill font weights */
.ra-card-label--8831,
.ra-card-label--8587,
.ra-card-label--287176 {
    font-weight: 700;
}

.ra-card-label--8588,
.ra-card-label--fallback {
    font-weight: 800;
}


/* v0.6.17 - Hidden labels override pill display declarations */
.ra-product-card .ra-card-label[hidden],
.ra-product-card .ra-product-labels[hidden] {
    display: none !important;
}


/* v0.6.18 - Independent image-label sizing */
.ra-card-label--8111 {
    width: clamp(21px, 2.25vw, 31px);
    max-width: none;
}

.ra-card-label--8452 {
    width: clamp(32.3px, 3.4vw, 47.6px);
    max-width: none;
}

.ra-card-label--8108 {
    width: clamp(29.4px, 3.08vw, 42px);
    max-width: none;
}

.ra-card-label--8111 img,
.ra-card-label--8452 img,
.ra-card-label--8108 img {
    display: block;
    width: 100% !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain;
}

/* v0.6.19 - Interactive product-track dragging */
@media (min-width: 1181px) {
    .ra-slider-products-viewport {
        cursor: grab;
        touch-action: pan-y;
        user-select: none;
    }

    .ra-slider-products-viewport.is-dragging {
        cursor: grabbing;
    }

    .ra-slider-products-viewport.is-dragging .ra-slider-products-track {
        pointer-events: none;
    }
}

/* v0.7.0 - Stage 1 mobile merchandising layout and swipe slider */
@media (max-width: 767px) {
    .ra-featured-slider {
        --ra-grid-gap: 14px;
        width: 100%;
        padding: 20px 14px 26px;
        overflow: hidden;
    }

    .ra-slider-top {
        display: flex !important;
        flex-direction: column;
        gap: 14px !important;
        margin-bottom: 16px;
    }

    .ra-slider-heading {
        width: 100%;
    }

    html body .ra-featured-slider .ra-slider-top .ra-slider-heading > h2.ra-slider-callout {
        font-size: clamp(25px, 7.4vw, 32px) !important;
        line-height: .98 !important;
    }

    html body .ra-featured-slider .ra-slider-top .ra-slider-heading > p.ra-slider-byline {
        font-size: clamp(15px, 4.4vw, 18px) !important;
        line-height: 1.12 !important;
    }

    .ra-slider-tabs {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
        align-items: center !important;
        width: calc(100% + 28px);
        margin: 0 -14px;
        padding: 0 14px 3px !important;
        gap: 8px !important;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .ra-slider-tabs::-webkit-scrollbar {
        display: none;
    }

    .ra-slider-tab {
        flex: 0 0 auto;
        width: auto !important;
        min-width: max-content !important;
        min-height: 30px !important;
        padding: 0 14px !important;
        font-size: 11px !important;
        scroll-snap-align: center;
    }

    .ra-slider-layout {
        display: flex !important;
        flex-direction: column;
        gap: 18px !important;
        height: auto !important;
        max-height: none !important;
    }

    .ra-slider-block {
        width: 100%;
        height: auto !important;
        min-height: 0;
    }

    .ra-slider-block--promo {
        order: 1;
        aspect-ratio: 16 / 10 !important;
    }

    .ra-slider-block--products {
        order: 2;
        overflow: visible !important;
    }

    .ra-slider-block--brands {
        order: 3;
        aspect-ratio: auto !important;
    }

    .ra-promo-panel {
        height: 100%;
        min-height: 0;
        border-radius: 10px;
    }

    .ra-slider-products-viewport {
        width: calc(100% + 14px);
        height: auto !important;
        margin-right: -14px;
        overflow: hidden !important;
        cursor: grab;
        touch-action: pan-y;
        user-select: none;
    }

    .ra-slider-products-viewport.is-dragging {
        cursor: grabbing;
    }

    .ra-slider-products-viewport.is-dragging .ra-slider-products-track {
        pointer-events: none;
    }

    .ra-slider-products-track {
        display: flex !important;
        grid-template-columns: none !important;
        gap: 12px !important;
        width: 100%;
        height: auto !important;
        transform: translateX(0);
        transition: transform 360ms ease;
        will-change: transform;
    }

    .ra-slider-products-track .ra-product-card {
        flex: 0 0 88% !important;
        width: 88% !important;
        min-width: 0;
        height: auto !important;
        aspect-ratio: 4 / 5 !important;
        grid-template-rows: 54% 46% !important;
        scroll-snap-align: start;
    }

    .ra-product-card__title {
        -webkit-line-clamp: 3 !important;
        font-size: 13px !important;
        line-height: 1.16 !important;
    }

    .ra-product-card__body {
        padding-left: 10px !important;
        padding-right: 10px !important;
        padding-bottom: 10px !important;
        gap: 5px !important;
    }

    .ra-product-card__actions {
        gap: 7px !important;
    }

    .ra-featured-slider .ra-product-card__actions .ra-button {
        min-height: 36px !important;
        height: 36px !important;
        font-size: 11px !important;
        padding-left: 7px !important;
        padding-right: 7px !important;
    }

    .ra-brand-panel {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: calc(100% + 28px);
        height: auto !important;
        margin: 0 -14px;
        padding: 8px 14px 4px !important;
        gap: 24px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .ra-brand-panel::-webkit-scrollbar {
        display: none;
    }

    .ra-brand-logo {
        flex: 0 0 auto;
        min-width: max-content;
    }

    .ra-brand-logo__image {
        width: auto !important;
        max-width: 130px !important;
        max-height: 42px !important;
    }
}


/* v0.7.1 - Mobile visibility recovery and stable Stage 1 baseline */
@media (max-width: 767px) {
    html body .ra-featured-slider {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 1px !important;
        overflow: visible !important;
    }

    html body .ra-featured-slider .ra-slider-top,
    html body .ra-featured-slider .ra-slider-panel.is-active,
    html body .ra-featured-slider .ra-slider-layout,
    html body .ra-featured-slider .ra-slider-block,
    html body .ra-featured-slider .ra-slider-products-viewport,
    html body .ra-featured-slider .ra-slider-products-track {
        visibility: visible !important;
        opacity: 1 !important;
    }

    html body .ra-featured-slider .ra-slider-panel {
        width: 100% !important;
        height: auto !important;
    }

    html body .ra-featured-slider .ra-slider-panel.is-active {
        display: block !important;
    }

    html body .ra-featured-slider .ra-slider-layout {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        height: auto !important;
        min-height: 1px !important;
        overflow: visible !important;
    }

    html body .ra-featured-slider .ra-slider-block--products,
    html body .ra-featured-slider .ra-slider-products-viewport {
        display: block !important;
        width: 100% !important;
        min-height: 1px !important;
    }

    html body .ra-featured-slider .ra-slider-products-viewport {
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-slider-products-track {
        min-height: 1px !important;
    }
}


/* v0.7.2 - Stage 1 mobile refinement: full promo image, stronger card cue and mobile typography */
@media (max-width: 767px) {
    html body .ra-featured-slider {
        padding-left: 14px !important;
        padding-right: 0 !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-slider-top,
    html body .ra-featured-slider .ra-slider-heading {
        padding-right: 14px;
    }

    /* The promotional artwork must be shown in full. */
    html body .ra-featured-slider .ra-slider-block--promo {
        width: calc(100% - 14px) !important;
        height: auto !important;
        aspect-ratio: auto !important;
        overflow: visible !important;
    }

    html body .ra-featured-slider .ra-promo-panel {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: hidden !important;
        background: transparent !important;
    }

    html body .ra-featured-slider .ra-promo-panel__image {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
        max-height: none !important;
        object-fit: contain !important;
        object-position: center top !important;
    }

    /* More of the following card is visible, making horizontal movement obvious. */
    html body .ra-featured-slider .ra-slider-block--products,
    html body .ra-featured-slider .ra-slider-products-viewport {
        width: 100% !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-slider-products-track {
        gap: 12px !important;
        touch-action: pan-y !important;
    }

    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        flex: 0 0 82% !important;
        width: 82% !important;
        aspect-ratio: 4 / 5 !important;
        grid-template-rows: 54% 46% !important;
    }

    /* Mobile label scale - text labels and image labels are independently enlarged. */
    html body .ra-featured-slider .ra-card-label--8588,
    html body .ra-featured-slider .ra-card-label--8831,
    html body .ra-featured-slider .ra-card-label--8587,
    html body .ra-featured-slider .ra-card-label--287176,
    html body .ra-featured-slider .ra-card-label--fallback {
        min-height: 26px !important;
        padding: 7px 13px !important;
        font-size: 13px !important;
        line-height: 1 !important;
    }

    html body .ra-featured-slider .ra-card-label--8111 {
        width: 51px !important;
    }

    html body .ra-featured-slider .ra-card-label--8452 {
        width: 79px !important;
    }

    html body .ra-featured-slider .ra-card-label--8108 {
        width: 69px !important;
    }

    html body .ra-featured-slider .ra-product-card__title,
    html body .ra-featured-slider .ra-product-card__title a {
        font-size: 17px !important;
        line-height: 1.17 !important;
    }

    html body .ra-featured-slider .ra-variation-pill {
        min-height: 25px !important;
        padding: 4px 9px !important;
        font-size: 11px !important;
    }

    html body .ra-featured-slider .ra-price-current,
    html body .ra-featured-slider .ra-product-card__price ins .woocommerce-Price-amount,
    html body .ra-featured-slider .ra-product-card__price > .woocommerce-Price-amount {
        font-size: 17px !important;
    }

    html body .ra-featured-slider .ra-price-original,
    html body .ra-featured-slider .ra-product-card__price del {
        font-size: 11px !important;
    }

    html body .ra-featured-slider .ra-product-card__price {
        min-height: 24px !important;
        gap: 8px !important;
    }

    html body .ra-featured-slider .ra-product-card__actions .ra-button {
        min-height: 43px !important;
        height: 43px !important;
        font-size: 14px !important;
    }

    /* Mobile brand carousel: controlled sizes plus a clear swipe affordance. */
    html body .ra-featured-slider .ra-slider-block--brands {
        position: relative !important;
        width: 100% !important;
        padding: 0 0 24px !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-slider-block--brands::after {
        content: "Swipe logos for more  →";
        position: absolute;
        left: 0;
        bottom: 0;
        color: #667085;
        font-family: var(--ra-font);
        font-size: 11px;
        line-height: 1;
        font-weight: 600;
        letter-spacing: .01em;
        pointer-events: none;
    }

    html body .ra-featured-slider .ra-slider-block--brands::before {
        content: "";
        position: absolute;
        z-index: 2;
        top: 0;
        right: 0;
        width: 44px;
        height: calc(100% - 20px);
        background: linear-gradient(90deg, rgba(255,255,255,0), #fff 82%);
        pointer-events: none;
    }

    html body .ra-featured-slider .ra-brand-panel {
        width: 100% !important;
        margin: 0 !important;
        padding: 8px 46px 6px 0 !important;
        gap: 28px !important;
        scroll-snap-type: x proximity;
        touch-action: pan-x !important;
    }

    html body .ra-featured-slider .ra-brand-logo {
        scroll-snap-align: start;
    }

    html body .ra-featured-slider .ra-brand-logo__image {
        height: var(--ra-logo-mobile-height, var(--ra-logo-height, 45px)) !important;
        max-height: none !important;
        max-width: none !important;
        width: auto !important;
    }
}

/* v0.7.3 - Independent product timing and mobile layout correction */
@media (max-width: 767px) {
    /* Native horizontal scrolling is used on mobile for reliable iOS/Chrome swiping. */
    html body .ra-featured-slider .ra-slider-products-viewport {
        width: 100% !important;
        margin-right: 0 !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scroll-snap-type: x mandatory;
        scroll-behavior: smooth;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-x pan-y !important;
        overscroll-behavior-x: contain;
    }

    html body .ra-featured-slider .ra-slider-products-viewport::-webkit-scrollbar {
        display: none;
    }

    html body .ra-featured-slider .ra-slider-products-track {
        width: max-content !important;
        min-width: 100% !important;
        height: auto !important;
        align-items: stretch !important;
        transform: none !important;
        transition: none !important;
        touch-action: auto !important;
    }

    /* Keep a strong next-card cue while giving the active card enough usable width. */
    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        flex: 0 0 80vw !important;
        width: 80vw !important;
        max-width: calc(100vw - 62px) !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: auto !important;
        grid-template-rows: minmax(280px, 48vh) auto !important;
        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    /* Mobile cards are content-led, rather than being constrained by the promo ratio. */
    html body .ra-featured-slider .ra-product-card__image {
        min-height: 280px !important;
        height: 100% !important;
        padding-top: 46px !important;
        padding-bottom: 14px !important;
    }

    html body .ra-featured-slider .ra-product-card__body {
        display: grid !important;
        grid-template-rows: auto auto auto auto !important;
        height: auto !important;
        min-height: 0 !important;
        align-content: start !important;
        gap: 10px !important;
        padding: 0 12px 12px !important;
    }

    html body .ra-featured-slider .ra-product-card__title {
        grid-row: auto !important;
        min-height: calc(3 * 1.17em) !important;
        max-height: calc(3 * 1.17em) !important;
        margin: 0 !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__variations {
        grid-row: auto !important;
        min-height: 0 !important;
        height: auto !important;
        overflow: visible !important;
        align-content: flex-start !important;
        gap: 6px !important;
    }

    html body .ra-featured-slider .ra-product-card__price,
    html body .ra-featured-slider .ra-product-card__actions {
        grid-row: auto !important;
    }

    /* Slightly reduce the enlarged mobile text pills. */
    html body .ra-featured-slider .ra-card-label--8588,
    html body .ra-featured-slider .ra-card-label--8831,
    html body .ra-featured-slider .ra-card-label--8587,
    html body .ra-featured-slider .ra-card-label--287176,
    html body .ra-featured-slider .ra-card-label--fallback {
        min-height: 24px !important;
        padding: 6px 11px !important;
        font-size: 12px !important;
    }

    /* Reduce mobile image labels by 30% from the v0.7.2 sizes. */
    html body .ra-featured-slider .ra-card-label--8111 { width: 36px !important; }
    html body .ra-featured-slider .ra-card-label--8452 { width: 55px !important; }
    html body .ra-featured-slider .ra-card-label--8108 { width: 48px !important; }

    /* Variation pills remain readable, but use less vertical space. */
    html body .ra-featured-slider .ra-variation-pill {
        min-height: 23px !important;
        padding: 3px 8px !important;
        font-size: 10.5px !important;
    }

    /* Replace the instructional note with a continuous, passive logo marquee. */
    html body .ra-featured-slider .ra-slider-block--brands {
        padding-bottom: 0 !important;
    }

    html body .ra-featured-slider .ra-slider-block--brands::after,
    html body .ra-featured-slider .ra-slider-block--brands::before {
        content: none !important;
        display: none !important;
    }

    html body .ra-featured-slider .ra-brand-panel {
        width: max-content !important;
        min-width: max-content !important;
        margin: 0 !important;
        padding: 9px 0 7px !important;
        gap: 28px !important;
        overflow: visible !important;
        flex-wrap: nowrap !important;
        animation: ra-mobile-brand-marquee var(--ra-brand-duration, 18s) linear infinite;
        will-change: transform;
    }

    html body .ra-featured-slider .ra-brand-logo--clone {
        pointer-events: none !important;
    }
}

@keyframes ra-mobile-brand-marquee {
    from { transform: translate3d(0, 0, 0); }
    to { transform: translate3d(calc(-1 * var(--ra-brand-distance, 0px)), 0, 0); }
}

@media (prefers-reduced-motion: reduce) and (max-width: 767px) {
    html body .ra-featured-slider .ra-brand-panel {
        animation-play-state: paused !important;
    }
}


/* v0.7.4 - Mobile focus retention and desktop-led card geometry */
@media (max-width: 767px) {
    /* The main promotional rotation must never shift the mobile viewport to its tab. */
    html body .ra-featured-slider .ra-slider-tabs,
    html body .ra-featured-slider .ra-slider-tab {
        scroll-margin: 0 !important;
    }

    /* Keep every mobile card on one shared structural height. The desktop card's
       two-section system remains authoritative, while the mobile version gets
       enough height for wrapped variation rows. */
    html body .ra-featured-slider .ra-slider-products-track {
        align-items: stretch !important;
    }

    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        height: clamp(570px, 148vw, 690px) !important;
        min-height: clamp(570px, 148vw, 690px) !important;
        max-height: clamp(570px, 148vw, 690px) !important;
        grid-template-rows: 54% 46% !important;
        align-self: stretch !important;
    }

    /* Product imagery uses one consistent contain box. Wide wall units may use
       the available width without being cropped, stretched or forcing card height. */
    html body .ra-featured-slider .ra-product-card__image {
        min-height: 0 !important;
        height: 100% !important;
        padding: 46px 12px 8px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    html body .ra-featured-slider .ra-product-card__image img,
    html body .ra-featured-slider .ra-product-card__image-el {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        max-width: 100% !important;
        max-height: 100% !important;
        object-fit: contain !important;
        object-position: center !important;
    }

    /* Mirror desktop alignment: fixed title zone, controlled variation zone,
       then prices and actions locked to the bottom of every card. */
    html body .ra-featured-slider .ra-product-card__body {
        height: 100% !important;
        min-height: 0 !important;
        display: grid !important;
        grid-template-rows: calc(3 * 1.17em) minmax(72px, 1fr) auto auto !important;
        align-content: stretch !important;
        gap: 8px !important;
        padding: 0 12px 12px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__title {
        min-height: calc(3 * 1.17em) !important;
        max-height: calc(3 * 1.17em) !important;
        align-self: start !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__variations {
        min-height: 72px !important;
        max-height: 104px !important;
        height: auto !important;
        align-self: start !important;
        align-content: flex-start !important;
        overflow: hidden !important;
        padding-top: 2px !important;
    }

    html body .ra-featured-slider .ra-product-card__price {
        align-self: end !important;
        margin-top: 0 !important;
    }

    html body .ra-featured-slider .ra-product-card__actions {
        align-self: end !important;
        margin-top: 0 !important;
    }
}

/* v0.7.5 - Tight mobile product-card geometry */
@media (max-width: 767px) {
    /* One shared, content-led card height: large enough for a two-line title,
       two variation rows, price and aligned actions, without dead space. */
    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        height: clamp(500px, 132vw, 570px) !important;
        min-height: clamp(500px, 132vw, 570px) !important;
        max-height: clamp(500px, 132vw, 570px) !important;
        grid-template-rows: 56% 44% !important;
    }

    html body .ra-featured-slider .ra-product-card__image {
        padding: 42px 14px 6px !important;
    }

    html body .ra-featured-slider .ra-product-card__image img,
    html body .ra-featured-slider .ra-product-card__image-el {
        width: 94% !important;
        height: 92% !important;
        max-width: 94% !important;
        max-height: 92% !important;
        object-fit: contain !important;
        object-position: center !important;
    }

    /* Desktop-led vertical order, compressed for mobile:
       title -> variations -> price -> actions. */
    html body .ra-featured-slider .ra-product-card__body {
        grid-template-rows: calc(2 * 1.17em) minmax(50px, 1fr) auto auto !important;
        gap: 7px !important;
        padding: 0 12px 11px !important;
        align-content: stretch !important;
    }

    html body .ra-featured-slider .ra-product-card__title {
        min-height: calc(2 * 1.17em) !important;
        max-height: calc(2 * 1.17em) !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        line-clamp: 2 !important;
        overflow: hidden !important;
        align-self: start !important;
    }

    html body .ra-featured-slider .ra-product-card__variations {
        min-height: 50px !important;
        max-height: 54px !important;
        height: 54px !important;
        padding-top: 1px !important;
        gap: 5px !important;
        align-content: flex-start !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__price {
        min-height: 28px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
    }

    html body .ra-featured-slider .ra-product-card__actions {
        min-height: 56px !important;
        margin: 0 !important;
        align-self: end !important;
    }
}

/* v0.7.6 - Final mobile card spacing and equal inset system */
@media (max-width: 767px) {
    /* Compact, equal-height mobile card based on actual content requirements. */
    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        height: clamp(470px, 124vw, 525px) !important;
        min-height: clamp(470px, 124vw, 525px) !important;
        max-height: clamp(470px, 124vw, 525px) !important;
        grid-template-rows: 50% 50% !important;
    }

    /* One consistent 12px card-edge inset for all positioned labels. */
    html body .ra-featured-slider .ra-product-labels--top-left {
        top: 12px !important;
        left: 12px !important;
    }

    html body .ra-featured-slider .ra-product-labels--top-right {
        top: 12px !important;
        right: 12px !important;
    }

    html body .ra-featured-slider .ra-product-labels--center-right {
        right: 12px !important;
    }

    html body .ra-featured-slider .ra-product-labels--bottom-left {
        left: 12px !important;
        top: calc(50% - 12px) !important;
    }

    /* Reduce the image section and keep all product artwork contained. */
    html body .ra-featured-slider .ra-product-card__image {
        padding: 38px 12px 8px !important;
    }

    html body .ra-featured-slider .ra-product-card__image img,
    html body .ra-featured-slider .ra-product-card__image-el {
        width: 96% !important;
        height: 88% !important;
        max-width: 96% !important;
        max-height: 88% !important;
        object-fit: contain !important;
        object-position: center !important;
    }

    /* Content-led lower section: three-line title, two pill rows, price, actions.
       No flexible row remains to create a dead gap above the price. */
    html body .ra-featured-slider .ra-product-card__body {
        grid-template-rows: calc(3 * 1.17em) 54px auto 56px !important;
        gap: 7px !important;
        padding: 0 12px 12px !important;
        align-content: start !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__title {
        min-height: calc(3 * 1.17em) !important;
        max-height: calc(3 * 1.17em) !important;
        -webkit-line-clamp: 3 !important;
        line-clamp: 3 !important;
        align-self: start !important;
    }

    html body .ra-featured-slider .ra-product-card__variations {
        min-height: 54px !important;
        max-height: 54px !important;
        height: 54px !important;
        margin-top: 3px !important;
        padding: 0 !important;
        gap: 5px !important;
        align-self: start !important;
        align-content: flex-start !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__price {
        min-height: 28px !important;
        margin: 0 !important;
        align-self: end !important;
    }

    html body .ra-featured-slider .ra-product-card__actions {
        min-height: 56px !important;
        height: 56px !important;
        margin: 0 !important;
        align-self: end !important;
    }
}


/* v0.7.7 - Mobile lower-section two-zone structure */
@media (max-width: 767px) {
    /* Keep every mobile card equal, but only as tall as the approved content needs. */
    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        height: clamp(438px, 116vw, 490px) !important;
        min-height: clamp(438px, 116vw, 490px) !important;
        max-height: clamp(438px, 116vw, 490px) !important;
        grid-template-rows: 45% 55% !important;
    }

    /* Shorter top section while preserving contain behaviour for wide aircon artwork. */
    html body .ra-featured-slider .ra-product-card__image {
        padding: 34px 12px 5px !important;
    }

    html body .ra-featured-slider .ra-product-card__image img,
    html body .ra-featured-slider .ra-product-card__image-el {
        width: 96% !important;
        height: 90% !important;
        max-width: 96% !important;
        max-height: 90% !important;
        object-fit: contain !important;
        object-position: center !important;
    }

    html body .ra-featured-slider .ra-product-labels--bottom-left {
        top: calc(45% - 12px) !important;
    }

    /* Two internal zones:
       1. title fixed at the top;
       2. variations, price and actions kept together at the bottom. */
    html body .ra-featured-slider .ra-product-card__body {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        padding: 0 12px 12px !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__title {
        flex: 0 0 calc(3 * 1.17em) !important;
        min-height: calc(3 * 1.17em) !important;
        max-height: calc(3 * 1.17em) !important;
        margin: 0 !important;
        -webkit-line-clamp: 3 !important;
        line-clamp: 3 !important;
        align-self: stretch !important;
    }

    /* margin-top:auto anchors the complete controls group, not the price alone. */
    html body .ra-featured-slider .ra-product-card__variations {
        flex: 0 0 54px !important;
        min-height: 54px !important;
        max-height: 54px !important;
        height: 54px !important;
        margin: auto 0 0 !important;
        padding: 0 !important;
        gap: 5px !important;
        align-content: flex-start !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__price {
        flex: 0 0 auto !important;
        min-height: 28px !important;
        margin: 7px 0 0 !important;
        align-self: stretch !important;
    }

    html body .ra-featured-slider .ra-product-card__actions {
        flex: 0 0 56px !important;
        min-height: 56px !important;
        height: 56px !important;
        margin: 7px 0 0 !important;
        align-self: stretch !important;
    }
}

/* v0.7.8 - Structural mobile controls group
   Desktop/tablet keep the established grid placement. Mobile turns the
   variations, price and actions into one bottom-anchored unit. */
.ra-product-card__controls {
    display: contents;
}

@media (max-width: 767px) {
    html body .ra-featured-slider .ra-product-card__body {
        display: flex !important;
        flex-direction: column !important;
        padding: 0 12px 12px !important;
        gap: 0 !important;
        min-height: 0 !important;
    }

    html body .ra-featured-slider .ra-product-card__title {
        flex: 0 0 calc(3 * 1.17em) !important;
        min-height: calc(3 * 1.17em) !important;
        max-height: calc(3 * 1.17em) !important;
        margin: 0 !important;
    }

    html body .ra-featured-slider .ra-product-card__controls {
        display: flex !important;
        flex-direction: column !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        margin-top: auto !important;
        padding: 0 !important;
        gap: 7px !important;
        min-height: 0 !important;
    }

    html body .ra-featured-slider .ra-product-card__controls .ra-product-card__variations {
        flex: 0 0 54px !important;
        width: 100% !important;
        min-height: 54px !important;
        max-height: 54px !important;
        height: 54px !important;
        margin: 0 !important;
        padding: 0 !important;
        align-content: flex-start !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__controls .ra-product-card__price {
        flex: 0 0 auto !important;
        width: 100% !important;
        min-height: 28px !important;
        margin: 0 !important;
    }

    html body .ra-featured-slider .ra-product-card__controls .ra-product-card__actions {
        flex: 0 0 56px !important;
        width: 100% !important;
        min-height: 56px !important;
        height: 56px !important;
        margin: 0 !important;
    }
}

/* v0.7.9 - Mobile card proportion correction and desktop logo de-duplication */
/* Marquee clones exist only to create the continuous mobile loop. */
html body .ra-featured-slider .ra-brand-logo--clone {
    display: none !important;
}

@media (max-width: 767px) {
    html body .ra-featured-slider .ra-brand-logo--clone {
        display: inline-flex !important;
    }

    /* Reduce the overall card to the content-led height required by the
       three-line title and the fixed bottom controls group. */
    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        height: clamp(408px, 108vw, 452px) !important;
        min-height: clamp(408px, 108vw, 452px) !important;
        max-height: clamp(408px, 108vw, 452px) !important;
        grid-template-rows: 42% 58% !important;
    }

    html body .ra-featured-slider .ra-product-card__image {
        padding: 30px 12px 4px !important;
    }

    html body .ra-featured-slider .ra-product-labels--bottom-left {
        top: calc(42% - 12px) !important;
    }

    /* The body uses the exact same 12px inset below the buttons as the
       12px inset above the top label pills. */
    html body .ra-featured-slider .ra-product-card__body {
        padding: 0 12px 12px !important;
    }

    /* Explicit three-line clamp. Earlier inherited declarations could still
       collapse the rendered title to two lines on iOS. */
    html body .ra-featured-slider .ra-product-card__title,
    html body .ra-featured-slider .ra-product-card__title > a {
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 3 !important;
        line-clamp: 3 !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__title {
        flex-basis: calc(3 * 1.17em) !important;
        min-height: calc(3 * 1.17em) !important;
        max-height: calc(3 * 1.17em) !important;
    }

    /* Keep the controls structurally anchored at the bottom, but minimise
       the flexible space between the title zone and controls zone. */
    html body .ra-featured-slider .ra-product-card__controls {
        margin-top: auto !important;
        gap: 7px !important;
    }
}


/* v0.7.10 - Mobile title clamp and compact two-zone card correction */
@media (max-width: 767px) {
    /* Use the shortest equal card height that safely contains the image,
       three-line title and two-row controls block. */
    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        height: clamp(388px, 101vw, 420px) !important;
        min-height: clamp(388px, 101vw, 420px) !important;
        max-height: clamp(388px, 101vw, 420px) !important;
        grid-template-rows: 40% 60% !important;
    }

    html body .ra-featured-slider .ra-product-card__image {
        padding: 28px 12px 2px !important;
    }

    html body .ra-featured-slider .ra-product-labels--bottom-left {
        top: calc(40% - 12px) !important;
    }

    html body .ra-featured-slider .ra-product-card__body {
        display: grid !important;
        grid-template-rows: auto auto !important;
        align-content: space-between !important;
        min-height: 0 !important;
        padding: 0 12px 12px !important;
        row-gap: 8px !important;
    }

    /* The heading itself owns the three-line height; only the link is
       clamped. This prevents inherited two-line rules from clipping iOS. */
    html body .ra-featured-slider .ra-product-card__title {
        display: block !important;
        height: calc(3 * 1.17em) !important;
        min-height: calc(3 * 1.17em) !important;
        max-height: calc(3 * 1.17em) !important;
        margin: 0 !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__title > a {
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 3 !important;
        line-clamp: 3 !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__controls {
        display: flex !important;
        flex-direction: column !important;
        align-self: end !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 7px !important;
    }
}

/* v0.7.12 - Revert v0.7.11 geometry; authoritative mobile bottom inset only.
 * Keep the approved v0.7.10 card/image proportions unchanged.
 * The body fills its grid row and the controls sit against the exact 12px
 * inner bottom inset, matching the 12px inset above the top label pills.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-product-card__body {
        align-self: stretch !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        padding: 0 12px 12px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__controls {
        align-self: end !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html body .ra-featured-slider .ra-product-card__actions {
        margin: 0 !important;
        padding: 0 !important;
    }
}


/* v0.7.13 - Precise mobile card correction
 * Based on the approved desktop principles:
 * - preserve the title-to-controls separation;
 * - keep one shared 12px card inset;
 * - remove only the excess space below the action buttons;
 * - enlarge only the product image inside the existing image area.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        --ra-mobile-card-inset: 12px;
        /* The image area remains the same height as v0.7.12.
           Only the lower card row is shortened to remove the excess bottom space. */
        height: clamp(374px, 97vw, 404px) !important;
        min-height: clamp(374px, 97vw, 404px) !important;
        max-height: clamp(374px, 97vw, 404px) !important;
        grid-template-rows: clamp(155px, 40.4vw, 168px) minmax(0, 1fr) !important;
    }

    /* Use the same inset above the top labels and below the buttons. */
    html body .ra-featured-slider .ra-product-labels--top-left,
    html body .ra-featured-slider .ra-product-labels--top-right {
        top: var(--ra-mobile-card-inset) !important;
    }

    html body .ra-featured-slider .ra-product-labels--top-left {
        left: var(--ra-mobile-card-inset) !important;
    }

    html body .ra-featured-slider .ra-product-labels--top-right {
        right: var(--ra-mobile-card-inset) !important;
    }

    html body .ra-featured-slider .ra-product-card__body {
        padding: 0 var(--ra-mobile-card-inset) var(--ra-mobile-card-inset) !important;
        grid-template-rows: auto auto !important;
        align-content: space-between !important;
        row-gap: 8px !important;
    }

    html body .ra-featured-slider .ra-product-card__controls,
    html body .ra-featured-slider .ra-product-card__actions {
        margin: 0 !important;
        padding-bottom: 0 !important;
    }

    /* Increase only the artwork inside the unchanged image container. */
    html body .ra-featured-slider .ra-product-card__image img,
    html body .ra-featured-slider .ra-product-card__image-el {
        width: 108% !important;
        max-width: 108% !important;
        height: 96% !important;
        max-height: 96% !important;
        object-fit: contain !important;
        object-position: center !important;
    }

    html body .ra-featured-slider .ra-product-labels--bottom-left {
        top: calc(clamp(155px, 40.4vw, 168px) - var(--ra-mobile-card-inset)) !important;
    }
}


/* v0.7.15 - Correct mobile action-row geometry
 * Root cause: the mobile actions wrapper was fixed at 56px while the
 * rendered buttons are 43px high. The unused 13px inside that wrapper,
 * combined with the intended card inset, created the false bottom padding.
 *
 * Keep the approved title-to-controls separation and all card proportions.
 * Match the wrapper to the actual button height, and enlarge only the
 * product artwork slightly inside the existing image container.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-product-card__controls .ra-product-card__actions,
    html body .ra-featured-slider .ra-product-card__actions {
        flex: 0 0 43px !important;
        min-height: 43px !important;
        height: 43px !important;
        align-items: stretch !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html body .ra-featured-slider .ra-product-card__actions .ra-button {
        min-height: 43px !important;
        height: 43px !important;
    }

    /* Increase only the image inside the existing container. */
    html body .ra-featured-slider .ra-product-card__image img,
    html body .ra-featured-slider .ra-product-card__image-el {
        width: 112% !important;
        max-width: 112% !important;
        height: 98% !important;
        max-height: 98% !important;
        object-fit: contain !important;
        object-position: center !important;
    }
}


/* v0.7.18 - Mobile product image scale only
 * Increase the product artwork by approximately 20% inside the existing
 * image container. No card geometry, spacing or interaction changes.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-product-card__image img,
    html body .ra-featured-slider .ra-product-card__image-el {
        width: 134.4% !important;
        max-width: 134.4% !important;
        height: 117.6% !important;
        max-height: 117.6% !important;
        object-fit: contain !important;
        object-position: center !important;
    }
}


/* v0.7.20 - Mobile product title breathing room
 * Add a small consistent gap above the title and reduce the mobile title
 * font size by 1px. No image-container or card-geometry changes.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-product-card__title {
        padding-top: 6px !important;
        font-size: 17px !important;
    }
}


/* v0.7.21 - Correct mobile title spacing and font application
 * Keep the approved 6px image-to-title breathing room, but do not take it
 * out of the three-line text area. Apply the reduced font size directly to
 * both the title wrapper and link so inherited rules cannot override it.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-product-card__title {
        box-sizing: border-box !important;
        height: calc((3 * 1.17em) + 6px) !important;
        min-height: calc((3 * 1.17em) + 6px) !important;
        max-height: calc((3 * 1.17em) + 6px) !important;
        padding: 6px 0 0 !important;
        font-size: 17px !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-product-card__title > a {
        font-size: 17px !important;
        line-height: 1.17 !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 3 !important;
        line-clamp: 3 !important;
        overflow: hidden !important;
    }
}


/* v0.7.22 - Mobile title-to-variation spacing
 * Move the variation pills down slightly while preserving all other
 * approved mobile card geometry and typography.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-product-card__controls .ra-product-card__variations {
        margin-top: 6px !important;
    }
}


/* v0.7.23 - Mobile title-to-variation breathing room
 * Add 12px to the total mobile card height and use that space only between
 * the three-line title and the variation pills. Preserve the image area,
 * controls spacing and approved bottom inset.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        height: clamp(386px, calc(97vw + 12px), 416px) !important;
        min-height: clamp(386px, calc(97vw + 12px), 416px) !important;
        max-height: clamp(386px, calc(97vw + 12px), 416px) !important;
    }

    html body .ra-featured-slider .ra-product-card__controls .ra-product-card__variations {
        margin-top: 18px !important;
    }
}


/* v0.7.24 - Mobile variation-row vertical alignment
 * Match the desktop visual alignment by placing a single mobile variation
 * row at the bottom of its existing 54px variation zone. Preserve card
 * height, title spacing, image size, price/actions and bottom inset.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-product-card__controls .ra-product-card__variations {
        align-content: flex-end !important;
    }
}


/* v0.7.25 - True mobile product-image vertical centring
 * The image wrapper was already a centred flex container, but the image's
 * inherited auto margins prevented an oversized mobile image from sharing
 * negative free space equally. That pinned the artwork toward the start of
 * the available image area. Remove only those mobile auto margins so the
 * existing flex alignment can centre the image vertically and horizontally.
 * Preserve image scale, image-area height, labels and all lower-card geometry.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-product-card__image img,
    html body .ra-featured-slider .ra-product-card__image-el {
        margin: 0 !important;
    }
}

/* v0.7.26 - Canonical desktop sizing for the 1400px body system
 * Keep the approved five-column structure stable between normal desktop
 * viewport sizes. The page outside the component may narrow, but the card
 * typography and controls must not scale down with viewport-width units.
 * Tablet/intermediate and approved mobile rules remain unchanged.
 */
@media (min-width: 1181px) {
    html body .ra-featured-slider {
        --ra-grid-gap: 14px !important;
        width: 100% !important;
        max-width: 1400px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding: 0 !important;
    }

    html body .ra-featured-slider .ra-slider-top {
        gap: 14px !important;
        margin-bottom: 20px !important;
    }

    html body .ra-featured-slider .ra-slider-layout,
    html body .ra-featured-slider .ra-slider-products-track {
        gap: 14px !important;
    }

    html body .ra-featured-slider .ra-product-card__badges {
        inset: 9px 9px auto 9px !important;
    }

    html body .ra-featured-slider .ra-product-badge,
    html body .ra-featured-slider .ra-product-card .awl-label-text,
    html body .ra-featured-slider .ra-card-label--8588,
    html body .ra-featured-slider .ra-card-label--8831,
    html body .ra-featured-slider .ra-card-label--8587,
    html body .ra-featured-slider .ra-card-label--287176,
    html body .ra-featured-slider .ra-card-label--fallback {
        font-size: 9px !important;
    }

    html body .ra-featured-slider .ra-product-card__body {
        padding: 0 7px 7px !important;
        gap: 4px !important;
    }

    html body .ra-featured-slider .ra-product-card__title,
    html body .ra-featured-slider .ra-product-card__title > a {
        font-size: 12px !important;
        line-height: 1.13 !important;
    }

    html body .ra-featured-slider .ra-product-card__variations {
        gap: 4px !important;
    }

    html body .ra-featured-slider .ra-variation-pill {
        min-height: 18px !important;
        padding: 3px 6px !important;
        font-size: 8px !important;
    }

    html body .ra-featured-slider .ra-product-card__price {
        min-height: 20px !important;
        margin-top: 5px !important;
        gap: 8px !important;
    }

    html body .ra-featured-slider .ra-price-current,
    html body .ra-featured-slider .ra-product-card__price ins .woocommerce-Price-amount,
    html body .ra-featured-slider .ra-product-card__price > .woocommerce-Price-amount {
        font-size: 14px !important;
    }

    html body .ra-featured-slider .ra-price-original,
    html body .ra-featured-slider .ra-product-card__price del {
        font-size: 10px !important;
    }

    html body .ra-featured-slider .ra-product-card__actions {
        gap: 5px !important;
    }

    html body .ra-featured-slider .ra-button {
        height: 30px !important;
        min-height: 30px !important;
        padding: 2px 6px !important;
        font-size: 10.5px !important;
    }

    html body .ra-featured-slider .ra-card-label--8111 {
        width: 31px !important;
    }

    html body .ra-featured-slider .ra-card-label--8452 {
        width: 47.6px !important;
    }

    html body .ra-featured-slider .ra-card-label--8108 {
        width: 42px !important;
    }
}

/* v0.7.27 - Desktop card space allocation and compact title mode
 * Reclaim a controlled amount from the desktop image/label region so the
 * lower card section can always show two variation rows without clipping.
 * Keep the full desktop presentation at three title lines, then use a
 * deliberate two-line compact title between the desktop and mobile layouts.
 * Typography, image scale, labels, price, actions and mobile rules remain
 * unchanged.
 */
@media (min-width: 1181px) {
    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        grid-template-rows: 52% 48% !important;
    }

    html body .ra-featured-slider .ra-product-card__variations {
        min-height: 40px !important;
        max-height: 40px !important;
        height: 40px !important;
        align-content: flex-start !important;
        overflow: hidden !important;
    }
}

/* Compact desktop: preserve readable type and controls rather than scaling
 * the card down. The mobile layout still begins at its existing breakpoint.
 */
@media (min-width: 1181px) and (max-width: 1400px) {
    html body .ra-featured-slider .ra-product-card__title,
    html body .ra-featured-slider .ra-product-card__title > a {
        -webkit-line-clamp: 2 !important;
        line-clamp: 2 !important;
        max-height: calc(1.13em * 2) !important;
    }
}

/* v0.7.28 - Compact-desktop title/variation separation and image-label inset
 * At the narrow end of the five-column desktop layout, the 52/48 card split
 * did not leave enough lower-card height for a fixed two-line title, two rows
 * of variations, price and actions. Give compact desktop an intentional 50/50
 * split and reserve an explicit two-line title row so the variation zone can
 * never intrude into the title. Keep pill sizing readable and unchanged.
 * Re-anchor bottom-left image labels to the current image/body boundary with
 * a deliberate inset so Blue Tag and Black Friday no longer touch the title.
 */
@media (min-width: 1181px) {
    html body .ra-featured-slider .ra-product-labels--bottom-left {
        top: calc(52% - 8px) !important;
    }
}

@media (min-width: 1181px) and (max-width: 1250px) {
    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        grid-template-rows: 50% 50% !important;
    }

    html body .ra-featured-slider .ra-product-card__body {
        grid-template-rows: calc(1.13em * 2) minmax(0, 1fr) 40px 20px 30px !important;
    }

    html body .ra-featured-slider .ra-product-card__title,
    html body .ra-featured-slider .ra-product-card__title > a {
        min-height: calc(1.13em * 2) !important;
        height: calc(1.13em * 2) !important;
        max-height: calc(1.13em * 2) !important;
    }

    html body .ra-featured-slider .ra-product-labels--bottom-left {
        top: calc(50% - 8px) !important;
    }
}


/* v0.7.29 - per-slide heading colours */
html body .ra-featured-slider .ra-slider-top .ra-slider-heading > h2.ra-slider-callout {
    color: var(--ra-slide-callout-color, var(--ra-text)) !important;
}

html body .ra-featured-slider .ra-slider-top .ra-slider-heading > p.ra-slider-byline {
    color: var(--ra-slide-byline-color, var(--ra-component-muted)) !important;
}


/* v0.7.33 - Stable desktop tab padding, slide fade and mobile autoplay
 * Desktop slide buttons size to their label with identical left/right padding,
 * rather than retaining variable spare width from min-width rules.
 * Active panels receive a short, basic fade-in so slide changes feel softer.
 * The mobile autoplay correction is implemented in frontend-slider.js; CSS here does
 * not alter approved mobile layout or controls.
 */
@media (min-width: 1181px) {
    html body .ra-featured-slider .ra-slider-tab {
        width: auto !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

html body .ra-featured-slider .ra-slider-panel.is-active {
    animation: ra-slide-panel-fade 280ms ease-out both;
}

@keyframes ra-slide-panel-fade {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* v0.8.20 - Mobile variation-zone top alignment
 * Variable-product pills now start at the top of their reserved mobile zone,
 * matching the shared product-card treatment used elsewhere. The existing
 * title-to-controls spacing and fixed zone height remain unchanged.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-product-card__controls .ra-product-card__variations {
        align-content: flex-start !important;
    }
}

/* v0.8.21 - Mobile slider tabs wrap into visible rows
 * Keep every slide title available without horizontal scrolling. Tabs now
 * wrap naturally within the slider width while preserving their label-sized
 * buttons and the existing active/progress behaviour.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-slider-tabs {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 0 0 3px !important;
        flex-wrap: wrap !important;
        overflow-x: visible !important;
        overflow-y: visible !important;
        scroll-snap-type: none !important;
    }

    html body .ra-featured-slider .ra-slider-tab {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: 0 !important;
        scroll-snap-align: none !important;
    }
}


/* v0.8.22 - Mobile slider centre-right label parity
 * The shared label markup remains unchanged. This mobile slider surface
 * override anchors centre-right labels to the exact vertical midpoint of
 * the 50% image stage, matching the shared card position used elsewhere.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-product-labels--center-right {
        top: 25% !important;
        right: 12px !important;
        transform: translateY(-50%) !important;
    }
}

/* v0.9.4 - Mobile slider image-stage parity
 * Retain the v0.9.3 mobile top-spacing correction and increase the mobile
 * product image stage to 50%. Increase total card height proportionally so
 * the lower content stage keeps its existing usable height, then re-anchor
 * image-linked labels to the new image boundary.
 */
@media (max-width: 767px) {
    html body .ra-featured-slider {
        padding-top: 0 !important;
    }

    html body .ra-featured-slider .ra-slider-products-track .ra-product-card {
        height: clamp(462px, calc(113vw + 28px), 496px) !important;
        min-height: clamp(462px, calc(113vw + 28px), 496px) !important;
        max-height: clamp(462px, calc(113vw + 28px), 496px) !important;
        grid-template-rows: 50% 50% !important;
    }

    html body .ra-featured-slider .ra-product-labels--bottom-left {
        top: calc(50% - 12px) !important;
    }

    html body .ra-featured-slider .ra-product-labels--center-right {
        top: 25% !important;
    }
}



/* v0.9.9 - Tablet featured slider remains a single horizontal rail.
 * The tablet layout follows the mobile merchandising order: full-width portrait
 * promo, three-card slider viewport and passive brand-logo marquee. */
@media (min-width: 768px) and (max-width: 1180px) {
    html body .ra-featured-slider {
        width: 100% !important;
        max-width: 1400px !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-slider-layout {
        display: flex !important;
        flex-direction: column !important;
        grid-template-columns: none !important;
        gap: 18px !important;
        height: auto !important;
        max-height: none !important;
    }

    html body .ra-featured-slider .ra-slider-block {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
    }

    html body .ra-featured-slider .ra-slider-block--promo {
        order: 1 !important;
        width: 100% !important;
        aspect-ratio: auto !important;
        overflow: visible !important;
    }

    html body .ra-featured-slider .ra-promo-panel,
    html body .ra-featured-slider .ra-promo-panel picture {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: hidden !important;
        background: transparent !important;
    }

    html body .ra-featured-slider .ra-promo-panel__image {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
        max-height: none !important;
        object-fit: contain !important;
        object-position: center top !important;
    }

    html body .ra-featured-slider .ra-slider-block--products {
        order: 2 !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-slider-products-viewport {
        width: 100% !important;
        height: auto !important;
        overflow: hidden !important;
        cursor: grab;
        touch-action: pan-y;
        user-select: none;
    }

    html body .ra-featured-slider .ra-slider-products-viewport.is-dragging {
        cursor: grabbing;
    }

    html body .ra-featured-slider .ra-slider-block--brands {
        order: 3 !important;
        position: relative !important;
        width: 100% !important;
        aspect-ratio: auto !important;
        overflow: hidden !important;
    }

    html body .ra-featured-slider .ra-brand-panel {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: max-content !important;
        min-width: max-content !important;
        height: auto !important;
        margin: 0 !important;
        padding: 9px 0 7px !important;
        gap: 28px !important;
        overflow: visible !important;
        animation: ra-mobile-brand-marquee var(--ra-brand-duration, 18s) linear infinite;
        will-change: transform;
    }

    html body .ra-featured-slider .ra-brand-logo {
        flex: 0 0 auto !important;
        min-width: max-content !important;
    }

    html body .ra-featured-slider .ra-brand-logo__image {
        height: var(--ra-logo-mobile-height, var(--ra-logo-height, 45px)) !important;
        max-height: none !important;
        max-width: none !important;
        width: auto !important;
    }

    html body .ra-featured-slider .ra-brand-logo--clone {
        pointer-events: none !important;
    }
}

@media (prefers-reduced-motion: reduce) and (min-width: 768px) and (max-width: 1180px) {
    html body .ra-featured-slider .ra-brand-panel {
        animation-play-state: paused !important;
    }
}


/* v0.9.11 - Responsive brand marquee guard
 * Short logo rows remain static. Only rows wider than their viewport receive
 * clones and continuous movement, preventing empty space from sliding onscreen.
 */
@media (max-width: 1180px) {
    html body .ra-featured-slider .ra-brand-panel {
        animation: none !important;
        transform: translate3d(0, 0, 0);
    }

    html body .ra-featured-slider .ra-brand-panel.is-marquee {
        width: max-content !important;
        min-width: max-content !important;
        justify-content: flex-start !important;
        animation: ra-mobile-brand-marquee var(--ra-brand-duration, 18s) linear infinite !important;
        will-change: transform;
    }

    html body .ra-featured-slider .ra-brand-panel.is-static {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
        transform: none !important;
        will-change: auto;
    }
}

@media (prefers-reduced-motion: reduce) and (max-width: 1180px) {
    html body .ra-featured-slider .ra-brand-panel.is-marquee {
        animation-play-state: paused !important;
    }
}


/* v0.9.12 - Stable brand alignment state
 * Static centred alignment is the default and remains active during image-load
 * and resize measurement. The row changes to flex-start only after overflow is
 * confirmed and the seamless marquee has been prepared. */
@media (max-width: 1180px) {
    html body .ra-featured-slider .ra-brand-panel:not(.is-marquee),
    html body .ra-featured-slider .ra-brand-panel.is-static {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
        animation: none !important;
        transform: none !important;
        will-change: auto !important;
    }
}


/* v0.9.14 - Per-slide brand logo behaviour
 * Static rows are always left aligned. Marquee rows are activated by the
 * per-slide setting after JavaScript has prepared complete logo sequences. */
@media (max-width: 1180px) {
    html body .ra-featured-slider .ra-brand-panel:not(.is-marquee),
    html body .ra-featured-slider .ra-brand-panel.is-static {
        justify-content: flex-start !important;
    }
}


/* v0.10.25 - Slider-level timing/typography contract */
html body .ra-featured-slider .ra-slider-top .ra-slider-heading > h2.ra-slider-callout {
    font-size: var(--ra-slider-title-size, 29px) !important;
    font-weight: var(--ra-slider-title-weight, 900) !important;
    letter-spacing: var(--ra-slider-title-letter-spacing, -0.045em) !important;
}

html body .ra-featured-slider .ra-slider-top .ra-slider-heading > p.ra-slider-byline {
    font-size: var(--ra-slider-byline-size, 18px) !important;
    font-weight: var(--ra-slider-byline-weight, 800) !important;
    letter-spacing: var(--ra-slider-byline-letter-spacing, -0.025em) !important;
}

html body .ra-featured-slider .ra-slider-panel.is-active {
    animation-duration: var(--ra-slide-fade-duration, 280ms) !important;
}
.ra-single-product__button-set .ra-button__icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 14px !important;
    width: 14px !important;
    height: 14px !important;
    margin-right: 7px !important;
}

.ra-single-product__button-set .ra-button__icon::before {
    content: "" !important;
    display: block;
    width: 100%;
    height: 100%;
    background-color: currentColor;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.ra-single-product__button-set .ra-button__icon--quote::before {
    -webkit-mask-image: url("../icons/ra-quote.svg");
    mask-image: url("../icons/ra-quote.svg");
}

.ra-single-product__button-set .ra-button__icon--cart::before {
    -webkit-mask-image: url("../icons/ra-cart.svg");
    mask-image: url("../icons/ra-cart.svg");
}

/* v0.12.42 - Slider mobile typography controls */
@media (max-width: 767px) {
    html body .ra-featured-slider .ra-slider-top .ra-slider-heading > h2.ra-slider-callout {
        font-size: var(--ra-slider-mobile-title-size, 24px) !important;
        font-weight: var(--ra-slider-mobile-title-weight, 800) !important;
    }

    html body .ra-featured-slider .ra-slider-top .ra-slider-heading > p.ra-slider-byline {
        font-size: var(--ra-slider-mobile-byline-size, 14px) !important;
        font-weight: var(--ra-slider-mobile-byline-weight, 400) !important;
    }
}