:root{--paper:#000;--ink:#f5f5f2;--muted:#aaa8a3;--line:#292929;--dark:#080808}body{background:#000;color:#f5f5f2}html{scroll-padding-top:115px}[hidden]{display:none!important}em{font:inherit}h2{font-weight:500;letter-spacing:-.045em}.section,.reel{padding:110px 4%}.eyebrow{font-size:12px;letter-spacing:.28em}.fine-print,.muted{color:#aaa8a3}.pill,.menu-button,.close{background:#f5f5f2;color:#111}.pill:hover{background:#ddd}.pill.dark{background:#f5f5f2;color:#111}.text-link:hover{color:#fff}header{position:fixed;height:112px;padding:0 3%;background:linear-gradient(#0008,transparent);z-index:20}.logo-brand{width:145px}.logo-brand img{width:255px}.menu-button{width:54px;height:54px}header .pill{margin-left:auto}.hero{background:#080808 url('assets/optimized/behind-scenes.jpg') center 37%/cover;min-height:700px;height:100svh}.hero-video{opacity:.4;object-position:center 40%}.hero-shade{background:linear-gradient(180deg,#0002 0%,#0002 35%,#000 100%)}.hero-center{position:relative;z-index:2}.hero h1{font-size:clamp(95px,15vw,230px);font-weight:700;font-style:italic;letter-spacing:-.075em}.hero-center .eyebrow{letter-spacing:.28em}.hero-tagline{font-size:24px}.hero-bottom{position:relative;z-index:2;color:#ccc}.social-rail{position:fixed;right:20px;top:50%;writing-mode:vertical-rl;font:12px monospace;letter-spacing:.18em;z-index:21;mix-blend-mode:difference;color:#fff;padding:15px}.work{padding:70px 3% 110px;background:#000}.work .filters button{min-height:44px;color:#aaa}.work .filters button.active{color:#fff}.work-grid{padding-bottom:18px;scrollbar-color:#555 #111}.work-grid .project,.work-grid.filtered .project{min-width:0;flex:0 0 calc((100% - 25px)/6)}.work-grid .project .project-image{height:clamp(380px,34vw,560px);background:#151515}.work-grid .project-meta{padding:18px}.work-grid .project-meta h3{font-size:clamp(20px,1.7vw,30px);font-weight:600}.work-grid .image-label{font-size:11px;letter-spacing:.13em}.work-grid .project-meta>span{font-size:11px;color:#ddd}.work-grid .view-project{font:12px monospace;letter-spacing:.18em;bottom:27px}.work-grid .project img{object-position:center}.reel{background:#000;padding-top:40px}.reel-heading{grid-template-columns:1fr 1.5fr 1fr}.reel-heading>p:last-child{color:#aaa}.reel-screen{border:1px solid #181818}.reel-screen,.reel-screen.playing{height:75vh;max-height:850px;aspect-ratio:auto}.reel-screen video{display:block}.reel-caption{font:12px monospace;letter-spacing:.08em}.about{display:block;background:#000;padding:100px 0 0}.about-picture{width:100%;height:80vh;max-height:960px;overflow:hidden}.about-picture>img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center 32%}.about-picture:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 40%,#000 100%)}.about-copy{max-width:760px;margin:0 auto;padding:35px 25px 0}.about-copy h2{font-size:clamp(36px,4vw,60px);margin:24px 0 32px}.about-copy>p:not(.eyebrow){color:#aaa8a3;font-size:17px;line-height:1.8}.about-copy .large-copy{font-size:23px;color:#f5f5f2!important}.collage-section{padding:90px 4% 130px;text-align:center;overflow:hidden}.collage{position:relative;width:min(900px,90%);height:650px;margin:auto}.collage-photo{position:absolute;display:block;transition:transform .6s;box-shadow:0 15px 40px #0008}.collage-photo img{width:100%;height:100%;object-fit:cover}.photo-1{width:31%;height:65%;left:32%;top:1%;transform:rotate(-6deg);z-index:3}.photo-2{width:32%;height:53%;left:60%;top:14%;transform:rotate(10deg);z-index:2}.photo-3{width:39%;height:44%;left:7%;top:36%;transform:rotate(-12deg);z-index:1}.photo-4{width:28%;height:51%;left:52%;top:45%;transform:rotate(5deg);z-index:4}.photo-5{width:24%;height:40%;left:1%;top:5%;transform:rotate(-17deg)}.collage-photo:hover{transform:rotate(0deg) translateY(-8px);z-index:5}.collage-link{display:inline-block;margin-top:65px;font:14px monospace;letter-spacing:.25em;padding:16px}.business{background:#080808}.package-grid{gap:40px}.package{background:none;border-top:1px solid #444;padding:36px 0}.package h3{font-size:36px}.package-price,.retainer .package-price{color:#f5f5f2;font-size:48px}.package>p:not(.package-price),.package li{color:#aaa8a3}.package li{line-height:1.7}.retainer{background:#111;border-top:1px solid #333}.services{background:#000}.service-intro,details p{color:#aaa8a3}.service-list details{padding:28px 0}details small{color:#aaa;font:12px monospace}.contact{background:linear-gradient(#000 0%,#0008 35%,#000e 75%,#000 100%),url('assets/optimized/behind-scenes.jpg') center/cover;padding-top:160px}.contact-top{margin-bottom:110px}.contact-top h2{font-size:clamp(40px,6vw,90px)}.contact-top>p:last-child,.contact-note>p{color:#bbb}.contact-email{display:inline-block;font:500 clamp(20px,3.8vw,64px)/1.4 monospace;margin:20px 0 32px;overflow-wrap:anywhere}.contact-layout{border-color:#333;background:#0009;padding:60px 30px 0}.contact-note .fine-print{color:#aaa}label{color:#ccc;font-size:14px}input,textarea,select{color:#f5f5f2;border-color:#666}input::placeholder,textarea::placeholder{color:#aaa}select option{background:#111;color:#fff}.form-note{color:#aaa;font-size:13px}.footer-top{border-color:#292929}footer{background:#000}.footer-bottom{font-size:12px;color:#aaa}.footer-bottom button{font-size:12px;min-height:44px}.social button{min-height:44px}.menu-dialog{max-width:none;width:100vw;height:100svh;max-height:100svh;padding:70px 10%;margin:0;background:#000}.menu-dialog nav{margin-top:50px;gap:12px}.menu-dialog nav a{font-size:clamp(35px,6vw,80px)}.menu-dialog .close{top:30px;right:4%}dialog{background:#101010;color:#eee}#detail-image,#gallery-controls,#gallery-thumbs{background:#080808}.info-dialog textarea{background:#181818;color:#eee}.close{color:#111}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline-color:#fff}#work-empty{color:#aaa;margin:30px 0}.contact .pill{min-height:48px}
@media(max-width:1100px){.work-grid .project,.work-grid.filtered .project{flex-basis:calc((100% - 10px)/3)}.work-grid .project .project-image{height:480px}.social-rail{display:none}.reel-heading{grid-template-columns:1fr 2fr}.contact-layout{padding:40px 0 0}}
@media(max-width:700px){html{scroll-padding-top:90px}header{height:90px;padding:0 20px}.menu-button{width:44px;height:44px}header .pill{font-size:12px;padding:12px;max-width:130px}.logo-brand{width:90px;height:60px}.logo-brand img{width:165px}.hero{min-height:660px;padding:110px 20px 28px}.hero h1{font-size:28vw}.hero-center .eyebrow{font-size:11px;letter-spacing:.15em}.hero-tagline{font-size:20px}.hero-bottom p{max-width:150px;font-size:12px}.hero-control button{font-size:12px;min-width:0}.section,.reel{padding:70px 20px}.work{padding:50px 20px 65px}.work .eyebrow{font-size:11px}.work .filters{gap:8px 20px}.work-grid .project,.work-grid.filtered .project{flex:0 0 83%;min-width:0}.work-grid .project .project-image{height:470px}.work-grid .project-meta h3{font-size:30px}.work-grid .project-meta>span{font-size:12px}.reel-heading{display:block}.reel-screen,.reel-screen.playing{height:auto;aspect-ratio:9/16;max-height:none}.reel-caption{font-size:12px;line-height:1.7}.about{padding:30px 0 0}.about-picture{height:65svh}.about-picture>img{object-position:52% 30%}.about-copy{padding:24px 24px 0}.about-copy>p:not(.eyebrow){font-size:16px}.about-copy .large-copy{font-size:20px}.collage-section{padding:60px 10px 80px}.collage{width:100%;height:390px}.photo-1{width:40%;left:27%;height:61%}.photo-2{width:34%;left:64%;top:16%;height:47%}.photo-3{left:0;width:43%;top:38%;height:43%}.photo-4{left:47%;width:35%;height:47%}.photo-5{width:27%;left:3%;height:35%}.collage-link{font-size:12px;letter-spacing:.16em;margin-top:30px}.package-grid{gap:20px}.package{padding:26px 0}.package-price{font-size:40px}.retainer{padding:28px 20px}.contact{padding-top:100px}.contact-top{margin-bottom:60px}.contact-top h2{font-size:48px}.contact-email{font-size:clamp(17px,5.3vw,26px)}.contact-layout{background:#0009}.footer-bottom{gap:12px}.menu-dialog{padding:100px 25px 40px}.menu-dialog nav{margin-top:25px}.menu-dialog nav a{font-size:38px}.eyebrow{font-size:12px}.hero-cta{font-size:14px}}

header{background:#000}.hero{background-position:center 40%}.hero h1{font-size:clamp(95px,14vw,210px)}

.hero-video{opacity:1;background:#000}.hero-shade{background:linear-gradient(180deg,#0003,#0005 50%,#000e)}

.business .retainer{background:#641f2b;color:#fff5f3;border-color:#8e3c48}.business .retainer .eyebrow,.business .retainer .package-price,.business .retainer .text-link{color:#fff5f3}.business .retainer .text-link{border-color:#e4abb4}

.film-to-photos{height:280svh;position:relative;background:#000}.film-to-photos .hero{position:sticky;top:0;height:100svh;min-height:600px;overflow:hidden;background:#000}.film-to-photos .hero-video{will-change:transform,opacity;transform-origin:50% 45%}.hero-center,.hero-bottom{will-change:transform,opacity}.scroll-portfolio{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:125px 4% 45px;gap:30px}.scroll-photo-row{width:100%;display:flex;gap:16px;align-items:center;justify-content:center;perspective:1200px}.scroll-photo{display:block;width:19%;height:clamp(220px,40vh,450px);overflow:hidden;will-change:transform,opacity;box-shadow:0 20px 50px #0008}.scroll-photo:nth-child(2),.scroll-photo:nth-child(4){height:clamp(240px,45vh,480px)}.scroll-photo:nth-child(3){height:clamp(260px,49vh,520px)}.scroll-photo img{width:100%;height:100%;object-fit:cover}.scroll-photo-title{text-align:center;color:#fff;will-change:transform,opacity}.scroll-photo-title .eyebrow{font-size:10px;margin-bottom:12px}.scroll-photo-title h2{font-size:clamp(26px,3.5vw,52px);margin-bottom:12px}.scroll-photo-title .text-link{font-size:13px;color:#ddd}.scroll-portfolio.is-visible{pointer-events:auto}
@media(max-width:700px){.film-to-photos{height:250svh}.scroll-portfolio{padding:110px 0 35px;gap:32px}.scroll-photo-row{width:140%;gap:8px}.scroll-photo{width:19%;height:30vh}.scroll-photo:nth-child(2),.scroll-photo:nth-child(4){height:34vh}.scroll-photo:nth-child(3){height:39vh}.scroll-photo-title{padding:0 20px}.scroll-photo-title .eyebrow{font-size:9px;letter-spacing:.18em}}
@media(prefers-reduced-motion:reduce){.film-to-photos{height:auto}.film-to-photos .hero{position:relative}.scroll-portfolio{display:none}}

.hero-tagline{max-width:650px;margin-left:auto;margin-right:auto;text-wrap:balance}

.contact-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.contact button:disabled{opacity:.6;cursor:wait}#form-status{color:#fff;line-height:1.6}

.hero .hero-brand-mark{width:min(180px,40vw);margin:24px auto 20px;padding:0;line-height:0}.hero-brand-mark img{display:block;width:100%;height:auto}@media(max-width:700px){.hero .hero-brand-mark{margin:20px auto;width:140px}}

/* Header artwork fits within the bar without overflowing onto the video. */
header .logo-brand{width:145px;height:84px;overflow:hidden;display:flex;align-items:center;justify-content:center;mix-blend-mode:normal}
header .logo-brand img{position:static;display:block;width:100%;height:100%;max-width:100%;object-fit:contain;transform:none}
@media(max-width:700px){header .logo-brand{width:90px;height:54px}}

/* Fit the complete cropped artwork into the footer logo box. */
footer .logo-footer{position:relative;display:flex;align-items:center;justify-content:flex-start;width:230px;max-width:calc(100% - 80px);height:auto;aspect-ratio:950/510;overflow:hidden;mix-blend-mode:normal}
footer .logo-footer img{position:static;display:block;width:100%;height:100%;max-width:100%;object-fit:contain;transform:none}

.whatsapp-contact{position:fixed;right:max(22px,env(safe-area-inset-right));bottom:calc(22px + env(safe-area-inset-bottom));z-index:30;display:inline-flex;align-items:center;gap:9px;padding:13px 18px;border:1px solid #ffffff30;border-radius:999px;background:#075e54;color:#fff;text-decoration:none;font-size:14px;font-weight:500;line-height:1;box-shadow:0 4px 20px #0005;transition:background .2s}
.whatsapp-contact:hover{background:#08796b;color:#fff}.whatsapp-contact:focus-visible{outline:3px solid #fff;outline-offset:4px}.whatsapp-contact svg{flex-shrink:0}
body:has(dialog[open]) .whatsapp-contact{visibility:hidden}
@media(max-width:700px){.whatsapp-contact{right:14px;bottom:calc(14px + env(safe-area-inset-bottom));padding:13px}.whatsapp-contact span{display:none}.hero-control{margin-right:64px}footer{padding-bottom:90px}}

/* Visible brand and location heading, kept compact over the film. */
.hero h1.hero-heading{font-size:clamp(20px,2.2vw,30px);font-weight:500;font-style:normal;letter-spacing:-.02em;line-height:1.3;margin:0 auto 18px;max-width:90%}.hero-heading span{display:block;font-size:16px;font-weight:400;letter-spacing:.025em;line-height:1.5;margin-top:6px;color:#f5f5f2}@media(max-width:700px){.hero h1.hero-heading{font-size:20px;margin-bottom:14px}.hero-heading span{font-size:14px}.hero .hero-brand-mark{margin:14px auto}}

.service-directory{padding-top:36px;padding-bottom:50px;border-top:1px solid #292929}.service-directory>div{display:flex;flex-wrap:wrap;gap:16px 32px;margin-top:20px}.service-directory a{color:#f5f5f2;text-decoration:underline;text-underline-offset:6px;min-height:44px;display:inline-flex;align-items:center}.menu-dialog nav a{font-size:clamp(22px,3.5vw,48px)}.menu-dialog{overflow-y:auto}

/* Compact transition from portfolio to film. */
#arbeiten{padding-bottom:24px}#film{padding-top:24px}#film .reel-heading{margin-bottom:32px}@media(max-width:700px){#arbeiten{padding-bottom:16px}#film{padding-top:20px}#film .reel-heading{margin-bottom:24px}}

/* Align legal links and credits with equal touch targets. */
.footer-bottom>div{align-items:center;flex-wrap:wrap;column-gap:20px;row-gap:0}
.footer-bottom>div>a,.footer-bottom>div>button{display:inline-flex;align-items:center;justify-content:flex-start;box-sizing:border-box;min-height:44px;margin:0;padding:5px 0;font:inherit;line-height:1.5}

.film-service-link{margin:20px 0 0;font-size:16px;line-height:1.6}.film-service-link a{display:inline-block;padding:12px 0;color:inherit;text-underline-offset:5px}

/* Compact film teaser; playback lives on the dedicated film page. */
.reel.reel-preview{padding:44px 6% 56px}
.film-preview-card{display:grid;grid-template-columns:160px 1fr;align-items:center;gap:36px;max-width:780px;margin:auto;padding:24px;border:1px solid #292929;background:#0b0b0b;text-decoration:none;color:#f5f5f2}
.film-preview-card>img{display:block;width:160px;height:220px;object-fit:cover;object-position:center 64%}
.film-preview-card h2{font-size:clamp(26px,3vw,38px);line-height:1.1;margin:10px 0 16px}
.film-preview-card .eyebrow{font-size:10px;color:#aaa8a3;margin:0}
.film-preview-card p:not(.eyebrow){font-size:15px;line-height:1.65;color:#aaa8a3;max-width:430px;margin:0 0 20px}
.film-preview-link{display:inline-block;font-size:14px;border-bottom:1px solid #777;padding-bottom:5px}
.film-preview-card:hover{border-color:#777}
@media(max-width:600px){.film-preview-card{grid-template-columns:90px 1fr;gap:18px;padding:18px}.film-preview-card>img{width:90px;height:150px}.film-preview-card h2{font-size:25px}.film-preview-card p:not(.eyebrow){font-size:13px;line-height:1.5;margin-bottom:14px}.film-preview-link{font-size:13px}.reel.reel-preview{padding:24px 6% 36px}}