/* ENDLICH DU V36 · 29.10.2026 · nur /v2 */
/* 1 Header: Blur hinter dem Text ohne Kante */
#hero .hero-head::before{inset:-70px -160px -60px!important;-webkit-backdrop-filter:blur(14px)!important;backdrop-filter:blur(14px)!important;-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 50%,rgba(0,0,0,.45) 75%,transparent 97%)!important;mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 50%,rgba(0,0,0,.45) 75%,transparent 97%)!important}
@media (max-width:767px){#hero .hero-head::before{inset:-50px -40px -40px!important}}
/* 2 Trailer-Thumbnail */
html body #hero #trailer-frame .trailer-art{background-image:url('/v2/neu/assets/v36/trailer-thumbnail-v36.webp')!important;background-size:cover!important;background-position:center!important}
/* 3 Logo-Band „Bekannt aus“ läuft wieder */
/* V36 · „Bekannt aus“ wieder als Laufband */
#hero .known-from .press-marquee{overflow:hidden!important;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)!important;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)!important}
#hero .known-from .press-marquee .logo-marquee-track{width:max-content!important;justify-content:flex-start!important;transform:none;animation:v36-logo-move 40s linear infinite!important}
@keyframes v36-logo-move{from{translate:0 0}to{translate:-50% 0}}
@media (max-width:767px){#hero .known-from .press-marquee .logo-marquee-track{animation-duration:30s!important}}
@media (prefers-reduced-motion:reduce){#hero .known-from .press-marquee .logo-marquee-track{animation:none!important}}
#hero .known-from .press-marquee .logo-marquee-track>*{width:max-content!important;max-width:none!important;flex:0 0 auto!important;flex-wrap:nowrap!important;justify-content:flex-start!important;padding-right:34px!important}
#hero .known-from img[alt="Galileo"]{transform:scale(2.3)}
#hero .known-from .press-logo:has(img[alt="Galileo"]){margin:0 34px!important}
/* 4 Zeitreise-Filmstreifen laufen */
/* V36 · Zeitreise-Filmstreifen wieder als laufendes Karussell */
.evo-strip .evo-track{display:flex!important;grid-template-columns:none!important;width:max-content!important;gap:12px!important;animation:evo-move 40s linear infinite!important}
.evo-strip.evo-r .evo-track{animation-direction:reverse!important}
.evo-strip .evo-frame{display:block!important;flex:0 0 auto!important;width:184px!important}
.evo-strip .evo-frame.is-ph{display:none!important}
@media (max-width:767px){.evo-strip .evo-track{gap:6px!important;animation-duration:30s!important}.evo-strip .evo-frame{width:124px!important}}
@media (prefers-reduced-motion:reduce){.evo-strip .evo-track{animation:none!important}}
/* 5 Prolog-Collage */
/* V36 · Prolog: Entwicklungs-Collage, Zickzack rechts vom Text */
#der-anfang .prologue-collage{display:block!important;grid-template-columns:none!important;position:relative;height:auto!important;min-height:0!important}
.v36-evo{position:relative;display:flex;flex-direction:column;padding:6px 0}
.v36-era{position:relative;width:74%;height:230px}
.v36-era:nth-child(odd){align-self:flex-end}      /* 1. Kind ist die Linie, daher odd = 2./4. Etappe rechts */
.v36-era:nth-child(even){align-self:flex-start}
.v36-era + .v36-era{margin-top:-46px}
.v36-line{display:none}
.v36-tag{position:absolute;z-index:6;top:-4px;left:-6px;display:inline-flex;align-items:center;gap:8px;padding:6px 13px 6px 6px;border-radius:999px;background:#fff;font:800 .66rem/1 Montserrat,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#3b2a36;box-shadow:0 8px 20px rgba(60,25,45,.14)}
.v36-tag b{display:inline-grid;place-items:center;min-width:24px;height:24px;border-radius:999px;background:linear-gradient(100deg,#8a4f7a,#d4577a 55%,#ec8f3e);color:#fff;font-size:.62rem;letter-spacing:0}
.v36-print{position:absolute;margin:0;padding:7px 7px 22px;background:#fff;border-radius:3px;box-shadow:0 18px 38px rgba(60,25,45,.22);transition:transform .5s ease}
.v36-print img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:1px}
.v36-era .p1{width:72%;left:0;top:26px;z-index:3;transform:rotate(-3deg)}
.v36-era .p2{width:42%;right:0;top:0;z-index:2;transform:rotate(4deg)}
.v36-era .p3{width:40%;right:-4%;bottom:-6px;z-index:4;transform:rotate(-2deg)}
.v36-era:nth-child(odd) .p1{left:auto;right:0;transform:rotate(2.5deg)}
.v36-era:nth-child(odd) .p2{right:auto;left:0;transform:rotate(-3.5deg)}
.v36-era:nth-child(odd) .p3{right:auto;left:-4%;transform:rotate(2deg)}
.v36-era:nth-child(odd) .v36-tag{left:auto;right:-6px}
.v36-era.three{height:270px}
.v36-era.solo .p1{width:84%;left:8%;right:auto;top:6px}
.v36-era.solo{height:200px}
.era-1 img{filter:sepia(.45) saturate(.82) contrast(1.04)}
.era-2 img{filter:sepia(.18) saturate(.92)}
.era-3 img{filter:sepia(.06)}
.v36-print:hover{transform:rotate(0) scale(1.05)!important;z-index:7}
@media(max-width:767px){
  #der-anfang .prologue-collage{margin-top:26px}
  .v36-era{width:86%;height:200px}.v36-era.three{height:240px}.v36-era.solo{height:185px}
  .v36-era + .v36-era{margin-top:-30px}
  .v36-print{padding:5px 5px 16px}
}
.v36-era + .v36-era{margin-top:-28px}
.v36-era:nth-child(odd) .p2{top:auto!important;bottom:-14px;left:-8%!important;z-index:4;width:40%}
.v36-era.three:nth-child(odd) .p3{left:auto!important;right:-6%!important;top:-18px;bottom:auto;z-index:1;width:38%}
@media(max-width:767px){.v36-era + .v36-era{margin-top:-14px}}
/* Heute: Label unten rechts, Bühnenbild grösser unten links */
.era-4{height:270px!important}
.era-4 .v36-tag{top:auto!important;bottom:-8px!important;right:-6px!important;left:auto!important}
.era-4 .p2{width:54%!important;bottom:-22px!important;left:-10%!important}
@media(max-width:767px){.era-4{height:235px!important}}
/* 6 Vier Kapitel */
/* V36 · Vier Kapitel: Originalhelligkeit + farbige Filmrollen links/rechts */
#was-dich-erwartet .film-photo{background:#1c141b!important;border-radius:12px!important;overflow:hidden!important}
#was-dich-erwartet .film-photo::before{filter:none!important;inset:0 30px!important}
#was-dich-erwartet .film-photo::after{content:""!important;inset:0!important;background:
  repeating-linear-gradient(180deg,transparent 0 7px,var(--hole,#f0a36a) 7px 17px,transparent 17px 26px) left 9px top 0/12px 100% no-repeat,
  repeating-linear-gradient(180deg,transparent 0 7px,var(--hole,#f0a36a) 7px 17px,transparent 17px 26px) right 9px top 0/12px 100% no-repeat,
  linear-gradient(#1c141b,#1c141b) left 0 top 0/30px 100% no-repeat,
  linear-gradient(#1c141b,#1c141b) right 0 top 0/30px 100% no-repeat!important;
  -webkit-mask-image:linear-gradient(180deg,#000,#000);
  pointer-events:none!important}
/* Lochfarbe im Kampagnenverlauf, von Plum oben zu Orange unten */
#was-dich-erwartet .film-photo{--hole:#e8794a}
#was-dich-erwartet .film-photo::after{filter:none}
#was-dich-erwartet .story-feature:nth-child(2) .film-photo{--photo:url('/v2/neu/assets/v36/kapitel2-nah.webp')!important}
/* Eingebrannte schwarze Balken der Film-Stills wegzoomen, dann überall gleicher Rand */
#was-dich-erwartet .story-feature:not(:nth-child(2)) .film-photo::before{transform:scale(1.32)!important}
#was-dich-erwartet .film-photo{box-shadow:inset 0 10px 0 #1c141b,inset 0 -10px 0 #1c141b,0 26px 60px rgba(29,20,32,.18)!important}
#was-dich-erwartet .film-photo::after{box-shadow:inset 0 10px 0 #1c141b,inset 0 -10px 0 #1c141b!important}
/* 7 Papa-Sektion */
/* V36 · Papa-Sektion: drei Abzüge, drei Lebensphasen */
#sein-vater .father-art{position:relative!important;display:block!important;min-height:0!important;height:auto!important;aspect-ratio:auto!important;background:none!important}
#sein-vater .father-art>*:not(.v36-papa){display:none!important}
.v36-papa{position:relative;height:520px}
.v36-papa .v36-print{position:absolute;margin:0;padding:8px 8px 30px;background:#fff;border-radius:3px;box-shadow:0 20px 44px rgba(60,25,45,.24);transition:transform .5s ease}
.v36-papa img{display:block;width:100%;object-fit:cover;border-radius:1px}
.v36-papa figcaption{position:absolute;left:12px;bottom:7px;font:700 .62rem/1 Montserrat,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8a4f7a}
.v36-papa .pa1{width:66%;left:0;top:0;transform:rotate(-3deg);z-index:1}
.v36-papa .pa1 img{aspect-ratio:16/10;object-position:center 30%;filter:sepia(.3) saturate(.9)}
.v36-papa .pa2{width:38%;right:0;top:70px;transform:rotate(4deg);z-index:3}
.v36-papa .pa2 img{aspect-ratio:4/5;object-position:center 20%;filter:sepia(.12)}
.v36-papa .pa3{width:58%;left:10%;bottom:0;transform:rotate(1.5deg);z-index:2}
.v36-papa .pa3 img{aspect-ratio:16/9;object-position:center 40%}
.v36-papa .v36-print:hover{transform:rotate(0) scale(1.04);z-index:5}
@media(max-width:767px){
  .v36-papa{height:400px;margin-bottom:24px}
  .v36-papa .v36-print{padding:6px 6px 22px}
  .v36-papa .pa2{top:50px}
}
.v36-papa{height:480px}
.v36-papa .pa3{left:14%;bottom:10px}
@media(max-width:767px){
  .v36-papa{height:330px}
  .v36-papa .pa1{width:70%}
  .v36-papa .pa2{width:40%;top:46px}
  .v36-papa .pa3{width:64%;left:8%;bottom:0}
}
.v36-papa .v36-print{padding-bottom:8px!important}@media(max-width:767px){.v36-papa .v36-print{padding-bottom:6px!important}}
.v36-papa .v36-print{padding:9px 9px 38px!important}@media(max-width:767px){.v36-papa .v36-print{padding:6px 6px 26px!important}}
.v36-papa .v36-print{box-shadow:0 2px 4px rgba(40,15,30,.18),0 14px 28px rgba(40,15,30,.30),0 30px 60px rgba(40,15,30,.22)!important}.v36-papa .pa2,.v36-papa .pa3{box-shadow:-6px 4px 10px rgba(40,15,30,.28),0 18px 34px rgba(40,15,30,.38),0 34px 70px rgba(40,15,30,.26)!important}
/* Sanftes Schweben der Abzüge */
@keyframes v36-float{0%,100%{translate:0 0;rotate:0deg}50%{translate:0 -6px;rotate:.9deg}}
.v36-papa .pa1{animation:v36-float 11s ease-in-out infinite}
.v36-papa .pa2{animation:v36-float 9.5s ease-in-out -3s infinite reverse}
.v36-papa .pa3{animation:v36-float 12.5s ease-in-out -6s infinite}
.v36-papa .v36-print:hover{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.v36-papa .v36-print{animation:none!important}}
/* 8 Personen */
/* V36 · Personen: Person scharf, Hintergrund unscharf & entsättigt, Hover = farbiger Hintergrund + Anheben */
#menschen .human-media::after{display:none!important}
#menschen .human-media{position:relative!important;isolation:isolate;background:radial-gradient(ellipse 70% 85% at 50% 35%,rgba(185,180,183,.52) 0%,rgba(150,145,149,.40) 60%,rgba(115,110,116,.30) 100%)!important}
#menschen .human-media::before{content:""!important;display:block!important;position:absolute!important;inset:0!important;z-index:0!important;opacity:0;transition:opacity .6s ease!important;background:linear-gradient(120deg,rgba(160,118,148,.92) 0%,rgba(190,132,128,.9) 50%,rgba(214,162,120,.92) 100%)!important}
#menschen .human-media img{position:relative!important;z-index:1!important;filter:none!important}
#menschen .human-card{background:#2f2f33!important;transition:transform .45s ease,box-shadow .45s ease!important}
#menschen .human-card:hover{transform:translateY(-8px)!important;box-shadow:0 26px 50px rgba(10,8,12,.45)!important}
#menschen .human-card:hover .human-media::before{opacity:1}
@media (hover:none){#menschen .human-card:hover{transform:none!important}}
/* Hover: Karte wächst leicht nach allen Seiten, Person kommt minimal nach vorne */
#menschen .human-card:hover{transform:translateY(-6px) scale(1.035)!important;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 30px 60px rgba(10,8,12,.5)!important;z-index:2}
#menschen .human-media img{transition:transform .5s ease!important;transform-origin:50% 100%}
#menschen .human-card:hover .human-media img{transform:scale(1.05)}
/* 9 Konfetti bei „Was am Ende bleibt“ */
#aufruf{position:relative}
#aufruf .v36-confetti{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:30}
/* Logos im Header statisch */
#hero .known-from .press-marquee{overflow:visible!important;-webkit-mask-image:none!important;mask-image:none!important}
#hero .known-from .press-marquee .logo-marquee-track{animation:none!important;translate:none!important;transform:none!important;width:100%!important;justify-content:center!important}
#hero .known-from .press-marquee .logo-marquee-track>*{width:100%!important;flex:1 1 100%!important;flex-wrap:wrap!important;justify-content:center!important;gap:20px 28px!important;padding-right:0!important}
#hero .known-from .press-marquee .logo-marquee-track>[aria-hidden="true"]{display:none!important}
