/* Schriften, lokal – keine Anfrage an Google.
   Big Shoulders Display für Überschriften (hoch und schmal wie Zaunlatten),
   Public Sans für Fließtext und Maße. */
@font-face{font-family:'Shoulders';src:url(fonts/big-shoulders-display-latin.woff2) format('woff2');font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Shoulders';src:url(fonts/big-shoulders-display-latin-ext.woff2) format('woff2');font-weight:100 900;font-display:swap;unicode-range:U+0100-02AF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Public';src:url(fonts/public-sans-latin.woff2) format('woff2');font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Public';src:url(fonts/public-sans-latin-ext.woff2) format('woff2');font-weight:100 900;font-display:swap;unicode-range:U+0100-02AF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2C60-2C7F,U+A720-A7FF}

/* Anthrazit + Lärche: Anthrazit wie RAL 7016 an Doppelstabmatten und Toren,
   Lärche als warmer Holz-Akzent, Beton für helle Flächen. */
:root{
  --anthrazit:#383e42;
  --nacht:#23282b;
  --stahl:#6b7378;
  --beton:#e9e7e2;
  --kies:#cfccc4;
  --laerche:#c98a4b;
  --laerche-dunkel:#9a6332;
  --schrift:'Public',system-ui,-apple-system,'Segoe UI',sans-serif;
  --latte:'Shoulders','Arial Narrow',sans-serif;
  --mono:var(--schrift); /* früher Monospace – wirkte zu sehr nach Vorlage */
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--schrift);color:var(--nacht);background:var(--beton);font-size:17px;line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit}
.demoband{background:var(--nacht);color:#c3c8cb;font:12px/1.4 var(--schrift);text-align:center;padding:7px 16px;border-bottom:1px solid #000}
.demoband b{color:#fff;font-weight:600}
.demoband a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.knopf{display:inline-flex;align-items:center;gap:10px;font:700 17px/1 var(--schrift);text-decoration:none;padding:16px 22px;border-radius:2px;background:var(--laerche);color:var(--nacht);border:0;cursor:pointer}
.knopf:hover{background:#d99c5e}
.knopf:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--laerche);outline-offset:3px}