.v10-selection__brand-showcase {
    --v10-selection-image-opacity: 0.85;
}

@media (max-width: 760px) {
    .v10-selection__brand-image {
        background: transparent;
    }

    .v10-selection__brand-image img:first-child.is-active {
        opacity: var(--v10-selection-first-image-opacity, 0);
    }

    .v10-selection__brand-image img:last-child.is-active {
        opacity: var(--v10-selection-last-image-opacity, 1);
    }
}

.v10-selection__brand-copy {
    min-width: 0;
}

.v10-selection__brand-name,
.v10-selection__brand-editorial {
    display: block;
}

.v10-selection__brand-name {
    white-space: nowrap;
}

.v10-selection__brand-editorial {
    margin-top: 0.2rem;
    color: var(--v10-light-skin);
    font-size: clamp(0.68rem, 0.9vw, 0.78rem);
    letter-spacing: 0.02em;
    line-height: 1.25;
    text-transform: none;
}

.v10-selection__brand-trigger {
    gap: 1rem;
    padding-block: 0.85rem;
}

.v10-selection__brand-trigger:hover,
.v10-selection__brand-trigger:focus-visible,
.v10-selection__brand-trigger[aria-pressed="true"] {
    padding-inline: 0;
}

.v10-selection__brand-trigger:hover .v10-selection__brand-name,
.v10-selection__brand-trigger:focus-visible .v10-selection__brand-name,
.v10-selection__brand-trigger[aria-pressed="true"] .v10-selection__brand-name {
    color: var(--v10-selection-brand-highlight);
}

.v10-selection__brand-trigger:hover .v10-selection__brand-editorial,
.v10-selection__brand-trigger:focus-visible .v10-selection__brand-editorial,
.v10-selection__brand-trigger[aria-pressed="true"] .v10-selection__brand-editorial {
    color: var(--v10-cream);
}

@media (min-width: 761px) {
    .v10-selection__brand-showcase.is-scroll-fading .v10-selection__brand-image {
        opacity: var(--v10-selection-scroll-opacity, 1);
    }

    .v10-selection__brand-showcase {
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
        gap: clamp(2rem, 4vw, 4rem);
    }

    .v10-selection__brand-editorial {
        white-space: nowrap;
    }

    .v10-selection__brand-image {
        min-height: 38rem;
    }
}

@media (min-width: 761px) and (max-width: 1000px) {
    .v10-selection__brand-showcase {
        grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.65fr);
        gap: 2rem;
    }
}

@media (max-width: 760px) {
    .v10-selection__brand-editorial {
        font-size: 0.68rem;
    }
}
