:root{
  --moos:#1E3A2B;--rinde:#4A3728;--blatt:#6E9B3E;--papier:#FAFAF7;
  --nebel:#E9EAE4;--tinte:#14201A;--grau:#6C7570;
  --serif:"Newsreader",Georgia,serif;--sans:"Inter",system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--papier);color:var(--tinte);font-family:var(--sans);
  font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
.spalte{max-width:680px;margin:0 auto;padding:0 20px}

.kopf{background:var(--moos);position:sticky;top:0;z-index:9}
.kopf .spalte{display:flex;align-items:center;gap:11px;height:56px}
.kopf a.marke{color:#EDF2EC;text-decoration:none;font-family:var(--serif);font-size:20px;font-weight:600}
.kopf nav{margin-left:auto;display:flex;gap:18px}
.kopf nav a{color:#AEC3B0;text-decoration:none;font-size:14px}
.kopf nav a:hover{color:#fff}

.einstieg{margin:26px 0 8px}
.vorspann{font-size:17.5px;color:#33403A}
.leer{background:#fff;border:1px solid var(--nebel);border-radius:6px;padding:20px;margin:20px 0}

.liste{margin:18px 0 10px}
.karte{display:flex;gap:15px;padding:16px 0;border-bottom:1px solid var(--nebel);align-items:flex-start}
.karte .kbild img{width:120px;height:120px;object-fit:contain;background:#F2F3EF;border-radius:5px}
.karte h2{font-family:var(--serif);font-size:20px;line-height:1.25;margin:0 0 5px;font-weight:600}
.karte h2 a{color:var(--tinte);text-decoration:none}
.karte h2 a:hover{color:var(--moos)}
.karte p{margin:0;font-size:14.5px;color:var(--grau)}

.brot{font-size:12.5px;color:var(--grau);margin:20px 0 12px}
.brot a{color:var(--grau);text-decoration:none}
h1{font-family:var(--serif);font-size:31px;line-height:1.18;font-weight:600;margin:0 0 10px}
.autorenzeile{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--grau);margin-bottom:20px}
.avatar{width:28px;height:28px;border-radius:50%;background:#DDE9D4;display:grid;place-items:center;
  font-size:12px;color:var(--moos);font-weight:600;flex:0 0 auto}

p{margin:0 0 15px}
h2{font-family:var(--serif);font-size:23px;line-height:1.25;font-weight:600;margin:32px 0 12px}
h3{font-size:16.5px;margin:22px 0 7px;font-weight:600}
figure{margin:0 0 22px}
.held{width:100%;display:block;border-radius:7px;background:#F2F3EF;object-fit:contain}
figcaption{font-size:12px;color:var(--grau);margin-top:7px}

table{width:100%;border-collapse:collapse;font-size:14.5px;margin:16px 0 24px;background:#fff}
th,td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--nebel)}
th{font-size:12.5px;color:var(--grau);font-weight:500;background:#F6F7F4}

.werbelabel{font-size:11.5px;color:var(--grau);margin:22px 0 5px}
.box{background:#fff;border:1px solid var(--nebel);border-left:3px solid var(--blatt);
  border-radius:6px;padding:16px;margin:0 0 6px}
.box .rang{font-size:12px;color:var(--rinde);font-weight:600;margin-bottom:8px}
.box .oben{display:flex;gap:15px;align-items:flex-start}
.box .pbild{flex:0 0 100px}
.box .pbild img{width:100px;height:100px;object-fit:contain;border-radius:5px;background:#F2F3EF}
.box .pname{font-family:var(--serif);font-size:18px;font-weight:600;line-height:1.25;display:block;margin-bottom:8px}
.box ul{margin:0 0 12px;padding-left:18px;font-size:14.5px;color:#32403A}
.box ul li{margin-bottom:4px}
.kauf{display:inline-block;background:#F0A32A;border:1px solid #D98C12;color:#1A1200;
  text-decoration:none;font-weight:600;font-size:15px;padding:11px 20px;border-radius:999px}
.kauf:hover{background:#E89A1E}
.boxfuss{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.boxfuss span{font-size:11.5px;color:var(--grau)}

.erfahrung{background:#F6F3EE;border-radius:6px;padding:17px 18px;margin:24px 0}
.erfahrung .titel{font-size:12.5px;font-weight:600;color:var(--rinde);margin-bottom:8px}
.erfahrung p:last-child{margin-bottom:0}

.faq{border-top:1px solid var(--nebel);padding-top:4px}
.faq h3{margin-top:18px}
.faq p{font-size:16px;color:#2A3630}

.autorbox{display:flex;gap:14px;background:#fff;border:1px solid var(--nebel);border-radius:6px;
  padding:16px;margin:30px 0 0;align-items:flex-start}
.autorbox .gross{width:46px;height:46px;border-radius:50%;background:#DDE9D4;display:grid;place-items:center;
  font-family:var(--serif);font-size:19px;color:var(--moos);flex:0 0 auto}
.autorbox p{font-size:14px;margin:0;color:var(--grau)}
.autorbox b{font-size:14.5px;color:var(--tinte);display:block;margin-bottom:3px}

.weiter{margin:30px 0 0}
.weiter h2{font-size:19px;margin-bottom:10px}
.weiter ul{list-style:none;margin:0;padding:0}
.weiter li{border-bottom:1px solid var(--nebel)}
.weiter a{display:block;padding:11px 0;color:var(--moos);text-decoration:none;font-size:15.5px}
.weiter a:hover{color:var(--blatt)}

footer{background:#16241C;color:#9FB4A3;margin-top:44px;padding:26px 0 34px;font-size:13px}
footer .spalte>p{margin:0 0 12px}
footer a{color:#C4D6C6}
footer nav{display:flex;gap:16px;flex-wrap:wrap;margin-top:10px}

@media (max-width:560px){
  body{font-size:16.5px}
  h1{font-size:26px}
  h2{font-size:21px}
  .box .oben{flex-direction:column}
  .box .pbild{flex:none;width:100%}
  .box .pbild img{width:100%;height:auto;aspect-ratio:1}
  .kauf{display:block;text-align:center}
  .karte .kbild img{width:84px;height:84px}
  table{font-size:13.5px}
  th,td{padding:8px 7px}
}