/* ================================================================
   BDSM-Netzwerk Münster – style.css  v2.0  (konsolidiert)
   Kein Material Icons Font. Keine doppelten Selektoren.
   ================================================================ */

/* ── @FONT-FACE ─────────────────────────────────────────────────── */
@font-face {
  font-family: 'Uncial Antiqua';
  src: url('https://fonts.dataurl.de/uncial-antiqua/uncial-antiqua-latin-400-normal.woff2')
       format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Lato';
  src: url('https://fonts.dataurl.de/lato/lato-v23-latin-regular.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Lato';
  src: url('https://fonts.dataurl.de/lato/lato-v23-latin-700.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Lato';
  src: url('https://fonts.dataurl.de/lato/lato-v23-latin-italic.woff2') format('woff2');
  font-weight: 400; font-style: italic; font-display: swap;
}

/* ── DESIGN TOKENS ──────────────────────────────────────────────── */
:root {
  --c-void:        #04000c;
  --c-deep:        #0b0310;
  --c-layer:       #130810;
  --c-surface:     #1a0c14;
  --c-card:        #160a12;
  --c-border:      #261018;
  --c-border-hi:   #461828;

  --c-red-dark:    #8b0000;
  --c-red:         #a30000;
  --c-red-bright:  #c0392b;
  --c-red-glow:    rgba(139,0,0,.45);
  --c-red-subtle:  rgba(139,0,0,.08);

  --c-gold:        #c8a000;
  --c-gold-bright: #f0c840;
  --c-gold-subtle: rgba(200,160,0,.10);

  --c-green:         #006400;
  --c-green-bright:  #1a9c1a;
  --c-green-subtle:  rgba(0,100,0,.12);

  --c-text:        #e8dce4;
  --c-text-muted:  #9a8a94;
  --c-text-dim:    #5e505a;
  --c-white:       #ffffff;

  --nav-h:         72px;
  --nav-mob-h:     60px;
  --header-h:      380px;
  --header-mob-h:  240px;

  --max-w:         1200px;
  --pad-x:         clamp(1rem, 5vw, 2.5rem);
  --section-py:    clamp(3rem, 8vw, 5.5rem);
  --gap:           1.5rem;
  --gap-lg:        clamp(2rem, 5vw, 4rem);
  --radius:        4px;
  --radius-lg:     8px;
  --radius-xl:     16px;

  --f-headline:    'Uncial Antiqua', 'Times New Roman', serif;
  --f-ui:          'Lato', Arial, sans-serif;
  --f-body:        Verdana, Arial, sans-serif;

  --sh-card:       0 4px 22px rgba(0,0,0,.55), 0 1px 4px rgba(0,0,0,.4);
  --sh-red:        0 0 22px var(--c-red-glow);
  --sh-gold:       0 0 16px rgba(200,160,0,.28);

  --t-fast:        150ms ease;
  --t-mid:         280ms ease;
  --t-slow:        450ms ease;
}

/* ── RESET ──────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  font-family: var(--f-body);
  font-size: 1rem;
  line-height: 1.72;
  color: var(--c-text);
  background-color: var(--c-void);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
body.nav-open { overflow: hidden; }
img, picture, svg, video { display: block; max-width: 100%; }
input, button, textarea, select { font: inherit; }
ul[role="list"], ol[role="list"] { list-style: none; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--c-gold); }
a:focus-visible { outline: 2px solid var(--c-gold); outline-offset: 3px; border-radius: 2px; }
p { overflow-wrap: break-word; }

::-webkit-scrollbar             { width: 7px; height: 7px; }
::-webkit-scrollbar-track       { background: var(--c-deep); }
::-webkit-scrollbar-thumb       { background: var(--c-red-dark); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--c-red); }

/* ── SKIP LINK ──────────────────────────────────────────────────── */
.skip-link {
  position: absolute; top: -120%; left: 1rem;
  z-index: 9999;
  background: var(--c-red-dark); color: var(--c-white);
  font-family: var(--f-ui); font-size: .875rem; font-weight: 700;
  padding: .5rem 1.1rem; border-radius: var(--radius);
  transition: top var(--t-fast); white-space: nowrap;
}
.skip-link:focus { top: 1rem; }

/* ── SVG ICONS ──────────────────────────────────────────────────── */
.site-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.1em;
  height: 1.1em;
  vertical-align: middle;
  flex-shrink: 0;
}
.site-icon svg { width: 100%; height: 100%; display: block; fill: currentColor; }

/* ── CONTAINER ──────────────────────────────────────────────────── */
.container {
  width: 100%;
  max-width: var(--max-w);
  margin-inline: auto;
  padding-inline: var(--pad-x);
}

/* ── TYPOGRAFIE ─────────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--f-ui); font-weight: 700;
  line-height: 1.2; color: var(--c-white); overflow-wrap: break-word;
}
h2 { font-size: clamp(1.4rem, 3.5vw, 2.1rem); letter-spacing: .04em; }
h3 { font-size: clamp(1.05rem, 2.5vw, 1.4rem); }
h4 { font-size: 1.1rem; }
p  { margin-bottom: 1rem; }
p:last-child { margin-bottom: 0; }
strong { font-weight: 700; color: var(--c-white); }
em     { font-style: italic; color: var(--c-text-muted); }

.section-title {
  font-family: var(--f-ui);
  font-size: clamp(1.1rem, 2.8vw, 1.7rem);
  font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--c-white); display: inline-block; position: relative;
  margin-bottom: 1.25rem;
}
.section-title::after {
  content: ''; display: block; width: 55%; height: 2px;
  background: linear-gradient(90deg, var(--c-red-dark), transparent);
  margin-top: .4rem; border-radius: 1px;
}
.section__header--center .section-title::after { margin-inline: auto; }
.section-sub {
  font-family: var(--f-body); font-size: .9rem;
  color: var(--c-text-muted); line-height: 1.65;
  max-width: 660px; margin-bottom: var(--gap-lg);
}

/* ── BUTTONS ────────────────────────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; gap: .45rem;
  font-family: var(--f-ui); font-size: .82rem; font-weight: 700;
  letter-spacing: .07em; text-transform: uppercase;
  padding: .68rem 1.35rem; border: none; border-radius: var(--radius);
  cursor: pointer; white-space: nowrap;
  transition: background var(--t-mid), color var(--t-mid), box-shadow var(--t-mid),
              transform var(--t-fast), border-color var(--t-fast);
}
.btn:focus-visible { outline: 2px solid var(--c-gold); outline-offset: 3px; }
.btn--primary { background: var(--c-red-dark); color: var(--c-white); }
.btn--primary:hover { background: var(--c-red); box-shadow: var(--sh-red); color: var(--c-white); transform: translateY(-2px); }
.btn--outline { background: transparent; color: var(--c-white); border: 1px solid var(--c-border-hi); }
.btn--outline:hover { border-color: var(--c-red-dark); color: var(--c-white); background: var(--c-red-subtle); }
.btn--gold { background: var(--c-gold); color: var(--c-void); }
.btn--gold:hover { background: var(--c-gold-bright); box-shadow: var(--sh-gold); color: var(--c-void); transform: translateY(-2px); }
.btn--flyer {
  background: linear-gradient(135deg, #6a0000 0%, var(--c-red-dark) 100%);
  color: var(--c-white); border: 1px solid rgba(255,255,255,.10); box-shadow: var(--sh-card);
}
.btn--flyer:hover {
  background: linear-gradient(135deg, var(--c-red-dark) 0%, var(--c-red) 100%);
  box-shadow: var(--sh-red); color: var(--c-white); transform: translateY(-2px);
}
.btn--footer { font-size: .77rem; padding: .55rem 1rem; }

/* ── EMAIL ──────────────────────────────────────────────────────── */
.email-link { color: var(--c-gold); transition: color var(--t-fast); word-break: break-all; }
.email-link:hover { color: var(--c-gold-bright); }
.lightbox-trigger { cursor: pointer; }

/* ── NAVIGATION ─────────────────────────────────────────────────── */
.site-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  height: var(--nav-h);
  background: rgba(4,0,12,.78);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid transparent;
  transition: background var(--t-mid), border-color var(--t-mid), box-shadow var(--t-mid);
}
.site-nav.is-scrolled {
  background: rgba(4,0,12,.97);
  border-bottom-color: var(--c-border);
  box-shadow: 0 2px 24px rgba(0,0,0,.65);
}
.site-nav__inner {
  display: flex; align-items: center; height: 100%;
  max-width: var(--max-w); margin-inline: auto;
  padding-inline: var(--pad-x); gap: .75rem;
}

