/* ============================================================
   Kanzlei1848 – Grundsystem (Redesign Etappe 1, Stand 02.10.2026)
   Wird auf ALLEN Seiten nach site.css geladen und überschreibt
   gezielt: Schrift, Kopfzeile, Fußzeile, Buttons, mobile
   Schnellkontaktleiste. Seiteneigene Layouts der Unterseiten
   bleiben bis zu den folgenden Etappen unverändert.
   ============================================================ */

/* --- Schrift: Source Sans 3, lokal gehostet (SIL OFL 1.1, Lizenz in /assets/fonts/) --- */
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:300;font-display:swap;src:url("/assets/fonts/source-sans-3-light.woff2") format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/source-sans-3-regular.woff2") format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/source-sans-3-semibold.woff2") format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/source-sans-3-bold.woff2") format("woff2")}

:root{
  --k-brand:#07708c;
  --k-brand-deep:#055a70;
  --k-brand-ink:#04495b;
  --k-ink:#10232a;
  --k-night:#0d252d;
  --k-night-deep:#0a1f26;
  --k-rule:#d7e0e4;
  --k-on-soft:rgba(255,255,255,.8);
  --k-on-rule:rgba(255,255,255,.22);
  --k-phone:#298707;
  --k-phone-deep:#1f6a05;
  --k-sans:"Source Sans 3","Segoe UI",system-ui,-apple-system,sans-serif;
  --k-radius:4px;
  --k-ease:cubic-bezier(.2,.7,.2,1);
}
body{font-family:var(--k-sans)}
/* Sticky-Fix: overflow-x:hidden auf html/body (site.css) macht body zum
   Scroll-Container, dadurch blieb die Kopfzeile am Desktop nicht oben stehen.
   "clip" verhindert seitliches Scrollen ebenso, ohne Sticky zu stören. */
html,body{overflow-x:clip}
button,input,select,textarea{font-family:inherit}

