/* Werkbund Gallery — Launcher (minimal, initial geladen) · 1.14.1
 * Enthält nur: CTA-Button, Lade- und Fehlerzustand des Dialogs.
 * Das vollständige Galerie-CSS lädt erst nach dem Klick.
 *
 * Designprinzip: ruhig, präzise, Apple-inspiriert. Werkbund-Grün als Fläche,
 * Orange ausschließlich als subtiler Akzent (Pfeil-Hover, Fokusring). */

.wbg-launcher{display:flex;justify-content:center}

/* ---- CTA ---------------------------------------------------------------- */
.wbg-gallery-launcher{
  position:relative;
  display:inline-flex;align-items:center;justify-content:center;gap:.7rem;
  min-height:54px;padding:0 1.9rem;border-radius:999px;border:0;cursor:pointer;
  background:var(--wbh-green,var(--wb-primary,#2D6436));color:#fff;
  font-size:1.04rem;font-weight:600;letter-spacing:.005em;line-height:1;
  text-decoration:none;white-space:nowrap;
  box-shadow:0 10px 28px rgba(31,77,42,.18);
  transition:transform .3s ease,box-shadow .3s ease,background .3s ease;
}
.wbg-gallery-launcher,
.wbg-gallery-launcher:link,
.wbg-gallery-launcher:visited,
.wbg-gallery-launcher:hover,
.wbg-gallery-launcher:focus{color:#fff;text-decoration:none}

.wbg-room-launch__arrow{
  display:inline-block;flex:0 0 auto;
  font-weight:500;transform:translateX(0);
  transition:transform .3s ease,color .3s ease;
}

@media (hover:hover){
  .wbg-gallery-launcher:hover{
    background:var(--wbh-green-dark,var(--wb-primary-dark,#1F4D2A));
    transform:translateY(-1px);
    box-shadow:0 14px 32px rgba(31,77,42,.24);
  }
  .wbg-gallery-launcher:hover .wbg-room-launch__arrow{
    transform:translateX(3px);
    color:var(--wbh-orange,var(--wb-accent,#C8621A));
  }
}
.wbg-gallery-launcher:active{
  transform:translateY(0);
  box-shadow:0 8px 22px rgba(31,77,42,.2);
}
.wbg-gallery-launcher:focus-visible{
  outline:3px solid var(--wbh-orange,var(--wb-accent,#C8621A));
  outline-offset:3px;
}

/* ---- Ladezustand des Buttons (aria-busy) -------------------------------- */
.wbg-room-launch__busy{display:none;white-space:nowrap}
.wbg-gallery-launcher.is-loading{pointer-events:none}
.wbg-gallery-launcher.is-loading .wbg-room-launch__label,
.wbg-gallery-launcher.is-loading .wbg-room-launch__arrow{display:none}
.wbg-gallery-launcher.is-loading .wbg-room-launch__busy{
  display:inline-block;
  animation:wbg-launch-pulse 1.4s ease-in-out infinite;
}
@keyframes wbg-launch-pulse{0%,100%{opacity:1}50%{opacity:.62}}

/* ---- Lade-/Fehlerzustand im Dialog --------------------------------------- */
.wbg-launcher__status,
.wbg-launcher__error{
  position:absolute;inset:0;z-index:40;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;
  text-align:center;padding:2rem;color:#fff;
}
.wbg-launcher__status[hidden],
.wbg-launcher__error[hidden]{display:none}
.wbg-launcher__status-text{font-size:1rem;opacity:.92}
.wbg-launcher__error-text{font-size:1.05rem;margin:0}
.wbg-launcher__error-actions{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center}

.wbg-launcher__spinner{
  width:34px;height:34px;border-radius:50%;
  border:3px solid rgba(255,255,255,.25);border-top-color:#fff;
  animation:wbg-launcher-spin .9s linear infinite;
}
@keyframes wbg-launcher-spin{to{transform:rotate(360deg)}}

/* ---- Mobile -------------------------------------------------------------- */
@media (max-width:640px){
  .wbg-gallery-launcher{min-height:54px;width:100%;max-width:420px}
}

/* ---- Reduced Motion ------------------------------------------------------ */
@media (prefers-reduced-motion: reduce){
  .wbg-gallery-launcher,
  .wbg-room-launch__arrow{transition:none}
  .wbg-gallery-launcher:hover{transform:none}
  .wbg-gallery-launcher:hover .wbg-room-launch__arrow{transform:none}
  .wbg-gallery-launcher.is-loading .wbg-room-launch__busy{animation:none;opacity:.85}
  .wbg-launcher__spinner{animation:none;border-top-color:rgba(255,255,255,.7)}
}

/* ---- 1.17.0 — Lebendiger Einstieg: ruhige Lichtstimmung ----------------- */
/* Der Eingang in die virtuelle Galerie bekommt eine sehr ruhige, museale
 * Lichtstimmung: ein weicher grüner Schein hinter dem CTA „atmet" langsam,
 * wie die Beleuchtung eines Ausstellungsraums. Der Button selbst bewegt sich
 * nicht, kein werblicher Glanz – nur Tiefe und Präsenz. */
.wbg-launcher{ position:relative; isolation:isolate; }
.wbg-launcher::before{
  content:"";
  position:absolute; left:50%; top:50%;
  width:min(440px,130%); height:250%;
  transform:translate(-50%,-50%);
  background:radial-gradient(ellipse at center,
    rgba(45,100,54,.16) 0%, rgba(45,100,54,.06) 38%, rgba(45,100,54,0) 64%);
  z-index:-1; pointer-events:none;
  animation:wbg-launch-breathe 7.5s ease-in-out infinite;
}
@keyframes wbg-launch-breathe{
  0%,100%{ opacity:.5;  transform:translate(-50%,-50%) scale(.98); }
  50%    { opacity:1;   transform:translate(-50%,-50%) scale(1.05); }
}
/* Etwas mehr Tiefe und ein feiner Lichtsaum am CTA selbst. */
.wbg-gallery-launcher{
  box-shadow:0 12px 30px rgba(31,77,42,.20), inset 0 1px 0 rgba(255,255,255,.16);
}
@media (prefers-reduced-motion: reduce){
  .wbg-launcher::before{ animation:none; opacity:.6; }
}
