/* köhler Footer v1.3 (03.11.2026): Headline „köhler. / Klinker zum Anfassen“, Schrift so, dass die zweite Zeile ohne Umbruch passt.
   köhler Footer v1.2 (03.11.2026): Anfahrtskarte entfernt.
   köhler Footer v1.1 (03.11.2026): Wortzeichen vollständig, nicht mehr angeschnitten.
   köhler Footer v1.0 (03.11.2026), Richtung B „Einladung in den Showroom“.
   Alles unter .kf gekapselt. Nutzt aus megamenu.css: Ubuntu 500, .kh-mark (weißer Marker), .mm-hours (Öffnungszeiten).
   Raster wie die Split-Panels des Mega-Menüs: max. 1680 px, Rand --g, linke Spalte minmax(300px,36%). */

.kf{
  --schwarz:#070709;
  --weiss:#ffffff;
  --grau:rgba(255,255,255,.62);
  --grau2:rgba(255,255,255,.45);
  --linie:rgba(255,255,255,.16);
  --g:clamp(16px,2.1vw,30px);
  --ease:cubic-bezier(.2,.7,.2,1);
  display:block;margin:0;padding:0;border:0;
  background:var(--schwarz);color:var(--weiss);
  font-family:"Ubuntu",system-ui,sans-serif;font-size:16px;line-height:1.4;text-align:left;
  -webkit-font-smoothing:antialiased;
}
.kf,.kf *,.kf *::before,.kf *::after{box-sizing:border-box}
.kf p,.kf ul,.kf h2,.kf address{margin:0;padding:0}
.kf ul{list-style:none}
.kf li{margin:0;padding:0;list-style:none}
.kf li::before{content:none}
.kf a{color:inherit;text-decoration:none;border:0;background:none}
.kf img,.kf svg{display:block;max-width:100%;border:0}
.kf :focus-visible{outline:2px solid var(--weiss);outline-offset:4px}
.kf-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.kf-in{max-width:1680px;margin:0 auto;padding:0 var(--g)}

/* ---------- Bühne ---------- */
.kf-stage{display:grid;grid-template-columns:minmax(300px,36%) 1fr;column-gap:clamp(24px,3vw,56px);padding:clamp(56px,6vw,88px) 0 clamp(48px,5vw,72px)}
.kf-visit{display:flex;flex-direction:column;min-width:0}
.kf-kicker{font-size:13px;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--grau);margin-bottom:22px!important}
.kf-titel{font-family:inherit;font-size:clamp(36px,3.6vw,58px);font-weight:300;line-height:1.04;letter-spacing:-.01em;color:var(--weiss);text-wrap:balance}
.kf-addr{font-style:normal;font-size:15px;font-weight:300;line-height:1.55;color:var(--grau);margin-top:26px!important}
.kf-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.kf .kf-btn{display:inline-flex;align-items:center;justify-content:center;line-height:1.2;padding:.73em 1.35em .67em;border:2px solid var(--weiss);border-radius:0;font-size:15px;font-weight:500;color:var(--weiss)!important;background:transparent;white-space:nowrap;transition:background-color .3s,color .3s}
.kf .kf-btn:hover,.kf .kf-btn:focus-visible{background:var(--weiss);color:var(--schwarz)!important}
.kf .kf-btn--voll{background:var(--weiss);color:var(--schwarz)!important}
.kf .kf-btn--voll:hover,.kf .kf-btn--voll:focus-visible{background:transparent;color:var(--weiss)!important}
.kf-info{margin-top:auto;padding-top:40px}
.kf .mm-hours{margin-top:0}
.kf .mm-hours strong{display:block;color:var(--weiss);font-weight:500}
.kf .mm-hours-r{color:var(--grau);font-weight:300}
.kf-photo{position:relative;min-height:440px;overflow:hidden;border-radius:2px;background:#111}
.kf-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 55%}

/* ---------- Sitemap ---------- */
.kf-map-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px clamp(20px,2vw,32px);padding:40px 0 48px;border-top:1px solid var(--linie)}
.kf-h{font-size:15px;font-weight:500;margin-bottom:14px!important}
.kf-col li{margin-bottom:9px}
.kf-col li a{font-size:14.5px;font-weight:300;line-height:1.3;color:var(--grau);transition:color .3s}
.kf-col a .kh-mark{display:inline-block}
.kf-col a:hover,.kf-col a:focus-visible{color:var(--schwarz)}
.kf-col a:hover .kh-mark::after,.kf-col a:focus-visible .kh-mark::after{clip-path:inset(0 0 0 0)}
.kf-h a:hover,.kf-h a:focus-visible{color:var(--schwarz)}
.kf-col a:focus-visible{outline:0}
.kf-ext{display:inline-block!important;width:.6em;height:.6em;margin-left:.3em;vertical-align:.1em}

/* ---------- Wortzeichen ---------- */
.kf-wm{width:min(100%,820px);color:var(--linie);margin:8px 0 clamp(32px,3.5vw,56px)}
.kf-wm svg{width:100%;height:auto}

/* ---------- Rechtliches ---------- */
.kf-legal{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;padding:22px 0 26px;border-top:1px solid var(--linie);font-size:13px;font-weight:300;color:var(--grau)}
.kf-legal-nav{display:flex;flex-wrap:wrap;gap:6px 22px}
.kf-legal a,.kf-legal button{color:var(--grau);font:inherit;background:none;border:0;padding:0;cursor:pointer;transition:color .3s}
.kf-legal a:hover,.kf-legal a:focus-visible,.kf-legal button:hover,.kf-legal button:focus-visible{color:var(--weiss)}
.kf-legal [hidden]{display:none!important}
.kf-top{margin-left:auto}

/* ---------- Tablet ---------- */
@media (max-width:1099.98px){
  .kf-stage{grid-template-columns:1fr;row-gap:36px}
  .kf-info{margin-top:36px;padding-top:0}
  .kf-photo{min-height:0;aspect-ratio:16/10;order:-1}
  .kf-map-nav{grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* ---------- Handy ---------- */
@media (max-width:699.98px){
  .kf-titel{font-size:36px}
  .kf-btns{flex-direction:column;align-items:stretch}
  .kf-photo{aspect-ratio:4/3}
  .kf-map-nav{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}
  .kf-wm{margin-top:0}
  .kf-legal{flex-direction:column;align-items:flex-start}
  .kf-top{margin-left:0}
}
@media (prefers-reduced-motion:reduce){
  .kf *{transition:none!important}
}
.kf-col a:hover .kf-ext,.kf-col a:focus-visible .kf-ext{color:var(--weiss)}
.kf-zaehler { color: var(--grau2) }