/*
Theme Name: Marken-Kanzlei Divi Child
Theme URI: https://marken-kanzlei.ch/
Description: Divi-Child fuer marken-kanzlei.ch – Premium Design-System v0.6 (WOW+, Divi-editierbar via mk-anim-* Klassen, siehe docs/design-effekte.md).
Author: PANART Marketing OÜ
Template: Divi
Version: 1.22.1
Text Domain: mk-divi-child
*/

/* WICHTIG – Namenskollision Sektion vs. Komponente:
   mk-provision setzt auf jede Divi-Sektion module_class="mk-<typ>" (z. B. mk-cases,
   mk-leadcheck, mk-faq, mk-final, mk-steps). Die innere Komponente traegt exakt dieselbe
   Klasse. Layout-/Box-Eigenschaften (display, grid-template-columns, max-width, padding,
   background, border-radius) einer Komponente muessen deshalb IMMER mit
   :not(.et_pb_section) geschrieben werden – sonst wird die ganze Sektion zum Grid/Flex-
   Container und die Row rutscht in Spalte 1 (halbe Breite, linksbuendig).
   Regeln, die absichtlich die Sektion meinen, mit .et_pb_section.mk-<typ> qualifizieren. */

:root{
  --mk-blue:#0000F0; --mk-blue-dark:#0000b8; --mk-blue-2:#2a2adf;
  --mk-yellow:#F5DA23; --mk-yellow-2:#FCE923; --mk-yellow-soft:#FDED64; --mk-yellow-3:#F4D924;
  --mk-ink:#0b0d1a; --mk-ink-2:#1b1e30; --mk-muted:#5b6072; --mk-line:#e9eaf1;
  --mk-bg:#ffffff; --mk-bg-soft:#f6f7fb; --mk-bg-dark:#0b0d1a;
  --mk-radius:18px; --mk-radius-lg:26px;
  --mk-shadow:0 20px 60px rgba(11,13,26,.10); --mk-shadow-lg:0 40px 90px rgba(11,13,26,.16);
  --mk-maxw:1140px;
  /* Anim-Tokens (v0.6) – zentral justierbar, auch via Divi Custom CSS überschreibbar */
  --mk-anim-dur:.6s; --mk-anim-ease:cubic-bezier(.2,.7,.2,1);
  --mk-orb-a:rgba(245,218,35,.40); --mk-orb-b:rgba(0,0,240,.14);
}

