/* Zauntura — gemeinsames Stylesheet für Ratgeber-Artikel (/ratgeber/*) */
:root{ --rg-max: 760px; }
body{ background:var(--bg,#f6f3ee); color:var(--text,#1b1714); font-family:var(--font-body,"Jost",system-ui,sans-serif); margin:0; cursor:auto; }
.rg-head{ position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between;
  padding:16px var(--gut,24px); background:rgba(246,243,238,.82); backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%); border-bottom:1px solid var(--line,rgba(22,25,28,.1)); }
.rg-head .brand{ display:flex; align-items:center; gap:11px; color:var(--text,#1b1714); text-decoration:none; font-family:var(--font-display,"Jost",sans-serif); font-weight:600; letter-spacing:.05em; }
.rg-head .brand .mark{ width:30px; height:30px; display:block; flex:none; }
.rg-head a.rg-back{ font-family:var(--font-display,sans-serif); font-size:13px; color:var(--text-dim,#5b5750); text-decoration:none; white-space:nowrap; }
.rg-head a.rg-back:hover{ color:var(--accent,#b98b45); }
.rg-wrap{ max-width:var(--rg-max); margin:0 auto; padding:clamp(28px,5vw,56px) var(--gut,24px) 80px; }
.rg-crumb{ font-family:var(--font-display,sans-serif); font-size:12px; letter-spacing:.04em; color:var(--text-dim,#5b5750); margin-bottom:26px; }
.rg-crumb a{ color:inherit; text-decoration:none; } .rg-crumb a:hover{ color:var(--accent,#b98b45); }
.rg-eyebrow{ font-family:var(--font-display,sans-serif); font-size:12px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--accent-2,#5aa89c); margin-bottom:16px; }
h1.rg-title{ font-family:var(--font-serif,"Jost",serif); font-weight:500; letter-spacing:-.02em; line-height:1.08; font-size:clamp(30px,5.4vw,46px); margin:0 0 20px; }
.rg-lead{ font-size:clamp(17px,1.5vw,20px); line-height:1.6; color:var(--text-dim,#4a4640); margin:0 0 12px; }
.rg-meta{ font-family:var(--font-display,sans-serif); font-size:13px; color:var(--text-dim,#7a766e); margin:18px 0 40px; }
.rg-wrap h2{ font-family:var(--font-serif,serif); font-weight:500; letter-spacing:-.01em; font-size:clamp(23px,2.6vw,30px); line-height:1.18; margin:48px 0 16px; }
.rg-wrap h3{ font-family:var(--font-display,sans-serif); font-weight:600; font-size:18px; margin:28px 0 10px; }
.rg-wrap p{ font-size:16.5px; line-height:1.68; color:var(--text,#2a2620); margin:0 0 18px; }
.rg-wrap ul{ padding-left:20px; margin:0 0 18px; } .rg-wrap li{ font-size:16.5px; line-height:1.6; margin:7px 0; }
.rg-tldr{ background:var(--surface,#fff); border:1px solid var(--line,rgba(22,25,28,.12)); border-left:3px solid var(--accent,#b98b45);
  border-radius:14px; padding:20px 24px; margin:0 0 40px; }
.rg-tldr b{ font-family:var(--font-display,sans-serif); letter-spacing:.04em; text-transform:uppercase; font-size:12px; color:var(--accent,#b98b45); display:block; margin-bottom:8px; }
.rg-tldr p{ margin:0; font-size:16px; }
.rg-table{ width:100%; border-collapse:collapse; margin:8px 0 28px; font-size:15.5px; overflow:hidden; border-radius:12px; border:1px solid var(--line,rgba(22,25,28,.12)); }
.rg-table th,.rg-table td{ text-align:left; padding:13px 16px; border-bottom:1px solid var(--line,rgba(22,25,28,.1)); vertical-align:top; }
.rg-table thead th{ font-family:var(--font-display,sans-serif); font-size:13px; letter-spacing:.04em; background:var(--surface-2,#efeae2); }
.rg-table tbody tr:last-child td{ border-bottom:0; }
.rg-table td:first-child{ font-weight:600; color:var(--text,#1b1714); width:30%; }
.rg-cta{ background:#14181B; color:#f4efe6; border-radius:18px; padding:clamp(26px,4vw,40px); margin:48px 0 12px; }
.rg-cta h2{ color:#f4efe6; margin:0 0 12px; }
.rg-cta p{ color:rgba(244,239,230,.78); margin:0 0 22px; }
.rg-cta .btns{ display:flex; flex-wrap:wrap; gap:12px; }
.rg-btn{ display:inline-flex; align-items:center; gap:8px; font-family:var(--font-display,sans-serif); font-weight:600; font-size:14px;
  padding:13px 22px; border-radius:999px; text-decoration:none; transition:transform .2s, background .2s; }
.rg-btn-primary{ background:var(--accent,#b98b45); color:#1b1714; }
.rg-btn-ghost{ background:transparent; color:#f4efe6; border:1px solid rgba(244,239,230,.28); }
.rg-btn-wa{ background:#25D366; color:#0b3d24; }
.rg-btn:hover{ transform:translateY(-2px); }
.rg-faq h2{ margin-top:48px; }
.rg-faq details{ border-bottom:1px solid var(--line,rgba(22,25,28,.12)); padding:16px 0; }
.rg-faq summary{ font-family:var(--font-display,sans-serif); font-weight:600; font-size:16.5px; cursor:pointer; list-style:none; }
.rg-faq summary::-webkit-details-marker{ display:none; }
.rg-faq summary::after{ content:"+"; float:right; color:var(--accent,#b98b45); font-size:20px; line-height:1; }
.rg-faq details[open] summary::after{ content:"–"; }
.rg-faq details p{ margin:12px 0 0; }
.rg-more h2{ margin-top:52px; }
.rg-more a{ display:block; padding:18px 20px; border:1px solid var(--line,rgba(22,25,28,.12)); border-radius:14px; margin-bottom:12px;
  text-decoration:none; color:var(--text,#1b1714); font-family:var(--font-display,sans-serif); font-weight:600; transition:border-color .2s, transform .2s; }
.rg-more a:hover{ border-color:var(--accent,#b98b45); transform:translateY(-2px); }
.rg-more a span{ display:block; font-weight:400; font-size:14px; color:var(--text-dim,#7a766e); margin-top:4px; }
.rg-foot{ border-top:1px solid var(--line,rgba(22,25,28,.12)); padding:34px var(--gut,24px); text-align:center; color:var(--text-dim,#7a766e); font-family:var(--font-display,sans-serif); font-size:13px; }
.rg-foot a{ color:var(--text-dim,#7a766e); text-decoration:none; margin:0 10px; } .rg-foot a:hover{ color:var(--accent,#b98b45); }