/* Brand */
.site-nav__brand { display: flex; align-items: center; gap: .35rem; flex-shrink: 0; transition: opacity var(--t-fast); }
.site-nav__brand:hover { opacity: .82; color: inherit; }
.site-nav__brand-icon { color: var(--c-red-dark); font-size: 1rem; line-height: 1; flex-shrink: 0; }
.site-nav__brand-text { font-family: var(--f-headline); font-size: 1.2rem; color: var(--c-white); letter-spacing: .03em; }
.site-nav__brand-text em { color: var(--c-red-dark); font-style: normal; margin-left: .1em; }

/* Desktop Nav */
.site-nav__list { display: none; align-items: center; gap: .1rem; list-style: none; margin-left: auto; }
@media (min-width: 1024px) { .site-nav__list { display: flex; } }
.site-nav__item { display: flex; }
.site-nav__link {
  font-family: var(--f-ui); font-size: .77rem; font-weight: 700;
  letter-spacing: .07em; text-transform: uppercase;
  color: var(--c-text-muted); padding: .4rem .7rem;
  border-radius: var(--radius); position: relative;
  transition: color var(--t-fast), background var(--t-fast);
}
.site-nav__link::after {
  content: ''; position: absolute;
  bottom: 2px; left: .7rem; right: .7rem;
  height: 2px; background: var(--c-red-dark);
  transform: scaleX(0); transform-origin: left;
  transition: transform var(--t-mid); border-radius: 1px;
}
.site-nav__link:hover               { color: var(--c-white); background: rgba(255,255,255,.04); }
.site-nav__link:hover::after        { transform: scaleX(1); }
.site-nav__link--active             { color: var(--c-white); }
.site-nav__link--active::after      { transform: scaleX(1); }

/* Nav Actions */
.site-nav__actions { display: none; align-items: center; gap: .6rem; margin-left: .4rem; flex-shrink: 0; }
@media (min-width: 1024px) { .site-nav__actions { display: flex; } }

.site-nav__flyer {
  display: flex; align-items: center; gap: .28rem;
  font-family: var(--f-ui); font-size: .72rem; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase;
  color: var(--c-red-dark); padding: .3rem .6rem;
  border: 1px solid var(--c-red-dark); border-radius: var(--radius);
  transition: background var(--t-fast), color var(--t-fast);
}
.site-nav__flyer:hover { background: var(--c-red-dark); color: var(--c-white); }
.site-nav__flyer-label { display: none; }
@media (min-width: 1200px) { .site-nav__flyer-label { display: inline; } }

