/*
 * RH Legal - gemeinsames Langtext-Stylesheet fuer alle Rechtsseiten
 * (Impressum, AGB, SLA, Datenschutz, Datenschutz-App, AV-Vertrag, Rechtliches-Hub,
 *  Bestellseite). Wird von jedem Rechts-Template per wp_enqueue_style geladen
 * (eine Datei statt einer pro Slug). Pro Seite traegt <main> die Klassen
 * "rh-page rh-legal rh-<slug>".
 *
 * WICHTIG: Diese Datei ist bewusst KOMPLETT ASCII (keine Umlaute/Sonderzeichen in
 * Kommentaren!). Grund: Wird die CSS vom Server/Optimierer nicht als UTF-8 behandelt,
 * verschluckt ein nicht-UTF-8-sicherer Minifier am kaputten Mehrbyte-Kommentar die
 * direkt folgende Regel -> live fehlen dann Token-Styles. Bitte ASCII-only halten.
 * Pruefen: LC_ALL=C grep -n '[^ -~\t]' assets/css/rh-legal.css  -> muss leer sein.
 *
 * System: CLAUDE.md. Scoping unter .rh-page, Tokens auf .rh-page (nicht :root).
 */

/* ============================================================
   Design Tokens (auf .rh-page gescopt, nicht :root)
   ============================================================ */
.rh-page{
  /* Brand */
  --rh-green-deep:#173528; --rh-green-deep-700:#1F4A37; --rh-green-deep-900:#0E2419;
  --rh-green:#A3F698; --rh-green-300:#C6F9BF; --rh-green-100:#E9FCE5; --rh-green-600:#7CE775;
  --rh-purple:#0C0533;
  /* Neutrals */
  --rh-white:#FFFFFF; --rh-paper:#F5F6F4; --rh-line:#E2E5E0; --rh-line-dark:#2B4A3B;
  --rh-grey-500:#8B8E99; --rh-grey-400:#B4B7BD;
  /* Semantic */
  --ink:var(--rh-purple); --body:#34303F; --muted:#5F6470;
  --on-dark:#FFFFFF; --on-dark-muted:#B7CABF;
  --rh-error:#B3261E;
  /* Type */
  --font-display:'Clash Display','General Sans',system-ui,sans-serif;
  --font-sans:'General Sans',system-ui,-apple-system,Segoe UI,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
  /* Radius & shadow */
  --r-md:18px; --r-lg:28px; --r-xl:40px; --r-pill:999px;
  --shadow-sm:0 1px 2px rgba(12,5,51,.06),0 1px 1px rgba(12,5,51,.04);
  --shadow-md:0 8px 24px rgba(12,5,51,.08);
  --shadow-lg:0 24px 60px rgba(12,5,51,.12);
  --shadow-glow:0 12px 40px rgba(163,246,152,.35);
  --ring:0 0 0 3px rgba(163,246,152,.55);

  font-family:var(--font-sans);color:var(--ink);background:var(--rh-white);
  /* Full-Bleed: aus Salients zentriertem Content-Container ausbrechen (No-JS-Fallback;
     das Template misst zusaetzlich per JS die echte Position und kompensiert sie). */
  width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  overflow-x:clip;-webkit-font-smoothing:antialiased;
}
body.rh-fullwidth{overflow-x:clip;}

/* ============================================================
   Base (gescopt)
   ============================================================ */
.rh-page, .rh-page *{box-sizing:border-box;}
.rh-page ::selection{background:var(--rh-green);color:var(--rh-green-deep);}
.rh-page img{max-width:100%;display:block;}
.rh-page a{color:inherit;}
.rh-page .rh-container{max-width:1160px;margin:0 auto;padding:0 32px;}
.rh-page .rh-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

.rh-legal .rh-eyebrow{font-family:var(--font-mono);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0;}
.rh-legal .rh-eyebrow--green{color:var(--rh-green);}
.rh-legal .rh-mark{background:var(--rh-green);color:var(--rh-green-deep);padding:.02em .14em;border-radius:6px;-webkit-box-decoration-break:clone;box-decoration-break:clone;}

/* ============================================================
   Kompakter Header (dunkel) fuer Rechtsseiten
   ============================================================ */
