/* =================================================================
   movement entlastungsprogramm — Landingpage-Ergänzungen
   Baut ausschließlich auf movement3.css (Tokens & Komponenten) auf.
   Keine eigenen Farbwerte — nur bestehende Design-Tokens.
   ================================================================= */

/* ── Skip-Link (Accessibility) ── */
.skip-link{
  position:absolute; left:16px; top:-60px; z-index:200;
  background:var(--surface); color:var(--text);
  border:1px solid var(--line); border-radius:100px;
  padding:.7em 1.3em; font-size:.85rem; font-weight:600;
  transition:top .25s ease;
}
.skip-link:focus{ top:16px; }

/* ── Sichtbarer Fokus (WCAG 2.2) ── */
a:focus-visible, button:focus-visible, summary:focus-visible,
.btn:focus-visible, .toggle:focus-visible{
  outline:3px solid var(--teal-soft);
  outline-offset:3px;
  border-radius:8px;
}
.btn:focus-visible{ border-radius:100px; }

/* ── Fokussierter Landing-Header: dezenter „Zur Therapie"-Link ── */
.nav__back{
  font-size:.82rem; color:var(--muted);
  padding:.55em .9em; border-radius:100px;
  transition:color .3s, background .3s;
}
.nav__back:hover{ color:var(--text); background:var(--surface-2); }
@media(max-width:980px){ .nav__back{ display:none; } }

/* CTA-Label wechselt je nach Breite (Desktop lang, Mobil kurz) */
.lbl-sm{ display:none; }
@media(max-width:520px){
  .lbl-lg{ display:none; }
  .lbl-sm{ display:inline; }
}

/* ── Landing-Hero ── */
.lp-hero{ position:relative; padding-top:clamp(120px,16vh,180px); padding-bottom:clamp(30px,5vw,70px); overflow:hidden; }
.lp-hero .blob.b1{ width:600px; height:600px; top:-180px; right:-140px; }
.lp-hero .blob.b2{ width:420px; height:420px; bottom:-200px; left:-160px; opacity:.6; }
.lp-hero__grid{ display:grid; grid-template-columns:1.08fr .92fr; gap:clamp(30px,5vw,72px); align-items:center; position:relative; z-index:2; }
.lp-hero__sub{ max-width:56ch; margin-top:28px; color:var(--muted); font-size:clamp(1.05rem,1.4vw,1.28rem); font-weight:300; line-height:1.55; }
.lp-hero__cta{ display:flex; gap:12px; flex-wrap:wrap; margin-top:36px; }
.lp-hint{ margin-top:22px; font-size:.86rem; color:var(--muted); display:inline-flex; align-items:center; gap:.6em; flex-wrap:wrap; }
.lp-hint::before{ content:""; width:8px; height:8px; border-radius:50%; background:var(--teal); flex:none; }

/* rechteckiges, abgerundetes Hero-Bild (Porträt) statt Kreis */
.lp-hero__media{ position:relative; }
.lp-media{ position:relative; border-radius:clamp(28px,4vw,48px); overflow:hidden; aspect-ratio:3/4; box-shadow:var(--shadow); background:var(--surface); }
.lp-media img{ width:100%; height:100%; object-fit:cover; filter:grayscale(.15); }
.lp-media__tag{
  position:absolute; left:18px; bottom:18px; z-index:2;
  display:inline-flex; align-items:center; gap:.55em;
  padding:.7em 1.1em; border-radius:100px;
  background:var(--surface); border:1px solid var(--line);
  font-size:.8rem; font-weight:500; box-shadow:var(--shadow);
}
.lp-media__tag .dot{ width:8px; height:8px; border-radius:50%; background:var(--teal); flex:none; }
@media(max-width:980px){
  .lp-hero__grid{ grid-template-columns:1fr; }
  .lp-hero__media{ max-width:440px; margin-inline:auto; order:-1; }
  .lp-hero .blob.b1{ opacity:.2; } .lp-hero .blob.b2{ opacity:.12; }
}

/* ── Vertrauenszeile (nutzt .trust aus movement3.css) ── */

/* ── Problem & Ansatz: typografische Fläche ── */
.lp-approach{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,64px); align-items:start; }
.lp-approach__lead{ font-size:clamp(1.5rem,3vw,2.4rem); font-weight:300; line-height:1.18; letter-spacing:-.02em; }
.lp-approach__lead b{ font-weight:700; }
.lp-approach__body p{ color:var(--muted); font-size:clamp(1rem,1.2vw,1.12rem); line-height:1.65; max-width:68ch; }
.lp-approach__body p + p{ margin-top:18px; }
@media(max-width:820px){ .lp-approach{ grid-template-columns:1fr; gap:22px; } }

