/* ==========================================================================
   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;
}

/* Marke <-> Rechtsträger: erklärt die Verbindung, bevor der Kunde rätselt */
.legal__marke{
  padding:1.1rem 1.3rem;
  border-left:2px solid var(--accent-2);
  background:rgba(53,242,207,.05);
  font-size:.84rem; line-height:1.8; color:var(--text-dim);
}
.legal__marke strong{ color:var(--accent-2); font-weight:600; }

/* 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; }
}

/* --------------------------------------------------------------------------
   MUSTER-RÜCKTRITTSFORMULAR
   Wird ausgedruckt oder als PDF gespeichert — deshalb echte Schreiblinien
   statt Eingabefelder und im Druck ohne Farbflächen.
   -------------------------------------------------------------------------- */
.widerruf-bogen{
  margin:1.6rem 0;
  padding:1.8rem 1.6rem;
  border:1px solid var(--line-strong);
  background:var(--panel);
}
.widerruf-bogen p{ font-size:.88rem; line-height:1.7; margin:0 0 .5rem; }
.widerruf-bogen__an{ margin-bottom:1.6rem !important; line-height:1.6 !important; }
.widerruf-bogen__linie{
  border-bottom:1px solid var(--line-strong);
  margin:0 0 1.1rem !important;
  min-height:1.6rem;
}
.widerruf-bogen__stern{
  margin-top:1.4rem !important;
  font-size:.76rem !important; color:var(--text-mute);
}
.legal__anschrift{
  font-style:normal; margin:1rem 0 1.2rem; padding-left:1rem;
  border-left:2px solid var(--accent-2);
  font-size:.9rem; line-height:1.8;
}
.legal__hinweis{ font-size:.86rem; line-height:1.7; color:var(--text-dim); }
.legal__stand{ font-size:.78rem; color:var(--text-mute); margin-top:1.4rem; }

@media print{
  .page-hero__grid, .page-hero__glow{ display:none; }
  .widerruf-bogen{ border:1px solid #000; background:none; }
  .widerruf-bogen__linie{ border-bottom-color:#000; }
}