/* ============================================================
   ciMis 3.0 - Buehne (cimis3_stage.php)
   Feste Buehne 1920x1080 (quer) bzw. 1080x1920 (hoch), per transform
   auf das Fenster skaliert. Was die Vorschau zeigt, zeigt der Bildschirm.
   Farben und Schrift kommen NUR aus dem Design (data-theme).
   ============================================================ */

@font-face{font-family:'Jost';src:url('../fonts/cimis3/jost.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Inter';src:url('../fonts/cimis3/inter.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Playfair Display';src:url('../fonts/cimis3/playfair-display.woff2') format('woff2');font-weight:400 900;font-display:swap}
@font-face{font-family:'Manrope';src:url('../fonts/cimis3/manrope.woff2') format('woff2');font-weight:200 800;font-display:swap}
@font-face{font-family:'Rajdhani';src:url('../fonts/cimis3/rajdhani.woff2') format('woff2');font-weight:300 700;font-display:swap}
@font-face{font-family:'Fraunces';src:url('../fonts/cimis3/fraunces.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Poiret One';src:url('../fonts/cimis3/poiret-one.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url('../fonts/cimis3/space-grotesk.woff2') format('woff2');font-weight:300 700;font-display:swap}
@font-face{font-family:'Anton';src:url('../fonts/cimis3/anton.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Familjen Grotesk';src:url('../fonts/cimis3/familjen-grotesk.woff2') format('woff2');font-weight:400 700;font-display:swap}
@font-face{font-family:'Nunito';src:url('../fonts/cimis3/nunito.woff2') format('woff2');font-weight:200 900;font-display:swap}
/* Schrift der Thekentafel (Thomas 16.10.2026: klar lesbar, etwas gestaucht, keine Serifen) */
@font-face{font-family:'Fira Sans Condensed';src:url('../fonts/cimis3/fira-sans-condensed-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Fira Sans Condensed';src:url('../fonts/cimis3/fira-sans-condensed-500.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Fira Sans Condensed';src:url('../fonts/cimis3/fira-sans-condensed-700.woff2') format('woff2');font-weight:700;font-display:swap}

/* ---------- Designs ---------------------------------------------------
   --ink Hintergrund, --ink2 Flaeche, --accent Marke, --glow Akzent fuer
   Schrift/Linien, --paper helle Schrift, --muted Nebentext, --deep tiefer Ton,
   --on-accent Schrift AUF der Akzentflaeche, --display Schrift, --tw Titelgewicht,
   --ts Titel-Laufweite, --tt Gross-/Kleinschreibung des Titels.
   Werte 1:1 aus den Premium-Designs (docs/newsletter-premium/design-*.html).
   ---------------------------------------------------------------------- */
[data-theme]{--glow:var(--accent);--on-accent:#14161a;--tw:700;--ts:-.01em;--tt:none;--radius:18px}
[data-theme="velours"]     {--ink:#131417;--ink2:#191b20;--accent:#fbd47a;--paper:#f1ece1;--muted:#a8a49b;--deep:#4b4434;--display:'Jost'}
[data-theme="lumiere"]     {--ink:#15130f;--ink2:#211e18;--accent:#d8ad45;--paper:#f3ead9;--muted:#b9ad99;--deep:#493d22;--display:'Playfair Display';--radius:6px}
[data-theme="cleany"]      {--ink:#06122b;--ink2:#0a1a3a;--accent:#4f8ef7;--paper:#eef3fc;--muted:#9db0d4;--deep:#1f4076;--display:'Manrope';--on-accent:#fff;--tw:800}
[data-theme="nocturne"]    {--ink:#070c16;--ink2:#0e1626;--accent:#22d3ee;--paper:#e6edf7;--muted:#93a4c0;--deep:#124052;--display:'Rajdhani';--tt:uppercase;--ts:.02em;--radius:4px}
[data-theme="mirage"]      {--ink:#080714;--ink2:#141433;--accent:#7ab6ff;--paper:#eaeaf7;--muted:#a7a6cc;--deep:#2a3860;--display:'Fraunces';--tw:600}
[data-theme="palast"]      {--ink:#0b1712;--ink2:#12261c;--accent:#d2ab5f;--paper:#f5ecd8;--muted:#9fb0a4;--deep:#3c432b;--display:'Poiret One';--tw:400;--ts:.02em;--radius:4px}
[data-theme="vitre"]       {--ink:#17181c;--ink2:#212329;--accent:#f0a63c;--paper:#edece9;--muted:#a4a3a0;--deep:#4f402d;--display:'Manrope';--tw:800}
[data-theme="kinetik"]     {--ink:#171412;--ink2:#221e1a;--accent:#ff3b1f;--paper:#f4f1ea;--muted:#b9b9b8;--deep:#5f594f;--display:'Anton';--on-accent:#fff;--tw:400;--tt:uppercase;--ts:.01em;--radius:0px}
[data-theme="cinerama"]    {--ink:#121212;--ink2:#1c1c1c;--accent:#e5352b;--paper:#f6f4f0;--muted:#a8a5a0;--deep:#401a18;--display:'Space Grotesk';--on-accent:#fff;--radius:8px}
[data-theme="lichtspiele"] {--ink:#2a1e14;--ink2:#3c2c1d;--accent:#cf4b2c;--paper:#fdf6e6;--muted:#c3b9aa;--deep:#7c6750;--display:'Nunito';--on-accent:#fff;--tw:800;--radius:26px}
[data-theme="aurora"]      {--ink:#1f242b;--ink2:#2a3039;--accent:#0f7a6d;--glow:#2ec4ad;--paper:#f9f7f3;--muted:#bcbdbf;--deep:#5d6570;--display:'Familjen Grotesk';--on-accent:#fff}
[data-theme="standard"]    {--ink:#14161a;--ink2:#1e2128;--accent:#E95D0F;--glow:#ff7a33;--paper:#f2f3f5;--muted:#9aa1ac;--deep:#4a3a2c;--display:'Inter';--on-accent:#fff;--tw:800}

/* ---------- Buehne ---------------------------------------------------- */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;background:#000;overflow:hidden}
body{font-family:'Inter',system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.stage{position:absolute;top:0;left:0;width:1920px;height:1080px;transform-origin:0 0;overflow:hidden;
  background:var(--ink);color:var(--paper)}
.stage[data-format="hoch"]{width:1080px;height:1920px}
.el{position:absolute;inset:0;overflow:hidden}

/* ============================================================
   Vorlage ANGEBOT
   ============================================================ */
.el-werbung{background:var(--ink)}

/* --- Hintergrund: Bild + Abdunklung ---------------------------------- */
.a-bg{position:absolute;inset:0;overflow:hidden}
.a-img{position:absolute;inset:-4%;background-size:cover;background-repeat:no-repeat;
  animation:a-ken 24s linear both;will-change:transform}
@keyframes a-ken{from{transform:scale(1.02)}to{transform:scale(1.13)}}
.a-scrim{position:absolute;inset:0;pointer-events:none}

/* --- Deko: weiches Licht im Design, wenn kein Bild traegt -------------- */
.a-deko{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.a-deko::before,.a-deko::after{content:'';position:absolute;border-radius:50%}
.a-deko::before{width:1300px;height:1300px;right:-320px;top:-420px;
  background:radial-gradient(circle,color-mix(in srgb,var(--deep) 85%,var(--ink)) 0%,transparent 66%);
  animation:a-atmen 14s ease-in-out infinite alternate}
.a-deko::after{width:900px;height:900px;left:-300px;bottom:-380px;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 22%,transparent) 0%,transparent 62%);
  animation:a-atmen 18s ease-in-out infinite alternate-reverse}
@keyframes a-atmen{from{transform:scale(1) translate(0,0)}to{transform:scale(1.18) translate(-40px,30px)}}
.a-ring{position:absolute;border:2px solid color-mix(in srgb,var(--glow) 34%,transparent);border-radius:50%;
  animation:a-dreh 60s linear infinite}
.a-ring.r1{width:760px;height:760px;right:-120px;top:160px;border-style:dashed;opacity:.55}
.a-ring.r2{width:1080px;height:1080px;right:-280px;top:0;opacity:.28;animation-duration:90s;animation-direction:reverse}
@keyframes a-dreh{to{transform:rotate(360deg)}}

/* --- Inhalt ------------------------------------------------------------ */
.a-inhalt{position:absolute;display:flex;flex-direction:column;justify-content:center;z-index:3}
.a-dach{display:flex;align-items:center;gap:24px;font:600 30px/1.1 'Inter',sans-serif;letter-spacing:.26em;
  text-transform:uppercase;color:var(--glow);margin-bottom:34px;animation:a-ein .8s .15s both}
.a-strich{display:block;height:3px;width:96px;background:var(--glow);transform-origin:left;animation:a-linie .9s .1s both cubic-bezier(.2,.8,.2,1);flex:0 0 auto}
@keyframes a-linie{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.a-titel{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:var(--ts);text-transform:var(--tt);
  font-size:150px;line-height:1.02;color:var(--paper);text-wrap:balance;overflow-wrap:break-word;hyphens:auto;
  text-shadow:0 4px 40px rgba(0,0,0,.35)}
.a-titel .w{display:inline-block;white-space:pre;animation:a-wort .85s both cubic-bezier(.2,.85,.2,1)}
@keyframes a-wort{from{opacity:0;transform:translateY(.42em) rotate(2deg)}to{opacity:1;transform:none}}
.a-text{font:400 42px/1.38 'Inter',sans-serif;color:color-mix(in srgb,var(--paper) 88%,transparent);margin-top:34px;max-width:calc(22em / var(--c3zoom,1));
  text-wrap:pretty;white-space:pre-line;animation:a-ein .9s .75s both;text-shadow:0 2px 24px rgba(0,0,0,.4)}
@keyframes a-ein{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}

/* --- Preis -------------------------------------------------------------- */
.a-preisreihe{display:flex;align-items:center;gap:34px;margin-top:56px;flex-wrap:wrap}
.a-preis{position:relative;display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:96px;line-height:1;letter-spacing:0;
  padding:30px 56px 32px;border-radius:var(--radius);white-space:nowrap;transform:rotate(-3deg);
  animation:a-pop .9s 1.15s both cubic-bezier(.2,1.5,.35,1),a-puls 5s 3s ease-in-out infinite}
@keyframes a-pop{from{opacity:0;transform:rotate(-14deg) scale(.3)}to{opacity:1;transform:rotate(-3deg) scale(1)}}
@keyframes a-puls{0%,100%{transform:rotate(-3deg) scale(1)}50%{transform:rotate(-3deg) scale(1.045)}}
.p-akzent .a-preis{background:var(--accent);color:var(--on-accent);box-shadow:0 22px 60px color-mix(in srgb,var(--accent) 38%,transparent),0 6px 18px rgba(0,0,0,.35)}
.p-hell   .a-preis{background:var(--paper);color:var(--ink);box-shadow:0 22px 60px rgba(0,0,0,.45)}
.p-rahmen .a-preis{background:color-mix(in srgb,var(--ink) 55%,transparent);color:var(--paper);border:3px solid var(--glow);backdrop-filter:blur(6px);transform:none;
  animation:a-ein .9s 1.15s both}
.a-hinweis{font:500 34px/1.2 'Inter',sans-serif;color:var(--muted);animation:a-ein .8s 1.55s both;
  padding-bottom:6px;border-bottom:2px solid color-mix(in srgb,var(--muted) 45%,transparent)}

/* --- Logo: frei (Normalfall) oder auf heller Platte (dunkle Logos) -------- */
.a-logo{position:absolute;z-index:4;right:84px;top:76px;border-radius:var(--radius);
  padding:26px 34px;display:flex;align-items:center;justify-content:center;
  animation:a-runter .9s 1.7s both cubic-bezier(.2,.85,.2,1)}
.a-logo img{display:block;max-width:300px;max-height:150px;width:auto;height:auto;object-fit:contain}
@keyframes a-runter{from{opacity:0;transform:translateY(-40px)}to{opacity:1;transform:none}}

/* --- Kinoname ------------------------------------------------------------ */
.a-kino{position:absolute;z-index:4;right:84px;bottom:64px;font:600 24px/1 'Inter',sans-serif;letter-spacing:.22em;text-transform:uppercase;
  color:color-mix(in srgb,var(--paper) 72%,transparent);display:flex;align-items:center;gap:18px;animation:a-ein .9s 2s both;
  text-shadow:0 2px 14px rgba(0,0,0,.6)}
.a-kino::before{content:'';width:44px;height:2px;background:var(--glow)}

/* --- Freisteller-Motiv --------------------------------------------------- */
.a-motiv{position:absolute;z-index:2;display:flex;align-items:center;justify-content:center;animation:a-motiv-ein 1.2s .2s both cubic-bezier(.2,.85,.2,1)}
.a-motiv img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 40px 60px rgba(0,0,0,.55));
  animation:a-schweben 7s 1.4s ease-in-out infinite}
.a-motiv.kein-alpha img{border-radius:var(--radius);box-shadow:0 40px 90px rgba(0,0,0,.55);filter:none}
@keyframes a-motiv-ein{from{opacity:0;transform:translateX(120px) scale(.86)}to{opacity:1;transform:none}}
@keyframes a-schweben{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-26px) rotate(1.2deg)}}
.a-halo{position:absolute;z-index:1;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 46%,transparent) 0%,color-mix(in srgb,var(--accent) 12%,transparent) 42%,transparent 68%);
  animation:a-atmen 9s ease-in-out infinite alternate}

/* ============================================================
   QUER (1920 x 1080)
   ============================================================ */
/* Vollbild */
[data-format="quer"] .v-vollbild .a-scrim{background:
  linear-gradient(90deg,var(--ink) 0%,color-mix(in srgb,var(--ink) 93%,transparent) 28%,color-mix(in srgb,var(--ink) 58%,transparent) 52%,transparent 78%),
  linear-gradient(0deg,color-mix(in srgb,var(--ink) 80%,transparent) 0%,transparent 40%)}
[data-format="quer"] .v-vollbild .a-inhalt{left:120px;top:90px;bottom:90px;width:1040px}

/* Geteilt */
[data-format="quer"] .v-geteilt .a-bg{left:42%;clip-path:polygon(9% 0,100% 0,100% 100%,0 100%)}
[data-format="quer"] .v-geteilt .a-scrim{left:42%;background:linear-gradient(90deg,color-mix(in srgb,var(--ink) 60%,transparent) 0%,transparent 26%),
  linear-gradient(0deg,color-mix(in srgb,var(--ink) 55%,transparent) 0%,transparent 30%)}
[data-format="quer"] .v-geteilt .a-inhalt{left:110px;top:90px;bottom:90px;width:760px}
.a-kante{position:absolute;z-index:2;background:var(--glow);opacity:.9;animation:a-blend 1s .3s both}
@keyframes a-blend{from{opacity:0}to{opacity:.9}}
[data-format="quer"] .v-geteilt .a-kante{left:853px;width:6px;top:-10px;bottom:-10px;transform:skewX(-5.29deg)}

/* Freisteller */
[data-format="quer"] .v-freisteller .a-inhalt{left:120px;top:90px;bottom:90px;width:900px}
[data-format="quer"] .v-freisteller .a-motiv{right:90px;top:130px;bottom:130px;width:760px}
[data-format="quer"] .v-freisteller .a-halo{width:980px;height:980px;right:-20px;top:50px}

/* Ohne Bild: alles mittig */
[data-format="quer"] .ohne-bild .a-inhalt{left:200px;right:200px;top:90px;bottom:90px;width:auto;align-items:center;text-align:center}
[data-format="quer"] .ohne-bild .a-text{margin-left:auto;margin-right:auto}
[data-format="quer"] .ohne-bild .a-preisreihe{justify-content:center}

/* ============================================================
   HOCH (1080 x 1920)
   ============================================================ */
[data-format="hoch"] .a-dach{font-size:30px;margin-bottom:30px}
[data-format="hoch"] .a-titel{font-size:132px}
[data-format="hoch"] .a-text{font-size:44px;max-width:none}
[data-format="hoch"] .a-preis{font-size:104px;padding:32px 58px 34px}
[data-format="hoch"] .a-hinweis{font-size:36px}
[data-format="hoch"] .a-logo{right:70px;top:70px}
[data-format="hoch"] .a-kino{right:auto;left:80px;bottom:70px}

/* Vollbild */
[data-format="hoch"] .v-vollbild .a-scrim{background:
  linear-gradient(0deg,var(--ink) 0%,color-mix(in srgb,var(--ink) 94%,transparent) 30%,color-mix(in srgb,var(--ink) 55%,transparent) 52%,transparent 74%),
  linear-gradient(180deg,color-mix(in srgb,var(--ink) 50%,transparent) 0%,transparent 22%)}
[data-format="hoch"] .v-vollbild .a-inhalt{left:80px;right:80px;bottom:170px;top:auto;justify-content:flex-end}

/* Geteilt */
[data-format="hoch"] .v-geteilt .a-bg{bottom:46%;clip-path:polygon(0 0,100% 0,100% 100%,0 91%)}
[data-format="hoch"] .v-geteilt .a-scrim{bottom:46%;background:linear-gradient(0deg,color-mix(in srgb,var(--ink) 55%,transparent) 0%,transparent 30%)}
[data-format="hoch"] .v-geteilt .a-inhalt{left:80px;right:80px;top:56%;bottom:150px}
[data-format="hoch"] .v-geteilt .a-kante{left:-10px;right:-10px;height:6px;top:987px;transform:skewY(4.94deg)}

/* Freisteller */
[data-format="hoch"] .v-freisteller .a-inhalt{left:80px;right:80px;top:56%;bottom:150px}
[data-format="hoch"] .v-freisteller .a-motiv{left:110px;right:110px;top:230px;height:780px;animation-name:a-motiv-ein-h}
[data-format="hoch"] .v-freisteller .a-halo{width:1100px;height:1100px;left:-10px;top:70px}
@keyframes a-motiv-ein-h{from{opacity:0;transform:translateY(-90px) scale(.86)}to{opacity:1;transform:none}}

/* Ohne Bild */
[data-format="hoch"] .ohne-bild .a-inhalt{left:80px;right:80px;top:120px;bottom:160px;align-items:center;text-align:center;justify-content:center}
[data-format="hoch"] .ohne-bild .a-preisreihe{justify-content:center}
[data-format="hoch"] .a-ring.r1{right:-260px;top:520px}
[data-format="hoch"] .a-ring.r2{right:-420px;top:360px}

/* Mittige Dachzeile: Strich auf beiden Seiten */
.ohne-bild .a-dach{justify-content:center}
.ohne-bild .a-dach::after{content:'';display:block;height:3px;width:96px;background:var(--glow);transform-origin:right;animation:a-linie .9s .1s both cubic-bezier(.2,.8,.2,1)}

/* Immer die gut lesbare Schrift (Thomas 15.10.): Programmtafel und "Heute (grosse Tafel)" wie die Kassentafel
   "Saele im Ueberblick" (.el-saele weiter unten). Das Design bleibt in Farben, Ecken und Gross-/Kleinschreibung. */
.el-programm,.el-heute:not(.h-woche){--display:'Inter';--tw:700;--ts:-.01em}

/* Designschrift zu klein: gut lesbare Schrift (gesetzt von S.lesbar in cimis3-stage.js) */
.c3-lesbar{font-family:'Inter',system-ui,sans-serif !important;font-weight:700 !important;letter-spacing:normal !important}

/* Messen: keine Animation, keine Verschiebung */
.mess,.mess *,.mess *::before,.mess *::after{animation:none !important}

/* Standbild (Vorschaukacheln, Screenshots): alles im Endzustand */
.still *,.still *::before,.still *::after{animation-duration:.001s !important;animation-delay:0s !important;animation-iteration-count:1 !important}

@media (prefers-reduced-motion:reduce){
  .a-img,.a-deko::before,.a-deko::after,.a-ring,.a-motiv img,.a-halo{animation:none}
}

/* ============================================================
   Vorlage ANKUENDIGUNG (nutzt das Geruest der Werbe-Vorlagen)
   ============================================================ */
.k-termin{display:flex;align-items:stretch;gap:22px;margin-top:54px;flex-wrap:wrap}
.k-datum,.k-zeit{display:flex;align-items:center;font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:54px;line-height:1.05;
  padding:24px 40px 26px;border-radius:var(--radius);white-space:nowrap;animation:a-ein .9s both}
.k-datum{background:var(--accent);color:var(--on-accent);box-shadow:0 20px 54px color-mix(in srgb,var(--accent) 34%,transparent),0 6px 16px rgba(0,0,0,.3)}
.k-zeit{border:3px solid var(--glow);color:var(--paper);background:color-mix(in srgb,var(--ink) 55%,transparent);backdrop-filter:blur(6px)}
.k-ort{display:flex;align-items:center;font:600 34px/1.2 'Inter',sans-serif;color:color-mix(in srgb,var(--paper) 84%,transparent);letter-spacing:.04em;
  padding-left:26px;border-left:3px solid color-mix(in srgb,var(--glow) 60%,transparent);animation:a-ein .9s both;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.k-hinweis{margin-top:36px;font:500 32px/1.3 'Inter',sans-serif;color:var(--muted);animation:a-ein .9s both;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.ohne-bild .k-termin{justify-content:center}
[data-format="hoch"] .k-datum,[data-format="hoch"] .k-zeit{font-size:58px;padding:26px 40px 28px}
[data-format="hoch"] .k-ort{font-size:38px}
[data-format="hoch"] .k-hinweis{font-size:36px}
/* langes Datum: darf im Hochformat umbrechen statt die Buehne zu sprengen */
[data-format="hoch"] .k-datum{white-space:normal}

/* ============================================================
   Vorlage PARTNER & SPONSOREN
   ============================================================ */
.pa-platte{border-radius:calc(var(--radius) * 1.4);padding:56px 84px;display:flex;align-items:center;justify-content:center;
  animation:pa-auf 1.1s .25s both cubic-bezier(.2,.9,.25,1);margin:20px 0 38px}
.pa-platte img{display:block;max-width:860px;max-height:300px;width:auto;height:auto;object-fit:contain;animation:pa-logo 1s .7s both cubic-bezier(.2,.9,.25,1)}
@keyframes pa-auf{from{opacity:0;transform:scale(.82) translateY(40px)}to{opacity:1;transform:none}}
@keyframes pa-logo{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
.pa-name{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:var(--ts);text-transform:var(--tt);
  font-size:66px;line-height:1.08;color:var(--paper);animation:a-ein .9s both}
.v-logo .a-text{margin-top:18px;font-size:38px}
.pa-kontakt{margin-top:44px;animation:a-ein .9s both;display:flex;flex-direction:column;gap:10px}
.pa-web{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:52px;line-height:1.1;color:var(--glow);letter-spacing:.01em;text-shadow:0 2px 20px rgba(0,0,0,.45)}
.pa-adresse{font:500 34px/1.3 'Inter',sans-serif;color:color-mix(in srgb,var(--paper) 80%,transparent);text-shadow:0 2px 14px rgba(0,0,0,.5)}
.ohne-bild .pa-kontakt{align-items:center}
.v-logo .pa-kontakt{margin-top:34px;flex-direction:row;gap:36px;align-items:baseline;justify-content:center;flex-wrap:wrap}
.v-logo .pa-web{font-size:46px}
[data-format="hoch"] .pa-platte{padding:70px 60px;margin:34px 0 56px;width:100%}
[data-format="hoch"] .pa-platte img{max-width:800px;max-height:520px}
[data-format="hoch"] .pa-name{font-size:76px}
[data-format="hoch"] .v-logo .a-text{font-size:42px}
[data-format="hoch"] .v-logo .pa-kontakt{flex-direction:column;gap:12px;align-items:center;margin-top:46px}
[data-format="hoch"] .pa-web{font-size:56px}
[data-format="hoch"] .pa-adresse{font-size:38px}

/* ---------- Logo-Hintergrund ---------- */
.a-logo.platte{background:var(--paper);box-shadow:0 18px 50px rgba(0,0,0,.4)}
.a-logo.frei{background:none;box-shadow:none;padding:0}
.a-logo.frei img{max-width:400px;max-height:200px;filter:drop-shadow(0 6px 22px rgba(0,0,0,.65))}
.a-logo.wartet,.pa-platte.wartet{visibility:hidden}
.pa-platte.frei{background:none;box-shadow:none;padding:10px 0}
.pa-platte.frei img{max-height:380px;filter:drop-shadow(0 18px 44px rgba(0,0,0,.6))}
[data-format="hoch"] .pa-platte.frei img{max-height:560px;max-width:900px}
.pa-platte.platte{background:var(--paper);box-shadow:0 40px 110px rgba(0,0,0,.55),0 0 0 1px color-mix(in srgb,var(--glow) 30%,transparent)}

/* ---------- Filmschriftzug statt Titel ---------- */
.a-schriftzug{animation:a-schrift 1.1s .3s both cubic-bezier(.2,.85,.2,1);line-height:0}
.a-schriftzug img{display:block;max-width:880px;max-height:300px;width:auto;height:auto;object-fit:contain;object-position:left center;
  filter:drop-shadow(0 8px 30px rgba(0,0,0,.6))}
@keyframes a-schrift{from{opacity:0;transform:translateY(36px) scale(.94)}to{opacity:1;transform:none}}
.ohne-bild .a-schriftzug img{margin:0 auto;object-position:center}
[data-format="quer"] .v-geteilt .a-schriftzug img{max-width:720px;max-height:260px}
[data-format="hoch"] .a-schriftzug img{max-width:920px;max-height:340px}

/* ---------- Technik-Kennzeichen ---------- */
.k-technik{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.k-chip{font:700 24px/1 'Inter',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--paper);padding:13px 20px 12px;border-radius:calc(var(--radius) * .6);
  border:2px solid color-mix(in srgb,var(--paper) 46%,transparent);background:color-mix(in srgb,var(--ink) 50%,transparent);backdrop-filter:blur(6px);
  animation:a-ein .7s both;white-space:nowrap}
.ohne-bild .k-technik{justify-content:center}
[data-format="hoch"] .k-chip{font-size:26px;padding:14px 22px 13px}
.k-termin{margin-top:46px}

/* ---------- Trailer ---------- */
.a-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:transparent}
.t-phase{position:absolute;inset:0;z-index:20;background:#000;opacity:0;visibility:hidden;transition:opacity .9s ease,visibility 0s .9s}
.t-phase.an{opacity:1;visibility:visible;transition:opacity .9s ease}
.t-phase video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}
.t-leiste{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:flex-end;justify-content:space-between;gap:40px;padding:150px 80px 46px;
  background:linear-gradient(0deg,rgba(0,0,0,.86) 0%,rgba(0,0,0,.55) 45%,transparent 100%);pointer-events:none}
.t-logo{display:block;max-width:440px;max-height:130px;object-fit:contain;object-position:left bottom;filter:drop-shadow(0 4px 18px rgba(0,0,0,.7))}
.t-titel{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);text-transform:var(--tt);font-size:56px;line-height:1.05;color:#fff;text-shadow:0 3px 20px rgba(0,0,0,.7);max-width:1000px}
.t-rechts{text-align:right;flex:0 0 auto}
.t-wann{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:42px;line-height:1.1;color:var(--glow);text-shadow:0 3px 18px rgba(0,0,0,.8)}
.t-tech{font:700 22px/1 'Inter',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.82);margin-top:14px;text-shadow:0 2px 12px rgba(0,0,0,.8)}
/* Hochformat: Trailer als Band im Bildteil */
.t-band{position:absolute;inset:0;z-index:3;background:#000;opacity:0;transition:opacity .9s ease;display:flex;align-items:center;justify-content:center}
.t-band.an{opacity:1}
.t-band video{width:100%;aspect-ratio:16/9;display:block;background:#000}
.nur-trailer .a-innen>*{animation-delay:0s !important}
/* Kennzeichnung in den Kacheln */
.k-trailermarke{position:absolute;right:60px;top:54px;z-index:6;display:flex;align-items:center;gap:22px;
  font:700 40px/1 'Inter',sans-serif;letter-spacing:.06em;color:#fff;background:rgba(0,0,0,.62);border-radius:60px;padding:26px 46px 26px 40px;backdrop-filter:blur(8px)}
.k-trailermarke::before{content:'';width:0;height:0;border-style:solid;border-width:22px 0 22px 36px;border-color:transparent transparent transparent var(--accent)}

/* ---------- Aufbau PLAKAT: Plakat unbeschnitten, dahinter weich das Szenenbild ---------- */
.a-weich{position:absolute;inset:-8%;background-size:cover;background-position:center;filter:blur(46px) saturate(1.15);opacity:.42;transform:scale(1.05);
  animation:a-atmen 22s ease-in-out infinite alternate}
.v-plakat .a-deko{opacity:.55}
.v-plakat .a-halo{display:none}
.v-plakat .a-motiv img{border-radius:calc(var(--radius) * .7);box-shadow:0 50px 120px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.10)}
.v-plakat .a-motiv img{animation:pl-schweben 9s 1.4s ease-in-out infinite}
@keyframes pl-schweben{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
[data-format="quer"] .v-plakat .a-motiv{right:110px;top:70px;bottom:70px;width:680px;justify-content:flex-end}
[data-format="quer"] .v-plakat .a-inhalt{left:120px;top:70px;bottom:130px;width:960px}
[data-format="quer"] .v-plakat .a-kino{right:auto;left:120px;bottom:54px}
[data-format="quer"] .v-plakat .a-logo{right:auto;left:120px;top:60px}
/* Plakat-Aufbau mit Logo (Thomas 2026-10-11: das Logo klebte an der Dachzeile): quer beginnt der Text 44 px unter
   dem Logo (cimis3-stage.js setzt top nach dem Laden; 230 px haelt bis dahin Platz fuer das hoechste frei) und reicht
   ohne Kinoname bis zur Unterkante des Plakats - so bleibt die Schrift so gross wie vorher;
   hochkant steht das Logo mittig ueber dem Plakat, das dafuer etwas tiefer beginnt. */
[data-format="quer"] .v-plakat.mit-logo .a-inhalt{top:230px}
[data-format="quer"] .v-plakat.mit-logo:not(.mit-kino) .a-inhalt{bottom:70px}
[data-format="hoch"] .v-plakat.mit-logo .a-logo{left:0;right:0;margin:0 auto;width:max-content;top:56px}
[data-format="hoch"] .v-plakat.mit-logo .a-motiv{top:230px;height:780px}
[data-format="hoch"] .v-plakat.mit-logo:not(.mit-kino) .a-inhalt{bottom:90px}
[data-format="hoch"] .v-plakat .a-motiv{left:190px;right:190px;top:90px;height:900px}
[data-format="hoch"] .v-plakat .a-inhalt{left:80px;right:80px;top:1040px;bottom:150px;justify-content:center}
[data-format="hoch"] .v-plakat .a-titel{font-size:96px}
[data-format="hoch"] .v-plakat .a-schriftzug img{max-height:200px}
[data-format="hoch"] .v-plakat .a-text{font-size:38px;margin-top:22px}
[data-format="hoch"] .v-plakat .k-termin{margin-top:30px}
[data-format="hoch"] .v-plakat .k-technik{margin-top:24px}
[data-format="hoch"] .v-plakat .k-hinweis{margin-top:24px}
/* Trailer gross im Hochformat, wenn es keinen Bildteil gibt: mittig, Rest schwarz */
[data-format="hoch"] .t-phase video{object-fit:contain}
[data-format="hoch"] .t-leiste{flex-direction:column;align-items:flex-start;gap:22px;padding:120px 70px 110px}
[data-format="hoch"] .t-rechts{text-align:left}

/* ---------- Inhalt als Ganzes (wird bei Bedarf verkleinert) ---------- */
.a-innen{display:flex;flex-direction:column;align-items:inherit;text-align:inherit;width:100%;min-width:0}
.ohne-bild .a-innen{align-items:center;text-align:center}

/* ---------- Sperrzone ueber dem Kinonamen ----------
   Steht der Kinoname auf derselben Seite wie der Inhalt, endet der Inhaltskasten mit festem
   Abstand darueber. Der Kinoname selbst sitzt 70 px (quer 54/64) ueber dem Rand und ist 24 px hoch. */
[data-format="hoch"] .mit-kino .a-inhalt{bottom:200px}
[data-format="hoch"] .mit-kino.v-vollbild:not(.ohne-bild) .a-inhalt{bottom:210px}
[data-format="quer"] .mit-kino.v-plakat .a-inhalt{bottom:170px}
[data-format="quer"] .mit-kino.ohne-bild .a-inhalt{bottom:130px}

/* ---------- Internetadresse: QR-Code und Text ---------- */
.a-netz{display:flex;align-items:center;gap:30px;margin-top:40px;animation:a-ein .9s both}
.ohne-bild .a-netz{justify-content:center;text-align:left}
.a-qr{flex:0 0 auto;width:210px;height:210px;background:#fff;border-radius:calc(var(--radius) * .7);padding:6px;box-shadow:0 18px 50px rgba(0,0,0,.45);line-height:0}
.a-qr svg{display:block;width:100%;height:100%}
.a-netztext{min-width:0}
.a-netzzeile{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:46px;line-height:1.1;color:var(--paper);text-shadow:0 2px 18px rgba(0,0,0,.5)}
.a-url{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:44px;line-height:1.15;color:var(--glow);overflow-wrap:anywhere;text-shadow:0 2px 18px rgba(0,0,0,.5)}
.a-netz.mit-qr .a-url{font:600 32px/1.25 'Inter',sans-serif;margin-top:10px;color:color-mix(in srgb,var(--paper) 82%,transparent)}
.a-netz.mit-qr .a-netzzeile+.a-url{margin-top:10px}
[data-format="hoch"] .a-qr{width:240px;height:240px}
[data-format="hoch"] .a-netzzeile{font-size:50px}
[data-format="hoch"] .a-url{font-size:46px}
[data-format="hoch"] .a-netz.mit-qr .a-url{font-size:34px}
.t-qr{width:150px;height:150px;margin-left:10px}
/* Partner, Aufbau "Logo gross", quer: links der Partner, rechts eine eigene Spalte fuer den QR-Code */
[data-format="quer"] .el-partner.qr-seite .a-inhalt{left:110px;right:auto;width:1080px}
.pa-qrseite{position:absolute;z-index:3;right:110px;top:90px;bottom:130px;width:520px;display:flex;align-items:center;justify-content:center}
.pa-qrseite::before{content:'';position:absolute;left:-46px;top:16%;bottom:16%;width:2px;background:color-mix(in srgb,var(--glow) 32%,transparent)}
.pa-qrseite .a-netz{flex-direction:column;gap:26px;margin:0;text-align:center}
.pa-qrseite .a-qr{width:380px;height:380px;padding:10px}
.pa-qrseite .a-netzzeile{font-size:52px}
.pa-qrseite .a-netz.mit-qr .a-url{font-size:32px;margin-top:12px}
/* Partner, Aufbau "Logo gross", hochkant: der QR-Code mittig unter dem Logo, Zeile und Adresse darunter */
[data-format="hoch"] .el-partner.v-logo .a-netz.mit-qr{flex-direction:column;gap:22px;margin-top:54px;text-align:center}
[data-format="hoch"] .el-partner.v-logo .a-qr{width:300px;height:300px;padding:8px}
/* Partner: Logo darf wachsen */
.pa-platte img{transition:none}

/* ============================================================
   AUTOMATISCHE ELEMENTE
   ============================================================ */
.el{animation:el-ein .7s both}
@keyframes el-ein{from{opacity:0}to{opacity:1}}
.mess.el{animation:none}

/* ---------- Meta-Zeile: FSK, Laufzeit, Genre ---------- */
.k-meta{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:26px;font:500 30px/1.2 'Inter',sans-serif;
  color:color-mix(in srgb,var(--paper) 78%,transparent);animation:a-ein .8s both;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.k-meta>span+span::before{content:'·';margin-right:18px;opacity:.6}
.ohne-bild .k-meta{justify-content:center}
.k-fsk{display:inline-flex;align-items:center;font:800 .74em/1 'Inter',sans-serif;letter-spacing:.04em;padding:.42em .66em .4em;border-radius:.34em;color:#fff;background:#6b7280;white-space:nowrap}
.k-fsk.fsk-0{background:#f4f4f4;color:#222}
.k-fsk.fsk-6{background:#f6d90f;color:#222}
.k-fsk.fsk-12{background:#2f9e44}
.k-fsk.fsk-16{background:#1c7ed6}
.k-fsk.fsk-18{background:#e03131}
.k-meta .k-fsk+span::before{display:none}
[data-format="hoch"] .k-meta{font-size:32px}

/* ---------- Zeiten ---------- */
.f-zeiten{display:flex;flex-wrap:wrap;gap:16px;margin-top:46px}
.ohne-bild .f-zeiten{justify-content:center}
.f-zeit{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:20px 30px 18px;border-radius:var(--radius);
  border:3px solid color-mix(in srgb,var(--paper) 40%,transparent);background:color-mix(in srgb,var(--ink) 55%,transparent);backdrop-filter:blur(6px);
  animation:a-ein .8s both;min-width:170px}
.f-zeit b{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:64px;line-height:1;color:var(--paper)}
.f-zeit span{font:600 22px/1 'Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.f-zeit.naechste{background:var(--accent);border-color:var(--accent);box-shadow:0 20px 54px color-mix(in srgb,var(--accent) 34%,transparent)}
.f-zeit.naechste b{color:var(--on-accent)}
.f-zeit.naechste span{color:color-mix(in srgb,var(--on-accent) 76%,transparent)}
.f-zeit.vorbei{opacity:.38}
[data-format="hoch"] .f-zeit b{font-size:70px}
[data-format="hoch"] .f-zeit span{font-size:24px}

/* ---------- Tafeln: Kopf ---------- */
.el-tafel{background:var(--ink)}
.t-kopf{position:absolute;left:100px;right:100px;top:70px;display:flex;align-items:flex-end;justify-content:space-between;gap:40px;z-index:3}
.t-kopf .a-dach{margin-bottom:18px}
.t-titel2{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:var(--ts);text-transform:var(--tt);font-size:76px;line-height:1.05;color:var(--paper);
  animation:a-ein .8s .2s both}
.t-seiten{display:flex;gap:12px;padding-bottom:18px}
.t-seiten i{display:block;width:16px;height:16px;border-radius:50%;background:color-mix(in srgb,var(--paper) 26%,transparent)}
.t-seiten i.an{background:var(--glow);width:46px;border-radius:9px}
[data-format="hoch"] .t-kopf{left:70px;right:70px;top:80px}
[data-format="hoch"] .t-titel2{font-size:72px}

/* ---------- Programmtafel ---------- */
.p-liste{position:absolute;left:100px;right:100px;top:290px;bottom:130px;display:flex;flex-direction:column;gap:12px;z-index:3}
.p-zeile{flex:1 1 0;min-height:0;max-height:150px;display:flex;align-items:center;gap:30px;padding:12px 26px 12px 14px;border-radius:var(--radius);
  background:color-mix(in srgb,var(--ink2) 86%,transparent);border-left:6px solid transparent;animation:a-ein .7s both}
.p-liste:not(.mit-plakat) .p-zeile{padding-left:34px}
.p-zeile.naechste{border-left-color:var(--glow);background:color-mix(in srgb,var(--deep) 46%,var(--ink2))}
.p-zeile.vorbei{opacity:.42}
.p-plakat{flex:0 0 auto;height:100%;aspect-ratio:5/7;border-radius:calc(var(--radius) * .45);overflow:hidden;background:var(--ink);box-shadow:0 6px 20px rgba(0,0,0,.45)}
.p-plakat img{width:100%;height:100%;object-fit:cover;display:block}
.p-plakat.leer{display:flex;align-items:center;justify-content:center;background:linear-gradient(150deg,var(--deep),var(--ink))}
.p-plakat.leer span{display:none}
.p-mitte{flex:1 1 auto;min-width:0}
.p-titel{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);text-transform:var(--tt);font-size:44px;line-height:1.1;color:var(--paper);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p-meta{display:flex;align-items:center;gap:14px;margin-top:12px;font:500 24px/1 'Inter',sans-serif;color:var(--muted);white-space:nowrap;overflow:hidden}
.p-tech{font:700 17px/1 'Inter',sans-serif;letter-spacing:.1em;text-transform:uppercase;padding:7px 10px 6px;border-radius:6px;border:2px solid color-mix(in srgb,var(--paper) 30%,transparent);color:color-mix(in srgb,var(--paper) 80%,transparent)}
.p-zeiten{margin-top:0;flex:0 0 auto;flex-wrap:nowrap;gap:12px}
.p-zeiten .f-zeit{animation:none;min-width:0;padding:12px 20px 11px;gap:6px;align-items:center;border-width:2px;backdrop-filter:none}
.p-zeiten .f-zeit b{font-size:42px}
.p-zeiten .f-zeit span{font-size:16px}
[data-format="hoch"] .p-liste{left:60px;right:60px;top:330px;bottom:150px;gap:14px}
[data-format="hoch"] .p-zeile{max-height:180px;gap:22px;padding-right:18px}
[data-format="hoch"] .p-titel{font-size:40px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
[data-format="hoch"] .p-meta{font-size:22px;gap:10px}
[data-format="hoch"] .p-meta .p-tech{display:none}
[data-format="hoch"] .p-zeiten{flex-wrap:wrap;justify-content:flex-end;max-width:330px}
[data-format="hoch"] .p-zeiten .f-zeit b{font-size:40px}

/* ---------- Plakatwand ---------- */
.w-wand{position:absolute;left:100px;right:100px;top:270px;bottom:130px;display:flex;align-items:center;justify-content:center;gap:34px;z-index:3}
.w-kachel{flex:1 1 0;min-width:0;max-width:340px;display:flex;flex-direction:column;align-items:center;animation:w-ein .9s both cubic-bezier(.2,.85,.2,1)}
@keyframes w-ein{from{opacity:0;transform:translateY(60px) scale(.92)}to{opacity:1;transform:none}}
.w-plakat{width:100%;aspect-ratio:5/7;border-radius:calc(var(--radius) * .7);overflow:hidden;background:var(--ink2);box-shadow:0 30px 70px rgba(0,0,0,.6)}
.w-plakat img{width:100%;height:100%;object-fit:cover;display:block}
.w-plakat.leer{display:flex;align-items:center;justify-content:center;padding:20px;text-align:center;background:linear-gradient(150deg,var(--deep),var(--ink2))}
.w-plakat.leer span{font:700 26px/1.2 var(--display),'Inter',sans-serif;color:var(--paper)}
.w-ab{margin-top:-22px;position:relative;z-index:2;background:var(--accent);color:var(--on-accent);font:800 24px/1 'Inter',sans-serif;letter-spacing:.04em;padding:11px 18px 10px;border-radius:calc(var(--radius) * .5);
  box-shadow:0 8px 24px rgba(0,0,0,.45)}
.w-titel{margin-top:16px;font:600 25px/1.25 'Inter',sans-serif;color:var(--paper);text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em}
[data-format="hoch"] .w-wand{left:60px;right:60px;top:320px;bottom:160px;flex-wrap:wrap;align-content:center;gap:40px 30px}
[data-format="hoch"] .w-kachel{flex:0 0 calc(33.333% - 20px);max-width:none}

/* ---------- Saal-Tafel ---------- */
.s-zeiten{display:flex;align-items:stretch;gap:20px;margin-top:50px;flex-wrap:wrap}
.ohne-bild .s-zeiten{justify-content:center}
.s-block{display:flex;flex-direction:column;justify-content:flex-end;gap:12px;padding:22px 34px 24px;border-radius:var(--radius);
  border:3px solid color-mix(in srgb,var(--paper) 36%,transparent);background:color-mix(in srgb,var(--ink) 55%,transparent);backdrop-filter:blur(6px);animation:a-ein .8s both}
.s-block span{font:600 24px/1 'Inter',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.s-block b{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:76px;line-height:.95;color:var(--paper)}
.s-block.haupt{background:var(--accent);border-color:var(--accent);box-shadow:0 22px 60px color-mix(in srgb,var(--accent) 36%,transparent)}
.s-block.haupt span{color:color-mix(in srgb,var(--on-accent) 76%,transparent)}
.s-block.haupt b{color:var(--on-accent);font-size:118px}
[data-format="hoch"] .s-block b{font-size:72px}
[data-format="hoch"] .s-block.haupt b{font-size:112px}
.el-saal .a-dach{font-size:36px;letter-spacing:.2em}
/* Fusszeile "Naechste Vorstellung" (solange der Film laeuft): oben Hinweis und Kinoname, darunter Uhrzeit und Titel
   ueber die volle Breite. Der Titel wird bei Bedarf kleiner (cimis3-v-saal.js), erst dann gekuerzt. */
.s-naechste{position:absolute;z-index:5;left:0;right:0;bottom:0;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"label kino" "zeile zeile";
  align-items:center;column-gap:34px;row-gap:10px;
  background:color-mix(in srgb,var(--ink) 86%,transparent);backdrop-filter:blur(10px);border-top:3px solid var(--glow);
  animation:s-hoch .9s 1.2s both cubic-bezier(.2,.85,.2,1)}
@keyframes s-hoch{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:none}}
.s-n-label{grid-area:label;font:600 24px/1.1 'Inter',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--glow);white-space:nowrap}
.s-n-zeile{grid-area:zeile;display:flex;align-items:baseline;gap:28px;min-width:0}
.s-n-zeit{flex:0 0 auto;font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:64px;line-height:1;color:var(--paper)}
.s-n-titel{flex:1 1 auto;min-width:0;font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:var(--ts);text-transform:var(--tt);
  font-size:54px;line-height:1.15;color:var(--paper);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-naechste .a-kino{grid-area:kino;position:static;justify-self:end;animation:none;text-shadow:none}
[data-format="quer"] .s-naechste{padding:24px 84px 28px 120px}
[data-format="hoch"] .s-naechste{padding:28px 80px 38px}
[data-format="hoch"] .s-n-zeit{font-size:72px}
/* Platz fuer die Fusszeile (quer ~152 px, hoch ~174 px hoch): Inhalt und Plakat enden darueber.
   Spezifitaet hoeher als die Sperrzone fuer den Kinonamen. */
[data-format="quer"] .el-saal.mit-naechste .a-inhalt{bottom:200px}
[data-format="quer"] .el-saal.mit-naechste .a-motiv{bottom:190px}
[data-format="hoch"] .el-saal.mit-naechste:not(.ohne-bild) .a-inhalt,[data-format="hoch"] .el-saal.mit-naechste.ohne-bild .a-inhalt{bottom:250px}
/* Tagesplan des Saals */
.s-plan{position:absolute;left:100px;right:100px;top:230px;bottom:140px;display:flex;flex-direction:column;justify-content:center;gap:14px;z-index:3}
.s-planzeile{flex:0 1 110px;min-height:0}
.s-planzeile{display:flex;align-items:center;gap:40px;padding:0 34px;border-radius:var(--radius);background:color-mix(in srgb,var(--ink2) 86%,transparent);
  border-left:6px solid transparent;animation:a-ein .7s both}
.s-planzeile.naechste{border-left-color:var(--glow);background:color-mix(in srgb,var(--deep) 46%,var(--ink2))}
/* !important, weil die Einblend-Animation (a-ein, fill-mode both) sonst mit ihrem Endwert opacity:1 gewinnt -
   vergangene Zeilen waren nie blass (gemessen 2026-10-08) */
.s-planzeile.vorbei{opacity:.4 !important}
.s-planzeit{flex:0 0 190px;font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:68px;line-height:1;color:var(--paper)}
.s-planzeile.naechste .s-planzeit{color:var(--glow)}
.s-plantitel{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:20px;font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);text-transform:var(--tt);font-size:46px;line-height:1.1;color:var(--paper)}
.s-plantitel span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-plantitel .k-fsk{font-size:20px;flex:0 0 auto}
.s-planende{flex:0 0 auto;font:500 28px/1 'Inter',sans-serif;color:var(--muted)}
[data-format="hoch"] .s-plan{left:60px;right:60px;top:260px;bottom:160px}
[data-format="hoch"] .s-planzeile{flex:0 1 170px;flex-wrap:wrap;align-content:center;gap:8px 26px;padding:0 28px}
[data-format="hoch"] .s-planzeit{flex-basis:170px;font-size:62px}
[data-format="hoch"] .s-plantitel{font-size:40px;flex:1 1 60%}
[data-format="hoch"] .s-plantitel span:first-child{white-space:normal}
[data-format="hoch"] .s-planende{flex:1 1 100%;padding-left:196px;font-size:26px}
.el-leer .a-text{font-size:52px;max-width:none}

/* Programmtafel: Feinschliff Zeilenhoehen */
.p-zeile{max-height:160px;padding-top:10px;padding-bottom:10px}
.p-liste{justify-content:flex-start}
.p-liste:not(.mit-plakat) .p-zeile{max-height:96px}
.p-liste:not(.mit-plakat) .p-mitte{display:flex;align-items:baseline;gap:26px}
.p-liste:not(.mit-plakat) .p-titel{font-size:38px;flex:0 1 auto}
.p-liste:not(.mit-plakat) .p-meta{margin-top:0;font-size:21px;flex:0 0 auto}
.p-liste:not(.mit-plakat) .p-zeiten .f-zeit{flex-direction:row;align-items:baseline;gap:12px;padding:10px 18px}
.p-liste:not(.mit-plakat) .p-zeiten .f-zeit b{font-size:36px}
[data-format="hoch"] .p-liste:not(.mit-plakat) .p-zeile{max-height:128px}
[data-format="hoch"] .p-liste:not(.mit-plakat) .p-mitte{display:block}
[data-format="hoch"] .p-liste:not(.mit-plakat) .p-meta{margin-top:8px}
[data-format="hoch"] .p-liste:not(.mit-plakat) .p-titel{font-size:36px;-webkit-line-clamp:1}
/* Plakatwand etwas groesser */
.w-kachel{max-width:350px}
.w-wand{gap:30px;top:240px}
.p-liste{justify-content:center}

/* ---------- Bildgroessen unabhaengig von der Aufloesung in der Datei ----------
   Plakate aus der Pipeline tragen eine Druckaufloesung (dpi) in den Bilddaten. Safari rechnet
   die natuerliche Groesse danach herunter (1131 px -> 193 px). Deshalb bekommt jedes Bild eine
   feste Zielgroesse und wird per object-fit eingepasst, statt sich auf max-width zu verlassen. */
.v-plakat .a-motiv img{height:100%;width:auto;max-width:100%;max-height:100%;object-fit:contain}
/* Filmnacht: die Plakate aller Filme als sichtbarer Stapel (S.plakatWechsel). Jede Lage fuellt den Plakat-Platz und
   richtet ihr Plakat aus wie er (quer rechtsbuendig, hoch mittig). pl-p0 = vorn, p1/p2 liegen sichtbar dahinter
   (verdreht, kleiner, dunkler), p3 = alle weiteren unsichtbar ganz hinten. pl-raus = das vordere fliegt rechts weg.
   Dauer der Bewegung per JS (--pl-t, haengt vom Takt ab). Das Plakat ist im Stapel etwas kleiner, damit die
   Ecken der hinteren nicht in den Text ragen. */
.pl-wechsel .pl-lage{position:absolute;inset:0;display:flex;align-items:center;justify-content:inherit;transform-origin:50% 55%;
  transition:transform var(--pl-t,.5s) cubic-bezier(.3,.75,.25,1),opacity var(--pl-t,.5s) ease,filter var(--pl-t,.5s) ease}
.pl-wechsel .pl-lage img{height:86%}
.pl-wechsel .pl-p0{z-index:4}
.pl-wechsel .pl-p1{z-index:3;transform:translate(-56px,10px) rotate(-7deg) scale(.95);filter:brightness(.72)}
.pl-wechsel .pl-p2{z-index:2;transform:translate(48px,-32px) rotate(6.5deg) scale(.9);filter:brightness(.55)}
.pl-wechsel .pl-p3{z-index:1;transform:translate(48px,-32px) rotate(6.5deg) scale(.9);filter:brightness(.55);opacity:0}
.pl-wechsel .pl-raus{z-index:5;transform:translate(150px,30px) rotate(9deg) scale(1.02);opacity:0}
.pl-weich{position:absolute;inset:0;opacity:0;transition:opacity 1.2s ease-in-out}
.pl-weich.an{opacity:1}
.v-freisteller:not(.v-plakat) .a-motiv img{width:100%;height:100%;object-fit:contain}
.a-schriftzug img{width:100%;height:auto;object-fit:contain;object-position:left center}
.ohne-bild .a-schriftzug img{object-position:center}
.a-schriftzug{max-width:880px}
[data-format="quer"] .v-geteilt .a-schriftzug{max-width:720px}
[data-format="hoch"] .a-schriftzug{max-width:920px}
.ohne-bild .a-schriftzug{margin-left:auto;margin-right:auto}
.t-logo{width:440px;height:130px}

/* ============================================================
   Vorlagen GASTRO-KARTE, WIR SUCHEN DICH, GAESTESTIMME
   ============================================================ */
/* Gastro-Karte */
.g-karte{margin-top:38px;display:flex;flex-direction:column;gap:6px;width:100%}
.g-zeile{display:flex;align-items:baseline;gap:18px;padding:13px 0;animation:a-ein .7s both;border-bottom:2px solid color-mix(in srgb,var(--paper) 12%,transparent)}
.g-zeile:last-child{border-bottom:none}
.g-name{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);text-transform:var(--tt);font-size:50px;line-height:1.1;color:var(--paper);text-shadow:0 2px 16px rgba(0,0,0,.45)}
.g-punkte{flex:1 1 auto;min-width:30px;border-bottom:3px dotted color-mix(in srgb,var(--paper) 30%,transparent);transform:translateY(-10px)}
.g-preis{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:54px;line-height:1;color:var(--glow);white-space:nowrap;text-shadow:0 2px 16px rgba(0,0,0,.45)}
.el-gastro .a-titel{font-size:112px}
.el-gastro.ohne-bild .g-karte{max-width:1200px;text-align:left}
[data-format="quer"] .el-gastro.v-geteilt:not(.ohne-bild) .a-inhalt{width:700px}
[data-format="quer"] .el-gastro.v-vollbild:not(.ohne-bild) .a-inhalt{width:900px}
[data-format="hoch"] .g-name{font-size:54px}
[data-format="hoch"] .g-preis{font-size:58px}
[data-format="hoch"] .el-gastro .a-titel{font-size:108px}
/* Wir suchen dich */
.s-punkte{margin-top:36px;display:flex;flex-direction:column;gap:16px}
.s-punkt{position:relative;padding-left:62px;font:600 40px/1.25 'Inter',sans-serif;color:var(--paper);animation:a-ein .7s both;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.s-punkt::before{content:'';position:absolute;left:0;top:.08em;width:40px;height:40px;border-radius:50%;background:var(--accent)}
.s-punkt::after{content:'';position:absolute;left:13px;top:calc(.08em + 9px);width:11px;height:19px;border:solid var(--on-accent);border-width:0 4px 4px 0;transform:rotate(42deg)}
.ohne-bild .s-punkte{align-items:flex-start;text-align:left}
.s-kontakt{margin-top:46px;display:inline-flex;flex-direction:column;gap:8px;align-self:flex-start;background:var(--accent);color:var(--on-accent);border-radius:var(--radius);padding:22px 38px 24px;
  box-shadow:0 20px 54px color-mix(in srgb,var(--accent) 34%,transparent);animation:a-ein .8s both}
.ohne-bild .s-kontakt{align-self:center}
.s-kontakt span{font:700 22px/1 'Inter',sans-serif;letter-spacing:.16em;text-transform:uppercase;opacity:.78}
.s-kontakt b{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:50px;line-height:1.1;overflow-wrap:anywhere}
[data-format="hoch"] .s-punkt{font-size:44px}
[data-format="hoch"] .s-kontakt b{font-size:54px}
/* Gaestestimme */
.z-sterne{display:flex;gap:10px;margin-bottom:30px;font-size:64px;line-height:1}
.ohne-bild .z-sterne{justify-content:center}
.z-sterne span{color:color-mix(in srgb,var(--paper) 22%,transparent);animation:z-stern .6s both cubic-bezier(.2,1.6,.4,1)}
.z-sterne span.an{color:var(--glow);text-shadow:0 0 30px color-mix(in srgb,var(--glow) 50%,transparent)}
@keyframes z-stern{from{opacity:0;transform:scale(.2) rotate(-40deg)}to{opacity:1;transform:none}}
.z-zitat.a-titel{font-size:84px;line-height:1.16;font-weight:calc(var(--tw) - 100);text-transform:none;letter-spacing:0;text-wrap:pretty;margin:0}
.z-name{margin-top:36px;font:600 34px/1.2 'Inter',sans-serif;letter-spacing:.06em;color:var(--glow);animation:a-ein .8s both;display:flex;align-items:center;gap:18px}
.z-name::before{content:'';width:56px;height:3px;background:var(--glow)}
.ohne-bild .z-name{justify-content:center}
[data-format="quer"] .el-stimme.v-vollbild:not(.ohne-bild) .a-inhalt{width:1180px}
[data-format="hoch"] .z-zitat.a-titel{font-size:80px}
[data-format="hoch"] .z-name{font-size:38px}

/* Textreiche Vorlagen im Hochformat: das Bild bekommt 40 %, der Text 60 % */
[data-format="hoch"] .el-gastro.v-geteilt .a-bg,[data-format="hoch"] .el-stelle.v-geteilt .a-bg,
[data-format="hoch"] .el-gastro.v-geteilt .a-scrim,[data-format="hoch"] .el-stelle.v-geteilt .a-scrim{bottom:60%}
[data-format="hoch"] .el-gastro.v-geteilt .a-kante,[data-format="hoch"] .el-stelle.v-geteilt .a-kante{top:730px;transform:skewY(3.66deg)}
[data-format="hoch"] .el-gastro.v-geteilt:not(.ohne-bild) .a-inhalt,[data-format="hoch"] .el-stelle.v-geteilt:not(.ohne-bild) .a-inhalt{top:42%}
[data-format="hoch"] .el-gastro.ohne-bild .g-karte{text-align:left}

/* ============================================================
   Vorlage EIGENES DIA ODER VIDEO
   ============================================================ */
.el-fertig{background:#000}
.el-fertig .a-weich{opacity:.55;filter:blur(60px) saturate(1.1)}
.e-flaeche{position:absolute;inset:0;z-index:2;animation:e-ein 1s both}
@keyframes e-ein{from{opacity:0;transform:scale(1.02)}to{opacity:1;transform:none}}
.e-flaeche img,.e-flaeche video{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain;background:transparent}
.e-fuellen .e-flaeche img,.e-fuellen .e-flaeche video{object-fit:cover}
.el-fertig .a-kino{text-shadow:0 2px 10px rgba(0,0,0,.9)}

/* ============================================================
   Tafeln HEUTE / DIESE WOCHE (cimis3-v-heute.js)
   Die Zeilen teilen sich die ganze Hoehe; --ft/--fm/--fz kommen aus der Zeilenhoehe.
   ============================================================ */
.h-kopf{position:absolute;left:80px;right:80px;top:56px;height:170px;display:flex;align-items:flex-end;justify-content:space-between;gap:40px;z-index:3}
.h-kopf-l{display:flex;align-items:baseline;gap:34px;min-width:0}
.h-titel{margin:0;font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:.02em;text-transform:uppercase;font-size:150px;line-height:.9;color:var(--accent);
  white-space:nowrap;animation:a-hoch .8s .05s both cubic-bezier(.2,.8,.2,1)}
.h-unter{font:600 34px/1 'Inter',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);white-space:nowrap;animation:a-hoch .8s .2s both}
@keyframes a-hoch{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.h-woche .h-titel{font-size:120px}
.h-liste{position:absolute;left:80px;right:80px;top:250px;height:720px;display:grid;align-content:start;z-index:3}
.h-rechts>*{flex-shrink:0;max-width:100%}
.h-zeile{--pad:calc(var(--rh) * .055);--pb:calc((var(--rh) - 2 * var(--pad)) * .709 + var(--pad) * 2.2);
  position:relative;min-width:0;height:var(--rh);display:flex;align-items:stretch;gap:calc(var(--pad) * 2.2);padding:var(--pad);border-radius:var(--radius);
  background:color-mix(in srgb,var(--ink2) 86%,var(--paper));border-left:8px solid transparent;overflow:hidden;animation:h-zeile .6s both cubic-bezier(.2,.8,.2,1)}
@keyframes h-zeile{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.mess .h-zeile{animation:none}
.h-zeile.naechste{border-left-color:var(--glow);background:color-mix(in srgb,var(--deep) 46%,var(--ink2))}
.h-zeile.vorbei{opacity:.42}
.h-plakat{flex:0 0 auto;height:100%;aspect-ratio:5/7.05;border-radius:calc(var(--radius) * .45);overflow:hidden;background:var(--ink);box-shadow:0 8px 26px rgba(0,0,0,.5)}
.h-plakat img{width:100%;height:100%;object-fit:cover;display:block}
.h-plakat.leer{background:linear-gradient(150deg,var(--deep),var(--ink))}
.h-plakat.leer span{display:none}
.h-rechts{flex:1 1 0;min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.h-film{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:var(--ts);text-transform:var(--tt);font-size:calc(var(--ft) * var(--k,1));line-height:1.08;color:var(--paper);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;padding-bottom:.06em}
.h-meta{display:flex;align-items:center;gap:.7em;margin-top:.5em;font:500 calc(var(--fm) * var(--k,1))/1 'Inter',sans-serif;color:var(--muted);white-space:nowrap}
.h-zeiten{display:flex;flex-wrap:wrap;gap:calc(var(--fz) * .22 * var(--k,1));margin-top:calc(var(--fz) * .4 * var(--k,1))}
.h-zeit{display:flex;flex-direction:column;align-items:flex-start;gap:.14em;font-size:calc(var(--fz) * var(--k,1));padding:.24em .42em .2em;border-radius:calc(var(--radius) * .7);
  border:2px solid color-mix(in srgb,var(--paper) 22%,transparent);background:color-mix(in srgb,var(--ink) 60%,transparent)}
.h-zeit b{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:1em;line-height:1;color:var(--paper)}
.h-zeit span{font:600 .3em/1 'Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.h-zeit.naechste{background:var(--accent);border-color:var(--accent)}
.h-zeit.naechste b{color:var(--on-accent)}
.h-zeit.naechste span{color:color-mix(in srgb,var(--on-accent) 76%,transparent)}
.h-zeit.vorbei{opacity:.38}
/* Woche: je Tagesgruppe eine Zeile */
.h-tage{margin-top:calc(var(--fz) * .45 * var(--k,1));display:flex;flex-direction:column;gap:calc(var(--fz) * .2 * var(--k,1))}
.h-tag{display:flex;align-items:baseline;gap:.6em;font-size:calc(var(--fz) * var(--k,1));line-height:1.1}
.h-tag b{flex:0 0 auto;min-width:4.4em;font:700 .7em/1 'Inter',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.h-tag.heute b{color:var(--accent)}
.h-tz{display:flex;flex-wrap:wrap;gap:.1em .6em}
.h-tz i{font-style:normal;font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);color:var(--paper);white-space:nowrap}
/* flache Zeilen (viele Filme): Zeiten rechts neben dem Titel */
.h-liste.flach .h-rechts{flex-direction:row;align-items:center;justify-content:space-between;gap:24px;flex-wrap:nowrap}
.h-liste.flach .h-rechts>.h-film{flex:1 1 0;min-width:0}
.h-liste.flach .h-meta{display:none}
.h-liste.flach .h-zeiten{margin-top:0;flex:0 1 auto;justify-content:flex-end;max-width:56%}
.h-liste.flach .h-tage{margin-top:0;flex:0 1 auto;max-width:60%}
.h-liste.flach .h-tag b{min-width:4em}

[data-format="hoch"] .h-kopf{left:60px;right:60px;top:70px;height:230px}
[data-format="hoch"] .h-kopf-l{flex-direction:column;align-items:flex-start;gap:16px}
.h-kopf-l{flex:0 1 auto}.h-titel{flex:0 0 auto}
[data-format="hoch"] .h-titel{font-size:190px}
[data-format="hoch"] .h-woche .h-titel{font-size:132px}
[data-format="hoch"] .h-unter{font-size:32px}
[data-format="hoch"] .h-liste{left:60px;right:60px;top:330px;height:1490px}

/* ============================================================
   PLAKAT HEUTE
   ============================================================ */
.el-poster{background:var(--ink)}
.el-poster .a-weich{opacity:.5;filter:blur(70px) saturate(1.2)}
.o-schleier{position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--ink) 70%,transparent),color-mix(in srgb,var(--ink) 35%,transparent) 40%,color-mix(in srgb,var(--ink) 80%,transparent))}
.o-plakat{position:absolute;z-index:2;left:90px;top:60px;height:960px;aspect-ratio:5/7.05;border-radius:calc(var(--radius) * .6);overflow:hidden;background:var(--ink2);
  box-shadow:0 40px 110px rgba(0,0,0,.65),0 0 0 2px color-mix(in srgb,var(--paper) 12%,transparent);animation:o-plakat 1s both cubic-bezier(.2,.8,.2,1)}
@keyframes o-plakat{from{opacity:0;transform:scale(.96) translateY(20px)}to{opacity:1;transform:none}}
.o-plakat img{width:100%;height:100%;object-fit:cover;display:block}
.o-plakat.leer{display:flex;align-items:center;justify-content:center;padding:60px;text-align:center;background:linear-gradient(150deg,var(--deep),var(--ink))}
.o-plakat.leer span{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:80px;line-height:1.05;color:var(--paper)}
.o-text{position:absolute;z-index:3;left:870px;right:90px;top:70px;bottom:130px;display:flex;flex-direction:column;justify-content:center}
.o-kopf{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.o-kopf .h-unter{font-size:40px}
.o-kopf .h-titel,.o-kopf .h-unter{flex:0 0 auto}
.o-kopf .h-titel{font-size:200px}
.o-info{margin-top:40px;animation:a-hoch .8s .3s both}
.o-film{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:var(--ts);text-transform:var(--tt);font-size:76px;line-height:1.06;color:var(--paper);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;padding-bottom:.06em}
.o-info .h-meta{font-size:30px;margin-top:22px}
.o-zeiten{display:flex;flex-wrap:wrap;gap:20px;margin-top:54px;--fz:110px}
.o-zeiten .h-zeit{animation:h-zeile .6s both;padding:.22em .4em .18em;backdrop-filter:blur(8px)}
.o-zeiten.n4,.o-zeiten.n5,.o-zeiten.n6{--fz:88px}
.o-zeiten.n7,.o-zeiten.n8,.o-zeiten.n9{--fz:70px}
.mess .o-zeiten .h-zeit,.mess .o-plakat{animation:none}

/* Hochformat: nur das Plakat, darueber HEUTE, darunter die Zeiten */
[data-format="hoch"] .o-plakat{left:60px;top:262px;height:auto;width:960px}
[data-format="hoch"] .o-text{left:60px;right:60px;top:0;bottom:0;display:block}
[data-format="hoch"] .o-kopf{position:absolute;left:0;right:0;top:64px;height:180px;flex-direction:row;align-items:flex-end;justify-content:space-between;gap:30px}
[data-format="hoch"] .o-kopf .h-titel{font-size:196px}
[data-format="hoch"] .o-kopf .h-unter{font-size:44px;padding-bottom:12px}
[data-format="hoch"] .o-info{display:none}
[data-format="hoch"] .o-zeiten{position:absolute;left:0;right:0;top:1628px;height:190px;margin:0;justify-content:center;align-items:center;align-content:center;flex-wrap:nowrap;gap:14px 18px;--fz:100px}
[data-format="hoch"] .o-zeiten.r2{flex-wrap:wrap}
.o-umbruch{flex:0 0 100%;height:0}
[data-format="hoch"] .o-zeiten .h-zeit{align-items:center}
[data-format="hoch"] .el-poster .a-kino{left:0;right:0;bottom:38px;justify-content:center}

/* Heute / Diese Woche als Plakate */
.h-wand{justify-content:center;align-content:space-between}
.h-kachel{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;animation:h-zeile .6s both cubic-bezier(.2,.8,.2,1)}
.mess .h-kachel{animation:none}
.h-kachel.vorbei{opacity:.4}
.h-kplakat{flex:0 0 auto;height:var(--ph);aspect-ratio:5/7.05;border-radius:calc(var(--radius) * .5);overflow:hidden;background:var(--ink2);
  box-shadow:0 14px 40px rgba(0,0,0,.55),0 0 0 2px color-mix(in srgb,var(--paper) 10%,transparent)}
.h-kachel.naechste .h-kplakat{box-shadow:0 14px 40px rgba(0,0,0,.55),0 0 0 5px var(--glow)}
.h-kplakat img{width:100%;height:100%;object-fit:cover;display:block}
.h-kplakat.leer{display:flex;align-items:center;justify-content:center;padding:8%;text-align:center;background:linear-gradient(150deg,var(--deep),var(--ink))}
.h-kplakat.leer span{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:calc(var(--ph) * .09);line-height:1.1;color:var(--paper)}
.h-kplakat{width:var(--pw);aspect-ratio:auto}
.h-wand .h-zeiten{width:var(--pw);margin-top:calc(var(--fz) * .4);justify-content:center;gap:calc(var(--fz) * .25)}
.h-wand .h-zeit{align-items:center;padding:.2em .4em .16em}
/* Woche: Block so breit wie das Plakat, Tag links, Zeiten rechts buendig */
.h-wand .h-tage{width:var(--pw);margin-top:calc(var(--fz) * .45);gap:0;align-items:stretch}
.h-wand .h-tag{justify-content:space-between;align-items:baseline;gap:.5em;padding:.21em 0;line-height:1.18;border-bottom:1px solid color-mix(in srgb,var(--paper) 14%,transparent)}
.h-wand .h-tag:last-child{border-bottom:0}
.h-wand .h-tag b{min-width:0;white-space:nowrap;font-size:.68em}
.h-wand .h-tz{flex:1 1 auto;flex-wrap:wrap;justify-content:flex-end;gap:0 .55em}

/* ============================================================
   Vorlage THEKENTAFEL (theke, 2026-10-15)
   Bausteine auf dem Raster (40 px je Feld). Jede Groesse im Baustein
   haengt an --k, das die Buehne pro Baustein so gross wie moeglich waehlt.
   ============================================================ */
.el-theke{background:var(--ink)}
.t-flaeche{position:absolute;inset:0;z-index:2}
.t-b{position:absolute;overflow:hidden;padding:14px;--k:1;animation:t-ein .8s var(--ein,0s) both cubic-bezier(.2,.85,.2,1)}
@keyframes t-ein{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.ruhig .t-b,.ruhig .t-lz,.ruhig .t-h .w,.ruhig .t-gr-sp .t-bild,.ruhig .t-st,.ruhig .t-kpreis{animation-name:none}

/* --- Hintergrund ---------------------------------------------------- */
.t-grund{position:absolute;inset:0;overflow:hidden;z-index:0}
.t-grund::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 50%,rgba(0,0,0,.42) 100%)}
.t-glow{position:absolute;border-radius:50%}
.t-glow.g1{width:1500px;height:1500px;left:-480px;top:-640px;background:radial-gradient(circle,color-mix(in srgb,var(--deep) 80%,transparent) 0%,transparent 64%);animation:a-atmen 16s ease-in-out infinite alternate}
.t-glow.g2{width:1700px;height:1700px;right:-560px;bottom:-760px;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 17%,transparent) 0%,transparent 62%);animation:a-atmen 21s ease-in-out infinite alternate-reverse}
.t-kegel{position:absolute;top:-12%;width:46%;height:130%;transform-origin:50% 0;mix-blend-mode:screen;filter:blur(26px);
  background:linear-gradient(180deg,color-mix(in srgb,var(--paper) 17%,transparent) 0%,color-mix(in srgb,var(--glow) 7%,transparent) 55%,transparent 85%);
  clip-path:polygon(44% 0,56% 0,100% 100%,0 100%);animation:t-kegel 15s ease-in-out infinite alternate}
.t-kegel.k1{left:2%}
.t-kegel.k2{right:2%;animation-duration:19s;animation-direction:alternate-reverse}
@keyframes t-kegel{from{transform:rotate(-13deg)}to{transform:rotate(13deg)}}
.g-bild .t-gimg{position:absolute;inset:-2%;background-size:cover;background-position:center;animation:a-ken 40s linear both}
.g-bild .t-gvid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.g-bild .t-gscrim{position:absolute;inset:0;background:var(--ink)}
/* Vorhang: Falten aus Verlaeufen im tiefen Ton des Designs, oben eine Blende, Licht von unten */
.t-vh{position:absolute;inset:-4% -6%;animation:t-vh 18s ease-in-out infinite alternate;
  background:
    linear-gradient(180deg,rgba(0,0,0,.25) 0%,transparent 30%,rgba(0,0,0,.55) 100%),
    repeating-linear-gradient(90deg,
      color-mix(in srgb,var(--deep) 55%,#000) 0px,
      color-mix(in srgb,var(--deep) 80%,var(--accent) 20%) 46px,
      color-mix(in srgb,var(--deep) 92%,var(--paper) 8%) 62px,
      color-mix(in srgb,var(--deep) 75%,var(--accent) 12%) 84px,
      color-mix(in srgb,var(--deep) 50%,#000) 128px)}
@keyframes t-vh{from{transform:skewX(-.6deg) translateX(-10px)}to{transform:skewX(.6deg) translateX(10px)}}
.t-vh-licht{position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 50% 110%,color-mix(in srgb,var(--glow) 22%,transparent),transparent 70%)}
.t-vh-blende{position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--ink) 55%,transparent),color-mix(in srgb,var(--ink) 72%,transparent))}

/* --- Gemeinsam: Preise, Merkmale, Pfand, Ausverkauft ------------------ */
/* Die ganze Thekentafel steht in EINER Schrift - in jedem Design, fuer alle Kunden (Thomas 16.10.2026: "immer die
   gleiche Schriftart und nie etwas Verschnoerkeltes"; Inter war ihm zu breit: "klar lesbar, aber nicht zu breit ...
   kann schon etwas gestaucht sein, aber keine Serifen"). Vorher Designschrift fuer Namen/Ueberschriften: grosse
   Namen in Playfair, kleine sprangen per S.lesbar auf Inter - zwei Schriften auf einer Tafel.
   --tf gilt fuer jeden Text der Tafel, auch Groessen, Zusatz, Pfand, Merkmale (Regeln unten: var(--tf)). */
.el-theke{--tf:'Fira Sans Condensed';--display:'Fira Sans Condensed';--tw:700;--ts:0;--pf:'Fira Sans Condensed';--pw:700}
.t-p{font-family:var(--pf),'Inter',sans-serif;font-weight:var(--pw);letter-spacing:0;font-variant-numeric:tabular-nums;white-space:nowrap;line-height:1}
.tp-klar .t-p{color:var(--glow)}
.tp-schild .tb-produkt .t-p,.tp-schild .tb-groessen .t-p{background:var(--accent);color:var(--on-accent);padding:.14em .42em .16em;
  border-radius:max(8px,calc(var(--radius) * .6));box-shadow:0 .22em .7em color-mix(in srgb,var(--accent) 34%,transparent),0 .08em .2em rgba(0,0,0,.3)}
.t-g{font-family:var(--tf),'Inter',sans-serif;font-weight:600;color:var(--muted);white-space:nowrap}
.t-mk{position:absolute;z-index:4;left:16px;top:16px;display:flex;flex-wrap:wrap;gap:8px;max-width:70%}
.t-mk span{font:700 calc(var(--k) * 17px)/1 var(--tf),'Inter',sans-serif;letter-spacing:.12em;text-transform:uppercase;padding:.5em .75em .45em;border-radius:99px;
  color:var(--paper);background:color-mix(in srgb,var(--ink) 62%,transparent);border:2px solid color-mix(in srgb,var(--paper) 42%,transparent);backdrop-filter:blur(4px)}
.t-mk .mk-neu,.t-mk .mk-beliebt{background:var(--accent);color:var(--on-accent);border-color:transparent}
.t-mk.klein{position:static;display:inline-flex;vertical-align:.18em;margin-left:.45em;max-width:none}
.t-mk.klein span{font-size:.36em;padding:.45em .65em .4em;border-width:1px}
.t-pfand{font:400 calc(var(--k) * 18px)/1.25 var(--tf),'Inter',sans-serif;color:var(--muted);margin-top:.7em}
.t-auswort{font:700 calc(var(--k) * 24px)/1 var(--tf),'Inter',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  border:2px solid color-mix(in srgb,var(--muted) 60%,transparent);border-radius:99px;padding:.45em .9em;white-space:nowrap}
.t-auswort.gross{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-8deg);z-index:5;background:var(--paper);color:var(--ink);border:0;font-size:calc(var(--k) * 34px)}

/* --- Produktbild: schwebt, Halo dahinter, Glanz nur ueber dem Produkt ---- */
.t-bild{position:relative;min-width:0;min-height:0;--op:center}
.t-halo{position:absolute;left:8%;right:8%;top:6%;bottom:0;border-radius:50%;opacity:.6;pointer-events:none;
  background:radial-gradient(closest-side,color-mix(in srgb,var(--accent) 38%,transparent),color-mix(in srgb,var(--accent) 8%,transparent) 60%,transparent);
  transition:opacity .9s ease,scale .9s ease}
.t-sw{position:absolute;inset:5% 4% 7%;animation:t-schweben 7s ease-in-out infinite}
@keyframes t-schweben{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.2%)}}
.t-sw img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:var(--op);transition:scale .9s cubic-bezier(.2,.85,.2,1),filter .9s}
.t-sw img.frei{filter:drop-shadow(0 calc(var(--k) * 22px) calc(var(--k) * 26px) rgba(0,0,0,.55))}
.t-sw img.eckig{border-radius:calc(var(--radius) * .6);box-shadow:0 18px 40px rgba(0,0,0,.45)}
.t-glanz{position:absolute;inset:0;pointer-events:none;opacity:0;
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:var(--op);mask-position:var(--op);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  background:linear-gradient(110deg,transparent 38%,rgba(255,255,255,.75) 50%,transparent 62%);background-size:320% 100%;background-position:150% 0}
.spot .t-glanz{animation:t-glanz 1.5s .15s ease-in-out both}
@keyframes t-glanz{0%{opacity:1;background-position:150% 0}100%{opacity:1;background-position:-50% 0}}
.spot .t-sw img{scale:1.07;filter:drop-shadow(0 calc(var(--k) * 30px) calc(var(--k) * 34px) rgba(0,0,0,.6)) brightness(1.06)}
.spot .t-halo{opacity:1;scale:1.12}
.t-bild.ohne{display:flex;align-items:center;justify-content:center}
.t-ohnebild{width:62%;aspect-ratio:1;max-height:86%;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--accent) 55%,var(--ink2)),var(--ink2));
  font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:calc(var(--k) * 90px);color:var(--paper);opacity:.85}
.t-ausband{position:absolute;z-index:5;left:2%;right:2%;top:50%;transform:translateY(-50%) rotate(-11deg);text-align:center;
  font:800 calc(var(--k) * 30px)/1 var(--tf),'Inter',sans-serif;letter-spacing:.16em;text-transform:uppercase;padding:.42em 0;
  background:var(--paper);color:var(--ink);box-shadow:0 10px 30px rgba(0,0,0,.45)}
.ist-aus .t-sw img{filter:grayscale(1) brightness(.55);scale:1}
.ist-aus .t-halo{opacity:.15}

/* --- Produkt -------------------------------------------------------- */
.tb-produkt{display:flex;gap:calc(var(--k) * 14px)}
.tb-produkt.lay-h{flex-direction:column;text-align:center}
.tb-produkt.lay-q{flex-direction:row;align-items:center}
.tb-produkt .t-bild{flex:1 1 0;min-height:30%}
.tb-produkt.lay-q .t-bild{flex:0 0 46%;align-self:stretch}
.tb-produkt .t-txt{flex:0 0 auto;min-width:0}
.tb-produkt.lay-q .t-txt{flex:1 1 0}
.tb-produkt.st-karte{padding:22px;border-radius:var(--radius);border:1px solid color-mix(in srgb,var(--paper) 10%,transparent);
  background:linear-gradient(165deg,color-mix(in srgb,var(--ink2) 88%,var(--paper) 7%),color-mix(in srgb,var(--ink2) 92%,transparent));box-shadow:0 20px 50px rgba(0,0,0,.35)}
.t-name{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:var(--ts);text-transform:var(--tt);font-size:calc(var(--k) * 50px);
  line-height:1.04;color:var(--paper);text-wrap:balance}
.t-zusatz{font:400 calc(var(--k) * 23px)/1.3 var(--tf),'Inter',sans-serif;color:var(--muted);margin-top:.3em;text-wrap:balance}
.t-preise{margin-top:calc(var(--k) * 18px);display:flex;flex-wrap:wrap;gap:calc(var(--k) * 12px) calc(var(--k) * 16px);align-items:flex-end}
.lay-h .t-preise{justify-content:center}
.t-preise.eins .t-pg{display:flex;align-items:center;gap:.5em}
.t-preise.eins .t-p{font-size:calc(var(--k) * 62px)}
.t-preise.eins .t-g{font-size:calc(var(--k) * 24px)}
.t-preise.mehr .t-pg{display:flex;flex-direction:column;align-items:center;gap:.35em}
.t-preise.mehr .t-g{font-size:calc(var(--k) * 20px);letter-spacing:.03em}
.t-preise.mehr .t-p{font-size:calc(var(--k) * 38px)}

/* --- Groessen: das Bild waechst mit der Groesse ------------------------ */
.tb-groessen{display:flex;flex-direction:column}
.t-gkopf{flex:0 0 auto;text-align:center;margin-bottom:calc(var(--k) * 10px)}
.t-gr{flex:1 1 0;min-height:0;display:flex;gap:calc(var(--k) * 18px)}
.t-gr-sp{flex:1 1 0;min-width:0;display:flex;flex-direction:column}
.t-gr-sp .t-bild{flex:1 1 0;min-height:34%;--op:center bottom;animation:t-wachs .9s both cubic-bezier(.2,1.3,.35,1)}
@keyframes t-wachs{from{opacity:0;transform:translateY(30px) scale(.7)}to{opacity:1;transform:none}}
/* Der Rahmen schrumpft in BEIDEN Richtungen mit --s: nur die Hoehe zu staffeln reicht nicht - in einer
   schmalen Spalte begrenzt sonst die Breite, und mittel und gross sehen gleich aus */
.t-gr-sp .t-sw{top:auto;bottom:0;height:calc(var(--s,1) * 92%);left:calc(50% - var(--s,1) * 46%);right:calc(50% - var(--s,1) * 46%)}
.t-gr-sp .t-halo{top:auto;height:calc(var(--s,1) * 90%);left:calc(50% - var(--s,1) * 42%);right:calc(50% - var(--s,1) * 42%)}
.t-gr-sp .t-bild::after{content:'';position:absolute;left:4%;right:4%;bottom:0;height:3px;border-radius:3px;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--glow) 70%,transparent),transparent)}
.t-gr-unter{flex:0 0 auto;text-align:center;padding-top:calc(var(--k) * 14px);display:flex;flex-direction:column;align-items:center;gap:calc(var(--k) * 10px)}
.t-gr-unter .t-g{font-size:calc(var(--k) * 28px);letter-spacing:.06em}
.t-gr-unter .t-p{font-size:calc(var(--k) * 44px)}
.tb-groessen .t-pfand{text-align:center}

/* --- Preisliste ----------------------------------------------------- */
.tb-liste{display:flex;flex-direction:column;padding:14px 18px}
.t-lkopf{flex:0 0 auto;display:flex;align-items:center;gap:.45em;font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);
  letter-spacing:var(--ts);text-transform:var(--tt);font-size:calc(var(--k) * 54px);line-height:1.05;color:var(--paper);margin-bottom:.32em}
.t-lkopf .t-strich{flex:0 0 auto;width:.9em;height:.1em;border-radius:.05em;background:var(--accent)}
.t-lrows{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:repeat(var(--sp,1),minmax(0,1fr));align-content:space-evenly;
  column-gap:calc(var(--k) * 60px);row-gap:calc(var(--k) * 4px);font-size:calc(var(--k) * 40px)}
.t-lz{display:flex;align-items:center;gap:.4em;padding:.2em .35em;margin:0 -.35em;border-radius:calc(var(--radius) * .5);min-width:0;
  transition:background-color .8s ease;animation:t-zeile .7s both cubic-bezier(.2,.85,.2,1)}
@keyframes t-zeile{from{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:none}}
.t-lname{flex:0 1 auto;min-width:0;display:flex;flex-direction:column}
.matrix .t-lname{flex:1 1 auto}
.t-lnz{display:block;min-width:0}
.t-ln{font:600 1em/1.12 var(--tf),'Inter',sans-serif;color:var(--paper);white-space:nowrap}   /* nie "Coca-|Cola": lieber kleinere Schrift (einpassen) */
.t-lzus{font:400 .52em/1.3 var(--tf),'Inter',sans-serif;color:var(--muted);margin-top:.18em}
.t-lfuell{flex:1 1 auto;min-width:.8em;align-self:center;height:0;border-bottom:.07em dotted color-mix(in srgb,var(--muted) 60%,transparent)}
.t-lpr{display:flex;gap:.8em;flex:0 0 auto}
.t-lpg{display:flex;align-items:baseline;gap:.35em}
.t-lpg .t-g{font-size:.62em}
.t-lz .t-p{font-size:1em;color:var(--glow)}
.t-lc{flex:0 0 4.6em;text-align:right}
.t-lkz{animation:none;padding-bottom:.1em;margin-bottom:.1em;border-bottom:2px solid color-mix(in srgb,var(--paper) 14%,transparent);border-radius:0}
.t-lkz .t-lc{font:600 .66em/1.1 var(--tf),'Inter',sans-serif;color:var(--muted);letter-spacing:.04em;align-self:flex-end;flex-basis:calc(4.6em / .66)}
/* Mischliste: Zeile mit eigenen Groessen (nicht im Kopf) - Punktlinie bis zu Groesse + Preis am rechten Rand */
.matrix .t-lz.eigen .t-lname{flex:0 1 auto}
.t-lthumb{flex:0 0 1.6em;height:1.6em;position:relative}
.t-lthumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 .08em .12em rgba(0,0,0,.5))}
.t-lz.aus .t-ln{text-decoration:line-through;text-decoration-thickness:.06em;color:var(--muted)}
.t-lz.aus .t-lthumb{opacity:.35;filter:grayscale(1)}
.t-lz .t-auswort{font-size:.45em}
.t-lz.spot{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 24%,transparent),color-mix(in srgb,var(--accent) 5%,transparent))}
.t-lz.spot .t-p{text-shadow:0 0 .5em color-mix(in srgb,var(--glow) 75%,transparent)}

/* --- Preiskarte (2026-10-16): Rubriken, die Spalten bricht die Buehne selbst um ----------------
   Zeilen wie die Preisliste (.t-lz ...). --luft verteilt uebrigen Platz gleichmaessig auf alle Teile. */
.tb-karte{display:flex;flex-direction:column;padding:14px 18px}
.kt-fluss{flex:1 1 auto;min-height:0;display:flex;align-items:flex-start;gap:calc(var(--k) * 60px);font-size:calc(var(--k) * 40px)}
.kt-sp{flex:1 1 0;min-width:0;display:flex;flex-direction:column}
.kt-ab{display:flex;flex-direction:column}
.kt-fluss .t-lz{padding-top:calc(.2em + var(--luft,0px) / 2);padding-bottom:calc(.2em + var(--luft,0px) / 2)}
.kt-fluss .t-lkz{padding-top:calc(var(--luft,0px) / 2);padding-bottom:calc(.1em + var(--luft,0px) / 2)}
.kt-rub{display:flex;align-items:flex-end;gap:.4em;margin:.7em 0 .12em;padding:calc(var(--luft,0px) / 2) 0 calc(.14em + var(--luft,0px) / 2);
  border-bottom:2px solid color-mix(in srgb,var(--accent) 60%,transparent)}
.kt-sp > .kt-ab:first-child > :first-child{margin-top:0}
.kt-rubt{flex:1 1 auto;min-width:0;font:700 .7em/1.1 var(--tf),'Inter',sans-serif;letter-spacing:.07em;text-transform:uppercase;color:var(--accent);white-space:nowrap}
.kt-rub .t-lc{font:600 .66em/1.1 var(--tf),'Inter',sans-serif;color:var(--muted);letter-spacing:.04em;flex-basis:calc(4.6em / .66)}

/* --- Menue-Angebot -------------------------------------------------- */
.tb-kombi{display:flex;gap:calc(var(--k) * 24px)}
.tb-kombi.lay-h{flex-direction:column;text-align:center;align-items:stretch}
.tb-kombi.lay-q{flex-direction:row;align-items:center}
.t-kbilder{position:relative;flex:1 1 0;min-height:32%;min-width:0;display:flex;align-items:stretch;justify-content:center;padding:0 4%}
.tb-kombi.lay-q .t-kbilder{flex:0 0 52%;align-self:stretch}
.t-kbilder .t-bild{flex:1 1 0;margin-left:-9%;transform:rotate(calc((var(--i) - (var(--n) - 1) / 2) * 6deg));z-index:calc(10 - var(--i))}
.t-kbilder .t-bild:first-child{margin-left:0}
.t-kinfo{flex:0 0 auto;min-width:0;display:flex;flex-direction:column;gap:calc(var(--k) * 12px)}
.tb-kombi.lay-q .t-kinfo{flex:1 1 0}
.tb-kombi.lay-h .t-kinfo{align-items:center}
.t-ktitel{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:var(--ts);text-transform:var(--tt);font-size:calc(var(--k) * 64px);line-height:1.02;color:var(--paper)}
.t-knamen{font:600 calc(var(--k) * 26px)/1.3 var(--tf),'Inter',sans-serif;color:color-mix(in srgb,var(--paper) 86%,transparent);text-wrap:balance}
.t-ktext{font:400 calc(var(--k) * 22px)/1.3 var(--tf),'Inter',sans-serif;color:var(--muted)}
.t-kpreisreihe{display:flex;align-items:center;gap:calc(var(--k) * 26px);flex-wrap:wrap;margin-top:calc(var(--k) * 8px)}
.tb-kombi.lay-h .t-kpreisreihe{justify-content:center}
.t-kpreis{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;font-size:calc(var(--k) * 80px);
  padding:.32em .55em .3em;border-radius:999px;background:var(--accent);color:var(--on-accent);--rot:-5deg;transform:rotate(var(--rot));
  box-shadow:0 .25em .8em color-mix(in srgb,var(--accent) 40%,transparent),0 .08em .2em rgba(0,0,0,.35);
  animation:t-pop .9s calc(var(--ein,0s) + .6s) both cubic-bezier(.2,1.5,.35,1)}
.t-kpreis .t-p{background:none;box-shadow:none;padding:0;color:inherit}
.t-knur{font:700 .22em/1 var(--tf),'Inter',sans-serif;letter-spacing:.2em;text-transform:uppercase;margin-bottom:.18em}
.t-kstatt{font:500 calc(var(--k) * 26px)/1.35 var(--tf),'Inter',sans-serif;color:var(--muted)}
.t-kstatt s{text-decoration-thickness:.1em;text-decoration-color:color-mix(in srgb,var(--accent) 80%,transparent)}
.t-kstatt b{display:block;color:var(--glow);font-weight:700}
@keyframes t-pop{from{opacity:0;transform:rotate(-24deg) scale(.3)}to{opacity:1;transform:rotate(var(--rot)) scale(1)}}

/* --- Ueberschrift, Text --------------------------------------------- */
.tb-titel{display:flex;flex-direction:column;justify-content:center}
.a-mitte{text-align:center;align-items:center}
.a-rechts{text-align:right;align-items:flex-end}
.t-dach{display:flex;align-items:center;gap:.6em;font:600 calc(var(--k) * 26px)/1.1 var(--tf),'Inter',sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--glow);margin-bottom:.4em}
.t-strich{display:block;flex:0 0 auto;height:3px;width:2.4em;background:var(--glow)}
.t-h{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:var(--ts);text-transform:var(--tt);font-size:calc(var(--k) * 100px);
  line-height:1.02;color:var(--paper);text-wrap:balance;overflow-wrap:break-word;text-shadow:0 4px 30px rgba(0,0,0,.35)}
.t-h .w{display:inline-block;white-space:pre;animation:a-wort .85s both cubic-bezier(.2,.85,.2,1)}
.tb-text{display:flex;flex-direction:column;justify-content:center}
.t-tx{font:400 calc(var(--k) * 32px)/1.38 var(--tf),'Inter',sans-serif;color:color-mix(in srgb,var(--paper) 84%,transparent);text-wrap:pretty}
.gr-s .t-tx{color:var(--muted)}
.gr-l .t-tx{font-weight:600;color:var(--paper)}

/* --- Stoerer ----------------------------------------------------------- */
.tb-stoerer{display:flex;align-items:center;justify-content:center;padding:6px}
.t-st{position:relative;display:flex;align-items:center;justify-content:center;background:var(--accent);color:var(--on-accent);--rot:-9deg;transform:rotate(var(--rot));
  filter:drop-shadow(0 14px 26px rgba(0,0,0,.45));animation:t-pop .9s calc(var(--ein,0s) + .5s) both cubic-bezier(.2,1.5,.35,1)}
.t-st.f-stern{clip-path:polygon(50.0% 0.0%,55.6% 7.4%,62.9% 1.7%,66.5% 10.3%,75.0% 6.7%,76.2% 15.9%,85.4% 14.6%,84.1% 23.8%,93.3% 25.0%,89.7% 33.5%,98.3% 37.1%,92.6% 44.4%,100.0% 50.0%,92.6% 55.6%,98.3% 62.9%,89.7% 66.5%,93.3% 75.0%,84.1% 76.2%,85.4% 85.4%,76.2% 84.1%,75.0% 93.3%,66.5% 89.7%,62.9% 98.3%,55.6% 92.6%,50.0% 100.0%,44.4% 92.6%,37.1% 98.3%,33.5% 89.7%,25.0% 93.3%,23.8% 84.1%,14.6% 85.4%,15.9% 76.2%,6.7% 75.0%,10.3% 66.5%,1.7% 62.9%,7.4% 55.6%,0.0% 50.0%,7.4% 44.4%,1.7% 37.1%,10.3% 33.5%,6.7% 25.0%,15.9% 23.8%,14.6% 14.6%,23.8% 15.9%,25.0% 6.7%,33.5% 10.3%,37.1% 1.7%,44.4% 7.4%)}
.t-st.f-kreis{border-radius:50%;box-shadow:inset 0 0 0 .35em color-mix(in srgb,var(--on-accent) 22%,transparent)}
.t-st.f-band{width:100%;height:100%;--rot:-2.5deg;border-radius:var(--radius)}
.t-stin{text-align:center;line-height:1;padding:0 6%;animation:t-puls 4.5s 2.5s ease-in-out infinite}
@keyframes t-puls{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.t-stt{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);text-transform:var(--tt);letter-spacing:var(--ts);font-size:calc(var(--k) * 62px);line-height:.98}
.t-stz{font:700 calc(var(--k) * 19px)/1.15 var(--tf),'Inter',sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-top:.45em}

/* --- Bild oder Logo ------------------------------------------------- */
.tb-bild img{position:absolute;left:14px;top:14px;width:calc(100% - 28px);height:calc(100% - 28px);object-fit:contain}
.tb-bild.frei img{filter:drop-shadow(0 14px 24px rgba(0,0,0,.5))}
.tb-bild.fit-fuellen{padding:0;border-radius:var(--radius)}
.tb-bild.fit-fuellen img{left:0;top:0;width:100%;height:100%;object-fit:cover}

/* --- Im Studio: leere Bausteine sichtbar machen --------------------- */
.t-leer{border:3px dashed color-mix(in srgb,var(--paper) 28%,transparent);border-radius:14px;display:flex;align-items:center;justify-content:center;text-align:center}
.t-leertext{font:600 24px/1.25 var(--tf),'Inter',sans-serif;color:var(--muted);padding:0 10px}
.t-edit .t-b{animation:none}

/* ============================================================
   Vorlage SAELE IM UEBERBLICK (saele, 2026-10-15) - Tafel fuer die Kasse
   Jeder Saal eine Spalte (quer) bzw. Zeile (hoch). Alle Groessen in em: die Buehne
   setzt die Schrift der Reihe aus der Zellgroesse (cimis3-v-saele.js), fuer alle Zellen gleich.
   ============================================================ */
/* Kassentafel: immer die gut lesbare Schrift (Thomas 15.10.: "in diesem Element aber immer") - das Design
   bleibt in Farben, Ecken und Gross-/Kleinschreibung. Gewicht kraeftig, auch bei duennen Designschriften. */
.el-saele{background:var(--ink);--display:'Inter';--tw:700;--ts:-.01em}
.el-saele .a-deko::before{opacity:.75}

/* --- Kopf: Kinoname + Titel links (erster Bildschirm), Uhr rechts (letzter) --- */
.ss-kopf{position:absolute;top:38px;height:122px;display:flex;align-items:flex-end;justify-content:space-between;gap:40px;z-index:3;
  padding-bottom:18px;border-bottom:2px solid color-mix(in srgb,var(--paper) 12%,transparent)}
.ss-kopf-l{display:flex;flex-direction:column;gap:14px;min-width:0}
.ss-kino{display:flex;align-items:center;gap:16px;font:600 22px/1 'Inter',sans-serif;letter-spacing:.24em;text-transform:uppercase;
  color:var(--glow);white-space:nowrap;animation:a-ein .8s .1s both}
.ss-kino::before{content:'';flex:0 0 auto;width:44px;height:3px;background:var(--glow)}
.ss-ktitel{display:flex;align-items:baseline;gap:28px;white-space:nowrap;animation:a-ein .8s .2s both}
.ss-kt{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:var(--ts);text-transform:var(--tt);font-size:56px;line-height:1;color:var(--paper)}
.ss-kd{font:500 28px/1 'Inter',sans-serif;color:var(--muted)}
/* Kinologo vor dem Titel: klein, frei oder auf heller Flaeche bzw. mit seinem eigenen Hintergrund */
.ss-kopf-l.mit-logo{flex-direction:row;align-items:center;gap:30px}
.ss-kopf-l.mit-logo .ss-ktitel{padding-left:30px;border-left:2px solid color-mix(in srgb,var(--paper) 16%,transparent)}
.ss-logo{flex:0 0 auto;display:flex;align-items:center;justify-content:center;animation:a-ein .8s .1s both}
.ss-logo img{display:block}
.ss-logo.wartet{visibility:hidden}
.ss-logo.platte{background:#fff;border-radius:min(var(--radius),14px);padding:10px 16px;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.ss-logo.mit-grund img{border-radius:min(var(--radius),12px);box-shadow:0 8px 24px rgba(0,0,0,.35)}
.ss-logo.frei img{filter:drop-shadow(0 4px 14px rgba(0,0,0,.45))}
[data-format="hoch"] .ss-kopf-l.mit-logo{gap:26px}
[data-format="hoch"] .ss-kopf-l.mit-logo .ss-ktitel{padding-left:26px}
[data-format="hoch"] .ss-kopf-l.mit-logo .ss-kt{font-size:48px}
[data-format="hoch"] .ss-kopf-l.mit-logo .ss-kd{font-size:24px}
.ss-kopf-l{min-width:0}
.ss-kt{white-space:nowrap}
.ss-uhr{font:700 74px/.9 'Inter',sans-serif;color:var(--paper);font-variant-numeric:tabular-nums;letter-spacing:-.01em;animation:a-ein .8s .25s both}
[data-format="hoch"] .ss-kopf{top:56px;height:178px}
[data-format="hoch"] .ss-ktitel{flex-direction:column;align-items:flex-start;gap:14px}
[data-format="hoch"] .ss-kt{font-size:62px}
[data-format="hoch"] .ss-uhr{font-size:84px}

/* --- Reihe der Saele --- */
.ss-reihe{position:absolute;top:186px;bottom:44px;display:grid;z-index:3;font-size:28px}
[data-format="hoch"] .ss-reihe{top:262px;bottom:50px}

/* --- eine Spalte --- */
.ss-spalte{position:relative;min-width:0;min-height:0;overflow:hidden;display:flex;flex-direction:column;
  padding:.75em .75em .65em;border-radius:min(var(--radius),22px);background:var(--ink2);
  border:1px solid color-mix(in srgb,var(--paper) 11%,transparent);box-shadow:0 24px 60px rgba(0,0,0,.35);
  animation:ss-ein .9s both cubic-bezier(.2,.85,.2,1)}
@keyframes ss-ein{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
.ss-spalte>*:not(.ss-hg){position:relative;z-index:1}
/* Hintergrund: das Plakat, stark weichgezeichnet und abgedunkelt */
.ss-hg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.ss-hg img{position:absolute;left:-12%;top:-12%;width:124%;height:124%;object-fit:cover;filter:blur(34px) saturate(1.3);opacity:.6}
.ss-hg::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,
  color-mix(in srgb,var(--ink2) 35%,transparent) 0%,color-mix(in srgb,var(--ink2) 66%,transparent) 48%,color-mix(in srgb,var(--ink2) 94%,transparent) 100%)}

.ss-skopf{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:.32em;margin-bottom:.55em}
.ss-saal{max-width:100%;font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);text-transform:uppercase;letter-spacing:.07em;
  font-size:.92em;line-height:1.15;color:var(--paper);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ss-skopf::after{content:'';display:block;width:1.6em;height:3px;border-radius:2px;background:var(--glow)}

.ss-plakat{flex:1 1 0;min-height:3.5em;display:flex;align-items:center;justify-content:center}   /* Titel rueckt per JS darunter (passen) */
.ss-pk{position:relative;flex:0 0 auto;width:0;height:0;overflow:hidden;border-radius:calc(min(var(--radius),22px) * .5);background:var(--ink);
  box-shadow:0 18px 44px rgba(0,0,0,.55),0 0 0 1px color-mix(in srgb,var(--paper) 14%,transparent);animation:ss-plakat 1.1s .2s both cubic-bezier(.2,.85,.2,1)}
@keyframes ss-plakat{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
.ss-pk img{display:block;width:100%;height:100%;object-fit:cover}
.ss-pk.leer{display:flex;align-items:center;justify-content:center;padding:.6em;text-align:center;background:linear-gradient(150deg,var(--deep),var(--ink))}
.ss-pk.leer span{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);font-size:.9em;line-height:1.15;color:var(--paper)}

.ss-info{flex:0 0 auto;margin-top:.4em;text-align:center}
.ss-tbox{display:flex;align-items:flex-start;justify-content:center;min-height:2.3em}   /* einzeiliger Titel bleibt oben am Plakat */
.ss-titel{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:var(--ts);text-transform:var(--tt);font-size:1.02em;line-height:1.13;
  color:var(--paper);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.ss-status{display:flex;align-items:center;justify-content:center;gap:.5em;margin-top:.6em;font:700 .58em/1.2 'Inter',sans-serif;
  letter-spacing:.13em;text-transform:uppercase;color:var(--muted);white-space:nowrap}   /* kein overflow:hidden: im Raster der breiten Zellen wuerde die Zeile sonst gequetscht */
.ss-status span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.z-einlass .ss-status,.z-vorprogramm .ss-status,.z-begonnen .ss-status{color:var(--glow)}
.ss-punkt{flex:0 0 auto;width:.75em;height:.75em;border-radius:50%;background:var(--glow);animation:ss-puls 1.8s ease-out infinite}
@keyframes ss-puls{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--glow) 70%,transparent)}100%{box-shadow:0 0 0 .9em transparent}}
.ss-zeitreihe{display:flex;flex-direction:column;align-items:center;gap:.28em;margin-top:.22em}
.ss-zeit{font:800 2.75em/1 'Inter',sans-serif;letter-spacing:-.02em;color:var(--paper);font-variant-numeric:tabular-nums}
.z-einlass .ss-zeit{color:var(--glow)}
.z-laeuft .ss-zeit{color:color-mix(in srgb,var(--paper) 46%,transparent)}
.ss-fakten{display:flex;flex-wrap:wrap;justify-content:center;column-gap:1em;row-gap:.2em;font:500 .6em/1.2 'Inter',sans-serif;
  color:color-mix(in srgb,var(--paper) 74%,transparent);white-space:nowrap}
.ss-ende{color:var(--paper);font-weight:600}
.ss-marken{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:.4em;margin-top:.55em;font-size:.6em}   /* ohne overflow:hidden - sonst quetscht das Raster die Zeile */
.ss-marken .k-fsk{font-size:1em}
.ss-reihe.marken2 .ss-marken{flex-wrap:wrap;align-content:center;row-gap:.32em;height:calc(3.8em + 9px)}
.ss-tech{display:inline-flex;align-items:center;padding:.38em .6em .36em;border-radius:.34em;border:2px solid color-mix(in srgb,var(--paper) 38%,transparent);
  font:700 1em/1 'Inter',sans-serif;letter-spacing:.04em;color:var(--paper);white-space:nowrap}
.ss-danach{flex:0 0 auto;display:flex;align-items:baseline;justify-content:center;gap:.45em;margin-top:.7em;padding-top:.6em;
  border-top:1px solid color-mix(in srgb,var(--paper) 15%,transparent);font:500 .58em/1.25 'Inter',sans-serif;color:var(--muted);white-space:nowrap;min-width:0}
.ss-danach b{font-weight:700;color:var(--paper);font-variant-numeric:tabular-nums}
.ss-di{flex:0 0 auto;align-self:center;width:1.2em;height:1.2em;color:var(--glow);transform:translateY(-.08em)}
.ss-dt{min-width:0;overflow:hidden;text-overflow:ellipsis;color:color-mix(in srgb,var(--paper) 78%,transparent)}
/* zu langer Titel: laeuft durch - kurz stehen, langsam nach links bis zum Ende, kurz stehen, ausblenden, von vorn */
.ss-dt.laeuft{text-overflow:clip;margin-left:-.2em;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 .9em,#000 calc(100% - 1.4em),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 .9em,#000 calc(100% - 1.4em),transparent)}
.ss-lauf{display:inline-block;white-space:nowrap;padding-left:.9em;animation:ss-lauf 10s linear infinite;will-change:transform}
@keyframes ss-lauf{0%{transform:translateX(0);opacity:0}4%{opacity:1}20%{transform:translateX(0)}80%{transform:translateX(var(--weg))}95%{transform:translateX(var(--weg));opacity:1}100%{transform:translateX(var(--weg));opacity:0}}
.ss-leer{flex:1 1 auto;display:flex;align-items:center;justify-content:center;padding:1em;text-align:center;font:500 .68em/1.35 'Inter',sans-serif;color:var(--muted)}
.ss-spalte.z-einlass{border-color:color-mix(in srgb,var(--glow) 60%,transparent);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--glow) 35%,transparent),0 24px 60px rgba(0,0,0,.35),0 0 60px color-mix(in srgb,var(--glow) 16%,transparent)}

/* --- Theken-Spalte: Produkte wechseln weich ueberblendet --- */
.ss-theke{background:linear-gradient(180deg,color-mix(in srgb,var(--deep) 60%,var(--ink2)) 0%,var(--ink2) 72%)}
.ss-tbuehne{position:relative;flex:1 1 0;min-height:0}
.ss-prod{position:absolute;inset:0;display:flex;flex-direction:column;opacity:0;transition:opacity 1s ease}
.ss-prod.an{opacity:1}
.ss-pbild{position:relative;flex:1 1 0;min-height:0}
.ss-pbild img{position:absolute;left:6%;top:4%;width:88%;height:92%;object-fit:contain;z-index:1;
  filter:drop-shadow(0 22px 30px rgba(0,0,0,.55));animation:ss-schweben 7s ease-in-out infinite}
.ss-pbild:not(.frei) img{border-radius:calc(min(var(--radius),22px) * .5);object-fit:cover;filter:none;box-shadow:0 18px 40px rgba(0,0,0,.5)}
@keyframes ss-schweben{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.5%)}}
.ss-halo{position:absolute;left:8%;right:8%;top:10%;bottom:4%;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 36%,transparent) 0%,color-mix(in srgb,var(--accent) 10%,transparent) 42%,transparent 68%)}
.ss-ptext{flex:0 0 auto;margin-top:.5em;text-align:center}
.ss-pmerk{display:inline-block;margin-bottom:.55em;padding:.34em .75em .32em;border-radius:99px;background:var(--accent);color:var(--on-accent);
  font:800 .5em/1 'Inter',sans-serif;letter-spacing:.1em;text-transform:uppercase}
.ss-pname{font-family:var(--display),'Inter',sans-serif;font-weight:var(--tw);letter-spacing:var(--ts);text-transform:var(--tt);font-size:1.08em;line-height:1.12;
  color:var(--paper);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.ss-pzusatz{margin-top:.3em;font:400 .55em/1.3 'Inter',sans-serif;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ss-ppreis{display:flex;align-items:baseline;justify-content:center;gap:.45em;margin-top:.4em}
.ss-ppreis b{font:800 2em/1 'Inter',sans-serif;letter-spacing:-.02em;color:var(--glow);font-variant-numeric:tabular-nums;white-space:nowrap}
.ss-pg{font:600 .6em/1 'Inter',sans-serif;color:var(--muted);white-space:nowrap}
.ss-ptab{display:flex;flex-direction:column;gap:.3em;max-width:11em;margin:.55em auto 0}
.ss-pz{display:flex;align-items:baseline;gap:.45em;font:600 .68em/1.2 'Inter',sans-serif}
.ss-pz span{color:var(--muted);white-space:nowrap}
.ss-pz i{flex:1 1 auto;min-width:.6em;border-bottom:2px dotted color-mix(in srgb,var(--paper) 26%,transparent);transform:translateY(-.28em)}
.ss-pz b{font-weight:800;font-size:1.3em;color:var(--glow);font-variant-numeric:tabular-nums;white-space:nowrap}
.ss-pfand{margin-top:.4em;font:400 .46em/1.2 'Inter',sans-serif;color:var(--muted)}
.ss-tpunkte{flex:0 0 auto;display:flex;justify-content:center;gap:.36em;margin-top:.65em}
.ss-tpunkte i{display:block;width:.36em;height:.36em;border-radius:.2em;background:color-mix(in srgb,var(--paper) 26%,transparent);transition:all .6s}
.ss-tpunkte i.an{width:1.1em;background:var(--glow)}

/* --- Film-Spalte (Thomas 16.10.: neue Filme der naechsten Woche oder Vorschau): wie eine Saal-Spalte,
       je Film eine Ebene, die Ebenen und ihr Plakat-Hintergrund wechseln weich ueberblendet --- */
.ss-w-hg{opacity:0;transition:opacity 1.2s ease}
.ss-w-hg.an{opacity:1}
.ss-fslide{position:absolute;inset:0;display:flex;flex-direction:column;opacity:0;transition:opacity 1s ease}
.ss-fslide.an{opacity:1}
.ss-fplatz{display:none}
.ss-zeit.ss-zlang{font-size:1.25em;line-height:1.15;letter-spacing:0;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;color:var(--glow)}
.ss-fstatus{color:var(--glow)}
.ss-marken.ss-mleer{visibility:hidden}
/* Punkte genau so hoch wie die Zeile "Danach" der Saele (gleiche Schrift- und Abstandsmasse) - so stehen
   Status, Datum und FSK auf der Linie der Saal-Spalten (Thomas 16.10.: "Ab Donnerstag" stand hoeher) */
.ss-filmsp .ss-tpunkte{font-size:.58em;align-items:center;gap:.62em;margin-top:.7em;padding-top:.6em;height:1.25em;
  border-top:1px solid color-mix(in srgb,var(--paper) 15%,transparent);box-sizing:content-box}
.ss-filmsp .ss-tpunkte i{width:.62em;height:.62em;border-radius:.34em}
.ss-filmsp .ss-tpunkte i.an{width:1.9em}
.ss-reihe.ohne-danach .ss-filmsp .ss-tpunkte{position:absolute;left:0;right:0;bottom:.3em;margin:0;padding:0;height:auto;border:0}

/* --- Breite Zellen (Hochformat, quer mit ein oder zwei Saelen): Plakat links, Titel in der Mitte,
       Uhrzeit rechts. .ss-info loest sich auf (display:contents), seine Teile liegen direkt im Raster. --- */
.ss-reihe.breit .ss-spalte{display:grid;grid-template-columns:var(--pw,30%) minmax(0,1fr) auto;
  grid-template-rows:auto auto auto auto minmax(0,1fr) auto;column-gap:1em;padding:.6em 1.1em .6em .6em}
.ss-reihe.breit .ss-plakat{grid-column:1;grid-row:1 / 7;min-height:0;align-items:center}
.ss-reihe.breit .ss-skopf{grid-column:2;grid-row:1;align-items:flex-start;margin:.15em 0 .35em}
.ss-reihe.breit .ss-info{display:contents;text-align:left}
.ss-reihe.breit .ss-info>*{position:relative;z-index:1}
.ss-reihe.breit .ss-tbox{grid-column:2;grid-row:2;justify-content:flex-start;min-height:auto}   /* nie unter den Titel schrumpfen (0 liess den Status in den Titel rutschen) */
.ss-reihe.breit .ss-titel{font-size:1.12em}
.ss-reihe.breit .ss-status{grid-column:2;grid-row:3;justify-content:flex-start;margin-top:1.1em;white-space:normal}
.ss-reihe.breit .ss-marken{grid-column:2;grid-row:4;justify-content:flex-start;margin-top:.5em}
.ss-reihe.breit .ss-zeitreihe{grid-column:3;grid-row:1 / 7;align-self:center;align-items:flex-end;margin:0;gap:.3em}
.ss-reihe.breit .ss-zeit{font-size:3em}
.ss-reihe.breit .ss-fakten{flex-direction:column;align-items:flex-end;row-gap:.25em}
.ss-reihe.breit .ss-danach{grid-column:2 / 4;grid-row:6;justify-content:flex-start;margin-top:.35em;padding-top:.45em}
.ss-reihe.breit .ss-leer{grid-column:1 / 4;grid-row:1 / 7}
.ss-reihe.breit .ss-theke .ss-tbuehne,.ss-reihe.breit .ss-filmsp .ss-tbuehne{grid-column:1 / 4;grid-row:1 / 7}
.ss-reihe.breit .ss-theke .ss-skopf,.ss-reihe.breit .ss-filmsp>.ss-skopf{position:relative;z-index:2}
/* Film-Spalte breit: jede Ebene ist selbst das Raster der Saal-Zelle, ihr Kopf-Platzhalter haelt Zeile 1 frei */
.ss-reihe.breit .ss-fslide{display:grid;grid-template-columns:var(--pw,30%) minmax(0,1fr) auto;
  grid-template-rows:auto auto auto auto minmax(0,1fr) auto;column-gap:1em}
.ss-reihe.breit .ss-fplatz{display:flex;visibility:hidden}
.ss-reihe.breit .ss-filmsp .ss-tpunkte{grid-column:2 / 4;grid-row:6;position:relative;left:auto;right:auto;bottom:auto;border:0;padding-top:0;margin-top:.3em}
.ss-reihe.breit .ss-prod{flex-direction:row;align-items:stretch}
.ss-reihe.breit .ss-pbild{flex:0 0 var(--pw,30%)}
.ss-reihe.breit .ss-ptext{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:1em;margin:0 0 0 1em;text-align:left}
.ss-reihe.breit .ss-pk1{flex:1 1 auto;min-width:0;margin-top:1.5em}
.ss-reihe.breit .ss-pk2{flex:0 0 auto;text-align:right}
.ss-reihe.breit .ss-ppreis{flex-direction:column;align-items:flex-end;gap:.2em;margin-top:0}
.ss-reihe.breit .ss-ppreis b{font-size:2.6em}
.ss-reihe.breit .ss-ptab{margin:0;min-width:9.5em}
.ss-reihe.breit .ss-pz{font-size:.78em}
.ss-reihe.breit .ss-tpunkte{grid-column:2 / 4;grid-row:6;justify-content:flex-start;position:relative;z-index:2}
.mess .ss-spalte,.mess .ss-pk{animation:none}