/* ---------------------------------------------------------------
   Gerster Select: Stylesheet für die Textseiten (Impressum, Datenschutz)
   Die Startseite bringt ihr eigenes, erweitertes CSS inline mit.

   Schrift: „Jost“ von Owen Earl, SIL Open Font License 1.1
   (siehe assets/fonts/OFL.txt). Bewusst self-hosted, kein
   Google-Fonts-CDN, damit keine IP-Adressen an Dritte gehen.
   --------------------------------------------------------------- */

@font-face{
  font-family:'Jost';font-style:normal;font-weight:200 600;font-display:swap;
  src:url('fonts/jost-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Jost';font-style:normal;font-weight:200 600;font-display:swap;
  src:url('fonts/jost-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  --ink:#353638;--paper:#f6f4f1;--muted:#7b7a78;
  --line:rgba(53,54,56,.14);--accent:#9b7f4e;
  --pad:clamp(1.5rem,5vw,5.5rem);--ease:cubic-bezier(.22,.61,.36,1);
}
:root[data-theme="dark"]{
  --ink:#eceae6;--paper:#1b1c1e;--muted:#93918d;
  --line:rgba(236,234,230,.16);--accent:#c8a86e;
}
@media (prefers-color-scheme:dark){
  :root[data-theme="auto"]{
    --ink:#eceae6;--paper:#1b1c1e;--muted:#93918d;
    --line:rgba(236,234,230,.16);--accent:#c8a86e;
  }
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:'Jost',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-weight:300;line-height:1.65;-webkit-font-smoothing:antialiased;
  transition:background .5s var(--ease),color .5s var(--ease);
}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
::selection{background:var(--accent);color:var(--paper)}
.wrap{width:100%;max-width:52rem;margin-inline:auto;padding-inline:var(--pad)}
.eyebrow{font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);font-weight:400}

/* ------------------------------- Kopf --------------------------------- */
.site-head{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:clamp(1rem,2.4vw,1.6rem) var(--pad);border-bottom:1px solid var(--line)
}
.brand img{height:clamp(20px,2.4vw,26px);width:auto}
.brand .on-dark{display:none}
:root[data-theme="dark"] .brand .on-light{display:none}
:root[data-theme="dark"] .brand .on-dark{display:block}
@media (prefers-color-scheme:dark){
  :root[data-theme="auto"] .brand .on-light{display:none}
  :root[data-theme="auto"] .brand .on-dark{display:block}
}
.back{
  font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  border-bottom:1px solid transparent;transition:border-color .3s
}
.back:hover{border-bottom-color:var(--accent)}

/* ------------------------------- Inhalt ------------------------------- */
main{padding-block:clamp(3.5rem,10vh,6.5rem) clamp(4rem,10vh,7rem)}
h1{
  font-weight:200;font-size:clamp(2.4rem,7vw,4.2rem);line-height:1;
  letter-spacing:-.02em;margin:1.2rem 0 0
}
.rule{height:1px;background:var(--line);margin:clamp(2.5rem,6vw,4rem) 0}
h2{
  font-weight:400;font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;
  color:var(--accent);margin:2.8rem 0 .7rem
}
h2:first-of-type{margin-top:0}
p{margin:0 0 1rem;max-width:62ch}
ul{margin:0 0 1rem;padding-left:1.1rem;max-width:62ch}
li{margin-bottom:.35rem}
address{font-style:normal}
strong{font-weight:400}
a.link{border-bottom:1px solid var(--line);transition:border-color .3s,color .3s}
a.link:hover{border-bottom-color:var(--accent);color:var(--accent)}
.small{font-size:.92rem;color:var(--muted)}
code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.86em;padding:.1em .35em;border-radius:3px;
  background:color-mix(in srgb,var(--ink) 7%,transparent)
}
.note{
  border-left:2px solid var(--accent);padding:.9rem 0 .9rem 1.1rem;
  margin:1.5rem 0;font-size:.92rem;color:var(--muted);max-width:62ch
}

/* ------------------------------- Fuß ---------------------------------- */
.site-foot{
  border-top:1px solid var(--line);padding-block:2.2rem 2.6rem;
  display:flex;flex-wrap:wrap;gap:.8rem 1.75rem;align-items:center;
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)
}
.site-foot .spacer{flex:1}
.site-foot a{transition:color .3s}
.site-foot a:hover{color:var(--accent)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important}
}