




/* ============================================================
   Alrysm — Rechtliche Seiten (dunkles Markendesign)
   System-Schrift (system-ui) + Chakra Petch (Wortmarke) → 0 externe Calls
   ============================================================ */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
:root{
  --accentFrom:#1F8A5B;--accentTo:#4FBE8A;
  --ink:#E7ECF5;--ink70:rgba(231,236,245,.72);--ink45:rgba(231,236,245,.45);
  --grad:linear-gradient(120deg,var(--accentFrom),var(--accentTo));
  --bg:#0A1024;--panel:rgba(255,255,255,.04);
  --line:rgba(255,255,255,.10);--line-strong:rgba(255,255,255,.16);
  --maxw:760px;
}
body{
  margin:0;font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  color:var(--ink);font-size:16.5px;line-height:1.7;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  background:
    radial-gradient(120% 120% at 0% 0%,rgba(31,138,91,.12),transparent 46%),
    radial-gradient(120% 120% at 100% 100%,rgba(31,138,91,.14),transparent 48%),
    var(--bg);
  min-height:100vh;display:flex;flex-direction:column}
a{color:var(--ink);text-decoration:none;transition:color .15s}
a:hover{color:#fff}

/* Kopf */
.lhdr{position:sticky;top:0;z-index:20;backdrop-filter:saturate(140%) blur(12px);
  background:rgba(8,8,12,.62);border-bottom:1px solid var(--line)}
.lhdr-in{max-width:var(--maxw);margin:0 auto;padding:15px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.lbrand{display:flex;align-items:center;gap:11px}
.lbrand img{width:40px;height:40px;display:block;box-sizing:border-box;padding:7px;border-radius:12px;object-fit:contain;background:linear-gradient(150deg,rgba(31,138,91,.20),rgba(31,138,91,.03));border:1px solid rgba(31,138,91,.45);box-shadow:0 0 22px rgba(31,138,91,.16),inset 0 0 14px rgba(31,138,91,.06)}
.lbrand b{font-size:16px;letter-spacing:.16em;text-transform:uppercase;font-weight:800;font-family:'Chakra Petch',system-ui,sans-serif}
.lback{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:var(--ink70)}
.lback:hover{color:#fff}
.lback svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* Inhalt */
.lwrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:clamp(40px,7vw,72px) 24px 24px;flex:1}
.leyebrow{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink45);font-weight:700}
.ltitle{font-size:clamp(32px,6vw,50px);font-weight:800;letter-spacing:-0.02em;line-height:1.06;margin:14px 0 0;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.lmeta{margin-top:18px;font-size:13.5px;color:var(--ink45)}
.lupdated{margin-top:6px;font-size:12.5px;color:var(--ink45)}

/* Hinweis-Box */
.lnote{display:flex;gap:13px;margin-top:30px;padding:16px 18px;border:1px solid var(--line-strong);
  border-left:3px solid var(--accentFrom);border-radius:14px;background:var(--panel)}
.lnote svg{flex:none;width:20px;height:20px;fill:none;stroke:var(--accentFrom);stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;margin-top:2px}
.lnote p{margin:0;font-size:13.5px;color:var(--ink70);line-height:1.55}

/* Abschnitte */
.lsec{margin-top:38px;padding-top:30px;border-top:1px solid var(--line)}
.lsec.first{border-top:0;padding-top:0}
.lsec h2{font-size:21px;font-weight:700;letter-spacing:-0.01em;margin:0;display:flex;align-items:baseline;gap:12px}
.lsec h2 .n{font-size:13px;font-weight:800;color:transparent;background:var(--grad);
  -webkit-background-clip:text;background-clip:text;white-space:nowrap}
.lsec h3{font-size:15.5px;font-weight:700;margin:22px 0 0;color:var(--ink)}
.lsec p{margin:12px 0 0;color:var(--ink70)}
.lsec ul{margin:12px 0 0;padding-left:20px;color:var(--ink70)}
.lsec li{margin:6px 0}
.lsec strong{color:var(--ink);font-weight:700}
.lsec a{color:#fff;border-bottom:1px solid var(--line-strong)}
.lsec a:hover{border-color:var(--accentFrom)}

/* Definitionsliste */
.ldl{margin:14px 0 0;display:grid;grid-template-columns:max-content 1fr;gap:8px 22px}
.ldl dt{font-weight:700;color:var(--ink)}
.ldl dd{margin:0;color:var(--ink70)}
@media(max-width:520px){.ldl{grid-template-columns:1fr;gap:2px 0}.ldl dd{margin-bottom:10px}}

/* Fuß */
.lfoot{max-width:var(--maxw);margin:40px auto 0;width:100%;border-top:1px solid var(--line);
  padding:26px 24px 40px;text-align:center;color:var(--ink45);font-size:13px}
.lfoot a{color:var(--ink70);font-weight:600}
.lfoot a:hover{color:#fff}
.lfoot .sep{margin:0 10px;color:var(--line-strong)}
