/* Landing-page conversion & spacing system — scoped to body.lp.
   Loaded ONLY by /fuer-frauen/* and /fuer-maenner/* (does not affect the rest of the site).
   Goal: one uniform vertical rhythm + conversion components ("aus einem Guss"). */

/* ---- uniform spacing system (global scale 8/16/24/40/64/96) ---- */
.lp section:not(.subhero):not(.closer){ padding-top:clamp(var(--sp-lg),8vw,var(--sp-xl)); padding-bottom:clamp(var(--sp-lg),8vw,var(--sp-xl)); }
.lp .section-head{ margin-bottom:var(--sp-md); }
.lp .lead{ max-width:620px; }
.lp section .container > p:not(.lead){ max-width:620px; }
.lp .lp-badges{ margin-top:var(--sp-sm); }

/* ---- slim "Bekannt aus" trust bar (replaces the full-screen media wall) ----
   Height band 70–90px, higher contrast. <img> logo slots are ready: drop a
   real, licensed logo as `.lp-trustbar img` and it sits inline with the words. */
.lp-trustbar{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:10px 22px; min-height:78px; padding:var(--sp-sm) var(--sp-xs); border-top:1px solid var(--hair-2);
  border-bottom:1px solid var(--hair-2); background:#fff; font-family:var(--mono);
  font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-2); }
.lp-trustbar b{ color:var(--ink); font-weight:700; }
.lp-trustbar span{ white-space:nowrap; font-weight:600; }
.lp-trustbar .sep{ color:var(--hair-2); }
.lp-trustbar img{ max-height:34px; width:auto; display:block; }

/* ---- hero trust badges (directly under the hero CTA) ---- */
.lp-badges{ list-style:none; margin:18px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px 18px; }
.lp-badges li{ display:flex; align-items:center; gap:7px; font-size:14px; color:var(--ink-2); font-weight:500; }
.lp-badges li::before{ content:"\2713"; color:var(--brand-blue); font-weight:800; }

/* ---- before/after comparison (Vorher / Nachher) ---- */
.lp-vs{ display:grid; grid-template-columns:1fr 1fr; gap:16px; max-width:880px; }
.lp-vs__col{ border:1px solid var(--hair); border-radius:14px; padding:22px; }
.lp-vs__col--before{ background:var(--bone); }
.lp-vs__col--after{ background:#fff; border-color:var(--brand-yellow-deep); box-shadow:var(--shadow-sm); }
.lp-vs__col ul{ margin:10px 0 0; padding-left:18px; line-height:1.9; }
.lp-vs__col--before ul{ color:var(--ink-2); }
.lp-vs__col--after ul{ color:var(--ink); }
@media (max-width:640px){ .lp-vs{ grid-template-columns:1fr; } }

/* ---- testimonial meta (Alter · Ort · Zeitraum) ---- */
.lp .voice .who{ align-items:flex-start; }
.lp .voice .who > span:last-child{ display:flex; flex-direction:column; gap:2px; }
.lp .voice .who small{ display:block; text-transform:none; letter-spacing:0; font-family:var(--sans); font-size:12.5px; color:var(--ink-3); }

/* ---- studio finder: higher contrast (labels, field borders, count) ---- */
.lp .finder__field label{ color:var(--ink-2); font-weight:600; }
.lp .finder__field select, .lp .finder__field input{ border-color:#aab4c4; color:var(--ink); background:#fff; }
.lp .finder__field input::placeholder{ color:var(--ink-3); }
.lp .finder__count{ color:var(--ink-2); }

/* ---- premium type lock: one identical rhythm on EVERY .lp page ----
   Headlines, lead, body and FAQ are pinned to the global type tokens so they
   never drift from page to page (calm, premium, high-contrast body). */
.lp h1{ font-family:var(--serif); font-weight:400; font-size:var(--fs-h1); line-height:var(--lh-h1); letter-spacing:var(--ls-h1); margin:0 0 var(--sp-sm); text-wrap:balance; }
.lp .section-head h2{ font-size:var(--fs-h2); line-height:var(--lh-h2); letter-spacing:var(--ls-h2); }
.lp .lead{ font-size:var(--fs-lead); line-height:var(--lh-lead); color:var(--ink-2); }
.lp .subhero .lead{ margin:0 0 var(--sp-sm); }
.lp section .container > p{ text-wrap:pretty; }
.lp .faq{ margin-top:0; }
.lp details.q{ padding:var(--sp-sm) 0; }
.lp details.q .a{ font-size:var(--fs-body); line-height:var(--lh-body); color:var(--ink); }
.lp .eyebrow{ font-size:var(--fs-eyebrow); letter-spacing:var(--ls-eyebrow); }

/* ---- premium surfaces: calmer, less cluttered (hairline + soft elevation) ---- */
.lp .lp-vs__col{ box-shadow:none; }
.lp .lp-vs__col--after{ box-shadow:var(--shadow-sm); }
.lp .steps .step{ border-color:var(--hair); }

/* ---- mobile: collapse the inline two-column grids (comparison, two-phases) to 1 col ----
   (overrides the inline grid-template-columns; prevents a long word blowing out the track) */
@media (max-width:640px){
  .lp [style*="grid-template-columns:1fr 1fr"]{ grid-template-columns:1fr !important; }
}
