/* =====================================================================
   e-Komet – Rechtstexte (Impressum & Datenschutzerklärung)
   Ergänzt style.css und wird nur auf diesen beiden Seiten geladen.
   ===================================================================== */

/* ---------- Seiten-Hero (bewusst ohne Foto: der Text steht im Fokus) --- */
.page-hero{
  position:relative;overflow:hidden;padding:70px 0 76px;
  background:
    radial-gradient(900px 420px at 12% -30%, var(--green-glow), transparent 70%),
    linear-gradient(180deg,var(--night-2) 0%,var(--night-1) 100%);
  border-bottom:1px solid var(--line);
}
.page-hero h1{
  font-size:clamp(2.1rem,5vw,3.4rem);font-weight:300;text-transform:uppercase;
  letter-spacing:.5px;line-height:1.1;
}
.page-hero h1 b{color:var(--green);font-weight:600}
.page-hero p{color:var(--text-dim);margin-top:16px;max-width:62ch;font-size:1.05rem}
.page-hero .breadcrumb{font-size:.85rem;color:var(--text-mute);margin-bottom:18px}
.page-hero .breadcrumb a{color:var(--text-dim);text-decoration:none}
.page-hero .breadcrumb a:hover{color:var(--green-bright)}

/* ---------- Grundlayout: Inhaltsverzeichnis + Text ------------------- */
.legal{padding:60px 0 90px;background:var(--night-1)}
.legal-layout{display:grid;grid-template-columns:270px 1fr;gap:48px;align-items:start}

/* Inhaltsverzeichnis */
.legal-toc{
  position:sticky;top:24px;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);padding:24px 22px;
}
.legal-toc h2{
  font-size:.78rem;letter-spacing:2px;text-transform:uppercase;color:var(--green);
  font-weight:700;margin-bottom:14px;
}
.legal-toc ol{list-style:none;counter-reset:toc;font-size:.9rem}
.legal-toc li{counter-increment:toc;margin-bottom:2px}
.legal-toc a{
  display:flex;gap:10px;padding:7px 8px;border-radius:8px;
  color:var(--text-dim);text-decoration:none;transition:.2s;line-height:1.35;
}
.legal-toc a::before{content:counter(toc) ".";color:var(--text-mute);flex:none;min-width:20px}
.legal-toc a:hover{background:rgba(255,255,255,.05);color:var(--green-bright)}
.legal-toc a:hover::before{color:var(--green)}

/* ---------- Textspalte ----------------------------------------------- */
.legal-content{max-width:82ch}
.legal-content > section{
  padding-bottom:34px;margin-bottom:34px;border-bottom:1px solid var(--line);
  scroll-margin-top:24px;
}
.legal-content > section:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}

.legal-content h2{
  font-size:clamp(1.25rem,2.6vw,1.6rem);font-weight:500;line-height:1.3;
  margin-bottom:16px;
}
.legal-content h2 .num{color:var(--green);font-weight:700;margin-right:10px}
.legal-content h3{
  font-size:1.02rem;font-weight:600;color:var(--text);margin:26px 0 10px;
}
.legal-content p{color:var(--text-dim);margin-bottom:14px}
.legal-content ul,
.legal-content ol{color:var(--text-dim);margin:0 0 16px 22px}
.legal-content li{margin-bottom:8px}
.legal-content li::marker{color:var(--green)}
.legal-content a{color:var(--green);text-decoration:none;overflow-wrap:anywhere}
.legal-content a:hover{color:var(--green-bright);text-decoration:underline}
.legal-content strong{color:var(--text)}
.legal-content code{
  font-family:ui-monospace,"Cascadia Mono","Consolas",monospace;font-size:.88em;
  background:rgba(255,255,255,.07);border:1px solid var(--line);border-radius:5px;
  padding:1px 6px;color:var(--text);overflow-wrap:anywhere;
}
.legal-content .lead{font-size:1.05rem}
.legal-content .meta{color:var(--text-mute);font-size:.88rem}

/* Adress-/Kontaktblock */
.legal-card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:24px 26px;margin:0 0 18px;
}
.legal-card p{margin-bottom:0}
.legal-card p + p{margin-top:12px}

/* Definitionsliste für Kammer, Register, Steuernummern … */
.legal-dl{display:grid;grid-template-columns:200px 1fr;gap:10px 20px;margin:0 0 18px}
.legal-dl dt{color:var(--text-mute);font-size:.9rem}
.legal-dl dd{color:var(--text-dim)}

/* Hinweis-/Warnkasten */
.legal-note{
  border-left:3px solid var(--green);background:var(--panel-2);
  border-radius:0 var(--radius) var(--radius) 0;padding:18px 22px;margin:0 0 18px;
}
.legal-note p:last-child{margin-bottom:0}

/* Noch nicht gepflegte Pflichtangabe */
.todo{
  display:inline-block;background:rgba(255,92,92,.14);border:1px dashed #ff8686;
  color:#ffb1b1;border-radius:6px;padding:1px 9px;font-size:.85rem;font-weight:600;
}

/* Zurück-nach-oben */
.legal-top{display:inline-block;margin-top:34px;font-size:.9rem}

/* ---------- Mobil ----------------------------------------------------- */
@media (max-width:980px){
  .legal-layout{grid-template-columns:1fr;gap:30px}
  .legal-toc{position:static}
  .legal-toc ol{columns:2;column-gap:20px}
}
@media (max-width:700px){
  .page-hero{padding:44px 0 48px}
  .page-hero p{font-size:.97rem;margin-top:12px}
  .legal{padding:44px 0 70px}
  .legal-toc ol{columns:1}
  .legal-card{padding:20px}
  .legal-dl{grid-template-columns:1fr;gap:2px}
  .legal-dl dd{margin-bottom:12px}
}