/* Keep the introduction and its action together beside one calendar card. */
.home-news-actions { display: grid; grid-template-columns: minmax(0, 1fr) 210px; align-items: start; gap: 24px; padding: 4px 0 8px; }
.home-news-intro { min-width: 0; }
.home-news-intro h3 { font-size: 24px; line-height: 1.25; margin-bottom: 20px; }
.home-news-intro h3 small { display: inline-block; margin-top: 6px; }
.home-news-intro .btn { display: inline-block; width: auto; min-width: 0; max-width: 100%; margin: 0; padding: 10px 24px; font-size: 24px; }
.home-events { width: 100%; min-width: 0; }
.home-events .home-events-heading { font-size: 20px; line-height: 1.25; margin: 0 0 12px; text-align: center; }
.home-events-stage { display: grid; }
.home-events .home-event { grid-area: 1 / 1; display: flex; flex-direction: column; justify-content: center; min-height: 190px; box-sizing: border-box; text-decoration: none; padding: 20px 14px; }
.home-events .home-event[hidden] { display: none; }
/* Invisible cards reserve the tallest card's space without entering the tab order. */
.home-events.is-ready .home-event[hidden] { display: flex; visibility: hidden; pointer-events: none; }
.home-news-intro .btn:focus-visible, .home-events .home-event:focus-visible { outline: 3px solid #884b52; outline-offset: 4px; }
@media (max-width: 599px), (min-width: 992px) and (max-width: 1199px) {
 .home-news-actions { grid-template-columns: minmax(0, 1fr); gap: 20px; }
 .home-news-intro h3 { font-size: 22px; margin-bottom: 16px; }
 .home-events .home-event, .home-events.is-ready .home-event[hidden] { display: grid; grid-template-columns: 72px minmax(0, 1fr); column-gap: 18px; align-content: center; text-align: left; min-height: 136px; padding: 18px; }
 .home-events .home-event[hidden] { display: none; }
 .home-events .calendar-date { grid-row: 1 / 4; align-self: center; text-align: center; border-right: 1px solid #8a9690; padding-right: 16px; }
 .home-events .calendar-date span { margin-bottom: 0; }
 .home-events .calendar-day-title, .home-events .calendar-day-time, .home-events .calendar-day-hint { grid-column: 2; }
}
@media (prefers-reduced-motion: no-preference) {
 .home-event.is-entering { animation: home-event-in 240ms ease-out; }
 @keyframes home-event-in { from { opacity: 0; } to { opacity: 1; } }
}
