/* by.jadla v4 · dezent: Raster, Zahlen, ein kleiner blauer Kreis als Signatur. Ein Akzent, viel Weißraum, nur Hover + Einblenden. Mobil zuerst. */
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/inter-latin.woff2) format("woff2")}

:root{--paper:#f3f2ee;--ink:#161616;--mute:#77746d;--soft:#46443f;--line:rgba(22,22,22,.055);--rule:rgba(22,22,22,.16);--acc:#1f35c9;
  --m:20px;--g:12px;--n:4;--top:60px}
@media (min-width:761px){:root{--m:32px;--g:20px;--n:12}}
@media (min-width:1600px){:root{--m:48px;--g:24px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--top) + 16px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.55 Inter,system-ui,sans-serif;font-feature-settings:"ss01","cv11","tnum";-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%;height:auto}
button,input,textarea{font:inherit;color:inherit}
::selection{background:var(--acc);color:#fff}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0;padding:0}
ul,ol{list-style:none}

/* Raster: feine Spalten als einziges Bauhaus-Element im Hintergrund */
.cols{position:fixed;inset:0 var(--m);display:grid;grid-template-columns:repeat(var(--n),1fr);column-gap:var(--g);pointer-events:none;z-index:0}
.cols i{border-left:1px solid var(--line);border-right:1px solid var(--line)}
.cols i:nth-child(n+5){display:none}
@media (min-width:761px){.cols i:nth-child(n+5){display:block}}
.g{position:relative;z-index:1;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));column-gap:var(--g);padding:0 var(--m)}
main>section.g,main>article.g{border-top:1px solid var(--rule);margin:0 var(--m);padding:22px 0 96px}
main>section.g:first-child{border-top:0}
@media (min-width:761px){main>section.g,main>article.g{padding:28px 0 168px}}

/* Signatur: ein kleiner Kreis */
.sig{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--acc);margin-right:9px;vertical-align:.08em}

/* Kopfzeile */
.top{position:sticky;top:0;z-index:20;height:var(--top);align-items:center;background:rgba(243,242,238,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--rule);font-size:13px;line-height:1.25}
.brand{grid-column:1 / span 2;font-weight:600;font-size:15px;letter-spacing:-.01em}
.nav{display:none;gap:24px;color:var(--soft)}
.nav a:hover,.nav a[aria-current]{color:var(--ink)}
.nav a[aria-current]{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.kbtn{grid-column:3 / span 2;justify-self:end;display:flex;align-items:center;gap:10px;height:34px;padding:0 5px 0 12px;border:1px solid var(--rule);background:transparent;cursor:pointer;font-size:13px;font-weight:500;transition:border-color .2s}
.kbtn:hover{border-color:var(--ink)}
kbd{font:500 11px/1 Inter,system-ui;border:1px solid var(--rule);padding:4px 5px;color:var(--mute)}
@media (min-width:761px){
  .brand{grid-column:1 / span 3}
  .nav{display:flex;grid-column:7 / span 4}
  .kbtn{grid-column:11 / span 2}
}
@media (hover:none){.kbtn kbd,.ask kbd{display:none}.kbtn{padding-right:12px}}

/* Typo, ruhig */
.h1{grid-column:1 / -1;font-weight:600;letter-spacing:-.035em;line-height:1.02;font-size:clamp(38px,6.2vw,84px);max-width:16ch}
.h2{grid-column:1 / -1;font-weight:600;letter-spacing:-.025em;line-height:1.08;font-size:clamp(26px,3.4vw,46px);margin-bottom:40px;max-width:22ch}
@media (min-width:761px){.h2{grid-column:1 / span 8;margin-bottom:64px}}
.sec{grid-column:1 / -1;display:flex;gap:14px;align-items:baseline;font-size:12px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:32px}
.sec b{font-weight:600}
.sec span{color:var(--mute)}
.lbl{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);font-weight:400}
h3{font-size:16px;font-weight:600;letter-spacing:-.01em;line-height:1.3;margin-bottom:8px}

