/* ============================================================
 * Stoll Standorte — D1 S4 (Claude-Design-Export, Sektion 4)
 * Kopf: Dash-Eyebrow + 800er-H2 links, "Alle Anfahrten" rechts.
 * Karte 340px mit sand-Border. Grid 2x2: weisse Karten mit
 * 4px-Gold-Topline, Kontakt-Links mit Gold-Icons, SPRECHZEITEN
 * ALS RUHIGE ZEILEN (Tag links / Zeit rechts, Hairlines) —
 * KEIN Tabellen-Gitter mehr. Smile Club = dunkle Ink-Karte.
 * JS-COUPLING: .pst-stk-pin / .pst-stk-pop aus standort-karte.js.
 * ============================================================ */

/* Wrapper jetzt stoll-wrap (D1.3 S-E) — war .pst-container mit lokalem
 * Scoped-Override auf 1180px; stoll-wrap ist bereits 1180px + hat jetzt
 * (S-E) den hier bewiesenen Mobile-Override (16px @767px) uebernommen. */
.pst-stk.pst-section { padding-block: var(--pst-space-section); }

/* Kopf (Export: links Eyebrow+H2, rechts Link) */
.pst-stk__head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 32px; margin: 0 0 44px;
}
.pst-stk__head-main { min-width: 0; }
/* Optik jetzt stoll-eyebrow (D1.3 S-C); hier nur noch der Abstand zur H2.
 * pst-stk__eyebrow-dash bleibt: pst-stk-card__ext-eyebrow (Smile-Club-Badge,
 * ausserhalb dieser Slice) nutzt dieselbe Dash-Klasse weiter. */
.pst-stk__eyebrow { margin: 0 0 16px; }
.pst-stk__eyebrow-dash { width: 28px; height: 2px; background: var(--pst-gold-500); flex: none; }
.pst-stk h2.pst-stk__title {
  font-family: var(--pst-font-display); font-weight: var(--pst-fw-heading, 800);
  font-size: var(--pst-fs-h2); line-height: 1.15;
  color: var(--pst-ink-800); margin: 0;
}
.pst-stk .pst-lead { margin: 12px 0 0; }
/* D1.3 S-E geprueft: Werte bereits deckungsgleich mit stoll-btn--ghost. */
.pst-stk a.pst-stk a.pst-stk__head-link {
  display: inline-flex; align-items: center; gap: 9px;
  color: var(--pst-gold-800); font: 700 17px/1 var(--pst-font-display);
  white-space: nowrap; padding: 0 0 4px; text-decoration: none;
  transition: color var(--pst-dur-fast) ease;
}
.pst-stk a.pst-stk__head-link:hover { color: var(--pst-gold-600); }
.pst-stk a.pst-stk__head-link:focus-visible { outline: 2px solid var(--pst-gold-500); outline-offset: 2px; }

/* Karte (Export: 340px, sand-Border, kantig) */
.pst-stk__map {
  height: 340px; margin: 0 0 28px; position: relative; overflow: hidden;
  border: 1px solid var(--pst-sand-200); border-radius: 0;
  background: var(--pst-sand-100); z-index: 0;
}
.pst-stk__map .leaflet-container { font-family: var(--pst-font-body); }
.pst-stk__map .leaflet-bar, .pst-stk__map .leaflet-bar a { border-radius: 0 !important; }
.pst-stk__map .leaflet-popup-content-wrapper, .pst-stk__map .leaflet-popup-tip { border-radius: 0 !important; }

/* Marker (D1.3-Nachtrag 17.07., 1:1 aus Handoff 06-interaktionen-motion.md +
 * Unterseiten.dc.html stollPin-Referenzcode — war zuvor ein bares 18px-CSS-
 * Quadrat statt des Signet-Markers, Joe-Fund 17.07. "Leaflet-Karten sehen
 * nicht wie im Entwurf aus"). CARTO light_all-Tiles ersetzen den vorherigen
 * OSM+Sepia-Filter-Behelf komplett — kein Filter-Hack mehr noetig. */
.pst-stk-pin44 {
  width: 44px; height: 44px; background: var(--pst-gold-500);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 10px 24px rgba(38,33,22,.35);
}
.pst-stk-pin44__icon { width: 26px; height: 26px; }
.pst-stk-pin44__tip {
  width: 0; height: 0; margin: 0 auto;
  border-left: 8px solid transparent; border-right: 8px solid transparent;
  border-top: 9px solid var(--pst-gold-500);
}
.pst-stk-pop b { font-family: var(--pst-font-display); color: var(--pst-ink-800); }
.pst-stk-pop span { color: var(--pst-ink-600); }

/* Grid (Export: 2 Spalten) */
.pst-stk__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }

