@font-face { font-family: "Switzer"; src: url("../fonts/switzer-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Switzer"; src: url("../fonts/switzer-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Switzer"; src: url("../fonts/switzer-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Switzer"; src: url("../fonts/switzer-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

html.sub {
  --sf: "Switzer", "Helvetica Neue", Arial, sans-serif;
  --font-display: var(--sf); --font-sans: var(--sf); --font-mono: var(--sf); --font-serif: var(--sf);
  --text-hero: clamp(2.5rem, 1.3rem + 4.6vw, 5.6rem);
  --text-giant: clamp(2.6rem, 1.2rem + 5.4vw, 6.4rem);
  --text-3xl: clamp(2.2rem, 1.3rem + 3.1vw, 4.2rem);
  --text-2xl: clamp(1.9rem, 1.2rem + 2.2vw, 3.2rem);
  touch-action: manipulation; -webkit-tap-highlight-color: rgba(147,168,255,.25);
}
html.sub body, html.sub h1, html.sub h2, html.sub h3, html.sub h4 { font-variation-settings: normal; font-stretch: normal; }


html.sub main :is(h1, h2, h3) { text-transform: none; font-weight: 700; letter-spacing: -.035em; line-height: 1.02; }
html.sub main h3 { letter-spacing: -.015em; line-height: 1.2; font-weight: 600; }
html.sub main :is(h1, h2) { text-wrap: balance; }


html.sub main :is(h1, h2, h3) :is(em, i, .serif) { font-family: inherit; font-style: normal; font-weight: 400; letter-spacing: inherit; font-size: 1em; }


html.sub :is(.eyebrow, .kicker, .label, .data-row .k, .data-row .v, .field label, .site-footer h4, .site-footer .foot-h) { letter-spacing: .04em; font-weight: 500; }
html.sub .field label { text-transform: none; letter-spacing: 0; font-size: 15px; }


html.sub main :is(h1, h2, h3) *,
html.sub :is(.bento__k, .big-row__t, .case-cover__t, .case-full__title, .chap__title, .closer-glow h2, .divider__t, .flood h2,
  .flood-grid b, .glasswall h2, .hero-set__h, .method__t, .namewall__name, .quote blockquote, .serif, .stat__num, .statement,
  .step__t, .text-giant, .text-hero, .text-hero--caps, .windex__title, .wordmark__w, .wtile__t) {
  text-transform: none; font-variation-settings: normal; font-stretch: normal; }
html.sub :is(.big-row__t, .case-cover__t, .case-full__title, .chap__title, .glasswall h2, .hero-set__h, .method__t, .namewall__name,
  .statement, .text-giant, .text-hero, .text-hero--caps, .windex__title, .wordmark__w, .wtile__t, .flood h2, .closer-glow h2) {
  font-weight: 700; letter-spacing: -.035em; }
html.sub :is(.wtile__t, .big-row__t, .case-full__title, .flood h2) em { font-family: inherit; font-style: normal; font-weight: 400; letter-spacing: inherit; font-size: 1em; }
html.sub .quote blockquote { letter-spacing: -.015em; }


html.sub .svc__num { display: none; }
html.sub .svc { grid-template-columns: 1.4fr 1fr auto; border-bottom: 0; }
html.sub .svc:hover { padding-left: 0; }
@media (max-width: 860px) { html.sub .svc { grid-template-columns: 1fr auto; } }


.kontakt { background: #ececeb; color: #131315; padding: clamp(4rem, 9vw, 7rem) 0 clamp(5rem, 11vw, 8.5rem); }
.kontakt__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(2.5rem, 7vw, 7rem); align-items: start; }
html.sub .kontakt__h { font-size: var(--text-2xl); margin: 0 0 clamp(1.5rem, 3vw, 2.25rem); color: #131315; }
.kform { display: grid; gap: 1.5rem; max-width: 46rem; }
.kform__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.kform__field { display: grid; gap: .5rem; margin: 0; padding: 0; border: 0; min-width: 0; }
.kform label, .kform legend { font-size: 15px; font-weight: 500; color: #131315; padding: 0; }
.kform legend { margin-bottom: .5rem; }
.kform__opt { color: #5c5c60; font-weight: 400; }
.kform input[type="text"], .kform input[type="email"], .kform textarea {
  width: 100%; font: inherit; font-size: 17px; line-height: 1.4; color: #131315; background: #fff;
  padding: .85rem 1rem; min-height: 50px; border: 1px solid rgba(19, 19, 21, .22); border-radius: 0;
  transition: border-color .15s ease; -webkit-appearance: none; appearance: none; }
.kform textarea { min-height: 11rem; resize: vertical; }
.kform input:focus-visible, .kform textarea:focus-visible { outline: 2px solid #0f2ecb; outline-offset: 2px; border-color: #0f2ecb; }
.kform [aria-invalid="true"] { border-color: #b3261e; }
.kform__err { margin: 0; font-size: 14px; color: #b3261e; }
.kform__chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.kform__chips label { position: relative; }
.kform__chips input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.kform__chips span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 1.15rem; font-size: 16px; font-weight: 500;
  border: 1px solid rgba(19, 19, 21, .25); background: #fff; color: #131315; cursor: pointer; user-select: none;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease; }
.kform__chips input:checked + span { background: #131315; border-color: #131315; color: #fff; }
.kform__chips input:focus-visible + span { outline: 2px solid #0f2ecb; outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .kform__chips span:hover { border-color: #131315; } }
.kform__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.kform__send { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: .25rem; }
.kform__send .btn[disabled] { opacity: .6; cursor: progress; }
.kform__note { margin: 0; font-size: 14px; line-height: 1.5; color: #5c5c60; max-width: 26rem; }
.kform__note a { color: inherit; text-decoration: underline; text-underline-offset: .2em; }
.kform__status { margin: 0; padding: 1rem 1.25rem; font-size: 17px; line-height: 1.5; background: #fff; border-left: 3px solid #0f2ecb; color: #131315; }
.kform__status.is-error { border-left-color: #b3261e; }
.kform__status a { color: inherit; text-decoration: underline; text-underline-offset: .2em; }

.kontakt__direkt { padding-top: .35rem; }
.kontakt__k { margin: 0 0 .75rem; font-size: 15px; font-weight: 500; color: #5c5c60; }
.kontakt__big { display: flex; align-items: center; min-height: 44px; font-size: clamp(1.35rem, 1.05rem + 1vw, 1.9rem); font-weight: 600;
  letter-spacing: -.02em; color: #131315; text-decoration: none; overflow-wrap: anywhere; transition: color .15s ease; }
@media (hover: hover) and (pointer: fine) { .kontakt__big:hover { color: #0f2ecb; } }
.kontakt__facts { margin: 2rem 0 0; display: grid; gap: 1.1rem; }
.kontakt__facts dt { font-size: 13px; font-weight: 500; letter-spacing: .05em; text-transform: uppercase; color: #5c5c60; }
.kontakt__facts dd { margin: .2rem 0 0; font-size: 17px; line-height: 1.5; }
.kontakt__facts a { color: inherit; display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; text-underline-offset: .2em; }
@media (max-width: 860px) {
  .kontakt__grid { grid-template-columns: 1fr; }
  .kontakt__direkt { order: -1; }
}
@media (max-width: 560px) { .kform__row { grid-template-columns: 1fr; } }
.kform__note a { display: inline-block; padding-block: 13px; margin-block: -13px; }


html.sub .case-row { border-top: 0; }
html.sub .section--hairline-top { border-top: 0; }
html.sub .section--hairline-top::before { display: none; }


.story { background: #0b0b0c; color: #ececeb; padding: clamp(4.5rem, 9vw, 7.5rem) 0; }
.story__head { max-width: 46rem; margin-bottom: clamp(2rem, 4vw, 3rem); }
.story__meta { margin: 0 0 .75rem; font-size: 15px; font-weight: 500; color: #a9a9a5; }
html.sub .story h2 { font-size: var(--text-2xl); color: #fff; margin: 0 0 1rem; }
html.sub .story h2 em { color: #93a8ff; }
.story__head p:not(.story__meta) { margin: 0; font-size: 18px; line-height: 1.6; color: #c4c4c0; max-width: 60ch; }
.story__grid { columns: 3; column-gap: clamp(.5rem, 1vw, .9rem); }
.story__f { margin: 0 0 clamp(.5rem, 1vw, .9rem); break-inside: avoid; background: #151517; }
.story__f img { display: block; width: 100%; height: auto; }
@media (max-width: 760px) { .story__grid { columns: 2; } }


.film-btn { display: inline-flex; align-items: center; gap: .65rem; min-height: 46px; margin-top: 1.25rem; padding: .7rem 1.15rem;
  border: 0; background: #131315; color: #fff; font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; transition: background-color .2s ease; }
.film-btn svg { width: 10px; height: 12px; flex: none; }
.film-btn span { font-weight: 500; color: #b4b4b0; font-variant-numeric: tabular-nums; }
.film-btn:focus-visible { outline: 2px solid #0f2ecb; outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) { .film-btn:hover { background: #0f2ecb; } .film-btn:hover span { color: #dfe5ff; } }


.reels { background: #0b0b0c; color: #ececeb; padding: clamp(4.5rem, 9vw, 7.5rem) 0; }
.reels__head { max-width: 46rem; margin-bottom: clamp(2rem, 4vw, 3rem); }
html.sub .reels h2 { font-size: var(--text-2xl); color: #fff; margin: 0 0 1rem; }
html.sub .reels h2 em { color: #93a8ff; }
.reels__head p { margin: 0; font-size: 18px; line-height: 1.6; color: #c4c4c0; max-width: 60ch; }
.reels__row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.5rem, 1.2vw, 1rem); }
.reels__r { position: relative; display: block; aspect-ratio: 9 / 16; padding: 0; border: 0; overflow: hidden; background: #151517; cursor: pointer; }
.reels__r img, .reels__r video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.reels__r:focus-visible { outline: 2px solid #93a8ff; outline-offset: 3px; }
@media (max-width: 760px) {
  .reels__row { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 62%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .5rem; }
  .reels__r { scroll-snap-align: start; }
}


.lb__inner:has(video[data-stream*="/reel-"]), .lb__inner:has(video[data-stream*="/clip-"]), .lb__inner:has(video[data-stream*="/kurz/"]) { aspect-ratio: 9 / 16; width: min(92vw, calc(86vh * 9 / 16)); }

.reels__fotos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.5rem, 1.2vw, 1rem); margin-top: clamp(.5rem, 1.2vw, 1rem); }
.reels__fotos figure { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; background: #151517; }
.reels__fotos img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 760px) { .reels__fotos { grid-template-columns: 1fr 1fr; } }


.reels__row--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.kurz__f { margin: 0; }
.kurz__f figcaption { margin-top: .6rem; font-size: 15px; font-weight: 500; color: #c4c4c0; }
@media (max-width: 760px) { .reels__row--5 { grid-template-columns: none; } }
.kurz__f .reels__r { width: 100%; }


@media (min-width: 861px) {
  html.sub .work-grid { align-items: stretch; }
  html.sub .wtile--md { aspect-ratio: auto; min-height: 0; }
}


html.sub {
  --ink-1000: #0b0b0c; --ink-950: #0b0b0c; --ink-900: #121214; --ink-850: #18181b; --ink-800: #202024;
  --cream: #ececeb; --cream-dim: rgba(236,236,235,.74); --cream-mute: rgba(236,236,235,.62);
  --line: rgba(255,255,255,.14); --line-soft: rgba(255,255,255,.08);
  --copper-soft: #93a8ff; --bg: #0b0b0c; --fg: #ececeb;
  background: #0b0b0c;
}
html.sub body { background: #0b0b0c; color: #ececeb; }
html.sub main h1, html.sub main h2, html.sub main h3 { color: #fff; }
html.sub main em { color: #93a8ff; }
html.sub .link, html.sub .link .arr { color: #93a8ff; }
html.sub .meta, html.sub .label { color: rgba(236,236,235,.6); }
html.sub .media { background: #151517; border: 0; }


html.sub body section.section--cream, html.sub body section.section--light { background: #ececeb; color: #131315; }
html.sub body section.section--cream :is(h1,h2,h3,h4,b,strong,summary,figcaption,blockquote),
html.sub body section.section--light :is(h1,h2,h3,h4,b,strong,summary) { color: #131315 !important; }
html.sub body section.section--cream :is(p,li,.lead,.body-dim),
html.sub body section.section--light :is(p,li,.lead,.body-dim) { color: rgba(19,19,21,.76) !important; }
html.sub body section.section--cream em, html.sub body section.section--light em { color: #0f2ecb !important; }
html.sub body section.section--cream :is(.label,.meta), html.sub body section.section--light :is(.label,.meta) { color: rgba(19,19,21,.62) !important; }
html.sub body section.section--cream .link, html.sub body section.section--cream .link .arr { color: #0f2ecb !important; }
html.sub body section.section--cream .btn { background: #131315; color: #fff; }
html.sub body section.section--cream details, html.sub body section.section--cream summary { border-color: rgba(19,19,21,.12); }
html.sub body section.section--cream .media { background: #dcdcda; }


html.sub .page-hero.kino { min-height: min(88svh, 60rem); display: flex; align-items: flex-end;
  padding-top: calc(var(--header-h, 5rem) + 3rem); padding-bottom: clamp(3rem, 7vw, 5.5rem); }
html.sub .page-hero.kino .container { width: 100%; }
html.sub .page-hero.kino h1 { font-size: clamp(2.6rem, 1.4rem + 4.4vw, 5.6rem); line-height: 1; letter-spacing: -.04em; max-width: 14ch; color: #fff; }
html.sub .page-hero.kino h1 em { color: rgb(var(--tint-hi)); }
html.sub .page-hero.kino .lead { max-width: 44ch; font-size: clamp(1.05rem, 1rem + .3vw, 1.25rem); color: rgba(236,236,235,.86); }
html.sub .page-hero.kino .label { display: none; }
html.sub .page-hero.kino .kino-hero__bg::after { background: linear-gradient(180deg, rgba(0,0,0,.35), transparent 30%, rgba(0,0,0,.3) 50%, rgba(0,0,0,.88) 90%, #0b0b0c); }
html.sub .page-hero.kino .hero__cta .btn { background: #ececeb; color: #131315; }
html.sub .page-hero.kino .hero__cta .link, html.sub .page-hero.kino .hero__cta .link .arr { color: #fff; }
html.sub .page-hero.kino :is(.hero__chips, .hero__stats) { display: none; }


html.sub :is(.step__num, .section-num, .method__n, .step__n, .process__n) { display: none !important; }
html.sub :is(.label--row)::before, html.sub .hairline, html.sub main hr { display: none !important; }
html.sub .label--row { padding-left: 0; }


html.sub .process__steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.75rem, 3vw, 2.75rem) clamp(1.5rem, 3vw, 3rem); align-content: start; }
html.sub .step { min-height: 0 !important; padding: 0 !important; border: 0 !important; display: block; opacity: 1 !important; grid-template-columns: none; }
html.sub .step h3 { margin: 0 0 .5rem; font-size: 1.25rem; }
html.sub .step p { font-size: 17px; line-height: 1.6; color: var(--cream-dim); }
html.sub .process__aside > div { position: static; }
@media (max-width: 760px) { html.sub .process__steps { grid-template-columns: 1fr; } }


html.sub .card-grid { background: none; border: 0; gap: clamp(1.75rem, 3vw, 2.5rem) clamp(1.5rem, 3vw, 3rem); }
html.sub .card { background: none !important; padding: 0; }
html.sub .card h3 { font-size: 1.25rem; }
html.sub .card p { font-size: 17px; line-height: 1.6; }


html.sub .stats { display: none; }


html.sub .closer { background: #06091c; text-align: center; padding: clamp(5rem, 11vw, 9rem) 0; }
html.sub .closer h2 { font-size: clamp(2.4rem, 1.4rem + 3.6vw, 4.6rem); line-height: 1; letter-spacing: -.04em; color: #fff; margin: 0 auto 1.5rem; max-width: 16ch; }
html.sub .closer h2 em { color: #93a8ff; }
html.sub .closer .mail-link { display: inline-block; font-size: clamp(1.3rem, 1rem + 1.2vw, 2rem); font-weight: 600; color: #fff; text-decoration: underline; text-underline-offset: .2em; text-decoration-thickness: 1px; }
html.sub .closer__note { margin: 1.25rem auto 2rem; max-width: 44ch; color: rgba(236,236,235,.72); font-size: 17px; }
html.sub .closer .btn { background: #ececeb; color: #131315; }


html.sub .film-btn { background: #ececeb; color: #131315; }
html.sub .film-btn span { color: #5c5c60; }
@media (hover: hover) and (pointer: fine) { html.sub .film-btn:hover { background: #fff; } html.sub .film-btn:hover span { color: #5c5c60; } }
html.sub body section.section--cream .film-btn { background: #131315; color: #fff; }

html.sub body .kontakt :is(h1,h2,h3,h2 span,h2 .w span) { color: #131315 !important; }
html.sub body .kontakt h2 em { color: #0f2ecb !important; }
html.sub .gal-filter button { color: rgba(236,236,235,.82); border-color: rgba(255,255,255,.22); background: transparent; }
html.sub .gal-filter button[aria-pressed="true"] { background: #ececeb; color: #131315; border-color: #ececeb; }
html.sub .gal-count { color: rgba(236,236,235,.6); }

html.sub .page-hero.kino { flex-direction: column; justify-content: flex-end; align-items: stretch; }
html.sub .page-hero.kino > .container { width: min(100% - clamp(2.5rem, 6vw, 5rem), 92rem); margin-inline: auto; }
html.sub .page-hero.kino > .container.mt-5 { display: none; }
html.sub .page-hero.kino .kino-hero__bg::after { background: linear-gradient(90deg, rgba(0,0,0,.55), rgba(0,0,0,.15) 55%, transparent 75%), linear-gradient(180deg, rgba(0,0,0,.35), transparent 30%, rgba(0,0,0,.3) 50%, rgba(0,0,0,.88) 90%, #0b0b0c); }


.story--4 .story__grid { columns: 4; }
@media (max-width: 1024px) { .story--4 .story__grid { columns: 3; } }
@media (max-width: 760px) { .story--4 .story__grid, .story--3 .story__grid { columns: 2; } }
.story + .story { padding-top: 0; }
.story + .story.story--hell, .story--hell + .story { padding-top: clamp(4.5rem, 9vw, 7.5rem); }
html.sub .story--hell { background: #ececeb; color: #131315; }
html.sub .story--hell h2 { color: #131315; }
html.sub .story--hell h2 em { color: #0f2ecb; }
html.sub .story--hell .story__meta { color: rgba(19,19,21,.62); }
html.sub .story--hell .story__head p:not(.story__meta) { color: rgba(19,19,21,.76); }
html.sub .story--hell .story__f { background: #dcdcda; }


html.sub .story__grid, html.sub .story--4 .story__grid, html.sub .story--3 .story__grid { columns: auto; display: flex; flex-wrap: wrap; gap: clamp(.5rem, 1vw, .9rem); }
html.sub .story__f { margin: 0; flex: var(--r, 1.5) 1 calc(var(--r, 1.5) * var(--rh, 15rem)); }
html.sub .story--4 { --rh: 12rem; }
html.sub .story__grid::after { content: ""; flex: 10 1 0; }
@media (max-width: 760px) { html.sub .story__f { --rh: 8rem; } }
html.sub body section.story--hell h2 { color: #131315 !important; }
html.sub body section.story--hell h2 em { color: #0f2ecb !important; }
html.sub .story__grid.is-justified::after { display: none; }
html.sub .story__grid.is-justified .story__f img { width: 100%; height: 100%; object-fit: cover; }


html.sub .case-row--hoch .case-row__media { grid-column: 2 / 6; }
html.sub .case-row--hoch .case-row__body { grid-column: 7 / 13; align-self: center; }
html.sub .media--916 { aspect-ratio: 9 / 16; }
html.sub .media--916 img, html.sub .media--916 video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 860px) { html.sub .case-row--hoch .case-row__media { grid-column: 1 / -1; max-width: 22rem; } html.sub .case-row--hoch .case-row__body { grid-column: 1 / -1; } }

html.sub .reels__row--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 60rem; }
@media (max-width: 760px) { html.sub .reels__row--3 { grid-template-columns: none; max-width: none; } }
html.sub .story__grid--nach { margin-top: clamp(.5rem, 1vw, .9rem); }

html.sub .kino-hero__bg video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.lb__inner:has(video[data-stream*="/brenners/"]), .lb__inner:has(video[data-stream*="/niyok-kurz/"]) { aspect-ratio: 9 / 16; width: min(92vw, calc(86vh * 9 / 16)); }


.pf-filter { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 clamp(1.25rem, 2.5vw, 2rem); }
.pf-filter button { min-height: 44px; padding: 0 1.15rem; font: inherit; font-size: 16px; font-weight: 500; color: rgba(236,236,235,.82); background: transparent; border: 1px solid rgba(255,255,255,.22); cursor: pointer; transition: background-color .15s ease, color .15s ease; }
.pf-filter button[aria-pressed="true"] { background: #ececeb; color: #131315; border-color: #ececeb; }
.pf-filter button:focus-visible { outline: 2px solid #93a8ff; outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) { .pf-filter button:hover { border-color: rgba(255,255,255,.5); } }
.work-grid .wtile[hidden] { display: none; }
@media (min-width: 861px) { html.sub .work-grid.is-filtered .wtile { grid-column: span 6; aspect-ratio: 3 / 2; } }


html.sub .mehr { background: #0b0b0c; padding: clamp(4.5rem, 9vw, 7rem) 0; }
html.sub .mehr h2 { font-size: var(--text-2xl); margin: 0 0 clamp(1.5rem, 3vw, 2.25rem); color: #fff; }
.mehr__alle { margin: clamp(1.25rem, 2.5vw, 2rem) 0 0; }
@media (min-width: 861px) { html.sub .work-grid.is-filtered .wtile.is-voll { grid-column: span 12; aspect-ratio: 21 / 9; } }


html.sub .shopcase { background: #0b0b0c; padding: clamp(4.5rem, 9vw, 7.5rem) 0; }
.shopcase__head { max-width: 50rem; margin-bottom: clamp(2rem, 4vw, 3rem); }
html.sub .shopcase h2 { font-size: var(--text-2xl); color: #fff; margin: 0 0 1rem; }
html.sub .shopcase h2 em { color: rgb(255, 180, 120) !important; }
.shopcase__head p:not(.story__meta) { font-size: 18px; line-height: 1.6; color: #c4c4c0; margin: 0; max-width: 60ch; }
.shopcase__show { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(.75rem, 1.5vw, 1.25rem); padding-bottom: clamp(2rem, 5vw, 4rem); }
.shopcase__show .shop__desk { margin: 0; }
html.sub .shopcase__phone { left: auto; right: clamp(1rem, 4vw, 3rem); width: 18%; }
.shopcase__quote { max-width: 46rem; margin: clamp(1.5rem, 3vw, 2.5rem) 0 1.25rem; border-left-color: rgb(255, 180, 120); }
.shopcase .shop__links .link, .shopcase .shop__links .link .arr { color: rgb(255, 180, 120); }
@media (max-width: 760px) { .shopcase__show { grid-template-columns: 1fr; } html.sub .shopcase__phone { width: 34%; } }
.shop__fotos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(.5rem, 1vw, .9rem); margin-bottom: 1rem; }
.shop__fotos figure { margin: 0; aspect-ratio: 3 / 2; overflow: hidden; background: #151517; }
.shop__fotos img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 560px) { .shop__fotos { grid-template-columns: 1fr; } }
html.sub .shop__desk { margin: 0; border-radius: 10px; overflow: hidden; box-shadow: 0 30px 80px rgba(0,0,0,.55); outline: 1px solid rgba(255,255,255,.08); align-self: start; }
html.sub .shop__desk img { display: block; width: 100%; height: auto !important; aspect-ratio: 1600 / 1000; object-fit: cover; object-position: top; }
html.sub .shop__phone { position: absolute; bottom: 0; margin: 0; border-radius: 18px; overflow: hidden; border: 6px solid #1a1a1d; box-shadow: 0 24px 60px rgba(0,0,0,.6); }
html.sub .shop__phone img { display: block; width: 100%; height: auto !important; }
html.sub .shop__links { display: flex; flex-wrap: wrap; gap: .5rem 1.75rem; margin: 0; }
html.sub .shopcase__quote { padding-left: 1.25rem; border-left: 2px solid rgb(255, 180, 120); }
html.sub .shopcase__quote blockquote { margin: 0; font-size: clamp(1.1rem, 1rem + .5vw, 1.35rem); line-height: 1.45; font-weight: 500; color: #fff; }
html.sub .shopcase__quote figcaption { margin-top: .6rem; font-size: 15px; color: #c4c4c0; }


html.sub .geraete { position: relative; padding: 0 0 clamp(1.5rem, 4vw, 3rem) clamp(2.5rem, 7vw, 6rem); }
html.sub .laptop__screen { position: relative; aspect-ratio: 16 / 10; overflow: hidden; border: clamp(6px, .9vw, 12px) solid #1c1c1f; border-radius: 14px 14px 4px 4px; background: #fff; container-type: size; box-shadow: 0 40px 90px rgba(0,0,0,.55); }
html.sub .laptop__base { height: clamp(10px, 1.2vw, 16px); margin: 0 -6%; background: linear-gradient(#2a2a2e, #141416); border-radius: 0 0 18px 18px; }
html.sub .handy { position: absolute; left: 0; bottom: 0; width: 26%; }
html.sub .handy__screen { position: relative; aspect-ratio: 9 / 19.5; overflow: hidden; border: clamp(5px, .6vw, 8px) solid #1c1c1f; border-radius: clamp(18px, 2.4vw, 30px); background: #fff; container-type: size; box-shadow: 0 30px 70px rgba(0,0,0,.65); }
html.sub .laptop__screen img, .handy__screen img { position: absolute; left: 0; top: 0; width: 100%; height: auto; will-change: transform; }
@keyframes shop-scroll { 0%, 6% { transform: translateY(0); } 94%, 100% { transform: translateY(calc(-100% + 100cqh)); } }
@media (prefers-reduced-motion: no-preference) {
  .geraete.is-in .laptop__screen img { animation: shop-scroll 48s ease-in-out infinite alternate; }
  .geraete.is-in .handy__screen img { animation: shop-scroll 56s ease-in-out infinite alternate; }
  .geraete:hover img { animation-play-state: paused !important; }
}
html.sub .geraete--gross { padding-left: clamp(2rem, 10vw, 9rem); max-width: 68rem; }
html.sub .geraete--gross .handy { width: 22%; }
@media (max-width: 760px) { .geraete { padding-left: 2.5rem; } .handy { width: 30%; } }

html.sub .shopcase { overflow-x: clip; }
.laptop__base { margin: 0 -4%; }
html.sub .laptop__base { margin: 0 -4%; }


@media (min-width: 861px) {
  .work-grid .wtile--hoch { grid-column: span 4; aspect-ratio: auto; }
  .work-grid .wtile--breit { grid-column: span 8; aspect-ratio: 16 / 10; }
}
@media (max-width: 860px) { .work-grid .wtile--hoch { grid-column: span 12; aspect-ratio: 9 / 14; } .work-grid .wtile--breit { grid-column: span 12; aspect-ratio: 4 / 3; } }
html.sub .rail.is-passend { display: flex; flex-wrap: wrap; }
html.sub .rail.is-passend figure:nth-child(n+5) { display: block; }
@media (max-width: 860px) { html.sub .work-grid .wtile--half, html.sub .work-grid .wtile--lg { aspect-ratio: 16 / 10; } }

html.sub .rail.is-passend { display: flex; flex-wrap: wrap; gap: clamp(.5rem, 1vw, .9rem); }
html.sub .rail.is-passend figure { aspect-ratio: auto; }
html.sub .closer .mail-link::after { display: none !important; }
@media (max-width: 760px) {
  html.sub .work-grid .wtile--hoch { aspect-ratio: 4 / 5; }
  html.sub .case-row--hoch .case-row__media { max-width: 16rem; }
}

@media (max-width: 760px) { html.sub .site-footer .cols { display: grid !important; grid-template-columns: 1fr 1fr; gap: 1.75rem 1rem; } html.sub .site-footer .cols .footer-brand { grid-column: 1 / -1; } html.sub .site-footer ul li a { min-height: 40px; display: inline-flex; align-items: center; } }


html.sub .closer.closer--bild { position: relative; overflow: hidden; background: #0b0b0c; color: #ececeb; text-align: left; min-height: min(88svh, 52rem); display: flex; align-items: flex-end; padding: clamp(6rem, 14vw, 10rem) 0 clamp(3.5rem, 8vw, 6rem); }
html.sub .closer__bg { position: absolute; inset: 0; z-index: 0; }
html.sub .closer__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 30%; filter: saturate(.85); }
html.sub .closer__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11,11,12,.92) 0%, rgba(11,11,12,.7) 45%, rgba(11,11,12,.15) 80%), linear-gradient(180deg, #0b0b0c 0%, transparent 25%, transparent 70%, #0b0b0c 100%); }
html.sub .closer__in { position: relative; z-index: 1; width: min(100% - clamp(2.5rem, 6vw, 5rem), 92rem); margin-inline: auto; }
html.sub .closer__cap { margin: 0 0 .75rem; font-size: 15px; font-weight: 500; color: rgba(236,236,235,.7); }
html.sub .closer.closer--bild h2 { margin: 0 0 clamp(1.5rem, 3vw, 2.25rem); max-width: 13ch; font-size: clamp(2.6rem, 1.4rem + 4.4vw, 5.6rem); line-height: 1; letter-spacing: -.04em; font-weight: 700; color: #fff !important; text-align: left; }
html.sub .closer__wege { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; }
html.sub .closer__wege a { display: inline-flex; align-items: center; min-height: 48px; font-size: clamp(1.5rem, 1.1rem + 1.5vw, 2.4rem); font-weight: 600; letter-spacing: -.02em; color: #fff; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.35); line-height: 1.2; transition: border-color .2s ease; }
@media (hover: hover) and (pointer: fine) { .closer__wege a:hover { border-color: #fff; } }
html.sub .closer__note { margin: clamp(1.25rem, 2.5vw, 1.75rem) 0 0; max-width: 46ch; font-size: 17px; line-height: 1.6; color: rgba(236,236,235,.78); }
html.sub .closer__note a { color: #fff; text-decoration: underline; text-underline-offset: .2em; }
@media (max-width: 760px) { .closer.closer--bild { min-height: 80svh; } .closer__bg img { object-position: 70% 25%; } .closer__bg::after { background: linear-gradient(180deg, rgba(11,11,12,.2) 0%, rgba(11,11,12,.55) 40%, rgba(11,11,12,.95) 70%, #0b0b0c 100%); } }

html.sub .closer__note a { display: inline-block; padding-block: 12px; margin-block: -12px; }
html.sub .shopcase .shop__links { margin-top: clamp(2.5rem, 5vw, 4rem); }