/*
 * SUBWAY · Heftregal – Magazinarchiv V2 (Stefan 08.10.2026)
 * Ein Jahrgang = Wand mit Regalbrettern. Hefte stehen auf dem Brett, nach hinten gelehnt, gemeinsamer Fluchtpunkt je Brett.
 * Bewegung wie Referenz: Hover = Heft hebt sich vom Brett, richtet sich auf, kommt nach vorn; Verlassen = fällt zurück und federt nach.
 * Einfall beim ersten Sichtbarwerden = dieselbe Rückfall-Bewegung (heftregal.js, zufällige Reihenfolge); danach alle 3–6 s ein
 * zufälliges Heft kurz vor und zurück. Nur transform/opacity.
 * 12 Monatsplätze je Jahrgang (Dezember oben links … Januar unten rechts); je Breite eine eigene Brettaufteilung
 * (.sw-regal__variante--6 / --4 / --3). Fehlende Ausgabe = leerer Platz; Doppelausgaben belegen zwei Monate, Hefte eines Bretts stehen mittig.
 */

.sw-regal {
	--n: 3; --g: 14px; --o: 14px; --wp: 0px; --reihe: 48px;
	--oben: 8px; --kante: 10px;          /* Brett: sichtbare Oberseite + Vorderkante */
	--brett: calc(var(--oben) + var(--kante));
	--w: calc((100cqw - 2 * var(--o) - (var(--n) - 1) * var(--g)) / var(--n));
	--h: calc(var(--w) * 814 / 600);     /* Coverhöhe im Originalformat 600 : 814 */
	--flucht: calc(var(--oben) * .8);   /* so weit läuft die Brett-Oberseite an den Enden nach innen (Perspektive) */
	--fallen: transform .7s cubic-bezier(.3, 1.45, .45, 1);   /* zurück aufs Brett, leichtes Nachfedern */
	--heben: transform .42s cubic-bezier(.2, .8, .2, 1);      /* vom Brett abheben */
	margin-top: clamp(64px, 9vw, 140px);
	scroll-margin-top: 96px;
}
.sw-regal__kopf { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--sw-space-2) var(--sw-space-5); margin-bottom: var(--sw-space-5); }
.sw-regal__jahr { margin: 0; font-family: var(--sw-font-display); font-weight: 400; font-synthesis: none; font-size: clamp(64px, 10vw, 152px); line-height: .82; letter-spacing: -0.01em; color: var(--sw-ink); }
.sw-regal__anzahl { margin: 0; font-family: var(--sw-font-ui); font-weight: 700; font-size: var(--sw-fs-label); letter-spacing: var(--sw-tracking-dachzeile); text-transform: uppercase; color: var(--sw-text-2); }

/* Wand = Seitenhintergrund (keine Kante); nur ein weicher Lichtschein, der zu allen Rändern vollständig ausläuft */
.sw-regal__wand {
	container-type: inline-size;
	padding: clamp(32px, 4.5vw, 64px) var(--wp) clamp(28px, 4vw, 56px);
	background: radial-gradient(closest-side, rgba(255, 255, 255, .55) 0%, rgba(255, 255, 255, .22) 55%, rgba(255, 255, 255, 0) 100%); /* läuft an allen Rändern auf den Seitengrund aus */
}
.sw-regal__variante { display: none; }
.sw-regal__variante--3 { display: grid; gap: var(--reihe); }

