/* ===========================================================
   florianmatthias — WordPress Guidelines (Digital)
   assets/style.css
   =========================================================== */

/* --- Optional: Hausschrift einbinden -----------------------
   Founders Grotesk ist lizenzpflichtig und liegt diesem Paket
   NICHT bei. Wenn die Webfont-Dateien vorhanden sind, einfach
   nach assets/fonts/ legen und die folgenden Zeilen aktivieren.

@font-face{
  font-family:"Founders Grotesk";
  src:url("fonts/founders-grotesk-regular.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Founders Grotesk";
  src:url("fonts/founders-grotesk-medium.woff2") format("woff2");
  font-weight:500; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Founders Grotesk";
  src:url("fonts/founders-grotesk-semibold.woff2") format("woff2");
  font-weight:600; font-style:normal; font-display:swap;
}
----------------------------------------------------------- */

:root{
  --ink:#231F20;
  --ink-70:rgba(35,31,32,.70);
  --ink-50:rgba(35,31,32,.50);
  --ink-30:rgba(35,31,32,.30);
  --paper:#FFFFFF;
  --paper-2:#F4F4F4;
  --paper-3:#E7E7E7;
  --rule:rgba(35,31,32,.16);
  --rule-soft:rgba(35,31,32,.09);
  --blue:#1400FF;
  --blue-soft:rgba(20,0,255,.07);
  --ok:#0B7A3B;
  --ok-soft:rgba(11,122,59,.08);
  --alert:#D92B00;
  --alert-soft:rgba(217,43,0,.07);
  --sans:"Founders Grotesk","Neue Haas Grotesk Display","Helvetica Neue",Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
  --nav-w:310px;
  --pad:clamp(20px,4vw,64px);
  --maxw:74ch;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--sans);
  font-size:16px;
  line-height:1.55;
  color:var(--ink);
  background:var(--paper);
  font-feature-settings:"kern" 1,"liga" 1;
  -webkit-font-smoothing:antialiased;
}
img,svg,canvas{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
[hidden]{display:none!important}

/* ---------- Layout ---------- */
.shell{display:flex;min-height:100vh;align-items:flex-start}

/* ---------- Sidebar ---------- */
.nav{
  position:sticky;top:0;
  width:var(--nav-w);flex:0 0 var(--nav-w);
  height:100vh;overflow-y:auto;
  border-right:1px solid var(--rule);
  padding:clamp(20px,3vw,34px) 26px 40px;
  background:var(--paper);
}
.brand{display:block;font-size:19px;font-weight:600;letter-spacing:-.02em;line-height:1}
.brand span{color:var(--blue)}
.nav-title{margin:14px 0 22px;font-size:13px;line-height:1.35;color:var(--ink-50);max-width:24ch}
.search{position:relative;margin-bottom:22px}
.search input{
  width:100%;padding:9px 30px 9px 11px;border:1px solid var(--rule);
  border-radius:0;background:var(--paper);font-size:13.5px;
}
.search input:focus{outline:2px solid var(--blue);outline-offset:-1px}
.search::after{content:"⌕";position:absolute;right:10px;top:50%;transform:translateY(-52%);color:var(--ink-50);font-size:16px;pointer-events:none}
.nav-group{margin:0 0 20px}
.nav-group > p{
  margin:0 0 7px;font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-30);
}
.nav ol{list-style:none;margin:0;padding:0}
.nav ol a{
  display:flex;gap:11px;padding:5px 0;font-size:14.5px;line-height:1.3;
  color:var(--ink-70);border-bottom:1px solid transparent;
}
.nav ol a em{font-style:normal;color:var(--ink-30);font-variant-numeric:tabular-nums;min-width:1.6em}
.nav ol a:hover{color:var(--ink)}
.nav ol a:hover em{color:var(--ink-50)}
.nav ol a.is-active{color:var(--blue);font-weight:500}
.nav ol a.is-active em{color:var(--blue)}
.nav ol li.is-hidden{display:none}
.nav-foot{margin-top:26px;padding-top:16px;border-top:1px solid var(--rule);font-size:11.5px;line-height:1.5;color:var(--ink-50)}
.nav-foot a{text-decoration:underline;text-decoration-color:var(--ink-30);text-underline-offset:2px}
.nav-foot a:hover{color:var(--blue);text-decoration-color:var(--blue)}
.nav-foot button{
  display:inline-block;margin-bottom:12px;padding:6px 11px;background:none;
  border:1px solid var(--rule);cursor:pointer;font-size:11.5px;letter-spacing:.03em;
}
.nav-foot button:hover{border-color:var(--ink);color:var(--ink)}