/* Flags */
.site-nav__lang { display: flex; align-items: center; gap: .22rem; }
.site-nav__flag {
  display: flex; align-items: center; border-radius: 2px; overflow: hidden;
  opacity: .38; transition: opacity var(--t-fast), transform var(--t-fast);
  border: 1px solid transparent; line-height: 0;
}
.site-nav__flag:hover      { opacity: .88; transform: scale(1.14); color: inherit; }
.site-nav__flag--active    { opacity: 1; border-color: var(--c-gold); }
.site-nav__flag img        { width: 24px; height: 16px; object-fit: cover; display: block; }

/* Burger */
.site-nav__burger {
  display: flex; flex-direction: column; justify-content: center; gap: 5px;
  width: 40px; height: 40px; background: transparent;
  border: 1px solid var(--c-border-hi); border-radius: var(--radius);
  cursor: pointer; padding: 9px 10px; margin-left: auto; flex-shrink: 0;
  transition: border-color var(--t-fast), background var(--t-fast);
}
@media (min-width: 1024px) { .site-nav__burger { display: none; } }
.site-nav__burger:hover    { border-color: var(--c-red-dark); background: var(--c-red-subtle); }
.site-nav__burger-bar {
  display: block; width: 100%; height: 2px;
  background: var(--c-text-muted); border-radius: 1px;
  transition: transform var(--t-mid), opacity var(--t-mid); transform-origin: center;
}
.site-nav.is-open .site-nav__burger-bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.site-nav.is-open .site-nav__burger-bar:nth-child(2) { opacity: 0; transform: scaleX(0); }
.site-nav.is-open .site-nav__burger-bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile Panel */
.site-nav__mobile {
  position: fixed; top: var(--nav-mob-h); left: 0; right: 0;
  background: rgba(4,0,12,.98); border-bottom: 1px solid var(--c-border);
  padding: 1.1rem var(--pad-x) 1.5rem;
  transform: translateY(-108%); opacity: 0; pointer-events: none;
  transition: transform var(--t-mid), opacity var(--t-mid);
  z-index: 999; max-height: calc(100dvh - var(--nav-mob-h));
  overflow-y: auto; -webkit-overflow-scrolling: touch;
}
.site-nav.is-open .site-nav__mobile { transform: translateY(0); opacity: 1; pointer-events: auto; }
.site-nav__mobile-list { list-style: none; }
.site-nav__mobile-link {
  display: flex; align-items: center; gap: .5rem;
  font-family: var(--f-ui); font-size: .92rem; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase;
  color: var(--c-text-muted); padding: .82rem 0;
  border-bottom: 1px solid var(--c-border);
  transition: color var(--t-fast), padding-left var(--t-fast);
}
.site-nav__mobile-link:hover         { color: var(--c-white); padding-left: .45rem; }
.site-nav__mobile-link--active       { color: var(--c-white); }
.site-nav__mobile-link--flyer        { color: var(--c-red-dark); }
.site-nav__mobile-link--flyer:hover  { color: var(--c-red-bright); }
.site-nav__mobile-flags {
  display: flex; gap: .45rem; padding-top: 1.1rem; flex-wrap: wrap; align-items: center;
}
.site-nav__mobile-flags .site-nav__flag img { width: 30px; height: 20px; }

/* ── SITE HEADER ────────────────────────────────────────────────── */
.site-header {
  position: relative; height: var(--header-h); margin-top: var(--nav-h);
  overflow: hidden; display: flex; align-items: center; background: var(--c-void);
}
@media (max-width: 767px) {
  .site-header { height: var(--header-mob-h); margin-top: var(--nav-mob-h); }
}

.site-header__skyline            { position: absolute; inset: 0; z-index: 0; }
.site-header__skyline .skyline-svg { width: 100%; height: 100%; }

/* Overlay: nur minimale untere Verdunkelung für Textlesbarkeit */
.site-header__overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(4,0,12,.00)  0%,
    rgba(4,0,12,.00) 40%,
    rgba(4,0,12,.72) 100%
  );
}

.site-header__content {
  position: relative; z-index: 2; width: 100%;
  text-align: center; padding-block: 1rem;
}
.site-header__title {
  font-family: var(--f-headline);
  font-size: clamp(2.2rem, 6.5vw, 4.8rem);
  font-weight: 400; line-height: 1.08; letter-spacing: .05em;
  color: var(--c-white); margin-bottom: .55rem;
  text-shadow: 0 2px 32px rgba(0,0,0,.85), 0 0 70px rgba(139,0,0,.35);
  display: flex; align-items: baseline; justify-content: center; flex-wrap: wrap; gap: .3em;
}
.site-header__title--sub { font-size: clamp(1.5rem, 4.2vw, 3rem); margin-bottom: .4rem; }
.site-header__title-bdsm { color: var(--c-red-dark); filter: drop-shadow(0 0 14px rgba(139,0,0,.65)); }
.site-header__title-in   { color: var(--c-text-dim); font-size: .62em; letter-spacing: .14em; }
.site-header__title-city { color: var(--c-white); position: relative; }
.site-header__title-city::after {
  content: ''; display: block; height: 3px;
  background: linear-gradient(90deg, var(--c-gold) 0%, transparent 80%);
  margin-top: .12em; border-radius: 2px;
}
.site-header__tagline {
  font-family: var(--f-ui); font-size: clamp(.72rem, 1.8vw, .92rem);
  font-weight: 400; letter-spacing: .16em; text-transform: uppercase;
  color: var(--c-text-muted); margin-bottom: 1.6rem;
  text-shadow: 0 1px 10px rgba(0,0,0,.85);
}
.site-header__cta { display: flex; justify-content: center; }

