/* ══════════════════════════════════════
   DESIGN SYSTEM
   Warm luxury medical · Chiemgau/München
   Palette: Deep Forest + Warm Cream + Gold accent
══════════════════════════════════════ */
:root {
  --forest:      #1C2B1E;
  --forest-mid:  #2D4030;
  --forest-soft: #3D5540;
  --sage:        #7A9B7F;
  --sage-light:  #A8C4AD;
  --cream:       #FAF7F2;
  --cream-warm:  #F4EFE6;
  --cream-mid:   #EDE6D8;
  --gold:        #C8A84B;
  --gold-light:  #E8C96A;
  --gold-pale:   #F5E9C4;
  --text-dark:   #1A1F1B;
  --text-mid:    #3D4740;
  --text-soft:   #6B7A6E;
  --white:       #FFFFFF;
  --nav-h:       76px;

  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;

  --shadow-soft: 0 4px 24px rgba(28,43,30,0.08);
  --shadow-med:  0 12px 48px rgba(28,43,30,0.12);
  --shadow-deep: 0 24px 80px rgba(28,43,30,0.18);

  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 20px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  font-family: var(--font-body);
  background: var(--cream);
  color: var(--text-dark);
  overflow-x: hidden;
  line-height: 1.6;
}
img { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }

/* ── SCROLLBAR ── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--cream); }
::-webkit-scrollbar-thumb { background: var(--sage); border-radius: 3px; }

/* ══════════════════════════════════════
   NAVIGATION
══════════════════════════════════════ */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  height: var(--nav-h);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 clamp(1.5rem, 4vw, 3rem);
  background: rgba(250,247,242,0.94);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid transparent;
  transition: border-color .3s, box-shadow .3s;
}
.nav.stuck {
  border-color: var(--cream-mid);
  box-shadow: 0 2px 20px rgba(28,43,30,0.06);
}
.nav-brand {
  display: flex; align-items: center; gap: 12px; cursor: pointer;
}
.nav-logo-img { width: 68px; height: 68px; object-fit: contain; background: transparent !important; padding: 0; border-radius: 0; flex-shrink: 0; }
.nav-brand-text {
  display: flex; flex-direction: column; line-height: 1.15; gap: 5px;
}
.nav-brand-name {
  font-family: var(--font-display);
  font-size: 1.05rem; font-weight: 500;
  color: var(--forest);
  letter-spacing: 0.01em;
}
.nav-brand-sub {
  font-size: 0.6rem; text-transform: uppercase;
  letter-spacing: 0.18em; color: var(--text-soft);
  font-weight: 400;
}
.nav-links {
  display: flex; align-items: center; gap: 0.25rem;
  list-style: none;
}
.nav-links li a {
  font-size: 0.82rem; font-weight: 400; letter-spacing: 0.04em;
  color: var(--text-mid);
  padding: 0.4rem 0.8rem; border-radius: 2rem;
  transition: color .2s, background .2s;
  display: block;
}
.nav-links li a:hover { color: var(--forest); background: var(--cream-warm); }
.nav-links li a.active { color: var(--forest); font-weight: 500; }
.nav-cta {
  padding: 0.55rem 1.4rem;
  background: var(--forest);
  color: var(--white) !important;
  border-radius: 2rem; font-size: 0.82rem !important;
  font-weight: 500 !important; letter-spacing: 0.05em !important;
  transition: background .2s, transform .15s !important;
}
.nav-cta:hover { background: var(--forest-soft) !important; transform: translateY(-1px); }
.nav-burger {
  display: none; background: none; border: none;
  cursor: pointer; padding: 6px; color: var(--text-dark);
  flex-direction: column; gap: 5px;
}
.nav-burger span {
  display: block; width: 22px; height: 1.5px;
  background: currentColor; transition: all .3s;
}

/* Mobile overlay */
.mob-overlay {
  display: none; position: fixed; inset: 0; z-index: 190;
  background: var(--cream);
  flex-direction: column; align-items: center; justify-content: center;
  gap: 2.5rem; opacity: 0; transition: opacity .3s;
}
.mob-overlay.open { display: flex; opacity: 1; }
.mob-overlay .mob-close {
  position: absolute; top: 1.5rem; right: 2rem;
  background: none; border: none; cursor: pointer;
  font-size: 1.5rem; color: var(--text-dark); line-height: 1;
}
.mob-overlay a {
  font-family: var(--font-display);
  font-size: 2.5rem; font-weight: 300; color: var(--forest);
  letter-spacing: -0.01em; font-style: italic;
  transition: color .2s;
}
.mob-overlay a:hover { color: var(--sage); }
.mob-overlay .mob-cta-btn {
  margin-top: .5rem; padding: .8rem 2.2rem;
  background: var(--forest); color: white;
  border-radius: 2rem; font-family: var(--font-body);
  font-size: .9rem; font-weight: 500;
  font-style: normal;
}

/* ══════════════════════════════════════
   PAGE SPA SYSTEM
══════════════════════════════════════ */
.pg { display: none; }
.pg.active { display: block; }

/* ══════════════════════════════════════
   HERO SECTION
══════════════════════════════════════ */
.hero {
  min-height: 100dvh;
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding-top: var(--nav-h);
}
@media (max-width: 860px) {
  .hero { grid-template-columns: 1fr; min-height: auto; }
}
.hero-content {
  display: flex; flex-direction: column;
  justify-content: center;
  padding: clamp(3rem,6vw,6rem) clamp(2rem,5vw,5rem);
  background: var(--cream);
  position: relative;
}
.hero-eyebrow {
  display: flex; align-items: center; gap: .75rem;
  font-size: .65rem; text-transform: uppercase;
  letter-spacing: .22em; color: var(--gold);
  font-weight: 500; margin-bottom: 1.75rem;
}
.hero-eyebrow-line {
  width: 28px; height: 1px; background: var(--sage);
}
.hero-title {
  font-family: var(--font-display);
  font-size: clamp(2.8rem, 5.5vw, 4.8rem);
  font-weight: 300; line-height: 1.08;
  color: var(--forest); margin-bottom: 1.5rem;
  letter-spacing: -0.02em;
}
.hero-title em {
  font-style: italic; color: var(--sage);
}
.hero-subtitle {
  font-size: clamp(.9rem, 1.5vw, 1.05rem);
  color: var(--text-soft); line-height: 1.75;
  max-width: 26rem; margin-bottom: 2.5rem;
  font-weight: 300;
}
.hero-actions {
  display: flex; gap: .75rem; flex-wrap: wrap; margin-bottom: 3rem;
}
.btn-primary {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .8rem 1.8rem; background: var(--forest);
  color: white; border-radius: 2rem; font-size: .88rem;
  font-weight: 500; letter-spacing: .04em;
  transition: background .2s, transform .15s, box-shadow .2s;
  box-shadow: 0 4px 16px rgba(28,43,30,0.2);
}
.btn-primary:hover {
  background: var(--forest-soft); transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(28,43,30,0.25);
}
.btn-outline {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .8rem 1.8rem; border: 1.5px solid var(--sage-light);
  color: var(--forest-mid); border-radius: 2rem;
  font-size: .88rem; font-weight: 400;
  transition: border-color .2s, color .2s, background .2s;
}
.btn-outline:hover {
  border-color: var(--sage); color: var(--forest);
  background: var(--cream-warm);
}
.hero-trust {
  display: flex; gap: 2rem; flex-wrap: wrap;
}
.trust-item {
  display: flex; flex-direction: column;
}
.trust-num {
  font-family: var(--font-display);
  font-size: 1.6rem; font-weight: 300;
  color: var(--forest); line-height: 1;
}
.trust-label {
  font-size: .62rem; text-transform: uppercase;
  letter-spacing: .14em; color: var(--text-soft);
  margin-top: .2rem;
}

/* Hero photo side */
.hero-visual {
  position: relative; overflow: hidden;
  background: var(--cream-warm);
}
@media (max-width: 860px) {
  .hero-visual { aspect-ratio: 4/3; }
}
.hero-photo {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 20%;
  transition: transform 8s ease;
}
.hero:hover .hero-photo { transform: scale(1.03); }
.hero-visual-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to right, rgba(250,247,242,0.15) 0%, transparent 40%),
              linear-gradient(to top, rgba(28,43,30,0.4) 0%, transparent 50%);
}
.hero-badge {
  position: absolute; bottom: 2rem; left: 2rem; right: 2rem;
  background: rgba(250,247,242,0.95);
  backdrop-filter: blur(12px);
  border-radius: var(--radius-md);
  padding: 1.25rem 1.5rem;
  border-left: 3px solid var(--gold);
  box-shadow: var(--shadow-med);
}
.hero-badge-quote {
  font-family: var(--font-display);
  font-style: italic; font-size: 1rem;
  color: var(--forest); line-height: 1.5; margin-bottom: .35rem;
}
.hero-badge-attr {
  font-size: .62rem; text-transform: uppercase;
  letter-spacing: .14em; color: var(--text-soft);
}

/* ══════════════════════════════════════
   ANGEBOTE / LEISTUNGEN
══════════════════════════════════════ */
.section {
  padding: clamp(4rem,8vw,7rem) clamp(1.5rem,5vw,5rem);
}
.section-inner { max-width: 1200px; margin: 0 auto; }
.section-tag {
  display: inline-flex; align-items: center; gap: .6rem;
  font-size: .62rem; text-transform: uppercase;
  letter-spacing: .22em; color: var(--gold);
  font-weight: 500; margin-bottom: .75rem;
}
.section-tag::before {
  content: ''; display: block; width: 20px; height: 1px; background: var(--gold);
}
.section-title {
  font-family: var(--font-display);
  font-size: clamp(2.4rem, 5vw, 3.8rem);
  font-weight: 300; color: var(--forest);
  letter-spacing: -0.02em; line-height: 1.15;
  margin-bottom: .75rem;
}
.section-sub {
  font-size: .95rem; color: var(--text-soft);
  max-width: 42rem; line-height: 1.75; font-weight: 300;
  margin-bottom: 3.5rem;
}

/* Offer cards */
.offers-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
@media (max-width: 900px) { .offers-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .offers-grid { grid-template-columns: 1fr; } }

