/* Unterseiten (Impressum, Datenschutz, 404) im Stil der Startseite „Athlet“ (Vorschlag 4):
   Navy-Leiste, Kopfband Kühlgrau mit breiten Versalien, Lesespalte auf Weiß, Pillen-Knopf, Fuß Tinte. */
:root{
  --grund:#E9ECF0; --weiss:#FFFFFF; --tinte:#0F1A30; --navy:#1B2A4A; --mint:#2FAE96; --mint-text:#167061;
  --schiefer:#4A5878; --flieder:#C3CCE0; --linie:#D5DBE6; --offen:#FFE08A;
  --font:'Mona Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --nav-h:68px; --rand:clamp(20px,5vw,80px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--weiss);color:var(--tinte);font:400 17px/1.65 var(--font);font-stretch:100%;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:3px solid var(--tinte);outline-offset:3px}
.nav :focus-visible,.fuss :focus-visible{outline-color:var(--mint)}

.knopf{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:44px;padding:0 20px;border-radius:999px;
  font:600 15px/1 var(--font);font-stretch:112%;text-decoration:none;white-space:nowrap;
  background:var(--mint);color:var(--tinte);transition:background-color .25s,color .25s}
.knopf:hover{background:#fff}
.nav .knopf{gap:0}

.nav{position:sticky;top:0;z-index:10;height:var(--nav-h);background:var(--navy);color:#fff;display:flex;align-items:center;gap:22px;
  padding:0 var(--rand)}
.logo-link{display:flex;align-items:center;gap:12px;text-decoration:none;margin-right:auto;min-height:48px}
.logo-link img{width:50px;height:32px}
.nav-name b{display:block;font:750 13.5px/1 var(--font);font-stretch:125%;letter-spacing:.06em;text-transform:uppercase}
.nav-name small{display:block;margin-top:5px;font:600 11px/1 var(--font);font-stretch:125%;letter-spacing:.1em;text-transform:uppercase;color:var(--flieder)}
.nav-zurueck{font:550 15px/1 var(--font);text-decoration:none;color:var(--flieder);padding:14px 0}
.nav-zurueck:hover{color:#fff}

.kopfband{background:var(--grund);color:var(--tinte);padding:clamp(56px,8vw,112px) var(--rand) clamp(44px,6vw,80px)}
.kopfband .innen{max-width:760px;margin:0 auto}
.kicker{display:flex;align-items:center;gap:10px;margin:0 0 18px;font:650 12.5px/1.3 var(--font);font-stretch:125%;letter-spacing:.09em;text-transform:uppercase;color:var(--schiefer)}
.kicker::before{content:"";width:10px;height:10px;border-radius:999px;background:var(--mint)}
.kopfband h1{margin:0;font:900 clamp(40px,7vw,84px)/1 var(--font);font-stretch:125%;text-transform:uppercase;letter-spacing:-.012em;text-wrap:balance}
.kopfband p{margin:18px 0 0;color:var(--schiefer);max-width:60ch}

.lesen{max-width:760px;margin:0 auto;padding:clamp(44px,6vw,80px) var(--rand) clamp(64px,8vw,112px)}
.lesen h2{margin:2.2em 0 .6em;font:850 clamp(24px,3vw,30px)/1.08 var(--font);font-stretch:125%;text-transform:uppercase;letter-spacing:-.005em}
.lesen h2:first-child{margin-top:0}
.lesen h3{margin:1.6em 0 .4em;font:720 20px/1.2 var(--font);font-stretch:112%}
.lesen p,.lesen li{max-width:68ch}
.lesen ul{padding-left:1.2em}
.lesen a{color:var(--mint-text);text-underline-offset:3px}
.angaben{display:grid;grid-template-columns:minmax(140px,220px) 1fr;gap:0;margin:0;border-top:2px solid var(--tinte)}
.angaben dt,.angaben dd{margin:0;padding:12px 0;border-bottom:1px solid var(--linie)}
.angaben dt{font:650 12.5px/1.6 var(--font);font-stretch:125%;letter-spacing:.09em;text-transform:uppercase;color:var(--schiefer);padding-right:16px;padding-top:15px}
@media (max-width:560px){
  .angaben{grid-template-columns:1fr}
  .angaben dt{border-bottom:0;padding-bottom:0}
  .nav-name small{display:none}
  .nav-zurueck{display:none}
  .nav .knopf .lang{display:none}
}
.offen{background:var(--offen);color:var(--tinte);padding:.05em .35em;font-weight:600;border-radius:2px;
  -webkit-box-decoration-break:clone;box-decoration-break:clone}
.hinweis-offen{margin:0 0 32px;padding:16px 18px;border-left:4px solid #E0B400;background:#FFF6D6;font-size:15px;border-radius:0 6px 6px 0}

.fuss{background:var(--tinte);color:#fff;padding:48px var(--rand) 28px}
.fuss .innen{max-width:1440px;margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:20px;align-items:end}
.fuss-marke{display:flex;align-items:center;gap:14px}
.fuss-marke img{width:56px;height:36px}
.fuss-marke b{display:block;font:800 15px/1 var(--font);font-stretch:125%;text-transform:uppercase;letter-spacing:.05em}
.fuss nav{display:flex;flex-wrap:wrap;gap:4px 24px;font-size:15px}
.fuss nav a{color:var(--flieder);text-decoration:none;padding:12px 0}
.fuss nav a:hover,.fuss nav a[aria-current="page"]{color:#fff}
.fuss-copy{grid-column:1/-1;margin:12px 0 0;padding-top:18px;border-top:1px solid rgba(195,204,224,.16);font-size:14px;color:var(--flieder)}
@media (max-width:700px){.fuss .innen{grid-template-columns:1fr}}