/* ── MAIN ───────────────────────────────────────────────────────── */
.site-main { background: var(--c-deep); min-height: 55vh; position: relative; z-index: 10; }

/* ── SEKTIONEN ──────────────────────────────────────────────────── */
.section { padding-block: var(--section-py); position: relative; }
.section--void    { background: var(--c-void); }
.section--deep    { background: var(--c-deep); }
.section--layer   { background: var(--c-layer); }
.section--surface { background: var(--c-surface); }
.section--accent-top::before {
  content: ''; display: block;
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--c-red-dark) 25%, var(--c-gold) 55%, transparent 100%);
}
.section__header           { margin-bottom: var(--gap-lg); }
.section__header--center   { text-align: center; }
.section__header--center .section-sub { margin-inline: auto; }

/* ── STAMMTISCH-KARTEN (Übersicht) ──────────────────────────────── */
.st-grid {
  display: grid; grid-template-columns: 1fr; gap: var(--gap);
}
@media (min-width: 680px)  { .st-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .st-grid { grid-template-columns: repeat(3, 1fr); } }

.st-card {
  background: var(--c-card); border: 1px solid var(--c-border);
  border-top: 3px solid var(--c-red-dark); border-radius: var(--radius-lg);
  display: flex; flex-direction: column; overflow: hidden; box-shadow: var(--sh-card);
  transition: transform var(--t-mid), border-color var(--t-mid), box-shadow var(--t-mid);
}
.st-card:hover { transform: translateY(-5px); border-top-color: var(--c-gold); box-shadow: var(--sh-card), var(--sh-red); }
.st-card__logo-wrap {
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.28); padding: 1.75rem 1.5rem 1.25rem; min-height: 140px;
}
.st-card__logo {
  max-width: 200px; max-height: 100px; width: auto; height: auto;
  object-fit: contain; filter: drop-shadow(0 2px 8px rgba(0,0,0,.5));
  transition: filter var(--t-mid), transform var(--t-mid);
}
.st-card:hover .st-card__logo { filter: drop-shadow(0 4px 18px rgba(139,0,0,.45)); transform: scale(1.05); }
.st-card__body { padding: 1.2rem 1.4rem 1.5rem; flex: 1; display: flex; flex-direction: column; }
.st-card__name {
  font-family: var(--f-ui); font-size: .72rem; font-weight: 700;
  letter-spacing: .11em; text-transform: uppercase;
  color: var(--c-red-dark); margin-bottom: .7rem;
}
.st-card__desc { font-family: var(--f-body); font-size: .875rem; color: var(--c-text-muted); line-height: 1.68; flex: 1; margin-bottom: 1.2rem; }
.st-card__actions { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: auto; }
.st-card__contact {
  font-family: var(--f-body); font-size: .76rem; color: var(--c-text-dim);
  margin-top: .7rem; display: flex; align-items: center; gap: .28rem; flex-wrap: wrap;
}

/* ── TERMINE-WRAPPER ────────────────────────────────────────────── */
.termine-wrap {
  background: var(--c-card); border: 1px solid var(--c-border);
  border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--sh-card);
}
.termine-img-wrap {
  width: 100%; background: rgba(0,0,0,.32);
  display: flex; align-items: center; justify-content: center;
  padding: 1.1rem 1.5rem; border-bottom: 1px solid var(--c-border);
}
.termine-img { max-width: 100%; max-height: 170px; object-fit: contain; border-radius: var(--radius); }
.termine-hint {
  font-family: var(--f-body); font-size: .76rem; color: var(--c-text-dim);
  text-align: center; padding: .65rem; background: rgba(0,0,0,.18);
  border-top: 1px solid var(--c-border); font-style: italic;
}
.no-termine {
  text-align: center; padding: 2rem; color: var(--c-text-dim);
  font-family: var(--f-body); font-size: .9rem; font-style: italic;
}

/* ── TERMIN-KARTEN (einheitlich – Startseite + alle Detailseiten) ─ */
.termin-card-wrap { overflow: hidden; }

.termin-card {
  border-bottom: 1px solid var(--c-border);
  transition: background var(--t-fast);
}
.termin-card:last-child { border-bottom: none; }
.termin-card:hover      { background: rgba(255,255,255,.022); }

/* Einzige Definition des Link-Grids – 3 Spalten überall */
.termin-card__link {
  display: grid;
  grid-template-columns: 96px 1fr auto;
  gap: .6rem .9rem;
  padding: .85rem 1.2rem;
  align-items: center;
  color: inherit;
  text-decoration: none;
}
.termin-card__link:hover { color: inherit; }

@media (max-width: 600px) {
  .termin-card__link {
    grid-template-columns: 72px 1fr auto;
    gap: .45rem .65rem;
    padding: .65rem .9rem;
  }
}

/* Bild-Spalte */
.termin-card__img-wrap {
  position: relative; border-radius: var(--radius); overflow: hidden;
  aspect-ratio: 4 / 3; background: rgba(0,0,0,.4);
  flex-shrink: 0; align-self: center;
}
.termin-card__img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform var(--t-mid);
}
.termin-card:hover .termin-card__img { transform: scale(1.05); }

