/* ============================================================
   sanaflair · Leistungen — bespoke editorial styling
   Loads only on /leistungen and /leistungen/{slug}.
   Everything is scoped under the .lst* page wrappers so it
   never leaks into other pages that share templates.
   Design language: white base + soft-green rhythm, dark forest
   hero/CTA bands, editorial eyebrows, and the signature card
   with a 3px green LEFT border + squared-right radius.
   ============================================================ */

/* ---- Shared rhythm for these pages ---- */
.lst .section-block{padding:4.5rem 0}
.lst .section-block-sm{padding:3.25rem 0}
.lst .section-head{gap:.65rem;max-width:56rem}
.lst .section-head .eyebrow{margin-bottom:.15rem}
.lst .section-head h2{letter-spacing:-.045em;font-weight:800;line-height:1.1;
  font-size:clamp(1.55rem,2.8vw,2.15rem);margin-bottom:0}
.lst .section-head p{color:var(--muted);line-height:1.7}

@media (max-width:575.98px){
  .lst .section-block{padding:3.25rem 0}
  .lst .section-block-sm{padding:2.5rem 0}
}

/* ============================================================
   HUB — services.php  (.lst-hub)
   ============================================================ */

/* Hero lead: keep a readable measure on the dark band */
.lst-hub .subhero .lead{max-width:60rem}

/* Leistungsbereiche directory */
.lst-hub .service-hub-grid{
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
  gap:1rem;
}
.lst-hub .service-hub-card{
  background:#fff;
  border-left:3px solid var(--brand);
  border-top:1px solid var(--border-soft);
  border-right:1px solid var(--border-soft);
  border-bottom:1px solid var(--border-soft);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.lst-hub .service-hub-card:hover,
.lst-hub .service-hub-card:focus-visible{
  transform:translateX(2px);
  border-left-color:var(--brand-dark);
  box-shadow:0 10px 28px rgba(26,45,14,.10);
}
.lst-hub .service-hub-card span{color:var(--muted);line-height:1.6}
.lst-hub .service-hub-card em{
  color:var(--brand-text);font-weight:800;font-style:normal;
  display:inline-flex;align-items:center;gap:.4rem;margin-top:.3rem;
}
.lst-hub .service-hub-card em::after{content:"\2192";transition:transform .18s ease}
.lst-hub .service-hub-card:hover em::after{transform:translateX(4px)}

/* Editorial passage + "Direkt starten" panel */
.lst-hub .lst-editorial h2{
  letter-spacing:-.045em;font-weight:800;line-height:1.12;
  font-size:clamp(1.5rem,2.6vw,2rem);
}
.lst-hub .lst-editorial p{color:var(--ink-soft);line-height:1.8;max-width:60ch}
.lst-hub .lst-start-card{
  border:1px solid var(--border-soft);
  border-left:3px solid var(--brand);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  box-shadow:none;
  background:#fff;
}
.lst-hub .lst-start-card h3{font-weight:800;letter-spacing:-.02em}

/* Grouped service cards */
.lst-hub .service-section .section-head{max-width:62rem}
.lst-hub .service-group-title-link{color:var(--ink)}
.lst-hub .service-group-title-link:hover{color:var(--brand-text)}
.lst-hub .service-card{
  border-radius:var(--radius-sm);
  border:1px solid var(--border-soft);
  box-shadow:0 2px 10px rgba(26,36,16,.05);
  transition:transform .2s ease, box-shadow .2s ease;
}
.lst-hub .service-card:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 34px rgba(26,45,14,.12);
}
.lst-hub .service-card-body h3{font-weight:800;letter-spacing:-.025em;font-size:1.12rem}
.lst-hub .service-card-body p{color:var(--muted);line-height:1.6}

/* ============================================================
   LANDING — service-landing.php  (.lst-landing)
   ============================================================ */

