/* Arvid Bünning — FTP-Ausgabe. Reines CSS3, lokal gehostete Archivo-Schrift. */
@import url('../media/fonts/archivo-local.css');
:root { color-scheme: dark; --black:#000; --white:#fff; --muted:rgba(255,255,255,.4); --quiet:rgba(255,255,255,.25); }
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#444 transparent}
::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#404040;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#666}
body{margin:0;min-width:280px;min-height:100vh;background:var(--black);color:var(--white);font:400 16px/1.5 'Archivo',Arial,sans-serif;-webkit-font-smoothing:antialiased}
button,a{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}img,video{display:block;max-width:100%}
:focus-visible{outline:2px solid rgba(255,255,255,.55);outline-offset:3px}
.skip-link{position:fixed;z-index:400;left:12px;top:-80px;background:#fff;color:#000;padding:8px 14px;font-size:13px}.skip-link:focus{top:10px}
.site-nav{position:fixed;z-index:100;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:24px 40px;pointer-events:none}.site-nav>*{pointer-events:auto}
.nav-link{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#737373;transition:color .3s}.nav-link:hover,.nav-link.active{color:#fff}.desktop-nav{display:flex;align-items:center;gap:48px}
.menu-toggle{display:none;border:0;background:transparent;color:rgba(255,255,255,.4);padding:8px;width:36px;height:34px;position:relative;z-index:120;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.menu-toggle span{width:20px;height:1px;background:currentColor;display:block;transition:transform .2s,opacity .2s}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.mobile-menu{display:none}
.site-footer{padding:32px 40px;border-top:1px solid rgba(255,255,255,.05)}.footer-inner{max-width:1280px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:10px;letter-spacing:.08em;color:rgba(255,255,255,.25)}.footer-links{display:flex;gap:24px}.footer-links a{text-transform:uppercase}.footer-links a:hover{color:rgba(255,255,255,.65)}
.divider{height:1px;background:rgba(255,255,255,.08)}
/* Collage: beide im Quellprojekt vorhandenen Spaltenkonfigurationen 1:1 beibehalten. */
.home-page{padding:128px 80px 64px}.collage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:80px}.collage-mobile{display:none}.collage-column{min-width:0;display:flex;flex-direction:column}.collage-piece{flex:none}.collage-piece .image-button{display:block;padding:0;border:0;background:none;text-align:left}.collage-piece img{width:100%;height:auto;cursor:pointer;transition:transform .2s ease-out}.collage-piece .image-button:hover img{transform:scale(1.02)}
.js .reveal{opacity:0;transform:translateY(30px);transition:opacity .7s ease-out,transform .7s ease-out}.js .reveal.is-visible{opacity:1;transform:none}.js .reveal--soft{transform:translateY(20px);transition-duration:.6s}
/* Filmarbeiten */
.showreel-outer{padding-top:80px}.showreel{position:relative;width:100%;aspect-ratio:24/10;overflow:hidden;background:#000}.showreel video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.motion-main{padding:96px 64px 128px}.motion-content{max-width:1024px}.film-project+.film-project{margin-top:128px}.film-project>.divider{margin-bottom:40px}.film-row{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);align-items:end;gap:64px}
.film-no{font-size:60px;font-weight:100;line-height:1;color:rgba(255,255,255,.07);margin-bottom:24px}.film-meta{display:flex;align-items:center;gap:12px;margin-bottom:12px;color:rgba(255,255,255,.3);font-size:11px;letter-spacing:.15em;text-transform:uppercase}.film-meta .dash{color:rgba(255,255,255,.1)}.film-info h2{margin:0 0 16px;font-size:24px;font-weight:300;letter-spacing:.025em;line-height:1.25}.film-description{margin:0;color:rgba(255,255,255,.4);font-size:14px;line-height:1.65}.film-roles{display:flex;flex-wrap:wrap;gap:5px 16px;margin-top:16px;color:rgba(255,255,255,.2);font-size:10px;letter-spacing:.15em;text-transform:uppercase}
.slideshow{width:100%;outline:none}.slide-viewport{position:relative;width:100%;overflow:hidden;background:#000;cursor:pointer;aspect-ratio:var(--slide-ratio,16/9)}.slide-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .3s}.slide-image.is-fading{opacity:0}.slide-hover-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.004);pointer-events:none;visibility:hidden}.slide-hover-video.is-playing{visibility:visible}
.slide-arrow{position:absolute;z-index:2;top:0;bottom:0;width:50%;display:flex;align-items:center;opacity:0;transition:opacity .2s;pointer-events:none;color:rgba(255,255,255,.4)}.slideshow:hover .slide-arrow{opacity:1}.slide-arrow svg{width:20px;height:20px}.slide-arrow--prev{left:0;padding-left:16px}.slide-arrow--next{right:0;justify-content:flex-end;padding-right:16px}.slide-arrow[hidden]{display:none!important}
.slide-dots{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:16px;min-height:8px}.slide-dots button{width:6px;height:6px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.2);transition:all .3s}.slide-dots button:hover{background:rgba(255,255,255,.4)}.slide-dots button[aria-current="true"]{width:8px;height:8px;background:rgba(255,255,255,.7)}
/* Fotoprojekte */
.stills-main{max-width:1024px;margin:0 auto;padding:128px 0 128px}.stills-project+.stills-project{margin-top:160px}.stills-head{margin-bottom:48px}.stills-head .divider{margin-bottom:32px}.stills-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:64px}.stills-heading h2{flex-shrink:0;margin:0;font-size:30px;line-height:1.3;font-weight:300;letter-spacing:.025em}.stills-heading p{margin:0;max-width:512px;color:rgba(255,255,255,.35);font-size:14px;line-height:1.65}.stills-photos{display:grid;gap:40px}.stills-photos button{display:block;width:100%;border:0;padding:0;background:none;text-align:left}.stills-photos img{width:100%;height:auto}
/* Übergeordnete Lightbox (Home und Stills) */
.lightbox{position:fixed;z-index:200;inset:0;background:rgba(0,0,0,.93);backdrop-filter:blur(9px);display:flex;align-items:center;justify-content:center}.lightbox[hidden]{display:none}.lightbox img{position:relative;z-index:1;max-width:90vw;max-height:85vh;object-fit:contain}.lightbox button{position:absolute;z-index:2;border:0;background:none;color:rgba(255,255,255,.5);padding:12px;line-height:0}.lightbox button:hover{color:#fff}.lightbox .lb-close{top:20px;right:20px}.lightbox .lb-prev{top:50%;left:20px;transform:translateY(-50%)}.lightbox .lb-next{top:50%;right:20px;transform:translateY(-50%)}.lightbox .lb-caption{position:absolute;z-index:2;top:24px;left:24px;font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:rgba(255,255,255,.4)}.lightbox .lb-counter{position:absolute;z-index:2;bottom:24px;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.2em;color:rgba(255,255,255,.3)}.lightbox button[hidden],.lightbox .lb-caption[hidden]{display:none}
/* Persona */
.persona-main{padding:144px 64px 128px}.persona-inner{max-width:1152px;margin:auto;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:40px;align-items:start}.persona-portrait{grid-column:1/span 5}.persona-portrait img{width:100%;height:auto}.persona-text{grid-column:7/span 6;color:rgba(255,255,255,.6);font-size:16px;line-height:1.8;font-weight:300;letter-spacing:.025em}.persona-name{margin:0 0 8px;text-transform:uppercase;letter-spacing:.15em}.persona-qualification{display:flex;align-items:baseline;gap:12px;margin-bottom:32px;color:rgba(255,255,255,.4);font-size:11px;letter-spacing:.12em}.persona-qualification .line{width:32px;height:1px;background:rgba(255,255,255,.15)}.persona-text p{margin:0 0 20px}.persona-divider{width:48px;height:1px;background:rgba(255,255,255,.15);margin:24px 0}.contact-link{display:inline-flex;justify-content:center;align-items:center;gap:12px;margin-top:32px;padding:12px 24px;border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.7);font-size:12px;letter-spacing:.2em;text-transform:uppercase;transition:border-color .3s,color .3s}.contact-link:hover{border-color:rgba(255,255,255,.5);color:#fff}.contact-link svg{width:14px;height:14px}
/* Rechtliche Seiten */
.legal-main{max-width:768px;margin:auto;padding:128px 24px 80px}.legal-main h1{margin:0 0 48px;font-size:24px;font-weight:300;letter-spacing:.025em}.legal-main section{color:#d4d4d4;font-size:14px;line-height:1.65}.legal-main section>div+div{margin-top:32px}.legal-main h2{margin:0 0 8px;color:white;font-size:14px;font-weight:500}.legal-main h3{margin:16px 0 4px;color:#f5f5f5;font-size:12px;font-weight:400;letter-spacing:.08em;text-transform:uppercase}.legal-main p{margin:0}.legal-main p+p{margin-top:10px}.legal-main ul{margin:8px 0 0;padding-left:22px}.legal-main li+li{margin-top:4px}
@media (max-width:1100px) and (min-width:768px){.home-page{padding-left:48px;padding-right:48px}.collage{gap:64px}.stills-main{margin-left:40px;margin-right:40px}.film-row{gap:48px}.persona-inner{gap:24px}}
@media (max-width:767px){
 .site-nav{padding:12px 16px}.desktop-nav{display:none}.menu-toggle{display:flex}.mobile-menu{position:fixed;inset:0;z-index:110;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:40px;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;pointer-events:none}.mobile-menu.is-open{opacity:1;visibility:visible;pointer-events:auto}.mobile-menu>a{color:rgba(255,255,255,.4);font-size:14px;letter-spacing:.2em;text-transform:uppercase}.mobile-menu>a.active,.mobile-menu>a:hover{color:white}.mobile-menu-legal{position:absolute;bottom:32px;display:flex;gap:24px}.mobile-menu-legal a{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.3)}
 .site-footer{padding:32px 24px}.footer-inner{flex-direction:column;gap:16px}
 .home-page{padding:64px 16px}.collage-desktop{display:none}.collage-mobile{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
 .showreel-outer{padding-top:44px}.showreel{aspect-ratio:16/9}.motion-main{padding:40px 24px 80px}.film-project+.film-project{margin-top:64px}.film-project>.divider{margin-bottom:20px}.film-row{display:flex;flex-direction:column-reverse;gap:16px;align-items:stretch}.film-no{display:none}.film-meta{margin-bottom:12px}.film-info h2{font-size:16px;margin-bottom:8px}.film-description{font-size:12px}.film-roles{margin-top:16px}.slide-arrow{display:none}
 .stills-main{padding:64px 16px 80px}.stills-project+.stills-project{margin-top:64px}.stills-head{margin-bottom:24px}.stills-head .divider,.stills-heading h2{display:none}.stills-heading{display:block}.stills-heading p{font-size:14px}.stills-photos{gap:16px}
 .persona-main{padding:56px 16px 64px}.persona-inner{display:grid;grid-template-columns:1fr;gap:20px}.persona-portrait,.persona-text{grid-column:1}.persona-text{font-size:12px;line-height:1.7}.persona-name{margin-bottom:4px}.persona-qualification{margin-bottom:16px}.persona-text p{margin-bottom:12px}.persona-divider{margin:16px 0}.contact-link{display:flex;width:100%;margin-top:24px}
 .legal-main{padding:64px 16px 48px}.legal-main h1{font-size:18px;margin-bottom:24px}.legal-main section{font-size:12px}.legal-main section>div+div{margin-top:20px}.legal-main h2{font-size:12px;margin-bottom:4px}.legal-main h3{font-size:12px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.js .reveal{opacity:1;transform:none;transition:none}.collage-piece img,.slide-image,.slide-arrow,.menu-toggle span{transition:none}}