.elementor-25392 .elementor-element.elementor-element-72eea04{--display:flex;--margin-top:-05px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-25392 .elementor-element.elementor-element-11e62573{--display:flex;}.elementor-25392 .elementor-element.elementor-element-11e62573:not(.elementor-motion-effects-element-type-background), .elementor-25392 .elementor-element.elementor-element-11e62573 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(180deg, #F6F8FB 0%, #F6F8FB 100%);}.elementor-25392 .elementor-element.elementor-element-c8ce250 > .elementor-widget-container{margin:-27px 0px 0px 0px;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-c836aab *//* ========================================================================== */
/*  S&C BLOG – STIL-OVERRIDES (GLOBAL FÜR ARTIKEL)
    Reihenfolge: Tokens → Nummern → Steps → Summary → TOC → FAQ → Legal-Note
    Bitte NACH dem JB‑2026‑Basis‑CSS laden.                                   */
/* ========================================================================== */


/* -------------------------------------------------------------------------- */
/*  00) TOKENS – AKZENTFARBE (Muted Cherry)                                   */
/*      Wird für Unterlinien (Summary/TOC) und dezente Inset-Effekte genutzt. */
/* -------------------------------------------------------------------------- */
#ni-hero-a, #ni-body-a{
   --accent:    #BE4D58;           /* Hauptakzent */
   --accent-10: rgba(190,77,88,.10);
   --accent-15: rgba(190,77,88,.15);
   --accent-18: rgba(190,77,88,.20);
}


/* -------------------------------------------------------------------------- */
/*  01) CONTENT-H2 NUMMERN (01–14) – ANTHRAZIT                                */
/*      Erhöhte Spezifität + Fallback, falls Vorlage über --c-num färbt.     */
/* -------------------------------------------------------------------------- */
#ni-body-a{
   --c-num:#243240 !important;   /* Fallback für Templates, die Variablen nutzen */
}
body #ni-body-a .ni-h2 .row > .num{
   background:linear-gradient(180deg, #33465A 0%, #243240 100%) !important;
   color:#fff !important;
   border:3px solid rgba(255,255,255,.95) !important;
   box-shadow:inset 0 -6px 10px rgba(0,0,0,.16), 0 10px 24px rgba(17,34,54,.20) !important;
   text-shadow:0 1px 0 rgba(0,0,0,.22) !important;
}


/* -------------------------------------------------------------------------- */
/*  02) STEPS („Drei Schritte zum Wunschtarif“) – CORPORATE CLEAN (HELLERES BLAU) */
/*      Linie + Kreis-Badges in hellerer Blau-Palette.                        */
/* -------------------------------------------------------------------------- */
#ni-body-a .ni-steps::before{
   background:#6F88A1 !important;    /* Verbindungsleiste */
}
#ni-body-a .ni-step .num{
   background:linear-gradient(180deg, #A3B8CE 0%, #55728C 100%) !important;
   color:#fff !important;
   border:3px solid rgba(255,255,255,.98) !important;
   box-shadow:inset 0 -6px 10px rgba(0,0,0,.18), 0 12px 26px rgba(17,34,54,.24) !important;
}


/* -------------------------------------------------------------------------- */
/*  03) SUMMARY-PANEL („In diesem Artikel erfahren Sie“)                      */
/*      Helles Panel + weicher Außenrahmen; Listeneinträge als Kacheln.       */
/* -------------------------------------------------------------------------- */
#ni-body-a .ni-summary{
   background:#FBFEFF !important;
   border:1px solid #E3EFF9 !important;
   box-shadow:0 8px 20px rgba(17,24,39,.06), 0 0 0 1px rgba(36,50,64,.20) !important;
   border-radius:12px !important;
   padding:10px 16px 12px;
}
#ni-body-a .ni-summary li{
   background:#F3F8FE !important;
   border-radius:12px;
   box-shadow:inset 0 0 0 1px #E3EFF9;
}