.offer-card {
  background: white; border-radius: var(--radius-md);
  padding: 2rem; border: 1px solid var(--cream-mid);
  transition: box-shadow .35s, transform .35s, border-color .35s;
  display: flex; flex-direction: column;
  cursor: default;
}
.offer-card:hover {
  box-shadow: var(--shadow-med); transform: translateY(-5px);
  border-color: var(--sage-light);
}
.offer-card.featured {
  background: var(--forest); border-color: var(--forest);
  grid-column: span 1;
}
.offer-icon {
  width: 44px; height: 44px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 1.25rem; font-size: 1.25rem;
  background: var(--cream-warm);
  transition: background .3s;
}
.offer-card.featured .offer-icon { background: rgba(255,255,255,0.12); }
.offer-icon svg { width: 22px; height: 22px; stroke: var(--sage); fill: none; stroke-width: 1.5; stroke-linecap: round; }
.offer-card.featured .offer-icon svg { stroke: var(--gold-light); }
.offer-title {
  font-family: var(--font-display);
  font-size: 1.3rem; font-weight: 400;
  color: var(--forest); margin-bottom: .5rem; line-height: 1.2;
}
.offer-card.featured .offer-title { color: var(--cream); }
.offer-desc {
  font-size: .82rem; color: var(--text-soft);
  line-height: 1.7; flex: 1; font-weight: 300;
}
.offer-card.featured .offer-desc { color: var(--sage-light); opacity: .9; }
.offer-link {
  display: inline-flex; align-items: center; gap: .35rem;
  margin-top: 1.25rem; font-size: .78rem; font-weight: 500;
  color: var(--sage); letter-spacing: .04em;
  transition: gap .2s, color .2s;
  background: none; border: none; cursor: pointer; padding: 0;
}
.offer-card:hover .offer-link { gap: .6rem; color: var(--forest); }
.offer-card.featured .offer-link { color: var(--gold-light); }
.offer-card.featured:hover .offer-link { gap: .6rem; color: var(--gold); }
.offer-link-arrow { font-size: .8rem; transition: transform .2s; }
.offer-card:hover .offer-link-arrow { transform: translateX(3px); }

/* ══════════════════════════════════════
   PAKETE
══════════════════════════════════════ */
.pakete-bg { background: var(--cream-warm); }
.pakete-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem;
}
@media (max-width: 900px) { .pakete-grid { grid-template-columns: 1fr; } }

.paket-card {
  background: white; border-radius: var(--radius-md);
  overflow: hidden; border: 1px solid var(--cream-mid);
  transition: box-shadow .35s, transform .35s;
  display: flex; flex-direction: column;
}
.paket-card:hover { box-shadow: var(--shadow-deep); transform: translateY(-6px); }
.paket-card.highlight {
  border: 2px solid var(--gold);
  box-shadow: 0 0 0 4px var(--gold-pale), var(--shadow-soft);
}
.paket-header {
  padding: 2rem; border-bottom: 1px solid var(--cream-mid);
  background: var(--cream);
}
.paket-card.highlight .paket-header {
  background: linear-gradient(135deg, var(--forest) 0%, var(--forest-mid) 100%);
}
.paket-badge {
  display: inline-block; font-size: .58rem; text-transform: uppercase;
  letter-spacing: .18em; color: var(--sage); font-weight: 500;
  margin-bottom: .75rem;
}
.paket-card.highlight .paket-badge { color: var(--gold-light); }
.paket-name {
  font-family: var(--font-display);
  font-size: 1.6rem; font-weight: 300;
  color: var(--forest); line-height: 1.1;
}
.paket-card.highlight .paket-name { color: var(--cream); }
.paket-tagline {
  font-size: .78rem; color: var(--text-soft);
  margin-top: .35rem; font-weight: 300;
}
.paket-card.highlight .paket-tagline { color: var(--sage-light); }
.paket-body { padding: 2rem; flex: 1; display: flex; flex-direction: column; }
.paket-list { list-style: none; display: flex; flex-direction: column; gap: .6rem; flex: 1; }
.paket-list li {
  display: flex; align-items: flex-start; gap: .6rem;
  font-size: .82rem; color: var(--text-mid); line-height: 1.5; font-weight: 300;
}
.paket-list li::before {
  content: '✓'; color: var(--sage); font-size: .7rem;
  font-weight: 600; flex-shrink: 0; margin-top: .1rem;
}
.paket-price {
  margin-top: 1.5rem; padding-top: 1.25rem;
  border-top: 1px solid var(--cream-mid);
  display: flex; align-items: baseline; gap: .4rem;
}
.paket-price-main {
  font-family: var(--font-display); font-size: 1.75rem;
  font-weight: 400; color: var(--forest);
}
.paket-price-note { font-size: .7rem; color: var(--text-soft); }
.paket-cta {
  display: block; text-align: center; margin-top: 1.25rem;
  padding: .75rem; border-radius: 2rem;
  font-size: .82rem; font-weight: 500; letter-spacing: .04em;
  border: 1.5px solid var(--forest); color: var(--forest);
  transition: background .2s, color .2s;
}
.paket-cta:hover { background: var(--forest); color: white; }
.paket-card.highlight .paket-cta {
  background: var(--gold); border-color: var(--gold); color: var(--forest);
}
.paket-card.highlight .paket-cta:hover {
  background: var(--gold-light); border-color: var(--gold-light);
}

/* ══════════════════════════════════════
   DR. WEIL PORTRAIT SECTION
══════════════════════════════════════ */
.arzt-section {
  display: grid; grid-template-columns: 1fr 1.1fr;
  gap: 5rem; align-items: center;
  max-width: 1200px; margin: 0 auto;
}
@media (max-width: 860px) {
  .arzt-section { grid-template-columns: 1fr; gap: 3rem; }
}
.arzt-portrait-wrap {
  position: relative;
}
.arzt-portrait-img {
  width: 100%; border-radius: var(--radius-lg);
  object-fit: cover; object-position: center 15%;
  aspect-ratio: 3/4;
  box-shadow: var(--shadow-deep);
}
.arzt-portrait-badge {
  position: absolute; bottom: -1.5rem; right: -1.5rem;
  background: white; border-radius: var(--radius-md);
  padding: 1.25rem 1.5rem; box-shadow: var(--shadow-med);
  border: 1px solid var(--cream-mid); max-width: 200px;
}
@media (max-width: 500px) { .arzt-portrait-badge { right: .5rem; bottom: .5rem; } }
.arzt-portrait-badge-name {
  font-family: var(--font-display); font-size: 1rem; font-weight: 500;
  color: var(--forest); line-height: 1.2;
}
.arzt-portrait-badge-title {
  font-size: .62rem; text-transform: uppercase;
  letter-spacing: .12em; color: var(--sage); margin-top: .3rem;
}
.arzt-info-name {
  font-family: var(--font-display);
  font-size: clamp(2rem,4vw,3rem);
  font-weight: 300; color: var(--forest);
  line-height: 1.1; margin-bottom: .5rem;
}
.arzt-info-title {
  font-size: .75rem; text-transform: uppercase;
  letter-spacing: .16em; color: var(--sage); margin-bottom: 2rem;
  font-weight: 500;
}
.arzt-info-text {
  font-size: .95rem; color: var(--text-soft);
  line-height: 1.8; font-weight: 300; margin-bottom: 2rem;
}
.arzt-qualifications {
  display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 2rem;
}
.qual-tag {
  padding: .3rem .85rem; background: var(--cream-warm);
  border: 1px solid var(--cream-mid); border-radius: 2rem;
  font-size: .72rem; color: var(--text-mid);
  font-weight: 400; letter-spacing: .02em;
}

/* Timeline */
.timeline { display: flex; flex-direction: column; gap: .85rem; margin-bottom: 2rem; }
.tl-item { display: flex; gap: 1rem; }
.tl-year {
  font-size: .72rem; font-weight: 600; color: var(--sage);
  min-width: 5.5rem; padding-top: .05rem; letter-spacing: .03em;
  flex-shrink: 0;
}
.tl-text {
  font-size: .82rem; color: var(--text-mid); line-height: 1.55;
}

/* ══════════════════════════════════════
   PHILOSOPHIE / ÜBER DIE PRAXIS
══════════════════════════════════════ */
.philosophy-bg { background: var(--forest); }
.philosophy-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 5rem;
  align-items: center; max-width: 1200px; margin: 0 auto;
}
@media (max-width: 860px) { .philosophy-grid { grid-template-columns: 1fr; gap: 2.5rem; } }
.phil-heading {
  font-family: var(--font-display);
  font-size: clamp(2rem,4.5vw,3.5rem);
  font-weight: 300; color: var(--cream);
  line-height: 1.1; letter-spacing: -0.02em;
}
.phil-heading em { font-style: italic; color: var(--sage-light); }
.phil-text {
  font-size: .92rem; color: rgba(244,239,230,.7);
  line-height: 1.85; font-weight: 300; margin-top: 1.5rem;
}
.phil-pillars {
  display: flex; flex-direction: column; gap: 1.25rem;
}
.phil-pillar {
  display: flex; gap: 1.25rem; align-items: flex-start;
  padding: 1.25rem; border-radius: var(--radius-md);
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.07);
  transition: background .25s;
}
.phil-pillar:hover { background: rgba(255,255,255,0.09); }
.phil-pillar-num {
  font-family: var(--font-display); font-size: 1.4rem;
  font-weight: 300; color: var(--gold); opacity: .7;
  flex-shrink: 0; line-height: 1;
}
.phil-pillar-name {
  font-family: var(--font-display); font-size: 1.1rem;
  color: var(--cream); font-weight: 400; margin-bottom: .25rem;
}
.phil-pillar-desc { font-size: .78rem; color: var(--sage-light); line-height: 1.6; opacity: .85; }

/* ══════════════════════════════════════
   QUOTES STRIP
══════════════════════════════════════ */
.quotes-strip {
  background: var(--cream-warm);
  border-top: 1px solid var(--cream-mid);
  border-bottom: 1px solid var(--cream-mid);
  padding: clamp(3rem,5vw,5rem) clamp(1.5rem,5vw,5rem);
  display: grid; grid-template-columns: repeat(3,1fr); gap: 2.5rem;
}
@media (max-width: 700px) { .quotes-strip { grid-template-columns: 1fr; } }
.quote-card {
  padding-left: 1.5rem;
  border-left: 2px solid var(--gold);
}
.quote-text {
  font-family: var(--font-display); font-style: italic;
  font-size: 1.05rem; color: var(--forest-mid);
  line-height: 1.6; margin-bottom: .75rem;
}
.quote-attr {
  font-size: .62rem; text-transform: uppercase;
  letter-spacing: .14em; color: var(--text-soft);
}

