/* This component intentionally does not use global .swiper selectors. */
.mn-mag-carousel { position: relative; width: 100%; min-width: 0; }
.mn-mag-carousel *, .mn-mag-carousel *::before, .mn-mag-carousel *::after { box-sizing: border-box; }
.mn-mag-carousel__track {
  --mn-gap: 16px;
  display: flex; flex-flow: row nowrap; gap: var(--mn-gap);
  width: 100%; min-width: 0; overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory; overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch; scrollbar-width: none;
  padding: 8px 1px 14px;
}
.mn-mag-carousel__track::-webkit-scrollbar { display: none; }
.mn-mag-carousel__item {
  flex: 0 0 calc((100% - 3 * var(--mn-gap)) / 4);
  min-width: 0; scroll-snap-align: start;
}
.mn-mag-carousel__card { display: flex; flex-direction: column; height: 100%; overflow: hidden; background: #fff; border: 1px solid #e3e3e3; border-radius: 10px; color: inherit; text-decoration: none; }
.mn-mag-carousel__card:hover { box-shadow: 0 9px 24px rgba(0,0,0,.08); }
.mn-mag-carousel__image img { display: block; width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.mn-mag-carousel__placeholder { height: 120px; display: grid; place-items: center; background: #f4f4f4; color: #777; }
.mn-mag-carousel__title { margin: 0; padding: 12px 14px; font-size: 15px; line-height: 1.7; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mn-mag-carousel__controls { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.mn-mag-carousel__controls button { width: 34px; height: 34px; border: 1px solid #ddd; background: white; color: #333; border-radius: 50%; cursor: pointer; line-height: 1; font-size: 24px; }
.mn-mag-carousel__controls button:focus-visible, .mn-mag-carousel__track:focus-visible { outline: 2px solid #007e80; outline-offset: 2px; }
.mn-mag-carousel__controls button:disabled { opacity: .35; cursor: default; }
@media(max-width:767px) { .mn-mag-carousel__track { --mn-gap: 12px; } .mn-mag-carousel__item { flex-basis: 77%; } }
@media(prefers-reduced-motion:reduce) { .mn-mag-carousel__track { scroll-behavior: auto; } }