/* recht.css – Impressum/Datenschutz, Runde 11/2026 */
.recht {
  --r-schrift: inherit; --r-titel-schrift: inherit;
  --r-tinte: #1d1d1f; --r-zart: #5f6368; --r-akzent: #1f4e79; --r-akzent-text: #fff;
  --r-flaeche: #f4f6f8; --r-linie: rgba(0, 0, 0, .12); --r-grund: #fff; --r-polster-x: 0px; --r-polster-oben: 0px;
  max-width: 72ch; font-family: var(--r-schrift); color: var(--r-tinte); font-size: 17px; line-height: 1.65;
}
.recht * { box-sizing: border-box; }
.recht__kopf { margin: 0 0 28px; padding-bottom: 18px; border-bottom: 1px solid var(--r-linie); }
.recht__kopf h1, .recht__kopf h2 { margin: 0; font-size: clamp(26px, 7vw, 48px); hyphens: manual; font-family: var(--r-titel-schrift); line-height: 1.2; color: var(--r-tinte); }
.recht__unter { margin: 6px 0 0; font-size: 15px; letter-spacing: .02em; color: var(--r-zart); }

/* Impressum: Angaben-Zeilen */
.recht-angaben { margin: 0; }
.recht-angaben > div { display: grid; grid-template-columns: 190px 1fr; gap: 24px; padding: 14px 0; border-top: 1px solid var(--r-linie); }
.recht-angaben > div:first-child { border-top: 0; padding-top: 0; }
.recht-angaben dt { padding-top: 3px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--r-zart); }
.recht-angaben dd { margin: 0; }

/* Datenschutz: nummerierte Abschnitte */
.recht h3 { display: flex; align-items: baseline; gap: 12px; margin: 34px 0 12px; padding-top: 28px; border-top: 1px solid var(--r-linie);
  font-family: var(--r-titel-schrift); font-size: 22px; line-height: 1.3; color: var(--r-tinte); overflow-wrap: anywhere; }
.recht__kopf + h3 { margin-top: 0; padding-top: 0; border-top: 0; }
.recht h3 .nr { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; transform: translateY(-2px);
  background: var(--r-akzent); color: var(--r-akzent-text); font: 700 14px/1 var(--r-schrift); }
.recht h4 { margin: 22px 0 6px; font-size: 18px; line-height: 1.4; color: var(--r-tinte); }
.recht p, .recht ul { margin: 0 0 12px; }
.recht ul { padding: 0; list-style: none; }
.recht li { position: relative; padding-left: 20px; }
.recht li + li { margin-top: 6px; }
.recht li::before { content: ""; position: absolute; left: 4px; top: .68em; width: 6px; height: 6px; border-radius: 50%; background: var(--r-akzent); }
.recht a { color: var(--r-akzent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; overflow-wrap: anywhere; }
.recht a:hover { text-decoration-thickness: 2px; }
.recht__kasten { margin: 14px 0; padding: 16px 20px; border-left: 3px solid var(--r-akzent); border-radius: 0 8px 8px 0; background: var(--r-flaeche); }
.recht__klein { font-size: 15px; color: var(--r-zart); }

/* Im Popup: Titelzeile bleibt stehen. --r-polster-x = seitlicher Innenabstand des Popup-Kastens. */
.recht--popup { max-width: none; }
.recht--popup .recht__kopf { position: sticky; top: calc(-1 * var(--r-polster-oben)); z-index: 2; margin: 0 calc(-1 * var(--r-polster-x)) 28px;
  padding: 20px calc(var(--r-polster-x) + 56px) 16px var(--r-polster-x); background: var(--r-grund); }
.recht--popup .recht__kopf h1, .recht--popup .recht__kopf h2 { font-size: clamp(22px, 6.2vw, 32px); hyphens: manual; }

@media (max-width: 600px) {
  .recht { font-size: 16px; }
  .recht-angaben > div { grid-template-columns: 1fr; gap: 4px; }
  .recht h3 { font-size: 20px; }
  .recht h3 { hyphens: auto; }
}

/* friseur-buck.com: Outfit, Olive */
.recht { --r-schrift: "Outfit", "Helvetica Neue", Arial, sans-serif; --r-titel-schrift: "Outfit", "Helvetica Neue", Arial, sans-serif;
  --r-tinte: #272727; --r-zart: #6b6b6b; --r-akzent: #8d8551; --r-akzent-text: #fff; --r-flaeche: #f5f3e8; --r-grund: #fff; font-weight: 300; }
.recht h3, .recht__kopf h1, .recht__kopf h2, .recht h4, .recht strong { font-weight: 600; }
.recht a { color: #6f6a3e; }
/* Popup-Kasten (.rmodal__inhalt): Innenabstand = clamp(1.6rem, 4vw, 3rem) */
.rmodal__inhalt .recht { --r-polster-x: clamp(1.6rem, 4vw, 3rem); --r-polster-oben: clamp(1.6rem, 4vw, 3rem); }
.rmodal__inhalt .recht__kopf h2 { margin: 0; padding: 0; }
.rmodal__inhalt .recht__kopf h2::after { display: none; }
.rmodal__inhalt .recht h3 { font-size: 22px; margin: 34px 0 12px; }
.rmodal__inhalt .recht .recht__kopf + h3 { margin-top: 0; }
.rmodal__inhalt .recht h4 { font-size: 18px; }
@media (max-width: 600px) { .rmodal__inhalt .recht h3 { font-size: 20px; } }
.rmodal__zu { z-index: 5; } /* Kreuz über der stehenden Titelzeile */