/* Hero (Unterseiten) */
main>section.hero{padding-top:40px;row-gap:24px}
.lead{grid-column:1 / -1;font-size:18px;line-height:1.45;color:var(--soft);max-width:44ch}
.hero-price{grid-column:1 / -1;display:grid;grid-template-columns:auto 1fr;column-gap:16px;align-items:baseline;border-top:1px solid var(--rule);padding-top:14px;max-width:560px}
.hero-price .lbl{grid-column:1 / -1;margin-bottom:6px}
.hero-price b{font-weight:600;font-size:34px;letter-spacing:-.03em;line-height:1}
.hero-price span:last-child{font-size:14px;color:var(--mute);line-height:1.4}
.ctas{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.btn{display:inline-flex;align-items:center;height:48px;padding:0 20px;background:var(--ink);color:var(--paper);font-weight:500;font-size:15px;border:1px solid var(--ink);transition:background .2s,color .2s}
.btn:hover{background:transparent;color:var(--ink)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--rule)}
.btn.ghost:hover{border-color:var(--ink)}
@media (min-width:761px){
  main>section.hero{padding-top:88px;row-gap:32px}
  .h1{grid-column:1 / span 10}
  .lead{grid-column:1 / span 6;font-size:20px}
  .hero-price{grid-column:1 / span 6}
}

/* ============ Landing = Linktree ============ */
.hub .cols i{border-color:rgba(22,22,22,.04)}
main.lt{padding-top:36px;padding-bottom:56px;row-gap:0}
.lt>*{grid-column:1 / -1}
@media (min-width:761px){.lt>*{grid-column:4 / span 6}main.lt{padding-top:48px;padding-bottom:88px}}
@media (min-width:1200px){.lt>*{grid-column:5 / span 4}}
.lt-in{display:grid;grid-template-columns:88px 1fr;column-gap:16px;row-gap:16px;align-items:center;margin-bottom:28px}
.lt-pic{width:88px;aspect-ratio:1;overflow:hidden;background:#dedbd4}
.lt-pic video{width:100%;height:100%;object-fit:cover}
.lt-name{font-weight:600;font-size:clamp(26px,3vw,34px);letter-spacing:-.03em;line-height:1.05}
.lt-role{font-size:15px;color:var(--mute);margin-top:4px}
.lt-role::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--acc);margin-right:8px;vertical-align:.06em}
.lt-line{grid-column:1 / -1;font-size:17px;line-height:1.45;color:var(--soft);max-width:40ch}
.lt-meta{grid-column:1 / -1;font-size:12px;letter-spacing:.04em;color:var(--mute);display:flex;flex-wrap:wrap;gap:4px 18px}
@media (min-width:761px){.lt-in{grid-template-columns:104px 1fr;column-gap:20px}.lt-pic{width:104px}}

.lt-list{border-top:1px solid var(--rule);counter-reset:none}
.lk{display:grid;grid-template-columns:30px 1fr 20px;column-gap:12px;row-gap:2px;align-items:baseline;padding:17px 0 18px;border-bottom:1px solid var(--rule);transition:padding .25s ease}
.lk-n{grid-row:1 / span 2;font-size:12px;color:var(--mute);padding-top:5px}
.lk-t{font-weight:600;font-size:21px;letter-spacing:-.02em;line-height:1.2}
.lk-s{grid-column:2;font-size:14px;color:var(--mute);line-height:1.4;overflow-wrap:anywhere}
.lk-a{grid-column:3;grid-row:1;justify-self:end;font-size:17px;color:var(--mute);transition:transform .25s ease,color .2s}
.lk:hover .lk-t{color:var(--acc)}
.lk:hover .lk-a{transform:translateX(4px);color:var(--ink)}
@media (hover:hover){.lk:hover{padding-left:6px}}
@media (min-width:761px){.lk{padding:20px 0 21px}.lk-t{font-size:23px}}

.ask{display:flex;align-items:center;gap:12px;height:48px;margin-top:20px;padding:0 6px 0 14px;border:1px solid var(--rule);background:transparent;cursor:text;text-align:left;font-size:14px;color:var(--mute);transition:border-color .2s}
.ask:hover{border-color:var(--ink)}
.ask-t{flex:1}
.lt-notes{margin-top:48px}
.lt-notes .lbl{display:block;margin-bottom:12px}
.lt-proof{margin-top:40px;font-size:13px;color:var(--soft);line-height:1.6}
.lt-proof .lbl{margin-right:6px}
.mini.g{margin:0 var(--m);padding:20px 0 32px;border-top:1px solid var(--rule);font-size:12px;color:var(--mute)}
.mini p{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:6px 20px}
.mini a:hover{color:var(--ink)}
@media (min-width:761px){.mini p{grid-column:4 / span 6}}
@media (min-width:1200px){.mini p{grid-column:5 / span 4}}

