/* ===== Helle Fassung (Vorschau 10.11.26, nur dev): tauscht die --dc-Tokens auf html.hell. Kopfzeile und Bühne (Foto) bleiben dunkel. ===== */
html.hell{
  --dc-bg:#F5F8F9; --dc-bg-hero:#070F13; --dc-bg-fuss:#EDF2F4;
  --dc-karte:#FFFFFF; --dc-karte-hell:#FFFFFF;
  --dc-karte-verlauf:linear-gradient(135deg,#FFFFFF 0%,#FFFFFF 60%);
  --dc-band-verlauf:linear-gradient(135deg,#E9F5F9 0%,#FFFFFF 60%);
  --dc-flaeche:rgba(12,38,48,.045); --dc-flaeche-2:rgba(12,38,48,.065);
  --dc-text:#1B323B; --dc-text-voll:#0B1E25;
  --dc-text-86:rgba(11,30,37,.88); --dc-text-78:rgba(11,30,37,.80); --dc-text-70:rgba(11,30,37,.74);
  --dc-text-62:rgba(11,30,37,.74); --dc-text-55:rgba(11,30,37,.70); --dc-text-45:rgba(11,30,37,.68);
  --dc-gruen:#0098BE; --dc-cyan:#007A9C; --dc-orange:#B45F00; --dc-bernstein:#A85800; --orange:#B45F00; --teal:#007A9C;
  --dc-gruen-16:rgba(120,170,20,.16); --dc-cyan-16:rgba(10,126,160,.12);
  --dc-kante-08:rgba(12,38,48,.09); --dc-kante-09:rgba(12,38,48,.10); --dc-kante-12:rgba(12,38,48,.13);
  --dc-kante-14:rgba(12,38,48,.15); --dc-kante-18:rgba(12,38,48,.19); --dc-kante-22:rgba(12,38,48,.24); --dc-kante-35:rgba(12,38,48,.36);
  --bg:#F5F8F9; --bg-tief:#EDF2F4; --flaeche:rgba(12,38,48,.045); --flaeche-2:rgba(12,38,48,.07);
  --kante:rgba(12,38,48,.11); --kante-hell:rgba(12,38,48,.2); --text:#0B1E25; --text-2:#48606A; --text-3:#64798A;
  color-scheme:light;
}
html.hell body{background:var(--dc-bg);color:var(--dc-text)}
/* Kopfzeile + Bühne behalten die dunklen Werte */
html.hell .jet-theme-core-location--header-location,html.hell .nav,html.hell .jet-popup{
  --dc-bg:#0A1217; --dc-karte:#101B21; --dc-karte-hell:#0F1F23;
  --dc-karte-verlauf:linear-gradient(135deg,#12222A 0%,#101B21 60%); --dc-band-verlauf:linear-gradient(135deg,#0F2027 0%,#101B21 55%);
  --dc-flaeche:rgba(232,240,243,.06); --dc-flaeche-2:rgba(232,240,243,.07);
  --dc-text:#E8F0F3; --dc-text-voll:#FFFFFF; --dc-text-86:rgba(232,240,243,.86); --dc-text-78:rgba(232,240,243,.78); --dc-text-70:rgba(232,240,243,.70);
  --dc-text-62:rgba(232,240,243,.62); --dc-text-55:rgba(232,240,243,.55); --dc-text-45:rgba(232,240,243,.45);
  --dc-gruen:#A6CE39; --dc-cyan:#3EC6E8; --dc-orange:#F2A23C; --dc-bernstein:#E8A33D; --orange:#FF8A1F; --teal:#2FD3C9; --dc-gruen-16:rgba(166,206,57,.16); --dc-cyan-16:rgba(62,198,232,.16);
  --dc-kante-08:rgba(232,240,243,.08); --dc-kante-09:rgba(232,240,243,.09); --dc-kante-12:rgba(232,240,243,.12); --dc-kante-14:rgba(232,240,243,.14);
  --dc-kante-18:rgba(232,240,243,.18); --dc-kante-22:rgba(232,240,243,.22); --dc-kante-35:rgba(232,240,243,.35);
  --bg:#0B121B; --text:#F0F5FA; --text-2:#9DAFC2; --text-3:#6E8095; --kante:rgba(255,255,255,.10); --flaeche:rgba(255,255,255,.055);
  color-scheme:dark;
}
/* Fuß hell */
html.hell .fuss3{--f-bg:#EDF2F4;--f-text:#0B1E25;--f-leise:rgba(11,30,37,.72);--f-leiser:rgba(11,30,37,.70);--f-linie:rgba(12,38,48,.12);--f-akzent:#007A9C;--f-knopf-bg:#0B1E25;--f-knopf-text:#FFFFFF}
html.hell .fuss3-knopf:hover{box-shadow:0 8px 24px rgba(11,30,37,.18)}
/* ---- automatisch aus ap.css/comnic.css (bau/hell_bau.py) ---- */
html.hell .knopf-voll:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#FFFFFF}
html.hell .knopf-voll:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0C93BA;color:#FFFFFF}
html.hell .knopf-glas:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.09)}
html.hell .buehne-schleier:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(90deg,rgba(255,255,255,.86) 0 30%,rgba(255,255,255,.46) 58%,rgba(255,255,255,.12)),
    linear-gradient(180deg,rgba(255,255,255,.66) 0,rgba(255,255,255,.30) 30%,rgba(9,15,23,.82) 74%,var(--bg) 100%),
    radial-gradient(70% 60% at 78% 22%,rgba(47,211,201,.14),transparent 68%)}
@media (max-width:720px){html.hell .buehne-schleier:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(180deg,rgba(255,255,255,.74) 0,rgba(255,255,255,.62) 42%,rgba(9,15,23,.88) 76%,var(--bg) 100%)}}
html.hell .buehne .d1 .zweite:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,1)}
html.hell .fakt:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.038)}
html.hell .karte:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(180deg,rgba(12,38,48,0.056),rgba(12,38,48,0.021));box-shadow:inset 0 1px 0 rgba(12,38,48,0.17),0 18px 40px -28px rgba(0,0,0,.9)}
html.hell .karte:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(180deg,rgba(12,38,48,0.075),rgba(12,38,48,0.03))}
html.hell .worte span:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.041)}
html.hell .rechner:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(160deg,rgba(47,211,201,.10),rgba(12,38,48,0.022) 46%,rgba(12,38,48,0.015));box-shadow:inset 0 1px 0 rgba(12,38,48,0.17)}
html.hell .regler-schiene:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.075)}
html.hell .regler-griff:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0B1E25}
html.hell .preiskarte:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(180deg,rgba(12,38,48,0.056),rgba(12,38,48,0.021));box-shadow:inset 0 1px 0 rgba(12,38,48,0.17),0 24px 50px -34px #000}
html.hell .preiskarte.aktiv:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(180deg,rgba(47,211,201,.14),rgba(12,38,48,0.022))}
html.hell .punkte i:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.165)}
html.hell .hosting:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(150deg,rgba(255,138,31,.09),rgba(12,38,48,0.015));box-shadow:inset 0 1px 0 rgba(12,38,48,0.16)}
html.hell .produkt:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(155deg,rgba(47,211,201,.12),rgba(12,38,48,0.022) 52%,rgba(12,38,48,0.015));box-shadow:inset 0 1px 0 rgba(12,38,48,0.18),0 30px 60px -44px #000}
html.hell .stufe-punkt i:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.045)}
html.hell .spar-tafel:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){box-shadow:inset 0 1px 0 rgba(12,38,48,0.13),0 12px 26px -24px rgba(0,0,0,.9)}
html.hell .segment:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.045)}
html.hell .mock:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(180deg,rgba(12,38,48,0.068),rgba(12,38,48,0.026));box-shadow:0 30px 60px -34px #000,inset 0 1px 0 rgba(12,38,48,0.22)}
html.hell .mock-leiste i:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.165)}
html.hell .chip:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.068)}
html.hell .zahl:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(150deg,rgba(12,38,48,0.053),rgba(12,38,48,0.015));box-shadow:inset 0 1px 0 rgba(12,38,48,0.16)}
html.hell .band-text:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(transparent,rgba(255,255,255,.86) 58%)}
html.hell .blatt-kopf .strich:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.21)}
html.hell .blatt-fuss:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.022)}
html.hell .abschluss:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(150deg,rgba(47,211,201,.14),rgba(255,138,31,.07) 60%,rgba(12,38,48,0.015));box-shadow:inset 0 1px 0 rgba(12,38,48,0.18)}
html.hell .feld input:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .feld select:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .feld textarea:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.038)}
html.hell .feld input:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .feld select:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .feld textarea:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.056)}
html.hell .feld input:focus:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .feld select:focus:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .feld textarea:focus:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.06)}
html.hell .feld select option:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0B1E25}
html.hell .kontaktkarte:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.038);box-shadow:inset 0 1px 0 rgba(12,38,48,0.16)}
@media (prefers-reduced-transparency:reduce){html.hell .knopf-glas:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .fakt:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.075)}}
html.hell .knopf-nav:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .knopf-nav:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0B1E25;color:#0B1E25}
html.hell .menue:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){box-shadow:0 34px 64px -30px #000,inset 0 1px 0 rgba(12,38,48,0.18)}
html.hell .menue a:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .menue a:focus-visible:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.053)}
html.hell .buehne-karte .buehne-schleier:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(90deg,rgba(255,255,255,.80) 0,rgba(255,255,255,.50) 42%,rgba(255,255,255,.16) 76%),
    linear-gradient(180deg,rgba(255,255,255,.55) 0,rgba(255,255,255,.10) 26%,rgba(255,255,255,.24) 60%,rgba(255,255,255,.84) 100%)}
html.hell .buehne-augenbraue:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.94)}
html.hell .buehne-karte .d1:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .buehne-karte .lead:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,1)}
html.hell .knopf-weiss:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0B1E25}
html.hell .buehne-notiz:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.76)}
html.hell .buehne-fuss-titel:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.94)}
html.hell .buehne-standort:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.94)}
html.hell .buehne-bewertung:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.94)}
html.hell .buehne-bewertung b:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .sterne:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.62)}
html.hell .buehne-leiste:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border-top:1px solid rgba(12,38,48,0.18)}
html.hell .buehne-leiste .knopf-rahmen:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#FFFFFF}
html.hell .buehne-leiste .knopf-rahmen:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(255,255,255,.06);color:#FFFFFF}
html.hell .buehne-fakten:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.76)}
@media (max-width:720px){html.hell .buehne-karte .buehne-schleier:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(180deg,rgba(255,255,255,.64) 0,rgba(255,255,255,.50) 45%,rgba(255,255,255,.88) 100%)}}
html.hell .tabelle thead th:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.03)}
html.hell .bildkarte .bild-text:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(transparent,rgba(255,255,255,.9) 62%)}
html.hell .schritt:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){box-shadow:inset 0 1px 0 rgba(12,38,48,0.16)}
html.hell .zitat:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(160deg,rgba(47,211,201,.10),rgba(12,38,48,0.022));box-shadow:inset 0 1px 0 rgba(12,38,48,0.17)}
html.hell .cta-band:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(150deg,rgba(47,211,201,.13),rgba(12,38,48,0.015));box-shadow:inset 0 1px 0 rgba(12,38,48,0.17)}
html.hell .fenster-ki:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.8)}
html.hell .preiskarte.aktiv:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border-color:rgba(0,122,156,.28)}
html.hell .kontaktkarte:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.03)}
html.hell .tabelle .summe td:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(0,122,156,.08)}
html.hell .info:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(0,122,156,.07);border-color:rgba(0,122,156,.28)}
html.hell .buehne-ki:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(255,255,255,.6)}
html.hell .buehne-logos a:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.705)}
html.hell .buehne-karte .buehne-schleier:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(180deg,rgba(255,255,255,.58) 0%,rgba(255,255,255,.20) 30%,rgba(255,255,255,.52) 72%,rgba(255,255,255,.95) 100%),
    linear-gradient(95deg,rgba(255,255,255,.82) 0%,rgba(255,255,255,.55) 36%,rgba(255,255,255,.12) 76%,rgba(255,255,255,0) 100%)}