.rh-legal .rh-legal-hero{
  padding:72px 0 52px;
  background:radial-gradient(120% 140% at 80% 100%,#235540 0%,#173528 55%,#0E2419 100%);
  color:var(--on-dark);
}
.rh-legal .rh-legal-hero .rh-container{max-width:900px;}
.rh-legal .rh-h1{font-family:var(--font-display);font-weight:700;font-size:46px;line-height:1.04;letter-spacing:-.02em;color:var(--on-dark);margin:14px 0 0;}
.rh-legal .rh-legal-lead{font-size:18px;line-height:1.55;color:var(--on-dark-muted);max-width:60ch;margin:16px 0 0;}
.rh-legal .rh-legal-meta{font-family:var(--font-mono);font-weight:500;font-size:12.5px;letter-spacing:.04em;color:var(--on-dark-muted);margin:18px 0 0;}

/* ============================================================
   Lese-Layout: Inhaltsverzeichnis (sticky) + Dokument
   ============================================================ */
.rh-legal .rh-legal-body{padding:56px 0 96px;background:var(--rh-white);}
.rh-legal .rh-legal-grid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:56px;align-items:start;}

.rh-legal .rh-toc{position:sticky;top:96px;font-family:var(--font-mono);font-size:13px;line-height:1.5;}
.rh-legal .rh-toc__title{font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 12px;}
.rh-legal .rh-toc ol{list-style:none;margin:0;padding:0;counter-reset:toc;}
.rh-legal .rh-toc li{margin:0 0 9px;}
.rh-legal .rh-toc a{display:block;color:var(--body);text-decoration:none;border-left:2px solid var(--rh-line);padding:2px 0 2px 12px;transition:color .15s ease,border-color .15s ease;}
.rh-legal .rh-toc a:hover{color:var(--ink);border-color:var(--rh-green-600);}

/* Dokument-Spalte: schmale, ruhige Lesebreite. */
.rh-legal .rh-doc{max-width:720px;color:var(--body);font-size:16.5px;line-height:1.7;}
.rh-legal .rh-doc > *:first-child{margin-top:0;}
.rh-legal .rh-doc h2{font-family:var(--font-display);font-weight:700;font-size:25px;line-height:1.15;letter-spacing:-.01em;color:var(--ink);margin:48px 0 14px;scroll-margin-top:96px;}
.rh-legal .rh-doc h3{font-family:var(--font-display);font-weight:600;font-size:18.5px;line-height:1.25;color:var(--ink);margin:30px 0 8px;scroll-margin-top:96px;}
.rh-legal .rh-doc p{margin:0 0 16px;}
.rh-legal .rh-doc strong{color:var(--ink);font-weight:600;}
.rh-legal .rh-doc a{color:var(--rh-green-deep);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;}
.rh-legal .rh-doc a:hover{color:var(--rh-green-deep-900);}
.rh-legal .rh-doc ul,.rh-legal .rh-doc ol{margin:0 0 16px;padding-left:22px;}
.rh-legal .rh-doc li{margin:0 0 7px;}
.rh-legal .rh-doc li::marker{color:var(--rh-green-600);}
.rh-legal .rh-doc dl{margin:0 0 16px;}
.rh-legal .rh-doc dt{font-weight:600;color:var(--ink);margin:14px 0 2px;}
.rh-legal .rh-doc dd{margin:0;}
.rh-legal .rh-doc :target{background:var(--rh-green-100);border-radius:8px;box-shadow:0 0 0 8px var(--rh-green-100);}

/* Tabellen (Verarbeitungsuebersichten etc.) */
.rh-legal .rh-table-wrap{overflow-x:auto;margin:0 0 18px;border:1px solid var(--rh-line);border-radius:var(--r-md);}
.rh-legal .rh-doc table{width:100%;border-collapse:collapse;font-size:14.5px;line-height:1.5;}
.rh-legal .rh-doc th,.rh-legal .rh-doc td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--rh-line);vertical-align:top;}
.rh-legal .rh-doc thead th{background:var(--rh-paper);font-family:var(--font-mono);font-weight:600;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);}
.rh-legal .rh-doc tbody tr:last-child td{border-bottom:0;}

/* Hinweis-/Callout-Box (z. B. Entwurfs-/Anwaltshinweis). Kein Fehler-Rot als Akzent. */
.rh-legal .rh-callout{background:var(--rh-paper);border:1px solid var(--rh-line);border-left:4px solid var(--rh-green-600);border-radius:var(--r-md);padding:16px 20px;margin:0 0 26px;font-size:15px;line-height:1.6;color:var(--body);}
.rh-legal .rh-callout strong{color:var(--ink);}
.rh-legal .rh-callout--draft{border-left-style:dashed;border-left-color:var(--rh-green-deep);}