/* ---------- Base ---------- */
body,.et_pb_text,p,li,a,span,div{ font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif; }
body{ color:var(--mk-ink); -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4{ font-family:'Inter',sans-serif; color:var(--mk-ink); font-weight:800; letter-spacing:-.025em; line-height:1.07; }
h1{ font-size:clamp(2.7rem,6vw,4.8rem); }
h2{ font-size:clamp(2rem,3.8vw,3rem); }
h3{ font-size:1.25rem; }
p{ line-height:1.65; }
a{ color:var(--mk-blue); text-decoration:none; }

/* Section-Rhythmus */
.et_pb_section{ padding:96px 0; background:var(--mk-bg); }
.et_pb_section .et_pb_row{ width:92%; max-width:var(--mk-maxw); }
.mk-features,.mk-pricing,.mk-similarity{ background:var(--mk-bg-soft); }
.mk-eyebrow{ text-transform:uppercase; letter-spacing:.16em; font-weight:800; color:var(--mk-blue); font-size:.8rem; margin:0 0 12px; }
.mk-sub{ font-size:1.12rem; color:var(--mk-muted); max-width:62ch; }
.mk-center{ text-align:center; }
.mk-pill{ display:inline-block; background:var(--mk-blue); color:#fff; font-size:.8rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; padding:7px 16px; border-radius:999px; }

/* ============================ Divi-5-Normalisierung (scoped) ============================ */
/* Unsere Inhalte liegen je Sektion in einem Text-Modul. Divi-5-Defaults hier zähmen. */
.et_pb_section[class*="mk-"]{ padding:88px 0; background-position:center; }
.et_pb_section[class*="mk-"] > .et_pb_row,
.et_pb_section[class*="mk-"] .et_pb_row{ width:92%; max-width:var(--mk-maxw); margin:0 auto; padding:0; }
.et_pb_section[class*="mk-"] .et_pb_column{ width:100%; margin:0; padding:0; float:none; }
.et_pb_section[class*="mk-"] .et_pb_text,
.et_pb_section[class*="mk-"] .et_pb_text_inner{ width:100%; max-width:100%; color:inherit; line-height:1.65; }
.et_pb_section[class*="mk-"] .et_pb_text ul,
.et_pb_section[class*="mk-"] .et_pb_text ol{ list-style:none; margin:0; padding:0; }
.et_pb_section[class*="mk-"] .et_pb_text li{ margin:0; }
.et_pb_section[class*="mk-"] p{ margin:0 0 1em; }
.et_pb_section[class*="mk-"] p:last-child{ margin-bottom:0; }
.et_pb_section[class*="mk-"] h1,
.et_pb_section[class*="mk-"] h2,
.et_pb_section[class*="mk-"] h3{ padding:0; }
.et_pb_section[class*="mk-"] a{ text-decoration:none; }
/* Hero Divi-5-fest: Text im Fluss über dem Radar */
.mk-hero .et_pb_row{ display:block; position:relative; z-index:2; }
.mk-hero .et_pb_column{ z-index:2; }
.mk-hero-visual{ z-index:1; }
/* Kein horizontaler Überlauf */
html, body, #page-container, #et-main-area, #main-content, .et_builder_inner_content{ overflow-x:hidden; max-width:100%; }
.et_pb_section[class*="mk-"]{ overflow:hidden; box-sizing:border-box; }
.et_pb_section[class*="mk-"] *{ max-width:100%; box-sizing:border-box; }
.mk-live-ticker{ max-width:100%; }

/* ---------- Buttons ---------- */
.mk-btn{ display:inline-block; font-weight:700; font-size:1.02rem; padding:15px 30px; border-radius:12px; transition:transform .15s,box-shadow .15s,background .15s; cursor:pointer; border:2px solid transparent; }
.mk-btn--primary{ background:var(--mk-blue); color:#fff; border-color:var(--mk-blue); }
.mk-btn--primary:hover{ background:var(--mk-blue-dark); color:#fff; transform:translateY(-2px); box-shadow:0 14px 30px rgba(0,0,240,.32); }
.mk-btn--ghost{ background:transparent; color:var(--mk-blue); border-color:var(--mk-blue); }
.mk-btn--ghost:hover{ background:var(--mk-blue); color:#fff; transform:translateY(-2px); }
.mk-hero-cta{ display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; }

/* ---------- Reveal-Animation ---------- */
.mk-reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s ease,transform .7s ease; }
.mk-reveal.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .mk-reveal{ opacity:1; transform:none; transition:none; } }

/* ---------- HERO ---------- */
.mk-hero{ position:relative; overflow:hidden; padding:130px 0 110px;
  background:radial-gradient(1200px 600px at 80% -10%, var(--mk-yellow-soft), transparent 60%),
             linear-gradient(120deg,#fffdf2 0%,#fff 55%); }
.mk-hero .et_pb_row{ display:flex; align-items:center; }
.mk-hero .et_pb_column{ width:100% !important; }
.mk-hero-inner{ max-width:680px; }
.mk-hero h1,.mk-hero .mk-hero-headline{ margin:18px 0 0; }
.mk-hero h1 strong,.mk-hero h1,.mk-hero .mk-hero-headline{ color:var(--mk-ink); }
/* Beitrags-Hero: Headline ist dort eine H2 (SEO: eine H1 pro Seite) – Optik wie H1 */
.mk-hero h2.mk-hero-headline{ font-size:clamp(2.7rem,6vw,4.8rem); line-height:1.07; letter-spacing:-.025em; font-weight:800; }
.mk-hero-text{ font-size:1.22rem; color:var(--mk-ink-2); margin-top:18px; max-width:54ch; }
.mk-hero-text p{ margin:.4em 0; }
.mk-trust{ display:flex; align-items:center; gap:26px; flex-wrap:wrap; margin-top:38px; opacity:.85; }
.mk-trust img{ height:34px; width:auto; filter:grayscale(1); opacity:.8; }
.mk-trust span{ color:var(--mk-muted); font-weight:600; font-size:.9rem; }
/* Radar */
.mk-hero-visual{ position:absolute; right:-60px; top:50%; transform:translateY(-50%); width:520px; height:520px; pointer-events:none; }
.mk-radar{ position:absolute; inset:0; display:grid; place-items:center; }
.mk-radar span{ position:absolute; border-radius:50%; border:2px solid rgba(0,0,240,.16); }
.mk-radar span:nth-child(1){ width:180px; height:180px; }
.mk-radar span:nth-child(2){ width:320px; height:320px; }
.mk-radar span:nth-child(3){ width:470px; height:470px; }
.mk-radar i{ position:absolute; width:14px; height:14px; border-radius:50%; background:var(--mk-blue); box-shadow:0 0 0 8px rgba(0,0,240,.12); animation:mk-blip 3.4s infinite ease-out; }
.mk-radar:before{ content:""; position:absolute; width:470px; height:470px; border-radius:50%;
  background:conic-gradient(from 0deg, rgba(0,0,240,.18), transparent 28%); animation:mk-sweep 4s linear infinite; }
@keyframes mk-sweep{ to{ transform:rotate(360deg); } }
@keyframes mk-blip{ 0%{ transform:translate(120px,-80px) scale(.4); opacity:0; } 20%{ opacity:1; } 60%{ opacity:1; } 100%{ transform:translate(120px,-80px) scale(1.6); opacity:0; } }
@media (prefers-reduced-motion:reduce){ .mk-radar:before,.mk-radar i{ animation:none; } }

/* ---------- TRUTH (+Video) ---------- */
.mk-truth{ background:var(--mk-bg); }
.mk-truth-grid{ display:grid; grid-template-columns:1.05fr 1fr; gap:54px; align-items:center; }
.mk-truth-text h2{ margin-bottom:14px; }
.mk-video{ position:relative; border-radius:var(--mk-radius-lg); overflow:hidden; box-shadow:var(--mk-shadow-lg); aspect-ratio:16/10; background:#11131f; }
.mk-video iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.mk-video--placeholder{ display:grid; place-items:center; background-size:cover; background-position:center;
  background-color:var(--mk-ink); color:#fff; }
.mk-video--placeholder span{ position:absolute; bottom:18px; left:20px; font-weight:600; opacity:.9; }
.mk-play{ width:78px; height:78px; border-radius:50%; border:0; cursor:pointer; background:var(--mk-yellow); position:relative; box-shadow:0 12px 30px rgba(0,0,0,.3); }
.mk-play:before{ content:""; position:absolute; left:54%; top:50%; transform:translate(-50%,-50%); border-style:solid; border-width:13px 0 13px 21px; border-color:transparent transparent transparent var(--mk-ink); }

/* ---------- STATS ---------- */
.mk-stats{ background:var(--mk-blue); }
.mk-stats h2,.mk-stats .mk-eyebrow,.mk-stats .mk-sub{ color:#fff; text-align:center; }
.mk-stats .mk-eyebrow{ color:var(--mk-yellow); }
.mk-stats-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; margin-top:30px; }
.mk-stat{ text-align:center; }
.mk-stat-value{ display:block; font-size:clamp(2.4rem,5vw,3.6rem); font-weight:800; color:var(--mk-yellow); line-height:1; }
.mk-stat-label{ display:block; margin-top:10px; color:#dfe0ff; font-weight:600; }

/* ---------- PROSE / richtext ---------- */
.mk-prose{ max-width:760px; }
.mk-prose h2:after{ content:""; display:block; width:64px; height:5px; border-radius:4px; background:var(--mk-yellow); margin:18px 0 6px; }
.mk-prose p{ font-size:1.08rem; color:var(--mk-ink-2); }

/* ---------- RISK ---------- */
.mk-risk-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:34px; }
.mk-risk-card{ background:#fff; border:1px solid var(--mk-line); border-radius:var(--mk-radius); padding:30px 26px; box-shadow:var(--mk-shadow); position:relative; }
.mk-risk-num{ width:40px; height:40px; border-radius:50%; background:var(--mk-ink); color:#fff; display:grid; place-items:center; font-weight:800; margin-bottom:14px; }
.mk-risk-card h3{ color:var(--mk-blue); margin-bottom:8px; }
.mk-risk-card p{ color:var(--mk-ink-2); }

/* ---------- STEPS ---------- */
.mk-steps:not(.et_pb_section){ display:flex; align-items:stretch; gap:14px; margin-top:36px; flex-wrap:wrap; justify-content:center; }
.mk-step{ flex:1 1 240px; background:#fff; border:1px solid var(--mk-line); border-radius:var(--mk-radius); padding:28px; box-shadow:var(--mk-shadow); text-align:center; }
.mk-step-no{ width:46px; height:46px; border-radius:14px; background:var(--mk-yellow); color:var(--mk-ink); font-weight:800; display:grid; place-items:center; margin:0 auto 14px; font-size:1.2rem; }
.mk-step h3{ color:var(--mk-blue); }
.mk-step-arrow{ align-self:center; color:var(--mk-yellow-3); font-size:1.6rem; font-weight:800; }

/* ---------- SIMILARITY ---------- */
.mk-sim-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; margin-top:34px; }
.mk-sim-card{ background:#fff; border:1px solid var(--mk-line); border-radius:var(--mk-radius); padding:28px; box-shadow:var(--mk-shadow); }
.mk-sim-compare{ display:flex; align-items:center; gap:14px; margin-bottom:14px; flex-wrap:wrap; }
.mk-sim-a,.mk-sim-b{ background:var(--mk-bg-soft); border:1px dashed var(--mk-line); border-radius:10px; padding:8px 14px; font-weight:700; }
.mk-sim-b{ color:var(--mk-blue); border-color:var(--mk-blue); }
.mk-sim-vs{ color:var(--mk-yellow-3); font-weight:800; font-size:1.4rem; }
.mk-sim-card h3{ color:var(--mk-ink); }
.mk-sim-card p{ color:var(--mk-muted); }

/* ---------- WHY / features ---------- */
.mk-why-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; margin-top:30px; }
.mk-why-card{ background:#fff; border:1px solid var(--mk-line); border-radius:var(--mk-radius); padding:30px 28px; box-shadow:var(--mk-shadow); position:relative; overflow:hidden; transition:transform .18s,box-shadow .18s; }
.mk-why-card:before{ content:""; position:absolute; top:0; left:0; width:100%; height:5px; background:linear-gradient(90deg,var(--mk-yellow),var(--mk-yellow-3)); }
.mk-why-card:hover{ transform:translateY(-4px); box-shadow:var(--mk-shadow-lg); }
.mk-why-card h3{ color:var(--mk-blue); margin-bottom:8px; }

/* ---------- Chips / Linklist ---------- */
.mk-chips{ list-style:none!important; margin:24px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:10px; }
.mk-chips li{ background:var(--mk-yellow-soft); border:1px solid var(--mk-yellow-3); border-radius:999px; padding:9px 16px; font-weight:700; font-size:.92rem; }
.mk-linklist{ list-style:none!important; margin:18px 0 0; padding:0; }
.mk-linklist li{ margin:8px 0; }
.mk-linklist a{ font-weight:700; display:inline-flex; gap:10px; align-items:center; }
.mk-linklist a:before{ content:"→"; color:var(--mk-yellow-3); font-weight:800; }

/* ---------- LEADCHECK ---------- */
.mk-leadcheck:not(.et_pb_section){ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; background:linear-gradient(135deg,var(--mk-ink) 0%,#15182b 100%); border-radius:var(--mk-radius-lg); padding:54px; box-shadow:var(--mk-shadow-lg); }
.mk-leadcheck-head h2,.mk-leadcheck-head .mk-eyebrow{ color:#fff; }
.mk-leadcheck-head .mk-eyebrow{ color:var(--mk-yellow); }
.mk-leadcheck-head p{ color:#c8cad6; }
.mk-leadcheck .mk-form{ margin:0; }
/* Nutzen-Checkliste links neben dem Formular */
.mk-leadcheck-benefits{ list-style:none!important; margin:24px 0 0; padding:0; }
.mk-leadcheck-benefits li{ position:relative; padding:10px 0 10px 34px; color:#e6e7f0; font-size:.98rem;
  border-top:1px solid rgba(255,255,255,.09); }
.mk-leadcheck-benefits li:first-child{ border-top:0; }
.mk-leadcheck-benefits li::before{ content:"✓"; position:absolute; left:0; top:10px; width:22px; height:22px;
  border-radius:50%; background:var(--mk-yellow); color:var(--mk-ink); font-weight:800; font-size:.78rem;
  display:grid; place-items:center; }

/* Lead-Formular (Shortcode) */
.mk-form:not(.et_pb_section){ background:#fff; border-radius:var(--mk-radius); padding:30px; box-shadow:var(--mk-shadow); }
.mk-field{ display:block; margin-bottom:14px; }
.mk-field span{ display:block; font-weight:600; font-size:.88rem; margin-bottom:6px; }
.mk-form input,.mk-form select,.mk-form textarea{ width:100%; padding:14px 16px; border:2px solid var(--mk-line); border-radius:12px; font-size:1rem; }
.mk-form input:focus,.mk-form select:focus,.mk-form textarea:focus{ outline:none; border-color:var(--mk-blue); }
.mk-form-btn{ width:100%; margin-top:6px; padding:16px; border:0; border-radius:12px; background:var(--mk-blue); color:#fff; font-weight:700; font-size:1.05rem; cursor:pointer; transition:transform .15s,box-shadow .15s,background .15s; }
.mk-form-btn:hover{ background:var(--mk-blue-dark); transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,0,240,.3); }
.mk-form-hint{ margin-top:12px; font-size:.84rem; color:var(--mk-muted); text-align:center; }

/* ---------- PROOF ---------- */
.mk-quote{ max-width:840px; margin:0 auto; background:#fff; border-left:6px solid var(--mk-yellow); border-radius:var(--mk-radius); box-shadow:var(--mk-shadow); padding:44px 46px; }
.mk-quote blockquote{ font-size:1.4rem; font-style:italic; line-height:1.5; margin:0 0 20px; color:var(--mk-ink); }
.mk-quote figcaption{ display:flex; align-items:center; gap:14px; }
.mk-quote figcaption img{ width:54px; height:54px; border-radius:50%; object-fit:cover; }
.mk-quote figcaption strong{ color:var(--mk-blue); display:block; }
.mk-quote figcaption em{ color:var(--mk-muted); font-style:normal; font-size:.9rem; }
.mk-logos{ display:flex; gap:34px; justify-content:center; align-items:center; flex-wrap:wrap; margin-top:36px; }
.mk-logos img{ height:42px; filter:grayscale(1); opacity:.7; }

/* ---------- PLANS ---------- */
.mk-plans{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:38px; align-items:start; }
.mk-plan{ background:#fff; border:1px solid var(--mk-line); border-radius:var(--mk-radius-lg); padding:34px 30px; box-shadow:var(--mk-shadow); position:relative; }
.mk-plan--featured{ border:2px solid var(--mk-blue); box-shadow:var(--mk-shadow-lg); transform:translateY(-8px); }
.mk-plan-badge{ position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--mk-blue); color:#fff; font-weight:700; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; padding:6px 16px; border-radius:999px; }
.mk-plan-name{ color:var(--mk-ink); font-size:1.5rem; }
.mk-plan-tag{ color:var(--mk-muted); margin:.3em 0 1em; min-height:2.6em; }
.mk-plan-price{ margin-bottom:18px; }
.mk-plan-amount{ font-size:2.6rem; font-weight:800; color:var(--mk-blue); letter-spacing:-.03em; }
.mk-plan-per{ color:var(--mk-muted); font-weight:600; }
.mk-plan-price--ask{ font-size:1.8rem; font-weight:800; color:var(--mk-ink); }
.mk-plan-cta{ width:100%; text-align:center; }
.mk-plan-group{ display:flex; align-items:center; gap:10px; margin:28px 0 8px; font-size:.82rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:var(--mk-ink); }
.mk-plan-group::before{ content:""; flex:0 0 auto; width:18px; height:3px; border-radius:3px; background:var(--mk-blue); }
.mk-plan-group::after{ content:""; flex:1 1 auto; height:1px; background:var(--mk-line); }
.mk-plan-group:first-of-type{ margin-top:20px; }
.mk-plan-feats{ list-style:none!important; margin:22px 0 0; padding:0; }
.mk-plan-group + .mk-plan-feats{ margin-top:6px; }
.mk-plan-feats li{ padding:8px 0 8px 28px; position:relative; color:var(--mk-ink-2); border-top:1px solid var(--mk-line); }
.mk-plan-feats li:before{ content:"✓"; position:absolute; left:0; color:var(--mk-blue); font-weight:800; }
.mk-plans-note{ margin-top:22px; color:var(--mk-muted); }
/* Feature-Punkt: Link + "?"-Tooltip (Plaene & Vergleich, editierbar via Backend „Preise & Pläne“) */
.mk-feat-link{ color:var(--mk-ink-2); text-decoration:none; border-bottom:1px dashed var(--mk-line); }
.mk-feat-link:hover,.mk-feat-link:focus{ color:var(--mk-blue); border-bottom-color:var(--mk-blue); }
.mk-tip{ display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; margin-left:4px; border-radius:50%; background:#c9ccd8; color:var(--mk-ink); font-size:11px; font-weight:800; line-height:1; cursor:help; position:relative; vertical-align:middle; user-select:none; }
.mk-tip:hover,.mk-tip:focus{ background:var(--mk-blue); color:#fff; outline:none; }
.mk-tip:hover::after,.mk-tip:focus::after{ content:attr(data-tip); position:absolute; left:50%; bottom:150%; transform:translateX(-50%); z-index:120; width:260px; max-width:72vw; white-space:normal; text-align:left; background:var(--mk-ink); color:#fff; padding:9px 11px; border-radius:8px; font-size:12px; font-weight:400; line-height:1.5; box-shadow:0 6px 20px rgba(0,0,0,.22); }
.mk-tip:hover::before,.mk-tip:focus::before{ content:""; position:absolute; left:50%; bottom:150%; transform:translate(-50%,90%); border:6px solid transparent; border-top-color:var(--mk-ink); z-index:121; }
.mk-compare td .mk-tip{ vertical-align:baseline; }

/* ---------- COMPARE ---------- */
.mk-compare{ overflow-x:auto; margin-top:30px; }
.mk-compare table{ width:100%; border-collapse:collapse; background:#fff; border-radius:var(--mk-radius); overflow:hidden; box-shadow:var(--mk-shadow); }
.mk-compare th,.mk-compare td{ padding:14px 16px; text-align:center; border-bottom:1px solid var(--mk-line); }
.mk-compare thead th{ background:var(--mk-ink); color:#fff; }
.mk-compare-price{ display:block; font-weight:600; font-size:.82rem; color:var(--mk-yellow); margin-top:4px; }
.mk-compare td:first-child,.mk-compare th:first-child{ text-align:left; }
.mk-compare-group td{ background:var(--mk-bg-soft); font-weight:800; color:var(--mk-blue); text-align:left!important; text-transform:uppercase; letter-spacing:.08em; font-size:.82rem; border-left:4px solid var(--mk-blue); padding-top:18px!important; padding-bottom:12px!important; }
.mk-yes{ color:var(--mk-blue); font-weight:800; } .mk-no{ color:#c2c5d0; }

/* ---------- FAQ ---------- */
.mk-faq:not(.et_pb_section){ max-width:820px; margin:30px auto 0; }
.mk-faq-item{ background:#fff; border:1px solid var(--mk-line); border-radius:14px; box-shadow:var(--mk-shadow); margin-bottom:12px; overflow:hidden; }
.mk-faq-item summary{ cursor:pointer; padding:20px 24px; font-weight:700; list-style:none; display:flex; justify-content:space-between; align-items:center; }
.mk-faq-item summary:after{ content:"+"; color:var(--mk-blue); font-weight:800; font-size:1.4rem; }
.mk-faq-item[open] summary:after{ content:"–"; }
.mk-faq-a{ padding:0 24px 20px; color:var(--mk-ink-2); }

/* ---------- CTA / FINAL ---------- */
.mk-ctabox,.mk-final:not(.et_pb_section){ background:linear-gradient(120deg,var(--mk-blue),var(--mk-blue-2)); color:#fff; border-radius:var(--mk-radius-lg); padding:64px 52px; text-align:center; box-shadow:var(--mk-shadow-lg); position:relative; overflow:hidden; }
.mk-ctabox:after,.mk-final:not(.et_pb_section):after{ content:""; position:absolute; inset:0; background:url('brand-pattern.svg') right center/cover no-repeat; opacity:.45; pointer-events:none; }
.mk-ctabox h2,.mk-final h2,.mk-ctabox p,.mk-final p{ color:#fff; position:relative; }
.mk-ctabox .mk-btn--primary,.mk-final .mk-btn--primary{ background:var(--mk-yellow); border-color:var(--mk-yellow); color:var(--mk-ink); position:relative; }
.mk-ctabox .mk-btn--primary:hover,.mk-final .mk-btn--primary:hover{ background:var(--mk-yellow-3); border-color:var(--mk-yellow-3); }
.mk-final .mk-hero-cta{ justify-content:center; position:relative; }
.mk-reassure{ margin-top:18px; opacity:.85; font-size:.92rem; }

.mk-disclaimer{ font-size:.82rem; color:var(--mk-muted); }

/* ---------- CTA-Leiste oben (im Header-Bereich, überdeckt nichts) ----------
   Höhen werden von mk.js LIVE gemessen (--mk-topbar-h, --mk-th-h) – die Werte
   hier sind nur Fallbacks. Auch Divis gelbe Sekundärleiste (#top-header) wird
   mit nach unten geschoben, damit sich nichts überlagert.                     */
:root{ --mk-topbar-h:48px; --mk-th-h:0px; }
#mk-topbar{ position:fixed; top:0; left:0; right:0; z-index:100002; min-height:var(--mk-topbar-h);
  background:rgba(11,13,26,.96); color:#fff; display:flex; align-items:center; justify-content:center;
  gap:18px; padding:9px 18px; box-shadow:0 2px 14px rgba(0,0,0,.18); flex-wrap:nowrap; }
#mk-topbar strong{ font-weight:700; }
#mk-topbar .mk-topbar-txt{ white-space:nowrap; }
#mk-topbar .mk-btn{ padding:10px 20px; white-space:nowrap; }
@media (max-width:900px){ #mk-topbar .mk-topbar-txt{ display:none; } }

/* Platz-Kompensation macht mk.js komplett per Inline-Style (body-margin +
   top-Werte auf #top-header/#main-header): Divi verwaltet #page-container
   und Header-Positionen beim Scrollen selbst inline – CSS-Regeln hier
   würden von Divi wieder überschrieben. */

/* ---------- Header / Footer ---------- */
#main-header{ box-shadow:0 1px 0 var(--mk-line); }
#top-menu li a{ font-weight:600; color:var(--mk-ink); }
#top-menu li a:hover,#top-menu li.current-menu-item a{ color:var(--mk-blue); }
.et_header_style_left #logo,#logo{ max-height:70px; width:auto; }

/* Header-Navigation: kein Zeilenumbruch bei laengeren Sprach-Labels (FR/IT/DE).
   Menuepunkte bleiben einzeilig; Abstaende leicht kompakter, damit alle 4
   Sprachen in eine Zeile passen. Greift unabhaengig davon, ob Divi float/flex nutzt. */
#et-top-navigation{ white-space:nowrap; }
#et-top-navigation #top-menu{ flex-wrap:nowrap; }
#top-menu > li{ white-space:nowrap; }
#top-menu > li > a{ white-space:nowrap; }
#et-top-navigation nav > ul > li{ padding-right:18px; }
#top-menu li.mk-nav-cta{ padding-right:12px; }
#main-footer{ background:var(--mk-ink)!important; }
#main-footer,#main-footer p,#main-footer li,#main-footer .et_pb_widget{ color:#c8cad6!important; }
#main-footer h1,#main-footer h2,#main-footer h3,#main-footer h4{ color:#fff!important; }
#main-footer a{ color:var(--mk-yellow)!important; }
#footer-bottom{ background:#07080f!important; }
#footer-info,#footer-info a{ color:#8a8d9c!important; }
.mk-foot-disc{ color:#6b6e7d; font-size:.8rem; }

/* ---------- CASES (Fall-Karten) ---------- */
.mk-cases:not(.et_pb_section){ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; margin-top:34px; }
.mk-case{ background:#fff; border:1px solid var(--mk-line); border-radius:var(--mk-radius); padding:26px 28px; box-shadow:var(--mk-shadow); }
.mk-case-vs{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.mk-case-a,.mk-case-b{ font-weight:800; font-size:1.05rem; padding:6px 12px; border-radius:10px; background:var(--mk-bg-soft); border:1px solid var(--mk-line); }
.mk-case-b{ color:var(--mk-blue); border-color:var(--mk-blue); }
.mk-case-x{ color:var(--mk-muted); font-weight:700; text-transform:uppercase; font-size:.75rem; letter-spacing:.1em; }
.mk-verdict{ display:inline-block; font-weight:800; font-size:.8rem; padding:5px 12px; border-radius:999px; margin-bottom:12px; }
.mk-verdict--yes{ background:#fdecec; color:#c0392b; }
.mk-verdict--no{ background:#e8f6ee; color:#1e8e4f; }
.mk-case-story{ color:var(--mk-ink-2); }
.mk-case-lehre{ color:var(--mk-ink); background:var(--mk-yellow-soft); border-radius:10px; padding:10px 14px; font-size:.95rem; }
.mk-case-src{ color:var(--mk-muted); font-size:.78rem; margin-top:10px; }
.mk-case-link{ display:inline-block; margin-top:14px; font-weight:800; font-size:.9rem; color:var(--mk-blue); text-decoration:none; }
.mk-case-link span{ transition:transform .15s ease; display:inline-block; }
.mk-case-link:hover span{ transform:translateX(4px); }

/* ---------- CALLOUT (Merksatz/Definition) ---------- */
.mk-callout:not(.et_pb_section){ background:linear-gradient(135deg,#fff 0%,var(--mk-yellow-soft) 220%); border:1px solid var(--mk-yellow-3); border-left:6px solid var(--mk-yellow); border-radius:var(--mk-radius); padding:30px 34px; box-shadow:var(--mk-shadow); max-width:880px; }
.mk-callout-eyebrow{ display:inline-block; text-transform:uppercase; letter-spacing:.14em; font-weight:800; font-size:.74rem; color:var(--mk-blue); margin-bottom:8px; }
.mk-callout h3,.mk-callout .mk-callout-title{ color:var(--mk-ink); margin:0 0 8px; font-size:1.4rem; font-weight:800; letter-spacing:-.025em; line-height:1.2; }
.mk-callout p{ color:var(--mk-ink-2); font-size:1.05rem; }

/* ---------- Icons ---------- */
.mk-ic{ width:1.4em; height:1.4em; flex:0 0 auto; }

/* ---------- VS (Aufwand-Vergleich) ---------- */
.mk-vs:not(.et_pb_section){ display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:34px; align-items:start; }
.mk-vs-col{ background:#fff; border:1px solid var(--mk-line); border-radius:var(--mk-radius-lg); padding:32px 30px; box-shadow:var(--mk-shadow); }
.mk-vs-col h3{ font-size:1.25rem; margin-bottom:18px; }
.mk-vs-col ul{ list-style:none!important; margin:0; padding:0; }
.mk-vs-col li{ display:flex; gap:12px; align-items:flex-start; padding:11px 0; border-top:1px solid var(--mk-line); color:var(--mk-ink-2); }
.mk-vs-col li:first-child{ border-top:0; }
.mk-vs-bad{ background:var(--mk-bg-soft); }
.mk-vs-bad h3{ color:var(--mk-muted); }
.mk-vs-bad .mk-ic{ color:#c0392b; }
.mk-vs-good{ border:2px solid var(--mk-blue); box-shadow:var(--mk-shadow-lg); }
.mk-vs-good h3{ color:var(--mk-blue); }
.mk-vs-good .mk-ic{ color:#1e8e4f; }
.mk-vs-good .mk-btn{ margin-top:18px; width:100%; text-align:center; }

/* ---------- ANALYSIS (Prüf-Tiefe) ---------- */
.mk-analysis{ background:var(--mk-bg-soft); }
.mk-adim-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:34px; }
.mk-adim{ background:#fff; border:1px solid var(--mk-line); border-radius:var(--mk-radius); padding:28px 26px; box-shadow:var(--mk-shadow); transition:transform .18s,box-shadow .18s; }
.mk-adim:hover{ transform:translateY(-4px); box-shadow:var(--mk-shadow-lg); }
.mk-adim-ic{ width:52px; height:52px; border-radius:14px; display:grid; place-items:center; background:linear-gradient(135deg,var(--mk-yellow-soft),var(--mk-yellow)); color:var(--mk-ink); margin-bottom:16px; }
.mk-adim-ic .mk-ic{ width:26px; height:26px; }
.mk-adim h3{ color:var(--mk-ink); font-size:1.12rem; margin-bottom:6px; }
.mk-adim p{ color:var(--mk-muted); font-size:.96rem; }
.mk-analysis-claim{ display:flex; align-items:center; gap:12px; justify-content:center; margin:30px auto 0; max-width:760px; background:var(--mk-blue); color:#fff; font-weight:700; font-size:1.1rem; padding:18px 26px; border-radius:14px; box-shadow:var(--mk-shadow); }
.mk-analysis-claim .mk-ic{ color:var(--mk-yellow); width:28px; height:28px; }

/* ---------- MOCKUP (Warnung) ---------- */
.mk-mock{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.mk-mock-card{ background:#fff; border:1px solid var(--mk-line); border-radius:var(--mk-radius-lg); box-shadow:var(--mk-shadow-lg); padding:24px; max-width:440px; }
.mk-mock-head{ display:flex; align-items:center; gap:10px; font-weight:700; color:var(--mk-ink); padding-bottom:14px; border-bottom:1px solid var(--mk-line); }
.mk-mock-head .mk-ic{ color:var(--mk-blue); }
.mk-mock-risk{ margin-left:auto; font-size:.78rem; font-weight:800; padding:4px 10px; border-radius:999px; }
.mk-risk-high{ background:#fdecec; color:#c0392b; }
.mk-risk-mid{ background:#fff4e0; color:#b8730a; }
.mk-risk-low{ background:#e8f6ee; color:#1e8e4f; }
.mk-mock-pair{ display:grid; grid-template-columns:1fr auto 1fr; gap:12px; align-items:center; margin:18px 0; }
.mk-mock-cell{ background:var(--mk-bg-soft); border:1px solid var(--mk-line); border-radius:12px; padding:12px 14px; text-align:center; }
.mk-mock-k{ display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:var(--mk-muted); margin-bottom:4px; }
.mk-mock-v{ font-weight:800; font-size:1.1rem; }
.mk-mock-new{ color:var(--mk-blue); }
.mk-mock-arrow{ color:var(--mk-yellow-3); font-weight:800; font-size:1.4rem; }
.mk-mock-types{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.mk-mock-type{ background:var(--mk-yellow-soft); border:1px solid var(--mk-yellow-3); border-radius:999px; padding:4px 12px; font-size:.8rem; font-weight:700; }
.mk-mock-meta{ color:var(--mk-muted); font-size:.84rem; margin-bottom:14px; }
.mk-mock-foot{ display:flex; align-items:center; gap:10px; color:var(--mk-ink-2); font-size:.9rem; padding-top:14px; border-top:1px solid var(--mk-line); }
.mk-mock-foot .mk-ic{ color:var(--mk-blue); }

/* ---------- LIVE (Scale-Band) ---------- */
.mk-livesec{ background:linear-gradient(120deg,var(--mk-ink) 0%,#15182b 100%); }
.mk-livesec h2,.mk-livesec .mk-eyebrow,.mk-livesec .mk-sub,.mk-livesec p{ color:#fff; }
.mk-livesec .mk-eyebrow{ color:var(--mk-yellow); }
.mk-live{ display:grid; grid-template-columns:auto 1fr; gap:36px; align-items:center; margin-top:24px; }
.mk-live-main{ text-align:center; padding:24px 30px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.12); border-radius:var(--mk-radius-lg); }
.mk-live-num{ display:block; font-size:clamp(3rem,7vw,5rem); font-weight:800; color:var(--mk-yellow); line-height:1; letter-spacing:-.03em; }
.mk-live-cap{ display:block; margin-top:8px; color:#dfe0ff; max-width:22ch; }
.mk-live-side{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.mk-live-kpi{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.10); border-radius:14px; padding:18px; text-align:center; }
.mk-live-kpi strong{ display:block; font-size:1.6rem; color:#fff; }
.mk-live-kpi span{ color:#aeb0c6; font-size:.86rem; }
.mk-live-ticker{ grid-column:1 / -1; overflow:hidden; border-top:1px solid rgba(255,255,255,.12); margin-top:10px; padding-top:14px; }
.mk-live-track{ display:flex; gap:34px; white-space:nowrap; animation:mk-marquee 32s linear infinite; }
.mk-live-item{ color:#c8cad6; font-size:.88rem; display:inline-flex; align-items:center; gap:8px; }
.mk-live-item i{ width:8px; height:8px; border-radius:50%; background:#2ec26b; box-shadow:0 0 0 4px rgba(46,194,107,.18); }
@keyframes mk-marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .mk-live-track{ animation:none; } }

/* ---------- Footer-Logo (CSS – Divi 5 entfernt <img> aus Credits) ---------- */
.mk-foot::before{
  content:""; display:block; width:220px; max-width:70%; height:48px; margin:0 auto 18px;
  background:url('https://marken-kanzlei.ch/wp-content/uploads/2026/06/logo-marken-kanzlei-transparent-png-scaled.png') center center/contain no-repeat;
  filter:brightness(0) invert(1); opacity:.92;
}
.mk-foot-logo{ display:none; }

/* ---------- Figure / Bild ---------- */
.mk-figure{ margin:0 auto; max-width:960px; }
.mk-figure img{ width:100%; height:auto; display:block; border-radius:var(--mk-radius-lg); box-shadow:var(--mk-shadow-lg); }
.mk-figure figcaption{ margin-top:12px; text-align:center; color:var(--mk-muted); font-size:.9rem; }

/* ---------- Timeline ---------- */
.mk-timeline:not(.et_pb_section){ display:flex; margin-top:42px; }
.mk-tl-step{ flex:1 1 0; position:relative; padding:0 14px; text-align:center; }
.mk-tl-step::before{ content:""; position:absolute; top:22px; left:0; right:0; height:3px; background:var(--mk-line); z-index:0; }
.mk-tl-step:first-child::before{ left:50%; }
.mk-tl-step:last-child::before{ right:50%; }
.mk-tl-dot{ position:relative; z-index:1; width:46px; height:46px; border-radius:50%; background:var(--mk-blue); color:#fff; font-weight:800; display:grid; place-items:center; margin:0 auto 16px; box-shadow:0 0 0 6px #fff; }
.mk-tl--danger .mk-tl-dot{ background:#c0392b; box-shadow:0 0 0 6px #fff; }
.mk-tl-step h3{ font-size:1.05rem; color:var(--mk-ink); margin-bottom:6px; }
.mk-tl-step p{ font-size:.92rem; color:var(--mk-muted); }

/* ---------- Hub-and-Spoke ---------- */
.mk-hub{ width:100%; max-width:600px; height:auto; margin:26px auto 0; display:block; overflow:visible; }
.mk-hub-lines line{ stroke:var(--mk-yellow-3); stroke-width:2; }
.mk-hub-spoke circle{ fill:#fff; stroke:var(--mk-blue); stroke-width:2; }
.mk-hub-stext text{ fill:var(--mk-ink); font-family:'Inter',sans-serif; font-weight:600; font-size:13px; }
.mk-hub-core{ fill:var(--mk-blue); }
.mk-hub-ctext{ fill:#fff; font-family:'Inter',sans-serif; font-weight:800; font-size:15px; }

/* ---------- Marken-Risiko-Demo ---------- */
.mk-demo{ background:linear-gradient(135deg,var(--mk-ink) 0%,#15182b 100%); border-radius:var(--mk-radius-lg); padding:48px; box-shadow:var(--mk-shadow-lg); }
.mk-demo-head h2,.mk-demo-head p{ color:#fff; }
.mk-demo-head .mk-eyebrow{ color:var(--mk-yellow); }
.mk-demo-form{ max-width:680px; margin:22px 0 0; }
/* Schritt 2 darf breiter werden, damit Marke + Produkt nebeneinander Platz haben */
.mk-demo-form.is-step2{ max-width:980px; }
.mk-demo-fields{ display:flex; flex-direction:column; gap:16px; }
.mk-demo-row{ display:flex; flex-direction:column; gap:16px; }
.mk-demo-field{ display:block; }
.mk-demo-input,.mk-demo-product{ width:100%; padding:18px 22px; border:2px solid rgba(255,255,255,.18); border-radius:14px; background:rgba(255,255,255,.05); color:#fff; font-size:1.08rem; font-family:'Inter',sans-serif; }
.mk-demo-input::placeholder,.mk-demo-product::placeholder{ color:#9a9db4; }
.mk-demo-input:focus,.mk-demo-product:focus{ outline:none; border-color:var(--mk-yellow); box-shadow:0 0 0 4px rgba(245,218,35,.15); }
/* Schritt 1: grosses, einladendes Markenfeld */
.mk-demo-form.is-step1 .mk-demo-input{ padding:26px 26px; font-size:clamp(1.4rem,3.2vw,2rem); font-weight:800; letter-spacing:-.01em; text-align:center; }
/* Produkt-Schritt erst nach „Marken-Radar starten" sichtbar */
.mk-demo-form.is-step1 .mk-demo-field--product,
.mk-demo-form.is-step1 .mk-demo-help,
.mk-demo-form.is-step1 .mk-demo-skip{ display:none; }
.mk-demo-form.is-step2 .mk-demo-field--product{ animation:mk-rise .4s ease both; }
/* Schritt 2: Marke + Produkt nebeneinander, beide gross (unten bündig trotz Label) */
.mk-demo-form.is-step2 .mk-demo-row{ flex-direction:row; align-items:flex-end; gap:18px; }
.mk-demo-form.is-step2 .mk-demo-row .mk-demo-field{ flex:1 1 0; min-width:0; }
/* Produktfeld breiter – Produktnamen sind meist länger als die Marke */
.mk-demo-form.is-step2 .mk-demo-field--product{ flex-grow:1.5; }
.mk-demo-form.is-step2 .mk-demo-input,
.mk-demo-form.is-step2 .mk-demo-product{ padding:24px 24px; font-size:clamp(1.2rem,1.8vw,1.55rem); font-weight:700; }
.mk-demo-q{ display:block; color:#fff; font-weight:800; font-size:1.15rem; margin-bottom:10px; }
.mk-demo-actions{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.mk-demo-go{ white-space:nowrap; padding-left:34px; padding-right:34px; }
.mk-demo-skip{ background:none; border:0; color:#9a9db4; font-weight:600; font-size:.92rem; text-decoration:underline; cursor:pointer; padding:6px; }
.mk-demo-skip:hover{ color:#fff; }

/* Rädchen / Spin-Animation (Gamification) */
.mk-demo-spin{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; padding:40px 0 8px; }
.mk-wheel{ width:120px; height:120px; border-radius:50%; position:relative;
  background:conic-gradient(var(--mk-yellow) 0deg, var(--mk-blue) 130deg, #15182b 250deg, var(--mk-yellow) 360deg);
  animation:mk-rot 1s linear infinite; box-shadow:0 0 40px rgba(245,218,35,.25); }
.mk-wheel span{ position:absolute; inset:14px; border-radius:50%; background:var(--mk-ink); box-shadow:inset 0 0 0 2px rgba(255,255,255,.06); }
.mk-spin-msg{ color:#fff; font-weight:700; font-size:1.05rem; text-align:center; }
@media (prefers-reduced-motion:reduce){ .mk-wheel{ animation:none; } }

/* Nizza-Einschätzung im Ergebnis */
.mk-demo-nizza{ margin-top:26px; background:rgba(245,218,35,.10); border:1px solid rgba(245,218,35,.35); border-radius:14px; padding:20px 22px; }
.mk-demo-nizza h4{ color:var(--mk-yellow); font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; margin-bottom:12px; }
.mk-nizza-classes{ display:flex; flex-wrap:wrap; gap:8px; }
.mk-nizza-chip{ background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.18); color:#fff; font-weight:700; font-size:.9rem; padding:6px 12px; border-radius:999px; }
.mk-nizza-note{ color:#d7d9e6; font-size:.9rem; margin:12px 0 0; }
.mk-demo-note,.mk-demo-disc{ color:#9a9db4; font-size:.82rem; margin-top:14px; }
.mk-demo-loading{ color:#fff; margin-top:26px; display:flex; align-items:center; gap:12px; font-weight:600; }
.mk-spin{ width:18px; height:18px; border:3px solid rgba(255,255,255,.25); border-top-color:var(--mk-yellow); border-radius:50%; animation:mk-rot .8s linear infinite; }
@keyframes mk-rot{ to{ transform:rotate(360deg); } }
.mk-demo-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin-top:26px; }
.mk-demo-card{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:14px; padding:20px; cursor:pointer; }
.mk-demo-card:focus-visible{ outline:2px solid var(--mk-yellow); outline-offset:3px; }
.mk-demo-card h4{ font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; margin-bottom:12px; }
.mk-demo-card h4 a{ color:var(--mk-yellow); text-decoration:none; display:inline-flex; flex-wrap:wrap; align-items:baseline; gap:8px; }
.mk-demo-card h4 a:hover{ text-decoration:underline; }
.mk-demo-more{ color:#c8cad6; font-size:.7rem; font-weight:600; text-transform:none; letter-spacing:.02em; }
.mk-demo-card ul{ list-style:none; margin:0; padding:0; }
.mk-demo-card li{ padding:10px 0; border-top:1px solid rgba(255,255,255,.08); }
.mk-demo-card li:first-child{ border-top:0; }
.mk-demo-name{ display:block; color:#fff; font-weight:800; font-size:1.3rem; letter-spacing:-.01em; }
.mk-demo-reason{ display:block; color:#c8cad6; font-size:.9rem; margin-top:4px; }
.mk-demo-cta{ margin-top:26px; background:rgba(245,218,35,.10); border:1px solid rgba(245,218,35,.35); border-radius:14px; padding:24px; text-align:center; }
.mk-demo-cta p{ color:#fff; margin-bottom:16px; }

/* ---- Marken-Radar: Hilfetext, Ergebnis-Headline, Kategorie-Erklärungen, CTA-Feinheiten ---- */
.mk-demo-help{ color:#9a9db4; font-size:.86rem; margin:8px 0 0; }
/* Ergebnis: erklärende Headline + Intro */
.mk-demo-rhead{ color:#fff; font-size:clamp(1.3rem,2.6vw,1.7rem); font-weight:800; letter-spacing:-.01em; margin:30px 0 0; }
.mk-demo-rsub{ color:var(--mk-yellow); font-weight:700; font-size:.95rem; margin:8px 0 0; }
.mk-demo-intro{ color:#c8cad6; font-size:1rem; margin:10px 0 0; max-width:760px; }
/* Kategorie-Karten: Fachbegriff (dezent) + laienverständliche Erklärung */
.mk-demo-term{ color:#9a9db4; font-size:.72rem; text-transform:none; letter-spacing:.01em; margin:0 0 6px; font-style:italic; }
.mk-demo-desc{ color:#c8cad6; font-size:.88rem; line-height:1.5; margin:0 0 14px; }
/* Begründung je Beispiel mit hervorgehobenem Label */
.mk-demo-reason-l{ color:#9a9db4; font-weight:700; }
/* Nizza-Block: vorsichtiger Einleitungstext */
.mk-nizza-lead{ color:#d7d9e6; font-size:.92rem; line-height:1.5; margin:0 0 14px; }
/* CTA-Box: Titel, ehrlicher START-Hinweis, Sekundär-Link */
.mk-demo-cta-h{ color:#fff; font-size:1.25rem; font-weight:800; margin:0 0 10px; }
.mk-demo-cta-fine{ color:#c8cad6; font-size:.82rem; line-height:1.5; margin:16px auto 0; max-width:560px; }
.mk-demo-cta-link{ display:inline-block; margin-top:12px; color:var(--mk-yellow); font-weight:700; font-size:.9rem; text-decoration:underline; }
.mk-demo-cta-link:hover{ color:#fff; }

/* ---- Ergebnis-Modal (vergrösserter Kasten) ---- */
body.mk-modal-open{ overflow:hidden; }
.mk-modal-ov{ position:fixed; inset:0; z-index:99999; display:flex; align-items:center; justify-content:center; padding:24px;
  background:rgba(8,9,18,.74); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); animation:mk-fade .2s ease both; }
.mk-modal-ov[hidden]{ display:none; }
.mk-modal{ position:relative; width:100%; max-width:660px; max-height:88vh; overflow:auto;
  background:linear-gradient(135deg,var(--mk-ink) 0%,#1b1f36 100%); border:1px solid rgba(245,218,35,.35);
  border-radius:18px; padding:38px 38px 34px; box-shadow:var(--mk-shadow-lg); animation:mk-rise .25s ease both; }
.mk-modal-x{ position:absolute; top:12px; right:16px; background:none; border:0; color:#9a9db4; font-size:2rem; line-height:1; cursor:pointer; padding:4px 8px; }
.mk-modal-x:hover{ color:#fff; }
.mk-modal-eyebrow{ color:var(--mk-yellow); font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; font-weight:800; margin:0; }
.mk-modal-title{ color:#fff; font-size:clamp(1.4rem,3vw,2rem); font-weight:800; letter-spacing:-.01em; margin:6px 0 0; }
.mk-modal-term{ color:#9a9db4; font-style:italic; font-size:.85rem; margin:8px 0 0; }
.mk-modal-desc{ color:#c8cad6; font-size:1rem; line-height:1.55; margin:12px 0 0; }
.mk-modal-list{ list-style:none; margin:22px 0 0; padding:0; }
.mk-modal-list li{ padding:18px 0; border-top:1px solid rgba(255,255,255,.1); }
.mk-modal-list li:first-child{ border-top:0; }
.mk-modal-name{ display:block; color:#fff; font-weight:800; font-size:clamp(1.6rem,4vw,2.2rem); letter-spacing:-.01em; }
.mk-modal-reason{ display:block; color:#c8cad6; font-size:1rem; line-height:1.5; margin-top:6px; }
.mk-modal-more{ display:inline-block; margin-top:26px; }
@keyframes mk-fade{ from{ opacity:0; } to{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ .mk-modal-ov,.mk-modal{ animation:none; } }

/* ---------- Header-CTA im Menü ---------- */
#top-menu li.mk-nav-cta > a,
.et_pb_menu li.mk-nav-cta > a,
nav li.mk-nav-cta > a{ background:var(--mk-yellow); color:var(--mk-ink)!important; border-radius:10px; padding:9px 16px!important; font-weight:800; line-height:1; opacity:1!important; transition:transform .15s ease, box-shadow .15s ease; }
#top-menu li.mk-nav-cta > a:hover{ transform:translateY(-1px); box-shadow:0 8px 22px rgba(245,218,35,.45); }

/* ---------- Top-Bar (Divi Sekundärmenü) gelb statt blau ---------- */
#top-header{ background:var(--mk-yellow) !important; box-shadow:inset 0 -1px 0 rgba(11,13,26,.10); }
#top-header, #top-header a, #top-header #et-secondary-nav li a, #top-header .et-social-icon a, #top-header span{ color:var(--mk-ink) !important; opacity:1 !important; }
#top-header a:hover{ color:var(--mk-blue) !important; }

/* ============================ Lebendigkeit / Effekte v1.1 ============================ */
/* Weiche Sektions-Glows für Tiefe (nur auf der Sektion, nicht inneren Containern) */
.et_pb_section[class*="mk-"]{ position:relative; }
.et_pb_section[class*="mk-"] > .et_pb_row{ position:relative; z-index:1; }
.et_pb_section.mk-analysis::before,.et_pb_section.mk-why::before,.et_pb_section.mk-similarity::before,
.et_pb_section.mk-pricing::before,.et_pb_section.mk-cases::before,.et_pb_section.mk-faq::before{
  content:""; position:absolute; z-index:0; width:520px; height:520px; border-radius:50%; top:-160px; right:-120px;
  background:radial-gradient(circle at center, rgba(245,218,35,.20), transparent 68%); pointer-events:none; }
.et_pb_section.mk-why::after,.et_pb_section.mk-pricing::after,.et_pb_section.mk-faq::after{
  content:""; position:absolute; z-index:0; width:460px; height:460px; border-radius:50%; bottom:-180px; left:-140px;
  background:radial-gradient(circle at center, rgba(0,0,240,.10), transparent 68%); pointer-events:none; }

/* Feines Punktraster auf dunklen Sektionen */
.et_pb_section.mk-livesec::before, .et_pb_section.mk-demosec::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.55;
  background-image:radial-gradient(rgba(255,255,255,.10) 1.4px, transparent 1.4px); background-size:26px 26px;
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 78%); mask-image:linear-gradient(180deg,#000,transparent 78%); }

/* Einheitlicher Karten-Hover + gelbe Akzentkante */
.mk-sim-card,.mk-case,.mk-adim{ position:relative; }
.mk-risk-card,.mk-sim-card,.mk-case,.mk-step,.mk-plan,.mk-adim,.mk-why-card{
  transition:transform .22s cubic-bezier(.2,.7,.2,1), box-shadow .22s ease, border-color .22s ease; }
.mk-risk-card:hover,.mk-sim-card:hover,.mk-case:hover,.mk-step:hover,.mk-adim:hover,.mk-why-card:hover{
  transform:translateY(-6px); box-shadow:var(--mk-shadow-lg); border-color:var(--mk-yellow); }
.mk-plan:hover{ transform:translateY(-6px); box-shadow:var(--mk-shadow-lg); }
.mk-plan--featured:hover{ transform:translateY(-12px); }
.mk-risk-card::after,.mk-sim-card::after,.mk-case::after,.mk-adim::after{
  content:""; position:absolute; left:0; top:0; height:4px; width:100%; transform:scaleX(0); transform-origin:left;
  background:linear-gradient(90deg,var(--mk-yellow),var(--mk-yellow-2)); transition:transform .25s ease; }
.mk-risk-card:hover::after,.mk-sim-card:hover::after,.mk-case:hover::after,.mk-adim:hover::after{ transform:scaleX(1); }

/* Demo-Ergebniskarten anheben + Icon-Mikrointeraktion */
.mk-demo-card{ transition:transform .2s ease, border-color .2s ease; }
.mk-demo-card:hover{ transform:translateY(-4px); border-color:rgba(245,218,35,.5); }
.mk-adim-ic{ transition:transform .25s ease; }
.mk-adim:hover .mk-adim-ic{ transform:rotate(-6deg) scale(1.06); }

/* Bild-Zoom */
.mk-figure{ overflow:hidden; }
.mk-figure img{ transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.mk-figure:hover img{ transform:scale(1.04); }

/* Button-Glanz beim Hover */
.mk-btn{ position:relative; overflow:hidden; }
.mk-btn::after{ content:""; position:absolute; top:0; left:-120%; width:60%; height:100%; transform:skewX(-20deg);
  background:linear-gradient(120deg, transparent, rgba(255,255,255,.35), transparent); transition:left .6s ease; pointer-events:none; }
.mk-btn:hover::after{ left:140%; }

/* Akzentlinie unter den Eyebrow-Labels */
.mk-eyebrow{ position:relative; padding-bottom:11px; }
.mk-eyebrow::after{ content:""; position:absolute; left:0; bottom:0; width:34px; height:3px; border-radius:3px;
  background:linear-gradient(90deg,var(--mk-blue),var(--mk-yellow)); }
.mk-livesec .mk-eyebrow::after,.mk-demosec .mk-eyebrow::after{ background:linear-gradient(90deg,var(--mk-yellow),#fff); }

/* Gestaffelte Einblendung der Karten in sichtbaren Grids (Plans ausgenommen wg. Featured-Transform) */
@media (prefers-reduced-motion:no-preference){
  .mk-risk-grid.is-in>*,.mk-why-grid.is-in>*,.mk-steps.is-in>*,.mk-sim-grid.is-in>*,
  .mk-cases.is-in>*,.mk-adim-grid.is-in>*,.mk-stats-grid.is-in>*{ animation:mk-rise .55s cubic-bezier(.2,.7,.2,1) both; }
  .mk-reveal.is-in>*:nth-child(2){ animation-delay:.06s; }
  .mk-reveal.is-in>*:nth-child(3){ animation-delay:.12s; }
  .mk-reveal.is-in>*:nth-child(4){ animation-delay:.18s; }
  .mk-reveal.is-in>*:nth-child(5){ animation-delay:.24s; }
  .mk-reveal.is-in>*:nth-child(6){ animation-delay:.30s; }
  .mk-reveal.is-in>*:nth-child(7){ animation-delay:.36s; }
  .mk-reveal.is-in>*:nth-child(8){ animation-delay:.42s; }
}
@keyframes mk-rise{ from{ opacity:0; transform:translateY(22px); } to{ opacity:1; transform:none; } }

/* Prüfsignal-Chips in der Analyse-Sektion */
.mk-adim-sig{ display:flex; flex-wrap:wrap; gap:7px; margin-top:14px; padding:0; list-style:none; }
.mk-adim-sig li{ font-size:.78rem; font-weight:600; color:var(--mk-ink-2); background:var(--mk-bg-soft);
  border:1px solid var(--mk-line); border-radius:999px; line-height:1.2; }
.mk-adim-sig li:not(:has(a)){ padding:5px 11px; }
.mk-adim-sig li a{ display:inline-block; padding:5px 11px; color:var(--mk-ink-2); text-decoration:none; border-radius:999px; transition:background .15s,color .15s; }
.mk-adim-sig li a::after{ content:" →"; color:var(--mk-blue); opacity:0; transition:opacity .15s; }
.mk-adim-sig li:hover a{ background:var(--mk-blue); color:#fff; }
.mk-adim-sig li:hover a::after{ opacity:1; color:#fff; }
.mk-adim:hover .mk-adim-sig li{ border-color:rgba(245,218,35,.6); }
.mk-adim h3 a{ color:inherit; text-decoration:none; }
.mk-adim h3 a:hover{ color:var(--mk-blue); }
.mk-adim-more{ font-size:.7rem; font-weight:700; color:var(--mk-blue); text-transform:uppercase; letter-spacing:.04em; white-space:nowrap; }

/* Venn-Diagramm (Waren/Klassen-Überschneidung) */
.mk-venn-wrap{ text-align:center; margin-top:18px; }
.mk-venn:not(.et_pb_section){ width:100%; max-width:520px; height:auto; }
.mk-venn-c{ mix-blend-mode:multiply; }
.mk-venn-a{ fill:rgba(0,0,240,.16); stroke:var(--mk-blue); stroke-width:2; }
.mk-venn-b{ fill:rgba(245,218,35,.30); stroke:#caa800; stroke-width:2; }
.mk-venn-lbl{ font:700 17px Inter,sans-serif; fill:var(--mk-ink); }
.mk-venn-ov{ font:800 15px Inter,sans-serif; fill:var(--mk-ink); }
.mk-venn-note{ color:var(--mk-muted); font-size:.9rem; margin-top:10px; }

/* Waage/Abwägung */
.mk-scale:not(.et_pb_section){ margin-top:18px; }
.mk-scale-svg{ display:block; width:240px; max-width:70%; height:auto; margin:0 auto 18px; }
.mk-scale-base,.mk-scale-beam{ stroke:var(--mk-ink); stroke-width:4; stroke-linecap:round; }
.mk-scale-piv{ fill:var(--mk-ink); }
.mk-scale-pan{ stroke-width:3; }
.mk-scale-up{ fill:rgba(192,57,43,.18); stroke:#c0392b; }
.mk-scale-down{ fill:rgba(30,142,79,.18); stroke:#1e8e4f; }
.mk-scale-cols{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.mk-scale-col{ background:#fff; border:1px solid var(--mk-line); border-radius:var(--mk-radius); padding:22px 24px; box-shadow:var(--mk-shadow); }
.mk-scale-col h3{ margin-bottom:12px; }
.mk-scale-col ul{ list-style:none; margin:0; padding:0; }
.mk-scale-col li{ display:flex; gap:10px; align-items:flex-start; padding:9px 0; border-top:1px solid var(--mk-line); color:var(--mk-ink-2); }
.mk-scale-col li:first-child{ border-top:0; }
.mk-scale-bad .mk-ic{ color:#c0392b; flex:0 0 auto; }
.mk-scale-good .mk-ic{ color:#1e8e4f; flex:0 0 auto; }

/* Back-to-Top-Button (Divi) in Markenblau */
.et_pb_scroll_top{ background-color:var(--mk-blue)!important; color:#fff!important; border-radius:10px!important; }
.et_pb_scroll_top:hover{ background-color:var(--mk-blue-dark)!important; }

/* ============================ Lebendigkeit / Effekte v0.6 ============================
   Alle Effekte sind im Divi-Editor steuerbar (Erweitert → CSS-Klasse):
   mk-no-anim (Aus-Schalter), mk-anim-rise, mk-anim-float, mk-anim-pulse,
   mk-anim-border, mk-anim-notify. Referenz: docs/design-effekte.md            */

/* Globaler Anim-Aus-Schalter je Sektion/Modul (bewusst mit !important) */
.mk-no-anim,.mk-no-anim *,.mk-no-anim::before,.mk-no-anim::after{
  animation:none!important; transition:none!important; }

/* Touch- & Anker-Komfort */
a,button{ -webkit-tap-highlight-color:transparent; }
[id]{ scroll-margin-top:calc(var(--mk-topbar-h) + 90px); }
@media (hover:none){
  .mk-btn:active,.mk-form-btn:active,.mk-demo-go:active{ transform:scale(.97); }
  .mk-risk-card:active,.mk-sim-card:active,.mk-case:active,.mk-adim:active,.mk-why-card:active{ transform:scale(.985); }
}

/* Formular: Fokus-Ring statt nur Border */
.mk-form input:focus,.mk-form select:focus,.mk-form textarea:focus{ box-shadow:0 0 0 4px rgba(0,0,240,.12); }

/* Logos: Farbe + Lift bei Hover */
.mk-logos img,.mk-trust img{ transition:filter .3s ease,opacity .3s ease,transform .3s ease; }
.mk-logos img:hover,.mk-trust img:hover{ filter:none; opacity:1; transform:translateY(-3px); }

/* Testimonial: Avatar-Ring + dekoratives Anführungszeichen */
.mk-quote{ position:relative; overflow:hidden; }
.mk-quote figcaption img{ box-shadow:0 0 0 3px #fff,0 0 0 6px var(--mk-yellow); }
.mk-quote::after{ content:"»"; position:absolute; top:-34px; right:16px; font-size:9rem; font-weight:800;
  color:var(--mk-yellow); opacity:.16; pointer-events:none; line-height:1; }

/* Header-Scroll-State: Blur + Schatten + kompakteres Logo (JS setzt html.mk-scrolled) */
#main-header{ transition:background .25s ease,box-shadow .25s ease; }
#logo{ transition:max-height .25s ease; }
html.mk-scrolled #main-header{ background:rgba(255,255,255,.86); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  box-shadow:0 8px 30px rgba(11,13,26,.10); }
html.mk-scrolled #logo{ max-height:54px; }

/* Weiche Kante zwischen weissen und getönten Sektionen */
.mk-features,.mk-pricing,.mk-similarity,.mk-analysis{
  background-image:linear-gradient(180deg,#fff 0,var(--mk-bg-soft) 110px); }

/* Sektions-Glows: langsames Schweben */
@media (prefers-reduced-motion:no-preference){
  .et_pb_section.mk-analysis::before,.et_pb_section.mk-why::before,.et_pb_section.mk-similarity::before,
  .et_pb_section.mk-pricing::before,.et_pb_section.mk-cases::before,.et_pb_section.mk-faq::before{
    animation:mk-orb-float 16s ease-in-out infinite alternate; }
  .et_pb_section.mk-why::after,.et_pb_section.mk-pricing::after,.et_pb_section.mk-faq::after{
    animation:mk-orb-float 20s ease-in-out infinite alternate-reverse; }
}
@keyframes mk-orb-float{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(-42px,32px,0); } }

/* ---------- Hero v0.6: Aurora-Orbs ---------- */
.mk-hero::before,.mk-hero::after{ content:""; position:absolute; z-index:0; border-radius:50%; pointer-events:none; filter:blur(70px); }
.mk-hero::before{ width:520px; height:520px; top:-160px; right:6%; background:radial-gradient(circle,var(--mk-orb-a),transparent 65%); }
.mk-hero::after{ width:460px; height:460px; bottom:-200px; left:-120px; background:radial-gradient(circle,var(--mk-orb-b),transparent 65%); }
@media (prefers-reduced-motion:no-preference){
  .mk-hero::before{ animation:mk-orb-a 22s ease-in-out infinite alternate; }
  .mk-hero::after{ animation:mk-orb-b 26s ease-in-out infinite alternate; }
}
@keyframes mk-orb-a{ from{ transform:translate3d(0,0,0) scale(1); } to{ transform:translate3d(-70px,40px,0) scale(1.12); } }
@keyframes mk-orb-b{ from{ transform:translate3d(0,0,0) scale(1); } to{ transform:translate3d(60px,-30px,0) scale(1.08); } }

/* ---------- Hero v0.6: Entrance-Sequenz ---------- */
@media (prefers-reduced-motion:no-preference){
  .mk-hero .mk-hero-inner.is-in > *{ animation:mk-rise var(--mk-anim-dur) var(--mk-anim-ease) both; }
  .mk-hero .mk-hero-inner.is-in > *:nth-child(1){ animation-delay:.05s; }
  .mk-hero .mk-hero-inner.is-in > *:nth-child(2){ animation-delay:.14s; }
  .mk-hero .mk-hero-inner.is-in > *:nth-child(3){ animation-delay:.26s; }
  .mk-hero .mk-hero-inner.is-in > *:nth-child(4){ animation-delay:.38s; }
  .mk-hero .mk-hero-inner.is-in > *:nth-child(5){ animation-delay:.50s; }
  .mk-hero .mk-hero-inner.is-in > *:nth-child(6){ animation-delay:.62s; }
  /* Headline Wort-für-Wort (mk.js umhüllt Wörter mit .mk-w und setzt --i) */
  .mk-hero .mk-hero-headline .mk-w,.mk-hero h1 .mk-w{ display:inline-block; }
  .mk-hero .mk-hero-inner.is-in h1 .mk-w,
  .mk-hero .mk-hero-inner.is-in .mk-hero-headline .mk-w{ opacity:0; transform:translateY(.35em);
    animation:mk-word .55s var(--mk-anim-ease) forwards; animation-delay:calc(.2s + var(--i,0) * .07s); }
}
@keyframes mk-word{ to{ opacity:1; transform:none; } }

/* ---------- Hero v0.6: zusätzliche Radar-Blips (rein CSS, kein Markup nötig) ---------- */
.mk-radar::after{ content:""; position:absolute; left:31%; top:63%; width:10px; height:10px; border-radius:50%;
  background:var(--mk-blue); box-shadow:0 0 0 6px rgba(0,0,240,.10); opacity:0; }
.mk-hero-visual::after{ content:""; position:absolute; left:60%; top:24%; width:12px; height:12px; border-radius:50%;
  background:var(--mk-yellow-3); box-shadow:0 0 0 7px rgba(245,218,35,.20); opacity:0; }
@media (prefers-reduced-motion:no-preference){
  .mk-radar::after{ animation:mk-blip2 4.6s 1.2s infinite ease-out; }
  .mk-hero-visual::after{ animation:mk-blip2 5.4s 2.6s infinite ease-out; }
}
@keyframes mk-blip2{ 0%{ transform:scale(.4); opacity:0; } 18%{ opacity:1; } 58%{ opacity:1; } 100%{ transform:scale(1.9); opacity:0; } }

/* ---------- FAQ: sanftes Aufklappen + rotierendes Plus ---------- */
.mk-faq-item summary:after{ transition:transform .25s ease; }
.mk-faq-item[open] summary:after{ content:"+"; transform:rotate(45deg); }
@media (prefers-reduced-motion:no-preference){
  .mk-faq-item[open] .mk-faq-a{ animation:mk-rise .35s ease both; }
}
@supports (interpolate-size:allow-keywords){
  :root{ interpolate-size:allow-keywords; }
  .mk-faq-item::details-content{ block-size:0; overflow:clip; transition:block-size .3s ease,content-visibility .3s allow-discrete; }
  .mk-faq-item[open]::details-content{ block-size:auto; }
}

/* ---------- Pläne: animierter Gradient-Rand (Pro) + Badge-Puls + Utility mk-anim-border ---------- */
@property --mk-ang{ syntax:"<angle>"; initial-value:0deg; inherits:false; }
.mk-anim-border{ position:relative; }
@media (prefers-reduced-motion:no-preference){
  .mk-plan--featured{ border-color:transparent; }
  .mk-plan--featured::before,.mk-anim-border::before{ content:""; position:absolute; inset:-3px; z-index:0;
    border-radius:calc(var(--mk-radius-lg) + 3px); padding:3px; pointer-events:none; opacity:.9;
    background:conic-gradient(from var(--mk-ang),var(--mk-blue),var(--mk-yellow) 28%,var(--mk-blue) 58%,var(--mk-blue));
    -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor;
    mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); mask-composite:exclude;
    animation:mk-ang 7s linear infinite; }
  .mk-anim-border::before{ border-radius:calc(var(--mk-radius) + 3px); }
  .mk-plan-badge{ animation:mk-badge 2.8s ease-in-out infinite; }
}
@keyframes mk-ang{ to{ --mk-ang:360deg; } }
@keyframes mk-badge{ 0%,100%{ transform:translateX(-50%) scale(1); box-shadow:0 0 0 0 rgba(0,0,240,.35); }
  50%{ transform:translateX(-50%) scale(1.05); box-shadow:0 0 0 9px rgba(0,0,240,0); } }

/* ---------- Fallstudien: «A vs. B»-Chips schieben sich aufeinander zu ---------- */
@media (prefers-reduced-motion:no-preference){
  .mk-cases.is-in .mk-case-a{ animation:mk-from-l .5s var(--mk-anim-ease) both; }
  .mk-cases.is-in .mk-case-b{ animation:mk-from-r .5s var(--mk-anim-ease) .08s both; }
  .mk-cases.is-in .mk-verdict{ animation:mk-pop .35s ease .5s both; }
}
@keyframes mk-from-l{ from{ opacity:0; transform:translateX(-26px); } to{ opacity:1; transform:none; } }
@keyframes mk-from-r{ from{ opacity:0; transform:translateX(26px); } to{ opacity:1; transform:none; } }
@keyframes mk-pop{ from{ opacity:0; transform:scale(.6); } to{ opacity:1; transform:scale(1); } }

/* ---------- Mock-Warnkarte: fliegt als «eintreffende Benachrichtigung» ein ---------- */
@media (prefers-reduced-motion:no-preference){
  .mk-mock-card.is-in,.mk-anim-notify.is-in{ animation:mk-notify .65s cubic-bezier(.16,1,.3,1) both; }
  .mk-mock-card.is-in .mk-mock-head .mk-ic{ animation:mk-ring-sh .9s ease .55s 1; }
  .mk-mock-card.is-in .mk-mock-risk{ animation:mk-badge-soft 2.4s ease-in-out .9s 3; }
}
@keyframes mk-notify{ from{ opacity:0; transform:translateX(56px) translateY(8px) rotate(1.5deg); } to{ opacity:1; transform:none; } }
@keyframes mk-ring-sh{ 0%,100%{ transform:rotate(0); } 20%{ transform:rotate(-14deg); } 40%{ transform:rotate(11deg); }
  60%{ transform:rotate(-7deg); } 80%{ transform:rotate(4deg); } }
@keyframes mk-badge-soft{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.08); } }

/* ---------- CTA-Puls (Formular-Submit + Utility mk-anim-pulse) ---------- */
@media (prefers-reduced-motion:no-preference){
  .mk-form-btn,.mk-anim-pulse{ animation:mk-cta-pulse 3.2s ease-in-out infinite; }
}
@keyframes mk-cta-pulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(0,0,240,.25); } 45%{ box-shadow:0 0 0 10px rgba(0,0,240,0); } }

/* ---------- Edler Karten-Hover: Spotlight folgt der Maus ----------
   mk.js vergibt .mk-has-glow und setzt --mx/--my. Der Hintergrund der Karte
   bekommt beim Hover einen dezenten Farbschein, der der Maus folgt.
   Abschalten pro Karte/Sektion: Klasse mk-no-anim.                     */
@property --mk-glow-a{ syntax:"<number>"; initial-value:0; inherits:false; }
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .mk-has-glow{ --mk-glow-a:0;
    background-image:radial-gradient(340px circle at var(--mx,50%) var(--my,40%),
      rgba(245,218,35,calc(.16 * var(--mk-glow-a))),
      rgba(0,0,240,calc(.04 * var(--mk-glow-a))) 46%, transparent 72%);
    transition:transform .22s cubic-bezier(.2,.7,.2,1), box-shadow .22s ease,
      border-color .22s ease, --mk-glow-a .45s ease; }
  .mk-has-glow:hover{ --mk-glow-a:1; }
  /* Dunkle Karten: weisser statt gelber Schein */
  .mk-demo-card.mk-has-glow,.mk-live-kpi.mk-has-glow,.mk-live-main.mk-has-glow{
    background-image:radial-gradient(300px circle at var(--mx,50%) var(--my,40%),
      rgba(255,255,255,calc(.10 * var(--mk-glow-a))), transparent 70%); }
  /* Leadcheck-Box: eigener Verlauf bleibt erhalten, weisser Schein als Zusatz-Layer */
  .mk-leadcheck:not(.et_pb_section).mk-has-glow{
    background-image:radial-gradient(520px circle at var(--mx,50%) var(--my,40%),
      rgba(255,255,255,calc(.07 * var(--mk-glow-a))), transparent 70%),
      linear-gradient(135deg,var(--mk-ink) 0%,#15182b 100%); }
  /* Formular-Karte: sanfter Lift + gelbe Kante wie die übrigen Karten */
  .mk-form:not(.et_pb_section).mk-has-glow:hover{ transform:translateY(-3px); box-shadow:var(--mk-shadow-lg); border-color:var(--mk-yellow); }
  .mk-form:not(.et_pb_section).mk-has-glow{ border:1px solid transparent; }
}

/* ---------- Utilities (frei im Divi-Editor einsetzbar) ---------- */
.mk-anim-rise{ opacity:0; transform:translateY(26px); transition:opacity .7s ease,transform .7s ease; }
.mk-anim-rise.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .mk-anim-rise{ opacity:1; transform:none; transition:none; } }
@media (prefers-reduced-motion:no-preference){
  .mk-anim-float{ animation:mk-float 8s ease-in-out infinite alternate; }
  .mk-quote::after{ animation:mk-float 9s ease-in-out infinite alternate; }
}
@keyframes mk-float{ from{ transform:translateY(0); } to{ transform:translateY(-12px); } }

/* ---------- Responsive: Tablet & kleiner (≤980px) ---------- */
@media (max-width:980px){
  /* Sektions-Rhythmus */
  .et_pb_section{ padding:64px 0; }
  .et_pb_section[class*="mk-"]{ padding:56px 0; }
  .et_pb_section[class*="mk-"] .et_pb_row{ width:100% !important; max-width:100% !important; margin:0 !important; padding:0 18px !important; }
  .et_pb_section[class*="mk-"] .et_pb_column{ width:100% !important; margin:0 !important; }
  .et_pb_section[class*="mk-"] .et_pb_text,
  .et_pb_section[class*="mk-"] .et_pb_text_inner{ width:100% !important; }

  /* Hero: kompakter, Radar bleibt als dezentes Hintergrund-Visual erlebbar */
  .mk-hero{ padding:84px 0 60px; }
  .mk-hero h1,.mk-hero .mk-hero-headline{ font-size:2.3rem; }
  .mk-hero-text{ font-size:1.05rem; }
  .mk-hero-visual{ right:-140px; top:-30px; transform:none; width:380px; height:380px; opacity:.35; }
  .mk-radar span:nth-child(3){ width:340px; height:340px; }
  .mk-radar:before{ width:340px; height:340px; }
  .mk-hero::before{ width:340px; height:340px; top:-120px; right:-60px; }
  .mk-hero::after{ display:none; }

  /* Grids einspaltig */
  .mk-cases:not(.et_pb_section),.mk-demo-grid,.mk-adim-grid,.mk-live,.mk-live-side{ grid-template-columns:1fr; }
  .mk-stats-grid,.mk-risk-grid,.mk-sim-grid,.mk-why-grid,.mk-plans{ grid-template-columns:1fr; }
  .mk-vs:not(.et_pb_section),.mk-mock{ grid-template-columns:1fr; }
  .mk-mock-media{ order:-1; }
  .mk-truth-grid,.mk-leadcheck:not(.et_pb_section){ grid-template-columns:1fr; gap:30px; padding:30px; }
  .mk-plan--featured{ transform:none; }
  .mk-step-arrow{ display:none; }

  /* Demo / Timeline / Boxen */
  .mk-demo{ padding:26px; }
  .mk-demo-form{ flex-direction:column; }
  .mk-demo-form.is-step2 .mk-demo-row{ flex-direction:column; align-items:stretch; }
  .mk-timeline:not(.et_pb_section){ flex-direction:column; gap:20px; }
  .mk-tl-step{ text-align:left; display:grid; grid-template-columns:46px 1fr; column-gap:14px; padding:0; }
  .mk-tl-step::before{ display:none; }
  .mk-tl-dot{ margin:0; grid-row:1 / span 2; }
  .mk-live-num{ font-size:3rem; }
  .mk-ctabox,.mk-final:not(.et_pb_section){ padding:40px 26px; }

  /* Vergleichstabelle: erste Spalte fixiert + Scroll-Hinweis rechts */
  .mk-compare{ position:relative; }
  .mk-compare::after{ content:""; position:absolute; top:0; right:0; bottom:0; width:34px; pointer-events:none;
    background:linear-gradient(270deg,rgba(11,13,26,.12),transparent);
    border-radius:0 var(--mk-radius) var(--mk-radius) 0; }
  .mk-compare th:first-child,.mk-compare td:first-child{ position:sticky; left:0; z-index:2; background:#fff;
    box-shadow:2px 0 0 var(--mk-line); }
  .mk-compare thead th:first-child{ background:var(--mk-ink); }
  .mk-compare-group td:first-child{ background:var(--mk-bg-soft); }
}

/* ---------- Responsive: Phone (≤600px) ---------- */
@media (max-width:600px){
  :root{ --mk-radius:14px; --mk-radius-lg:18px; }
  .et_pb_section[class*="mk-"]{ padding:44px 0; }

  /* Hero */
  .mk-hero{ padding:72px 0 48px; }
  .mk-hero h1,.mk-hero .mk-hero-headline{ font-size:2rem; }
  .mk-hero-cta{ flex-direction:column; align-items:stretch; }
  .mk-hero-cta .mk-btn{ width:100%; text-align:center; }
  .mk-hero-visual{ width:300px; height:300px; right:-130px; opacity:.28; }
  .mk-radar span:nth-child(3){ width:270px; height:270px; }
  .mk-radar:before{ width:270px; height:270px; }
  .mk-trust{ gap:16px; }
  .mk-trust img{ height:26px; }

  /* Karten & Boxen kompakter */
  .mk-risk-card,.mk-sim-card,.mk-case,.mk-why-card,.mk-adim{ padding:22px 20px; }
  .mk-step{ padding:22px; }
  .mk-plan{ padding:26px 20px; }
  .mk-quote{ padding:28px 22px; }
  .mk-quote blockquote{ font-size:1.15rem; }
  .mk-quote::after{ font-size:6rem; top:-20px; right:10px; }
  .mk-leadcheck:not(.et_pb_section),.mk-truth-grid{ padding:22px; }
  .mk-demo{ padding:20px 16px; }
  .mk-ctabox,.mk-final:not(.et_pb_section){ padding:34px 20px; }
  .mk-form:not(.et_pb_section){ padding:22px 18px; }
  .mk-modal{ padding:26px 20px; }
  .mk-callout:not(.et_pb_section){ padding:22px 20px; }

  /* Zahlen & Logos */
  .mk-stat-value{ font-size:2.2rem; }
  .mk-live-num{ font-size:2.6rem; }
  .mk-logos{ gap:22px; }
  .mk-logos img{ height:32px; }

  /* FAQ & Tabelle */
  .mk-faq-item summary{ padding:16px 18px; }
  .mk-faq-a{ padding:0 18px 16px; }
  .mk-compare th,.mk-compare td{ padding:11px 12px; font-size:.9rem; }
}

/* ============================ Blog / Ratgeber (home.php, archive.php) ============================ */
.mk-blog{ background:var(--mk-bg-soft); }
.mk-blogwrap{ width:92%; max-width:var(--mk-maxw); margin:0 auto; }

/* Kopfbereich */
.mk-bloghero{ position:relative; overflow:hidden; padding:84px 0 52px; border-bottom:1px solid var(--mk-line);
  background:radial-gradient(900px 420px at 85% -10%, var(--mk-yellow-soft), transparent 60%),
             linear-gradient(120deg,#fffdf2 0%,#fff 55%); }
.mk-bloghero h1{ margin:10px 0 14px; font-size:clamp(2.4rem,5vw,3.6rem); }
.mk-bloghero .mk-sub{ font-size:1.12rem; }
.mk-blogchips{ margin-top:22px; }
.mk-blogchips li{ padding:0; transition:background .15s ease,transform .15s ease; }
.mk-blogchips li a{ display:inline-block; padding:9px 16px; color:var(--mk-ink); font-weight:700; }
.mk-blogchips li:hover{ background:var(--mk-yellow); transform:translateY(-1px); }
.mk-blogchips li.is-current{ background:var(--mk-yellow); }
.mk-blogback{ margin-top:18px; }
.mk-blogback a{ font-weight:700; }

/* Karten-Grid */
.mk-blogmain{ padding:56px 0 84px; }
.mk-bloggrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:stretch; }
.mk-blogcard{ position:relative; background:#fff; border:1px solid var(--mk-line); border-radius:var(--mk-radius);
  box-shadow:var(--mk-shadow); overflow:hidden; display:flex;
  transition:transform .22s cubic-bezier(.2,.7,.2,1), box-shadow .22s ease, border-color .22s ease; }
.mk-blogcard::before{ content:""; position:absolute; top:0; left:0; width:100%; height:5px; z-index:1;
  background:linear-gradient(90deg,var(--mk-yellow),var(--mk-yellow-3)); }
.mk-blogcard:hover{ transform:translateY(-6px); box-shadow:var(--mk-shadow-lg); border-color:var(--mk-yellow); }
.mk-blogcard--feat{ grid-column:span 2; }
.mk-blogcard-link{ display:flex; flex-direction:column; width:100%; color:inherit; }
.mk-blogcard-media img{ width:100%; height:210px; object-fit:cover; display:block; }
.mk-blogcard--feat .mk-blogcard-media img{ height:300px; }
.mk-blogcard-body{ padding:26px 26px 24px; display:flex; flex-direction:column; gap:12px; flex:1; }
.mk-blogcard-meta{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.mk-blogcard-cat{ background:var(--mk-yellow-soft); border:1px solid var(--mk-yellow-3); border-radius:999px;
  padding:4px 12px; font-size:.76rem; font-weight:800; letter-spacing:.02em; }
.mk-blogcard-date{ color:var(--mk-ink); font-size:.82rem; font-weight:700; }
.mk-blogcard-date::after{ content:"·"; margin-left:10px; color:var(--mk-muted); font-weight:400; }
.mk-blogcard-time{ color:var(--mk-muted); font-size:.82rem; font-weight:600; }
.mk-blogcard-title{ font-size:1.22rem; line-height:1.3; color:var(--mk-ink); margin:0; }
.mk-blogcard--feat .mk-blogcard-title{ font-size:clamp(1.4rem,2.4vw,1.8rem); }
.mk-blogcard:hover .mk-blogcard-title{ color:var(--mk-blue); }
.mk-blogcard-excerpt{ color:var(--mk-muted); font-size:.96rem; margin:0; }
.mk-blogcard-more{ margin-top:auto; padding-top:6px; font-weight:800; color:var(--mk-blue); font-size:.92rem; }
.mk-blogcard-more span{ display:inline-block; transition:transform .15s ease; }
.mk-blogcard:hover .mk-blogcard-more span{ transform:translateX(4px); }
.mk-blogempty{ color:var(--mk-muted); font-size:1.05rem; }

/* Gestaffelte Einblendung der Karten */
@media (prefers-reduced-motion:no-preference){
  .mk-bloggrid.is-in > *{ animation:mk-rise .55s cubic-bezier(.2,.7,.2,1) both; }
}

/* Pagination */
.mk-blogpager{ display:flex; justify-content:center; flex-wrap:wrap; gap:8px; margin-top:44px; }
.mk-blogpager .page-numbers{ display:inline-block; min-width:44px; text-align:center; padding:11px 15px;
  background:#fff; border:1px solid var(--mk-line); border-radius:10px; font-weight:700; color:var(--mk-ink);
  transition:border-color .15s ease,color .15s ease,transform .15s ease; }
.mk-blogpager .page-numbers.current{ background:var(--mk-blue); color:#fff; border-color:var(--mk-blue); }
.mk-blogpager a.page-numbers:hover{ border-color:var(--mk-blue); color:var(--mk-blue); transform:translateY(-2px); }
.mk-blogpager .page-numbers.dots{ border:0; background:none; }

/* Abschluss-CTA */
.mk-blogcta{ margin-top:64px; }
.mk-blogcta .mk-btn{ position:relative; margin-top:6px; }

/* Responsive */
@media (max-width:980px){
  .mk-bloghero{ padding:64px 0 40px; }
  .mk-bloggrid{ grid-template-columns:1fr 1fr; }
  .mk-blogcard--feat{ grid-column:1 / -1; }
}
@media (max-width:640px){
  .mk-blogmain{ padding:40px 0 60px; }
  .mk-bloggrid{ grid-template-columns:1fr; gap:18px; }
  .mk-blogcard-body{ padding:20px; }
  .mk-blogcard-media img{ height:180px; }
  .mk-blogcta{ margin-top:44px; }
}

/* ============================ Marken-Landingpages (CPT mk_marke, Plugin mk-marken) ============================ */

.mk-markehero{ position:relative; overflow:hidden; padding:84px 0 48px; border-bottom:1px solid var(--mk-line);
  background:radial-gradient(900px 420px at 85% -10%, var(--mk-yellow-soft), transparent 60%),
             linear-gradient(120deg,#fffdf2 0%,#fff 55%); }
.mk-markehero h1{ margin:10px 0 14px; font-size:clamp(2.2rem,5vw,3.4rem); word-break:break-word; }
.mk-marke-badges{ display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
.mk-marke-badge{ display:inline-block; background:#fff; border:1px solid var(--mk-line); border-radius:999px;
  padding:7px 15px; font-size:.86rem; font-weight:600; color:var(--mk-ink-2); }
.mk-marke-badge--status{ background:var(--mk-yellow); border-color:var(--mk-yellow-3); }

.mk-marke-body{ padding:48px 0 80px; display:flex; flex-direction:column; gap:26px; }
.mk-marke-card{ background:#fff; border:1px solid var(--mk-line); border-radius:var(--mk-radius);
  box-shadow:var(--mk-shadow); padding:34px 38px; }
.mk-marke-card h2{ font-size:clamp(1.35rem,2.4vw,1.8rem); margin:0 0 16px; }
.mk-marke-card--accent{ border-left:5px solid var(--mk-yellow-3); }
.mk-marke-hinweis{ color:var(--mk-muted); font-size:.95rem; }

.mk-marke-tabelle{ width:100%; border-collapse:collapse; }
.mk-marke-tabelle th{ text-align:left; vertical-align:top; padding:10px 18px 10px 0; white-space:nowrap;
  color:var(--mk-muted); font-weight:600; width:190px; border-bottom:1px solid var(--mk-line); }
.mk-marke-tabelle td{ padding:10px 0; border-bottom:1px solid var(--mk-line); }
.mk-marke-tabelle tr:last-child th,.mk-marke-tabelle tr:last-child td{ border-bottom:0; }
.mk-marke-klasse{ margin:0 0 8px; }

.mk-marke-beobachtung{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:18px 0; }
.mk-marke-beobkarte{ background:var(--mk-bg-soft); border:1px solid var(--mk-line); border-radius:14px; padding:18px 20px; }
.mk-marke-beobkarte h3{ font-size:1rem; margin:0 0 10px; }
.mk-marke-beobkarte ul{ margin:0; padding:0; list-style:none; }
.mk-marke-beobkarte li{ padding:5px 0; border-bottom:1px dashed var(--mk-line); font-weight:600; }
.mk-marke-beobkarte li:last-child{ border-bottom:0; }

.mk-marke-umfeld{ margin:0; padding:0; list-style:none; columns:2; column-gap:28px; }
.mk-marke-umfeld li{ display:flex; justify-content:space-between; gap:12px; padding:9px 0;
  border-bottom:1px solid var(--mk-line); break-inside:avoid; }
.mk-marke-umfeld span{ color:var(--mk-muted); font-size:.9rem; white-space:nowrap; }

.mk-marke-frist{ background:var(--mk-bg-soft); border-radius:12px; padding:14px 18px; }
.mk-marke-radarlink{ margin-top:18px; }

/* Status-Timeline (Verlauf im Register) */
.mk-marke-verlauf-titel{ font-size:1.02rem; margin:22px 0 10px; }
.mk-marke-timeline{ margin:0; padding:0; list-style:none; border-left:3px solid var(--mk-yellow-3); }
.mk-marke-timeline li{ position:relative; padding:6px 0 6px 22px; }
.mk-marke-timeline li::before{ content:""; position:absolute; left:-8px; top:13px; width:13px; height:13px;
  border-radius:50%; background:var(--mk-blue); border:3px solid #fff; box-shadow:0 0 0 1px var(--mk-line); }
.mk-marke-timeline-datum{ display:inline-block; min-width:96px; font-weight:700; color:var(--mk-ink-2); }
/* Terminaler Punkt (Markenschutz abgelaufen / Löschung im Register) */
.mk-marke-timeline li.ist-ende::before{ background:#c0392b; box-shadow:0 0 0 1px #c0392b; }
.mk-marke-timeline li.ist-ende span:last-child{ color:#c0392b; font-weight:700; }

/* Register-Nachbarschaft */
.mk-marke-nachbargruppe{ margin:14px 0 20px; }
.mk-marke-nachbartabelle thead th{ text-align:left; color:var(--mk-muted); font-weight:600;
  border-bottom:2px solid var(--mk-line); padding:8px 12px 8px 0; width:auto; white-space:normal; }
.mk-marke-nachbartabelle td{ padding:8px 12px 8px 0; }

/* Trend-Chart */
.mk-marke-chart{ margin:18px 0 0; }
.mk-marke-chart img{ width:100%; height:auto; border:1px solid var(--mk-line); border-radius:12px; background:#fff; }
.mk-marke-chart figcaption{ color:var(--mk-muted); font-size:.85rem; margin-top:8px; }

/* FAQ */
.mk-marke-faq details{ border-bottom:1px solid var(--mk-line); padding:12px 0; }
.mk-marke-faq details:last-child{ border-bottom:0; }
.mk-marke-faq summary{ font-weight:700; cursor:pointer; list-style-position:outside; }
.mk-marke-faq summary:hover{ color:var(--mk-blue); }
.mk-marke-faq p{ margin:10px 0 4px; color:var(--mk-ink-2); }

/* ---------- Design v2 (Phase 5) ---------- */

/* Hero: Pattern, Monogramm, Status-Pill, Stempel */
.mk-markehero--v2{ position:relative; }
.mk-markehero--v2::after{ content:""; position:absolute; inset:0; background:url('brand-pattern.svg') right -80px center/560px no-repeat; opacity:.16; pointer-events:none; }
.mk-marke-monogramm{ position:absolute; right:4%; top:50%; transform:translateY(-52%); font-size:clamp(160px,26vw,340px);
  font-weight:800; color:rgba(0,0,240,.055); line-height:1; pointer-events:none; user-select:none; z-index:0; }
.mk-markehero--v2 .mk-blogwrap{ position:relative; z-index:1; }
.mk-marke-statuspill{ display:inline-flex; align-items:center; gap:8px; border-radius:999px; padding:7px 16px;
  font-size:.86rem; font-weight:700; }
.mk-marke-statuspill i{ width:9px; height:9px; border-radius:50%; background:currentColor; display:inline-block; }
.mk-marke-statuspill.ist-pending{ background:var(--mk-yellow); color:#6b5b00; }
.mk-marke-statuspill.ist-registered{ background:#d9f2e3; color:#0f6d3d; }
.mk-marke-statuspill.ist-opposition{ background:#ffe3c7; color:#a35a00; }
.mk-marke-statuspill.ist-refused,.mk-marke-statuspill.ist-withdrawn{ background:#e9eaf1; color:#5b6072; }
.mk-marke-badge--stempel{ border:2px dashed var(--mk-blue); color:var(--mk-blue); font-family:ui-monospace,Menlo,Consolas,monospace; letter-spacing:.04em; background:transparent; }
.mk-marke-badge--aktualisiert{ background:var(--mk-bg-soft); color:var(--mk-muted); font-weight:500; }

/* Sektions-Header: automatischer Nummern-Chip + Icon */
.mk-marke-body{ counter-reset: mk-kapitel; }
.mk-marke-h2{ display:flex; align-items:center; gap:12px; font-size:clamp(1.3rem,2.3vw,1.7rem); margin:0 0 18px; }
.mk-marke-card .mk-marke-h2::before{ counter-increment: mk-kapitel; content: counter(mk-kapitel);
  flex:0 0 auto; width:30px; height:30px; border-radius:50%; background:var(--mk-yellow); color:var(--mk-ink);
  font-size:.95rem; font-weight:800; display:inline-flex; align-items:center; justify-content:center; }
.mk-marke-h2 .mk-icon{ flex:0 0 auto; color:var(--mk-blue); }

/* Registerauszug als Definition-Grid */
.mk-marke-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:0 32px; margin:0; }
.mk-marke-grid2 > div{ padding:11px 0; border-bottom:1px solid var(--mk-line); }
.mk-marke-grid2 dt{ font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; color:var(--mk-muted); font-weight:700; margin-bottom:2px; }
.mk-marke-grid2 dd{ margin:0; font-weight:600; }
.mk-marke-leise{ color:var(--mk-muted); font-weight:400; font-size:.9em; }

/* Charts */
.mk-chart{ width:100%; height:auto; display:block; margin:6px 0 4px; }
.mk-marke-charttitel{ font-size:1rem; margin:20px 0 6px; color:var(--mk-ink-2); }
.mk-marke-charttitel:first-of-type{ margin-top:4px; }

/* Prozess-Stepper */
.mk-stepper{ list-style:none; margin:10px 0 6px; padding:0; display:flex; flex-wrap:wrap; gap:0; }
.mk-stepper li{ flex:1 1 0; min-width:96px; position:relative; text-align:center; padding:0 4px 4px; }
.mk-stepper li::before{ content:""; position:absolute; top:15px; left:-50%; width:100%; height:3px; background:var(--mk-line); z-index:0; }
.mk-stepper li:first-child::before{ display:none; }
.mk-stepper li.ist-fertig::before,.mk-stepper li.ist-aktiv::before{ background:var(--mk-blue); }
.mk-stepper-punkt{ position:relative; z-index:1; display:inline-flex; width:32px; height:32px; border-radius:50%;
  background:#fff; border:3px solid var(--mk-line); align-items:center; justify-content:center; font-weight:800; font-size:.85rem; color:var(--mk-muted); }
.mk-stepper li.ist-fertig .mk-stepper-punkt{ background:var(--mk-blue); border-color:var(--mk-blue); color:#fff; }
.mk-stepper li.ist-aktiv .mk-stepper-punkt{ background:var(--mk-yellow); border-color:var(--mk-blue); color:var(--mk-ink); box-shadow:0 0 0 5px rgba(245,218,35,.35); }
.mk-stepper li.ist-gestoppt .mk-stepper-punkt{ background:#c0392b; border-color:#c0392b; color:#fff; }
.mk-stepper li.ist-gestoppt::before{ background:#c0392b; }
.mk-stepper-label{ display:block; margin-top:8px; font-size:.8rem; font-weight:600; color:var(--mk-ink-2); line-height:1.3; }
.mk-stepper li.ist-aktiv .mk-stepper-label{ color:var(--mk-blue); }
.mk-stepper li.ist-gestoppt .mk-stepper-label{ color:#c0392b; }

/* «Nach der Anmeldung»-Modul */
.mk-marke-luecke{ background:var(--mk-bg-soft); border-radius:14px; padding:18px 22px; margin:20px 0; }
.mk-marke-zweispalt{ display:grid; grid-template-columns:1.4fr 1fr; gap:22px; align-items:start; }
.mk-marke-checkliste{ list-style:none; margin:8px 0 0; padding:0; }
.mk-marke-checkliste li{ display:flex; gap:10px; padding:8px 0; border-bottom:1px dashed var(--mk-line); align-items:flex-start; }
.mk-marke-checkliste li:last-child{ border-bottom:0; }
.mk-marke-checkliste .mk-icon{ flex:0 0 auto; color:#0f6d3d; margin-top:2px; }
.mk-marke-fristbox{ background:#fff; border:1px solid var(--mk-line); border-radius:14px; padding:18px; text-align:center; box-shadow:var(--mk-shadow); }
.mk-fristdonut{ margin:0 auto 8px; display:block; }

/* CTA-Radar-Ring */
.mk-marke-cta{ position:relative; overflow:hidden; }
.mk-marke-radarring{ position:absolute; top:-70px; right:-70px; width:240px; height:240px; border-radius:50%;
  border:2px solid rgba(255,255,255,.25); pointer-events:none; }
.mk-marke-radarring::before,.mk-marke-radarring::after{ content:""; position:absolute; inset:0; border-radius:50%;
  border:2px solid rgba(245,218,35,.5); animation:mkRadar 3.2s ease-out infinite; }
.mk-marke-radarring::after{ animation-delay:1.6s; }
@keyframes mkRadar{ 0%{ transform:scale(.35); opacity:1; } 100%{ transform:scale(1.15); opacity:0; } }

/* Kleine Karten-Grids (Inhaber/Ähnliche) */
.mk-marke-grid--klein .mk-marke-gridcard{ padding:14px 16px; }

@media (max-width:980px){
  .mk-marke-monogramm{ display:none; }
  .mk-marke-grid2{ grid-template-columns:1fr; }
  .mk-marke-zweispalt{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .mk-stepper{ flex-direction:column; align-items:flex-start; }
  .mk-stepper li{ text-align:left; display:flex; align-items:center; gap:10px; padding:6px 0; min-width:0; }
  .mk-stepper li::before{ display:none; }
  .mk-stepper-label{ margin-top:0; }
}

/* Marken-Puls (Zahlen-Kacheln) */
.mk-marke-puls{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; }
.mk-marke-pulskachel{ background:#fff; border:1px solid var(--mk-line); border-radius:14px; padding:18px 20px;
  box-shadow:var(--mk-shadow); position:relative; overflow:hidden; }
.mk-marke-pulskachel::before{ content:""; position:absolute; top:0; left:0; width:100%; height:4px;
  background:linear-gradient(90deg,var(--mk-yellow),var(--mk-yellow-3)); }
.mk-marke-pulswert{ display:block; font-size:1.9rem; font-weight:800; letter-spacing:-.02em; color:var(--mk-blue); }
.mk-marke-pulslabel{ color:var(--mk-muted); font-size:.88rem; line-height:1.35; display:block; margin-top:4px; }

/* Sparklines + Aktivitäts-Badge */
.mk-marke-umfeldkopf{ display:flex; align-items:center; justify-content:space-between; gap:14px; }
.mk-spark{ flex:0 0 auto; }
.mk-marke-badges .mk-spark{ align-self:center; background:#fff; border:1px solid var(--mk-line); border-radius:999px; padding:4px 10px; height:32px; }
.mk-marke-aktivitaet{ display:flex; align-items:center; gap:12px; margin-top:16px; background:var(--mk-bg-soft);
  border-radius:12px; padding:10px 14px; font-weight:600; color:var(--mk-ink-2); }
.mk-marke-aktivitaet .mk-donut{ flex:0 0 auto; }

/* ---------- Phase 6: Inhaber-Mehrwert ---------- */

/* Digitale Verfügbarkeit (Domain-Karten) */
.mk-domain-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin:14px 0; }
.mk-domain-karte{ border:1px solid var(--mk-line); border-radius:12px; padding:14px 16px; background:#fff; }
.mk-domain-name{ display:block; font-weight:800; letter-spacing:-.01em; word-break:break-all; }
.mk-domain-status{ display:block; font-size:.85rem; margin-top:4px; font-weight:600; }
.mk-domain-karte.ist-frei{ border-color:#9fdcb8; background:#f2fbf6; }
.mk-domain-karte.ist-frei .mk-domain-status{ color:#0f6d3d; }
.mk-domain-karte.ist-vergeben .mk-domain-status{ color:var(--mk-muted); }
.mk-domain-karte.ist-unklar{ opacity:.75; }
.mk-marke-social{ font-size:.92rem; color:var(--mk-muted); }
.mk-marke-social a{ margin-right:12px; white-space:nowrap; }

/* Markenstärke-Skala */
.mk-staerke{ width:100%; height:auto; display:block; margin:6px 0 14px; }

/* Fahrplan (datierte Agenda) */
.mk-marke-fahrplan{ list-style:none; margin:8px 0 0; padding:0; }
.mk-marke-fahrplan li{ display:flex; gap:14px; padding:12px 0; border-bottom:1px dashed var(--mk-line); position:relative; }
.mk-marke-fahrplan li:last-child{ border-bottom:0; }
.mk-fahrplan-datum{ flex:0 0 92px; font-weight:800; color:var(--mk-blue); }
.mk-marke-fahrplan li.ist-vergangen{ opacity:.55; }
.mk-marke-fahrplan li.ist-vergangen .mk-fahrplan-datum{ color:var(--mk-muted); text-decoration:line-through; }
.mk-marke-fahrplan li.ist-aktuell{ background:var(--mk-bg-soft); border-radius:10px; padding-left:12px; padding-right:12px; }
.mk-marke-fahrplan li.ist-aktuell .mk-fahrplan-datum{ color:#a35a00; }
/* Terminal-Punkt beendeter Marken: rot, ohne Vergangen-Fade */
.mk-marke-fahrplan li.ist-ende{ opacity:1; background:rgba(192,57,43,.07); border-radius:10px; padding-left:12px; padding-right:12px; }
.mk-marke-fahrplan li.ist-ende .mk-fahrplan-datum{ color:#c0392b; text-decoration:none; }
.mk-marke-fahrplan li.ist-ende .mk-fahrplan-inhalt strong{ color:#c0392b; }

/* Marken-Siegel */
.mk-siegel-vorschau{ margin:14px 0; }
.mk-siegel-code{ display:block; font-weight:600; color:var(--mk-ink-2); }
.mk-siegel-code textarea{ width:100%; margin-top:6px; font-family:ui-monospace,Menlo,Consolas,monospace; font-size:.82rem;
  padding:10px 12px; border:1px solid var(--mk-line); border-radius:10px; background:var(--mk-bg-soft); }

/* Beendete Marken: Stempel + gedämpfter Hero */
.mk-marke-stempel{ position:absolute; top:38%; right:6%; transform:rotate(-14deg); z-index:3;
  border:5px double #c0392b; color:#c0392b; border-radius:10px; padding:10px 26px;
  font-size:clamp(1.2rem,3.4vw,2.2rem); font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  background:rgba(255,255,255,.82); box-shadow:var(--mk-shadow); pointer-events:none; user-select:none; }
.mk-markehero--v2.ist-beendet .mk-marke-monogramm{ color:rgba(11,13,26,.05); }
.mk-markehero--v2.ist-beendet h1{ color:#5b6072; }
.mk-marke-statuspill.ist-expired,.mk-marke-statuspill.ist-cancelled,.mk-marke-statuspill.ist-deleted{ background:#fbe3e1; color:#c0392b; }

/* Frist-Countdown */
.mk-countdown-kacheln{ display:flex; gap:10px; justify-content:center; margin:6px 0 10px; }
.mk-countdown-kachel{ background:var(--mk-ink); color:#fff; border-radius:10px; padding:10px 12px; min-width:58px; text-align:center; }
.mk-countdown-kachel b{ display:block; font-size:1.5rem; font-weight:800; font-variant-numeric:tabular-nums; }
.mk-countdown-kachel small{ display:block; color:#c9ccff; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; margin-top:2px; }

/* Domain-Live-Check + Kauf-Button */
.mk-domain-karte.ist-laedt{ opacity:.6; }
.mk-domain-karte.ist-laedt .mk-domain-status::after{ content:""; display:inline-block; width:10px; height:10px;
  margin-left:6px; border:2px solid var(--mk-line); border-top-color:var(--mk-blue); border-radius:50%;
  animation:mkDreh 1s linear infinite; vertical-align:middle; }
@keyframes mkDreh{ to{ transform:rotate(360deg); } }
.mk-domain-kauf{ margin-top:10px; padding:8px 14px; font-size:.85rem; }

/* Verlängerungs-Countdown */
.mk-marke-verlaengerung .mk-countdown--gross{ text-align:center; padding:10px 0 4px; }
.mk-marke-verlaengerung .mk-marke-pulswert{ font-size:2.4rem; }
.mk-marke-verlaengerung form{ margin-top:12px; }

/* Marken-Catcher */
.mk-marke-card--catcher{ border-left:5px solid #c0392b; }
.mk-marke-catcher-ok{ background:#d9f2e3; color:#0f6d3d; font-weight:700; border-radius:10px; padding:12px 16px; }
.mk-marke-gridcard--frei::before{ background:linear-gradient(90deg,#c0392b,#e74c3c); }

/* «Weiteres aus dem Register»: drei Gruppen in einer Karte */
.mk-mehr-gruppe + .mk-mehr-gruppe{ margin-top:26px; padding-top:22px; border-top:1px solid var(--mk-line); }
.mk-mehr-gruppe > .mk-marke-charttitel{ margin-top:0; }

/* Phase 11: Negativabgrenzung, identische Registertreffer */
.mk-marke-negativ li{ align-items:flex-start; }
.mk-negativ-kreuz{ flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  width:22px; height:22px; border-radius:50%; background:rgba(192,57,43,.1); color:#c0392b;
  font-weight:800; font-size:.8rem; margin-top:2px; }
.mk-marke-identisch{ margin:14px 0 18px; padding:14px 16px; border-radius:10px;
  background:rgba(192,57,43,.06); border-left:4px solid #c0392b; }
.mk-marke-identisch p:first-child{ color:#c0392b; }
.mk-marke-nachbartabelle tr.ist-nah td{ background:rgba(245,218,35,.16); font-weight:600; }
.mk-marke-nachbartabelle tr.ist-ueber td{ background:rgba(192,57,43,.08); }
.mk-ueber-flag{ display:inline-block; margin-left:6px; padding:1px 7px; border-radius:99px;
  background:#c0392b; color:#fff; font-size:.68rem; font-weight:700; letter-spacing:.02em; white-space:nowrap; }

/* Phase 10: Ernstfall-Simulation, Wachdienst, Fakten-Absatz */
.mk-marke-fakten{ font-size:1.02rem; line-height:1.6; padding:14px 16px; background:var(--mk-bg-soft);
  border-left:4px solid var(--mk-blue); border-radius:0 10px 10px 0; margin:0 0 20px; }
.mk-ernstfall-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:12px; margin:16px 0 18px; }
.mk-ernstfall-karte{ position:relative; padding:14px 14px 12px; border:1px solid var(--mk-line); border-radius:12px;
  background:#fff; border-left:4px solid var(--mk-yellow); }
.mk-ernstfall-karte.ist-echt{ border-left-color:#c0392b; background:rgba(192,57,43,.05); }
.mk-ernstfall-zeichen{ display:block; font-weight:800; font-size:1.12rem; color:var(--mk-ink); letter-spacing:.01em; }
.mk-ernstfall-badge{ display:inline-block; margin:6px 0 4px; padding:1px 8px; border-radius:99px; font-size:.7rem;
  font-weight:700; text-transform:uppercase; letter-spacing:.04em; background:var(--mk-line); color:var(--mk-muted); }
.mk-ernstfall-karte.ist-echt .mk-ernstfall-badge{ background:#c0392b; color:#fff; }
.mk-ernstfall-muster{ display:block; font-size:.82rem; color:var(--mk-muted); line-height:1.35; }
.mk-ernstfall-link{ display:inline-block; margin-top:8px; font-size:.82rem; font-weight:700; color:#c0392b; }
.mk-wach-heute{ font-size:1.05rem; }
.mk-marke-pulskachel.ist-treffer .mk-marke-pulswert{ color:#c0392b; }

/* Phase 7: dynamische Bestand-Module */
.mk-marke-dynamik{ margin:14px 0 0; padding:12px 16px; background:var(--mk-bg-soft); border-left:4px solid var(--mk-yellow); border-radius:0 10px 10px 0; }
.mk-marke-puls--kompakt .mk-marke-pulskachel{ padding:14px 12px; }
.mk-marke-puls--kompakt .mk-marke-pulswert{ font-size:1.6rem; }
.mk-marke-kollisionen li a{ font-weight:700; }

/* Frontend-Glossar-Tooltips */
.mk-tip{ border-bottom:1px dotted var(--mk-blue); cursor:help; position:relative; }
.mk-tip .mk-tip-text{ display:none; position:absolute; left:0; bottom:calc(100% + 8px); z-index:50; width:280px;
  background:var(--mk-ink); color:#f0f0f1; font-size:.82rem; font-weight:400; line-height:1.5; padding:10px 12px;
  border-radius:8px; box-shadow:var(--mk-shadow); }
.mk-tip:hover .mk-tip-text,.mk-tip:focus .mk-tip-text{ display:block; }

/* PDF-Erstbericht-Formular */
.mk-marke-berichtform{ display:flex; flex-wrap:wrap; gap:12px; margin:16px 0 8px; }
.mk-marke-berichtform input[type="email"]{ flex:1 1 260px; padding:14px 16px; border:2px solid var(--mk-line);
  border-radius:12px; font-size:1rem; font-family:inherit; }
.mk-marke-berichtform input[type="email"]:focus{ outline:none; border-color:var(--mk-blue); }
.mk-marke-cta{ text-align:center; }
.mk-marke-quelle{ color:var(--mk-muted); font-size:.92rem; padding:0 6px; }
.mk-marke-quelle h2{ font-size:1.05rem; margin:0 0 10px; color:var(--mk-ink-2); }

/* Hub-Grid (Klassen-/Monats-Archive) + Shortcode [mk_neueste_marken] */
.mk-marke-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.mk-marke-gridcard{ display:flex; flex-direction:column; gap:6px; background:#fff; border:1px solid var(--mk-line);
  border-radius:14px; padding:18px 20px; box-shadow:var(--mk-shadow); color:var(--mk-ink);
  transition:transform .18s cubic-bezier(.2,.7,.2,1), box-shadow .18s ease, border-color .18s ease; position:relative; overflow:hidden; }
.mk-marke-gridcard::before{ content:""; position:absolute; top:0; left:0; width:100%; height:4px;
  background:linear-gradient(90deg,var(--mk-yellow),var(--mk-yellow-3)); }
.mk-marke-gridcard:hover{ transform:translateY(-3px); box-shadow:var(--mk-shadow-lg); border-color:var(--mk-blue); color:var(--mk-ink); }
.mk-marke-gridname{ font-weight:800; font-size:1.05rem; letter-spacing:-.01em; word-break:break-word; }
.mk-marke-gridmeta{ color:var(--mk-muted); font-size:.88rem; }
a.mk-marke-badge:hover{ border-color:var(--mk-blue); color:var(--mk-blue); }

/* Klassenumfeld-Block auf der Markenseite */
.mk-marke-umfeldklasse{ padding:14px 0; border-bottom:1px solid var(--mk-line); }
.mk-marke-umfeldklasse:last-child{ border-bottom:0; padding-bottom:0; }
.mk-marke-umfeldklasse h3{ font-size:1.02rem; margin:0 0 6px; }
.mk-marke-umfeldklasse p{ margin:0; color:var(--mk-ink-2); }

/* Pagination der Hubs (WP-Standardklassen) */
.mk-marke-hub .pagination,.mk-marke-hub .page-numbers{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.mk-marke-hub .page-numbers li{ list-style:none; }
.mk-marke-hub a.page-numbers,.mk-marke-hub span.page-numbers{ display:inline-block; padding:9px 15px; border:1px solid var(--mk-line);
  border-radius:10px; background:#fff; font-weight:600; color:var(--mk-ink); }
.mk-marke-hub span.page-numbers.current{ background:var(--mk-blue); border-color:var(--mk-blue); color:#fff; }
.mk-marke-hub a.page-numbers:hover{ border-color:var(--mk-blue); color:var(--mk-blue); }

@media (max-width:980px){
  .mk-marke-beobachtung{ grid-template-columns:1fr; }
  .mk-marke-umfeld{ columns:1; }
  .mk-marke-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .mk-markehero{ padding:60px 0 36px; }
  .mk-marke-card{ padding:22px 20px; }
  .mk-marke-tabelle th{ width:120px; white-space:normal; padding-right:12px; }
  .mk-marke-grid{ grid-template-columns:1fr; }
}


/* ===== Sprachwechsler (mk-lang, i18n) — SVG-Flaggen-Dropdown ===== */
/* Divi-sicher: hohe Spezifitaet + !important, damit #top-menu li a nichts ueberschreibt. */
.mk-langswitch{position:relative;display:flex;align-items:center;margin-left:16px}
.mk-langswitch-dd{position:relative}
.mk-langswitch .mk-flag{display:inline-block;width:21px;height:14px;border-radius:2px;overflow:hidden;
  flex:0 0 auto;box-shadow:0 0 0 1px rgba(0,0,0,.10)}
.mk-langswitch .mk-flag svg{display:block;width:100%;height:100%}
.mk-langswitch .mk-langswitch-btn{display:inline-flex;align-items:center;gap:7px;cursor:pointer;
  margin:0;padding:6px 10px !important;border:1px solid rgba(0,0,0,.16);border-radius:9px;background:#fff;
  color:#1a1a2e !important;font:inherit;font-size:13px !important;font-weight:700;letter-spacing:.03em;
  line-height:1 !important;text-transform:none !important;-webkit-appearance:none;appearance:none;
  transition:border-color .15s,box-shadow .15s}
.mk-langswitch .mk-langswitch-btn:hover{border-color:var(--mk-blue)}
.mk-langswitch-dd.is-open .mk-langswitch-btn{border-color:var(--mk-blue);box-shadow:0 0 0 3px rgba(20,30,200,.12)}
.mk-langswitch .mk-langswitch-caret{opacity:.6;flex:0 0 auto;transition:transform .15s}
.mk-langswitch-dd.is-open .mk-langswitch-caret{transform:rotate(180deg)}
.mk-langswitch .mk-langswitch-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:9999;min-width:184px;
  display:none;padding:6px;background:#fff;border:1px solid rgba(0,0,0,.1);border-radius:11px;
  box-shadow:0 14px 38px rgba(0,0,0,.17)}
.mk-langswitch-dd.is-open .mk-langswitch-menu{display:block}
.mk-langswitch .mk-langswitch-menu a.mk-langswitch-opt{display:flex !important;align-items:center;gap:9px;
  width:auto;margin:0;padding:8px 10px !important;border-radius:7px;background:none;
  font-size:14px !important;font-weight:500;line-height:1 !important;letter-spacing:normal;
  text-transform:none !important;text-decoration:none !important;color:#1a1a2e !important;white-space:nowrap}
.mk-langswitch .mk-langswitch-menu a.mk-langswitch-opt:hover{background:rgba(20,30,200,.08);color:var(--mk-blue) !important}
.mk-langswitch .mk-langswitch-menu a.mk-langswitch-opt.is-active{font-weight:700;
  color:var(--mk-blue) !important;background:rgba(20,30,200,.06)}
/* Mobile (Divi-Menue): inline statt Overlay */
#mobile_menu .mk-langswitch,.et_mobile_menu .mk-langswitch{margin-left:0;padding:10px 5%;width:100%}
#mobile_menu .mk-langswitch-dd,.et_mobile_menu .mk-langswitch-dd{width:100%}
#mobile_menu .mk-langswitch-menu,.et_mobile_menu .mk-langswitch-menu{position:static;min-width:0;
  border:none;box-shadow:none;padding:6px 0 0}

/* ---------- Verfahrens-Ticker (mk-fall) ---------- */
.mk-fallticker-box{ max-width:860px; margin:26px auto 0; border:1px solid var(--mk-line); border-radius:var(--mk-radius-lg); box-shadow:var(--mk-shadow-lg); background:#fff; padding:26px 28px; }
.mk-fallticker-stand{ display:inline-flex; align-items:center; gap:8px; font-size:.85rem; font-weight:700; color:var(--mk-blue); text-transform:uppercase; letter-spacing:.04em; margin-bottom:16px; }
.mk-fallticker-stand::before{ content:""; width:9px; height:9px; border-radius:50%; background:#2ecc71; animation:mk-fall-pulse 1.8s ease-in-out infinite; }
@keyframes mk-fall-pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }
@media (prefers-reduced-motion:reduce){ .mk-fallticker-stand::before{ animation:none; } }
.mk-fallticker-list{ list-style:none; margin:0; padding:0; }
.mk-fallticker-item{ display:flex; gap:16px; padding:12px 0; border-top:1px solid var(--mk-line); }
.mk-fallticker-item:first-child{ border-top:none; padding-top:0; }
.mk-fallticker-date{ flex:0 0 92px; font-weight:700; font-size:.92rem; color:var(--mk-ink); }
.mk-fallticker-text{ flex:1 1 auto; font-size:.95rem; color:var(--mk-muted); line-height:1.55; }
.mk-fallticker-item--new .mk-fallticker-date{ color:var(--mk-blue); }
.mk-fallticker-src{ font-size:.85rem; white-space:nowrap; }
.mk-fallticker-empty{ color:var(--mk-muted); }
.mk-fallticker-note{ margin-top:16px; padding-top:14px; border-top:1px solid var(--mk-line); font-size:.85rem; color:var(--mk-muted); }
@media (max-width:640px){
  .mk-fallticker-box{ padding:20px 18px; }
  .mk-fallticker-item{ flex-direction:column; gap:3px; }
  .mk-fallticker-date{ flex-basis:auto; }
}

/* ---------- v0.18: Hero-Schrittzeile, Kalender, Verfahrensdauer, Handelsregister ---------- */

/* Die eine Zeile im Hero, die fuer DIESE Marke gilt. Farbe = Dringlichkeit. */
.mk-hero-schritt{ display:inline-flex; align-items:center; gap:10px; margin:0 0 18px;
  padding:11px 18px 11px 16px; border-radius:999px; font-weight:700; font-size:1.02rem; line-height:1.35;
  background:#fff; border:1px solid var(--mk-line); box-shadow:0 8px 22px rgba(11,13,26,.07); }
.mk-hero-schritt::before{ content:""; flex:0 0 10px; width:10px; height:10px; border-radius:50%; background:var(--mk-blue); }
.mk-hero-schritt.ist-frist{ border-color:rgba(192,57,43,.35); color:#9c2c20; }
.mk-hero-schritt.ist-frist::before{ background:#c0392b; animation:mk-puls 2.2s ease-in-out infinite; }
.mk-hero-schritt.ist-warten{ color:var(--mk-ink-2); }
.mk-hero-schritt.ist-termin{ color:var(--mk-ink-2); }
.mk-hero-schritt.ist-chance{ border-color:rgba(0,0,240,.3); color:var(--mk-blue); }
.mk-hero-schritt.ist-chance::before{ background:var(--mk-yellow); box-shadow:0 0 0 3px rgba(245,218,35,.35); }
.mk-hero-schritt.ist-ende{ color:var(--mk-muted); }
.mk-hero-schritt.ist-ende::before{ background:var(--mk-muted); }
@keyframes mk-puls{ 0%,100%{ opacity:1; transform:scale(1); } 50%{ opacity:.45; transform:scale(1.35); } }
@media (prefers-reduced-motion:reduce){ .mk-hero-schritt.ist-frist::before{ animation:none; } }

/* Kalender-Download */
.mk-marke-kalender{ margin-top:26px; padding-top:22px; border-top:1px solid var(--mk-line); }
.mk-kalender-btn{ display:inline-flex; align-items:center; gap:9px; }
.mk-kalender-btn svg{ width:18px; height:18px; }

/* Verfahrensdauer: Fazitzeile unter dem Chart */
.mk-marke-dauer-fazit{ margin-top:6px; padding:14px 18px; border-radius:14px; background:var(--mk-bg-soft);
  border-left:4px solid var(--mk-blue); font-weight:600; }
.mk-marke-dauer-fazit.ist-lang{ border-left-color:#c0392b; background:rgba(192,57,43,.06); }
.mk-marke-dauer-fazit.ist-schnell{ border-left-color:var(--mk-yellow); }

/* Handelsregister-Treffer */
.mk-firmen-liste{ list-style:none; margin:14px 0 0; padding:0; display:grid; gap:10px; }
.mk-firmen-liste li{ display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 12px;
  padding:13px 16px; border:1px solid var(--mk-line); border-radius:14px; background:#fff; }
.mk-firmen-liste li.ist-fremd{ border-left:4px solid #c0392b; }
.mk-firmen-liste li.ist-eigen{ border-left:4px solid var(--mk-blue); background:var(--mk-bg-soft); }
.mk-firmen-liste li > a,.mk-firmen-name{ font-weight:700; color:var(--mk-ink); }
.mk-firmen-liste li > span{ color:var(--mk-muted); font-size:.92rem; }
.mk-firmen-eigen{ margin-left:auto; padding:3px 10px; border-radius:999px; font-style:normal;
  font-size:.78rem; font-weight:700; background:var(--mk-blue); color:#fff; }
.mk-firmen-laedt{ color:var(--mk-muted); }
.mk-marke-quelle-zeile{ margin-top:16px; padding-top:12px; border-top:1px solid var(--mk-line);
  font-size:.85rem; color:var(--mk-muted); }
@media (max-width:640px){
  .mk-hero-schritt{ display:flex; border-radius:14px; font-size:.96rem; }
  .mk-firmen-eigen{ margin-left:0; }
}

/* ---------- v0.19: automatische interne Verlinkung ---------- */

/* Auto-Links sollen wie normale Textlinks aussehen – erkennbar, aber ruhig.
   Kein eigener Farbton: der Leser soll nicht raten, was «anders» daran ist. */
.mk-autolink{ color:var(--mk-blue); text-decoration:underline; text-decoration-thickness:1px;
  text-underline-offset:2px; text-decoration-color:rgba(0,0,240,.35); }
.mk-autolink:hover{ text-decoration-color:var(--mk-blue); }

/* Der Glossar-Begriff ist jetzt selbst der Link (statt «Mehr dazu →» im
   aufklappenden Kasten). Die gepunktete Linie bleibt das Tooltip-Signal. */
.mk-tip-link{ color:inherit; text-decoration:none; }
.mk-tip:hover .mk-tip-link,.mk-tip:focus-within .mk-tip-link{ color:var(--mk-blue); }
.mk-tip .mk-tip-text a{ color:#fff; text-decoration:underline; }

/* ============================================================================
   v0.20 – Scroll-Choreografie der Markenseite
   Alles hier ist Zugabe: Ohne JS, ohne moderne Browser-Features oder bei
   «prefers-reduced-motion» bleibt die Seite vollstaendig und ruhig stehen.
   ========================================================================= */

/* ---- Lesefortschritt: duenne Leiste am oberen Rand ---- */
.mk-progress{ position:fixed; top:0; left:0; right:0; height:3px; z-index:99990; pointer-events:none;
  opacity:0; transition:opacity .35s ease; }
.mk-progress.is-on{ opacity:1; }
.mk-progress i{ display:block; height:100%; transform:scaleX(0); transform-origin:0 50%;
  background:linear-gradient(90deg,var(--mk-blue),var(--mk-yellow)); will-change:transform; }

/* ---- Kapitel-Rail: Scroll-Spy am linken Rand (nur sehr breite Fenster) ---- */
.mk-rail{ position:fixed; left:24px; top:50%; transform:translateY(-50%); z-index:60; }
.mk-rail ol{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
.mk-rail a{ display:flex; align-items:center; gap:10px; padding:5px 8px; border-radius:999px;
  text-decoration:none; color:var(--mk-muted); font-size:.8rem; line-height:1.2;
  transition:color .25s ease, background .25s ease; }
.mk-rail-nr{ flex:0 0 auto; width:7px; height:7px; border-radius:50%; background:var(--mk-line);
  transition:background .25s ease, transform .25s ease, box-shadow .25s ease; }
.mk-rail-txt{ max-width:0; overflow:hidden; white-space:nowrap; opacity:0;
  transition:max-width .35s var(--mk-anim-ease), opacity .25s ease; }
.mk-rail:hover .mk-rail-txt,.mk-rail a:focus-visible .mk-rail-txt{ max-width:200px; opacity:1; }
.mk-rail a:hover{ color:var(--mk-ink); }
.mk-rail a:hover .mk-rail-nr{ background:var(--mk-blue-2); transform:scale(1.25); }
.mk-rail a.is-akt{ color:var(--mk-blue); font-weight:700; }
.mk-rail a.is-akt .mk-rail-nr{ background:var(--mk-blue); transform:scale(1.5);
  box-shadow:0 0 0 4px rgba(0,0,240,.14); }
.mk-rail a.is-akt .mk-rail-txt{ max-width:200px; opacity:1; }
@media (max-width:1460px){ .mk-rail{ display:none; } }

/* ---- Karten: sanftes Anheben beim Zeigen (kein Hoppeln, kein Schlagschatten) ---- */
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .mk-marke-card{ transition:transform .4s var(--mk-anim-ease), box-shadow .4s var(--mk-anim-ease),
    border-color .4s ease; }
  .mk-marke-card:hover{ transform:translateY(-3px); border-color:var(--mk-line-2,#d7dae8);
    box-shadow:0 18px 44px rgba(11,13,26,.09); }
}

@media (prefers-reduced-motion:no-preference){

  /* ---- Charts zeichnen sich von links nach rechts ----
     Bewusst als Animation statt als Transition vom versteckten Grundzustand:
     Ohne die Reveal-Klasse hat das Chart gar keinen clip-path. Bleibt die
     Animation aus welchem Grund auch immer stehen, ist das Chart sichtbar –
     ein Schmuckeffekt darf nie Inhalt verschlucken. */
  .mk-reveal.is-in .mk-chart{ animation:mk-chart-wipe 1.05s var(--mk-anim-ease) .1s both; }

  /* ---- Listen und Raster laufen gestaffelt ein ---- */
  .mk-reveal.is-in .mk-marke-fahrplan li,
  .mk-reveal.is-in .mk-marke-umfeld li,
  .mk-reveal.is-in .mk-firmen-liste li,
  .mk-reveal.is-in .mk-marke-grid > *,
  .mk-reveal.is-in .mk-domain-karte,
  .mk-reveal.is-in .mk-mehr-gruppe{ animation:mk-rise .5s var(--mk-anim-ease) both; }
  .mk-reveal.is-in li:nth-child(2),.mk-reveal.is-in .mk-marke-grid > *:nth-child(2),
  .mk-reveal.is-in .mk-domain-karte:nth-child(2){ animation-delay:.05s; }
  .mk-reveal.is-in li:nth-child(3),.mk-reveal.is-in .mk-marke-grid > *:nth-child(3),
  .mk-reveal.is-in .mk-domain-karte:nth-child(3){ animation-delay:.10s; }
  .mk-reveal.is-in li:nth-child(4),.mk-reveal.is-in .mk-marke-grid > *:nth-child(4),
  .mk-reveal.is-in .mk-domain-karte:nth-child(4){ animation-delay:.15s; }
  .mk-reveal.is-in li:nth-child(5),.mk-reveal.is-in .mk-marke-grid > *:nth-child(5){ animation-delay:.20s; }
  .mk-reveal.is-in li:nth-child(6),.mk-reveal.is-in .mk-marke-grid > *:nth-child(6){ animation-delay:.25s; }
  .mk-reveal.is-in li:nth-child(n+7){ animation-delay:.30s; }

  /* ---- Hero: die Schrittzeile kommt zuerst, dann die Badges ---- */
  .mk-hero-schritt{ animation:mk-rise .6s var(--mk-anim-ease) .15s both; }
  .mk-markehero--v2 .mk-marke-badges{ animation:mk-rise .6s var(--mk-anim-ease) .28s both; }
}

/* ---- Zeitachse: Linie mit Punkten, die beim Scrollen mitwaechst ---- */
@media (min-width:700px){
  .mk-marke-fahrplan{ position:relative; }
  /* Die Datumsspalte ist 92px breit, dann 14px Abstand – die Achse liegt in
     dieser Luecke. Hervorgehobene Zeilen haben 12px Innenabstand, ihr Punkt
     wandert deshalb um denselben Betrag mit. */
  .mk-marke-fahrplan::before{ content:""; position:absolute; left:100px; top:18px; bottom:18px; width:2px;
    background:var(--mk-line); }
  .mk-marke-fahrplan li::before{ content:""; position:absolute; left:96px; top:19px; z-index:1;
    width:9px; height:9px; border-radius:50%; background:#fff; border:2px solid var(--mk-line-2,#cfd3e4);
    box-sizing:content-box; }
  .mk-marke-fahrplan li.ist-aktuell::before,
  .mk-marke-fahrplan li.ist-ende::before{ left:108px; }
  .mk-marke-fahrplan li.ist-vergangen::before{ background:var(--mk-line-2,#cfd3e4); }
  .mk-marke-fahrplan li.ist-aktuell::before{ border-color:var(--mk-yellow); background:var(--mk-yellow);
    box-shadow:0 0 0 4px rgba(245,218,35,.30); }
  .mk-marke-fahrplan li.ist-kommend::before{ border-color:var(--mk-blue); }
  .mk-marke-fahrplan li.ist-ende::before{ border-color:#c0392b; background:#c0392b; }

  /* Die gefuellte Linie laeuft mit dem Scrollstand – rein deklarativ, ohne JS.
     Browser ohne Scroll-Timelines zeigen einfach die graue Grundlinie. */
  @supports (animation-timeline:view()){
    @media (prefers-reduced-motion:no-preference){
      .mk-marke-fahrplan::after{ content:""; position:absolute; left:100px; top:18px; bottom:18px; width:2px;
        background:linear-gradient(180deg,var(--mk-blue),var(--mk-yellow));
        transform:scaleY(0); transform-origin:top;
        animation:mk-fahrplan-fill linear both;
        animation-timeline:view(); animation-range:entry 15% cover 65%; }
    }
  }
}
@keyframes mk-fahrplan-fill{ to{ transform:scaleY(1); } }
@keyframes mk-chart-wipe{ from{ clip-path:inset(0 100% 0 0); } to{ clip-path:inset(0 0 0 0); } }

/* ---- Monogramm im Hero driftet beim Scrollen (JS setzt --mk-par) ---- */
@media (prefers-reduced-motion:no-preference){
  /* translateY(-52%) aus der Grundregel muss erhalten bleiben, sonst springt
     das Monogramm beim ersten Scroll-Frame nach unten. */
  .mk-marke-monogramm{ transform:translate3d(0,calc(-52% + var(--mk-par,0) * 1px),0); will-change:transform; }
}
