/* =========================================================
   GRAFFITI-FREE · Einsatzgebiet-Stylesheet
   styles-einsatzgebiet.css · v1.0
   Dediziert für alle 32 Einsatzgebiet-Seiten.
   Lädt nach styles-gf.css via <link rel="stylesheet" href="../styles-einsatzgebiet.css">
   ========================================================= */


/* Reduzierter Abstand vor dem Kostenseiten-Link */
.einsatzgebiet-hinweis-section {
  padding-bottom: clamp(20px, 3vw, 32px);
}

/* Kostenseiten-Hinweis innerhalb Schritt 5 */
.einsatzgebiet-page-schritt-kosten {
  margin-top: 10px;
  font-size: 0.82rem;
  font-weight: 300;
  color: var(--ink-faint);
  line-height: 1.6;
}

.einsatzgebiet-page-schritt-kosten a {
  color: var(--green);
  font-weight: 500;
  transition: opacity 0.2s;
}

.einsatzgebiet-page-schritt-kosten a:hover {
  opacity: 0.75;
}

/* =========================================================
   01 — KOMPAKTER KOSTENSEITEN-LINK VOR DEM CTA-STRIP
   Ersetzt die fehlerhafte <section class="einsatzgebiet-page-section">
   mit überhöhtem padding. Klasse: einsatzgebiet-kosten-link
   ========================================================= */

.einsatzgebiet-kosten-link {
  padding: clamp(20px, 3vw, 32px) 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.einsatzgebiet-kosten-link .wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.einsatzgebiet-kosten-link p {
  font-size: 0.88rem;
  font-weight: 300;
  color: var(--ink-soft);
  line-height: 1.7;
  margin: 0;
}

.einsatzgebiet-kosten-link a {
  font-family: var(--body);
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--green);
  white-space: nowrap;
  transition: opacity 0.2s;
}

.einsatzgebiet-kosten-link a:hover {
  opacity: 0.75;
}

/* =========================================================
   EINSATZGEBIET — KENNZAHLEN-LEISTE
   ========================================================= */

.eg-kennzahlen {
  border-bottom: 1px solid var(--line);
}

.eg-kennzahlen-list {
  display: flex;
  gap: 0;
}

.eg-kennzahl {
  flex: 1;
  padding: clamp(20px, 3vw, 32px) 0;
  border-right: 1px solid var(--line);
  padding-right: clamp(24px, 4vw, 48px);
  padding-left: clamp(24px, 4vw, 48px);
}

.eg-kennzahl:first-child {
  padding-left: 0;
}

.eg-kennzahl:last-child {
  border-right: none;
}

.eg-kennzahl-wert {
  display: block;
  font-family: var(--head);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 700;
  color: var(--green);
  line-height: 1;
  margin-bottom: 6px;
}

.eg-kennzahl-label {
  font-size: 0.78rem;
  font-weight: 300;
  color: var(--ink-faint);
  line-height: 1.4;
  letter-spacing: 0.01em;
}

@media (max-width: 480px) {
  .eg-kennzahlen-list {
    flex-direction: column;
    gap: 0;
  }
  .eg-kennzahl {
    border-right: none;
    border-bottom: 1px solid var(--line);
    padding-left: 0;
    padding-right: 0;
  }
  .eg-kennzahl:last-child {
    border-bottom: none;
  }
}


/* =========================================================
   EINSATZGEBIET — LEISTUNGS-KACHELN
   ========================================================= */

.eg-leistungen-kacheln {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
}

.eg-leistung {
  border-bottom: 1px solid var(--line);
}

.eg-leistung:first-child {
  border-top: 1px solid var(--line);
}

.eg-leistung-link {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 16px 0;
  transition: color 0.2s;
}

.eg-leistung-link:hover .eg-leistung-titel {
  color: var(--green);
}

.eg-leistung-titel {
  font-family: var(--head);
  font-size: 1rem;
  font-weight: 700;
  color: var(--ink);
  transition: color 0.2s;
}

.eg-leistung-text {
  font-size: 0.88rem;
  font-weight: 300;
  color: var(--ink-soft);
  line-height: 1.6;
}

/* =========================================================
   EINSATZGEBIET-ÜBERSICHTSSEITE — Korrekturen
   Gilt nur für einsatzgebiet.html (Root-Ebene)
   ========================================================= */

/* H2 in Grid-Spalten: kontrollierter Umbruch */
.einsatzgebiet-page-grid .section-h2 {
  font-size: clamp(1.4rem, 2.5vw, 2.2rem);
  overflow-wrap: break-word;
  hyphens: none;
  max-width: 100%;
}

/* H1 im Hero: keine automatische Silbentrennung */
.page-hero h1 {
  hyphens: none;
  overflow-wrap: normal;
  word-break: normal;
}

/* H2 im Hinweisblock: ausreichend Breite für längere Titel */
.einsatzgebiet-page-hinweis .section-h2 {
  max-width: 22ch;
  hyphens: none;
}

/* Hinweisblock auf Übersichtsseite: ohne Stone-Box */
.einsatzgebiet-page-section--hinweis-vor-cta .einsatzgebiet-page-hinweis {
  background: none;
  border-left: none;
  border-radius: 0;
  padding: 0;
}

/* Regionstext unter Gruppenbezeichnung */
.einsatzgebiet-page-region-text {
  font-size: 0.82rem;
  font-weight: 300;
  color: var(--ink-soft);
  line-height: 1.6;
  margin-bottom: clamp(16px, 2vw, 24px);
  max-width: 560px;
}

/* ── Leistungskacheln auf Übersichtsseite: Titel etwas größer ── */
.einsatzgebiet-page-body .eg-leistung-titel {
  font-size: 0.92rem;
}

/* =========================================================
   EINSATZGEBIET-ORTSSEITEN — FAQ
   ========================================================= */

.einsatzgebiet-page-faq {
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.einsatzgebiet-page-faq-item {
  border-top: 1px solid var(--line);
  padding: 24px 0;
}

.einsatzgebiet-page-faq-item:last-child {
  border-bottom: 1px solid var(--line);
}

.einsatzgebiet-page-faq-frage {
  display: block;
  font-family: var(--head);
  font-size: 1rem;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 10px;
  line-height: 1.4;
}

.einsatzgebiet-page-faq-antwort {
  font-size: 0.93rem;
  font-weight: 300;
  color: var(--ink-soft);
  line-height: 1.7;
  margin: 0;
}

.einsatzgebiet-page-faq-mehr {
  margin-top: 24px;
  font-size: 0.88rem;
  font-weight: 300;
  color: var(--ink-soft);
  line-height: 1.6;
}

.einsatzgebiet-page-faq-mehr a {
  color: var(--green);
  font-weight: 500;
  transition: opacity 0.2s;
}

.einsatzgebiet-page-faq-mehr a:hover {
  opacity: 0.75;
}