/* "TODO/Platzhalter ergaenzen"-Marker im Text. */
.rh-legal .rh-todo{display:inline-block;font-family:var(--font-mono);font-size:13px;font-weight:600;color:var(--muted);background:var(--rh-paper);border:1px dashed var(--rh-line-dark);border-radius:6px;padding:1px 7px;}

/* ============================================================
   Buttons (kompakt, fuer Hub & Bestellseite)
   ============================================================ */
.rh-legal .rh-btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-mono);font-weight:600;font-size:14px;letter-spacing:.01em;text-decoration:none;border-radius:var(--r-pill);padding:13px 22px;border:1.5px solid transparent;cursor:pointer;transition:transform .08s ease,background .15s ease,color .15s ease,border-color .15s ease;}
.rh-legal .rh-btn:active{transform:scale(.97);}
.rh-legal .rh-btn--primary{background:var(--rh-green);color:var(--rh-green-deep);}
.rh-legal .rh-btn--primary:hover{background:var(--rh-green-600);}
.rh-legal .rh-btn--dark{background:var(--rh-green-deep);color:var(--on-dark);}
.rh-legal .rh-btn--dark:hover{background:var(--rh-green-deep-700);}
.rh-legal .rh-btn--ghost{background:transparent;color:var(--ink);border-color:var(--rh-line);}
.rh-legal .rh-btn--ghost:hover{border-color:var(--rh-green-600);}

/* Sichtbarer gruener Fokus-Ring auf allen interaktiven Elementen. */
.rh-legal a:focus-visible,.rh-legal button:focus-visible{outline:none;box-shadow:var(--ring);border-radius:8px;}

/* ============================================================
   Hub (rh-rechtliches): Karten-Grid
   ============================================================ */
.rh-legal .rh-legal-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:8px 0 0;}
.rh-legal .rh-lcard{display:flex;flex-direction:column;gap:6px;background:var(--rh-white);border:1px solid var(--rh-line);border-radius:var(--r-lg);padding:22px;text-decoration:none;color:inherit;box-shadow:var(--shadow-sm);transition:transform .12s ease,box-shadow .15s ease,border-color .15s ease;}
.rh-legal .rh-lcard:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--rh-green-600);}
.rh-legal .rh-lcard h3{font-family:var(--font-display);font-weight:600;font-size:19px;color:var(--ink);margin:0;}
.rh-legal .rh-lcard p{font-size:14.5px;line-height:1.55;color:var(--muted);margin:0;}
.rh-legal .rh-lcard__tag{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--rh-green-deep);}

/* ============================================================
   Bestellseite (rh-bestellen)
   ============================================================ */
.rh-legal .rh-order-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:32px;align-items:start;}
.rh-legal .rh-pricebox{background:var(--rh-green-deep);color:var(--on-dark);border-radius:var(--r-xl);padding:32px;box-shadow:var(--shadow-glow);}
.rh-legal .rh-pricebox .rh-price{font-family:var(--font-display);font-weight:700;font-size:48px;line-height:1;letter-spacing:-.02em;margin:6px 0 0;}
.rh-legal .rh-pricebox .rh-price small{font-family:var(--font-mono);font-weight:500;font-size:14px;letter-spacing:.02em;color:var(--on-dark-muted);}
.rh-legal .rh-pricebox ul{list-style:none;margin:20px 0 0;padding:0;}
.rh-legal .rh-pricebox li{position:relative;padding:0 0 0 26px;margin:0 0 10px;font-size:15px;line-height:1.45;color:var(--on-dark);}
.rh-legal .rh-pricebox li svg{position:absolute;left:0;top:3px;color:var(--rh-green);}
.rh-legal .rh-steps{counter-reset:step;list-style:none;margin:8px 0 0;padding:0;}
.rh-legal .rh-steps li{position:relative;padding:0 0 0 46px;margin:0 0 22px;}
.rh-legal .rh-steps li::before{counter-increment:step;content:counter(step);position:absolute;left:0;top:-2px;width:32px;height:32px;display:grid;place-items:center;border-radius:var(--r-pill);background:var(--rh-green);color:var(--rh-green-deep);font-family:var(--font-mono);font-weight:600;font-size:15px;}
.rh-legal .rh-steps h3{font-family:var(--font-display);font-weight:600;font-size:18px;color:var(--ink);margin:0 0 4px;}
.rh-legal .rh-steps p{font-size:15px;line-height:1.55;color:var(--muted);margin:0;}

