.ref-v18-hero,
.ref-v18-category-hero {
    --ref-v18-accent: var(--primary-color, #ad002b);
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    align-items: stretch;
    overflow: hidden;
    margin: 0 0 2rem;
    border-radius: 1.25rem;
    background: linear-gradient(135deg, color-mix(in srgb, var(--ref-v18-accent) 88%, #000), var(--ref-v18-accent));
    color: #fff;
}

.ref-v18-hero__media,
.ref-v18-category-hero__media {
    min-height: 360px;
    background: rgba(255,255,255,.08);
}

.ref-v18-hero__image,
.ref-v18-category-hero__image {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 360px;
    object-fit: cover;
}

.ref-v18-hero__content,
.ref-v18-category-hero__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .8rem;
    padding: clamp(1.5rem, 4vw, 4rem);
}

.ref-v18-hero__eyebrow,
.ref-v18-category-hero__eyebrow {
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .78rem;
    font-weight: 700;
    opacity: .86;
}

.ref-v18-hero__title,
.ref-v18-category-hero__title {
    margin: 0;
    color: inherit;
    font-size: clamp(2rem, 5vw, 4rem);
    line-height: 1.02;
}

.ref-v18-hero__text,
.ref-v18-category-hero__description {
    max-width: 44rem;
    font-size: 1.05rem;
}

.ref-v18-hero__price {
    font-size: 1.4rem;
    font-weight: 700;
}

.ref-v18-hero__button,
.ref-v18-category-hero__button {
    align-self: flex-start;
    margin: .3rem 0 0;
    background: #fff !important;
    color: var(--ref-v18-accent) !important;
    border: 0 !important;
}

.ref-v18-hero__badge {
    align-self: flex-start;
    padding: .35rem .7rem;
    border: 1px solid rgba(255,255,255,.4);
    border-radius: 999px;
    font-size: .78rem;
}

.ref-v18-category-hero {
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    width: min(100% - 2rem, 1400px);
    margin: 1rem auto 2rem;
}

.ref-v18-category-hero__featured {
    font-weight: 700;
}

.ref-v18-products {
    margin: 2rem 0;
}

.ref-v18-products__title {
    margin-bottom: 1rem;
}

.ref-v18-assurance-badge {
    margin: 2rem 0 0;
    padding: 1rem 1.25rem;
    border: 1px solid color-mix(in srgb, var(--primary-color, #ad002b) 25%, #ddd);
    border-radius: 1rem;
    background: color-mix(in srgb, var(--primary-color, #ad002b) 5%, #fff);
}

.ref-v18-assurance-badge strong,
.ref-v18-assurance-badge div,
.ref-v18-assurance-badge small {
    display: block;
}

.ref-v18-assurance-badge div {
    margin-top: .35rem;
}

.ref-v18-assurance-badge small {
    margin-top: .55rem;
    opacity: .75;
}

@supports not (background: color-mix(in srgb, #000 50%, #fff)) {
    .ref-v18-hero,
    .ref-v18-category-hero {
        background: var(--ref-v18-accent);
    }
    .ref-v18-assurance-badge {
        background: #fafafa;
        border-color: #ddd;
    }
}

@media (max-width: 849px) {
    .ref-v18-hero,
    .ref-v18-category-hero {
        grid-template-columns: 1fr;
    }
    .ref-v18-hero__media,
    .ref-v18-category-hero__media,
    .ref-v18-hero__image,
    .ref-v18-category-hero__image {
        min-height: 260px;
    }
    .ref-v18-category-hero__media {
        order: -1;
    }
}

.ref-v18-why {
    margin-top: .5rem;
    font-size: .85rem;
}

.ref-v18-why summary {
    cursor: pointer;
    font-weight: 600;
}

.ref-v18-why p {
    margin: .45rem 0 0;
    max-width: 42rem;
}

.ref-v18-preferences {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem;
    margin: 1rem 0;
    padding: 1rem;
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 1rem;
    background: rgba(0,0,0,.025);
}

.ref-v18-preferences__title {
    flex-basis: 100%;
}

.ref-v18-preferences select {
    min-width: 240px;
}

.ref-v18-preferences small {
    flex-basis: 100%;
    opacity: .72;
}

.ref-v18-preferences--compact .ref-v18-preferences__title,
.ref-v18-preferences--compact small {
    flex-basis: auto;
}

@media (max-width: 600px) {
    .ref-v18-preferences,
    .ref-v18-preferences select,
    .ref-v18-preferences .button {
        width: 100%;
    }
}

.ref-v18-smart-image-link,
.ref-v18-smart-image {
    display: block;
    width: 100%;
}

.ref-v18-smart-image {
    height: auto;
    object-fit: cover;
}