.event-overlay-backdrop {
  position: fixed; inset: 0; background: rgba(0,0,0,.6);
  display: none; flex-direction: column; align-items: center; justify-content: center;
  z-index: 9999; padding: 1rem;
  box-sizing: border-box;
}

@media (max-height: 700px) {
  .event-overlay {
    max-height: 90vh;                /* passt sich der Bildschirmhöhe an */
    margin-top: auto;                /* zentriert bei kleinen Bildschirmen */
    margin-bottom: auto;
  }
}

.event-overlay-backdrop.is-open { display: flex; }
.event-overlay {
  background: #111; color: #fff; max-width: 720px; width: 100%;
  border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,.5);
  overflow: hidden;
}
.event-overlay header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.75rem 1rem; background: #1c1c1c;
}
.event-overlay h2 { font: 600 1rem/1.2 system-ui, -apple-system, Segoe UI, Roboto; margin: 0; }
.event-overlay button[aria-label="Schließen"]{
  border: 0; background: transparent; color: #bbb; font-size: 1.25rem; cursor: pointer;
}
.event-overlay button[aria-label="Schließen"]:hover { color: #fff; }
.event-overlay .content { display: grid; gap: 0; }
.event-overlay .content a { color: inherit; text-decoration: none; }
.event-overlay .content img {
  display: block; width: 100%; height: auto; max-height: 70vh; object-fit: contain; background:#000;
}
.event-overlay .details {
  padding: 1rem; display: grid; gap: .5rem; background: #121212;
}
.event-overlay .date-chip {
  display: inline-block; padding: .25rem .5rem; border-radius: 999px;
  background: #2a2a2a; font-size: .85rem; color: #d9ffd1;
}
.event-overlay .cta {
  margin-top: .5rem; display: inline-block; padding: .6rem .9rem; border-radius: 10px;
  background: #2f7dff; color: #fff; font-weight: 600;
}
@media (prefers-reduced-motion:no-preference){
  .event-overlay-backdrop.is-opening { animation: fadeIn .18s ease-out both; }
  .event-overlay { transform: translateY(6px); opacity: .98; }
  .event-overlay-backdrop.is-opening .event-overlay { animation: pop .18s ease-out both; }
  @keyframes fadeIn { from {opacity:0} to {opacity:1} }
  @keyframes pop { from { transform: translateY(16px); opacity:.0 } to { transform: translateY(0); opacity:1 } }
}