/* Brett = eine Reihe: Hefte mittig, ein durchgehendes Brett mit perspektivisch schrägen Enden und Wandschatten */
.sw-regal__brett { position: relative; display: flex; justify-content: center; gap: var(--g); margin: 0; padding: 0 var(--o); list-style: none; }
.sw-regal__brett::after,
.sw-regal__brett::before { content: ""; position: absolute; left: 0; right: 0; pointer-events: none; }
.sw-regal__brett::after { /* Oberseite (von oben gesehen, hinten verschattet) + helle Vorderkante mit Unterkante */
	top: calc(var(--h) - var(--oben) * .45); height: var(--brett); z-index: 0;
	background: linear-gradient(180deg,
		#D9D2C5 0, #EAE5DC 3px, #F5F2EC var(--oben),
		#FFFFFF var(--oben), #FCFBF8 calc(var(--oben) + 3px), #EEE9E1 calc(100% - 2px), #CBC3B5 100%);
	clip-path: polygon(var(--flucht) 0, calc(100% - var(--flucht)) 0, 100% var(--oben), 100% 100%, 0 100%, 0 var(--oben));
}
.sw-regal__brett::before { /* langer, weicher Wandschatten, an den Enden auslaufend */
	top: calc(var(--h) - var(--oben) * .45 + var(--brett)); height: calc(var(--brett) * 3); z-index: 0;
	background: linear-gradient(180deg, rgba(20, 17, 15, .3) 0, rgba(20, 17, 15, .19) 10%, rgba(20, 17, 15, .1) 28%, rgba(20, 17, 15, .045) 52%, rgba(20, 17, 15, .015) 76%, rgba(20, 17, 15, 0) 100%);
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 calc(var(--o) * 1.6), #000 calc(100% - var(--o) * 1.6), transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 calc(var(--o) * 1.6), #000 calc(100% - var(--o) * 1.6), transparent 100%);
}
.sw-regal__platz { position: relative; flex: 0 0 var(--w); min-width: 0; min-height: calc(var(--h) + var(--brett)); }

/* Heft: gemeinsamer Fluchtpunkt über der Brettmitte (--c = Platz im Brett, --k = Plätze im Brett) */
.sw-regal__heft {
	position: relative; z-index: 1; display: grid; gap: calc(var(--brett) * 1.6 + 8px); color: var(--sw-ink); text-decoration: none;
	perspective: 2000px;
	perspective-origin: calc(50% + ((var(--k, var(--n)) - 1) / 2 - var(--c, 0)) * (var(--w) + var(--g))) -30%;
}
.sw-regal__heft::before { /* Kontaktschatten auf dem Brett – bleibt liegen, wenn das Heft abhebt */
	content: ""; position: absolute; z-index: 0; left: 3%; right: 3%; top: calc(var(--h) - var(--oben) * .5); height: calc(var(--oben) + 4px);
	background: radial-gradient(60% 100% at 50% 0, rgba(20, 17, 15, .5), rgba(20, 17, 15, 0) 100%);
	transition: opacity .5s ease, transform .5s ease;
}
.sw-regal__cover {
	position: relative; z-index: 1; display: block; aspect-ratio: 600 / 814;
	transform-origin: 50% 100%;
	transform: rotateX(var(--neig, 3.5deg));
	transition: var(--fallen);
}
.sw-regal__img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: 50% 100%; background: var(--sw-paper-2);
	box-shadow: 0 1px 2px rgba(20, 17, 15, .25), 0 28px 40px -22px rgba(20, 17, 15, .6), 0 0 34px -10px rgba(20, 17, 15, .28), 14px 6px 26px -14px rgba(20, 17, 15, .4);
	transition: box-shadow .5s ease; }
.sw-regal__ersatz { display: grid; place-content: center; gap: 4px; height: 100%; background: var(--sw-ink); color: var(--sw-paper); text-align: center; font-family: var(--sw-font-display); font-size: clamp(14px, 1.6vw, 24px); line-height: 1; text-transform: uppercase; }

