.recommendations { background: var(--color-border-subtle); }
.recommendations__heading { margin-block-end: var(--space-12); }
.recommendations__track { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.recommendations__slide { min-inline-size: 0; }
.recommendations__navigation { display: none; }
.recommendations__counter { font-size: var(--fs-body); color: var(--color-case-description); }
.recommendations__track:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 4px; }
@media (width < 75rem) and (width >= 48rem) { .recommendations__track { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-8) var(--space-6); } }
@media (width < 48rem) {
    .recommendations__heading { margin-block-end: var(--space-8); font-size: clamp(var(--fs-body), 4.6vw, var(--fs-card-title-max)); }
    .recommendations__track { display: flex; gap: var(--space-4); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
    .recommendations__track::-webkit-scrollbar { display: none; }
    .recommendations__slide { flex: 0 0 100%; scroll-snap-align: center; }
    .recommendations__navigation:not([hidden]) { display: flex; align-items: center; justify-content: center; gap: var(--space-4); margin-block-start: var(--space-6); }
}