/* ══════════════════════════════════════
   CTA BANNER
══════════════════════════════════════ */
.cta-banner {
  background: linear-gradient(135deg, var(--forest) 0%, var(--forest-mid) 100%);
  padding: clamp(3rem,5vw,5rem) clamp(1.5rem,5vw,5rem);
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: 2rem;
}
.cta-banner-max { max-width: 1200px; margin: 0 auto; width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 2rem; }
.cta-title {
  font-family: var(--font-display);
  font-size: clamp(1.6rem,3.5vw,2.4rem);
  font-weight: 300; color: var(--cream);
  max-width: 28rem; line-height: 1.25;
}
.cta-title em { font-style: italic; color: var(--sage-light); }
.cta-actions { display: flex; gap: 1rem; flex-wrap: wrap; align-items: center; }
.cta-phone {
  display: flex; align-items: center; gap: .5rem;
  color: var(--cream); font-size: .85rem; font-weight: 300;
  letter-spacing: .03em;
}
.cta-phone svg { width: 16px; height: 16px; stroke: var(--sage-light); fill: none; stroke-width: 1.5; flex-shrink: 0; }

/* ══════════════════════════════════════
   FOOTER
══════════════════════════════════════ */
footer {
  background: var(--forest);
  border-top: 1px solid rgba(255,255,255,0.05);
  padding: clamp(3rem,5vw,5rem) clamp(1.5rem,5vw,5rem);
}
.footer-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; flex-wrap: wrap; gap: 3rem;
  justify-content: space-between;
}
.footer-brand { max-width: 22rem; }
.footer-logo-img { width: 80px; height: 80px; object-fit: contain; background: transparent !important; padding: 0; margin-bottom: 1rem; }
.footer-brand-name {
  font-family: var(--font-display);
  font-size: 1.15rem; color: var(--cream); margin-bottom: .5rem;
  font-weight: 400;
}
.footer-brand-desc {
  font-size: .78rem; color: rgba(244,239,230,.5);
  line-height: 1.75; font-weight: 300;
}
.footer-cols { display: flex; gap: 4rem; flex-wrap: wrap; }
.footer-col { display: flex; flex-direction: column; gap: .6rem; }
.footer-col-title {
  font-size: .62rem; text-transform: uppercase;
  letter-spacing: .18em; color: var(--gold);
  font-weight: 500; margin-bottom: .25rem;
}
.footer-col a, .footer-col address {
  font-size: .8rem; color: rgba(244,239,230,.55);
  font-style: normal; line-height: 1.65;
  transition: color .2s;
}
.footer-col a:hover { color: var(--cream); }
.footer-bottom {
  max-width: 1200px; margin: 3rem auto 0;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255,255,255,0.07);
  display: flex; flex-wrap: wrap; gap: 1rem;
  justify-content: space-between; align-items: center;
}
.footer-copy { font-size: .7rem; color: rgba(244,239,230,.3); letter-spacing: .04em; }
.footer-goa {
  font-size: .7rem; color: rgba(244,239,230,.3);
  letter-spacing: .02em; max-width: 36rem; line-height: 1.6;
}

/* ══════════════════════════════════════
   ANIMATIONS
══════════════════════════════════════ */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0); }
}
.fu { opacity: 0; animation: fadeUp .75s ease forwards; }
.d1 { animation-delay: .1s; }
.d2 { animation-delay: .22s; }
.d3 { animation-delay: .34s; }
.d4 { animation-delay: .46s; }
.d5 { animation-delay: .58s; }
.d6 { animation-delay: .7s; }

.reveal {
  opacity: 0; transform: translateY(28px);
  transition: opacity .65s ease, transform .65s ease;
}
.reveal.visible { opacity: 1; transform: translateY(0); }

/* ══════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════ */
@media (max-width: 820px) {
  .nav-links, .nav-cta { display: none; }
  .nav-burger { display: flex; }
}
@media (max-width: 560px) {
  .hero-trust { gap: 1.25rem; }
}

/* ══ LEISTUNGEN — TAB SYSTEM ══ */
.leist-tabs {
  display: flex; gap: .5rem; margin-bottom: 2rem; flex-wrap: wrap;
}
.leist-tab {
  display: flex; align-items: center; gap: .6rem;
  padding: .65rem 1.25rem;
  background: white; border: 1.5px solid var(--cream-mid);
  border-radius: 2rem; cursor: pointer;
  font-family: var(--font-body); font-size: .8rem;
  color: var(--text-soft); font-weight: 400;
  transition: all .25s; white-space: nowrap;
}
.leist-tab:hover {
  border-color: var(--forest); color: var(--forest);
  background: var(--green-pale);
}
.leist-tab.active {
  background: var(--forest); border-color: var(--forest);
  color: white; font-weight: 500;
}
.leist-tab-icon { width: 18px; height: 18px; flex-shrink: 0; display: flex; align-items: center; }
.leist-tab-icon svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; }

/* Panels */
.leist-panel { display: none; }
.leist-panel.active { display: block; }
.leist-panel-inner {
  background: white; border-radius: var(--radius-md);
  overflow: hidden; box-shadow: var(--shadow-med);
  border: 1px solid var(--cream-mid);
}

/* Panel header — two variants: forest (nature) and navy-forest gradient (science) */
.leist-panel-header {
  display: flex; align-items: flex-start; gap: 2rem; padding: 2.5rem;
}
.header-forest {
  background: linear-gradient(110deg, var(--forest) 0%, var(--forest-mid) 65%, var(--sage) 100%);
}
.header-science {
  background: linear-gradient(110deg, #1C2B1E 0%, #2D4A33 55%, #4A7052 100%);
}
@media (max-width:600px) { .leist-panel-header { flex-direction: column; gap: 1rem; } }

.leist-panel-icon {
  width: 56px; height: 56px; border-radius: 14px;
  background: rgba(255,255,255,.12);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.leist-panel-icon svg { width: 26px; height: 26px; stroke: rgba(255,255,255,.85); fill: none; stroke-width: 1.5; stroke-linecap: round; }

.leist-panel-eyebrow {
  font-size: .6rem; text-transform: uppercase; letter-spacing: .22em;
  color: rgba(255,255,255,.5); margin-bottom: .4rem; font-weight: 500;
}
.leist-panel-title {
  font-family: var(--font-display); font-size: clamp(1.5rem,3vw,2.2rem);
  font-weight: 300; color: white; line-height: 1.15; margin-bottom: .4rem;
}
.leist-panel-sub {
  font-size: .88rem; color: rgba(255,255,255,.65); font-weight: 300;
  line-height: 1.55; max-width: 32rem;
}

/* Panel body: desc col + items col */
.leist-panel-body {
  display: grid; grid-template-columns: 1fr 1.5fr;
}
@media (max-width:760px) { .leist-panel-body { grid-template-columns: 1fr; } }

.leist-desc-col {
  padding: 2.5rem;
  border-right: 1px solid var(--cream-mid);
  background: var(--cream-warm);
}
@media (max-width:760px) { .leist-desc-col { border-right: none; border-bottom: 1px solid var(--cream-mid); } }

.leist-body-text {
  font-size: .88rem; color: var(--text-soft); line-height: 1.8;
  font-weight: 300; margin-bottom: 1rem;
}
.leist-body-text em { color: var(--forest-mid); font-style: italic; }
.leist-cta-link {
  display: inline-flex; align-items: center; margin-top: 1.25rem;
  padding: .65rem 1.4rem; background: var(--forest);
  color: white; border-radius: 2rem; font-size: .78rem;
  font-weight: 500; letter-spacing: .04em; text-decoration: none;
  transition: background .2s, transform .15s; border: none; cursor: pointer;
}
.leist-cta-link:hover { background: var(--forest-mid); transform: translateY(-1px); }

.leist-items-col { padding: 2.5rem; }
.leist-item-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
}
@media (max-width:1000px) { .leist-item-grid { grid-template-columns: 1fr; } }

.leist-item {
  display: flex; align-items: flex-start; gap: .75rem;
  padding: .85rem 1rem; border-radius: 8px;
  background: var(--cream-warm); border: 1px solid transparent;
  transition: border-color .2s, background .2s;
}
.leist-item:hover { border-color: var(--cream-mid); background: white; }
.leist-item-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--sage); flex-shrink: 0; margin-top: .38rem;
}
.leist-item strong {
  display: block; font-size: .82rem; font-weight: 600;
  color: var(--text-dark); margin-bottom: .18rem; line-height: 1.3;
}
.leist-item span {
  display: block; font-size: .74rem; color: var(--text-soft);
  line-height: 1.5; font-weight: 300;
}