/* ── Check-Liste (Zielgruppe & Leistungsumfang) ── */
.lp-split{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(28px,5vw,64px); align-items:start; }
@media(max-width:900px){ .lp-split{ grid-template-columns:1fr; gap:26px; } }
.lp-checks{ list-style:none; display:flex; flex-direction:column; gap:12px; margin:0; }
.lp-checks li{
  position:relative; padding:16px 20px 16px 54px;
  border:1px solid var(--line); border-radius:16px; background:var(--surface);
  font-size:clamp(.98rem,1.15vw,1.08rem); line-height:1.5;
  transition:transform .35s ease, border-color .35s ease;
}
.lp-checks li:hover{ transform:translateX(5px); border-color:color-mix(in srgb,var(--teal) 45%, var(--line)); }
.lp-checks li::before{
  content:""; position:absolute; left:18px; top:50%; transform:translateY(-50%);
  width:24px; height:24px; border-radius:50%;
  background:color-mix(in srgb,var(--teal) 22%, transparent);
}
.lp-checks li::after{
  content:"✓"; position:absolute; left:24px; top:50%; transform:translateY(-50%);
  font-size:.78rem; font-weight:700; color:var(--teal-soft);
}

/* Leistungsumfang: zweispaltige Feature-Liste */
.lp-feats{ list-style:none; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:12px 26px; }
@media(max-width:680px){ .lp-feats{ grid-template-columns:1fr; } }
.lp-feats li{
  position:relative; padding:12px 0 12px 32px;
  border-top:1px solid var(--line);
  color:var(--text); font-size:clamp(.96rem,1.1vw,1.05rem); line-height:1.45;
}
.lp-feats li::before{
  content:""; position:absolute; left:0; top:1.15em;
  width:9px; height:9px; border-radius:50%; background:var(--teal);
}

