/* obs-mk4.css -- Redesign Oktober 2026 (F-0005). Quelle: Entwurf "openbi.studio App", Artboard W01. Lesbare Fassung mit Kommentaren: Projektdoku claude/website-redesign-17-10.md. Geladen nach obs-mk2/obs-mk-nav, vor obs-mk-handy. Zeile in der Huelle raus = alter Auftritt. */
:root{--font-heading:"Plus Jakarta Sans",system-ui,sans-serif;--font-body:"Plus Jakarta Sans",system-ui,sans-serif;--font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;--color-bg:#F4F4F9;--color-surface:#FFFFFF;--color-divider:#E0E1EC;--color-line:#E0E1EC;--color-text:#0F1024;--color-text-muted:#474966;--color-still:#6E7090;--color-neutral-100:#F8F8FC;--color-neutral-200:#EEEEF5;--color-neutral-300:#E0E1EC;--color-neutral-700:#474966;--color-neutral-800:#2A2B4A;--color-neutral-900:#0F1024;--color-accent:#5048E5;--color-accent-100:#ECEBFF;--color-accent-300:#B4B0FF;--color-accent-500:#5048E5;--color-accent-600:#4C44E0;--color-accent-700:#3F38C9;--color-accent-900:#14152B;--color-accent-2-100:#D9F5E8;--color-accent-2-500:#0B7A52;--color-accent-2-700:#0B7A52;--shell-dark:#14152B;--mk2-ton:var(--color-accent);--mk2-ton-weich:#ECEBFF;--mk2-ton-tief:#3F38C9;--mk4-nv:#14152B;--mk4-lila:#9C97FF;--mk4-tuerkis:#2DD4BF;--mk4-pink:#EC4899;--mk4-orange:#F97316;--mk4-himmel:#0284C7;--mk4-bernstein:#F59E0B;--mk4-violett:#7C3AED;--mk4-sh:0 1px 2px rgba(15,16,36,.05),0 6px 20px rgba(15,16,36,.06);--mk4-verlauf:linear-gradient(180deg,#6A63FF,#4C44E0);--mk4-nacht:radial-gradient(60% 70% at 85% 10%,rgba(45,212,191,.28),transparent 60%),radial-gradient(50% 70% at 10% 90%,rgba(139,134,255,.45),transparent 60%),radial-gradient(40% 40% at 55% 45%,rgba(244,114,182,.12),transparent 70%),#14152B;--mk4-kopf:68px;}
body{font-size:16px;line-height:1.6;}
h1,h2,h3,h4{font-family:var(--font-heading);font-weight:800;letter-spacing:-.02em;}
a{color:var(--color-accent);}
a:hover{color:var(--color-accent-700);}
.btn{border-radius:12px;font-weight:700;font-size:15px;padding:0 18px;height:40px;line-height:1;gap:8px;transition:background .14s ease,color .14s ease,box-shadow .14s ease,transform .14s ease;}
.btn-lg{height:48px;padding:0 22px;font-size:16px;}
.btn-sm{height:32px;padding:0 12px;font-size:13.5px;border-radius:9px;}
.btn-primary{background:var(--mk4-verlauf);border-color:#4840D8;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 8px 24px rgba(80,72,229,.35);}
.btn-primary:hover{background:linear-gradient(180deg,#7A74FF,#5A52F0);border-color:#4840D8;color:#fff;transform:translateY(-1px);}
.btn-secondary{background:var(--color-surface);color:var(--color-text);border-color:#C9CBDB;}
.btn-secondary:hover{background:var(--color-neutral-200);color:var(--color-text);}
.btn-ghost{background:transparent;color:var(--color-text-muted);border-color:transparent;}
.btn-ghost:hover{background:var(--color-neutral-200);color:var(--color-text);}
.btn-invert{background:#fff;color:var(--color-accent-700);border-color:#fff;}
.btn-rand{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.22);}
.btn-rand:hover{background:rgba(255,255,255,.16);color:#fff;}
.btn.ist-glas{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff;}
.btn.ist-glas:hover{background:rgba(255,255,255,.16);color:#fff;}
.mk-cta-angebot::after{border-radius:14px;}
@media (prefers-reduced-motion:reduce){.btn,.btn-primary:hover{transition:none;transform:none;}
}
.mk-beta{background:linear-gradient(90deg,#4C44E0,#7C3AED 50%,#EC4899);color:#fff;font-weight:600;font-size:14px;line-height:20px;}
.mk-beta:hover{color:#fff;}
.mk-beta .mk-beta-text,.mk-beta .mk-beta-pfeil{color:#fff;}
.mk-beta .mk-beta-pfeil{font-weight:800;}
.mk-beta .mk-beta-pille{background:rgba(255,255,255,.2);color:#fff;border-radius:999px;}
.obs-header:has(.mk2-nav){background:var(--mk4-nv);color:#fff;border-bottom:1px solid rgba(255,255,255,.08);padding:14px 24px;gap:28px;}
@media (min-width:901px){.obs-header:has(.mk2-nav){background:rgba(20,21,43,.9);backdrop-filter:saturate(160%) blur(14px);-webkit-backdrop-filter:saturate(160%) blur(14px);}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.obs-header:has(.mk2-nav){background:var(--mk4-nv);}
}
}
.obs-header:has(.mk2-nav) .obs-brand{color:#fff;gap:10px;}
.obs-header:has(.mk2-nav) .obs-brand-mark{width:26px;height:20px;color:var(--mk4-lila);}
.obs-header:has(.mk2-nav) .obs-brand-name{text-transform:none;letter-spacing:-.01em;font-size:19px;font-weight:800;}
.obs-header:has(.mk2-nav) .obs-header-right{gap:18px;}
.mk2-nav{border-right-color:rgba(255,255,255,.14);padding-right:1rem;}
.mk2-nav .nav-link{color:#C9CAE6;font-weight:600;font-size:15px;border-radius:10px;}
.mk2-nav .nav-link:hover,.mk2-nav .nav-item.ist-offen>.nav-link{background:rgba(255,255,255,.08);color:#fff;}
.mk2-nav .nav-item>.nav-link.is-active{color:#fff;}
.mk2-nav .nav-item>.nav-link.is-active::before{background:var(--mk4-lila);}
.mk2-nav .nav-link:focus-visible{outline-color:var(--mk4-lila);}
.mk2-nav .mk-gruppe>.nav-link.is-active{color:#fff;}
.mk2-nav .dropdown-menu{border-radius:16px;padding:.5rem;box-shadow:0 1px 2px rgba(15,16,36,.1),0 24px 48px -12px rgba(15,16,36,.35);}
.mk2-nav .dropdown-item{color:var(--color-text);border-radius:10px;font-weight:600;}
.mk2-nav .dropdown-item:hover,.mk2-nav .dropdown-item:focus-visible{background:var(--color-accent-100);color:var(--color-accent-700);}
.obs-header:has(.mk2-nav) .btn-ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff;}
.obs-header:has(.mk2-nav) .btn-ghost:hover{background:rgba(255,255,255,.16);color:#fff;}
.obs-header:has(.mk2-nav) .obs-konto{display:flex;gap:8px;align-items:center;}
.obs-header:has(.mk2-nav) .mk-cta-angebot{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff;}
.obs-header:has(.mk2-nav) .mk-cta-angebot:hover,.obs-header:has(.mk2-nav) .mk-cta-angebot:focus-visible{background:var(--mk4-bernstein);border-color:var(--mk4-bernstein);color:#1A1A1A;}
.obs-header:has(.mk2-nav) .mk-cta-angebot::after{border-color:var(--mk4-bernstein);}
.mk4-burger-schalter{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none;}
.mk4-burger{display:none;}
@media (max-width:900px){.obs-header:has(.mk2-nav){padding:12px 16px;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;}
.mk4-burger{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:0 11px;border-radius:12px;cursor:pointer;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);}
.mk4-burger span{display:block;height:2px;border-radius:2px;background:#fff;transition:transform .18s ease,opacity .18s ease;}
.mk4-burger-schalter:focus-visible+.mk4-burger{outline:2px solid var(--mk4-lila);outline-offset:2px;}
.mk4-burger-schalter:checked+.mk4-burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.mk4-burger-schalter:checked+.mk4-burger span:nth-child(2){opacity:0;}
.mk4-burger-schalter:checked+.mk4-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.obs-header:has(.mk2-nav) .obs-header-right{display:none;width:100%;flex-direction:column;align-items:stretch;gap:10px;padding-top:6px;}
.mk4-burger-schalter:checked~.obs-header-right{display:flex;}
.obs-header:has(.mk2-nav) .mk2-nav{padding:0;}
.obs-header:has(.mk2-nav) .mk2-nav ul.navbar-nav{flex-direction:column;align-items:stretch;gap:2px;}
.obs-header:has(.mk2-nav) .mk2-nav .nav-item{display:block;}
.obs-header:has(.mk2-nav) .mk2-nav .nav-link{display:flex;min-height:44px;padding:0 12px;}
.obs-header:has(.mk2-nav) .mk2-nav .dropdown-item{min-height:40px;display:flex;align-items:center;}
.obs-header:has(.mk2-nav) .obs-header-right .btn,.obs-header:has(.mk2-nav) .obs-konto{width:100%;justify-content:center;}
.obs-header:has(.mk2-nav) .obs-konto{flex-direction:column;}
.mk2-nav .dropdown-item{color:#C9CAE6;}
.mk2-nav .dropdown-item:hover{background:rgba(255,255,255,.08);color:#fff;}
}
@media (min-width:901px){.mk2-sprung{top:var(--mk4-kopf);}
}
.obs-footer{background:var(--color-surface);color:var(--color-text);border-top:1px solid var(--color-divider);padding:28px 24px;display:flex;flex-wrap:wrap;align-items:center;gap:24px;font-size:14px;}
.obs-footer>*{max-width:none;margin:0;}
.mk4-fuss-marke{display:flex;align-items:center;gap:10px;font-weight:800;color:var(--color-text);}
.mk4-fuss-marke .obs-brand-mark{width:22px;height:17px;color:var(--color-accent);}
.mk4-fuss-firma{color:var(--color-text-muted);}
.obs-footer footerbar,.obs-footer>ul{margin-left:auto;}
.obs-footer ul{gap:20px;}
.obs-footer a{color:var(--color-accent);font-size:14px;font-weight:500;}
.obs-footer a:hover{color:var(--color-accent-700);text-decoration:underline;}
@media (max-width:900px){.obs-footer{padding:24px 20px;}
.obs-footer footerbar{margin-left:0;}
}
.obs-kicker,.obs-kicker-muted,.obs-eyebrow,.obs-mk-marke,.mk2-kachel-nr,.mk2-schere-marke,.mk2-matrix thead th{font-family:var(--font-heading);font-size:13px;line-height:20px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--color-accent);}
.obs-kicker{margin-bottom:12px;}
.obs-kicker-muted{margin-bottom:12px;}
.mk2-band.ist-nacht .obs-kicker,.mk2-band.ist-nacht .obs-kicker-muted,.mk2-schluss .obs-kicker{color:var(--mk4-lila);}
.mk2-kachel-nr{font-family:var(--font-mono);font-weight:500;letter-spacing:.04em;text-transform:none;color:var(--color-still);}
.mk2-gross,.obs-mk-kopf h2{font-size:clamp(28px,4vw,46px);line-height:1.1;letter-spacing:-.03em;font-weight:800;}
.obs-mk-kopf p{font-size:18px;line-height:29px;}
.mk2-riese{letter-spacing:-.04em;}
.mk2-vor{font-size:18px;line-height:29px;}
.mk2-band{padding:clamp(56px,8vw,104px) var(--mk2-rand);}
.mk2-band.ist-nacht{background:var(--mk4-nacht);}
.mk2-band.ist-nacht .obs-mk-kopf p,.mk2-band.ist-nacht p{color:rgba(255,255,255,.82);}
.mk2-band.ist-still{background:var(--color-neutral-200);}
.mk2-kachel,.obs-mk-karte,.mk2-gegen-spalte,.mk2-chat,.obs-mk-tarif,.obs-mk-shot,.mk2-schere,.mk2-matrix-huelle{border-radius:20px;box-shadow:var(--mk4-sh);border:1px solid var(--color-divider);background:var(--color-surface);}
.obs-mk-shot{box-shadow:0 1px 2px rgba(15,16,36,.05),0 20px 50px -20px rgba(20,21,43,.35);}
.obs-mk-shot figcaption{font-size:13px;}
.mk2-kachel{padding:28px;}
.mk2-kachel:hover{border-color:var(--color-accent-300);box-shadow:0 1px 2px rgba(15,16,36,.05),0 24px 44px -24px rgba(80,72,229,.45);}
.mk2-kachel h3{font-size:22px;line-height:28px;letter-spacing:-.015em;}
.mk2-kachel p,.obs-mk-karte p{font-size:16px;line-height:26px;}
.mk2-kachel p a{font-weight:700;}
.obs-mk-raster{gap:20px;background:transparent;border:0;}
.obs-mk-karte{padding:28px;}
.obs-mk-karte h3{font-size:20px;}
.mk2-gegen{gap:20px;}
.mk2-gegen-spalte{padding:28px;box-shadow:none;}
.mk2-gegen-spalte.ist-wir{border:0;color:#fff;background:radial-gradient(100% 100% at 100% 0%,rgba(45,212,191,.35),transparent 60%),linear-gradient(135deg,#6A63FF,#4C44E0);box-shadow:0 16px 40px rgba(80,72,229,.35);}
.mk2-gegen-kopf{font-size:19px;}
.mk2-gegen-spalte.ist-wir .mk2-gegen-kopf,.mk2-band.ist-nacht .mk2-gegen-spalte.ist-wir .mk2-gegen-kopf{color:#fff;}
.mk2-gegen-spalte.ist-wir .mk2-gegen-satz,.mk2-band.ist-nacht .mk2-gegen-spalte.ist-wir .mk2-gegen-satz{color:#E8E7FF;}
.mk2-gegen-spalte.ist-wir .mk2-gegen-liste li{color:#fff;}
.mk2-gegen-spalte.ist-wir .mk2-gegen-liste li::before{color:var(--mk4-tuerkis);}
.mk2-gegen-liste li::before{color:var(--color-still);}
.mk2-schere{box-shadow:var(--mk4-sh);}
.mk2-schere-seite{padding:28px;}
.mk2-schere-seite.ist-neu .mk2-schere-marke{color:var(--color-accent);}
.mk2-matrix-huelle{overflow-x:auto;padding:0;}
.mk2-matrix-huelle>.mk2-matrix{margin:0;}
.mk2-matrix{font-size:15px;border-spacing:0;border-collapse:separate;}
.mk2-matrix thead th{background:var(--color-neutral-200);color:var(--color-text);border-bottom:0;padding:14px 20px;text-transform:none;letter-spacing:0;font-size:13px;}
.mk2-matrix thead th:last-child{background:var(--color-accent-100);color:var(--color-accent);}
.mk2-matrix th,.mk2-matrix td{padding:16px 20px;border-bottom:0;border-top:1px solid var(--color-divider);}
.mk2-matrix thead th{border-top:0;}
.mk2-matrix tbody th{font-weight:700;}
.mk2-matrix tbody tr:hover{background:var(--color-neutral-100);}
.mk4-chk{display:inline-flex;align-items:center;justify-content:center;flex:none;width:22px;height:22px;border-radius:11px;margin-right:10px;vertical-align:-5px;background:var(--color-accent-2-100);color:var(--color-accent-2-500);font-size:13px;font-weight:800;}
.mk2-ehrlich{gap:20px;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));}
.mk2-ehrlich-zeile{grid-template-columns:1fr;gap:8px;padding:28px;border:1px solid var(--color-divider);border-style:dashed;border-left-width:1px;border-left-color:var(--color-divider);background:var(--color-surface);border-radius:20px;}
.mk2-ehrlich-zeile b{font-size:18px;line-height:24px;letter-spacing:-.01em;}
.mk2-ehrlich-zeile p{font-size:16px;line-height:26px;}
.mk2-zahl-wert{color:var(--color-accent);}
.mk2-schluss{margin:0 var(--mk2-rand) clamp(56px,8vw,104px);border-radius:28px;padding:clamp(28px,5vw,64px);background:radial-gradient(60% 90% at 100% 0%,rgba(244,114,182,.35),transparent 60%),radial-gradient(60% 90% at 0% 100%,rgba(139,134,255,.45),transparent 60%),#14152B;text-align:left;}
.mk2-schluss h2{font-size:clamp(28px,4vw,46px);line-height:1.1;}
.mk2-schluss .mk2-vor{margin-left:0;margin-right:0;}
.mk2-schluss-aktionen{justify-content:flex-start;}
.mk2-schluss .btn-rand{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);}
.obs-mk-hinweis{border-radius:0 14px 14px 0;border-left-color:var(--color-accent);font-size:15px;}
.obs-mk-tarife{gap:20px;background:transparent;border:0;}
.obs-mk-tarif{padding:28px;}
.obs-mk-tarif.ist-empfohlen{outline:2px solid var(--color-accent);}
.obs-mk-tarif-preis{font-size:36px;letter-spacing:-.02em;}
.obs-mk-seitenkopf,.mk2-ziel-kopf{background:var(--mk4-nacht);color:#fff;border-bottom:0;padding-block:clamp(40px,6vw,72px) clamp(40px,6vw,64px);}
.obs-mk-seitenkopf h1,.mk2-ziel-kopf h1,.obs-mk-seitenkopf h1.mk2-riese,.mk2-ziel-kopf h1.mk2-riese{color:#fff;letter-spacing:-.04em;}
.obs-mk-seitenkopf p,.mk2-ziel-kopf p,.obs-mk-seitenkopf .mk2-vor,.mk2-ziel-kopf .mk2-vor{color:rgba(255,255,255,.82);}
.obs-mk-seitenkopf .obs-kicker,.mk2-ziel-kopf .obs-kicker,.obs-mk-seitenkopf .obs-kicker-muted,.mk2-ziel-kopf .obs-kicker-muted{color:var(--mk4-lila);}
.obs-mk-seitenkopf .mk2-riese .mk2-strich,.mk2-ziel-kopf .mk2-riese .mk2-strich{background:linear-gradient(to top,rgba(156,151,255,.35) 0 .34em,transparent .34em);}
.obs-mk-seitenkopf .mk2-riese .mk2-ton,.mk2-ziel-kopf .mk2-riese .mk2-ton{color:var(--mk4-lila);}
.mk2-ziel-kopf .mk2-schild{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);}
.obs-mk-seitenkopf .btn-secondary,.mk2-ziel-kopf .btn-secondary{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff;}
.obs-mk-seitenkopf .btn-secondary:hover,.mk2-ziel-kopf .btn-secondary:hover{background:rgba(255,255,255,.16);color:#fff;}
.obs-mk-seitenkopf a:not(.btn),.mk2-ziel-kopf a:not(.btn){color:#fff;text-decoration:underline;}
.obs-mk-heroshot{background:var(--color-bg);border-bottom:0;}
.obs-mk-cta{background:radial-gradient(60% 90% at 100% 0%,rgba(244,114,182,.35),transparent 60%),radial-gradient(60% 90% at 0% 100%,rgba(139,134,255,.45),transparent 60%),#14152B;}
.obs-mk-cta .obs-kicker{color:var(--mk4-lila);}
.mk4-wrap{max-width:1200px;margin:0 auto;padding:0 24px;}
.mk4-sektion{padding:clamp(56px,8vw,104px) 0;}
.mk4-sektion.ist-oben-knapp{padding-top:0;}
.mk4-sh{display:flex;flex-direction:column;gap:12px;max-width:760px;margin-bottom:40px;}
.mk4-sh .obs-kicker{margin:0;}
.mk4-h2{font-size:clamp(28px,4vw,46px);line-height:1.1;letter-spacing:-.03em;margin:0;}
.mk4-lead{font-size:18px;line-height:29px;color:var(--color-text-muted);margin:0;}
.mk4-raster{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:20px;}
.mk4-raster.ist-drei{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));}
.mk4-ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none;}
.mk4-mehr{display:inline-flex;align-items:center;gap:8px;font-weight:700;text-decoration:none;margin-top:24px;}
.mk4-mehr:hover{text-decoration:underline;}
.mk4-karte{display:flex;flex-direction:column;gap:14px;padding:28px;background:var(--color-surface);border:1px solid var(--color-divider);border-radius:20px;box-shadow:var(--mk4-sh);color:var(--color-text);text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;}
a.mk4-karte:hover{color:var(--color-text);text-decoration:none;transform:translateY(-3px);border-color:var(--color-accent-300);box-shadow:0 1px 2px rgba(15,16,36,.05),0 24px 44px -24px rgba(80,72,229,.45);}
.mk4-karte.ist-flach{box-shadow:none;}
.mk4-karte.ist-gestrichelt{box-shadow:none;border-style:dashed;}
.mk4-karte h3{font-size:22px;line-height:28px;letter-spacing:-.015em;margin:0;}
.mk4-karte.ist-klein h3{font-size:19px;line-height:26px;}
.mk4-karte.ist-gestrichelt h3{font-size:18px;line-height:24px;}
.mk4-karte p{margin:0;color:var(--color-text-muted);}
.mk4-karte-kopf{display:flex;justify-content:space-between;align-items:center;}
.mk4-nr{font-family:var(--font-mono);font-size:13px;font-weight:500;color:var(--color-still);}
.mk4-karte .mk4-mehr{margin-top:auto;}
.mk4-karte.ist-wir{border:0;color:#fff;background:radial-gradient(100% 100% at 100% 0%,rgba(45,212,191,.35),transparent 60%),linear-gradient(135deg,#6A63FF,#4C44E0);box-shadow:0 16px 40px rgba(80,72,229,.35);}
.mk4-karte.ist-wir p{color:#E8E7FF;}
.mk4-preis{font-size:26px;font-weight:800;letter-spacing:-.02em;line-height:1.2;}
.mk4-preis small{font-size:15px;font-weight:600;color:var(--color-still);}
@media (prefers-reduced-motion:reduce){.mk4-karte{transition:none;}
a.mk4-karte:hover{transform:none;}
}
.mk4-kachel{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#fff;flex:none;}
.mk4-kachel .mk4-ic{width:24px;height:24px;}
.mk4-kachel.ist-klein{width:40px;height:40px;border-radius:12px;}
.mk4-kachel.ist-klein .mk4-ic{width:20px;height:20px;}
.mk4-kachel.ist-indigo{background:linear-gradient(135deg,#8B86FF,#4C44E0);}
.mk4-kachel.ist-himmel{background:linear-gradient(135deg,#7DD3FC,#0284C7);}
.mk4-kachel.ist-bernstein{background:linear-gradient(135deg,#FCD34D,#F59E0B);}
.mk4-kachel.ist-tuerkis{background:linear-gradient(135deg,#2DD4BF,#0E9F9A);}
.mk4-kachel.ist-pink{background:linear-gradient(135deg,#F9A8D4,#EC4899);}
.mk4-kachel.ist-violett{background:linear-gradient(135deg,#A78BFA,#7C3AED);}
.mk4-kachel.ist-orange{background:linear-gradient(135deg,#FDBA74,#F97316);}
.mk4-ton-indigo{color:var(--color-accent);}
.mk4-ton-himmel{color:var(--mk4-himmel);}
.mk4-ton-bernstein{color:#B45309;}
.mk4-ton-tuerkis{color:#0E9F9A;}
.mk4-ton-pink{color:#DB2777;}
.mk4-ton-violett{color:var(--mk4-violett);}
.mk4-ton-orange{color:#C2410C;}
.mk4-hero{background:var(--mk4-nacht);color:#fff;padding:48px 0 80px;}
.mk4-hero .mk4-wrap{display:flex;flex-wrap:wrap;gap:56px;align-items:center;}
.mk4-hero-text{flex:1 1 460px;min-width:0;display:flex;flex-direction:column;gap:26px;}
.mk4-hero-text .obs-kicker{color:var(--mk4-lila);margin:0;}
.mk4-h1{font-size:clamp(42px,6.4vw,76px);line-height:1.02;font-weight:800;letter-spacing:-.04em;margin:0;color:#fff;}
.mk4-verlauf{background:linear-gradient(90deg,#9C97FF,#2DD4BF);-webkit-background-clip:text;background-clip:text;color:transparent;}
.mk4-takt{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:10px;}
.mk4-chip{border-radius:14px;padding:12px 14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);}
.mk4-chip-marke{display:block;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--mk4-lila);}
.mk4-chip-marke.ist-pink{color:#F9A8D4;}
.mk4-chip-marke.ist-orange{color:#FDBA74;}
.mk4-chip-marke.ist-tuerkis{color:var(--mk4-tuerkis);}
.mk4-chip b{font-weight:700;}
.mk4-aktionen{display:flex;gap:12px;flex-wrap:wrap;}
.mk4-trust{display:flex;gap:18px;flex-wrap:wrap;font-size:14px;color:#C9CAE6;font-weight:600;margin:0;padding:0;list-style:none;}
.mk4-trust li::before{content:"\2713\00a0";color:var(--mk4-tuerkis);}
.mk4-hero-fuss{margin:0;color:#C9CAE6;font-size:15px;max-width:60ch;}
.mk4-hero-fuss b{color:#fff;}
.mk4-hero-bild{flex:1 1 460px;min-width:0;}
.mk4-vorschau{border-radius:22px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);padding:14px;box-shadow:0 30px 80px rgba(0,0,0,.35);}
.mk4-vs{border-radius:14px;background:#F4F4F9;color:#0F1024;overflow:hidden;display:flex;min-height:380px;}
.mk4-vs-seite{flex:1;padding:18px;display:flex;flex-direction:column;gap:12px;min-width:0;}
.mk4-vs-titel{font-size:12px;font-weight:700;color:var(--color-accent);}
.mk4-vs-kopf{border-radius:14px;padding:18px;background:linear-gradient(135deg,#FFF7ED,#FDE7D2);color:#3B1F0B;outline:2px solid var(--color-accent);outline-offset:3px;}
.mk4-vs-kopf b{display:block;font-weight:800;font-size:20px;line-height:24px;letter-spacing:-.02em;}
.mk4-vs-kopf span{font-size:13px;color:#7C4A23;}
.mk4-vs-raster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
.mk4-vs-raster span{min-height:64px;border-radius:10px;background:#EEEEF5;padding:10px 12px;display:flex;flex-direction:column;justify-content:center;gap:3px;min-width:0;}
.mk4-vs-raster b{font-size:12px;font-weight:700;line-height:1.2;color:#0F1024;}
.mk4-vs-raster i{font-style:normal;font-size:11px;line-height:1.3;color:#5B5D7A;}
@media (max-width:480px){.mk4-vs-raster i{display:none;}}
.mk4-vs-zeile{display:flex;gap:8px;align-items:center;background:#fff;border:1px solid #E0E1EC;border-radius:12px;padding:10px;font-size:13px;line-height:1.35;}
.mk4-vs-zeile b{display:block;}
.mk4-vs-zeile span:last-child{color:#474966;}
.mk4-vs-punkt{width:28px;height:28px;border-radius:9px;background:linear-gradient(135deg,#7DD3FC,#0284C7);flex:none;}
.mk4-vs-chat{width:200px;background:#fff;border-left:1px solid #E0E1EC;padding:14px;display:flex;flex-direction:column;gap:10px;}
.mk4-vs-chat-kopf{display:flex;gap:8px;align-items:center;font-size:14px;font-weight:800;}
.mk4-vs-avatar{width:28px;height:28px;border-radius:14px;background:linear-gradient(135deg,#F9A8D4,#EC4899);color:#fff;font-weight:800;font-size:12px;display:flex;align-items:center;justify-content:center;flex:none;}
.mk4-blase{padding:8px 10px;font-size:12px;line-height:17px;margin:0;}
.mk4-blase.ist-du{align-self:flex-end;background:var(--mk4-verlauf);color:#fff;border-radius:12px 12px 4px 12px;}
.mk4-blase.ist-er{background:#F4F4F9;border-radius:4px 12px 12px 12px;}
.mk4-vs-eingabe{margin-top:auto;border:1px solid #C9CBDB;border-radius:10px;padding:8px 10px;font-size:12px;color:#6E7090;}
@media (max-width:560px){.mk4-vs{flex-direction:column;min-height:0;}
.mk4-vs-chat{width:auto;border-left:0;border-top:1px solid #E0E1EC;}
}
.mk4-video{display:flex;flex-wrap:wrap;gap:40px;align-items:center;}
.mk4-video-text{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;gap:14px;}
.mk4-video-text .obs-kicker{margin:0;color:#DB2777;}
.mk4-video-bild{flex:2 1 560px;min-width:0;}
.mk4-video-bild figure{margin:0;border-radius:24px;overflow:hidden;background:var(--mk4-nv);box-shadow:0 30px 70px rgba(20,21,43,.35);}
.mk4-video-bild video{display:block;width:100%;height:auto;aspect-ratio:16 / 9;background:var(--mk4-nv);}
.mk4-video-bild figcaption{padding:12px 18px;font-size:14px;color:#C9CAE6;display:flex;align-items:center;gap:10px;}
.mk4-dauer{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:999px;background:rgba(255,255,255,.14);color:#fff;font-size:13px;font-weight:700;}
.mk4-warum{padding:clamp(24px,4vw,56px);display:flex;flex-wrap:wrap;gap:48px;background:radial-gradient(60% 100% at 100% 0%,rgba(139,134,255,.14),transparent 60%),var(--color-surface);border:1px solid var(--color-divider);border-radius:20px;box-shadow:var(--mk4-sh);}
.mk4-warum-text{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:28px;}
.mk4-warum-text .mk4-sh{margin:0;}
.mk4-punkt{display:flex;gap:16px;}
.mk4-punkt h3{font-size:19px;line-height:26px;margin:0 0 4px;}
.mk4-punkt p{margin:0;color:var(--color-text-muted);}
.mk4-warum-bild{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;justify-content:center;}
.mk4-kette{border-radius:20px;background:var(--mk4-nv);padding:20px;color:#fff;display:flex;flex-direction:column;gap:14px;box-shadow:0 20px 50px rgba(20,21,43,.3);}
.mk4-kette-titel{font-size:13px;font-weight:700;color:#9EA0C6;}
.mk4-kette-stufen{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.mk4-stufe{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.08);border-radius:12px;padding:10px 12px;font-weight:700;}
.mk4-rl{width:30px;height:30px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;flex:none;}
.mk4-rl.ist-e{background:#27265A;color:#C7C4FF;}
.mk4-rl.ist-q{background:#33260C;color:#FCD34D;}
.mk4-rl.ist-p{background:#0F2E22;color:#6EE7B7;}
.mk4-pfeil{color:var(--mk4-tuerkis);font-weight:800;}
.mk4-kette-hinweis{display:flex;align-items:center;gap:10px;background:rgba(251,191,36,.14);border:1px solid rgba(251,191,36,.35);border-radius:12px;padding:10px 12px;font-size:14px;}
.mk4-kette-hinweis::before{content:"\25CF";color:#FCD34D;font-weight:800;}
.mk4-schluss{border-radius:28px;padding:clamp(28px,5vw,64px);color:#fff;background:radial-gradient(60% 90% at 100% 0%,rgba(244,114,182,.35),transparent 60%),radial-gradient(60% 90% at 0% 100%,rgba(139,134,255,.45),transparent 60%),#14152B;display:flex;flex-wrap:wrap;gap:32px;align-items:center;}
.mk4-schluss-text{flex:1 1 420px;min-width:0;}
.mk4-schluss .mk4-h2{color:#fff;}
.mk4-schluss p{color:rgba(255,255,255,.82);margin:12px 0 0;max-width:56ch;}
@media (max-width:900px){.mk4-hero{padding:32px 0 56px;}
.mk4-hero .mk4-wrap{gap:36px;}
.mk4-sh{margin-bottom:28px;}
.mk2-schluss{margin-left:16px;margin-right:16px;}
}
@media (max-width:480px){.mk4-wrap{padding:0 16px;}
.mk4-karte,.mk2-kachel,.mk2-gegen-spalte,.obs-mk-karte,.mk2-ehrlich-zeile{padding:22px;}
}