/* ---------- Main ---------- */
.main{flex:1 1 auto;min-width:0;padding:0 var(--pad) 0}
.topbar{display:none}

/* ---------- Chapter ---------- */
.chap{max-width:var(--maxw);padding:clamp(34px,6vh,72px) 0 96px;animation:fade .35s ease both}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.chap{animation:none}html{scroll-behavior:auto}}
.chap-num{font-size:12px;letter-spacing:.14em;color:var(--blue);margin:0 0 14px}
.chap h1{
  margin:0 0 18px;font-size:clamp(30px,4.6vw,50px);line-height:1.02;
  letter-spacing:-.028em;font-weight:400;text-wrap:balance;
}
.lead{font-size:clamp(17px,2vw,21px);line-height:1.42;letter-spacing:-.012em;color:var(--ink);margin:0 0 8px;max-width:56ch}
.lead + .lead{margin-top:14px;color:var(--ink-70);font-size:17px}

.block{margin-top:52px;padding-top:26px;border-top:1px solid var(--rule)}
.block:first-of-type{border-top:0}
.block > h2{
  margin:0 0 14px;font-size:22px;line-height:1.2;letter-spacing:-.018em;font-weight:600;
}
.block > h3,.sub{margin:26px 0 8px;font-size:16px;font-weight:600;letter-spacing:-.005em}
.block p{margin:0 0 12px}
.block p:last-child{margin-bottom:0}
.muted{color:var(--ink-70)}
.small{font-size:13.5px;line-height:1.5;color:var(--ink-70)}
strong{font-weight:600}
code,.code{font-family:var(--mono);font-size:.88em;background:var(--paper-2);padding:1px 5px;border:1px solid var(--rule-soft)}

ul,ol{margin:0 0 14px;padding-left:1.15em}
li{margin:0 0 6px}
li > ul,li > ol{margin-top:6px}
ul.plain{list-style:none;padding-left:0}
ul.plain > li{padding-left:1.1em;position:relative}
ul.plain > li::before{content:"·";position:absolute;left:.2em;color:var(--ink-30)}

/* Do / Don't Listen */
ul.ticks{list-style:none;padding-left:0}
ul.ticks > li{position:relative;padding-left:29px;margin-bottom:9px}
ul.ticks > li::before{
  position:absolute;left:0;top:.06em;width:19px;height:19px;line-height:19px;
  text-align:center;font-size:12px;font-weight:600;border-radius:50%;
}
ul.ticks > li.do::before{content:"✓";background:var(--ok-soft);color:var(--ok)}
ul.ticks > li.dont::before{content:"✕";background:var(--alert-soft);color:var(--alert)}
ul.ticks > li.info::before{content:"i";background:var(--blue-soft);color:var(--blue);font-style:italic}

/* Hinweisboxen */
.note{
  margin:20px 0;padding:15px 17px;border-left:2px solid var(--ink);
  background:var(--paper-2);font-size:14.5px;line-height:1.5;
}
.note p{margin:0 0 8px}
.note p:last-child{margin-bottom:0}
.note b{display:block;margin-bottom:4px;font-weight:600}
.note.warn{border-left-color:var(--alert);background:var(--alert-soft)}
.note.tip{border-left-color:var(--blue);background:var(--blue-soft)}
.note.new{border-left-color:var(--blue);background:var(--paper-2)}
.note.new b::after{
  content:"Neu 2026";margin-left:8px;padding:2px 6px;background:var(--blue);color:#fff;
  font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;vertical-align:2px;font-weight:500;
}