/* Online-Bestellformular */
.rh-legal .rh-form{display:grid;gap:14px;}
.rh-legal .rh-form .rh-row2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.rh-legal .rh-form label{display:block;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 6px;}
.rh-legal .rh-form input[type=text],.rh-legal .rh-form input[type=email],.rh-legal .rh-form input[type=tel],.rh-legal .rh-form input[type=date]{width:100%;font-family:var(--font-sans);font-size:16px;color:var(--ink);background:var(--rh-white);border:1px solid var(--rh-line);border-radius:var(--r-md);padding:12px 14px;}
.rh-legal .rh-form input:focus-visible{outline:none;border-color:var(--rh-green-600);box-shadow:var(--ring);}
.rh-legal .rh-consents{display:grid;gap:11px;border:1px solid var(--rh-line);border-radius:var(--r-md);padding:16px 18px;background:var(--rh-paper);margin:4px 0 0;}
.rh-legal .rh-consents legend{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:0;margin:0 0 4px;}
.rh-legal .rh-check{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.5;color:var(--body);}
.rh-legal .rh-check input{margin-top:3px;width:18px;height:18px;flex:0 0 18px;accent-color:var(--rh-green-deep);}
.rh-legal .rh-check a{color:var(--rh-green-deep);text-decoration:underline;}

/* Bestell-Konfigurator (Paket + Features) */
.rh-legal .rh-pakete{border:1px solid var(--rh-line);border-radius:var(--r-md);padding:16px 18px;background:var(--rh-paper);margin:4px 0 0;}
.rh-legal .rh-pakete legend{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:0;margin:0 0 8px;}
.rh-legal .rh-pkgtoggle{display:inline-flex;background:var(--rh-white);border:1px solid var(--rh-line);border-radius:var(--r-pill);padding:3px;gap:3px;flex-wrap:wrap;}
.rh-legal .rh-pkgbtn{font-family:var(--font-mono);font-size:13px;font-weight:600;color:var(--muted);background:transparent;border:0;border-radius:var(--r-pill);padding:8px 16px;cursor:pointer;transition:background .15s ease,color .15s ease;}
.rh-legal .rh-pkgbtn.is-active{background:var(--rh-green-deep);color:var(--on-dark);}
.rh-legal .rh-pkgbtn:focus-visible{outline:none;box-shadow:var(--ring);}
.rh-legal .rh-fgroup{margin:14px 0 0;}
.rh-legal .rh-fgroup__t{display:block;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 6px;}
.rh-legal .rh-fitem{display:flex;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--rh-line);border-radius:var(--r-md);background:var(--rh-white);margin:0 0 6px;font-size:14.5px;color:var(--body);cursor:pointer;}
.rh-legal .rh-fitem input{width:18px;height:18px;flex:0 0 18px;accent-color:var(--rh-green-deep);}
.rh-legal .rh-fitem__name{flex:1;}
.rh-legal .rh-fitem__price{font-family:var(--font-mono);font-size:12.5px;color:var(--rh-green-deep);white-space:nowrap;}
.rh-legal .rh-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden;}
.rh-legal .rh-formmsg{font-size:14.5px;line-height:1.5;margin:2px 0 0;}
.rh-legal .rh-formmsg--err{color:var(--rh-error);}
.rh-legal .rh-form .rh-btn[disabled]{opacity:.6;cursor:not-allowed;}
.rh-legal .rh-formnote{font-size:13px;color:var(--muted);margin:6px 0 0;}

/* Status-Banner nach Rueckkehr von Stripe */
.rh-legal .rh-banner{border-radius:var(--r-md);padding:16px 20px;margin:0 0 26px;font-size:15.5px;line-height:1.55;}
.rh-legal .rh-banner--ok{background:var(--rh-green-100);border:1px solid var(--rh-green-600);color:var(--rh-green-deep);}
.rh-legal .rh-banner--info{background:var(--rh-paper);border:1px solid var(--rh-line);color:var(--body);}

