.may-promotions { --may-purple: #673ab7; --may-gap: 24px; margin: 0; }
.may-promotions__heading { margin-bottom: 32px; }
.may-promotions__heading h2 { margin: 0; font-weight: 800; }
.may-promotions__heading p { margin: 12px 0 0; }
.may-promotions__track { display: grid; grid-auto-columns: calc((100% - 2 * var(--may-gap)) / 3); grid-auto-flow: column; gap: var(--may-gap); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: #c6b1e4 transparent; padding: 2px 2px 16px; }
.may-promotions__track:focus-visible { outline: 2px solid var(--may-purple); outline-offset: 6px; }
.may-promotion { min-width: 0; display: flex; flex-direction: column; background: #f6f0fb; border: 1px solid #e9def2; border-radius: 26px; overflow: hidden; scroll-snap-align: start; scroll-margin-inline: 2px; }
.may-promotion:nth-child(3n) { background: #fbf6f0; border-color: #f0e5d9; }
.may-promotion--pinned { background: #ede2f6; }
.may-promotion__header { display: flex; align-items: flex-start; gap: 20px; margin-bottom: 20px; }
.may-promotion__header > div:first-child { flex: 1; min-width: 0; }
.may-promotion__media { position: relative; flex: 0 0 128px; width: 128px; height: 164px; border-radius: 14px; overflow: hidden; background: #e9def2; }
.may-promotion__media .may-promotion__image { position: absolute; width: 100%; height: 100%; max-width: none; object-fit: contain; object-position: center; }
.may-promotion--pinned .may-promotion__image { object-fit: cover; }
.may-promotion__body { padding: 26px; }
.may-promotion__label { display: inline-block; color: #67438d; font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; line-height: 1.5; }
.may-promotion .may-promotion__body h3 { margin: 12px 0 0; color: #402454; font-size: clamp(23px, 2vw, 28px); font-weight: 700; line-height: 1.18; letter-spacing: -.025em; overflow-wrap: break-word; }
.may-promotion__text { color: #504658; font-size: 15px; line-height: 1.65; overflow-wrap: break-word; }
.may-promotion__text p { font-size: inherit; line-height: inherit; margin: 0 0 14px; }
.may-promotion__text p:last-child { margin-bottom: 0; }
.may-promotion__text strong { color: #402454; }
.may-promotion__text ul, .may-promotion__text ol { padding-left: 20px; margin: 16px 0; }
.may-promotion__text li { padding-left: 3px; margin-bottom: 10px; }
.may-promotion__text li::marker { color: var(--may-purple); }
.may-promotion__text small { display: block; font-size: 13px; line-height: 1.55; }
.may-promotion__details { margin-top: 18px; }
.may-promotion__details summary { color: var(--may-purple); font-size: 14px; font-weight: 600; cursor: pointer; }
.may-promotion__details summary::marker { color: var(--may-purple); }
.may-promotion__details summary:focus-visible { outline: 2px solid var(--may-purple); outline-offset: 4px; }
.may-promotion__details[open] .may-promotion__text { margin-top: 16px; }
.may-promotion__cta { margin-top: 24px !important; }
.may-promotions__controls { display: flex; align-items: center; justify-content: flex-end; gap: 16px; margin-top: 16px; }
.may-promotions__controls[hidden] { display: none !important; }
.may-promotions .may-promotions__arrow { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 1px solid #d7c4ea; border-radius: 50%; background: #f6f0fb; color: var(--may-purple); font: 24px/1 sans-serif; cursor: pointer; }
.may-promotions__arrow:disabled { opacity: .35; cursor: default; }
.may-promotions__arrow:focus-visible { outline: 2px solid var(--may-purple); outline-offset: 3px; }
.may-promotions__position { font-size: 14px; color: #67438d; font-variant-numeric: tabular-nums; }
@media (min-width: 768px) and (max-width: 1023px) {
    .may-promotions__track { grid-auto-columns: calc((100% - var(--may-gap)) / 2); }
}
@media (max-width: 767px) {
    .may-promotions { --may-gap: 16px; }
    .may-promotions__track { grid-auto-columns: 100%; }
    .may-promotions__heading { margin-bottom: 24px; }
    .may-promotion__body { padding: 26px 24px; }
    .may-promotion .may-promotion__body h3 { font-size: 22px; }
    .may-promotion__header { gap: 14px; }
    .may-promotion__media { flex-basis: 96px; width: 96px; height: 124px; }
    .may-promotions__controls { justify-content: center; }
}