/* ══ LEISTUNGEN TAB SYSTEM ══ */
.leist-tabs {
  display: flex; gap: .5rem; margin-bottom: 2rem; flex-wrap: wrap;
}
.leist-tab {
  display: flex; align-items: center; gap: .6rem;
  padding: .65rem 1.25rem;
  background: white; border: 1.5px solid var(--outline-variant);
  border-radius: 2rem; cursor: pointer;
  font-family: var(--font-body); font-size: .8rem;
  color: var(--text-soft); font-weight: 400;
  transition: all .25s; white-space: nowrap;
}
.leist-tab:hover { border-color: var(--forest); color: var(--forest); background: rgba(28,51,32,.05); }
.leist-tab.active { background: var(--forest); border-color: var(--forest); color: white; font-weight: 500; box-shadow: 0 4px 14px rgba(28,43,30,.2); }
.leist-tab-icon { width: 17px; height: 17px; flex-shrink: 0; display: flex; align-items: center; }
.leist-tab-icon svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.leist-panel { display: none; animation: panelIn .3s ease; }
.leist-panel.active { display: block; }
@keyframes panelIn { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
.leist-panel-card { background: white; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-deep); border: 1px solid var(--outline-variant); }
.leist-panel-header { display: flex; align-items: flex-start; gap: 2rem; padding: 2.5rem; }
.leist-header-dark { background: linear-gradient(120deg, var(--forest) 0%, var(--forest-mid) 60%, #4a7052 100%); }
.leist-header-mid { background: linear-gradient(120deg, #2a4a2e 0%, var(--forest-mid) 55%, var(--sage) 100%); }
@media (max-width:600px) { .leist-panel-header { flex-direction:column; gap:1rem; } }
.leist-hdr-icon { width:58px; height:58px; border-radius:14px; flex-shrink:0; background:rgba(255,255,255,.13); display:flex; align-items:center; justify-content:center; }
.leist-hdr-icon svg { width:26px; height:26px; stroke:rgba(255,255,255,.88); fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.leist-hdr-eyebrow { font-size:.58rem; text-transform:uppercase; letter-spacing:.22em; color:rgba(255,255,255,.5); margin-bottom:.4rem; font-weight:500; }
.leist-hdr-title { font-family:var(--font-display); font-size:clamp(1.5rem,3vw,2.2rem); font-weight:300; color:white; line-height:1.15; margin-bottom:.4rem; }
.leist-hdr-sub { font-size:.88rem; color:rgba(255,255,255,.62); font-weight:300; line-height:1.55; max-width:34rem; }
.leist-panel-body { display:grid; grid-template-columns:1fr 1.6fr; }
@media (max-width:780px) { .leist-panel-body { grid-template-columns:1fr; } }
.leist-text-col { padding:2.5rem; background:var(--surface-container-low); border-right:1px solid var(--outline-variant); display:flex; flex-direction:column; }
@media (max-width:780px) { .leist-text-col { border-right:none; border-bottom:1px solid var(--outline-variant); } }
.leist-body-p { font-size:.88rem; color:var(--on-surface-variant); line-height:1.8; font-weight:300; margin-bottom:1rem; }
.leist-body-p em { color:var(--forest); font-style:italic; font-weight:400; }
.leist-cta { display:inline-flex; align-items:center; gap:.45rem; margin-top:1.5rem; padding:.65rem 1.4rem; background:var(--forest); color:white; border-radius:2rem; font-size:.78rem; font-weight:500; letter-spacing:.04em; text-decoration:none; transition:background .2s,transform .15s; border:none; cursor:pointer; align-self:flex-start; }
.leist-cta:hover { background:var(--forest-mid); transform:translateY(-1px); }
.leist-cta svg { width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2; flex-shrink:0; }
.leist-items-col { padding:2.5rem; }
.leist-items-grid { display:grid; grid-template-columns:1fr 1fr; gap:.85rem; }
@media (max-width:1050px) { .leist-items-grid { grid-template-columns:1fr; } }
.leist-item { display:flex; align-items:flex-start; gap:.8rem; padding:.9rem 1rem; border-radius:10px; background:var(--surface-container-low); border:1px solid transparent; transition:border-color .2s,background .2s,box-shadow .2s; }
.leist-item:hover { border-color:var(--outline-variant); background:white; box-shadow:0 2px 8px rgba(28,43,30,.06); }
.leist-dot { width:7px; height:7px; border-radius:50%; background:var(--sage); flex-shrink:0; margin-top:.38rem; }
.leist-item-name { display:block; font-size:.82rem; font-weight:600; color:var(--on-surface); margin-bottom:.18rem; line-height:1.3; }
.leist-item-desc { display:block; font-size:.74rem; color:var(--on-surface-variant); line-height:1.5; font-weight:300; }


/* ══ INDIKATIONEN ══ */
.indik-section {
  padding: 3rem 0 4rem;
}
.indik-intro {
  font-size: .92rem; color: var(--on-surface-variant);
  line-height: 1.75; font-weight: 300; max-width: 44rem; margin-bottom: 2.5rem;
  font-style: italic;
}
.indik-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
@media (max-width: 900px) { .indik-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 560px) { .indik-grid { grid-template-columns: 1fr; } }

.indik-card {
  background: white; border-radius: 12px;
  border: 1px solid var(--outline-variant);
  padding: 1.5rem;
  display: flex; flex-direction: column; gap: .75rem;
  transition: box-shadow .3s, transform .3s, border-color .3s;
  cursor: default;
}
.indik-card:hover {
  box-shadow: var(--shadow-med);
  transform: translateY(-4px);
  border-color: var(--sage-light);
}
.indik-icon-wrap {
  width: 44px; height: 44px; border-radius: 10px;
  background: var(--surface-container-low);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.indik-icon-wrap svg {
  width: 22px; height: 22px; stroke: var(--sage);
  fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
}
.indik-name {
  font-family: var(--font-display);
  font-size: 1.1rem; font-weight: 400; color: var(--forest);
  line-height: 1.2;
}
.indik-desc {
  font-size: .78rem; color: var(--on-surface-variant);
  line-height: 1.6; font-weight: 300; flex: 1;
}
.indik-treatments {
  display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .25rem;
}
.indik-pill {
  font-size: .62rem; padding: .18rem .6rem;
  background: var(--surface-container-low);
  color: var(--secondary);
  border-radius: 2rem; border: 1px solid var(--outline-variant);
  font-weight: 500; letter-spacing: .02em;
}


/* ══ HOME SECTIONS ══ */
.home-section {
  padding: clamp(4rem,7vw,6rem) clamp(1.5rem,5vw,5rem);
}
.home-section-inner { max-width: 1200px; margin: 0 auto; }
.home-section-header { margin-bottom: 3rem; }
.home-section-header .section-sub { margin-bottom: 0; }

/* ── THEMEN GRID ── */
.themen-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
@media (max-width: 860px) { .themen-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 500px) { .themen-grid { grid-template-columns: 1fr; } }

.thema-card {
  display: flex; align-items: center; gap: 1rem;
  padding: 1.25rem 1.5rem;
  background: white; border-radius: 12px;
  border: 1px solid var(--outline-variant);
  text-decoration: none; color: var(--text-dark);
  transition: box-shadow .25s, transform .25s, border-color .25s, background .25s;
  cursor: pointer;
}
.thema-card:hover {
  box-shadow: var(--shadow-med);
  transform: translateY(-3px);
  border-color: var(--sage-light);
  background: var(--surface-container-low);
}
.thema-icon {
  width: 42px; height: 42px; border-radius: 10px; flex-shrink: 0;
  background: var(--surface-container-low);
  display: flex; align-items: center; justify-content: center;
  transition: background .25s;
}
.thema-card:hover .thema-icon { background: var(--secondary-container); }
.thema-icon svg {
  width: 20px; height: 20px; stroke: var(--sage);
  fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
}
.thema-name {
  font-family: var(--font-display); font-size: 1.05rem; font-weight: 400;
  color: var(--forest); flex: 1; line-height: 1.25;
}
.thema-arrow {
  font-size: .9rem; color: var(--sage-light);
  opacity: 0; transition: opacity .2s, transform .2s;
  transform: translateX(-4px);
}
.thema-card:hover .thema-arrow { opacity: 1; transform: translateX(0); }

/* ── MEDIZIN SECTION ── */
.medizin-section {
  background: linear-gradient(120deg, var(--forest) 0%, var(--forest-mid) 55%, #3a5a3e 100%);
}
.medizin-section .home-section-header .section-tag::before { background: var(--gold); }
.medizin-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start;
}
@media (max-width:860px) { .medizin-grid { grid-template-columns: 1fr; } }

.medizin-card {
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1);
  border-radius: 16px; padding: 2.5rem;
}
.medizin-card-label {
  font-size: .6rem; text-transform: uppercase; letter-spacing: .2em;
  color: var(--gold); margin-bottom: .5rem; font-weight: 500;
}
.medizin-card-title {
  font-family: var(--font-display); font-size: 1.5rem; font-weight: 300;
  color: var(--cream); margin-bottom: 1rem; line-height: 1.2;
}
.medizin-card-text {
  font-size: .88rem; color: rgba(244,239,230,.65);
  line-height: 1.8; font-weight: 300; margin-bottom: 1.5rem;
}
.medizin-list {
  list-style: none; display: flex; flex-direction: column; gap: .55rem;
  margin-bottom: 2rem;
}
.medizin-list li {
  display: flex; align-items: center; gap: .65rem;
  font-size: .82rem; color: rgba(244,239,230,.75);
}
.medizin-list li::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%;
  background: var(--sage-light); flex-shrink: 0;
}
.medizin-link {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .8rem; font-weight: 500; color: var(--gold);
  text-decoration: none; transition: gap .2s;
}
.medizin-link:hover { gap: .7rem; }

.medizin-pillars { display: flex; flex-direction: column; gap: 1px; }
.medizin-pillar {
  display: flex; gap: 1.5rem; align-items: flex-start;
  padding: 1.25rem 1.5rem;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px; margin-bottom: .6rem;
  transition: background .2s;
}
.medizin-pillar:hover { background: rgba(255,255,255,.09); }
.mp-num {
  font-family: var(--font-display); font-size: 1.35rem; font-weight: 300;
  color: var(--gold); opacity: .65; flex-shrink: 0; line-height: 1;
}
.mp-name {
  font-family: var(--font-display); font-size: 1rem; color: var(--cream);
  font-weight: 400; margin-bottom: .2rem;
}
.mp-desc { font-size: .75rem; color: var(--sage-light); line-height: 1.55; opacity: .85; }

/* ── ANGEBOTE ── */
.angebote-grid {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem;
}
@media (max-width:900px) { .angebote-grid { grid-template-columns: 1fr; } }

.angebot-card {
  background: white; border-radius: 14px; border: 1px solid var(--outline-variant);
  padding: 2rem; display: flex; flex-direction: column;
  transition: box-shadow .35s, transform .35s;
}
.angebot-card:hover { box-shadow: var(--shadow-deep); transform: translateY(-5px); }
.angebot-card.angebot-featured {
  border: 2px solid var(--forest);
  box-shadow: 0 0 0 4px rgba(28,51,32,.08), var(--shadow-soft);
}
.angebot-label {
  font-size: .58rem; text-transform: uppercase; letter-spacing: .2em;
  color: var(--sage); font-weight: 600; margin-bottom: .6rem;
}
.angebot-featured .angebot-label { color: var(--forest); }
.angebot-title {
  font-family: var(--font-display); font-size: 1.5rem; font-weight: 300;
  color: var(--forest); margin-bottom: .35rem; line-height: 1.15;
}
.angebot-sub {
  font-size: .78rem; color: var(--text-soft); margin-bottom: 1rem;
  font-style: italic;
}
.angebot-desc {
  font-size: .82rem; color: var(--text-soft); line-height: 1.7;
  font-weight: 300; margin-bottom: 1.25rem;
}
.angebot-list {
  list-style: none; flex: 1; display: flex; flex-direction: column;
  gap: .5rem; margin-bottom: 1.75rem;
}
.angebot-list li {
  display: flex; align-items: flex-start; gap: .55rem;
  font-size: .8rem; color: var(--text-mid); line-height: 1.45;
}
.angebot-list li::before {
  content: '✓'; color: var(--sage); font-size: .68rem;
  font-weight: 700; flex-shrink: 0; margin-top: .1rem;
}
.angebot-footer {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 1.25rem; border-top: 1px solid var(--outline-variant);
  gap: 1rem;
}
.angebot-price {
  font-family: var(--font-display); font-size: 1.4rem; font-weight: 400;
  color: var(--forest);
}
.angebot-btn {
  padding: .6rem 1.35rem; border-radius: 2rem;
  border: 1.5px solid var(--forest); color: var(--forest);
  font-size: .78rem; font-weight: 500; text-decoration: none;
  transition: background .2s, color .2s; white-space: nowrap;
}
.angebot-btn:hover { background: var(--forest); color: white; }
.angebot-btn-gold {
  background: var(--gold); border-color: var(--gold); color: var(--forest);
}
.angebot-btn-gold:hover { background: var(--gold-light); border-color: var(--gold-light); color: var(--forest); }


/* ══ THEMEN GRID — ZFM-Stil ══ */
.themen-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}
@media (max-width: 900px) { .themen-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 500px)  { .themen-grid { grid-template-columns: 1fr; } }

.thema-card {
  position: relative;
  display: block;
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  aspect-ratio: 1 / 1;          /* quadratisch — alle exakt gleich groß */
  background: var(--forest);
  transition: box-shadow .35s, transform .35s;
  cursor: pointer;
}
.thema-card:hover {
  box-shadow: 0 16px 48px rgba(28,43,30,.22);
  transform: translateY(-5px);
}

/* Bild füllt die ganze Karte */
.thema-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .55s ease;
}
.thema-card:hover .thema-img { transform: scale(1.07); }

/* Gradient-Overlay: unten dunkel für Lesbarkeit des Titels */
.thema-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(28,43,30,.05) 0%,
    rgba(28,43,30,.15) 40%,
    rgba(28,43,30,.72) 80%,
    rgba(15,25,16,.88) 100%
  );
  transition: background .35s;
}
.thema-card:hover .thema-overlay {
  background: linear-gradient(
    to bottom,
    rgba(28,43,30,.1) 0%,
    rgba(28,43,30,.2) 40%,
    rgba(28,43,30,.78) 80%,
    rgba(15,25,16,.92) 100%
  );
}

