/* ============================================================ Heike Rohr — Dunkle Variante · Farbwelt 1 (HR Signatur) Nur Farbtoken & Flächen; Layout/Typografie bleiben identisch. Aktiv über . Home-Footer via body.home. ============================================================ */ [data-theme="dark"]{ --dark-base:#191007; --shell:#0f0a04; --band-warm:#7d5a0c; --band-warm-deep:#a8790f; --gold:#c9930c; --gold-deep:#dcaa1f; --copper:#f0873f; --copper-soft:#f6a468; --bordeaux-soft:#8a5a3c; --sage:#a8967a; --sage-deep:#b8a558; --sage-soft:#2a1f12; --sky:#dcaa1f; --sky-deep:#dcaa1f; --sky-soft:#241706; --sky-ink:#f0873f; --paper:#191007; --cream:#1c1206; --cream-deep:#241706; --ink:#f8efe1; --ink-soft:#dcc7a6; --ink-faint:#a8967a; --slate:#f8efe1; --slate-deep:#f8efe1; --slate-soft:#dcc7a6; --border-hairline:rgba(220,199,166,.14); --border-soft:rgba(220,199,166,.22); --border-on-dark:rgba(220,199,166,.2); --shadow-sm:0 3px 10px rgba(0,0,0,.4); --shadow-md:0 6px 20px rgba(0,0,0,.5); --foot-ink:#1b1204; --g0:var(--cream); --g1:color-mix(in oklab, var(--cream) 46%, var(--band-warm)); --g2:var(--band-warm); --g3:var(--band-warm-deep); --g4:color-mix(in oklab, var(--band-warm-deep) 78%, var(--copper)); } [data-theme="dark"] body{background:var(--paper);color:var(--ink)} [data-theme="dark"] ::selection{background:var(--band-warm);color:var(--ink)} /* Header & Footer teilen --shell; Header ohne backdrop-filter */ [data-theme="dark"] .header{background:var(--shell);backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom-color:var(--border-hairline)} [data-theme="dark"] .header.scrolled{box-shadow:0 6px 24px rgba(0,0,0,.45)} /* Flache dunkle Sektionen oberhalb des Verlaufs */ [data-theme="dark"] .hero-full{background:linear-gradient(180deg,var(--cream-deep) 0%,var(--paper) 60%)} [data-theme="dark"] .about-panel{background:var(--cream)} [data-theme="dark"] .values{background:var(--cream);border-block-color:var(--border-hairline)} [data-theme="dark"] .services{background:var(--cream)} [data-theme="dark"] .divider{background:var(--cream)} /* Durchlaufender Verlauf: Stimmen → Galerie → Kontakt → Footer */ [data-theme="dark"] .quoteband{background:linear-gradient(180deg,var(--g0),var(--g1))} [data-theme="dark"] #galerie{background:linear-gradient(180deg,var(--g1),var(--g2))!important} [data-theme="dark"] #kontakt{background:linear-gradient(180deg,var(--g2),var(--g3))} /* Footer: Standard (Rechtsseiten) = shell, helle Tinte */ [data-theme="dark"] .footer{background:var(--shell);border-top-color:var(--border-hairline)} /* Footer der Startseite = hellstes Verlaufsende, dunkle Tinte */ [data-theme="dark"] .home .footer{background:linear-gradient(180deg,var(--g3),var(--g4));border-top:none} [data-theme="dark"] .home .footer, [data-theme="dark"] .home .footer nav a, [data-theme="dark"] .home .footer-legal, [data-theme="dark"] .home .footer-legal a, [data-theme="dark"] .home .footer .bm-role{color:var(--foot-ink)} [data-theme="dark"] .home .footer-inner p{color:var(--foot-ink)!important} [data-theme="dark"] .home .footer nav a:hover, [data-theme="dark"] .home .footer-legal a:hover{color:#3a2708} [data-theme="dark"] .home .footer-legal{border-top-color:rgba(27,18,4,.3)} /* Buttons */ [data-theme="dark"] .btn-copper{background:var(--copper);color:var(--dark-base);border-color:var(--copper)} [data-theme="dark"] .btn-copper:hover{background:var(--copper-soft);color:var(--dark-base)} [data-theme="dark"] .btn-outline{background:transparent;color:var(--copper);border-color:var(--copper)} [data-theme="dark"] .btn-outline:hover{background:var(--copper);color:var(--dark-base)} /* Karten & Formularfelder als abgedunkelte Ebenen auf dem Verlauf */ [data-theme="dark"] .svc-featured, [data-theme="dark"] .svc-card{background:rgba(18,11,4,.35);border-color:var(--border-hairline)} [data-theme="dark"] .svc-pts span{background:rgba(14,9,3,.45);border-color:var(--border-hairline);color:var(--ink-soft)} [data-theme="dark"] .cc-row{background:rgba(18,11,4,.3);border-color:var(--border-hairline)} [data-theme="dark"] .cc-row:hover{box-shadow:0 12px 28px rgba(0,0,0,.4)} [data-theme="dark"] .form-card{background:rgba(18,11,4,.32);border-color:var(--border-hairline);box-shadow:0 18px 44px rgba(0,0,0,.32)} [data-theme="dark"] .form-fields input, [data-theme="dark"] .form-fields textarea{background:rgba(14,9,3,.45);border-color:var(--border-soft);color:var(--ink)} [data-theme="dark"] .form-fields input::placeholder, [data-theme="dark"] .form-fields textarea::placeholder{color:var(--ink-faint)} [data-theme="dark"] .form-fields input:focus, [data-theme="dark"] .form-fields textarea:focus{outline-color:var(--gold);border-color:transparent} /* Bilder leicht abgesenkt, im Hover voll */ [data-theme="dark"] .portrait img, [data-theme="dark"] .g-tile img{filter:brightness(.9) saturate(.96)} [data-theme="dark"] .portrait:hover img, [data-theme="dark"] .g-tile:hover img{filter:none} [data-theme="dark"] .g-tile{background:var(--sage-soft)} /* Logo einfarbig: Rolle-Zeile Kupfer im Body, Foot-Ink im Startseiten-Footer */ [data-theme="dark"] .bm-role{color:var(--copper)} [data-theme="dark"] .home .footer .bm-role{color:var(--foot-ink)} /* Rechtsseiten-Inhalt */ [data-theme="dark"] .legal .todo{background:rgba(14,9,3,.45);color:var(--copper-soft);border-left-color:var(--gold)}