/* Kopf und Fuß der Website-Seiten (index.html, zwift-alternative.html, hilfe.html; scripts/site.mjs bettet die Datei ein) */
header nav .links{display:contents}
header .logo img{width:52px;height:52px}
@media (max-width:640px){
  header .wrap{flex-wrap:wrap;row-gap:2px}
  header .logo{margin-right:auto}
  header .logo span{display:none}header .logo img{width:44px;height:44px}
  header nav{display:contents}
  header nav .links{display:flex;gap:20px;order:3;flex:1 0 100%;overflow-x:auto;white-space:nowrap;padding:4px 0 6px;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
  header nav .links::-webkit-scrollbar{display:none}
  header nav .links a{font-size:15px}
}
footer{border-top:1px solid var(--line);padding:48px 0 32px;color:var(--muted);font-size:14px;line-height:1.5}
footer a{color:var(--muted);text-decoration:none}footer a:hover{color:var(--fg);text-decoration:underline}
.fcols{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:28px}
.fcols>div{display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.fcols>div>b{color:var(--fg);font-weight:600;margin-bottom:3px}
.fcols .logo{color:var(--fg);text-decoration:none;font-size:24px}.fcols .logo img{width:28px;height:28px}
.fcols p{margin:0}.fcols .social{display:flex;gap:14px}
.fbase{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:36px;padding-top:16px;border-top:1px solid var(--line)}
.fine{margin:14px 0 0;font-size:12px;opacity:.85}
@media (max-width:760px){.fcols{grid-template-columns:1fr 1fr;gap:28px 20px}.fcols>div:first-child{grid-column:1/-1}}