/* Titel unten links */
.thema-label {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 1.25rem 1.25rem 1.1rem;
  z-index: 2;
}
.thema-name {
  display: block;
  font-family: var(--font-display);
  font-size: clamp(1rem, 1.6vw, 1.25rem);
  font-weight: 400;
  color: white;
  line-height: 1.25;
  letter-spacing: -0.01em;
}
/* Kleines Pfeil-Icon erscheint beim Hover */
.thema-arrow {
  display: inline-block;
  margin-top: .3rem;
  font-size: .72rem;
  color: var(--sage-light);
  opacity: 0;
  transform: translateX(-5px);
  transition: opacity .25s, transform .25s;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-family: var(--font-body);
  font-weight: 500;
}
.thema-card:hover .thema-arrow {
  opacity: 1;
  transform: translateX(0);
}


/* ══ THEMA SUBPAGES ══ */
.thema-page { display: none; }
.thema-page.active { display: block; }

/* Hero banner */
.tp-hero {
  position: relative;
  height: clamp(260px, 35vw, 420px);
  overflow: hidden;
  background: var(--forest);
}
.tp-hero-img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 40%;
  opacity: .55;
}
.tp-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(28,43,30,.3) 0%, rgba(28,43,30,.7) 100%);
}
.tp-hero-wrap {
  min-height: 280px;
  background: linear-gradient(120deg, var(--forest) 0%, var(--forest-mid) 60%, #3a5a3e 100%);
  position: relative;
  display: flex;
  align-items: flex-end;
}
.tp-hero-content {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: clamp(1.5rem,4vw,3rem) clamp(1.5rem,5vw,5rem);
  background: linear-gradient(to top, rgba(10,20,12,.65) 0%, transparent 100%);
  width: 100%;
  box-sizing: border-box;
}
.tp-hero-eyebrow {
  font-size: .6rem; text-transform: uppercase; letter-spacing: .22em;
  color: var(--gold); font-weight: 600; margin-bottom: .5rem;
  display: flex; align-items: center; gap: .5rem;
}
.tp-hero-eyebrow::before { content:''; display:block; width:16px; height:1px; background:var(--gold); }
.tp-title { 
  font-family: var(--font-display); font-size: clamp(2rem,4vw,3.5rem);
  font-weight: 300; color: var(--cream); line-height: 1.05;
  letter-spacing: -.02em; margin-bottom: .5rem;
}
.tp-subtitle {
  font-size: .95rem; color: rgba(244,239,230,.75); font-weight: 300;
  font-style: italic;
}
.tp-eyebrow {
  font-size: .6rem; text-transform: uppercase; letter-spacing: .22em;
  color: var(--sage-light); font-weight: 500; margin-bottom: .5rem;
  display: flex; align-items: center; gap: .5rem;
}
.tp-eyebrow::before { content: ''; display: block; width: 16px; height: 1px; background: var(--sage-light); }
.tp-title {
  font-family: var(--font-display);
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 300; color: white; line-height: 1.1;
  letter-spacing: -.02em; margin-bottom: .6rem;
}
.tp-subtitle {
  font-size: clamp(.9rem, 1.5vw, 1.1rem);
  color: rgba(255,255,255,.7);
  font-style: italic; font-weight: 300;
  max-width: 36rem;
}

/* Back link */
.tp-back {
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: .78rem; color: var(--sage); text-decoration: none;
  padding: 1rem clamp(1.5rem,5vw,5rem);
  max-width: 1200px; margin: 0 auto; display: flex;
  transition: gap .2s;
}
.tp-back:hover { gap: .75rem; }
.tp-back svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2; flex-shrink: 0; }

/* Body */
.tp-body { max-width: 1200px; margin: 0 auto; padding: 0 clamp(1.5rem,5vw,5rem) clamp(3rem,5vw,5rem); }

/* Intro */
.tp-intro {
  font-size: clamp(1rem, 1.8vw, 1.2rem);
  color: var(--on-surface-variant); line-height: 1.8;
  font-weight: 300; font-style: italic;
  padding: 2rem 0; border-bottom: 1px solid var(--outline-variant);
  max-width: 54rem;
}

/* Section label */
.tp-section-label {
  font-size: .6rem; text-transform: uppercase; letter-spacing: .22em;
  color: var(--gold); font-weight: 600;
  display: flex; align-items: center; gap: .5rem; margin-bottom: .6rem;
}
.tp-section-label::before { content:''; display:block; width:18px; height:1px; background:var(--gold); }
.tp-section-title {
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 300; color: var(--forest); line-height: 1.2;
  margin-bottom: 2rem; letter-spacing: -.02em;
}

/* Symptome grid */
.tp-section { margin-top: 3rem; }
.tp-symptome-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem;
}
@media (max-width: 680px) { .tp-symptome-grid { grid-template-columns: 1fr; } }
.tp-symptom-card {
  background: var(--surface-container-low);
  border-radius: 10px; padding: 1.5rem;
  border: 1px solid var(--outline-variant);
  transition: box-shadow .25s, border-color .25s;
}
.tp-symptom-card:hover { box-shadow: var(--shadow-soft); border-color: var(--sage-light); }
.tp-symptom-title {
  font-family: var(--font-display); font-size: 1.1rem;
  color: var(--forest); margin-bottom: .5rem; font-weight: 400;
}
.tp-symptom-text { font-size: .83rem; color: var(--on-surface-variant); line-height: 1.7; }

/* Ansatz */
.tp-ansatz-block {
  background: var(--forest); border-radius: 14px;
  padding: 2.5rem; color: white; margin-top: 1.5rem;
}
.tp-ansatz-text {
  font-size: .95rem; line-height: 1.85;
  color: rgba(244,239,230,.8); font-weight: 300;
}
.tp-ansatz-text strong { color: var(--sage-light); font-weight: 600; }

/* Behandlungen */
.tp-behandlungen-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem;
  margin-top: 1.5rem;
}
@media (max-width: 760px) { .tp-behandlungen-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .tp-behandlungen-grid { grid-template-columns: 1fr; } }
.tp-behandlung {
  display: flex; align-items: center; gap: .75rem;
  background: white; border-radius: 8px; padding: 1rem 1.1rem;
  border: 1px solid var(--outline-variant);
  font-size: .83rem; color: var(--text-mid); font-weight: 400;
  transition: border-color .2s, box-shadow .2s;
}
.tp-behandlung:hover { border-color: var(--sage-light); box-shadow: var(--shadow-soft); }
.tp-behandlung::before {
  content: ''; width: 8px; height: 8px; border-radius: 50%;
  background: var(--sage); flex-shrink: 0;
}