/* -------------------------------------------------------------------------- */
/*  04) SUMMARY-ÜBERSCHRIFT – AKZENT-UNDERLINE (MUTED CHERRY)                 */
/*      Dezente Linie dicht an der Baseline.                                  */
/* -------------------------------------------------------------------------- */
#ni-body-a .ni-summary > h2{
   position:relative;
}
#ni-body-a .ni-summary > h2::after{
   content:"";
   position:absolute;
   left:0; right:0;
   height:2px; bottom:.2em;
   background:linear-gradient(90deg, transparent, var(--accent-18), transparent);
   border-radius:2px;
}


/* -------------------------------------------------------------------------- */
/*  05) INHALTSVERZEICHNIS – PANEL & ITEMS                                    */
/*      Reinweißes Panel, gleiche Rahmenlogik wie Summary; Kachel-Items.      */
/* -------------------------------------------------------------------------- */
#ni-body-a #ni-toc-a .toc-panel{
   background:#fff !important;
   border:1px solid #E3EFF9 !important;
   box-shadow:0 8px 20px rgba(17,24,39,.06), 0 0 0 1px rgba(36,50,64,.20) !important;
   border-radius:12px !important;
}
#ni-body-a #ni-toc-a .toc-link{
   background:#F3F8FE !important;
   box-shadow:inset 0 0 0 1px #E3EFF9;
   border-radius:12px;
   transition:box-shadow .15s ease, transform .12s ease;
}
#ni-body-a #ni-toc-a .toc-link:hover{
   box-shadow:inset 0 0 0 1px rgba(36,50,64,.15), 0 2px 6px rgba(0,0,0,.05);
   transform:translateY(-1px);
}


/* -------------------------------------------------------------------------- */
/*  06) INHALTSVERZEICHNIS – NUMMER-CHIPS                                     */
/*      Anthrazit-Verlauf, weißer Rand, dezenter innerer Schatten.            */
/* -------------------------------------------------------------------------- */
#ni-body-a #ni-toc-a .toc-num{
   background:linear-gradient(180deg, #3B4A5C 0%, #243240 100%) !important;
   color:#fff !important;
   border:2px solid rgba(255,255,255,.95) !important;
   box-shadow:inset 0 -3px 6px rgba(0,0,0,.10) !important;
}


/* -------------------------------------------------------------------------- */
/*  07) INHALTSVERZEICHNIS-ÜBERSCHRIFT – AKZENT-UNDERLINE (MUTED CHERRY)      */
/*      Gleiche Unterlinien-Optik wie beim Summary.                           */
/* -------------------------------------------------------------------------- */
#ni-body-a #ni-toc-a .toc-head{
   position:relative;
}
#ni-body-a #ni-toc-a .toc-head::after{
   content:"";
   position:absolute;
   left:0; right:0;
   height:2px; bottom:.2em;
   background:linear-gradient(90deg, transparent, var(--accent-18), transparent);
   border-radius:2px;
}


/* -------------------------------------------------------------------------- */
/*  08) FAQ-PANEL – REINWEISS + RUHIGER RAHMEN                                */
/* -------------------------------------------------------------------------- */
#ni-body-a .ni-faq{
   background:#fff !important;
   border:1px solid #E3EFF9 !important;
   box-shadow:0 8px 22px rgba(17,24,39,.06) !important;
}


/* -------------------------------------------------------------------------- */
/*  09) SCHLUSS-HINWEIS („Legal Note“) – WEISS + KLARER RAHMEN                */
/*      Inset-Schimmer nutzt den Akzent‑Token (sehr dezent).                  */
/* -------------------------------------------------------------------------- */
#ni-body-a #fazit .legal-note{
   background:#fff !important;
   border:2px solid #243240 !important;
   box-shadow:0 8px 22px rgba(17,24,39,.08), inset 0 0 0 1px var(--accent-10) !important;
   color:#111827 !important;
   padding:18px !important;
}/* End custom CSS */