/* ──────────────────────────────────────────────────────────────────────────
   Nur für videoproduktion-wuppertal.html: heller Einstieg wie auf den
   anderen Ortsseiten. Ergänzt assets/local.css, das die Farben liefert.
   ────────────────────────────────────────────────────────────────────────── */
.hero{background:var(--paper);color:var(--ink);padding:3.6rem 0 3rem}
.hero:before,.hero:after{display:none}
.hero h1{color:var(--ink);font-weight:650;letter-spacing:-.035em;max-width:18ch}
.hero .lead,.hero p{color:var(--ink-2)}
.hero b,.hero strong{color:var(--ink)}
.eyebrow{text-transform:none;letter-spacing:.015em;font-size:14px;font-weight:600;color:var(--ink-3)}
.hero .eyebrow{color:var(--ink-3)}

/* Telefon-Pille: auf hellem Grund braucht sie eine Kante statt Weiß auf Dunkel */
.phone-pill{background:var(--blue);color:#fff;border:1px solid var(--blue);box-shadow:none;font-weight:650}
.phone-pill:hover{background:var(--blue-deep);border-color:var(--blue-deep)}
.phone-pill .ic{background:rgba(255,255,255,.18);color:#fff}

/* Schaltflächen wie überall sonst */
.btn{border-radius:999px;font-weight:550;font-size:15px;min-height:48px;padding:12px 24px}
.btn-ink{background:var(--ink);color:#fff;border:1px solid var(--ink)}
.btn-ink:hover{background:#000}
.btn-line{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn-line:hover{background:#e8e8ed}

/* Kopf- und Fußbereich auf denselben Ton */
header{background:rgba(250,250,252,.9);border-bottom:1px solid rgba(0,0,0,.07)}
.sticky{background:#ffffffec;border-top:1px solid var(--line)}
.cookie{border-radius:24px;border:1px solid var(--line)}

/* Reste der dunklen Fassung: heller Text, der jetzt auf hellem Grund stand */
.hero .lead{color:var(--ink-2)}
.hero .lead b{color:var(--ink)}
.btn-line-light{color:var(--ink);background:transparent;border:1px solid var(--line)}
.btn-line-light:hover{background:#e8e8ed}

/* Warme Restfarben aus der alten Papier-Fassung neutralisieren */
.glyph{background:linear-gradient(150deg,#f5f5f7,#ececf0)}
.hero-note{color:var(--ink-3)}
.band-dark,.ccard{background:#1d1d1f;color:#f5f5f7}
.ccard .alt a{color:#a3cfff}
.final p{color:#bdbdc3}

/* ── Korrektur: heller Einstieg, aber dunkle Flächen behalten helle Schrift ─ */
.btn-line-light{color:#fff;border-color:rgba(255,255,255,.55);background:transparent}
.btn-line-light:hover{background:rgba(255,255,255,.12)}
.hero .btn-line-light{color:var(--ink);border-color:var(--line)}
.hero .btn-line-light:hover{background:#e8e8ed}

.band-dark .eyebrow,.case .eyebrow,.ccard .eyebrow,.final .eyebrow{color:#bdbdc3}
.band-dark .tag,.case .tag{color:#a3cfff}
.band-dark .d,.case .d,.ccard .d,.final .d{color:#a3cfff}

/* Fußzeile steht jetzt auf Weiß, also dunkle Schrift statt der alten hellen */
footer,footer p,footer small,footer span{color:var(--ink-2)}
footer a{color:var(--ink-2)}
footer a:hover{color:var(--blue)}
footer b,footer strong,footer .foot-brand,footer .foot-phone{color:var(--ink)}

/* Fußzeile war dunkel gebaut, ist jetzt hell: alle Textfarben nachziehen */
footer{background:var(--surface);color:var(--ink-2);border-top:1px solid var(--line)}
.foot-brand{color:var(--ink)}
.foot-col h4{color:var(--ink-3)}
.foot-col a{color:var(--ink-2)}
.foot-col a:hover{color:var(--blue)}
.foot-col a[aria-current]{color:var(--ink)}
.foot-copy{color:var(--ink-3);border-top-color:var(--line)}
.foot-phone{background:var(--blue);color:#fff}
.foot-phone:hover{background:var(--blue-deep);color:#fff}

/* Text in den dunkel gebliebenen Blöcken */
.band-dark .lead,.band-dark p{color:#bdbdc3}
.ccard>p,.ccard li{color:#bdbdc3}
.ccard li .d{color:#a3cfff}

/* Einwilligungs-Banner auf dieselbe Höhe und Form wie überall sonst */
.cookie{min-height:172px;display:none;flex-direction:column;justify-content:center;gap:14px;padding:18px 20px;border-radius:24px}
.cookie.on{display:flex}
.cookie p{margin:0;font-size:13.5px;line-height:1.5}
.cookie .row{display:flex;gap:10px}
.cookie .row .btn{flex:1;min-height:44px;border-radius:999px;font-size:13px;padding:10px 14px}
@media(max-width:520px){.cookie{min-height:196px}}
.cookie{left:12px;right:12px;bottom:90px;max-width:440px;padding:20px;font-size:13px}
@media(max-width:520px){.cookie{padding:16px;font-size:12px}}
.cookie{min-height:212px}
@media(max-width:520px){.cookie{min-height:236px}}