/* Info-Spalte */
.termin-card__info {
  display: flex; flex-direction: column; gap: .15rem;
  min-width: 0; align-self: center;
}
.termin-card__thema {
  font-family: var(--f-ui); font-size: .9rem; font-weight: 700;
  color: var(--c-white); line-height: 1.28;
  transition: color var(--t-fast);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.termin-card:hover .termin-card__thema { color: var(--c-gold); }

.termin-card__thema-von {
  font-size: .75rem; font-weight: 400;
  color: var(--c-text-dim); font-style: italic;
}
.termin-card__date {
  font-family: var(--f-body); font-size: .78rem; color: var(--c-text-muted);
}
.termin-card__time,
.termin-card__ort {
  display: flex; align-items: flex-start; gap: .2rem;
  font-family: var(--f-body); font-size: .72rem; color: var(--c-text-dim); line-height: 1.35;
}
.termin-card__time .site-icon,
.termin-card__ort  .site-icon { font-size: .78rem; flex-shrink: 0; margin-top: .05rem; }

/* Badge-Spalte rechts */
.termin-card__badge-col {
  display: flex; flex-direction: column; align-items: flex-end;
  justify-content: center; gap: .28rem;
  padding-left: .4rem; flex-shrink: 0; align-self: center;
}

/* Beschreibung: AUSSERHALB des Link-Grids, volle Breite */
.termin-card__desc {
  padding: .6rem 1.2rem .85rem;
  border-top: 1px solid var(--c-border);
  font-family: var(--f-body); font-size: .78rem;
  color: var(--c-text-muted); line-height: 1.65;
}
.termin-card__desc p          { margin-bottom: .4rem; }
.termin-card__desc p:last-child { margin-bottom: 0; }
.termin-card__desc strong     { color: var(--c-white); }
.termin-card__desc ul,
.termin-card__desc ol         { padding-left: 1.2rem; margin-bottom: .4rem; }

/* Ort-Link */
.termin-location-link {
  color: var(--c-text-dim);
  text-decoration: underline; text-decoration-color: transparent;
  text-underline-offset: 2px;
  transition: color var(--t-fast), text-decoration-color var(--t-fast);
}
.termin-location-link:hover { color: var(--c-gold); text-decoration-color: var(--c-gold); }

/* ── BADGES ─────────────────────────────────────────────────────── */
.badge {
  display: inline-flex; align-items: center;
  font-family: var(--f-ui); font-size: .6rem; font-weight: 700;
  letter-spacing: .05em; text-transform: uppercase;
  padding: .18rem .42rem; border-radius: 2px; white-space: nowrap;
}
.badge--beginner     { background: var(--c-green-subtle); border: 1px solid var(--c-green); color: var(--c-green-bright); }
.badge--registration { background: var(--c-gold-subtle);  border: 1px solid var(--c-gold);  color: var(--c-gold-bright); }
.badge--time         { background: rgba(255,255,255,.04); border: 1px solid var(--c-border-hi); color: var(--c-text-muted); }

/* ── GOOGLE KALENDER ────────────────────────────────────────────── */
.gcal-wrapper {
  position: relative; width: 100%; border-radius: var(--radius-lg); overflow: hidden;
  background: var(--c-card); border: 1px solid var(--c-border); box-shadow: var(--sh-card);
}
.gcal-iframe { display: block; width: 100%; height: 530px; border: none; background: transparent; }
@media (max-width: 767px) { .gcal-iframe { height: 400px; } }

/* ── KCM MÜNSTER ────────────────────────────────────────────────── */
.kcm-band {
  padding-block: clamp(2.25rem, 5.5vw, 3.75rem);
  background: linear-gradient(135deg, var(--c-layer) 0%, var(--c-surface) 100%);
  border-top: 1px solid var(--c-border); border-bottom: 1px solid var(--c-border);
}
.kcm-inner { display: flex; align-items: center; justify-content: space-between; gap: var(--gap-lg); flex-wrap: wrap; }
.kcm-text  { flex: 1; min-width: 200px; }
.kcm-title { font-family: var(--f-ui); font-size: clamp(1rem, 2.5vw, 1.4rem); font-weight: 700; color: var(--c-white); margin-bottom: .4rem; }
.kcm-sub   { font-family: var(--f-body); font-size: .875rem; color: var(--c-text-muted); margin-bottom: 1rem; }
.kcm-logo-link {
  display: flex; align-items: center; flex-shrink: 0;
  transition: opacity var(--t-fast), transform var(--t-mid);
}
.kcm-logo-link:hover { opacity: .86; transform: scale(1.04); color: inherit; }
.kcm-logo {
  max-width: 200px; max-height: 80px; width: auto; height: auto;
  object-fit: contain; filter: drop-shadow(0 2px 8px rgba(0,0,0,.55));
}

/* Rainbow Bar */
.rainbow-bar {
  display: block; height: 4px;
  background: linear-gradient(90deg,
    #e40303 0%, #ff8c00 16.6%, #ffed00 33.3%,
    #008026 50%, #004dff 66.6%, #750787 83.3%, #e40303 100%);
  width: 100%; flex-shrink: 0;
}

/* ── STAMMTISCH-DETAILSEITE ─────────────────────────────────────── */
.stammtisch-page { padding-block: var(--gap-lg) var(--section-py); }

/* Breadcrumb */
.breadcrumb { padding-block: 1.2rem .15rem; }
.breadcrumb__list {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: .25rem .4rem; list-style: none;
  font-family: var(--f-ui); font-size: .72rem; letter-spacing: .05em;
}
.breadcrumb__item           { display: flex; align-items: center; color: var(--c-text-dim); }
.breadcrumb__item + .breadcrumb__item::before { content: '›'; margin-right: .4rem; color: var(--c-text-dim); font-size: .85rem; }
.breadcrumb__link           { color: var(--c-text-muted); transition: color var(--t-fast); }
.breadcrumb__link:hover     { color: var(--c-gold); }
.breadcrumb__item--current  { color: var(--c-text-muted); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 260px; }
@media (max-width: 480px)   { .breadcrumb__item--current { max-width: 140px; } }

/* Detail-Header */
.st-detail-header { display: flex; align-items: flex-start; gap: var(--gap-lg); margin-bottom: var(--gap-lg); flex-wrap: wrap; }
.st-detail-logo-wrap {
  flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  background: var(--c-card); border: 1px solid var(--c-border);
  border-radius: var(--radius-lg); padding: 1.5rem 2rem;
}
@media (max-width: 600px) { .st-detail-logo-wrap { width: 100%; } }
.st-detail-logo   { max-width: 220px; max-height: 120px; object-fit: contain; filter: drop-shadow(0 2px 10px rgba(0,0,0,.5)); }
.st-detail-meta   { flex: 1; min-width: 240px; }
.st-detail-title  {
  font-family: var(--f-ui); font-size: clamp(1.3rem, 3.5vw, 2rem); font-weight: 700;
  letter-spacing: .05em; text-transform: uppercase;
  color: var(--c-white); margin-bottom: .85rem; line-height: 1.15;
}
.st-detail-desc   { font-family: var(--f-body); font-size: .95rem; color: var(--c-text); line-height: 1.82; margin-bottom: 1.25rem; }
.st-detail-contact { display: flex; align-items: center; gap: .65rem; flex-wrap: wrap; }
.st-detail-email  { display: inline-flex; align-items: center; gap: .3rem; font-family: var(--f-body); font-size: .84rem; color: var(--c-text-muted); }
.st-detail-email .site-icon { color: var(--c-text-dim); font-size: 1rem; flex-shrink: 0; }

/* Info-Tags */
.st-info-tags { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: 1.3rem; }
.st-info-tag  {
  display: inline-flex; align-items: center; gap: .28rem;
  font-family: var(--f-ui); font-size: .68rem; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase; color: var(--c-text-muted);
  background: rgba(255,255,255,.04); border: 1px solid var(--c-border-hi);
  border-radius: var(--radius); padding: .25rem .6rem; white-space: nowrap;
}
.st-info-tag .site-icon { font-size: .95em; }
.st-info-tag--lgbtq {
  border-color: transparent;
  background-image: linear-gradient(135deg,
    rgba(228,3,3,.08) 0%, rgba(255,140,0,.08) 20%,
    rgba(255,237,0,.08) 40%, rgba(0,128,38,.08) 60%,
    rgba(0,77,255,.08) 80%, rgba(117,7,135,.08) 100%);
  color: var(--c-text);
}

/* Hinweis-Box */
.st-notice {
  display: flex; align-items: flex-start; gap: .65rem;
  border-radius: var(--radius-lg); padding: .9rem 1.1rem;
  margin-bottom: 1.1rem; font-family: var(--f-body); font-size: .84rem; line-height: 1.58;
}
.st-notice .site-icon  { flex-shrink: 0; margin-top: .06rem; }
.st-notice--warning    { background: rgba(200,160,0,.07); border: 1px solid rgba(200,160,0,.28); color: var(--c-text); }
.st-notice--warning .site-icon { color: var(--c-gold); }
.st-notice--warning strong     { color: var(--c-gold-bright); }

/* Termin-Sektion auf Detailseite */
.st-termine-section { padding-top: var(--gap-lg); border-top: 1px solid var(--c-border); }
.st-termine-section .section-title { margin-bottom: 1.1rem; }
.st-termine-img-wrap { margin-bottom: 1.2rem; text-align: center; }
.st-termine-img {
  display: inline-block; max-width: 100%; max-height: 200px;
  object-fit: contain; border-radius: var(--radius);
  filter: drop-shadow(0 3px 14px rgba(0,0,0,.55));
  transition: filter var(--t-mid), transform var(--t-mid);
}
.st-termine-img-wrap a:hover .st-termine-img {
  filter: drop-shadow(0 5px 22px rgba(139,0,0,.40)); transform: scale(1.015);
}

/* ── ÜBER UNS ───────────────────────────────────────────────────── */
.ueber-uns-page    { padding-block: var(--gap-lg) var(--section-py); }
.ueber-uns-content { max-width: 760px; margin-inline: auto; }
.ueber-uns-content p { font-family: var(--f-body); font-size: .97rem; color: var(--c-text); line-height: 1.88; margin-bottom: 1.2rem; }
.ueber-uns-content h3 {
  font-size: 1.15rem; margin-top: 1.75rem; margin-bottom: .5rem;
  color: var(--c-gold); font-family: var(--f-ui); font-weight: 700; letter-spacing: .04em;
}
.ueber-uns-st-list { list-style: none; display: flex; flex-wrap: wrap; gap: 1.25rem; margin-bottom: 2rem; }
.ueber-uns-st-item { flex: 1 1 200px; max-width: 260px; }
.ueber-uns-st-link {
  display: flex; flex-direction: column; align-items: center; gap: .6rem;
  background: var(--c-card); border: 1px solid var(--c-border);
  border-radius: var(--radius-lg); padding: 1rem;
  transition: border-color var(--t-mid), transform var(--t-mid); text-align: center;
}
.ueber-uns-st-link:hover { border-color: var(--c-gold); transform: translateY(-3px); color: inherit; }
.ueber-uns-st-logo { max-width: 130px; max-height: 60px; object-fit: contain; filter: drop-shadow(0 1px 5px rgba(0,0,0,.4)); }
.ueber-uns-st-name { font-family: var(--f-ui); font-size: .72rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--c-text-muted); }
.ueber-uns-kcm {
  display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap;
  background: var(--c-card); border: 1px solid var(--c-border);
  border-left: 4px solid var(--c-green); border-radius: var(--radius-lg);
  padding: 1.1rem 1.4rem; margin-bottom: 2rem;
}
.ueber-uns-kcm-link      { display: flex; flex-shrink: 0; }
.ueber-uns-kcm-link:hover { opacity: .82; color: inherit; }
.ueber-uns-kcm-logo      { max-width: 140px; max-height: 55px; object-fit: contain; }
.ueber-uns-kcm-text      { font-family: var(--f-body); font-size: .88rem; color: var(--c-text); margin: 0; line-height: 1.55; }
.ueber-uns-kcm-text small { color: var(--c-text-muted); }
.ueber-uns-contact-box {
  background: var(--c-card); border: 1px solid var(--c-border);
  border-left: 4px solid var(--c-red-dark); border-radius: var(--radius-lg);
  padding: 1.5rem 1.75rem; margin-top: 2.25rem;
}
.ueber-uns-contact-box h3 {
  font-size: .8rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--c-text-dim); margin-top: 0; margin-bottom: .85rem;
}
.ueber-uns-contact-email { display: flex; align-items: center; gap: .4rem; font-family: var(--f-body); font-size: .95rem; }
.ueber-uns-contact-email .site-icon { color: var(--c-text-dim); flex-shrink: 0; }

