.art-layout{display:grid;gap:0;grid-template-columns:minmax(0,1fr)}
@media(min-width:1180px){

  .art-layout{grid-template-columns:minmax(0,830px) 220px;gap:clamp(40px,5vw,90px);
    align-items:start;justify-content:start}
}

.art-body{
  display:grid;min-width:0;
  grid-template-columns:
    [full-start text-start] minmax(0,74ch) [text-end]
    minmax(0,1fr) [full-end];
}

.art-body{--rhythmus:clamp(34px,3.6vw,46px)}
.art-body > .art-figure,
.art-body > .art-video,
.art-body > .art-gallery,
.art-body > .art-diagram,
.art-body > .art-quote,
.art-body > .art-calc,
.art-body > .art-scale,
.art-body > .art-tbl-wrap,
.art-body > .art-vs,
.art-body > .art-merk,
.art-body > .art-tipp,
.art-body > .art-do,
.art-body > .art-x,
.art-body > .art-cta{margin:var(--rhythmus) 0}

.art-body > [class^="art-"] + [class^="art-"]{margin-top:var(--rhythmus)}

.art-body>*{grid-column:text-start/text-end}
.art-body>.art-wide{grid-column:full-start/full-end}

.art-lbl{font-family:var(--mono);font-weight:700;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--red);margin:0 0 14px;
  display:flex;align-items:center;gap:12px}
.art-lbl::after{content:"";flex:1;height:1px;background:var(--line)}

