@font-face{font-family:'Inter Tight';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-tight-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/inter-tight-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/inter-tight-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/inter-tight-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/inter-tight-latin-800-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin-400-italic.woff2) format('woff2')}
body{margin:0;background:#FFFFFF}
a{color:#FA4517}a{transition:opacity .15s}
a:not(.row):hover{opacity:.65}
.g5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));column-gap:36px}
.ind{text-indent:calc(40% + 14px)}
.row{text-decoration:none;color:inherit;transition:background .2s}
.row:hover{background:#FFF4EF}
.row:hover .th{transform:scale(1.04)}
.th{transition:transform .3s}
.mq{display:flex;width:max-content;animation:mq 80s linear infinite}
.lg{display:block;height:var(--h);width:auto;max-width:none;flex-shrink:0}
@media (max-width:760px){.lg{height:calc(var(--h) * .72)}}
.mqw:hover .mq{animation-play-state:paused}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.mq{animation:none}}
.ul{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1.5px}
.nl{text-decoration:none;font-size:15px;font-weight:500;padding:10px 0;color:#FA4517}
.nl:hover,.nl.on{text-decoration:underline;text-underline-offset:5px}
.fi{border:none;border-bottom:1.5px solid #FA4517;background:transparent;font-family:inherit;font-size:16px;color:#FA4517;padding:18px 0 12px;min-height:56px;width:100%;box-sizing:border-box;border-radius:0}
.fi::placeholder{color:#FA4517}
input:focus,textarea:focus,button:focus-visible,a:focus-visible{outline:2px solid #FA4517;outline-offset:3px}
@media (max-width:760px){.g5{grid-template-columns:1fr;row-gap:16px}.g5>*{grid-column:1/-1 !important;grid-row:auto !important}.ind{text-indent:0}.hidem{display:none !important}}

html{scroll-behavior:smooth}
body{margin:0;background:#FFFFFF;color:#FA4517;font-family:'Inter Tight',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.wp-site-blocks{padding:0!important}
.wp-site-blocks>*{margin-block-start:0!important;margin-block-end:0!important}
.wach-header-part{position:sticky;top:var(--wp-admin--admin-bar--height,0px);z-index:50}
.wach-header-part header{position:relative!important}
.chip[aria-pressed="true"]{background:#FA4517!important;color:#FFFFFF!important;border-color:#FA4517!important}
.js-filter[aria-pressed="true"]{text-decoration:underline!important}
.js-item[hidden]{display:none!important}
.wach-generic{padding:96px 48px;color:#FA4517}
.wach-generic h1{color:#FA4517;font-size:clamp(48px,7vw,100px);letter-spacing:-0.05em;text-transform:uppercase}

/* Responsive (Mobil) */
[style*="aspect-ratio"]{max-width:100%}
.mbar{display:none}
.burger{background:none;border:0;font:inherit;font-size:15px;font-weight:700;color:#FA4517;padding:10px 0;cursor:pointer}
@media (max-width:760px){
.wach-header-part nav{flex-wrap:nowrap!important}
.mbar{display:flex;align-items:center;gap:24px}
.nl-wrap{display:none!important}
.wach-header-part header.open .nl-wrap{display:flex!important;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0!important;background:#FFFFFF;padding:8px 20px 24px;border-bottom:1px solid #FA4517;max-height:calc(100vh - 64px);overflow:auto}
.wach-header-part header.open .nl-wrap .nl{font-size:30px;font-weight:700;letter-spacing:-0.035em;padding:10px 0}
footer a{display:inline-block;padding:8px 0}
.g5.team{grid-template-columns:88px minmax(0,1fr);column-gap:16px;row-gap:4px}
.g5.team>*{grid-column:2!important}
.g5.team>div:first-child{grid-column:1!important;grid-row:1/span 4!important}
.g5.team>a{justify-self:start!important;margin-top:4px}
/* Projektlisten: Vorschaubild als langer, dünner Streifen in der Zeile */
.row .pthumb{display:block!important}
.row .pthumb>div{width:100%!important;height:auto!important;aspect-ratio:5/1}
.row.g5{row-gap:12px}
}

/* Film-Startknopf: runder oranger Knopf, dünner Puls-Ring läuft ruhig nach außen (zwei versetzte Ringe) */
.filmplay{position:absolute;left:50%;top:50%;width:clamp(60px,6vw,80px);height:auto;aspect-ratio:1;margin:0;transform:translate(-50%,-50%);border:0;border-radius:50%;padding:0;background:#FA4517;color:#FFFFFF;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.filmplay svg{width:29%;height:auto;display:block;margin-left:3%;transition:transform .35s cubic-bezier(.2,.8,.2,1)}  /* Dreieck optisch mittig */
.filmplay::before,.filmplay::after{content:"";position:absolute;inset:0;border-radius:50%;border:1.5px solid #FA4517;pointer-events:none;animation:wach-puls 2.4s cubic-bezier(.2,.6,.3,1) infinite}
.filmplay::after{animation-delay:1.2s}
@keyframes wach-puls{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.9);opacity:0}}
.js-film:hover .filmplay{transform:translate(-50%,-50%) scale(1.08)}
.js-film:hover .filmplay svg{transform:translateX(2px)}
.filmplay:focus-visible{outline:2px solid #FFFFFF;outline-offset:6px}
@media (prefers-reduced-motion:reduce){.filmplay::before,.filmplay::after{animation:none;opacity:0}}
.js-film video{position:absolute;inset:0;width:100%;height:100%;background:#0B0B0B}
.filmplay--gross{width:clamp(72px,8vw,108px)}
[id]{scroll-margin-top:calc(clamp(70px,4.8vw + 34px,102px) + 32px)}  /* Sprungziel = Header-Höhe + Luft */

/* Projekt-Galerie: Spalten (Masonry) */
.wach-gal{columns:3}
@media (max-width:760px){.wach-gal{columns:2}}

/* Leistungsseiten (z. B. /videoproduktion-osnabrueck/) */
.leistung h1,.leistung h2,.leistung h3,.leistung p{margin:0}
.l-sek{padding:clamp(72px,11.2vw,160px) clamp(20px,3.34vw,48px) 0}
.l-kopf{margin-bottom:24px}
.l-lab{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:0;font-size:19px;line-height:1.3;color:#FA4517}
.l-h1{font-size:clamp(44px,8.4vw,124px);line-height:.9;font-weight:700;letter-spacing:-0.06em;text-transform:uppercase;text-wrap:balance}
.l-h1 em{display:block;font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;text-transform:none;letter-spacing:-0.02em}
.l-lead{font-size:clamp(18px,1.6vw,22px);line-height:1.45;font-weight:500;color:#FA4517}
.l-zeile{align-items:center;padding:clamp(24px,2.6vw,36px) 0;border-bottom:1px solid #FA4517}
.l-titel{grid-column:1/3;font-size:clamp(28px,3.4vw,49px);font-weight:700;letter-spacing:-0.045em;text-transform:uppercase;line-height:1}
.l-tag{grid-column:3/4;font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-size:17px;color:#FA4517}
.l-text{grid-column:4/6;font-size:15px;line-height:1.45;font-weight:500;color:#FA4517;max-width:44ch}
.l-punkt{display:flex;flex-direction:column;gap:10px;min-width:0}
.l-punkt h3{font-size:clamp(22px,2vw,28px);font-weight:700;letter-spacing:-0.035em;line-height:1.05}
.l-punkt p{font-size:15px;line-height:1.5;font-weight:500;color:#FA4517}
.l-nr{font-size:13px;font-weight:600;letter-spacing:.06em}
.faq{border-bottom:1px solid #FA4517}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;font-size:clamp(18px,1.6vw,22px);font-weight:600;letter-spacing:-0.02em;color:#FA4517}
.faq summary::-webkit-details-marker{display:none}
.faq-plus{position:relative;width:16px;height:16px;flex-shrink:0}
.faq-plus::before,.faq-plus::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;background:#FA4517;transition:transform .25s}
.faq-plus::after{transform:rotate(90deg)}
.faq[open] .faq-plus::after{transform:rotate(0)}
.faq p{padding:0 0 24px;max-width:62ch;font-size:16px;line-height:1.55;font-weight:500;color:#FA4517}

/* About: Porträt-Strecke (6 Hochformate, mobil 3 bzw. 2 pro Reihe) */
.portraits{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(8px,1.1vw,16px)}
@media (max-width:1000px){.portraits{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:480px){.portraits{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Cookie-Hinweis: schmale Leiste am unteren Rand, Linie oben wie die Trennlinien (inc/consent.php, assets/js/consent.js) */
.cb{position:fixed;left:0;right:0;bottom:0;z-index:200;background:#FFFFFF;border-top:1px solid #FA4517;padding:14px clamp(20px,3.34vw,48px) calc(14px + env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px 32px;color:#FA4517;font-family:'Inter Tight',sans-serif}
.cb[hidden]{display:none}
.cb p{margin:0}
.cb-x{font-size:14px;line-height:1.45;font-weight:500;max-width:80ch}
.cb-t{font-weight:700;margin-right:4px}
.cb-x a{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-size:16px;text-decoration:underline;text-underline-offset:3px}
.cb-opt{grid-column:1/-1;grid-row:1;display:flex;flex-wrap:wrap;gap:10px 36px;padding-bottom:12px;border-bottom:1px solid #FA4517}
.cb-opt[hidden]{display:none}
.cb-opt label{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;line-height:1.4;font-weight:500;cursor:pointer;max-width:320px}
.cb-opt input{width:16px;height:16px;margin:1px 0 0;accent-color:#FA4517;flex-shrink:0}
.cb-opt b{display:block;font-size:13.5px;font-weight:700}
.cb-b{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end}
.cb-b button{font:600 13.5px 'Inter Tight',sans-serif;border-radius:999px;height:38px;padding:0 18px;cursor:pointer;transition:background .2s,color .2s;white-space:nowrap}
.cb-f{background:#FA4517;color:#FFFFFF;border:0;order:3}
.cb-f:hover{background:#FFFFFF;color:#FA4517;box-shadow:inset 0 0 0 1.5px #FA4517}
.cb-o{background:#FFFFFF;color:#FA4517;border:1.5px solid #FA4517;order:2}
.cb-o:hover{background:#FA4517;color:#FFFFFF}
.cb-l{background:none;border:0;padding:0 6px!important;font-family:'Instrument Serif',Georgia,serif!important;font-style:italic;font-weight:400!important;font-size:16px!important;text-decoration:underline;text-underline-offset:3px;color:#FA4517;order:1}
.cb button:focus-visible,.cb a:focus-visible{outline:2px solid #FA4517;outline-offset:3px}
@media (max-width:760px){.cb{grid-template-columns:1fr;gap:10px}.cb-x{font-size:13px}.cb-b{display:grid;grid-template-columns:1fr 1fr;gap:8px}.cb-f{order:1}.cb-o{order:2}.cb-l{order:3;grid-column:1/-1;justify-self:start;height:28px!important}.cb-opt{gap:8px}}
@media (prefers-reduced-motion:no-preference){.cb:not([hidden]){animation:cb-ein .35s cubic-bezier(.2,.8,.2,1)}}
@keyframes cb-ein{from{transform:translateY(100%)}to{transform:none}}

/* Suche im Menü: nur Lupe, Feld fährt nach links aus, Vorschläge darunter (inc/suche.php, parts/header.html, wach.js „Suche“) */
.wach-header-part nav>a:first-child{margin-right:auto}
.suchbox{position:relative;display:flex;align-items:center;order:3}
.suche-knopf{background:none;border:0;padding:10px 0 10px 4px;color:#FA4517;cursor:pointer;display:flex;align-items:center}
.suche-knopf .lupe{width:17px;height:17px;display:block;transition:transform .25s}
.suche-knopf:hover .lupe{transform:scale(1.12)}
.suche-feld{width:0;overflow:hidden;transition:width .45s cubic-bezier(.2,.8,.2,1)}
.suchbox.offen .suche-feld{width:min(280px,21vw)}
@media (min-width:761px){.wach-header-part nav{flex-wrap:nowrap!important}.nl-wrap{flex-wrap:nowrap!important;white-space:nowrap}}  /* Desktop: Feld im Fluss → schiebt die Menüpunkte nach links */
.suche-feld input{width:calc(100% - 14px);box-sizing:border-box;margin-right:14px;border:0;border-bottom:1.5px solid #FA4517;border-radius:0;background:transparent;font:500 16px 'Inter Tight',sans-serif;color:#FA4517;padding:8px 0;outline:none;-webkit-appearance:none}
.suche-feld input::placeholder{color:#FA4517;opacity:.6}
.suche-feld input::-webkit-search-cancel-button{display:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.suche{position:absolute;top:100%;right:clamp(20px,3.34vw,48px);width:min(440px,calc(100vw - 40px));background:#FFFFFF;border:1px solid #FA4517;padding:8px 20px;z-index:60;color:#FA4517}
.suche[hidden]{display:none}
.suche-liste{display:flex;flex-direction:column;max-height:min(420px,60vh);overflow:auto}
.suche-kopf{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-size:14px;padding:8px 0 4px}
.suche-t{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;align-items:center;padding:10px 6px;margin:0 -6px;border-top:1px solid #FDEAE2;text-decoration:none;color:#FA4517}
.suche-t:hover,.suche-t[aria-selected="true"]{background:#FFF4EF;opacity:1}
.suche-b{width:64px;height:40px;background:#FDEAE2;overflow:hidden;display:flex;align-items:center;justify-content:center}
.suche-b img{width:100%;height:100%;object-fit:cover;display:block}
.suche-b .lupe{width:16px;height:16px}
.suche-n{font-size:15px;font-weight:700;letter-spacing:-0.03em;text-transform:uppercase;line-height:1.1;overflow-wrap:anywhere}
.suche-n em{font-family:'Instrument Serif',Georgia,serif;font-weight:400;text-transform:none;letter-spacing:0}
.suche-m{display:block;font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-size:14px;margin-top:3px}
.suche-leer{padding:14px 0;font-size:14px;font-weight:500}
@media (max-width:760px){.suche{left:16px;right:16px;width:auto}.suchbox{order:2}.mbar{order:3}.suche-feld{position:absolute;right:100%;top:50%;transform:translateY(-50%);background:#FFFFFF}.suchbox.offen .suche-feld{width:calc(100vw - 128px)}}  /* Handy: kein Platz zum Schieben → Feld legt sich über das Logo */

/* Team-Seite: Gruppenfoto, beim Darüberfahren (bzw. Antippen) das Grimassen-Foto */
.teamgag-b{opacity:0;transition:opacity .25s ease}
.teamgag:hover .teamgag-b,.teamgag.zeig .teamgag-b{opacity:1}
/* Namensschilder im Teamfoto (bei Hover/Antippen). Ebene = sichtbares 3:2-Bild bei object-fit:cover + object-position center 30 % */
.teamgag{container-type:size}
.tg-lage{position:absolute;width:max(100cqw,150cqh);height:max(66.667cqw,100cqh);left:calc((100cqw - max(100cqw,150cqh))*.5);top:calc((100cqh - max(66.667cqw,100cqh))*.3);pointer-events:none}
.tg-n{position:absolute;white-space:nowrap;background:#FFFFFF;color:#FA4517;border-radius:999px;padding:.35em .8em .3em;font:700 clamp(9px,1vw,13px)/1 'Inter Tight',sans-serif;letter-spacing:.02em;text-transform:uppercase;opacity:0;--t:translate(0,-50%);transform:var(--t) scale(.6);transition:opacity .2s ease,transform .3s cubic-bezier(.3,1.5,.5,1);transition-delay:0s}
.tg-l{--t:translate(-100%,-50%);transform-origin:right center}
.tg-r{transform-origin:left center}
.tg-t{--t:translate(-50%,-100%);transform-origin:center bottom}
.tg-b{--t:translate(-50%,0);transform-origin:center top}
.teamgag:hover .tg-n,.teamgag.zeig .tg-n{opacity:1;transform:var(--t) scale(1);transition-delay:calc(.12s + var(--i)*45ms)}
@media (max-width:760px){.tg-n{font-size:7.5px;padding:.35em .6em .3em}.tg-mt{left:var(--x)!important;top:var(--y)!important;--t:translate(-50%,-100%);transform-origin:center bottom}}
@media (prefers-reduced-motion:reduce){.tg-n{transition:opacity .2s ease!important;transform:var(--t)!important}}
/* Porträt groß (Klick auf ein Teamporträt) */
.pg{position:fixed;inset:0;z-index:300;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:clamp(16px,4vw,48px);background:rgba(255,255,255,.94);opacity:0;transition:opacity .25s ease;cursor:zoom-out}
.pg.auf{opacity:1}
.pg img{display:block;height:min(78vh,900px);max-width:100%;aspect-ratio:2/3;object-fit:cover;transform:scale(.92);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.pg.auf img{transform:none}
.pg-t{font-size:clamp(22px,2.2vw,32px);font-weight:700;letter-spacing:-0.04em;text-transform:uppercase;line-height:1;color:#FA4517;text-align:center}
.pg-t em{display:block;margin-top:6px;font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:0;text-transform:none;font-size:17px}
.pg-zu{position:absolute;top:clamp(12px,2vw,24px);right:clamp(12px,2vw,24px);width:44px;height:44px;border-radius:50%;border:0;background:#FA4517;color:#fff;font:400 22px/1 'Inter Tight',sans-serif;cursor:pointer}
@media (prefers-reduced-motion:reduce){.pg,.pg img{transition:none}}

/* Startseite: Bildpaar PCO + ARRI nur ab Tablet (Kundenwunsch 06.10.2026) */
@media (max-width:760px){.bildpaar{display:none}}
/* Sprachschalter DE/EN (inc/sprache.php, im Menü nach „Kontakt“) */
.sprache{display:inline-flex;align-items:center;gap:2px;font-size:15px;font-weight:500;padding:10px 0}
.sprache a{color:#FA4517;text-decoration:none;opacity:.45;padding:0 3px}
.sprache a:hover{opacity:.8}
.sprache a.an{opacity:1;text-decoration:underline;text-underline-offset:5px}
.sprache a+a::before{content:"/";display:inline-block;margin-right:5px;opacity:.45;color:#FA4517}
.wach-header-part header.open .nl-wrap .sprache{font-size:20px;padding:18px 0 4px}
