/* Footer im Stil „Footer with Suite“ (21st.dev) — eigene CSS-Adaption, kein React/Tailwind.
   Prinzip übernommen: 2 Spalten (Links | Text + Kontakt), Versal-Labels mit weitem Tracking,
   Riesen-Wortmarke, schmale Abschlusszeile mit Haarlinie.
   Angepasst: Schrift 14/15 px statt 11 px (Lesbarkeit 50+), Satoshi/Inter, Navy #243e59, Blau-Akzent im Hover.
   Footer-Reveal (sticky + --fp aus app.js) bleibt erhalten. */

.footer.of.fs{background:#edf2f6;color:#20364e;height:auto;min-height:0}
.fs .of-inner{height:auto;justify-content:flex-start;gap:0;padding-top:clamp(48px,6vw,88px);padding-bottom:0}

.fs-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
.fs-col{display:flex;flex-direction:column;align-items:flex-start}
.fs-gap{height:22px}
.fs a,.fs p{margin:0}
.fs-link,.fs-txt{font-family:Inter,system-ui,sans-serif;font-size:15px;line-height:1.5;letter-spacing:.12em;text-transform:uppercase;font-weight:500}
.fs-link{color:#20364e;padding:5px 0;transition:color .2s}
.fs-link:hover{color:var(--spark)}
.fs-txt{color:#20364e;max-width:34em}
.fs-mute{color:#7a8a9c}
.fs-cta{display:inline-flex;align-items:center;gap:10px;color:#243e59;border-bottom:1.5px solid #243e59;padding:4px 0}
.fs-cta:hover{color:var(--spark);border-color:var(--spark)}
.fs-cta svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fs-mail{word-break:break-all}

.fs-giant{margin:clamp(40px,5vw,72px) 0 clamp(8px,1.4vw,18px)}
.fs-giant img{display:block;width:100%;height:auto}

.fs-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;border-top:1px solid #cfd8e3;padding:16px 0 calc(18px + env(safe-area-inset-bottom,0px))}
.fs-bar p{font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:#7a8a9c}

@media (max-width:767px){
  .fs-grid{grid-template-columns:1fr;gap:28px}
  .fs-link,.fs-txt{font-size:14px;letter-spacing:.1em}
  .fs-link{min-height:44px;display:flex;align-items:center;padding:0}
  .fs-bar{flex-direction:column;align-items:flex-start;gap:6px}
  .fs-bar p{font-size:13px}
  .footer.of.fs{padding-bottom:84px} /* Platz für Sticky-CTA */
}
@media (min-width:1360px){.fs .of-inner{max-width:1320px}} /* bündig mit den 1320-px-Sektionen */

/* Parallax sichtbar machen: Seite hebt sich mit Schattenkante vom darunterliegenden Footer ab */
main{box-shadow:0 28px 56px -24px rgba(32,54,78,.28);border-radius:0 0 28px 28px}
#entwurf{border-radius:0 0 28px 28px}
@media (max-width:767px){main,#entwurf{border-radius:0 0 20px 20px}}
