/* ---------- Baender ---------- */

.band{padding-block:var(--xl);}
.band--flaeche{background:var(--surface);}
.band--dunkel{background:var(--deep);color:rgba(255,255,255,.88);}

.band__titel{
  font-weight:700;
  font-size:clamp(26px,2.9vw,38px);
  line-height:1.1;
  letter-spacing:-.02em;
}
.band--dunkel .band__titel{color:var(--surface);}
.band__einstieg{margin-top:22px;max-width:62ch;font-size:19px;line-height:1.7;color:var(--muted);}

/* ---------- Einleitung mit Aussage ---------- */

.einleitung__titel{max-width:19ch;}
.einleitung__text{margin-top:22px;max-width:64ch;font-size:19px;line-height:1.72;}
.einleitung__ort{margin-top:var(--md);max-width:64ch;font-size:17px;line-height:1.7;color:var(--muted);}

.aussage{
  margin-top:var(--lg);
  padding-top:var(--md);
  border-top:2px solid var(--linie-stark);
  font-size:clamp(24px,2.9vw,38px);
  font-weight:700;
  line-height:1.14;
  letter-spacing:-.02em;
  max-width:17ch;
}
.aussage span{color:var(--accent);}


.einleitung__unten{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:var(--md) var(--xl);align-items:start;margin-top:var(--lg);}
.einleitung__unten .einleitung__ort{margin-top:0;max-width:58ch;}
.einleitung__unten .aussage{margin-top:0;}
@media (max-width:900px){.einleitung__unten{grid-template-columns:1fr;gap:var(--lg);}}

/* ---------- Materialien ---------- */

.materialien__spalten{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--md) var(--xl);
  margin-top:var(--lg);
}
.materialien__gruppe{border-top:2px solid var(--linie-stark);padding-top:var(--md);}
.materialien__kopf{
  font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);margin-bottom:var(--xs);
}
.materialien__liste li{padding-block:10px;border-bottom:1px solid var(--line);font-size:17px;}
.materialien__liste li:last-child{border-bottom:none;}

/* ---------- Leistungskarten ---------- */

.leistungen__raster{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
  margin-top:var(--lg);
}
.leistung{
  display:flex;flex-direction:column;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--r-md);
  padding:32px;
  transition:border-color .18s ease;
}
.band--flaeche .leistung{background:var(--bg);}
.leistung:hover{border-color:var(--accent);}
.leistung__bild{
  width:64px;height:64px;
  object-fit:contain;
  margin-bottom:var(--md);
}
.leistung__titel{font-size:21px;font-weight:600;line-height:1.2;letter-spacing:-.01em;}
.leistung__text{margin-top:var(--sm);padding-top:var(--sm);border-top:1px solid var(--line);color:var(--muted);font-size:17px;line-height:1.65;}
.leistung__link{
  display:inline-flex;align-items:center;gap:8px;
  margin-top:auto;padding-top:var(--md);
  font-weight:700;font-size:16px;
  color:var(--accent);text-decoration:none;
}
.leistung__link::after{content:"\2192";transition:transform .2s ease;}
.leistung__link:hover{text-decoration:underline;text-underline-offset:4px;}
.leistung__link:hover::after{transform:translateX(4px);}

/* ---------- Unternehmen, dunkles Band ---------- */

.unternehmen__oben{
  display:grid;
  grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
  gap:var(--md) var(--xl);
  align-items:start;
  margin-top:var(--lg);
  padding-top:var(--lg);
  border-top:2px solid var(--accent);
}
.jahreszahl{
  font-size:clamp(88px,11vw,148px);
  font-weight:700;line-height:.82;
  letter-spacing:-.05em;
  color:var(--accent);
}
.jahreszahl__label{
  display:block;
  margin-top:var(--sm);
  font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(255,255,255,.55);
}
.unternehmen__gross{
  font-size:clamp(24px,2.6vw,34px);
  font-weight:700;line-height:1.16;letter-spacing:-.018em;
  color:var(--surface);max-width:24ch;
}
.unternehmen__text{
  margin-top:var(--md);
  font-size:17px;line-height:1.72;
  color:rgba(255,255,255,.74);
  max-width:62ch;
}
.unternehmen__text + .unternehmen__text{margin-top:var(--sm);}

