/* ══════════════════════════════════════════════════════════
   RECHTSTEXT.CSS — geteilte Optik für Impressum & Datenschutz
   Vorher liefen beide Seiten auf eigenen Farben, 12px-Rundungen,
   Emoji-Togglern und dem Logo „Lindner T&D" — wer von der dunklen
   Startseite kam, landete auf einer Seite einer anderen Firma.
   Jetzt: dieselbe Shell wie index.html (dunkel, 2px, ◐, JL.).
   ══════════════════════════════════════════════════════════ */

:root {
  --bg:       #0C0B09;
  --bg2:      #111009;
  --surface:  #1A1714;
  --border:   #272320;
  --text:     #F0ECE6;
  --muted:    #8A7F74;
  --accent:   #C9590A;
  --accent-l: #E8701F;
      /* Tieferer Ton für Flächen mit weißer Schrift — #C9590A schafft nur 4,27:1 */
      --accent-deep:   #A6450A;
      --accent-deep-l: #BC4F09;
      /* Akzent als TEXT: dunkles Theme heller, helles Theme tiefer (beides > 4,5:1) */
      --accent-text:   #E8701F;
  --nav-bg:   rgba(12,11,9,0.96);
  --mono:     'Space Mono','Space Mono Fallback',monospace;
  --disp:     'Syne','Syne Fallback',sans-serif;
  --body:     'DM Sans','DM Sans Fallback',sans-serif;
  --tr:       0.35s cubic-bezier(0.4,0,0.2,1);
}
[data-theme="light"] {
  --bg:     #F2EFE9;
  --bg2:    #E8E3DB;
  --surface:#FFFFFF;
  --border: #D6D0C6;
  --text:   #1A1714;
  --muted:  #6E645B;
  --nav-bg: rgba(242,239,233,0.96);
  --accent-text: #A6450A;
}

*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
body {
  font-family:var(--body); background:var(--bg); color:var(--text);
  line-height:1.75; -webkit-font-smoothing:antialiased;
  transition:background var(--tr), color var(--tr);
}

/* Korn wie auf der Startseite — sonst wirkt der Hintergrund flach */
body::after {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:9997; opacity:.022;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:200px;
}

/* ── ICONS ── */
.ic { width:1em; height:1em; display:inline-block; vertical-align:-.125em; flex:none; }

/* ── NAV ── */
nav {
  position:fixed; top:0; left:0; width:100%; z-index:1000;
  background:var(--nav-bg); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border); transition:background var(--tr), border-color var(--tr);
}
.nav-inner { max-width:900px; margin:0 auto; padding:0 2rem; height:60px; display:flex; align-items:center; justify-content:space-between; }
.nav-logo { font-family:var(--disp); font-weight:800; font-size:1.15rem; letter-spacing:-1px; text-decoration:none; color:var(--text); }
.nav-logo em { color:var(--accent); font-style:normal; }
.nav-right { display:flex; align-items:center; gap:.75rem; }
.nav-back {
  font-family:var(--mono); font-size:.62rem; letter-spacing:1.5px; text-transform:uppercase;
  text-decoration:none; color:var(--muted); transition:color var(--tr);
}
.nav-back:hover { color:var(--accent); }
.ctrl-btn {
  background:none; border:1px solid var(--border); color:var(--muted);
  padding:.28rem .6rem; border-radius:2px; font-size:.75rem; cursor:pointer;
  transition:border-color var(--tr), color var(--tr);
}
.ctrl-btn:hover { border-color:var(--accent); color:var(--accent); }

/* ── INHALT ── */
.content { max-width:900px; margin:0 auto; padding:8rem 2rem 5rem; }

.page-tag {
  display:flex; align-items:center; gap:1rem; margin-bottom:1.2rem;
  font-family:var(--mono); font-size:.6rem; letter-spacing:3px; text-transform:uppercase; color:var(--muted);
}
.page-tag .n { color:var(--accent-text); }
.page-tag::after { content:''; flex:1; height:1px; background:var(--border); }

h1 {
  font-family:var(--disp); font-size:clamp(2.4rem,6vw,4.2rem); font-weight:800;
  letter-spacing:-2.5px; line-height:.95; margin-bottom:3rem;
}

.legal-block {
  background:var(--surface); border:1px solid var(--border); border-radius:2px;
  padding:2rem; margin-bottom:1rem; position:relative; overflow:hidden;
}
.legal-block::before { content:''; position:absolute; top:0; left:0; width:2px; height:100%; background:var(--accent); }
.legal-block > * { position:relative; }

h2 {
  font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:2.5px;
  text-transform:uppercase; color:var(--accent-text); margin-bottom:1rem;
}

p  { font-size:.92rem; color:var(--muted); line-height:1.85; margin-bottom:.75rem; }
p:last-child { margin-bottom:0; }
strong { color:var(--text); font-weight:600; }
a { color:var(--accent-text); text-decoration:none; border-bottom:1px solid currentColor; transition:opacity var(--tr); }
a:hover { opacity:.75; }
ul { list-style:none; margin:.6rem 0 .9rem; }
ul li {
  font-size:.88rem; color:var(--muted); padding:.4rem 0 .4rem 1.2rem;
  border-top:1px solid var(--border); position:relative;
}
ul li::before { content:'—'; position:absolute; left:0; color:var(--accent); }