/* Ablauf */
.tp-ablauf-steps {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem;
  margin-top: 1.5rem;
}
@media (max-width: 760px) { .tp-ablauf-steps { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .tp-ablauf-steps { grid-template-columns: 1fr; } }
.tp-step {
  text-align: center; padding: 2rem 1.25rem;
  background: var(--surface-container-low); border-radius: 12px;
  border: 1px solid var(--outline-variant);
}
.tp-step-num {
  font-family: var(--font-display); font-size: 2.5rem; font-weight: 300;
  color: var(--sage-light); line-height: 1; margin-bottom: .6rem;
}
.tp-step-name {
  font-family: var(--font-display); font-size: 1.05rem;
  color: var(--forest); font-weight: 400; margin-bottom: .4rem;
}
.tp-step-desc { font-size: .75rem; color: var(--on-surface-variant); line-height: 1.55; }

/* CTA at bottom of subpage */
.tp-cta {
  background: linear-gradient(120deg, var(--forest) 0%, var(--forest-mid) 55%, var(--sage) 100%);
  border-radius: 14px; padding: 2.5rem 2rem;
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: 1.5rem; margin-top: 3rem;
}
.tp-cta-title {
  font-family: var(--font-display);
  font-size: clamp(1.4rem, 3vw, 2rem);
  font-weight: 300; color: white; line-height: 1.2;
}
.tp-cta-title em { font-style: italic; color: var(--sage-light); }
.tp-cta-actions { display: flex; gap: 1rem; flex-wrap: wrap; align-items: center; }
.tp-cta-btn {
  padding: .75rem 1.75rem; background: white; color: var(--forest);
  border-radius: 2rem; font-size: .85rem; font-weight: 600;
  text-decoration: none; transition: background .2s;
}
.tp-cta-btn:hover { background: var(--cream-warm); }
.tp-cta-phone { color: rgba(255,255,255,.75); font-size: .85rem; }


/* ══ HOME THERAPIEKONZEPT TABS ══ */
.hlt-tabs { display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:2rem; }
.hlt-tab {
  display:flex; align-items:center; gap:.5rem;
  padding:.58rem 1.1rem;
  background:rgba(255,255,255,.1); border:1.5px solid rgba(255,255,255,.2);
  border-radius:2rem; cursor:pointer;
  font-family:var(--font-body); font-size:.76rem;
  color:rgba(244,239,230,.75); font-weight:400;
  transition:all .22s;
}
.hlt-tab:hover  { background:rgba(255,255,255,.18); color:white; border-color:rgba(255,255,255,.4); }
.hlt-tab.active { background:white; border-color:white; color:var(--forest); font-weight:600; }
.hlt-tab svg    { width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.5; stroke-linecap:round; flex-shrink:0; }
.hlt-panel { display:none; animation:panelIn .28s ease; }
.hlt-panel.active { display:block; }
.hlt-card { background:white; border-radius:14px; overflow:hidden; box-shadow:0 8px 40px rgba(28,43,30,.15); }
.hlt-card-header {
  display:flex; align-items:flex-start; gap:1.75rem; padding:2.25rem 2.5rem;
  background:linear-gradient(120deg,var(--forest) 0%,var(--forest-mid) 60%,#4a7052 100%);
}
@media(max-width:560px){.hlt-card-header{flex-direction:column;gap:1rem;}}
.hlt-card-icon { width:52px; height:52px; border-radius:12px; flex-shrink:0; background:rgba(255,255,255,.13); display:flex; align-items:center; justify-content:center; }
.hlt-card-icon svg { width:23px; height:23px; stroke:rgba(255,255,255,.88); fill:none; stroke-width:1.5; stroke-linecap:round; }
.hlt-eyebrow { font-size:.57rem; text-transform:uppercase; letter-spacing:.22em; color:rgba(255,255,255,.5); margin-bottom:.3rem; }
.hlt-title   { font-family:var(--font-display); font-size:clamp(1.4rem,2.5vw,2rem); font-weight:300; color:white; line-height:1.15; margin-bottom:.3rem; }
.hlt-sub     { font-size:.83rem; color:rgba(255,255,255,.62); font-weight:300; line-height:1.5; }
.hlt-card-body { display:grid; grid-template-columns:1fr 1.6fr; }
@media(max-width:720px){.hlt-card-body{grid-template-columns:1fr;}}
.hlt-text-col { padding:2.25rem 2.5rem; background:var(--surface-container-low); border-right:1px solid var(--outline-variant); display:flex; flex-direction:column; }
@media(max-width:720px){.hlt-text-col{border-right:none;border-bottom:1px solid var(--outline-variant);}}
.hlt-body-p { font-size:.87rem; color:var(--on-surface-variant); line-height:1.8; font-weight:300; margin-bottom:.9rem; }
.hlt-cta { display:inline-flex; align-items:center; gap:.45rem; margin-top:1.25rem; padding:.6rem 1.3rem; background:var(--forest); color:white; border-radius:2rem; font-size:.76rem; font-weight:500; letter-spacing:.04em; text-decoration:none; transition:background .2s,transform .15s; align-self:flex-start; border:none; cursor:pointer; }
.hlt-cta:hover { background:var(--forest-mid); transform:translateY(-1px); }
.hlt-cta svg { width:13px; height:13px; stroke:white; fill:none; stroke-width:2; }
.hlt-items-col { padding:2.25rem 2.5rem; }
.hlt-items-grid { display:grid; grid-template-columns:1fr 1fr; gap:.82rem; }
@media(max-width:1000px){.hlt-items-grid{grid-template-columns:1fr;}}
.hlt-item { display:flex; align-items:flex-start; gap:.72rem; padding:.82rem 1rem; border-radius:9px; background:var(--surface-container-low); border:1px solid transparent; transition:border-color .2s,background .2s,box-shadow .2s; }
.hlt-item:hover { border-color:var(--outline-variant); background:white; box-shadow:0 2px 8px rgba(28,43,30,.06); }
.hlt-dot { width:7px; height:7px; border-radius:50%; background:var(--sage); flex-shrink:0; margin-top:.34rem; }
.hlt-item-name { display:block; font-size:.80rem; font-weight:600; color:var(--on-surface); margin-bottom:.15rem; line-height:1.3; }
.hlt-item-desc { display:block; font-size:.72rem; color:var(--on-surface-variant); line-height:1.5; font-weight:300; }


/* ══ LEISTUNGEN PAGE — NEW ══ */
.leist-page-hero {
  background: linear-gradient(120deg, var(--forest) 0%, var(--forest-mid) 55%, var(--sage) 100%);
  padding: clamp(3.5rem,6vw,5.5rem) clamp(1.5rem,5vw,5rem);
}
.leist-page-hero-inner { max-width: 1200px; margin: 0 auto; }

/* Sticky category nav */
.leist-cat-nav {
  position: sticky; top: var(--nav-h); z-index: 50;
  background: rgba(250,248,244,.95); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--outline-variant);
  padding: 0 clamp(1.5rem,5vw,5rem);
}
.leist-cat-nav-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; gap: 0; overflow-x: auto; scrollbar-width: none;
}
.leist-cat-nav-inner::-webkit-scrollbar { display: none; }
.leist-cat-btn {
  padding: 1rem 1.4rem; font-size: .78rem; font-weight: 500;
  color: var(--text-soft); white-space: nowrap; cursor: pointer;
  border: none; background: none; border-bottom: 2px solid transparent;
  transition: color .2s, border-color .2s; letter-spacing: .03em;
}
.leist-cat-btn:hover { color: var(--forest); }
.leist-cat-btn.active { color: var(--forest); border-bottom-color: var(--forest); }

/* Category sections */
.leist-category {
  max-width: 1200px; margin: 0 auto;
  padding: 3rem clamp(1.5rem,5vw,5rem);
  border-bottom: 1px solid var(--outline-variant);
}
.leist-cat-header {
  display: flex; align-items: baseline; gap: 1rem; margin-bottom: 2.5rem;
}
.leist-cat-num {
  font-size: .6rem; text-transform: uppercase; letter-spacing: .2em;
  color: var(--gold); font-weight: 600; white-space: nowrap;
}
.leist-cat-title {
  font-family: var(--font-display);
  font-size: clamp(1.5rem,3vw,2.2rem);
  font-weight: 300; color: var(--forest);
  letter-spacing: -.02em; line-height: 1;
}

/* Individual Leistung */
.leist-item-block {
  display: grid; grid-template-columns: 1fr 2fr; gap: 2rem;
  padding: 1.75rem 0; border-top: 1px solid var(--outline-variant);
  scroll-margin-top: calc(var(--nav-h) + 60px);
  transition: background .2s;
}
.leist-item-block:target { background: var(--surface-container-low); border-radius: 10px; padding: 1.75rem; margin: 0 -1.75rem; }
@media (max-width: 680px) { .leist-item-block { grid-template-columns: 1fr; gap: 1rem; } }

.leist-item-name-col {}
.leist-item-title {
  font-family: var(--font-display); font-size: 1.15rem;
  color: var(--forest); font-weight: 400; line-height: 1.25;
  margin-bottom: .3rem;
}
.leist-item-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  background: var(--sage); margin-right: .5rem; vertical-align: middle;
}
.leist-item-desc {
  font-size: .85rem; color: var(--on-surface-variant);
  line-height: 1.75; font-weight: 300;
}


/* ══ THEMA SUBPAGE SCROLL-NAV ══ */
.tp-scroll-nav {
  display: flex; gap: 0;
  justify-content: center;
  background: rgba(250,248,244,.96); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--outline-variant);
  position: sticky; top: var(--nav-h); z-index: 50;
  overflow-x: auto; scrollbar-width: none;
  padding: 0;
}
.tp-scroll-nav::-webkit-scrollbar { display: none; }
.tp-scroll-btn {
  padding: .9rem 1.5rem; font-size: .78rem; font-weight: 500;
  color: var(--text-soft); white-space: nowrap; cursor: pointer;
  border: none; background: none;
  border-bottom: 2px solid transparent;
  transition: color .2s, border-color .2s; letter-spacing: .04em;
  text-transform: uppercase;
}
.tp-scroll-btn:hover { color: var(--forest); }
.tp-scroll-btn.active { color: var(--forest); border-bottom-color: var(--forest); font-weight: 600; }

/* Angebote section on subpages */
.tp-angebote-section { margin-top: 3rem; }
.tp-angebote-grid {
  display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.25rem;
}
.tp-angebot-link {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .65rem 1.25rem;
  background: var(--surface-container-low);
  border: 1px solid var(--outline-variant);
  border-radius: 2rem; font-size: .82rem; color: var(--forest);
  text-decoration: none; font-weight: 500;
  transition: background .2s, border-color .2s, box-shadow .2s;
  cursor: pointer;
}
.tp-angebot-link:hover {
  background: white; border-color: var(--sage);
  box-shadow: 0 2px 8px rgba(28,43,30,.08);
}
.tp-angebot-link svg {
  width: 12px; height: 12px; stroke: var(--sage); fill: none; stroke-width: 2;
}

/* scroll-margin for anchored sections */
.tp-section[id] { scroll-margin-top: calc(var(--nav-h) + 55px); }


/* ══ ANGEBOTE — dark forest green like Therapiekonzept ══ */
#angebote { background: var(--cream) !important; }
.angebot-card {
  background: var(--forest) !important;
  border: 1px solid var(--forest-mid) !important;
  color: white !important;
}
.angebot-card.angebot-featured {
  background: linear-gradient(135deg, var(--forest) 0%, var(--forest-mid) 100%) !important;
  border: 2px solid var(--gold) !important;
  box-shadow: 0 0 0 4px var(--gold-pale) !important;
}
.angebot-label    { color: var(--sage-light) !important; }
.angebot-title    { color: var(--cream) !important; }
.angebot-sub      { color: rgba(244,239,230,.65) !important; }
.angebot-desc     { color: rgba(244,239,230,.75) !important; }
.angebot-list li  { color: rgba(244,239,230,.8) !important; }
.angebot-list li::before { color: var(--sage-light) !important; }
.angebot-price    { color: var(--cream) !important; }
.angebot-footer   { border-top-color: rgba(255,255,255,.12) !important; }
.angebot-btn {
  border-color: rgba(255,255,255,.35) !important;
  color: var(--cream) !important;
  background: transparent !important;
}
.angebot-btn:hover { background: rgba(255,255,255,.12) !important; color: white !important; }
.angebot-card.angebot-featured .angebot-btn,
.angebot-btn-gold {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: var(--forest) !important;
  font-weight: 700 !important;
}
.angebot-card.angebot-featured .angebot-btn:hover,
.angebot-btn-gold:hover { background: var(--gold-light) !important; }
#angebote p { color: var(--text-soft) !important; }