/* Schild unter dem Brett */
.sw-regal__schild { position: relative; z-index: 1; display: grid; gap: 2px; min-width: 0; }
.sw-regal__nr { font-family: var(--sw-font-ui); font-weight: 700; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
/* Leben im Regal (heftregal.js): ein zufälliges Heft kommt kurz vor und fällt zurück – dieselbe Bewegung wie Hover */
.sw-regal.sw-regal--da .sw-regal__platz--vor .sw-regal__cover { transform: translate3d(0, -7%, 34px) rotateX(-1.5deg); transition: var(--heben); }
.sw-regal.sw-regal--da .sw-regal__platz--vor .sw-regal__heft::before { opacity: .35; transform: scaleX(.8); }
.sw-regal.sw-regal--da .sw-regal__platz--vor .sw-regal__img { box-shadow: 0 1px 2px rgba(20, 17, 15, .15), 0 46px 50px -26px rgba(20, 17, 15, .6), 0 0 44px -10px rgba(20, 17, 15, .3), 16px 10px 32px -14px rgba(20, 17, 15, .42); }

@media (min-width: 768px) { .sw-regal__nr { font-size: var(--sw-fs-label); letter-spacing: var(--sw-tracking-dachzeile); } }
.sw-regal__monat { font-family: var(--sw-font-meta); font-size: var(--sw-fs-meta); color: var(--sw-text-2); overflow-wrap: anywhere; }

/* Hover/Fokus: abheben, aufrichten, nach vorn (Cover bleibt ganz sichtbar); Verlassen: zurückfallen mit Nachfedern */
.sw-regal__heft:hover .sw-regal__cover,
.sw-regal__heft:focus-visible .sw-regal__cover { transform: translate3d(0, -7%, 34px) rotateX(-1.5deg); transition: var(--heben); }
.sw-regal__heft:hover::before,
.sw-regal__heft:focus-visible::before { opacity: .35; transform: scaleX(.8); }
.sw-regal__heft:hover .sw-regal__img,
.sw-regal__heft:focus-visible .sw-regal__img { box-shadow: 0 1px 2px rgba(20, 17, 15, .15), 0 46px 50px -26px rgba(20, 17, 15, .6), 0 0 44px -10px rgba(20, 17, 15, .3), 16px 10px 32px -14px rgba(20, 17, 15, .42); }
.sw-regal__heft:hover .sw-regal__nr { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.sw-regal__heft:focus { outline: none; }
.sw-regal__heft:focus-visible .sw-regal__img { outline: 3px solid var(--sw-focus, var(--sw-accent)); outline-offset: 4px; }

/* Einfall (nur mit heftregal.js): Hefte schweben kurz angehoben und aufrecht ein und fallen dann wie beim Loslassen zurück */
.sw-regal--bereit .sw-regal__cover { opacity: 0; transform: translate3d(0, -7%, 34px) rotateX(-1.5deg); }
.sw-regal--bereit .sw-regal__heft::before { opacity: 0; }
.sw-regal--da .sw-regal__cover {
	opacity: 1; transform: rotateX(var(--neig, 3.5deg));
	transition: transform .8s cubic-bezier(.3, 1.45, .45, 1) calc(var(--d, 0ms) + 140ms), opacity .3s ease-out var(--d, 0ms);
}
.sw-regal--da .sw-regal__heft::before { opacity: 1; transition: opacity .5s ease calc(var(--d, 0ms) + 300ms); }
.sw-regal--da.sw-regal--ruhig .sw-regal__cover { transition: var(--fallen); }
.sw-regal--da.sw-regal--ruhig .sw-regal__heft::before { transition: opacity .5s ease, transform .5s ease; }
.sw-regal--da .sw-regal__heft:hover .sw-regal__cover,
.sw-regal--da .sw-regal__heft:focus-visible .sw-regal__cover { transform: translate3d(0, -7%, 34px) rotateX(-1.5deg); transition: var(--heben); }
.sw-regal--da .sw-regal__heft:hover::before,
.sw-regal--da .sw-regal__heft:focus-visible::before { opacity: .35; transform: scaleX(.8); }


@media (min-width: 768px) {
	.sw-regal { --n: 4; --g: 20px; --o: 26px; --wp: 16px; --reihe: 64px; --oben: 10px; --kante: 12px; }
	.sw-regal__variante--3 { display: none; }
	.sw-regal__variante--4 { display: grid; gap: var(--reihe); }
}
@media (min-width: 1024px) {
	.sw-regal { --n: 6; --g: 22px; --o: 34px; --wp: 24px; --reihe: 72px; --oben: 12px; --kante: 14px; }
	.sw-regal__variante--4 { display: none; }
	.sw-regal__variante--6 { display: grid; gap: var(--reihe); }
}
@media (min-width: 1440px) {
	.sw-regal { --g: 28px; --o: 46px; --wp: 40px; --reihe: 84px; --oben: 14px; --kante: 16px; }
}

@media (prefers-reduced-motion: reduce) {
	.sw-regal__cover, .sw-regal__img, .sw-regal__heft::before,
	.sw-regal__heft:hover .sw-regal__cover, .sw-regal__heft:focus-visible .sw-regal__cover,
	.sw-regal--da .sw-regal__cover { transition: none; }
	.sw-regal--bereit .sw-regal__cover { opacity: 1; transform: rotateX(var(--neig, 3.5deg)); }
	.sw-regal--bereit .sw-regal__heft::before { opacity: 1; }
}

/* ---------- Realistisches Heft (Stefan 08.10.2026, Vorlage gemessen): Bindung = weicher Verlauf, an der linken Kante am dunkelsten,
   nach ca. 11 % der Breite ausgelaufen (keine Falzlinie); Papierglanz, Seitenkanten rechts – Schatten unverändert ---------- */
.sw-regal__cover::before,
.sw-aufmacher__cover::before {
	content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; border-radius: 1px 3px 3px 1px;
	background:
		linear-gradient(90deg, rgba(20, 17, 15, .38) 0, rgba(20, 17, 15, .3) .75%, rgba(20, 17, 15, .23) 1.5%, rgba(20, 17, 15, .17) 2.2%, rgba(20, 17, 15, .14) 3%, rgba(20, 17, 15, .11) 3.7%, rgba(20, 17, 15, .08) 5.2%, rgba(20, 17, 15, .055) 6.7%, rgba(20, 17, 15, .035) 8.1%, rgba(20, 17, 15, .015) 9.6%, rgba(20, 17, 15, 0) 11%, rgba(20, 17, 15, 0) 88%, rgba(20, 17, 15, .07) 100%),
		linear-gradient(112deg, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, .05) 30%, rgba(255, 255, 255, 0) 46%, rgba(20, 17, 15, .05) 100%);
	mix-blend-mode: normal;
}
.sw-regal__img { border-radius: 1px 3px 3px 1px; }
.sw-regal__cover { border-radius: 1px 3px 3px 1px; }
/* Keine weiße Papierkante mehr (Stefan 08.10.2026) – Platzhalter-Schatten halten die Übergänge zum Hover-Zustand gleich */
.sw-regal__img {
	box-shadow: 0 0 0 transparent, 0 0 0 transparent, 0 0 0 transparent, 0 1px 2px rgba(20, 17, 15, .25), 0 28px 40px -22px rgba(20, 17, 15, .6), 0 0 34px -10px rgba(20, 17, 15, .28), 14px 6px 26px -14px rgba(20, 17, 15, .4);
}
.sw-regal__heft:hover .sw-regal__img,
.sw-regal__heft:focus-visible .sw-regal__img,
.sw-regal.sw-regal--da .sw-regal__platz--vor .sw-regal__img {
	box-shadow: 0 0 0 transparent, 0 0 0 transparent, 0 0 0 transparent, 0 1px 2px rgba(20, 17, 15, .15), 0 46px 50px -26px rgba(20, 17, 15, .6), 0 0 44px -10px rgba(20, 17, 15, .3), 16px 10px 32px -14px rgba(20, 17, 15, .42);
}

/* Schrift auf der Signalfarbe wie beim Farbfächer (Stefan 08.10.2026): Rot → Weiß, Gelb/Orange/Cyan → Tinte.
   Signal ist nur in der Farbwelt Gelb rot (#D4322B). */
:root { --sw-on-signal: var(--sw-ink); }
[data-theme="gold"] { --sw-on-signal: #FFFFFF; }

/* ==================================================================
   Magazinarchiv-Kopf „Kiosk & Zeitstrahl“ (Entwurf 06, freigegeben Stefan 08.10.2026)
   Laufband wie ein Kiosk-Aushang · aktuelle Ausgabe mit Klebestreifen und „Neu“-Sticker ·
   Jahrgangsnavigation als Zeitstrahl/Maßband · Jahreskopf mit Ticket-Label. Regale darunter unverändert.
   ================================================================== */
.mlab-badge { display: inline-block; padding: 5px 8px 4px; background: var(--sw-ink); color: var(--sw-paper); font-family: var(--sw-font-ui); font-stretch: 75%; font-weight: 800; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; line-height: 1; }
.mlab-mb { opacity: .75; font-weight: 600; }
.mlab-a h2 { margin: 0; }
.mlab-cover { position: relative; display: block; line-height: 0; transition: transform .45s cubic-bezier(.2, .8, .2, 1); }
.mlab-cover-img { display: block; width: 100%; height: auto; aspect-ratio: 600 / 814; object-fit: cover; border-radius: 1px 3px 3px 1px;
	box-shadow: 0 0 0 transparent, 0 0 0 transparent, 0 0 0 transparent, 0 1px 2px rgba(20, 17, 15, .22), 0 30px 40px -22px rgba(20, 17, 15, .6), 14px 8px 26px -14px rgba(20, 17, 15, .4); }
.mlab-cover::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; border-radius: 1px 3px 3px 1px;
	background: linear-gradient(90deg, rgba(20, 17, 15, .38) 0, rgba(20, 17, 15, .23) 1.5%, rgba(20, 17, 15, .14) 3%, rgba(20, 17, 15, .08) 5.2%, rgba(20, 17, 15, .035) 8.1%, rgba(20, 17, 15, 0) 11%, rgba(20, 17, 15, 0) 88%, rgba(20, 17, 15, .07) 100%),
		linear-gradient(112deg, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, .05) 30%, rgba(255, 255, 255, 0) 46%, rgba(20, 17, 15, .05) 100%); }
