/* Dienstleistungszentrum Markusstraße 12 · gemeinsame Gestaltung */
:root{
  --bg:#F4F2EE; --paper:#FBFAF8; --ink:#1B2226; --ink-2:#3A4348; --muted:#626B70; --line:#DDD8CF;
  --accent:#2F6A5B; --accent-2:#245447; --accent-soft:#E2ECE7; --dark:#141C1A; --dark-2:#1E2926;
  --r:18px; --r-sm:12px; --pad:clamp(20px,5vw,72px); --max:1240px;
  --sans:'Manrope',system-ui,-apple-system,Segoe UI,sans-serif; --head:'Plus Jakarta Sans',var(--sans);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{-webkit-tap-highlight-color:transparent;background:var(--bg);color:var(--ink);font:400 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}

/* Typo */
.eyebrow{font:600 12px/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.h1{font:500 clamp(40px,6.4vw,92px)/1.02 var(--head);letter-spacing:-.035em}
.h2{font:500 clamp(32px,4.4vw,60px)/1.06 var(--head);letter-spacing:-.03em}
.h3{font:500 clamp(22px,2.2vw,28px)/1.2 var(--head);letter-spacing:-.015em}
.h1 em,.h2 em,.h3 em{font-style:normal;color:var(--accent)}
.lead{font-size:clamp(18px,1.5vw,21px);line-height:1.6;color:var(--ink-2);max-width:60ch}
.muted{color:var(--muted)}
.num{font-variant-numeric:tabular-nums}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:10px;height:50px;padding:0 22px;border-radius:999px;font:600 15px/1 var(--sans);text-decoration:none;transition:background .25s,color .25s,transform .25s,border-color .25s;white-space:nowrap}
.btn svg{width:14px;height:14px;transition:transform .25s}
.btn:hover svg{transform:translate(2px,-2px)}
.btn-accent{background:var(--accent);color:#fff}
.btn-accent:hover{background:var(--accent-2)}
.btn-line{border:1px solid currentColor}
.btn-line:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn-white{background:#fff;color:var(--ink)}

/* Navigation */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px var(--pad);padding-top:max(18px,env(safe-area-inset-top));transition:background .35s,color .35s,box-shadow .35s,padding .35s;color:#fff}
.nav.solid{background:rgba(251,250,248,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:var(--ink);box-shadow:0 1px 0 var(--line);padding-top:12px;padding-bottom:12px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand-mark{width:40px;height:40px;flex:none;overflow:visible}
.brand-mark .roof{stroke:#8FCBB3;transition:stroke .35s}
.nav.solid .brand-mark .roof{stroke:#2F6A5B}
.brand-mark text{font:600 25px var(--head);letter-spacing:-1px;fill:#fff}
.brand-txt{font:600 15px/1.15 var(--head);letter-spacing:-.01em}
.brand-txt small{display:block;font:500 12px/1.3 var(--sans);opacity:.75;letter-spacing:.02em}
.nav-links{display:flex;align-items:center;gap:28px;font:500 15px/1 var(--sans)}
.nav-links a{text-decoration:none;opacity:.85}
.nav-links a:hover{opacity:1}
.nav .btn{height:44px}
.nav:not(.solid) .btn-line{border-color:rgba(255,255,255,.7)}
@media (max-width:900px){.nav-links a:not(.btn){display:none}.brand-txt small{display:none}}

/* Scroll-Film (Hero) */
.track{position:relative;height:520vh;background:var(--dark)}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.stage .poster,.stage .film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.stage .film{opacity:0;transition:opacity .4s}
.stage .film.ready{opacity:1}
.stage .shade{position:absolute;inset:0;background:radial-gradient(120% 70% at 0% 100%,rgba(9,14,12,.72) 0%,rgba(9,14,12,.35) 45%,rgba(9,14,12,0) 70%),linear-gradient(180deg,rgba(9,14,12,.5) 0%,rgba(9,14,12,0) 24%,rgba(9,14,12,0) 50%,rgba(9,14,12,.55) 100%);pointer-events:none}
.stage .veil{position:absolute;inset:0;background:rgba(10,16,14,.38);opacity:0;pointer-events:none}
.fcopy{position:absolute;left:var(--pad);right:var(--pad);color:#fff;opacity:0;will-change:opacity,transform;pointer-events:none}
.fcopy.live{pointer-events:auto}
.fcopy{max-width:min(820px,calc(100% - 2*var(--pad)));isolation:isolate}
.fcopy::before{content:"";position:absolute;inset:-90px -140px -90px -260px;background:radial-gradient(closest-side,rgba(8,13,11,.62),rgba(8,13,11,.32) 55%,rgba(8,13,11,0));z-index:-1;pointer-events:none}
.fcopy .eyebrow{color:#CFE3DA}
.fcopy p{max-width:46ch;font-size:clamp(17px,1.4vw,20px);line-height:1.55;color:rgba(255,255,255,.88);margin-top:18px}
.fcopy .h1,.fcopy .h2{text-shadow:0 2px 30px rgba(0,0,0,.25)}
.f-bottom{bottom:clamp(40px,9vh,96px)}
.f-mid{top:50%;transform:translateY(-50%)}
.f-top{top:clamp(110px,16vh,170px)}
.scroll-hint{position:absolute;right:calc(var(--pad) + 22px);bottom:clamp(40px,9vh,96px);color:#fff;font:500 12px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:10px;opacity:.85}
.scroll-hint i{width:1px;height:38px;background:linear-gradient(#fff,transparent);animation:hint 1.8s ease-in-out infinite}
@keyframes hint{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.flight-prog{position:absolute;right:var(--pad);bottom:clamp(40px,9vh,96px);width:2px;height:120px;background:rgba(255,255,255,.25);border-radius:2px;overflow:hidden}
.flight-prog i{position:absolute;inset:0;background:#fff;transform-origin:top;transform:scaleY(0)}
.chip{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 14px;border-radius:999px;font:600 13px/1 var(--sans);background:rgba(255,255,255,.14);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;border:1px solid rgba(255,255,255,.28)}
.chip i{width:8px;height:8px;border-radius:50%;background:#7FD3B2;box-shadow:0 0 0 4px rgba(127,211,178,.25)}

/* Abschnitte */
section{position:relative}
.sec{padding:clamp(88px,12vw,160px) 0}
.sec-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:end;margin-bottom:clamp(40px,6vw,72px)}
.sec-head .eyebrow{margin-bottom:18px}
@media (max-width:860px){.sec-head{grid-template-columns:1fr}}
.dark{background:var(--dark);color:#EDEFEC}
.dark .lead,.dark .muted{color:rgba(237,239,236,.72)}
.dark .eyebrow{color:#8FCBB3}
.dark .h2 em{color:#8FCBB3}
.paper{background:var(--paper)}

/* Kennzahlen */
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line)}
.fact{padding:26px 22px 4px 0}
.fact+.fact{padding-left:22px;border-left:1px solid var(--line)}
.fact b{display:block;font:500 clamp(28px,3vw,40px)/1.05 var(--head);letter-spacing:-.03em}
.fact span{display:block;margin-top:8px;font-size:15px;color:var(--muted);line-height:1.4}
@media (max-width:760px){.facts{grid-template-columns:repeat(2,minmax(0,1fr))}.fact:nth-child(3){padding-left:0;border-left:0}.fact:nth-child(n+3){border-top:1px solid var(--line)}}

/* Einblenden */
.rv{opacity:0;transform:translateY(24px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* Film-Lightbox */
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(8,12,11,.92);display:none;align-items:center;justify-content:center;padding:clamp(16px,4vw,48px)}
.lightbox.open{display:flex}
.lightbox video{width:min(1280px,100%);max-height:86vh;border-radius:var(--r-sm);background:#000}
.lightbox .x{position:absolute;top:18px;right:18px;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:26px;line-height:48px;text-align:center}

/* Footer */
.foot{background:var(--dark);color:rgba(237,239,236,.7);padding:56px 0 40px;font-size:15px}
.foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px}
.foot a{text-decoration:none}
.foot a:hover{color:#fff}

/* Mobil */
.brand-txt{white-space:nowrap}
@media (max-width:560px){
  .nav{padding:12px 16px;gap:10px}
  .brand-mark{width:36px;height:36px}
  .brand-txt{font-size:14px}
  .nav .btn{height:40px;padding:0 15px;font-size:13.5px}
  .nav .btn svg{display:none}
  .scroll-hint,.flight-prog{display:none}
  .fcopy::before{inset:-60px -40px -60px -120px}
}

/* Touch-Geräte: keine klebenden Hover-Effekte */
@media (hover:none){
  .btn:hover svg{transform:none}
  .btn-line:hover{background:transparent;color:inherit;border-color:currentColor}
}

/* Anflug: Wolkenphase, Höhenzähler, Adress-Pin, Luftbild-Quelle */
.stage .haze{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .6s;background:radial-gradient(ellipse 62% 48% at 32% 62%,rgba(255,255,255,.75) 0%,rgba(255,255,255,.35) 55%,rgba(255,255,255,0) 100%)}
.stage.on-sky .haze{opacity:1}
.stage.on-sky .shade{opacity:0}
.stage .shade{transition:opacity .6s}
.stage.on-sky .fcopy{color:var(--ink)}
.stage.on-sky .fcopy::before{display:none}
.stage.on-sky .fcopy .eyebrow{color:var(--accent)}
.stage.on-sky .fcopy p{color:var(--ink-2)}
.stage.on-sky .fcopy .h1{text-shadow:none}
.stage.on-sky .scroll-hint{color:var(--ink)}
.stage.on-sky .scroll-hint i{background:linear-gradient(var(--ink),transparent)}
.nav.on-sky:not(.solid){color:var(--ink)}
.nav.on-sky:not(.solid) .brand-mark .roof{stroke:#2F6A5B}
.c-geo .coords{font:600 12px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;opacity:.9;margin-bottom:14px}
.c-geo .alt{font:300 clamp(56px,8vw,124px)/.9 var(--head);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.c-geo .alt small{font-size:.3em;font-weight:500;letter-spacing:0;margin-left:.2em}
.c-geo h2{font:500 clamp(26px,3vw,42px)/1.1 var(--head);letter-spacing:-.02em;margin-top:14px}
.c-pin{left:50%!important;right:auto!important;top:clamp(90px,15vh,150px);width:max-content;max-width:none}
.c-pin::before{display:none}
.pin-card{display:flex;align-items:center;gap:12px;background:#fff;color:var(--ink);padding:10px 20px 10px 10px;border-radius:999px;box-shadow:0 14px 40px rgba(0,0,0,.28);font:600 15px/1.2 var(--sans);white-space:nowrap}
.pin-card i{width:32px;height:32px;border-radius:50%;background:var(--accent);display:grid;place-items:center;flex:none}
.pin-card i::after{content:"";width:9px;height:9px;border-radius:50%;background:#fff}
.pin-card small{display:block;font-weight:500;color:var(--muted);font-size:12.5px;margin-top:2px}
.pin-stem{width:2px;height:64px;margin:0 auto;background:linear-gradient(#fff,rgba(255,255,255,0))}
.lgl-credit{position:absolute;right:12px;bottom:10px;z-index:6;font:500 10.5px/1.3 var(--sans);color:rgba(255,255,255,.88);text-shadow:0 1px 4px rgba(0,0,0,.6);opacity:0;pointer-events:none}
@media (max-width:560px){.c-geo .alt{font-size:64px}.pin-card{font-size:14px}.lgl-credit{font-size:9.5px;right:8px;bottom:6px}}

/* Scroll-Hinweis mittig unten, gut sichtbar auch für ältere Besucher */
.scroll-cue{position:absolute;left:50%;bottom:clamp(22px,5vh,48px);transform:translateX(-50%);z-index:7;display:flex;align-items:center;gap:12px;padding:12px 20px 12px 14px;border-radius:999px;background:rgba(255,255,255,.92);color:var(--ink);font:600 15px/1.2 var(--sans);box-shadow:0 12px 36px rgba(20,28,26,.22);pointer-events:none;white-space:nowrap;transition:opacity .4s}
.scroll-cue svg{width:16px;height:16px;animation:cueArrow 1.6s ease-in-out infinite}
.sc-mouse{width:22px;height:34px;border:2px solid var(--ink);border-radius:12px;position:relative;flex:none}
.sc-mouse i{position:absolute;left:50%;top:6px;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:var(--accent);animation:cueWheel 1.6s ease-in-out infinite}
.sc-touch{display:none}
@media (hover:none){.sc-desk{display:none}.sc-touch{display:inline}.sc-mouse{border-radius:50%;width:26px;height:26px}.sc-mouse i{top:auto;bottom:4px;animation:cueSwipe 1.6s ease-in-out infinite}}
@keyframes cueWheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(10px);opacity:0}100%{opacity:0}}
@keyframes cueSwipe{0%{transform:translateY(0);opacity:1}70%{transform:translateY(-12px);opacity:0}100%{opacity:0}}
@keyframes cueArrow{0%,100%{transform:translateY(-2px)}50%{transform:translateY(3px)}}
@media (prefers-reduced-motion:reduce){.scroll-cue svg,.sc-mouse i{animation:none}}
@media (max-width:560px){.scroll-cue{font-size:14px;padding:10px 16px 10px 12px;bottom:max(18px,env(safe-area-inset-bottom))}}

.fcopy.f-first{bottom:clamp(110px,17vh,170px)}

/* ---------- Menü ---------- */
.burger{display:none;align-items:center;gap:10px;height:44px;padding:0 16px 0 14px;border-radius:999px;border:1px solid currentColor;font:600 14px/1 var(--sans);color:inherit}
.burger i{position:relative;width:18px;height:12px;display:block}
.burger i::before,.burger i::after,.burger i span{content:"";position:absolute;left:0;right:0;height:2px;border-radius:2px;background:currentColor}
.burger i::before{top:0}.burger i::after{bottom:0}
.nav:not(.solid):not(.on-sky) .burger{border-color:rgba(255,255,255,.7)}
.nav-links a.cur{opacity:1;text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
@media (max-width:1100px){.nav-links a:not(.btn){display:none}.burger{display:inline-flex}}
@media (max-width:560px){.nav .nav-links .btn{display:none}.burger{height:40px}}
.menu{position:fixed;inset:0;z-index:90;background:var(--dark);color:#EDEFEC;display:flex;flex-direction:column;padding:max(18px,env(safe-area-inset-top)) var(--pad) max(24px,env(safe-area-inset-bottom));opacity:0;visibility:hidden;transition:opacity .35s,visibility 0s .35s;overflow-y:auto}
.menu.open{opacity:1;visibility:visible;transition:opacity .35s}
.menu-top{display:flex;justify-content:space-between;align-items:center;min-height:60px}
.menu-top .brand{color:#fff}
.menu-x{width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.3);color:#fff;font-size:24px;line-height:46px;text-align:center}
.menu-grid{flex:1;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(28px,6vw,96px);align-items:center;padding:clamp(24px,5vh,56px) 0}
.menu-links{list-style:none}
.menu-links li{overflow:hidden}
.menu-links a{display:flex;align-items:baseline;gap:18px;text-decoration:none;font:500 clamp(30px,4.6vw,58px)/1.18 var(--head);letter-spacing:-.03em;padding:4px 0;color:#EDEFEC;transform:translateY(100%);transition:transform .6s cubic-bezier(.2,.7,.2,1),color .2s}
.menu.open .menu-links a{transform:none}
.menu-links li:nth-child(2) a{transition-delay:.04s}.menu-links li:nth-child(3) a{transition-delay:.08s}.menu-links li:nth-child(4) a{transition-delay:.12s}.menu-links li:nth-child(5) a{transition-delay:.16s}.menu-links li:nth-child(6) a{transition-delay:.2s}.menu-links li:nth-child(7) a{transition-delay:.24s}
.menu-links a small{font:600 12px/1 var(--sans);letter-spacing:.12em;color:#8FCBB3;min-width:24px}
.menu-links a:hover{color:#8FCBB3}
.menu-links .free{display:inline-flex;align-items:center;gap:7px;margin-left:6px;font:600 12px/1 var(--sans);letter-spacing:0;color:#0F1A17;background:#8FCBB3;padding:7px 10px;border-radius:999px;transform:translateY(-6px)}
.menu-side{border-left:1px solid rgba(255,255,255,.12);padding-left:clamp(20px,3vw,40px);display:grid;gap:22px;font-size:15.5px;color:rgba(237,239,236,.75)}
.menu-side b{display:block;font:600 11.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#8FCBB3;margin-bottom:10px}
.menu-side .row{display:flex;flex-wrap:wrap;gap:10px}
.menu-side .btn-line{color:#fff}
.menu-legal{display:flex;gap:22px;font-size:14px}
.menu-legal a{color:rgba(237,239,236,.6);text-decoration:none}
@media (max-width:820px){.menu-grid{grid-template-columns:1fr;align-items:start}.menu-side{border-left:0;padding-left:0;border-top:1px solid rgba(255,255,255,.12);padding-top:24px}}
html.menu-open{overflow:hidden}

/* ---------- Footer ---------- */
.foot{padding:clamp(56px,7vw,88px) 0 32px}
.foot .wrap{display:block}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px);padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.12)}
.foot-grid .brand{color:#fff;margin-bottom:16px}
.foot-grid p{max-width:34ch;line-height:1.6}
.foot-grid b{display:block;font:600 11.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#8FCBB3;margin-bottom:14px}
.foot-grid ul{list-style:none;display:grid;gap:9px}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:22px;font-size:13.5px;color:rgba(237,239,236,.5)}
.foot-bottom div{display:flex;gap:20px}
@media (max-width:860px){.foot-grid{grid-template-columns:1fr 1fr}.foot-grid>div:first-child{grid-column:1/-1}}
.nav .sm{display:none}
@media (max-width:560px){.nav .lg{display:none}.nav .sm{display:inline}}

/* ---------- Liquid Glass ---------- */
.glass{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,.16));-webkit-backdrop-filter:blur(18px) saturate(180%);backdrop-filter:blur(18px) saturate(180%);border:1px solid rgba(255,255,255,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),inset 0 -1px 0 rgba(255,255,255,.12),0 10px 30px rgba(10,18,16,.22)}
.glass::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(120% 80% at 20% 0%,rgba(255,255,255,.35),rgba(255,255,255,0) 55%)}
.nav.solid{background:rgba(251,250,248,.66);-webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);box-shadow:inset 0 -1px 0 rgba(27,34,38,.06),0 8px 24px rgba(20,28,26,.06)}
.scroll-cue{background:rgba(255,255,255,.66);-webkit-backdrop-filter:blur(18px) saturate(180%);backdrop-filter:blur(18px) saturate(180%);border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 12px 36px rgba(20,28,26,.2)}
.btn{transition:background .25s,color .25s,transform .12s ease-out,border-color .25s}
.btn:active{transform:scale(.97)}

/* ---------- Film-Reveal ---------- */
.film-reveal{position:relative;height:220vh;background:var(--paper)}
.fr-stage{position:sticky;top:0;height:100vh;height:100svh;display:grid;place-items:center;overflow:hidden}
.fr-card{--p:0;position:absolute;inset:0;overflow:hidden;background:#141C1A;
  clip-path:inset(calc((1 - var(--p)) * 14vh) calc((1 - var(--p)) * max(var(--pad), (100vw - var(--max)) / 2 + var(--pad))) round calc((1 - var(--p)) * 28px + 0px));will-change:clip-path}
.fr-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(calc(1.18 - var(--p) * .18));will-change:transform}
.fr-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,14,12,.15),rgba(9,14,12,.05) 40%,rgba(9,14,12,.65))}
.fr-copy{position:absolute;left:0;right:0;bottom:clamp(40px,10vh,110px);padding:0 max(var(--pad),calc((100vw - var(--max))/2 + var(--pad)));color:#fff;display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:24px}
.fr-copy .eyebrow{color:#CFE3DA;width:100%}
.fr-copy .h2{font-size:clamp(34px,5vw,72px);max-width:12ch;opacity:calc(.35 + var(--p) * .65);transform:translateY(calc((1 - var(--p)) * 24px))}
.fr-copy .h2 span{display:block;color:#CFE3DA}
.fr-play{display:inline-flex;align-items:center;gap:14px;height:64px;padding:0 26px 0 10px;border-radius:999px;color:#fff;font:600 16px/1 var(--sans);cursor:pointer;transition:transform .12s ease-out}
.fr-play:active{transform:scale(.97)}
.fr-play i{width:46px;height:46px;border-radius:50%;background:#fff;display:grid;place-items:center}
.fr-play svg{width:18px;height:18px;margin-left:3px;fill:var(--ink)}
.fr-card{--p-copy:0}
@media (max-width:760px){.film-reveal{height:180vh}.fr-card{clip-path:inset(calc((1 - var(--p)) * 18vh) calc((1 - var(--p)) * 16px) round calc((1 - var(--p)) * 22px))}.fr-play{height:56px;font-size:15px}}

/* ---------- Bild-Reveal ---------- */
[data-reveal]{--r:0;overflow:hidden}
[data-reveal]>img{clip-path:inset(calc((1 - var(--r)) * 18%) calc((1 - var(--r)) * 10%) round calc((1 - var(--r)) * 40px));transform:scale(calc(1.16 - var(--r) * .16));will-change:transform,clip-path}

@media (prefers-reduced-motion:reduce){
  .film-reveal{height:auto}.fr-stage{position:relative;height:auto;aspect-ratio:16/9}.fr-card{clip-path:none!important}.fr-video{transform:none!important}.fr-copy .h2{opacity:1;transform:none}
  [data-reveal]>img{clip-path:none!important;transform:none!important}
}
@media (prefers-reduced-transparency:reduce){
  .glass,.nav.solid,.scroll-cue{background:rgba(251,250,248,.97);-webkit-backdrop-filter:none;backdrop-filter:none}
  .fr-play.glass{background:#1B2226}
}