/* ══ LEISTUNGSSEITE V3 ══ */
.lp-anchor-bar {
  position: sticky; top: var(--nav-h); z-index: 80;
  background: var(--forest);
  display: flex; justify-content: center;
  border-bottom: 1px solid rgba(255,255,255,.1);
  overflow-x: auto; scrollbar-width: none;
}
.lp-anchor-bar::-webkit-scrollbar { display: none; }
.lp-anchor-btn {
  padding: 1rem 2.25rem; font-size: .78rem; font-weight: 600;
  color: rgba(244,239,230,.6); background: none; border: none;
  cursor: pointer; letter-spacing: .1em; text-transform: uppercase;
  border-bottom: 3px solid transparent;
  transition: color .2s, border-color .2s; white-space: nowrap;
}
.lp-anchor-btn:hover  { color: rgba(244,239,230,.9); }
.lp-anchor-btn.active { color: var(--gold); border-bottom-color: var(--gold); }

/* section anchors */
.lp-sec { scroll-margin-top: calc(var(--nav-h) + 52px); }

/* section banners */
.lp-banner {
  background: linear-gradient(120deg, var(--forest) 0%, var(--forest-mid) 55%, #3a5a3e 100%);
  padding: clamp(2.5rem,5vw,4rem) clamp(1.5rem,5vw,5rem);
}
.lp-banner-inner { max-width: 1200px; margin: 0 auto; }
.lp-banner-eyebrow {
  display: inline-flex; align-items: center; gap: .6rem;
  font-size: .6rem; text-transform: uppercase; letter-spacing: .22em;
  color: var(--gold); font-weight: 600; margin-bottom: .6rem;
}
.lp-banner-eyebrow::before { content:''; display:block; width:16px; height:1px; background:var(--gold); }
.lp-banner-h {
  font-family: var(--font-display);
  font-size: clamp(1.8rem,4vw,3rem); font-weight: 300;
  color: var(--cream); line-height: 1.1; letter-spacing: -.02em;
  margin-bottom: .6rem;
}
.lp-banner-h em { font-style: italic; color: var(--sage-light); }
.lp-banner-sub {
  font-size: .88rem; color: rgba(244,239,230,.6);
  max-width: 44rem; line-height: 1.75; font-weight: 300;
}

/* Therapiekonzept wrapper */
.lp-therapie-inner {
  max-width: 1200px; margin: 0 auto;
  padding: 0 clamp(1.5rem,5vw,5rem) clamp(2rem,4vw,3rem);
}

/* Leistungen grid */
.lp-leist-wrap { max-width: 1200px; margin: 0 auto; padding: 2.5rem clamp(1.5rem,5vw,5rem); }
/* old lp-cat rule removed */
/* old lp-cat-head rule removed */
.lp-cat-num { font-size: .58rem; text-transform: uppercase; letter-spacing: .2em; color: var(--gold); font-weight: 700; }
.lp-cat-title { font-family: var(--font-display); font-size: clamp(1.25rem,2.5vw,1.75rem); font-weight: 300; color: var(--forest); letter-spacing: -.01em; }

.lp-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: .9rem; }
@media(max-width:900px){ .lp-cards{grid-template-columns:repeat(2,1fr);} }
@media(max-width:560px){ .lp-cards{grid-template-columns:1fr;} }

.lp-card {
  background: white; border-radius: 10px;
  border: 1px solid var(--outline-variant);
  padding: 1.1rem 1.3rem;
  scroll-margin-top: calc(var(--nav-h) + 58px);
  transition: box-shadow .25s, border-color .25s, transform .2s;
}
.lp-card:hover { box-shadow: 0 5px 20px rgba(28,43,30,.09); border-color: var(--sage-light); transform: translateY(-2px); }
.lp-card:target { border-color: var(--sage); box-shadow: 0 0 0 3px rgba(107,148,112,.18); animation: lpHL .7s ease; }
@keyframes lpHL { 0%{background:rgba(107,148,112,.1);} 100%{background:white;} }
.lp-card-title {
  font-family: var(--font-display); font-size: 1rem;
  color: var(--forest); font-weight: 400; line-height: 1.2;
  margin-bottom: .35rem;
  display: flex; align-items: flex-start; gap: .45rem;
}
.lp-card-title::before {
  content:''; width:6px; height:6px; border-radius:50%;
  background: var(--sage); flex-shrink:0; margin-top:.35rem;
}
.lp-card-desc { font-size: .78rem; color: var(--on-surface-variant); line-height: 1.6; font-weight: 300; }

/* Indikationen grid (reuses thema-card styles from home) */
.lp-indik-wrap { max-width: 1200px; margin: 0 auto; padding: 2.5rem clamp(1.5rem,5vw,5rem); }
.lp-indik-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.1rem; }
@media(max-width:860px){ .lp-indik-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:500px){ .lp-indik-grid{grid-template-columns:1fr;} }


/* ══ LEISTUNGSKARTEN — grünlicher Hintergrund ══ */
.lp-card {
  background: var(--surface-container-low) !important;
  border: 1px solid var(--outline-variant) !important;
}
.lp-card:hover {
  background: white !important;
  border-color: var(--sage) !important;
  box-shadow: 0 5px 20px rgba(28,43,30,.10) !important;
}
/* Titel der Leistungen stärker betonen */
.lp-card-title {
  font-size: 1.0rem !important;
  font-weight: 600 !important;
  color: var(--forest) !important;
  font-family: var(--font-body) !important;
}
.lp-card-title::before {
  background: var(--sage) !important;
}
/* Leistungen-Sektion Hintergrund */
#lp-leistungen {
  background: var(--cream) !important;
}
.lp-leist-wrap {
  background: var(--cream) !important;
}
/* Kategorieblöcke: weißer Hintergrund mit dezenter Trennung */
/* old lp-cat rule removed */

/* ══ THERAPIEKONZEPT ALIGNMENT ══ */
.lp-therapie-inner {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 clamp(1.5rem,5vw,5rem) clamp(2rem,4vw,3rem) !important;
  box-sizing: border-box !important;
}
/* hlt-tabs inside leistungen page: pill style on dark bg */
#lp-therapie .hlt-tabs {
  max-width: 100% !important;
  padding: 0 !important;
}


/* ══ LEISTUNGEN HERO ══ */
.lp-hero {
  background: var(--cream);
  padding: clamp(3.5rem,6vw,5.5rem) clamp(1.5rem,5vw,5rem);
  border-bottom: 1px solid var(--outline-variant);
}
.lp-hero-inner {
  max-width: 1200px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center;
}
@media(max-width:760px){ .lp-hero-inner{grid-template-columns:1fr; gap:2rem;} }

.lp-hero-eyebrow {
  display: inline-flex; align-items: center; gap: .6rem;
  font-size: .62rem; text-transform: uppercase; letter-spacing: .22em;
  color: var(--gold); font-weight: 500; margin-bottom: 1rem;
}
.lp-hero-eyebrow::before {
  content: ''; display: block; width: 20px; height: 1px; background: var(--sage);
}
.lp-hero-title {
  font-family: var(--font-display);
  font-size: clamp(2.4rem,5vw,4rem);
  font-weight: 300; color: var(--forest);
  line-height: 1.08; letter-spacing: -.02em;
  margin-bottom: 1.5rem;
}
.lp-hero-title em { font-style: italic; color: var(--sage); }
.lp-hero-text {
  font-size: clamp(.9rem,1.4vw,1.05rem);
  color: var(--on-surface-variant); line-height: 1.78;
  font-weight: 300; margin-bottom: 2rem; max-width: 32rem;
}
.lp-hero-cta {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .8rem 1.8rem; background: var(--forest);
  color: white; border-radius: 2rem; font-size: .88rem;
  font-weight: 500; text-decoration: none;
  transition: background .2s, transform .15s;
  box-shadow: 0 4px 16px rgba(28,43,30,.2);
}
.lp-hero-cta:hover { background: var(--forest-mid); transform: translateY(-2px); }
.lp-hero-cta svg { width:14px; height:14px; stroke:white; fill:none; stroke-width:2; }

/* Right side: 3 highlight boxes */
.lp-hero-highlights {
  display: flex; flex-direction: column; gap: 1rem;
}
.lp-hero-hl {
  display: flex; align-items: flex-start; gap: 1rem;
  background: var(--surface-container-low);
  border-radius: 10px; padding: 1.1rem 1.25rem;
  border: 1px solid var(--outline-variant);
  transition: border-color .2s, box-shadow .2s;
}
.lp-hero-hl:hover { border-color: var(--sage-light); box-shadow: 0 2px 8px rgba(28,43,30,.06); }
.lp-hero-hl-icon {
  width: 36px; height: 36px; border-radius: 8px; flex-shrink: 0;
  background: white; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 1px 4px rgba(28,43,30,.08);
}
.lp-hero-hl-icon svg { width:18px; height:18px; stroke:var(--sage); fill:none; stroke-width:1.5; stroke-linecap:round; }
.lp-hero-hl-name { font-family:var(--font-display); font-size:.95rem; color:var(--forest); font-weight:400; margin-bottom:.15rem; }
.lp-hero-hl-desc { font-size:.75rem; color:var(--on-surface-variant); line-height:1.5; }


/* ══ ACCORDION ══ */
.lp-cat { padding:0 !important; overflow:hidden; }
.lp-cat-head {
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem 1.5rem; cursor:pointer; background:white;
  border:none; margin:0; user-select:none; width:100%;
  transition:background .2s;
}
.lp-cat-head:hover { background:var(--surface-container-low); }
.lp-cat-head.is-open { background:var(--forest); }
.lp-cat-head.is-open .lp-cat-num   { color:var(--gold); }
.lp-cat-head.is-open .lp-cat-title { color:white; }
.lp-cat-head.is-open .acc-chev     { stroke:white; transform:rotate(180deg); }
.lp-cat-head-inner { display:flex; align-items:baseline; gap:1rem; }
.acc-chev { width:20px; height:20px; flex-shrink:0; stroke:var(--sage);
  transition:transform .3s, stroke .2s; }
