/* =============================================================================
   RentenPilot – Rechtsseiten (Impressum, Datenschutzhinweise)
   Statisch, von Caddy ausgeliefert (siehe caddy/Caddyfile, Snippet rechtsseiten).
   CSP dort: style-src 'self' – deshalb KEINE Inline-Styles in den HTML-Dateien,
   alles Aussehen steht hier. Keine externen Schriften/Ressourcen.
   Farben angelehnt an den FH-Website-Entwurf (quellen/src/styles.css).
   ========================================================================== */
:root{
  --bg:#EEF1F4; --surface:#fff; --ink:#0C1E33; --ink-2:#46576B; --ink-3:#5E6E80;
  --line:#D3DAE2; --green:#12A06E; --green-d:#0A7A53; --green-l:#DDF3E9;
  --amber-d:#8A5A00; --amber-l:#FDEBCF;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --r:14px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:1rem}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.65 var(--sans);
  -webkit-font-smoothing:antialiased;overflow-wrap:break-word;hyphens:auto}
a{color:var(--green-d);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--green);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:12px;top:-60px;z-index:10;background:var(--ink);color:#fff;padding:10px 14px;border-radius:8px}
.skip:focus{top:12px}

/* Kopf */
.kopf{background:var(--surface);border-bottom:1px solid var(--line)}
.kopf__in{max-width:48rem;margin:0 auto;padding:14px clamp(16px,4vw,32px);display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.marke{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-weight:780;font-size:1.125rem;letter-spacing:.01em}
.marke img{width:38px;height:auto;display:block}
.marke .p{color:var(--green-d)}
.kopf nav{margin-left:auto}
.kopf nav ul{display:flex;gap:6px;margin:0;padding:0;list-style:none}
.kopf nav a{display:inline-block;padding:6px 12px;border-radius:999px;color:var(--ink-2);text-decoration:none;font-size:.9375rem;font-weight:560}
.kopf nav a:hover{color:var(--ink);background:var(--bg)}
.kopf nav a[aria-current="page"]{color:var(--ink);background:var(--green-l)}

/* Inhalt */
main{max-width:48rem;margin:0 auto;padding:clamp(20px,4vw,40px) clamp(16px,4vw,32px) 48px}
.blatt{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(20px,4.5vw,44px);box-shadow:0 1px 2px rgba(12,30,51,.05),0 10px 30px rgba(12,30,51,.06)}
h1{font-size:clamp(1.75rem,1.2rem + 2vw,2.35rem);line-height:1.12;letter-spacing:-.02em;margin:0 0 .35em;font-weight:720}
h2{font-size:1.3rem;line-height:1.3;letter-spacing:-.01em;margin:2.2em 0 .5em;padding-top:1.1em;border-top:1px solid var(--line);font-weight:700}
h3{font-size:1.0625rem;line-height:1.35;margin:1.8em 0 .4em;font-weight:680}
p,ul,ol,dl,address,table{margin:0 0 1em}
ul,ol{padding-left:1.3em}
li{margin:.25em 0}
address{font-style:normal}
.stand{color:var(--ink-3);font-size:.9375rem;margin:0 0 1.6em}
.klein{font-size:.9375rem;color:var(--ink-2)}
code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88em;background:var(--bg);padding:.05em .35em;border-radius:5px;overflow-wrap:anywhere}

/* Angaben-Listen (Impressum, Vorgänge) */
.angaben{display:grid;grid-template-columns:minmax(9rem,13rem) 1fr;gap:.45em 1.2em;margin:0 0 1.2em}
.angaben dt{font-weight:640;color:var(--ink-2)}
.angaben dd{margin:0}
@media (max-width:34rem){
  .angaben{grid-template-columns:1fr;gap:.1em}
  .angaben dd{margin-bottom:.7em}
}

/* Platzhalter – DEUTLICH sichtbar (wie im Website-Entwurf) */
.ph{color:var(--ink);background:repeating-linear-gradient(135deg,#FCE7A8 0 6px,#FFF4D1 6px 12px);
  outline:1px dashed #C9A227;padding:0 .3em;border-radius:3px;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* Hinweis-Kästen */
.entwurf{border:2px solid #C9A227;background:var(--amber-l);color:var(--ink);border-radius:var(--r);padding:14px 18px;margin:0 0 1.6em}
.entwurf strong{display:block;font-size:1.0625rem;color:var(--amber-d);margin-bottom:.2em}
.entwurf p{margin:0}
.optional{border:1px dashed #C9A227;border-radius:var(--r);padding:4px 18px 8px;margin:1.6em 0;background:#FFFCF2}
.optional h2,.optional h3{border-top:0;padding-top:0;margin-top:.3em}
.optional__marke{display:block;margin-top:.9em;font-size:.8125rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--amber-d)}
.fakt{border-left:4px solid var(--green);background:#F5FAF8;padding:10px 16px;border-radius:0 10px 10px 0;margin:0 0 1em}

/* Inhaltsverzeichnis */
.inhalt{background:var(--bg);border-radius:var(--r);padding:14px 20px;margin:0 0 1.6em}
.inhalt h2{margin:0 0 .4em;padding:0;border:0;font-size:1rem}
.inhalt ol{margin:0;padding-left:1.4em;columns:2 16rem;column-gap:2rem}
.inhalt li{margin:.15em 0;break-inside:avoid}

/* Tabellen (Speicher im Browser) */
.tabelle{width:100%;overflow-x:auto;margin:0 0 1em}
table{border-collapse:collapse;width:100%;font-size:.9375rem}
th,td{text-align:left;vertical-align:top;padding:.5em .6em;border-bottom:1px solid var(--line)}
th{font-weight:660;color:var(--ink-2);background:var(--bg)}

/* Fuß */
.fuss{max-width:48rem;margin:0 auto;padding:0 clamp(16px,4vw,32px) 40px;color:var(--ink-3);font-size:.875rem}
.fuss ul{display:flex;flex-wrap:wrap;gap:.4em 1.2em;margin:0;padding:0;list-style:none}
.fuss a{color:var(--ink-2)}

/* Druck: nur der Text, ohne Navigation und Schatten */
@media print{
  body{background:#fff;font-size:11pt;line-height:1.45}
  .skip,.kopf nav,.fuss,.inhalt{display:none}
  .kopf{border:0}
  main{padding:0;max-width:none}
  .blatt{border:0;box-shadow:none;padding:0}
  h2{break-after:avoid;border-top-color:#999}
  h3{break-after:avoid}
  a{color:var(--ink);text-decoration:none}
  .blatt a[href^="http"]::after{content:" (" attr(href) ")";font-size:.85em;color:var(--ink-2)}
  .ph{outline:1px solid #000;background:#eee}
  .entwurf,.optional{break-inside:avoid}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
