/* Syntagma Forschung — Satzbild der Werkseiten. FORSCH-PROV0416. */
:root{
  --ink:#1a1a1a; --mut:#5c5c5c; --line:#ddd9d1; --bg:#faf9f6; --box:#ffffff;
  --acc:#8c2f1f; --acc2:#1f4e6b;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  --serif:Georgia,"Iowan Old Style","Times New Roman",serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.6}
.wrap{max-width:780px;margin:0 auto;padding:0 20px 72px}
.wide{max-width:900px}

/* Kopf und Fuß */
.kopf{border-bottom:1px solid var(--line);background:var(--box)}
.kopf .inner{max-width:780px;margin:0 auto;padding:14px 20px;display:flex;
  flex-wrap:wrap;gap:12px;align-items:baseline;justify-content:space-between}
.marke{font-weight:600;font-size:.95rem;letter-spacing:-.01em;text-decoration:none;color:var(--ink)}
.marke span{color:var(--mut);font-weight:400}
nav a{font-size:.85rem;color:var(--acc2);text-decoration:none;margin-left:16px}
nav a:hover,a:hover{text-decoration:underline}
nav a[aria-current="page"]{color:var(--ink);font-weight:600;text-decoration:none}
footer{margin-top:44px;border-top:1px solid var(--line);padding-top:18px;font-size:.78rem;color:var(--mut)}

/* Typografie */
.eyebrow{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--acc);margin:36px 0 10px}
h1{font-size:2rem;line-height:1.2;margin:0 0 10px;letter-spacing:-.02em}
h2{font-size:1.1rem;margin:36px 0 10px}
h3{font-size:.95rem;margin:22px 0 6px;color:var(--acc2)}
.lead{font-size:1.05rem;color:var(--mut);margin:0 0 28px}
.flow p,.flow li{font-family:var(--serif);font-size:1.02rem}
a{color:var(--acc2)}
.en{font-style:italic;color:var(--mut);font-size:.88rem}
ul{padding-left:20px} li{margin-bottom:6px}

/* Bausteine */
.three{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:24px 0}
.t{background:var(--box);border:1px solid var(--line);border-radius:6px;padding:16px}
.t h3{margin:0 0 6px}
.t p{font-size:.86rem;color:var(--mut);margin:0}
figure{margin:28px 0}
img{width:100%;height:auto;border:1px solid var(--line);border-radius:6px;background:#fff}
figcaption{font-size:.78rem;color:var(--mut);margin-top:6px}
.cta{display:inline-block;margin:6px 8px 6px 0;padding:11px 20px;border-radius:5px;
     background:var(--ink);color:#fff;text-decoration:none;font-size:.9rem}
.cta.sec{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.cta:hover{opacity:.85;text-decoration:none}
table{width:100%;border-collapse:collapse;font-size:.86rem;margin:16px 0;display:block;overflow-x:auto}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:var(--mut);font-weight:600}
td.num{text-align:right;font-family:var(--mono)}
.hinweis{background:#f4f2ed;border-left:3px solid var(--acc2);padding:12px 14px;
         border-radius:0 4px 4px 0;font-size:.88rem;margin:20px 0}
.formel{font-family:var(--mono);font-size:.84rem;background:#f4f2ed;border-left:3px solid var(--acc2);
        padding:10px 12px;border-radius:0 4px 4px 0;margin:0 0 14px;overflow-x:auto}

/* Rechner */
label{display:block;font-size:.78rem;color:var(--mut);margin-bottom:3px}
input{width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:4px;
      font:inherit;font-size:.9rem;background:#fff;color:var(--ink)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:14px}
button{font:inherit;font-size:.88rem;padding:8px 16px;border-radius:4px;border:1px solid var(--ink);
       background:var(--ink);color:#fff;cursor:pointer;margin:0 6px 6px 0}
button.sec{background:transparent;color:var(--ink)}
button:hover{opacity:.85}
.out{font-family:var(--mono);font-size:1.6rem;font-weight:600;margin:10px 0 2px}
.verdict{font-size:.9rem;color:var(--mut)}
.hi{color:var(--acc);font-weight:600}
.ok{color:var(--acc2);font-weight:600}
@media (max-width:520px){h1{font-size:1.6rem}.out{font-size:1.3rem}}
