/* Event-Infoblock (Wann / Wo / Veranstaltet von)
   Gemeinsame Komponente fuer Startseite (#early-insider-event) und /anmeldung.
   Nutzt die Farb-Variablen, die beide Seiten in :root definieren. */

/* Format-Label oberhalb des Blocks, z. B. "Deep Dive Session" */
.event-format {
  display:inline-block; margin:0 0 14px; padding:3px 12px; border-radius:999px;
  border:1px solid rgb(113 248 162 / 45%); background:rgb(113 248 162 / 8%);
  font-family:var(--font-body); font-size:13.5px; font-weight:600; letter-spacing:.12em;
  text-transform:uppercase; color:var(--green); line-height:1.6;
}

.event-facts {
  margin:0 0 32px; padding:20px 24px; border-radius:12px;
  background:rgb(255 255 255 / 5%); border:1px solid rgb(113 248 162 / 35%);
  border-left:4px solid var(--green);
  display:grid; grid-template-columns:auto 1fr; gap:10px 18px; text-align:left;
}

.event-facts dt {
  font-family:var(--font-body); font-size:14.5px; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:var(--green); line-height:1.75;
}

.event-facts dd {
  margin:0; font-family:var(--font-body); font-size:18px; font-weight:400;
  color:var(--offwhite); line-height:1.6; overflow-wrap:break-word;
}

/* Veranstalter: eigene Zeile ueber die volle Breite, dezenter als Wann/Wo */
.event-facts dt.event-facts-host {
  grid-column:1 / -1; margin-top:6px; padding-top:14px;
  border-top:1px solid rgb(255 255 255 / 12%);
  font-size:13px; line-height:1.5;
}

.event-facts dd.event-facts-host {
  grid-column:1 / -1; margin-top:-6px;
  font-size:16px; font-weight:300; color:var(--gray-mid); line-height:1.6;
}

/* Handy: Beschriftung jeweils ueber dem Wert */
@media (width <= 600px) {
  .event-facts {
    grid-template-columns:1fr;
    gap:0;
    padding:16px 18px;
  }

  .event-facts dd { margin-bottom:12px; }
  .event-facts dd:last-child { margin-bottom:0; }
  .event-facts dd.event-facts-host { margin-top:0; }
}