/* ============================================================
   relaunch2026.css – Feinschliff für alle Seiten (Etappe 1)
   Wird in file-beginning.inc NACH main.css geladen.
   Ändert nur Darstellung, keine Inhalte. Rückbau: Zeile in
   file-beginning.inc entfernen.
   ============================================================ */

/* --- Überschriften: weniger Sperrung, klarere Abstufung --- */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 {
    letter-spacing: 0.06em;        /* statt 2 px pauschal */
    line-height: 1.15;
}
@media screen and (min-width: 768px) {
    h1, .h1 { font-size: 2.75rem; letter-spacing: 0.04em; }   /* 44 px, statt 7 px Sperrung */
    h2, .h2 { font-size: 2rem;    letter-spacing: 0.04em; }   /* 32 px, statt 5 px */
    h3, .h3 { font-size: 1.5rem;  letter-spacing: 0.04em; }   /* 24 px, statt 3 px */
    h4, .h4 { font-size: 1.25rem; letter-spacing: 0.05em; }
}
@media screen and (max-width: 767px) {
    h1, .h1 { font-size: 1.9rem; }
    h2, .h2 { font-size: 1.5rem; }
    h3, .h3 { font-size: 1.25rem; }
}

/* --- Fließtext: lesbare Zeilenlänge, Zeilenhöhe 1,6 --- */
body { line-height: 1.6; }
.content-block p,
.content-block li {
    max-width: 45rem;              /* ca. 720 px */
    line-height: 1.6;
}
/* zentrierte Absätze bleiben zentriert, aber nicht über die volle Breite */
.content-block .text-center p { margin-left: auto; margin-right: auto; }

/* --- Buttons: rund, ruhiger --- */
.btn-primary, .btn-secondary, .btn-outline-primary {
    border-radius: 50px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-family: "Oswald", "Arial Narrow", sans-serif;
}