/* Bildtafeln */
.fig{margin:0}
.frame{position:relative;overflow:hidden;background:#dedbd4}
.frame img,.frame video{width:100%;height:100%;object-fit:cover}
figcaption{font-size:12px;color:var(--mute);margin-top:10px;line-height:1.4}
figcaption b{color:var(--ink);font-weight:600;margin-right:6px}

/* Beleg-Leiste */
main>section.proof{row-gap:12px;padding-bottom:56px}
.proof .lbl{grid-column:1 / -1}
.proof-l{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:4px 24px}
.proof-l li{font-weight:500;font-size:clamp(17px,2vw,24px);letter-spacing:-.02em;color:var(--soft)}
@media (min-width:761px){main>section.proof{padding-bottom:80px}.proof .lbl{grid-column:1 / span 2;padding-top:5px}.proof-l{grid-column:3 / span 10}}

/* Fallstudien */
.case .h2{margin-bottom:10px}
.case-sub{grid-column:1 / -1;font-size:15px;color:var(--mute);margin-bottom:40px}
.case .fig{grid-column:1 / -1;margin-bottom:24px}
.c-a .frame,.c-c .frame,.c-d .frame,.c-z .frame{aspect-ratio:16/9}.c-b .frame{aspect-ratio:4/5}
.cols3{grid-column:1 / -1;display:grid;gap:28px;margin:20px 0 40px}
.cols3>div{border-top:1px solid var(--rule);padding-top:14px}
.cols3 p{font-size:15px;line-height:1.55;color:var(--soft)}
.nums li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:baseline;padding:3px 0;font-size:15px;color:var(--soft)}
.nums b{font-weight:600;font-size:30px;line-height:1;min-width:1.1em;color:var(--ink);letter-spacing:-.02em}
.crole{font-size:14px;color:var(--mute);margin-top:10px}
.links{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:10px 28px;font-weight:500;font-size:15px}
.links a{border-bottom:1px solid var(--ink);padding-bottom:2px;transition:color .2s,border-color .2s}
.links a:hover{color:var(--acc);border-color:var(--acc)}
@media (min-width:761px){
  .case-sub{grid-column:1 / span 8;margin-bottom:64px}
  .c-a{grid-column:1 / span 8!important}.c-b{grid-column:9 / span 4!important;align-self:end}
  .c-c{grid-column:1 / span 6!important}.c-d{grid-column:7 / span 6!important}
  .cols3{grid-template-columns:repeat(3,1fr);gap:var(--g);margin:32px 0 64px}
  .c-z{grid-column:1 / span 7!important;grid-row:4 / span 2;margin:0!important}
  .cols3.z{grid-column:9 / span 4;grid-template-columns:1fr;margin:0 0 40px;grid-row:4;gap:24px}
  #zybr .links{grid-column:9 / span 4;grid-row:5;align-self:end}
}

/* Weitere Arbeiten */
.more-r{grid-column:1 / -1;display:grid;grid-template-columns:1fr;gap:12px;padding:20px 0;border-top:1px solid var(--rule)}
.more-r .n{font-weight:600;font-size:22px;letter-spacing:-.02em}
.more-r .t{font-size:15px;line-height:1.5;max-width:46ch;color:var(--soft)}
.more-r .m{display:block;aspect-ratio:16/9;overflow:hidden;background:#dedbd4}
.more-r .m img{width:100%;height:100%;object-fit:cover}
.more-r .m.big{background:transparent;aspect-ratio:auto;font-weight:600;font-size:40px;line-height:1;letter-spacing:-.03em}
.more-r .m.big small{font-size:14px;font-weight:400;color:var(--mute);letter-spacing:0}
.more-r .n{transition:color .2s}.more-r:hover .n{color:var(--acc)}
@media (min-width:761px){
  .more-r{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--g);padding:28px 0;align-items:start}
  .more-r .n{grid-column:span 3}.more-r .t{grid-column:span 5;font-size:16px}.more-r .m{grid-column:span 4}
  .more-r .m.big{font-size:clamp(40px,4vw,60px);text-align:right}
}

/* Methode */
.pr-l{grid-column:1 / -1;display:grid;border-top:1px solid var(--rule)}
.pr-l li{display:grid;grid-template-columns:40px 1fr;column-gap:12px;padding:20px 0;border-bottom:1px solid var(--line)}
.pr-l b{font-size:12px;font-weight:600;color:var(--mute);padding-top:3px;grid-row:1 / span 2}
.pr-l h3{font-size:19px;letter-spacing:-.02em;margin-bottom:4px}
.pr-l p{grid-column:2;color:var(--soft);font-size:15px}
@media (min-width:761px){
  .pr-l{grid-template-columns:repeat(4,1fr);column-gap:var(--g);border-top:0}
  .pr-l li{grid-template-columns:1fr;border-top:1px solid var(--rule);border-bottom:0;padding:18px 16px 0 0}
  .pr-l b{grid-row:auto;margin-bottom:48px}.pr-l p{grid-column:1}.pr-l h3{font-size:21px}
}

