.event-page-hero {
    background: linear-gradient(135deg, #183C4A 0%, #2c5660 100%);
    color: #fff;
    padding: 4.5rem 1.5rem 4rem;
}

.event-page-hero-inner { max-width: 72rem; margin: 0 auto; }
.event-page-hero h1 { max-width: 52rem; margin: .5rem 0 1rem; font-size: clamp(2rem, 4vw, 4rem); line-height: 1.08; font-weight: 700; }
.event-page-hero p { max-width: 44rem; font-size: 1.08rem; line-height: 1.75; color: rgba(255,255,255,.88); }
.event-kicker { margin: 0 0 .65rem; color: #E6D6B2; font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.event-hero-actions, .event-alternative-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.7rem; }
.event-hero-actions a, .event-alternative-actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 3rem; padding: .75rem 1.1rem; border-radius: .35rem; font-weight: 700; text-decoration: none; }
.event-hero-actions a:first-child { background: #E6D6B2; color: #183C4A; }
.event-hero-actions a:last-child { border: 1px solid rgba(255,255,255,.55); color: #fff; }
.event-hero-note { margin-top: 1.25rem; font-size: .82rem !important; color: rgba(255,255,255,.7) !important; }

.event-directory { background: #fff; }
.event-intro { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
.event-intro h2, .event-alternative h2, .event-faq h2 { margin: 0 0 .75rem; color: #183C4A; font-size: clamp(1.65rem, 3vw, 2.45rem); line-height: 1.15; font-weight: 700; }
.event-intro p:not(.event-kicker), .event-faq p { max-width: 42rem; color: #4d5d60; line-height: 1.7; }
.event-freshness { flex: 0 0 auto; padding: 1rem 1.15rem; border-left: 3px solid #8DA4A6; background: #F4F1EE; color: #183C4A; }
.event-freshness strong, .event-freshness span { display: block; }
.event-freshness span { margin-top: .25rem; font-size: .78rem; color: #607174; }

.event-filters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .85rem; padding: 1.2rem; border: 1px solid #dce3e3; border-radius: .5rem; background: #F4F1EE; }
.event-filters label { display: flex; flex-direction: column; gap: .4rem; color: #183C4A; font-size: .78rem; font-weight: 700; }
.event-filters select, .event-location-button, .event-reset-button { width: 100%; min-height: 3rem; padding: .75rem .8rem; border: 1px solid #b9c8ca; border-radius: .3rem; background: #fff; color: #183C4A; font-family: inherit; font-size: .84rem; }
.event-location-button, .event-reset-button { align-self: end; cursor: pointer; font-weight: 700; }
.event-location-button { border-color: #657C7E; background: #657C7E; color: #fff; }
.event-location-button:disabled { cursor: wait; opacity: .7; }
.event-reset-button { border-color: #8DA4A6; background: transparent; }
.event-filter-note { margin: 1rem 0 1.3rem; color: #607174; font-size: .85rem; }

.event-layout { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(20rem, .92fr); gap: 1.5rem; align-items: start; }
.event-list { min-width: 0; }
.event-month + .event-month { margin-top: 1.75rem; }
.event-month-title { margin: 0 0 .8rem; padding-bottom: .55rem; border-bottom: 2px solid #E6D6B2; color: #183C4A; font-size: 1.2rem; font-weight: 700; }
.event-cards { display: grid; gap: .8rem; }
.event-card { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: 1rem; padding: 1rem; border: 1px solid #dce3e3; border-radius: .45rem; background: #fff; box-shadow: 0 3px 12px rgba(24,60,74,.05); transition: border-color .15s ease, transform .15s ease; }
.event-card:hover { border-color: #8DA4A6; transform: translateY(-1px); }
.event-date { display: flex; flex-direction: column; gap: .35rem; padding: .65rem .6rem; border-radius: .3rem; background: #F4F1EE; color: #183C4A; text-align: center; }
.event-date strong { margin: 0; font-size: 1rem; line-height: 1.25; }
.event-date span { font-size: .72rem; color: #607174; }
.event-card-body { min-width: 0; }
.event-badges { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; margin-bottom: .5rem; }
.event-badge, .event-status { display: inline-flex; padding: .25rem .45rem; border-radius: 99px; font-size: .68rem; font-weight: 700; }
.event-badge-child { background: #E6D6B2; color: #183C4A; }
.event-badge-general { background: #dce9e9; color: #183C4A; }
.event-status { color: #527067; background: #edf5ef; }
.event-card h4 { margin: 0 0 .4rem; color: #183C4A; font-size: 1.02rem; line-height: 1.35; font-weight: 700; }
.event-meta, .event-notes { margin: .35rem 0 0; color: #526366; font-size: .78rem; line-height: 1.55; }
.event-notes { color: #657C7E; }
.event-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: .7rem; }
.event-actions a { color: #183C4A; font-size: .75rem; font-weight: 700; text-decoration: underline; text-decoration-color: #8DA4A6; text-underline-offset: 3px; }
.event-empty { display: flex; flex-direction: column; gap: .45rem; padding: 1.3rem; border: 1px dashed #b9c8ca; border-radius: .45rem; color: #183C4A; }
.event-empty span { color: #607174; font-size: .85rem; }

.event-map-slot { min-width: 0; align-self: stretch; }
.event-map-column { position: sticky; top: 1.25rem; }
.mobile-map-close { display: none; }
.events-map { min-height: 32rem; overflow: hidden; border-radius: .5rem; background: #dce9e9; box-shadow: 0 5px 20px rgba(24,60,74,.1); }
.map-attribution { margin: .45rem 0 0; color: #6b7b7d; font-size: .68rem; }
.map-attribution a { color: #183C4A; }
.event-legend { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: .75rem; color: #607174; font-size: .72rem; }
.legend-dot { display: inline-block; width: .6rem; height: .6rem; margin-right: .25rem; border-radius: 50%; vertical-align: -1px; }
.legend-child { background: #c19c55; }
.legend-general { background: #657C7E; }
.map-fallback { padding: 2rem; color: #526366; font-size: .9rem; line-height: 1.6; }

.event-alternative { background: #F4F1EE; }
.event-alternative-card { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 2rem; border-radius: .55rem; background: #183C4A; color: #fff; }
.event-alternative h2 { color: #fff; }
.event-alternative p:not(.event-kicker) { max-width: 42rem; color: rgba(255,255,255,.82); line-height: 1.7; }
.event-alternative-actions { flex: 0 0 auto; margin-top: 0; }
.event-alternative-actions a:first-child { background: #E6D6B2; color: #183C4A; }
.event-alternative-actions a:last-child { border: 1px solid rgba(255,255,255,.55); color: #fff; }

.event-faq { background: #fff; }
.faq-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-top: 1.5rem; }
.faq-grid details { padding: 1rem 1.1rem; border: 1px solid #dce3e3; border-radius: .4rem; }
.faq-grid summary { cursor: pointer; color: #183C4A; font-weight: 700; }
.faq-grid details p { margin: .7rem 0 0; font-size: .82rem; }
.event-disclaimer { margin-top: 1.6rem; font-size: .72rem; }

@media (max-width: 900px) {
    .event-intro, .event-alternative-card { align-items: flex-start; flex-direction: column; }
    .event-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .event-layout { display: flex; flex-direction: column; }
    .event-map-slot { width: 100%; min-height: 26rem; order: -1; }
    .event-map-column { position: static; width: 100%; }
    .events-map { min-height: 26rem; }
    .event-alternative-actions { margin-top: 0; }
}

@media (max-width: 900px) {
    .event-map-column.is-mobile-floating {
        position: fixed;
        z-index: 80;
        top: .75rem;
        right: .75rem;
        left: .75rem;
        width: auto;
        padding: .7rem;
        border: 1px solid #b9c8ca;
        border-radius: .55rem;
        background: #fff;
        box-shadow: 0 12px 36px rgba(24,60,74,.28);
    }
    .event-map-column.is-mobile-floating .events-map { min-height: 0; height: min(58vh, 26rem); }
    .event-map-column.is-mobile-floating .mobile-map-close {
        display: inline-flex;
        position: absolute;
        z-index: 1000;
        top: auto;
        bottom: .95rem;
        right: .95rem;
        align-items: center;
        justify-content: center;
        width: 2.35rem;
        height: 2.35rem;
        border: 0;
        border-radius: 50%;
        appearance: none;
        background: #183C4A;
        color: #fff;
        cursor: pointer;
        font-size: 1.65rem;
        line-height: 1;
        box-shadow: 0 3px 10px rgba(24,60,74,.3);
    }
    .event-map-column.is-mobile-floating .map-attribution { padding: 0 .15rem; }
}

@media (max-width: 600px) {
    .event-page-hero { padding-top: 3rem; }
    .event-filters, .faq-grid { grid-template-columns: 1fr; }
    .event-card { grid-template-columns: 5.4rem minmax(0, 1fr); gap: .7rem; padding: .75rem; }
    .event-date strong { font-size: .88rem; }
    .event-alternative-card { padding: 1.35rem; }
    .event-hero-actions a, .event-alternative-actions a { width: 100%; }
}
