/* ==========================================================================
   index.css — seitenspezifische Ergänzungen zur Startseite (AP-C)
   Nur Regeln, die site.css (AP-A) bewusst nicht abdeckt: das reale
   WebGL-Fallback-Bild, der schmale Vertrauensstreifen unter dem Hero,
   Abstand zwischen den drei .split-Leistungsblöcken, die Textur im
   Kennzahlenband und Bildnachweise auf den Bento-Kacheln (dort gibt es
   keinen eigenen figcaption-Slot).
   ========================================================================== */

/* WebGL-Fallback: echtes Bild statt Farbverlauf. site.css setzt display:none;
   sichtbar wird das Element per JS (buildFallback) oder — bei deaktiviertem
   JS — per <noscript>-Regel in index.html. Der leere, unbemalte <canvas>
   darüber ist transparent und verdeckt das Bild nicht. */
.gl-fallback{
  background-image:url(/img/solarpark-luft-1600.jpg);
  background-size:cover;
  background-position:center 38%;
}

/* Vertrauensstreifen — ruhige Zeile mit vier belegten Fakten, keine Kacheln */
.trust-strip{border-bottom:1px solid var(--line);background:var(--bg2)}
.trust-strip .wrap{padding:14px 0}
.trust-strip ul{
  display:flex;flex-wrap:wrap;gap:10px 28px;list-style:none;margin:0;padding:0;
  justify-content:center;
}
.trust-strip li{
  font-family:var(--mono);font-size:12.5px;letter-spacing:.02em;color:var(--muted);
  white-space:nowrap;
}
.trust-strip li+li{position:relative;padding-left:30px}
.trust-strip li+li::before{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:4px;height:4px;border-radius:50%;background:var(--line2);
}
@media (max-width:640px){
  .trust-strip ul{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
}

/* Drei asymmetrische .split-Blöcke in #leistungen: Abstand zwischen ihnen */
#leistungen .split + .split{margin-top:clamp(64px,9vw,120px)}

/* Kennzahlenband: die laut Bildnachweis für .band.dark vorgesehene Textur,
   dezent unter der dunklen Fläche — Overlay hält den Kontrast der Zahlen */
#technologie{
  background-image:linear-gradient(rgba(22,29,61,.93),rgba(22,29,61,.93)),url(/img/textur-dunkel-1600.jpg);
  background-size:cover;background-position:center;
}

/* Bildnachweis auf Bento-Kacheln mit Foto — der Archetyp hat keinen
   eigenen figcaption-Slot für Credits */
.bento-credit{
  display:block;margin-top:6px;font-family:var(--mono);font-size:10px;
  letter-spacing:.05em;text-transform:uppercase;color:rgba(255,255,255,.72);
}