/* ── Warum movement (nutzt .darkpanel) + Praxis-Vertrauensnachweis ── */
.lp-trustproof{ display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; align-items:stretch; }
.lp-proof{
  display:inline-flex; flex-direction:column; gap:4px;
  padding:16px 22px; border-radius:18px;
  border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.04);
}
.lp-proof b{ font-size:clamp(1.5rem,2.4vw,2rem); font-weight:800; letter-spacing:-.03em; color:#fff; line-height:1; }
.lp-proof span{ font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.5); }
.lp-proof .stars{ color:#f5b50a; letter-spacing:2px; font-size:1rem; }
.lp-proof__note{
  flex-basis:100%; margin-top:4px;
  font-size:.76rem; color:rgba(255,255,255,.45); line-height:1.5; max-width:60ch;
}

/* ── Realistische Erwartung: ruhige, hochwertige Fläche (kein Alarm) ── */
.lp-expect__intro{ color:var(--muted); font-size:clamp(1.05rem,1.4vw,1.3rem); line-height:1.55; max-width:70ch; margin-bottom:clamp(26px,3vw,40px); }
.lp-expect{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2.4vw,26px); align-items:stretch; }
@media(max-width:760px){ .lp-expect{ grid-template-columns:1fr; } }
.lp-ecard{
  border:1px solid var(--line); border-radius:clamp(22px,3vw,32px);
  background:var(--surface); padding:clamp(26px,3vw,42px);
}
.lp-ecard.is-yes{ border-color:color-mix(in srgb,var(--teal) 42%, var(--line)); }
.lp-ecard__k{ display:inline-flex; align-items:center; gap:.6em; font-size:.72rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.lp-ecard__k::before{ content:""; width:9px; height:9px; border-radius:50%; }
.lp-ecard.is-yes .lp-ecard__k::before{ background:var(--teal); }
.lp-ecard.is-no  .lp-ecard__k::before{ background:var(--muted); }
.lp-ecard h3{ font-size:clamp(1.25rem,2vw,1.6rem); letter-spacing:-.02em; text-transform:none; margin-top:14px; }
.lp-ecard ul{ list-style:none; margin-top:20px; display:flex; flex-direction:column; gap:14px; }
.lp-ecard li{ position:relative; padding-left:36px; color:var(--text); font-size:clamp(.98rem,1.15vw,1.08rem); line-height:1.5; }
.lp-ecard li::before{ content:""; position:absolute; left:0; top:.05em; width:22px; height:22px; border-radius:50%; }
.lp-ecard.is-yes li::before{ background:color-mix(in srgb,var(--teal) 22%, transparent); }
.lp-ecard.is-yes li::after{ content:"✓"; position:absolute; left:6px; top:.02em; font-size:.75rem; font-weight:700; color:var(--teal-soft); }
.lp-ecard.is-no li{ color:var(--muted); }
.lp-ecard.is-no li::before{ border:1.5px solid var(--muted); background:transparent; opacity:.55; }
.lp-expect__close{ margin-top:clamp(22px,2.6vw,32px); color:var(--muted); font-size:clamp(1rem,1.2vw,1.15rem); line-height:1.6; max-width:74ch; }
.lp-expect__close b{ color:var(--text); font-weight:600; }

/* ── FAQ als native <details> (barrierefrei, kein zusätzliches JS) ── */
.lp-faq{ display:flex; flex-direction:column; gap:12px; max-width:none; }
.lp-faq details{
  border:1px solid var(--line); border-radius:clamp(18px,2.2vw,26px);
  background:var(--surface); overflow:hidden;
}
.lp-faq summary{
  display:flex; justify-content:space-between; align-items:center; gap:20px;
  padding:clamp(18px,2.2vw,26px) clamp(20px,2.6vw,32px);
  cursor:pointer; list-style:none;
  font-size:clamp(1.02rem,1.5vw,1.3rem); font-weight:500; letter-spacing:-.01em;
}
.lp-faq summary::-webkit-details-marker{ display:none; }
.lp-faq summary .pm{ position:relative; width:30px; height:30px; border-radius:50%; border:1px solid var(--line); flex:none; }
.lp-faq summary .pm::before, .lp-faq summary .pm::after{
  content:""; position:absolute; top:50%; left:50%; background:var(--teal); transition:transform .3s ease;
}
.lp-faq summary .pm::before{ width:12px; height:1.6px; transform:translate(-50%,-50%); }
.lp-faq summary .pm::after{ width:1.6px; height:12px; transform:translate(-50%,-50%); }
.lp-faq details[open] summary .pm::after{ transform:translate(-50%,-50%) scaleY(0); }
.lp-faq details > div{ padding:0 clamp(20px,2.6vw,32px) clamp(20px,2.4vw,26px); }
.lp-faq details p{ color:var(--muted); max-width:72ch; line-height:1.6; }

/* ── Anfrage-Block (Conversion → arzt-direkt Webformular) ── */
.lp-anfrage{
  border-radius:clamp(28px,4vw,52px); background:var(--surface);
  border:1px solid var(--line); overflow:hidden;
  display:grid; grid-template-columns:1.05fr .95fr;
}
@media(max-width:860px){ .lp-anfrage{ grid-template-columns:1fr; } }
.lp-anfrage__body{ padding:clamp(30px,4.5vw,64px); }
.lp-anfrage__body h2{ margin-bottom:18px; }
.lp-anfrage__body p{ color:var(--muted); max-width:52ch; font-size:clamp(1rem,1.2vw,1.12rem); line-height:1.6; }
.lp-anfrage__steps{ list-style:none; margin:26px 0 0; display:flex; flex-direction:column; gap:12px; }
.lp-anfrage__steps li{ position:relative; padding-left:30px; color:var(--muted); font-size:.98rem; }
.lp-anfrage__steps li::before{ content:""; position:absolute; left:0; top:.5em; width:9px; height:9px; border-radius:50%; background:var(--teal); }
.lp-anfrage__cta{ margin-top:30px; }
.lp-anfrage__privacy{ margin-top:20px; font-size:.82rem; color:var(--muted); line-height:1.55; max-width:52ch; }
.lp-anfrage__privacy a{ color:var(--teal-soft); text-decoration:underline; }
/* Aside mit Bild + Nutzenpunkten */
.lp-anfrage__aside{ position:relative; background:#11140a; color:#f4f4ef; padding:clamp(30px,4.5vw,56px); display:flex; flex-direction:column; justify-content:center; gap:16px; }
.lp-anfrage__aside .eyebrow{ color:rgba(255,255,255,.5); }
.lp-anfrage__aside h3{ color:#fff; font-size:clamp(1.3rem,2.2vw,1.8rem); text-transform:none; letter-spacing:-.02em; }
.lp-anfrage__aside ul{ list-style:none; display:flex; flex-direction:column; gap:12px; margin-top:6px; }
.lp-anfrage__aside li{ position:relative; padding-left:28px; color:rgba(255,255,255,.72); font-size:.96rem; line-height:1.45; }
.lp-anfrage__aside li::before{ content:""; position:absolute; left:0; top:.5em; width:8px; height:8px; border-radius:50%; background:var(--teal); }

/* ── Preis-Orientierung im Anfrage-Aside ── */
.lp-price{ margin-top:8px; padding:16px 18px; border:1px solid rgba(255,255,255,.16); border-radius:16px; background:rgba(255,255,255,.04); }
.lp-price b{ display:block; color:#fff; font-size:clamp(1.05rem,1.6vw,1.35rem); font-weight:700; letter-spacing:-.02em; }
.lp-price span{ display:block; margin-top:4px; font-size:.86rem; color:rgba(255,255,255,.6); line-height:1.45; }

/* ── Anfrageformular ── */
.lp-form{ margin-top:26px; display:flex; flex-direction:column; gap:18px; }
.lp-field{ display:flex; flex-direction:column; gap:7px; }
/* fieldset-Standardrahmen entfernen (Kontaktweg-Gruppe) */
fieldset.lp-field{ border:0; padding:0; margin:0; min-width:0; }
.lp-legend{ padding:0; }
.lp-field > label,.lp-legend{ font-size:.82rem; font-weight:600; letter-spacing:.01em; color:var(--text); }
.lp-req{ color:var(--teal-soft); }
.lp-optional{ font-weight:400; color:var(--muted); font-size:.78rem; }
.lp-input,.lp-select,.lp-textarea{
  width:100%; font-family:inherit; font-size:16px; color:var(--text);
  background:var(--surface); border:1px solid var(--line); border-radius:12px;
  padding:.75em .9em; transition:border-color .25s, box-shadow .25s;
}
[data-theme="light"] .lp-input,[data-theme="light"] .lp-select,[data-theme="light"] .lp-textarea{ background:var(--surface-2); }
.lp-textarea{ min-height:96px; resize:vertical; line-height:1.5; }
.lp-select{ appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 1em center; padding-right:2.4em; }
.lp-input::placeholder,.lp-textarea::placeholder{ color:var(--muted); opacity:.85; }
.lp-input:focus,.lp-select:focus,.lp-textarea:focus{ outline:none; border-color:var(--teal-soft); box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 30%, transparent); }
.lp-field.has-error .lp-input,.lp-field.has-error .lp-select,.lp-field.has-error .lp-textarea{ border-color:#d64545; box-shadow:0 0 0 3px rgba(214,69,69,.18); }
.lp-error{ font-size:.8rem; color:#d64545; min-height:0; }
[data-theme="dark"] .lp-error{ color:#ff8c8c; }
.lp-field.has-error .lp-error{ margin-top:1px; }

/* radios / checkbox */
.lp-radios{ display:flex; gap:10px; flex-wrap:wrap; }
.lp-radio{ display:inline-flex; align-items:center; gap:.55em; padding:.7em 1.1em; border:1px solid var(--line); border-radius:100px; background:var(--surface); cursor:pointer; font-size:.92rem; transition:border-color .2s, background .2s; min-height:44px; }
[data-theme="light"] .lp-radio{ background:var(--surface-2); }
.lp-radio input{ accent-color:var(--teal-soft); width:17px; height:17px; }
.lp-radio:has(input:checked){ border-color:var(--teal-soft); background:color-mix(in srgb,var(--teal) 14%, var(--surface)); }
.lp-check{ display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:start; font-size:.86rem; color:var(--muted); line-height:1.5; cursor:pointer; }
.lp-check input{ margin-top:2px; width:20px; height:20px; accent-color:var(--teal-soft); flex:none; }
.lp-check a{ color:var(--teal-soft); text-decoration:underline; }
.lp-field.has-error .lp-check{ color:var(--text); }

/* honeypot – visuell + für AT verborgen, aber im DOM */
.lp-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* Fehlerzusammenfassung */
.lp-summary{ border:1px solid #d64545; background:rgba(214,69,69,.08); border-radius:14px; padding:16px 18px; margin-bottom:6px; }
.lp-summary h3{ font-size:.95rem; color:#d64545; margin-bottom:8px; text-transform:none; letter-spacing:0; }
[data-theme="dark"] .lp-summary h3{ color:#ff8c8c; }
.lp-summary ul{ list-style:none; display:flex; flex-direction:column; gap:5px; margin:0; }
.lp-summary a{ color:#d64545; font-size:.85rem; text-decoration:underline; }
[data-theme="dark"] .lp-summary a{ color:#ff8c8c; }
.lp-summary[hidden]{ display:none; }

/* Statusmeldungen (aria-live) */
.lp-status{ font-size:.9rem; line-height:1.5; }
.lp-status.is-error{ color:#d64545; }
[data-theme="dark"] .lp-status.is-error{ color:#ff8c8c; }
.lp-status.is-ok{ color:var(--teal-soft); }
.lp-form button[type=submit]{ align-self:flex-start; }
.lp-form button[disabled]{ opacity:.65; cursor:progress; }

/* ── Reduced motion: Inhalte niemals durch Animation unsichtbar ── */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .rv{ opacity:1 !important; transform:none !important; transition:none !important; }
  .blob, .float{ animation:none !important; }
  *{ transition-duration:.001ms !important; animation-duration:.001ms !important; }
}