/* ---- Newsroom (media-news/), 2 Nov 2026 ----
   Year rows of cards in the house light-blue box style, the same values as the
   catalog pages' feature boxes (membrane-catalog.css .mcat-feat > li) and
   outline button (.mcat-btn). Built by scripts/build-media-news.mjs. A year
   with five or more cards becomes a slider through card-rails.js. */
.mn-section + .mn-section { padding-top: 0; }
.mn-year + .mn-year { margin-top: clamp(28px, 3vw, 44px); }
.mn-year__label { margin: 0 0 16px; font-size: clamp(20px, 1.8vw, 24px); font-weight: 500; line-height: 1.2; letter-spacing: -0.02em; color: #0f172a; }

.mn-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 1.4vw, 20px); }
.mn-card { --mn-pad: clamp(20px, 2vw, 28px); display: flex; flex-direction: column; padding: var(--mn-pad); border: 1px solid #cfe6f5; border-radius: 16px; background: #f3f9fd; }
/* Digital cards open with the video's thumbnail: the catalog sibling cards'
   picture (membrane-catalog.css .mcat-sibs__media) at the video's own 16:9,
   so channel logos and on-screen titles are not cut. */
.mn-card--media { overflow: hidden; }
.mn-card__media { display: block; aspect-ratio: 16 / 9; margin: calc(var(--mn-pad) * -1) calc(var(--mn-pad) * -1) 18px; overflow: hidden; background: #f4f8fb; }
.mn-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; }
.mn-card--media:hover .mn-card__media img { transform: scale(1.025); }
@media (prefers-reduced-motion: reduce) {
  .mn-card__media img { transition: none; }
}
.mn-card__label { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #007cc3; margin-bottom: 12px; }
.mn-card__title { margin: 0; font-size: 18px; font-weight: 600; line-height: 1.35; letter-spacing: -0.018em; color: #0f172a; }
.mn-card__actions { margin-top: auto; padding-top: 18px; }

.mn-btn { display: inline-flex; align-items: center; justify-content: center; padding: 11px 22px; border-radius: 999px; border: 1.5px solid #007cc3; color: #007cc3; background: transparent; font-size: var(--type-helper, 14px); font-weight: var(--type-weight-subheading, 600); text-decoration: none; transition: background-color 0.2s ease; }
.mn-btn:hover, .mn-btn:focus-visible { background: #eaf4fb; }
a.mn-btn, a.mn-btn:visited { color: #007cc3; }

@media (max-width: 1080px) {
  .mn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .mn-grid { grid-template-columns: 1fr; }
}