.art-tldr .art-lbl,
.art-cta  .art-lbl{color:#3FC9BF}
[data-theme="dark"] .art-tldr .art-lbl,
[data-theme="dark"] .art-cta  .art-lbl{color:#0B5B58}
.art-tldr .art-lbl::after,
.art-cta  .art-lbl::after{background:rgba(var(--paper-rgb),.25)}
.art-tldr .art-lbl{margin-bottom:18px}
.art-cta  .art-lbl{margin-bottom:16px}

.art-toc .art-lbl{font-size:9.5px;display:block;margin-bottom:14px;
  padding-bottom:12px;border-bottom:1px solid var(--ink)}
.art-toc .art-lbl::after{content:none}

.art-src .art-lbl{color:var(--ink45);margin-bottom:16px}
.art-do  .art-lbl{margin-bottom:16px}
.art-tipp .art-lbl{margin-bottom:12px}

.art-toc{display:none}
@media(min-width:1180px){
  .art-toc{display:block;position:sticky;top:96px;padding-top:clamp(46px,6vw,76px)}
}
.art-toc ol{list-style:none;display:grid;gap:11px;counter-reset:toc}
.art-toc a{counter-increment:toc;display:grid;grid-template-columns:22px 1fr;gap:8px;
  font-size:12.5px;line-height:1.45;color:var(--ink45);text-decoration:none;transition:color .18s}
.art-toc a::before{content:counter(toc,decimal-leading-zero);font-family:var(--mono);
  font-size:9.5px;letter-spacing:.06em;padding-top:2px}
.art-toc a:hover,.art-toc a.on{color:var(--red)}
.art-toc a.on::before{color:var(--red)}

.art-hero{padding:104px 0 0}
@media(min-width:900px){.art-hero{padding:132px 0 0}}
.art-head{display:grid;gap:34px;align-items:center}
@media(min-width:1000px){
  .art-head{grid-template-columns:minmax(0,1fr) minmax(0,44%);gap:clamp(40px,4.6vw,72px)}
}
.art-head-txt{min-width:0}

.art-kicker{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--red);display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:22px}
.art-kicker::after{content:"";flex:1;height:1px;background:var(--line);min-width:40px}
.art-kicker .sep{color:var(--ink45)}
.art-title{font-family:var(--body);font-weight:600;text-transform:none;
  font-size:clamp(29px,3.3vw,46px);line-height:1.07;letter-spacing:-.032em;
  max-width:17em;text-wrap:balance}
.art-title .redw{color:var(--red)}
.art-lede{margin-top:22px;font-size:clamp(16.5px,1.35vw,19px);line-height:1.55;
  color:var(--ink);max-width:46ch;font-weight:500}

.art-meta{display:flex;flex-wrap:wrap;gap:12px 26px;align-items:center;
  margin-top:28px;padding:14px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.art-meta span{font-family:var(--mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink45)}
.art-meta b{color:var(--ink);font-weight:700}
.art-meta .art-share{margin-left:auto;display:flex;gap:10px;align-items:center}
.art-share a,.art-share button{font-family:var(--mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink70);text-decoration:none;border:1px solid var(--line);
  background:none;padding:7px 11px;cursor:pointer;transition:border-color .2s,color .2s}
.art-share a:hover,.art-share button:hover{border-color:var(--red);color:var(--red)}

.art-key{position:relative;margin:0;border:1px solid var(--ink);background:var(--ink);
  box-shadow:12px 12px 0 var(--red);overflow:hidden;align-self:start}
.art-key .frame{position:relative;aspect-ratio:4/3;overflow:hidden}
@media(max-width:999px){.art-key .frame{aspect-ratio:16/9}}
.art-key video,.art-key .art-still{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;display:block}

.art-key .art-still{z-index:0}
.art-key video{z-index:1}

.art-key .keybar{position:relative;z-index:2;display:flex;justify-content:space-between;
  align-items:center;gap:14px;flex-wrap:wrap;background:var(--ink);color:var(--paper);
  padding:11px 14px}
.art-key .keybar span{font-family:var(--mono);font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(var(--paper-rgb),.62);line-height:1.6}
.art-key .keybar b{color:#3FC9BF;font-weight:700}
[data-theme="dark"] .art-key .keybar b{color:#0B5B58}
.art-key .keybar a{color:rgba(var(--paper-rgb),.62);text-decoration:none;
  border-bottom:1px solid currentColor}
.art-key .keybar a:hover{color:var(--red)}

.art-key .live{position:absolute;left:12px;top:12px;z-index:3;display:inline-flex;
  align-items:center;gap:7px;background:rgba(16,16,19,.78);color:#fff;
  font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;padding:6px 10px}
.art-key .live i{width:6px;height:6px;background:#2FB8AF;border-radius:50%;
  animation:liveBlink 2.4s ease-in-out infinite}
@keyframes liveBlink{0%,100%{opacity:1}50%{opacity:.25}}
@media(prefers-reduced-motion:reduce){.art-key .live i{animation:none}}

.art-figure{background:var(--card);border:1px solid var(--ink);box-shadow:10px 10px 0 var(--red)}
.art-figure svg,.art-figure img{display:block;width:100%;height:auto}

.geo{padding:clamp(18px,2.6vw,32px)}
.geo-frame{border:2px solid var(--red);background:rgba(var(--red-rgb),.05);
  padding:clamp(16px,2.2vw,26px)}
.geo-lbl{font-family:var(--mono);font-weight:700;font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--red)}

.geo-grid{display:grid;gap:10px;margin:16px 0 0;grid-template-columns:1fr}
@media(min-width:470px){.geo-grid{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.geo-grid{grid-template-columns:repeat(4,1fr)}}
.geo-cell{border:1px solid var(--ink);background:var(--card);padding:16px 15px;
  min-height:112px;display:flex;flex-direction:column;justify-content:space-between}

.geo-cell.out{background-image:repeating-linear-gradient(45deg,
  transparent 0 7px,rgba(var(--ink-rgb),.07) 7px 8px)}
.geo-cell.in{background:var(--red);border-color:var(--red);color:var(--on-accent)}
.geo-name{font-family:var(--body);font-weight:600;font-size:clamp(16px,1.7vw,20px);
  line-height:1.12;letter-spacing:-.018em}
.geo-state{font-family:var(--mono);font-size:9px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink45);margin-top:14px}
.geo-cell.in .geo-state{color:var(--on-accent);opacity:.85}
.geo-foot{margin-top:16px;padding-top:14px;border-top:1px solid rgba(var(--red-rgb),.35);
  font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink45);line-height:1.7}
.art-figure figcaption{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink45);line-height:1.7;
  padding:12px 16px;border-top:1px solid var(--line)}

.art-body{padding:clamp(46px,6vw,76px) 0 0}

.art-body > p{font-size:18.5px;line-height:1.78;color:var(--ink);margin-bottom:22px}
.art-body > p.small{font-size:15px;color:var(--ink70);line-height:1.7}
.art-body h2{font-family:var(--body);font-weight:600;text-transform:none;
  font-size:clamp(23px,2.6vw,32px);line-height:1.16;letter-spacing:-.026em;
  margin:52px 0 20px;padding-top:26px;border-top:1px solid var(--line);max-width:22em;
  scroll-margin-top:96px}
.art-body h3{font-family:var(--body);font-weight:600;font-size:clamp(17px,1.7vw,20px);
  line-height:1.25;margin:38px 0 16px}

.art-body a:not(:where(.btn, .art-x, .art-src-list a)){color:var(--ink);
  border-bottom:1px solid var(--red);text-decoration:none;transition:color .15s,background .15s}
.art-body a:not(:where(.btn, .art-x)):hover{color:var(--red)}
.art-body strong{font-weight:600}

.art-body>p:first-of-type::first-line{font-weight:500}

.art-tldr{background:var(--ink);color:var(--paper);padding:clamp(24px,3.4vw,40px);
  box-shadow:10px 10px 0 var(--red);margin-bottom:40px}

.art-tldr ul{list-style:none;display:grid;gap:14px}
.art-tldr li{position:relative;padding-left:28px;font-size:16.5px;line-height:1.6;
  color:rgba(var(--paper-rgb),.88)}
.art-tldr li::before{content:"";position:absolute;left:0;top:.55em;width:11px;height:11px;background:var(--red)}
.art-tldr li b{color:var(--paper);font-weight:600}

.art-quote{border-left:4px solid var(--red);background:var(--card);
  border-top:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:24px 26px}
.art-quote p{font-family:var(--mono);font-size:14px;line-height:1.75;color:var(--ink);margin:0}
.art-quote cite{display:block;margin-top:14px;font-style:normal;font-family:var(--mono);
  font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink45)}

