/* Rechtsseiten: Tokens und Schriften aus tokens.css (brand/system/tokens.css, web/sync-tokens.sh). */
*{box-sizing:border-box}
:root{--btn-h:40px;--btn-h-klein:32px;--btn-px:16px;--btn-px-klein:12px;--btn-kante:3px}
html{scroll-padding-top:80px}
body{background:var(--nacht);color:var(--text);font:16px/1.6 var(--f-text);margin:0;-webkit-text-size-adjust:100%;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
main{flex:1 0 auto;width:100%;max-width:720px;margin:0 auto;padding:48px 16px 0}
main:focus{outline:0}
footer{flex-shrink:0}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--nacht);color:var(--text);padding:8px 14px;border-radius:10px}
.skip:focus{left:8px}
.wrap{width:100%;max-width:1120px;margin:0 auto;padding-inline:clamp(16px,4vw,32px)}
h1{font-family:var(--f-titel);font-weight:400;font-size:30px;line-height:1.1;margin:0 0 8px;overflow-wrap:break-word;hyphens:auto}
@media (max-width:480px){h1{font-size:24px}}
h2{font-size:19px;margin:32px 0 6px}
p,li{color:var(--grau-hell)}
a{color:var(--text)}
:focus-visible{outline:3px solid var(--kd);outline-offset:3px}
.offen{background:var(--bald);padding:14px 16px;color:var(--bald-text);font-weight:600;border-radius:var(--r-knopf);box-shadow:inset 0 -3px 0 color-mix(in oklab,var(--bald) 72%,#000)}
mark{background:var(--linie);color:var(--text);padding:0 4px;border-radius:var(--r-klein)}
address{font-style:normal;color:var(--text);line-height:1.75}
ul{padding-left:20px}

/* Knöpfe (wie Startseite; Eckenschnitt s aus tokens.css) */
.btn{--btn-f:var(--rot);--btn-u:var(--rot-unten);display:inline-flex;align-items:center;justify-content:center;gap:8px;height:var(--btn-h);padding:0 var(--btn-px) var(--btn-kante);font:600 15px/1 var(--f-text);color:#fff;background:var(--btn-f);border:0;box-shadow:inset 0 calc(-1 * var(--btn-kante)) 0 var(--btn-u);cursor:pointer;text-decoration:none;white-space:nowrap;transition:filter .1s,transform .08s}
.btn:hover{filter:brightness(1.1)}
.btn:active{box-shadow:none;padding-bottom:1px;transform:translateY(1px)}
.btn.ruhig{--btn-f:var(--linie);--btn-u:var(--schwarz)}
.btn.klein{--btn-kante:2px;height:var(--btn-h-klein);padding-inline:var(--btn-px-klein);font-size:13px;gap:6px}
.btn:focus-visible{outline-offset:-3px}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;filter:none;transform:none}
/* Kopf */
header{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--nacht) 92%,transparent);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-bottom:1px solid var(--linie);padding-top:env(safe-area-inset-top,0px)}
.kopf{display:flex;align-items:center;gap:28px;height:64px}
.kopf .marke{display:flex;flex:none}
.kopf .marke img{height:34px;width:auto;display:block}
nav.haupt{display:flex;gap:4px}
nav.haupt a{font-weight:500;font-size:15px;color:var(--grau-hell);text-decoration:none;padding:6px 10px;border-radius:var(--r-knopf)}
nav.haupt a:hover{color:#fff}
nav.haupt a[aria-current="page"]{color:#fff;background:var(--flaeche)}
.kopf .aktionen{margin-left:auto;display:flex;gap:8px;min-width:0;max-width:100%;align-items:center}
@media (max-width:640px){
  .kopf{flex-wrap:wrap;height:auto;padding-block:10px 6px;gap:8px 12px}
  .kopf .marke img{height:28px}
  nav.haupt{order:3;flex-basis:100%;min-width:0;margin-left:-10px;overflow-x:auto;scrollbar-width:none}
  nav.haupt a{flex:none}
  nav.haupt a{font-size:14px}
}
/* Fuß */
footer{margin-top:96px;border-top:1px solid var(--linie);padding-block:28px calc(48px + env(safe-area-inset-bottom,0px));color:var(--grau);font-size:14px}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between}
footer nav{display:flex;flex-wrap:wrap;gap:8px 16px}
footer nav a{display:inline-block;padding-block:2px}
footer a{text-decoration:none;color:inherit}
footer a:hover{color:#fff}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}