/* ============ ONF Tiefenrein – Rechtliche Seiten ============ */
/* Design-Tokens identisch zu index.html */
:root{
  --tanne:   #0D2F23;
  --tanne-2: #123B2C;
  --moos:    #1E7A4C;
  --limette: #C9F16A;
  --papier:  #F3F5EE;
  --weiss:   #FFFFFF;
  --tinte:   #14211A;
  --grau:    #4C5A50;
  --linie:   #DCE3D6;
  --radius:  18px;
  --font-display: "Anton","Arial Narrow",Impact,sans-serif;
  --font-body: "Archivo",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  color:var(--tinte);
  background:var(--papier);
  line-height:1.7;
  font-size:1.0625rem;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:var(--moos);text-decoration:underline;text-underline-offset:2px}
a:hover{color:var(--tanne)}
ul{list-style:none}
:focus-visible{outline:3px solid var(--moos);outline-offset:3px;border-radius:4px}

.wrap{max-width:820px;margin-inline:auto;padding-inline:clamp(20px,4vw,40px)}

/* ---------- Kopfzeile ---------- */
.legal-header{
  background:var(--tanne);
  color:var(--papier);
  padding-block:18px;
  position:sticky;top:0;z-index:20;
}
.legal-header .wrap{
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
}
.legal-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.legal-brand img{width:44px;height:44px;border-radius:10px;background:var(--weiss)}
.legal-brand b{font:1.15rem/1.1 var(--font-body);font-weight:800;letter-spacing:-.01em}
.legal-brand span{display:block;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--limette);font-weight:700}
.legal-back{
  color:var(--papier);text-decoration:none;font-weight:600;font-size:.95rem;
  border:1.5px solid rgba(243,245,238,.35);border-radius:999px;padding:9px 18px;
  transition:background .2s,border-color .2s;
}
.legal-back:hover{background:rgba(243,245,238,.12);border-color:var(--papier);color:var(--papier)}

/* ---------- Inhalt ---------- */
.legal-main{padding-block:clamp(48px,7vw,84px)}
.legal-main h1{
  font:400 clamp(2.1rem,5.5vw,3.2rem)/1.05 var(--font-display);
  text-transform:uppercase;letter-spacing:.01em;
  color:var(--tanne);margin-bottom:10px;
}
.legal-lead{color:var(--grau);margin-bottom:44px;font-size:1.05rem}
.legal-main h2{
  font:800 1.28rem/1.3 var(--font-body);
  color:var(--tanne);margin-top:44px;margin-bottom:14px;
  padding-top:22px;border-top:2px solid var(--linie);
}
.legal-main h2:first-of-type{border-top:none;padding-top:0}
.legal-main h3{font:700 1.02rem/1.4 var(--font-body);color:var(--tanne);margin-top:26px;margin-bottom:8px}
.legal-main p{margin-bottom:14px;color:var(--grau)}
.legal-main p strong,.legal-main li strong{color:var(--tinte)}
.legal-main ul{margin:0 0 16px;padding-left:0}
.legal-main li{
  position:relative;padding-left:24px;margin-bottom:9px;color:var(--grau);
}
.legal-main li::before{
  content:"";position:absolute;left:4px;top:.68em;
  width:7px;height:7px;border-radius:50%;background:var(--limette);
  outline:1.5px solid var(--moos);
}

/* Adress-/Kontaktblock */
.legal-card{
  background:var(--weiss);border:1px solid var(--linie);border-radius:var(--radius);
  padding:24px 26px;margin-bottom:20px;
}
.legal-card p{margin-bottom:6px;color:var(--tinte)}
.legal-card p:last-child{margin-bottom:0}

/* Platzhalter, die noch ergänzt werden müssen */
.todo{
  background:#FFF4D6;color:#6B4E00;
  border:1px dashed #C79A16;border-radius:6px;
  padding:1px 7px;font-weight:700;font-size:.94em;white-space:nowrap;
}

/* ---------- Fußzeile ---------- */
.site-footer{
  background:var(--tanne);color:rgba(243,245,238,.82);
  padding-block:34px;font-size:.92rem;
}
.footer-inner{display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center}
.site-footer a{color:rgba(243,245,238,.82);text-decoration:none}
.site-footer a:hover{color:var(--limette)}
.site-footer strong{color:var(--papier)}
.footer-tag{
  margin-left:auto;font-weight:700;color:var(--limette);
  letter-spacing:.08em;text-transform:uppercase;font-size:.78rem;
}
@media(max-width:640px){
  .footer-tag{margin-left:0;width:100%}
  .legal-header .wrap{gap:12px}
}