@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/schibsted-400.woff2) format("woff2");}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/schibsted-700.woff2) format("woff2");}

:root{
  --asa-orange:#eb5505;
  --asa-turquoise:#00b9c6;
  --ink:#000;--block:#0a0a0a;--block2:#070707;
  --white:#f7f7f5;--muted:rgba(247,247,245,.86);--beige:#d8cdba;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:"Schibsted Grotesk",system-ui,sans-serif;background:var(--ink);color:var(--white);-webkit-font-smoothing:antialiased;}

/* ===== SPRACHUMSCHALTER (oben links) ===== */
.lang{position:fixed;top:26px;left:clamp(20px,4vw,48px);z-index:80;display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;letter-spacing:.05em;}
.lang button{background:none;border:0;cursor:pointer;color:var(--muted);padding:2px;font:inherit;opacity:.7;transition:color .2s,opacity .2s;}
.lang button:hover{opacity:1;}
.lang button.active{color:var(--asa-orange);opacity:1;}
.lang span{color:var(--muted);opacity:.4;}

/* ===== HAMBURGER (alle Größen, oben rechts) ===== */
.burger{position:fixed;top:26px;right:clamp(20px,4vw,48px);z-index:80;background:none;border:0;cursor:pointer;width:34px;height:22px;}
.burger span{position:absolute;left:0;right:0;height:2px;background:var(--asa-orange);transition:.3s;}
.burger span:nth-child(1){top:0;}.burger span:nth-child(2){top:10px;}.burger span:nth-child(3){top:20px;}

/* ===== MENÜ-OVERLAY (Vollbild) ===== */
.menu-overlay{position:fixed;inset:0;z-index:90;background:#0c0c0c;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(20px,4vh,40px);
  opacity:0;visibility:hidden;transition:opacity .4s ease,visibility .4s;}
.menu-overlay.open{opacity:1;visibility:visible;}
.menu-overlay a{color:var(--asa-orange);text-decoration:none;font-size:clamp(1.5rem,4vw,2.4rem);font-weight:400;letter-spacing:.5px;transition:color .25s ease;}
.menu-overlay a:hover{color:var(--white);}
.menu-close{position:fixed;top:22px;right:clamp(18px,4vw,42px);z-index:95;width:46px;height:46px;border-radius:50%;background:var(--asa-orange);border:0;color:#fff;font-size:24px;cursor:pointer;display:none;align-items:center;justify-content:center;line-height:1;}
.menu-overlay.open ~ .menu-close,.menu-close.show{display:flex;}
/* orangefarbene Kreis-Blende beim Schließen */
.circle-wipe{position:fixed;top:34px;right:34px;width:40px;height:40px;border-radius:50%;background:var(--asa-orange);transform:scale(0);transform-origin:center;z-index:99;pointer-events:none;}
.circle-wipe.expand{transition:transform .5s cubic-bezier(.7,0,.3,1);transform:scale(60);}
.circle-wipe.contract{transition:transform .5s cubic-bezier(.7,0,.3,1);transform:scale(0);}

/* ===== HOME ===== */
.video-bg{position:fixed;inset:0;z-index:0;overflow:hidden;background:#000;}
.video-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 120% at 50% 45%,transparent 45%,rgba(0,0,0,.4) 100%);transition:background .45s;}
.video-bg.dimmed::after{background:rgba(0,0,0,.6);}   /* läuft weiter, nur abgedunkelt */
#videoBg video,#videoBg .hero-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
#videoBg .hero-fallback{z-index:1;transition:opacity .7s ease;}   /* deckt Video bis Wiedergabe – identischer cover-Ausschnitt, kein Resolution-Mismatch */
#videoBg.playing .hero-fallback{opacity:0;}
.play-btn{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:25;cursor:pointer;width:74px;height:74px;border:2px solid var(--asa-orange);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .3s ease;}
.play-btn:hover{width:90px;height:90px;box-shadow:0 0 32px rgba(235,85,5,.5);}
.play-btn::after{content:"";width:0;height:0;border-left:19px solid var(--asa-orange);border-top:12px solid transparent;border-bottom:12px solid transparent;margin-left:5px;}

/* Vertikaler Name – NUR Home */
.name-side{position:fixed;left:0;top:50%;transform:translateY(-50%);z-index:55;writing-mode:vertical-rl;text-orientation:mixed;padding:20px 16px;pointer-events:none;}
.name-side a{pointer-events:auto;text-decoration:none;}
.name{font-weight:700;color:var(--asa-orange);font-size:clamp(14px,7vh,72px);white-space:nowrap;line-height:1.1;letter-spacing:-1.5px;text-shadow:0 2px 20px rgba(0,0,0,.6);}
.name span{display:inline-block;}
.name span:not(.sp){animation:dropIn .7s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i) * .055s);}
@keyframes dropIn{from{opacity:0;transform:translateX(-80px);}to{opacity:1;transform:translateX(0);}}
.subtitle{margin-top:12px;color:var(--asa-orange);font-weight:400;font-size:clamp(11px,2vh,18px);white-space:nowrap;text-shadow:0 2px 15px rgba(0,0,0,.6);}

/* ===== CONTENT PAGES ===== */
.page{position:relative;z-index:10;min-height:100vh;min-height:100dvh;}
.page-head{max-width:1320px;margin:0 auto;padding:120px clamp(22px,6vw,90px) 10px;}
.page-head h1{color:var(--asa-orange);font-weight:700;font-size:clamp(.95rem,1.5vw,1.15rem);letter-spacing:.18em;text-transform:uppercase;}
.page-head p{color:var(--beige);margin-top:6px;font-size:.82rem;letter-spacing:.05em;text-transform:uppercase;opacity:.6;}

