/* Vitren · Rechts-Seiten (Impressum, Datenschutz) #805. Tokens wie index.html. */
:root{
  --travertin:#EEE7DB;--travertin-2:#E4DACA;--creme:#F7F2E9;--tinte:#17171A;--tinte-2:#46433D;--tinte-3:#655F55;
  --lapis:#1E3B87;--messing:#C9A45C;--linie:rgba(23,23,26,.14);--ease:cubic-bezier(.16,1,.3,1);--g:clamp(20px,3.4vw,52px)
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--travertin);color:var(--tinte);-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:'Archivo',system-ui,sans-serif;font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;background:var(--travertin)}
::selection{background:#E9CF93}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
a:focus-visible,button:focus-visible{outline:2px solid var(--tinte);outline-offset:3px;border-radius:6px}

/* Kopf */
.kopf{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px var(--g);background:rgba(238,231,219,.86);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 1px 0 var(--linie)}
.marke{display:inline-flex;align-items:center;gap:12px;text-decoration:none}
.marke img{height:34px;width:auto;display:block}
.marke span{font-family:'Tenor Sans',sans-serif;font-size:1.02rem;letter-spacing:.32em}
.wahl{display:flex;gap:6px;padding:4px;border-radius:999px;background:var(--creme);box-shadow:inset 0 0 0 1px var(--linie)}
.wahl a{display:block;padding:7px 14px;border-radius:999px;text-decoration:none;font-size:.9rem;font-weight:500;color:var(--tinte-2);transition:background .4s var(--ease),color .4s var(--ease)}
.wahl a:hover{color:var(--tinte)}
.wahl a[aria-current]{background:var(--tinte);color:var(--creme)}

/* Held */
.held{position:relative;padding:clamp(48px,11vh,120px) var(--g) clamp(36px,7vh,72px);overflow:hidden}
.held__ober{font-family:'Tenor Sans',sans-serif;font-size:.8rem;letter-spacing:.42em;text-transform:uppercase;color:var(--tinte-3)}
.held h1{margin-top:.35em;font-stretch:125%;font-weight:560;text-transform:uppercase;letter-spacing:-.025em;line-height:.92;font-size:clamp(2.7rem,9vw,7.2rem)}
.held__lead{max-width:40ch;margin-top:1.1em;font-size:clamp(1.05rem,1.6vw,1.25rem);color:var(--tinte-2)}
.held__stand{margin-top:1.4em;font-size:.86rem;color:var(--tinte-3)}
.held__zeichen{position:absolute;right:calc(var(--g) * -.4);top:50%;height:min(92%,520px);transform:translateY(-50%);opacity:.06;pointer-events:none}
.linie{height:1px;margin:0 var(--g);background:linear-gradient(90deg,transparent,var(--messing),transparent)}

/* Raster: links Halt (Karte / Inhaltsverzeichnis), rechts Text */
.raster{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,720px);gap:clamp(28px,6vw,96px);padding:clamp(36px,7vh,80px) var(--g) clamp(60px,10vh,120px)}
.halt{position:sticky;top:96px;align-self:start}
.karte{padding:22px 24px;border-radius:20px;background:var(--creme);box-shadow:inset 0 0 0 1px rgba(23,23,26,.07),0 18px 40px -30px rgba(23,23,26,.45)}
.karte__name{font-family:'Tenor Sans',sans-serif;letter-spacing:.24em;text-transform:uppercase;font-size:1.05rem}
.karte p{margin-top:.55em;color:var(--tinte-2);font-size:.96rem}
.karte a{text-decoration:none;font-weight:500;color:var(--tinte)}
.karte a:hover{text-decoration:underline}
.inhalt{list-style:none;counter-reset:n;display:grid;gap:2px;font-size:.92rem}
.inhalt__kopf{font-family:'Tenor Sans',sans-serif;font-size:.74rem;letter-spacing:.36em;text-transform:uppercase;color:var(--tinte-3);margin-bottom:10px}
.inhalt a{display:flex;gap:10px;padding:6px 10px;border-radius:10px;text-decoration:none;color:var(--tinte-2);transition:background .3s var(--ease),color .3s var(--ease)}
.inhalt a:hover,.inhalt a.an{background:var(--creme);color:var(--tinte)}
.inhalt a span{font-family:'Tenor Sans',sans-serif;color:var(--messing);min-width:1.6em}

/* Text */
.text section{scroll-margin-top:96px;padding-top:clamp(26px,4vh,40px)}
.text section+section{margin-top:clamp(26px,4vh,40px);border-top:1px solid var(--linie)}
.text section:first-child{padding-top:0}
.text h2{display:flex;gap:14px;align-items:baseline;font-size:clamp(1.15rem,1.8vw,1.4rem);font-weight:600;letter-spacing:-.01em;line-height:1.25}
.text h2 .nr{font-family:'Tenor Sans',sans-serif;font-weight:400;color:var(--messing);font-size:.9em;min-width:1.7em}
.text h3{margin-top:1.3em;font-size:1rem;font-weight:600}
.text p,.text li{color:var(--tinte-2)}
.text p{margin-top:.7em}
.text ul{margin-top:.6em;padding-left:1.2em;display:grid;gap:.3em}
.text li::marker{color:var(--messing)}
.text strong{color:var(--tinte);font-weight:600}
.kasten{margin-top:1em;padding:18px 20px;border-radius:16px;background:var(--creme);box-shadow:inset 0 0 0 1px rgba(23,23,26,.07)}
.kasten p:first-child{margin-top:0}
.schalter{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:12px}
.knopf{font:inherit;font-size:.95rem;font-weight:500;border:0;cursor:pointer;border-radius:999px;padding:11px 20px;background:var(--tinte);color:var(--creme);transition:transform .4s var(--ease),background .4s var(--ease)}
.knopf:hover{transform:translateY(-1px)}
.knopf--leer{background:transparent;color:var(--tinte);box-shadow:inset 0 0 0 1px rgba(23,23,26,.3)}
.status{font-size:.9rem;color:var(--tinte-3)}

/* Fuss */
.fuss{background:var(--tinte);color:var(--creme);padding:clamp(48px,9vh,96px) var(--g) 28px;border-radius:clamp(28px,4vw,56px) clamp(28px,4vw,56px) 0 0}
.fuss__wort{font-family:'Tenor Sans',sans-serif;letter-spacing:.18em;font-size:clamp(3rem,13vw,10rem);line-height:.9;color:rgba(247,242,233,.92)}
.fuss__zeile{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 28px;margin-top:clamp(28px,5vh,48px);padding-top:18px;border-top:1px solid rgba(247,242,233,.16);font-size:.9rem;color:rgba(247,242,233,.7)}
.fuss__zeile nav{display:flex;flex-wrap:wrap;gap:8px 22px}
.fuss a{text-decoration:none}
.fuss a:hover{color:var(--creme);text-decoration:underline}

@media (max-width:860px){
  .raster{grid-template-columns:1fr}
  .halt{position:static}
  .inhalt{grid-template-columns:1fr 1fr}
  .held__zeichen{height:60%;right:-12%;top:58%}
}
@media (max-width:520px){
  body{font-size:16px}
  .kopf{padding:12px 16px}
  .marke span{display:none}
  .inhalt{grid-template-columns:1fr}
  .raster,.held{padding-left:16px;padding-right:16px}
  .linie{margin:0 16px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