.art-vs{display:grid;gap:1px;background:var(--ink);border:1px solid var(--ink)}
@media(min-width:720px){.art-vs{grid-template-columns:1fr 1fr}}
.art-vs>div{background:var(--card);padding:24px 26px}
.art-vs h3{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--red);margin-bottom:12px;font-weight:700}
.art-vs p{font-size:15.5px!important;line-height:1.7;color:var(--ink70);margin:0!important}
.art-vs .verdict{display:block;margin-top:14px;font-family:var(--mono);font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--ink)}

.art-video{border:1px solid var(--ink);background:var(--card)}
.art-video .stage{position:relative;aspect-ratio:16/9;background:var(--paper2);overflow:hidden}
.art-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.art-video .vplay{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;
  background:none;cursor:pointer;display:grid;place-items:center}
.art-video .vplay img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.art-video .vplay .knob{position:relative;z-index:1;display:inline-flex;align-items:center;gap:12px;
  background:var(--red);color:var(--on-accent);font-family:var(--mono);font-weight:700;
  font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;padding:15px 24px;
  transition:transform .2s,box-shadow .2s}
.art-video .vplay:hover .knob{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink)}
.art-video figcaption{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink45);padding:12px 16px;border-top:1px solid var(--line);line-height:1.7}
.art-video figcaption a{color:var(--red);text-decoration:none;border-bottom:1px solid currentColor}

.art-gallery .grid{display:grid;gap:10px;grid-template-columns:1fr}
@media(min-width:640px){.art-gallery .grid{grid-template-columns:1fr 1fr}}
.art-gallery figure{margin:0;border:1px solid var(--ink);background:var(--card)}
.art-gallery img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.art-gallery figcaption{font-family:var(--mono);font-size:9px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink45);padding:10px 12px;border-top:1px solid var(--line);line-height:1.7}

.art-body .art-credit{margin:12px 0 0;font-family:var(--mono);font-size:9.5px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink45);line-height:1.8}
.art-credit a{color:var(--red);text-decoration:none;border-bottom:1px solid currentColor}

.art-diagram{border:1px solid var(--ink);background:#fff}
.art-diagram img{display:block;width:100%;height:auto;padding:clamp(10px,1.6vw,20px)}
.art-diagram figcaption{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink45);padding:12px 16px;border-top:1px solid var(--line);
  background:var(--card);line-height:1.7}

.art-x{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
  border:1px solid var(--ink);border-left:4px solid var(--red);background:var(--card);
  padding:22px 24px;text-decoration:none;color:var(--ink);
  transition:transform .2s,box-shadow .2s}