.mlab-nav ul { list-style: none; margin: 0; padding: 0; }
.mlab-nav a { color: inherit; text-decoration: none; }
.mlab-nav__label { margin: 0; font-family: var(--sw-font-ui); font-weight: 700; font-size: var(--sw-fs-label); letter-spacing: var(--sw-tracking-dachzeile); text-transform: uppercase; }
.mlab .sw-regal { margin-top: 72px; }
.mlab--06:not(.mlab--lab) > .sw-regal:last-of-type { margin-bottom: var(--sw-section-gap); }

/* Cover der aktuellen Ausgabe = realistisches Heft wie im Regal (Stefan 08.10.2026): Bindung, Glanz, Wölbung, Papierkante rechts,
   Schatten; leicht nach hinten gelehnt; Hover/Fokus = abheben, aufrichten, nach vorn (ohne Papierkante); Verlassen = zurückfallen
   mit Nachfedern. „.mlab-cover .mlab-cover-img“ schlägt die Theme-Regel „.elementor img { box-shadow: none; border-radius: 0 }“. */
.mlab-a .mlab-cover { perspective: 1100px; }
.mlab-a .mlab-cover .mlab-cover-img { border-radius: 1px 3px 3px 1px; transform-origin: 50% 100%; transform: rotateX(3.5deg);
	box-shadow: 0 0 0 transparent, 0 0 0 transparent, 0 0 0 transparent, 0 1px 2px rgba(20, 17, 15, .25), 0 30px 40px -22px rgba(20, 17, 15, .6), 0 0 34px -10px rgba(20, 17, 15, .28), 14px 8px 26px -14px rgba(20, 17, 15, .4);
	transition: transform .7s cubic-bezier(.3, 1.45, .45, 1), box-shadow .5s ease; }
