/* =========================================================================
   DIE SCHWARZE GRUFT (24.09.2026) — /die-schwarze-gruft/ und privater
   Innenbereich. Nur auf diesen Seiten geladen (functions.php,
   soldestroyer_gruft_assets()). Klassen .gr-*.
   ========================================================================= */
.gr-sr {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}
.gr-page { display: block; padding: 1rem 0 1.5rem; color: var(--sd-ink, #f4ead9); }
.gr-page > p:empty { display: none; }

.gr-scene { width: min(100% - 24px, 1100px); margin: 0 auto; }
.gr-scene__inner {
  position: relative;
  line-height: 0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 30px 70px -30px rgba(0, 0, 0, .95), 0 0 60px -30px rgba(70, 190, 170, .45);
}
.gr-scene__image { display: block; width: 100%; height: auto; aspect-ratio: 1536 / 1024; }

/* Grufttor: unsichtbare Klickfläche über dem Torbogen im Bild. Nur bei
   Hover/Fokus ein dezentes grünliches Glimmen aus der Tiefe. */
.gr-tor {
  position: absolute;
  display: block;
  border-radius: 46% 46% 6px 6px / 22% 22% 6px 6px;
  cursor: pointer;
}
.gr-tor:hover,
.gr-tor:focus-visible {
  background: radial-gradient(ellipse at 50% 55%, rgba(90, 230, 200, .16) 0%, rgba(90, 230, 200, 0) 70%);
  box-shadow: inset 0 0 40px rgba(90, 230, 200, .22), 0 0 30px rgba(90, 230, 200, .18);
}
.gr-tor:focus-visible { outline: 3px solid var(--sd-focus, #ffd27a); outline-offset: -3px; }
@media (prefers-reduced-motion: no-preference) {
  .gr-tor { transition: background .3s ease, box-shadow .3s ease; }
}

/* Anmelde-Dialog (erst nach Klick auf das Tor). */
.gr-dialog {
  width: min(100% - 32px, 24rem);
  padding: 0;
  border: 1px solid rgba(120, 210, 190, .45);
  border-radius: 14px;
  background: linear-gradient(180deg, #121614 0%, #0a0c0b 100%);
  color: #e6efe9;
  box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .95), 0 0 40px -10px rgba(90, 230, 200, .35);
}
.gr-dialog::backdrop { background: rgba(3, 5, 4, .78); }
.gr-dialog__box { padding: 1.4rem 1.4rem 1.2rem; }
.gr-dialog__title {
  margin: 0 0 1rem;
  font-family: var(--sd-font-display, Georgia, serif);
  font-size: 1.45rem;
  text-align: center;
  color: #cfeee4;
}
.gr-dialog__form p { margin: 0 0 .85rem; }
.gr-dialog__form label { display: block; margin-bottom: .3rem; font-size: .9rem; color: #b9cdc5; }
.gr-dialog__form input[type="text"],
.gr-dialog__form input[type="password"] {
  width: 100%;
  box-sizing: border-box;
  padding: .6rem .75rem;
  font-size: 1rem;
  color: #f1f6f3;
  background: #050706;
  border: 1px solid rgba(120, 210, 190, .4);
  border-radius: 8px;
}
.gr-dialog__form input:focus-visible { outline: 3px solid var(--sd-focus, #ffd27a); outline-offset: 2px; }
.gr-dialog__form .login-remember label { display: inline-flex; align-items: center; gap: .45rem; margin: 0; }
.gr-dialog__form .login-submit { margin: 1rem 0 0; }
.gr-dialog__form input[type="submit"] {
  width: 100%;
  padding: .7rem 1rem;
  font-weight: 700;
  font-size: 1rem;
  color: #081210;
  background: linear-gradient(180deg, #8fe6d2, #4fb49c);
  border: 0;
  border-radius: 999px;
  cursor: pointer;
}
.gr-dialog__close {
  display: block;
  width: 100%;
  margin-top: .75rem;
  padding: .55rem 1rem;
  font-size: .9rem;
  color: #b9cdc5;
  background: none;
  border: 1px solid rgba(120, 210, 190, .3);
  border-radius: 999px;
  cursor: pointer;
}
.gr-dialog__close:hover,
.gr-dialog__close:focus-visible { border-color: rgba(143, 230, 210, .8); color: #e6efe9; }

/* Privater Innenbereich (nur Berechtigte). */
.gr-innen { width: min(100% - 32px, 46rem); margin: 0 auto; padding: 3rem 0; text-align: center; }
.gr-innen__title { margin: 0 0 .75rem; font-family: var(--sd-font-display, Georgia, serif); font-size: clamp(2rem, 6vw, 3rem); color: #cfeee4; }
.gr-innen__note { margin: 0 0 1.5rem; color: var(--sd-ink-muted, #cdbea9); }
.gr-innen__actions { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; }
.gr-innen__actions a { margin: 0; }