/* Gemeinsame Bühne: ganzes Original, Vollteile, offene Textphase und 3D-Molekülzeichen. */
.logo-raum { position: relative; isolation: isolate; background: radial-gradient(ellipse at 76% 6%, #1d1b18 0, #0b0d0e 23%, #000 60%); }
.logo-buehne { position: sticky; top: 0; width: 100%; height: 100svh; margin-bottom: -100svh; z-index: 0; pointer-events: none; }
.logo-leinwand { display: block; width: 100%; height: 100%; }
.logo-raum > section { position: relative; z-index: 1; }
.logo-raum .gruppen-erzaehlung { position: relative; z-index: 2; isolation: isolate; }
.held.held-referenz { display: block; width: 100%; min-height: 100svh; height: 100svh; margin: 0; padding: 0; background: transparent; overflow: hidden; }
.hero-zeichen-rueckfall { position: absolute; left: 76%; top: 48%; width: auto; height: min(58svh, 32vw); transform: translate(-50%, -50%); pointer-events: none; }
.held-referenz .hero-titel {
  position: absolute; top: 32%; left: var(--rand); width: 55%; max-width: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; align-items: flex-start;
  font: 800 clamp(64px, 7.8125vw, 118px)/.96 "Montserrat", sans-serif; letter-spacing: -.025em; color: #fff;
}
.hero-titel span { display: block; }
.hero-unterzeile span, .hero-entdecken span { display: block; }
.logo--bereit .held-referenz:not(.hero--auftritt) .hero-titel span,
.logo--bereit .held-referenz:not(.hero--auftritt) .hero-unterzeile span,
.logo--bereit .held-referenz:not(.hero--auftritt) .hero-entdecken span { visibility: hidden; }
.logo--bereit .hero--auftritt .hero-titel span { animation: hero-schrift 1.25s cubic-bezier(.16, 1, .3, 1) .7s backwards; }
.logo--bereit .hero--auftritt .hero-titel span:nth-child(2) { animation-delay: .84s; }
.logo--bereit .hero--auftritt .hero-unterzeile span { animation: hero-schrift 1.15s cubic-bezier(.16, 1, .3, 1) 1.12s backwards; }
.logo--bereit .hero--auftritt .hero-entdecken span { animation: hero-schrift 1.1s cubic-bezier(.16, 1, .3, 1) 1.5s backwards; }
@keyframes hero-schrift {
  from { opacity: 0; translate: 0 24px; clip-path: inset(0 0 100% 0); }
  to { opacity: 1; translate: 0 0; clip-path: inset(0); }
}
.held-referenz .hero-unterzeile {
  position: absolute; top: calc(32% + clamp(64px, 7.8125vw, 118px) * 1.92 + 28px); left: var(--rand);
  width: min(46vw, 620px); max-width: none; margin: 0; white-space: nowrap; /* feste Umbrüche (.hero-umbruch), keine zufälligen */
  font: 400 clamp(15px, 1.4vw, 20px)/1.5 "Instrument Sans", sans-serif; color: #d5d6d5;
}
.hero-entdecken {
  position: absolute; bottom: 4.5vh; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 15px; padding: 15px;
  font: 500 clamp(10px, .84vw, 13px)/1.2 "Instrument Sans", sans-serif;
  letter-spacing: .25em; white-space: nowrap; text-decoration: none; color: #c4c8ca;
}
.hero-entdecken::after { content: ""; width: 1px; height: 30px; background: linear-gradient(#fff8, #fff0); }
.hero-entdecken:hover, .hero-entdecken:focus-visible { color: #fff; }
.logo--bereit .hero-zeichen-rueckfall, .logo--bereit .gruppe-logo-rueckfall { visibility: hidden; }
.logo--menue .logo-buehne { filter: blur(18px); }
.logo-buehne { transition: filter 1s; }
.hero--menue .hero-titel, .hero--menue .hero-unterzeile, .hero--menue .hero-entdecken { opacity: 0; }
.hero-titel, .hero-unterzeile, .hero-entdecken { transition: opacity .5s; }
.hero--menue .hero-zeichen-rueckfall { filter: blur(18px); }
.logo-raum .gruppe-b { background: transparent; }
.logo-raum .stimme { background: #080b0ee8; }
/* Der gleiche Schwarm kann durch die Kartenfläche hindurch an ihre nativen Punkte übergeben werden. */
.logo--bereit .welt-buehne.ist-geladen { background: transparent; }
.logo--bereit .welt-karte .maplibregl-canvas-container,
.logo--bereit .welt-boegen { opacity: var(--logo-karten-deckung, 1); }
.welt-start-hinweis {
  position: absolute; z-index: 1; left: 20px; right: 20px; bottom: 20px;
  margin: 0; padding: 12px 16px; background: #080a0ee8; border-radius: 8px;
  color: #d5d6d5; font-size: 14px; text-align: center;
}
.welt-start-hinweis[hidden] { display: none; }
.gruppe-logo-rueckfall { display: block; width: 85%; height: 85%; }
@media (max-width: 699px) {
  .logo--bereit .held-referenz:not(.hero--menue) .hero-titel,
  .logo--bereit .held-referenz:not(.hero--menue) .hero-unterzeile,
  .logo--bereit .held-referenz:not(.hero--menue) .hero-entdecken { opacity: var(--hero-text-deckung, 1); }
  .hero-zeichen-rueckfall { left: 50%; top: 27%; height: min(32svh, 62vw); }
  .held-referenz .hero-titel { top: 55%; left: 0; transform: translateY(-50%); width: 100%; padding: 0 5vw; align-items: center; font-size: min(16vw, 25svh); text-align: center; }
  .held-referenz .hero-unterzeile { top: calc(55% + min(16vw, 25svh) * .96 + 26px); left: 50%; transform: translateX(-50%); width: 84%; text-align: center; white-space: normal; }
  .hero-umbruch { display: none; }
  .hero-entdecken { bottom: 5.5vh; }
}
@media (prefers-reduced-motion: reduce) {
  .logo-buehne { display: none; }
  .logo--bereit .hero-zeichen-rueckfall, .logo--bereit .gruppe-logo-rueckfall { visibility: visible; }
  .hero-titel, .hero-unterzeile, .hero-entdecken, .logo-buehne { transition: none !important; }
  .logo--bereit .held-referenz:not(.hero--menue) .hero-titel,
  .logo--bereit .held-referenz:not(.hero--menue) .hero-unterzeile,
  .logo--bereit .held-referenz:not(.hero--menue) .hero-entdecken { opacity: 1; }
  .hero-titel span, .hero-unterzeile span, .hero-entdecken span { animation: none !important; visibility: visible !important; }
}