.schwerpunkte{margin-top:var(--xl);}
.schwerpunkte li{
  display:grid;
  grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
  gap:var(--xs) var(--xl);
  align-items:baseline;
  padding-block:var(--md);
  border-top:1px solid var(--linie-dunkel);
}
.schwerpunkte b{
  display:block;
  font-size:clamp(20px,2.1vw,26px);
  font-weight:600;line-height:1.16;letter-spacing:-.014em;color:var(--surface);
}
.schwerpunkte span{
  display:block;font-size:17px;line-height:1.65;
  color:rgba(255,255,255,.68);max-width:58ch;
}

/* ---------- Unterseiten ---------- */

.seitenkopf{background:var(--surface);border-bottom:1px solid var(--line);padding-block:var(--lg);}
.seitenkopf__titel{
  font-weight:700;
  font-size:clamp(32px,4vw,54px);
  line-height:1.03;letter-spacing:-.026em;max-width:20ch;
}
.seitenkopf__strich{width:72px;height:4px;background:var(--accent);margin-top:var(--md);}

.fliesstext{
  padding-block:var(--lg) var(--xl);
  max-width:66ch;
  font-size:17px;
  line-height:1.72;
}
.fliesstext > * + *{margin-top:var(--md);}
.fliesstext h2{font-size:clamp(22px,2.4vw,30px);font-weight:700;line-height:1.15;letter-spacing:-.016em;margin-top:var(--lg);}
.fliesstext h3{font-size:20px;font-weight:600;line-height:1.22;margin-top:var(--md);}
.fliesstext h4{font-size:17px;font-weight:700;}
.fliesstext a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;}
.fliesstext ul,.fliesstext ol{padding-left:0;}
.fliesstext ul li{position:relative;padding-left:24px;padding-block:5px;}
.fliesstext ul li::before{content:"";position:absolute;left:0;top:15px;width:10px;height:2px;background:var(--linie-stark);}
.fliesstext ol{list-style:decimal;padding-left:24px;}
.fliesstext ol li{padding-block:5px;}
.fliesstext img{height:auto;margin-block:var(--md);border-radius:var(--r-sm);}
.fliesstext strong{font-weight:700;}
.fliesstext blockquote{border-left:3px solid var(--accent);padding-left:var(--md);color:var(--muted);}
.fliesstext table{border-collapse:collapse;width:100%;font-size:16px;}
.fliesstext th,.fliesstext td{border-bottom:1px solid var(--line);padding:11px 12px;text-align:left;}
.fliesstext iframe,.fliesstext video{max-width:100%;}


/* Lange Adressen und Fremdwoerter duerfen das Raster nicht sprengen */
.fliesstext{overflow-wrap:break-word;hyphens:auto;}
.fliesstext a,.fliesstext code{overflow-wrap:anywhere;hyphens:none;}
.fliesstext table{table-layout:fixed;word-break:break-word;}

.beitragsliste{padding-block:var(--lg) var(--xl);}
.beitrag{border-top:1px solid var(--line);padding-block:var(--md);max-width:66ch;}
.beitrag:first-child{border-top:2px solid var(--linie-stark);}
.beitrag h2{font-size:22px;font-weight:600;line-height:1.2;}
.beitrag h2 a{text-decoration:none;}
.beitrag h2 a:hover{color:var(--accent);}
.beitrag__datum{font-size:14px;color:var(--muted);margin-top:4px;}
.beitrag__anriss{margin-top:var(--sm);color:var(--muted);}

/* ---------- Umbrueche ---------- */

@media (max-width:900px){
  .unternehmen__oben{grid-template-columns:1fr;gap:var(--md);}
  .unternehmen__gross{max-width:none;}
  .schwerpunkte li{grid-template-columns:1fr;gap:6px;}
  .leistungen__raster{grid-template-columns:1fr;gap:var(--md);}
  .aussage{max-width:none;}
}

@media (max-width:600px){
  .materialien__spalten{grid-template-columns:1fr;gap:var(--md);}
  .einleitung__text,.band__einstieg{font-size:17px;}
  .leistung{padding:22px;}
  .fliesstext{font-size:16px;}
}