/* zeit:raum film, global stylesheet. Generated by tools/cases/site_css.py, do not edit by hand. */

/* Layout: Kinoband. Der Case liest sich wie ein Filmabspann, getragen vom 3:1-Format der Produktion. */
@font-face{font-family:"Zeitraum Head";font-weight:700;font-display:swap;src:url("../fonts/ZeitraumHead-Bold.woff2") format("woff2")}
@font-face{font-family:"Zeitraum Text";font-weight:300;font-display:swap;src:url("../fonts/ZeitraumText-Light.woff2") format("woff2")}
@font-face{font-family:"Zeitraum Text";font-weight:400;font-display:swap;src:url("../fonts/ZeitraumText-Regular.woff2") format("woff2")}
@font-face{font-family:"Zeitraum Text";font-weight:700;font-display:swap;src:url("../fonts/ZeitraumText-Bold.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:400;font-display:swap;src:url("../fonts/JetBrainsMono-Regular.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:500;font-display:swap;src:url("../fonts/JetBrainsMono-Medium.woff2") format("woff2")}
:root{
  --bg:#070707; --bg-elev:#111111; --fg:#FFFFFF;
  --muted:rgba(255,255,255,.62); --faint:rgba(255,255,255,.46); --em:rgba(255,255,255,.5);
  --line:rgba(255,255,255,.08); --line-strong:rgba(255,255,255,.18);
  --cream:#F6F3EC; --warm-dark:#1A1612; --cream-muted:#5A5247; --cream-line:rgba(26,22,18,.18);
  --font-head:"Zeitraum Head","Zeitraum Text",Arial,sans-serif;
  --font-text:"Zeitraum Text",Arial,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --ease:cubic-bezier(.21,.4,.48,1);
  --scope:2.87/1;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-text);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--bg)}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:1px solid var(--fg);outline-offset:4px}
.wrap{max-width:1320px;margin:0 auto;padding-left:max(clamp(20px,4vw,64px),env(safe-area-inset-left,0px));padding-right:max(clamp(20px,4vw,64px),env(safe-area-inset-right,0px))}
.eyebrow{font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);display:inline-flex;align-items:center;gap:14px}
.eyebrow::before{content:"";width:32px;height:1px;background:var(--fg)}
.mono{font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);font-variant-numeric:tabular-nums}
h1,h2,h3{font-family:var(--font-head);font-weight:700;margin:0;text-wrap:balance}
h1 em,h2 em,h3 em{font-style:normal;color:var(--em)}
h1{font-size:clamp(44px,7vw,104px);line-height:.92;letter-spacing:-.018em}
h2{font-size:clamp(34px,4.6vw,64px);line-height:.98;letter-spacing:-.012em}
h3{font-size:22px;line-height:1.15}
.lede{font-weight:300;font-size:clamp(18px,1.6vw,21px);line-height:1.5;margin:0;max-width:62ch;text-wrap:pretty}
.prose p{margin:0;color:var(--muted);max-width:64ch;text-wrap:pretty}
.prose p+p{margin-top:1em}
.prose strong{color:var(--fg);font-weight:400}

/* Header */
.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(0,0,0,.8);backdrop-filter:blur(16px) saturate(160%);-webkit-backdrop-filter:blur(16px) saturate(160%);border-bottom:1px solid var(--line)}
.site .wrap{display:flex;align-items:center;gap:24px;height:68px}
.brand{display:flex;align-items:center;gap:12px}
.brand svg{height:20px;width:auto}
.unit{font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line-strong);border-radius:4px;padding:3px 7px}
.site nav{display:flex;gap:24px;margin-left:auto;font-size:15px}
.site nav a{color:var(--muted);transition:color 200ms var(--ease)}
.site nav a:hover{color:var(--fg)}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 22px;border-radius:999px;font-family:var(--font-head);font-weight:700;font-size:15px;border:1px solid var(--fg);background:var(--fg);color:var(--bg);transition:background 250ms var(--ease),color 250ms var(--ease)}
.btn:hover{background:transparent;color:var(--fg)}
.btn svg{transition:transform 200ms var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn.ghost{background:transparent;color:var(--fg);border-color:var(--line-strong)}
.btn.ghost:hover{background:var(--fg);color:var(--bg)}
.btn{white-space:nowrap}
@media (max-width:860px){.site nav{display:none}.site .btn{margin-left:auto;padding:0 16px;font-size:14px}}

/* Hero */
.crumbs{display:flex;flex-wrap:wrap;gap:8px;padding-block:20px 0;font-size:14px;color:var(--faint)}
.crumbs a:hover{color:var(--fg)}
.hero{padding-block:48px 0}
.hero-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:32px 64px;align-items:end}
.hero-head .lede{color:var(--muted)}
@media (max-width:900px){.hero-head{grid-template-columns:1fr}}
.scope{position:relative;margin-top:56px;border-radius:12px;overflow:hidden;background:var(--bg-elev);max-width:100%}
.scope img{width:100%;height:auto}
.play{position:absolute;left:24px;bottom:24px;display:inline-flex;align-items:center;gap:14px;min-height:48px;padding:0 22px 0 8px;border-radius:999px;background:rgba(0,0,0,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line-strong);color:var(--fg);font-family:var(--font-head);font-weight:700;font-size:15px;cursor:pointer}
.play .dot{width:34px;height:34px;border-radius:50%;background:var(--fg);display:grid;place-items:center}
.play .dot svg{margin-left:2px}
.play .mono{color:var(--muted)}
@media (max-width:600px){.scope{overflow:visible;background:none}.scope img{border-radius:12px}.play{position:static;margin-top:12px}}
.note{margin-top:12px;font-size:14px;color:var(--faint)}

/* Facts */
.facts{margin-top:72px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));border-top:1px solid var(--line-strong);border-left:1px solid var(--line)}
.facts div{padding:20px 20px 24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-width:0}
.facts dt{font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.facts dd{margin:8px 0 0;font-size:15px;line-height:1.45}

/* Story */
section{scroll-margin-top:80px}
.block{padding-block:clamp(136px,16vw,240px)}
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:32px 80px;align-items:start}
@media (max-width:900px){.split{grid-template-columns:1fr}}
.split h2{margin-top:20px}
.still{margin:0}
.still img{width:100%;height:auto;border-radius:12px}
.still figcaption{margin-top:12px;display:flex;justify-content:space-between;gap:16px;font-size:14px;color:var(--faint)}
.wide{margin-top:clamp(80px,9vw,136px)}
.craft{margin-top:72px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:48px 40px}
.craft article{border-top:1px solid var(--line-strong);padding-top:20px;display:flex;flex-direction:column;gap:12px}
.craft p{margin:0;color:var(--muted);font-size:16px}

/* Films */
.films{background:var(--bg-elev);border-block:1px solid var(--line)}
.film-grid{margin-top:64px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:48px 32px}
.film{display:flex;flex-direction:column;gap:14px}
.film .frame{position:relative;border-radius:12px;overflow:hidden;background:#000}
.film .frame img{width:100%;height:auto;transition:transform 800ms var(--ease)}
.film:hover .frame img{transform:scale(1.03)}
.film .dur{position:absolute;right:12px;bottom:12px;background:rgba(0,0,0,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:2px;padding:4px 8px;font-family:var(--font-mono);font-size:11px;color:var(--fg)}
.film .row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;border-top:1px solid var(--line-strong);padding-top:14px}
.film p{margin:0;font-size:15px;color:var(--muted)}

/* Gallery */
.gallery{margin-top:64px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.gallery figure{margin:0}
.gallery figure.full{grid-column:1/-1}
.gallery img,.gallery video{width:100%;height:auto;border-radius:12px;background:#000}
.gallery figcaption{margin-top:10px;font-size:14px;color:var(--faint)}
@media (max-width:700px){.gallery{grid-template-columns:1fr}}

/* Quote */
.quote{margin:0;max-width:1000px}
.quote p{margin:0;font-family:var(--font-head);font-weight:700;font-size:clamp(26px,3.2vw,42px);line-height:1.12;letter-spacing:-.01em;text-wrap:balance}
.quote footer{margin-top:28px;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:15px;color:var(--muted)}
.quote footer strong{color:var(--fg);font-weight:700}

/* Credits */
.credits{margin-top:56px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:0 40px}
.credits div{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:15px}
.credits dt{color:var(--faint)}
.credits dd{margin:0;text-align:right}
.ph{color:var(--em)}

/* FAQ */
.faq{margin-top:48px;border-top:1px solid var(--line-strong)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:64px;padding-block:16px;font-family:var(--font-head);font-weight:700;font-size:clamp(18px,2vw,22px)}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{flex-shrink:0;transition:transform 250ms var(--ease)}
.faq details[open] summary svg{transform:rotate(45deg)}
.faq details p{margin:0 0 24px;max-width:70ch;color:var(--muted)}

/* Related */
.related{margin-top:56px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:40px 32px}
.related a{display:flex;flex-direction:column;gap:12px}
.related .thumb{border-radius:12px;overflow:hidden;aspect-ratio:16/9;background:var(--bg-elev);display:grid;place-items:center;color:var(--faint);font-size:14px}
.related .row{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--line-strong);padding-top:12px}
.related .row strong{font-family:var(--font-head);font-size:20px}

/* Contact + group */
.contact{background:var(--bg-elev);border-top:1px solid var(--line)}
.contact .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:40px 64px;align-items:end}
.contact .person{display:flex;align-items:center;gap:16px;margin-top:32px}
.contact .person img{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none;background:var(--bg)}
.contact .person p{margin:0;display:flex;flex-direction:column;gap:2px;font-size:15px;color:var(--muted)}
.contact .person strong{font-family:var(--font-head);font-size:18px;color:var(--fg);letter-spacing:-.01em}
.contact .who{margin-top:20px;font-size:15px;color:var(--muted)}
.contact .who span{user-select:all;color:var(--fg)}
.group{background:var(--bg);color:var(--fg);border-top:1px solid var(--line-strong)}
.group .top{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:40px 64px;padding-block:72px 48px;border-bottom:1px solid var(--line-strong)}
.group .units{display:flex;flex-wrap:wrap;gap:6px 24px;margin-top:20px;font-family:var(--font-head);font-weight:700;font-size:clamp(22px,2.4vw,28px)}
.group .units a{color:var(--muted)}.group .units a:hover,.group .units a[aria-current]{color:var(--fg)}
.group .pitch{margin:0;color:var(--muted);font-size:16px;max-width:52ch}
.group .pitch strong{color:var(--fg);font-weight:400}
.group .pitch .claim a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:4px;transition:text-decoration-color 200ms var(--ease)}
.group .pitch .claim a:hover{text-decoration-color:var(--fg)}
.group .pitch a{color:inherit;text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:4px;transition:text-decoration-color 200ms var(--ease),color 200ms var(--ease)}
.group .pitch a:hover{color:var(--fg);text-decoration-color:var(--fg)}
.group .bottom{display:flex;flex-wrap:wrap;gap:12px 24px;padding-block:24px 40px;font-size:14px;color:var(--faint)}
.group .bottom .sig{margin-left:auto;font-family:var(--font-head);font-weight:700;color:var(--fg)}
.hq-collage{margin:0;min-width:0}
.hq-collage ul{list-style:none;margin:0;padding:0;position:relative;aspect-ratio:1/0.78;max-width:100%}
.hq-collage li{position:absolute;margin:0}
.hq-collage img{width:100%;height:auto;border-radius:12px;transition:transform 800ms var(--ease)}
.hq-collage li:first-child img{box-shadow:none}
@media (hover:hover){.hq-collage li:hover img{transform:scale(1.03)}}
.hq-collage figcaption{margin-top:16px;font-size:12px;color:var(--faint)}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Kontaktkarte (Navigation) */
.kk{position:fixed;inset:84px max(16px,calc((100vw - 1320px)/2 + 16px)) auto auto;margin:0;padding:0;border:1px solid var(--line-strong);background:var(--bg-elev);color:var(--fg);width:min(460px,calc(100vw - 32px));max-height:calc(100svh - 100px);overflow:auto;border-radius:0;border-radius:16px;opacity:0;transform:translateY(-8px);transition:opacity 250ms var(--ease),transform 250ms var(--ease)}
.kk.open{opacity:1;transform:none}
.kk::backdrop{background:rgba(0,0,0,.45)}
.kk-in{padding:32px;display:flex;flex-direction:column;gap:20px;position:relative}
.kk h3{font-family:var(--font-head);font-size:26px;line-height:1.1;letter-spacing:-.015em;margin:0;text-wrap:balance;padding-right:32px}
.kk-intro{margin:0;font-size:15px;color:var(--muted)}
.kk-x{position:absolute;top:20px;right:20px;width:40px;height:40px;display:grid;place-items:center;background:none;border:1px solid var(--line);border-radius:50%;color:var(--fg);cursor:pointer;transition:background 200ms var(--ease),color 200ms var(--ease)}
.kk-x:hover{background:var(--fg);color:var(--bg)}
.kk-person{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-block:20px;border-block:1px solid var(--line)}
.kk .person{display:flex;align-items:center;gap:14px}
.kk .person img{width:56px;height:56px;border-radius:50%;object-fit:cover}
.kk .person p{margin:0;display:flex;flex-direction:column;gap:2px;font-size:14px;color:var(--muted)}
.kk .person strong{font-family:var(--font-head);font-size:17px;color:var(--fg)}
.kk-cols{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr);gap:20px;font-size:14px}
.kk-cols div{display:flex;flex-direction:column;gap:6px;min-width:0}
.kk-cols a,.kk-cols span{color:var(--muted);text-decoration:none;white-space:nowrap}
.kk-cols a:hover{color:var(--fg)}
.kk-cols .kk-l{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-bottom:4px}
@media (max-width:640px){.kk{inset:auto 0 0 0;width:100%;max-height:calc(100svh - 64px);clip-path:none;transform:translateY(24px)}.kk-in{padding:28px 20px calc(28px + env(safe-area-inset-bottom,0px))}.kk-cols{grid-template-columns:1fr 1fr}.kk-cols div:first-child{grid-column:1/-1}}
/* Einblenden */
.rv{opacity:0;transform:translateY(20px);transition:opacity 700ms var(--ease),transform 700ms var(--ease);transition-delay:calc(var(--i,0) * 60ms)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.kk{transition:none}}

.gallery figure.tall{grid-row:span 2;justify-self:center;width:50%}
.bts{margin-top:64px}
.bts-grid{margin-top:20px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;grid-auto-flow:dense}
.bts-grid figure{margin:0}
.bts-grid a{display:block;height:100%}
.bts-grid img{width:100%;height:100%;aspect-ratio:3/2;object-fit:cover;border-radius:8px;display:block;transition:opacity .25s cubic-bezier(.21,.4,.48,1)}
.bts-grid a:hover img{opacity:.85}
.bts-grid figure.p{grid-row:span 2}
.bts-grid figure.p img{aspect-ratio:auto}
@media (max-width:900px){.bts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery figure.tall{width:70%}}

/* Case pages */

.result-nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));border-top:1px solid var(--line);border-left:1px solid var(--line);margin-top:48px}
.result-nums>div{padding:24px 24px 28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.result-nums strong{font-family:var(--font-head);font-size:clamp(40px,5vw,64px);line-height:.95;letter-spacing:-.02em}
.result-nums span{font-size:15px;color:var(--muted);line-height:1.4}
.result-del{margin-top:48px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:24px 32px;align-items:start}
.result-del .mono{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);padding-top:4px}
.result-del ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:12px}
.result-del li{border:1px solid var(--line-strong);border-radius:999px;padding:8px 16px;font-size:14px}  /* 03.11. G3: mehr Luft (4-pt-Skala) */
@media (max-width:700px){.result-del{grid-template-columns:1fr}}
.gallery figure.loop video{width:100%;height:auto;border-radius:12px;background:#000}
.prose a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line-strong)}
.prose a:hover{text-decoration-color:var(--fg)}
.film-grid.tall{grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr))!important}.film-grid.quad{grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr))}
.film.portrait .frame{max-width:min(100%,48vh);margin-inline:auto;width:100%}
.film-grid.tall .film.portrait .frame{max-width:100%}
.film a.frame.ext{display:block;position:relative;text-decoration:none;color:var(--fg)}
.film a.frame.ext .ext-label{position:absolute;left:16px;bottom:16px;display:inline-flex;align-items:center;gap:10px;background:#fff;color:#000;border-radius:999px;padding:8px 14px 8px 8px;font:700 14px/1 var(--font-head,inherit)}
.film a.frame.ext:hover img{transform:scale(1.03)}
.film .frame.noimg{aspect-ratio:16/9;display:grid;place-items:center;color:var(--faint);font-size:13px}
.related .thumb{position:relative}
.related .thumb video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 250ms var(--ease)}
.related .thumb video{inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px)}
.related a.playing .thumb video{opacity:1}
html.lenis,html.lenis body{height:auto}
.lenis:not(.lenis-autoToggle).lenis-stopped{overflow:clip}
.lenis [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-smooth iframe{pointer-events:none}

/* Site pages */

.awards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:40px 32px;margin-top:48px}
.awards figure{margin:0;display:flex;gap:20px;align-items:center}
.awards .aw-t{flex:none;width:112px;height:112px;border-radius:4px;overflow:hidden;background:#EFEFEF;display:flex;align-items:center;justify-content:center}
.awards .aw-t img{display:block;width:100%;height:100%;object-fit:contain;filter:grayscale(1)}
.awards figcaption{font-size:14px;color:var(--muted);line-height:1.4;display:flex;flex-direction:column;gap:2px}
.awards figcaption strong{font-family:var(--font-head);font-size:16px;color:var(--fg);font-weight:700;letter-spacing:-.01em}
.awards figcaption .mono{font-family:var(--font-mono,'JetBrains Mono',monospace);font-size:13px;color:var(--fg)}
.awards .aw-txt{color:#1A1612;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:6px;padding:14px;text-align:left}
.awards .aw-txt .aw-ico{width:22px;height:22px;margin-bottom:auto}
.awards .aw-txt b{font-family:var(--font-head);font-size:14px;line-height:1.05;letter-spacing:-.01em}
.awards .aw-txt i{font-style:normal;font-family:var(--font-mono,'JetBrains Mono',monospace);font-size:12px}
.case-awards{margin-top:48px;padding-top:32px;border-top:1px solid var(--line,rgba(255,255,255,.14))}
.case-awards>.eyebrow{display:inline-flex;align-items:center;gap:8px}
.awards.case{grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));margin-top:24px}
.awards.case .aw-t{width:128px;height:128px}
.awards.case figcaption{font-size:15px;color:var(--fg)}
.aw-flag{position:absolute;top:12px;left:12px;z-index:2;display:inline-flex;align-items:center;gap:6px;padding:5px 9px 5px 7px;border-radius:2px;
  background:rgba(0,0,0,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;line-height:1}
.aw-flag .aw-ico{flex:none}

.mslides{position:relative;width:100%;border-radius:12px;overflow:hidden;background:#0d0d0d}.mslides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 900ms var(--ease);border-radius:0}.mslides img.on{opacity:1}.mslides-dots{position:absolute;right:12px;bottom:12px;display:flex;gap:6px}.mslides-dots button{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.4);cursor:pointer}.mslides-dots button.on{background:#fff}@media (prefers-reduced-motion:reduce){.mslides img{transition:none}}.ploop{margin:0}.ploop video{width:100%;height:auto;aspect-ratio:1600/844;display:block;border-radius:12px;background:#000;filter:none}.ploop figcaption{margin-top:14px;color:var(--faint);font-size:13px}
.archive{margin-top:clamp(72px,8vw,120px);border-top:1px solid var(--line)}
.archive>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:20px;color:var(--muted)}
.archive>summary::-webkit-details-marker{display:none}
.archive-h{font-family:var(--font-text);font-weight:400;font-size:15px;line-height:1.4;letter-spacing:0}
.archive-h .mono{font-family:var(--font-mono);font-size:12px;color:var(--faint);margin-left:6px}
.archive>summary svg{width:14px;height:14px;transition:transform 250ms var(--ease)}
.archive[open]>summary svg{transform:rotate(45deg)}
.archive>summary:hover{color:var(--fg)}
.archive .archive-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:24px 16px;margin-top:8px;padding-bottom:16px}
.archive .archive-grid .case-card .thumb{aspect-ratio:16/9;border-radius:8px}
.archive .archive-grid .case-card .row{margin-top:10px}
.archive .archive-grid .case-card .row strong{font-family:var(--font-text);font-weight:400;font-size:14px;letter-spacing:0}
.archive .archive-grid .case-card .row .mono{font-size:11px}
.archive .archive-grid .case-card .meta{font-size:12px;color:var(--faint);margin-top:2px}
.chain{list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));counter-reset:c}
.chain li{position:relative;border-top:1px solid var(--line-strong)}
.chain li::before{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--fg)}
.chain li:not(:last-child)::after{content:"";position:absolute;top:-1px;right:12px;width:10px;height:10px;border-top:1px solid var(--fg);border-right:1px solid var(--fg);transform:translateY(-5px) rotate(45deg)}
.chain a{display:flex;flex-direction:column;gap:10px;padding:28px 24px 8px 0;color:inherit;text-decoration:none}
.chain .mono{font-size:12px;color:var(--faint);letter-spacing:.08em}
.chain h3{font-family:var(--font-head);font-size:20px;line-height:1.1;letter-spacing:-.01em;margin:0;text-wrap:balance}
.chain p{margin:0;font-size:15px;line-height:1.45;color:var(--muted)}

