.film{position:relative;height:900vh}.film-klebe{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}.film-bild{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.film-teil{position:absolute;z-index:5;opacity:0;visibility:hidden;transition:opacity .6s,transform .8s,visibility 0s .6s}.film-teil.an{opacity:1;visibility:visible;transition:opacity .6s,transform .8s,visibility 0s}.film-vorspann{inset:0;display:grid;place-content:center;text-align:center;gap:22px;padding:0 16px}.film-akt{left:clamp(16px,5vw,72px);top:50%;transform:translateY(-40%);max-width:430px}.film-akt.an{transform:translateY(-50%)}.film-ende{inset:0;display:flex;flex-direction:column;justify-content:center;padding:0 clamp(16px,5vw,72px);max-width:640px}.film-hud{left:clamp(16px,5vw,72px);right:clamp(16px,5vw,72px);bottom:22px;display:flex;gap:26px;pointer-events:none;transition:opacity .4s}.film-hud,.film-leiste{position:absolute;z-index:6}.film-leiste{left:0;right:0;bottom:0;height:3px;background:rgba(13,42,82,.08)}.film-leiste i{display:block;height:100%;transform-origin:left;transform:scaleX(var(--p,0));background:linear-gradient(90deg,#6fa6dc,#1f5fbf,#0d2a52)}.film-weiter{right:clamp(16px,4vw,40px);top:84px}.film-scroll,.film-weiter{position:absolute;z-index:7}.film-scroll{left:50%;bottom:64px;display:flex;align-items:center;gap:12px;padding:10px 18px 10px 12px;white-space:nowrap;border:0;border-radius:999px;background:#0d2a52;color:#fff;cursor:pointer;opacity:0;visibility:hidden;transform:translate(-50%,12px);transition:opacity .5s .3s,transform .5s .3s,visibility 0s .8s;box-shadow:0 14px 30px -16px rgba(13,42,82,.45)}.film-scroll.an{opacity:1;visibility:visible;transform:translate(-50%);transition:opacity .6s .6s,transform .6s .6s,visibility 0s}.film-scroll:hover{background:#1f5fbf}.film-scroll:focus-visible{outline:3px solid #1f5fbf;outline-offset:3px}.film-maus{position:relative;width:22px;height:34px;border:2px solid #fff;border-radius:12px;flex:none}.film-maus i{position:absolute;left:50%;top:6px;width:4px;height:7px;margin-left:-2px;border-radius:2px;background:#9cc7f2;animation:film-rad 1.6s ease-in-out infinite}.film-pfeil{display:none;font-size:18px;animation:film-schweben 1.4s ease-in-out infinite}@keyframes film-rad{0%{opacity:0;transform:translateY(-2px)}30%{opacity:1}80%{opacity:0;transform:translateY(10px)}to{opacity:0}}@media (hover:none),(max-width:1099px){.film-maus{display:none}.film-pfeil{display:inline-block}}@media (max-width:1099px){.film-scroll{bottom:auto;top:132px;padding:10px 16px;font-size:11px}}@media (prefers-reduced-motion:reduce){.film-maus i,.film-pfeil{animation:none}}:root[data-ruhig] .film-scroll{display:none}.film-hinweis{animation:film-schweben 2s ease-in-out infinite}@keyframes film-schweben{50%{transform:translateY(8px)}}@media (max-width:1099px){.film{height:760vh}.film-akt{top:auto;bottom:64px;left:12px;right:12px;transform:translateY(20px);max-width:none}.film-akt.an{transform:none}.film-ende{justify-content:flex-end;padding-bottom:72px}}:root[data-ruhig] .film{height:auto}:root[data-ruhig] .film-klebe{position:relative;height:auto;overflow:visible}:root[data-ruhig] .film-bild{position:relative;height:72vh}:root[data-ruhig] .film-hud,:root[data-ruhig] .film-leiste,:root[data-ruhig] .film-weiter{display:none}:root[data-ruhig] .film-akte{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;padding:32px clamp(16px,4vw,40px);max-width:1240px;margin:0 auto}:root[data-ruhig] .film-teil{position:static;opacity:1;visibility:visible;transform:none;max-width:none}:root[data-ruhig] .film-ende{padding:0 clamp(16px,4vw,40px) 48px;max-width:1240px;margin:0 auto}.film-vorspann{background:radial-gradient(1200px 700px at 75% 20%,#fff7e8 0,transparent 60%),linear-gradient(180deg,#f7fbff,#eaf4ff);display:block;text-align:left}.film-held{height:100%;max-width:1320px;margin:0 auto;padding:96px clamp(16px,4vw,40px) 48px;display:grid;grid-template-columns:1.15fr 1fr;gap:40px;align-items:center}.film-collage{position:relative;height:min(66vh,600px)}.film-beispiel{position:absolute;left:0;right:0;top:0;z-index:4;text-align:center;font-family:var(--font-mono);font-size:13px;letter-spacing:.06em;color:var(--color-nacht-2)}.film-beispiel i{font-size:17px;letter-spacing:0;color:var(--color-nacht)}.c-shirt{position:absolute;left:-2%;top:16%;width:46%;transform:rotate(-6deg)}.c-rahmen{position:absolute;left:30%;top:8%;width:42%;z-index:2;transform:rotate(1.5deg)}.c-tasse{position:absolute;right:2%;bottom:8%;width:34%;z-index:3}.film-hinweis-knopf span{display:inline-block;animation:film-schweben 2s ease-in-out infinite}@media (max-width:1099px){.film-held{grid-template-columns:1fr;gap:20px;padding-top:84px;align-content:start;overflow:hidden}.film-collage{height:min(40vh,340px);order:-1;max-width:460px;width:100%;margin:0 auto}.film-beispiel{font-size:11px;white-space:nowrap}.film-beispiel i{font-size:14px}.c-shirt{top:18%;width:44%}.c-rahmen{top:11%;width:40%}.c-tasse{bottom:0;width:32%}}:root[data-ruhig] .film-vorspann{position:relative;display:block;min-height:100vh}