.art-x:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--red)}
.art-x .q{font-size:16px;line-height:1.55;max-width:52ch}
.art-x .q b{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--red);margin-bottom:7px}
.art-x .l{font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--red);white-space:nowrap}

.art-do{border:1px solid var(--ink);background:var(--card);padding:clamp(22px,3vw,34px)}
.art-do .checklist li{font-size:16px;color:var(--ink)}

.art-src{margin-top:56px;padding-top:26px;border-top:1px solid var(--ink)}
.art-src-list{list-style:none;display:grid;gap:11px;counter-reset:src}
.art-src-list li{counter-increment:src;position:relative;padding-left:30px;
  font-size:14px;line-height:1.65;color:var(--ink70)}
.art-src-list li::before{content:counter(src);position:absolute;left:0;top:0;
  font-family:var(--mono);font-size:10px;font-weight:700;color:var(--red);
  border:1px solid var(--line);width:20px;height:20px;display:grid;place-items:center}
.art-src-list a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line);word-break:break-word}
.art-src-list a:hover{color:var(--red);border-color:var(--red)}

.art-author{display:flex;gap:22px;align-items:center;flex-wrap:wrap;
  border:1px solid var(--ink);background:var(--card);padding:24px;margin-top:44px}
.art-author img{width:74px;height:74px;object-fit:cover;flex:none;
  border:1px solid var(--ink);filter:grayscale(1) contrast(1.1)}
.art-author .who{min-width:0;flex:1}
.art-author .who b{display:block;font-size:16px;font-weight:600}

.art-author .role{font-family:var(--mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--red);display:block;margin:4px 0 8px}
.art-author .who p{font-size:14px!important;line-height:1.65;color:var(--ink70);
  margin:0!important;max-width:52ch;font-family:var(--body);text-transform:none;letter-spacing:0}

.art-revision{margin-top:30px;border:1px dashed var(--line);padding:16px 18px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;line-height:1.85;color:var(--ink45)}
.art-revision b{color:var(--red)}

@media(max-width:760px){
  .art-body > p{font-size:17px;line-height:1.72}
  .art-meta .art-share{margin-left:0;width:100%}
  .art-figure{box-shadow:6px 6px 0 var(--red)}
  .art-tldr{box-shadow:6px 6px 0 var(--red)}
}

.art-scale{border:1px solid var(--ink);background:var(--card);padding:clamp(18px,2.6vw,30px)}
.art-scale-grid{display:grid;gap:10px;grid-template-columns:1fr;margin-top:16px}
@media(min-width:560px){.art-scale-grid{grid-template-columns:1fr 1fr}}

@media(min-width:1000px){.art-scale-grid{grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr))}}
.art-step{border:1px solid var(--line);background:var(--paper);padding:15px 14px;
  display:flex;flex-direction:column;gap:7px}
.art-step .n{font-family:var(--body);font-weight:600;font-size:clamp(19px,2vw,24px);
  line-height:1;letter-spacing:-.028em;color:var(--red)}
.art-step .w{font-family:var(--mono);font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink45)}
.art-step p{font-size:13.5px!important;line-height:1.55;color:var(--ink70);margin:0!important}

.art-step .bar{height:5px;background:var(--red);opacity:.28}
.art-step.hot .bar{opacity:1}

.art-tbl-wrap{border:1px solid var(--ink);background:var(--card);overflow-x:auto;
  -webkit-overflow-scrolling:touch}
.art-tbl{width:100%;border-collapse:collapse;font-size:13.5px;min-width:560px}
.art-tbl th{font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;
  text-align:left;padding:11px 13px;background:var(--ink);color:var(--paper);white-space:nowrap}
.art-tbl td{padding:10px 13px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.5}
.art-tbl tr:last-child td{border-bottom:none}
.art-tbl tbody tr:hover td{background:rgba(var(--red-rgb),.04)}
.art-tbl .mono{font-family:var(--mono);font-size:11.5px;white-space:nowrap}
.art-tbl b{font-weight:600}
.art-tbl .ja{color:var(--c-teal);font-weight:600}

.art-tbl .nein{color:var(--c-warm);font-weight:600}
.art-tbl-note{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;
  color:var(--ink45);line-height:1.7;padding:11px 13px;border-top:1px solid var(--line)}