/* --- Kopfzeile: dunkler Rückfall, solange Video/Bild noch lädt --- */
.hero-video__container { background-color: #1c1f23; }
.hero { background-color: #1c1f23; }

/* --- Mitwandernder Button (Termin / Karte): kleiner, weniger Pulsieren --- */
.footer__fixed-cta-button {
    font-size: 0.95rem;
    padding: 0.55rem 1.1rem;
}
@media all and (min-width: 768px) {
    .footer__fixed-cta-button { top: 62vh; }
}

/* --- Karten (Spielkartenformat): weichere Kanten, gleiche Höhe --- */
.card-area { border-radius: 0.75rem; overflow: hidden; }
.card-area .card-title { letter-spacing: 0.04em; }

/* --- Footer: etwas mehr Luft, kleinere Schrift für Rechtliches --- */
footer .container { padding-top: 3.5rem; padding-bottom: 3rem; }
footer .row.mt-4 { font-size: 0.9rem; }


/* ============================================================
   Etappe 4 (Sept. 2026): neue Blöcke
   ============================================================ */

/* --- ce-cinema-v2: Filmkarten mit Plakat und Spielzeiten --- */
.kino-film { border-radius: 0.75rem; }
.kino-film__kopf { display: flex; gap: 1rem; padding: 1rem 1rem 0.5rem; align-items: flex-start; }
.kino-film__plakat { flex: 0 0 96px; width: 96px; display: block; }
.kino-film__plakat img { width: 96px; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 0.35rem; display: block; background: #e9ecef; }
.kino-film__leer, .woche-plakat__leer { display: flex; align-items: center; justify-content: center; aspect-ratio: 2 / 3; background: #212529; color: #fff; font-family: "Oswald", "Arial Narrow", sans-serif; letter-spacing: 0.1em; font-size: 0.85rem; border-radius: 0.35rem; }
.kino-film__titel { min-width: 0; }
.kino-film__titel .card-title { overflow-wrap: anywhere; }
.kino-film__mehr { font-size: 0.9rem; }
.kino-film__zeiten { padding: 0.25rem 1rem 1rem; }
.kino-film__zeiten li { border-top: 1px solid #eceae6; }
.kino-film__zeiten li:first-child { border-top: 0; }
.kino-film__zeiten a { display: grid; grid-template-columns: 5.2rem 3.4rem 1fr; gap: 0.5rem; align-items: baseline; padding: 0.45rem 0; color: #212529; text-decoration: none; font-size: 0.95rem; }
.kino-film__zeiten a:hover { color: var(--primary, #d32337); }
.kino-film__uhr { font-family: "Oswald", "Arial Narrow", sans-serif; font-size: 1.05rem; letter-spacing: 0.03em; }
.kino-film__saal { color: #6b665f; font-size: 0.85rem; }

/* --- ce-diese-woche: drei Karten --- */
.woche-karte { border-radius: 0.75rem; border-top: 4px solid #d32337; }
.woche-karte--kino { border-top-color: #0084ff; }
.woche-karte--kino .woche-karte__kicker { color: #0084ff; }
.woche-karte--kino .btn-outline-primary { color: #0084ff; border-color: #0084ff; }
.woche-karte--kino .btn-outline-primary:hover { background: #0084ff; border-color: #0084ff; color: #fff; }
.woche-karte__kicker { font-family: "Oswald", "Arial Narrow", sans-serif; font-size: 0.8rem; letter-spacing: 0.15em; text-transform: uppercase; color: #d32337; margin-bottom: 0.5rem; }
.woche-karte .card-text p { max-width: none; font-size: 0.95rem; }
.woche-plakate { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.woche-plakat { display: flex; flex-direction: column; gap: 0.25rem; min-width: 0; color: #212529; text-decoration: none; }
.woche-plakat:hover { color: #0084ff; text-decoration: none; }
.woche-plakat img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 0.35rem; display: block; background: #e9ecef; }
.woche-plakat b { font-family: "Oswald", "Arial Narrow", sans-serif; font-weight: 500; font-size: 0.85rem; line-height: 1.2; text-transform: uppercase; letter-spacing: 0.02em; overflow-wrap: anywhere; }
.woche-plakat span { font-family: "Oswald", "Arial Narrow", sans-serif; font-size: 0.85rem; color: #0084ff; letter-spacing: 0.05em; }

/* --- ce-kennzahlen: dunkle Leiste --- */
.kennzahlen { background: #212529; color: #fff; padding: 2.5rem 0; }
.kennzahlen__intro { margin-bottom: 1.5rem; }
.kennzahlen__intro p { max-width: none; color: #d9d5cf; }
.kennzahlen__leiste { display: grid; gap: 0; }
.kennzahlen__leiste--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kennzahlen__leiste--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kennzahlen__leiste--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kennzahlen__leiste--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.kennzahlen__leiste--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.kennzahl { text-align: center; padding: 0.5rem 1rem; border-left: 1px solid rgba(255,255,255,0.15); min-width: 0; }
.kennzahl:first-child { border-left: 0; }
.kennzahl__wert { font-family: "Oswald", "Arial Narrow", sans-serif; font-size: 2.4rem; line-height: 1.1; letter-spacing: 0.03em; color: #fff; }
.kennzahl__label { font-family: "Oswald", "Arial Narrow", sans-serif; font-size: 0.85rem; letter-spacing: 0.15em; text-transform: uppercase; color: #b8b3ac; margin-top: 0.4rem; }
@media (max-width: 767px) {
    .kennzahlen__leiste--3, .kennzahlen__leiste--4, .kennzahlen__leiste--5, .kennzahlen__leiste--6 { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.5rem; }
    .kennzahl:nth-child(odd) { border-left: 0; }
    .kennzahl__wert { font-size: 1.9rem; }
}

/* --- ce-kontakt: dunkler Kontaktblock --- */
.kontaktblock { background: #212529; color: #d9d5cf; padding: 3.5rem 0; }
.kontaktblock h3, .kontaktblock h4, .kontaktblock .h4 { color: #fff; font-size: 1.1rem; letter-spacing: 0.1em; margin-bottom: 0.75rem; }
.kontaktblock p { max-width: none; color: #d9d5cf; margin-bottom: 0.5rem; }
.kontaktblock a { color: #fff; }
.kontaktblock a.btn { color: #fff; }
.kontaktblock__intro { margin-bottom: 2rem; }
.kontaktblock__spalte { margin-bottom: 1.5rem; }
@media (min-width: 768px) { .kontaktblock__spalte { margin-bottom: 0; } }
