@font-face{font-family:'Inter';font-style:normal;font-weight:400 800;font-display:swap;src:url('/wp-content/uploads/fonts/InterVariable-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 800;font-display:swap;src:url('/wp-content/uploads/fonts/InterVariable-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{
  --violet-600:#7c3aed;--violet-700:#6d28d9;--purple-600:#9333ea;--purple-700:#7e22ce;
  --slate-900:#0f172a;--slate-800:#1e293b;--slate-700:#334155;--slate-600:#475569;
  --slate-500:#64748b;--slate-400:#94a3b8;--slate-300:#cbd5e1;--slate-200:#e2e8f0;
  --slate-100:#f1f5f9;--slate-50:#f8fafc;--emerald-500:#10b981;--orange-500:#fb923c;--orange-600:#f97316;
}
.st-home *{box-sizing:border-box;margin:0;padding:0}
.st-home{font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:var(--slate-900);line-height:1.5;-webkit-font-smoothing:antialiased;background:#fff;overflow-x:clip}
.st-home a{text-decoration:none;color:inherit}
.st-home svg{display:block}
.st-wrap{max-width:1152px;margin:0 auto;padding:0 24px}
.st-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;border-radius:16px;transition:all .2s;cursor:pointer;border:none}
.st-btn-primary{color:#fff;background:linear-gradient(to right,var(--violet-600),var(--purple-600));box-shadow:0 20px 25px -5px rgba(124,58,237,.25)}
.st-btn-primary:hover{background:linear-gradient(to right,var(--violet-700),var(--purple-700));transform:scale(1.02)}
.st-grad{background:linear-gradient(to right,var(--violet-600),var(--purple-600));-webkit-background-clip:text;background-clip:text;color:transparent}

/* NAV */
.st-nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(20px);border-bottom:1px solid var(--slate-100);box-shadow:0 1px 3px rgba(15,23,42,.05)}
.st-nav-inner{max-width:1152px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:16px 24px}
.st-logo img{height:40px;width:auto;display:block}
.st-nav-links{display:flex;align-items:center;gap:12px}
.st-nav-link{font-size:14px;font-weight:500;color:var(--slate-600);padding:8px 16px;transition:color .2s}
.st-nav-link:hover{color:var(--slate-900)}
.st-nav-cta{font-size:14px;font-weight:500;color:#fff;background:linear-gradient(to right,var(--violet-600),var(--purple-600));padding:10px 20px;border-radius:12px;box-shadow:0 4px 6px -1px rgba(124,58,237,.2);transition:all .2s}
.st-nav-cta:hover{background:linear-gradient(to right,var(--violet-700),var(--purple-700));box-shadow:0 10px 15px -3px rgba(124,58,237,.3)}

/* HERO */
.st-hero{position:relative;padding:128px 0 80px;overflow:hidden}
.st-hero-bg{position:absolute;inset:0;background:linear-gradient(to bottom right,rgba(245,243,255,.8),#fff 55%,rgba(255,251,235,.5))}
.st-blob{position:absolute;border-radius:9999px;filter:blur(64px)}
.st-blob-1{top:80px;left:25%;height:288px;width:288px;background:rgba(196,181,253,.3)}
.st-blob-2{bottom:40px;right:25%;height:256px;width:256px;background:rgba(253,230,138,.3)}
.st-hero-inner{position:relative;max-width:1152px;margin:0 auto;padding:0 24px}
.st-hero-center{max-width:768px;margin:0 auto;text-align:center}
.st-badge{display:inline-flex;align-items:center;gap:8px;background:#f5f3ff;border:1px solid #ede9fe;color:var(--violet-700);padding:8px 16px;border-radius:9999px;font-size:14px;font-weight:500}
.st-h1{font-size:60px;font-weight:800;letter-spacing:-.02em;line-height:1.1;margin:32px 0}
.st-hero-p{font-size:20px;color:var(--slate-500);max-width:640px;margin:0 auto 32px;line-height:1.6}
.st-hero-btns{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}
.st-hero-btns .st-btn-primary{font-size:16px;padding:16px 32px;border-radius:16px;box-shadow:0 25px 50px -12px rgba(124,58,237,.35)}
.st-btn-ghost{font-size:16px;color:var(--slate-700);background:#fff;border:2px solid var(--slate-200);padding:15px 32px;border-radius:16px;transition:all .2s}
.st-btn-ghost:hover{border-color:var(--slate-300);box-shadow:0 4px 6px -1px rgba(0,0,0,.1)}
.st-trust{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 32px;padding-top:32px;font-size:14px;color:var(--slate-400)}
.st-trust span{display:flex;align-items:center;gap:6px}
.st-trust svg{color:var(--emerald-500)}

/* HERO CARD */
.st-hero-visual{margin:64px auto 0;max-width:512px}
.st-card-frame{border-radius:24px;background:linear-gradient(to bottom right,var(--slate-900),var(--slate-800));padding:4px;box-shadow:0 25px 50px -12px rgba(148,163,184,.5)}
.st-card{border-radius:21px;background:#fff;padding:32px}
.st-card-head{display:flex;align-items:center;gap:12px}
.st-card-ico{height:40px;width:40px;border-radius:12px;background:linear-gradient(to bottom right,#8b5cf6,var(--purple-600));display:flex;align-items:center;justify-content:center;flex-shrink:0}
.st-card-ico svg{color:#fff}
.st-card-name{font-weight:600;color:var(--slate-900);font-size:14px}
.st-card-sub{font-size:12px;color:var(--slate-400)}
.st-card-body{text-align:center;padding:16px 0}
.st-card-q{font-size:14px;color:var(--slate-500);margin-bottom:12px}
.st-stars{display:flex;justify-content:center;gap:6px;margin-bottom:12px}
.st-star-on{color:#fbbf24;fill:#fbbf24}
.st-star-off{color:#e2e8f0;fill:#f1f5f9}
.st-card-mood{font-size:14px;font-weight:500;color:var(--slate-700);display:flex;align-items:center;justify-content:center;gap:8px}
.st-tags{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.st-tag{border-radius:9999px;background:#d1fae5;padding:6px 14px;font-size:12px;font-weight:500;color:#047857}

/* FEATURES */
.st-sec{padding:52px 0}
.st-sec-slate{background:rgba(248,250,252,.5)}
.st-sec-head{text-align:center;max-width:672px;margin:0 auto 64px}
.st-eyebrow{font-size:14px;font-weight:600;color:var(--orange-600);text-transform:uppercase;letter-spacing:.05em;margin-bottom:16px}
.st-h2{font-size:36px;font-weight:800;color:var(--slate-900);line-height:1.2;margin-bottom:16px}
.st-sec-sub{font-size:18px;color:var(--slate-500)}
.st-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.st-feat{border-radius:16px;background:#fff;border:1px solid rgba(226,232,240,.8);padding:24px;transition:all .3s}
.st-feat:hover{box-shadow:0 20px 25px -5px rgba(0,0,0,.1);border-color:var(--slate-300);transform:translateY(-4px)}
.st-feat-ico{display:inline-flex;height:48px;width:48px;align-items:center;justify-content:center;border-radius:12px;color:#fff;margin-bottom:20px;box-shadow:0 10px 15px -3px rgba(0,0,0,.15)}
.st-feat-ico svg{width:24px;height:24px}
.st-feat h3{font-size:18px;font-weight:700;color:var(--slate-900);margin-bottom:8px}
.st-feat p{font-size:14px;color:var(--slate-500);line-height:1.6}
.g-violet{background:linear-gradient(to bottom right,#8b5cf6,var(--purple-600))}
.g-amber{background:linear-gradient(to bottom right,#f59e0b,#ea580c)}
.g-emerald{background:linear-gradient(to bottom right,#10b981,#0d9488)}
.g-blue{background:linear-gradient(to bottom right,#3b82f6,#4f46e5)}
.g-rose{background:linear-gradient(to bottom right,#f43f5e,#db2777)}
.g-slate{background:linear-gradient(to bottom right,#475569,#1e293b)}

/* CONTENT POOL */
.st-cp{border-radius:24px;border:1px solid #ede9fe;background:linear-gradient(to bottom right,#f5f3ff,#fff 55%,rgba(255,251,235,.4));padding:64px;position:relative;overflow:hidden}
.st-cp-grid{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.st-cp h2{font-size:36px;font-weight:800;color:var(--slate-900);line-height:1.2;margin:16px 0}
.st-cp-p{font-size:18px;color:var(--slate-500);line-height:1.6}
.st-cp-badge{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid #ede9fe;color:var(--violet-700);padding:8px 16px;border-radius:9999px;font-size:14px;font-weight:500;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.st-cp-points{margin:32px 0}
.st-cp-point{display:flex;gap:16px;margin-bottom:20px}
.st-cp-point-ico{flex-shrink:0;height:44px;width:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;background:linear-gradient(to bottom right,#8b5cf6,var(--purple-600));color:#fff;box-shadow:0 10px 15px -3px rgba(124,58,237,.2)}
.st-cp-point h3{font-weight:700;color:var(--slate-900)}
.st-cp-point p{font-size:14px;color:var(--slate-500);line-height:1.6;margin-top:4px}
.st-cp .st-btn-primary{font-size:16px;padding:14px 28px}
/* weekly plan mock */
.st-plan .st-card{padding:24px}
.st-plan-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.st-plan-title{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--slate-900);font-size:14px}
.st-plan-title svg{color:var(--violet-600)}
.st-pill-amber{border-radius:9999px;background:#fef3c7;padding:4px 12px;font-size:12px;font-weight:500;color:#b45309}
.st-post{border-radius:16px;border:1px solid var(--slate-200);overflow:hidden;margin-bottom:16px}
.st-post-img{height:112px;background:linear-gradient(to bottom right,#a78bfa,#a855f7,#fb7185);display:flex;align-items:center;justify-content:center}
.st-post-img svg{color:rgba(255,255,255,.7);width:32px;height:32px}
.st-post-body{padding:16px}
.st-post-body p{font-size:14px;color:var(--slate-700);line-height:1.6;margin-bottom:10px}
.st-hashtags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.st-hashtags span{font-size:12px;font-weight:500;color:var(--violet-600)}
.st-post-meta{display:flex;align-items:center;justify-content:space-between}
.st-src{font-size:12px;color:var(--slate-400);display:flex;align-items:center;gap:6px}
.st-approved{display:inline-flex;align-items:center;gap:4px;border-radius:8px;background:#d1fae5;padding:4px 10px;font-size:12px;font-weight:500;color:#047857}
.st-row{display:flex;align-items:center;gap:12px;border-radius:12px;background:var(--slate-50);padding:10px 12px;margin-bottom:10px}
.st-row-day{flex-shrink:0;height:32px;width:32px;border-radius:8px;background:#fff;border:1px solid var(--slate-200);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--slate-600)}
.st-row p{font-size:14px;color:var(--slate-600);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.st-row-tag{border-radius:9999px;padding:2px 10px;font-size:12px;font-weight:500}
.st-tag-blue{background:#dbeafe;color:#1d4ed8}
.st-tag-violet{background:#ede9fe;color:var(--violet-700)}

/* STEPS */
.st-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.st-step{text-align:center;position:relative}
.st-step-num{display:inline-flex;height:64px;width:64px;align-items:center;justify-content:center;border-radius:16px;background:linear-gradient(to bottom right,#8b5cf6,var(--purple-600));color:#fff;font-weight:700;font-size:18px;box-shadow:0 20px 25px -5px rgba(124,58,237,.25);margin-bottom:16px}
.st-step h3{font-size:18px;font-weight:700;color:var(--slate-900);margin-bottom:8px}
.st-step p{font-size:14px;color:var(--slate-500);line-height:1.6}

/* STATS */
.st-stats{padding:64px 0;background:linear-gradient(to right,var(--violet-600),var(--purple-700))}
.st-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;text-align:center}
.st-stat-v{font-size:40px;font-weight:800;color:#fff}
.st-stat-l{font-size:14px;color:#ddd6fe;margin-top:4px}

/* CTA */
.st-cta{border-radius:24px;background:linear-gradient(to bottom right,var(--slate-900),var(--slate-800),var(--slate-900));padding:56px;text-align:center;position:relative;overflow:hidden}
.st-cta h2{font-size:36px;font-weight:800;color:#fff;margin-bottom:24px}
.st-cta p{font-size:18px;color:var(--slate-400);max-width:576px;margin:0 auto 24px}
.st-cta .st-btn{font-size:16px;padding:16px 32px;color:var(--slate-900);background:#fff;box-shadow:0 20px 25px -5px rgba(0,0,0,.3)}
.st-cta .st-btn:hover{background:var(--slate-50);transform:scale(1.02)}

/* FOOTER */
.st-footer{border-top:1px solid var(--slate-100);padding:48px 0;background:rgba(248,250,252,.5)}
.st-footer-top{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.st-footer-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:24px;font-size:14px;color:var(--slate-500)}
.st-footer-links a:hover{color:var(--slate-900)}
.st-footer-bottom{margin-top:32px;padding-top:24px;border-top:1px solid var(--slate-200);text-align:center}
.st-footer-bottom p{font-size:12px;color:var(--slate-400)}

@media(max-width:900px){
  .st-h1{font-size:44px}
  .st-grid-3{grid-template-columns:1fr 1fr}
  .st-grid-4{grid-template-columns:1fr 1fr}
  .st-cp{padding:40px}
  .st-cp-grid{grid-template-columns:1fr;gap:40px}
}
@media(max-width:640px){
  .st-h1{font-size:34px}
  .st-hero{padding:96px 0 64px}
  .st-hero-p{font-size:18px}
  .st-grid-3,.st-grid-4,.st-stats-grid{grid-template-columns:1fr 1fr}
  .st-sec{padding:72px 0}
  .st-cp{padding:28px}
  .st-cta{padding:32px}
  .st-h2,.st-cp h2,.st-cta h2{font-size:28px}
  .st-nav-link.st-hide-sm{display:none}
  .st-hero-btns .st-btn{width:100%}
}

/* --- Override theme/Elementor global colors: keep intended white/light text --- */
.st-home .st-nav-cta,
.st-home .st-btn-primary,
.st-home .st-stat-v,
.st-home .st-cta h2,
.st-home .st-step-num{color:#fff!important}
.st-home .st-stat-l{color:#ddd6fe!important}
.st-home .st-cta p{color:#94a3b8!important}
.st-home .st-card-name{color:var(--slate-900)!important}
.st-home .st-grad{color:transparent!important}
.st-home .st-feat-ico,
.st-home .st-cp-point-ico,
.st-home .st-card-ico,
.st-home .st-step-num{color:#fff}
.st-home .st-feat-ico svg,
.st-home .st-cp-point-ico svg,
.st-home .st-card-ico svg,
.st-home .st-post-img svg{color:#fff!important;stroke:#fff!important}
.st-home .st-btn-primary svg,
.st-home .st-nav-cta svg{stroke:#fff!important}
.st-home .st-cta .st-btn{color:var(--slate-900)!important}
.st-home .st-cta .st-btn svg{stroke:var(--slate-900)!important}
.st-home h1,.st-home h2,.st-home h3,.st-home p,.st-home span,.st-home a{margin:0}

/* ============ RATGEBER-VORLAGE — ARTIKEL-CONTENT ============ */
/* Ratgeber-Hero (schlanker als Homepage-Hero) */
.st-art-hero{position:relative;padding:36px 0 20px;overflow:hidden}
.st-art-hero .st-hero-bg{position:absolute;inset:0;background:linear-gradient(to bottom right,rgba(245,243,255,.8),#fff 60%,rgba(255,251,235,.4))}
.st-art-hero-inner{position:relative;max-width:820px;margin:0 auto;padding:0 24px;text-align:center}
.st-art-h1{font-size:44px;font-weight:800;letter-spacing:-.02em;line-height:1.15;margin:24px 0 16px}
.st-art-lead{font-size:20px;color:var(--slate-500);max-width:680px;margin:0 auto;line-height:1.6}
.st-art-meta{margin-top:24px;font-size:14px;color:var(--slate-400);display:flex;gap:20px;justify-content:center;flex-wrap:wrap}
.st-art-meta span{display:flex;align-items:center;gap:6px}

/* Artikel-Körper */
.st-article{max-width:1152px;margin:0 auto;padding:0 32px}
.st-article h2{font-size:28px;font-weight:800;color:var(--slate-900);line-height:1.25;margin:48px 0 16px;letter-spacing:-.01em}
.st-article h3{font-size:20px;font-weight:700;color:var(--slate-800);line-height:1.3;margin:32px 0 12px}
.st-article p{font-size:17px;color:var(--slate-700);line-height:1.75;margin:0 0 20px}
.st-article ul,.st-article ol{margin:0 0 24px;padding-left:4px;list-style:none}
.st-article ul li,.st-article ol li{position:relative;font-size:17px;color:var(--slate-700);line-height:1.7;padding-left:32px;margin-bottom:12px}
.st-article ul li::before{content:'';position:absolute;left:4px;top:10px;width:8px;height:8px;border-radius:9999px;background:linear-gradient(to bottom right,var(--violet-600),var(--purple-600))}
.st-article ol{counter-reset:st-ol}
.st-article ol li{counter-increment:st-ol}
.st-article ol li::before{content:counter(st-ol);position:absolute;left:0;top:2px;width:22px;height:22px;border-radius:7px;background:#f5f3ff;color:var(--violet-700);font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}
.st-article a{color:var(--violet-700);font-weight:600;border-bottom:1px solid #ddd6fe;transition:all .2s}
.st-article a:hover{border-bottom-color:var(--violet-600);color:var(--violet-600)}
.st-article strong{color:var(--slate-900);font-weight:700}

/* Info-/Tipp-Kasten */
.st-callout{border-radius:16px;background:#f5f3ff;border:1px solid #ede9fe;padding:24px 28px;margin:32px 0;display:flex;gap:16px}
.st-callout-ico{flex-shrink:0;height:40px;width:40px;border-radius:10px;background:linear-gradient(to bottom right,#8b5cf6,var(--purple-600));display:flex;align-items:center;justify-content:center;color:#fff}
.st-callout-ico svg{color:#fff;stroke:#fff}
.st-callout h4{font-size:16px;font-weight:700;color:var(--slate-900);margin:0 0 6px}
.st-callout p{font-size:15px;color:var(--slate-600);line-height:1.6;margin:0}

/* FAQ-Block */
.st-faq{margin:40px 0}
.st-faq-item{border:1px solid var(--slate-200);border-radius:14px;padding:20px 24px;margin-bottom:14px;background:#fff}
.st-faq-item h3{font-size:17px;font-weight:700;color:var(--slate-900);margin:0 0 8px}
.st-faq-item p{font-size:16px;color:var(--slate-600);line-height:1.7;margin:0}

/* ── Auflockerungs-Elemente (Inline-Blöcke im Artikel-Fließtext, 760px-Leseachse). Icons als Inline-SVG, KEINE Emojis. ── */
.st-note{display:flex;gap:16px;border-radius:16px;border:1px solid;padding:20px 24px;margin:32px 0}
.st-note-ico{flex-shrink:0;height:40px;width:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff}
.st-note-ico svg{width:20px;height:20px;color:#fff;stroke:#fff}
.st-note h4{font-size:16px;font-weight:700;color:var(--slate-900);margin:0 0 6px}
.st-note p{font-size:15px;color:var(--slate-600);line-height:1.6;margin:0}
.st-note-warn{background:#fffbeb;border-color:#fde68a}.st-note-warn .st-note-ico{background:#f59e0b}
.st-note-tip{background:#ecfdf5;border-color:#a7f3d0}.st-note-tip .st-note-ico{background:#10b981}
.st-note-info{background:#f5f3ff;border-color:#e9d5ff}.st-note-info .st-note-ico{background:#7c3aed}
/* Kernaussage / Pull-Quote: Violet-Balken links, großes Statement */
.st-keypoint{border-left:4px solid var(--violet-600);padding:6px 0 6px 24px;margin:36px 0}
.st-keypoint p{font-size:22px;font-weight:700;color:var(--slate-900);line-height:1.4;margin:0}
/* Icon-Vorteilsreihe: 3 Kacheln (slate-50), mobil untereinander */
.st-featrow{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:36px 0}
.st-featrow-item{background:var(--slate-50);border:1px solid var(--slate-100);border-radius:14px;padding:20px}
.st-featrow-ico{height:40px;width:40px;border-radius:10px;background:linear-gradient(to bottom right,var(--violet-600),var(--purple-600));display:flex;align-items:center;justify-content:center;color:#fff;margin-bottom:12px}
.st-featrow-ico svg{width:20px;height:20px;color:#fff;stroke:#fff}
.st-featrow-item h5{font-size:15px;font-weight:700;color:var(--slate-900);margin:0 0 6px}
.st-featrow-item p{font-size:14px;color:var(--slate-600);line-height:1.6;margin:0}
@media(max-width:768px){.st-featrow{grid-template-columns:1fr}}

/* ── TYP-EIGENE Auflockerungs-Elemente (typ-Erkennung im Textbereich, 760px-Achse, Inline-SVG) ── */
/* RATGEBER: nummerierte Schritt-Liste + Merke-Box */
.st-steplist{margin:32px 0}
.st-slitem{display:flex;gap:16px;padding:0 0 20px;position:relative;text-align:left}
.st-slitem:not(:last-child)::before{content:'';position:absolute;left:15px;top:34px;bottom:0;width:2px;background:#ede9fe}
.st-slitem-n{flex-shrink:0;width:32px;height:32px;border-radius:9999px;background:linear-gradient(to bottom right,var(--violet-600),var(--purple-600));color:#fff;font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;z-index:1}
.st-slitem-b{padding-top:4px}
.st-slitem-h{display:block;font-weight:700;color:var(--slate-900);font-size:16px}
.st-slitem-d{display:block;color:var(--slate-600);font-size:15px;line-height:1.6;margin-top:2px}
.st-merke{display:flex;gap:14px;background:#faf5ff;border:1px solid #ede9fe;border-radius:14px;padding:18px 22px;margin:32px 0}
.st-merke-ico{flex-shrink:0;color:var(--violet-600)}.st-merke-ico svg{width:20px;height:20px}
.st-merke-label{display:block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--violet-700);margin-bottom:4px}
.st-merke p{font-size:15px;color:var(--slate-700);line-height:1.6;margin:0}
/* ABFANG: Pro/Contra (rot/grün) */
.st-procon{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:32px 0}
.st-procon-col{border-radius:14px;padding:18px 20px;border:1px solid}
.st-procon-bad{background:#fef2f2;border-color:#fecaca}.st-procon-good{background:#ecfdf5;border-color:#a7f3d0}
.st-procon-h{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;margin-bottom:10px}
.st-procon-bad .st-procon-h{color:#dc2626}.st-procon-good .st-procon-h{color:#059669}
.st-procon-h svg{width:18px;height:18px}
.st-procon-col ul{list-style:none;margin:0;padding:0}
.st-procon-col li{font-size:14px;color:var(--slate-700);line-height:1.5;padding:4px 0 4px 16px;position:relative}
.st-procon-col li::before{content:'';position:absolute;left:0;top:12px;width:6px;height:6px;border-radius:9999px}
.st-procon-bad li::before{background:#f87171}.st-procon-good li::before{background:#34d399}
/* PILLAR: Kennzahlen-Reihe */
.st-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:16px;margin:32px 0}
.st-stat{background:linear-gradient(to bottom right,#f5f3ff,#fff);border:1px solid #ede9fe;border-radius:14px;padding:20px;text-align:center}
.st-stat-n{display:block;font-size:32px;font-weight:800;color:var(--violet-700);line-height:1;letter-spacing:-.02em}
.st-stat-l{display:block;font-size:13px;color:var(--slate-600);line-height:1.4;margin-top:8px}
/* BRANCHE: Use-Case-Kärtchen (Sky-Akzent) */
.st-usecases{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:14px;margin:32px 0}
.st-usecase{background:#f0f9ff;border:1px solid #bae6fd;border-radius:14px;padding:18px}
.st-usecase-ico{height:36px;width:36px;border-radius:9px;background:#0ea5e9;color:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.st-usecase-ico svg{width:20px;height:20px;stroke:#fff}
.st-usecase h5{font-size:15px;font-weight:700;color:var(--slate-900);margin:0 0 4px}
.st-usecase p{font-size:14px;color:var(--slate-600);line-height:1.55;margin:0}
/* GRUPPE-HUB / PFEILER: Themen-/Link-Kacheln */
.st-linktiles{display:flex;flex-wrap:wrap;gap:10px;margin:32px 0}
.st-linktile{display:inline-flex;align-items:center;gap:8px;background:var(--slate-50);border:1px solid var(--slate-200);border-radius:10px;padding:10px 14px;font-size:14px;font-weight:600;color:var(--slate-800);text-decoration:none;transition:all .2s}
a.st-linktile:hover{border-color:var(--violet-600);color:var(--violet-700)}
.st-linktile-ico{color:var(--violet-600);display:inline-flex}.st-linktile-ico svg{width:16px;height:16px}
@media(max-width:768px){.st-procon{grid-template-columns:1fr}}

/* Interner-Link-Block (Anti-Kannibalisierung: hierhin verlinken statt ausbreiten) */
.st-related{max-width:1152px;margin:0 auto;padding:0 32px}

/* ============ BREITE CONTENT-ELEMENTE (Content-Breite an app.stars.tips angeglichen) ============ */
/* Reiner Fließtext (Absätze, Überschriften, Listen) zentriert auf 760px Lesebreite — nur DIREKTE Kinder von
   .st-article (Child-Kombinator), damit Text INNERHALB breiter Blöcke unberührt voll bleibt. */
.st-article p,.st-article h2,.st-article h3,.st-article ul,.st-article ol{max-width:760px;margin-left:auto;margin-right:auto}
/* Breite Blöcke (Callout, FAQ, Vergleichskarte, Vorteilsbox, Kachel-Grids) nutzen die volle Content-Breite (1152px). */
.st-article .st-callout,.st-article .st-faq,.st-article .st-compare,.st-article .st-benefits,.st-article .st-tiles,.st-article .st-cards-grid{max-width:1152px;margin-left:auto;margin-right:auto}
/* Auflockerungs-Blöcke bleiben auf der 760px-Leseachse (brechen den Fließtext inline auf, keine Vollbreite). */
.st-article .st-note,.st-article .st-keypoint,.st-article .st-featrow{max-width:760px;margin-left:auto;margin-right:auto}
.st-article .st-steplist,.st-article .st-merke,.st-article .st-procon,.st-article .st-usecases,.st-article .st-linktiles{max-width:760px;margin-left:auto;margin-right:auto}
/* Kennzahlen-Block (stats): auf die 1152er-Wide-Spur (wie Callout/FAQ/Karten), allseitig Innenabstand, eigener (entkoppelter) Violett-Hintergrund statt der Homepage-.st-stats-Kollision; mobil gestapelt. Keine Struktur-/Markup-Änderung. */
.st-article .st-stats{max-width:1152px;margin:48px auto;padding:44px 40px;border-radius:20px;background:linear-gradient(to right,var(--violet-600),var(--purple-700));align-items:stretch}
@media(max-width:640px){.st-article .st-stats{grid-template-columns:1fr;padding:32px 24px}}

/* Breiter Section-Kopf (Eyebrow) über breiten Grids — volle Breite, orange Akzent */
.st-article .st-wide-head,.st-wide-head{max-width:1152px;margin:0 auto 20px;font-size:14px;font-weight:600;color:var(--orange-600);text-transform:uppercase;letter-spacing:.05em}

/* Vergleichskarte: helle Karte + dunkle Highlight-Karte mit violettem CTA (wie Hero) */
.st-compare{max-width:1152px;margin:48px auto;display:grid;grid-template-columns:1fr 1fr;gap:24px}
.st-compare-card{border-radius:20px;padding:32px 36px}
.st-compare-plain{background:#fff;border:1px solid var(--slate-200);box-shadow:0 1px 3px rgba(0,0,0,.05)}
.st-compare-hl{background:linear-gradient(to bottom right,var(--slate-900),var(--slate-800));box-shadow:0 25px 50px -12px rgba(15,23,42,.35)}
.st-compare-label{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:14px}
.st-compare-plain .st-compare-label{color:var(--orange-600)}
.st-compare-hl .st-compare-label{color:#c4b5fd}
.st-compare-card h3{font-size:22px;font-weight:800;line-height:1.25;margin-bottom:12px}
.st-compare-plain h3{color:var(--slate-900)}
.st-compare-hl h3{color:#fff}
.st-compare-card p{font-size:15px;line-height:1.7;margin:0}
.st-compare-plain p{color:var(--slate-600)}
.st-compare-hl p{color:var(--slate-300);margin-bottom:22px}
.st-compare-hl .st-btn-primary{font-size:15px;padding:12px 26px}

/* Vorteilsbox: zweispaltige Liste mit grünen Häkchen, volle Breite */
.st-benefits{max-width:1152px;margin:48px auto;border-radius:20px;border:1px solid #ede9fe;background:linear-gradient(to bottom right,#f5f3ff,#fff 55%,rgba(236,253,245,.55));padding:40px 44px}
.st-benefits-head{font-size:22px;font-weight:800;color:var(--slate-900);margin-bottom:24px}
.st-benefits ul{display:grid;grid-template-columns:1fr 1fr;gap:16px 40px;list-style:none;padding:0;margin:0}
.st-benefits li{position:relative;padding-left:38px;font-size:16px;color:var(--slate-700);line-height:1.6}
.st-benefits li::before{content:'';position:absolute;left:0;top:1px;width:24px;height:24px;border-radius:8px;background:var(--emerald-500) url("data:image/svg+xml;utf8,") center/15px no-repeat}

/* Feature-/Info-Kachel-Grid: 3 farbige Icon-Kacheln, volle Breite (wie app.stars.tips) */
.st-tiles{max-width:1152px;margin:48px auto;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}

/* Navigations-Kachel-Grid (Cluster/Gruppe/Pfeiler): Kachel mit Icon, Titel + Beschreibung, volle Breite */
.st-cards-grid{max-width:1152px;margin:0 auto 8px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.st-nav-card{display:flex;flex-direction:column;gap:8px;border:1px solid var(--slate-200);border-radius:16px;padding:24px;background:#fff;transition:all .25s}
.st-nav-card:hover{border-color:var(--slate-300);box-shadow:0 20px 25px -5px rgba(0,0,0,.1);transform:translateY(-4px)}
.st-nav-card-ico{height:44px;width:44px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;color:#fff;margin-bottom:8px;box-shadow:0 10px 15px -3px rgba(0,0,0,.15)}
.st-nav-card-ico svg{width:22px;height:22px;color:#fff;stroke:#fff}
.st-nav-card h3{font-size:17px;font-weight:700;color:var(--slate-900);margin:0}
.st-nav-card p{font-size:14px;color:var(--slate-500);line-height:1.6;margin:0}
.st-nav-card-more{font-size:13px;font-weight:600;color:var(--violet-700);margin-top:6px;display:inline-flex;align-items:center;gap:5px}

@media(max-width:900px){
  .st-compare{grid-template-columns:1fr}
  .st-benefits ul{grid-template-columns:1fr}
  .st-tiles,.st-cards-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .st-tiles,.st-cards-grid{grid-template-columns:1fr}
  .st-benefits{padding:28px}
  .st-compare-card{padding:24px}
}

.st-related-head{font-size:14px;font-weight:600;color:var(--orange-600);text-transform:uppercase;letter-spacing:.05em;margin-bottom:16px}
.st-related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.st-related-card{display:flex;align-items:center;gap:14px;border:1px solid var(--slate-200);border-radius:14px;padding:16px 20px;background:#fff;transition:all .2s}
.st-related-card:hover{border-color:var(--slate-300);box-shadow:0 10px 15px -3px rgba(0,0,0,.08);transform:translateY(-2px)}
.st-related-card svg{flex-shrink:0;color:var(--violet-600)}
.st-related-card span{font-size:15px;font-weight:600;color:var(--slate-800)}

@media(max-width:640px){
  .st-art-h1{font-size:32px}
  .st-article h2{font-size:24px}
  .st-related-grid{grid-template-columns:1fr}
  .st-art-hero{padding:88px 0 40px}
}



/* ============ MEGA-MENÜ (Baum-Navigation) ============ */
.st-nav-links{display:flex;align-items:center;gap:4px}
.st-nav-item{position:relative}
.st-nav-trigger{display:inline-flex;align-items:center;gap:4px;cursor:pointer}
.st-nav-trigger svg{transition:transform .2s;opacity:.6}
.st-nav-item:hover .st-nav-trigger svg{transform:rotate(180deg)}
.st-mega{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(8px);opacity:0;visibility:hidden;transition:all .2s;z-index:60}
.st-nav-item:hover .st-mega{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.st-mega::before{content:'';position:absolute;top:-8px;left:0;right:0;height:8px}
.st-mega-inner{display:flex;gap:8px;background:#fff;border:1px solid var(--slate-100);border-radius:20px;padding:20px;box-shadow:0 25px 50px -12px rgba(15,23,42,.18);min-width:max-content}
.st-mega-col{display:flex;flex-direction:column;min-width:210px;padding:0 8px}
.st-mega-head{font-size:12px;font-weight:700;color:var(--violet-600);text-transform:uppercase;letter-spacing:.05em;margin-bottom:10px;padding:0 12px}
.st-mega-link{display:block;font-size:14px;color:var(--slate-600);padding:8px 12px;border-radius:10px;transition:all .15s;line-height:1.4}
.st-mega-link:hover{background:#f5f3ff;color:var(--violet-700)}

/* Breadcrumb */
.st-crumbs{max-width:1152px;margin:0 auto;padding:20px 24px 0;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:var(--slate-400)}
.st-crumbs a{color:var(--slate-500)}
.st-crumbs a:hover{color:var(--violet-600)}
.st-crumbs svg{opacity:.5}

/* Footer-Spalten */
.st-footer{border-top:1px solid var(--slate-100);padding:56px 0 32px;background:rgba(248,250,252,.6)}
.st-footer-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px}
.st-fcol{display:flex;flex-direction:column;gap:10px}
.st-fcol-head{font-size:13px;font-weight:700;color:var(--slate-900);text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px}
.st-fcol a{font-size:14px;color:var(--slate-500);transition:color .15s;line-height:1.4}
.st-fcol a:hover{color:var(--violet-700)}
.st-fbrand-p{font-size:14px;color:var(--slate-500);line-height:1.6;margin-top:12px;max-width:280px}
.st-footer-bottom{padding-top:24px;border-top:1px solid var(--slate-200);text-align:center}
.st-footer-bottom p{font-size:13px;color:var(--slate-400)}
.st-footer-bottom a{color:var(--slate-500)}
.st-footer-bottom a:hover{color:var(--violet-600)}
@media(max-width:900px){
  .st-footer-cols{grid-template-columns:1fr 1fr}
  .st-mega-inner{flex-wrap:wrap;max-width:90vw}
}
@media(max-width:640px){
  .st-nav-item{display:none}  /* auf Mobil würde ein Burger-Menü kommen (Dev/später) */
}



/* Fix: wpautop injiziert  in die Wide-Block-Grids (Content-Filter) → diese wurden zu Grid-Items und
   drückten die Karten linkslastig. Neutralisieren, damit die Karten die Grid-Spalten zentriert füllen.
   Betrifft NUR die Grid-internen ; Fließtext-760/Hero-820/Sticky bleiben unberührt. */
.st-related-grid > br,.st-cards-grid > br,.st-tiles > br,.st-compare > br,.st-benefits > br{display:none}

/* AUFGABE 2: Nachfahren-Reset — Text in Wide-Blocks NICHT auf 760/zentriert (überschreibt .st-article p per Spezifitaet) */
.st-article .st-callout p,.st-article .st-callout h2,.st-article .st-callout h3,.st-article .st-callout h4,.st-article .st-callout ul,.st-article .st-callout ol,.st-article .st-callout li,.st-article .st-faq p,.st-article .st-faq h2,.st-article .st-faq h3,.st-article .st-faq h4,.st-article .st-faq ul,.st-article .st-faq ol,.st-article .st-faq li,.st-article .st-compare p,.st-article .st-compare h2,.st-article .st-compare h3,.st-article .st-compare h4,.st-article .st-compare ul,.st-article .st-compare ol,.st-article .st-compare li,.st-article .st-benefits p,.st-article .st-benefits h2,.st-article .st-benefits h3,.st-article .st-benefits h4,.st-article .st-benefits ul,.st-article .st-benefits ol,.st-article .st-benefits li,.st-article .st-tiles p,.st-article .st-tiles h2,.st-article .st-tiles h3,.st-article .st-tiles h4,.st-article .st-tiles ul,.st-article .st-tiles ol,.st-article .st-tiles li,.st-article .st-cards-grid p,.st-article .st-cards-grid h2,.st-article .st-cards-grid h3,.st-article .st-cards-grid h4,.st-article .st-cards-grid ul,.st-article .st-cards-grid ol,.st-article .st-cards-grid li{max-width:none;margin-left:0;margin-right:0}

/* AUFGABE 5: Bild-/Icon-Slots — leer unsichtbar (:empty), von Andreas mit  befuellbar; Groessen/Abstaende global. */
.st-img-slot:empty{display:none}
.st-img-slot img{display:block;width:100%;height:100%;object-fit:cover}
.st-hero-media{max-width:none;margin:0 auto;aspect-ratio:auto;background:none;border-radius:0;overflow:visible}
.st-article-media{max-width:760px;margin:24px auto;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#eef2f7}
.st-card-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:20px;height:20px}
.st-card-icon img,.st-card-icon svg{width:20px;height:20px;display:block}

/* ============ ABFANG-VORLAGE — UMLENK-BLOCK ============ */
.st-intercept-hero{position:relative;padding:36px 0 20px;overflow:hidden}
.st-intercept-hero .st-hero-bg{position:absolute;inset:0;background:linear-gradient(to bottom right,rgba(245,243,255,.7),#fff 60%,rgba(255,251,235,.35))}
.st-intercept-inner{position:relative;max-width:900px;margin:0 auto;padding:0 24px}
.st-intercept-head{text-align:center;max-width:720px;margin:0 auto 40px}
.st-intercept-h1{font-size:42px;font-weight:800;letter-spacing:-.02em;line-height:1.15;margin:20px 0 14px}
.st-intercept-sub{font-size:19px;color:var(--slate-500);line-height:1.6}
/* Zwei-Spalten: Aufklärung + Lösung */
.st-redirect-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:8px}
.st-honest{border-radius:20px;background:#fff;border:1px solid var(--slate-200);padding:28px}
.st-honest-tag{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--slate-500);text-transform:uppercase;letter-spacing:.04em;margin-bottom:14px}
.st-honest-tag svg{color:var(--slate-400)}
.st-honest h2{font-size:20px;font-weight:700;color:var(--slate-900);margin-bottom:12px;line-height:1.3}
.st-honest p{font-size:15px;color:var(--slate-600);line-height:1.7;margin-bottom:12px}
.st-honest p:last-child{margin-bottom:0}
.st-solution{border-radius:20px;background:linear-gradient(to bottom right,var(--slate-900),var(--slate-800));padding:28px;color:#fff;position:relative;overflow:hidden}
.st-solution-glow{position:absolute;top:-40px;right:-40px;width:180px;height:180px;border-radius:9999px;background:rgba(124,58,237,.35);filter:blur(60px)}
.st-solution-tag{position:relative;display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#c4b5fd;text-transform:uppercase;letter-spacing:.04em;margin-bottom:14px}
.st-solution h2{position:relative;font-size:20px;font-weight:700;color:#fff!important;margin-bottom:12px;line-height:1.3}
.st-solution p{position:relative;font-size:15px;color:#cbd5e1;line-height:1.7;margin-bottom:20px}
.st-solution .st-btn{position:relative;font-size:15px;padding:13px 24px;color:#fff;background:linear-gradient(to right,var(--violet-600),var(--purple-600));width:100%}
.st-solution .st-btn:hover{background:linear-gradient(to right,var(--violet-700),var(--purple-700))}
.st-solution .st-btn svg{stroke:#fff!important}
.st-sol-check{position:relative;display:flex;flex-direction:column;gap:8px;margin-bottom:20px}
.st-sol-check span{display:flex;align-items:center;gap:8px;font-size:14px;color:#e2e8f0}
.st-sol-check svg{color:var(--emerald-500);flex-shrink:0}
@media(max-width:760px){
  .st-redirect-grid{grid-template-columns:1fr}
  .st-intercept-h1{font-size:32px}
}

/* Hero-H1 dunkel: ueberschreibt Elementor Global-Color-Primary (#6EC1E4) auf nativen heading-Widgets. */
/* .st-art-h1/.st-intercept-h1 sitzen am heading-Widget-Wrapper → inneres .elementor-heading-title gezielt (0,3,0 > 0,2,0). */
.st-art-h1.elementor-widget-heading .elementor-heading-title,
.st-intercept-h1.elementor-widget-heading .elementor-heading-title{color:#0f172a}
/* Fallback: H1-Klasse direkt am  (html-Widget-Weg / Original-Vorlage). .st-grad-Spans bleiben unberuehrt. */
.st-art-h1,.st-intercept-h1{color:#0f172a}
/* Per-Element title_color am Heading (z.B. Ratgeber-Build setzt #000000) erzeugt eine 0,4,0-Regel .elementor-{postid} .elementor-element-{id} .elementor-heading-title, die die 0,3,0-Regel oben schlaegt; fehlt die Per-Post-CSS, greift stattdessen die Kit-Global-Color (0,2,0, Tuerkis). Hoehere Spezifitaet (0,5,0) am st-art-h1/st-intercept-h1-Wrapper zwingt das innere  global auf #0f172a. st-grad-Spans (eigenes color:transparent) bleiben unberuehrt. */
.st-art-h1.elementor-element.elementor-widget.elementor-widget-heading .elementor-heading-title,
.st-intercept-h1.elementor-element.elementor-widget.elementor-widget-heading .elementor-heading-title{color:#0f172a}


/* Hero-SVG-Slot zentriert: das generierte Symbol mittig im .st-hero-media-Rahmen; :empty bleibt ausgeblendet. */
.st-img-slot{display:flex;align-items:center;justify-content:center}
.st-img-slot svg{display:block;width:auto;height:auto;max-width:84px;max-height:84px}
/* erste H2 im Artikel kompakt (Lücke Lead→erste Überschrift reduzieren) */
.st-article > .elementor-element:first-child h2:first-child,.st-article > .elementor-element:first-child h3:first-child{margin-top:6px}

/* ============ NAV: Mobile-Menü + Aktiv-Kennzeichnung (Header 56) ============ */
/* Aktiv (Desktop+Mobile): aktiver Untermenü-/Top-Link = Violet-Unterstrich; aktiver Pfeiler = Akzent + Stern-Icon */
.st-mega-link.st-active,.st-nav-link.st-active{color:var(--violet-700);text-decoration:underline;text-decoration-color:var(--violet-600);text-decoration-thickness:2px;text-underline-offset:4px}
.st-nav-item.st-active-pillar > .st-nav-link{color:var(--violet-700);font-weight:600}
.st-nav-item.st-active-pillar > .st-nav-link::before{content:"";display:inline-block;width:15px;height:15px;margin-right:6px;flex:0 0 auto;vertical-align:-2px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27%237c3aed%27%3E%3Cpath d=%27M12 1.5l2.4 7.7 7.6 2.3-7.6 2.3L12 21.5l-2.4-7.7L2 11.5l7.6-2.3z%27/%3E%3C/svg%3E")}
/* Burger: Desktop AUS, Mobile AN. Close-Button nur im Mobile-Panel. */
.st-burger{display:none;align-items:center;justify-content:center;width:42px;height:42px;padding:0;border:none;background:transparent;color:var(--slate-900);cursor:pointer;border-radius:8px}
.st-burger svg{width:26px;height:26px}
.st-nav-close{display:none}
@media(max-width:900px){
  .st-nav{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none}
  .st-burger{display:inline-flex;margin-left:auto}
  .st-nav-links{position:fixed;top:0;right:0;bottom:0;width:min(86vw,340px);flex-direction:column;align-items:stretch;gap:0;background:#fff;box-shadow:-8px 0 30px rgba(15,23,42,.16);padding:60px 0 28px;overflow-y:auto;transform:translateX(105%);transition:transform .28s ease;z-index:1000}
  .st-nav-links.st-open{transform:translateX(0)}
  .st-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.45);opacity:0;visibility:hidden;transition:opacity .28s ease;z-index:49}
  .st-backdrop.st-show{opacity:1;visibility:visible}
  body.st-nav-locked{overflow:hidden}
  .st-nav-close{display:block;position:absolute;top:10px;right:14px;width:38px;height:38px;border:none;background:transparent;font-size:30px;line-height:1;color:var(--slate-500);cursor:pointer}
  .st-nav-item{display:block;border-bottom:1px solid var(--slate-100)}
  .st-nav-links > .st-nav-link{display:flex;align-items:center;padding:15px 22px;font-size:16px;border-bottom:1px solid var(--slate-100)}
  .st-nav-links.st-open .st-hide-sm{display:flex}
  .st-nav-trigger{display:flex;align-items:center;justify-content:space-between;padding:15px 22px;font-size:16px}
  .st-nav-trigger svg{width:18px;height:18px;transition:transform .2s ease}
  .st-nav-item.st-mobile-open > .st-nav-trigger svg{transform:rotate(180deg)}
  .st-nav-cta{margin:18px 22px 4px;justify-content:center;text-align:center}
  .st-mega{position:static;display:none;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;background:var(--slate-50);padding:0;min-width:0;width:auto}
  .st-nav-item.st-mobile-open > .st-mega{display:block;transform:none;left:auto;right:auto;top:auto}
  .st-mega-inner{display:block;grid-template-columns:none;padding:4px 0 10px;background:transparent;border:none;border-radius:0;box-shadow:none;min-width:0;max-width:none;width:auto}
  .st-mega-col{padding:8px 22px;min-width:0;width:auto}
  .st-mega-head{font-size:12px;margin:10px 0 4px}
  .st-mega-link{display:block;padding:9px 8px;font-size:15px}
}













/* === Header/Footer Selbständigkeit: padding/margin gegen den .st-home*-Reset absichern (0,2,0 > 0,1,0, kein !important) === */
.st-nav-inner.st-nav-inner{margin:0 auto;padding:16px 24px}
.st-nav-link.st-nav-link{padding:8px 16px}
.st-nav-cta.st-nav-cta{padding:10px 20px}
.st-footer.st-footer{padding:48px 0}
.st-footer-bottom.st-footer-bottom{margin-top:32px;padding-top:24px}
.st-nav-card.st-nav-card{padding:24px}
.st-nav-card-ico.st-nav-card-ico{margin-bottom:8px}
.st-nav-card-more.st-nav-card-more{margin-top:6px}
.st-mega-inner.st-mega-inner{padding:20px}
.st-mega-col.st-mega-col{padding:0 8px}
.st-mega-head.st-mega-head{margin-bottom:10px;padding:0 12px}
.st-mega-link.st-mega-link{padding:8px 12px}
.st-footer.st-footer{padding:56px 0 32px}
.st-footer-cols.st-footer-cols{margin-bottom:40px}
.st-fcol-head.st-fcol-head{margin-bottom:4px}
.st-footer-bottom.st-footer-bottom{padding-top:24px}
@media(max-width:900px){
.st-burger.st-burger{margin-left:auto}
.st-nav-links.st-nav-links{padding:60px 0 28px}
.st-nav-links > .st-nav-link.st-nav-link{padding:15px 22px}
.st-nav-trigger.st-nav-trigger{padding:15px 22px}
.st-nav-cta.st-nav-cta{margin:18px 22px 4px}
.st-mega-inner.st-mega-inner{padding:4px 0 10px}
.st-mega-col.st-mega-col{padding:8px 22px}
.st-mega-head.st-mega-head{margin:10px 0 4px}
.st-mega-link.st-mega-link{padding:9px 8px}
}




/* === Regressionsfix Task 4 — Fehler 2: horizontaler Mobil-Überlauf ===
   Das fixe Off-Canvas-Menü-Panel (.st-nav-links, geschlossen per transform:translateX(105%) off-screen rechts)
   dehnte die Dokumentbreite um ~726px → horizontaler Scroll/„Inhalte kleben rechts" auf Mobil. Nichts klippte es
   (fixed escapes den .st-home-Wrapper). Fix: horizontalen Überlauf auf Mobil site-weit klippen. Sicher, weil der
   Mobil-Header NICHT sticky ist (kein position:sticky-Bruch) und overflow-x:clip keinen Scroll-Container erzeugt;
   vertikaler Scroll unberührt; offenes Panel (on-screen) wird NICHT geklippt. Desktop unberührt. */
@media(max-width:900px){html,body{overflow-x:clip}}


/* === Regressionsfix Task 4 — Fehler 4: Fußzeile Mobil (Überlauf/abgeschnittene rechte Spalte) ===
   Der Footer-Grid brach nur bis 2 Spalten um (@media≤900: 1fr 1fr) — es fehlte ein 1-Spalten-Breakpoint für
   schmale Phones → bei ~390px sind 2 Spalten zu breit, die rechte Spalte läuft aus dem Viewport. Zusätzlich lag
   die 2-Spalten-Regel auch un-media-scoped im Startseiten-Content (style#6). Fix: auf ≤640px auf 1 Spalte
   umbrechen — höher-spezifisch (.st-footer-cols verdoppelt = 0,2,0), damit es die un-scoped Content-Kopie schlägt.
   Zusätzlich die Mobil-Seitenpolsterung des Footer-Wraps sicherstellen (SEO hatte sie auf 0). Desktop unberührt. */
@media(max-width:900px){.st-footer .st-wrap{padding-left:24px;padding-right:24px}}
@media(max-width:640px){.st-footer-cols.st-footer-cols{grid-template-columns:1fr}}


/* === Task 5 — Schrift site-weit (Inter ist bereits via @import in Post 94 geladen). Ersetzt das
   body{font-family:Inter} aus dem entfernten Alt-Inline-Block der Kopfzeile (Post 56), damit Kopf- und
   Fußzeile auf ALLEN Seitentypen (auch außerhalb .st-home) Inter behalten. */
body{font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}


/* === Task 5 — Mega-Dropdown-Überlauf (Desktop): seit die Kopfzeilen-Nav wieder rendert, ragt das unter dem
   rechten „Content Pool"-Item zentrierte Mega-Panel ~29px über den Viewport. Fix: Header-Wrapper .st-home auf
   overflow:visible (kein Klippen/Scrollbalken) + Mega an die zentrierte 1152-Nav-Spur verankern statt unter das
   Item. Nur Desktop (≥901). Verifiziert: overflowX=0, Mega/Sticky/Mobil unberührt. */
@media(min-width:901px){
.st-home:has(> .st-nav){overflow:visible}
.st-nav-inner{position:relative}
.st-nav .st-nav-item{position:static}
.st-nav .st-mega{left:0;right:0;width:auto;transform:translateY(8px)}
.st-nav .st-nav-item:hover .st-mega{transform:translateY(0)}
.st-nav .st-mega-inner{margin-left:auto;margin-right:auto;width:max-content;max-width:100%}
}


/* === Task 5 — Sticky-Kopfzeile reparieren: die Theme-Builder-Kopfzeile hat KEINEN Elementor-Sticky-Effekt und
   die vorhandene .st-nav{position:sticky} greift nicht, weil ihre Elternkette nur 74px hoch ist (Header-Rebuild
   hat den früheren Sticky-Mechanismus entfernt). Fix: das Header-Wrapper-Element selbst sticky machen (Elternteil
   = body, volle Scrollhöhe). Wirkt site-weit, Kopfzeile bleibt beim Scrollen oben. z-index über dem Content. */
header.elementor-location-header{position:sticky;top:0;z-index:999}


/* === Task 6 — Header: Hover-Brücke + Aktiv-Kennzeichnung wiederherstellen === */
/* Fehler 1: Die Mega-Spur-Verankerung (Task 5, .st-nav-item{position:static}) sitzt das Panel relativ zu
   .st-nav-inner → Lücke Trigger↔Panel wuchs von 8px auf ~26px, die 8px-Hover-Brücke deckte sie nicht mehr.
   Unsichtbare Brücke .st-mega::before entsprechend erhöhen (bleibt unter der Trigger-Reihe, kein Cross-Item-
   Konflikt). Nur Desktop (Mega = Dropdown ab 901px; darunter Akkordeon). */
@media(min-width:901px){.st-mega::before{top:-28px;height:28px}}
/* Fehler 2: aktiver UNTERMENÜ-Punkt bekommt zusätzlich einen Stern (gleiches Sparkle-Icon wie der Pfeiler,
   violett #7c3aed, 14px). Unterstrich bleibt dem Untermenü vorbehalten; der aktive HAUPTMENÜ-Pfeiler nur Stern. */
.st-mega-link.st-active::before{content:"";display:inline-block;width:14px;height:14px;margin-right:6px;flex:0 0 auto;vertical-align:-2px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27%237c3aed%27%3E%3Cpath d=%27M12 1.5l2.4 7.7 7.6 2.3-7.6 2.3L12 21.5l-2.4-7.7L2 11.5l7.6-2.3z%27/%3E%3C/svg%3E")}
.st-nav-link.st-active{text-decoration:none}


/* ===== VARIANTE 7 · MAGAZIN (Vorlage magazin) — scoped .a4, aus variante-4-magazin.html ===== */
.a4 *{box-sizing:border-box;margin:0;padding:0}
.a4{font-family:'Inter',system-ui,-apple-system,sans-serif;color:#0f172a;line-height:1.5;background:#fff;-webkit-font-smoothing:antialiased}
.a4 a{text-decoration:none;color:inherit}
.a4 svg{display:block}
.a4 .w{max-width:1152px;margin:0 auto;padding:0 24px}
.a4 .t{max-width:700px}
.a4 .t p{font-size:17px;line-height:1.8;color:#475569;margin:0 0 20px}
.a4 .t p:last-child{margin-bottom:0}

/* Hero zweispaltig mit Kurzfassung */
.a4 .hero{padding:56px 0 48px;background:linear-gradient(115deg,#fff7ed 0%,#fff 60%)}
.a4 .hero-g{display:grid;grid-template-columns:1.35fr 1fr;gap:44px;align-items:center}
.a4 .kicker{display:inline-block;font-size:12px;font-weight:700;color:#c2410c;letter-spacing:.1em;text-transform:uppercase;background:#ffedd5;padding:6px 12px;border-radius:6px;margin:0 0 16px}
.a4 .h1{font-size:40px;font-weight:800;line-height:1.14;letter-spacing:-.024em;margin:0 0 18px}
.a4 .lead{font-size:18px;color:#64748b;line-height:1.65;margin:0}
.a4 .hero-card{background:#fff;border:1px solid #fed7aa;border-radius:18px;padding:26px 28px;box-shadow:0 16px 32px -20px rgba(234,88,12,.35)}
.a4 .hero-card b{display:block;font-size:12px;font-weight:700;color:#c2410c;text-transform:uppercase;letter-spacing:.08em;margin:0 0 14px}
.a4 .hero-card li{list-style:none;font-size:15px;color:#475569;line-height:1.55;padding:8px 0 8px 24px;position:relative}
.a4 .hero-card li::before{content:'';position:absolute;left:0;top:15px;width:9px;height:2px;background:#ea580c}

.a4 .sec{padding:64px 0}
.a4 .sec-warm{background:#fffbf5}
.a4 .sec-dark{background:#1c1917}
.a4 .num{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#ea580c;margin:0 0 14px}
.a4 .num i{width:26px;height:2px;background:#ea580c;display:block}
.a4 .h2{font-size:31px;font-weight:800;line-height:1.22;margin:0 0 22px;max-width:700px}

/* stats → große Zahlen im Raster, warm */
.a4 .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:40px 0 0}
.a4 .stat{background:#fff;border:1px solid #fed7aa;border-radius:16px;padding:26px 24px}
.a4 .stat b{display:block;font-size:30px;font-weight:800;color:#ea580c;line-height:1.1;letter-spacing:-.02em;margin:0 0 8px}
.a4 .stat span{font-size:15px;color:#57534e;line-height:1.6}

/* quote → dunkles Vollband */
.a4 .quote-band{padding:56px 0}
.a4 .quote-band p{font-size:27px;line-height:1.45;font-weight:700;color:#fff;max-width:820px;letter-spacing:-.015em;margin:0}
.a4 .quote-band span{display:block;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#fdba74;margin:0 0 18px}

/* tiles → Karten mit Kopfleiste */
.a4 .tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:36px 0 0}
.a4 .tile{border:1px solid #e7e5e4;border-radius:16px;overflow:hidden;background:#fff;transition:all .2s}
.a4 .tile:hover{border-color:#fdba74;box-shadow:0 14px 28px -18px rgba(234,88,12,.4)}
.a4 .tile-top{background:#fff7ed;padding:12px 20px;border-bottom:1px solid #fed7aa;font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#9a3412}
.a4 .tile-in{padding:20px}
.a4 .tile-in b{display:block;font-size:16px;font-weight:700;margin:0 0 6px}
.a4 .tile-in p{font-size:14px;color:#64748b;line-height:1.6;margin:0 0 12px}
.a4 .tile-in em{font-style:normal;font-size:14px;font-weight:600;color:#ea580c}

/* FAQ zweispaltig */
.a4 .faq{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:32px}
.a4 .faq-i{background:#fff;border:1px solid #e7e5e4;border-radius:14px;padding:22px 24px}
.a4 .faq-i h3{font-size:16px;font-weight:700;margin:0 0 8px;line-height:1.45}
.a4 .faq-i p{font-size:15px;color:#57534e;line-height:1.7;margin:0}

.a4 .info{margin:32px 0 0;background:#1c1917;border-radius:16px;padding:26px 30px;display:flex;gap:18px;align-items:flex-start}
.a4 .info-ico{flex:0 0 40px;height:40px;border-radius:10px;background:#ea580c;display:flex;align-items:center;justify-content:center}
.a4 .info-ico svg{width:20px;height:20px;color:#fff;stroke:#fff}
.a4 .info b{display:block;font-size:16px;font-weight:700;color:#fff;margin:0 0 6px}
.a4 .info p{font-size:15px;color:#a8a29e;line-height:1.7;margin:0}

.a4 .cta{padding:0 0 72px}
.a4 .cta-in{border-radius:22px;background:linear-gradient(120deg,#ea580c,#f97316);padding:52px 40px;text-align:center}
.a4 .cta-in h2{font-size:31px;font-weight:800;color:#fff;margin:0 0 14px}
.a4 .cta-in p{font-size:17px;color:#ffedd5;max-width:560px;margin:0 auto 26px;line-height:1.7}
.a4 .btn{display:inline-flex;align-items:center;gap:8px;font-size:16px;font-weight:700;padding:16px 32px;border-radius:14px;background:#fff;color:#9a3412!important}
.a4 .btn svg{stroke:#9a3412}

@media(max-width:900px){
  .a4 .hero-g{grid-template-columns:1fr;gap:28px}
  .a4 .tiles,.a4 .faq{grid-template-columns:1fr}
  .a4 .stats{grid-template-columns:1fr}
}
@media(max-width:640px){
  .a4 .h1{font-size:28px}.a4 .h2{font-size:25px}
  .a4 .hero{padding:36px 0 32px}.a4 .sec{padding:44px 0}
  .a4 .quote-band p{font-size:20px}
  .a4 .cta-in{padding:32px 24px}.a4 .cta-in h2{font-size:25px}
  .a4 .info{flex-direction:column}.a4 .btn{width:100%;justify-content:center}
}
/* --- Magazin: abgeleitete Auflockerungs-Marker (gleicher Stil) --- */
.a4 .steps{list-style:none;margin:32px 0 0;padding:0;display:grid;gap:14px}
.a4 .step{display:flex;gap:16px;align-items:flex-start;background:#fffbf5;border:1px solid #fed7aa;border-radius:14px;padding:20px 22px}
.a4 .step-n{flex:0 0 30px;height:30px;border-radius:9px;background:#ea580c;color:#fff;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;counter-increment:st}
.a4 .steps{counter-reset:st}
.a4 .step-n::before{content:counter(st)}
.a4 .step b{display:block;font-size:16px;font-weight:700;margin:0 0 4px}
.a4 .step p{font-size:14px;color:#64748b;line-height:1.6;margin:0}
.a4 .merke{margin:32px 0 0;background:#fff7ed;border-left:4px solid #ea580c;border-radius:0 14px 14px 0;padding:22px 26px}
.a4 .merke span{display:block;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#c2410c;margin:0 0 8px}
.a4 .merke p{font-size:16px;color:#0f172a;line-height:1.7;margin:0;font-weight:500}
.a4 .procon{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:32px 0 0}
.a4 .pc-col{border-radius:16px;padding:22px 24px}
.a4 .pc-bad{background:#fef2f2;border:1px solid #fecaca}
.a4 .pc-good{background:#fff7ed;border:1px solid #fed7aa}
.a4 .pc-col b{display:block;font-size:14px;font-weight:700;margin:0 0 12px}
.a4 .pc-bad b{color:#b91c1c}.a4 .pc-good b{color:#c2410c}
.a4 .pc-col ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.a4 .pc-col li{font-size:14px;color:#475569;line-height:1.55;padding-left:18px;position:relative}
.a4 .pc-col li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:2px;background:currentColor;opacity:.5}
.a4 .note{margin:32px 0 0;border-radius:14px;padding:20px 24px}
.a4 .note-warn{background:#fffbeb;border:1px solid #fde68a}
.a4 .note-tip{background:#fff7ed;border:1px solid #fed7aa}
.a4 .note b{display:block;font-size:15px;font-weight:700;margin:0 0 6px}
.a4 .note-warn b{color:#b45309}.a4 .note-tip b{color:#c2410c}
.a4 .note p{font-size:15px;color:#57534e;line-height:1.7;margin:0}
@media(max-width:900px){.a4 .procon{grid-template-columns:1fr}}
/* CTA-Variante (cta_blocks .st-cta) INNERHALB Magazin: der Reset .a4 *{padding:0} (0,1,1) nullt sonst den
   Innenabstand des dunklen Kastens (.st-cta = 0,1,0). Gezielt zurueckgeben, Spez. 0,2,0 > 0,1,1, ohne !important.
   Magazin-eigene CTA (.cta-in) und alle Nicht-Magazin-Seiten bleiben unberuehrt. */
.a4 .st-cta{padding:56px}
@media(max-width:640px){.a4 .st-cta{padding:32px}}
/* ===== /MAGAZIN ===== */



/* Rechtsseiten: h1, Stand-Zeile, Button im Fließtext — 2026-09-16 */
.st-article h1{max-width:760px;margin-left:auto;margin-right:auto;margin-bottom:24px}
.st-article .st-legal-stand{max-width:760px;margin-left:auto!important;margin-right:auto!important;font-size:14px;color:var(--slate-500)}
.st-article p .st-btn,.st-article p .st-btn-primary{display:inline-flex;align-items:center;line-height:1.2;padding:16px 32px;border-radius:16px;background:linear-gradient(to right,var(--violet-600),var(--purple-600));color:#fff;text-decoration:none;border-bottom:none}
.st-article p .st-btn:hover,.st-article p .st-btn-primary:hover{color:#fff;text-decoration:none;border-bottom:none;background:linear-gradient(to right,var(--violet-700),var(--purple-700))}



/* Rechtsseiten: h1 mobil — 2026-09-17 */
.st-article h1{overflow-wrap:anywhere;word-break:break-word;hyphens:auto}
@media(max-width:640px){.st-article h1{font-size:32px;line-height:1.15}}

/* Sicherheitsnetz Karten/Fremd-div: ein unbekannter div direkt im Fließtext-Widget nie breiter als die Absätze (760px). Absichtlich breite/gestaltete Komponenten ausgenommen. 2026-09-16 */
.st-article .elementor-widget-html>div:not(.st-callout):not(.st-faq):not(.st-compare):not(.st-benefits):not(.st-tiles):not(.st-cards-grid):not(.st-stats):not(.st-wide-head):not(.st-note):not(.st-keypoint):not(.st-featrow):not(.st-steplist):not(.st-merke):not(.st-procon):not(.st-usecases):not(.st-linktiles):not(.st-legal-stand),.st-article .elementor-widget-html>.elementor-widget-container>div:not(.st-callout):not(.st-faq):not(.st-compare):not(.st-benefits):not(.st-tiles):not(.st-cards-grid):not(.st-stats):not(.st-wide-head):not(.st-note):not(.st-keypoint):not(.st-featrow):not(.st-steplist):not(.st-merke):not(.st-procon):not(.st-usecases):not(.st-linktiles):not(.st-legal-stand){max-width:760px;margin-left:auto;margin-right:auto}

/* === CP-RUBRIK MUSTER v2 (Auftrag 2) – globale Vorlage, wirkt auf allen 8 Rubrik-Seiten === */
.cp-root{text-align:left;color:#334155}
.cp-root *{box-sizing:border-box}
.cp-hero{width:100%;padding:64px 24px 56px;background:#f7f4fd;text-align:center}
.cp-band{width:100%;padding:56px 24px}
.cp-white{background:#ffffff}
.cp-lav{background:#f7f4fd}
.cp-wrap{max-width:760px;margin:0 auto}
.cp-hero .cp-wrap{max-width:720px}
.cp-root h1{font-size:40px;line-height:1.15;font-weight:800;color:#0f172a;letter-spacing:-.02em;margin:0 0 18px}
.cp-lead{font-size:18px;line-height:1.65;color:#475569;margin:0 0 26px}
.cp-root h2{font-size:28px;line-height:1.25;font-weight:800;color:#0f172a;margin:0 0 16px}
.cp-band p{font-size:17px;line-height:1.7;color:#475569;margin:0 0 16px}
.cp-band p:last-child{margin-bottom:0}
.cp-root a{color:#7c3aed;font-weight:600;text-decoration:none}
.cp-root a:hover{text-decoration:underline}
.cp-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:16px;font-weight:600;color:#fff!important;background:linear-gradient(to right,#7c3aed,#9333ea);padding:16px 32px;border-radius:16px;box-shadow:0 20px 25px -5px rgba(124,58,237,.25);transition:transform .2s,box-shadow .2s}
.cp-btn:hover{text-decoration:none;transform:scale(1.02);box-shadow:0 25px 30px -8px rgba(124,58,237,.35)}
.cp-hint{font-size:14px;color:#64748b;margin:14px 0 0}
.cp-list{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.cp-list li{position:relative;padding-left:30px;font-size:17px;line-height:1.65;color:#475569}
.cp-list li::before{content:"";position:absolute;left:0;top:6px;width:18px;height:18px;border-radius:999px;background:#efe9fe}
.cp-list li::after{content:"";position:absolute;left:6px;top:12px;width:6px;height:6px;border-radius:999px;background:#7c3aed}
.cp-list strong{color:#0f172a;font-weight:700}
.cp-refs{margin:22px 0 0;font-size:16px;font-weight:600;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.cp-refs .cp-arrow{color:#7c3aed}
.cp-refs .cp-plain{color:#94a3b8}
.cp-refs .cp-sep{color:#cbd5e1}
.cp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:8px 0 0}
.cp-step{background:#fff;border:1px solid #ece7fb;border-radius:16px;padding:22px}
.cp-step .cp-num{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border-radius:999px;background:#7c3aed;color:#fff;font-weight:700;margin:0 0 12px}
.cp-step h3{font-size:17px;font-weight:700;color:#0f172a;margin:0 0 6px}
.cp-step p{font-size:15px;line-height:1.6;color:#475569;margin:0}
.cp-tablewrap{margin:8px 0 0;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid #ece7fb;border-radius:14px}
.cp-table{border-collapse:collapse;width:100%;min-width:520px;font-size:15px}
.cp-table th,.cp-table td{text-align:left;padding:12px 16px;border-bottom:1px solid #eee6fb;color:#475569;line-height:1.5}
.cp-table thead th{background:#f7f4fd;color:#0f172a;font-weight:700;white-space:nowrap}
.cp-table tbody tr:last-child td{border-bottom:none}
.cp-abschluss{text-align:center}
.cp-actions{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center;justify-content:center;margin:24px 0 0}
.cp-textlink{display:inline-flex;align-items:center;gap:6px;font-size:16px;font-weight:600;color:#7c3aed}
.cp-faq{max-width:760px;margin:0 auto}
.cp-item{border:1px solid #ece7fb;border-radius:14px;margin:0 0 12px;background:#fff;overflow:hidden}
.cp-item[open]{background:#faf9ff;border-color:#d9cdfb}
.cp-item summary{list-style:none;cursor:pointer;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 20px}
.cp-item summary::-webkit-details-marker{display:none}
.cp-item summary h3{font-size:17px;line-height:1.45;font-weight:700;color:#0f172a;margin:0}
.cp-ico{flex:0 0 auto;width:26px;height:26px;border-radius:999px;background:#efe9fe;color:#7c3aed;font-size:20px;line-height:24px;font-weight:600;text-align:center}
.cp-ico::before{content:"+"}
.cp-item[open] .cp-ico{background:#7c3aed;color:#fff}
.cp-item[open] .cp-ico::before{content:"\2212"}
.cp-ans{padding:0 20px 20px}
.cp-ans p{margin:0;font-size:16px;line-height:1.7;color:#475569}
.cp-faqlink{margin:20px 0 0;text-align:center}
@media(max-width:700px){.cp-steps{grid-template-columns:1fr}.cp-root h1{font-size:30px}.cp-root h2{font-size:23px}.cp-hero{padding:44px 18px 40px}.cp-band{padding:40px 18px}.cp-lead{font-size:16px}.cp-band p{font-size:16px}.cp-list li{font-size:16px}}
/* === /CP-RUBRIK MUSTER v2 === */
.cp-root h1,.cp-root h2,.cp-item summary h3{overflow-wrap:break-word;hyphens:auto}
.cp-forwho{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 28px}
.cp-forwho li{position:relative;padding-left:24px;font-size:16px;line-height:1.5;color:#334155;font-weight:600}
.cp-forwho li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:999px;background:#7c3aed}
#branchen{scroll-margin-top:90px}
@media(max-width:700px){.cp-forwho{grid-template-columns:1fr}}

/* ===== FUNNEL V4 (.fv4-) – Bausteine /start + /neukunden ===== */
.fv4-sec{padding:96px 24px}
.fv4-in{max-width:1200px;margin:0 auto;display:flex;flex-direction:column}
.fv4-head{display:flex;flex-direction:column;gap:14px;max-width:820px}
.fv4-cards{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch;margin-top:36px}
.fv4-after{max-width:720px;margin-left:auto;margin-right:auto;text-align:center;display:flex;flex-direction:column;gap:16px;align-items:center}
.fv4-after p{font-size:20px;line-height:1.55;color:#5b5872;margin:0}
.fv4-after h3{margin:0;font-size:24px;line-height:1.2;font-weight:800;letter-spacing:-0.5px;color:#0f1235}
.fv4-visrow{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:40px}
.fv4-item{display:flex;flex-direction:column;align-items:center;gap:8px;max-width:100%}
.fv4-label{font-size:12px;color:#6b6884;margin-top:4px}
.fv4-cap{font-size:12px;line-height:1.5;color:#5b5872;max-width:320px;text-align:center;margin:6px 0 0}
.fv4-card{width:340px;max-width:100%}
.fv4-phone{box-sizing:border-box;width:320px;max-width:86vw;border:8px solid #fff;border-radius:32px;background:#fff;box-shadow:0 18px 44px rgba(76,29,149,.16);overflow:hidden;line-height:0}
.fv4-phone img{display:block;width:100%;height:auto;border-radius:24px}
.fv4-arrow{display:flex;align-items:center;align-self:center}
.fv4-step{font-size:14px;font-weight:600;color:#3f3c55;max-width:320px;text-align:center;margin-top:2px}
.fv4-step-n{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:#6d28d9;color:#fff;font-size:13px;font-weight:800;margin-right:4px}
.fv4-poolimg{width:100%;height:190px;object-fit:cover;object-position:center;display:block}
.fv4-gal-thumbs{display:grid;grid-template-columns:repeat(4,220px);justify-content:center;gap:20px;width:100%;margin:10px auto 0}
.fv4-gal-thumbs img{width:220px;aspect-ratio:3/4;object-fit:cover;object-position:top center;border-radius:16px;border:1px solid #e6e2f3;cursor:pointer;display:block}
.fv4-lb{position:fixed;inset:0;background:rgba(10,8,25,.93);z-index:100000;display:none;align-items:center;justify-content:center}
.fv4-lb.open{display:flex}
.fv4-lb-fig{margin:0;display:flex;flex-direction:column;align-items:center;gap:10px;max-width:94vw}
.fv4-lb-img{max-width:92vw;max-height:84vh;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.5);transition:transform .2s;transform-origin:center;cursor:zoom-in;touch-action:pan-x}
.fv4-lb-img.zoom{transform:scale(2);cursor:zoom-out;touch-action:auto}
.fv4-lb-cap{color:#e9e6f5;font-size:14px;text-align:center}
.fv4-lb-btn{position:absolute;background:rgba(255,255,255,.14);color:#fff;border:0;cursor:pointer;border-radius:999px;width:52px;height:52px;font-size:30px;line-height:1;display:flex;align-items:center;justify-content:center}
.fv4-lb-btn:hover{background:rgba(255,255,255,.26)}
.fv4-lb-close{top:18px;right:18px;font-size:34px}
.fv4-lb-prev{left:14px;top:50%;transform:translateY(-50%)}
.fv4-lb-next{right:14px;top:50%;transform:translateY(-50%)}
@media(max-width:767px){
 .fv4-sec{padding:56px 20px}
 .fv4-cards{grid-template-columns:1fr}
 .fv4-visrow{flex-direction:column;align-items:center;gap:32px}
 .fv4-phone{width:320px;max-width:86vw}
 .fv4-arrow svg{transform:rotate(90deg)}
 .fv4-gal-thumbs{grid-template-columns:repeat(2,1fr);gap:16px}
 .fv4-gal-thumbs img{width:100%}
 .fv4-lb-btn{width:44px;height:44px;font-size:26px}
}

/* === ST-MEGA-OVERFLOW-FIX (kiyou 08.10.2026) === */
@media (min-width:901px) and (max-width:1279.98px){.st-nav .st-mega{left:0!important;right:0!important;transform:translateY(8px)!important}.st-nav .st-nav-item:hover .st-mega{transform:translateY(0)!important}.st-nav .st-mega-inner,.st-mega-inner.st-mega-inner{min-width:0!important;width:auto!important;max-width:calc(100vw - 48px)!important;margin-left:auto!important;margin-right:auto!important;flex-wrap:wrap!important}}
/* === /ST-MEGA-OVERFLOW-FIX === */

/* === ST-NAV-CTA-KICHECK (24.10.2026): längerer Menüknopf-Text sauber zweizeilig === */
@media(min-width:901px){.st-nav-cta.st-nav-cta{text-wrap:balance;text-align:center;max-width:170px;line-height:1.3}}
/* === /ST-NAV-CTA-KICHECK === */