.art-calc{display:grid;gap:1px;background:var(--ink);border:1px solid var(--ink)}

@media(min-width:720px){.art-calc{grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr))}}
.art-calc > div{background:var(--card);padding:20px 22px}
.art-calc .zahl{font-family:var(--body);font-weight:600;font-size:clamp(26px,3.2vw,38px);
  line-height:1;letter-spacing:-.03em;color:var(--red)}
.art-calc .lab{font-family:var(--mono);font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink45);margin-top:10px;display:block}
.art-calc p{font-size:13.5px!important;line-height:1.6;color:var(--ink70);margin:8px 0 0!important}

.art-merk{border-left:4px solid var(--red);background:var(--card);
  border-top:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:20px 24px}
.art-merk p{font-size:17px!important;line-height:1.6;color:var(--ink);margin:0!important;max-width:60ch}
.art-merk b{font-weight:600}

.art-cta{border:1px solid var(--ink);background:var(--ink);color:var(--paper);
  padding:clamp(24px,3.4vw,40px);box-shadow:10px 10px 0 var(--red)}
.art-cta-grid{display:grid;gap:24px}
@media(min-width:820px){
  .art-cta-grid{grid-template-columns:minmax(0,1fr) auto;gap:clamp(30px,4vw,56px);align-items:center}
}
.art-cta h3{font-family:var(--body);font-weight:600;font-size:clamp(20px,2.2vw,27px);
  line-height:1.14;letter-spacing:-.026em;color:var(--paper);margin:0 0 12px}
.art-cta p:not(.art-lbl){font-size:15.5px;line-height:1.65;color:rgba(var(--paper-rgb),.78);
  margin:0;max-width:54ch}
.art-cta .tun{display:grid;gap:12px;justify-items:start}
@media(min-width:820px){.art-cta .tun{justify-items:stretch}}

.art-cta .hinweis{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(var(--paper-rgb),.72);line-height:1.7}

.art-tipp{border:1px solid var(--ink);border-left:4px solid var(--red);background:var(--card);
  padding:clamp(20px,2.6vw,28px)}
.art-tipp p:not(.art-lbl){font-size:16px;line-height:1.7;color:var(--ink);margin:0 0 10px;max-width:62ch}
.art-tipp p:last-child{margin-bottom:0}
.art-tipp b{font-weight:600}

.art-body .art-tldr li a{color:var(--paper);text-decoration:none;
  border-bottom:1px solid rgba(var(--paper-rgb),.35)}
.art-body .art-tldr li a:hover{border-color:#3FC9BF;color:#3FC9BF}
[data-theme="dark"] .art-body .art-tldr li a:hover{border-color:#0B5B58;color:#0B5B58}

.art-brot{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:22px;
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase}

.art-brot::after{content:"";flex:1;height:1px;background:var(--line);min-width:40px}
.art-brot a{color:var(--ink45);text-decoration:none;transition:color .15s}
.art-brot a:hover{color:var(--red)}
.art-brot .sep{color:var(--ink45);opacity:.5}
.art-brot .hier{color:var(--red);font-weight:700}

.art-share{display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:14px 0 0;margin:0}
.art-share .art-share-lbl{font-family:var(--mono);font-size:9px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink45);margin-right:4px}
.art-share a,.art-share button{display:inline-flex;align-items:center;gap:7px;
  font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink70);text-decoration:none;
  border:1px solid var(--line);background:none;padding:8px 12px;cursor:pointer;
  transition:border-color .18s,color .18s,background .18s}
.art-share a:hover,.art-share button:hover{border-color:var(--red);color:var(--red);
  background:rgba(var(--red-rgb),.05)}
.art-share svg{width:13px;height:13px;flex:none;fill:currentColor}
.art-share button.kopiert{border-color:var(--c-teal);color:var(--c-teal)}
@media(max-width:520px){
  .art-share .art-share-lbl{width:100%;margin:0 0 4px}
  .art-share a,.art-share button{font-size:9.5px;padding:7px 10px}
}

.art-serie{border:1px solid var(--line);background:var(--card);
  padding:clamp(18px,2.2vw,24px)}