@media (max-width:720px){html.hell .buehne-karte .buehne-schleier:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(180deg,rgba(255,255,255,.52) 0%,rgba(255,255,255,.40) 45%,rgba(255,255,255,.86) 100%)}}
html.hell .buehne-ki i:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(255,255,255,.6)}
html.hell .buehne-karte .sterne:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.62)}
html.hell .fenster-ki-kreis:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(255,255,255,.6)}
html.hell .buehne-kino .buehne-schleier:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(90deg,rgba(255,255,255,.8),rgba(255,255,255,.5) 40%,rgba(255,255,255,.08) 72%),linear-gradient(180deg,rgba(255,255,255,.12),transparent 65%,var(--bg))}
html.hell .buehne-personen .buehne-schleier:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(90deg,rgba(255,255,255,.7),rgba(255,255,255,.42) 38%,transparent 72%),linear-gradient(180deg,rgba(255,255,255,.18),transparent 35%,transparent 78%,var(--bg))}
@media(max-width:720px){html.hell .buehne-kino .buehne-schleier:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(180deg,rgba(255,255,255,.36),rgba(255,255,255,.5) 55%,var(--bg))}}
@media(max-width:720px){html.hell .buehne-personen .buehne-schleier:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(180deg,rgba(255,255,255,.38),rgba(255,255,255,.5) 50%,rgba(255,255,255,.22))}}
html.hell .buehne-fakten a.buehne-preis:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border-bottom:1px solid rgba(0,152,190,.45)}
html.hell .abschluss-schritte li:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *)::before{background:rgba(0,152,190,.14)}
html.hell .buehne-personen .buehne-schleier:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(90deg,rgba(255,255,255,.86),rgba(255,255,255,.66) 36%,rgba(255,255,255,.28) 62%,transparent 80%),linear-gradient(180deg,rgba(255,255,255,.22),transparent 35%,transparent 78%,var(--bg))}
html.hell .buehne-personen .fakt:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(255,255,255,.58);border-color:rgba(12,38,48,0.26);color:rgba(11,30,37,0.98)}
html.hell .buehne-personen .fakt b:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .buehne-personen .knopf-glas:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(255,255,255,.5);border-color:rgba(12,38,48,0.34)}
html.hell .buehne-personen .knopf-glas:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(255,255,255,.68)}
@media(max-width:720px){html.hell .buehne-personen .buehne-schleier:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.7) 48%,rgba(255,255,255,.36) 76%,rgba(255,255,255,.24))}}
html.hell .buehne-ki i:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.76)}
html.hell .fenster-ki-kreis i:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.76)}
html.hell .buehne-ki i:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .fenster-ki-kreis i:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(255,255,255,.55);color:rgba(11,30,37,0.99)}
html.hell :not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *)::selection{background:rgba(0,122,156,.3)}
html.hell .c-karte:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(135deg,#0B1E25 0%,#0B1E25 60%)}
html.hell a.c-karte:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .c-karte.e-con[href]:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border-color:rgba(0,122,156,.45)}
html.hell .c-marke .elementor-heading-title:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.84)}
html.hell .c-fakten .elementor-icon-list-item:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.045)}
html.hell .c-fakten .elementor-icon-list-text b:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .c-fakten .elementor-icon-list-text strong:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .c-glas .elementor-button:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.053);color:#0B1E25;border:1px solid rgba(12,38,48,0.22)}
html.hell .c-glas .elementor-button:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.09);color:#0B1E25}
html.hell .elementor-widget-text-editor th:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .c-kopf.gescrollt:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(255,255,255,.96);border-bottom-color:rgba(12,38,48,0.12)}
html.hell .c-link .elementor-button:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .c-link .elementor-button:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .c-nav-knopf .elementor-button:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0B1E25;color:#0B1E25;border:1px solid rgba(12,38,48,0.16)}
html.hell .c-nav-knopf .elementor-button:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0B1E25;color:#0B1E25}
html.hell .c-fussspalte .c-marke .elementor-heading-title:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .c-lead:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .c-lead p:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.76)}
html.hell .c-leise:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .c-leise p:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.69)}
html.hell .c-worte span:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.045);color:rgba(11,30,37,0.92)}
html.hell .c-karte .elementor-widget-text-editor:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.76)}
html.hell .c-buehne .c-augenbraue p:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.84)}
html.hell .c-buehne .c-lead p:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,1)}
html.hell .c-weiss .elementor-button:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0B1E25;color:#FFFFFF}
html.hell .c-weiss .elementor-button:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#FFFFFF}
html.hell .c-faktenzeile p:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.76)}
html.hell .c-marke-text p:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.84)}
html.hell .c-grund .elementor-icon:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(0,152,190,.16)}
html.hell .c-grund .elementor-icon-box-title:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .c-grund .elementor-icon-box-description:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.69)}
html.hell .c-betrag .elementor-heading-title:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .c-je:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.69)}
html.hell .c-haken .elementor-icon-list-text:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.92)}
html.hell .c-aktiv:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border-color:rgba(0,122,156,.5) !important}
html.hell .c-abzeichen p:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#FFFFFF}
html.hell .c-fragen .elementor-toggle-title:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .c-fragen .elementor-tab-content:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.76)}
html.hell .c-abschluss:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:linear-gradient(135deg,#0B1E25 0%,#0B1E25 55%) !important}
html.hell .c-abschluss ol:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.92)}
html.hell .c-abschluss small:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.69)}
html.hell .c-ki p:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.94);background:rgba(255,255,255,.45)}
html.hell .c-buehne:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *)::after{background:linear-gradient(rgba(255,255,255,.58) 0%,rgba(255,255,255,.2) 30%,rgba(255,255,255,.52) 72%,rgba(255,255,255,.95) 100%),
             linear-gradient(95deg,rgba(255,255,255,.82) 0%,rgba(255,255,255,.55) 36%,rgba(255,255,255,.12) 76%,rgba(255,255,255,0) 100%)}