/* Filmblöcke – KEIN Zickzack: Bild links, Text rechts, größer */
/* Filmblöcke – KEIN Zickzack: Bild links, Text rechts. Hohe Bänder,
   abwechselnd schwarz, mit Innen-Raster (zentriert). Parallax via JS. */
.films{display:block;}
.film{padding:clamp(80px,17vh,210px) 0;overflow:hidden;}
.film:nth-child(odd){background:#1a1a1a;}
.film:nth-child(even){background:#000;}
.film-grid{max-width:1320px;margin:0 auto;padding:0 clamp(22px,6vw,90px);display:grid;grid-template-columns:1.12fr 1fr;align-items:center;gap:clamp(32px,5vw,80px);}
@media(max-width:780px){.film-grid{grid-template-columns:1fr;gap:26px;}.film{padding:clamp(50px,10vh,110px) 0;}}
.film-grid.textonly{grid-template-columns:1fr;}

.film-media{position:relative;cursor:pointer;overflow:hidden;background:#111;aspect-ratio:2/1;will-change:transform;}
.film-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s ease,filter .45s ease;}
.film-media:hover img{filter:brightness(.7);}
.film-media.static{cursor:default;}
.film-media.static:hover img{filter:none;}
.film-media .ov{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .35s ease;}
.film-media:hover .ov{opacity:1;}
.film-media .ov svg{width:58px;height:58px;}
.film-media.noimg{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#161616,#080808);}
.film-media.noimg .ov{display:none;}

.film-text{will-change:transform;}
.film-text h2{color:var(--asa-orange);font-weight:700;font-size:clamp(1.9rem,4.6vw,3.6rem);letter-spacing:-1px;line-height:1.02;}
.film-text .meta{color:var(--beige);font-size:clamp(.9rem,1.5vw,1.05rem);margin-top:16px;opacity:.5;}
.film-text .crew{color:var(--white);font-size:clamp(.85rem,1.35vw,1rem);margin-top:18px;line-height:1.7;white-space:pre-line;opacity:.94;}
.icons{display:flex;align-items:center;gap:30px;width:min(100%,360px);margin-top:34px;}
.icons .ico-info{margin-left:auto;}
.icons a{display:inline-flex;width:34px;height:34px;color:var(--asa-orange);opacity:.9;transition:opacity .2s,transform .2s;cursor:pointer;}
.icons a:hover{opacity:1;transform:translateY(-2px);}
.icons svg{width:100%;height:100%;}

/* Showreel-Variante: türkis, kein Info-Icon */
.film.showreel .film-text h2,.film.showreel .icons a{color:var(--asa-turquoise);}
.film.showreel .film-media .ov svg circle,.film.showreel .film-media .ov svg path{stroke:var(--asa-turquoise);fill:var(--asa-turquoise);}

/* Back-to-top */
.to-top{position:fixed;bottom:26px;right:26px;z-index:40;width:48px;height:48px;border-radius:50%;border:1px solid rgba(244,244,242,.3);background:rgba(0,0,0,.5);color:var(--white);cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s;}
.to-top.show{opacity:.85;pointer-events:auto;}
.to-top:hover{opacity:1;border-color:var(--asa-orange);color:var(--asa-orange);}

/* ===== MODAL ===== */
.modal{display:none;position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.82);align-items:center;justify-content:center;padding:20px;}
.modal.open{display:flex;animation:fade .3s ease;}
@keyframes fade{from{opacity:0;}to{opacity:1;}}
.modal-content{position:relative;width:100%;max-width:1040px;aspect-ratio:16/9;}
.modal-content iframe{width:100%;height:100%;border:0;display:block;background:#000;}
.modal-close{position:absolute;top:-48px;right:0;width:40px;height:40px;background:none;border:0;color:#fff;font-size:30px;cursor:pointer;opacity:.85;}
.modal-close:hover{opacity:1;}

@media(prefers-reduced-motion:reduce){
  .name span,.subtitle{animation:none!important;opacity:1!important;transform:none!important;}
  html{scroll-behavior:auto;}
  .film-media,.film-text{transform:none!important;}
}

/* ===== KONTAKT / IMPRESSUM – rechtsbündig, große orange Headings, Parallax ===== */
.contact{max-width:1100px;margin-left:auto;margin-right:0;padding:0 clamp(22px,6vw,90px) clamp(160px,38vh,360px);text-align:right;}
.contact-block{margin-top:clamp(80px,15vh,180px);will-change:transform;}
.contact-block:first-child{margin-top:clamp(20px,4vh,50px);}
.contact-block h2{color:var(--asa-orange);font-weight:700;font-size:clamp(1.9rem,4.6vw,3.6rem);letter-spacing:-1px;line-height:1.05;will-change:transform;}
.contact-block h2 a{color:inherit;text-decoration:none;}
.contact-block h2 a:hover{opacity:.85;}
.contact-block h2 .bvk{font-size:.42em;letter-spacing:.04em;opacity:.85;margin-left:.25em;vertical-align:.18em;}
.contact-block p,.contact-block .profile-links{color:var(--beige);font-size:clamp(.95rem,1.5vw,1.1rem);line-height:1.85;margin-top:22px;will-change:transform;}
.contact-block p a,.contact-block .profile-links a{color:var(--beige);text-decoration:none;transition:color .25s;}
.contact-block p a:hover,.contact-block .profile-links a:hover{color:var(--asa-orange);}
.contact-block.profiles .profile-links{display:flex;flex-direction:column;gap:8px;margin-top:52px;}
.contact-block .small{color:var(--beige);font-size:.85rem;line-height:1.65;opacity:.65;max-width:560px;margin-left:auto;}
@media(max-width:560px){.contact{padding-right:22px;}.contact-block{margin-top:80px;}}