.notice, .cookie-reset {
  background:rgba(201,89,10,.06); border:1px solid rgba(201,89,10,.22);
  border-radius:2px; padding:1.1rem 1.3rem; font-size:.86rem; color:var(--muted);
}
.notice { margin-top:2rem; }
/* Auf der akzentgetönten Fläche reicht --muted nicht ganz für 4,5:1 */
.notice p, .cookie-reset p, .notice, .cookie-reset { color:var(--text); }
.cookie-reset { margin-top:1rem; }
.cookie-reset-btn {
  background:var(--accent-deep); color:#fff; border:none; border-radius:2px;
  padding:.55rem 1.3rem; font-family:var(--mono); font-size:.62rem; font-weight:700;
  letter-spacing:1.5px; text-transform:uppercase; cursor:pointer; margin-top:.9rem;
  transition:background var(--tr);
}
.cookie-reset-btn:hover { background:var(--accent-deep-l); }
.cookie-reset-ok { display:none; margin-top:.8rem; font-size:.82rem; color:#4ade80; }

.back-btn {
  display:inline-flex; align-items:center; gap:.6rem;
  background:var(--accent-deep); color:#fff; border:none;
  padding:.9rem 2.2rem; border-radius:2px; text-decoration:none;
  font-family:var(--mono); font-size:.68rem; font-weight:700; letter-spacing:2px; text-transform:uppercase;
  margin-top:2.5rem; box-shadow:0 4px 24px rgba(201,89,10,.28);
  transition:background var(--tr), box-shadow var(--tr);
}
.back-btn:hover { background:var(--accent-deep-l); box-shadow:0 8px 32px rgba(201,89,10,.38); }

footer { background:#070605; padding:2rem; border-top:1px solid #1a1714; margin-top:4rem; }
.ft-inner { max-width:900px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; }
.ft-logo { font-family:var(--disp); font-weight:800; font-size:1rem; color:#fff; letter-spacing:-.5px; }
.ft-logo em { color:var(--accent); font-style:normal; }
.ft-copy { font-family:var(--mono); font-size:.58rem; color:rgba(255,255,255,.58); letter-spacing:1px; }
.ft-links { display:flex; gap:1.4rem; flex-wrap:wrap; }
.ft-links a {
  font-family:var(--mono); color:rgba(255,255,255,.62); text-decoration:none;
  border-bottom:none; font-size:.58rem; letter-spacing:1px; text-transform:uppercase; transition:color var(--tr);
}
.ft-links a:hover { color:#fff; }

@media (max-width:600px) {
  /* „Datenschutzerklärung" ist ein 20-Zeichen-Wort — ohne kleinere Schrift
     und Trennung schiebt allein die Überschrift die Seite auf 413 px. */
  h1 { font-size:clamp(1.8rem,8.5vw,2.6rem); letter-spacing:-1px; hyphens:auto; overflow-wrap:anywhere; }
  .nav-inner { padding:0 1rem; gap:.6rem; }
  .nav-logo { font-size:1rem; }
  .nav-back { font-size:.55rem; letter-spacing:1px; }
  .cookie-banner { padding:1.1rem 1rem; }
  .ck-inner { gap:1rem; }
  body { max-width:100vw; overflow-x:clip; }
  .content { padding:6rem 1.25rem 3rem; }
  .legal-block { padding:1.4rem; }
  .nav-inner { padding:0 1.25rem; }
  .ft-inner { flex-direction:column; text-align:center; }
}

/* ── COOKIE-BANNER (gleiche Optik wie auf der Startseite) ── */
.cookie-banner {
  position:fixed; bottom:0; left:0; right:0; z-index:9990;
  background:rgba(8,7,5,.98); color:var(--text); padding:1.25rem 2rem;
  border-top:1px solid var(--border); box-shadow:0 -2px 30px rgba(0,0,0,.6);
  backdrop-filter:blur(12px); transform:translateY(100%);
  transition:transform .4s cubic-bezier(.4,0,.2,1);
}
[data-theme="light"] .cookie-banner { background:rgba(242,239,233,.98); }
.cookie-banner.show { transform:translateY(0); }
.ck-inner { max-width:900px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap; }
.ck-txt { font-size:.8rem; color:var(--muted); max-width:600px; line-height:1.6; }
.ck-txt a { color:var(--text); text-decoration:underline; text-underline-offset:2px; border-bottom:none; }
.ck-btns { display:flex; gap:.75rem; flex-shrink:0; }
.ck-btn {
  padding:.48rem 1.2rem; border-radius:2px; border:none; cursor:pointer;
  font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:1px; text-transform:uppercase;
  transition:background .2s;
}
.ck-btn-ok { background:var(--accent-deep); color:#fff; }
.ck-btn-ok:hover { background:var(--accent-deep-l); }
.ck-btn-no { background:rgba(255,255,255,.08); color:var(--text); }
[data-theme="light"] .ck-btn-no { background:rgba(0,0,0,.06); }
.ck-cfg-btn {
  position:fixed; bottom:1rem; right:1rem; z-index:9985; display:none;
  background:rgba(8,7,5,.92); color:var(--text); border:1px solid var(--border);
  border-radius:2px; padding:.38rem .8rem; cursor:pointer;
  font-family:var(--mono); font-size:.58rem; letter-spacing:1px;
}
[data-theme="light"] .ck-cfg-btn { background:rgba(242,239,233,.92); }
.ck-cfg-btn.show { display:block; }