.mlab-a .mlab-cover::before { transform-origin: 50% 100%; transform: rotateX(3.5deg); transition: transform .7s cubic-bezier(.3, 1.45, .45, 1);
	background: linear-gradient(90deg, rgba(20, 17, 15, .38) 0, rgba(20, 17, 15, .3) .75%, rgba(20, 17, 15, .23) 1.5%, rgba(20, 17, 15, .17) 2.2%, rgba(20, 17, 15, .14) 3%, rgba(20, 17, 15, .11) 3.7%, rgba(20, 17, 15, .08) 5.2%, rgba(20, 17, 15, .055) 6.7%, rgba(20, 17, 15, .035) 8.1%, rgba(20, 17, 15, .015) 9.6%, rgba(20, 17, 15, 0) 11%, rgba(20, 17, 15, 0) 88%, rgba(20, 17, 15, .07) 100%),
		linear-gradient(112deg, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, .05) 30%, rgba(255, 255, 255, 0) 46%, rgba(20, 17, 15, .05) 100%); }
.mlab-a .mlab-cover:hover .mlab-cover-img, .mlab-a .mlab-cover:focus-visible .mlab-cover-img,
.mlab-a .mlab-a__buehne:has(.mlab-a__aktionen a:hover) .mlab-cover-img { transform: translate3d(0, -4%, 30px) rotateX(-1.5deg); transition: transform .42s cubic-bezier(.2, .8, .2, 1), box-shadow .5s ease;
	box-shadow: 0 0 0 transparent, 0 0 0 transparent, 0 0 0 transparent, 0 1px 2px rgba(20, 17, 15, .15), 0 46px 50px -26px rgba(20, 17, 15, .6), 0 0 44px -10px rgba(20, 17, 15, .3), 16px 10px 32px -14px rgba(20, 17, 15, .42); }
.mlab-a .mlab-cover:hover::before, .mlab-a .mlab-cover:focus-visible::before,
.mlab-a .mlab-a__buehne:has(.mlab-a__aktionen a:hover) .mlab-cover::before { transform: translate3d(0, -4%, 30px) rotateX(-1.5deg); transition: transform .42s cubic-bezier(.2, .8, .2, 1); }

/* Heft-Rahmen (Cover + Klebestreifen) bewegt sich als Ganzes: Klebestreifen folgt dem Heft exakt (Stefan 08.10.2026) */
.mlab-a .mlab-cover__heft { position: relative; display: block; transform-origin: 50% 100%; transform: rotateX(3.5deg); transition: transform .7s cubic-bezier(.3, 1.45, .45, 1); }
.mlab-a .mlab-cover__heft .mlab-cover-img { transform: none; transition: box-shadow .5s ease; }
.mlab-a .mlab-cover:has(.mlab-cover__heft)::before { display: none; }
.mlab-a .mlab-cover__heft::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; border-radius: 1px 3px 3px 1px;
	background: linear-gradient(90deg, rgba(20, 17, 15, .38) 0, rgba(20, 17, 15, .3) .75%, rgba(20, 17, 15, .23) 1.5%, rgba(20, 17, 15, .17) 2.2%, rgba(20, 17, 15, .14) 3%, rgba(20, 17, 15, .11) 3.7%, rgba(20, 17, 15, .08) 5.2%, rgba(20, 17, 15, .055) 6.7%, rgba(20, 17, 15, .035) 8.1%, rgba(20, 17, 15, .015) 9.6%, rgba(20, 17, 15, 0) 11%, rgba(20, 17, 15, 0) 88%, rgba(20, 17, 15, .07) 100%),
		linear-gradient(112deg, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, .05) 30%, rgba(255, 255, 255, 0) 46%, rgba(20, 17, 15, .05) 100%); }