/* ── 404 ────────────────────────────────────────────────────────── */
.page-404-wrap {
  min-height: 52vh; display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center;
  padding: var(--gap-lg) var(--pad-x); gap: .9rem;
}
.page-404-code  { font-family: var(--f-headline); font-size: clamp(5rem, 18vw, 11rem); line-height: 1; color: var(--c-red-dark); opacity: .22; user-select: none; }
.page-404-title { font-family: var(--f-ui); font-size: clamp(1.2rem, 3vw, 1.9rem); color: var(--c-white); font-weight: 700; }
.page-404-text  { font-family: var(--f-body); color: var(--c-text-muted); max-width: 380px; font-size: .9rem; }

/* ── FOOTER ─────────────────────────────────────────────────────── */
.site-footer { background: var(--c-void); border-top: 1px solid var(--c-border); padding-top: clamp(2.5rem, 6vw, 4rem); }
.site-footer__grid { display: grid; grid-template-columns: 1fr; gap: var(--gap-lg) var(--gap); }
@media (min-width: 600px)  { .site-footer__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .site-footer__grid { grid-template-columns: 2fr 1fr 1.5fr 1.5fr; } }

.site-footer__brand     { font-family: var(--f-headline); font-size: 1.35rem; color: var(--c-white); display: flex; align-items: center; gap: .38rem; margin-bottom: .75rem; }
.site-footer__brand-icon { color: var(--c-red-dark); }
.site-footer__brand strong { color: var(--c-red-dark); }
.site-footer__age       { font-family: var(--f-body); font-size: .76rem; color: var(--c-text-dim); line-height: 1.55; margin-bottom: .75rem; }
.site-footer__email     { font-family: var(--f-body); font-size: .84rem; }
.site-footer__heading   { font-family: var(--f-ui); font-size: .7rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; color: var(--c-text-dim); margin-bottom: .75rem; }
.site-footer__links     { list-style: none; }
.site-footer__links li  { margin-bottom: .38rem; }
.site-footer__link      { font-family: var(--f-body); font-size: .84rem; color: var(--c-text-muted); display: inline-block; transition: color var(--t-fast), padding-left var(--t-fast); }
.site-footer__link:hover { color: var(--c-gold); padding-left: .28rem; }
.site-footer__kcm-link  { display: inline-flex; margin-bottom: .5rem; transition: opacity var(--t-fast); }
.site-footer__kcm-link:hover { opacity: .8; color: inherit; }
.site-footer__kcm-logo  { max-width: 160px; height: auto; filter: drop-shadow(0 2px 6px rgba(0,0,0,.5)); }
.site-footer__kcm-sub   { font-family: var(--f-body); font-size: .76rem; color: var(--c-text-dim); margin-top: .35rem; }
.site-footer__divider   { border: none; border-top: 1px solid var(--c-border); margin-top: clamp(1.75rem, 4.5vw, 3rem); }
.site-footer__legal     { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .65rem; padding-block: 1rem; }
.site-footer__copy      { font-family: var(--f-body); font-size: .72rem; color: var(--c-text-dim); }
.site-footer__legal-nav ul { display: flex; gap: 1.1rem; list-style: none; }
.footer-legal-link {
  font-family: var(--f-ui); font-size: .72rem; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase; color: var(--c-text-dim);
  cursor: pointer; border: none; background: none; padding: 0;
  transition: color var(--t-fast);
}
.footer-legal-link:hover { color: var(--c-gold); }
.site-footer::after {
  content: ''; display: block; height: 4px;
  background: linear-gradient(90deg,
    #e40303 0%, #ff8c00 16.6%, #ffed00 33.3%,
    #008026 50%, #004dff 66.6%, #750787 83.3%, #e40303 100%);
}

/* ── LIGHTBOX ───────────────────────────────────────────────────── */
.lightbox-overlay {
  position: fixed; inset: 0; z-index: 2000;
  display: flex; align-items: center; justify-content: center;
  pointer-events: none; opacity: 0; transition: opacity var(--t-mid);
}
.lightbox-overlay[aria-hidden="false"] { pointer-events: auto; opacity: 1; }
.lightbox-backdrop {
  position: absolute; inset: 0; background: rgba(4,0,12,.88);
  backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); cursor: pointer;
}
.lightbox-dialog {
  position: relative; z-index: 1; width: min(880px, 95vw); max-height: 90dvh;
  background: var(--c-layer); border: 1px solid var(--c-border-hi);
  border-radius: var(--radius-xl); box-shadow: 0 24px 90px rgba(0,0,0,.82), var(--sh-red);
  display: flex; flex-direction: column; overflow: hidden;
  transform: translateY(22px) scale(.965); transition: transform var(--t-mid);
}
.lightbox-overlay[aria-hidden="false"] .lightbox-dialog { transform: translateY(0) scale(1); }
.lightbox-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: .9rem 1.2rem; border-bottom: 1px solid var(--c-border);
  flex-shrink: 0; background: rgba(0,0,0,.2);
}
.lightbox-title { font-family: var(--f-ui); font-size: .8rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--c-text-muted); }
.lightbox-close {
  display: flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; background: transparent;
  border: 1px solid var(--c-border-hi); border-radius: var(--radius);
  color: var(--c-text-muted); font-size: 1.2rem; line-height: 1; cursor: pointer;
  transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast);
}
.lightbox-close:hover { background: var(--c-red-dark); border-color: var(--c-red-dark); color: var(--c-white); }
.lightbox-body { flex: 1; overflow: hidden; position: relative; min-height: 420px; }
.lightbox-loading {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-family: var(--f-ui); font-size: .85rem; color: var(--c-text-dim);
  pointer-events: none; transition: opacity var(--t-mid);
}
.lightbox-loading.is-hidden { opacity: 0; }
.lightbox-iframe {
  display: block; width: 100%; height: 100%; min-height: 480px;
  border: none; background: #fff; opacity: 0; transition: opacity var(--t-mid);
}
.lightbox-iframe.is-loaded { opacity: 1; }

