.upcoming-item { display: flex; flex-direction: column; gap: var(--abstand-1); }
.mosaic-cell img { display: block; object-fit: cover; width: 100%; }
.upcoming-badges { display: flex; flex-wrap: wrap; gap: var(--abstand-1); }
.upcoming-title { color: var(--text-muted); font-size: var(--schrift-2); text-transform: uppercase; }
.card-aktivierungen .card-aktivierung.card-aktivierung:hover h3 {
    color: var(--accent);
}
.upcoming-events, .category-intro {
    margin-bottom: var(--abstand-6);
}
.upcoming-title {
    letter-spacing: 0.08em;
    margin: 0 0 var(--abstand-3);
}
.upcoming-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--abstand-4);
}
@media print {
.upcoming-grid {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    }
}
.upcoming-item {
    padding: var(--abstand-4) var(--abstand-4);
    background: var(--primary);
    color: var(--on-primary);
    border-radius: var(--radius-2);
    text-decoration: none;
    transition: background var(--dauer-3), transform var(--dauer-3);
}
.upcoming-item:hover {
    background: var(--primary-hover);
    transform: translateY(-1px);
}
.upcoming-date {
    font-size: var(--schrift-3);
    font-weight: 700;
}
.upcoming-name {
    font-size: var(--schrift-2);
    opacity: 0.9;
}
.upcoming-item .badge-slug {
    background: color-mix(in srgb, var(--on-primary) 10%, transparent);
    color: var(--on-primary);
    border: 1px solid color-mix(in srgb, var(--on-primary) 25%, transparent);
    font-size: var(--schrift-1);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.upcoming-open {
    align-self: flex-end;
    font-size: var(--schrift-1);
    color: var(--on-primary);
    opacity: 0.85;
}
.card-aktivierungen:hover .card-aktivierung h3 {
    color: var(--text-muted);
}
.card-mosaic-2 { grid-template-columns: 1fr 1fr; }
.card-mosaic-3, .card-mosaic-4 {
    grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr;
}
.mosaic-cell img {
    position: absolute;
    top: 0;
    inset-inline-start: 0;
    height: 100%;
    object-position: top center;
    filter: brightness(0.75);
    transition: filter var(--dauer-4);
}
.card-flags {
    font-size: var(--schrift-5);
    letter-spacing: 0.2rem;
    margin-bottom: var(--abstand-1);
}
.card-excerpt {
    font-size: var(--schrift-2);
    color: var(--text-muted);
    margin: 0 0 var(--abstand-2);
    line-height: var(--zeile-3);
}
.card-aktivierungen {
 padding: var(--abstand-4);
    background: var(--surface);
}
.card-aktivierung {
 flex: 1;
    min-height: 0; padding: var(--abstand-2) var(--abstand-4);
    border: 1px dashed var(--border); border-radius: var(--radius-3);
    background: var(--background);
    text-align: center; text-decoration: none;
}