/* --- Kopfzeile --- */
.topbar{background:var(--k-brand);box-shadow:none;transition:transform .22s ease,box-shadow .3s ease}
.topbar.is-scrolled{box-shadow:0 1px 0 rgba(0,0,0,.08),0 8px 24px rgba(4,52,66,.18)}
.topbar .topbar-inner{min-height:68px;gap:24px;transition:min-height .3s var(--k-ease)}
.topbar .brand-logo{width:214px;max-width:56vw;transition:width .3s var(--k-ease)}
.topbar .main-nav{display:flex;align-items:center;gap:24px;font-size:15px;font-weight:600;white-space:nowrap}
.topbar .main-nav a{position:relative;color:#fff;opacity:1;text-decoration:none;padding-block:6px}
.topbar .main-nav a:not(.nav-mandat)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:#fff;transform:scaleX(0);transform-origin:0 50%;transition:transform .25s var(--k-ease)}
.topbar .main-nav a:not(.nav-mandat):hover{opacity:1}
.topbar .main-nav a:not(.nav-mandat):hover::after,.topbar .main-nav a[aria-current="page"]::after{transform:scaleX(1)}
.topbar .main-nav .nav-mandat{min-height:0;padding:7px 14px;border:1px solid rgba(255,255,255,.85);border-radius:var(--k-radius);background:transparent;color:#fff;font-weight:600}
.topbar .main-nav .nav-mandat:hover{background:#fff;color:var(--k-brand);opacity:1}
.scroll-progress{position:absolute;left:0;bottom:0;width:100%;height:2px;background:rgba(255,255,255,.85);transform-origin:0 50%;transform:scaleX(0);pointer-events:none}
.menu-toggle{display:none;background:none;border:0;color:#fff;cursor:pointer;padding:8px;margin-right:-8px}
.menu-toggle span{display:block;width:22px;height:2px;background:currentColor;margin:5px 0;transition:transform .3s var(--k-ease),opacity .2s}
.topbar.menu-open .menu-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.topbar.menu-open .menu-toggle span:nth-child(2){opacity:0}
.topbar.menu-open .menu-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(min-width:981px){
  .topbar.is-scrolled .topbar-inner{min-height:56px}
  .topbar.is-scrolled .brand-logo{width:184px}
}
@media(max-width:1100px){.topbar .main-nav{gap:16px}}
@media(max-width:980px){
  .topbar .topbar-inner{flex-wrap:nowrap;min-height:64px;padding:0}
  .menu-toggle{display:block}
  .topbar .main-nav{display:none;position:absolute;left:0;right:0;top:100%;width:auto;flex-direction:column;align-items:stretch;gap:0;padding:6px 20px 18px;background:var(--k-brand-ink);font-size:16px;white-space:normal;overflow:visible;box-shadow:0 18px 30px rgba(3,40,52,.25)}
  .topbar.menu-open .main-nav{display:flex}
  .topbar .main-nav a{padding:13px 0;border-bottom:1px solid var(--k-on-rule)}
  .topbar .main-nav a:not(.nav-mandat)::after{display:none}
  .topbar .main-nav .nav-mandat{margin-top:14px;padding:12px 14px;text-align:center;justify-content:center;font-size:16px}
  .topbar.menu-open.is-hidden{transform:none}
}
@media(max-width:660px){
  .topbar .topbar-inner{min-height:60px}
  .topbar .brand-logo{width:190px}
  .topbar .main-nav{padding-left:14px;padding-right:14px}
}

/* --- Überzeilen ohne Großbuchstaben (nie "KANZLEI1848") --- */
.eyebrow,.knowledge-card .kicker,.job-fact-label{text-transform:none;letter-spacing:0;font-weight:600}
.eyebrow{font-size:15px}

/* --- Buttons (alle Seiten) --- */
.btn{border-radius:var(--k-radius);border-width:1px;font-weight:700;letter-spacing:0}
.btn:hover{transform:none;box-shadow:none}
.btn-primary:hover{background:var(--k-brand-deep);border-color:var(--k-brand-deep);color:#fff}
.btn-secondary:hover{background:var(--k-brand);border-color:var(--k-brand);color:#fff}

/* --- Fußzeile --- */
footer{background:var(--k-night-deep);border-top:0;color:rgba(255,255,255,.72);padding:28px 0 30px;font-size:15px}
footer .footer-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr);gap:28px 40px;padding:8px 0 22px}
footer .footer-name{color:#fff;font-size:17px;font-weight:700;margin-bottom:6px}
footer .footer-address p{margin:0 0 10px;line-height:1.55}
footer .footer-hours span{display:block}
footer .footer-col{display:flex;flex-direction:column;gap:5px;align-items:flex-start}
footer .footer-head{color:#fff;font-weight:600;margin-bottom:4px}
footer a{color:rgba(255,255,255,.72);font-weight:400;text-decoration:none}
footer a:hover{color:#fff;text-decoration:underline}
footer .footer-legal{display:flex;flex-wrap:wrap;gap:6px 22px;padding-top:16px;border-top:1px solid rgba(255,255,255,.14);font-size:14px}
@media (max-width:760px){footer .footer-grid{grid-template-columns:1fr 1fr}footer .footer-address{grid-column:1/-1}}
footer a:focus-visible{outline-color:#fff}

/* --- Mobile Schnellkontaktleiste --- */
@media(max-width:760px){
  .mobile-action-bar{background:#fff;border-top:1px solid var(--k-rule);box-shadow:0 -8px 24px rgba(4,52,66,.12)}
  .mobile-action-bar a{border-radius:var(--k-radius);font-weight:700}
  .mobile-action-primary{background:var(--k-brand);color:#fff}
  .mobile-action-phone{background:var(--k-phone);color:#fff}
}

@media(prefers-reduced-motion:reduce){
  .topbar,.topbar .topbar-inner,.topbar .brand-logo,.topbar .main-nav a::after,.menu-toggle span{transition:none}
}

.skip-link{position:absolute;left:12px;top:-60px;z-index:1000;background:#fff;color:var(--k-brand);padding:10px 16px;border-radius:6px;font-weight:600;box-shadow:0 2px 10px rgba(0,0,0,.2)}
.skip-link:focus{top:12px}