/* ── HOME PAGE ──────────────────────────────────────────────────── */
.home-termine      { margin-bottom: clamp(2rem, 5vw, 3.5rem); }
.home-termine__more { display: flex; justify-content: flex-start; margin-top: 1rem; }

.home-cal-label    { display: flex; align-items: center; gap: .6rem; margin-bottom: .75rem; }
.home-cal-label__logo {
  width: 36px; height: 36px; object-fit: contain;
  border-radius: var(--radius); background: rgba(0,0,0,.25); padding: 3px; flex-shrink: 0;
}
.home-cal-label__text {
  font-family: var(--f-ui); font-size: .75rem; font-weight: 700;
  letter-spacing: .09em; text-transform: uppercase; color: var(--c-text-dim);
}
.home-cal-divider {
  border: none; border-top: 1px solid var(--c-border);
  margin-block: clamp(1.75rem, 4.5vw, 3rem); position: relative;
}
.home-cal-divider::after {
  content: '◆'; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%); background: var(--c-void);
  padding: 0 .85rem; color: var(--c-red-dark); font-size: .58rem; line-height: 1;
}
.home-gcal-grid { display: grid; grid-template-columns: 1fr; gap: var(--gap-lg) var(--gap); }
@media (min-width: 800px) { .home-gcal-grid { grid-template-columns: repeat(2, 1fr); } }
.home-gcal-col  { display: flex; flex-direction: column; }
.home-gcal-col .gcal-iframe { height: 440px; }
@media (max-width: 799px) { .home-gcal-col .gcal-iframe { height: 380px; } }
.home-cal-more  { display: flex; justify-content: flex-start; margin-top: .85rem; }

