.home-upcoming-layout.has-notices {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    grid-template-areas: "events notices" "action action";
    align-items: start;
    gap: 0 32px;
    margin-bottom: clamp(55px, 7vw, 82px);
}
.home-upcoming-main, .home-notices { min-width: 0; }
.home-upcoming-main { grid-area: events; }
.home-notices { grid-area: notices; }
.home-upcoming-layout > .schedule-list-action { grid-area: action; }
.home-upcoming-layout.has-notices .event-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.home-upcoming-layout.has-notices .schedule-list-action { margin-bottom: 0; }
.home-notices-heading { margin-bottom: 24px; padding-bottom: 16px; border-bottom: 3px solid var(--masao-yellow); }
.home-notices-heading h2 { margin: 0; color: var(--masao-black); font-size: 1.25rem; line-height: 1.5; }
.home-notice-list { display: grid; gap: 24px; }
.home-notice-banner { display: block; min-width: 0; color: var(--masao-muted); text-decoration: none; }
.home-notice-banner img { display: block; width: 100%; height: auto; }
.home-notice-banner:focus-visible { outline: 3px solid var(--masao-yellow-dark); outline-offset: 5px; }

@media (min-width: 901px) and (max-width: 1199px) {
    .home-upcoming-layout.has-notices { grid-template-columns: minmax(0, 1fr) 280px; column-gap: 24px; }
    .home-upcoming-layout.has-notices .event-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .home-upcoming-layout.has-notices { grid-template-columns: minmax(0, 1fr); grid-template-areas: "events" "action" "notices"; gap: 0; }
    .home-upcoming-layout.has-notices .schedule-list-action { margin-bottom: 40px; }
    .home-upcoming-layout.has-notices .event-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .home-notice-list { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
}
@media (max-width: 800px) {
    .home-upcoming-layout.has-notices .event-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
    .home-upcoming-layout.has-notices .event-grid { grid-template-columns: minmax(0, 1fr); }
    .home-notice-list { grid-template-columns: minmax(0, 1fr); max-width: 400px; margin-inline: auto; }
}