/* ============================================================
   Theme-Hardening gegen Salient (Headlines/Buttons/[hidden])
   ============================================================ */
.rh-page.rh-legal .rh-h1{font:700 46px/1.04 var(--font-display)!important;color:var(--on-dark)!important;letter-spacing:-.02em!important;}
.rh-page.rh-legal h2{font:700 25px/1.15 var(--font-display)!important;color:var(--ink)!important;}
.rh-page.rh-legal h3{font:600 18.5px/1.25 var(--font-display)!important;color:var(--ink)!important;}
.rh-page.rh-legal .rh-btn{border-radius:var(--r-pill)!important;}
/* Salient stylt <button> mit hoher Spezifitaet/!important (dunkler Grund, fremde
   Textfarbe) -> der Primaer-Button erschien dunkelgruen OHNE sichtbare Aufschrift.
   Farben je Variante hart durchsetzen (Grund + Text + Rahmen). */
.rh-page.rh-legal .rh-btn.rh-btn--primary{background:var(--rh-green)!important;color:var(--rh-green-deep)!important;border-color:transparent!important;}
.rh-page.rh-legal .rh-btn.rh-btn--primary:hover{background:var(--rh-green-600)!important;}
.rh-page.rh-legal .rh-btn.rh-btn--dark{background:var(--rh-green-deep)!important;color:var(--on-dark)!important;border-color:transparent!important;}
.rh-page.rh-legal .rh-btn.rh-btn--dark:hover{background:var(--rh-green-deep-700)!important;}
.rh-page.rh-legal .rh-btn.rh-btn--ghost{background:transparent!important;color:var(--ink)!important;border-color:var(--rh-line)!important;}
.rh-page.rh-legal .rh-btn.rh-btn--ghost:hover{border-color:var(--rh-green-600)!important;}
.rh-page.rh-legal [hidden]{display:none!important;}
/* Salient erzwingt sonst die nativen ol-Zahlen zurueck -> doppelte Nummerierung neben dem
   gruenen Kreis-Counter (.rh-steps li::before). Native Marker hart abschalten. */
.rh-page.rh-legal .rh-steps{list-style:none!important;}
.rh-page.rh-legal .rh-steps>li{list-style:none!important;}
.rh-page.rh-legal .rh-steps>li::marker{content:""!important;}

/* ============================================================
   Reduzierte Bewegung respektieren (CLAUDE.md S11/S12).
   Legal-Seiten nutzen nur Hover-Transitions (kein Scroll-Reveal);
   bei "reduce" werden alle Transitions/Animationen abgeschaltet.
   ============================================================ */
@media (prefers-reduced-motion: reduce){
  .rh-page.rh-legal *{transition:none !important;animation:none !important;}
}

/* ============================================================
   Print (Auftrag/Rechtsdokument druckbar)
   ============================================================ */
@media print{
  .rh-page.rh-legal{width:auto;max-width:none;margin:0;}
  .rh-legal .rh-legal-hero{background:none;color:#000;padding:0 0 12px;border-bottom:2px solid #000;}
  .rh-legal .rh-h1,.rh-legal .rh-legal-meta,.rh-legal .rh-legal-lead{color:#000!important;}
  .rh-legal .rh-toc{display:none;}
  .rh-legal .rh-legal-grid{display:block;}
  .rh-legal .rh-doc{max-width:none;font-size:11pt;color:#000;}
  .rh-legal .rh-btn{display:none;}
}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:920px){
  .rh-legal .rh-legal-grid{grid-template-columns:1fr;gap:28px;}
  .rh-legal .rh-toc{position:static;top:auto;border:1px solid var(--rh-line);border-radius:var(--r-md);padding:16px 18px;background:var(--rh-paper);}
  .rh-legal .rh-order-grid{grid-template-columns:1fr;}
  .rh-legal .rh-legal-cards{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:560px){
  .rh-page .rh-container{padding:0 18px;}
  .rh-legal .rh-legal-hero{padding:52px 0 38px;}
  .rh-page.rh-legal .rh-h1{font-size:33px!important;}
  .rh-legal .rh-doc{font-size:16px;}
  .rh-page.rh-legal h2{font-size:22px!important;}
  .rh-legal .rh-legal-cards{grid-template-columns:1fr;}
  .rh-legal .rh-pricebox .rh-price{font-size:40px;}
  .rh-legal .rh-form .rh-row2{grid-template-columns:1fr;}
}