/* Preise */
.pl{grid-column:1 / -1;display:grid;gap:12px}
.pl-i{border:1px solid var(--rule);padding:20px 20px 22px}
.pl-i.pl-on{border-color:var(--ink);box-shadow:inset 0 2px 0 var(--acc)}
.pl-i h3{font-size:12px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;display:flex;align-items:center}
.pl-on h3::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--acc);margin-right:8px}
.pl-p{font-weight:600;font-size:clamp(36px,4vw,52px);letter-spacing:-.04em;line-height:1;margin:22px 0 6px}
.pl-u{font-size:13px;color:var(--mute);margin-bottom:20px}
.pl-i ul li{padding:8px 0;border-top:1px solid var(--line);font-size:14px;color:var(--soft)}
.pl-f{margin-top:14px;font-size:13px;color:var(--mute)}
.pl-note{grid-column:1 / -1;margin-top:20px;font-size:13px;color:var(--mute)}
@media (min-width:761px){.pl{grid-template-columns:repeat(3,1fr);gap:var(--g)}.pl-i{padding:28px}.pl-note{grid-column:1 / span 8}}

/* Brief-Formular */
.brief-p{grid-column:1 / -1;font-size:16px;line-height:1.5;margin:-16px 0 32px;max-width:52ch;color:var(--soft)}
.brief-p a{border-bottom:1px solid var(--ink);color:var(--ink)}
.inq{grid-column:1 / -1;display:grid;grid-template-columns:1fr;gap:16px}
.f{display:flex;flex-direction:column;gap:6px}
.f span{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.f input,.f textarea{border:0;border-bottom:1px solid var(--rule);background:transparent;padding:10px 0;font-size:17px;border-radius:0}
.f input:focus,.f textarea:focus{outline:none;border-bottom:1px solid var(--acc)}
.f textarea{resize:vertical;min-height:110px}
.budget{border:0;padding:0;margin:6px 0;display:flex;flex-wrap:wrap;gap:8px}
.budget legend,.picks legend{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin-bottom:10px;padding:0}
.send{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.send .msg{margin:0}
@media (min-width:761px){.brief-p{grid-column:1 / span 7}.inq{grid-column:1 / span 9;grid-template-columns:1fr 1fr;column-gap:var(--g);row-gap:24px}.inq .full,.budget{grid-column:1 / -1}}

/* Warteliste */
.notes-p{grid-column:1 / -1;font-size:16px;line-height:1.5;max-width:46ch;color:var(--soft);margin:-16px 0 28px}
.wl{grid-column:1 / -1}
.wl-row{display:flex;border:1px solid var(--rule);transition:border-color .2s}
.wl-row:focus-within{border-color:var(--ink)}
.wl-row input{flex:1;min-width:0;height:50px;border:0;background:transparent;padding:0 14px;font-size:16px}
.wl-row input:focus{outline:none}
.wl button,.inq button{height:50px;padding:0 20px;border:0;background:var(--ink);color:var(--paper);font-weight:500;cursor:pointer;transition:background .2s}
.wl button:hover,.inq button:hover{background:var(--acc)}
.wl button:disabled,.inq button:disabled{opacity:.5;cursor:wait}
.msg{min-height:1.5em;margin-top:8px;font-size:14px;color:var(--soft)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.picks{border:0;padding:0;margin:0 0 16px;display:flex;flex-wrap:wrap;gap:8px}
.picks label,.budget label{position:relative;cursor:pointer}
.picks input,.budget input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.picks span,.budget span{display:inline-block;padding:9px 13px;border:1px solid var(--rule);font-size:14px;transition:border-color .2s}
.picks label:hover span,.budget label:hover span{border-color:var(--ink)}
.picks input:checked+span,.budget input:checked+span{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.picks input:focus-visible+span,.budget input:focus-visible+span{outline:2px solid var(--acc);outline-offset:2px}
@media (min-width:761px){.notes-p{grid-column:1 / span 6}main .wl{grid-column:1 / span 7}}
@media (max-width:420px){.wl-row{flex-wrap:wrap}.wl-row input{flex:1 1 100%}.wl-row button{flex:1 1 100%}}

/* Eigene Filme */
.idx-p{grid-column:1 / -1;color:var(--mute);font-size:15px;margin:-24px 0 32px;max-width:52ch}
.idx-list{grid-column:1 / -1;border-top:1px solid var(--rule)}
.row{display:grid;grid-template-columns:32px 1fr auto;column-gap:10px;padding:14px 0;border-bottom:1px solid var(--line);align-items:baseline}
.row .n{font-size:12px;color:var(--mute)}
.row .t{font-weight:600;font-size:17px;letter-spacing:-.015em}
.row .f{grid-column:2;font-size:13px;color:var(--mute)}
.row .c{grid-column:2;font-size:13px;color:var(--soft)}
.row .ar{grid-column:3;grid-row:1;color:var(--mute)}
a.row:hover .t{color:var(--acc)}
.pv{display:none}
@media (min-width:761px){
  .idx-p{grid-column:1 / span 6}
  .row{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--g);padding:16px 0}
  .row .n{grid-column:span 1}.row .t{grid-column:span 5;font-size:19px}
  .row .f{grid-column:span 3;font-size:14px}.row .c{grid-column:span 2;font-size:14px}.row .ar{grid-column:span 1;grid-row:auto;text-align:right}
  .pv{display:block;position:fixed;top:0;left:0;width:260px;aspect-ratio:4/3;pointer-events:none;z-index:15;opacity:0;transition:opacity .2s;background:#dedbd4}
  .pv img{width:100%;height:100%;object-fit:cover}
  .pv.on{opacity:1}
}

/* Desk */
.facts{grid-column:1 / -1}
.facts div{display:grid;grid-template-columns:84px 1fr;gap:12px;padding:14px 0;border-top:1px solid var(--rule)}
.facts dt{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);padding-top:3px}
.facts dd{font-size:16px;line-height:1.45;color:var(--soft)}
.stamp{grid-column:4 / span 1;justify-self:end;width:56px;height:auto;margin-top:28px;opacity:.9}
@media (min-width:761px){.facts{grid-column:1 / span 8}.stamp{grid-column:12 / span 1;grid-row:3;align-self:end;width:64px}}

/* FAQ */
.faq-l{grid-column:1 / -1;border-top:1px solid var(--rule)}
.faq-l details{border-bottom:1px solid var(--line)}
.faq-l summary{list-style:none;cursor:pointer;padding:18px 36px 18px 0;font-weight:500;font-size:17px;letter-spacing:-.01em;position:relative}
.faq-l summary::-webkit-details-marker{display:none}
.faq-l summary::after{content:"+";position:absolute;right:4px;top:15px;font-weight:300;font-size:22px;color:var(--mute)}
.faq-l details[open] summary::after{content:"–"}
.faq-l p{padding:0 0 20px;max-width:60ch;color:var(--soft);font-size:15px}
.faq-l p a{border-bottom:1px solid currentColor}
@media (min-width:761px){.faq-l{grid-column:5 / span 8}.faq .h2{grid-column:1 / span 4;font-size:clamp(24px,2.4vw,34px)}}

/* Learn */
.ld{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:28px var(--g)}
.ld li{border-top:1px solid var(--ink);padding-top:14px}
.ld b{display:block;font-weight:600;font-size:clamp(20px,2.2vw,28px);letter-spacing:-.025em;margin-bottom:6px}
.ld span{font-size:14px;color:var(--soft)}
@media (min-width:761px){.ld{grid-template-columns:repeat(4,1fr)}}
.free-card{grid-column:1 / -1;border:1px solid var(--rule);padding:24px 20px}
.free-h{font-weight:600;font-size:clamp(24px,3vw,38px);letter-spacing:-.025em;line-height:1.1;margin:14px 0 16px;max-width:22ch}
.free-p{max-width:50ch;color:var(--soft);margin-bottom:24px;font-size:15px}
@media (min-width:761px){.free-card{grid-column:1 / span 9;padding:40px}.free-card .wl{max-width:600px}}
.crs{grid-column:1 / -1;border-top:1px solid var(--rule)}
.crs li{display:grid;grid-template-columns:40px 1fr;column-gap:12px;padding:24px 0;border-bottom:1px solid var(--line)}
.crs b{font-size:13px;font-weight:600;color:var(--mute);padding-top:6px}
.crs h3{font-size:clamp(20px,2.2vw,28px);letter-spacing:-.02em;line-height:1.15;margin-bottom:10px;font-weight:600}
.crs p{color:var(--soft);max-width:56ch;font-size:15px}
.crs .st{grid-column:2;margin-top:12px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
@media (min-width:761px){.crs li{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--g);padding:32px 0}.crs b{grid-column:span 1}.crs li>div{grid-column:span 9}.crs .st{grid-column:span 2;text-align:right;margin:8px 0 0}}
.mods{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px;counter-reset:m}
.mods li{font-size:13px;border:1px solid var(--rule);padding:5px 10px;color:var(--soft)}
.mods li::before{content:counter(m,decimal-leading-zero) " ";counter-increment:m;color:var(--mute)}
.pf{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:28px var(--g)}
.pf div{border-top:1px solid var(--ink);padding-top:12px}
.pf b{display:block;font-weight:600;font-size:clamp(34px,4vw,56px);line-height:1;letter-spacing:-.04em;margin-bottom:8px}
.pf span{font-size:14px;color:var(--soft)}
@media (min-width:761px){.pf{grid-column:1 / span 9;grid-template-columns:repeat(4,1fr)}}
.nf{grid-column:1 / -1}
.nf li{font-size:clamp(19px,2.2vw,28px);font-weight:500;letter-spacing:-.02em;line-height:1.25;padding:16px 0;border-top:1px solid var(--rule);color:var(--soft)}
.nf li::before{content:"×";display:inline-block;width:1.2em;color:var(--mute);font-weight:300}
.sticky{position:fixed;left:12px;right:12px;bottom:12px;z-index:30;display:flex;justify-content:space-between;align-items:center;height:52px;padding:0 18px;background:var(--ink);color:var(--paper);font-weight:500;font-size:15px;opacity:0;pointer-events:none;transition:opacity .3s ease}
.sticky i{font-style:normal;font-size:13px;opacity:.7}
.sticky.on{opacity:1;pointer-events:auto}
@media (min-width:761px){.sticky{left:auto;right:32px;bottom:24px;width:320px}}

/* Fuß */
.foot.g{border-top:1px solid var(--rule);margin:0 var(--m);padding:32px 0 44px;row-gap:28px;font-size:14px;color:var(--soft)}
.foot-c{grid-column:span 2;display:flex;flex-direction:column;gap:6px;overflow-wrap:anywhere}
.foot-c a:hover{color:var(--ink)}
.foot-c .lbl{margin-bottom:4px}
@media (min-width:761px){.foot-c{grid-column:span 3}}

/* ⌘K */
.cmdk{position:fixed;inset:0;z-index:50;background:rgba(22,22,22,.3);display:flex;align-items:flex-start;justify-content:center;padding:max(10vh,16px) 12px 12px}
.cmdk[hidden]{display:none}
.cmdk-box{width:100%;max-width:600px;background:var(--paper);border:1px solid var(--rule);box-shadow:0 20px 60px rgba(0,0,0,.12);max-height:80vh;display:flex;flex-direction:column}
.cmdk-in{display:flex;align-items:center;gap:12px;padding:0 10px 0 18px;border-bottom:1px solid var(--rule);height:56px}
.cmdk-k{color:var(--mute)}
.cmdk-in input{flex:1;min-width:0;border:0;background:transparent;font-size:17px;height:100%}
.cmdk-in input:focus{outline:none}
.cmdk-x{border:1px solid var(--rule);background:transparent;font-size:12px;padding:4px 8px;cursor:pointer;color:var(--mute)}
.cmdk-list{overflow:auto;padding:6px 0}
.cmdk-list li[data-first]::before{content:attr(data-g);display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);padding:12px 18px 6px}
.cmdk-list a{display:flex;justify-content:space-between;gap:14px;padding:10px 18px;font-weight:500;font-size:15px}
.cmdk-list a span{font-weight:400;color:var(--mute);font-size:13px;text-align:right}
.cmdk-list li.on a{background:rgba(22,22,22,.06);box-shadow:inset 2px 0 0 var(--acc)}
.cmdk-empty{padding:18px;color:var(--mute)}
.cmdk-foot{display:none;gap:18px;border-top:1px solid var(--line);padding:10px 18px;font-size:12px;color:var(--mute)}
@media (min-width:761px){.cmdk-foot{display:flex}}
body.locked{overflow:hidden}

/* Bewegung: nur ruhiges Einblenden */
.rv{opacity:0;transform:translateY(8px);transition:opacity .8s ease,transform .8s ease}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}.rv{opacity:1!important;transform:none!important}}