.more-category-cards{width:100%;max-width:var(--more-category-width,1400px);margin:24px auto;box-sizing:border-box}
.more-category-cards h2{margin:0 0 20px;font-size:30px;line-height:1.2}
.more-category-cards__grid{display:grid;grid-template-columns:repeat(var(--more-category-columns,7),minmax(0,1fr));gap:12px}
.more-category-cards__card{position:relative;display:block;aspect-ratio:var(--more-category-ratio,3/4);overflow:hidden;border-radius:var(--more-category-radius,8px);background:#365350;color:#fff!important;text-decoration:none!important;isolation:isolate}
.more-category-cards__card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
.more-category-cards__card:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 25%,rgba(0,0,0,.8));z-index:1;pointer-events:none}
.more-category-cards__text{position:absolute;left:14px;right:12px;bottom:14px;z-index:2;display:grid;gap:7px}
.more-category-cards__name{font:600 16px/1.25 Inter,sans-serif;overflow-wrap:anywhere}
.more-category-cards__cta{font:500 11px/1.3 Inter,sans-serif;text-transform:uppercase;letter-spacing:.04em}
.more-category-cards__card:focus-visible{outline:3px solid #527a76;outline-offset:4px}
@media(hover:hover){.more-category-cards__card:hover img{transform:scale(1.04)}}
@media(max-width:1023px){.more-category-cards__grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:767px){.more-category-cards__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.more-category-cards__name{font-size:16px}}
@media(prefers-reduced-motion:reduce){.more-category-cards__card img{transition:none}}

.more-category-cards,.more-category-cards *{font-family:Inter,sans-serif!important}

.more-category-cards__viewport{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.more-category-cards__viewport::-webkit-scrollbar{display:none}
.more-category-cards__grid{grid-template-columns:none;grid-template-rows:repeat(var(--more-category-rows,1),auto);grid-auto-flow:column;grid-auto-columns:calc((100% - (var(--more-category-visible,7) - 1)*12px)/var(--more-category-visible,7));gap:12px}
.more-category-cards__card{scroll-snap-align:start;aspect-ratio:var(--more-category-ratio,3/4)}
.more-category-cards__viewport.more-is-dragging{scroll-snap-type:none;cursor:grabbing}
.more-category-cards__viewport.more-is-dragging *{cursor:grabbing!important;user-select:none}
@media(hover:hover){.more-category-cards__card{cursor:grab}}
@media(max-width:767px){.more-category-cards{overflow:visible}.more-category-cards__viewport{width:var(--more-category-mobile-width,100%);max-width:none}.more-category-cards__grid{grid-auto-columns:calc(50% - 18px)}}

.more-category-cards__rail{position:relative;overflow:visible}
.more-category-cards__arrow{display:none!important}
@media(min-width:1024px) and (hover:hover) and (pointer:fine){
.more-category-cards__rail .more-category-cards__arrow{position:absolute;top:50%;z-index:5;display:flex!important;align-items:center;justify-content:center;width:46px;height:46px;min-height:46px;padding:0;margin:0;border:0;border-radius:50%;background:#fff;color:#1d1d1f;box-shadow:none;line-height:0;font-size:0;opacity:0;visibility:hidden;pointer-events:none;cursor:pointer;transition:background 200ms ease,transform 200ms ease,opacity 200ms ease}
.more-category-cards__arrow--prev{left:0;transform:translate(-50%,-50%)}
.more-category-cards__arrow--next{right:0;transform:translate(50%,-50%)}
.more-category-cards__rail .more-category-cards__arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.more-category-cards:hover .more-category-cards__arrow:not(:disabled),.more-category-cards:focus-within .more-category-cards__arrow:not(:disabled){opacity:1;visibility:visible;pointer-events:auto}
.more-category-cards__rail .more-category-cards__arrow:after{display:none}
.more-category-cards__rail .more-category-cards__arrow:focus-visible{outline:2px solid #365350;outline-offset:3px}
}

@media(min-width:1024px) and (hover:hover) and (pointer:fine){
.more-category-cards__arrow--prev:hover{transform:translate(-50%,-50%) scale(1.04)}
.more-category-cards__arrow--next:hover{transform:translate(50%,-50%) scale(1.04)}
.more-category-cards__rail .more-category-cards__arrow:hover{background:#fff;color:#1d1d1f}
}