/* Standort-Karte — Sonderform (Gold-Topline, Sprechzeiten, Kontakt-Links,
 * dunkle Smile-Club-Variante): bleibt eigenstaendig (D1.3 S-D geprueft).
 * Basis-Werte weiss/sand-Border sind bereits deckungsgleich mit stoll-card,
 * kein Klassen-Merge (eigene Hover-Physik ohne Lift-Transform, eigene
 * Varianten — Varianten-Waechter, feedback_globale_regeln_brauchen_inventar.md). */
.pst-stk-card {
  background: var(--pst-white);
  border-top: 4px solid var(--pst-gold-500);
  box-shadow: var(--pst-shadow-sm);
  padding: 36px 40px;
  display: flex; flex-direction: column;
  transition: box-shadow var(--pst-dur) var(--pst-ease);
}
.pst-stk-card:hover { box-shadow: var(--pst-shadow-md); }
.pst-stk h3.pst-stk-card__name {
  font-family: var(--pst-font-display); font-weight: 700;
  font-size: var(--pst-fs-h3); line-height: 1.25;
  color: var(--pst-ink-800); margin: 0 0 4px;
}
.pst-stk-card__addr {
  font-style: normal; font-size: var(--pst-fs-body);
  color: var(--pst-ink-600); margin: 0 0 18px;
}

/* Kontakt-Links mit Gold-Icons */
.pst-stk-card__contact { display: flex; flex-direction: column; gap: 9px; margin: 0 0 24px; }
.pst-stk a.pst-stk-card__clink {
  display: flex; align-items: center; gap: 11px;
  color: var(--pst-ink-800); font-weight: 500; text-decoration: none;
  transition: color var(--pst-dur-fast) ease; word-break: break-word;
}
.pst-stk a.pst-stk-card__clink:hover { color: var(--pst-gold-800); }
.pst-stk a.pst-stk-card__clink:focus-visible { outline: 2px solid var(--pst-gold-500); outline-offset: 2px; }
.pst-stk-card__cico { color: var(--pst-gold-600); }

/* Sprechzeiten: Label + ruhige Zeilen */
.pst-stk-card__hours-label {
  font: 500 13px/1 var(--pst-font-display); letter-spacing: .12em;
  text-transform: uppercase; color: var(--pst-ink-600); margin: 0 0 6px;
}
.pst-stk-card__hours { display: flex; flex-direction: column; margin: 0 0 26px; }
.pst-stk-card__hrow {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 20px; padding: 9px 0;
}
.pst-stk-card__hrow + .pst-stk-card__hrow { border-top: 1px solid var(--pst-sand-200); }
.pst-stk-card__hrow > span:first-child { color: var(--pst-ink-800); font-weight: 500; white-space: nowrap; }
.pst-stk-card__hrow > span:last-child { color: var(--pst-ink-600); text-align: right; }

/* Route-Button ans Karten-Ende (Optik: stoll-btn stoll-btn--primary
 * stoll-btn--sm, D1.3 S-B) — hier nur noch Card-Positionierung. */
.pst-stk a.pst-stk-card__route { margin-top: auto; align-self: flex-start; }

/* Smile Club — dunkle Ink-Karte */
.pst-stk a.pst-stk-card--external {
  background: var(--pst-ink-800);
  border-top-color: var(--pst-gold-500);
  color: #F6F3EC; text-decoration: none; justify-content: center;
}
.pst-stk a.pst-stk-card--external:hover { box-shadow: 0 16px 40px rgba(38,33,22,.28); }
.pst-stk-card__ext-eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; }
.pst-stk-card__ext-eyebrow > span:last-child {
  font: 500 13px/1.2 var(--pst-font-display); letter-spacing: .14em;
  text-transform: uppercase; color: var(--pst-gold-400);
}
.pst-stk a.pst-stk-card--external h3.pst-stk-card__name { color: #F6F3EC; }
.pst-stk-card__ext-text { margin: 0 0 6px; color: rgba(246,243,236,.75); }
.pst-stk a.pst-stk-card--external .pst-stk-card__addr { color: rgba(246,243,236,.6); }
.pst-stk-card__ext {
  margin-top: 14px; display: inline-flex; align-items: center; gap: 10px;
  color: var(--pst-gold-400); font: 700 15px/1 var(--pst-font-display);
}
/* Smile-Club-Marken-Signet (Original-SVG der Smile-Club-Site, eigene
 * Markenfarben — deshalb <img>, kein mask-Icon in Chrome-Farbe) */
.pst-stk-card__signet { flex: none; width: 32px; height: 32px; }

/* Responsive */
@media (max-width: 1024px) {
  .pst-stk__grid { grid-template-columns: 1fr; }
  .pst-stk-card { padding: 28px 24px; }
}
@media (max-width: 767px) {
  /* pst-container-Mobile-Override raus (D1.3 S-E) — jetzt in components.css
   * als genereller stoll-wrap-Mobile-Override (16px @767px). */
  .pst-stk__head { flex-direction: column; align-items: flex-start; gap: 12px; margin-bottom: 28px; }
  .pst-stk__map { height: 260px; }
  .pst-stk-card__hrow > span:last-child { white-space: normal; }
}