.chain .ch-ln::after{content:"";position:absolute;left:0;right:0;top:-.5px;height:2px;background:var(--chA);background-size:100% 100%;transform:scaleX(0);transform-origin:left center;transition:transform .8s cubic-bezier(.21,.4,.48,1)}
@media (hover:hover) and (min-width:641px){.chain li:hover .ch-ln,.chain li:focus-within .ch-ln{transform:none;opacity:1}.chain li:hover .ch-ln::after,.chain li:focus-within .ch-ln::after{transform:none}.chain li:hover::before,.chain li:focus-within::before{background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.12)}}
@media (max-width:1100px){.chain{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:24px}}
@media (max-width:640px){.chain{grid-template-columns:1fr;row-gap:0}.chain li{border-top:0;border-left:1px solid var(--line-strong);padding-left:24px}.chain li::before{top:32px;left:-5px}.chain li::after{display:none}.chain a{padding:24px 0}}
.chain .ch-ln{position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--fg);opacity:.75;transform:scaleX(0);transform-origin:left center;pointer-events:none}
.chain.draw li .ch-ln{transition:transform .7s cubic-bezier(.21,.4,.48,1) calc(var(--i)*.3s)}
.chain.draw li::before{background:var(--line-strong);transform:scale(.55);transition:background .25s cubic-bezier(.21,.4,.48,1) calc(var(--i)*.3s),transform .5s cubic-bezier(.21,.4,.48,1) calc(var(--i)*.3s)}
.chain.draw li:not(:last-child)::after{opacity:0;transition:opacity .3s cubic-bezier(.21,.4,.48,1) calc(var(--i)*.3s + .55s)}
.chain.draw a{opacity:0;transform:translateY(20px);transition:opacity .7s cubic-bezier(.21,.4,.48,1) calc(var(--i)*.3s + .1s),transform .7s cubic-bezier(.21,.4,.48,1) calc(var(--i)*.3s + .1s)}
.chain.draw li.rv{opacity:1;transform:none;transition:none}.chain.draw li.done .ch-ln,.chain.draw li.done::before,.chain.draw li.done a{transition-delay:0s}.chain.draw li.lit .ch-ln{transform:none}.chain.draw li.lit::before{background:var(--fg);transform:none}.chain.draw li.lit::after{opacity:1}.chain.draw li.lit a{opacity:1;transform:none}
@media (max-width:640px){.chain li{--i:0!important}.chain .ch-ln{top:0;bottom:0;left:-1px;right:auto;width:1px;height:auto;transform:scaleY(0);transform-origin:center top}}
.craft.four{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1100px){.craft.four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.craft.four{grid-template-columns:1fr}}
.craft.five{grid-template-columns:repeat(5,minmax(0,1fr));gap:48px 28px}.craft.five h3{text-wrap:balance}
@media (max-width:1100px){.craft.five{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 40px}.craft.five article:last-child{grid-column:1/-1}}
@media (max-width:640px){.craft.five{grid-template-columns:1fr}}
.deliv{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));border-top:1px solid var(--line);margin-top:48px}
.deliv>div{padding:24px 24px 28px 0;border-bottom:1px solid var(--line)}
.deliv .mono{display:block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-bottom:14px}
.deliv ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:16px;line-height:1.45}
.deliv li{padding-left:18px;position:relative}.deliv li::before{content:"";position:absolute;left:0;top:.7em;width:8px;height:1px;background:var(--fg)}
.gal .g-open{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;border-radius:12px;overflow:hidden}
.gal .g-open img{display:block;width:100%;height:auto;object-fit:cover;transition:transform 800ms var(--ease)}
.gal .g-open:hover img{transform:scale(1.03)}
.bento{display:flex;flex-direction:column;gap:16px;margin-top:48px}
.bgroup{margin:28px 0 -4px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);display:flex;align-items:center;gap:12px}
.bgroup::after{content:"";flex:1;height:1px;background:var(--line)}
.bento>.bgroup:first-child{margin-top:0}
.brow{display:grid;gap:16px}
.brow figure{margin:0;min-width:0;min-height:0;position:relative}
.bento .g-open{position:absolute;inset:0;height:auto}
.bento .g-open img{width:100%;height:100%;object-fit:cover}
picture.hdr,.g-open picture{display:contents}
@media (dynamic-range:high){html picture.hdr img{filter:none!important;will-change:transform}}  /* will-change: eigene Ebene, sonst zeichnet Chrome ruhende HDR-Bilder auf SDR heruntergerechnet (dunkel, erst beim Hover-Glow hell) */
.brow figcaption{position:absolute;left:12px;bottom:12px;max-width:calc(100% - 24px);font-size:12px;line-height:1.3;color:#fff;background:rgba(0,0,0,.55);padding:6px 10px;border-radius:999px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity 250ms var(--ease),transform 250ms var(--ease)}
.brow figure:hover figcaption,.brow figure:focus-within figcaption{opacity:1;transform:none}
@media (hover:none){.brow figcaption{opacity:1;transform:none}}
.brow-hero{aspect-ratio:21/9}
.brow-big-left{grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;aspect-ratio:2/1}
.brow-big-left figure:first-child{grid-row:1/3}
.brow-big-right{grid-template-columns:1fr 2fr;grid-template-rows:1fr 1fr;aspect-ratio:2/1}
.brow-big-right figure:nth-child(1){grid-column:1;grid-row:1}.brow-big-right figure:nth-child(2){grid-column:1;grid-row:2}.brow-big-right figure:nth-child(3){grid-column:2;grid-row:1/3}
.brow-quad{grid-template-columns:repeat(4,1fr);aspect-ratio:3.2/1}
.brow-wn{grid-template-columns:2fr 1fr;aspect-ratio:2.4/1}
.brow-nw{grid-template-columns:1fr 2fr;aspect-ratio:2.4/1}
.brow-duo{grid-template-columns:1fr 1fr;aspect-ratio:3.4/1}
.brow-trio{grid-template-columns:repeat(3,1fr);aspect-ratio:3/1}
.brow-trio-w{grid-template-columns:repeat(3,1fr);aspect-ratio:4.8/1}
@media (max-width:700px){.bento,.brow{gap:10px}.brow{grid-template-columns:1fr 1fr!important;grid-template-rows:auto!important;aspect-ratio:auto!important}.brow figure{grid-column:auto!important;grid-row:auto!important;aspect-ratio:1/1}.brow-quad figure{aspect-ratio:4/5}.brow-hero figure,.brow-big-left figure:first-child,.brow-big-right figure:nth-child(3),.brow-trio figure:first-child,.brow-trio-w figure:first-child,.brow-duo figure,.brow-wn figure:first-child,.brow-nw figure:last-child{grid-column:1/-1!important;aspect-ratio:16/9}.brow-big-right figure:nth-child(3){order:-1}.brow-nw figure:last-child{order:-1}}
.g-lens{position:fixed;left:0;top:0;z-index:60;width:200px;height:200px;border-radius:50%;pointer-events:none;background-repeat:no-repeat;background-color:#000;box-shadow:0 0 0 1px rgba(255,255,255,.55);opacity:0;transition:opacity 200ms cubic-bezier(.21,.4,.48,1)}
.g-lens.on{opacity:1}
.gal .g-open[data-zoom]{cursor:crosshair}
.gal .g-open[data-zoom]:hover img{transform:none}
.lbx{border:0;padding:0;margin:0;width:100vw;height:100dvh;max-width:none;max-height:none;background:rgba(0,0,0,.94);color:#fff}
.lbx[open]{display:flex;align-items:center;justify-content:center}
.lbx::backdrop{background:rgba(0,0,0,.94)}
.lbx figure{margin:0;max-width:min(94vw,2400px);display:flex;flex-direction:column;gap:12px}
.lbx img{width:min(94vw,2400px);height:84dvh;max-width:none;max-height:none;object-fit:contain}  /* 05.11.2026: feste Fläche statt nur Obergrenzen, Safari zeigte das Bild sonst kleiner */
.lbx figcaption{font-size:14px;color:rgba(255,255,255,.62)}
.lbx button{position:absolute;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);color:#fff;width:48px;height:48px;border-radius:999px;display:grid;place-items:center;cursor:pointer}
.lbx-x{top:max(20px,env(safe-area-inset-top,0px));right:max(20px,env(safe-area-inset-right,0px))}.lbx-p{left:max(20px,env(safe-area-inset-left,0px))}.lbx-n{right:max(20px,env(safe-area-inset-right,0px))}
.visit{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:24px;margin-top:48px}
.visit-card{border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
.visit-card .v-img{aspect-ratio:16/9;overflow:hidden;background:var(--bg-elev)}.hb-cta .hb-link{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-head);font-weight:700;font-size:18px;color:var(--fg);text-decoration:none}.hb-cta .hb-link svg{transition:transform .2s cubic-bezier(.21,.4,.48,1)}.hb-cta .hb-link:hover svg{transform:translateX(4px)}.aw-all{display:inline-flex;align-items:center;gap:8px;color:var(--fg);font-weight:700;text-decoration:none;white-space:nowrap;margin-left:4px}.aw-all svg{transition:transform .2s cubic-bezier(.21,.4,.48,1)}.aw-all:hover svg{transform:translateX(4px)}.logos-more{margin:20px 0 0;color:var(--muted);font-size:15px;max-width:72ch}.voices{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:40px 48px;margin-top:28px}.voices.one{grid-template-columns:1fr;max-width:1000px}.voice{margin:0;display:flex;flex-direction:column;gap:20px;padding-top:24px;border-top:1px solid var(--line-strong)}.voice blockquote{margin:0}.voice p{margin:0;font-family:var(--font-head);font-weight:700;font-size:clamp(20px,1.8vw,24px);line-height:1.25;letter-spacing:-.005em}.voices.one .voice p{font-size:clamp(24px,2.8vw,36px);line-height:1.15;text-wrap:balance}.voice figcaption{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;font-size:15px;color:var(--muted);margin-top:auto}.voice figcaption strong{color:var(--fg)}.voice figcaption a{color:var(--fg);display:inline-flex;gap:8px;align-items:center;text-decoration:none;margin-left:auto;font-weight:700}.lx-nav{display:flex;flex-wrap:wrap;gap:6px;margin:32px 0 8px;position:sticky;top:calc(env(safe-area-inset-top,0px) + 72px);z-index:5;padding:10px 0;background:var(--bg)}.lx-nav a{min-width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);border-radius:999px;font:13px var(--font-mono);color:var(--fg);text-decoration:none;transition:background .2s var(--ease),color .2s var(--ease)}.lx-nav a:hover{background:var(--fg);color:var(--bg)}.lx{margin:0}.lx-letter{font-family:var(--font-head);font-weight:700;font-size:40px;line-height:1;margin:48px 0 8px;color:var(--muted);scroll-margin-top:140px}.lx-row{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:8px 32px;padding:18px 0;border-top:1px solid var(--line);scroll-margin-top:140px}.lx-row dt{font-weight:700;font-size:19px}.lx-aka{display:block;font-weight:400;font-size:14px;color:var(--muted);margin-top:4px}.lx-row dd{margin:0;color:var(--muted);font-size:17px;line-height:1.55;max-width:68ch}@media(max-width:760px){.lx-row{grid-template-columns:1fr}.lx-nav{top:calc(env(safe-area-inset-top,0px) + 60px)}}.links-grid .wcard .mono{display:block;margin-bottom:10px;color:var(--muted)}[data-reel-box]{position:relative}.play.play-s{left:14px;bottom:14px;min-height:40px;gap:10px;padding:0 16px 0 6px;font-size:14px}.play.play-s .dot{width:28px;height:28px}.visit-card .v-img img,.visit-card .v-img video{width:100%;height:100%;object-fit:cover;display:block}
.visit-card .v-none{background:repeating-linear-gradient(135deg,var(--bg-elev) 0 12px,transparent 12px 24px)}
.visit-card .v-body{padding:28px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.visit-card h3{font-family:var(--font-head);font-size:26px;letter-spacing:-.015em;margin:0}
.visit-card p{margin:0;color:var(--muted);font-size:16px;line-height:1.5}
.visit-card .v-code .mono:last-child{color:var(--fg);font-size:15px}
.faq p a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:4px}
.faq p a:hover{text-decoration-color:var(--fg)}
h1,h2,h3{hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word}
.split>*,.sec-head>*,.hero-head>*{min-width:0}
.page-hero{padding-block:clamp(48px,7vw,96px) 0}
.page-hero h1{margin-top:24px}
.page-hero .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.page-hero .visual{margin-top:56px;border-radius:12px;overflow:hidden}
.page-hero .visual img{width:100%;height:auto;display:block}
.sec{padding-block:clamp(120px,15vw,216px)}
.sec + .sec{padding-top:clamp(56px,7vw,104px)}
.photo-metrics{position:relative;margin:56px 0 0;aspect-ratio:21/9;overflow:hidden;border-radius:12px;max-width:100%}
.photo-metrics img{width:100%;height:100%;object-fit:cover;display:block}
.photo-metrics::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 55% 60% at 0% 0%,rgba(0,0,0,.78),rgba(0,0,0,0) 70%),radial-gradient(ellipse 55% 60% at 100% 100%,rgba(0,0,0,.78),rgba(0,0,0,0) 70%);pointer-events:none}
.photo-metrics ul{list-style:none;margin:0;padding:0}
.photo-metrics li{position:absolute;z-index:1;display:flex;flex-direction:column;gap:6px;color:#fff;max-width:60%;text-shadow:0 2px 24px rgba(0,0,0,.55)}
.photo-metrics li strong{font-family:var(--font-head);font-size:clamp(44px,6.5vw,104px);line-height:.92;letter-spacing:-.02em}
.photo-metrics li span{font-size:clamp(13px,1.2vw,16px);color:rgba(255,255,255,.86)}
.photo-metrics .pm-top{top:clamp(16px,3vw,40px);left:clamp(16px,3vw,40px)}
.photo-metrics .pm-bottom{bottom:clamp(16px,3vw,40px);right:clamp(16px,3vw,40px);text-align:right;align-items:flex-end}
.photo-metrics + .stats{margin-top:40px}
@media (max-width:640px){.photo-metrics{aspect-ratio:4/5}}
.sec-head{display:grid;grid-template-columns:5fr 4fr;gap:40px;align-items:end}
@media (max-width:900px){.sec-head{grid-template-columns:1fr}}
.sec-head h2{margin-top:20px}
.case-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:40px 24px;margin-top:48px}
.case-card{color:inherit;text-decoration:none;min-width:0;display:block}
.case-card .thumb{aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:var(--bg-elev);position:relative}
.case-card .thumb img,.case-card .thumb video{width:100%;height:100%;object-fit:cover;display:block;transition:transform 800ms var(--ease),opacity 250ms var(--ease)}
.case-card .thumb[data-fy] :is(img,video){object-position:50% 55%}
@media (min-width:1700px){.case-card .thumb[data-fy] :is(img,video){object-position:50% 75%}}
.case-card .thumb video{position:absolute;inset:0;opacity:0}
.case-card .thumb video{inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px)}
.case-card.playing .thumb video{opacity:1}
.case-card:hover .thumb img{transform:scale(1.03)}
.case-card .row{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-top:14px}
.case-card .row strong{font-family:var(--font-head);font-size:20px;letter-spacing:-.01em}
.case-card .meta{font-size:14px;color:var(--faint);margin-top:2px}
.case-card[hidden]{display:none!important}
.feature{display:grid;grid-template-columns:7fr 5fr;gap:clamp(24px,4vw,64px);align-items:center}
.feature.flip{grid-template-columns:5fr 7fr}
.feature.flip .feature-media{order:2}
@media (max-width:900px){.feature,.feature.flip{grid-template-columns:1fr}.feature.flip .feature-media{order:0}}
.feature-media{border-radius:12px;overflow:hidden;display:block}
.feature-media img{width:100%;height:auto;display:block;transition:transform 800ms var(--ease)}
.feature-media:hover img{transform:scale(1.03)}
.feature h2{margin-top:20px}
.feature .prose{margin-top:20px}
.steps{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:0;border-top:1px solid var(--line-strong)}
.steps li{padding:28px 24px 28px 0;border-bottom:1px solid var(--line);min-width:0}
.steps .n{font-family:var(--font-mono);font-size:12px;color:var(--faint);letter-spacing:.06em}
.steps h3{margin:14px 0 8px;font-size:22px}
.steps p{margin:0;color:var(--muted);font-size:15px}
.chips{list-style:none;margin:40px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.chips li{border:1px solid var(--line-strong);border-radius:999px;padding:10px 18px;font-size:15px}
.chips li a{color:inherit}
.visit-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,64px);margin-top:48px;align-items:start}
@media (max-width:900px){.visit-grid{grid-template-columns:1fr}}
.map-card{position:relative;border-radius:16px;overflow:hidden;background:#111;aspect-ratio:4/3;max-width:100%}
@media (max-width:600px){.map-card{aspect-ratio:4/5}.map-links .btn{padding-inline:18px}}
.map-card>img{width:100%;height:100%;object-fit:cover;opacity:.42;filter:grayscale(1)}
.map-card .map-ui{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:16px;padding:clamp(20px,3vw,32px)}
.map-card .map-ui p{margin:0;font-size:14px;color:var(--muted);max-width:46ch}
.map-card iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(1) invert(.92) contrast(.9)}
.map-links{display:flex;flex-wrap:wrap;gap:12px}
.route{display:grid;gap:0;border-top:1px solid var(--line)}
.route>div{display:grid;grid-template-columns:minmax(0,120px) minmax(0,1fr);gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}
.route dt{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding-top:3px}
.route dd{margin:0;font-size:16px;line-height:1.55}
@media (max-width:520px){.route>div{grid-template-columns:1fr;gap:6px}}
.ext-strip{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px;margin:48px 0 0}
.ext-strip img{width:100%;height:clamp(200px,30vw,440px);object-fit:cover;border-radius:12px}
@media (max-width:700px){.ext-strip{grid-template-columns:1fr 1fr}.ext-strip img:first-child{grid-column:1/-1}}
.ext-strip figcaption{grid-column:1/-1;font-size:13px;color:var(--muted)}
.mq{margin-top:56px;display:grid;gap:12px;overflow:hidden}
.mq-row{overflow:hidden}
.mq-track{display:flex;gap:12px;width:max-content;animation:mq var(--mq-dur,140s) linear infinite}
.mq-row.rev .mq-track{animation-direction:reverse}
.mq-track img{height:clamp(120px,16vw,200px);width:auto;max-width:none;display:block;border-radius:0}
.mq:hover .mq-track{animation-play-state:paused}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 6px))}}
@media (prefers-reduced-motion:reduce){.mq-track{animation:none}.mq-row{overflow-x:auto}}
.logos{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:48px}
.logos div{background:var(--bg);display:grid;place-items:center;padding:32px 24px;min-height:120px}
.logos img{width:var(--lw,96px);max-width:100%;height:auto;opacity:.78}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));border-top:1px solid var(--line-strong);margin-top:48px}
.stats div{padding:28px 24px 28px 0;border-bottom:1px solid var(--line)}
.stats strong{display:block;font-family:var(--font-head);font-size:clamp(36px,5vw,64px);line-height:1;letter-spacing:-.02em}
.stats span{display:block;margin-top:10px;color:var(--muted);font-size:15px}
.pillar-nav{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:24px;margin-top:48px}
.pillar-nav a{color:inherit;display:block}
.pillar-nav .thumb{aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:var(--bg-elev)}
.pillar-nav .thumb img{width:100%;height:100%;object-fit:cover;transition:transform 800ms var(--ease)}
.pillar-nav a:hover .thumb img{transform:scale(1.03)}
.pillar-nav h3{margin:16px 0 6px;font-size:26px;display:flex;justify-content:space-between;align-items:center}
.pillar-nav p{margin:0;color:var(--muted);font-size:15px}
.group .bottom{align-items:center}
.sponsor{display:inline-flex;align-items:center;gap:12px}
.sponsor .sp-l{font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--faint)}
.sponsor img{height:20px;width:auto;display:block;opacity:.8}
.sponsor img[src$="bundesliga.svg"]{height:24px}
.cards-visual{margin:48px 0 0}
.cards-visual img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:12px;display:block}
.cards-visual figcaption{font-size:13px;color:var(--faint);margin-top:8px}
.mosaic{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;margin-top:48px}
.mosaic figure{margin:0;min-width:0}
.mosaic img{width:100%;height:100%;object-fit:cover;border-radius:12px;display:block}
.mosaic figcaption{font-size:13px;color:var(--faint);margin-top:8px}
.mosaic .w12{grid-column:span 12}.mosaic .w8{grid-column:span 8}.mosaic .w7{grid-column:span 7}.mosaic .w6{grid-column:span 6}.mosaic .w5{grid-column:span 5}.mosaic .w4{grid-column:span 4}
@media (max-width:700px){.mosaic .w8,.mosaic .w7,.mosaic .w6,.mosaic .w5,.mosaic .w4{grid-column:span 12}}
.bio{display:grid;grid-template-columns:5fr 7fr;gap:clamp(24px,4vw,64px);align-items:start}
@media (max-width:900px){.bio{grid-template-columns:1fr}}
.bio img{width:100%;height:auto;border-radius:12px;display:block}
.addr{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:24px;margin-top:48px}
.addr article{min-width:0;display:flex;flex-direction:column;gap:20px}
.addr img{width:100%;height:auto;aspect-ratio:627/787;object-fit:cover;border-radius:12px;display:block}
.addr div{border-top:1px solid var(--line-strong);padding-top:20px}
.addr h3{font-size:22px;margin:0 0 8px}
.addr p{margin:0;color:var(--muted)}
.mosaic{grid-auto-flow:dense}
.mosaic .tall img{aspect-ratio:auto!important;height:100%}
.visual.reel{position:relative}
.hero-portrait{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,340px);gap:40px 64px;align-items:end}
.hero-portrait .hero-head{display:block}
.hero-portrait .hero-head .lede{margin-top:28px;max-width:60ch}
.page-hero.hero-portrait .visual{margin-top:0}
.hv-p video{width:100%;height:auto;aspect-ratio:9/16;object-fit:cover;display:block;background:#000}
@media (max-width:900px){.hero-portrait{grid-template-columns:1fr}.page-hero.hero-portrait .visual{max-width:340px;width:100%;margin-inline:auto}}
.reel-play{z-index:2}
.showreel{margin-top:48px}
.logoscroll{height:var(--ls-h,260vh);position:relative}
main>.logoscroll:first-child{margin-top:calc(-1 * var(--hdr-h,74px))}
.ls-sticky{position:sticky;top:0;height:100vh;height:100svh;display:grid;place-items:center;overflow:hidden}
.ls-head{position:absolute;top:clamp(88px,13vh,150px);left:0;right:0}
.ls-canvas{display:block;width:min(62vw,550px);height:auto;max-height:40vh;aspect-ratio:720/440;object-fit:contain}
.ls-video{position:absolute;width:2px;height:2px;opacity:0;pointer-events:none;left:0;top:0}
.ls-cap{text-align:center;margin:0;position:absolute;left:0;right:0;bottom:clamp(28px,9vh,120px)}
@media (prefers-reduced-motion: reduce){.logoscroll{height:auto}.ls-sticky{position:relative;height:auto;min-height:80vh}.ls-cap{position:static;margin-top:24px}}
.showreel img{width:100%;height:auto;display:block;border-radius:12px}
.sr-grid{display:grid;gap:40px 32px}
.sr-grid.two{grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr))}
.sr-item{margin:0;min-width:0}
.sr-item figcaption{margin-top:16px}
.sr-item .row{display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.sr-item .row strong{font:700 20px/1.2 var(--font-head,inherit);letter-spacing:-.012em}
.sr-item .row .mono{color:var(--faint);font-size:13px}
.sr-item p{margin:8px 0 0;color:var(--muted);font-size:15px;max-width:60ch}
.timeline{margin:48px 0 0;border-top:1px solid var(--line-strong)}
.timeline div{display:grid;grid-template-columns:clamp(88px,9vw,120px) minmax(0,1fr);gap:24px;padding:20px 0;border-bottom:1px solid var(--line)}
.timeline dt{font-family:var(--font-head);font-weight:700;font-size:clamp(26px,2.6vw,34px);line-height:1;letter-spacing:-0.018em;color:var(--fg);padding-top:2px;font-variant-numeric:tabular-nums}
.timeline dd{margin:0}
.timeline ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;color:var(--muted);font-size:16px;line-height:1.4}
.timeline li{padding:7px 0}
.timeline li+li{border-top:1px solid var(--line)}
@media (max-width:600px){.timeline div{grid-template-columns:1fr;gap:10px}}
.prose a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:4px}
.prose a:hover{text-decoration-color:var(--fg)}
.clientlist-link{margin:24px 0 0}.clientlist{margin-top:24px;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line)}
.clientlist summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;min-height:60px;font-family:var(--font-head);font-weight:700;font-size:18px}
.clientlist summary::-webkit-details-marker{display:none}
.clientlist summary svg{margin-left:auto;transition:transform 250ms var(--ease)}
.clientlist[open] summary svg{transform:rotate(45deg)}
.clientlist ul{list-style:none;margin:0;padding:8px 0 32px;columns:4 220px;column-gap:32px;font-size:15px;color:var(--muted)}
.clientlist li{break-inside:avoid;padding:5px 0}
.tl-wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);align-items:start;margin-top:48px}
.tl-wrap .timeline{margin-top:0}
.tl-img{margin:0;position:sticky;top:100px}
.tl-img img{width:100%;height:auto;border-radius:12px}
@media (max-width:900px){.tl-wrap{grid-template-columns:1fr}.tl-img{position:static}}
.linkgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:48px 40px;margin-top:48px}
.lg-group h3{font-size:14px;font-family:var(--font-text);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.lg-group ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-strong)}
.lg-group li a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);transition:padding 250ms var(--ease)}
.lg-group li a strong{font-family:var(--font-head);font-size:20px;letter-spacing:-.01em}
.lg-group li a span{grid-column:1;color:var(--muted);font-size:15px}
.lg-group li a svg{grid-column:2;grid-row:1/span 2;transition:transform 200ms var(--ease)}
.lg-group li a:hover svg{transform:translateX(4px)}
.chips li a{display:block}
.chips li:has(a):hover{background:var(--fg);color:var(--bg)}
.page-hero .visual.reel video{width:100%;height:auto;display:block;background:#000}
@media (prefers-reduced-motion:reduce){.page-hero .visual.reel video{display:none}.page-hero .visual.reel{background:center/cover no-repeat}}
.legal{max-width:72ch}
.legal-grid{display:grid;grid-template-columns:minmax(0,72ch) minmax(0,1fr);gap:48px 64px;align-items:start}
.legal-grid .legal{min-width:0}
.lmark{position:sticky;top:110px;display:grid;place-items:center}
.lmark-cv{display:block;width:min(100%,320px);height:auto;aspect-ratio:260/472}
.page-hero:has(.hero-mark){position:relative}
.hero-mark{position:absolute;inset:0 0 170px;display:grid;place-items:center;pointer-events:none;z-index:0}
.hero-mark .lmark-cv{width:auto;height:min(100%,600px);max-width:100%}
.page-hero:has(.hero-mark) .hero-head{position:relative;z-index:1}
.mk-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:40px 64px;align-items:start}
.mk-text{min-width:0;padding-block:0 clamp(72px,10vh,128px)}
.mk-text h1{margin-top:20px}
.mk-text .lede{margin-top:24px;max-width:46ch}
.mk-text .ctas{margin-top:40px}
.mk-vis{position:sticky;top:var(--hdr-h,74px);height:calc(100svh - var(--hdr-h,74px));display:grid;place-items:center;pointer-events:none}
.mk-vis .lmark-cv{width:auto;height:min(64svh,620px);max-width:100%}
.mk-solo .mk-grid{min-height:calc(100svh - var(--hdr-h,74px) - 40px);align-items:center}
.mk-solo .mk-vis{position:relative;top:0;height:min(76svh,640px)}
.mk-facts{margin:64px 0 0;border-top:1px solid var(--line-strong)}
.mk-facts>div{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr);gap:6px 32px;padding:20px 0;border-bottom:1px solid var(--line)}
.mk-facts dt{font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);padding-top:4px}
.mk-facts dd{margin:0;font-size:17px;line-height:1.55}.mk-facts dd a{color:inherit;text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:3px}.mk-facts dd a:hover{text-decoration-color:currentColor}
.mk-facts .mono{font-size:15px;color:inherit}
.mk-more a{color:var(--fg);text-decoration:underline;text-underline-offset:3px}
.mk-hero:not(.mk-solo){padding-top:clamp(32px,5vw,64px)}
.mk-more{margin-top:72px;display:grid;gap:40px;max-width:62ch}
.mk-hero .mk-more h2{font-size:22px;line-height:1.25;letter-spacing:-.012em;margin:0 0 10px}
.mk-more p{margin:0;color:var(--muted)}
.zs-sec .zrm-form.zs{max-width:none}
.zs-page{--fg:#1A1612;--bg:#F6F3EC;--muted:#5A5247;--faint:#7A7265;--line-strong:rgba(26,22,18,.4);position:relative;max-width:880px;margin-inline:auto;background:#F6F3EC;color:#1A1612;border-radius:24px;padding:clamp(28px,6vw,80px) clamp(22px,8vw,104px) clamp(32px,5vw,64px);font-family:var(--font-mono),ui-monospace,Menlo,monospace;font-size:clamp(14px,1.5vw,16px);line-height:1.6}
.zs-page::before{content:"";position:absolute;left:clamp(10px,2.4vw,30px);top:22%;bottom:22%;width:12px;background:radial-gradient(circle at 6px 6px,#2E2A25 4px,#8A8378 5px,transparent 6px) 0 0/12px 12px no-repeat,radial-gradient(circle at 6px 6px,#2E2A25 4px,#8A8378 5px,transparent 6px) 0 100%/12px 12px no-repeat}
.zs-page p{margin:0}
.zs-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.zs-meta{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--faint);letter-spacing:.04em;margin-bottom:clamp(36px,6vw,72px)}
.zs-title{text-align:center;display:grid;justify-items:center;gap:6px;margin-bottom:clamp(36px,6vw,64px)}
.zs-t1{font-weight:700;letter-spacing:.12em;text-decoration:underline;text-underline-offset:5px}
.zs-t2{color:var(--muted)}
.zs-in{display:inline-block;vertical-align:baseline}
.zs-in input{font:inherit;color:inherit;background:transparent;border:0;border-bottom:1px solid var(--line-strong);border-radius:0;padding:2px 2px 3px;outline:0;transition:border-color .2s cubic-bezier(.21,.4,.48,1)}
.zs-in input:focus{border-bottom:2px solid var(--fg);padding-bottom:2px}
.zs-page ::placeholder{color:#8A8378;opacity:1}
.zs-name input{width:min(24ch,100%);text-align:center}
.zs-firma input{width:16ch;text-transform:uppercase}
.zs-wide{display:block;margin:6px 0 18px}
.zs-wide input{width:100%}
.zs-page .zs-tr{font-weight:700;margin-bottom:22px}
.zs-page .zs-end{text-align:right;margin-top:28px}
.zs-scene{display:flex;gap:16px;font-weight:700;margin-bottom:18px}
.zs-scene>span:nth-child(2){flex:1}
.zs-num{color:var(--faint);font-weight:400;flex:none}
.zs-page .zs-action{margin-bottom:18px;max-width:58ch}
.zs-page .zs-chips{margin:4px 0 34px}
.zs-chips .f-chip span{font-size:13px;letter-spacing:.06em;text-transform:uppercase;border-color:var(--line-strong);padding:7px 14px;color:var(--fg)}
.zs-chips .f-chip input:checked+span{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.zs-chips .f-chip input:focus-visible+span{outline:2px solid var(--fg);outline-offset:2px}
.zs-page .zs-char{margin-left:38%;font-weight:700;text-transform:uppercase}
.zs-page .zs-paren{margin-left:31%;color:var(--muted)}
.zs-page .zs-dia{display:block;margin:4px 16% 28px 22%}
.zs-page .zs-dia p{margin-bottom:4px}
.zs-msg textarea{display:block;width:100%;font:inherit;color:inherit;border:0;border-bottom:1px solid var(--line-strong);border-radius:0;padding:4px 0 6px;resize:vertical;min-height:8em;line-height:1.6;outline:0;background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(1.6em - 1px),rgba(26,22,18,.12) calc(1.6em - 1px),rgba(26,22,18,.12) 1.6em) local}
.zs-msg textarea:focus{border-bottom:2px solid var(--fg)}
.zs-tried :invalid{border-bottom-style:dashed;border-bottom-color:#1A1612}
.zs-foot{margin-top:clamp(28px,5vw,48px);padding-top:24px;border-top:1px solid rgba(26,22,18,.15);display:grid;gap:18px}
.zs-foot .f-note{font-family:var(--font-text,inherit);font-size:13px;color:var(--muted)}
.zs-foot .f-note a{color:var(--fg)}
.zs-foot .f-status{color:var(--muted)}
@media (max-width:700px){.zs-page .zs-char{margin-left:24%}.zs-page .zs-paren{margin-left:16%}.zs-page .zs-dia{margin:4px 0 24px 8%}.zs-page::before{display:none}.zs-meta>span:first-child{display:none}.zs-firma input{width:12ch}}
.zs-toggle{margin:20px 0 0}
.zs-v[data-zs=script] .zs-toggle{max-width:880px;margin-inline:auto}
.zs-toggle button{background:none;border:0;padding:0;font:13px/1.4 var(--font-mono),ui-monospace,Menlo,monospace;letter-spacing:.02em;color:var(--faint);text-decoration:underline dotted;text-underline-offset:4px;cursor:pointer;transition:color .2s cubic-bezier(.21,.4,.48,1)}
.zs-toggle button:hover,.zs-toggle button:focus-visible{color:var(--fg)}
.p404{pointer-events:auto}
.p404-fig{margin:0;width:min(100%,460px);display:grid;gap:12px}
.p404-btn{position:relative;display:block;padding:0;border:0;background:none;cursor:pointer;border-radius:12px;overflow:hidden}
.p404-btn img{display:block;width:100%;height:auto;transition:transform .8s cubic-bezier(.21,.4,.48,1)}
.p404-btn:hover img{transform:scale(1.03)}
.p404-btn:focus-visible{outline:2px solid var(--fg);outline-offset:4px}
.p404-flare{position:absolute;left:21.4%;top:58.3%;width:16%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,248,232,.9) 0,rgba(255,180,106,.5) 22%,rgba(234,106,44,0) 62%);mix-blend-mode:screen;animation:p404 2.6s cubic-bezier(.21,.4,.48,1) infinite alternate;pointer-events:none}
@keyframes p404{from{opacity:.25;transform:translate(-50%,-50%) scale(.7)}to{opacity:1;transform:translate(-50%,-50%) scale(1.15)}}
.p404-fig figcaption{font-size:14px;color:var(--muted)}
@media (prefers-reduced-motion:reduce){.p404-flare{animation:none;opacity:.7}.p404-btn img{transition:none}}
@media (max-width:900px){.p404-fig{width:min(100%,360px);margin-inline:auto}}
@media (max-width:900px){.mk-grid{grid-template-columns:minmax(0,1fr);gap:0}.mk-vis,.mk-solo .mk-vis{position:relative;top:0;order:-1;height:auto;padding-block:8px 32px}.mk-vis .lmark-cv{height:30svh}.mk-solo .mk-grid{min-height:0}.mk-text{padding-top:8px}.mk-facts>div{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){.page-hero:has(.hero-mark){display:flex;flex-direction:column}.hero-mark{position:relative;inset:auto;order:-1;height:34svh;margin-bottom:16px}.page-hero:has(.hero-mark) .hero-head{min-height:0}}
@media (max-width:900px){.legal-grid{grid-template-columns:minmax(0,1fr)}.lmark{position:relative;top:0}.lmark-cv{width:200px}}
.legal h2{font-size:clamp(26px,3vw,34px);margin:48px 0 12px}
.legal p,.legal li{color:var(--muted)}
.chip-filter{display:flex;flex-wrap:wrap;gap:8px;margin-top:40px}
.chip-filter button{font:inherit;font-size:14px;color:var(--fg);background:transparent;border:1px solid var(--line-strong);border-radius:999px;padding:8px 16px;cursor:pointer;transition:background 200ms var(--ease),color 200ms var(--ease)}
.chip-filter button[aria-pressed="true"]{background:var(--fg);color:#000}
.chip-filter .mono{margin-left:4px}
.chip-filter button[aria-pressed="true"] .mono{color:rgba(0,0,0,.55)}

/* Video player */
/* zrm-player 1.0.0 | zeit:raum Design System | nutzt die Seiten-Tokens (--fg, --ease, --font-*) mit Fallbacks */
.zrm-video{
  --zrm-fg:var(--fg,#fff);
  --zrm-muted:var(--muted,rgba(255,255,255,.62));
  --zrm-line:var(--line-strong,rgba(255,255,255,.18));
  --zrm-glass:rgba(0,0,0,.55);
  --zrm-ease:var(--ease,cubic-bezier(.21,.4,.48,1));
  --zrm-head:var(--font-head,"Zeitraum Head","Zeitraum Text",Arial,sans-serif);
  --zrm-text:var(--font-text,"Zeitraum Text",Arial,sans-serif);
  --zrm-mono:var(--font-mono,"JetBrains Mono",ui-monospace,Menlo,monospace);
  position:relative;width:100%;aspect-ratio:var(--zrm-ratio,16/9);border-radius:12px;overflow:hidden;
  background:var(--bg-elev,#0A0A0B);color:var(--zrm-fg);container-type:inline-size;isolation:isolate;
  -webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none
}
.zrm-video video{display:block;width:100%;height:100%;max-width:none;object-fit:contain;background:#000}
.zrm-video:focus{outline:none}
.zrm-video :focus-visible{outline:1px solid var(--zrm-fg);outline-offset:2px}
.zrm-video [hidden]{display:none!important}
.zrm-hide{cursor:none}
.zrm-mono{font-family:var(--zrm-mono);font-size:12px;font-weight:400;letter-spacing:.06em;text-transform:uppercase;font-variant-numeric:tabular-nums}
:where(.zrm-video) button{font:inherit;color:inherit;margin:0;-webkit-appearance:none;appearance:none}

/* Grosser Play-Button im Stil von .play */
.zrm-big{position:absolute;left:24px;bottom:24px;z-index:3;display:inline-flex;align-items:center;gap:14px;min-height:48px;padding:0 22px 0 7px;
  border-radius:999px;background:var(--zrm-glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--zrm-line);
  font-family:var(--zrm-head);font-weight:700;font-size:15px;line-height:1;white-space:nowrap;cursor:pointer;
  transition:opacity 300ms var(--zrm-ease),visibility 0s,background 250ms var(--zrm-ease)}
.zrm-big:hover{background:rgba(0,0,0,.72)}
.zrm-big:focus-visible{outline-offset:4px}
.zrm-dot{flex:none;width:34px;height:34px;border-radius:50%;background:var(--zrm-fg);color:#000;display:grid;place-items:center;transition:transform 300ms var(--zrm-ease)}
.zrm-big:hover .zrm-dot{transform:scale(1.06)}
.zrm-dot svg{width:16px;height:16px;margin-left:2px}
.zrm-bigdur{color:var(--zrm-muted)}
.zrm-bigdur:empty{display:none}
.is-started:not(.is-ended) .zrm-big{opacity:0;visibility:hidden;pointer-events:none;transition:opacity 300ms var(--zrm-ease),visibility 0s 300ms}

/* Steuerleiste (Glas) */
.zrm-ctrl{position:absolute;left:12px;right:12px;bottom:12px;z-index:2;padding:4px 6px 2px;border-radius:12px;background:var(--zrm-glass);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--zrm-line);
  transition:opacity 300ms var(--zrm-ease),transform 300ms var(--zrm-ease),visibility 0s}
.zrm-video:not(.is-started) .zrm-ctrl,.is-ended .zrm-ctrl{opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity 300ms var(--zrm-ease),transform 300ms var(--zrm-ease),visibility 0s 300ms}
.zrm-hide .zrm-ctrl{opacity:0;transform:translateY(8px);pointer-events:none}
.zrm-row{display:flex;align-items:center;gap:2px;min-width:0}
.zrm-btn{flex:none;display:inline-grid;place-items:center;min-width:40px;height:40px;padding:0;border:0;border-radius:999px;background:transparent;cursor:pointer;transition:background 200ms var(--zrm-ease)}
.zrm-btn:hover{background:rgba(255,255,255,.1)}
.zrm-btn[aria-pressed=true]{background:rgba(255,255,255,.16)}
.zrm-btn svg{width:20px;height:20px}
.zrm-qbtn{padding:0 12px;font-size:11px}
.zrm-hqbtn{padding:0 10px;font-size:11px;letter-spacing:.06em}.zrm-hqbtn[aria-pressed="true"]{color:#000;background:#fff;border-radius:999px}  /* 03.11. G5 */
.zrm-time{flex:none;padding:0 10px;color:var(--zrm-muted);white-space:nowrap}
.zrm-cur{color:var(--zrm-fg)}
.zrm-sp{flex:1;min-width:0}

/* Fortschritt */
.zrm-bar{position:relative;height:22px;margin:0 10px;display:flex;align-items:center;cursor:pointer;touch-action:none}
.zrm-bar:focus-visible{outline-offset:0}
.zrm-track{position:relative;flex:1;height:2px;border-radius:2px;background:rgba(255,255,255,.14);overflow:hidden;transition:height 200ms var(--zrm-ease)}
.zrm-bar:hover .zrm-track,.zrm-bar:focus-visible .zrm-track{height:4px}
.zrm-buf,.zrm-fill{position:absolute;inset:0;display:block;transform-origin:0 50%;transform:scaleX(0)}
.zrm-buf{background:rgba(255,255,255,.4)}
.zrm-fill{background:var(--chA,linear-gradient(90deg,#3a5bff 0%,#2ad8ff 14%,#fff 34%,#fff 66%,#ffd84a 86%,#ff2a2a 100%));background-size:100% 100%;transform:none;clip-path:inset(0 calc((1 - var(--zp,0)) * 100%) 0 0)}
.zrm-knob{position:absolute;left:calc(var(--zp,0) * 100%);top:50%;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:#fff;pointer-events:none;transition:transform 200ms var(--zrm-ease)}
.zrm-bar:hover .zrm-knob,.zrm-bar:focus-visible .zrm-knob{transform:scale(1.5)}
.zrm-tip{position:absolute;bottom:26px;left:0;transform:translateX(-50%);padding:5px 9px;border-radius:999px;background:var(--zrm-glass);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--zrm-line);color:var(--zrm-fg);font-size:11px;line-height:1;
  opacity:0;pointer-events:none;transition:opacity 200ms var(--zrm-ease)}
.zrm-tip:empty{display:none}
@media (hover:hover){.zrm-bar:hover .zrm-tip{opacity:1}}

/* Qualitaet */
.zrm-menu{position:absolute;right:6px;bottom:calc(100% + 8px);display:flex;flex-wrap:wrap;justify-content:flex-end;gap:2px;max-width:calc(100% - 12px);padding:4px;
  border-radius:999px;background:rgba(0,0,0,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--zrm-line)}
.zrm-menu button{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 12px;border:0;border-radius:999px;background:none;color:var(--zrm-muted);
  font-family:var(--zrm-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;font-variant-numeric:tabular-nums;cursor:pointer;
  transition:background 200ms var(--zrm-ease),color 200ms var(--zrm-ease)}
.zrm-menu button:hover{color:var(--zrm-fg);background:rgba(255,255,255,.08)}
.zrm-menu button[aria-checked=true]{color:#000;background:var(--zrm-fg)}
.zrm-menu small{font-size:inherit;opacity:.6}

/* Untertitel (eigene Darstellung, rutscht ueber die Steuerleiste) */
.zrm-cues{position:absolute;left:6%;right:6%;bottom:28px;z-index:1;text-align:center;pointer-events:none;transition:bottom 300ms var(--zrm-ease)}
.zrm-cues span{padding:.12em .45em;border-radius:2px;background:rgba(0,0,0,.62);-webkit-box-decoration-break:clone;box-decoration-break:clone;
  font-family:var(--zrm-text);font-weight:400;font-size:clamp(14px,2.4cqi,24px);line-height:1.55;white-space:pre-line}
.is-started:not(.zrm-hide):not(.is-ended) .zrm-cues{bottom:96px}
.is-menu .zrm-cues{opacity:0}

/* Laden, Fehler */
.zrm-spin{position:absolute;left:50%;top:50%;z-index:1;width:36px;height:36px;margin:-18px 0 0 -18px;border-radius:50%;border:1.5px solid rgba(255,255,255,.2);
  border-top-color:var(--zrm-fg);opacity:0;pointer-events:none;transition:opacity 200ms var(--zrm-ease)}
.is-waiting .zrm-spin{opacity:1;animation:zrm-spin 900ms linear infinite}
@keyframes zrm-spin{to{transform:rotate(360deg)}}
.is-error::after{content:"Video nicht verfügbar";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--zrm-mono);font-size:12px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--zrm-muted)}

/* Vollbild */
.zrm-video:fullscreen{width:100%;height:100%;aspect-ratio:auto;border-radius:0;background:#000}
.zrm-video:-webkit-full-screen{width:100%;height:100%;aspect-ratio:auto;border-radius:0;background:#000}

/* Ambient-Loop */
.zrm-amb video{object-fit:cover}
.zrm-abtn{position:absolute;right:12px;bottom:12px;z-index:2;background:var(--zrm-glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border:1px solid var(--zrm-line);opacity:0;transition:opacity 300ms var(--zrm-ease),background 200ms var(--zrm-ease)}
.zrm-amb:hover .zrm-abtn,.zrm-abtn:focus-visible,.zrm-amb:not(.is-playing) .zrm-abtn{opacity:1}
@media (hover:none){.zrm-abtn{opacity:.8}}

/* Kompakt (Kacheln, Mobil) */
@container (max-width:520px){
  .zrm-big{left:12px;bottom:12px;min-height:44px;gap:10px;padding-right:16px;font-size:14px}
  .zrm-dot{width:30px;height:30px}
  .zrm-ctrl{left:8px;right:8px;bottom:8px;padding:2px 4px 0}
  .zrm-btn{min-width:36px;height:36px}
  .zrm-time{padding:0 6px;font-size:11px}
  .zrm-bar{margin:0 8px}
  .zrm-cues span{font-size:13px}
  .zrm-menu{gap:0;padding:3px}
  .zrm-menu button{min-height:30px;padding:0 8px}
  .zrm-menu small{display:none}
  .is-started:not(.zrm-hide):not(.is-ended) .zrm-cues{bottom:84px}
}
@container (max-width:340px){.zrm-sep,.zrm-dur{display:none}}

@media (prefers-reduced-motion:reduce){
  .zrm-video *,.zrm-video *::before,.zrm-video *::after{transition:none!important;animation:none!important}
  .zrm-ctrl{transform:none!important}
}

.zrm-logo{flex:none;display:inline-flex;align-items:center;height:40px;padding:0 14px 0 10px;color:#fff;opacity:.62;pointer-events:none}
.zrm-logo svg{display:block;height:11px;width:auto}
@media (max-width:480px){.zrm-logo{display:none}}

/* Footer 31.10.: eine Zeile, Cookies, Sponsor, Luft, Social */
footer.group .bottom .sponsor{order:1;flex-basis:auto;margin-left:8px}
footer.group .bottom .social,footer.group .bottom .social.social{order:2;margin-left:auto}
@media (min-width:1280px){footer.group .bottom{flex-wrap:nowrap;gap:12px 20px;white-space:nowrap}footer.group .bottom::before{content:none}footer.group .bottom .sponsor{margin-left:auto}}
@media (max-width:1279px){footer.group .bottom::before{content:"";flex-basis:100%;height:0;order:1}footer.group .bottom .sponsor{order:2;margin-left:0}footer.group .bottom .social,footer.group .bottom .social.social{order:3;margin-left:auto}}
/* Ueber uns: Kapitel-Navigation nicht auf dem Kapitel-Label */
.chapnav{margin-top:24px}
.chapnav+.chapter{margin-top:clamp(32px,3.5vw,56px)}
/* Marken-Teaser: weniger Leerraum vor dem Kontaktblock */
.sec.markteaser{padding-bottom:clamp(48px,6vw,88px)}
.markteaser + .contact .block{padding-top:clamp(72px,8vw,120px)}

/* Aufgaben 01.11. */
.auf-list{list-style:none;margin:clamp(48px,5vw,80px) 0 0;padding:0;display:grid;gap:0;border-top:1px solid var(--line-strong)}.auf{border-bottom:1px solid var(--line-strong)}.auf>a{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,72px);align-items:center;padding-block:clamp(32px,4vw,56px);color:var(--fg);text-decoration:none}.auf.flip>a{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}.auf.flip .auf-media{order:2}.auf-media{margin:0;border-radius:12px;overflow:hidden;aspect-ratio:2/1;background:var(--bg-elev)}.auf-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.21,.4,.48,1)}.auf>a:hover .auf-media img,.auf>a:focus-visible .auf-media img{transform:scale(1.03)}.auf-body{display:grid;gap:14px;min-width:0;max-width:52ch}.auf-idx{font-size:13px;color:var(--faint)}.auf-lbl{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}.auf-body h3,html.vc main .auf-body h3{margin:4px 0 0;font-size:clamp(26px,2.6vw,38px);line-height:1.05;letter-spacing:-.015em;text-wrap:balance}.auf-body p{margin:0;color:var(--muted);font-size:17px;line-height:1.55}.auf-body .auf-proof{font-size:15px;color:var(--faint)}.auf-cta{display:inline-flex;align-items:center;gap:10px;margin-top:8px;font-family:var(--font-head);font-weight:700;font-size:17px}.auf-cta svg{transition:transform .2s cubic-bezier(.21,.4,.48,1)}.auf>a:hover .auf-cta svg,.auf>a:focus-visible .auf-cta svg{transform:translateX(4px)}.auf>a:focus-visible{outline:2px solid var(--fg);outline-offset:6px;border-radius:12px}@media (max-width:900px){.auf>a,.auf.flip>a{grid-template-columns:minmax(0,1fr);gap:24px}.auf.flip .auf-media{order:0}}@media (prefers-reduced-motion:reduce){.auf-media img,.auf-cta svg{transition:none}}
/* Ausstattung: zwei Bilder über den Listen 01.11. */
.deliv-top{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:clamp(40px,4vw,64px) 0 clamp(32px,3vw,48px)}.deliv-top figure{margin:0;min-width:0}.deliv-top .g-open{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;border-radius:12px;overflow:hidden}.deliv-top img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;transition:transform 800ms var(--ease)}.deliv-top .g-open:hover img{transform:scale(1.03)}.deliv-top figcaption{font-size:13px;color:var(--faint);margin-top:8px}@media (max-width:700px){.deliv-top{grid-template-columns:1fr}}
/* Bio klein 01.11. */
.bio.bio-sm{grid-template-columns:minmax(0,3fr) minmax(0,7fr);align-items:center}.bio.bio-sm figure{max-width:380px}@media (max-width:900px){.bio.bio-sm{grid-template-columns:1fr}.bio.bio-sm figure{max-width:300px}}
/* Craft-Karte mit Still 01.11. */
.craft .craft-img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:12px;margin-top:8px}
/* Bausteine mit Foto oben 04.11. */
.craft .craft-img.craft-top{aspect-ratio:16/9;margin:0 0 18px}
/* Intro-Claim 04.11. */
main .sec .prose p.intro-claim:not(.lede):not(.note){color:var(--fg);font-size:clamp(20px,2vw,26px);line-height:1.3;margin-bottom:24px}
/* Header-Player: Seitenkopf-Regel .hero{padding-block} gilt nicht für den Player (04.11.) */
.zrm-video.hero{padding-block:0}
/* Footer: Gruppen-Link 01.11. */
footer.group .grp-link{display:inline-flex;align-items:center;gap:8px;text-decoration:none;transition:color .2s}footer.group .grp-link:hover,footer.group .grp-link:focus-visible{color:var(--fg)!important}footer.group .grp-link svg{transition:transform .2s cubic-bezier(.21,.4,.48,1)}footer.group .grp-link:hover svg{transform:translateX(4px)}

/* Marken-Ring 01.11.: 3D-Slideshow im Marken-Teaser */
.markteaser.mt3 .mt3-stage{background:#000;min-height:clamp(560px,56vw,820px);align-items:center;touch-action:pan-y}.markteaser.mt3 .mt3-stage::after{background:linear-gradient(90deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.7) 28%,rgba(0,0,0,0) 56%),linear-gradient(to top,rgba(0,0,0,.6) 0%,rgba(0,0,0,0) 30%);z-index:1;pointer-events:none}.markteaser.mt3 .mt3-cv{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;opacity:0;transition:opacity 1.2s cubic-bezier(.21,.4,.48,1);cursor:grab}.markteaser.mt3.mt3 .mt3-stage.mt3-drag .mt3-cv{cursor:grabbing}.markteaser.mt3 .is-3d .mt3-cv{opacity:1}.mt3-fb{position:absolute;inset:0;z-index:0;margin:0;padding:12px;list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:12px;transition:opacity .8s cubic-bezier(.21,.4,.48,1);opacity:.7;transform:perspective(1400px) rotateY(-14deg) scale(1.06);transform-origin:80% 50%}.mt3-fb li{min-height:0}.mt3-fb li:nth-child(n+19){display:none}.mt3-fb img{display:block;width:100%;height:100%;object-fit:cover;border-radius:12px}.markteaser.mt3 .is-3d .mt3-fb{opacity:0;visibility:hidden;transition:opacity .8s,visibility 0s .8s}.markteaser.mt3 .mt-copy{position:relative;z-index:2;pointer-events:none;align-self:center;width:100%}.markteaser.mt3 .mt-copy a{pointer-events:auto}.markteaser.mt3 .mt-copy .lede{max-width:44ch}.markteaser.mt3 .mt-copy h2{max-width:13ch}.mt3-ui{position:absolute;inset:auto clamp(20px,2.4vw,40px) clamp(20px,2.4vw,36px) auto;z-index:2;display:flex;flex-direction:column;align-items:flex-end;gap:14px;pointer-events:none;opacity:0;transition:opacity .8s cubic-bezier(.21,.4,.48,1)}.markteaser.mt3 .is-3d .mt3-ui{opacity:1}.mt3-hint{display:inline-flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.46)}.mt3-cap{margin:0;display:grid;justify-items:end;gap:4px;text-align:right;min-height:64px;opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s cubic-bezier(.21,.4,.48,1)}.mt3-cap.on{opacity:1;transform:none}.mt3-cap .mt3-i{font-size:11px;color:rgba(255,255,255,.46)}.mt3-cap .mt3-c{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.62)}.mt3-cap .mt3-t{font-family:var(--font-head);font-size:20px;letter-spacing:-.012em;color:#fff}.mt3-nav{display:flex;gap:8px;pointer-events:auto}.mt3-nav button{width:48px;height:48px;border-radius:999px;border:1px solid rgba(255,255,255,.28);background:rgba(0,0,0,.35);color:#fff;display:grid;place-items:center;cursor:pointer;-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);transition:background .2s,color .2s,border-color .2s}.mt3-nav button:hover{background:#fff;color:#000;border-color:#fff}@media (max-width:759px){.markteaser.mt3 .mt3-stage{min-height:min(980px,236vw);align-items:end}.markteaser.mt3 .mt-copy{align-self:end}.markteaser.mt3 .mt3-stage::after{background:linear-gradient(to top,rgba(0,0,0,.95) 0%,rgba(0,0,0,.75) 38%,rgba(0,0,0,0) 62%)}.mt3-fb{grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;grid-auto-rows:auto;transform:none;opacity:.55}.mt3-fb li:nth-child(n+10){display:none}.mt3-fb img{height:auto;aspect-ratio:4/3}.mt3-ui{inset:clamp(16px,4vw,24px) 16px auto auto;flex-direction:column-reverse}.mt3-cap{min-height:0}.mt3-hint{display:none}}.mt3-var{position:absolute;top:clamp(16px,2vw,28px);left:clamp(16px,2vw,28px);z-index:3;padding:6px 12px;border:1px solid rgba(255,255,255,.28);border-radius:999px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.7);background:rgba(0,0,0,.4)}.mtb-dim{position:absolute;left:0;top:0;z-index:2;font-size:11px;color:rgba(255,255,255,.46);pointer-events:none;opacity:0;transition:opacity .8s}.is-3d .mtb-dim{opacity:1}.markteaser.mtb .mt3-stage{background:radial-gradient(ellipse at 62% 55%,#0d0d10 0%,#000 60%);min-height:clamp(640px,64vw,940px)}@media (max-width:759px){.markteaser.mtb .mt3-stage{min-height:min(1080px,260vw)}}.mt3-fx{position:absolute;top:clamp(16px,2vw,28px);left:clamp(16px,2vw,28px);z-index:3;display:none;gap:6px}html.swon .mt3-fx{display:flex}.mt3-var+.mt3-fx{left:calc(clamp(16px,2vw,28px) + 210px)}.mt3-fx button{padding:6px 12px;border:1px solid rgba(255,255,255,.28);border-radius:999px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5);background:rgba(0,0,0,.4);cursor:pointer;transition:background .2s,color .2s}.mt3-fx button[aria-pressed=true]{background:#fff;color:#000;border-color:#fff}.mt3-stage::before{content:"";position:absolute;inset:-60px;z-index:1;pointer-events:none;opacity:0;transition:opacity .4s;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%27220%27 height=%27220%27%3E%3Cfilter id=%27n%27%3E%3CfeTurbulence type=%27fractalNoise%27 baseFrequency=%27.9%27 numOctaves=%272%27 stitchTiles=%27stitch%27/%3E%3CfeColorMatrix values=%270 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 1.4 -.35%27/%3E%3C/filter%3E%3Crect width=%27100%25%27 height=%27100%25%27 filter=%27url(%23n)%27/%3E%3C/svg%3E")}.mt3-stage.fx-grain::before{opacity:.55;animation:mt3grain .9s steps(6) infinite}@keyframes mt3grain{0%{transform:translate(0,0)}17%{transform:translate(-22px,14px)}33%{transform:translate(18px,-26px)}50%{transform:translate(-12px,30px)}67%{transform:translate(28px,8px)}83%{transform:translate(-30px,-18px)}100%{transform:translate(0,0)}}@media (max-width:759px){.mt3-var+.mt3-fx{top:56px;left:clamp(16px,2vw,28px)}}@media (prefers-reduced-motion:reduce){.mt3-stage.fx-grain::before{animation:none}}@media (prefers-reduced-motion:reduce){.mt3-fb{transform:none}.mt3 .mt3-cv,.mt3-ui{display:none}}
/* 02.11.: Marken-Teaser inline (Startseite), ohne schwarze Box */.markteaser.mt3-inline .mt3-stage{background:none;border-radius:0;overflow:visible} @media (min-width:760px){.markteaser.mt3-inline:not(.mtb) .mt3-stage{min-height:clamp(720px,66vw,1040px)}}.markteaser.mt3-inline .mt-copy h2,.markteaser.mt3-inline .mt-copy .lede{text-shadow:0 2px 18px rgba(0,0,0,.85),0 0 2px rgba(0,0,0,.6)}.markteaser.mt3-inline .mt3-stage::after{display:none}.markteaser.mt3-inline .mt3-stage::before{-webkit-mask-image:radial-gradient(ellipse 45% 50% at 72% 50%,#000 30%,transparent 100%);mask-image:radial-gradient(ellipse 45% 50% at 72% 50%,#000 30%,transparent 100%)}@media (max-width:759px){.markteaser.mt3-inline .mt3-stage::before{-webkit-mask-image:radial-gradient(ellipse 60% 30% at 50% 30%,#000 30%,transparent 100%);mask-image:radial-gradient(ellipse 60% 30% at 50% 30%,#000 30%,transparent 100%)}}
/* 02.11.: Hochformat-Hero, Text unten bündig wie auf den anderen Seiten */.hero-portrait .hero-head{display:grid;grid-template-columns:minmax(0,1fr);align-content:end}@media (min-width:1081px){.logos:has(>div:nth-child(27):last-child){grid-template-columns:repeat(9,minmax(0,1fr))}}@media (max-width:600px){.logos:has(>div:nth-child(27):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}}.clientlist{scroll-margin-top:96px}
/* 02.11.: Layout A, Footer ohne Abbinder (sonst überlagern sich Cookies und Sponsor) */
html:not(.vc) footer.group .bottom .sig{display:none}
/* 02.11.: Link 'Alle Auszeichnungen' / 'Komplette Kundenliste' bündig mit dem Text */
.aw-all{margin-left:0}.lede .aw-all{display:flex;width:max-content;max-width:100%;margin-top:12px}
/* 02.11.: Über uns, Porträt Thorsten neben dem Star-Trek-Bild (Bio entfällt) */
.st-duo{display:grid;grid-template-columns:2.09fr 1fr;gap:12px;order:2}.st-duo .feature-media{margin:0;height:100%}.st-duo .feature-media img,.feature-media video{height:100%;width:100%;object-fit:cover;display:block}.st-portrait{position:relative}.st-portrait figcaption{position:absolute;left:12px;right:12px;bottom:10px;z-index:3;font-size:12px;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.6)}@media (max-width:900px){.st-duo{order:0}}
/* 02.11.: Über uns, Fotowand direkt unter den Teamfotos */
section#team:has(+ .mq-nohead){padding-bottom:clamp(12px,1.6vw,20px)}main .sec.mq-nohead#people-culture{padding-top:0}.mq-nohead .mq{margin-top:0}

/* 02.11.: Stil B. Reines Stylesheet, angelehnt an digital.zeitraum.com, schwarz gespiegelt:
   sehr reduziert, viel Blackspace, kein Grain, kein Nebel, keine Sterne, keine Deko-Animationen. */
html.vb{--bg:#000;--bg-elev:#0f0f0f;--muted:rgba(255,255,255,.56);--faint:rgba(255,255,255,.42);--em:#fff;--line:rgba(255,255,255,.1);--line-strong:rgba(255,255,255,.16);--chA:rgba(255,255,255,.5);--grade:none}
html.vb body{background:#000}
html.vb body::before{background:#000}
html.vb #zrm-stars,html.vb #zrm-grain,html.vb body::after,html.vb footer.group::before,html.vb .fx-grain::before{display:none!important}
html.vb body::before{animation:none!important;background-image:none!important}
html.vb *,html.vb *::before,html.vb *::after{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:.2s!important}
html.vb .mq-track,html.vb .mt3-stage *{animation-duration:revert!important;animation-iteration-count:revert!important}
html.vb .rv{opacity:1!important;transform:none!important}
html.vb :is(img,video){filter:none!important}
html.vb :is(a,button,figure,.case-card,article):hover :is(img,video),html.vb .g-open:hover img{transform:none!important}
/* Typografie: Satzschreibung, klein und ruhig */
html.vb .eyebrow{font-weight:400;font-size:15px;letter-spacing:0;text-transform:none;color:var(--faint);gap:0}
html.vb .eyebrow::before,html.vb .eyebrow::after{display:none!important}
html.vb h1,html.vb main h1{font-size:clamp(30px,2.8vw,40px)!important;line-height:1.05!important;letter-spacing:.01em!important}
html.vb main h2{font-size:clamp(28px,2.8vw,40px)!important;line-height:1.1!important;letter-spacing:.01em!important}
html.vb main h3{letter-spacing:0}
html.vb :is(h1,h2,h3) em{color:inherit!important}
html.vb .page-hero h1 em,html.vb .hero h1 em{display:inline}
html.vb .lede,html.vb main p{font-weight:400}
html.vb .lede{font-size:18px;line-height:1.35;color:var(--muted)}
html.vb .mono{letter-spacing:0;text-transform:none}
/* Navigation: kleine Pills */
html.vb header.site nav a,html.vb header.site summary{font-family:var(--font-text);font-weight:400;font-size:13px}
html.vb .nav-k{background:#fff!important;color:#000!important;box-shadow:none!important}
/* Buttons: schlicht, klein */
html.vb .btn{font-family:var(--font-text);font-weight:400;font-size:14px;min-height:38px;padding:0 18px;border:0}
html.vb .btn.ghost{background:rgba(255,255,255,.08);color:#fff;border:0}
html.vb .btn.ghost:hover{background:rgba(255,255,255,.16);color:#fff}
/* Bilder und Karten: kleiner Radius, keine Schatten, keine Glows */
html.vb :is(.thumb,figure img,.g-open,.hqk .hqk-main,.mosaic figure,.gallery figure){border-radius:8px}
html.vb :is(.hq-collage li,.hqk .hqk-inset){filter:none!important;box-shadow:none!important}
html.vb .hqk .hqk-inset{box-shadow:0 0 0 4px #000!important}
html.vb .case-card .thumb::after{display:none}
html.vb :is(.case-card,.pillar-nav a,.vb-card,.related a)::before,html.vb :is(.case-card,.pillar-nav a,.vb-card,.related a)::after{box-shadow:none!important}
html.vb .case-grid.zz .case-card .row strong{font-family:var(--font-text)!important;font-weight:400!important;font-size:16px!important;letter-spacing:0!important}
/* Footer und Kontakt ohne Verlauf */
html.vb footer.group{background:#000}
html.vb .contact{background:#000}

/* 03.11.2026: Stil C, Grauton der Hintergruende (Grundton plus Grain) rund 30 % dunkler, gemessen 13,1 auf 9,2 */
html.vc:not(.vb){--bg:#050505}html.vc:not(.vb) #zrm-grain{opacity:.063}@media (max-resolution:1.49dppx){html.vc:not(.vb) #zrm-grain{opacity:.035}}
/* Entwicklungs-Umschalter auf Mobilgeraeten: umbrechen, groessere Knoepfe */
@media (max-width:670px){.zrm-variant{left:12px;right:12px;flex-wrap:wrap;justify-content:center;row-gap:4px;border-radius:18px}.zrm-variant button{min-width:32px;height:30px}}
/* 03.11.2026 G9: Mobile Navigation, drei Varianten ueber den Entwicklungs-Umschalter (Taste S bzw. ?dev=1 / langer Druck aufs Logo), Gruppe "Mobil-Navi".
   A: helle Pille in Creme unten, aktiver Punkt dunkel gefuellt, "Mehr" oeffnet das Menue mit DE | EN.
   B (html.mnb, Standard seit 03.11.): keine Leiste unten, Menue-Knopf neben Kontakt, Vollbild-Menue mit grossen Headlines.
   C (html.mnc): dunkle Glasleiste mit heller Kontur, Strich-Icons, weisser aktiver Punkt. */
.site nav .nav-m summary .nm-more{display:none}
@media (max-width:670px){
 header.site{z-index:26}  /* Leiste unten lag unter dem Verlauf body::after (z 25) und wirkte abgedunkelt */
 html:not(.mnb):not(.mnc) .site nav{background:var(--cream,#F6F3EC);box-shadow:0 10px 30px rgba(0,0,0,.5),inset 0 0 0 1px rgba(26,22,18,.1)}
 html:not(.mnb):not(.mnc) .site nav>a:not(.nav-k):not(.d-only),html:not(.mnb):not(.mnc) .site nav .nav-m summary{color:#1a1612;background:transparent;font-weight:500}
 html:not(.mnb):not(.mnc) .site nav>a:not(.nav-k):not(.d-only):hover,html:not(.mnb):not(.mnc) .site nav .nav-m summary:hover{color:#000;background:rgba(26,22,18,.08)}
 html:not(.mnb):not(.mnc) .site nav>a:not(.nav-k):not(.d-only)[aria-current],html:not(.mnb):not(.mnc) .site nav .nav-m[open] summary{color:var(--cream,#F6F3EC);background:#1a1612}
 html:not(.mnb):not(.mnc) .site nav>a:not(.nav-k):not(.d-only):focus-visible,html:not(.mnb):not(.mnc) .site nav .nav-m summary:focus-visible{outline:2px solid #1a1612;outline-offset:2px}
 html:not(.mnb):not(.mnc) .site nav .nav-m summary .nm-ico{display:none}
 html:not(.mnb):not(.mnc) .site nav .nav-m summary .nm-more{display:inline}
 html.mnc .site nav{background:none;box-shadow:none;border-radius:22px;padding:6px;gap:2px}
 html.mnc .site nav::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:rgba(12,12,12,.72);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.42),0 10px 30px rgba(0,0,0,.45)}
 html.mnc .site nav>a:not(.nav-k):not(.d-only),html.mnc .site nav .nav-m summary{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:66px;padding:8px 10px 7px;border-radius:16px;font-size:11px;line-height:1.1;color:rgba(255,255,255,.86);background:transparent}
 html.mnc .site nav>a:not(.nav-k):not(.d-only)::before,html.mnc .site nav .nav-m summary::before{content:"";width:20px;height:20px;background:currentColor;-webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat}
 html.mnc .site nav>a[href$="/leistungen/"]{--ico:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22square%22%3E%3Cpath%20d%3D%22M4%206h16M4%2012h16M4%2018h10%22/%3E%3C/svg%3E")}
 html.mnc .site nav>a[href$="/projekte/"]{--ico:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22square%22%3E%3Crect%20x%3D%223.5%22%20y%3D%224.5%22%20width%3D%2217%22%20height%3D%2215%22%20rx%3D%221.5%22/%3E%3Cpath%20d%3D%22M3.5%2010h17M10%2010v9.5%22/%3E%3C/svg%3E")}
 html.mnc .site nav>a[href$="/ueber-uns/"]{--ico:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22square%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228.5%22%20r%3D%223.5%22/%3E%3Cpath%20d%3D%22M5%2020c.8-3.6%203.6-5.5%207-5.5s6.2%201.9%207%205.5%22/%3E%3C/svg%3E")}
 html.mnc .site nav .nav-m summary{--ico:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22square%22%3E%3Cpath%20d%3D%22M4%207h16M4%2012h16M4%2017h16%22/%3E%3C/svg%3E")}
 html.mnc .site nav .nav-m summary .nm-ico{display:none}
 html.mnc .site nav .nav-m summary .nm-more{display:inline}
 html.mnc .site nav>a:not(.nav-k):not(.d-only)[aria-current],html.mnc .site nav .nav-m[open] summary{color:#111;background:#fff}
 html.mnc .site nav>a:not(.nav-k):not(.d-only)::after{display:none}
 html.mnb .site nav{top:calc(13px + env(safe-area-inset-top,0px));bottom:auto;left:auto;right:max(16px,env(safe-area-inset-right,0px));margin:0!important;padding:0;gap:8px;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}
 html.mnb .site nav>a:not(.nav-k):not(.d-only){display:none}
 html.mnb .site nav a.nav-k{position:static;order:1}
 html.mnb .site nav .nav-m{order:2}
 html.mnb .site nav .nav-m summary{padding:10px 14px;color:#fff;background:rgba(28,28,28,.62);box-shadow:inset 0 0 0 1px rgba(255,255,255,.34)}
 html.mnb .site nav .nav-m[open] summary{color:#000;background:#fff;box-shadow:none}
 html.mnb .site .nav-panel{position:fixed;inset:0;z-index:-1;max-height:none;height:100dvh;overflow:auto;border-radius:0;gap:0;padding:calc(92px + env(safe-area-inset-top,0px)) 24px calc(32px + env(safe-area-inset-bottom,0px));background:rgba(8,8,8,.97)}
 html.mnb .site nav .nav-panel>a{font:700 clamp(30px,9vw,40px)/1.15 var(--font-head);letter-spacing:-.015em;padding:4px 0;color:#fff;border-radius:0;background:none}
 html.mnb .site nav .nav-panel>a:hover,html.mnb .site nav .nav-panel>a[aria-current]{color:#fff;background:none;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
 html.mnb .site .nav-panel .np-eb{display:none}
 html.mnb .site .nav-panel .np-sep{margin:18px 0;background:rgba(255,255,255,.18)}
 html.mnb .site .nav-panel .np-lang{margin-top:24px;padding-top:20px;border-top:1px solid rgba(255,255,255,.18);font-size:16px}
}

/* 04.11.2026: Variante D „Zeit und Raum“ (Auftrag docs/auftraege/2026-11-04_layout-variante-d). Baut auf C auf (html.vc.vd).
   Zeit: Timecode statt Verlaufslinie an den Eyebrows. Raum: Maßlinie statt Kapsel in der Navigation. Bauhaus-Ecken statt Pillen. */
/* 1. Navigation: Textlinks, aktiver Punkt mit Maßlinie (1 px, Endstriche 5 px), Kontakt als Rechteck */
html.vd{--vd-dim:linear-gradient(currentColor,currentColor) 0 50%/100% 1px no-repeat,linear-gradient(currentColor,currentColor) 0 0/1px 100% no-repeat,linear-gradient(currentColor,currentColor) 100% 0/1px 100% no-repeat}
@media (min-width:671px){
 html.vd .site nav{gap:28px;background:none!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-radius:0!important}
 html.vd .site nav>a,html.vd .site nav .nav-m summary{background:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:none!important;border-radius:0!important;padding:10px 0;color:var(--muted);font-family:var(--font-text);font-weight:400;position:relative}
 html.vd .site nav>a:hover,html.vd .site nav .nav-m summary:hover,html.vd .site nav>a[aria-current],html.vd .site nav .nav-m[open] summary{color:#fff}
 html.vd .site nav>a:not(.nav-k)::after{content:"";position:absolute;left:0;right:0;bottom:3px;height:5px;background:var(--vd-dim);transform:none;opacity:0;transition:opacity .25s cubic-bezier(.21,.4,.48,1)}
 html.vd .site nav>a:not(.nav-k):hover::after{opacity:.4}
 html.vd .site nav>a[aria-current]:not(.nav-k)::after{opacity:1}
 html.vd .site nav>a.nav-k{padding:10px 16px;margin-left:12px;color:#fff;box-shadow:inset 0 0 0 1px #fff!important}
 html.vd .site nav>a.nav-k:hover{background:#fff!important;color:#000}
 html.vd .site nav>a:focus-visible,html.vd .site nav .nav-m summary:focus-visible{outline:2px solid #fff;outline-offset:4px}
}
@media (max-width:670px){
 html.vd .site nav a.nav-k,html.vd .site nav .nav-m summary{border-radius:0!important;background:rgba(5,5,5,.5)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:inset 0 0 0 1px #fff!important;color:#fff;min-height:44px;display:inline-flex;align-items:center}
 html.vd .site nav .nav-m[open] summary{background:#fff!important;color:#000;box-shadow:none!important}
}
/* Menü-Liste (Klappmenü und Vollbild-Menü): feine Trennlinien, aktiver Eintrag mit Maßlinie */
html.vd .site .nav-panel>a{display:block;position:relative;border-radius:0!important;background:none!important;text-decoration:none!important;padding:14px 0!important;border-bottom:1px solid rgba(255,255,255,.14)}
html.vd .site .nav-panel>a[aria-current]::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:7px;color:#fff;background:var(--vd-dim)}
html.vd .site .nav-panel>a:hover{color:#fff}
html.vd .site .nav-panel{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-radius:0!important;background:#080808!important}
html.vd .site .nav-panel .np-lang{border-top:0!important;margin-top:8px!important}
html.vd .site .nav-panel .np-sep{height:0;margin:10px 0!important;background:none!important}
/* 2. Eyebrows: Timecode je Seite fortlaufend, Hero 00:00:00:00, für Screenreader ausgeblendet */
html.vd main{counter-reset:tc}
html.vd main .eyebrow{counter-increment:tc;gap:14px}
html.vd main .page-hero .eyebrow,html.vd main .hero .eyebrow{counter-increment:none}
html.vd .eyebrow::before{content:"00:00:" counter(tc,decimal-leading-zero) ":00";content:"00:00:" counter(tc,decimal-leading-zero) ":00" / "";width:auto!important;height:auto!important;border-radius:0;background:none!important;animation:none!important;transform:none!important;transition:none!important;opacity:1!important;font:400 12px/1 var(--font-mono);letter-spacing:.04em;text-transform:none;color:var(--faint);font-variant-numeric:tabular-nums}
html.vd .page-hero .eyebrow::before,html.vd .hero .eyebrow::before{content:"00:00:00:00";content:"00:00:00:00" / ""}
html.vd .rv .eyebrow{transition:opacity .4s cubic-bezier(.21,.4,.48,1)!important}
html.vd .rv:not(.in) .eyebrow{letter-spacing:.02em}
/* 3. Zweiter Teil der Abschnitts-Headlines: Zeitraum Text Light statt Grau (Hero-H1 bleibt wie C) */
html.vd main h2 em{font-family:var(--font-text);font-weight:300;color:var(--fg);opacity:.85}
/* 4. Hero-Licht: anamorphotischer Flare statt Caustic-Fleck, Kern weiß, Farbe nur an den Enden */
html.vd body::before{top:clamp(150px,17vw,250px)!important;left:0!important;right:0!important;height:22px!important;opacity:.55!important;animation:none!important;transform:none!important;filter:blur(1px)!important;-webkit-mask:linear-gradient(to bottom,transparent,#000 46%,#000 54%,transparent)!important;mask:linear-gradient(to bottom,transparent,#000 46%,#000 54%,transparent)!important;
 background:linear-gradient(90deg,transparent 0%,rgba(58,91,255,.7) 7%,rgba(42,216,255,.7) 15%,rgba(255,255,255,.9) 32%,#fff 50%,rgba(255,255,255,.9) 68%,rgba(255,216,74,.7) 85%,rgba(255,42,42,.7) 93%,transparent 100%) 0 50%/100% 2px no-repeat,
  linear-gradient(90deg,transparent 0%,rgba(58,91,255,.22) 10%,rgba(255,255,255,.2) 50%,rgba(255,42,42,.2) 90%,transparent 100%) 0 50%/100% 100% no-repeat!important}
@media (max-width:670px){html.vd body::before{top:118px!important}}
/* 5. Formen: Pillen auf 2 px, Kreise bleiben rund; Buttons ohne Glow, Hover klar invertiert */
html.vd :is(.btn,.backlink,.casebar a,.casebar-in,.chapnav a,.chip-filter button,.chips li,.f-chip span,.film a.frame.ext .ext-label,.result-del li,.brow figcaption,.play,.zrm-big,.zrm-tip,.zrm-hqbtn,.skip,.cm__btn,.zrm-chip,.bf-sound,.kr-chips button){border-radius:2px!important}
html.vd .btn::before{display:none!important}
html.vd .btn:hover{background:transparent;color:var(--fg);border-color:var(--fg)}
html.vd .btn.ghost:hover{background:var(--fg);color:var(--bg);border-color:var(--fg)}
/* 6. Bewegung: nur Deckkraft, kurz, kaum gestaffelt */
html.vd .rv:not(.in){transform:none!important}
html.vd .rv{transition-duration:.4s;transition-delay:min(calc(var(--i,0) * 40ms),.15s)}

/* 05.11.2026: Stil E (Thorsten, korrigiert am selben Tag). Basis C (html.vc.ve): Hintergründe, Grain, Typo wie C.
   Dazu: Abstand nach oben wie B, eckige Formen wie D mit dem Verlaufs-Hover von A, Navi C (html.navc) mit voller chromatischer Linie beim Hover. */
html.vc.ve .page-hero .hero-head{min-height:0;padding-top:clamp(40px,5vw,72px);padding-bottom:40px}
html.ve :is(.btn,.backlink,.casebar a,.casebar-in,.chapnav a,.chip-filter button,.chips li,.f-chip span,.film a.frame.ext .ext-label,.result-del li,.brow figcaption,.play,.zrm-big,.zrm-tip,.zrm-hqbtn,.skip,.cm__btn,.zrm-chip,.bf-sound,.kr-chips button){border-radius:2px!important}
html.ve .btn::before{border-radius:inherit!important}
@media (min-width:671px){html.ve.navc .site nav a:hover::after{transform:scaleX(1)}}

/* 05.11.2026: HDR-Verlauf für die Headquarter-Tour (/europaallee-12/). Deren Regeln stehen im Seiten-CSS; dort löst
   url() aus --chA relativ zur Seite auf (falscher Pfad). Hier im Stylesheet stimmt der Pfad. */
html.hdrok :is(.hqr-prog i,.hqr-t)::after,html.hdrok .hqt-nav a::before{background-image:url(../media/fx/chroma-a-hdr.avif)}

/* 05.11.2026: Der Header klebt bei top:env(safe-area-inset-top). Auf iOS mit Safe Area (iPhone Duo im Tablet-Modus,
   Notch-Geräte) schien darüber der Inhalt durch. Ein Streifen in Höhe der Safe Area schließt die Lücke, Layout bleibt gleich. */
header.site::after{content:"";position:absolute;left:0;right:0;bottom:100%;height:env(safe-area-inset-top,0px);background:rgba(0,0,0,.82);pointer-events:none}
/* 05.11.2026: Ab 700 px liegt die Safari-Leiste oben (iPad, iPhone Duo innen). Safari meldet die Safe Area in voller
   Leistenhöhe und aktualisiert sie nicht, wenn die Leiste beim Scrollen schrumpft. 100svh (volle Leiste) minus 100dvh
   (aktuell) ist genau das Stück, um das sie geschrumpft ist: um dieses Stück rückt der Header hoch. Desktop: svh = dvh. */
@media (min-width:700px){header.site{top:calc(env(safe-area-inset-top,0px) + 100svh - 100dvh)}header.site::after{height:calc(env(safe-area-inset-top,0px) + 100svh - 100dvh)}}

/* Brand geometry */
:root{--cut:16px}
.scope,.page-hero .visual,.feature-media,.bio img,.tl-img img{--cut:clamp(20px,2.4vw,36px)}
.mosaic .w12 img,.mosaic .w8 img{--cut:clamp(18px,2vw,28px)}
.hq-collage li{filter:drop-shadow(0 22px 34px rgba(0,0,0,.85))}
.hq-collage li:first-child{filter:none}
/* Display-Typo: etwas mehr Zeilenabstand, damit Umlaute und Unterlängen nicht kollidieren; zweiter Headline-Teil auf eigener Zeile */
h1{line-height:.98}
.page-hero h1 em,.hero h1 em{display:block}
/* Fotowand aus Streifen: Abstand steckt im Bild */
.mq-track.seg{gap:0;animation-name:mqs}
@keyframes mqs{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* Justiertes Mosaik: gleiche Reihenhöhe, Bilder im eigenen Format */
.mosaic.just{display:flex;flex-direction:column;gap:16px}
.mosaic.just .mrow{display:flex;gap:16px;align-items:flex-start}
.mosaic.just figure{margin:0;min-width:0}
.mosaic.just img,.mosaic.just video{width:100%;height:auto;object-fit:cover;border-radius:12px;display:block}
@media(max-width:700px){.mosaic.just .mrow{flex-wrap:wrap}.mosaic.just .mrow figure{flex-basis:100%!important}}
/* Bewusster Bildausschnitt für Kacheln, wenn das Motiv nicht mittig sitzt */
img[src*="audi-e-tron-gt-vposter"]{object-position:22% 50%}
img[src*="freudenberg-fuel-cells-vposter"]{object-position:30% 50%}
img[src*="lacalut-experten-vposter"]{object-position:32% 50%}
/* Originalformate statt fester Rahmen */
.mosaic.just.gal .g-open{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.ext-strip{display:block!important}
.ext-strip .mrow{display:flex;gap:12px;align-items:flex-start}
.ext-strip img{height:auto!important;min-width:0;width:100%;grid-column:auto!important}
.ext-strip figcaption{margin-top:12px}
@media(max-width:700px){.ext-strip .mrow{flex-wrap:wrap}.ext-strip img{flex-basis:100%!important}}
.photo-metrics{aspect-ratio:auto!important}
.photo-metrics img{height:auto!important}
.journey .j-media{aspect-ratio:3/2}
/* Mosaik mit Video-Loop */
.mosaic video{width:100%;height:100%;object-fit:cover;border-radius:12px;display:block;background:var(--bg-elev)}
/* Werdegang: drei Stationen mit Pfeilen */
.journey{list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:24px;align-items:start}
.journey .j-step{min-width:0;display:flex;flex-direction:column;gap:24px}
.journey .j-media{margin:0;aspect-ratio:2/1;border-radius:12px;overflow:hidden;background:var(--bg-elev)}
.journey .j-media img,.journey .j-media video{width:100%;height:100%;object-fit:cover;display:block}
.journey .j-cap{margin:0;display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:15px;line-height:1.5}
.journey .j-cap strong{font-family:var(--font-head);color:var(--fg);font-size:20px;letter-spacing:-.01em;line-height:1.2}
.journey .j-cap .mono{font-size:12px;letter-spacing:.08em;color:var(--faint,rgba(255,255,255,.46))}
.journey .j-cap a{color:var(--fg);white-space:nowrap}
.journey .j-arrow{align-self:center;margin-top:calc(-1 * 40px);color:var(--muted)}
.journey[data-n="4"]{grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:16px}
.journey[data-n="4"] .j-arrow svg{width:24px}
@media(max-width:900px){.journey,.journey[data-n]{grid-template-columns:1fr;gap:16px}.journey .j-arrow{justify-self:center;margin:0;transform:rotate(90deg)}}
/* Markenfilm, selbstablaufend */
.bf{margin:48px 0 0;position:relative}
.bf video{width:100%;aspect-ratio:16/9;border-radius:12px;display:block;background:#000;object-fit:cover}
.bf-sound{position:absolute;right:16px;top:16px;font:inherit;font-size:13px;line-height:1;padding:8px 14px;border-radius:999px;border:0;cursor:pointer;color:#fff;background:rgba(28,28,28,.62);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.34)}
.bf-sound:hover{background:#fff;color:#000}
.bf-sound .off{display:none}.bf-sound[aria-pressed=true] .on{display:none}.bf-sound[aria-pressed=true] .off{display:inline}
.bf .note{margin-top:12px}

/* Header analog digital.zeitraum.com, schwarze Fassung: Lettermark + Glas-Pills */
.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:linear-gradient(to bottom,rgba(0,0,0,.82),rgba(0,0,0,.5) 60%,rgba(0,0,0,0));backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:0}
.site .wrap{display:flex;align-items:center;gap:24px;height:74px}
.site .brand{display:flex;align-items:center;color:#fff;flex:none}
.site .brand svg.lm{height:15px;width:auto;display:block}
.site nav{display:flex;align-items:center;gap:6px;margin-left:auto;font-size:13px;line-height:1}
.site nav a{display:inline-flex;align-items:center;padding:8px 14px;border-radius:999px;color:rgba(255,255,255,.72);background:rgba(28,28,28,.62);backdrop-filter:blur(12px) saturate(160%);-webkit-backdrop-filter:blur(12px) saturate(160%);transition:color 200ms cubic-bezier(.21,.4,.48,1),background 200ms cubic-bezier(.21,.4,.48,1);white-space:nowrap;text-decoration:none}
.site nav a:hover{color:#fff;background:rgba(64,64,64,.78)}
.site nav a[aria-current]{color:#000;background:#fff}
.site nav a.nav-k{color:#fff;background:rgba(28,28,28,.62);box-shadow:inset 0 0 0 1px rgba(255,255,255,.34);margin-left:6px}
.site nav a.nav-k:hover{color:#000;background:#fff;box-shadow:none}
.site nav a:focus-visible{outline:2px solid #fff;outline-offset:2px}
.site .btn{display:none}
/* Menü-Pill: unter 1080 px sitzen die Bereiche im Klappmenü */
.site nav .nav-m{display:none;position:relative}
.site nav .nav-m summary{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;color:rgba(255,255,255,.72);background:rgba(28,28,28,.62);backdrop-filter:blur(12px) saturate(160%);-webkit-backdrop-filter:blur(12px) saturate(160%);cursor:pointer;list-style:none;white-space:nowrap;user-select:none;transition:color 200ms cubic-bezier(.21,.4,.48,1),background 200ms cubic-bezier(.21,.4,.48,1)}
.site nav .nav-m summary::-webkit-details-marker{display:none}
.site nav .nav-m summary:hover{color:#fff;background:rgba(64,64,64,.78)}
.site nav .nav-m[open] summary{color:#000;background:#fff}
.site nav .nav-m summary:focus-visible{outline:2px solid #fff;outline-offset:2px}
.site nav .nav-m .nm-ico path{transition:transform 200ms cubic-bezier(.21,.4,.48,1),opacity 200ms;transform-origin:8px 6px}
.site nav .nav-m[open] .nm-ico .l1{transform:translateY(4px) rotate(45deg)}
.site nav .nav-m[open] .nm-ico .l2{opacity:0}
.site nav .nav-m[open] .nm-ico .l3{transform:translateY(-4px) rotate(-45deg)}
.site .nav-panel{position:absolute;right:0;top:calc(100% + 10px);min-width:248px;display:flex;flex-direction:column;gap:2px;padding:8px;border-radius:20px;background:rgba(18,18,18,.94);backdrop-filter:blur(16px) saturate(160%);-webkit-backdrop-filter:blur(16px) saturate(160%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.site nav .nav-panel a{display:flex;padding:12px 14px;border-radius:12px;font-size:15px;color:rgba(255,255,255,.78);background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.site nav .nav-panel a:hover{color:#000;background:#fff}
.site nav .nav-panel a[aria-current]{color:#fff;background:rgba(255,255,255,.12)}
.site .nav-panel .np-eb{padding:10px 14px 6px;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.46)}
.site .nav-panel .np-sep{height:1px;margin:6px 14px;background:rgba(255,255,255,.12)}
@media(prefers-reduced-motion:reduce){.site nav .nav-m .nm-ico path{transition:none}}
@media(max-width:1080px){.site nav a.d-only{display:none}.site nav .nav-m{display:block}}
@media(max-width:670px){
 .site .wrap{height:60px}
 .site nav{display:flex;position:fixed;left:0;right:0;width:max-content;margin-inline:auto !important;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:30;gap:4px;padding:4px;border-radius:999px;background:rgba(18,18,18,.88);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
 .site nav a{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;padding:10px 14px}
 .site nav .nav-m summary{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;padding:10px 14px}
 .site nav .nav-m summary span{display:none}
 .site .nav-panel{position:fixed;top:auto;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));bottom:calc(74px + env(safe-area-inset-bottom,0px));min-width:0;max-height:calc(100dvh - 160px);overflow:auto}
 .site nav a.nav-k{position:fixed;top:calc(13px + env(safe-area-inset-top,0px));right:max(16px,env(safe-area-inset-right,0px));margin:0;background:rgba(28,28,28,.62);}
 body::after{content:"";position:fixed;left:0;right:0;bottom:0;height:96px;pointer-events:none;z-index:25;background:linear-gradient(to top,rgba(0,0,0,.72),rgba(0,0,0,0))}
}

/* Gruppennavigator: Klick auf den Unit-Namen im Logo */
.site .brand-wrap{position:relative;display:flex;align-items:center;flex:none}
.site .unit-btn{position:absolute;left:93px;right:-10px;top:50%;height:44px;transform:translateY(-50%);padding:0;margin:0;border:0;background:transparent;cursor:pointer;border-radius:8px;-webkit-tap-highlight-color:transparent}
.site .unit-btn:focus-visible{outline:2px solid #fff;outline-offset:-8px}
.site .unit-btn::after{content:"";position:absolute;right:-3px;top:50%;width:5px;height:5px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;color:#fff;transform:translateY(-70%) rotate(45deg);opacity:0;transition:opacity 200ms cubic-bezier(.21,.4,.48,1),transform 200ms cubic-bezier(.21,.4,.48,1)}
.site .unit-btn:hover::after,.site .unit-btn:focus-visible::after,.site .brand-wrap.open .unit-btn::after{opacity:.7}
.site .brand-wrap.open .unit-btn::after{transform:translateY(-30%) rotate(225deg)}
.site .unit-menu{position:absolute;left:75px;top:calc(100% + 18px);min-width:236px;padding:8px;border-radius:20px;background:rgba(18,18,18,.94);backdrop-filter:blur(16px) saturate(160%);-webkit-backdrop-filter:blur(16px) saturate(160%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);opacity:0;transform:translateY(-6px);transition:opacity 220ms cubic-bezier(.21,.4,.48,1),transform 220ms cubic-bezier(.21,.4,.48,1)}
.site .brand-wrap.show .unit-menu{opacity:1;transform:none}
.site .unit-menu ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.site .unit-menu ul a{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:16px;align-items:center;padding:10px 12px;border-radius:12px;color:#fff;text-decoration:none;opacity:0;transform:translateY(-4px);transition:opacity 250ms cubic-bezier(.21,.4,.48,1) calc(var(--i)*40ms + 40ms),transform 250ms cubic-bezier(.21,.4,.48,1) calc(var(--i)*40ms + 40ms),background 200ms cubic-bezier(.21,.4,.48,1),color 200ms cubic-bezier(.21,.4,.48,1)}
.site .brand-wrap.show .unit-menu ul a{opacity:1;transform:none}
.site .unit-menu .un-w{font-family:var(--font-head);font-weight:700;font-size:19px;line-height:1;letter-spacing:-.015em}
.site .unit-menu .un-l{grid-column:1;font-size:12px;color:rgba(255,255,255,.5);margin-top:4px}
.site .unit-menu ul a svg{grid-column:2;grid-row:1/3;opacity:.5;transition:transform 200ms cubic-bezier(.21,.4,.48,1),opacity 200ms}
.site .unit-menu ul a:hover,.site .unit-menu ul a:focus-visible{background:#fff;color:#000;outline:0}
.site .unit-menu ul a:hover .un-l,.site .unit-menu ul a:focus-visible .un-l{color:rgba(0,0,0,.55)}
.site .unit-menu ul a:hover svg,.site .unit-menu ul a:focus-visible svg{transform:translateX(4px);opacity:1}
.site .unit-menu .un-group{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px;padding:12px 12px 6px;border-top:1px solid rgba(255,255,255,.12);font:12px var(--font-mono);letter-spacing:.04em;color:rgba(255,255,255,.5);text-decoration:none;opacity:0;transition:opacity 250ms cubic-bezier(.21,.4,.48,1) 200ms,color 200ms}
.site .brand-wrap.show .unit-menu .un-group{opacity:1}
.site .unit-menu .un-group:hover{color:#fff}
@media (max-width:640px){.site .unit-menu{left:-8px;min-width:min(280px,calc(100vw - 32px))}}
@media (prefers-reduced-motion:reduce){.site .unit-menu,.site .unit-menu ul a,.site .unit-menu .un-group{transition:none}}

/* Glow-Palette "Kino" (entschieden 19.10.2026); Werte als R,G,B */
:root{--g1:30,60,255;--g2:0,170,255;--g3:255,140,0;--g4:255,20,60;--g5:160,0,255}

/* Eyebrow: kurzer chromatischer Verlauf (wie der Warp), baut sich beim Einblenden auf und driftet leise */
.eyebrow::before{width:40px;height:2px;border-radius:1px;background:var(--chA);background-size:170% 100%;background-position:0% 0;transform-origin:left center;transition:transform 1.5s cubic-bezier(.21,.4,.48,1) .7s;animation:zrmEbDrift 7s ease-in-out infinite alternate}
.rv:not(.in) .eyebrow::before,.eyebrow.rv:not(.in)::before{transform:scaleX(0)}
.page-hero .eyebrow::before{animation:zrmEbIn 1.6s cubic-bezier(.21,.4,.48,1) 1s backwards,zrmEbDrift 7s ease-in-out 2.6s infinite alternate}
@keyframes zrmEbDrift{from{background-position:0% 0}to{background-position:100% 0}}
@keyframes zrmEbIn{from{transform:scaleX(0)}}
/* Hintergrund: Sternenfeld mit Warp (assets/js/zrm-stars.js) und Filmkorn */
html{background:var(--bg)}
body{background:transparent}
#zrm-stars{position:fixed;inset:0;width:100vw;height:100vh;z-index:-1;pointer-events:none;display:block;opacity:0;transition:opacity .8s cubic-bezier(.21,.4,.48,1)}
#zrm-stars.on{opacity:1}
#zrm-grain{position:fixed;inset:-128px;z-index:-1;pointer-events:none;opacity:.09;background-size:128px 128px;will-change:transform;contain:strict;animation:zrmGrain .48s steps(1) infinite}
@media (max-resolution:1.49dppx){#zrm-grain{opacity:.05}}
@keyframes zrmGrain{0%{transform:translate(0,0)}17%{transform:translate(-37px,23px)}33%{transform:translate(19px,-41px)}50%{transform:translate(-11px,47px)}67%{transform:translate(43px,7px)}83%{transform:translate(-29px,-17px)}}
/* Verläufe folgen dem Hintergrundton (falls --bg nicht reines Schwarz ist) */
.site{background:linear-gradient(to bottom,color-mix(in srgb,var(--bg) 82%,transparent),color-mix(in srgb,var(--bg) 50%,transparent) 60%,transparent)}
body::after{background:linear-gradient(to top,color-mix(in srgb,var(--bg) 72%,transparent),transparent)}
/* Logo-Raster und Footer ohne eigene Fläche: Sterne und Filmkorn laufen durch, Rasterlinien als Rahmen */
.logos{gap:0;background:none;border:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.logos div{background:transparent;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.group{background:transparent}
/* Abgesetzte Bänder (Kontakt, Filmleiste) halbtransparent statt fester Fläche */
.films{background:rgba(255,255,255,.035)}
/* Kontaktblock als milchiges Glas: Sterne dahinter weich geblurrt (Normalglas, Stand vom ersten Entwurf) */
.contact{background:rgba(0,0,0,.36);-webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%);border-top:1px solid rgba(255,255,255,.09);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),inset 0 -1px 0 rgba(255,255,255,.04)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.contact{background:rgba(0,0,0,.5)}}
/* Buttons: im Outline-Zustand beim Hover ein dezentes chromatisches Licht (Blau links, Rot rechts), das langsam atmet */
.btn{position:relative;isolation:isolate}
.btn::before{content:"";position:absolute;inset:-1px;border-radius:inherit;z-index:-1;pointer-events:none;opacity:0;filter:saturate(1.7) brightness(.92);transition:opacity 700ms cubic-bezier(.25,.1,.25,1);
 background:radial-gradient(closest-side,rgba(var(--g1),0.42),transparent) 0% 50%/55% 260% no-repeat,radial-gradient(closest-side,rgba(var(--g2),0.42),transparent) 26% 20%/45% 220% no-repeat,radial-gradient(closest-side,rgba(var(--g3),0.4),transparent) 72% 80%/45% 220% no-repeat,radial-gradient(closest-side,rgba(var(--g4),0.4),transparent) 100% 50%/55% 260% no-repeat,radial-gradient(closest-side,rgba(var(--g5),.28),transparent) 50% 50%/45% 220% no-repeat;
 box-shadow:-10px 0 28px -10px rgba(var(--g1),.5),0 -6px 26px -12px rgba(var(--g2),.38),0 8px 26px -12px rgba(var(--g3),.32),10px 0 28px -10px rgba(var(--g4),.46)}
.btn:hover::before,.btn:focus-visible::before{opacity:1;animation:zrmBtnGlow 6s ease-in-out infinite alternate}
@keyframes zrmBtnGlow{
 0%{background-position:-12% 50%,20% 10%,78% 90%,112% 50%,50% 50%;box-shadow:-10px 0 26px -12px rgba(var(--g1),.46),0 -6px 24px -12px rgba(var(--g2),.34),0 8px 24px -12px rgba(var(--g3),.28),10px 0 26px -12px rgba(var(--g4),.42)}
 50%{background-position:22% 40%,44% 70%,58% 30%,78% 60%,46% 50%}
 100%{background-position:8% 60%,30% 80%,70% 20%,92% 40%,56% 50%;box-shadow:-12px 0 32px -8px rgba(var(--g1),.58),0 -8px 30px -10px rgba(var(--g2),.44),0 10px 30px -10px rgba(var(--g3),.38),12px 0 32px -8px rgba(var(--g4),.54)}}
.btn.ghost:hover{background:transparent;color:var(--fg);border-color:var(--fg)}
/* Projekt-Raster "Zickzack": vollbreit, Reihen im Wechsel 2/3+1/3 und 1/3+2/3, Titel im Bild (Klassen setzt assets/js/zrm-grid.js) */
body{overflow-x:clip}
.case-grid.zz{--gap:6px;width:100vw;margin-left:calc(50% - 50vw);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap)}
.case-grid.zz .case-card{--h:clamp(240px,25vw,560px);grid-column:span 4;height:var(--h);position:relative;display:grid;overflow:hidden;isolation:isolate}
.case-grid.zz .case-card > *{grid-area:1/1}
.case-grid.zz .case-card .thumb{aspect-ratio:auto;height:100%;border-radius:0;background:var(--bg-elev)}
.case-grid.zz .case-card .thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.72) 0%,rgba(0,0,0,.25) 38%,rgba(0,0,0,0) 62%);pointer-events:none}
.case-grid.zz .case-card .row{align-self:end;margin:0;padding:0 clamp(18px,2.4vw,40px) clamp(52px,4.6vw,72px);z-index:1;align-items:flex-end}
.case-grid.zz .case-card .row strong{font-size:clamp(24px,2.6vw,48px);line-height:1;letter-spacing:-.018em;transition:transform 700ms cubic-bezier(.21,.4,.48,1)}
.case-grid.zz .case-card .row .mono{color:rgba(255,255,255,.62);font-size:12px}
.case-grid.zz .case-card .meta{align-self:end;z-index:1;margin:0;padding:0 clamp(18px,2.4vw,40px) clamp(22px,2.2vw,36px);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.72);display:flex;align-items:center;gap:12px}
.case-grid.zz .case-card .meta::before{content:"";width:28px;height:2px;border-radius:1px;flex:none;background:var(--chA);background-size:100% 100%}
.case-grid.zz .case-card:hover .row strong{transform:translateY(-4px)}
.case-grid.zz .case-card.zz-w4{grid-column:span 8}
.case-grid.zz .case-card.zz-v{grid-column:span 3}
.case-grid.zz .case-card.zz-w9{grid-column:span 9}
.case-grid.zz .case-card.zz-w6v{grid-column:span 6}
.case-grid.zz .case-card.zz-h{grid-column:span 6;--h:clamp(260px,30vw,640px)}
.case-grid.zz .case-card.zz-vrow{--h:min(calc((100vw - 3 * var(--gap)) / 4 * 16 / 9),92vh)}
.case-grid.zz .case-card.zz-v .row strong{font-size:clamp(22px,2vw,36px)}
.case-grid.zz .case-card.zz-w6{grid-column:span 12;--h:min(calc(100vw / 2.39),780px)}
.case-grid.zz .case-card.zz-w6[data-ar]{--h:calc(100vw / var(--ar))}
.case-grid.zz .case-card.zz-w6 .row strong{font-size:clamp(32px,4.4vw,80px)}
.case-grid.zz .case-card.rv{transform:none}
@media (max-width:760px){
 .case-grid.zz{grid-template-columns:1fr;--gap:4px}
 .case-grid.zz .case-card,.case-grid.zz .case-card.zz-w4{grid-column:auto;height:auto;aspect-ratio:4/5}
 .case-grid.zz .case-card.zz-w6{grid-column:auto;height:auto;aspect-ratio:16/10}
 .case-grid.zz .case-card.zz-w6[data-ar]{aspect-ratio:var(--ar)}
 .case-grid.zz .case-card .row strong{font-size:clamp(26px,7.5vw,40px)}
 .case-grid.zz{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row dense}
 .case-grid.zz .case-card,.case-grid.zz .case-card.zz-w4,.case-grid.zz .case-card.zz-w6,.case-grid.zz .case-card.zz-w6v,.case-grid.zz .case-card.zz-h{grid-column:span 2}
 .case-grid.zz .case-card.zz-v{grid-column:span 1;aspect-ratio:9/16}
 .case-grid.zz .case-card.zz-w9{grid-column:span 1;aspect-ratio:auto}
 .case-grid.zz .case-card.zz-v .row strong,.case-grid.zz .case-card.zz-w9 .row strong{font-size:clamp(20px,5.4vw,28px)}
 .case-grid.zz .case-card.zz-v .row,.case-grid.zz .case-card.zz-w9 .row{padding-inline:14px}
 .case-grid.zz .case-card.zz-v .meta,.case-grid.zz .case-card.zz-w9 .meta{padding-inline:14px;letter-spacing:.1em;font-size:10px}
}
/* Kunden-Logos: beim Hover ein leises chromatisches Licht hinter dem Logo, das langsam wandert */
.logos div{position:relative;isolation:isolate}
.logos div::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;filter:saturate(1.8) brightness(.9);transition:opacity 1s cubic-bezier(.25,.1,.25,1);
 background:radial-gradient(closest-side,rgba(var(--g1),.34),transparent) 0% 100%/75% 120% no-repeat,radial-gradient(closest-side,rgba(var(--g2),.30),transparent) 0% 0%/70% 110% no-repeat,radial-gradient(closest-side,rgba(var(--g3),.30),transparent) 100% 100%/70% 110% no-repeat,radial-gradient(closest-side,rgba(var(--g4),.32),transparent) 100% 0%/75% 120% no-repeat,radial-gradient(closest-side,rgba(var(--g5),.22),transparent) 50% 50%/55% 85% no-repeat}
.logos div:hover::before{opacity:1;animation:zrmLogoGlow 8s ease-in-out infinite alternate}
@keyframes zrmLogoGlow{0%{background-position:0% 100%,0% 0%,100% 100%,100% 0%,50% 50%}100%{background-position:18% 70%,22% 20%,82% 80%,80% 28%,50% 50%}}
.logos img{transition:opacity 300ms cubic-bezier(.21,.4,.48,1)}
.logos div:hover img{opacity:1}
/* Bilder: beim Hover ein chromatischer Schein hinter dem Bild (Blau links, Rot rechts), atmet langsam */
.pillar-nav .thumb,.related .thumb,.case-grid:not(.zz) .case-card .thumb,.vb-card .thumb,.gallery img,.mosaic img,.mosaic video{transition:box-shadow 1.4s cubic-bezier(.25,.1,.25,1),transform 800ms cubic-bezier(.21,.4,.48,1)}
.pillar-nav a:hover .thumb,.related a:hover .thumb,.case-grid:not(.zz) .case-card:hover .thumb,.vb-card:hover .thumb,.gallery figure:hover img,.mosaic figure:hover img,.mosaic figure:hover video{box-shadow:-18px 0 46px -18px rgba(var(--g1),.55),0 -16px 44px -22px rgba(var(--g2),.4),18px 0 46px -18px rgba(var(--g4),.5),0 22px 52px -24px rgba(var(--g3),.34),0 0 64px -22px rgba(var(--g5),.26);animation:zrmImgGlow 7s ease-in-out 1.4s infinite alternate}
@keyframes zrmImgGlow{from{box-shadow:-18px 0 46px -18px rgba(var(--g1),.55),0 -16px 44px -22px rgba(var(--g2),.4),18px 0 46px -18px rgba(var(--g4),.5),0 22px 52px -24px rgba(var(--g3),.34),0 0 64px -22px rgba(var(--g5),.26)}to{box-shadow:-24px -6px 56px -16px rgba(var(--g1),.64),6px -20px 52px -20px rgba(var(--g2),.46),24px 6px 56px -16px rgba(var(--g4),.58),-6px 26px 60px -22px rgba(var(--g3),.4),0 0 72px -20px rgba(var(--g5),.3)}}
/* Vollbreite Projektkacheln: das Licht fällt von innen über die Ränder ein */
/* Textlinks: beim Hover eine chromatische Unterstreichung, deren Farben langsam durchlaufen */
:is(.prose,.faq,.lede,.group .pitch,.vb) a:not(.btn):not(.vb-card):not(.vb-row),p a:not([class]),li > a:not([class]):not(.btn):not(:is(.chain,.chips,.lg-group) a){background-image:var(--chB);background-size:0% 1.5px;background-position:0 100%;background-repeat:no-repeat;-webkit-box-decoration-break:clone;box-decoration-break:clone;transition:background-size 1.2s cubic-bezier(.21,.4,.48,1),text-decoration-color 600ms}
:is(.prose,.faq,.lede,.group .pitch,.vb) a:not(.btn):not(.vb-card):not(.vb-row):hover,p a:not([class]):hover,li > a:not([class]):not(.btn):not(:is(.chain,.chips,.lg-group) a):hover{text-decoration-color:transparent;background-size:200% 1.5px;animation:zrmLinkFlow 8s linear 1.2s infinite}
@keyframes zrmLinkFlow{from{background-position:0% 100%}to{background-position:200% 100%}}
/* Chromatischer Nebel am Seitenende (hinter dem Footer, über Sternen und Korn) */
footer.group{position:relative;isolation:isolate}
footer.group .bottom .sponsor{margin-left:auto;flex-basis:100%;justify-content:flex-end}@media (max-width:1279px){footer.group .bottom::before{content:"";flex-basis:100%;height:0;order:1}footer.group .bottom .social.social{margin-left:0;order:2}footer.group .bottom .sponsor{order:3;flex-basis:auto;margin-left:auto}}.deliv-bay{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:24px 32px;padding:24px 0 32px;border-bottom:1px solid var(--line);align-items:start}.deliv-bay .bay-ims{display:grid;grid-template-columns:1fr 1fr;gap:12px}.deliv-bay figure{margin:0;min-width:0}.deliv-bay .g-open{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;border-radius:12px;overflow:hidden}.deliv-bay img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;transition:transform 800ms var(--ease)}.deliv-bay .g-open:hover img{transform:scale(1.03)}.deliv-bay figcaption{font-size:13px;color:var(--faint);margin-top:8px}@media (max-width:900px){.deliv-bay{grid-template-columns:1fr}.deliv-bay .bay-ims{grid-template-columns:1fr}}.chapnav{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.chapnav a{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 18px;border:1px solid var(--line-strong);border-radius:999px;font-family:var(--font-head);font-weight:700;font-size:14px;color:var(--fg);transition:background .2s,color .2s}.chapnav a:hover{background:var(--fg);color:var(--bg)}.chapnav .mono{font-size:11px;color:var(--faint)}.chapnav a:hover .mono{color:inherit}.chapter{display:flex;align-items:center;gap:16px;padding-top:0;scroll-margin-top:90px;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}.chapter::after{content:"";flex:1;height:1px;background:var(--line)}.chapter .mono{color:var(--faint)}.chapter+.sec{padding-top:clamp(40px,4vw,64px)}.markteaser .mt-stage{position:relative;width:calc(100vw - 2*clamp(16px,2.2vw,40px));margin-left:calc(50% - 50vw + clamp(16px,2.2vw,40px));border-radius:16px;overflow:hidden;min-height:clamp(460px,52vw,760px);display:grid;align-items:end;isolation:isolate}.markteaser .mt-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.markteaser .mt-stage::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.45) 45%,rgba(0,0,0,0) 75%)}.markteaser .mt-copy{padding-block:clamp(32px,5vw,72px);max-width:1320px}.markteaser .mt-copy h2{margin:16px 0 20px}.markteaser .mt-copy .lede{max-width:62ch;color:rgba(255,255,255,.8);margin-bottom:24px}.mt-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:16px}.mt-tile{display:block;color:var(--fg)}.mt-tile img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;transition:transform 800ms var(--ease)}.mt-tile:hover img{transform:scale(1.03)}.mt-tile span{display:flex;flex-direction:column;gap:4px;margin-top:12px;font-size:14px;color:var(--muted)}.mt-tile strong{font-family:var(--font-head);font-size:18px;color:var(--fg)}.mt-compact .mt-stage{min-height:clamp(380px,40vw,600px)}@media (max-width:900px){.mt-tiles{grid-template-columns:1fr 1fr}}.bio-more{margin-top:8px;border-top:1px solid var(--line)}.bio-more summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:52px;font-family:var(--font-head);font-weight:700;font-size:16px;color:var(--fg)}.bio-more summary::-webkit-details-marker{display:none}.bio-more summary svg{transition:transform 250ms var(--ease)}.bio-more[open] summary svg{transform:rotate(45deg)}.bio-more p{margin-top:0}main #kundenstimmen.sec{padding-top:clamp(24px,3vw,48px)}main .sec.sec:has(+#kundenstimmen){padding-bottom:clamp(24px,3vw,48px)}.bento.bleed{width:calc(100vw - 2*clamp(16px,2.2vw,40px));margin-left:calc(50% - 50vw + clamp(16px,2.2vw,40px));gap:12px}.bento.bleed .brow{gap:12px}.bento.bleed .brow figure{border-radius:12px;overflow:hidden}html:not(.vc) .case-grid.zz.r169 .case-card,html:not(.vc) .case-grid.zz.r169 .case-card.zz-w6,html:not(.vc) .case-grid.zz.r169 .case-card.zz-h{height:auto;aspect-ratio:16/9}html.vc .case-grid.zz.r169 .case-card .thumb,html.vc .case-grid.zz.r169 .case-card.zz-w6 .thumb,html.vc .case-grid.zz.r169 .case-card.zz-h .thumb{height:auto;aspect-ratio:16/9}footer.group .bottom .social{display:inline-flex;gap:14px;align-items:center;margin-left:auto}footer.group .bottom .social a{display:inline-flex;color:var(--faint);transition:color .2s}footer.group .bottom .social a:hover{color:var(--fg)}.facts dd a{color:inherit;text-decoration:underline;text-decoration-color:rgba(255,255,255,.35);text-underline-offset:3px}.facts dd a:hover{text-decoration-color:currentColor}
footer.group .bottom .sig{margin-left:0;color:#fff;font-weight:700}
footer.group::before{content:"";position:absolute;left:0;right:0;bottom:0;height:clamp(260px,34vw,520px);z-index:-1;pointer-events:none;filter:saturate(1.6);
 background:radial-gradient(45% 100% at 14% 100%,rgba(var(--g1),.18),transparent 70%),radial-gradient(40% 90% at 36% 100%,rgba(var(--g2),.10),transparent 70%),radial-gradient(40% 90% at 52% 100%,rgba(var(--g5),.12),transparent 70%),radial-gradient(40% 90% at 66% 100%,rgba(var(--g3),.08),transparent 70%),radial-gradient(45% 100% at 86% 100%,rgba(var(--g4),.15),transparent 70%)}
/* Navi: Schwarzverlauf erst beim Scrollen einblenden (Wunsch 20.10., beisst sich sonst mit dem Nebel) */
header.site{background:none!important}
header.site::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,rgba(0,0,0,.82),rgba(0,0,0,.5) 60%,rgba(0,0,0,0));opacity:var(--nf,0);transition:opacity .25s linear}
/* Nebel animiert: nur transform/opacity (GPU), langsam, bei reduzierter Bewegung aus */
@keyframes zrmNebA{0%,100%{transform:translate3d(-5%,0,0) scale(1);opacity:.85}50%{transform:translate3d(5%,0,0) scale(1.12);opacity:1}}
@keyframes zrmNebB{0%,100%{transform:translate3d(4%,0,0) scale(1.08);opacity:1}50%{transform:translate3d(-4%,0,0) scale(1);opacity:.8}}
body::before,footer.group::before{left:-8%!important;right:-8%!important;will-change:transform,opacity;transform-origin:50% 0}
body::before{animation:zrmNebA 26s ease-in-out infinite}
footer.group::before{transform-origin:50% 100%;animation:zrmNebB 32s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){body::before,footer.group::before{animation:none}}
html,body{overflow-x:clip}
/* Filmkorn auch auf den Film-Thumbs und Loops (zusammen mit dem Grade, Umschalter "Grade" schaltet beides) */
.feature-media{position:relative;display:block;overflow:hidden}
.pillar-nav .thumb,.related .thumb{position:relative;overflow:hidden}
html:not(.nograin) :is(.case-card .thumb,.pillar-nav .thumb,.related .thumb,.feature-media)::before{content:"";display:block!important;position:absolute;inset:-128px;z-index:2;pointer-events:none;background:var(--grain) 0 0/128px 128px repeat;mix-blend-mode:overlay;opacity:.11;animation:zrmGrain .48s steps(1) infinite}
/* HDR (30.10.): Grade und Korn liegen auch auf HDR-Kacheln; erst bei Hover (Desktop) bzw. auf der laufenden Kachel (Touch) fallen beide weg und die Kachel zeigt volles HDR */
@media (hover:hover){html :is(a,.case-card,.vb-card,.feature,figure):hover .thumb.hdr :is(img,video){filter:none!important}html:not(.nograin) :is(a,.case-card):hover .thumb.hdr::before{opacity:0!important}}
@media (hover:none){html .case-card.playing .thumb.hdr :is(img,video){filter:none!important}html:not(.nograin) .case-card.playing .thumb.hdr::before{opacity:0!important}}
html:not(.nograin) .thumb.hdr::before{transition:opacity .6s cubic-bezier(.21,.4,.48,1)}
/* Kanten-Blitzer (20.10.): Medien 2 px über den Rand ziehen, Kachel als eigene Ebene sauber beschneiden */
:is(.case-card,.pillar-nav a,.related a) .thumb{overflow:hidden;isolation:isolate;transform:translateZ(0);-webkit-mask-image:-webkit-radial-gradient(white,black)}
.case-card .thumb img,.pillar-nav .thumb img,.related .thumb img{width:calc(100% + 4px)!important;height:calc(100% + 4px)!important;max-width:none;margin:-2px}.pillar-nav .thumb video{display:block;width:calc(100% + 4px)!important;height:calc(100% + 4px)!important;max-width:none;margin:-2px;object-fit:cover}
.case-card .thumb video,.related .thumb video{inset:-2px!important;width:calc(100% + 4px)!important;height:calc(100% + 4px)!important;max-width:none!important}
@media (prefers-reduced-motion:reduce){html:not(.nograin) :is(.case-card .thumb,.pillar-nav .thumb,.related .thumb,.feature-media)::before{animation:none}}
@media (max-resolution:1.49dppx){html:not(.nograin) :is(.case-card .thumb,.pillar-nav .thumb,.related .thumb,.feature-media)::before{opacity:.07}}
/* Seitenanfang: derselbe chromatische Caustic-Nebel wie im Footer, gespiegelt */
html.cx body::before{top:-60px;background:var(--cx) 50% 0%/min(1400px,140%) auto no-repeat;filter:blur(40px) saturate(2.4);opacity:.42;-webkit-mask:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.82) 14%,rgba(0,0,0,.58) 30%,rgba(0,0,0,.36) 46%,rgba(0,0,0,.2) 62%,rgba(0,0,0,.09) 77%,rgba(0,0,0,.03) 89%,transparent 100%);mask:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.82) 14%,rgba(0,0,0,.58) 30%,rgba(0,0,0,.36) 46%,rgba(0,0,0,.2) 62%,rgba(0,0,0,.09) 77%,rgba(0,0,0,.03) 89%,transparent 100%)}
@keyframes zrmNebCx{0%,100%{transform:translate3d(-5%,0,0) scale(1);opacity:.36}50%{transform:translate3d(5%,0,0) scale(1.12);opacity:.46}}
@keyframes zrmNebCxF{0%,100%{transform:translate3d(4%,0,0) scale(1.08);opacity:.46}50%{transform:translate3d(-4%,0,0) scale(1);opacity:.36}}
html.cx body::before{animation-name:zrmNebCx}
html.cx footer.group::before{animation-name:zrmNebCxF}
/* HDR-Test (20.10.): Nebel als HDR-AVIF (PQ, BT.2020), Blur und Saettigung sind ins Bild gerechnet. Nur auf HDR-Displays mit HDR-Schalter an */
html.cx.hdrok body::before,html.cx.hdrok footer.group::before{background-image:url(../media/fx/caustic-hdr.avif);filter:none}
/* HDR ohne Weichzeichner: Bildrand links und rechts zusaetzlich weich auf transparent maskieren (gleiche Breite und Lage wie das Bild) */
html.cx.hdrok footer.group::before{-webkit-mask:linear-gradient(to top,#000 20%,transparent),linear-gradient(to right,transparent,#000 24%,#000 76%,transparent) 50% 0/min(1400px,140%) 100% no-repeat;-webkit-mask-composite:source-in;mask:linear-gradient(to top,#000 20%,transparent),linear-gradient(to right,transparent,#000 24%,#000 76%,transparent) 50% 0/min(1400px,140%) 100% no-repeat;mask-composite:intersect}
html.cx.hdrok body::before{-webkit-mask:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.82) 14%,rgba(0,0,0,.58) 30%,rgba(0,0,0,.36) 46%,rgba(0,0,0,.2) 62%,rgba(0,0,0,.09) 77%,rgba(0,0,0,.03) 89%,transparent 100%),linear-gradient(to right,transparent,#000 24%,#000 76%,transparent) 50% 0/min(1400px,140%) 100% no-repeat;-webkit-mask-composite:source-in;mask:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.82) 14%,rgba(0,0,0,.58) 30%,rgba(0,0,0,.36) 46%,rgba(0,0,0,.2) 62%,rgba(0,0,0,.09) 77%,rgba(0,0,0,.03) 89%,transparent 100%),linear-gradient(to right,transparent,#000 24%,#000 76%,transparent) 50% 0/min(1400px,140%) 100% no-repeat;mask-composite:intersect}
/* HDR-Kacheln: in Ruhe auf SDR-Helligkeit begrenzt, beim Hover volle Helligkeit (Chrome/Edge 136+, Safari 26+) */
@media (hover:hover){html .thumb.hdr > video{dynamic-range-limit:standard;dynamic-range-limit:constrained;transition:dynamic-range-limit 900ms cubic-bezier(.21,.4,.48,1)}
html :is(a,.case-card,.vb-card,.feature,figure):hover .thumb.hdr > video{dynamic-range-limit:no-limit}}
/* 05.11.2026: nur Kacheln (.thumb). Header- und Showreel-Loops (.visual.hdr) laufen immer mit voller HDR-Helligkeit, ohne Hover-Wechsel */
/* Derselbe Nebel gespiegelt am Seitenanfang (Wunsch 20.10.) */
body{position:relative}
body::before{content:"";position:absolute;left:0;right:0;top:0;height:clamp(220px,27vw,410px);z-index:-1;pointer-events:none;filter:saturate(1.6);
 background:radial-gradient(45% 100% at 86% 0%,rgba(var(--g1),.18),transparent 70%),radial-gradient(40% 90% at 64% 0%,rgba(var(--g2),.10),transparent 70%),radial-gradient(40% 90% at 48% 0%,rgba(var(--g5),.12),transparent 70%),radial-gradient(40% 90% at 34% 0%,rgba(var(--g3),.08),transparent 70%),radial-gradient(45% 100% at 14% 0%,rgba(var(--g4),.15),transparent 70%)}
/* ===== Variante C: digital-Formensprache (html.vc, Standard; Variante A ohne Klasse) ===== */
/* Variante C: digital-Formensprache über dem vollständigen Inhalt */
html.vc{--muted:rgba(255,255,255,.58);--faint:rgba(255,255,255,.42)}
html.vc .wrap{max-width:1640px;padding-left:max(clamp(20px,5.3vw,96px),env(safe-area-inset-left,0px));padding-right:max(clamp(20px,5.3vw,96px),env(safe-area-inset-right,0px))}
html.vc main .sec + .sec,html.vc main .sec + .block,html.vc main .block + .sec{padding-top:clamp(80px,8.5vw,128px)}
html.vc main em{color:rgba(255,255,255,.5)}
/* Headlines */
html.vc h1{font-size:clamp(32px,2.8vw,40px);line-height:1;letter-spacing:.01em;margin-top:0}
html.vc main h2{font-size:clamp(28px,2.8vw,40px);line-height:1.05;letter-spacing:.01em;margin-top:0}
html.vc main h3{font-size:20px;line-height:1.25;letter-spacing:0}
html.vc .pillar-nav h3{font-size:20px;margin:14px 0 4px}
html.vc main summary{font-size:18px}
/* Eyebrows als graue Satz-Zeile mit kurzem Chroma-Strich */
html.vc .eyebrow{font-weight:400;font-size:16px;letter-spacing:.02em;text-transform:none;color:var(--faint);gap:12px;margin-bottom:20px}
html.vc .eyebrow::before{width:40px}
html.vc .rv .eyebrow{transition:opacity .7s cubic-bezier(.21,.4,.48,1) .35s,letter-spacing .9s cubic-bezier(.21,.4,.48,1) .35s}
html.vc .rv:not(.in) .eyebrow{opacity:0;letter-spacing:.12em}
html.vc .rv .eyebrow::before{transition:transform 1.6s cubic-bezier(.21,.4,.48,1) .7s;opacity:1}
/* Ledes und Fließtext */
html.vc .lede{font-weight:400;font-size:18px;line-height:1.35;color:var(--muted);max-width:56ch}
html.vc main .sec p:not(.lede):not(.note),html.vc main .block p{font-size:16px;line-height:1.45}
html.vc .sec-head{gap:24px 64px;align-items:end}
html.vc .sec-head h2{margin-top:0}
/* Hero: Headline sitzt tief im Sternenhimmel */
html.vc .page-hero .hero-head{min-height:calc(78svh - 74px);align-items:end;padding-bottom:40px}
html.vc .page-hero .ctas{margin-top:24px}
/* Bild-Grade (Test): Bilder und Loops zurueckhaltend entsaettigt, beim Hover volle Farbe.
   Auf Touch-Geraeten bekommt die automatisch spielende Kachel volle Farbe. Abschaltbar ueber html.nograde. */
html:not(.nograde){--grade:saturate(.55) contrast(1.04) brightness(.9);--grade-t:filter .7s cubic-bezier(.21,.4,.48,1)}
/* 30.10.: kein Grade in den Referenz-Grids (HDR-Kacheln), Grade bleibt auf Galerien, Mosaiken und Teasern */
html:not(.nograde) .case-card .thumb :is(img,video){filter:none;transition:transform 800ms cubic-bezier(.21,.4,.48,1),opacity 250ms cubic-bezier(.21,.4,.48,1)}
html:not(.nograde) :is(.pillar-nav .thumb,.feature-media,.related .thumb) :is(img,video){filter:var(--grade);transition:transform 800ms cubic-bezier(.21,.4,.48,1),opacity 250ms cubic-bezier(.21,.4,.48,1),var(--grade-t)}
html:not(.nograde) :is(.gallery,.mosaic) :is(img,video){filter:var(--grade);transition:box-shadow 1.4s cubic-bezier(.25,.1,.25,1),transform 800ms cubic-bezier(.21,.4,.48,1),var(--grade-t)}
html:not(.nograde) :is(.vb-card .thumb,.photo-metrics,.visit) :is(img,video){filter:var(--grade);transition:transform 800ms cubic-bezier(.21,.4,.48,1),var(--grade-t)}
html:not(.nograde) :is(.case-card:hover,.pillar-nav a:hover,.related a:hover,.vb-card:hover) .thumb :is(img,video),
html:not(.nograde) :is(.gallery figure:hover,.mosaic figure:hover,.feature-media:hover,.photo-metrics:hover,.visit:hover) :is(img,video){filter:none}
@media (hover:none){html:not(.nograde) .case-card.playing .thumb :is(img,video){filter:none}}
/* 02.11.: Grade auch auf Ausstattung, Memorabilia, Wall of Fame, Standorten und Fotowand */
html:not(.nograde) :is(.deliv-top figure,.bay-ims figure,.wm-v,.tl-img,.addr article,.hq-collage li) :is(img,video),html:not(.nograde) :is(.mq,.ext-strip) img{filter:var(--grade);transition:transform 800ms cubic-bezier(.21,.4,.48,1),var(--grade-t)}
html:not(.nograde) :is(.deliv-top figure:hover,.bay-ims figure:hover,.wm-v:hover,.tl-img:hover,.addr article:hover,.hq-collage li:hover) :is(img,video),html:not(.nograde) :is(.mq,.ext-strip) img:hover{filter:none}
/* 03.11. G6/G7: beschnittene Kacheln zeigen Bild und Loop mit identischem Ausschnitt, Mitte auf 38,2 % der Hoehe (Goldener Schnitt); je Projekt anpassbar ueber crop_y in portfolio.json */
:where(.case-card,.related a,.pillar-nav a,.vb-card) .thumb :where(img,video){object-position:50% var(--crop-y,38.2%)}
/* 03.11. G2: auf Case-Seiten keine Grade auf den Bildern der Arbeit (Galerie, Mosaik, Stills, Ergebnis). Kacheln (Weitere Projekte) und Homebase behalten sie */
html:not(.nograde) .case-page :is(.gallery,.mosaic,.feature-media,.photo-metrics,.scope,.film,figure.still,figure.full) :is(img,video){filter:none}
/* 02.11.: Layout A, Case-Titel in den Galerien deutlich kleiner (blaue Brow bleibt) */
.map-card>img{filter:none;opacity:.62}html:not(.vc) .case-grid.zz .case-card .meta::before{display:none}html:not(.vc) .case-grid.zz .case-card .row strong{font-size:clamp(18px,1.5vw,24px);line-height:1.15;letter-spacing:-.01em}html:not(.vc) .case-grid.zz .case-card.zz-w6 .row strong{font-size:clamp(20px,1.9vw,30px)}html:not(.vc) .case-grid.zz .case-card.zz-v .row strong{font-size:clamp(16px,1.3vw,20px)}@media (max-width:700px){html:not(.vc) .case-grid.zz .case-card .row strong,html:not(.vc) .case-grid.zz .case-card.zz-w6 .row strong{font-size:20px}html:not(.vc) .case-grid.zz .case-card.zz-v .row strong,html:not(.vc) .case-grid.zz .case-card.zz-w9 .row strong{font-size:17px}}
/* B und C: einheitlich mehr Luft zwischen Bereichs-Headline und Inhalt */
html.vc .sec-head{margin-bottom:0}
html.vc .sec .sec-head + *{margin-top:clamp(48px,5vw,80px)}
/* Variante B = C ohne den großen Leerraum am Seitenanfang (Entwicklungsphase) */
html.vc.vb .page-hero .hero-head{min-height:0;padding-top:clamp(40px,5vw,72px);padding-bottom:40px}
html.vc .btn{font-size:14px;min-height:40px;padding-inline:18px}
/* Medien mit 8 px Radius */
html.vc main :is(.thumb,.visual,.visual video,figure img,figure video,.mosaic img,.mosaic video,.journey .j-media,.bf video){border-radius:8px}
/* Projekte: asymmetrisch wie digital, Titel unter dem Bild */
html.vc .case-grid.zz{width:auto;margin-left:0;grid-template-columns:repeat(12,minmax(0,1fr));gap:40px 24px}
html.vc .case-grid.zz .case-card{grid-column:span 4;height:auto;display:flex;flex-direction:column;overflow:visible;isolation:auto}
html.vc .case-grid.zz .case-card > *{grid-area:auto}
html.vc .case-grid.zz .case-card.zz-w4{grid-column:span 8}
html.vc .case-grid.zz .case-card.zz-v{grid-column:span 3}
html.vc .case-grid.zz .case-card.zz-w9{grid-column:span 9}
html.vc .case-grid.zz .case-card.zz-w6v{grid-column:span 6}html.vc .case-grid.zz .case-card.zz-h{grid-column:span 6}html.vc .case-grid.zz .case-card.zz-h .thumb{height:clamp(260px,30vw,560px)}
.case-grid.zz .case-card.zz-h{grid-column:span 6;--h:clamp(260px,30vw,640px)}
@media (max-width:760px){.case-grid.zz .case-card.zz-h{grid-column:span 2;height:auto;aspect-ratio:16/10}}
html.vc .case-grid.zz .case-card.zz-v .thumb{height:auto;aspect-ratio:9/16}
html.vc .case-grid.zz .case-card.zz-vrow:not(.zz-v) .thumb{height:auto;flex:1 1 0;min-height:0}
html.vc .case-grid.zz .case-card.zz-w6{grid-column:1/-1}
html.vc .case-grid.zz .case-card .thumb{height:clamp(240px,24vw,440px);border-radius:8px}
html.vc .case-grid.zz .case-card.zz-w6 .thumb{height:auto;aspect-ratio:2.39/1}
html.vc .case-grid.zz .case-card.zz-w6[data-ar] .thumb{aspect-ratio:var(--ar)}
html.vc .case-grid.zz .case-card .thumb::after{display:none}
html.vc .case-grid.zz .case-card .thumb::before{display:none}
html.vc .case-grid.zz .case-card .row{padding:0;margin-top:12px;align-items:baseline;align-self:stretch}
html.vc .case-grid.zz .case-card .row strong,html.vc .case-grid.zz .case-card.zz-w6 .row strong{font-family:var(--font-text);font-weight:400;font-size:16px;letter-spacing:0;line-height:1.3}
html.vc .case-grid.zz .case-card:hover .row strong{transform:none}
html.vc .case-grid.zz .case-card .meta{align-self:stretch;padding:0;margin-top:2px;font-size:13px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--faint);display:block}
html.vc .case-grid.zz .case-card .meta::before{display:none}
/* Kennzahlen kleiner */
html.vc .photo-metrics li strong{font-size:clamp(36px,3.6vw,56px)}
html.vc .stats strong{font-size:clamp(32px,3.4vw,52px)}
/* Kunden-Logos als Kacheln wie digital */
html.vc .logos{gap:8px;border:0;margin-top:32px}
html.vc .logos div{border:0;border-radius:8px;background:rgba(255,255,255,.035);min-height:96px;padding:20px}
@media (max-width:900px){
 html.vc .case-grid.zz{grid-template-columns:1fr}
 html.vc .case-grid.zz .case-card,html.vc .case-grid.zz .case-card.zz-w4{grid-column:auto;aspect-ratio:auto}
 html.vc .case-grid.zz .case-card .thumb{height:auto;aspect-ratio:16/10}
 html.vc .case-grid.zz .case-card.zz-v,html.vc .case-grid.zz .case-card.zz-w9,html.vc .case-grid.zz .case-card.zz-w6v{grid-column:auto}
 html.vc .case-grid.zz .case-card.zz-h{grid-column:auto} html.vc .case-grid.zz .case-card.zz-h .thumb{height:auto;aspect-ratio:16/10}  /* 03.11. G8: halb/halb-Kacheln mobil einspaltig, sonst entstehen implizite Spalten */
 html.vc .case-grid.zz .case-card.zz-v .thumb{aspect-ratio:4/5}
 html.vc .case-grid.zz .case-card.zz-vrow:not(.zz-v) .thumb{flex:none}
 html.vc .page-hero .hero-head{min-height:60svh} html.vc.vb .page-hero .hero-head{min-height:0}
}

/* Navigation (23.10.): Zurück-Link, Brotkrümel, Case-Leiste, Vorheriges/Nächstes, Weiter-Block */
.navrow{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;padding-block:20px 0}
.navrow .crumbs{padding-block:0}
.backlink{display:inline-flex;align-items:center;gap:10px;min-height:38px;padding:0 16px 0 12px;border-radius:999px;border:1px solid var(--line-strong);color:var(--fg);text-decoration:none;font:700 14px/1 var(--font-head);transition:background .2s var(--ease),color .2s var(--ease)}
.backlink svg{transition:transform .2s var(--ease)}
.backlink:hover{background:var(--fg);color:var(--bg)}
.backlink:hover svg{transform:translateX(-4px)}
.crumbs{font-size:14px;color:var(--muted);align-items:center}
.crumbs a{color:var(--muted);text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:4px}
.crumbs a:hover{color:var(--fg);text-decoration-color:var(--fg)}
.crumbs [aria-current]{color:var(--fg)}
.casebar{position:fixed;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + var(--hdr-h,74px));z-index:28;display:flex;justify-content:center;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));pointer-events:none;opacity:0;transform:translateY(-8px);transition:opacity .25s var(--ease),transform .25s var(--ease)}
.casebar.on{opacity:1;transform:none}
.casebar-in{display:flex;align-items:center;gap:6px;max-width:100%;padding:4px;border-radius:999px;background:rgba(14,14,14,.82);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);pointer-events:none}
.casebar.on .casebar-in{pointer-events:auto}
.casebar a{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 14px;border-radius:999px;color:#fff;text-decoration:none;font:700 13px/1 var(--font-head);white-space:nowrap}
.casebar a:hover{background:#fff;color:#000}
.casebar .cb-back{padding-left:10px;color:rgba(255,255,255,.75)}
.casebar .cb-cta{background:#fff;color:#000}
.casebar .cb-name{font:700 13px/1 var(--font-head);padding:0 10px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:32ch;border-left:1px solid rgba(255,255,255,.14);border-right:1px solid rgba(255,255,255,.14);line-height:34px}
.casebar .cb-acts{display:flex;gap:4px}
@media (max-width:670px){.casebar{top:calc(env(safe-area-inset-top,0px) + 64px)}.casebar .cb-name{display:none}.casebar a{padding:0 12px}}
@media (prefers-reduced-motion:reduce){.casebar{transition:none}}
.casenav{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding-block:0 clamp(48px,6vw,96px)}
.casenav a{display:flex;flex-direction:column;gap:8px;padding:24px 0 0;border-top:1px solid var(--line-strong);color:var(--fg);text-decoration:none;min-width:0}
.casenav .next{text-align:right;align-items:flex-end}
.casenav .next:only-child{grid-column:2}
.casenav .lab{display:inline-flex;align-items:center;gap:10px;font:400 12px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.casenav strong{font:700 clamp(22px,2.6vw,34px)/1.05 var(--font-head);letter-spacing:-.015em}
.casenav .meta{color:var(--muted);font-size:15px}
.casenav svg{transition:transform .2s var(--ease)}
.casenav .prev:hover svg{transform:translateX(-4px)}.casenav .next:hover svg{transform:translateX(4px)}
.casenav a:hover strong{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
@media (max-width:640px){.casenav{grid-template-columns:1fr}.casenav .next{text-align:left;align-items:flex-start}.casenav .next:only-child{grid-column:auto}}
.weiter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:16px;margin-top:40px}
.wcard{display:flex;flex-direction:column;gap:8px;padding:20px 0 0;border-top:1px solid var(--line-strong);color:var(--fg);text-decoration:none;min-width:0}
.wcard strong{display:flex;align-items:center;justify-content:space-between;gap:12px;font:700 22px/1.15 var(--font-head);letter-spacing:-.012em}
.wcard span{color:var(--muted);font-size:15px}
.wcard svg{flex:none;transition:transform .2s var(--ease)}
.wcard:hover svg{transform:translateX(4px)}
.wcard:hover strong{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
/* Variante C: Hover der Leistungsübersicht wie die Stellenliste der Karriere-Seite (leicht graue Fläche, chromatische Linie unten) */
html.vc .lg-group li a{padding-inline:8px;margin-inline:-8px;background-image:var(--chB);background-size:0% 1.5px;background-position:0 100%;background-repeat:no-repeat;transition:background-color 250ms var(--ease),background-size 1.2s cubic-bezier(.21,.4,.48,1)}
html.vc .lg-group li a:hover{background-color:rgba(255,255,255,.025);background-size:200% 1.5px;animation:zrmLinkFlow 8s linear 1.2s infinite}
@media (prefers-reduced-motion:reduce){html.vc .lg-group li a:hover{animation:none}}
/* Buttons: Hover-Licht bleibt in der Pille (nicht über die Kontur hinaus) */
.btn{overflow:hidden}
.btn::before{inset:0}
html.cx .btn::before{inset:0;box-shadow:none}
/* Navi-Variante C (Umschalter "Navi"): nur Text, aktiv mit chromatischer Linie, Kontakt als Rechteck. Nur Desktop/Tablet, die Handy-Leiste bleibt */
@media (min-width:671px){
html.navc .site nav{gap:28px}
html.navc .site nav a,html.navc .site nav .nav-m summary{background:none;backdrop-filter:none;-webkit-backdrop-filter:none;border-radius:0;padding:10px 0;color:rgba(255,255,255,.62);position:relative}
html.navc .site nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--chA);background-size:100% 100%;transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.21,.4,.48,1)}
html.navc .site nav a:hover,html.navc .site nav .nav-m summary:hover{color:#fff;background:none}
html.navc .site nav a:hover::after{transform:scaleX(.35)}
html.navc .site nav a[aria-current]{color:#fff;background:none}
html.navc .site nav a[aria-current]::after{transform:scaleX(1)}
html.navc .site nav .nav-m[open] summary{color:#fff;background:none}
html.navc .site nav a.nav-k{padding:10px 16px;border-radius:0;color:#fff;background:rgba(18,18,18,.4);box-shadow:inset 0 0 0 1px rgba(255,255,255,.5);margin-left:12px}
html.navc .site nav a.nav-k::after{display:none}
html.navc .site nav a.nav-k:hover{color:#000;background:#fff;box-shadow:none}
html.navc .site nav a:focus-visible{outline-offset:4px}
}
.zrm-variant .lbl{align-self:center;padding:0 4px 0 2px;color:rgba(255,255,255,.45);font-weight:400}
/* Hauptseiten aus der Hauptnavigation: keine Brotkrumen-Zeile */
nav.crumbs[data-mainpage]{display:none}
/* Loop mit Reel-Knopf über einer Galerie */
.g-reel{margin:0 0 24px;border-radius:12px;overflow:hidden}
main .sec.sec-tight,html.vc main .sec.sec-tight{padding-top:0}
.g-cap{margin:-4px 0 40px}
.g-reel video{width:100%;height:auto;display:block;background:#000}
/* Entwicklungs-Umschalter A/C (nur für die Entwicklungsphase, vor dem Launch entfernen) */
/* Cursor-Chip auf den Projektkacheln (nach digital.zeitraum.com) */
.zrm-chip{position:fixed;left:0;top:0;z-index:65;pointer-events:none;padding:8px 14px;border-radius:999px;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font:400 13px/1.4 var(--font-text,Arial,sans-serif);white-space:nowrap;opacity:0;scale:.85;transition:opacity .25s cubic-bezier(0,0,.2,1),scale .35s cubic-bezier(.16,1,.3,1)}
.zrm-chip.on{opacity:1;scale:1}
@media (hover:none),(pointer:coarse){.zrm-chip{display:none}}
html:not(.swon) .zrm-variant{display:none}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}.skip{position:fixed;left:16px;top:-80px;z-index:10000;padding:10px 18px;border-radius:999px;background:var(--fg);color:var(--bg);font-weight:700;text-decoration:none;transition:top .2s}.skip:focus{top:max(16px,env(safe-area-inset-top,0px))}main:focus{outline:none}.zrm-form{margin-top:clamp(40px,5vw,72px);display:grid;gap:36px;max-width:960px}.f-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 40px}.f-field{display:grid;gap:8px;min-width:0}.f-field>span,.f-chips legend{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}.f-field input,.f-field textarea{font:inherit;font-size:17px;color:var(--fg);background:transparent;border:0;border-bottom:1px solid var(--line-strong,rgba(255,255,255,.3));border-radius:0;padding:10px 0;width:100%;transition:border-color .2s}.f-field textarea{resize:vertical;min-height:140px;line-height:1.55}.f-field input:focus,.f-field textarea:focus{outline:none;border-bottom-color:var(--fg)}.f-field textarea::placeholder{color:var(--faint)}.f-chips{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:10px}.f-chips legend{margin-bottom:14px;padding:0}.f-chip{position:relative;cursor:pointer}.f-chip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}.f-chip span{display:inline-block;padding:9px 16px;border:1px solid var(--line-strong,rgba(255,255,255,.3));border-radius:999px;font-size:15px;transition:background .2s,color .2s,border-color .2s}.f-chip input:checked+span{background:var(--fg);color:var(--bg);border-color:var(--fg)}.f-chip input:focus-visible+span{outline:2px solid var(--fg);outline-offset:2px}
/* 04.11.2026 Konzept A2/A3: Kundenband unter dem Hero, Award-Plakette im Hero */
.clientband{padding-top:8px;padding-bottom:8px}
.clientband p{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin:0;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:15px;color:var(--muted)}
.clientband .mono{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-right:6px}
.clientband a{color:var(--fg);text-decoration:none}.clientband a:hover{text-decoration:underline;text-underline-offset:4px}
.clientband span[aria-hidden]{color:var(--faint)}
.hero-award{position:fixed;left:0;top:96px;z-index:30;display:flex;flex-direction:column;gap:6px;padding:7px 11px 7px 9px;background:rgba(12,12,12,.55);border:1px solid var(--line,rgba(255,255,255,.14));border-left:0;border-radius:0;color:var(--muted);text-decoration:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:.85;transition:opacity .35s,transform .35s,color .2s}
.hero-award:hover{opacity:1;color:var(--fg)}
.hero-award.off{opacity:0;transform:translateX(-100%);pointer-events:none}
.hero-award .ha-row{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:400;line-height:1.25;max-width:170px}
.hero-award img{width:30px;height:30px;flex:none;object-fit:contain;background:#efefef}
@media (max-width:700px){.hero-award{top:68px;flex-direction:row;padding:3px 4px 3px 3px;gap:3px}.hero-award img{width:22px;height:22px}.hero-award .ha-row span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}
@media (max-width:700px){.clientband .mono{display:none}}.f-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}.f-note{font-size:14px;color:var(--muted);max-width:62ch;margin:0}.f-note a{color:var(--fg);text-decoration:underline;text-underline-offset:3px}.f-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}.f-status{font-size:15px;color:var(--muted)}@media (max-width:700px){.f-grid{grid-template-columns:minmax(0,1fr)}}.zr{letter-spacing:.04em;margin-right:-.04em;white-space:nowrap;font-kerning:normal}.eyebrow .zr,.mono .zr,.mk-gl-big .zr{letter-spacing:inherit;margin-right:0}.cap-link{color:var(--fg);text-decoration:underline;text-underline-offset:3px;white-space:nowrap}.cap-link::before{content:'· ';color:var(--faint)}.zrm-video.zrm-crop:not(:fullscreen) video{object-fit:cover}
.zrm-variant{position:fixed;z-index:70;right:max(12px,env(safe-area-inset-right,0px));bottom:calc(12px + env(safe-area-inset-bottom,0px));display:flex;gap:2px;padding:3px;border-radius:999px;background:rgba(10,10,11,.7);border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font:700 11px/1 var(--font-head,Arial,sans-serif)}
.zrm-variant button{appearance:none;border:0;background:transparent;color:rgba(255,255,255,.6);border-radius:999px;min-width:26px;height:22px;padding:0 7px;cursor:pointer;font:inherit}
.zrm-variant .sep{width:1px;background:rgba(255,255,255,.18);margin:3px 4px}
.zrm-variant button[aria-pressed="true"]{background:#fff;color:#000}
@media (max-width:670px){.zrm-variant{bottom:calc(84px + env(safe-area-inset-bottom,0px))}}
@media (prefers-reduced-motion:reduce){.eyebrow::before,.page-hero .eyebrow::before{animation:none;transition:none;transform:none}#zrm-grain{animation:none}.btn:hover::before,.logos div:hover::before{animation:none}*:hover{animation-name:none}.pillar-nav a:hover .thumb,.related a:hover .thumb{animation:none}}

/* Glow-Entwurf "Caustic" (Umschalter, html.cx): gebrochenes Licht, weich gezogen und nah am Kino-Glow. Texturen: assets/media/fx/ */
html.cx{--cx:url(../media/fx/caustic-a.webp);--cx2:url(../media/fx/caustic-b.webp)}
/* Buttons: weiches, gebrochenes Licht im und um den Button, Blau/Rot-Lichtkante wie bei Kino */
html.cx .btn::before{inset:-3px -4px;border-radius:999px;background:var(--cx) 30% 40%/220% auto no-repeat;filter:blur(7px) saturate(2.3) brightness(.85);opacity:0;transition:opacity 700ms cubic-bezier(.25,.1,.25,1);
 box-shadow:-10px 0 28px -12px rgba(var(--g1),.42),10px 0 28px -12px rgba(var(--g4),.38)}
html.cx .btn:hover::before,html.cx .btn:focus-visible::before{opacity:.85;animation:zrmCxBtn 7s ease-in-out infinite alternate}
@keyframes zrmCxBtn{from{background-position:22% 30%}to{background-position:78% 72%}}
/* Bilder: das Licht liegt hinter dem Bild und tritt weich an den Rändern aus (Position setzt der Umschalter-Script) */
html.cx :is(.pillar-nav a,.related a,.case-grid:not(.zz) .case-card,.vb-card,.gallery figure,.mosaic figure){position:relative;isolation:isolate}
html.cx :is(.pillar-nav a,.related a,.case-grid:not(.zz) .case-card,.vb-card,.gallery figure,.mosaic figure)::before{content:"";position:absolute;left:var(--cxl,0);top:var(--cxt,0);width:var(--cxw,100%);height:var(--cxh,100%);z-index:-1;pointer-events:none;border-radius:14px;background:var(--cx) 40% 40%/cover no-repeat;filter:blur(22px) saturate(2.5);transform:scale(1.05);opacity:0;-webkit-mask:linear-gradient(to right,transparent,rgba(0,0,0,.45) 2.5%,#000 5%,#000 95%,rgba(0,0,0,.45) 97.5%,transparent),linear-gradient(to bottom,transparent,rgba(0,0,0,.45) 2.5%,#000 5%,#000 95%,rgba(0,0,0,.45) 97.5%,transparent);-webkit-mask-composite:source-in;mask:linear-gradient(to right,transparent,rgba(0,0,0,.45) 2.5%,#000 5%,#000 95%,rgba(0,0,0,.45) 97.5%,transparent),linear-gradient(to bottom,transparent,rgba(0,0,0,.45) 2.5%,#000 5%,#000 95%,rgba(0,0,0,.45) 97.5%,transparent);mask-composite:intersect;transition:opacity 1.4s cubic-bezier(.25,.1,.25,1),transform 1.4s cubic-bezier(.21,.4,.48,1)}
html.cx :is(.pillar-nav a,.related a,.case-grid:not(.zz) .case-card,.vb-card,.gallery figure,.mosaic figure):hover::before{opacity:1;transform:scale(1.1);animation:zrmCxImg 10s ease-in-out infinite alternate}
@keyframes zrmCxImg{from{background-position:30% 30%}to{background-position:70% 70%}}
/* Kino-Schein bleibt leise darunter: Blau links, Rot rechts */
html.cx :is(.pillar-nav a:hover .thumb,.related a:hover .thumb,.case-grid:not(.zz) .case-card:hover .thumb,.vb-card:hover .thumb,.gallery figure:hover img,.mosaic figure:hover img,.mosaic figure:hover video){box-shadow:-16px 0 44px -20px rgba(var(--g1),.4),16px 0 44px -20px rgba(var(--g4),.36);animation:none}
/* Kunden-Logos */
html.cx .logos div::before{background:var(--cx2) 50% 50%/170% auto no-repeat;filter:blur(14px) saturate(2.3) brightness(.9);opacity:0}
html.cx .logos div:hover::before{opacity:.6;animation:zrmCxImg 10s ease-in-out infinite alternate}
/* Seitenende: gebrochenes Licht als Nebel */
html.cx footer.group::before{background:var(--cx) 50% 85%/min(1400px,140%) auto no-repeat;filter:blur(40px) saturate(2.4);opacity:.42;-webkit-mask:linear-gradient(to top,#000 20%,transparent);mask:linear-gradient(to top,#000 20%,transparent)}
@media (prefers-reduced-motion:reduce){html.cx .btn::before,html.cx :is(.pillar-nav a,.related a,.case-card,.vb-card,.gallery figure,.mosaic figure)::before,html.cx .logos div::before{animation:none!important}}
.bento{display:flex;flex-direction:column;gap:16px;margin-top:48px}
.bgroup{margin:28px 0 -4px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);display:flex;align-items:center;gap:12px}
.bgroup::after{content:"";flex:1;height:1px;background:var(--line)}
.bento>.bgroup:first-child{margin-top:0}
.brow{display:grid;gap:16px}
.brow figure{margin:0;min-width:0;min-height:0;position:relative}
.bento .g-open{position:absolute;inset:0;height:auto}
.bento .g-open img{width:100%;height:100%;object-fit:cover}
.brow figcaption{position:absolute;left:12px;bottom:12px;max-width:calc(100% - 24px);font-size:12px;line-height:1.3;color:#fff;background:rgba(0,0,0,.55);padding:6px 10px;border-radius:999px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity 250ms var(--ease),transform 250ms var(--ease)}
.brow figure:hover figcaption,.brow figure:focus-within figcaption{opacity:1;transform:none}
@media (hover:none){.brow figcaption{opacity:1;transform:none}}
.brow-hero{aspect-ratio:21/9}
.brow-big-left{grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;aspect-ratio:2/1}
.brow-big-left figure:first-child{grid-row:1/3}
.brow-big-right{grid-template-columns:1fr 2fr;grid-template-rows:1fr 1fr;aspect-ratio:2/1}
.brow-big-right figure:nth-child(1){grid-column:1;grid-row:1}.brow-big-right figure:nth-child(2){grid-column:1;grid-row:2}.brow-big-right figure:nth-child(3){grid-column:2;grid-row:1/3}
.brow-quad{grid-template-columns:repeat(4,1fr);aspect-ratio:3.2/1}
.brow-wn{grid-template-columns:2fr 1fr;aspect-ratio:2.4/1}
.brow-nw{grid-template-columns:1fr 2fr;aspect-ratio:2.4/1}
.brow-duo{grid-template-columns:1fr 1fr;aspect-ratio:3.4/1}
.brow-trio{grid-template-columns:repeat(3,1fr);aspect-ratio:3/1}
.brow-trio-w{grid-template-columns:repeat(3,1fr);aspect-ratio:4.8/1}
@media (max-width:700px){.bento,.brow{gap:10px}.brow{grid-template-columns:1fr 1fr!important;grid-template-rows:auto!important;aspect-ratio:auto!important}.brow figure{grid-column:auto!important;grid-row:auto!important;aspect-ratio:1/1}.brow-quad figure{aspect-ratio:4/5}.brow-hero figure,.brow-big-left figure:first-child,.brow-big-right figure:nth-child(3),.brow-trio figure:first-child,.brow-trio-w figure:first-child,.brow-duo figure,.brow-wn figure:first-child,.brow-nw figure:last-child{grid-column:1/-1!important;aspect-ratio:16/10}.brow-big-right figure:nth-child(3){order:-1}.brow-nw figure:last-child{order:-1}}
.g-lens{position:fixed;left:0;top:0;z-index:60;width:200px;height:200px;border-radius:50%;pointer-events:none;background-repeat:no-repeat;background-color:#000;box-shadow:0 0 0 1px rgba(255,255,255,.55);opacity:0;transition:opacity 200ms cubic-bezier(.21,.4,.48,1)}
.g-lens.on{opacity:1}
.mosaic.just.gal .g-open[data-zoom]{cursor:crosshair}
.mosaic.just.gal .g-open[data-zoom]:hover img{transform:none}
.pillar-nav[data-n="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:1100px){.pillar-nav[data-n="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}}
.pillar-nav[data-n="3"]{grid-template-columns:1fr}
@media (min-width:800px){.pillar-nav[data-n="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.pillar-nav[data-n="4"]{grid-template-columns:1fr}}
.btn.btn-lg{font-size:18px;padding:18px 32px}

/* Chroma-Linie (Eyebrow, Links, Nav): SDR als Verlauf, auf HDR-Displays als HLG-Bild mit hellerem Weiss (25.10.) */
:root{--chA:linear-gradient(90deg,#3a5bff 0%,#2ad8ff 14%,#fff 34%,#fff 66%,#ffd84a 86%,#ff2a2a 100%);--chB:linear-gradient(90deg,#3a5bff,#2ad8ff,#fff,#ffd84a,#ff2a2a,#3a5bff)}html.hdrok{--chA:url(../media/fx/chroma-a-hdr.avif);--chB:url(../media/fx/chroma-b-hdr.avif)}
/* HDR-Logo */
html.hdrok .site .brand{position:relative}html.hdrok .site .brand svg.lm{color:transparent}html.hdrok .site .brand::before{content:"";position:absolute;left:0;top:50%;height:15px;width:161.34px;transform:translateY(-50%);pointer-events:none;background:url(../media/fx/hdr-white-max.avif) 0 0/100% 100%;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%221.156%2069.176%20173.547%2016.135%22%20fill%3D%22%23000%22%3E%3Cpath%20d%3D%22M1.156%2084.798L6.654%2076.496L1.777%2076.496L1.777%2074.400L10.591%2074.400L10.591%2074.678L5.071%2083.001L10.313%2083.001L10.313%2085.076L1.156%2085.076L1.156%2084.798%22%2F%3E%3Cpath%20d%3D%22M18.080%2083.129C19.492%2083.129%2020.498%2082.572%2021.118%2081.994L22.616%2083.556C21.610%2084.562%2020.241%2085.290%2018.101%2085.290C14.464%2085.290%2012.089%2082.936%2012.089%2079.727C12.089%2076.560%2014.571%2074.164%2017.780%2074.164C21.418%2074.164%2023.472%2076.860%2023.301%2080.583L14.700%2080.583C15.021%2082.144%2016.133%2083.129%2018.080%2083.129M20.669%2078.614C20.390%2077.266%2019.514%2076.303%2017.802%2076.303C16.240%2076.303%2015.128%2077.159%2014.742%2078.614L20.669%2078.614%22%2F%3E%3Cpath%20d%3D%22M26.085%2074.400L28.674%2074.400L28.674%2085.077L26.085%2085.077ZM26.106%2069.177L28.673%2069.177L28.673%2072.258L26.106%2072.258Z%22%2F%3E%3Cpath%20d%3D%22M33.060%2076.560L31.456%2076.560L31.456%2074.399L33.060%2074.399L33.060%2069.176L35.627%2069.176L35.627%2074.399L38.131%2074.399L38.131%2076.560L35.627%2076.560L35.627%2085.075L33.060%2085.075L33.060%2076.560%22%2F%3E%3Cpath%20d%3D%22M52.745%2076.582L49.151%2076.582L49.151%2085.076L46.583%2085.076L46.583%2074.421L52.745%2074.421L52.745%2076.582%22%2F%3E%3Cpath%20d%3D%22M54.030%2079.727C54.030%2076.517%2056.170%2074.186%2058.972%2074.186C60.769%2074.186%2061.968%2075.041%2062.631%2076.154L62.589%2074.399L65.156%2074.399L65.156%2085.076L62.589%2085.076L62.631%2083.322C62.010%2084.370%2060.727%2085.311%2058.930%2085.311C56.212%2085.311%2054.030%2082.958%2054.030%2079.727M62.652%2079.748C62.652%2077.823%2061.497%2076.475%2059.636%2076.475C57.796%2076.475%2056.704%2077.802%2056.704%2079.727C56.704%2081.695%2057.796%2083.043%2059.636%2083.043C61.497%2083.043%2062.652%2081.695%2062.652%2079.748%22%2F%3E%3Cpath%20d%3D%22M68.045%2080.775L68.045%2074.399L70.612%2074.399L70.612%2080.562C70.612%2082.080%2071.318%2082.979%2072.816%2082.979C74.485%2082.979%2075.534%2081.931%2075.534%2080.197L75.534%2074.399L78.101%2074.399L78.101%2085.075L75.534%2085.075L75.597%2083.342C74.935%2084.498%2073.629%2085.311%2072.003%2085.311C69.671%2085.311%2068.045%2083.663%2068.045%2080.775%22%2F%3E%3Cpath%20d%3D%22M81.312%2074.399L83.858%2074.399L83.816%2076.025C84.521%2074.891%2085.612%2074.186%2086.982%2074.186C88.543%2074.186%2089.549%2074.913%2090.105%2076.004C90.961%2074.934%2092.223%2074.186%2093.764%2074.186C96.289%2074.186%2097.787%2075.854%2097.787%2078.572L97.787%2085.076L95.219%2085.076L95.219%2078.828C95.219%2077.352%2094.684%2076.539%2093.208%2076.539C91.710%2076.539%2090.833%2077.458%2090.833%2079.234L90.833%2085.076L88.265%2085.076L88.265%2078.828C88.265%2077.352%2087.752%2076.539%2086.276%2076.539C84.757%2076.539%2083.858%2077.458%2083.858%2079.234L83.858%2085.076L81.312%2085.076L81.312%2074.399%22%2F%3E%3Cpath%20d%3D%22M109.222%2085.275Q107.649%2085.275%20106.464%2084.655Q105.279%2084.035%20104.548%2082.994L106.143%2081.177Q106.652%2081.953%20107.483%2082.374Q108.314%2082.794%20109.244%2082.794Q109.886%2082.794%20110.307%2082.595Q110.728%2082.396%20110.728%2081.997Q110.728%2081.620%20110.374%2081.432Q110.019%2081.244%20109.554%2081.122Q109.089%2081.000%20108.889%2080.934Q107.627%2080.557%20106.885%2080.236Q106.143%2079.915%20105.600%2079.272Q105.057%2078.630%20105.057%2077.567Q105.057%2076.459%20105.655%2075.706Q106.253%2074.953%20107.195%2074.576Q108.136%2074.200%20109.177%2074.200Q110.285%2074.200%20111.382%2074.587Q112.478%2074.975%20113.342%2075.639L111.703%2077.478Q110.684%2076.681%20109.288%2076.681Q107.959%2076.681%20107.959%2077.323Q107.959%2077.655%20108.347%2077.888Q108.734%2078.120%20109.643%2078.386Q109.842%2078.431%20111.027%2078.763Q112.212%2079.095%20112.932%2079.870Q113.652%2080.646%20113.652%2081.798Q113.652%2083.392%20112.412%2084.334Q111.171%2085.275%20109.222%2085.275Z%22%2F%3E%3Cpath%20d%3D%22M115.911%2076.814H114.361V74.399H115.911V70.655H118.769V74.399H121.184V76.814H118.769V85.076H115.911Z%22%2F%3E%3Cpath%20d%3D%22M122.490%2080.734V74.399H125.348V80.535Q125.348%2081.643%20125.824%2082.185Q126.301%2082.728%20127.319%2082.728Q128.471%2082.728%20129.125%2082.052Q129.778%2081.377%20129.778%2080.181V74.399H132.636V85.076H129.823V83.836Q129.269%2084.522%20128.405%2084.910Q127.541%2085.298%20126.522%2085.298Q124.706%2085.298%20123.598%2084.079Q122.490%2082.861%20122.490%2080.734Z%22%2F%3E%3Cpath%20d%3D%22M134.009%2079.671Q134.009%2078.076%20134.674%2076.814Q135.338%2075.551%20136.490%2074.831Q137.642%2074.111%20139.015%2074.111Q140.057%2074.111%20140.943%2074.510Q141.829%2074.908%20142.493%2075.573L142.515%2069.481H145.351L145.329%2085.076H142.538V83.880Q141.962%2084.500%20141.076%2084.888Q140.189%2085.275%20139.148%2085.275Q137.709%2085.275%20136.534%2084.544Q135.360%2083.813%20134.685%2082.540Q134.009%2081.266%20134.009%2079.671ZM139.746%2082.750Q141.053%2082.750%20141.829%2081.930Q142.604%2081.111%20142.604%2079.715Q142.604%2078.298%20141.829%2077.478Q141.053%2076.658%20139.746%2076.658Q138.440%2076.658%20137.686%2077.478Q136.933%2078.298%20136.933%2079.715Q136.933%2081.111%20137.686%2081.930Q138.440%2082.750%20139.746%2082.750Z%22%2F%3E%3Cpath%20d%3D%22M147.211%2074.399H150.069V85.076H147.211ZM147.234%2069.481H150.069V72.782H147.234Z%22%2F%3E%3Cpath%20d%3D%22M151.730%2079.715Q151.730%2078.165%20152.506%2076.902Q153.281%2075.639%20154.610%2074.908Q155.939%2074.177%20157.556%2074.177Q159.173%2074.177%20160.491%2074.908Q161.809%2075.639%20162.574%2076.902Q163.338%2078.165%20163.338%2079.715Q163.338%2081.266%20162.585%2082.540Q161.831%2083.813%20160.502%2084.544Q159.173%2085.275%20157.556%2085.275Q155.939%2085.275%20154.599%2084.544Q153.259%2083.813%20152.495%2082.540Q151.730%2081.266%20151.730%2079.715ZM157.556%2082.817Q158.841%2082.817%20159.616%2081.975Q160.392%2081.133%20160.392%2079.715Q160.392%2078.298%20159.627%2077.478Q158.863%2076.658%20157.556%2076.658Q156.249%2076.658%20155.452%2077.489Q154.654%2078.320%20154.654%2079.715Q154.654%2081.111%20155.452%2081.964Q156.249%2082.817%20157.556%2082.817Z%22%2F%3E%3Cpath%20d%3D%22M169.119%2085.275Q167.547%2085.275%20166.361%2084.655Q165.176%2084.035%20164.445%2082.994L166.040%2081.177Q166.550%2081.953%20167.380%2082.374Q168.211%2082.794%20169.141%2082.794Q169.784%2082.794%20170.205%2082.595Q170.626%2082.396%20170.626%2081.997Q170.626%2081.620%20170.271%2081.432Q169.917%2081.244%20169.452%2081.122Q168.986%2081.000%20168.787%2080.934Q167.524%2080.557%20166.782%2080.236Q166.040%2079.915%20165.498%2079.272Q164.955%2078.630%20164.955%2077.567Q164.955%2076.459%20165.553%2075.706Q166.151%2074.953%20167.092%2074.576Q168.034%2074.200%20169.075%2074.200Q170.183%2074.200%20171.279%2074.587Q172.376%2074.975%20173.239%2075.639L171.600%2077.478Q170.581%2076.681%20169.186%2076.681Q167.857%2076.681%20167.857%2077.323Q167.857%2077.655%20168.244%2077.888Q168.632%2078.120%20169.540%2078.386Q169.740%2078.431%20170.925%2078.763Q172.110%2079.095%20172.830%2079.870Q173.550%2080.646%20173.550%2081.798Q173.550%2083.392%20172.309%2084.334Q171.069%2085.275%20169.119%2085.275Z%22%2F%3E%3C%2Fsvg%3E") 0 0/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%221.156%2069.176%20173.547%2016.135%22%20fill%3D%22%23000%22%3E%3Cpath%20d%3D%22M1.156%2084.798L6.654%2076.496L1.777%2076.496L1.777%2074.400L10.591%2074.400L10.591%2074.678L5.071%2083.001L10.313%2083.001L10.313%2085.076L1.156%2085.076L1.156%2084.798%22%2F%3E%3Cpath%20d%3D%22M18.080%2083.129C19.492%2083.129%2020.498%2082.572%2021.118%2081.994L22.616%2083.556C21.610%2084.562%2020.241%2085.290%2018.101%2085.290C14.464%2085.290%2012.089%2082.936%2012.089%2079.727C12.089%2076.560%2014.571%2074.164%2017.780%2074.164C21.418%2074.164%2023.472%2076.860%2023.301%2080.583L14.700%2080.583C15.021%2082.144%2016.133%2083.129%2018.080%2083.129M20.669%2078.614C20.390%2077.266%2019.514%2076.303%2017.802%2076.303C16.240%2076.303%2015.128%2077.159%2014.742%2078.614L20.669%2078.614%22%2F%3E%3Cpath%20d%3D%22M26.085%2074.400L28.674%2074.400L28.674%2085.077L26.085%2085.077ZM26.106%2069.177L28.673%2069.177L28.673%2072.258L26.106%2072.258Z%22%2F%3E%3Cpath%20d%3D%22M33.060%2076.560L31.456%2076.560L31.456%2074.399L33.060%2074.399L33.060%2069.176L35.627%2069.176L35.627%2074.399L38.131%2074.399L38.131%2076.560L35.627%2076.560L35.627%2085.075L33.060%2085.075L33.060%2076.560%22%2F%3E%3Cpath%20d%3D%22M52.745%2076.582L49.151%2076.582L49.151%2085.076L46.583%2085.076L46.583%2074.421L52.745%2074.421L52.745%2076.582%22%2F%3E%3Cpath%20d%3D%22M54.030%2079.727C54.030%2076.517%2056.170%2074.186%2058.972%2074.186C60.769%2074.186%2061.968%2075.041%2062.631%2076.154L62.589%2074.399L65.156%2074.399L65.156%2085.076L62.589%2085.076L62.631%2083.322C62.010%2084.370%2060.727%2085.311%2058.930%2085.311C56.212%2085.311%2054.030%2082.958%2054.030%2079.727M62.652%2079.748C62.652%2077.823%2061.497%2076.475%2059.636%2076.475C57.796%2076.475%2056.704%2077.802%2056.704%2079.727C56.704%2081.695%2057.796%2083.043%2059.636%2083.043C61.497%2083.043%2062.652%2081.695%2062.652%2079.748%22%2F%3E%3Cpath%20d%3D%22M68.045%2080.775L68.045%2074.399L70.612%2074.399L70.612%2080.562C70.612%2082.080%2071.318%2082.979%2072.816%2082.979C74.485%2082.979%2075.534%2081.931%2075.534%2080.197L75.534%2074.399L78.101%2074.399L78.101%2085.075L75.534%2085.075L75.597%2083.342C74.935%2084.498%2073.629%2085.311%2072.003%2085.311C69.671%2085.311%2068.045%2083.663%2068.045%2080.775%22%2F%3E%3Cpath%20d%3D%22M81.312%2074.399L83.858%2074.399L83.816%2076.025C84.521%2074.891%2085.612%2074.186%2086.982%2074.186C88.543%2074.186%2089.549%2074.913%2090.105%2076.004C90.961%2074.934%2092.223%2074.186%2093.764%2074.186C96.289%2074.186%2097.787%2075.854%2097.787%2078.572L97.787%2085.076L95.219%2085.076L95.219%2078.828C95.219%2077.352%2094.684%2076.539%2093.208%2076.539C91.710%2076.539%2090.833%2077.458%2090.833%2079.234L90.833%2085.076L88.265%2085.076L88.265%2078.828C88.265%2077.352%2087.752%2076.539%2086.276%2076.539C84.757%2076.539%2083.858%2077.458%2083.858%2079.234L83.858%2085.076L81.312%2085.076L81.312%2074.399%22%2F%3E%3Cpath%20d%3D%22M109.222%2085.275Q107.649%2085.275%20106.464%2084.655Q105.279%2084.035%20104.548%2082.994L106.143%2081.177Q106.652%2081.953%20107.483%2082.374Q108.314%2082.794%20109.244%2082.794Q109.886%2082.794%20110.307%2082.595Q110.728%2082.396%20110.728%2081.997Q110.728%2081.620%20110.374%2081.432Q110.019%2081.244%20109.554%2081.122Q109.089%2081.000%20108.889%2080.934Q107.627%2080.557%20106.885%2080.236Q106.143%2079.915%20105.600%2079.272Q105.057%2078.630%20105.057%2077.567Q105.057%2076.459%20105.655%2075.706Q106.253%2074.953%20107.195%2074.576Q108.136%2074.200%20109.177%2074.200Q110.285%2074.200%20111.382%2074.587Q112.478%2074.975%20113.342%2075.639L111.703%2077.478Q110.684%2076.681%20109.288%2076.681Q107.959%2076.681%20107.959%2077.323Q107.959%2077.655%20108.347%2077.888Q108.734%2078.120%20109.643%2078.386Q109.842%2078.431%20111.027%2078.763Q112.212%2079.095%20112.932%2079.870Q113.652%2080.646%20113.652%2081.798Q113.652%2083.392%20112.412%2084.334Q111.171%2085.275%20109.222%2085.275Z%22%2F%3E%3Cpath%20d%3D%22M115.911%2076.814H114.361V74.399H115.911V70.655H118.769V74.399H121.184V76.814H118.769V85.076H115.911Z%22%2F%3E%3Cpath%20d%3D%22M122.490%2080.734V74.399H125.348V80.535Q125.348%2081.643%20125.824%2082.185Q126.301%2082.728%20127.319%2082.728Q128.471%2082.728%20129.125%2082.052Q129.778%2081.377%20129.778%2080.181V74.399H132.636V85.076H129.823V83.836Q129.269%2084.522%20128.405%2084.910Q127.541%2085.298%20126.522%2085.298Q124.706%2085.298%20123.598%2084.079Q122.490%2082.861%20122.490%2080.734Z%22%2F%3E%3Cpath%20d%3D%22M134.009%2079.671Q134.009%2078.076%20134.674%2076.814Q135.338%2075.551%20136.490%2074.831Q137.642%2074.111%20139.015%2074.111Q140.057%2074.111%20140.943%2074.510Q141.829%2074.908%20142.493%2075.573L142.515%2069.481H145.351L145.329%2085.076H142.538V83.880Q141.962%2084.500%20141.076%2084.888Q140.189%2085.275%20139.148%2085.275Q137.709%2085.275%20136.534%2084.544Q135.360%2083.813%20134.685%2082.540Q134.009%2081.266%20134.009%2079.671ZM139.746%2082.750Q141.053%2082.750%20141.829%2081.930Q142.604%2081.111%20142.604%2079.715Q142.604%2078.298%20141.829%2077.478Q141.053%2076.658%20139.746%2076.658Q138.440%2076.658%20137.686%2077.478Q136.933%2078.298%20136.933%2079.715Q136.933%2081.111%20137.686%2081.930Q138.440%2082.750%20139.746%2082.750Z%22%2F%3E%3Cpath%20d%3D%22M147.211%2074.399H150.069V85.076H147.211ZM147.234%2069.481H150.069V72.782H147.234Z%22%2F%3E%3Cpath%20d%3D%22M151.730%2079.715Q151.730%2078.165%20152.506%2076.902Q153.281%2075.639%20154.610%2074.908Q155.939%2074.177%20157.556%2074.177Q159.173%2074.177%20160.491%2074.908Q161.809%2075.639%20162.574%2076.902Q163.338%2078.165%20163.338%2079.715Q163.338%2081.266%20162.585%2082.540Q161.831%2083.813%20160.502%2084.544Q159.173%2085.275%20157.556%2085.275Q155.939%2085.275%20154.599%2084.544Q153.259%2083.813%20152.495%2082.540Q151.730%2081.266%20151.730%2079.715ZM157.556%2082.817Q158.841%2082.817%20159.616%2081.975Q160.392%2081.133%20160.392%2079.715Q160.392%2078.298%20159.627%2077.478Q158.863%2076.658%20157.556%2076.658Q156.249%2076.658%20155.452%2077.489Q154.654%2078.320%20154.654%2079.715Q154.654%2081.111%20155.452%2081.964Q156.249%2082.817%20157.556%2082.817Z%22%2F%3E%3Cpath%20d%3D%22M169.119%2085.275Q167.547%2085.275%20166.361%2084.655Q165.176%2084.035%20164.445%2082.994L166.040%2081.177Q166.550%2081.953%20167.380%2082.374Q168.211%2082.794%20169.141%2082.794Q169.784%2082.794%20170.205%2082.595Q170.626%2082.396%20170.626%2081.997Q170.626%2081.620%20170.271%2081.432Q169.917%2081.244%20169.452%2081.122Q168.986%2081.000%20168.787%2080.934Q167.524%2080.557%20166.782%2080.236Q166.040%2079.915%20165.498%2079.272Q164.955%2078.630%20164.955%2077.567Q164.955%2076.459%20165.553%2075.706Q166.151%2074.953%20167.092%2074.576Q168.034%2074.200%20169.075%2074.200Q170.183%2074.200%20171.279%2074.587Q172.376%2074.975%20173.239%2075.639L171.600%2077.478Q170.581%2076.681%20169.186%2076.681Q167.857%2076.681%20167.857%2077.323Q167.857%2077.655%20168.244%2077.888Q168.632%2078.120%20169.540%2078.386Q169.740%2078.431%20170.925%2078.763Q172.110%2079.095%20172.830%2079.870Q173.550%2080.646%20173.550%2081.798Q173.550%2083.392%20172.309%2084.334Q171.069%2085.275%20169.119%2085.275Z%22%2F%3E%3C%2Fsvg%3E") 0 0/100% 100% no-repeat}html.hdrok .site .brand::after{content:"";position:absolute;left:0;top:50%;height:15px;width:161.34px;transform:translateY(-50%);pointer-events:none;background:url(../media/fx/hdr-white-max.avif) 0 0/100% 100%;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%221.156%2069.176%20173.547%2016.135%22%20fill%3D%22%23000%22%3E%3Cpath%20d%3D%22M40.806%2074.400L43.373%2074.400L43.373%2077.481L40.806%2077.481ZM40.806%2081.995L43.373%2081.995L43.373%2085.076L40.806%2085.076Z%22%2F%3E%3C%2Fsvg%3E") 0 0/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%221.156%2069.176%20173.547%2016.135%22%20fill%3D%22%23000%22%3E%3Cpath%20d%3D%22M40.806%2074.400L43.373%2074.400L43.373%2077.481L40.806%2077.481ZM40.806%2081.995L43.373%2081.995L43.373%2085.076L40.806%2085.076Z%22%2F%3E%3C%2Fsvg%3E") 0 0/100% 100% no-repeat;animation:zrm-tick 1s steps(1,end) infinite;animation-delay:var(--tick-d,0s)}@media (prefers-reduced-motion:reduce){html.hdrok .site .brand::after{animation:none}}