.mlab-a .mlab-cover__heft .mlab-a__klebe { z-index: 2; }
.mlab-a .mlab-cover:hover .mlab-cover__heft, .mlab-a .mlab-cover:focus-visible .mlab-cover__heft,
.mlab-a .mlab-a__buehne:has(.mlab-a__aktionen a:hover) .mlab-cover__heft { transform: translate3d(0, -4%, 30px) rotateX(-1.5deg); transition: transform .42s cubic-bezier(.2, .8, .2, 1); }
.mlab-a .mlab-cover:hover .mlab-cover__heft .mlab-cover-img, .mlab-a .mlab-cover:focus-visible .mlab-cover__heft .mlab-cover-img,
.mlab-a .mlab-a__buehne:has(.mlab-a__aktionen a:hover) .mlab-cover__heft .mlab-cover-img { transform: none; }

/* A · aktuelle Ausgabe */
.mlab--06 .mlab-a { margin-top: 40px; overflow: clip; }
/* Laufband „Vollbreite“ (Variante 1, Stefan 08.10.2026): von Fensterkante zu Fensterkante, Enden außerhalb des Bildes, nichts beschnitten.
   Eigener Rahmen mit overflow-x: clip in Fensterbreite ohne Scrollleiste (--sbw aus heftregal.js) – kein globaler Overflow-Hack.
   Farbe: SUBWAY-Pink mit weißer Schrift; in der Farbwelt Pink (= Start ohne Auswahl) SUBWAY-Gelb mit Tinte. 50 px höher als im Entwurf. */