/* ── UTILITIES ──────────────────────────────────────────────────── */
.visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.text-center  { text-align: center; }
.text-muted   { color: var(--c-text-muted); }
.text-red     { color: var(--c-red-dark); }
.text-gold    { color: var(--c-gold); }
.text-green   { color: var(--c-green-bright); }
.d-flex       { display: flex; }
.flex-wrap    { flex-wrap: wrap; }
.gap-sm       { gap: .5rem; }
.gap-md       { gap: 1rem; }
.mt-auto      { margin-top: auto; }
.mb-0         { margin-bottom: 0; }
.mb-2         { margin-bottom: 1rem; }
.mb-3         { margin-bottom: 1.5rem; }
.mt-2         { margin-top: 1rem; }
.mt-3         { margin-top: 1.5rem; }
.w-100        { width: 100%; }

/* ── PRINT ──────────────────────────────────────────────────────── */
@media print {
  .site-nav, .site-header__skyline, .site-header__overlay,
  .site-header__cta, .site-footer, .gcal-wrapper, .lightbox-overlay { display: none !important; }
  body { background: #fff; color: #000; font-size: 12pt; }
  .container { max-width: 100%; }
  .st-card { border: 1px solid #ccc; page-break-inside: avoid; }
  a[href]::after { content: ' (' attr(href) ')'; font-size: 9pt; color: #666; }
}

/* ── REDUCED MOTION ─────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}