/* ============ KLINKERBOX · UNTERSEITEN (Impressum, Datenschutz, 404) ============ */
/* Baut auf den Tokens aus style.css auf — style.css wird zuerst eingebunden. */

.page{max-width:760px;margin:0 auto;padding:calc(var(--nav-h) + 3.5rem) clamp(20px,5vw,48px) 5rem}
.page__back{display:inline-flex;align-items:center;gap:.45rem;color:var(--ink-soft);
  font-size:.9rem;margin-bottom:2.2rem;border-bottom:1px solid transparent;transition:color .2s var(--ease)}
.page__back:hover{color:var(--clay)}
.page__back:focus-visible{outline:2px solid var(--clay);outline-offset:3px;border-radius:4px}

.page h1{font-family:'Bricolage Grotesque',serif;font-weight:500;line-height:1.1;
  font-size:clamp(2rem,5vw,3rem);letter-spacing:-.02em;margin-bottom:.9rem}
.page__lead{color:var(--ink-soft);font-size:1.05rem;margin-bottom:2.8rem}
.page h2{font-family:'Bricolage Grotesque',serif;font-weight:500;font-size:1.3rem;
  letter-spacing:-.01em;margin:2.6rem 0 .7rem}
.page h3{font-size:1rem;font-weight:600;margin:1.6rem 0 .4rem}
.page p, .page li{color:var(--ink-soft)}
.page p{margin-bottom:.9rem}
.page ul{margin:0 0 1rem 1.15rem}
.page li{margin-bottom:.35rem}
.page a:not(.page__back):not(.btn){color:var(--clay);border-bottom:1px solid rgba(176,73,47,.35)}
.page a:not(.page__back):not(.btn):hover{border-bottom-color:var(--clay)}
.page a:focus-visible{outline:2px solid var(--clay);outline-offset:2px;border-radius:3px}
.page strong{color:var(--ink);font-weight:600}

.page__box{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.4rem 1.5rem;margin:1.2rem 0 2rem;box-shadow:var(--shadow-s)}
.page__box p:last-child{margin-bottom:0}

/* Offener Punkt, der vor dem Livegang zu fuellen ist */
.page__todo{background:#fff8f963;border:1px dashed var(--clay);border-radius:12px;
  padding:.9rem 1.1rem;margin:1.1rem 0;font-size:.92rem}
.page__todo strong{color:var(--clay)}

.page__updated{margin-top:3rem;padding-top:1.2rem;border-top:1px solid var(--line);
  font-size:.85rem;color:var(--ink-soft)}

/* 404 */
.nf{min-height:100svh;display:grid;place-items:center;text-align:center;padding:2rem}
.nf__code{font-family:'Bricolage Grotesque',serif;font-size:clamp(4rem,14vw,8rem);
  line-height:1;color:var(--clay);margin-bottom:.4rem}
.nf__links{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center;margin-top:2rem}
.nf__links a{border:1px solid var(--line);border-radius:999px;padding:.6rem 1.2rem;
  font-size:.92rem;background:var(--white);transition:border-color .2s var(--ease),color .2s var(--ease)}
.nf__links a:hover{border-color:var(--clay);color:var(--clay)}
.nf__links a:focus-visible{outline:2px solid var(--clay);outline-offset:2px}