.ff-schedule {
          width: 100%;
          max-width: var(--ff-page-max-width, 1920px);
          margin: clamp(32px, 5vw, 72px) auto;
          padding-left:  var(--ff-page-gutter, 20px);
          padding-right: var(--ff-page-gutter, 20px);
          /* Platz unter dem Raster, damit der horizontale Scrollbalken UNTER dem
             Timetable liegt und nicht über der untersten Uhrzeit. */
          padding-bottom: 18px;
          box-sizing: border-box;
          overflow-x: auto;
          /* Nur horizontal scrollen. overflow-x:auto würde sonst per Spec
             overflow-y auf 'auto' heben → bei Sub-Pixel-Rundung der Grid-Zeilen
             erscheint ein unerwünschter vertikaler Scrollbalken. */
          overflow-y: hidden;
          -webkit-overflow-scrolling: touch;
        }

        /* Wenn .ff-schedule in einem Elementor-Container (.e-con, egal welcher
           Widget-Typ: Shortcode, Text-Editor, …) oder einem Gutenberg-Shortcode
           liegt, gibt es Breite/horizontales Padding an den Container ab. Sonst
           addiert sich der eigene Gutter auf den Container-Gutter → doppelter
           Rand. (Vertikale margin bleibt erhalten.) */
        .e-con .ff-schedule,
        .wp-block-shortcode > .ff-schedule {
          /* Full-Bleed: das Timetable bricht aus dem Content-Container auf die
             volle Viewport-Breite aus, sodass der horizontale Overflow erst am
             Browserrand abgeschnitten wird (nicht am Rand des Content-Bereichs).
             Linkes/rechtes Padding = exakt die Seiten-Gutter-Formel aus
             ff-editions.php → das Raster startet bündig zum übrigen Seiteninhalt;
             das Clipping (overflow) liegt an der Element-Box = Browserrand. */
          width: 100vw;
          max-width: 100vw;
          margin-left:  calc(50% - 50vw);
          margin-right: calc(50% - 50vw);
          /* Linkes Padding = 0: der Seiten-Gutter steckt jetzt in der ersten
             Grid-Spalte (Zeit-Spalte), die deshalb bis zum linken Browserrand
             weiß hinterlegt ist und beim Scrollen fixiert bleibt. */
          padding-left:  0;
          padding-right: max(var(--ff-page-gutter, 20px), calc((100vw - var(--ff-page-max-width, 1920px)) / 2));
          box-sizing: border-box;
        }

        /* Der Container, in dem der Timetable liegt, bleibt auf der globalen
           Content-Spalte gedeckelt. Wichtig: nicht max-width:none setzen —
           sonst laufen Titel, Intro und Tabs auf großen Viewports über 1920px.
           Der Timetable selbst bricht darunter weiterhin per width:100vw aus,
           damit nur sein Raster horizontal am Browserrand scrollt. */
        [data-elementor-type] > .e-con-boxed > .e-con-inner:has(.ff-schedule),
        .e-con.e-parent > .e-con-inner:has(.ff-schedule) {
          width: var(--ff-page-boxed-width, min(calc(100vw - 40px), 1920px)) !important;
          max-width: var(--ff-page-boxed-width, min(calc(100vw - 40px), 1920px)) !important;
          margin-left: auto !important;
          margin-right: auto !important;
        }

        /* In schmalen Viewports (≤1024px) liefert bereits die Section (.e-con)
           den Seiten-Gutter (ff-editions.php). Das e-con-inner darf hier KEIN
           eigenes horizontales Padding mehr haben — sonst doppelter Rand.
           > 1024px behält das e-con-inner die zentrierende Padding-Formel
           (Gutter < 1920px, ab 1920px mittig gedeckelt). */
        @media (max-width: 1024px) {
          [data-elementor-type] > .e-con-boxed > .e-con-inner:has(.ff-schedule),
          .e-con.e-parent > .e-con-inner:has(.ff-schedule) {
            padding-left: 0 !important;
            padding-right: 0 !important;
          }
        }

        /* Nur das Timetable scrollt horizontal, nicht die Seite: die Flex-Kette
           um das Raster darf unter dessen min-width schrumpfen (min-width: 0),
           damit .ff-schedule auf Content-Breite bleibt und das breite Raster
           INNERHALB davon scrollt (overflow-x: auto). overflow: visible an den
           Vorfahren verhindert zusätzliches Abschneiden; <body> bleibt bewusst
           geclippt (Astra), damit die Seite nicht horizontal scrollt. */
        .e-con:has(.ff-schedule),
        .e-con:has(.ff-schedule) > .e-con-inner,
        .elementor-widget:has(.ff-schedule),
        .elementor-widget:has(.ff-schedule) > .elementor-widget-container {
          min-width: 0;
          overflow: visible;
        }

        .ff-schedule__title {
          margin: 0 0 24px;
          font-family: var(--ff-font-display, inherit);
          font-size: 2.25rem; /* 36px – harmonisiert mit Kit H1/H2 */
          font-weight: 700;
          line-height: .95;
          text-transform: uppercase;
        }

        .ff-schedule__grid {
          display: grid;
          /* Einheitlicher Gap in allen Viewports. */
          gap: 8px;
          min-width: 980px;
          align-items: stretch;
        }

        .ff-schedule__stage-header,
        .ff-schedule__time-header {
          position: sticky;
          top: 0;
          z-index: 3;
          background: #fff;
        }

        /* Eck-Zelle (oben links): bleibt sowohl beim horizontalen Scrollen
           (left:0) als auch über allem anderen liegen. */
        .ff-schedule__time-header {
          left: 0;
          z-index: 7;
        }

        /* Durchgehende weiße Fläche hinter der fixierten Zeit-Spalte. */
        .ff-schedule__time-cover {
          grid-column: 1;
          grid-row: 1 / -1;
          position: sticky;
          left: 0;
          z-index: 5;
          background: #fff;
          pointer-events: none;
          /* 8px weißer Puffer rechts (= Grid-Gap), blur-frei → kein vertikaler
             Bleed. Der Schlagschatten kommt als ::after-Gradient (siehe unten),
             exakt auf Spaltenhöhe begrenzt, damit er nicht nach unten austritt. */
          box-shadow: 8px 0 0 0 #fff;
        }
        .ff-schedule__time-cover::after {
          content: "";
          position: absolute;
          top: 0; bottom: 0;
          left: 100%;
          margin-left: 8px;
          width: 24px;
          background: linear-gradient(90deg, rgba(0, 0, 0, .10) 0%, rgba(0, 0, 0, .03) 50%, rgba(0, 0, 0, 0) 100%);
          opacity: 0;
          transition: opacity .2s ease;
          pointer-events: none;
        }
        .ff-schedule.is-scrolled .ff-schedule__time-cover::after {
          opacity: 1;
        }
        /* Spacer unter der letzten Uhrzeit – gleiche Höhe wie die Kopfzeile
           (Padding-top 36 + Padding-bottom 10 + Zeilenhöhe ~14), für symmetrischen
           Abstand oben/unten in der Zeit-Spalte. */
        .ff-schedule__time-pad {
          height: 60px;
        }

        .ff-schedule__stage-header {
          padding: 36px 12px 10px;
          border: 0;
          border-radius: 0;
          font-family: var(--ff-font-display, inherit);
          font-size: 13px;
          font-weight: 700;
          line-height: 1.1;
          text-transform: uppercase;
          letter-spacing: .04em;
          text-align: center;
        }

        .ff-schedule__time {
          position: sticky;
          left: 0;
          z-index: 6;
          background: #fff;
          padding-top: 12px;
          color: #2B2E34;
          font-family: "futura-pt", sans-serif;
          font-size: 13px;
          font-weight: 400;
          font-variant-numeric: tabular-nums;
          font-feature-settings: "tnum" 1, "lnum" 1;
          line-height: 1;
          text-align: right;
          white-space: nowrap;
        }

        .ff-schedule__time.is-hour {
          color: #2B2E34;
        }

        .ff-schedule__time.is-half-hour {
          color: #2B2E34;
        }

        .ff-schedule__time.is-hour::before,
        .ff-schedule__time.is-half-hour::before {
          content: "";
          position: absolute;
          top: 0;
          right: 0;
          width: 42px;
          height: 1px;
        }
        /* Linien über den Uhrzeiten (linke Spalte): einheitlich heller Grauton,
           unabhängig davon ob volle oder halbe Stunde. */
        .ff-schedule__time.is-hour::before,
        .ff-schedule__time.is-half-hour::before {
          background: #c4c4c4;
        }

        /* Komprimiertes End-Label (echtes Endzeit eines visuell verkürzten
           Full-Width-Plenarys wie Sundowner) etwas akzentuiert, damit klar
           ist: hier endet das Event tatsächlich, nicht in der visuell
           erreichten Slot-Zeit. */
        .ff-schedule__time.is-compressed-end {
          color: #2B2E34;
          font-weight: 400;
          letter-spacing: .02em;
        }
        .ff-schedule__time.is-compressed-end::before {
          width: 42px;
          background: #c4c4c4;
          height: 1px;
        }

        /* Hellgraue Platzhalterfläche je Bühnen-Spalte/Zeit-Slot. Liegt hinter
           den Session-Karten (z-index 0) und fängt keine Klicks ab. */
        .ff-schedule__stage-bg {
          z-index: 0;
          background: #f7f7f7;
          pointer-events: none;
        }

        /* .ff-schedule__session ist jetzt ein Block-Element (<div>), das
           im Grid positioniert wird. .ff-schedule__session-link (<a>) füllt
           die Zelle vollständig aus (position:absolute, inset:0). */
        .ff-schedule__session {
          position: relative;
          z-index: 1;
          transition: transform .16s ease;
        }

        .ff-schedule__session:hover,
        .ff-schedule__session:focus-within {
          /* unter der fixierten Zeit-Spalte bleiben (time-cover z5, time z6),
             aber über benachbarten Karten (z1). */
          z-index: 4;
        }

        .ff-schedule__session-link {
          transition: filter .16s ease;
        }

        .ff-schedule__session:hover .ff-schedule__session-link,
        .ff-schedule__session:focus-within .ff-schedule__session-link {
          filter: brightness(0.92) saturate(1.18);
        }

        .ff-schedule__session-link,
        .ff-schedule__session-link:link,
        .ff-schedule__session-link:visited {
          display: flex;
          flex-direction: column;
          gap: 6px;
          padding: 12px;
          width: 100%;
          height: 100%;
          min-height: 100%;
          box-sizing: border-box;
          border-radius: 0;
          color: var(--ff-session-fg, #2B2E34);
          background: var(--ff-session-bg, #e6e6e6);
          box-shadow: none;
          text-decoration: none !important;
          overflow: visible;
        }

        .ff-schedule__session-link * {
          text-decoration: none !important;
        }

        .ff-schedule__session.is-full-width .ff-schedule__session-link {
          align-items: center;
          justify-content: center;
          text-align: center;
        }

        .ff-schedule__track {
          font-family: "futura-pt", sans-serif;
          font-size: 13px;
          font-weight: 500;
          line-height: 1;
          text-transform: uppercase;
          letter-spacing: .06em;
          opacity: .78;
        }

        .ff-schedule__type,
        .ff-schedule__plenary-title {
          font-family: "Berlin Type", sans-serif;
          font-size: clamp(14px, 1.3vw, 18px);
          font-weight: 700;
          line-height: 1.2;
          text-transform: none;
          overflow-wrap: anywhere;
        }

        .ff-schedule__speakers {
          font-family: "futura-pt", sans-serif;
          font-size: 13px;
          font-weight: 400;
          line-height: 1.25;
          opacity: .82;
          overflow-wrap: anywhere;
        }

        .ff-schedule__time-label {
          margin-top: auto;
          font-family: "futura-pt", sans-serif;
          font-size: 13px;
          font-weight: 400;
          font-variant-numeric: tabular-nums;
          font-feature-settings: "tnum" 1, "lnum" 1;
          line-height: 1.25;
          opacity: .82;
        }

        .ff-schedule__session.is-full-width {
          align-items: center;
          justify-content: center;
          text-align: center;
        }

        @media (max-width: 767px) {
          .ff-schedule__grid {
            min-width: 860px;
          }
        }

        /* ───────── Tag-Umschalter (Tabs) ───────── */
        .ff-schedule-tabs__nav {
          display: flex;
          flex-wrap: wrap;
          justify-content: flex-start;
          gap: clamp(14px, 3vw, 40px);
          margin: 0;
          border-bottom: 1px solid #c4c4c4;
        }
        .ff-schedule-tabs__tab {
          -webkit-appearance: none; appearance: none;
          background: transparent !important; border: 0;
          border-bottom: 3px solid transparent;
          margin: 0 0 -1px; padding: 0 0 10px;
          display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 3px;
          cursor: pointer;
          color: #2B2E34;
          font-family: var(--ff-font-display, inherit);
          transition: color .15s ease, border-color .15s ease;
        }
        .ff-schedule-tabs__tab:hover,
        .ff-schedule-tabs__tab:focus,
        .ff-schedule-tabs__tab:active {
          background: transparent !important;
          box-shadow: none !important;
        }
        .ff-schedule-tabs__tab:not(.is-active):hover,
        .ff-schedule-tabs__tab:not(.is-active):focus-visible {
          border-bottom-color: #2B2E34;
        }
        .ff-schedule-tabs__date {
          font-size: var(--e-global-typography-text-font-size, 1rem);
          font-weight: 400;
          line-height: 1.1;
          letter-spacing: .02em;
          color: inherit;
          opacity: 1;
        }
        .ff-schedule-tabs__tab.is-active {
          color: var(--ff-color-accent, #A6007D);
          border-bottom-color: var(--ff-color-accent, #A6007D);
        }
        .ff-schedule-tabs__tab:focus-visible {
          outline: 2px solid var(--ff-color-accent, #A6007D);
          outline-offset: 3px;
        }
        .ff-schedule-tabs__panel[hidden] { display: none; }
        .ff-schedule-tabs__panel .ff-schedule { margin-top: 0; }