/* Hero → dark forest band, matching the site hero language */
.lst-landing .service-landing-hero{
  background:linear-gradient(160deg,#1a2b0e 0%,#233212 100%);
}
.lst-landing .service-landing-hero-grid{align-items:stretch}
.lst-landing .service-landing-hero .eyebrow{
  color:#c8e417;border-bottom-color:rgba(174,201,12,.6);
}
.lst-landing .service-landing-hero h1{color:#fff}
.lst-landing .service-landing-hero .lead{color:rgba(255,255,255,.82)}
.lst-landing .service-landing-hero .aid-phone-note{color:rgba(255,255,255,.78)}
.lst-landing .service-landing-hero .aid-phone-note a{color:#c8e417}
.lst-landing .service-landing-hero .btn-soft{
  background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.3);color:#fff;
}
.lst-landing .service-landing-hero .btn-soft:hover{
  background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.45);color:#fff;
}

/* Summary aside → signature light card sitting on the dark band */
.lst-landing .service-landing-summary{
  background:#fff;color:var(--ink);
  border:1px solid var(--border-soft);
  border-left:3px solid var(--brand);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  box-shadow:0 18px 46px rgba(0,0,0,.28);
  display:flex;flex-direction:column;justify-content:center;
}
.lst-landing .service-landing-summary span{color:var(--brand-text)}
.lst-landing .service-landing-summary strong{color:var(--ink);letter-spacing:-.03em}
.lst-landing .service-landing-summary p{color:var(--ink-soft)}

/* Problem / solution pair → squared editorial cards with left accent */
.lst-landing .service-landing-problem-grid article{
  border:1px solid var(--border-soft);
  border-left:3px solid var(--brand);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  box-shadow:none;
}
.lst-landing .service-landing-problem-grid h2{
  letter-spacing:-.045em;font-weight:800;
  font-size:clamp(1.5rem,2.6vw,2.1rem);
}
.lst-landing .service-landing-problem-grid p{color:var(--ink-soft)}

/* Benefits → tidy squared checklist, not soft pills */
.lst-landing .service-landing-benefits div{
  background:var(--surface);
  border:1px solid var(--border-soft);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  border-left:3px solid var(--brand);
  color:var(--ink);font-weight:700;line-height:1.4;
}
.lst-landing .service-landing-benefits i{color:var(--brand-dark)}

/* Related items → squared-right cards */
.lst-landing .service-landing-card{
  border:1px solid var(--border-soft);
  border-radius:var(--radius-sm);
  box-shadow:0 2px 10px rgba(26,36,16,.05);
  transition:transform .2s ease, box-shadow .2s ease;
}
.lst-landing .service-landing-card:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 34px rgba(26,45,14,.12);
}
.lst-landing .service-landing-card h3{font-weight:800;letter-spacing:-.025em}
.lst-landing .service-landing-card p{color:var(--muted)}

/* Process (a real sequence → numbers stay) */
.lst-landing .service-landing-process{
  background:var(--surface);
  border:1px solid var(--border-soft);
  border-radius:var(--radius-sm);
  box-shadow:none;
}
.lst-landing .service-landing-process .eyebrow{
  background:none;border-bottom:2px solid var(--brand);
  color:var(--brand-text);border-radius:0;padding:0 0 .18rem;
}
.lst-landing .service-landing-process h2{letter-spacing:-.05em;font-weight:800}
.lst-landing .service-landing-process .btn-soft{
  background:#fff;border-color:var(--border-soft);
}
.lst-landing .service-landing-step-list article{
  border:1px solid var(--border-soft);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  border-left:3px solid var(--brand);
  box-shadow:none;
}
.lst-landing .service-landing-step-list article>span{
  border-radius:12px;background:var(--brand);color:var(--brand-ink);
}
.lst-landing .service-landing-step-list strong{color:var(--ink);font-weight:800}

/* ============================================================
   DETAIL — default.php  (.lst-detail)
   Die Regeln für .lst-detail stehen jetzt global in style.css
   (Abschnitt "Artikel-/Rechtsseiten"), weil default.php auch
   Pflegewegweiser, Impressum, Datenschutz und AGB rendert —
   dort lädt diese Datei nicht.
   ============================================================ */
