/* ==========================================================================
   LEGAL  —  Impressum, Datenschutz und andere Textseiten
   ========================================================================== */

/* ==========================================================================
   LAYOUT MIT INHALTSVERZEICHNIS
   ========================================================================== */
.legal-layout{
  display:grid;
  grid-template-columns:250px minmax(0, 1fr);
  gap:clamp(2rem, 5vw, 4rem);
  align-items:start;
}

.toc{
  position:sticky;
  top:calc(var(--header-h) + 1.5rem);
  padding:1.25rem 1.1rem;
  background:rgba(11,26,22,.6);
  border:1px solid var(--line);
  clip-path:var(--chamfer);
}
.toc h2{
  font-size:.66rem; letter-spacing:.22em;
  color:var(--accent);
  margin-bottom:1rem;
}
.toc ol{ counter-reset:toc; }
.toc li{ counter-increment:toc; }
.toc a{
  display:block;
  padding:.4rem 0 .4rem 1.6rem;
  position:relative;
  font-size:.73rem; line-height:1.45;
  color:var(--text-mute);
  border-left:1px solid transparent;
  transition:color .25s var(--ease), padding-left .25s var(--ease);
}
.toc a::before{
  content:counter(toc, decimal-leading-zero);
  position:absolute; left:0; top:.45rem;
  font-size:.6rem; letter-spacing:.06em;
  color:var(--line-strong);
  transition:color .25s var(--ease);
}
.toc a:hover,
.toc a.is-current{ color:var(--accent); }
.toc a:hover::before,
.toc a.is-current::before{ color:var(--accent); }

/* ==========================================================================
   FLIESSTEXT
   ========================================================================== */
.legal{
  max-width:72ch;
  font-size:.86rem;
  line-height:1.85;
  color:var(--text-dim);
}
.legal > section{
  padding-bottom:clamp(2rem, 4vw, 3rem);
  scroll-margin-top:calc(var(--header-h) + 2rem);
}
.legal > section + section{
  padding-top:clamp(2rem, 4vw, 3rem);
  border-top:1px solid var(--line);
}

.legal h2{
  font-size:clamp(1.1rem, 2vw, 1.5rem);
  color:var(--text);
  margin-bottom:1.1rem;
}
.legal h3{
  font-size:.95rem;
  color:var(--accent-2);
  margin:1.75rem 0 .7rem;
}
.legal p + p{ margin-top:1rem; }
.legal strong{ color:var(--text); font-weight:500; }

.legal ul{ margin:1rem 0; display:grid; gap:.5rem; }
.legal ul li{
  position:relative;
  padding-left:1.2rem;
}
.legal ul li::before{
  content:"";
  position:absolute; left:0; top:.72em;
  width:5px; height:5px;
  background:var(--accent-2);
  box-shadow:0 0 8px rgba(53,242,207,.5);
}
.legal ul ul{ margin:.5rem 0 .25rem; }
.legal ul ul li::before{ background:var(--line-strong); box-shadow:none; }

.legal a:not([class]){
  color:var(--accent);
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
  word-break:break-word;
}
.legal a:not([class]):hover{ color:var(--accent-soft); }

/* ==========================================================================
   DATENBLOCK  (Firmendaten, Kontakt …)
   ========================================================================== */
.datalist{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  gap:.65rem 1.5rem;
  margin:1.25rem 0;
  padding:1.35rem 1.5rem;
  background:linear-gradient(150deg, var(--panel-2), rgba(11,26,22,.55));
  border:1px solid var(--line);
  clip-path:var(--chamfer);
  font-size:.8rem;
}
.datalist dt{
  color:var(--text-mute);
  letter-spacing:.06em;
  white-space:nowrap;
}
.datalist dd{
  margin:0;
  color:var(--text);
}
.datalist dd a{
  color:var(--accent);
  text-decoration:underline;
  text-underline-offset:3px;
  word-break:break-word;
}

/* Hervorgehobener Name über einem Datenblock */
.legal__org{
  font-family:var(--font-display); font-weight:700;
  font-size:1.05rem; letter-spacing:.04em; text-transform:uppercase;
  color:var(--accent);
  margin-top:1.5rem;
}

/* Kurzer Stand-Hinweis unten */
.legal__stand{
  margin-top:2.5rem;
  padding-top:1.25rem;
  border-top:1px solid var(--line);
  font-size:.72rem;
  color:var(--text-mute);
}

/* ==========================================================================
   BREAKPOINTS
   ========================================================================== */
@media (max-width: 900px){
  .legal-layout{ grid-template-columns:1fr; }
  .toc{ position:static; }
  .toc ol{ columns:2; column-gap:1.5rem; }
  .legal{ max-width:none; }
}

@media (max-width: 560px){
  .toc ol{ columns:1; }
  .datalist{ grid-template-columns:1fr; gap:.2rem; padding:1.1rem 1.2rem; }
  .datalist dd{ margin-bottom:.7rem; }
}