/* =========================================================
   chasalla.css – Marken-Ergänzungen zu FWT
   ---------------------------------------------------------
   Nur das, was FWT nicht schon liefert. Farben/Layout/
   Komponenten kommen aus FWT. Hier: Footer, Skip-Link,
   ein paar Marken-Grundlagen.
   ========================================================= */

:root{
  --csa-turquoise:#18b7b9;
  --csa-turquoise-dark:#087f83;
  --csa-gold:#f2a73b;
  --csa-gold-deep:#e08a1e;
  --csa-ink:#101b28;
  --csa-ink-2:#18283a;
  --csa-muted:#6d7f8d;
}

/* Skip-Link (Barrierefreiheit) */
.skip-link{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--csa-ink); color:#fff; padding:.7rem 1.2rem;
  border-radius:0 0 10px 0;
}
.skip-link:focus{ left:0; }

/* Platz oben, damit Logo/Tab nicht auf dem Inhalt kleben */
#main{ padding-top:1px; }

/* =========================================================
   HOHER FOOTER
   ========================================================= */
.csa-footer{
  background:
    radial-gradient(ellipse at 12% 20%, rgba(24,183,185,.10), transparent 55%),
    radial-gradient(ellipse at 88% 80%, rgba(8,120,216,.10), transparent 55%),
    var(--csa-ink);
  color:#aebfca;
  padding:4rem 1.5rem 2rem;
  margin-top:4rem;
}
.csa-footer-inner{
  max-width:1240px; margin:0 auto;
  display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr 1fr; gap:2.2rem;
  padding-bottom:2.5rem; border-bottom:1px solid rgba(255,255,255,.12);
}
@media (max-width:1100px){
  .csa-footer-inner{ grid-template-columns:1.4fr 1fr 1fr; gap:2rem; }
}
@media (max-width:760px){
  .csa-footer-inner{ grid-template-columns:1fr 1fr; gap:2rem; }
}
@media (max-width:480px){
  .csa-footer{ padding:2.8rem 1.2rem 1.5rem; }
  .csa-footer-inner{ grid-template-columns:1fr; gap:1.8rem; padding-bottom:1.8rem; }
  .csa-footer-logo{ height:36px; }
  .csa-footer-leit{ font-size:1rem; }
  .csa-footer-siegel{ flex-direction:row; gap:.6rem; align-items:center; }
  .csa-footer-siegel .csa-siegel-gross,
  .csa-footer-siegel .csa-siegel-klein{ height:auto; width:calc(50% - .3rem); max-width:150px; }
  .csa-footer-bottom{ flex-direction:column; align-items:flex-start; gap:.5rem; font-size:.8rem; }
}

.csa-footer-logo{ height:42px; margin-bottom:1rem; }
.csa-footer-leit{ color:#fff; font-style:italic; font-size:1.1rem; margin-bottom:.5rem; }
.csa-footer-sub{ color:#8fa3b0; font-size:.92rem; max-width:380px; }

.csa-footer-h{ color:#fff; font-size:1.05rem; margin-bottom:1rem; font-weight:600; }
.csa-footer-list{ list-style:none; margin:0; padding:0; }
.csa-footer-list li{ margin-bottom:.6rem; }
.csa-footer-list a{ color:#aebfca; text-decoration:none; font-size:.95rem; }
.csa-footer-list a:hover{ color:var(--csa-turquoise); }

/* Adresse im dunklen Footer: helle Schrift sicherstellen
   (fwt-address bringt dunkle Standardfarbe mit – hier überschrieben) */
.csa-footer .csa-footer-adr{ font-size:.95rem; line-height:1.7; color:#aebfca; margin-bottom:1.2rem; }
.csa-footer .csa-footer-adr strong{ color:#fff; }

.csa-footer-siegel{ display:flex; flex-direction:column; gap:1rem; align-items:flex-start; }
.csa-footer-siegel img{ width:auto; }
.csa-siegel-gross{ height:150px; }
.csa-siegel-klein{ height:110px; }

.csa-footer-bottom{
  max-width:1140px; margin:1.8rem auto 0;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:.8rem;
  font-size:.85rem; color:#6d7f8d;
}