.outlet-banner {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(5rem, 24vw, 13rem);
    align-items: center;
    gap: clamp(.65rem, 4vw, 3rem);
    margin: 1.5rem 0;
    padding: clamp(1.2rem, 4vw, 3rem);
    overflow: hidden;
    border-radius: 1.25rem;
    background:
        repeating-linear-gradient(135deg, transparent 0 24px, #ffffff0e 24px 25px),
        linear-gradient(115deg, #251032, #582174 72%, #783564);
    color: #fff;
}
.outlet-banner :is(h1,h2) {
    margin: 0;
    color: #fff;
    font-size: clamp(2.4rem, 6vw, 4.8rem);
    line-height: .98;
    letter-spacing: -.05em;
}
.outlet-banner p {
    max-width: 42ch;
    margin: .8rem 0;
    color: #f9efff;
}
.outlet-art svg {
    display: block;
    width: 100%;
    height: auto;
    filter: drop-shadow(0 9px 0 #241134);
}
.outlet-action {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    min-height: 44px;
    padding: .55rem 1rem;
    border: 0;
    border-radius: .7rem;
    background: #ffb567;
    color: #251032;
    font: inherit;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
}
.outlet-action:hover { background: #ffc991; color: #251032; }
.outlet-action:focus-visible,
.outlet-filters :is(select,a):focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.outlet-banner .outlet-action:focus-visible { outline-color: #fff; }
.outlet-filters {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)) auto auto;
    align-items: end;
    gap: .85rem;
    margin: 1.5rem 0;
}
.outlet-filters label { display: grid; gap: .35rem; min-width: 0; font-weight: 650; }
.outlet-filters select { min-width: 0; width: 100%; min-height: 44px; }
.outlet-reset { align-self: center; }
@media (max-width: 640px) {
    .outlet-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .outlet-filters button { justify-content: center; }
}

.outlet-banner--home {
    grid-template-columns: minmax(0, 1fr) 66px;
    gap: 14px;
    min-height: 92px;
    margin: 0 0 14px;
    padding: 10px clamp(14px, 3vw, 28px);
}
.outlet-banner--home > div {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(12px, 2vw, 24px);
}
.outlet-banner--home h2 {
    font-size: clamp(1.65rem, 3vw, 2.6rem);
}
.outlet-banner--home p {
    margin: 0;
    font-size: .9rem;
    line-height: 1.25;
}
@media (max-width: 600px) {
    .outlet-banner--home {
        grid-template-columns: minmax(0, 1fr) 55px;
        min-height: 124px;
    }
    .outlet-banner--home > div {
        grid-template-columns: minmax(0, 1fr);
        justify-items: start;
        gap: 5px;
    }
    .outlet-banner--home .outlet-action {
        min-height: 40px;
        padding-block: .35rem;
    }
}
