/*
 * Praxiszentrum — Standard (Textseite) Page CSS
 * S2.3 Batch B (2026-04-19): page-level layout + typography scope.
 *
 * Selector-Namespace: .pxz-standard-* (S2.2 §2.3)
 * Token-Quelle: tokens.css v2 Schicht 2 — keine harten Werte, keine Primitives.
 * Typografie-Basis: components.css (.pxz-display / .pxz-eyebrow / .pxz-lead).
 * Standard ergänzt NUR Layout, Farben und Text-Rhythmik.
 */

/* ----------------------------------------------------------------------------
 * Page container
 * ------------------------------------------------------------------------- */
.pxz-standard {
  background: var(--pxz-c-bg);
  color: var(--pxz-c-ink);
}

/* ----------------------------------------------------------------------------
 * Hero
 * ------------------------------------------------------------------------- */
.pxz-standard-hero {
  padding: var(--space-11) var(--pxz-space-container-x-desktop) var(--space-9);
}

.pxz-standard-hero-inner {
  max-width: var(--pxz-c2-max);  /* S55d */            /* S41 (Dr. Stracke 2026-04-25): 840 ×1.5 */
  margin: 0 auto;
  text-align: center;
}

.pxz-standard-eyebrow {
  color: var(--pxz-c-accent);
  margin: 0 0 var(--space-4);
}

.pxz-standard-title {
  color: var(--pxz-c-ink);
  margin: 0 0 var(--space-5);
  letter-spacing: -0.01em;
  line-height: 1.15;
}

/* S65b (2026-05-10): Subtitle auf T5-Token (19-32px Lead) statt fix 18px.
 * Fluid und konsistent mit homepage `.pxz-lead`. */
.pxz-standard-sub {
  color: var(--pxz-c-ink-muted);
  max-width: var(--pxz-c2-max);
  margin: 0 auto;
  font-size: var(--pxz-t5-size);
  line-height: var(--pxz-t5-line);
  letter-spacing: var(--pxz-t5-track);
  font-weight: var(--pxz-t5-weight);
}

/* Optional hero image (S2.3-B revision: placeholder-ready) */
.pxz-standard-hero-media {
  max-width: var(--pxz-c3-max);  /* S55d */            /* S41 (Dr. Stracke 2026-04-25): 1120 ×1.5 */
  margin: var(--space-9) auto 0;
  padding: 0 var(--pxz-space-container-x-desktop);
}
.pxz-standard-hero-img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--pxz-radius-card-hero);
  box-shadow: var(--pxz-shadow-card-hi);
}

/* ----------------------------------------------------------------------------
 * Content
 * ------------------------------------------------------------------------- */
.pxz-standard-content {
  padding: var(--space-13) var(--pxz-space-container-x-desktop) var(--pxz-space-section-y-desktop);
}

.pxz-standard-content-inner {
  /* S64-loc-text (2026-05-02, Dr.-Stracke-Direktive): Outer auf 1600 px
     gleich wie .pxz-loc-card--combined-Block, damit auf /standorte/ und
     anderen Standard-Pages der Fließtext bündig zum Adress-Container
     beginnt. Lesbarkeit: direkte Text-Children auf 75 ch zentriert. */
  max-width: var(--pxz-c3-max);  /* S55d */
  margin: 0 auto;
  color: var(--pxz-c-ink);
}

/* S64-loc-text: keep text-elements on a 75 ch reading-channel, centred
   within the wide 1600-px container so the column does not span across
   the full screen on large monitors. */
.pxz-standard-content-inner > p,
.pxz-standard-content-inner > ul,
.pxz-standard-content-inner > ol,
.pxz-standard-content-inner > h2,
.pxz-standard-content-inner > h3,
.pxz-standard-content-inner > h4,
.pxz-standard-content-inner > blockquote {
  max-width: var(--pxz-c1-max);  /* S55d */
  margin-left: auto;
  margin-right: auto;
}