.mlab--06 .mlab-a:has(.mlab-bandrahmen--live) { margin-top: 0; overflow: visible; }
.mlab-bandrahmen--live { position: relative; width: calc(100vw - var(--sbw, 0px)); margin-left: calc(50% - (100vw - var(--sbw, 0px)) / 2); overflow-x: clip; overflow-y: visible; padding-block: 9px 20px; }
.mlab--06 .mlab-bandrahmen--live .mlab-a__band { margin: 0 -2%; transform: rotate(-1.6deg); background: #B70074; color: #FFFFFF; }
:root:not([data-theme]) .mlab--06 .mlab-bandrahmen--live .mlab-a__band,
[data-theme="pink"] .mlab--06 .mlab-bandrahmen--live .mlab-a__band { background: #F5C83C; color: var(--sw-ink); }
/* Trenner im Laufband: kurzer Strich auf Mitte der Versalhöhe in der Kontrastfarbe – Gelb auf Pink, Pink auf Gelb (Stefan 08.10.2026) */
.mlab-a__stern { display: inline-block; width: .9em; height: .14em; margin: 0 .45em; vertical-align: .3em; background: #F5C83C; }
:root:not([data-theme]) .mlab-bandrahmen--live .mlab-a__stern,
[data-theme="pink"] .mlab-bandrahmen--live .mlab-a__stern { background: #B70074; }
.mlab--06 .mlab-a__band { margin: 18px -20px 0; padding: 14px 0 10px; background: var(--sw-signal); color: var(--sw-on-signal); transform: rotate(-1.6deg); overflow: hidden; }
.mlab--06 .mlab-a__lauf { display: flex; width: max-content; animation: mlab-lauf 38s linear infinite; }
.mlab--06 .mlab-a__lauf span { padding-right: .3em; font-family: var(--sw-font-display); font-size: 34px; line-height: 1; text-transform: uppercase; white-space: nowrap; }
/* Laufband läuft durch; Pause nur, solange das aktuelle Heft oder seine Buttons angefasst werden (Stefan 08.10.2026) */
.mlab--06 .mlab-a:has(.mlab-cover:hover, .mlab-cover:focus-visible, .mlab-a__aktionen a:hover, .mlab-a__aktionen a:focus-visible) .mlab-a__lauf { animation-play-state: paused; }
@keyframes mlab-lauf { to { transform: translateX(-50%); } }
.mlab--06 .mlab-a__buehne { display: grid; grid-template-columns: 1fr 1.1fr; align-items: center; gap: 72px; padding: 56px 40px 40px 120px; }
.mlab--06 .mlab-cover { width: 280px; justify-self: end; transform: rotate(-3.5deg); }
.mlab--06 .mlab-a__klebe { position: absolute; top: -14px; left: 50%; z-index: 2; width: 96px; height: 30px; margin-left: -48px; background: color-mix(in srgb, #FFF8E6 70%, transparent); box-shadow: 0 1px 3px rgba(20, 17, 15, .15); transform: rotate(4deg); }
.mlab--06 .mlab-a__text { position: relative; display: grid; justify-items: start; gap: 14px; }
.mlab--06 .mlab-a__sticker { position: absolute; top: -44px; left: -96px; display: grid; place-items: center; width: 84px; height: 84px; border-radius: 50%; background: var(--sw-accent); color: var(--sw-on-accent); font-family: var(--sw-font-display); font-size: 26px; text-transform: uppercase; transform: rotate(-12deg); box-shadow: 0 6px 14px -6px rgba(20, 17, 15, .4); }
.mlab--06 .mlab-a__nr { font-family: var(--sw-font-display); font-weight: 400; text-transform: uppercase; font-size: 96px; line-height: .84; }
.mlab--06 .mlab-a__datum { margin: 0; font-family: var(--sw-font-accent); font-style: italic; font-size: 30px; }
.mlab--06 .mlab-a__thema { margin: 0; max-width: 24ch; font-family: var(--sw-font-ui); font-weight: 600; font-size: 22px; line-height: 1.3; }
.mlab--06 .mlab-a__aktionen { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 26px; margin-top: 10px; }

/* B · Zeitstrahl */
.mlab--06 .mlab-nav { margin-top: 32px; }
.mlab--06 .mlab-nav__label { margin-bottom: 10px; }
/* Maßband: jede Jahresspalte gleich breit, Jahresstrich in der Spaltenmitte; kleine Ticks alle 1/6 Spalte → zwischen zwei Jahren immer genau 5 kleine Striche (Stefan 08.10.2026) */
.mlab--06 .mlab-nav ul { display: grid; grid-template-columns: repeat(var(--jahre, 10), minmax(0, 1fr)); border-top: 2px solid var(--sw-ink);
	background: linear-gradient(90deg, var(--sw-ink) 0 1px, transparent 1px) 0 0 / calc(100% / (var(--jahre, 10) * 6)) 8px repeat-x; }
.mlab--06 .mlab-nav a { display: grid; grid-template-rows: 36px auto auto; justify-items: center; gap: 4px; padding: 0 4px 4px; }
.mlab--06 .mlab-nav__strich { align-self: start; width: 2px; height: 18px; background: var(--sw-ink); transition: height .25s, background .25s; }
.mlab--06 .mlab-nav__jahr { font-family: var(--sw-font-display); font-size: 26px; line-height: 1; transition: color .2s; }
.mlab--06 .mlab-nav__n { font-family: var(--sw-font-ui); font-weight: 600; font-size: 12px; color: var(--sw-text-2); }
.mlab--06 .mlab-nav a:hover .mlab-nav__strich, .mlab--06 .mlab-nav a:focus-visible .mlab-nav__strich { height: 28px; background: var(--sw-accent); }
.mlab--06 .mlab-nav a:hover .mlab-nav__jahr, .mlab--06 .mlab-nav a:focus-visible .mlab-nav__jahr { color: var(--sw-accent); }
.mlab--06 .mlab-nav a:focus { outline: none; }
.mlab--06 .mlab-nav a:focus-visible { outline: 3px solid var(--sw-focus, var(--sw-accent)); outline-offset: 2px; }
.mlab--06 .mlab-nav a[aria-current="true"] .mlab-nav__strich { width: 4px; height: 34px; background: var(--sw-accent); }
.mlab--06 .mlab-nav a[aria-current="true"] .mlab-nav__jahr { color: var(--sw-accent); }

/* C · Jahreskopf */
.mlab--06 .mlab-jk { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-bottom: 4px; }
.mlab--06 .mlab-jk__jahr { margin: 0; font-family: var(--sw-font-display); font-weight: 400; font-size: 44px; line-height: 1; }
.mlab--06 .mlab-jk__ticket { position: relative; margin: 0; padding: 7px 16px 6px; background: var(--sw-signal); color: var(--sw-on-signal); font-family: var(--sw-font-ui); font-weight: 800; font-stretch: 75%; font-size: 14px; letter-spacing: .1em; text-transform: uppercase; transform: rotate(-2deg);
	-webkit-mask: radial-gradient(circle 5px at 0 50%, transparent 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle 5px at 100% 50%, transparent 98%, #000) right / 51% 100% no-repeat;
	mask: radial-gradient(circle 5px at 0 50%, transparent 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle 5px at 100% 50%, transparent 98%, #000) right / 51% 100% no-repeat; }
.mlab--06 .mlab-jk__sp { margin: 0 0 0 auto; font-family: var(--sw-font-ui); font-weight: 600; font-size: 14px; color: var(--sw-text-2); }

/* Tablet */
@media (max-width: 1199px) {
	.mlab--06 .mlab-a__buehne { gap: 56px; padding: 48px 24px 32px 80px; }
	.mlab--06 .mlab-cover { width: 240px; }
	.mlab--06 .mlab-a__nr { font-size: 80px; }
}
@media (max-width: 1023px) {
	.mlab--06 .mlab-a__band { padding: 11px 0 8px; }
	.mlab--06 .mlab-a__lauf span { font-size: 26px; }
	.mlab--06 .mlab-a__buehne { grid-template-columns: 200px 1fr; gap: 48px; padding: 44px 8px 24px 32px; }
	.mlab--06 .mlab-cover { width: 200px; }
	.mlab--06 .mlab-a__sticker { top: -36px; left: -70px; width: 66px; height: 66px; font-size: 20px; }
	.mlab--06 .mlab-a__nr { font-size: 64px; }
	.mlab--06 .mlab-a__datum { font-size: 24px; }
	.mlab--06 .mlab-a__thema { font-size: 19px; }
	.mlab .sw-regal { margin-top: 56px; }
	.mlab--06 .mlab-jk__jahr { font-size: 38px; }
}
/* Mobil: kompakt – kleines Cover neben dem Text, Zeitstrahl wischbar */
@media (max-width: 767px) {
	.mlab--06 .mlab-a { margin-top: 24px; }
	.mlab-bandrahmen--live { padding-block: 8px 12px; }
	.mlab--06 .mlab-a__band { margin-top: 10px; padding: 9px 0 6px; transform: rotate(-2deg); }
	.mlab--06 .mlab-a__lauf span { font-size: 20px; }
	.mlab--06 .mlab-a__buehne { grid-template-columns: 112px 1fr; align-items: start; gap: 22px; padding: 30px 2px 8px 6px; }
	.mlab--06 .mlab-cover { width: 112px; transform: rotate(-3deg); }
	.mlab--06 .mlab-a__klebe { top: -9px; width: 56px; height: 18px; margin-left: -28px; }
	.mlab--06 .mlab-a__text { gap: 8px; }
	.mlab--06 .mlab-a__sticker { top: -20px; left: -40px; width: 44px; height: 44px; font-size: 14px; }
	.mlab--06 .mlab-a__nr { font-size: 40px; }
	.mlab--06 .mlab-a__datum { font-size: 19px; }
	.mlab--06 .mlab-a__thema { font-size: 15px; line-height: 1.35; }
	.mlab--06 .mlab-a__aktionen { display: grid; justify-items: start; gap: 12px; margin-top: 6px; }
	.mlab--06 .mlab-nav { margin-top: 28px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
	.mlab--06 .mlab-nav::-webkit-scrollbar { display: none; }
	.mlab--06 .mlab-nav ul { min-width: 620px; }
	.mlab--06 .mlab-nav__jahr { font-size: 22px; }
	.mlab .sw-regal { margin-top: 44px; }
	.mlab--06 .mlab-jk__jahr { font-size: 32px; }
	.mlab--06 .mlab-jk__ticket { font-size: 12px; padding: 6px 13px 5px; }
	.mlab--06 .mlab-jk__sp { flex-basis: 100%; margin: 0; font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
	.mlab-cover, .mlab-a .mlab-cover .mlab-cover-img, .mlab-a .mlab-cover::before, .mlab-a .mlab-cover__heft, .mlab--06 .mlab-nav__strich, .mlab--06 .mlab-nav__jahr { transition: none; }
	.mlab--06 .mlab-a__lauf { animation: none; }
}

/* Abstand des letzten Jahrgangs zum Footer */
.sw-magazin > .sw-regal:last-child { margin-bottom: var(--sw-section-gap); }