.acc-body { max-height:0; overflow:hidden; padding:0 1.5rem;
  background:var(--cream); transition:max-height .4s ease; }
.acc-body.is-open { max-height:3000px; padding:1.5rem; }


/* ══ THEMA-PAGE REVEAL FIX ══ */
.thema-page .reveal {
  opacity: 1 !important;
  transform: none !important;
}
.thema-page .reveal.visible {
  opacity: 1 !important;
  transform: none !important;
}


/* ══ NAV DROPDOWN ══ */
.nav-has-dropdown { position: relative; }
.nav-has-dropdown > a { display: flex; align-items: center; gap: 4px; }
.nav-has-dropdown > a::after {
  content: ''; display: inline-block;
  width: 8px; height: 5px; margin-left: 6px;
  border-left: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: rotate(-45deg) translate(0px, -2px);
  transition: transform .2s;
}
.nav-has-dropdown:hover > a::after { transform: rotate(-225deg) translate(-2px, 2px); }

.nav-drop-menu {
  display: none;
  position: absolute; top: 100%; left: 50%;
  transform: translateX(-50%);
  background: white; border-radius: 12px; min-width: 220px;
  box-shadow: 0 8px 32px rgba(28,43,30,.14);
  border: 1px solid var(--outline-variant);
  padding: .5rem;
  padding-top: calc(.5rem + 10px);
  margin-top: -10px;
  z-index: 300;
}
.nav-has-dropdown:hover .nav-drop-menu { display: block; }
.nav-drop-menu:hover { display: block; }
.nav-has-dropdown .nav-drop-menu { transition: none; }
.nav-drop-item {
  display: block; padding: .6rem 1rem;
  font-size: .78rem; font-weight: 500; letter-spacing: .04em;
  color: var(--text-mid); text-decoration: none;
  border-radius: 8px; transition: background .15s, color .15s;
}
.nav-drop-item:hover { background: var(--cream-warm); color: var(--forest); }
.nav-drop-dot {
  display: inline-block; width: 5px; height: 5px;
  border-radius: 50%; background: var(--sage);
  margin-right: 8px; vertical-align: middle;
}
.nav-drop-dot {
  display: inline-block; width: 5px; height: 5px;
  border-radius: 50%; background: var(--sage);
  margin-right: 8px; vertical-align: middle;
}


/* ══ LEISTUNGSSEITE: keine reveal-Animation ══ */
#pg-leistungen .reveal,
#pg-leistungen .thema-card {
  opacity: 1 !important;
  transform: none !important;
}


/* ══ LONGEVITY INDIK GRID ══ */
.longevity-grid .thema-card {
  aspect-ratio: 4/3;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
  cursor: pointer;
  display: flex;
  align-items: flex-end;
}
.longevity-grid .thema-name {
  font-family: var(--font-display);
  font-size: 1.1rem;
  font-weight: 400;
  color: white;
  line-height: 1.3;
}


/* ══ LONGEVITY INDIKATION PAGES ══ */
#pg-longevity-vorsorge .tp-body,
#pg-longevity-familie .tp-body,
#pg-longevity-metabolismus .tp-body,
#pg-longevity-schlaf .tp-body,
#pg-longevity-stress .tp-body,
#pg-longevity-leistung .tp-body {
  background: var(--cream-warm);
}


/* ══ LONGEVITY INDIKATION: align tp-body with hero ══ */
#pg-longevity-vorsorge .tp-body,
#pg-longevity-familie .tp-body,
#pg-longevity-metabolismus .tp-body,
#pg-longevity-schlaf .tp-body,
#pg-longevity-stress .tp-body,
#pg-longevity-leistung .tp-body {
  padding-left: clamp(1.5rem,5vw,5rem);
  padding-right: clamp(1.5rem,5vw,5rem);
  max-width: 100%;
}


/* ══ BEHANDLUNG: reduce hero bottom padding ══ */
#pg-leistungen .lp-hero {
  padding-bottom: clamp(1.5rem,3vw,2.5rem);
}


/* ══ FAQ ══ */
.faq-section { background: var(--cream-warm); }
.faq-inner { max-width: 860px; margin: 0 auto; padding: clamp(3rem,6vw,5rem) clamp(1.5rem,5vw,5rem); }
.faq-list { display: flex; flex-direction: column; }
.faq-item { border-bottom: 1px solid var(--outline-variant); }
.faq-item:first-child { border-top: 1px solid var(--outline-variant); }
.faq-btn {
  width: 100%; display: flex; justify-content: space-between; align-items: center;
  background: none; border: none; padding: 1.4rem 0; cursor: pointer;
  font-family: var(--font-body); font-size: .95rem; font-weight: 500;
  color: var(--forest); text-align: left; gap: 1rem; transition: color .2s;
}
.faq-btn:hover { color: var(--sage); }
.faq-chev { width:18px; height:18px; flex-shrink:0; stroke:var(--sage);
  transition: transform .3s; fill:none; }
.faq-btn.is-open .faq-chev { transform: rotate(180deg); }
.faq-answer {
  max-height: 0; overflow: hidden;
  font-size: .88rem; color: var(--text-mid); line-height: 1.85;
  transition: max-height .4s ease, padding .3s; padding-bottom: 0;
}
.faq-answer.is-open { max-height: 500px; padding-bottom: 1.4rem; }


/* ══ COOKIE BANNER ══ */
#cookie-banner {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 9999;
  background: var(--forest); color: var(--cream);
  padding: 1.25rem clamp(1.5rem,5vw,5rem);
  display: flex; align-items: center; justify-content: space-between;
  gap: 1.5rem; flex-wrap: wrap;
  box-shadow: 0 -4px 24px rgba(0,0,0,.2);
  transform: translateY(0); transition: transform .3s ease;
}
#cookie-banner.hidden { transform: translateY(110%); }
#cookie-banner p { font-size:.82rem; line-height:1.6; margin:0; flex:1; min-width:200px; }
#cookie-banner a { color: var(--gold); text-decoration:underline; }
.cookie-btns { display:flex; gap:.75rem; flex-shrink:0; }
.cookie-btn {
  font-size:.78rem; font-weight:600; padding:.55rem 1.2rem;
  border-radius:20px; cursor:pointer; border:none; transition:all .2s;
}
.cookie-btn-accept { background:var(--gold); color:var(--forest); }
.cookie-btn-accept:hover { background:#d4b558; }
.cookie-btn-reject { background:transparent; color:var(--cream); border:1px solid rgba(244,239,230,.4); }
.cookie-btn-reject:hover { border-color:var(--cream); }

/* ===== nächster <style>-Block ===== */

/* ══ MOBILE ══ */
@media (max-width: 768px) {
  .hero-content { padding: 2rem 1.25rem; }
  .hero-title { font-size: clamp(2rem,8vw,3rem) !important; }
  .hero-actions { flex-direction: column; align-items: flex-start; gap: .75rem; }
  .hero-trust { flex-direction: column; gap: .5rem; }
  .hero-visual { display: none; }
  .lp-hero-inner { padding: 2rem 1.25rem !important; }
  .home-section-inner { padding-left: 1.25rem !important; padding-right: 1.25rem !important; }
  .footer-inner { flex-direction: column; gap: 2rem; }
  .footer-cols { flex-direction: column; gap: 1.5rem; }
  .footer-map-col { width: 100% !important; flex: none !important; }
  .tp-ablauf-steps { grid-template-columns: 1fr !important; }
  .nav-drop-menu { left: auto; right: 0; transform: none; }
  .drei-tile-grid, [style*="grid-template-columns:repeat(3,1fr)"] { grid-template-columns: 1fr !important; }
}
@media (max-width: 480px) {
  .hero-title { font-size: clamp(1.75rem,9vw,2.5rem) !important; }
  .section-title { font-size: clamp(1.6rem,7vw,2.2rem) !important; }
  .lp-hero-title { font-size: clamp(1.6rem,8vw,2.4rem) !important; }
}

/* ===== nächster <style>-Block ===== */

.treatment-row {
  font-size: .83rem; color: var(--text-mid); line-height: 1.5;
  padding: .4rem .6rem; border-radius: 4px;
  transition: background .2s;
}
.treatment-row:hover { background: var(--cream-warm); }
.treatment-row strong { color: var(--forest); }

/* ===== Eröffnungs-Popup (bis 15.07.2026) ===== */
.mc-opening{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:1.5rem;background:rgba(18,35,26,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;animation:mcOpeningFade .35s ease forwards;}
.mc-opening[hidden]{display:none;}
.mc-opening-card{position:relative;max-width:440px;width:100%;background:var(--cream,#f7f3ec);border-radius:16px;padding:clamp(1.75rem,4vw,2.5rem);box-shadow:0 24px 60px rgba(0,0,0,.32);}
.mc-opening-eyebrow{display:inline-block;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold,#b08d57);font-weight:600;margin-bottom:.6rem;}
.mc-opening-card h2{font-family:var(--font-display,'Cormorant Garamond',Georgia,serif);font-weight:400;color:var(--forest,#1f3a2c);font-size:clamp(1.5rem,3vw,2rem);line-height:1.18;margin:0 0 .75rem;}
.mc-opening-card p{font-size:.92rem;line-height:1.7;color:var(--text-mid,#4c4c45);margin:0 0 1.5rem;}
.mc-opening-card p a{color:var(--sage,#6f8a6a);}
.mc-opening-actions{display:flex;flex-wrap:wrap;gap:.7rem;}
.mc-opening-btn{display:inline-flex;align-items:center;justify-content:center;background:var(--forest,#1f3a2c);color:#fff;text-decoration:none;padding:.72rem 1.5rem;border-radius:999px;font-size:.9rem;font-weight:500;}
.mc-opening-btn:hover{opacity:.92;}
.mc-opening-secondary{background:transparent;border:1px solid rgba(31,58,44,.3);color:var(--forest,#1f3a2c);padding:.72rem 1.4rem;border-radius:999px;font-size:.9rem;cursor:pointer;}
.mc-opening-secondary:hover{background:rgba(31,58,44,.07);}
.mc-opening-close{position:absolute;top:.7rem;right:.85rem;background:none;border:none;font-size:1.05rem;color:var(--text-mid,#4c4c45);cursor:pointer;line-height:1;opacity:.55;}
.mc-opening-close:hover{opacity:1;}
@keyframes mcOpeningFade{to{opacity:1;}}