/* S65-2 (2026-05-02, Dr.-Stracke-Direktive): /standorte/ page (ID 9691)
   uses the FULL container width (no 75 ch reading-channel) and a slightly
   larger body type so the intro paragraphs visually align with the wide
   loc-card-combined block above.

   S65-2-fix (2026-05-02): the 3 intro paragraphs do NOT live in
   .pxz-standard-content-inner — the room-slider parser (slider-render.php)
   moves them into .pxz-room-slider-head inside .pxz-standard-rooms.
   Override there too. */
body.page-id-9691 .pxz-standard-content-inner > p,
body.page-id-9691 .pxz-room-slider-head > p,
body.page-id-9691 .pxz-room-slider-head {
  max-width: none;
}
body.page-id-9691 .pxz-room-slider-head p {
  font-size: 19px;
  line-height: 1.6;
  max-width: none;
}

.pxz-standard-content-inner h2 {
  margin: var(--space-13) 0 var(--space-6);
  font-family: var(--pxz-font-display);
  font-weight: var(--font-weight-semibold);
  font-size: 32px;
  line-height: 1.2;
  letter-spacing: -0.005em;
  color: var(--pxz-c-ink);
}

.pxz-standard-content-inner h2:first-child {
  margin-top: 0;
}

.pxz-standard-content-inner h3 {
  margin: var(--space-9) 0 var(--space-4);
  font-family: var(--pxz-font-display);
  font-weight: var(--font-weight-semibold);
  font-size: 22px;
  line-height: 1.3;
  color: var(--pxz-c-ink);
}

.pxz-standard-content-inner p {
  margin: 0 0 var(--space-5);
  font-family: var(--pxz-font-body);
  font-size: 17px;
  line-height: 1.55;
  color: var(--pxz-c-ink-muted);
}

.pxz-standard-content-inner p strong {
  color: var(--pxz-c-ink);
  font-weight: var(--font-weight-semibold);
}

.pxz-standard-content-inner ul {
  margin: 0 0 var(--space-6);
  padding-left: var(--space-6);
  list-style: disc;
}

.pxz-standard-content-inner li {
  margin: 0 0 var(--space-3);
  font-family: var(--pxz-font-body);
  font-size: 17px;
  line-height: 1.55;
  color: var(--pxz-c-ink-muted);
}

.pxz-standard-content-inner li strong {
  color: var(--pxz-c-ink);
  font-weight: var(--font-weight-semibold);
}