/* Call-to-Action */
.cta{margin:28px 0 0;padding:24px 26px;background:var(--ink);color:#fff}
.cta h4{margin:0 0 9px;font-size:19px;line-height:1.2;letter-spacing:-.018em;font-weight:600}
.cta p{margin:0 0 13px;font-size:14.5px;line-height:1.55;color:rgba(255,255,255,.72);max-width:58ch}
.cta p:last-of-type{margin-bottom:18px}
.cta ul{margin:0 0 20px;padding-left:1.15em;font-size:14px;line-height:1.5;color:rgba(255,255,255,.78)}
.cta ul li{margin-bottom:5px}
.cta .btn{background:#fff;border-color:#fff;color:var(--ink)}
.cta .btn:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.cta .foot{margin:14px 0 0;font-size:12px;color:rgba(255,255,255,.45)}

/* Karten */
.grid{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);margin:22px 0}
.grid.c2{grid-template-columns:repeat(2,1fr)}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.card{background:var(--paper);padding:17px 18px}
.card h4{margin:0 0 7px;font-size:14.5px;font-weight:600;letter-spacing:-.005em}
.card p{margin:0;font-size:13.5px;line-height:1.5;color:var(--ink-70)}
.card .kpi{display:block;font-size:26px;line-height:1;letter-spacing:-.03em;margin:0 0 6px}
.card.is-good{box-shadow:inset 3px 0 0 var(--ok)}
.card.is-bad{box-shadow:inset 3px 0 0 var(--alert)}
.card .tag{display:inline-block;margin-bottom:7px;font-size:10px;letter-spacing:.1em;text-transform:uppercase}
.card.is-good .tag{color:var(--ok)}
.card.is-bad .tag{color:var(--alert)}
.card .ex{font-size:14px;line-height:1.45}
.card .ex em{font-style:normal;background:var(--paper-2);padding:1px 4px}

/* Tabellen */
table.spec{width:100%;border-collapse:collapse;margin:22px 0;font-size:14px}
table.spec th,table.spec td{text-align:left;padding:10px 12px 10px 0;border-bottom:1px solid var(--rule-soft);vertical-align:top}
table.spec thead th{border-bottom:1px solid var(--ink);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-50);font-weight:500;padding-bottom:7px}
table.spec tbody tr:last-child td{border-bottom:1px solid var(--rule)}
table.spec td:first-child{font-weight:500;padding-right:20px}
.scroll-x{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* Schritt-für-Schritt */
ol.steps{list-style:none;padding-left:0;counter-reset:s;margin:22px 0}
ol.steps > li{counter-increment:s;position:relative;padding:0 0 20px 46px;border-left:1px solid var(--rule);margin-left:14px}
ol.steps > li:last-child{border-left-color:transparent;padding-bottom:0}
ol.steps > li::before{
  content:counter(s,decimal-leading-zero);position:absolute;left:-14px;top:0;
  width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;
  font-size:11px;display:grid;place-items:center;font-variant-numeric:tabular-nums;
}
ol.steps > li b{display:block;font-size:15.5px;margin-bottom:4px}
ol.steps > li p{margin:0;font-size:14px;color:var(--ink-70)}

kbd{
  font-family:var(--sans);font-size:12px;padding:2px 7px;border:1px solid var(--rule);
  border-bottom-width:2px;background:var(--paper);white-space:nowrap;
}

/* ---------- Simulatoren ---------- */
.sim{border:1px solid var(--ink);margin:26px 0;background:var(--paper)}
.sim > header{
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  padding:11px 16px;border-bottom:1px solid var(--ink);background:var(--ink);color:#fff;
}
.sim > header h4{margin:0;font-size:13.5px;font-weight:600;letter-spacing:-.005em}
.sim > header span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.6}
.sim-body{padding:18px 16px}
.sim-body > p:first-child{margin-top:0}
.field{margin-bottom:14px}
.field label{display:block;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-50);margin-bottom:5px}
.field input[type=text],.field input[type=url],.field textarea,.field select{
  width:100%;padding:9px 11px;border:1px solid var(--rule);background:var(--paper);font-size:14.5px;
}
.field textarea{min-height:78px;resize:vertical;line-height:1.45}
.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid var(--blue);outline-offset:-1px}
.counter{float:right;font-variant-numeric:tabular-nums;letter-spacing:0;text-transform:none;font-size:11.5px}
.counter.ok{color:var(--ok)}
.counter.warn{color:var(--alert)}
.meter{height:3px;background:var(--paper-3);margin-top:5px;position:relative;overflow:hidden}
.meter i{position:absolute;inset:0 auto 0 0;background:var(--ok);transition:width .18s ease,background .18s ease}
.meter i.warn{background:var(--alert)}
.controls{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin-bottom:16px;font-size:13.5px}
.controls fieldset{border:0;margin:0;padding:0;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.controls legend{float:left;margin-right:8px;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-50)}
.seg{display:inline-flex;border:1px solid var(--rule)}
.seg button{padding:6px 11px;background:none;border:0;border-right:1px solid var(--rule);cursor:pointer;font-size:13px}
.seg button:last-child{border-right:0}
.seg button[aria-pressed=true]{background:var(--ink);color:#fff}
.btn{
  display:inline-block;padding:8px 15px;border:1px solid var(--ink);background:var(--ink);
  color:#fff;cursor:pointer;font-size:13.5px;
}
.btn.ghost{background:none;color:var(--ink)}
.btn:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.btn:disabled{opacity:.35;cursor:not-allowed}
input[type=range]{width:100%;accent-color:var(--blue)}
.range-row{display:flex;align-items:center;gap:12px;font-size:13px;font-variant-numeric:tabular-nums}
.range-row output{min-width:8ch;color:var(--ink-70)}
.verdict{margin-top:14px;padding:12px 14px;font-size:14px;border:1px solid var(--rule);background:var(--paper-2)}
.verdict.pass{border-color:var(--ok);background:var(--ok-soft)}
.verdict.fail{border-color:var(--alert);background:var(--alert-soft)}
.verdict ul{margin:8px 0 0;padding-left:1.15em}
.verdict li{font-size:13.5px}

/* Dropzone */
.drop{
  border:1px dashed var(--ink-30);padding:26px 18px;text-align:center;cursor:pointer;
  background:var(--paper-2);transition:border-color .15s,background .15s;
}
.drop:hover,.drop.is-over{border-color:var(--blue);background:var(--blue-soft)}
.drop p{margin:0;font-size:14px}
.drop .small{margin-top:6px}
.imgres{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:start;margin-top:16px}
.imgres .thumb{border:1px solid var(--rule);background:var(--paper-2);overflow:hidden}
.imgres table{width:100%;border-collapse:collapse;font-size:13.5px}
.imgres td{padding:4px 0;border-bottom:1px solid var(--rule-soft);vertical-align:top}
.imgres td:first-child{color:var(--ink-50);padding-right:14px;white-space:nowrap}
.pill{display:inline-block;padding:1px 7px;font-size:11px;letter-spacing:.04em;border:1px solid currentColor}
.pill.ok{color:var(--ok)}
.pill.bad{color:var(--alert)}

/* SERP-Vorschau */
.serp{border:1px solid var(--rule);padding:16px;background:#fff;max-width:600px;font-family:Arial,Helvetica,sans-serif}
.serp .site{display:flex;align-items:center;gap:9px;margin-bottom:7px}
.serp .fav{width:26px;height:26px;border-radius:50%;background:var(--paper-3);display:grid;place-items:center;font-size:11px;color:var(--ink-50)}
.serp .site b{display:block;font-size:13px;font-weight:400;color:#202124}
.serp .site span{font-size:12px;color:#5f6368}
.serp .t{font-size:19px;line-height:1.3;color:#1a0dab;margin:0 0 3px}
.serp .d{font-size:13.5px;line-height:1.45;color:#4d5156;margin:0}
.serp .d .cut{color:#bbb}

/* object-fit Demo */
.fitwrap{display:grid;gap:14px}
.fitstage{background:var(--paper-2);padding:18px;border:1px solid var(--rule);display:flex;justify-content:center}
.fitbox{
  position:relative;overflow:hidden;background:#fff;
  outline:2px solid var(--blue);outline-offset:0;
}
.fitbox img{width:100%;height:100%;display:block}
.fitbox.cover img{object-fit:cover;object-position:center}
.fitbox.contain img{object-fit:contain}
.fitbox.free{height:auto!important}
.fitbox.free img{height:auto}
.fitlegend{font-size:13px;color:var(--ink-70)}

/* Umbruch-Demo */
.breakstage{background:var(--paper-2);border:1px solid var(--rule);padding:18px;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.breakcol{background:#fff;border:1px solid var(--rule);padding:14px;font-size:13.5px;line-height:1.5}
.breakcol h5{margin:0 0 8px;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-50)}
.breakcol .hy{hyphens:auto;-webkit-hyphens:auto}
.breakcol .nohy{hyphens:none;-webkit-hyphens:none}
.breakcol mark{background:var(--alert-soft);color:var(--alert);padding:0 2px}

/* Paste-Demo */
.pastebox{border:1px solid var(--rule);padding:12px;min-height:74px;background:#fff;font-size:14.5px}
.pastebox:focus{outline:2px solid var(--blue);outline-offset:-1px}
.pastebox[data-empty=true]::before{content:attr(data-ph);color:var(--ink-30)}
pre.out{
  margin:0;padding:12px;background:var(--ink);color:#eee;font-family:var(--mono);font-size:11.5px;
  line-height:1.5;overflow-x:auto;white-space:pre-wrap;word-break:break-word;max-height:180px;
}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* Kontrast-Demo */
.cswatch{padding:22px 18px;border:1px solid var(--rule);margin-bottom:12px}
.cswatch p{margin:0 0 6px}
.cswatch .big{font-size:22px;font-weight:600;line-height:1.2}
.cs-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.cs-row label{font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-50);display:block;margin-bottom:5px}
.cs-row input[type=color]{width:56px;height:34px;padding:0;border:1px solid var(--rule);background:none;cursor:pointer}
.cs-row input[type=text]{width:100px;padding:8px 10px;border:1px solid var(--rule);font-family:var(--mono);font-size:13px}
.ratio{font-size:34px;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}

/* Checkliste */
.check{border:1px solid var(--rule);margin:22px 0}
.check > h3{margin:0;padding:11px 15px;font-size:13px;letter-spacing:.07em;text-transform:uppercase;background:var(--paper-2);border-bottom:1px solid var(--rule);font-weight:500}
.check ul{list-style:none;margin:0;padding:0}
.check li{margin:0;border-bottom:1px solid var(--rule-soft)}
.check li:last-child{border-bottom:0}
.check label{display:flex;gap:11px;padding:10px 15px;cursor:pointer;font-size:14.5px;align-items:flex-start}
.check label:hover{background:var(--paper-2)}
.check input{margin:.28em 0 0;accent-color:var(--blue);flex:0 0 auto;width:15px;height:15px}
.check input:checked + span{color:var(--ink-50);text-decoration:line-through;text-decoration-color:var(--ink-30)}
.progress{display:flex;align-items:center;gap:12px;margin:18px 0 6px;font-size:13.5px}
.progress .bar{flex:1;height:4px;background:var(--paper-3);overflow:hidden}
.progress .bar i{display:block;height:100%;width:0;background:var(--blue);transition:width .2s ease}

/* Fußzeile */
.chap-foot{margin-top:64px;padding-top:22px;border-top:1px solid var(--ink);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:14px}
.chap-foot a{display:block}
.chap-foot span{display:block;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-30);margin-bottom:3px}
.chap-foot a b{font-weight:500;border-bottom:1px solid var(--rule)}
.chap-foot a:hover b{color:var(--blue);border-color:var(--blue)}
.chap-foot .next{text-align:right;margin-left:auto}

/* Startseite */
.cover{padding:clamp(30px,8vh,90px) 0 40px;max-width:none}
.cover h1{font-size:clamp(38px,7.5vw,84px);line-height:.98;letter-spacing:-.035em;max-width:20ch}
.cover .meta{display:flex;gap:34px;flex-wrap:wrap;margin-top:44px;padding-top:20px;border-top:1px solid var(--ink);font-size:13px;color:var(--ink-70)}
.cover .meta b{display:block;color:var(--ink);font-size:11px;letter-spacing:.09em;text-transform:uppercase;margin-bottom:4px;font-weight:500}
.quick{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);margin:40px 0 0}
@media (min-width:1280px){.quick{grid-template-columns:repeat(4,1fr)}}
.quick a{background:var(--paper);padding:18px;display:block}
.quick a:hover{background:var(--blue);color:#fff}
.quick a:hover .n,.quick a:hover p{color:rgba(255,255,255,.75)}
.quick .n{font-size:11px;letter-spacing:.1em;color:var(--blue);display:block;margin-bottom:8px}
.quick h4{margin:0 0 5px;font-size:16px;font-weight:600;letter-spacing:-.01em}
.quick p{margin:0;font-size:13px;line-height:1.45;color:var(--ink-70)}

/* Suche: Treffer */
.searchmsg{font-size:11.5px;color:var(--blue);margin:-12px 0 16px}

/* ---------- Responsive ---------- */
@media (max-width:1000px){
  :root{--nav-w:270px}
  .grid.c3{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:820px){
  .shell{display:block}
  .topbar{
    display:flex;position:sticky;top:0;z-index:20;align-items:center;justify-content:space-between;
    gap:14px;padding:12px 18px;background:var(--paper);border-bottom:1px solid var(--ink);
  }
  .topbar .brand{font-size:16px}
  .topbar button{
    padding:7px 12px;border:1px solid var(--ink);background:none;cursor:pointer;font-size:13px;
  }
  .nav{
    position:fixed;inset:53px 0 0;width:auto;height:auto;z-index:19;
    border-right:0;border-top:1px solid var(--rule);overflow-y:auto;
  }
  .nav[hidden]{display:none!important}
  .nav .brand,.nav .nav-title{display:none}
  .main{padding:0 18px}
  .chap{padding-top:26px;padding-bottom:64px}
  .grid.c2,.grid.c3,.two{grid-template-columns:1fr}
  .imgres{grid-template-columns:1fr}
  .quick{grid-template-columns:1fr}
}

/* ---------- Druck / PDF ---------- */
@media print{
  :root{--maxw:none}
  body{font-size:10.5pt;line-height:1.42}
  .nav,.topbar,.sim,.chap-foot,.quick,.searchmsg{display:none!important}
  .shell{display:block}
  .main{padding:0}
  /* Einzelansicht druckt nur das offene Kapitel, „Alles anzeigen“ druckt alle. */
  .chap{max-width:none;padding:0 0 18pt;animation:none;break-after:page}
  .chap:last-of-type{break-after:auto}
  .chap h1{font-size:20pt}
  .block{break-inside:avoid;margin-top:16pt;padding-top:8pt}
  .note,.grid,table.spec,ol.steps > li,.check,.cta{break-inside:avoid}
  .cta{background:var(--paper-2);color:var(--ink);border-left:2px solid var(--ink)}
  .cta p,.cta ul,.cta .foot{color:var(--ink-70)}
  .cta .btn{display:none}
  a{text-decoration:none}
  .cover{break-after:page}
}