.related-content {
  --related-gap: 1.875rem;
  box-sizing: border-box;
  width: 100%;
  margin: 3.75rem auto 0;
}
.related-content__header { margin-bottom: 1.875rem; padding-bottom: .9375rem; display: flex; align-items: center; justify-content: space-between; border-bottom: .0625rem solid #bfbfbf; }
.related-content__header h2 { margin: 0; color: #333; font-size: 1.375rem; font-weight: 400; line-height: 1.2; }
.related-content__controls { display: flex; gap: .625rem; }
.related-content__controls button { width: 2.25rem; height: 2.25rem; padding: 0; display: grid; place-items: center; color: #777; background: transparent; border: .0625rem solid #bbb; border-radius: 50%; cursor: pointer; font: 300 1.5rem/1 Arial, sans-serif; transition: color .2s, border-color .2s, background .2s; }
.related-content__controls button:hover, .related-content__controls button:focus-visible { color: #fff; background: #e3540b; border-color: #e3540b; }
.related-content__controls button:disabled { color: #bbb; background: transparent; border-color: #ddd; cursor: default; opacity: .55; }
.related-content__viewport { width: 100%; overflow: hidden; }
.related-content__track { gap: var(--related-gap); }
.related-content.is-static .related-content__track { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.related-content.is-carousel .related-content__viewport { overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; scroll-behavior: smooth; scroll-snap-type: x mandatory; }
.related-content.is-carousel .related-content__viewport::-webkit-scrollbar { display: none; }
.related-content.is-carousel .related-content__track { display: flex; }
.related-content.is-carousel .related-content__track > article { min-width: 0; flex: 0 0 calc(33.333333% - 1.25rem); scroll-snap-align: start; }
.related-content.is-dragging .related-content__viewport { cursor: grabbing; scroll-behavior: auto; scroll-snap-type: none; user-select: none; }
.related-content.is-carousel:not(.is-dragging) .related-content__viewport { cursor: grab; }
.related-content.is-dragging a { pointer-events: none; }
.related-content img { -webkit-user-drag: none; }

/* Keep each recommendation visually identical to its list-page card. */
.related-content .products-card { width: auto; max-width: none; }
.related-content--product { width: 84vw; margin-top: 0; padding-bottom: 7.5rem; }
.related-content--news, .related-content--case { margin-top: 2.5rem; }

@media (max-width: 1024px) {
  .related-content { --related-gap: 1.25rem; }
  .related-content.is-static .related-content__track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .related-content.is-carousel .related-content__track > article { flex-basis: calc(50% - .625rem); }
}

@media (max-width: 600px) {
  .related-content { --related-gap: 1rem; margin-top: 2.5rem; }
  .related-content__header { margin-bottom: 1.25rem; }
  .related-content__header h2 { font-size: 1.125rem; }
  .related-content__controls button { width: 2rem; height: 2rem; font-size: 1.25rem; }
  .related-content.is-static .related-content__track { grid-template-columns: 1fr; }
  .related-content.is-carousel .related-content__track > article { flex-basis: 100%; }
  .related-content--product { width: calc(100% - 1.25rem); padding-bottom: 3.125rem; }
}

@media (prefers-reduced-motion: reduce) {
  .related-content.is-carousel .related-content__viewport { scroll-behavior: auto; }
}