html.hell .c-buehne > .e-con:last-child > .e-con:last-child:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border-top:1px solid rgba(12,38,48,0.18)}
html.hell .c-marke-text p:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.84)}
html.hell .c-buehne .c-leise p:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.92)}
html.hell .c-buehne .c-leise strong:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .c-sterne:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0098BE}
html.hell .c-rahmen .elementor-button:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25;border:1px solid rgba(12,38,48,0.39)}
html.hell .c-rahmen .elementor-button:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.045);color:#0B1E25}
html.hell .wpcf7 input[type=submit].knopf:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0B1E25;color:#FFFFFF;border:1px solid #0B1E25}
html.hell .produkt-preis-kurz:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.84) !important}
html.hell .produkt-preis-kurz b:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .wpcf7 .form-hinweis:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.69)}
html.hell .wpcf7 .form-hinweis a:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#007A9C}
html.hell .kontakt-punkte li:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,1)}
html.hell .kontakt-weg:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border:1px solid rgba(12,38,48,0.14);background:rgba(12,38,48,0.022)}
html.hell a.kontakt-weg:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border-color:rgba(0,122,156,.45);background:rgba(0,122,156,.05)}
html.hell .kontakt-weg b:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .kontakt-weg small:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.69)}
html.hell .kontakt-form:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(255,255,255,.55);border:1px solid rgba(12,38,48,0.14)}
html.hell .kontakt-form-titel:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .wpcf7 label > span:first-child:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .wpcf7 .feld > span:first-child:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,1)}
html.hell .wpcf7 input[type=text]:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .wpcf7 input[type=email]:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .wpcf7 input[type=tel]:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .wpcf7 input[type=url]:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .wpcf7 input[type=number]:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .wpcf7 input[type=date]:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .wpcf7 select:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .wpcf7 textarea:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.038);color:#0B1E25;border:1px solid rgba(12,38,48,0.16)}
html.hell .wpcf7 input:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *)::placeholder,html.hell .wpcf7 textarea:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *)::placeholder{color:rgba(11,30,37,0.62)}
html.hell .wpcf7 input:focus:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .wpcf7 select:focus:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .wpcf7 textarea:focus:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border-color:#007A9C}
html.hell .wpcf7 select option:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0B1E25;color:#0B1E25}
html.hell .mail-pakete:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border:1px solid rgba(12,38,48,0.12);background:rgba(12,38,48,0.015)}
html.hell .mail-pakete-kopf b:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .mail-paket:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.03)}
html.hell .mail-paket b:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .status-gesamt b:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .status-eintrag h3:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .status-art:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .status-zustand:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.045)}
html.hell .status-hinweis:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(255,255,255,.92)}
html.hell .web-ref-fenster:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border:1px solid rgba(12,38,48,0.14);background:#0B1E25}
html.hell .web-ref-leiste:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.045)}
html.hell .web-ref-leiste i:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.135)}
html.hell .web-ref-leiste em:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.69);background:rgba(12,38,48,0.038)}
html.hell .web-ref-text h3:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .web-ref-text p:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.76)}
html.hell .web-ref-fuss:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.69)}
html.hell .reiter-leiste button[aria-selected="true"]:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#FFFFFF}
@media (max-width:1099px){html.hell .c-kopf .c-menue-mobil > a:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#007A9C !important}}
html.hell .c-kopf a:focus-visible:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .c-kopf button:focus-visible:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){outline:2px solid #007A9C}
html.hell .comnic-map.contact-map .contact-map-placeholder:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:radial-gradient(circle at 30% 30%,rgba(0,122,156,.10),transparent 60%),repeating-linear-gradient(0deg,rgba(12,38,48,0.022) 0 1px,transparent 1px 40px),repeating-linear-gradient(90deg,rgba(12,38,48,0.022) 0 1px,transparent 1px 40px)}
html.hell .comnic-map.contact-map .contact-map-overlay:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#007A9C}
html.hell .comnic-map.contact-map .contact-map-overlay span:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25;border:1px solid rgba(0,122,156,.4);background:rgba(0,122,156,.12)}
html.hell .comnic-map.contact-map .contact-map-placeholder:hover .contact-map-overlay span:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(0,122,156,.22)}
html.hell .comnic-map.contact-map .contact-map-overlay small:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.74)}
html.hell .prosa .recht-karte h2:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#007A9C !important}
html.hell .such-form input:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.038);color:#0B1E25}
html.hell .bildkarte .fenster-ki i:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .band-bild .fenster-ki i:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.76)}
html.hell .kurzform-tel a:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#007A9C}
html.hell .rueckruf-box:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border:1px solid rgba(0,122,156,.28);background:rgba(0,122,156,.05)}
html.hell .rueckruf-titel:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .c-tel .elementor-button:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .c-kopf .c-link .elementor-button:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .c-kopf .c-link:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *)::before{background:rgba(12,38,48,0.135)}
html.hell .c-kopf .c-nav-knopf .elementor-button:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0B1E25;color:#FFFFFF;border:1px solid #0B1E25}
html.hell .c-kopf .c-nav-knopf .elementor-button:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#007A9C;border-color:#007A9C;color:#FFFFFF}
html.hell .c-kopf .c-nav-knopf .elementor-button:focus-visible:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .c-kopf .c-tel .elementor-button:focus-visible:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *),html.hell .c-kopf .c-link .elementor-button:focus-visible:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){outline:2px solid #007A9C}
@media (min-width:1100px){html.hell .c-kopf .c-tel .elementor-button:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border:1px solid rgba(12,38,48,0.34)}}
@media (min-width:1100px){html.hell .c-kopf .c-tel .elementor-button:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border-color:#007A9C}}
@media (min-width:1100px){html.hell .c-kopf .c-link .elementor-button:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0098BE}}
html.hell .gross:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(255,255,255,.9)}
html.hell .gross-figur img:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#0B1E25}
html.hell .gross-figur figcaption:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:#0B1E25}
html.hell .gross-besch:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.92)}
html.hell .gross-zahl:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){color:rgba(11,30,37,0.79)}
html.hell .gross button:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){border:1px solid rgba(12,38,48,0.32);background:rgba(12,38,48,0.075);color:#0B1E25}
html.hell .gross button:hover:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:rgba(12,38,48,0.165)}
/* ---- Nacharbeit von Hand (bau/hell-nach.css) ---- */
/* Regeln aus eingebetteten <style>-Blöcken der Seiten (nicht in ap.css/comnic.css) */
html.hell .cb-wer b:not(.jet-popup *){color:#0B1E25}
html.hell .cb-mehr:not(.jet-popup *){color:#007A9C}
html.hell .buehne-bewertung:not(.buehne *) b{color:#0B1E25}
html.hell .buehne-bewertung:not(.buehne *) .buehne-bewertung-quelle{color:rgba(11,30,37,.68)}
/* Karten: auf hellem Grund weiß mit feinem Schatten statt Glas */
html.hell .karte:not(:is(.nav,.jet-theme-core-location--header-location,.jet-popup) *){background:#FFFFFF;border-color:rgba(12,38,48,.1);box-shadow:0 1px 2px rgba(12,38,48,.04),0 8px 24px -12px rgba(12,38,48,.12)}
/* Kontrast (Prüfung 10.11.26) */
html.hell .abzeichen:not(.jet-popup *){color:#FFFFFF}
html.hell .fuss3-zeit,html.hell .fuss3-leiste p{color:rgba(11,30,37,.72)}
/* Preiskarten weiß statt grau */
html.hell .karte.paket:not(.jet-popup *),html.hell .preise .karte:not(.jet-popup *){background:#FFFFFF}
/* Startseite in Abschnitte gegliedert (Florian 10.11.26: „zu viel einfarbig ohne Break“): Bänder im Wechsel Grund / Weiß, Kontakt getönt.
   Reihenfolge seit der Umstellung auf Webseiten + Software: leistungen · webseiten · produkte · bewertungen · warum · preise · fragen · kontakt.
   Die Abschnitte hatten teils padding-top:0 (flossen ineinander) – als Band brauchen sie oben wieder Luft. */
html.hell body.home :is(section#webseiten,section#bewertungen,section#fragen){background:#FFFFFF;border-block:1px solid rgba(12,38,48,.07)}
html.hell body.home section#kontakt{background:linear-gradient(180deg,#E6F1F5 0%,#EEF5F7 100%)}
html.hell body.home :is(section#webseiten,section#produkte,section#bewertungen,section#preise,section#fragen,section#kontakt){padding-top:var(--dc-abschnitt) !important}
html.hell body.home section#leistungen{padding-bottom:36px}
html.hell body.home section#warum{padding-bottom:var(--dc-abschnitt)}
/* auf weißem Band: Karten leicht getönt statt weiß auf weiß */
html.hell body.home :is(section#webseiten,section#bewertungen,section#fragen) :is(.karte,.web-ref,.hosting):not(.jet-popup *){background:#F6F9FA;box-shadow:none}
html.hell body.home section#preise .rechner{background:#FFFFFF;box-shadow:0 1px 2px rgba(12,38,48,.04),0 12px 32px -14px rgba(12,38,48,.18)}
html.hell .darum-band{background:#FFFFFF;border-color:rgba(12,38,48,.09);box-shadow:0 1px 2px rgba(12,38,48,.04),0 14px 32px -18px rgba(12,38,48,.16)}
html.hell .fuss3{--f-bg:#FFFFFF}
/* Preiskarten hell: weiß, feiner Rand, weicher Schatten; die empfohlene mit Akzentrand */
html.hell .preiskarte:not(.jet-popup *){background:#FFFFFF;border-color:rgba(12,38,48,.12);box-shadow:0 1px 2px rgba(12,38,48,.05),0 14px 28px -16px rgba(12,38,48,.22)}
html.hell .preiskarte.aktiv:not(.jet-popup *){background:#FFFFFF;border-color:#007A9C;box-shadow:0 1px 2px rgba(12,38,48,.05),0 18px 32px -16px rgba(0,122,156,.35)}
/* Symbol-Kacheln der Leistungskarten auf hellem Grund */
html.hell #leistungen .karte.tuer{--sym-farbe:#0098BE;--sym-grund:rgba(140,190,40,.18)}

/* ===== Freundliche Fassung nach Florians zweitem Entwurf (10.11.26): Kopf hell, Bühne der Startseite hell – Text links, das Hero-VIDEO als abgerundete Karte rechts (Florian: „aber das Hero-Video verwenden“) ===== */
html.hell .c-kopf,html.hell .c-kopf.gescrollt{background:rgba(255,255,255,.94);border-bottom-color:rgba(12,38,48,.08);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
html.hell .c-kopf .jet-nav > .jet-nav__item > a .jet-nav-link-text,html.hell .c-kopf .jet-nav > .jet-nav__item > a{color:#1B323B !important}
html.hell .c-kopf .jet-nav > .jet-nav__item > a:hover .jet-nav-link-text,html.hell .c-kopf .jet-nav > .jet-nav__item.current-menu-item > a .jet-nav-link-text{color:#007A9C !important}
html.hell .c-kopf .c-suche .jet-ajax-search__popup-trigger,html.hell .c-kopf .jet-nav__mobile-trigger{color:#0B1E25 !important}
html.hell .c-kopf .c-tel .elementor-button{color:#0B1E25;border-color:rgba(12,38,48,.22)}
html.hell .c-kopf .c-tel .elementor-button:hover{color:#007A9C;border-color:#007A9C}
html.hell .c-kopf .c-link .elementor-button{background:#A8C428;color:#FFFFFF}
html.hell .c-kopf .c-link .elementor-button:hover{background:#97B21C;color:#FFFFFF}

html.hell .buehne-karte{background:linear-gradient(180deg,#FFFFFF 0%,#F1F6F8 100%);min-height:0;--bild-b:min(46vw,660px)}
html.hell .buehne-karte .buehne-schleier{display:none}
html.hell .buehne-karte .buehne-bild{inset:auto;top:112px;right:var(--buehne-innen);left:auto;bottom:auto;width:var(--bild-b);height:auto;aspect-ratio:16/10.5;border-radius:28px;overflow:hidden;box-shadow:0 2px 4px rgba(12,38,48,.06),0 30px 60px -28px rgba(12,38,48,.45)}
html.hell .buehne-karte .buehne-bild video,html.hell .buehne-karte .buehne-bild img{width:100%;height:100%;object-fit:cover;object-position:62% 30%}
html.hell .buehne-karte > .buehne-ki.ki-oben{top:124px;right:calc(var(--buehne-innen) + 12px);bottom:auto}
html.hell .buehne-karte .buehne-inhalt{padding-top:136px;padding-bottom:56px;min-height:calc(112px + var(--bild-b) * .66 + 40px)}
html.hell .buehne-karte .buehne-inhalt .huelle{max-width:none;margin:0;width:100%}
html.hell .buehne-karte .buehne-inhalt .huelle > *{max-width:calc(100% - var(--bild-b) - 56px)}
html.hell .buehne-karte .d1{font-size:clamp(38px,4.6vw,66px);color:#0B1E25}
html.hell .buehne-karte .d1 .zweite{color:#0098BE}
html.hell .buehne-karte .lead,html.hell .buehne-karte .buehne-augenbraue{color:rgba(11,30,37,.78)}
html.hell .buehne-karte .buehne-notiz,html.hell .buehne-karte .buehne-fakten{color:rgba(11,30,37,.68)}
html.hell .buehne-karte .buehne-fakten a.buehne-preis{color:#0098BE;border-bottom-color:rgba(0,152,190,.45)}
html.hell .buehne-karte .knopf-weiss{background:#A8C428;color:#FFFFFF;border-color:#A8C428}
html.hell .buehne-karte .knopf-weiss:hover{background:#97B21C;color:#FFFFFF}
html.hell .buehne-karte .buehne-fuss{background:transparent;border-top:1px solid rgba(12,38,48,.08)}
html.hell .buehne-karte .buehne-fuss-titel{color:rgba(11,30,37,.6)}
html.hell .buehne-karte .buehne-logos img,html.hell .buehne-karte .buehne-logos a:hover img{filter:brightness(0);opacity:.55}
html.hell .buehne-karte .buehne-logos a:hover img{opacity:.9}
html.hell .buehne-karte .buehne-leiste .knopf-rahmen{color:#0B1E25;border-color:rgba(12,38,48,.22)}
html.hell .buehne-karte .buehne-bewertung b{color:#0B1E25}
html.hell .buehne-karte .buehne-bewertung-quelle{color:rgba(11,30,37,.68)}
html.hell .buehne-karte .sterne{color:rgba(12,38,48,.18)}
html.hell .buehne-karte .sterne::before{color:#E29A00}
@media (max-width:999px){
  html.hell .buehne-karte{display:flex;flex-direction:column}
  html.hell .buehne-karte .buehne-bild{position:relative;top:auto;right:auto;width:auto;margin:84px 16px 0;aspect-ratio:16/10;border-radius:20px;flex:none}
  html.hell .buehne-karte > .buehne-ki.ki-oben{top:96px;right:28px}
  html.hell .buehne-karte .buehne-inhalt{padding-top:28px;padding-bottom:36px;min-height:0}
  html.hell .buehne-karte .buehne-inhalt .huelle > *{max-width:none}
}
/* Nacharbeit Bühne hell: keine Verläufe über der Videokarte, Karte liegt oben; Logos dunkel auf hell; zweite Zeile grün */
html.hell .buehne-karte::before,html.hell .buehne-karte::after,html.hell .buehne-karte .buehne-inhalt::before,html.hell .buehne-karte .buehne-inhalt::after,html.hell .buehne-karte .buehne-fuss::before{display:none !important}
html.hell .buehne-karte .buehne-inhalt,html.hell .buehne-karte .buehne-fuss,html.hell .buehne-karte .buehne-leiste,html.hell .buehne-karte .buehne-fuss-kopf{background:none !important;box-shadow:none}
html.hell .buehne-karte .buehne-bild{z-index:3;-webkit-mask-image:none;mask-image:none}
html.hell .buehne-karte > .buehne-ki.ki-oben{z-index:4}
html.hell .buehne-karte .buehne-inhalt{position:relative;z-index:2}
html.hell .buehne-karte .d1 .zweite{color:#0098BE !important}
html.hell .buehne-karte .buehne-logos a{background:none !important}
html.hell .buehne-karte .buehne-logos img,html.hell .buehne-karte .buehne-logos a:hover img{filter:brightness(0) !important;opacity:.55}
html.hell .buehne-karte .buehne-logos a:hover img{opacity:1}
@media (max-width:999px){
  html.hell .buehne-karte .buehne-bild{margin-top:24px}
  html.hell .buehne-karte > .buehne-ki.ki-oben{top:100px;right:28px}
}
html.hell .buehne-karte .buehne-schleier{display:none !important;background:none !important}
/* Video/Standbild trugen eine Rand-Maske (für das vollflächige dunkle Bild gedacht) – in der Karte scharfe Kanten */
html.hell .buehne-karte .buehne-bild video,html.hell .buehne-karte .buehne-bild img{-webkit-mask-image:none !important;mask-image:none !important}
/* Video wie im Entwurf eingebaut (Florian 10.11.26): füllt die rechte Hälfte der Bühne bis zum Seitenrand, linke Kante schräg – keine schwebende Karte mehr.
   Kein transform am Container (das Skript setzt dort selbst eins) und keins am Video (ist per top:50%/translate zentriert) → Schräge per clip-path. */
@media (min-width:1000px){
  html.hell .buehne-karte{overflow:hidden;--fuss-h:148px}
  html.hell .buehne-karte .buehne-bild{top:64px;right:0;bottom:var(--fuss-h);left:auto;width:52%;height:auto;aspect-ratio:auto;border-radius:0;box-shadow:none;overflow:hidden;clip-path:polygon(13% 0,100% 0,100% 100%,0 100%)}
  html.hell .buehne-karte .buehne-bild video,html.hell .buehne-karte .buehne-bild img{object-position:60% 30%}
  html.hell .buehne-karte > .buehne-ki.ki-oben{top:78px;right:18px}
  html.hell .buehne-karte .buehne-inhalt{min-height:clamp(460px,56vh,580px);padding-top:120px;padding-bottom:56px}
  html.hell .buehne-karte .buehne-inhalt .huelle > *{max-width:45%}
}
/* Kundenleiste ein Stück tiefer (Florian) */
html.hell .buehne-karte .buehne-fuss{padding-top:26px;border-top:1px solid rgba(12,38,48,.08)}
/* Linke Ecken der Video-Fläche abgerundet wie im Entwurf (Florian). shape() kennen aktuelle Chrome/Safari; ältere Browser behalten die Schräge mit spitzen Ecken. */
@media (min-width:1000px){
  @supports (clip-path:shape(from 0 0,line to 10px 10px,close)){
    html.hell .buehne-karte .buehne-bild{clip-path:shape(from calc(13% + 38px) 0,line to 100% 0,line to 100% 100%,line to 52px 100%,curve to 7px calc(100% - 50px) with 0 100%,line to calc(13% - 7px) 46px,curve to calc(13% + 38px) 0 with 13% 0,close)}
  }
}
/* Kein Parallax in der hellen Bühne (Florian: Video schob sich beim Scrollen vor die Kundenleiste/Bewertung): Skript-transform aufheben, Leiste liegt deckend darüber */
html.hell .buehne-karte .buehne-bild{transform:none !important;will-change:auto}
html.hell .buehne-karte .buehne-fuss{position:relative;z-index:6;background:#F6F9FA !important}
/* Menü hell (Florian 10.11.26): Aufklappmenüs weiß mit dunkler Schrift, passend zum hellen Kopf */
html.hell .c-kopf .jet-nav__sub{background:#FFFFFF !important;border:1px solid rgba(12,38,48,.1) !important;box-shadow:0 2px 4px rgba(12,38,48,.05),0 24px 48px -20px rgba(12,38,48,.32) !important;backdrop-filter:none}
html.hell .c-kopf .jet-nav__sub .jet-nav-link-text{color:#0B1E25 !important}
html.hell .c-kopf .jet-nav__sub .jet-nav-item-desc{color:rgba(11,30,37,.64) !important}
html.hell .c-kopf .jet-nav__sub .menu-item-link:hover,html.hell .c-kopf .jet-nav__sub .jet-nav__item-link:hover{background:rgba(12,38,48,.05) !important}
html.hell .c-kopf .jet-nav__sub .menu-item-link:hover .jet-nav-link-text{color:#007A9C !important}
html.hell .c-kopf .jet-nav__sub .menu-item-link:hover .jet-nav-item-desc{color:rgba(11,30,37,.78) !important}
html.hell .c-kopf .jet-nav__sub .menu-item-link::after{color:#007A9C}
html.hell .c-kopf .jet-nav__sub .mega-kopf .jet-nav-link-text{color:rgba(11,30,37,.58) !important}
html.hell .c-kopf .jet-nav__sub [class*="ico-"] > .menu-item-link::before{background-color:rgba(140,190,40,.2) !important;color:#0098BE}
html.hell .c-kopf .jet-nav__sub [class*="ico-"] > .menu-item-link:hover::before{background-color:rgba(140,190,40,.32) !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link{background:linear-gradient(135deg,rgba(0,122,156,.09),rgba(140,190,40,.12)) !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link:hover{background:linear-gradient(135deg,rgba(0,122,156,.15),rgba(140,190,40,.18)) !important}
html.hell .c-kopf .jet-nav > .jet-nav__item > a .jet-nav-arrow{color:#1B323B}
/* aufgeklapptes Menü am Handy/Tablet */
@media (max-width:1099px){
  html.hell .c-kopf .jet-nav{background:#FFFFFF !important;border-top:1px solid rgba(12,38,48,.08);box-shadow:0 24px 48px -20px rgba(12,38,48,.3)}
  html.hell .c-kopf .jet-nav .jet-nav__item > a .jet-nav-link-text{color:#0B1E25 !important}
  html.hell .c-kopf .jet-nav .jet-nav__sub{box-shadow:none !important;border:0 !important;background:#F6F9FA !important}
}
@media (max-width:1099px){
  html.hell .c-kopf .jet-nav .jet-nav__item,html.hell .c-kopf .jet-nav .jet-nav__item > a,html.hell .c-kopf .jet-nav .menu-item-link{background:transparent !important;background-color:transparent !important}
  html.hell .c-kopf .jet-nav > .jet-nav__item{border-bottom:1px solid rgba(12,38,48,.08)}
  html.hell .c-kopf .jet-nav > .jet-nav__item > a:hover{background:rgba(12,38,48,.04) !important}
  html.hell .c-kopf .jet-nav .jet-nav-arrow,html.hell .c-kopf .jet-nav__mobile-close-btn{color:#0B1E25 !important}
}
/* Bühnenvideo: Form (Schräge, runde Ecken) ohne Verlauf/Schleier (Florian 10.11.26: „Verlauf raus aus dem Video“) */
/* Menüfarben kräftiger statt pastellig (Florian 10.11.26): dunkle Symbol-Kacheln mit hellem Symbol, klare Schrift, Erstberatung als grüne Fläche, aktiver Punkt mit grünem Strich */
html.hell .c-kopf .jet-nav__sub [class*="ico-"] > .menu-item-link::before{background-color:#0B1E25 !important;border-color:#0B1E25 !important}
html.hell .c-kopf .jet-nav__sub [class*="ico-"] > .menu-item-link:hover::before{background-color:#007A9C !important;border-color:#007A9C !important}
html.hell .c-kopf .jet-nav__sub .jet-nav-link-text{color:#0B1E25 !important;font-weight:650 !important}
html.hell .c-kopf .jet-nav__sub .jet-nav-item-desc{color:rgba(11,30,37,.7) !important}
html.hell .c-kopf .jet-nav__sub .menu-item-link:hover,html.hell .c-kopf .jet-nav__sub .jet-nav__item-link:hover{background:#EEF3F5 !important}
html.hell .c-kopf .jet-nav__sub .menu-item-link:hover .jet-nav-link-text{color:#0B1E25 !important}
html.hell .c-kopf .jet-nav__sub .mega-kopf .jet-nav-link-text{color:#0098BE !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link,html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link:hover{background:#A8C428 !important;border:0 !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link:hover{background:#97B21C !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis .jet-nav-link-text,html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link:hover .jet-nav-link-text{color:#FFFFFF !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis .jet-nav-item-desc,html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link:hover .jet-nav-item-desc{color:rgba(255,255,255,.86) !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link::after{color:#FFFFFF;opacity:1;transform:translate(0,-50%)}
html.hell .c-kopf .jet-nav > .jet-nav__item > a .jet-nav-link-text,html.hell .c-kopf .jet-nav > .jet-nav__item > a{color:#0B1E25 !important}
html.hell .c-kopf .jet-nav > .jet-nav__item > a:hover .jet-nav-link-text,html.hell .c-kopf .jet-nav > .jet-nav__item.current-menu-item > a .jet-nav-link-text{color:#0B1E25 !important}
@media (min-width:1100px){
  html.hell .c-kopf .jet-nav > .jet-nav__item > a{position:relative}
  html.hell .c-kopf .jet-nav > .jet-nav__item > a::before{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;border-radius:2px;background:#A8C428;transform:scaleX(0);transform-origin:left;transition:transform .18s ease-out}
  html.hell .c-kopf .jet-nav > .jet-nav__item:hover > a::before,html.hell .c-kopf .jet-nav > .jet-nav__item.current-menu-item > a::before{transform:scaleX(1)}
}
@media (prefers-reduced-motion:reduce){html.hell .c-kopf .jet-nav > .jet-nav__item > a::before{transition:none}}
/* ===== Klare Farben wie im Entwurf, Pastell-Überlagerungen weg (Florian 10.11.26): flache Flächen (Weiß / helles Grau), Grün als Hauptfarbe für Knöpfe und Auswahl, Petrol nur für Textlinks ===== */
html.hell{--dc-band-verlauf:linear-gradient(#FFFFFF,#FFFFFF);--dc-karte-verlauf:linear-gradient(#FFFFFF,#FFFFFF)}
html.hell body.home section#kontakt{background:#F3F6F7 !important}
html.hell .abschluss:not(.jet-popup *){background:#FFFFFF !important;background-image:none !important;border:1px solid rgba(12,38,48,.1) !important;box-shadow:0 1px 2px rgba(12,38,48,.04),0 18px 40px -22px rgba(12,38,48,.2) !important}
html.hell .abschluss:not(.jet-popup *)::before,html.hell .abschluss:not(.jet-popup *)::after{display:none !important}
html.hell .kontakt-weg:not(.jet-popup *){background:#F6F8F9 !important;border-color:rgba(12,38,48,.1) !important}
html.hell a.kontakt-weg:not(.jet-popup *):hover{background:#EEF3F5 !important;border-color:#A8C428 !important}
html.hell .kontakt-form:not(.jet-popup *){background:#F6F8F9 !important;border-color:rgba(12,38,48,.1) !important}
html.hell .kontakt-form:not(.jet-popup *) :is(input:not([type=submit]),select,textarea){background:#FFFFFF !important;border-color:rgba(12,38,48,.2) !important;color:#0B1E25 !important}
html.hell .kontakt-form:not(.jet-popup *) :is(input,select,textarea):focus{border-color:#A8C428 !important;outline:2px solid rgba(0,152,190,.25);outline-offset:1px}
html.hell .wpcf7 input[type=submit].knopf:not(.jet-popup *){background:#A8C428 !important;border-color:#A8C428 !important;color:#FFFFFF !important}
html.hell .wpcf7 input[type=submit].knopf:not(.jet-popup *):hover{background:#97B21C !important}
html.hell .reiter-leiste:not(.jet-popup *){background:#E9EEF0 !important;border-color:transparent !important}
html.hell .reiter-leiste:not(.jet-popup *) button{color:#1B323B !important}
html.hell .reiter-leiste:not(.jet-popup *) button[aria-selected="true"]{background:#0B1E25 !important;color:#FFFFFF !important}
/* Hauptknöpfe grün */
html.hell .knopf-voll:not(.jet-popup *){background:#A8C428 !important;border-color:#A8C428 !important;color:#FFFFFF !important}
html.hell .knopf-voll:not(.jet-popup *):hover{background:#97B21C !important;color:#FFFFFF !important}
html.hell .knopf-glas:not(.jet-popup *),html.hell .knopf-rahmen:not(.jet-popup *){background:#FFFFFF !important;border:1px solid rgba(12,38,48,.2) !important;color:#0B1E25 !important}
html.hell .knopf-glas:not(.jet-popup *):hover,html.hell .knopf-rahmen:not(.jet-popup *):hover{background:#F1F5F6 !important;border-color:#0B1E25 !important}
/* Preisbereich: Auswahl und Regler grün, keine getönte Karte */
html.hell .preiskarte.aktiv:not(.jet-popup *){border-color:#A8C428 !important;box-shadow:0 1px 2px rgba(12,38,48,.05),0 18px 32px -18px rgba(12,38,48,.28) !important}
html.hell .regler-fuell,html.hell #produkte .regler-fuell{background:#A8C428 !important}
html.hell .regler-griff,html.hell #produkte .regler-griff{background:#0B1E25 !important;box-shadow:0 2px 8px rgba(12,38,48,.3) !important}
html.hell .empfehlung .empf-marke{color:#0098BE !important}
html.hell .hosting:not(.jet-popup *){background:#FFFFFF !important;background-image:none !important}
html.hell body.home section#webseiten .hosting{background:#F6F8F9 !important}
/* Symbol-Kacheln der Leistungen und Haken: kräftig statt blass */
html.hell #leistungen .karte.tuer{--sym-farbe:#FFFFFF;--sym-grund:#A8C428}
html.hell .haken:not(.jet-popup *){background:#A8C428 !important;color:#FFFFFF !important;border-color:#A8C428 !important}

/* ===== Comnic-Farben aus dem Logo (Florian 10.11.26): Blau #00A0C8 und Grün #A8C428 (aus logo-nav.webp gemessen).
   Grün = Flächen (Knöpfe, Kacheln, Haken) mit dunkler Schrift – weiße Schrift auf diesem Grün wäre zu schwach.
   Blau = Akzentzeilen der Überschriften (#0098BE, große Schrift), kleine farbige Texte/Links etwas dunkler (#007A9C), damit sie auf Weiß lesbar bleiben. ===== */
html.hell .c-kopf .c-link .elementor-button,html.hell .c-kopf .c-link .elementor-button:hover,
html.hell .buehne-karte .knopf-weiss,html.hell .buehne-karte .knopf-weiss:hover,
html.hell .wpcf7 input[type=submit].knopf:not(.jet-popup *),
html.hell .knopf-voll:not(.jet-popup *),html.hell .knopf-voll:not(.jet-popup *):hover{color:#0B1E25 !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis .jet-nav-link-text,html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link:hover .jet-nav-link-text{color:#0B1E25 !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis .jet-nav-item-desc,html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link:hover .jet-nav-item-desc{color:rgba(11,30,37,.8) !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link::after{color:#0B1E25}
html.hell .haken:not(.jet-popup *){color:#0B1E25 !important}
html.hell #leistungen .karte.tuer{--sym-farbe:#0B1E25;--sym-grund:#A8C428}
html.hell .darum-punkte li::before{background:#00A0C8}
html.hell .buehne-karte .buehne-fakten a.buehne-preis,html.hell .empfehlung .empf-marke,html.hell .c-kopf .jet-nav__sub .mega-kopf .jet-nav-link-text{color:#007A9C !important}
html.hell .buehne-karte .buehne-fakten a.buehne-preis{border-bottom-color:rgba(0,122,156,.45)}
html.hell .preiskarte.aktiv:not(.jet-popup *){border-color:#00A0C8 !important}
html.hell .regler-fuell,html.hell #produkte .regler-fuell{background:#00A0C8 !important}
html.hell .c-kopf .jet-nav > .jet-nav__item > a::before{background:#00A0C8}
html.hell .c-kopf .jet-nav__sub [class*="ico-"] > .menu-item-link:hover::before{background-color:#00A0C8 !important;border-color:#00A0C8 !important}
html.hell .kontakt-form:not(.jet-popup *) :is(input,select,textarea):focus{border-color:#00A0C8 !important;outline-color:rgba(0,160,200,.3)}
html.hell a.kontakt-weg:not(.jet-popup *):hover{border-color:#00A0C8 !important}
html.hell .kopf-geteilt .lead{border-left-color:#A8C428}
/* Bühne mit hellem Bild statt Video (10.11.26): Ausschnitt so, dass Person und Laptop in der Form bleiben */
html.hell .buehne-karte .buehne-bild img{object-position:58% 78% !important;animation:none !important}
@media (max-width:999px){html.hell .buehne-karte .buehne-bild img{object-position:55% 70% !important}}
/* Kopf und Bühne mit leichter Hintergrundfarbe wie im Entwurf (Florian 10.11.26) – nicht reinweiß; Karten/Bänder darunter bleiben weiß */
html.hell .c-kopf,html.hell .c-kopf.gescrollt{background:rgba(238,243,245,.95) !important;border-bottom-color:rgba(12,38,48,.07) !important}
html.hell .buehne-karte{background:#EEF3F5 !important}
html.hell .buehne-karte .buehne-fuss{background:#EEF3F5 !important}
html.hell body.home section#leistungen{background:#F7F9FA}
/* Schrift wie im Entwurf (Florian 10.11.26): weiterhin Manrope (liegt lokal, nichts von Google), aber kräftiger und klarer –
   Überschriften fett (700–750) statt mittel, Fließtext mit normalem Gewicht und etwas dunkler, Menü und Knöpfe halbfett. */
html.hell .d1{font-weight:750 !important;letter-spacing:-.032em !important}
html.hell .d2{font-weight:720 !important;letter-spacing:-.028em !important}
html.hell .d3,html.hell #leistungen .karte.tuer > .d3{font-weight:700 !important;letter-spacing:-.015em !important}
html.hell .d1 .zweite,html.hell .d2 .zweite{font-weight:inherit;letter-spacing:inherit}
html.hell .lead{font-weight:450;color:rgba(11,30,37,.8) !important}
html.hell .karte p,html.hell .web-ref-text p{color:rgba(11,30,37,.76)}
html.hell .c-kopf .jet-nav > .jet-nav__item > a .jet-nav-link-text{font-weight:600 !important}
html.hell .knopf{font-weight:700}
html.hell .darum-punkte b,html.hell .fuss3-spalten p{font-weight:750}
/* Hintergrundfarbe der Bühne nur bis zum unteren Bildrand (Florian 10.11.26): die Kundenleiste darunter steht auf Weiß */
html.hell .buehne-karte .buehne-fuss{background:#FFFFFF !important;border-top:0 !important}
html.hell body.home section#leistungen{background:#FFFFFF}
@media (min-width:900px){.kopf.kopf-geteilt{flex-wrap:nowrap}}
/* ===== Menü oben dezenter und moderner (Florian 10.11.26): ruhige Schrift, weiche Hover-Fläche statt Strich, schlichtes Aufklappmenü ohne schwere Kacheln,
   „Anmelden“ als ruhiger Rahmenknopf – Grün bleibt dem Hauptknopf in der Bühne vorbehalten ===== */
html.hell .c-kopf .jet-nav{gap:4px !important}
html.hell .c-kopf .jet-nav > .jet-nav__item > a{padding:8px 12px !important;border-radius:9px;transition:background .15s,color .15s}
html.hell .c-kopf .jet-nav > .jet-nav__item > a .jet-nav-link-text{font-weight:550 !important;font-size:14.5px !important;color:#31474F !important;letter-spacing:0}
html.hell .c-kopf .jet-nav > .jet-nav__item > a::before{display:none !important}
html.hell .c-kopf .jet-nav > .jet-nav__item:hover > a,html.hell .c-kopf .jet-nav > .jet-nav__item.current-menu-item > a{background:rgba(12,38,48,.06)}
html.hell .c-kopf .jet-nav > .jet-nav__item:hover > a .jet-nav-link-text,html.hell .c-kopf .jet-nav > .jet-nav__item.current-menu-item > a .jet-nav-link-text{color:#0B1E25 !important}
html.hell .c-kopf .jet-nav > .jet-nav__item > a .jet-nav-arrow{color:#6B7E86;margin-left:6px}
html.hell .c-kopf .elementor-widget-jet-nav-menu{margin-left:14px}
/* Aufklappmenü */
@media (min-width:1100px){
  html.hell .c-kopf .jet-nav__sub.jet-nav-depth-0{width:300px !important;padding:6px !important;border-radius:14px !important;border:1px solid rgba(12,38,48,.08) !important;box-shadow:0 1px 2px rgba(12,38,48,.04),0 16px 40px -16px rgba(12,38,48,.22) !important;margin-top:6px}
  html.hell .c-kopf .jet-nav__sub [class*="ico-"] > .menu-item-link{padding:9px 12px 9px 46px !important;min-height:0}
  html.hell .c-kopf .jet-nav__sub [class*="ico-"] > .menu-item-link::before{left:12px;top:11px;width:22px;height:22px;border:0 !important;border-radius:0;background-color:transparent !important;background-size:20px;filter:brightness(0);opacity:.72}
  html.hell .c-kopf .jet-nav__sub [class*="ico-"] > .menu-item-link:hover::before{background-color:transparent !important;opacity:1}
  html.hell .c-kopf .jet-nav__sub .mega-hinweis{margin-top:4px !important;border-top:1px solid rgba(12,38,48,.08);padding-top:4px}
  html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link{padding:10px 34px 10px 12px !important}
}
html.hell .c-kopf .jet-nav__sub .jet-nav-link-text{font-size:14.5px !important;font-weight:600 !important;color:#0B1E25 !important}
html.hell .c-kopf .jet-nav__sub .jet-nav-item-desc{font-size:12.5px !important;color:rgba(11,30,37,.6) !important}
html.hell .c-kopf .jet-nav__sub .menu-item-link:hover,html.hell .c-kopf .jet-nav__sub .jet-nav__item-link:hover{background:#F2F5F6 !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link,html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link:hover{background:transparent !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link:hover{background:#F2F5F6 !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis .jet-nav-link-text,html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link:hover .jet-nav-link-text{color:#007A9C !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis .jet-nav-item-desc{display:none !important}
html.hell .c-kopf .jet-nav__sub .mega-hinweis > .menu-item-link::after{color:#007A9C;opacity:1;transform:translate(0,-50%)}
/* rechts: Suche und Telefon ruhig, Anmelden als Rahmenknopf */
html.hell .c-kopf .c-suche .jet-ajax-search__popup-trigger{color:#31474F !important}
html.hell .c-kopf .c-tel .elementor-button{color:#0B1E25;font-weight:600;font-size:14.5px}
html.hell .c-kopf .c-link .elementor-button,html.hell .c-kopf .c-link .elementor-button:hover{background:transparent !important;color:#0B1E25 !important;border:1px solid rgba(12,38,48,.22);font-weight:600 !important;font-size:14.5px;height:38px}
html.hell .c-kopf .c-link .elementor-button:hover{border-color:#0B1E25;background:rgba(12,38,48,.04) !important}
/* Weicher Schatten am Übergang unter dem Bild (Florian 10.11.26): die getönte Bühne wirft einen leichten Schatten auf die weiße Kundenleiste */
html.hell .buehne-karte .buehne-fuss{background:linear-gradient(180deg,rgba(12,38,48,.085) 0,rgba(12,38,48,.03) 10px,rgba(12,38,48,0) 26px),#FFFFFF !important}
/* „Darum Comnic-IT.“: Band sitzt mittig in einem eigenen getönten Streifen (Florian 10.11.26: klebte oben am Abschnittsrand) */
html.hell body.home section#leistungen{padding-bottom:clamp(48px,6vw,80px) !important}
html.hell body.home section#warum{background:#EEF3F5 !important;padding-top:clamp(44px,5vw,64px) !important;padding-bottom:clamp(44px,5vw,64px) !important}
/* Kopf mit Menü wieder weiß (Florian 10.11.26) – die Tönung bleibt nur in der Bühne */
html.hell .c-kopf,html.hell .c-kopf.gescrollt{background:rgba(255,255,255,.96) !important;border-bottom-color:rgba(12,38,48,.08) !important}
/* Projektkarten sauberer (10.11.26): heller Fensterbalken statt dunklem, feiner Rahmen ums Bild, Fußzeile einzeilig */
html.hell .web-ref-fenster{background:#FFFFFF !important;border:1px solid rgba(12,38,48,.1) !important;border-radius:12px !important;overflow:hidden;box-shadow:0 1px 2px rgba(12,38,48,.04),0 10px 24px -14px rgba(12,38,48,.2)}
html.hell .web-ref-leiste{background:#F1F4F5 !important;border-bottom:1px solid rgba(12,38,48,.08) !important;padding:7px 10px !important}
html.hell .web-ref-leiste i{background:rgba(12,38,48,.16) !important;width:8px;height:8px}
html.hell .web-ref-leiste em{background:#FFFFFF !important;color:rgba(11,30,37,.62) !important;border:1px solid rgba(12,38,48,.08)}
html.hell .web-ref-fenster img{border-radius:0 !important}
html.hell .web-ref-fuss{flex-wrap:nowrap;gap:12px;align-items:center}
html.hell .web-ref-fuss > span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.hell .web-ref-fuss .weiter{white-space:nowrap;flex:none;color:#007A9C !important}
html.hell .web-ref-text .karte-nr{letter-spacing:.04em;font-weight:650}
/* FloppyOps-Logo auf hellem Grund: die Fassung mit dunkler Schrift (logo-wide-light) statt der hellen (Florian 10.11.26) – gilt auf allen Seiten */
html.hell img[src*="floppyops/logo-wide-dark"]:not(:is(.jet-popup,.jet-theme-core-location--header-location) *){content:url(/wp-content/uploads/website/img/floppyops/logo-wide-light.webp)}

/* ===== Unterseiten-Köpfe hell wie die Startseite (Florian 10.11.26: „in allen Hero-Seiten die richtigen Farben wie in der Landingpage“, Texte lesbar):
   getönte Fläche, Text links in dunkler Schrift, Bild rechts in derselben schrägen Form, Hauptknopf grün. Gilt für alle .buehne-klein. ===== */
html.hell .buehne-klein{background:#EEF3F5 !important;min-height:0 !important;overflow:hidden}
html.hell .buehne-klein .buehne-schleier{display:none !important}
html.hell .buehne-klein .buehne-bild{transform:none !important;will-change:auto}
html.hell .buehne-klein .buehne-bild picture,html.hell .buehne-klein .buehne-bild img,html.hell .buehne-klein .buehne-bild video{display:block;width:100%;height:100%;object-fit:cover;filter:none !important;animation:none !important;-webkit-mask-image:none !important;mask-image:none !important}
html.hell .buehne-klein .buehne-inhalt{position:relative;z-index:2;background:none !important}
html.hell .buehne-klein .brotkrumen,html.hell .buehne-klein .brotkrumen a,html.hell .buehne-klein .brotkrumen span{color:rgba(11,30,37,.62) !important}
html.hell .buehne-klein .brotkrumen a:hover{color:#007A9C !important}
html.hell .buehne-klein .marke-zeile-buehne .punkt{display:none !important}
html.hell .buehne-klein .marke-zeile-buehne .marke,html.hell .buehne-klein .marke{color:rgba(11,30,37,.68) !important}
html.hell .buehne-klein .d1{color:#0B1E25 !important;font-size:clamp(32px,3.7vw,54px) !important;line-height:1.1 !important;max-width:none}
html.hell .buehne-klein .d1 .zweite{color:#0098BE !important}
html.hell .buehne-klein .lead{color:rgba(11,30,37,.8) !important}
html.hell .buehne-klein .fakten .fakt,html.hell .buehne-klein .fakt{background:#FFFFFF !important;border:1px solid rgba(12,38,48,.12) !important;color:rgba(11,30,37,.74) !important}
html.hell .buehne-klein .fakt b{color:#0B1E25 !important}
html.hell .buehne-klein .knopf-voll{background:#A8C428 !important;border-color:#A8C428 !important;color:#0B1E25 !important}
html.hell .buehne-klein .knopf-voll:hover{background:#97B21C !important}
html.hell .buehne-klein .knopf-glas,html.hell .buehne-klein .knopf-rahmen{background:#FFFFFF !important;border:1px solid rgba(12,38,48,.2) !important;color:#0B1E25 !important}
html.hell .buehne-klein .buehne-ki{z-index:4}
/* Korrektur (Florian 10.11.26): Unterseiten NICHT halb/halb wie die Startseite – das Bild füllt weiter die ganze Breite, davor ein heller Schleier von links,
   damit der dunkle Text lesbar ist; unten derselbe weiche Schatten wie unter der Startseiten-Bühne. Die Bilder selbst werden gegen helle, freie Fotos getauscht. */
html.hell .buehne-klein{padding-top:64px;display:flex;align-items:center;position:relative;z-index:1;box-shadow:0 16px 26px -20px rgba(12,38,48,.34)}
html.hell .buehne-klein .buehne-bild{position:absolute;inset:64px 0 0 0;width:auto;height:auto;clip-path:none}
html.hell .buehne-klein .buehne-schleier{display:block !important;position:absolute;inset:64px 0 0 0;z-index:1;background:linear-gradient(90deg,rgba(238,243,245,.96) 0%,rgba(238,243,245,.9) 30%,rgba(238,243,245,.45) 48%,rgba(238,243,245,0) 64%) !important}
html.hell .buehne-klein .buehne-inhalt{width:100%;padding:56px 0 64px !important;min-height:clamp(360px,44vh,460px);display:flex;align-items:center}
html.hell .buehne-klein .buehne-inhalt .huelle{width:100%}
html.hell .buehne-klein .buehne-ki{top:auto;bottom:14px;right:18px}
@media (min-width:1000px){html.hell .buehne-klein .buehne-inhalt .huelle > *{max-width:min(56%,640px)}}
@media (max-width:999px){
  html.hell .buehne-klein .buehne-schleier{background:linear-gradient(180deg,rgba(238,243,245,.9) 0%,rgba(238,243,245,.94) 100%) !important}
  html.hell .buehne-klein .buehne-inhalt{padding:36px 0 40px !important;min-height:0}
}
/* Kurzformular im Abschlussband (Ratgeber u. a.): sauberer weißer Kasten, weiße Felder, kein Farbverlauf (Florian: „Formular ordentlich bauen“) */
html.hell .cta-band:not(.jet-popup *){background:#FFFFFF !important;background-image:none !important;border:1px solid rgba(12,38,48,.1) !important;border-radius:20px !important;box-shadow:0 1px 2px rgba(12,38,48,.04),0 18px 40px -22px rgba(12,38,48,.2) !important;padding:clamp(24px,3.4vw,40px) !important;gap:clamp(24px,4vw,56px) !important;align-items:start !important}
html.hell .cta-band:not(.jet-popup *)::before,html.hell .cta-band:not(.jet-popup *)::after{display:none !important}
html.hell .cta-band .d3{font-size:clamp(22px,2.2vw,28px) !important}
html.hell .cta-band .klein{color:rgba(11,30,37,.74) !important;font-size:15.5px !important;line-height:1.6 !important}
html.hell .kurzform-rahmen{background:#F6F8F9 !important;border:1px solid rgba(12,38,48,.08) !important;border-radius:16px !important;padding:clamp(18px,2.4vw,26px) !important}
html.hell .kurzform :is(input:not([type=submit]),select,textarea),html.hell .wpcf7 :is(input:not([type=submit]),select,textarea):not(.jet-popup *){background:#FFFFFF !important;border:1px solid rgba(12,38,48,.2) !important;color:#0B1E25 !important;border-radius:10px !important}
html.hell .wpcf7 :is(input,select,textarea):focus:not(.jet-popup *){border-color:#00A0C8 !important;outline:2px solid rgba(0,160,200,.28);outline-offset:1px}
html.hell .wpcf7 label > span:first-child:not(.jet-popup *),html.hell .wpcf7 .feld > span:first-child:not(.jet-popup *){color:#0B1E25 !important;font-weight:600}
html.hell .wpcf7 input::placeholder,html.hell .wpcf7 textarea::placeholder{color:rgba(11,30,37,.45) !important}
html.hell .wpcf7 select option{background:#FFFFFF;color:#0B1E25}
html.hell body:not(.home) section:has(> .huelle > .cta-band){background:#EEF3F5;padding-top:clamp(44px,5vw,64px) !important;padding-bottom:clamp(44px,5vw,64px) !important}
html.hell .buehne-klein .d1{font-size:clamp(30px,3.4vw,50px) !important;text-wrap:balance}

/* Alle Unterseiten-Köpfe gleich hoch (Florian 10.11.26) */
@media (min-width:1000px){
  html.hell .buehne-klein{height:560px;min-height:560px !important}
  html.hell .buehne-klein .buehne-inhalt{min-height:0;height:100%;padding:28px 0 36px !important}
  html.hell .buehne-klein .lead{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
}
@media (min-width:1000px){
  html.hell .buehne-klein{height:600px;min-height:600px !important;align-items:flex-start}
  html.hell .buehne-klein .buehne-inhalt{align-items:flex-start;padding:44px 0 32px !important}
  html.hell .buehne-klein .d1{font-size:clamp(28px,3.1vw,44px) !important}
  html.hell .buehne-klein .lead{-webkit-line-clamp:3;font-size:16.5px !important;margin-top:16px !important}
  html.hell .buehne-klein .buehne-tasten{margin-top:20px !important}
  html.hell .buehne-klein .fakten{margin-top:18px !important;max-height:42px;overflow:hidden}
  html.hell .buehne-klein .brotkrumen{margin-bottom:14px}
}
/* Florian 10.11.26 abends: Köpfe wirken „immer noch so blured“ → „etwas dunkler, originaler“. Schleier kürzer und nur noch hinter dem Text,
   rechts steht das Foto unverändert klar; das Foto selbst eine Spur dunkler und kontrastreicher, damit es nicht milchig wirkt. */
html.hell .buehne-klein .buehne-bild picture,html.hell .buehne-klein .buehne-bild img,html.hell .buehne-klein .buehne-bild video{filter:brightness(.9) contrast(1.08) saturate(1.06) !important}
html.hell .buehne-klein .buehne-schleier{background:linear-gradient(90deg,rgba(238,243,245,.93) 0%,rgba(238,243,245,.88) 30%,rgba(238,243,245,.62) 44%,rgba(238,243,245,.2) 54%,rgba(238,243,245,0) 60%) !important}
@media (max-width:999px){
  html.hell .buehne-klein .buehne-schleier{background:linear-gradient(180deg,rgba(238,243,245,.84) 0%,rgba(238,243,245,.9) 100%) !important}
}

/* ===== Referenzen-Seite: Ergebnisband + Bildkarten hell ===== */
html.hell .ergebnis{background:#F3F8DF;border-color:rgba(138,163,24,.4);border-left-color:#A8C428;color:rgba(11,30,37,.8)}
html.hell .ergebnis b{color:#0B1E25}
html.hell .bildkarte{box-shadow:0 22px 40px -28px rgba(12,38,48,.4);border-color:rgba(12,38,48,.1)}

/* ===== Startseite: Bühnenvideo über den KOMPLETTEN Kopf (Florian 10.11.26 abends: „vielleicht den kompletten Hero in der Landingpage“).
   Wie bei den Unterseiten: Bild/Video füllt die ganze Breite, links ein heller Schleier hinter dem Text. Die schräge Form (Regeln weiter oben, 52 % Breite + clip-path)
   bleibt stehen – diesen Block löschen, dann ist sie zurück. Unter 1000 px unverändert (Bild oben, Text darunter). ===== */
@media (min-width:1000px){
  html.hell .buehne-karte .buehne-bild{left:0 !important;width:auto !important;clip-path:none !important;z-index:0 !important}
  html.hell .buehne-karte .buehne-bild video,html.hell .buehne-karte .buehne-bild img{object-position:50% 50% !important}
  html.hell .buehne-karte .buehne-bild img.fenster-schluss{object-position:70% 70% !important}
  html.hell .buehne-karte .buehne-schleier{display:block !important;position:absolute;inset:64px 0 var(--fuss-h) 0;z-index:1;pointer-events:none;
    background:linear-gradient(90deg,rgba(238,243,245,.95) 0%,rgba(238,243,245,.92) 34%,rgba(238,243,245,.7) 46%,rgba(238,243,245,.25) 56%,rgba(238,243,245,0) 64%) !important}
}
/* Florian 10.11.26: „das mit dem Weiß ist komisch und unten der Schatten fehlt“ → kein milchig-weißer Schleier mehr über dem Video:
   links ein dunkler Verlauf (Tinte), Text darauf weiß; der Schatten unter der Bühne (auf der Kundenleiste) kräftiger, weil er über dem vollen Bild sonst untergeht. */
@media (min-width:1000px){
  html.hell .buehne-karte .buehne-schleier{background:linear-gradient(90deg,rgba(11,30,37,.86) 0%,rgba(11,30,37,.8) 30%,rgba(11,30,37,.55) 46%,rgba(11,30,37,.18) 58%,rgba(11,30,37,0) 68%) !important}
  html.hell .buehne-karte .d1{color:#FFFFFF !important}
  html.hell .buehne-karte .d1 .zweite{color:#5CCBEA !important}
  html.hell .buehne-karte .lead,html.hell .buehne-karte .buehne-augenbraue{color:rgba(255,255,255,.92) !important}
  html.hell .buehne-karte .buehne-notiz,html.hell .buehne-karte .buehne-fakten{color:rgba(255,255,255,.82) !important}
  html.hell .buehne-karte .buehne-fakten a.buehne-preis{color:#8FDCF2 !important;border-bottom-color:rgba(143,220,242,.55) !important}
  html.hell .buehne-karte .buehne-fuss{background:linear-gradient(180deg,rgba(12,38,48,.22) 0,rgba(12,38,48,.09) 9px,rgba(12,38,48,.03) 20px,rgba(12,38,48,0) 34px),#FFFFFF !important}
}

/* Logo-Intro im Bühnenvideo (Florian 10.11.26: „Hero-Text solange ausblenden wie das Logo läuft“, wie bei lr-brandenburg): html.intro-laeuft setzt das kleine Skript
   vor der Bühne (nur ab 761 px, nicht bei „weniger Bewegung“, nur wenn das Logo in den letzten 24 h nicht gesehen wurde); ap.js nimmt es weg, sobald das Logo durch ist.
   Rückfall ohne Skript: nach 9 s kommt der Text per Animation von selbst. Unter 1000 px steht der Text unter dem Video und bleibt sichtbar. */
@media (min-width:1000px){
  html.hell .buehne-karte .buehne-inhalt .huelle,html.hell .buehne-karte .buehne-schleier{transition:opacity .9s ease}
  html.hell.intro-laeuft .buehne-karte .buehne-inhalt .huelle,html.hell.intro-laeuft .buehne-karte .buehne-schleier{opacity:0;pointer-events:none;animation:intro-rueckfall .9s ease 9s forwards}
}
@keyframes intro-rueckfall{to{opacity:1;pointer-events:auto}}

/* ===== Unterseiten-Köpfe ohne weiße Verläufe (Florian 10.11.26: „diese weißen Verläufe minimieren, das ist grauenvoll überall“):
   wie auf der Startseite – dunkler Verlauf (Tinte) von links, Schrift weiß, Foto ungefiltert. Ersetzt die hellen Schleier weiter oben. ===== */
html.hell .buehne-klein .buehne-bild picture,html.hell .buehne-klein .buehne-bild img,html.hell .buehne-klein .buehne-bild video{filter:none !important}
html.hell .buehne-klein .buehne-schleier{background:linear-gradient(90deg,rgba(11,30,37,.84) 0%,rgba(11,30,37,.78) 30%,rgba(11,30,37,.52) 46%,rgba(11,30,37,.16) 58%,rgba(11,30,37,0) 68%) !important}
html.hell .buehne-klein .d1{color:#FFFFFF !important}
html.hell .buehne-klein .d1 .zweite{color:#5CCBEA !important}
html.hell .buehne-klein .lead{color:rgba(255,255,255,.92) !important}
html.hell .buehne-klein .brotkrumen,html.hell .buehne-klein .brotkrumen a,html.hell .buehne-klein .brotkrumen span{color:rgba(255,255,255,.74) !important}
html.hell .buehne-klein .brotkrumen a:hover{color:#FFFFFF !important}
html.hell .buehne-klein .marke-zeile-buehne .marke,html.hell .buehne-klein .marke{color:rgba(255,255,255,.8) !important}
html.hell .buehne-klein .fakten .fakt,html.hell .buehne-klein .fakt{background:rgba(255,255,255,.1) !important;border:1px solid rgba(255,255,255,.26) !important;color:rgba(255,255,255,.86) !important}
html.hell .buehne-klein .fakt b{color:#FFFFFF !important}
html.hell .buehne-klein .knopf-glas,html.hell .buehne-klein .knopf-rahmen{background:rgba(255,255,255,.1) !important;border:1px solid rgba(255,255,255,.5) !important;color:#FFFFFF !important}
@media (max-width:999px){
  html.hell .buehne-klein .buehne-schleier{background:linear-gradient(180deg,rgba(11,30,37,.66) 0%,rgba(11,30,37,.76) 100%) !important}
}
/* Kopfbilder mit eigenen Bildschirminhalten (Webseiten, FloppyOps): Ausschnitt oben halten, damit die Bildschirme rechts ganz zu sehen sind */
html.hell .buehne-klein .buehne-bild img[src*="stock-monitor-kundenseiten"]{object-position:50% 0 !important}
html.hell .buehne-klein .buehne-bild img[src*="stock-monitor-floppyops"]{object-position:100% 0 !important}

/* ===== Anfrage-Fenster (JetPopup) hell (Florian 10.11.26: „Modal nicht ordentlich, auch noch alles dunkel“): helle Farbwerte auch im Fenster,
   weiße Fläche, helle Felder, grüner Knopf, schmaler Rollbalken, kompakter – passt bei 800 px Höhe ohne Rollen. ===== */
html.hell .jet-popup{--dc-bg:#F5F8F9; --dc-bg-hero:#070F13; --dc-bg-fuss:#EDF2F4; --dc-karte:#FFFFFF; --dc-karte-hell:#FFFFFF; --dc-karte-verlauf:linear-gradient(135deg,#FFFFFF 0%,#FFFFFF 60%); --dc-band-verlauf:linear-gradient(135deg,#E9F5F9 0%,#FFFFFF 60%); --dc-flaeche:rgba(12,38,48,.045); --dc-flaeche-2:rgba(12,38,48,.065); --dc-text:#1B323B; --dc-text-voll:#0B1E25; --dc-text-86:rgba(11,30,37,.88); --dc-text-78:rgba(11,30,37,.80); --dc-text-70:rgba(11,30,37,.74); --dc-text-62:rgba(11,30,37,.74); --dc-text-55:rgba(11,30,37,.70); --dc-text-45:rgba(11,30,37,.68); --dc-gruen:#0098BE; --dc-cyan:#007A9C; --dc-orange:#B45F00; --dc-bernstein:#A85800; --orange:#B45F00; --teal:#007A9C; --dc-gruen-16:rgba(120,170,20,.16); --dc-cyan-16:rgba(10,126,160,.12); --dc-kante-08:rgba(12,38,48,.09); --dc-kante-09:rgba(12,38,48,.10); --dc-kante-12:rgba(12,38,48,.13); --dc-kante-14:rgba(12,38,48,.15); --dc-kante-18:rgba(12,38,48,.19); --dc-kante-22:rgba(12,38,48,.24); --dc-kante-35:rgba(12,38,48,.36); --bg:#F5F8F9; --bg-tief:#EDF2F4; --flaeche:rgba(12,38,48,.045); --flaeche-2:rgba(12,38,48,.07); --kante:rgba(12,38,48,.11); --kante-hell:rgba(12,38,48,.2); --text:#0B1E25; --text-2:#48606A; --text-3:#64798A; color-scheme:light;}
html.hell .jet-popup .jet-popup__overlay{background:rgba(11,30,37,.5) !important;backdrop-filter:blur(3px)}
html.hell .jet-popup .jet-popup__container-inner{background:#FFFFFF !important;border:1px solid rgba(12,38,48,.1) !important;box-shadow:0 30px 80px -30px rgba(12,38,48,.55) !important;color:#0B1E25 !important;padding:26px 28px 22px !important;scrollbar-width:thin;scrollbar-color:rgba(12,38,48,.25) transparent}
html.hell .jet-popup .jet-popup__close-button{color:rgba(11,30,37,.6) !important}
html.hell .jet-popup .jet-popup__close-button:hover{color:#0B1E25 !important}
html.hell .jet-popup :is(h2,h3,.d2,.d3){color:#0B1E25 !important}
html.hell .jet-popup :is(p,.lead,.klein,.marke,label,label span){color:rgba(11,30,37,.78) !important}
html.hell .jet-popup .wpcf7 label > span:first-child,html.hell .jet-popup .wpcf7 .feld > span:first-child{color:#0B1E25 !important;font-weight:600}
html.hell .jet-popup :is(input:not([type=submit]),select,textarea){background:#FFFFFF !important;border:1px solid rgba(12,38,48,.22) !important;color:#0B1E25 !important;border-radius:10px !important}
html.hell .jet-popup :is(input,select,textarea):focus{border-color:#00A0C8 !important;outline:2px solid rgba(0,160,200,.28);outline-offset:1px}
html.hell .jet-popup :is(input,textarea)::placeholder{color:rgba(11,30,37,.45) !important}
html.hell .jet-popup select option{background:#FFFFFF;color:#0B1E25}
html.hell .jet-popup .wpcf7 input[type=submit]{background:#A8C428 !important;border-color:#A8C428 !important;color:#0B1E25 !important}
html.hell .jet-popup .wpcf7 input[type=submit]:hover{background:#97B21C !important}
html.hell .jet-popup a:not(.knopf){color:#007A9C !important}
html.hell .jet-popup textarea{min-height:92px !important;height:92px}
html.hell .jet-popup .wpcf7 :is(input:not([type=submit]),select){height:46px !important;min-height:0 !important}
html.hell .jet-popup .wpcf7 select{padding-top:0 !important;padding-bottom:0 !important;line-height:44px !important}
html.hell .jet-popup .jet-popup__container-inner{padding-bottom:18px !important}
html.hell .jet-popup .wpcf7 p{margin-bottom:10px}
/* Auswahlfelder überall hell (Florian 10.11.26: „Formulare noch nicht ganz alles in hell, Dropdown-Menü z. B.“): aufgeklappte Liste weiß mit dunkler Schrift, dunkler Pfeil */
html.hell :is(.wpcf7,.feld,.kurzform,.jet-popup) select{color-scheme:light;background-color:#FFFFFF !important;color:#0B1E25 !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%230B1E25' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 6l4.5 4.5L12.5 6'/%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-position:right 14px center !important;background-size:14px !important;padding-right:38px !important}
html.hell :is(.wpcf7,.feld,.kurzform,.jet-popup) select :is(option,optgroup){background:#FFFFFF !important;color:#0B1E25 !important}
/* Anfrage-Fenster kompakter: passt ab ~740 px Fensterhöhe ohne Rollbalken (Florian 10.11.26: „scrollt, wär aber genug Platz“) */
html.hell .jet-popup .jet-popup__container-inner{max-height:calc(100vh - 16px) !important;padding:20px 26px 14px !important}
html.hell .jet-popup .wpcf7 form{gap:8px !important;row-gap:8px !important}
html.hell .jet-popup .wpcf7 .feldpaar{margin-bottom:0 !important;gap:14px !important}
html.hell .jet-popup .wpcf7 .feld > span:first-child{margin-bottom:4px !important;font-size:13.5px !important}
html.hell.hell .jet-popup .wpcf7 :is(input:not([type=submit]),select){height:40px !important;font-size:15px !important}
html.hell.hell .jet-popup .wpcf7 select:not([multiple]){line-height:38px !important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%230B1E25' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 6l4.5 4.5L12.5 6'/%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-position:right 14px center !important;background-size:14px !important;appearance:none;-webkit-appearance:none}
html.hell.hell .jet-popup textarea{min-height:66px !important;height:66px !important;font-size:15px !important}
html.hell .jet-popup .wpcf7 input[type=submit]{height:46px !important;min-height:0 !important;margin-top:4px !important}
html.hell .jet-popup .form-hinweis{font-size:12.5px !important;line-height:1.45 !important;margin:2px 0 0 !important}
html.hell .jet-popup :is(h2,h3,.d2,.d3){margin-top:4px !important;font-size:22px !important}
html.hell .jet-popup .jet-popup__container-content p{margin-top:6px !important;margin-bottom:8px !important;font-size:14.5px !important;line-height:1.5 !important}
/* Großansicht (Galerie) auch in der hellen Fassung mit dunklem Grund – Bild und weiße Beschriftung brauchen den Kontrast */
html.hell .gross{background:rgba(7,15,19,.92) !important}
html.hell .gross-figur figcaption,html.hell .gross-text{color:#FFFFFF !important}
html.hell .gross-zahl{color:rgba(255,255,255,.65) !important}
html.hell .gross-besch{color:rgba(255,255,255,.78) !important}
html.hell .gross button{background:rgba(255,255,255,.1) !important;border:1px solid rgba(255,255,255,.28) !important;color:#FFFFFF !important}
html.hell .gross button:hover{background:rgba(255,255,255,.22) !important}

/* ===== Referenzen: Umschalter „IT-Projekte | Webseiten“ deutlich sichtbar (Florian 10.11.26: „der Knopf zum Umschalten zu unscheinbar“):
   statt der kleinen grauen Pille zwei große Flächen nebeneinander mit Unterzeile, die aktive grün gefüllt; Hinweiszeile darüber. Nur Seite 90. ===== */
html.hell body.page-id-90 .reiter-leiste{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%;max-width:660px;padding:0 !important;margin-top:0;background:none !important;border:0 !important;border-radius:0;position:relative;padding-top:34px !important}
html.hell body.page-id-90 .reiter-leiste::before{content:"Was möchten Sie sehen?";position:absolute;top:0;left:2px;font:700 13px/1.2 var(--dc-ff);letter-spacing:.12em;text-transform:uppercase;color:rgba(11,30,37,.62)}
html.hell body.page-id-90 .reiter-leiste button{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;padding:18px 22px !important;min-height:84px;border-radius:16px !important;background:#FFFFFF !important;border:2px solid rgba(12,38,48,.14) !important;color:#0B1E25 !important;font:700 19px/1.2 var(--dc-ff) !important;box-shadow:0 1px 2px rgba(12,38,48,.05),0 10px 24px -16px rgba(12,38,48,.25);cursor:pointer;transition:border-color .15s,box-shadow .15s,background .15s}
html.hell body.page-id-90 .reiter-leiste button::after{font:500 14px/1.4 var(--dc-ff);color:rgba(11,30,37,.66)}
html.hell body.page-id-90 .reiter-leiste button[data-reiter="it"]::after{content:"Server, Netzwerk und Telefonie – mit Kostenvergleich"}
html.hell body.page-id-90 .reiter-leiste button[data-reiter="web"]::after{content:"Kundenseiten, die wir gebaut haben und betreuen"}
html.hell body.page-id-90 .reiter-leiste button:hover{border-color:#00A0C8 !important}
html.hell body.page-id-90 .reiter-leiste button[aria-selected="true"]{background:#A8C428 !important;border-color:#8FA81C !important;color:#0B1E25 !important;box-shadow:0 1px 2px rgba(12,38,48,.06),0 14px 28px -14px rgba(120,146,20,.55)}
html.hell body.page-id-90 .reiter-leiste button[aria-selected="true"]::after{color:rgba(11,30,37,.82)}
html.hell body.page-id-90 .reiter-leiste button:focus-visible{outline:3px solid #00A0C8;outline-offset:3px}
@media (max-width:560px){
  html.hell body.page-id-90 .reiter-leiste{grid-template-columns:1fr}
  html.hell body.page-id-90 .reiter-leiste button{min-height:0;padding:14px 18px !important;font-size:17px !important}
}

/* ---- Anfrage-Fenster aufgeräumt (Florian 10.11.26: „Modals aufgeräumter, moderner“): Kopf, ruhiges Feldraster, Fußleiste mit Telefon ---- */
html.hell .jet-popup .jet-popup__container{width:min(580px,calc(100vw - 24px)) !important}
html.hell .jet-popup .jet-popup__container-inner{padding:0 !important;border:0 !important;border-radius:20px !important;overflow:hidden auto !important;max-height:calc(100vh - 24px) !important;box-shadow:0 1px 2px rgba(12,38,48,.08),0 40px 90px -30px rgba(12,38,48,.6) !important}
html.hell .jet-popup .jet-popup__close-button{top:16px !important;right:16px !important;width:36px !important;height:36px !important;border-radius:999px !important;background:#F1F5F6 !important;color:#0B1E25 !important;display:grid !important;place-items:center;font-size:14px !important;transition:background .15s}
html.hell .jet-popup .jet-popup__close-button:hover{background:#E3EAED !important}
html.hell .jet-popup .jet-popup__close-button:focus-visible{outline:3px solid #00A0C8;outline-offset:2px}
html.hell .jet-popup .popup-kopf{padding:30px 32px 6px;padding-right:64px}
html.hell .jet-popup .popup-kopf .popup-chip{display:inline-block;margin:0 0 12px;padding:5px 11px;border-radius:999px;background:#A8C428;color:#0B1E25 !important;font-size:12.5px !important;font-weight:700;letter-spacing:.01em;line-height:1.3 !important}
html.hell .jet-popup .popup-kopf h2{margin:0 0 6px !important;font-size:26px !important;line-height:1.15 !important;font-weight:750;letter-spacing:-.01em}
html.hell .jet-popup .popup-kopf .popup-erst-lead{margin:0 !important;font-size:15px !important;line-height:1.5 !important;color:rgba(11,30,37,.7) !important}
html.hell .jet-popup .popup-erst .kontakt-form{padding:18px 32px 22px !important}
html.hell .jet-popup .popup-erst .wpcf7 form{display:grid;gap:14px;margin:0}
html.hell .jet-popup .popup-erst .wpcf7 form > *{margin:0 !important}
html.hell .jet-popup .popup-erst .wpcf7 .feldpaar{gap:14px !important;margin:0 !important}
html.hell .jet-popup .popup-erst .wpcf7 .feld > span:first-child{margin-bottom:6px !important;font-size:13px !important;font-weight:650 !important;color:rgba(11,30,37,.72) !important}
html.hell .jet-popup .popup-erst :is(input:not([type=submit]),select,textarea){background:#F5F8F9 !important;border:1px solid rgba(12,38,48,.12) !important;border-radius:12px !important;font-size:15.5px !important;padding-left:14px !important;padding-right:14px !important;box-shadow:none !important;transition:border-color .15s,background .15s,box-shadow .15s}
html.hell .jet-popup .popup-erst .wpcf7 :is(input:not([type=submit]),select){height:48px !important}
html.hell .jet-popup .popup-erst .wpcf7 select{line-height:46px !important}
html.hell .jet-popup .popup-erst textarea{height:96px !important;min-height:96px !important;padding-top:12px !important;resize:vertical}
html.hell .jet-popup .popup-erst :is(input:not([type=submit]),select,textarea):hover{border-color:rgba(12,38,48,.28) !important}
html.hell .jet-popup .popup-erst :is(input:not([type=submit]),select,textarea):focus{background:#FFFFFF !important;border-color:#00A0C8 !important;outline:0 !important;box-shadow:0 0 0 4px rgba(0,160,200,.16) !important}
html.hell .jet-popup .popup-erst .wpcf7 input[type=submit]{width:100% !important;height:52px !important;margin-top:4px !important;border-radius:12px !important;font-family:inherit !important;font-size:16px !important;font-weight:750 !important;letter-spacing:0 !important;cursor:pointer}
html.hell .jet-popup .popup-erst .wpcf7 .wpcf7-spinner{position:absolute;right:44px;bottom:118px;margin:0 !important}
html.hell .jet-popup .popup-erst .wpcf7 .form-hinweis{margin:-4px 0 0 !important;font-size:12.5px !important;line-height:1.45 !important;color:rgba(11,30,37,.6) !important;text-align:center}
html.hell .jet-popup .popup-erst .wpcf7 .wpcf7-response-output:empty{display:none !important}
html.hell .jet-popup .popup-erst .wpcf7 .wpcf7-response-output{border-radius:12px !important;padding:12px 14px !important;font-size:14.5px !important}
html.hell .jet-popup .popup-erst .wpcf7 .wpcf7-not-valid-tip{font-size:12.5px !important;margin-top:4px}
html.hell .jet-popup .popup-fuss{display:flex;align-items:center;justify-content:space-between;gap:10px 18px;flex-wrap:wrap;padding:15px 32px;background:#F5F8F9;border-top:1px solid rgba(12,38,48,.08)}
html.hell .jet-popup .popup-fuss span{font-size:14px !important;color:rgba(11,30,37,.7) !important}
html.hell .jet-popup .popup-fuss a{display:inline-flex;align-items:center;gap:8px;font-size:16px !important;font-weight:750;color:#0B1E25 !important;text-decoration:none;white-space:nowrap}
html.hell .jet-popup .popup-fuss a:hover{color:#007A9C !important}
html.hell .jet-popup .popup-fuss a svg{width:17px;height:17px;flex:none}
html.hell .jet-popup .popup-fuss small{flex-basis:100%;font-size:12.5px !important;color:rgba(11,30,37,.58) !important;margin-top:-6px}
@media (max-width:600px){
  html.hell .jet-popup .jet-popup__container{width:calc(100vw - 16px) !important}
  html.hell .jet-popup .jet-popup__container-inner{max-height:calc(100dvh - 16px) !important;border-radius:18px !important}
  html.hell .jet-popup .popup-kopf{padding:22px 20px 2px;padding-right:58px}
  html.hell .jet-popup .popup-kopf h2{font-size:22px !important}
  html.hell .jet-popup .popup-kopf .popup-erst-lead{font-size:14px !important}
  html.hell .jet-popup .popup-erst .kontakt-form{padding:14px 20px 18px !important}
  html.hell .jet-popup .popup-erst .wpcf7 form{gap:11px}
  html.hell .jet-popup .popup-erst .wpcf7 .feldpaar{grid-template-columns:1fr 1fr !important;gap:10px !important}
  html.hell .jet-popup .popup-erst .wpcf7 .feldpaar:first-of-type{grid-template-columns:1fr !important;gap:11px !important}
  html.hell .jet-popup .popup-erst textarea{height:78px !important;min-height:78px !important}
  html.hell .jet-popup .popup-fuss{padding:13px 20px}
}
/* Anfrage-Fenster: auf flachen Bildschirmen (Laptop) so dicht, dass es ohne Scrollen passt (Florian 10.11.26: „besser, scrollt aber“) */
@media (min-width:601px) and (max-height:900px){
  html.hell .jet-popup .jet-popup__container{width:min(640px,calc(100vw - 24px)) !important}
  html.hell .jet-popup .popup-kopf{padding:22px 28px 2px;padding-right:64px}
  html.hell .jet-popup .popup-kopf .popup-chip{margin-bottom:8px;padding:4px 10px;font-size:12px !important}
  html.hell .jet-popup .popup-kopf h2{font-size:23px !important;margin-bottom:4px !important}
  html.hell .jet-popup .popup-kopf .popup-erst-lead{font-size:14px !important}
  html.hell .jet-popup .popup-erst .kontakt-form{padding:12px 28px 14px !important}
  html.hell .jet-popup .popup-erst .wpcf7 form{gap:10px}
  html.hell .jet-popup .popup-erst .wpcf7 .feldpaar{gap:12px !important}
  html.hell .jet-popup .popup-erst .wpcf7 .feld > span:first-child{margin-bottom:4px !important;font-size:12.5px !important}
  html.hell .jet-popup .popup-erst .wpcf7 :is(input:not([type=submit]),select){height:42px !important}
  html.hell .jet-popup .popup-erst .wpcf7 select{line-height:40px !important}
  html.hell .jet-popup .popup-erst textarea{height:68px !important;min-height:68px !important;padding-top:9px !important}
  html.hell .jet-popup .popup-erst .wpcf7 input[type=submit]{height:46px !important;margin-top:2px !important}
  html.hell .jet-popup .popup-erst .wpcf7 .form-hinweis{font-size:12px !important;margin-top:-2px !important}
  html.hell .jet-popup .popup-fuss{padding:11px 28px;flex-wrap:nowrap}
  html.hell .jet-popup .popup-fuss small{flex-basis:auto;margin:0;order:2}
  html.hell .jet-popup .popup-fuss a{order:3;margin-left:auto}
  html.hell .jet-popup .jet-popup__close-button{top:12px !important;right:12px !important}
}
@media (min-width:601px) and (max-height:700px){
  html.hell .jet-popup .popup-kopf .popup-erst-lead{display:none}
  html.hell .jet-popup .popup-erst textarea{height:54px !important;min-height:54px !important}
}
/* Glas-Knopf im dunklen Kopfbild: Mouseover war weiß auf fast weiß (Florian 10.11.26: „Mouseover nicht zu lesen“) */
html.hell .buehne-klein :is(.knopf-glas,.knopf-rahmen):hover{background:#FFFFFF !important;border-color:#FFFFFF !important;color:#0B1E25 !important}
/* Kopfleiste über Videos/Bildern (.fenster-kopf, z. B. „Serverraum“, „Büro“ auf Über uns): Schrift war dunkel auf dunkler Leiste (Florian 10.11.26: „mach das zum Lesen“) */
html.hell .fenster-kopf{background:#0B1E25 !important;color:rgba(255,255,255,.92) !important;border-bottom:0 !important}
html.hell .fenster-kopf *:not(.punkt){color:inherit !important}
/* Impressum: statt vier ungleicher Karten EIN Kasten mit vier Zeilen (Begriff links, Angaben rechts) – Florian 10.11.26: „die Cards da komisch, mach das ordentlich“ */
html.hell .recht-karten{display:block !important;margin:0 0 44px !important;background:#FFFFFF;border:1px solid rgba(12,38,48,.1);border-radius:16px;box-shadow:0 1px 2px rgba(12,38,48,.04),0 10px 26px -16px rgba(12,38,48,.16);overflow:hidden}
html.hell .recht-karte{display:grid !important;grid-template-columns:210px minmax(0,1fr);column-gap:28px;row-gap:0;padding:20px 26px !important;background:none !important;border:0 !important;border-radius:0 !important;box-shadow:none !important}
html.hell .recht-karte + .recht-karte{border-top:1px solid rgba(12,38,48,.08) !important}
html.hell .prosa .recht-karte h2{grid-column:1;grid-row:1 / span 12;align-self:start;margin:3px 0 0 !important;font-size:13.5px !important;letter-spacing:.02em !important;text-transform:none !important;font-weight:700 !important;color:#0B1E25 !important}
html.hell .prosa .recht-karte > :not(h2){grid-column:2;margin:0 !important;font-size:15.5px !important;line-height:1.65 !important;color:rgba(11,30,37,.82) !important}
html.hell .prosa .recht-karte a{color:#007A9C !important;text-decoration-thickness:1px;text-underline-offset:3px}
@media (max-width:640px){
  html.hell .recht-karte{grid-template-columns:1fr;padding:16px 18px !important;row-gap:4px}
  html.hell .prosa .recht-karte h2{grid-row:auto;margin:0 0 4px !important}
  html.hell .prosa .recht-karte > :not(h2){grid-column:1}
}

/* ---- Weihnachts-Gewinnspiel (Seite /gewinnspiel/, Hinweis unten rechts) – Entwurf 10.11.26 ---- */
html.hell .gs-schritte{list-style:none;counter-reset:gs;margin:26px 0 0;padding:0;display:grid;gap:14px}
html.hell .gs-schritte li{counter-increment:gs;display:grid;grid-template-columns:34px 1fr;column-gap:14px;align-items:start}
html.hell .gs-schritte li::before{content:counter(gs);grid-row:1 / span 2;width:34px;height:34px;border-radius:999px;background:#0B1E25;color:#FFFFFF;display:grid;place-items:center;font-weight:750;font-size:15px}
html.hell .gs-schritte b{color:#0B1E25;font-size:16px;line-height:1.3}
html.hell .gs-schritte span{color:rgba(11,30,37,.74);font-size:14.5px;line-height:1.5}
html.hell .gs-block .wpcf7 form{display:grid;gap:14px}
html.hell .gs-block .wpcf7 form > *{margin:0 !important}
html.hell .gs-block .wpcf7 input[type=submit]{width:100%;font-family:inherit !important;font-weight:750 !important;border-radius:12px !important;height:52px}
html.hell .gs-zusage{font-size:14px;line-height:1.5;color:rgba(11,30,37,.82)}
html.hell .gs-zusage .wpcf7-list-item{margin:0;display:block}
html.hell .gs-zusage label{display:grid !important;grid-template-columns:22px 1fr;gap:10px;align-items:start;cursor:pointer}
html.hell .gs-zusage input[type=checkbox]{width:20px !important;height:20px !important;min-height:0 !important;margin:1px 0 0 !important;padding:0 !important;accent-color:#0B1E25;border-radius:5px !important}
html.hell .gs-zusage a{color:#007A9C}
html.hell .gs-hinweis p:not(.kontakt-form-titel){margin:8px 0 0;color:rgba(11,30,37,.8);font-size:15.5px;line-height:1.6}
html.hell .gs-hinweis a{color:#007A9C}
html.hell .gs-bedingungen{max-width:820px}
html.hell .gs-bedingungen ol{padding-left:22px;display:grid;gap:10px}
html.hell .gs-bedingungen li{font-size:15px;line-height:1.65;color:rgba(11,30,37,.8)}
html.hell .gs-bedingungen li b{color:#0B1E25}
html.hell .gs-pille{position:fixed;right:18px;bottom:18px;z-index:900;display:flex;align-items:stretch;max-width:min(340px,calc(100vw - 36px));background:#0B1E25;border-radius:14px;box-shadow:0 18px 40px -16px rgba(11,30,37,.55);overflow:hidden}
html.hell .gs-pille[hidden]{display:none}
html.hell .gs-pille a{display:grid;gap:2px;padding:12px 6px 12px 16px;text-decoration:none;border-left:4px solid #A8C428}
html.hell .gs-pille b{color:#FFFFFF;font-size:15px;line-height:1.3}
html.hell .gs-pille span{color:rgba(255,255,255,.76);font-size:13px;line-height:1.35}
html.hell .gs-pille button{appearance:none;border:0;background:none;color:rgba(255,255,255,.7);font-size:20px;line-height:1;padding:0 14px;cursor:pointer}
html.hell .gs-pille button:hover{color:#FFFFFF}
html.hell .gs-pille a:focus-visible,html.hell .gs-pille button:focus-visible{outline:3px solid #00A0C8;outline-offset:-3px}
/* Winter: liegt Schnee an der Unterkante des Kopfbilds, kein Schatten darunter (Florian 10.11.26: „wenn Schnee, Schatten weg“) */
html.hell.winter-schnee .buehne-karte .buehne-fuss{background:#FFFFFF !important}
html.hell.winter-schnee .buehne-klein{box-shadow:none !important}

/* ---- Über uns: vier Grundsätze als ruhiges 2×2-Raster in einer Fläche statt Haken-Liste 3+1 (Florian 10.11.26: „die 4 Felder etwas unruhig“; Entwurf aus der Komplettprüfung) ---- */
html.hell .grundsatz-raster{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;background:#FFFFFF;border:1px solid rgba(12,38,48,.10);border-radius:22px;overflow:hidden}
html.hell .grundsatz-raster li{display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:18px;row-gap:6px;align-items:start;align-content:start;margin:0;padding:clamp(24px,2.6vw,34px) clamp(22px,3vw,40px)}
html.hell .grundsatz-raster li:nth-child(even){border-left:1px solid rgba(12,38,48,.10)}
html.hell .grundsatz-raster li:nth-child(n+3){border-top:1px solid rgba(12,38,48,.10)}
html.hell .grundsatz-raster svg{grid-row:span 2;display:block;width:28px;height:28px;margin-top:1px;fill:none;stroke:#00A0C8;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
html.hell .grundsatz-raster b{display:block;font-size:18px;line-height:1.3;font-weight:700;letter-spacing:-.01em;color:#0B1E25}
html.hell .grundsatz-raster span{display:block;font-size:15.5px;line-height:1.55;color:rgba(11,30,37,.74)}
@media (max-width:760px){
html.hell .grundsatz-raster{grid-template-columns:1fr;grid-auto-rows:auto;border-radius:18px}
html.hell .grundsatz-raster li{column-gap:14px;padding:22px 20px}
html.hell .grundsatz-raster li:nth-child(even){border-left:0}
html.hell .grundsatz-raster li:nth-child(n+2){border-top:1px solid rgba(12,38,48,.10)}
html.hell .grundsatz-raster b{font-size:17px}
html.hell .grundsatz-raster span{font-size:15px}
}

/* ---- Runde 2 nach der Komplettprüfung (10.11.26) ---- */
/* Tabellen: Zahlenzellen erbten die Kachel-Optik von .zahl (graue „Pillen“) → flach wie die übrigen Zellen */
html.hell .tabelle td.zahl,html.hell .tabelle th.zahl{background:none !important;box-shadow:none !important;border-radius:0 !important;padding:14px 18px !important;border:0 !important;border-bottom:1px solid rgba(12,38,48,.1) !important}
html.hell .tabelle tbody tr:last-child td.zahl{border-bottom:0 !important}
html.hell .tabelle .summe td,html.hell .tabelle .summe td.zahl{background:rgba(0,160,200,.08) !important}
html.hell .tabelle caption{padding:12px 18px;text-align:left;font-size:13px;color:rgba(11,30,37,.66);caption-side:top}
/* Tabellen am Handy: nicht mehr breiter als der Bildschirm (die wichtige Spalte lag außerhalb) */
@media (max-width:640px){
  html.hell .tabelle{min-width:0 !important;width:100% !important;font-size:13.5px !important;table-layout:auto}
  html.hell .tabelle th,html.hell .tabelle td,html.hell .tabelle td.zahl,html.hell .tabelle th.zahl{padding:10px 8px !important;white-space:normal !important;overflow-wrap:break-word;hyphens:auto;vertical-align:top}
  html.hell .tabelle thead th{font-size:11px !important;letter-spacing:.02em !important}
  html.hell .tabelle th[scope=row],html.hell .tabelle td:first-child{padding-left:12px !important}
  html.hell .tabelle td:last-child,html.hell .tabelle th:last-child{padding-right:12px !important}
}
/* Kopf der Unterseiten: feste Höhe schnitt lange Köpfe ab (Fakten-Plaketten auf /infrastruktur/) → Mindesthöhe */
@media (min-width:900px){html.hell .buehne-klein{height:auto !important}}
/* Schritt-Karten weiß wie alle Karten, Nummer in Blau */
html.hell .schritt{background:#FFFFFF !important;border:1px solid rgba(12,38,48,.1) !important;box-shadow:0 1px 2px rgba(12,38,48,.04),0 8px 24px -12px rgba(12,38,48,.12) !important}
html.hell .schritt::before{background:#00A0C8 !important;color:#FFFFFF !important;border:0 !important;box-shadow:none !important}
/* Zitat-Kästen und Preisrechner flach statt milchigem Verlauf */
html.hell .zitat{background:#FFFFFF !important;background-image:none !important;border:1px solid rgba(12,38,48,.1) !important;border-left:3px solid #00A0C8 !important;box-shadow:none !important}
html.hell .rechner{background:#FFFFFF !important;background-image:none !important;border:1px solid rgba(12,38,48,.1) !important}
/* Absende-Knopf in der Seitenschrift (war Arial) */
html.hell .wpcf7 input[type=submit]{font-family:inherit !important}
/* Auswahlfeld „Worum geht es?“: Text nicht abschneiden */
html.hell .wpcf7 select[name=thema]{padding-left:12px !important;padding-right:30px !important;text-overflow:ellipsis}
html.hell .tabelle-rahmen{background:#FFFFFF !important}
html.hell .tabelle tbody td,html.hell .tabelle tbody th{background-color:transparent}
@media (max-width:640px){
  html.hell .tabelle td.zahl,html.hell .tabelle th.zahl{white-space:nowrap !important;overflow-wrap:normal;hyphens:manual;font-size:12.5px !important;padding-left:5px !important;padding-right:5px !important}
  html.hell .tabelle thead th.zahl{white-space:normal !important;font-size:10.5px !important}
  html.hell .tabelle td:last-child.zahl,html.hell .tabelle th:last-child.zahl{padding-right:10px !important}
}

/* ---- Runde 2, Teil 2 (10.11.26 nachts) ---- */
/* Haken-Liste als ruhige Fläche mit zwei Spalten, nur wo .karten gesetzt ist (/kostenvergleich/, /software/); einfache Listen bleiben Listen */
html.hell .merkmale.karten{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 !important;background:#FFFFFF;border:1px solid rgba(12,38,48,.1);border-radius:18px;overflow:hidden;padding:0;margin-left:0;list-style:none}
html.hell .merkmale.karten > li{margin:0 !important;padding:22px 26px !important;border:0}
html.hell .merkmale.karten > li:nth-child(even){border-left:1px solid rgba(12,38,48,.1)}
html.hell .merkmale.karten > li:nth-child(n+3){border-top:1px solid rgba(12,38,48,.1)}
html.hell .merkmale.karten b{font-size:16.5px}
html.hell .merkmale.karten em{font-size:14.5px;line-height:1.55;color:rgba(11,30,37,.74)}
@media (max-width:700px){
  html.hell .merkmale.karten{grid-template-columns:1fr}
  html.hell .merkmale.karten > li:nth-child(even){border-left:0}
  html.hell .merkmale.karten > li:nth-child(n+2){border-top:1px solid rgba(12,38,48,.1)}
}
/* Suche: Feld und Knopf bleiben im Rand; Feld nicht grau wie gesperrt */
html.hell .such-form{display:flex;gap:10px;max-width:100%}
html.hell .such-form input[type=search]{flex:1 1 auto;min-width:0;box-sizing:border-box;background:#FFFFFF !important;border:1px solid rgba(12,38,48,.22) !important;color:#0B1E25 !important}
html.hell .such-form .knopf{flex:none;box-sizing:border-box}
/* Ratgeber am Handy: Inhaltsverzeichnis vor dem Text statt ganz am Ende */
@media (max-width:999px){html.hell .artikel-neben{order:-1}}
/* Handy-Menü: Knopf als ordentliche Tippfläche; „Kontakt“ nur im Handy-Menü */
html.hell .jet-nav__mobile-trigger{min-width:44px;min-height:44px}
@media (min-width:1025px){html.hell .nur-handy-menue{display:none !important}}

/* ---- Über uns: Zitat neben der Abschnitts-Überschrift statt als verlorener Kasten darunter (Florian 10.11.26: „sieht so verloren aus“) ---- */
html.hell .zitat-kopf{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,4vw,56px);align-items:center;margin-bottom:34px}
html.hell .zitat-kopf .kopf{margin:0 !important}
html.hell .zitat-kopf .zitat{margin:0 !important;position:relative;padding:30px 32px 26px 78px !important;border-radius:20px !important;border:1px solid rgba(12,38,48,.1) !important;border-left:1px solid rgba(12,38,48,.1) !important;box-shadow:0 1px 2px rgba(12,38,48,.04),0 14px 34px -20px rgba(12,38,48,.22) !important}
html.hell .zitat-kopf .zitat::before{content:"“";position:absolute;left:26px;top:14px;font-size:76px;line-height:1;font-weight:800;color:#00A0C8;font-family:Georgia,serif}
html.hell .zitat-kopf .zitat p{font-size:clamp(18px,1.55vw,21px) !important;line-height:1.5 !important;font-weight:600;color:#0B1E25 !important;letter-spacing:-.01em}
html.hell .zitat-kopf .zitat footer{display:grid;grid-template-columns:48px 1fr;column-gap:14px;align-items:center;margin-top:20px !important;font-size:14px !important;color:rgba(11,30,37,.66) !important;line-height:1.35}
html.hell .zitat-kopf .zitat footer img{grid-row:1 / span 2;width:48px;height:48px;border-radius:999px;object-fit:cover;display:block}
html.hell .zitat-kopf .zitat footer b{font-size:15.5px !important;color:#0B1E25 !important;font-weight:750 !important;align-self:end}
html.hell .zitat-kopf .zitat footer span{align-self:start}
@media (max-width:900px){
  html.hell .zitat-kopf{grid-template-columns:1fr;gap:22px}
  html.hell .zitat-kopf .zitat{padding:26px 22px 22px 22px !important}
  html.hell .zitat-kopf .zitat::before{position:static;display:block;height:38px;font-size:64px}
}

/* ---- /webseiten/: mehr vom Kopfbild zeigen (Florian 10.11.26: „hier mehr Bild im Header“) – das Foto füllt nur noch die rechten zwei Drittel
   und ist dadurch weniger stark beschnitten (Laptop UND Bildschirm sichtbar); links steht der Text auf ruhiger dunkler Fläche ---- */
@media (min-width:1000px){
  html.hell .buehne-klein:has(.buehne-bild img[src*="stock-monitor-kundenseiten"]){background:#0B1E25 !important}
  html.hell .buehne-klein:has(.buehne-bild img[src*="stock-monitor-kundenseiten"]) .buehne-bild{inset:64px 0 0 34% !important}
  html.hell .buehne-klein .buehne-bild img[src*="stock-monitor-kundenseiten"]{object-position:50% 12% !important}
  html.hell .buehne-klein:has(.buehne-bild img[src*="stock-monitor-kundenseiten"]) .buehne-schleier{background:linear-gradient(90deg,#0B1E25 0%,#0B1E25 34%,rgba(11,30,37,.72) 42%,rgba(11,30,37,.18) 52%,rgba(11,30,37,0) 60%) !important}
}

/* FAQ als ruhige Kartenliste (Florian 11.11.26: „macht mal ordentliches FAQ draus“; das Plus ganz links kam nicht an):
   Liste höchstens 860 px breit, jede Frage eine weiße Karte, das Plus sitzt rechts IN der Karte und damit deutlich näher an der Frage als vorher am Seitenrand. */
html.hell .frage{max-width:860px;margin:0 0 10px;background:#FFFFFF;border:1px solid rgba(12,38,48,.10) !important;border-radius:14px;transition:border-color .2s,box-shadow .2s}
html.hell .frage:hover{border-color:rgba(0,122,156,.35) !important;box-shadow:0 6px 18px rgba(12,38,48,.06)}
html.hell .frage:has(.frage-kopf[aria-expanded="true"]){border-color:rgba(0,122,156,.45) !important;box-shadow:0 8px 22px rgba(12,38,48,.07)}
html.hell .frage-kopf{padding:18px 20px 18px 22px !important;gap:18px !important;text-align:left;font-size:17px !important;line-height:1.4;border-radius:14px}
html.hell .frage-kopf .zeichen{flex:none;width:30px;height:30px;font-size:18px !important;background:#E3F4F9 !important;color:#007A9C !important}
html.hell .frage-kopf[aria-expanded="true"] .zeichen{background:#007A9C !important;color:#FFFFFF !important}
html.hell .frage-blatt p{padding:0 70px 14px 22px !important}
html.hell .frage-blatt p:last-child{padding-bottom:20px !important}
@media (max-width:600px){html.hell .frage-kopf{padding:15px 14px 15px 16px !important;gap:12px !important;font-size:16px !important} html.hell .frage-blatt p{padding:0 16px 12px !important} html.hell .frage-blatt p:last-child{padding-bottom:16px !important}}
/* Elementor-Textbausteine: kein Leerraum über dem ersten Absatz (machte die Karten der Musterseite höher als im Original) */
html.hell .elementor-widget-text-editor p:first-child{margin-top:0}
html.hell .elementor-widget-text-editor p:last-child{margin-bottom:0}
/* Elementor-Einblendungen nur abwärts: was beim Hochscrollen ins Bild kommt, steht sofort ruhig da (Gegenstück in ap.js, einblendenNurAbwaerts) */
.comnic-ruhig{animation:none !important;opacity:1 !important;visibility:visible !important}
/* Vorher/Nachher-Schieber (JetElements): runde Ecken, runder Griff mit Pfeilen, Beschriftung als kleine Plaketten (Musterseite Webseiten, 11.11.26) */
html.hell .jet-image-comparison__container{border-radius:16px;overflow:hidden;box-shadow:0 18px 40px -22px rgba(12,38,48,.35);border:1px solid rgba(12,38,48,.1)}
html.hell .jet-image-comparison__container .jx-control{background:#FFFFFF;width:3px;margin:0 auto}
html.hell .jet-image-comparison__container .jx-controller{left:50%;margin-left:-22px;width:44px;height:44px;border-radius:50%;background:#FFFFFF;box-shadow:0 4px 14px rgba(12,38,48,.3);display:grid;place-items:center}
html.hell .jet-image-comparison__container .jx-controller .jx-arrow{display:none}
html.hell .jet-image-comparison__container .jx-controller::after{content:"\2039\00a0\203A";font-size:22px;line-height:1;color:#007A9C;font-weight:700;position:absolute;inset:0;display:grid;place-items:center;padding-bottom:3px}
html.hell .jet-image-comparison__container .jx-label{top:12px;padding:5px 11px;border-radius:999px;font-size:13px;font-weight:600;letter-spacing:.02em;background:rgba(11,30,37,.78);color:#FFFFFF}
/* Zeitstrahl (JetElements) in Hausschrift und im Kartenstil der Seite (Musterseite Webseiten, 11.11.26) */
html.hell .jet-timeline :is(.timeline-item__card-title,.timeline-item__card-desc,.timeline-item__meta-content,.timeline-item__point-content){font-family:inherit !important}
html.hell .jet-timeline .timeline-item__card-content{padding:0}
html.hell .jet-timeline .timeline-item__card{border:1px solid rgba(12,38,48,.1);box-shadow:0 8px 24px -12px rgba(12,38,48,.14);background:#F6F9FA}
html.hell .jet-timeline .timeline-item__card-title{font-size:20px;font-weight:600;color:#0B1E25;margin:0 0 6px}
html.hell .jet-timeline .timeline-item__card-desc{font-size:16px;line-height:1.55;color:#3D5560}
html.hell .jet-timeline .timeline-item__meta-content{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#6B818B}
html.hell .jet-timeline .timeline-item.is--active .timeline-item__meta-content{color:#007A9C}
html.hell .jet-timeline .timeline-item__point-content{font-weight:700}
html.hell .jet-timeline .timeline-item__card-desc a{color:#007A9C;text-decoration:underline;text-underline-offset:3px}
html.hell .jet-image-comparison__container .jx-label{font-family:inherit !important}