.art-serie ol{list-style:none;margin:0;padding:0;display:grid;gap:1px;
  background:var(--line);border:1px solid var(--line);
  grid-template-rows:auto auto auto}
@media(min-width:820px){.art-serie ol{grid-template-columns:repeat(4,1fr)}}
.art-serie li{background:var(--card);padding:14px 16px;min-width:0;position:relative;
  display:grid;gap:6px;grid-row:span 3;grid-template-rows:subgrid;align-content:start}

@supports not (grid-template-rows:subgrid){
  .art-serie li{display:flex;flex-direction:column}
}
.art-serie li.hier{background:var(--ink)}
.art-serie .n{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink45);align-self:start}

.art-serie li.hier .n{color:#3FC9BF}
[data-theme="dark"] .art-serie li.hier .n{color:#0B5B58}

.art-serie a{font-size:14.5px;line-height:1.45;color:var(--ink);
  text-decoration:none;border:0;font-weight:600;align-self:start}
.art-serie a::after{content:"";position:absolute;inset:0}
.art-serie li:has(a):hover{background:var(--paper)}
.art-serie li:has(a):hover a{color:var(--red)}
.art-serie li.hier span.titel{font-size:14.5px;line-height:1.45;
  color:var(--paper);font-weight:600;align-self:start}
.art-serie li p{font-size:12.5px;line-height:1.5;color:var(--ink45);margin:0;align-self:start}
.art-serie li.hier p{color:var(--paper);opacity:.72}

.art-hero-voll{padding:0;position:relative}
.art-key-voll{position:relative;margin:0;isolation:isolate;
  min-height:clamp(440px,64svh,700px);display:flex;align-items:flex-end;overflow:hidden}
.art-key-voll .frame{position:absolute;inset:0;z-index:0;aspect-ratio:auto}
.art-key-voll .art-still,.art-key-voll img,.art-key-voll video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.art-key-scrim{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:

    linear-gradient(180deg, rgba(var(--paper-rgb),.90) 0%, rgba(var(--paper-rgb),.42) 7%,
      rgba(var(--paper-rgb),0) 17%),

    linear-gradient(180deg, rgba(8,8,10,0) 10%, rgba(8,8,10,.22) 34%,
      rgba(8,8,10,.42) 58%, rgba(8,8,10,.66) 82%, rgba(8,8,10,.80) 100%)}
.art-key-txt{position:relative;z-index:2;width:100%;
  padding-top:clamp(150px,20vw,280px);padding-bottom:clamp(28px,3.4vw,48px)}

.art-key-txt::before{content:'';position:absolute;z-index:-1;pointer-events:none;
  left:calc(50% - 50vw);width:100vw;bottom:0;top:calc(clamp(150px,20vw,280px) - 112px);
  background:linear-gradient(180deg, rgba(8,8,10,0) 0, rgba(8,8,10,.52) 72px,
    rgba(8,8,10,.62) 100%)}
.art-key-voll .art-title,.art-key-voll .art-lede{color:#F4F2EC}
.art-key-voll .art-title{max-width:20em}
.art-key-voll .art-lede{max-width:42em;opacity:.95}
.art-key-voll .art-title .redw{color:#3FC9BF}

.art-key-voll .art-brot a,.art-key-voll .art-brot .hier{color:#F4F2EC}
.art-key-voll .art-brot a:hover{color:#3FC9BF}
.art-key-voll .art-brot::after{background:rgba(244,242,236,.28)}
.art-key-voll .art-meta{border-top-color:rgba(244,242,236,.42);
  border-bottom-color:rgba(244,242,236,.2)}
.art-key-voll .art-meta span{color:rgba(244,242,236,.8)}
.art-key-voll .art-meta b{color:#F4F2EC}
.art-key-voll .art-share .art-share-lbl{color:rgba(244,242,236,.75)}
.art-key-voll .art-share a,.art-key-voll .art-share button{
  color:#F4F2EC;border-color:rgba(244,242,236,.38)}
.art-key-voll .art-share a:hover,.art-key-voll .art-share button:hover{
  border-color:#3FC9BF;color:#3FC9BF}

.art-key-voll .keybar{display:none}
@media(max-width:720px){
  .art-key-voll{min-height:clamp(420px,76svh,640px)}
  .art-key-txt{padding-top:clamp(120px,30vw,200px)}
}