/* ============================================================
   legal.css — nur für legal.html
   ============================================================ */

/* Titel */
.top{padding:clamp(48px,6vw,84px) 0 clamp(32px,4vw,48px);border-bottom:1px solid var(--sand-3)}
.eyebrow{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.2em;
  color:var(--persiana);margin:0 0 16px;display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--persiana)}
.top h1 em{font-style:normal;color:var(--buga-dark)}
.updated{font-family:var(--mono);font-size:.78rem;color:var(--gris);margin-top:18px}

/* Layout */
.cols{display:grid;grid-template-columns:220px 1fr;gap:clamp(32px,5vw,72px);
  padding-block:clamp(40px,5vw,64px) clamp(64px,8vw,110px);align-items:start}
.toc{position:sticky;top:96px}
.toc ol{list-style:none;padding:0;margin:0;display:grid;gap:1px}
.toc li{margin:0}
.toc a{display:flex;gap:10px;text-decoration:none;color:var(--gris);font-size:.92rem;padding:8px 0;
  border-bottom:1px solid var(--sand-3)}
.toc a:hover{color:var(--tinta)}
.toc .n{font-family:var(--mono);font-size:.74rem;color:var(--buga);padding-top:3px}

article{max-width:74ch}
.sec{padding-top:clamp(36px,4vw,54px);scroll-margin-top:96px}
.sec:first-child{padding-top:0}
.sec__n{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--buga);margin-bottom:12px}
.sec h2{margin-bottom:20px}
.sec h3{margin:28px 0 10px}
.sec p,.sec li{color:#26332F}

/* Datenblock */
.data{display:grid;gap:1px;background:var(--sand-3);border:1px solid var(--sand-3);margin-bottom:24px}
.data__r{background:var(--blanco);display:grid;grid-template-columns:190px 1fr;gap:16px;padding:14px 18px}
.data__k{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gris);padding-top:3px}
.data__v{font-size:.97rem}

.callout{background:var(--sand-2);border-left:3px solid var(--persiana);padding:18px 22px;margin:24px 0;font-size:.95rem}
.callout p:last-child{margin-bottom:0}
.callout--warn{border-left-color:var(--buga)}

/* Fuß */
.ftr{background:var(--mar);color:rgba(251,250,246,.62);padding-block:clamp(40px,5vw,60px);font-size:.88rem}
.ftr a{color:rgba(251,250,246,.62);text-decoration:none}
.ftr a:hover{color:var(--blanco)}
.ftr__in{display:flex;flex-wrap:wrap;gap:14px 26px;justify-content:space-between;align-items:center}

@media (max-width:900px){
  .cols{grid-template-columns:1fr;gap:32px}
  .toc{position:static;border-bottom:1px solid var(--sand-3);padding-bottom:8px}
  .toc ol{grid-template-columns:repeat(2,1fr);display:grid;gap:0 20px}
}
@media (max-width:620px){
  .data__r{grid-template-columns:1fr;gap:4px}
  .toc ol{grid-template-columns:1fr}
  .hdr__in{gap:10px}
  .back{display:none}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ---------- Abweichungen vom Standardkopf ---------- */
.hdr--legal .hdr__in{gap:18px}
.back{margin-left:auto;font-size:.92rem;text-decoration:none;color:var(--gris)}
.back:hover{color:var(--tinta)}
.sr{position:absolute;left:-9999px}
@media (max-width:620px){ .back{display:none} }