.pxz-standard-content-inner a {
  color: var(--pxz-c-accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.pxz-standard-content-inner a:hover {
  color: var(--pxz-c-accent-hover);
}

.pxz-standard-content-inner em {
  font-style: italic;
  color: var(--pxz-c-ink-muted);
}

/* ----------------------------------------------------------------------------
 * CTA
 * ------------------------------------------------------------------------- */
.pxz-standard-cta {
  padding: 0 var(--pxz-space-container-x-desktop) var(--pxz-space-section-y-desktop);
}

.pxz-standard-cta-inner {
  max-width: var(--pxz-c2-max);  /* S55d */            /* S41 (Dr. Stracke 2026-04-25): 760 ×1.5 */
  margin: 0 auto;
  padding: var(--space-11) var(--space-9);
  background: var(--pxz-c-surface-alt);
  border-radius: var(--pxz-radius-card);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  justify-content: center;
}

/* ----------------------------------------------------------------------------
 * Responsive
 * ------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .pxz-standard-hero {
    padding: var(--space-9) var(--pxz-space-container-x-tablet) var(--space-7);
  }
  .pxz-standard-hero-media {
    padding: 0 var(--pxz-space-container-x-tablet);
    margin-top: var(--space-8);
  }
  .pxz-standard-content {
    padding: var(--space-11) var(--pxz-space-container-x-tablet) var(--pxz-space-section-y-tablet);
  }
  .pxz-standard-cta {
    padding: 0 var(--pxz-space-container-x-tablet) var(--pxz-space-section-y-tablet);
  }
  .pxz-standard-content-inner h2 {
    font-size: 26px;
    margin: var(--space-11) 0 var(--space-5);
  }
  /* S65b (2026-05-10): Token-Lead skaliert eigenständig. */
}

@media (max-width: 600px) {
  .pxz-standard-hero {
    padding: var(--space-8) var(--pxz-space-container-x-mobile) var(--space-6);
  }
  .pxz-standard-hero-media {
    padding: 0 var(--pxz-space-container-x-mobile);
    margin-top: var(--space-7);
  }
  .pxz-standard-content {
    padding: var(--space-9) var(--pxz-space-container-x-mobile) var(--pxz-space-section-y-mobile);
  }
  .pxz-standard-cta {
    padding: 0 var(--pxz-space-container-x-mobile) var(--pxz-space-section-y-mobile);
  }
  .pxz-standard-content-inner h2 {
    font-size: 22px;
    margin: var(--space-9) 0 var(--space-4);
  }
  .pxz-standard-hero-img { border-radius: var(--pxz-radius-card); }
  .pxz-standard-content-inner h3 {
    font-size: 19px;
  }
  .pxz-standard-content-inner p,
  .pxz-standard-content-inner li {
    font-size: 16px;
  }
  .pxz-standard-cta-inner {
    padding: var(--space-8) var(--space-6);
    flex-direction: column;
  }
  .pxz-standard-cta-inner .pxz-btn {
    width: 100%;
  }
}

/* ----------------------------------------------------------------------------
 * Praxis cross-links (Session 24, 2026-04-22)
 * Zwei Teaser-Cards auf /praxis/ nach dem Content, vor dem optionalen CTA-Block.
 * Fuehren in /leistungen/ (S20 Services-Hub) und /diagnostik/ (S21 Diagnostik-Hub).
 * Guard im Template: is_page('praxis'). Andere Standard-Seiten rendern nichts.
 * ------------------------------------------------------------------------- */
.pxz-praxis-crosslinks {
  padding: var(--space-9) var(--pxz-space-container-x-desktop);
  background: var(--pxz-c-bg);
}

.pxz-praxis-crosslinks-inner {
  max-width: var(--pxz-c3-max);  /* S55d */            /* S41 (Dr. Stracke 2026-04-25): 1040 ×1.5 */
  margin: 0 auto;
}

.pxz-praxis-crosslinks-heading {
  margin: 0 0 var(--space-6);
  color: var(--pxz-c-ink);
  text-align: center;
}

.pxz-praxis-crosslinks-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-5);
}

.pxz-praxis-crosslinks-card {
  padding: 0;
  transition: box-shadow .2s ease, transform .2s ease;
}

/* S65b (2026-05-10): Hover-Shadow auf Token-Layered-Stack. */
.pxz-praxis-crosslinks-card:hover,
.pxz-praxis-crosslinks-card:focus-within {
  box-shadow: var(--pxz-shadow-card-hi);
  transform: translateY(-3px);
}

.pxz-praxis-crosslinks-link {
  display: block;
  padding: var(--space-6);
  color: inherit;
  text-decoration: none;
  border-radius: var(--pxz-radius-card);
}

.pxz-praxis-crosslinks-link:focus-visible {
  outline: var(--pxz-focus-ring-width) solid var(--pxz-focus-ring-color);
  outline-offset: var(--pxz-focus-ring-offset);
}

.pxz-praxis-crosslinks-eyebrow {
  margin: 0 0 var(--space-2);
  color: var(--pxz-c-accent);
}

.pxz-praxis-crosslinks-title {
  margin: 0 0 var(--space-3);
  font-size: var(--pxz-fs-title-4, 1.5rem);
  line-height: 1.2;
  color: var(--pxz-c-ink);
}

.pxz-praxis-crosslinks-sub {
  margin: 0 0 var(--space-4);
  color: var(--pxz-c-ink-soft, var(--pxz-c-ink));
  font-size: var(--pxz-fs-body, 1rem);
  line-height: 1.5;
}

.pxz-praxis-crosslinks-cta {
  display: inline-block;
  font-weight: 600;
  color: var(--pxz-c-accent);
}

.pxz-praxis-crosslinks-link:hover .pxz-praxis-crosslinks-cta {
  text-decoration: underline;
}

@media (max-width: 720px) {
  .pxz-praxis-crosslinks {
    padding: var(--space-7) var(--pxz-space-container-x-mobile, var(--space-5));
  }
  .pxz-praxis-crosslinks-grid {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }
}