/* Kopf und Fuß jeder Seite. Sie stehen hier einmal und nicht im Stil jeder einzelnen Seite, weil
   das Menü sonst in jeder Datei für sich geändert werden müsste. Das HTML dazu setzt
   website/rahmen.py ein. */
.kopf{display:flex;align-items:center;gap:8px 28px;padding-top:14px;padding-bottom:14px}
.kopf .marke{display:flex;align-items:center;gap:10px;min-height:44px;color:var(--ink);font-weight:700;font-size:19px;letter-spacing:-.01em}
.kopf .marke:hover{text-decoration:none}
.kopf .kopfnav{display:flex;align-items:center;gap:0 24px;margin-left:auto;font-size:15px}
.kopf .kopfnav a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink-2);font-weight:500;white-space:nowrap}
.kopf .kopfnav a:hover{color:var(--ink);text-decoration:none}
.kopf .kopfnav a[aria-current]{color:var(--ink);font-weight:600}
.kopf .kopfknopf{display:inline-flex;align-items:center;min-height:40px;padding:0 18px;border-radius:999px;background:var(--akzent);color:#fff;font-size:15px;font-weight:600;white-space:nowrap}
.kopf .kopfknopf:hover{background:var(--akzent-tief);color:#fff;text-decoration:none}
/* Am Telefon passen vier Links und der Knopf nicht in eine Zeile: Marke und Knopf stehen oben,
   die Links in einer eigenen Zeile darunter. */
@media (max-width:760px){
  .kopf{flex-wrap:wrap}
  .kopf .kopfknopf{margin-left:auto}
  .kopf .kopfnav{order:3;flex:1 0 100%;margin-left:0;gap:0 12px;justify-content:space-between;font-size:14px;overflow-x:auto;scrollbar-width:none}
  .kopf .kopfnav::-webkit-scrollbar{display:none}
}
/* Auf den schmalsten Telefonen (375 breit) wäre der letzte Link sonst abgeschnitten. */
@media (max-width:389px){
  .kopf .kopfnav{font-size:13px}
}

.fuss{padding-bottom:40px}
.fuss .fuss-spalten{display:flex;flex-wrap:wrap;gap:28px 72px;border-top:1px solid var(--linie);padding-top:36px}
.fuss nav{display:flex;flex-direction:column;min-width:150px}
.fuss h2{margin:0 0 8px;font-size:13px;line-height:1.4;letter-spacing:0;font-weight:600;color:var(--ink-3)}
.fuss nav a{display:inline-flex;align-items:center;min-height:32px;font-size:15px;color:var(--ink-2)}
.fuss nav a:hover{color:var(--ink);text-decoration:none}
.fuss .fuss-stand{margin:32px 0 0;font-size:14px;color:var(--ink-3)}
@media print{
  .kopf .kopfnav,.kopf .kopfknopf,.fuss .fuss-spalten{display:none}
}