/*
Theme Name: Praxiszentrum Dr. Stracke & Kollegen
Theme URI: https://westend-hausarzt.com/
Description: Custom Child Theme von Blocksy für das Praxiszentrum Dr. Stracke & Kollegen. Apple-inspiriertes, helles Design.
Author: Praxiszentrum Dr. Stracke & Kollegen
Version: 1.0.0
Template: blocksy
Text Domain: praxiszentrum
Requires at least: 6.0
Requires PHP: 8.0
*/

/* ============ Base ============ */
html {
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  /* S55c (2026-05-08): siehe body unten — overflow-x: clip auch auf html,
   * sonst ueberlaeuft documentElement.scrollWidth weiter. clip etabliert
   * (anders als hidden) keinen Scroll-Container und keinen neuen
   * containing block, sticky bleibt funktionsfaehig. */
  overflow-x: clip;
}
/* S65e (2026-05-10): smooth-scroll respects reduced-motion (WCAG 2.3.3). */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
body {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: 'ss01','cv11';
  color: #1D1D1F;
  background: #FFFFFF;
  line-height: 1.5;
  /* S55c (2026-05-08): horizontal-Overflow-Hardguard. Mobile-Drawer
   * (position:fixed; right:0; transform:translateX(100%)) entkommt auf
   * einigen Templates (team, arzt) dem Layout-Flow durch transform-
   * containing-block-Quirks und blaeht scrollWidth bei 375/768 auf.
   * `overflow-x: clip` schneidet horizontal ab, ohne einen scroll-
   * Container zu etablieren — sticky/fixed bleiben funktionsfaehig. */
  overflow-x: clip;
}
.text-balance { text-wrap: balance; }

/* Apple-style blur nav */
.pxz-navblur { backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); }

/* Praxis color tokens live in assets/css/tokens.css (SSoT since v2.7.5 / S2.0). */

/* Hide legacy Blocksy elements we override */
body.home header#header,
body.home .ct-main-styles-breadcrumbs { display: none; }

/* Utility subset mimicking our Tailwind mockup */
.pxz-container { max-width: 1280px; margin-inline: auto; padding-inline: 1.5rem; }
.pxz-h1 { font-size: clamp(3rem, 8vw, 6.5rem); line-height: 1.05; letter-spacing: -0.025em; font-weight: 600; }
.pxz-h2 { font-size: clamp(2.25rem, 5.5vw, 4.5rem); line-height: 1.08; letter-spacing: -0.02em; font-weight: 600; }
.pxz-h3 { font-size: clamp(1.4rem, 2.5vw, 2rem); line-height: 1.2; letter-spacing: -0.01em; font-weight: 600; }
.pxz-lead { font-size: clamp(1.2rem, 1.8vw, 1.5rem); line-height: 1.4; letter-spacing: -0.005em; }
.pxz-eyebrow { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.2em; color: var(--pxz-red); font-weight: 600; }
.pxz-btn { display: inline-flex; align-items: center; gap: 0.5rem; border-radius: 9999px; padding: 0.875rem 1.75rem; font-size: 1rem; font-weight: 500; transition: all 0.2s; text-decoration: none; }
.pxz-btn-primary { background: var(--pxz-ink); color: #fff; }
.pxz-btn-primary:hover { background: var(--pxz-graphite); color: #fff; }
.pxz-btn-accent { background: var(--pxz-red); color: #fff; }
.pxz-btn-accent:hover { background: var(--pxz-red-dark); color: #fff; }
.pxz-btn-ghost { background: #fff; color: var(--pxz-ink); border: 1px solid var(--pxz-line); }
.pxz-btn-ghost:hover { background: var(--pxz-chalk); color: var(--pxz-ink); }
.pxz-card { background: #fff; border-radius: 22px; box-shadow: 0 4px 24px -8px rgba(0,0,0,0.08); }
.pxz-chalk-card { background: var(--pxz-chalk); border-radius: 22px; transition: all 0.3s; border: 1px solid transparent; }
.pxz-chalk-card:hover { background: #fff; box-shadow: 0 20px 40px -12px rgba(0,0,0,0.12); border-color: var(--pxz-line); }
.pxz-section { padding-block: clamp(4rem, 10vw, 8rem); }

/* Sticky mobile CTA */
.pxz-mobile-cta { position: fixed; bottom: 0; left: 0; right: 0; background: rgba(255,255,255,0.9); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); border-top: 1px solid var(--pxz-line); padding: 0.75rem; z-index: 40; display: none; }
@media (max-width: 768px) { .pxz-mobile-cta { display: block; } }

/* Remove default blocksy margin on full-width pages
 * IMPORTANT: do NOT target `article` generically here. Inner Homepage cards
 * like .pxz-loc-card are <article> too and must keep their own padding
 * (DESIGN_GUIDELINES §13.2 / Anti-Pattern §15.2, logged as PXZ-E-001).
 */
body.page-template-template-homepage .entry-content,
body.page-template-template-homepage .site-main { padding: 0 !important; max-width: none !important; }

/* Lang switcher */
.pxz-lang { display: flex; align-items: center; gap: 0.25rem; font-size: 0.75rem; color: var(--pxz-mist); }
.pxz-lang a, .pxz-lang span.active { padding: 0 0.5rem; }
.pxz-lang span.active { color: var(--pxz-ink); font-weight: 600; }
.pxz-lang a { color: var(--pxz-mist); text-decoration: none; }
.pxz-lang a:hover { color: var(--pxz-ink); }
