/* =============================================================================
   PHYSIOPARK MG · SCHMERZLINDERUNG DURCH FDM-THERAPIE (/fdm) — Seiten-CSS
   Datei:   ppw-fdm.css       Version: 0.1.0
   System:  gebrückt auf ppw-base.css (globale --ppw-* Tokens, Hardcode-
            Fallbacks eingebaut, 0 sichtbare Änderung)
   Scope:   alles unter .fdm-page gekapselt.

   CHANGELOG (neueste zuerst · historische Einträge NIE umschreiben)
   --------------------------------------------------------------------------
   0.1.0 · 2026-07-20
     - Erste versionierte Ablage, aus Live-Seite übernommen und bereinigt.
     - 4 Elementor-Rahmen-Regeln entfernt
     - :root-Tokenblock auf .fdm-page umgehängt (Token-Kapselung)
     - --shadow Wert weicht ab (0 12px 28px rgba(7,24,28,.12)), nicht gebrückt
     - Token-Bruecken: --font-family, --surface, --primary, --primary-hover, --heading-main
     - Manrope-Referenzen aus font-family entfernt

   ARBEITSREGELN (wie üblich)
     - KEINE Textänderung. Nur Präsentation/CSS.
     - Farben/Radien/Schatten über Tokens statt Hardcodes.
     - Klassennamen NICHT umbenennen (JS-Hooks).
     - Jede Änderung: Version hochziehen + hier loggen.
   ============================================================================= */

.fdm-page {
  --font-family: var(--ppw-font, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif);
  --bg:#edf4f6;
  --surface: var(--ppw-surface, #ffffff);
  --surface-soft:#f5f9fa;
  --text:#10232a;
  --muted:#24414a;
  --primary: var(--ppw-brand, #0f5c63);
  --primary-hover: var(--ppw-brand-hover, #0b494f);
  --accent:#8b1248;
  --border:#c1d6d9;
  --shadow:0 12px 28px rgba(7,24,28,.12);
  --radius:14px;
  --ui-radius-pill:10px;
  --heading-main: var(--ppw-heading, #0c2731);
  --heading-sub:#123c46;
  --heading-accent:#0f5c63
}

.fdm-page {
  font-family:var(--font-family);
  color:var(--text);
  background:var(--bg);
  padding:40px 10px
}

.fdm-page .container {
  max-width:1000px;
  margin:0 auto
}

.fdm-hero {
  text-align:center;
  margin-bottom:30px
}

.fdm-hero h1 {
  margin:0 0 12px;
  font-size:clamp(2rem, 2.5vw + 1rem, 2.8rem);
  color:var(--heading-main);
  line-height:1.15;
  font-weight:850;
  letter-spacing:-.02em
}

.fdm-hero p {
  font-size:1.15rem;
  color:var(--muted);
  max-width:700px;
  margin:0 auto
}

.fdm-page h2 {
  font-size:clamp(1.4rem, 1.5vw + 1rem, 1.8rem);
  color:var(--heading-main);
  margin:0 0 16px;
  line-height:1.25;
  font-weight:820
}

.fdm-page h3 {
  font-size:1.2rem;
  color:var(--heading-sub);
  margin:0 0 10px;
  font-weight:700
}

.fdm-page p {
  margin:0 0 16px;
  line-height:1.7;
  font-size:1.05rem
}

.fdm-page p:last-child {
  margin-bottom:0
}

.text-center {
  text-align:center
}

.mt-20 {
  margin-top:20px
}

.fdm-panel {
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:30px;
  margin-bottom:30px
}

.info-box {
  background:var(--surface-soft);
  border-left:4px solid var(--primary);
  padding:20px;
  border-radius:8px
}

.status-box {
  background:#fff6fa;
  border:1px solid #f2dbe6;
  border-left:4px solid var(--accent);
  padding:16px 20px;
  border-radius:8px;
  margin-top:20px
}

.status-box p {
  margin:0;
  color:#4a152d;
  font-size:.98rem
}

.fdm-cta-container {
  margin-top:24px
}

.fdm-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:14px 28px;
  border-radius:var(--ui-radius-pill);
  text-decoration:none !important;
  font-size:1.05rem;
  font-weight:800;
  color:#fff !important;
  background:linear-gradient(135deg,var(--primary),#2f7880);
  box-shadow:0 8px 18px rgba(15,91,99,.24);
  transition:transform .2s ease,box-shadow .2s ease
}

.fdm-btn:hover {
  background:linear-gradient(135deg,var(--primary-hover),#256b72);
  transform:translateY(-2px);
  box-shadow:0 12px 24px rgba(15,91,99,.3)
}

.team-section {
  display:flex;
  gap:30px;
  align-items:flex-start;
  margin-top:24px
}

.team-image-wrapper {
  flex:0 0 220px
}

.team-image-wrapper img {
  width:100%;
  height:auto;
  border-radius:12px;
  border:3px solid var(--surface-soft);
  box-shadow:0 8px 16px rgba(0,0,0,.1);
  display:block
}

.team-info {
  flex:1
}

.table-responsive {
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:10px;
  box-shadow:0 4px 12px rgba(0,0,0,.05);
  border:1px solid var(--border)
}

.fdm-table {
  width:100%;
  border-collapse:collapse;
  background-color:var(--surface);
  min-width:600px
}

.fdm-table th,.fdm-table td {
  padding:16px;
  text-align:left;
  border-bottom:1px solid #e1ebed;
  font-size:1rem
}

.fdm-table th {
  background-color:var(--surface-soft);
  color:var(--heading-main);
  font-weight:800;
  font-size:1.05rem
}

.fdm-table tr:last-child td {
  border-bottom:none
}

@media (max-width:768px) {
  .fdm-page {
    padding:20px 10px
  }

  .fdm-panel {
    padding:20px
  }

  .team-section {
    flex-direction:column;
    align-items:center;
    gap:20px
  }

  .team-image-wrapper {
    flex:0 0 auto;
    width:200px
  }

  .team-info {
    text-align:center
  }

  .info-box,.status-box {
    text-align:left
  }

}