.cmplz-hidden {
					display: none !important;
				}

    /* Overlay */
    #stm-cart-overlay {
        position: fixed; inset: 0;
        background: rgba(0,0,0,0.4);
        z-index: 99998;
        opacity: 0;
        transition: opacity 0.3s ease;
        cursor: pointer;
    }
    #stm-cart-overlay.stm-active { opacity: 1; }

    /* Slide-in Panel – oeffnet von rechts, dynamische Hoehe */
    #stm-slide-cart {
        position: fixed;
        top: 0; right: 0; left: auto;
        width: 380px; max-width: 90vw;
        max-height: 100vh;
        background: #fff;
        box-shadow: -4px 0 24px rgba(0,0,0,0.15);
        z-index: 99999;
        transform: translateX(100%);
        transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
        display: flex !important;
        flex-direction: column;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
        border-radius: 0 0 0 12px;
    }
    #stm-slide-cart.stm-active { transform: translateX(0); }

    /* Header */
    .stm-sc-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 20px 24px;
        background: #1B3A8C;
        color: #fff;
        flex-shrink: 0;
    }
    .stm-sc-title {
        font-size: 1.1rem;
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .stm-sc-icon { font-size: 1.3rem; }
    .stm-sc-badge {
        background: #C24400;
        color: #fff;
        font-size: 0.75rem;
        font-weight: 700;
        width: 22px; height: 22px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .stm-sc-close {
        background: none; border: none;
        color: #fff; font-size: 1.8rem;
        cursor: pointer; padding: 0;
        line-height: 1; opacity: 0.8;
        transition: opacity 0.2s;
    }
    .stm-sc-close:hover { opacity: 1; }

    /* Erfolgs-Banner */
    .stm-sc-added {
        background: #ecfdf5;
        color: #065f46;
        padding: 12px 24px;
        font-size: 0.9rem;
        font-weight: 500;
        display: flex;
        align-items: center;
        gap: 8px;
        flex-shrink: 0;
        border-bottom: 1px solid #d1fae5;
    }
    .stm-sc-check {
        background: #10b981;
        color: #fff;
        width: 20px; height: 20px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 0.7rem;
        flex-shrink: 0;
    }

    /* Artikel-Liste – dynamisch, scrollbar bei vielen Artikeln */
    .stm-sc-items {
        flex: 0 1 auto;
        overflow-y: auto;
        max-height: 50vh;
        padding: 16px 24px;
    }
    .stm-sc-item {
        display: flex;
        gap: 14px;
        padding: 14px 0;
        border-bottom: 1px solid #f0f0f0;
        align-items: center;
    }
    .stm-sc-item:last-child { border-bottom: none; }
    .stm-sc-item-img {
        width: 60px; height: 60px;
        object-fit: cover;
        border-radius: 8px;
        border: 1px solid #eee;
        flex-shrink: 0;
    }
    .stm-sc-item-info { flex: 1; min-width: 0; }
    .stm-sc-item-name {
        font-size: 0.9rem;
        font-weight: 500;
        color: #333;
        margin: 0 0 4px 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .stm-sc-item-meta {
        font-size: 0.8rem;
        color: #888;
    }
    .stm-sc-item-price {
        font-weight: 600;
        color: #1B3A8C;
        font-size: 0.95rem;
        white-space: nowrap;
    }
    .stm-sc-empty {
        text-align: center;
        padding: 40px 20px;
        color: #999;
        font-size: 0.95rem;
    }
    .stm-sc-empty-icon {
        font-size: 2.5rem;
        margin-bottom: 12px;
        display: block;
    }

    /* Footer */
    .stm-sc-footer {
        padding: 20px 24px;
        background: #f9fafb;
        border-top: 2px solid #eee;
        flex-shrink: 0;
    }
    .stm-sc-subtotal {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 16px;
        font-size: 1rem;
        color: #333;
    }
    .stm-sc-subtotal strong {
        color: #1B3A8C;
        font-size: 1.15rem;
    }
    .stm-sc-btn {
        display: block;
        width: 100%;
        padding: 13px 20px;
        border-radius: 8px;
        text-align: center;
        font-weight: 600;
        font-size: 0.95rem;
        text-decoration: none;
        transition: all 0.2s ease;
        margin-bottom: 8px;
        box-sizing: border-box;
        cursor: pointer;
        border: none;
    }
    .stm-sc-btn-cart {
        background: #fff;
        color: #1B3A8C;
        border: 2px solid #1B3A8C !important;
    }
    .stm-sc-btn-cart:hover { background: #f0f4ff; color: #1B3A8C; }
    .stm-sc-btn-checkout {
        background: #C24400;
        color: #fff !important;
    }
    .stm-sc-btn-checkout:hover { background: #e55a00; }
    .stm-sc-continue {
        display: block;
        width: 100%;
        background: none;
        border: none;
        color: #888;
        font-size: 0.85rem;
        cursor: pointer;
        padding: 8px 0 0 0;
        transition: color 0.2s;
    }
    .stm-sc-continue:hover { color: #555; }

    /* Mobile */
    @media (max-width: 480px) {
        #stm-slide-cart { width: 100vw; max-width: 100vw; }
    }
    

    /* Sticky Cart Tab - rechts am Rand */
    #stm-sticky-cart {
        position: fixed;
        right: 0;
        top: 50%;
        transform: translateY(-50%) translateX(100%);
        z-index: 99990;
        display: flex;
        align-items: center;
        gap: 10px;
        background: #1B3A8C;
        color: #fff;
        padding: 14px 16px 14px 18px;
        border-radius: 12px 0 0 12px;
        cursor: pointer;
        box-shadow: -2px 4px 16px rgba(0,0,0,0.2);
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                    background 0.2s ease;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
        user-select: none;
    }
    #stm-sticky-cart:hover {
        background: #15307a;
    }
    #stm-sticky-cart.stm-sticky-visible {
        transform: translateY(-50%) translateX(0);
    }

    .stm-sticky-icon {
        font-size: 1.4rem;
        line-height: 1;
    }
    .stm-sticky-badge {
        position: absolute;
        top: -6px;
        right: 30px;
        background: #C24400;
        color: #fff;
        font-size: 0.7rem;
        font-weight: 700;
        min-width: 20px;
        height: 20px;
        padding: 0 5px;
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 2px 6px rgba(194,68,0,0.4);
        animation: stm-badge-pop 0.3s ease;
    }
    @keyframes stm-badge-pop {
        0% { transform: scale(0.5); }
        70% { transform: scale(1.2); }
        100% { transform: scale(1); }
    }

    .stm-sticky-info {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    .stm-sticky-label {
        font-size: 0.7rem;
        opacity: 0.8;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    .stm-sticky-total {
        font-size: 0.95rem;
        font-weight: 700;
    }
    /*
     * Der Preis erbt wieder das Weiss der Leiste (#fff auf #1B3A8C).
     * Eine Farbkorrektur des BFSG-Checkers setzt
     * .woocommerce-Price-amount.amount bdi auf ein dunkles Orange; gemessen
     * wurde sie an Preisen auf weissem Grund, wo das richtig ist. Hier sitzt
     * der Preis auf Dunkelblau, und dort kam er damit auf 2,25:1. Die ID
     * gewinnt gegen die Klassen-Regel, ohne sie anderswo zu stoeren.
     */
    #stm-sticky-total,
    #stm-sticky-total .woocommerce-Price-amount,
    #stm-sticky-total .woocommerce-Price-amount.amount bdi {
        color: inherit !important;
    }
    .stm-sticky-arrow {
        font-size: 1.2rem;
        opacity: 0.6;
        transition: transform 0.2s, opacity 0.2s;
    }
    #stm-sticky-cart:hover .stm-sticky-arrow {
        transform: translateX(-3px);
        opacity: 1;
    }

    /* Puls-Animation bei neuem Artikel */
    #stm-sticky-cart.stm-pulse {
        animation: stm-tab-pulse 0.6s ease;
    }
    @keyframes stm-tab-pulse {
        0% { box-shadow: -2px 4px 16px rgba(0,0,0,0.2); }
        50% { box-shadow: -2px 4px 24px rgba(194,68,0,0.5); }
        100% { box-shadow: -2px 4px 16px rgba(0,0,0,0.2); }
    }

    /* Mobile: kompakter */
    @media (max-width: 768px) {
        #stm-sticky-cart {
            padding: 10px 12px 10px 12px;
            gap: 6px;
        }
        .stm-sticky-info { display: none; }
        .stm-sticky-arrow { display: none; }
    }

    /* Ausblenden wenn Slide-in offen ist */
    #stm-sticky-cart.stm-hidden { 
        transform: translateY(-50%) translateX(100%) !important;
    }
    

    /* Scroll to Top Button */
    .storetown-scroll-to-top {
        position: fixed;
        bottom: 30px;
        right: 30px;
        width: 56px;
        height: 56px;
        background: linear-gradient(135deg, #001889 0%, #003bb5 100%);
        color: white;
        border: none;
        border-radius: 50%;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        box-shadow: 0 4px 20px rgba(0, 24, 137, 0.4);
        z-index: 9999;
        opacity: 0;
        visibility: hidden;
        transform: translateY(20px);
        transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    }

    .storetown-scroll-to-top.visible {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .storetown-scroll-to-top:hover {
        background: linear-gradient(135deg, #C24400 0%, #ff7b2e 100%);
        transform: translateY(-5px) scale(1.1);
        box-shadow: 0 6px 30px rgba(194, 68, 0, 0.5);
    }

    .storetown-scroll-to-top:active {
        transform: translateY(-2px) scale(1.05);
    }

    .storetown-scroll-to-top svg {
        width: 28px;
        height: 28px;
        fill: currentColor;
        animation: scrollButtonArrow 2s ease-in-out infinite;
    }

    @keyframes scrollButtonArrow {
        0%, 100% {
            transform: translateY(0);
        }
        50% {
            transform: translateY(-4px);
        }
    }

    .storetown-scroll-to-top::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100%;
        height: 100%;
        background: radial-gradient(circle, rgba(255, 255, 255, 0.2) 0%, transparent 70%);
        border-radius: 50%;
        transform: translate(-50%, -50%) scale(0);
        opacity: 0;
        transition: all 0.4s ease;
    }

    .storetown-scroll-to-top:hover::before {
        transform: translate(-50%, -50%) scale(1.5);
        opacity: 1;
    }

    /* Mobile - Button ausblenden */
    @media (max-width: 768px) {
        .storetown-scroll-to-top {
            width: 48px;
            height: 48px;
            bottom: 20px;
            right: 20px;
        }
        
        .storetown-scroll-to-top svg {
            width: 24px;
            height: 24px;
        }
    }

    @media (max-width: 480px) {
        .storetown-scroll-to-top {
            width: 44px;
            height: 44px;
            bottom: 15px;
            right: 15px;
        }
        
        .storetown-scroll-to-top svg {
            width: 22px;
            height: 22px;
        }
    }
    

@media screen and (min-width:1101px){
/* --- Anker für die Panels: Headerleiste + Sticky-Klon (UL bewusst static, sonst
       zentriert das breite Panel am UL statt an der Leiste) --- */
.masthead:not(.side-header) .header-bar{position:relative}
#phantom .ph-wrap{position:relative}
.masthead .header-bar .main-nav,#phantom .main-nav{position:static}
/* --- Top-Level (position mit !important: The7 lädt Teile seines CSS nach diesem Style) --- */
/* align-self (01.10.2026): Zwischen 1101 und 1600 px setzt das Kopf-CSS "Menu einzeilig erzwingen" auf der UL
   align-items:center !important - die li schrumpften auf Texthoehe (18 px), der Aktiv-/Hover-Strich (bottom:0)
   klebte direkt unter dem Wort statt an der Unterkante der Leiste, und die Panels ragten 26 px in den Kopf.
   align-self am li schlaegt align-items der UL: volle Leistenhoehe wie ab 1601 px. */
.masthead .header-bar .main-nav > li.stm-mn-li{position:static!important;display:flex;align-items:stretch;align-self:stretch!important}
.masthead .header-bar .main-nav > li.stm-mn-referenzen,.masthead .header-bar .main-nav > li.stm-mn-extensions,.masthead .header-bar .main-nav > li.stm-mn-magazin{position:relative!important}
.masthead .header-bar .main-nav > li.stm-mn-li > a.stm-mn-top{display:flex;align-items:center;gap:7px;padding:0 17px;color:#262d37;text-decoration:none;position:relative}
.masthead .header-bar .main-nav > li.stm-mn-li > a.stm-mn-top .stm-mn-tt{font:600 15px/1.2 "Inter",Helvetica,Arial,sans-serif;letter-spacing:.012em;color:inherit;white-space:nowrap}
.stm-mn-li > .stm-mn-top .stm-mn-car{color:#98a0ad;transition:transform .22s ease,color .18s ease;flex:0 0 auto;margin-top:1px}
.stm-mn-li.stm-open > .stm-mn-top,.stm-mn-li > .stm-mn-top:hover{color:#c24400}
.stm-mn-li.stm-open > .stm-mn-top .stm-mn-car{transform:rotate(180deg);color:#c24400}
.masthead .header-bar .main-nav > li.stm-mn-li > a.stm-mn-top::after{content:'';position:absolute;left:17px;right:17px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:#c24400;opacity:0;transform:scaleX(.4);transition:opacity .2s ease,transform .25s ease}
.masthead .header-bar .main-nav > li.stm-mn-li.stm-on > a.stm-mn-top::after,.masthead .header-bar .main-nav > li.stm-mn-li.stm-open > a.stm-mn-top::after{opacity:1;transform:scaleX(1)}
.masthead .header-bar .main-nav > li.stm-mn-li.stm-on > a.stm-mn-top{color:#c24400}
/* --- Panel-Grundgerüst --- */
.stm-mn-panel{position:absolute;top:100%;left:0;right:0;margin:0 auto;z-index:9990;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .22s ease,transform .26s cubic-bezier(.22,.9,.3,1),visibility 0s linear .26s;pointer-events:none;background:#fff;border:1px solid rgba(22,30,55,.09);border-radius:0 0 16px 16px;border-top:none;box-shadow:0 30px 70px rgba(15,22,45,.18),0 4px 14px rgba(15,22,45,.06);max-height:calc(100vh - 150px);overflow:auto;text-align:left}
.stm-mn-li.stm-open > .stm-mn-panel,.stm-mn-li:focus-within > .stm-mn-panel{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition:opacity .22s ease,transform .26s cubic-bezier(.22,.9,.3,1),visibility 0s}
.stm-mn-loesungen .stm-mn-panel{width:min(1280px,calc(100vw - 56px))}
/* Kleine Panels: mittig unter dem jeweiligen Menüpunkt (li ist dort relative);
   --stm-mn-shift = Viewport-Klemme, vom JS vor dem Öffnen gesetzt */
.stm-mn-referenzen .stm-mn-panel,.stm-mn-extensions .stm-mn-panel,.stm-mn-magazin .stm-mn-panel{left:50%;right:auto;margin:0;transform:translate(calc(-50% + var(--stm-mn-shift,0px)),12px)}
.stm-mn-referenzen.stm-open > .stm-mn-panel,.stm-mn-referenzen:focus-within > .stm-mn-panel,
.stm-mn-extensions.stm-open > .stm-mn-panel,.stm-mn-extensions:focus-within > .stm-mn-panel,
.stm-mn-magazin.stm-open > .stm-mn-panel,.stm-mn-magazin:focus-within > .stm-mn-panel{transform:translate(calc(-50% + var(--stm-mn-shift,0px)),0)}
.stm-mn-referenzen .stm-mn-panel{width:min(820px,calc(100vw - 40px))}
/* --- Referenzen: Vorschau-Bühne --- */
.stm-mn-gridref{grid-template-columns:322px 1fr;gap:0 26px}
.stm-mn-refcats{border-right:1px solid #eef0f5;padding-right:22px}
.stm-mn-row.stm-cat-on .stm-mn-a{background:#f5f6fa}
.stm-mn-row.stm-cat-on .stm-mn-at{color:#c24400}
.stm-mn-stage{display:none}
.stm-mn-stage.stm-stage-on{display:block}
.stm-mn-refhead{display:block;font:700 11.5px/1 "Inter",Helvetica,Arial,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:#8a919e;margin:2px 0 10px 8px}
/* Marktplatz-Nachweis unter einer Produktliste */
.stm-mn-mkpl{display:flex;align-items:center;gap:9px;margin:10px 0 0;padding:8px 10px;border-radius:10px;border:1px solid;text-decoration:none;transition:background .15s ease,border-color .15s ease}
.stm-mn-mkpl.is-adobe{border-color:#f2dad8;background:#fdf6f5;color:#c9130a}
.stm-mn-mkpl.is-adobe:hover{background:#fceceb;border-color:#eec3bf}
.stm-mn-mkpl.is-wp{border-color:#d9e0fb;background:#f6f8fe;color:#2f49c9}
.stm-mn-mkpl.is-wp:hover{background:#eef2fd;border-color:#c3cef7}
.stm-mn-mkpl .stm-mn-ico{width:26px;height:26px;border-radius:7px;background:currentColor;border:0;flex:0 0 auto}
.stm-mn-mkpl .stm-mn-ico svg{width:14px;height:14px;fill:#fff}
.stm-mn-mkpl-tx{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.stm-mn-mkpl-k{font:600 10.5px/1.25 "Inter",Helvetica,Arial,sans-serif;color:#5f6678}
.stm-mn-mkpl-t{font:700 12.5px/1.3 "Inter",Helvetica,Arial,sans-serif;color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stm-mn-mkpl > svg{margin-left:auto;flex:0 0 auto;opacity:.75}
/* Einordnender Satz ueber den Projektkarten */
.stm-mn-refintro{margin:0 0 10px;font:400 12.3px/1.5 "Inter",Helvetica,Arial,sans-serif;color:#6b7285;max-width:52ch}
.stm-mn-refintro a{color:#c94600;text-decoration:none;font-weight:600;white-space:nowrap}
.stm-mn-refintro a svg{margin-left:3px;vertical-align:-1px;opacity:.8}
.stm-mn-refintro a:hover{text-decoration:underline}
.stm-mn-refcard{display:flex;align-items:center;gap:12px;padding:7px 8px;border-radius:10px;text-decoration:none;transition:background .14s ease}
.stm-mn-refcard:hover{background:#f5f6fa}
.stm-mn-ri{display:block;width:96px;height:60px;border-radius:8px;overflow:hidden;background:#eef0f5;border:1px solid #e9ebf1;flex:0 0 auto}
.stm-mn-ri img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.stm-mn-refcard:hover .stm-mn-ri img{transform:scale(1.06)}
.stm-mn-rt{font:600 13px/1.4 "Inter",Helvetica,Arial,sans-serif;color:#1f2635;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;transition:color .15s ease}
.stm-mn-refcard:hover .stm-mn-rt{color:#c24400}
.stm-mn-refall{display:inline-flex;align-items:center;gap:6px;margin:8px 0 0 8px;font:600 12.5px/1.3 "Inter",Helvetica,Arial,sans-serif;color:#2b3245;text-decoration:none;transition:color .15s ease}
.stm-mn-refall:hover{color:#c24400}
.stm-mn-refall svg{transition:transform .18s ease}
.stm-mn-refall:hover svg{transform:translateX(3px)}
.stm-mn-extensions .stm-mn-panel{width:min(1150px,calc(100vw - 40px))}
.stm-mn-magazin .stm-mn-panel{width:min(995px,calc(100vw - 40px))}
.stm-mn-in{padding:30px 36px 26px}
.stm-mn-referenzen .stm-mn-in{padding:22px 22px 18px}
/* --- Grid & Spalten --- */
.stm-mn-grid{display:grid;gap:6px 34px}
.stm-mn-grid4{grid-template-columns:1.26fr 1.05fr 1.1fr 1fr}
.stm-mn-grid2{grid-template-columns:1fr 1fr}
/* Die Kartenspalte bleibt fest: bei 1fr schrumpft sie auf 315px, und die Zeile
   "Online Shop Kostenrechner" hat dort nur 8px Luft - das Neu-Zeichen bricht sonst um. */
.stm-mn-grid3{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 337px}
.stm-mn-gridf{grid-template-columns:330px 1fr 1fr}
/* --- Featured-Beitragskarte (E-Magazin) --- */
.stm-mn-featcol{padding-right:6px;border-right:1px solid #eef0f5;margin-right:-6px}
.stm-mn-feat{display:block;text-decoration:none;padding:0 10px 6px;border-radius:12px}
.stm-mn-feat-img{display:block;border-radius:11px;overflow:hidden;aspect-ratio:16/9;background:#eef0f5;margin-bottom:11px;box-shadow:0 6px 18px rgba(15,22,45,.10)}
.stm-mn-feat-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s cubic-bezier(.22,.9,.3,1)}
.stm-mn-feat:hover .stm-mn-feat-img img{transform:scale(1.045)}
.stm-mn-feat-meta{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.stm-mn-feat-cat{display:inline-block;padding:3px 10px;border-radius:999px;background:#fff3ea;color:#d94b00;font:600 11px/1.4 "Inter",Helvetica,Arial,sans-serif;letter-spacing:.02em}
.stm-mn-feat-t{display:block;font:700 15px/1.4 "Inter",Helvetica,Arial,sans-serif;color:#1f2635;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;transition:color .15s ease}
.stm-mn-feat:hover .stm-mn-feat-t{color:#c24400}
.stm-mn-feat-by{display:block;margin-top:7px;font:400 12px/1.5 "Inter",Helvetica,Arial,sans-serif;color:#7a8194}
.stm-mn-facts{margin-right:auto;font:500 12.5px/1.5 "Inter",Helvetica,Arial,sans-serif;color:#6b7284;display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.stm-mn-ch{display:inline-flex;align-items:center;gap:6px;font:700 11.5px/1 "Inter",Helvetica,Arial,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:#8a919e;margin:0 0 12px 10px;text-decoration:none;transition:color .15s ease}
.stm-mn-ch .stm-mn-hvg{opacity:0;transform:translateX(-3px);transition:opacity .15s ease,transform .2s ease}
a.stm-mn-ch:hover{color:#c24400}
a.stm-mn-ch:hover .stm-mn-hvg{opacity:1;transform:none}
.stm-mn-list{list-style:none;margin:0;padding:0}
/* --- Zeilen --- */
.stm-mn-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;margin:0;padding:0}
.stm-mn-a{grid-column:1;display:block;padding:8px 10px;border-radius:10px;text-decoration:none;transition:background .14s ease;min-width:0}
.stm-mn-a:hover{background:#f5f6fa}
.stm-mn-at{display:block;font:600 14px/1.35 "Inter",Helvetica,Arial,sans-serif;color:#1f2635}
.stm-mn-a:hover .stm-mn-at{color:#c24400}
.stm-mn-ad{display:block;font:400 12.3px/1.4 "Inter",Helvetica,Arial,sans-serif;color:#7a8194;margin-top:2px}
/* zweite Textzeile: haengt direkt an der ersten, kein zusaetzlicher Abstand */
.stm-mn-ad2{margin-top:0}
.stm-mn-a[aria-current="page"] .stm-mn-at{color:#c24400}
/* --- System-Icons (Referenzen) --- */
.stm-mn-a.stm-mn-hasico{display:flex;align-items:center;gap:12px}
.stm-mn-ico{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;flex:0 0 auto;background:#f4f5f8;border:1px solid #e9ebf1;background:color-mix(in srgb,currentColor 8%,#fff);border-color:color-mix(in srgb,currentColor 18%,#fff);transition:background .15s ease,transform .15s ease}
.stm-mn-ico svg{width:19px;height:19px;fill:currentColor;display:block}
.stm-mn-a:hover .stm-mn-ico{background:color-mix(in srgb,currentColor 15%,#fff);transform:scale(1.05)}
.stm-mn-tx{display:block;min-width:0}
/* --- Ghost-Zeile: „auch andere Systeme" --- */
.stm-mn-ghost .stm-mn-ico{background:#fff;border-style:dashed;border-color:#c9cdd8}
.stm-mn-ghost .stm-mn-at{color:#5a6172;font-weight:600}
.stm-mn-ghost .stm-mn-ad{color:#8a91a0}
.stm-mn-ghost .stm-mn-a:hover .stm-mn-at{color:#c24400}
.stm-mn-ghost .stm-mn-a:hover .stm-mn-ico{color:#c24400!important;border-color:#c24400;border-style:dashed;background:#fff7f2}
.stm-mn-thumb{display:block;width:48px;height:48px;border-radius:11px;border:1px solid #e9ebf1;background:#fff;overflow:hidden;flex:0 0 auto;box-shadow:0 2px 8px rgba(15,22,45,.07);transition:transform .15s ease,box-shadow .15s ease}
.stm-mn-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.stm-mn-a:hover .stm-mn-thumb{transform:scale(1.05);box-shadow:0 4px 14px rgba(15,22,45,.14)}
.stm-mn-badge{display:inline-block;vertical-align:2px;margin-left:4px;padding:2px 7px 1px;border-radius:5px;background:#c24400;color:#fff;font:700 9.5px/1.2 "Inter",Helvetica,Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.stm-mn-chip{grid-column:2;margin:0 4px 0 2px;padding:3px 9px;border:1px solid #d9dde6;border-radius:999px;font:600 11px/1.4 "Inter",Helvetica,Arial,sans-serif;color:#5a6172;text-decoration:none;transition:all .15s ease;white-space:nowrap}
.stm-mn-chip:hover{border-color:#c24400;color:#c24400;background:#fff7f2}
.stm-mn-mini{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;padding:0 10px 8px;margin-top:-3px}
.stm-mn-row:has(.stm-mn-hasico) .stm-mn-mini{padding-left:58px}
.stm-mn-mini a{font:500 11.5px/1.5 "Inter",Helvetica,Arial,sans-serif;color:#8a91a0;text-decoration:none;border-bottom:1px dotted #c9cdd8;transition:color .15s ease,border-color .15s ease}
.stm-mn-mini a:hover{color:#c24400;border-color:#c24400}
.stm-mn-dot{color:#c3c8d4;font-size:11px}
/* --- Tool-Karte --- */
.stm-mn-card{margin:14px 0 2px 10px;padding:16px 16px 8px;border-radius:13px;background:linear-gradient(135deg,#1b2a8f 0%,#5a24c8 62%,#8224e3 100%);box-shadow:0 10px 26px rgba(60,30,160,.28)}
.stm-mn-cardt{display:block;font:700 10.5px/1 "Inter",Helvetica,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.75);margin-bottom:8px}
.stm-mn-card a{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;align-items:center;padding:8px 8px;margin:0 -6px;border-radius:9px;text-decoration:none;transition:background .15s ease,color .15s ease}
.stm-mn-card a.hat-ico{grid-template-columns:auto minmax(0,1fr) auto;column-gap:10px}
.stm-mn-card a:hover{background:rgba(255,255,255,.12)}
/* Trennlinie zwischen den Eintraegen, dazu mehr Luft - die Zeilen standen zu eng */
.stm-mn-card a{padding:11px 8px}
.stm-mn-card a + a{border-top:1px solid rgba(255,255,255,.16)}
.stm-mn-card .ct{grid-column:1;font:600 13.5px/1.3 "Inter",Helvetica,Arial,sans-serif;color:#fff}
.stm-mn-card .cd{grid-column:1;grid-row:2;font:400 11.5px/1.35 "Inter",Helvetica,Arial,sans-serif;color:rgba(255,255,255,.86)}
.stm-mn-card a.hat-ico .ct{grid-column:2;grid-row:1}
.stm-mn-card a.hat-ico .cd{grid-column:2;grid-row:2}
/* nur das direkte Kind ist der Pfeil - sonst faengt die Regel das Icon-SVG mit ein */
.stm-mn-card > a > svg{grid-column:2;grid-row:1 / span 2;color:rgba(255,255,255,.85)}
.stm-mn-card > a.hat-ico > svg{grid-column:3}
/* Icon-Chip auf dunklem Grund: der helle color-mix-Chip der Listen passt hier nicht */
.stm-mn-card a{color:#fff}
.stm-mn-card .stm-mn-ico{grid-column:1;grid-row:1 / span 2;width:30px;height:30px;border-radius:9px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.2)}
.stm-mn-card .stm-mn-ico svg{width:17px;height:17px}
.stm-mn-card a:hover{color:#ffd60a}
.stm-mn-card a:hover .stm-mn-ico{background:rgba(255,214,10,.2);border-color:rgba(255,214,10,.45);transform:scale(1.05)}
/* Karte fuellt eine Spalte allein (Extensions-Panel): senkrecht mittig darin */
.stm-mn-colcard{display:flex;flex-direction:column;justify-content:center}
.stm-mn-card.is-solo{margin:0;padding:15px 14px 10px}
/* Gelber Rahmen: heller Doppelring, damit er auf dem Violett frisch wirkt */
.stm-mn-card.is-gelb{border:2px solid #ffd60a;box-shadow:0 0 0 5px rgba(255,214,10,.14),0 12px 30px rgba(60,30,160,.3)}
/* Neu-Zeichen: gelber Punkt mit ruhigem Ring (kein Blitzen - WCAG 2.3.1), Wort steht still */
.stm-mn-cneu{display:inline-flex;align-items:center;gap:4px;vertical-align:2px;margin-left:5px;padding:2px 6px 1px;white-space:nowrap;border-radius:5px;background:#ffd60a;color:#3a2a00;font:700 9.5px/1.2 "Inter",Helvetica,Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase;animation:stm-mn-neuring 2.4s ease-out infinite}
.stm-mn-cneu i{width:4px;height:4px;border-radius:50%;background:#3a2a00;animation:stm-mn-puls 2.4s ease-in-out infinite}
/* Ein Ring laeuft nach aussen und verglueht - 0,42 Hz, weit unter den 3 Hz aus WCAG 2.3.1 */
@keyframes stm-mn-neuring{0%{box-shadow:0 0 0 0 rgba(255,214,10,.7)}55%,100%{box-shadow:0 0 0 7px rgba(255,214,10,0)}}
@keyframes stm-mn-puls{0%,70%,100%{opacity:1}35%{opacity:.4}}
@media (prefers-reduced-motion:reduce){.stm-mn-cneu,.stm-mn-cneu i{animation:none}}
.stm-mn-cbadge{display:inline-block;vertical-align:2px;margin-left:5px;padding:2px 7px 1px;border-radius:5px;background:#fff;color:#4a189e;font:700 9.5px/1.2 "Inter",Helvetica,Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase}
/* --- Fußleiste --- */
.stm-mn-foot{display:flex;align-items:center;gap:18px;padding:13px 36px;border-top:1px solid #edeff5;background:#fafbfd;border-radius:0 0 15px 15px}
.stm-mn-referenzen .stm-mn-foot{padding:12px 22px}
.stm-mn-fspace{flex:1 1 auto}
.stm-mn-all{display:inline-flex;align-items:center;gap:7px;font:600 13px/1.3 "Inter",Helvetica,Arial,sans-serif;color:#2b3245;text-decoration:none;transition:color .15s ease}
.stm-mn-all:hover{color:#c24400}
.stm-mn-all svg{transition:transform .18s ease}
.stm-mn-all:hover svg{transform:translateX(3px)}
/* Preis-Link im Fuss: gleiche Groesse wie die Nachbarn, aber mit Rahmen -
   er ist ein eigenes Ziel und soll nicht mit „Alle Leistungen" verschmelzen. */
.stm-mn-preise{display:inline-flex;align-items:center;gap:7px;font:600 13px/1.3 "Inter",Helvetica,Arial,sans-serif;
  color:#2b3245;text-decoration:none;white-space:nowrap;padding:6px 13px;border:1px solid #dfe3ec;
  border-radius:100px;background:#fff;transition:color .15s ease,border-color .15s ease}
.stm-mn-preise:hover{color:#c24400;border-color:#c24400}
.stm-mn-tel{display:inline-flex;align-items:center;gap:7px;font:600 13px/1.3 "Inter",Helvetica,Arial,sans-serif;color:#2b3245;text-decoration:none;white-space:nowrap}
.stm-mn-tel:hover{color:#c24400}
.stm-mn-cta{display:inline-block;padding:9px 18px;border-radius:9px;background:#c24400;color:#fff;font:600 13px/1.2 "Inter",Helvetica,Arial,sans-serif;text-decoration:none;transition:background .15s ease,transform .15s ease;white-space:nowrap}
.stm-mn-cta:hover{background:#00178f;color:#fff;transform:translateY(-1px)}
/* --- Retro-Zeile --- */
.stm-mn-retro{display:flex;align-items:center;gap:8px;margin-top:14px;padding:9px 10px 0;border-top:1px dashed #e6e8f0}
.stm-mn-retro span:first-child{font:500 11.5px/1.4 "Inter",Helvetica,Arial,sans-serif;color:#a0a6b4}
.stm-mn-retro a{font:500 11.5px/1.4 "Inter",Helvetica,Arial,sans-serif;color:#8a91a0;text-decoration:none;border-bottom:1px dotted #c9cdd8}
.stm-mn-retro a:hover{color:#c24400;border-color:#c24400}
/* --- Seiten-Dim beim offenen Panel (eigenes Element, vom JS einmalig angelegt) --- */
.stm-mn-dimel{position:fixed;inset:0;background:rgba(18,23,40,.34);opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:9988}
html.stm-mn-dim .stm-mn-dimel{opacity:1}
html.stm-mn-dim .masthead:not(.side-header){z-index:9989}
html.stm-mn-dim #phantom{z-index:9989}
}
@media screen and (max-width:1100px){
.stm-mn-panel{display:none}
}

.pricing-faktoren{margin:.55rem 0 0;font-size:.82rem;line-height:1.5;color:#6b7689;max-width:34ch}.pricing-card .pricing-faktoren{margin-bottom:0}@media(max-width:768px){.pricing-faktoren{font-size:.8rem}}

.stm-bt{display:flex;align-items:center;gap:10px;flex-basis:100%;width:100%;max-width:560px;margin:14px 0 2px;padding:10px 14px;background:#f5f8ff;border:1px solid #d9e3f6;border-radius:10px;font-size:13px;line-height:1.5;color:#4c5769;box-sizing:border-box}
.stm-bt__badge{flex:0 0 auto;padding:5px 9px;background:#C24400;border-radius:8px;color:#fff;font-weight:800;font-size:13px;line-height:1}
.stm-sc-bundle{margin:12px 0 4px;padding:11px 14px;background:#f5f8ff;border:1px solid #d9e3f6;border-radius:10px;font-size:12.5px;line-height:1.5;color:#4c5769}
.stm-sc-bundle strong{color:#16265c}
.stm-sc-bundle--aktiv{background:#f2fbf5;border-color:#cbe8d4;color:#1a7f37}
.stm-sc-bundle--aktiv strong{color:#1a7f37}


/* ============================================
   STM FOOTER v3.0 – Direkt (kein iframe)
   Alle Selektoren mit .stm-ft- Prefix
   ============================================ */
.stm-ft-wrapper {
    width: 100%;
    background: linear-gradient(135deg, #061B90 0%, #0a2ab8 50%, #061B90 100%);
    color: #fff;
    position: relative;
    overflow: hidden;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    clear: both;
}
.stm-ft-wrapper::before {
    content: '';
    position: absolute; inset: 0;
    background:
        radial-gradient(circle at 20% 80%, rgba(194,68,0,.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(194,68,0,.1) 0%, transparent 50%),
        radial-gradient(circle at 40% 40%, rgba(255,255,255,.05) 0%, transparent 50%);
    animation: stmFtGrad 20s ease infinite;
    pointer-events: none;
}
@keyframes stmFtGrad {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50%      { transform: translateY(-20px) rotate(180deg); }
}
.stm-ft-deco {
    position: absolute; border-radius: 50%;
    background: rgba(194,68,0,.1); filter: blur(60px);
    pointer-events: none;
}
.stm-ft-deco-1 { width: 300px; height: 300px; top: -100px; right: -100px; }
.stm-ft-deco-2 { width: 200px; height: 200px; bottom: -50px; left: 10%; }

.stm-ft-container {
    position: relative; z-index: 1;
    max-width: 1400px; margin: 0 auto;
    padding: 60px 30px 30px;
}
.stm-ft-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 40px; margin-bottom: 50px;
}
.stm-ft-col { position: relative; overflow: visible; }
.stm-ft-col h3 {
    font-size: 20px; font-weight: 700; margin-bottom: 25px;
    color: #fff; position: relative; padding-bottom: 10px;
}
.stm-ft-col h3::after {
    content: ''; position: absolute; bottom: 0; left: 0;
    width: 40px; height: 3px; background: #FFB38C;
    border-radius: 2px; box-shadow: 0 0 10px rgba(255,179,140,.5);
}
.stm-ft-col ul { list-style: none; margin: 0; padding: 0; }
.stm-ft-col ul li {
    margin-bottom: 12px; transition: transform .3s; position: relative;
}
.stm-ft-col ul li::before {
    content: ''; position: absolute; left: -15px; top: 50%;
    transform: translateY(-50%); width: 0; height: 2px;
    background: #FFB38C; transition: width .3s; pointer-events: none;
}
.stm-ft-col ul li:hover::before { width: 8px; }
.stm-ft-col ul li:hover { transform: translateX(5px); }
.stm-ft-col a {
    color: rgba(255,255,255,.9); text-decoration: none;
    font-size: 15px; transition: all .3s;
    display: inline-flex; align-items: center; gap: 8px;
}
.stm-ft-col a:hover {
    color: #FFB38C; text-shadow: 0 0 15px rgba(255,179,140,.6);
}
/* Logo */
.stm-ft-logo {
    display: block; margin-bottom: 25px; padding: 15px 20px;
    background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(255,255,255,.95));
    border-radius: 12px; border: 2px solid #FFB38C;
    box-shadow: 0 4px 20px rgba(255,179,140,.25); max-width: 320px;
}
.stm-ft-logo img { display: block; width: 100%; height: auto; max-width: 280px; }
.stm-ft-desc {
    color: rgba(255,255,255,.85); line-height: 1.7;
    font-size: 15px; margin-bottom: 25px;
}
/* Kontakt */
.stm-ft-contact { display: flex; flex-direction: column; gap: 14px; }
.stm-ft-ci {
    display: flex; align-items: center; gap: 12px;
    color: rgba(255,255,255,.9); font-size: 15px;
}
.stm-ft-ci span:first-child { color: #FFB38C; filter: brightness(1.3); font-size: 18px; }
.stm-ft-ci a { color: rgba(255,255,255,.9); text-decoration: none; transition: color .3s; }
.stm-ft-ci a:hover { color: #FFB38C; }
/* Social */
.stm-ft-social { display: flex; gap: 15px; margin-top: 30px; }
.stm-ft-slink {
    width: 44px; height: 44px; border-radius: 50%;
    background: rgba(255,255,255,.1); display: flex;
    align-items: center; justify-content: center;
    transition: all .3s; color: #fff;
}
.stm-ft-slink:hover {
    background: #C24400; transform: translateY(-3px);
    box-shadow: 0 5px 20px rgba(194,68,0,.4);
    color: #061B90;
}
.stm-ft-slink:hover svg,
.stm-ft-slink:hover svg path { fill: #061B90 !important; }
/* Bottom */
.stm-ft-bottom {
    display: flex; justify-content: space-between; align-items: center;
    flex-wrap: wrap; gap: 14px 30px;
    padding-top: 30px; border-top: 1px solid rgba(255,255,255,.15);
}
.stm-ft-copy { color: rgba(255,255,255,.7); font-size: 14px; }
/* Rechtslinks: seit 01.09.2026 acht Eintraege (inkl. Erklaerung zur Barrierefreiheit).
   Deshalb umbruchfaehig statt starr - bleibt rechtsbuendig und faellt bei Platzmangel
   sauber in eine zweite Zeile, statt sich mit dem Copyright zu beruehren. */
.stm-ft-legal { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px 26px; }
.stm-ft-legal a {
    color: rgba(255,255,255,.7); text-decoration: none;
    font-size: 14px; transition: color .3s; white-space: nowrap;
}
.stm-ft-legal a:hover { color: #FFB38C; }
/* Widerrufsbutton (EU-Widerrufsfunktion, Pflicht seit 19.06.2026):
   setzt sich bewusst von den uebrigen Rechtslinks ab. Ziel-Seite und
   Beschriftung kommen zur Laufzeit aus dem Germanized-OWB-Paket.
   Spezifitaet (0,4,1): schlaegt auch die spaete Kompaktregel
   ".stm-ft-wrapper .stm-ft-legal a" (padding 3px 2px, font-size 12px). */
.stm-ft-wrapper .stm-ft-legal a.stm-ft-vwd {
    border: 1px solid rgba(255,255,255,.55);
    border-radius: 999px;
    padding: 6px 16px;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}
.stm-ft-wrapper .stm-ft-legal a.stm-ft-vwd:hover { border-color: #FFB38C; color: #FFB38C; }

/* === RESPONSIVE === */
/* Laptop: Abstaende schrumpfen, damit die Rechtsleiste einzeilig bleibt (statt Schrift zu verkleinern). */
@media (max-width: 1400px) {
    .stm-ft-legal { gap: 10px 20px; }
}
@media (max-width: 1024px) {
    .stm-ft-grid { grid-template-columns: 1fr 1fr; gap: 30px; }
    .stm-ft-col:first-child { grid-column: 1 / -1; }
    .stm-ft-logo { margin: 0 auto 25px; }
    .stm-ft-desc { text-align: center; }
    .stm-ft-contact { align-items: center; }
    .stm-ft-social { justify-content: center; }
}
@media (max-width: 768px) {
    .stm-ft-container { padding: 40px 20px 25px; }
    .stm-ft-grid { grid-template-columns: 1fr; gap: 35px; margin-bottom: 35px; }
    .stm-ft-col { text-align: center; }
    .stm-ft-col h3 { font-size: 18px; margin-bottom: 20px; }
    .stm-ft-col h3::after { left: 50%; transform: translateX(-50%); }
    .stm-ft-logo { max-width: 280px; margin: 0 auto 20px; }
    .stm-ft-desc { font-size: 14px; padding: 0 10px; }
    .stm-ft-contact {
        background: rgba(255,255,255,.05); border-radius: 12px;
        padding: 20px; margin-top: 15px;
    }
    .stm-ft-ci { justify-content: center; font-size: 14px; }
    .stm-ft-col:nth-child(2) ul,
    .stm-ft-col:nth-child(3) ul {
        display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px;
    }
    .stm-ft-col:nth-child(2) ul li,
    .stm-ft-col:nth-child(3) ul li {
        margin-bottom: 0; background: rgba(255,255,255,.05);
        border-radius: 8px; text-align: center;
    }
    .stm-ft-col:nth-child(2) ul li::before,
    .stm-ft-col:nth-child(3) ul li::before { display: none; }
    .stm-ft-col:nth-child(2) ul li:hover,
    .stm-ft-col:nth-child(3) ul li:hover {
        transform: none; background: rgba(194,68,0,.15);
    }
    .stm-ft-col:nth-child(2) a,
    .stm-ft-col:nth-child(3) a {
        font-size: 13px; padding: 12px 8px;
        display: block; width: 100%; line-height: 1.3;
    }
    .stm-ft-bottom { flex-direction: column; text-align: center; gap: 15px; padding-top: 25px; }
    .stm-ft-copy { font-size: 13px; }
    .stm-ft-legal { justify-content: center; gap: 20px; }
    .stm-ft-legal a { font-size: 13px; }
    .stm-ft-deco { display: none; }
}
@media (max-width: 400px) {
    .stm-ft-container { padding: 30px 15px 20px; }
    .stm-ft-logo { max-width: 250px; padding: 10px 12px; }
    .stm-ft-logo img { max-width: 200px; }
    .stm-ft-desc { font-size: 13px; }
    .stm-ft-contact { padding: 15px; }
    .stm-ft-ci { font-size: 13px; flex-direction: column; gap: 4px; }
    .stm-ft-col:nth-child(2) ul,
    .stm-ft-col:nth-child(3) ul { grid-template-columns: 1fr; }
    .stm-ft-col:nth-child(2) a,
    .stm-ft-col:nth-child(3) a { padding: 14px 10px; font-size: 14px; }
    .stm-ft-legal { flex-direction: column; gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    .stm-ft-wrapper::before { animation: none; }
}


@media (max-width: 768px) {
/* ---------- 1) FOOTER .stm-ft-wrapper ---------- */
footer.stm-ft-wrapper::before { animation: none; }

.stm-ft-wrapper .stm-ft-container { padding: 28px 16px 18px; }
.stm-ft-wrapper .stm-ft-grid { gap: 12px; margin-bottom: 18px; }

.stm-ft-wrapper .stm-ft-logo { max-width: 200px; padding: 8px 12px; margin: 0 auto 12px; }
.stm-ft-wrapper .stm-ft-desc { font-size: 13px; line-height: 1.55; margin-bottom: 12px; padding: 0; }
.stm-ft-wrapper .stm-ft-contact { padding: 12px 14px; margin-top: 8px; gap: 8px; }
.stm-ft-wrapper .stm-ft-ci { font-size: 13px; }
.stm-ft-wrapper .stm-ft-social { margin-top: 12px; gap: 12px; }
.stm-ft-wrapper .stm-ft-slink { width: 40px; height: 40px; }

.stm-ft-wrapper.stm-ft-acc .stm-ft-col h3 {
    font-size: 15px; font-weight: 600; margin: 0;
    padding: 13px 44px 13px 14px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 10px;
    text-align: left; cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none; user-select: none;
}
.stm-ft-wrapper.stm-ft-acc .stm-ft-col h3:focus-visible { outline: 2px solid #C24400; outline-offset: 2px; }
.stm-ft-wrapper.stm-ft-acc .stm-ft-col h3::after {
    content: "+";
    position: absolute; top: 50%; bottom: auto; right: 12px; left: auto;
    transform: translateY(-50%);
    width: 24px; height: 24px; line-height: 24px;
    background: rgba(194,68,0,.2); color: #fff;
    border-radius: 50%; box-shadow: none;
    font-size: 17px; font-weight: 400; text-align: center;
}
.stm-ft-wrapper.stm-ft-acc .stm-ft-col.stm-open h3::after { content: "\2013"; }
.stm-ft-wrapper.stm-ft-acc .stm-ft-col ul { display: none; }
.stm-ft-wrapper.stm-ft-acc .stm-ft-col.stm-open ul {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-top: 10px;
}
.stm-ft-wrapper.stm-ft-acc .stm-ft-col ul li { margin-bottom: 0; background: rgba(255,255,255,.05); border-radius: 8px; text-align: center; }
.stm-ft-wrapper.stm-ft-acc .stm-ft-col ul li::before { display: none; }
.stm-ft-wrapper.stm-ft-acc .stm-ft-col ul li:hover { transform: none; background: rgba(194,68,0,.15); }
.stm-ft-wrapper.stm-ft-acc .stm-ft-col ul a { display: block; width: 100%; font-size: 13px; line-height: 1.35; padding: 11px 8px; }

.stm-ft-wrapper .stm-ft-bottom { padding-top: 14px; gap: 8px; }
.stm-ft-wrapper .stm-ft-copy { font-size: 12px; }
.stm-ft-wrapper .stm-ft-legal { flex-wrap: wrap; justify-content: center; gap: 6px 14px; }
.stm-ft-wrapper .stm-ft-legal a { font-size: 12px; padding: 3px 2px; }
}

/* STM-KKT-V1: Ueberschrift folgt wieder der Ausrichtung ihrer Sektion */
[class*="-contact-item"] > h3,
[class*="-contact-item"] > h4 {
  display: block !important;
}
/* Der Abstand kam vorher aus flex-gap - als Inline-Inhalt braucht das Icon einen Rand */
[class*="-contact-item"] > h3 > i,
[class*="-contact-item"] > h4 > i,
[class*="-contact-item"] > h3 > svg,
[class*="-contact-item"] > h4 > svg {
  margin-right: .5rem;
}


/* Gates haengen an JS-vergebenen Klassen -> ohne JS bleibt alles sichtbar */
@media (max-width: 768px) {
  .stm-reg-wrap:not(.stm-open) .stm-reg-hm { display: none !important; }
}
@media (min-width: 769px) {
  .stm-reg-wrap:not(.stm-open) .stm-reg-hd { display: none !important; }
  .stm-reg-wrap .stm-reg-grid { grid-template-columns: repeat(6, 1fr) !important; }
}
/* ---------- STM-MOREBTN-V2: "Alle N anzeigen" elegant (2026-08-15) ----------
   Kundenbefund: "sehr eingepresst, steht so weit oben" - der Knopf klebte
   mit 12 px unter dem Raster und trug als 480-px-Block die Anmutung eines
   Formularfeldes. Neu: zentrierte Pille in Auto-Breite mit Luft nach oben,
   Icon-Kreis im Hausverlauf (dieselbe Optik wie .stm-acc-icon). Das
   Plus/Minus steckt jetzt im CSS und haengt an aria-expanded, deshalb
   traegt das Label kein Zeichen mehr. */
.stm-reg-btn {
  display: flex; align-items: center; justify-content: center; gap: .62rem;
  width: fit-content; min-width: min(100%, 15rem); max-width: min(100%, 27rem);
  margin: clamp(1.9rem, 3.4vw, 2.9rem) auto .4rem;
  padding: .8rem 1.35rem .8rem 1.6rem;
  border: 1px solid rgba(6,27,144, .2);
  border-radius: 999px;
  background: #fff;
  color: #061b90;
  font-family: inherit; font-size: .97rem; font-weight: 600; line-height: 1.25;
  text-align: center;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(10,22,70,.05), 0 14px 30px -22px rgba(6,27,144, .9);
  transition: border-color .25s ease, box-shadow .25s ease, transform .2s ease, background-color .25s ease;
  position: relative; z-index: 2;
  -webkit-tap-highlight-color: transparent;
}
.stm-reg-btn::after {
  content: ""; flex: 0 0 22px; width: 22px; height: 22px; border-radius: 50%;
  background: linear-gradient(#fff,#fff) center/9px 1.7px no-repeat, linear-gradient(#fff,#fff) center/1.7px 9px no-repeat, linear-gradient(135deg,#C24400,#ff7b2e);
  box-shadow: 0 5px 12px -5px rgba(194,68,0,.7);
  transition: transform .3s ease;
}
.stm-reg-btn[aria-expanded="true"]::after {
  background: linear-gradient(#fff,#fff) center/9px 1.7px no-repeat, linear-gradient(135deg,#C24400,#ff7b2e);
}
.stm-reg-btn:focus-visible { outline: 2px solid #061b90; outline-offset: 3px; }
.stm-reg-btn:active { transform: scale(.985); }
@media (hover: hover) {
  .stm-reg-btn:hover { border-color: rgba(6,27,144, .45); background: #fbfcff; box-shadow: 0 2px 4px rgba(10,22,70,.06), 0 20px 34px -22px rgba(6,27,144, 1); transform: translateY(-1px); }
  .stm-reg-btn:hover::after { transform: scale(1.09); }
}
/* v1.0.1: Reveal-Fade im Regional-Scope neutralisieren (Ruhe-Linie).
   Sichert zugleich per Toggle aufgedeckte und mobil reaktivierte Karten,
   deren IntersectionObserver-Reveal sonst timing-abhaengig waere. */
.stm-reg-wrap .scroll-reveal {
  opacity: 1 !important;
  transform: none !important;
}


/* STM-TTD-V1: keine Hover-Tooltips ohne Mauszeiger */
@media (hover: none), (pointer: coarse), (max-width: 1024px) {
  [class*="regional-city"] .tooltip,
  [class*="regional-city"] .city-tooltip,
  .regional-city .tooltip,
  .regional-city .city-tooltip {
    display: none !important;
  }
  /* Link-Vorschauen (tippy.js) */
  [data-tippy-root],
  .tippy-box {
    display: none !important;
  }
}


    /* ======= Fix: Top-Bar & Header overflow für Dropdown ======= */
    .top-bar,
    .top-bar .left-widgets,
    .top-bar .left-widgets.mini-widgets,
    .top-bar .mini-widgets,
    .top-bar .top-bar-bg {
        overflow: visible !important;
    }
    /* Top-Bar muss über der Hauptnavigation liegen */
    .top-bar {
        position: relative;
        z-index: 1000002 !important;
    }
    /* The7: Masthead/Header darf Dropdown nicht clippen */
    .masthead,
    .dt-header-container,
    #masthead {
        overflow: visible !important;
    }

    /* ======= Top-Bar Account Link — Wie Phone/E-Mail ======= */

    /* Der Link selbst — gleicher Look wie .mini-contacts */
    .stm-tb-account {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 0 12px;
        font-size: inherit;
        line-height: inherit;
        color: inherit !important;
        text-decoration: none !important;
        cursor: pointer;
        white-space: nowrap;
        vertical-align: middle;
    }
    .stm-tb-account:hover {
        opacity: .8;
    }
    /* Wenn Dropdown offen: keine Opacity auf Parent, sonst wird Dropdown durchsichtig */
    .stm-tb-account[aria-expanded="true"],
    .stm-tb-account[aria-expanded="true"]:hover {
        opacity: 1 !important;
    }
    .stm-tb-account .stm-tb-sep {
        margin-right: 4px;
        opacity: .4;
    }
    .stm-tb-account .stm-tb-icon {
        font-size: 1em;
        line-height: 1;
    }
    .stm-tb-account .stm-tb-caret {
        font-size: .65em;
        opacity: .6;
        transition: transform .2s;
    }
    .stm-tb-account[aria-expanded="true"] .stm-tb-caret {
        transform: rotate(180deg);
    }

    /* ======= Dropdown (nur eingeloggt) ======= */
    .stm-tb-dropdown {
        position: absolute;
        top: 100%;
        left: 0;
        margin-top: 8px;
        background: #fff;
        border-radius: 14px;
        box-shadow: 0 20px 50px rgba(0,0,0,.18), 0 0 0 1px rgba(0,0,0,.05);
        min-width: 260px;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-8px);
        transition: all .22s ease;
        z-index: 1000001;
        overflow: hidden;
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    }
    .stm-tb-dropdown.stm-open {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    /* Dropdown Header */
    .stm-tb-dd-head {
        background: linear-gradient(135deg, #001889 0%, #003bb5 100%);
        color: #fff;
        padding: 18px 20px;
    }
    .stm-tb-dd-head strong {
        display: block;
        font-size: 1rem;
        margin-bottom: 2px;
    }
    .stm-tb-dd-head small {
        font-size: .8rem;
        opacity: .75;
    }

    /* Dropdown Links */
    .stm-tb-dd-links { padding: 6px 0; }
    .stm-tb-dd-link {
        display: flex !important;
        align-items: center;
        gap: 10px;
        padding: 11px 20px;
        color: #374151 !important;
        text-decoration: none !important;
        font-size: .9rem;
        font-weight: 500;
        transition: background .15s, color .15s;
    }
    .stm-tb-dd-link:hover {
        background: #f1f5f9;
        color: #001889 !important;
    }
    .stm-tb-dd-link span:first-child {
        font-size: 1.1rem;
        width: 22px;
        text-align: center;
        flex-shrink: 0;
    }
    .stm-tb-dd-sep {
        height: 1px;
        background: #f1f5f9;
        margin: 4px 16px;
    }
    .stm-tb-dd-logout {
        color: #dc2626 !important;
    }
    .stm-tb-dd-logout:hover {
        background: #fef2f2 !important;
        color: #dc2626 !important;
    }

    /* ======= Mobile: Floating Account Button ======= */
    /* Die Top-Bar ist auf Mobile meist ausgeblendet → eigener Button */
    .stm-mobile-account {
        display: none;
        position: fixed;
        bottom: 20px;
        right: 20px;
        z-index: 999999;
        width: 50px;
        height: 50px;
        background: linear-gradient(135deg, #001889 0%, #003bb5 100%);
        color: #fff !important;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
        font-size: 1.2rem;
        text-decoration: none !important;
        box-shadow: 0 4px 20px rgba(0,24,137,.4);
        transition: transform .2s, box-shadow .2s;
        border: none;
        cursor: pointer;
		display:none !important;
    }
    .stm-mobile-account:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 30px rgba(0,24,137,.5);
    }

    /* Desktop: Top-Bar visible → hide mobile button */
    @media (min-width: 1025px) {
        .stm-mobile-account { display: none !important; }
    }
    /* Mobile/Tablet: Top-Bar hidden → show mobile button */
    @media (max-width: 1024px) {
        .stm-mobile-account { display: flex; }
    }

    /* ======= Verstecke den Link solange er noch nicht in die Top-Bar gemoved wurde ======= */
    #stm-tb-account-source { display: none; }
    
.stm-opc-faq-section div[style*="rgba(255,255,255,0.10)"]{background:rgba(255,255,255,0.16) !important;border-color:rgba(255,255,255,0.30) !important;}.stm-opc-faq-section div[style*="rgba(255,255,255,0.10)"] p strong{color:#ffffff !important;}.stm-opc-faq-section div[style*="rgba(255,255,255,0.10)"] p span{color:#e2ecfb !important;}

    .ilj-link-preview {
        width: 360px !important;
        min-width: 360px !important;
        max-width: 360px !important;
        display: grid !important;
        grid-template-columns: 100px 1fr !important;
        grid-template-rows: auto 1fr !important;
        gap: 0 14px !important;
        border-radius: 8px !important;
        box-shadow: 0 8px 30px rgba(0,0,0,0.12), 0 2px 8px rgba(0,0,0,0.08) !important;
        background: #fff !important;
        padding: 14px !important;
        overflow: hidden !important;
    }
    .ilj-link-preview .ilj-link-preview-featured-image {
        grid-column: 1 !important;
        grid-row: 1 / -1 !important;
        width: 100px !important;
        height: 100px !important;
        object-fit: cover !important;
        border-radius: 6px !important;
        align-self: start !important;
        margin: 0 !important;
    }
    .ilj-link-preview .ilj-link-preview-title {
        grid-column: 2 !important;
        grid-row: 1 !important;
        display: block !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        line-height: 1.35 !important;
        color: #1a1a1a !important;
        margin: 0 0 6px 0 !important;
    }
    .ilj-link-preview .ilj-link-preview-excerpt {
        grid-column: 2 !important;
        grid-row: 2 !important;
        font-size: 13px !important;
        line-height: 1.5 !important;
        color: #555 !important;
        text-align: left !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 4 !important;
        -webkit-box-orient: vertical !important;
    }
    

/* Die Flaeche waechst nur noch mit ihrem Inhalt. min-height:0 ist noetig, weil ein
   Flex-Element sonst nicht unter seine Inhaltsgroesse schrumpfen darf - bei langen
   Gespraechen wuerde es sonst das Panel sprengen statt zu rollen. */
#stmJmPanel #stmJmMsgs {
	flex: 0 1 auto;
	min-height: 0;
}

/* Den frei gewordenen Platz uebernimmt der Chip-Block. Das haelt einerseits die
   Eingabezeile am Panelboden und vermeidet andererseits eine sichtbare Kante: Nachrichten
   und Chips liegen auf #f7f8fb, das Panel selbst ist weiss - ohne diese Regel endete das
   Grau mitten im Fenster. align-content haelt die Chip-Zeilen dabei oben. */
#stmJmPanel #stmJmChips {
	flex: 1 1 auto;
	align-content: flex-start;
	border-top: 0;
	padding-top: 4px;
}

/* Ueberschrift ueber den Fragen, in Oles Sprache. Bewusst als ::before am Container:
   renderChips() setzt bei jedem Rendern chipsEl.innerHTML = '' - ein echtes Kind waere
   sofort wieder weg. :not(:empty) sorgt dafuer, dass die Zeile verschwindet, sobald
   keine Fragen mehr offen sind (geklickte Chips werden nicht neu eingehaengt). */
/* Umlaute stehen hier direkt als UTF-8. CSS-Escapes waeren eine Falle: "\00fc\00fcd"
   frisst das d, weil es ein gueltiges Hex-Zeichen ist und die Sequenz verlaengert -
   auf dem Schirm stand "L�OK" statt "Lueued ok". */
#stmJmPanel #stmJmChips:not(:empty)::before {
	content: "Dat fraagt de Lüüd ümmer weer";
	flex: 0 0 100%;
	margin: 2px 0 8px;
	font-size: 12.5px;
	font-weight: 600;
	color: #7c8794;
	line-height: 1.35;
}

/* Der GTranslate-Proxy uebersetzt nur DOM-Text, kein CSS-content. Fuer die englische
   Fassung der Seite deshalb eine eigene Zeile - html[lang="en"] setzt der Proxy selbst. */
html[lang="en"] #stmJmPanel #stmJmChips:not(:empty)::before {
	content: "Folks round here often ask this";
}


#stmJmSatz{display:none}
@media (max-width:767px), (max-height:480px) and (hover:none){
  html body #stmJmBtn{
    top:auto!important;left:0!important;right:0!important;margin:0 auto!important;
    bottom:var(--stm-ole-unten, calc(15px + env(safe-area-inset-bottom, 0px)))!important;
    transform:none!important;width:max-content!important;max-width:calc(100vw - 132px)!important;
    height:44px!important;min-height:0!important;box-sizing:border-box!important;
    flex-direction:row!important;align-items:center!important;gap:8px!important;
    padding:0 14px 0 8px!important;
    background:#061B90!important;border:1px solid rgba(255,255,255,.2)!important;border-radius:12px!important;
    box-shadow:0 10px 26px -12px rgba(0,12,66,.65)!important;
    transition:bottom .2s ease!important;
  }
  /* unsichtbar, bis das Footer-Skript den Satz eingehaengt hat (sonst Sprung um die halbe Breite) */
  html body #stmJmBtn:not(.stm-ole-mobil-bereit){visibility:hidden!important}
  html body #stmJmBtn:hover,html body #stmJmBtn:active{transform:none!important}
  html body #stmJmBtn .stm-jm-lh{margin:0!important;flex:none}
  html body #stmJmBtn .stm-jm-lh svg{width:16px!important;height:22px!important}
  html body #stmJmBtn .stm-jm-ava{width:32px!important;height:32px!important;border-width:1.5px!important}
  html body #stmJmBtn .stm-jm-ava svg{width:24px!important;height:24px!important}
  html body #stmJmBtn .stm-jm-tx,html body #stmJmBtn .stm-jm-dot{display:none!important}
  html body #stmJmBtn .stm-jm-satz{display:flex;flex-direction:column;align-items:flex-start;min-width:0;
    text-align:left;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    letter-spacing:0;text-transform:none}
  html body #stmJmBtn .stm-jm-satz b{display:block;font-size:13px;line-height:16px;font-weight:700;color:#fff;white-space:nowrap}
  html body #stmJmBtn .stm-jm-satz span{display:block;max-width:100%;font-size:12px;line-height:15px;font-weight:500;
    color:rgba(255,255,255,.8);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* Die allgemeine Grussblase entfaellt mobil - der Satz in der Leiste uebernimmt ihre Aufgabe.
     Die Ankunftsblase nach einer Push-Mitteilung (stm-ole-push-angebot.php) bleibt: sie traegt
     echten Kontext ("Sie folgen meiner Meldung ...") und steht jetzt ueber der Leiste. */
  html body #stmJmGreet:not([data-stm-ankunft]){display:none!important}
  html body #stmJmGreet[data-stm-ankunft]{top:auto!important;left:16px!important;right:16px!important;
    margin:0 auto!important;max-width:360px!important;transform:none!important;border-radius:12px!important;
    bottom:calc(var(--stm-ole-unten, calc(15px + env(safe-area-inset-bottom, 0px))) + 54px)!important}
}
@media (max-width:350px){
  html body #stmJmBtn .stm-jm-satz span{display:none}
}


    /* Drop-Cap auf allen WooCommerce-Seiten komplett deaktivieren */
    body.woocommerce p::first-letter,
    body.woocommerce-page p::first-letter,
    body.woocommerce h1::first-letter,
    body.woocommerce h2::first-letter,
    body.woocommerce h3::first-letter,
    body.woocommerce h4::first-letter,
    body.woocommerce-page h1::first-letter,
    body.woocommerce-page h2::first-letter,
    body.woocommerce-page h3::first-letter,
    body.woocommerce-page h4::first-letter,
    .woocommerce p::first-letter,
    .woocommerce h2::first-letter,
    .woocommerce h3::first-letter,
    .woocommerce .product p::first-letter,
    .woocommerce .product_title::first-letter,
    .woocommerce ul.products li.product p::first-letter,
    .woocommerce ul.products li.product h2::first-letter,
    .woocommerce ul.products li.product h3::first-letter,
    .woocommerce ul.products li.product a h2::first-letter,
    .woocommerce ul.products li.product .woocommerce-loop-product__title::first-letter,
    .woocommerce .woocommerce-product-details__short-description p::first-letter,
    .woocommerce-product-desc::first-letter,
    .products .woocommerce-product-desc::first-letter,
    .woocommerce .entry-content p::first-letter,
    .woocommerce-page .entry-content p::first-letter {
        font-size: inherit !important;
        float: none !important;
        line-height: inherit !important;
        margin: 0 !important;
        padding: 0 !important;
        font-weight: inherit !important;
        color: inherit !important;
        initial-letter: normal !important;
        -webkit-initial-letter: normal !important;
        text-transform: inherit !important;
    }

    /* Produkttitel in Shop/Kategorie-Übersicht: IMMER vollständig anzeigen */
    .woocommerce ul.products li.product .woocommerce-loop-product__title,
    .woocommerce ul.products li.product h2,
    .woocommerce ul.products li.product a h2,
    .woocommerce ul.products li.product .woocommerce-loop-product__title a,
    ul.products li.product .woocommerce-loop-product__title,
    .dt-css-grid .woocommerce-loop-product__title,
    .dt-css-grid .product-title,
    .wc-block-grid__product-title {
        display: block !important;
        -webkit-line-clamp: unset !important;
        -webkit-box-orient: unset !important;
        overflow: visible !important;
        text-overflow: unset !important;
        white-space: normal !important;
        max-height: none !important;
        height: auto !important;
    }
    

.dt-btn:not(.btn-light):not(.light-bg-btn):not(.outline-btn):not(.outline-bg-btn):not(.btn-custom-style), .give-btn.give-btn-reveal, .give-submit.give-btn, .mec-event-footer .mec-booking-button {
    background: #f65600;
    background: -webkit-linear-gradient();
    background: linear-gradient();
    display: none;
}
.product .summary.entry-summary .price, .product-category .woo-content-container > a h3, .product-category .woocom-list-content > a h3, #customer_login h2 {
  font: var(--the7-h1-font);
  text-transform: var(--the7-h4-text-transform);
}



.stm-vwd-kasten {
    margin: 20px 0;
    padding: 16px 20px;
    background: #f8fafc;
    border: 1px solid #e8ecf3;
    border-radius: 12px;
}
.stm-vwd-kasten p { margin: 0 0 12px; font-size: 13.5px; line-height: 1.6; color: #5b6474; }
.stm-vwd-kasten--laeuft p { margin: 0; }
a.button.stm-vwd-knopf,
.woocommerce-orders-table a.button.stm-vwd {
    background: transparent !important;
    border: 1.5px solid #C24400 !important;
    color: #C24400 !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
}
a.button.stm-vwd-knopf:hover,
.woocommerce-orders-table a.button.stm-vwd:hover {
    background: #C24400 !important;
    color: #fff !important;
}
/* ---- Formularseite /vertrag-widerrufen/: Gestaltung im Stil der
        uebrigen Rechtsseiten (Karten, Navy/Orange, Kontaktkarte) ---- */
.stm-vwd-intro p {
    margin: 4px 0 26px;
    max-width: 880px;
    font-size: 15.5px;
    line-height: 1.7;
    color: #3c4658;
}
.stm-vwd-raster {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 26px;
    align-items: start;
    margin: 0 0 30px;
}
.stm-vwd-karte {
    background: #fff;
    border: 1px solid #e5e9f2;
    border-radius: 16px;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 14px 30px -24px rgba(16, 24, 40, .5);
}
.stm-vwd-formkarte { padding: 28px 32px 32px; border-top: 3px solid #C24400; }
h2.stm-vwd-kartentitel { margin: 0 0 6px !important; padding: 0 !important; font-size: 20px !important; font-weight: 800 !important; color: #16265c !important; }
.stm-vwd-formhinweis { margin: 0 0 22px !important; font-size: 13px; line-height: 1.6; color: #7b8494; }
.stm-vwd-formlos { margin: 18px 0 0 !important; padding-top: 14px; border-top: 1px solid #eef1f6; font-size: 12.5px !important; line-height: 1.6; color: #7b8494; }
.stm-vwd-formlos a { color: #1B3A8C; font-weight: 600; }

/* Das OWB-Formular in der Karte: sauberes Raster statt Theme-Floats */
.order-withdrawal-request .eu-owb-form-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 18px;
}
.order-withdrawal-request .eu-owb-notice-wrapper,
.order-withdrawal-request .form-row-full,
.order-withdrawal-request .form-row-order,
.order-withdrawal-request .eu-owb-order-item-select-wrapper,
.order-withdrawal-request .order-supports-partial-withdrawal,
.order-withdrawal-request .order-withdrawal-delete-original-request-checkbox,
.order-withdrawal-request .clear { grid-column: 1 / -1; }
.order-withdrawal-request .form-row {
    float: none !important;
    width: 100% !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
}
.order-withdrawal-request label {
    display: block;
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 600;
    color: #16265c;
}
.order-withdrawal-request label.checkbox { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; color: #5b6474; }
.order-withdrawal-request .input-text,
.order-withdrawal-request select {
    width: 100%;
    padding: 12px 14px;
    border: 1.5px solid #dde1e7;
    border-radius: 8px;
    background: #fafbfc;
    font-size: 14px;
    color: #16265c;
}
.order-withdrawal-request .input-text:focus,
.order-withdrawal-request select:focus {
    outline: none;
    border-color: #1B3A8C;
    box-shadow: 0 0 0 3px rgba(27, 58, 140, .12);
    background: #fff;
}
.order-withdrawal-request .form-row-submit { margin: 6px 0 0 !important; grid-column: 1 / -1; }
.order-withdrawal-request button[type="submit"] {
    width: 100%;
    background: #C24400;
    border: 0;
    border-radius: 10px;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    padding: 15px 30px;
    cursor: pointer;
    transition: background-color .15s ease, box-shadow .15s ease;
    box-shadow: 0 10px 22px -12px rgba(194, 68, 0, .7);
}
.order-withdrawal-request button[type="submit"]:hover { background: #c24400; }
.order-withdrawal-request .woocommerce-error,
.order-withdrawal-request .woocommerce-message,
.order-withdrawal-request .notice { border-radius: 10px; font-size: 13px; }

/* Seitenleiste: Fakten + Kontakt */
.stm-vwd-fakten { padding: 20px 24px 16px; }
.stm-vwd-fakten h3, .stm-vwd-kontakt h3 { margin: 0 0 10px !important; padding: 0 !important; font-size: 15px !important; font-weight: 800 !important; }
.stm-vwd-fakten h3 { color: #16265c !important; }
.stm-vwd-fakt { display: flex; justify-content: space-between; gap: 14px; padding: 9px 0; border-bottom: 1px solid #eef1f6; font-size: 12.8px; }
.stm-vwd-fakt:last-of-type { border-bottom: 0; }
.stm-vwd-fakt span { color: #7b8494; }
.stm-vwd-fakt strong { color: #C24400; font-weight: 700; text-align: right; white-space: nowrap; }
.stm-vwd-mehr { margin: 8px 0 2px !important; font-size: 12.8px !important; }
.stm-vwd-mehr a { color: #1B3A8C; font-weight: 600; text-decoration: none; }
.stm-vwd-mehr a:hover { text-decoration: underline; text-underline-offset: 2px; }
.stm-vwd-kontakt {
    margin-top: 20px;
    padding: 20px 24px;
    border: 0;
    background: linear-gradient(135deg, #0A1E8F, #061B90 55%, #1B3A8C);
    color: #fff;
}
.stm-vwd-kontakt h3 { color: #FF8A3C !important; }
.stm-vwd-kontakt p { display: flex; flex-direction: column; margin: 0 0 12px !important; font-size: 13.5px; line-height: 1.45; color: #fff; }
.stm-vwd-kontakt p:last-child { margin-bottom: 2px !important; }
.stm-vwd-kontakt p span { font-size: 10.5px; text-transform: uppercase; letter-spacing: .07em; color: rgba(255, 255, 255, .6); margin-bottom: 2px; }
.stm-vwd-kontakt a { color: #fff !important; font-weight: 600; text-decoration: none; }
.stm-vwd-kontakt a:hover { color: #FF8A3C !important; }

/* Drei Schritte unterm Raster */
.stm-vwd-schritte { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 0 0 14px; }
.stm-vwd-schritt { background: #f8fafc; border: 1px solid #e8ecf3; border-radius: 14px; padding: 18px 20px; }
.stm-vwd-nr {
    display: inline-flex;
    width: 28px;
    height: 28px;
    align-items: center;
    justify-content: center;
    background: #16265c;
    color: #fff;
    border-radius: 50%;
    font-weight: 800;
    font-size: 13px;
    margin-bottom: 9px;
}
.stm-vwd-schritt strong { display: block; margin: 0 0 4px; font-size: 13.5px; color: #16265c; }
.stm-vwd-schritt p { margin: 0 !important; font-size: 12.5px !important; line-height: 1.6; color: #5b6474; }

@media (max-width: 980px) {
    .stm-vwd-raster { grid-template-columns: 1fr; }
    .stm-vwd-schritte { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .stm-vwd-formkarte { padding: 22px 18px 24px; }
    .order-withdrawal-request .eu-owb-form-fields { grid-template-columns: 1fr; }
}

/* Das Rechtsformular ist kein Diskussionsort - die Bestands-Kommentarbox
   rendert trotz comment_status=closed (eigenes Kommentarsystem im Theme). */
#comments.comments-section { display: none !important; }


body .page-title.solid-bg:has(.page-title-head),
body .page-title.solid-bg.bg-img-enabled:has(.page-title-head) {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	background-color: #001C93;
	background-image:
		radial-gradient(75% 120% at 50% -20%, rgba(194, 68, 0, .22) 0%, rgba(194, 68, 0, 0) 62%),
		linear-gradient(180deg, #001C93 0%, #000C42 100%);
	background-repeat: no-repeat, no-repeat;
	background-position: 0 0, 0 0;
	background-size: cover, cover;
}

/* Gitternetz, nach aussen ausgeblendet - traegt die Anmutung von Shop-Systemen
   und Schnittstellen, ohne den Titel zu stoeren. */
body .page-title.solid-bg:has(.page-title-head)::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px);
	background-size: 46px 46px;
	-webkit-mask-image: radial-gradient(85% 110% at 50% 40%, #000 25%, transparent 78%);
	        mask-image: radial-gradient(85% 110% at 50% 40%, #000 25%, transparent 78%);
}

/* Signaturkante: nimmt das CI-Orange auf und trennt den Kopf sauber vom Inhalt. */
body .page-title.solid-bg:has(.page-title-head)::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 3px;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient(90deg, #C24400 0%, #ff9a5c 38%, rgba(255, 154, 92, 0) 78%);
}

/* Titel ueber die Ebenen heben (das Gitter liegt bei z-index 1). */
body .page-title.solid-bg:has(.page-title-head) > .wf-wrap {
	position: relative;
	z-index: 3;
}

body .page-title.solid-bg:has(.page-title-head) h1 {
	text-wrap: balance;
	letter-spacing: -.015em;
}

@media (max-width: 768px) {
	/* Auf schmalen Schirmen ein feineres Raster, sonst wirken die Zellen grob. */
	body .page-title.solid-bg:has(.page-title-head)::before {
		background-size: 32px 32px;
	}
}

/* ---------------------------------------------------------------------------
   Typografie im Inhalt derselben Seiten.

   Die The7-Theme-Option setzt SITE-WEIT h2 { font: 400 24px/31px … !important }
   und h2::first-letter { font-size: 54px; color: #C24400 }. Auf Seiten mit eigenem
   Template faellt das nicht auf - dort bringen die Templates eigene Groessen mit.
   Auf den rund 28 Seiten mit Standardkopf (Rechtstexte, /docs/, ERP-Seiten) trifft es
   dagegen jede Zwischenueberschrift: gemessen H2 24 px neben H3 19 px - die Hierarchie
   war praktisch eingeebnet, dazu ein 54-px-Anfangsbuchstabe in Orange.

   Startseite und /kontakt/ haben dafuer laengst eigene Reset-Bloecke; das hier ist
   dieselbe Handbewegung fuer den Rest. Anker ist wieder .page-title-head, damit
   ausschliesslich Seiten ohne eigenes Template betroffen sind.

   !important ist unvermeidbar: die Theme-Regeln tragen es selbst.
   --------------------------------------------------------------------------- */

body:has(.page-title-head) #content h1::first-letter,
body:has(.page-title-head) #content h2::first-letter,
body:has(.page-title-head) #content h3::first-letter,
body:has(.page-title-head) #content h4::first-letter,
body:has(.page-title-head) #content h5::first-letter,
body:has(.page-title-head) #content h6::first-letter {
	font: inherit !important;
	color: inherit !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	line-height: inherit !important;
	text-transform: none !important;
	-webkit-initial-letter: normal !important;
	        initial-letter: normal !important;
}

/* Wieder eine erkennbare Staffel: 30 / 22 / 19 px statt 24 / 19 / 19. */
body:has(.page-title-head) #content h2 {
	font-size: 1.875rem !important;
	line-height: 1.25 !important;
	margin-top: 2.4rem !important;
	margin-bottom: .7rem !important;
}

body:has(.page-title-head) #content h3 {
	font-size: 1.375rem !important;
	line-height: 1.3 !important;
	margin-top: 1.8rem !important;
	margin-bottom: .5rem !important;
}

body:has(.page-title-head) #content h4 {
	font-size: 1.1875rem !important;
	line-height: 1.35 !important;
	margin-top: 1.4rem !important;
	margin-bottom: .4rem !important;
}

@media (max-width: 768px) {
	body:has(.page-title-head) #content h2 {
		font-size: 1.5rem !important;
		margin-top: 1.8rem !important;
	}

	body:has(.page-title-head) #content h3 {
		font-size: 1.25rem !important;
	}
}


    /* ============================================
       SELF-HOSTED FONTS – Space Grotesk + Inter
       Kein Google Fonts Call, DSGVO-konform
       ============================================ */

    /* Space Grotesk – Überschriften (Variable Font, 500-700) */
    @font-face {
        font-family: 'Space Grotesk';
        font-style: normal;
        font-weight: 500 700;
        font-display: swap;
        src: url('/wp-content/themes/storetown/fonts/space-grotesk-latin-ext.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;
    }
    @font-face {
        font-family: 'Space Grotesk';
        font-style: normal;
        font-weight: 500 700;
        font-display: swap;
        src: url('/wp-content/themes/storetown/fonts/space-grotesk-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;
    }

    /* Inter – Fließtext (Variable Font, 400-700) */
    @font-face {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400 700;
        font-display: swap;
        src: url('/wp-content/themes/storetown/fonts/inter-latin-ext.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;
    }
    @font-face {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400 700;
        font-display: swap;
        src: url('/wp-content/themes/storetown/fonts/inter-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;
    }

    /* ============================================
       GLOBALE TYPOGRAFIE
       !important nötig, da Parent-Theme (Flavor)
       und custom.css Cambay mit !important setzen
       ============================================ */

    /* === FONT-FAMILY: Global (ohne Farbe/Größe!) === */
    body,
    p,
    li,
    td,
    th,
    label,
    input,
    textarea,
    select {
        font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
    }

    /* Überschriften: Space Grotesk (global) */
    h1, h2, h3, h4, h5, h6,
    .entry-title,
    .entry_title,
    .post-title,
    .page-title,
    .widget-title,
    .storetown-section-title,
    .storetown-blog-title a,
    .content h1, .content h2, .content h3,
    .content h4, .content h5, .content h6,
    h1.entry_title, h2.entry_title,
    .dt-accordion h2,
    .wpb_accordion_header > a,
    .entry_title.h2-size,
    .h1-size, .h2-size, .h3-size,
    .h4-size, .h5-size, .h6-size {
        font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        letter-spacing: -0.02em !important;
    }

    /* Semi-Bold für H3-H6 */
    h3, h4, h5, h6,
    .content h3, .content h4, .content h5, .content h6,
    .h3-size, .h4-size, .h5-size, .h6-size {
        font-weight: 600 !important;
    }

    /* Navigation & UI: Inter Medium */
    nav a,
    .menu a,
    .main-nav a,
    .dt-mobile-menu-icon,
    button,
    .btn,
    .button,
    .storetown-blog-link {
        font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
        font-weight: 500 !important;
    }

    /* Fallback font-display */
    @font-face { font-display: swap !important; }

    /* ============================================
       MAGAZIN-STYLE – NUR im Content-Bereich
       Betrifft nicht Header, Navigation, Footer
       ============================================ */

    /* === AUSSCHLUSS: Related Posts, Sidebar, Navigation ===
       .post-content innerhalb von .single-related-posts NICHT stylen */

    /* === BREITERER CONTENT-BEREICH auf Blog-Posts ===
       STM-CAPTION-RASTER-V1 (22.09.2026): minmax(0, 1fr) statt 1fr - das ist kein
       Schoenheitsfehler, sondern die Absicherung des ganzen Rasters.
       Ein blosses 1fr ist implizit minmax(AUTO, 1fr), und dieses auto-Minimum ist die
       Mindestbreite des Inhalts. Ein einziges zu breites Element zieht die Textspalte
       damit auf, und weil die Sidebar mit festen 320 px danebensteht, wird sie aus dem
       Fenster geschoben - sie wird nicht umgebrochen, sondern abgeschnitten.
       Genau das ist passiert: WordPress rendert aus [caption width="1200"] ein
       <div class="wp-caption" style="width: 1210px">. Das mitgelieferte max-width:100%
       rettet das NICHT, weil Prozentwerte bei der Mindestbreiten-Rechnung unbestimmt
       sind und dort nicht greifen. Gemessen bei 1900 px Fenster: Spur 1240 statt
       993 px, rechte Kante der Sidebar bei x=1920 - 20 px ausserhalb des Fensters.
       Betroffen war genau 1 von 143 Beitraegen (57605; alle anderen Unterschriften
       liegen bei 466-524 px) - die Schwaeche des Rasters galt aber fuer alle.
       Mit minmax(0, 1fr) faellt das auto-Minimum weg: die Spalte bleibt bei 993 px,
       max-width:100% klemmt die Unterschrift auf die Spaltenbreite, und KEIN Inhalt
       (Tabelle, Codeblock, iframe, Bild) kann die Sidebar je wieder hinausschieben.
       Geprueft: die schmalen Unterschriften der uebrigen Beitraege bleiben unveraendert
       bei 398/524 px - deshalb steht hier bewusst KEINE eigene wp-caption-Regel. */
    body.single-post .wf-container-main {
        max-width: 1380px !important;
        width: 1380px !important;
        grid-template-columns: minmax(0, 1fr) 320px !important;
        /* STM-MITTE-V1 (22.09.2026): NICHT `margin: 0 auto`. Der Block ist mit
           1380 px breiter als der Innenraum seines Elternteils (.wf-wrap:
           1400 px minus 2x50 px Innenabstand = 1300 px). Bei negativem Restraum
           werden beide auto-Raender zu 0, und die vollen 80 px Differenz landen
           rechts - der Inhalt sass dadurch 80 px zu weit rechts (gemessen bei
           1900 px: linker Rand 293, rechter 212). Die Prozentangabe rechnet
           gegen die Elternbreite: (1300 - 1380) / 2 = -40 px je Seite, also
           gleichmaessig verteilt - und bleibt richtig, falls .wf-wrap je
           eine andere Breite bekommt. Unter 1461 px passt die Breite wieder
           in den Elternteil, dort gilt weiter `auto` (siehe Media Query). */
        margin: 0 calc((100% - 1380px) / 2) !important;
    }
    @media (max-width: 1460px) {
        body.single-post .wf-container-main {
            max-width: calc(100% - 80px) !important;
            width: calc(100% - 80px) !important;
            /* Hier passt der Block in den Elternteil - `auto` zentriert korrekt,
               der calc-Wert von oben waere falsch. Gilt auch unter 1024 px. */
            margin: 0 auto !important;
        }
    }
    @media (max-width: 989px) { /* STM-SPALTE-990-V1: war 1024px, The7-Raster beginnt bei 990 px */
        body.single-post .wf-container-main {
            grid-template-columns: minmax(0, 1fr) !important;
            width: 100% !important;
            max-width: 100% !important;
        }
    }

    /* === MAGAZIN: Content-Spalte als "Seite" hervorheben === */
    body.single-post .entry-content,
    body.single-post article.single-postlike > .post-content {
        padding-right: 30px !important;
    }

    /* Motto/Farewell-Text unter der Autorenbox — eleganter */
    body.single-post .premium-author-box + p[style*="italic"],
    body.single-post .premium-author-box + p > em {
        font-size: 14px !important;
        color: #888 !important;
    }

    /* Post-Navigation (Zurück/Nächstes) ausblenden */
    nav.navigation.post-navigation {
        display: none !important;
    }

    /* Fließtext im Content — Magazin-Typografie */
    .entry-content,
    .entry-content p,
    .entry-content li,
    .entry-content td,
    .entry-content th,
    /* ⚠️ Kein nacktes `span` mehr (10.09.2026, Jans Auftrag): `.entry-content span`
       traf JEDEN Span im Inhalt - auch den Text in Knoepfen und eingebetteten
       Bausteinen. Mit dem !important dieser Regel brach das deren Vererbung;
       der Knopftext des SEO-Werkzeugs stand dadurch auf 1,1:1. Spans nur noch
       in echten Textelementen: der Fliesstext behaelt seine Typografie, die
       Bausteine bekommen ihre eigene Gestaltung zurueck. */
    .entry-content p span,
    .entry-content li span,
    .entry-content td span,
    .entry-content th span,
    .entry-content h1 span,
    .entry-content h2 span,
    .entry-content h3 span,
    .entry-content h4 span,
    .entry-content blockquote span,
    article.single-postlike > .post-content,
    article.single-postlike > .post-content p,
    #content > .content p,
    #content > .content li,
    #content > .content p span,
    #content > .content li span {
        color: #2d2d2d !important;
        font-size: 18px !important;
        line-height: 1.85 !important;
        letter-spacing: -0.01em !important;
    }

    /* Absatzabstand — mehr Luft wie in Print-Magazinen */
    .entry-content p,
    article.single-postlike > .post-content p,
    #content > .content p {
        margin-bottom: 1.6em !important;
    }

    /* Lead / Intro – Erster Absatz größer + leicht abgesetzt */
    .entry-content > p:first-of-type,
    article.single-postlike > .post-content > p:first-of-type {
        font-size: 20px !important;
        line-height: 1.75 !important;
        color: #1a1a1a !important;
        font-weight: 400 !important;
    }

    /* === DROP CAP — Magazin-Initiale (per JS-Klasse gesetzt) === */
    .stm-drop-cap::first-letter {
        float: left !important;
        font-size: 4.2em !important;
        line-height: 0.8 !important;
        font-weight: 700 !important;
        color: #C24400 !important;
        margin: 0.05em 0.12em 0 0 !important;
        padding: 0 !important;
        font-family: Georgia, 'Times New Roman', serif !important;
    }

    /* Video/Embed im Content – max. Breite begrenzen */
    .entry-content .wp-video,
    .entry-content video,
    .entry-content .mejs-container,
    .entry-content iframe,
    .entry-content embed,
    .entry-content object {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
    }
    .entry-content video {
        max-width: 100% !important;
        height: auto !important;
    }

    /* Überschriften im Content – Farbe */
    .entry-content h1, .entry-content h2,
    .entry-content h3, .entry-content h4,
    .entry-content h5, .entry-content h6,
    #content > .content h1, #content > .content h2,
    #content > .content h3, #content > .content h4 {
        color: #1a1a1a !important;
    }

    /* H2 im Content – Premium-Magazin-Überschrift
       Keine Trennlinien, keine Striche oben. Sektions-Trennung rein über Weißraum.
       Der orange Akzent-Strich ::after unter der H2 bleibt als einziges Designelement. */
    .entry-content h2,
    article.single-postlike > .post-content h2,
    #content > .content h2 {
        margin-top: 2.8em !important;
        margin-bottom: 0.7em !important;
        padding-top: 0 !important;
        padding-bottom: 0.4em !important;
        border: none !important;
        display: block !important;
        position: relative !important;
        font-size: 1.6em !important;
        font-weight: 700 !important;
        letter-spacing: -0.02em !important;
        color: #1a1a1a !important;
        overflow: hidden !important;
    }
    .entry-content h2::after,
    article.single-postlike > .post-content h2::after,
    #content > .content h2::after {
        content: '' !important;
        display: block !important;
        width: 50px !important;
        height: 3px !important;
        background: #C24400 !important;
        margin-top: 0.35em !important;
        border-radius: 2px !important;
    }

    /* H3 im Content – blaue Linie links */
    .entry-content h3,
    article.single-postlike > .post-content h3,
    #content > .content h3 {
        margin-top: 2em !important;
        margin-bottom: 0.6em !important;
        padding-left: 14px !important;
        border-left: 4px solid #001889 !important;
        color: #001889 !important;
    }

    /* === FAQ-Sektion: Überschriften als Fließtext ohne Akzent-Linien === */
    /* H2 in FAQ – kein oranger Strich, weniger Abstand */
    [class*="faq-"][class*="-section"] h2 {
        margin-top: 0 !important;
        margin-bottom: 0.4em !important;
        padding-bottom: 0 !important;
        border-bottom: none !important;
        font-size: 1.4em !important;
    }
    [class*="faq-"][class*="-section"] h2::after {
        display: none !important;
    }
    /* H3 in FAQ-Items – kein blauer Strich links, kompakter Fließtext-Stil */
    [class*="faq-"][class*="-item"] h3 {
        margin-top: 0 !important;
        margin-bottom: 0.3em !important;
        padding-left: 0 !important;
        border-left: none !important;
        color: #1a1a1a !important;
        font-size: 1.1em !important;
        font-weight: 600 !important;
    }

    /* Strong/Bold im Content */
    .entry-content strong,
    .entry-content b,
    article.single-postlike > .post-content strong,
    article.single-postlike > .post-content b,
    #content > .content strong,
    #content > .content b {
        font-weight: 650 !important;
        color: #1a1a1a !important;
    }

    /* Links im Content – Magazin-Style (NICHT in Related Posts) */
    .entry-content a:not(.btn):not(.button),
    article.single-postlike > .post-content a:not(.btn):not(.button),
    #content > .content a:not(.btn):not(.button) {
        color: #C24400 !important;
        text-decoration: underline !important;
        text-decoration-color: rgba(194, 68, 0, 0.3) !important;
        text-underline-offset: 3px !important;
        text-decoration-thickness: 2px !important;
        transition: all 0.2s ease !important;
    }
    .entry-content a:not(.btn):not(.button):hover,
    article.single-postlike > .post-content a:not(.btn):not(.button):hover,
    #content > .content a:not(.btn):not(.button):hover {
        color: #001889 !important;
        text-decoration-color: #001889 !important;
    }

    /* Listen im Content */
    .entry-content ul li,
    .entry-content ol li,
    article.single-postlike > .post-content ul li,
    article.single-postlike > .post-content ol li {
        margin-bottom: 0.5em !important;
        padding-left: 0.3em !important;
    }

    /* Blockquote – Magazin-Zitat */
    .entry-content blockquote,
    article.single-postlike > .post-content blockquote {
        border-left: 4px solid #C24400 !important;
        background: linear-gradient(135deg, rgba(0, 24, 137, 0.03) 0%, rgba(194, 68, 0, 0.03) 100%) !important;
        padding: 1.5em 2em !important;
        margin: 2em 0 !important;
        border-radius: 0 12px 12px 0 !important;
        font-size: 18px !important;
        font-style: italic !important;
        color: #1a1a1a !important;
        line-height: 1.7 !important;
    }

    /* === BILDER IM CONTENT – Magazin-Integration === */

    /* Alle Bilder im Content — elegante Magazin-Einbettung */
    .entry-content img,
    article.single-postlike > .post-content img,
    #content > .content img {
        border-radius: 10px !important;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
        margin-top: 1.5em !important;
        margin-bottom: 0.5em !important;
        transition: box-shadow 0.4s ease !important;
    }

    /* Hover — dezent, kein Verschieben */
    .entry-content img:hover,
    article.single-postlike > .post-content img:hover,
    #content > .content img:hover {
        box-shadow: 0 6px 28px rgba(0, 0, 0, 0.12) !important;
    }

    /* WordPress Bild-Captions (wp-caption / wp-block-image) */
    .entry-content .wp-caption,
    .entry-content figure.wp-block-image,
    .entry-content figure,
    article.single-postlike > .post-content .wp-caption,
    article.single-postlike > .post-content figure,
    #content > .content .wp-caption,
    #content > .content figure {
        background: linear-gradient(135deg, #f8f9fa 0%, #f0f1f3 100%) !important;
        border-radius: 14px !important;
        padding: 12px 12px 8px 12px !important;
        margin: 2em auto !important;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
        border: 1px solid rgba(0, 24, 137, 0.06) !important;
        transition: box-shadow 0.3s ease, transform 0.3s ease !important;
        max-width: 100% !important;
    }

    /* Hover auf Figure-Container */
    .entry-content figure:hover,
    article.single-postlike > .post-content figure:hover,
    #content > .content figure:hover,
    .entry-content .wp-caption:hover,
    article.single-postlike > .post-content .wp-caption:hover {
        box-shadow: 0 6px 24px rgba(0, 0, 0, 0.1) !important;
    }

    /* Bild innerhalb Figure – kein doppelter Shadow */
    .entry-content figure img,
    .entry-content .wp-caption img,
    article.single-postlike > .post-content figure img,
    article.single-postlike > .post-content .wp-caption img,
    #content > .content figure img,
    #content > .content .wp-caption img {
        box-shadow: none !important;
        border-radius: 8px !important;
        margin: 0 !important;
        width: 100% !important;
        height: auto !important;
        display: block !important;
    }

    /* Bildunterschrift – Caption */
    .entry-content figcaption,
    .entry-content .wp-caption-text,
    article.single-postlike > .post-content figcaption,
    article.single-postlike > .post-content .wp-caption-text,
    #content > .content figcaption,
    #content > .content .wp-caption-text {
        font-size: 13px !important;
        color: #6b7280 !important;
        font-style: italic !important;
        text-align: center !important;
        padding: 10px 8px 4px 8px !important;
        margin: 0 !important;
        line-height: 1.5 !important;
        letter-spacing: 0 !important;
        border-top: 1px solid rgba(0, 24, 137, 0.08) !important;
        margin-top: 8px !important;
    }

    /* === MAGAZIN-FLOAT: Bilder mit Text umfließen === */

    /* Bilder ohne Ausrichtung (alignnone) oder in figure –
       automatisch links floaten mit Text rechts daneben */
    .entry-content .alignnone:not(.wp-block-image.is-style-default),
    .entry-content figure.alignnone,
    .entry-content .wp-caption.alignnone,
    article.single-postlike > .post-content .alignnone,
    article.single-postlike > .post-content figure.alignnone,
    #content > .content .alignnone,
    #content > .content figure.alignnone {
        float: left !important;
        max-width: 35% !important;
        margin: 0.5em 2em 1.5em 0 !important;
        clear: left !important;
    }

    /* Gerade Bilder (2., 4., 6. ...) rechts floaten für Abwechslung */
    .entry-content figure.alignnone:nth-of-type(even),
    .entry-content .wp-caption.alignnone:nth-of-type(even),
    article.single-postlike > .post-content figure.alignnone:nth-of-type(even),
    #content > .content figure.alignnone:nth-of-type(even) {
        float: right !important;
        margin: 0.5em 0 1.5em 2em !important;
        clear: right !important;
    }

    /* Explizit links ausgerichtet */
    .entry-content .alignleft,
    article.single-postlike > .post-content .alignleft,
    #content > .content .alignleft {
        float: left !important;
        max-width: 35% !important;
        margin: 0.5em 2em 1.5em 0 !important;
        clear: left !important;
    }

    /* Explizit rechts ausgerichtet */
    .entry-content .alignright,
    article.single-postlike > .post-content .alignright,
    #content > .content .alignright {
        float: right !important;
        max-width: 35% !important;
        margin: 0.5em 0 1.5em 2em !important;
        clear: right !important;
    }

    /* Zentriert / volle Breite – NICHT floaten */
    .entry-content .aligncenter,
    .entry-content .alignfull,
    .entry-content .alignwide,
    .entry-content .wp-block-image.size-full,
    article.single-postlike > .post-content .aligncenter,
    article.single-postlike > .post-content .alignfull,
    #content > .content .aligncenter {
        float: none !important;
        max-width: 100% !important;
        margin: 2em auto !important;
        display: block !important;
        clear: both !important;
    }

    /* === Auto-Related Images: Teaser-Karten-Styling === */
    .stm-auto-related-image {
        background: #fff !important;
        border: 1px solid rgba(0, 24, 137, 0.08) !important;
        border-radius: 12px !important;
        padding: 0 !important;
        box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
        transition: transform 0.25s ease, box-shadow 0.25s ease !important;
        overflow: hidden !important;
    }
    .stm-auto-related-image:hover {
        transform: translateY(-3px) !important;
        box-shadow: 0 8px 24px rgba(0,0,0,0.12) !important;
    }
    .stm-auto-related-image img {
        border-radius: 0 !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        display: block !important;
    }
    .stm-teaser-body {
        padding: 10px 14px 12px !important;
    }
    .stm-teaser-label {
        display: inline-block !important;
        font-size: 0.7em !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.08em !important;
        color: #C24400 !important;
        margin-bottom: 4px !important;
    }
    .stm-teaser-title {
        display: block !important;
        font-size: 0.88em !important;
        font-weight: 600 !important;
        line-height: 1.35 !important;
        color: #1a1a1a !important;
    }
    .stm-auto-related-image:hover .stm-teaser-title {
        color: #C24400 !important;
    }

    /* Clearfix nach Überschriften – NUR wenn Bild NICHT direkt davor steht.
       Stattdessen per .clearfix-before Klasse manuell oder via full-width Elemente. */
    /* ENTFERNT: clear:both auf h2/h3 – das hat den Float nach Bildern sofort gekillt.
       Floats werden jetzt nur am Ende des Contents und bei aligncenter/alignfull aufgehoben. */

    /* Clearfix nach dem Content */
    .entry-content::after,
    article.single-postlike > .post-content::after,
    #content > .content::after {
        content: '' !important;
        display: table !important;
        clear: both !important;
    }

    /* Responsive: Auf Mobile kein Float – volle Breite */
    @media (max-width: 768px) {
        .entry-content .alignnone,
        .entry-content figure.alignnone,
        .entry-content .wp-caption.alignnone,
        .entry-content .alignleft,
        .entry-content .alignright,
        article.single-postlike > .post-content .alignnone,
        article.single-postlike > .post-content .alignleft,
        article.single-postlike > .post-content .alignright,
        #content > .content .alignnone,
        #content > .content .alignleft,
        #content > .content .alignright {
            float: none !important;
            max-width: 100% !important;
            margin: 1.5em 0 !important;
            clear: both !important;
        }
    }

    /* WP Gallery – Grid-Ansicht eleganter */
    .entry-content .gallery,
    article.single-postlike > .post-content .gallery {
        gap: 12px !important;
        margin: 2em 0 !important;
        clear: both !important;
    }
    .entry-content .gallery-item img,
    article.single-postlike > .post-content .gallery-item img {
        border-radius: 10px !important;
    }

    /* === SIDEBAR — Magazin-Stil: zurückgenommen, elegant ===
       Abstand und Trennlinie sitzen bewusst NICHT als padding/border an der
       Sidebar selbst. The7 schaltet die Sidebar am Seitenende per StickySidebar
       auf position:fixed und setzt left dabei auf die Rahmenkante des <aside>.
       padding-left und border-left zählen dann nicht mehr mit: der komplette
       Sidebar-Inhalt sprang 31 px nach links und beim Zurückscrollen wieder
       zurück — bei jedem Überfahren des Umschaltpunkts (gemessen 18.08.2026,
       Umschaltpunkt y≈13220 auf einem Einzelbeitrag).
       Als margin am Inhalt gilt der Abstand in BEIDEN Zuständen; die Linie
       zeichnet ein ::before, das nichts verschiebt. */
    body.single-post .wf-container-main > aside,
    body.single-post .wf-container-main > .sidebar,
    body.single-post #sidebar {
        padding-left: 0 !important;
        border-left: 0 !important;
        position: relative !important;
    }
    body.single-post .wf-container-main > aside::before,
    body.single-post .wf-container-main > .sidebar::before,
    body.single-post #sidebar::before {
        content: '' !important;
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        bottom: 0 !important;
        width: 1px !important;
        background: rgba(0, 0, 0, 0.06) !important;
        pointer-events: none !important;
    }
    body.single-post .wf-container-main > aside > .sidebar-content,
    body.single-post .wf-container-main > .sidebar > .sidebar-content,
    body.single-post #sidebar > .sidebar-content {
        margin-left: 31px !important;
    }
    body.single-post .wf-container-main > aside .widget,
    body.single-post .wf-container-main > .sidebar .widget,
    body.single-post #sidebar .widget {
        margin-bottom: 28px !important;
        padding-bottom: 24px !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
    }
    body.single-post .wf-container-main > aside .widget:last-child,
    body.single-post #sidebar .widget:last-child {
        border-bottom: none !important;
    }
    /* Widget-Titel in der Sidebar — dezenter */
    body.single-post .wf-container-main > aside .widget-title,
    body.single-post #sidebar .widget-title {
        font-size: 0.85em !important;
        text-transform: uppercase !important;
        letter-spacing: 0.08em !important;
        color: #C24400 !important;
        font-weight: 600 !important;
        margin-bottom: 12px !important;
        padding-bottom: 8px !important;
        border-bottom: 2px solid #C24400 !important;
        display: inline-block !important;
    }
    /* Sidebar-Text kleiner */
    body.single-post .wf-container-main > aside p,
    body.single-post .wf-container-main > aside li,
    body.single-post #sidebar p,
    body.single-post #sidebar li {
        font-size: 14px !important;
        line-height: 1.6 !important;
        color: #555 !important;
    }

    /* Der Knopf "Beiträge" im Autoren-Widget wird vollständig in
       inc/premium-authors-widget.php gestaltet (Neufassung 18.08.2026).
       Die frühere Regel stand hier mit !important und überschrieb Schriftgröße,
       Innenabstand und display der Neufassung — deshalb ist sie entfernt. */

    /* === NEUESTE KOMMENTARE WIDGET – eleganter Look === */
    .sidebar-content .widget.widget_acw_recent_comments .acw-comment-meta a:not(.elementor-button), .sidebar-content .widget.widget_acw_recent_comments .acw-comment-meta a:not(.elementor-button) * { display: inline-block !important; background: transparent !important; } /* Fix: The7-Custom-CSS .comment-meta a{display:none} versteckte alle Widget-Links */
    .widget_acw_recent_comments .acw-comments-list {
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .widget_acw_recent_comments .acw-comments-list li {
        display: flex !important;
        align-items: flex-start !important;
        gap: 12px !important;
        padding: 14px 0 !important;
        border-bottom: 1px solid rgba(0,0,0,0.06) !important;
    }
    .widget_acw_recent_comments .acw-comments-list li:last-child {
        border-bottom: none !important;
    }
    .widget_acw_recent_comments .acw-comment-avatar {
        flex-shrink: 0 !important;
    }
    .widget_acw_recent_comments .acw-comment-avatar img {
        width: 44px !important;
        height: 44px !important;
        border-radius: 50% !important;
        object-fit: cover !important;
    }
    .widget_acw_recent_comments .acw-comment-header {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: baseline !important;
        gap: 0 4px !important;
        font-size: 0.85em !important;
        line-height: 1.4 !important;
    }
    .widget_acw_recent_comments .acw-comment-author {
        font-weight: 700 !important;
        color: #1a1a1a !important;
    }
    .widget_acw_recent_comments .acw-comment-header .on {
        color: #999 !important;
        font-size: 0.9em !important;
    }
    .widget_acw_recent_comments a.acw-comment-link {
        color: #C24400 !important;
        text-decoration: none !important;
        font-weight: 500 !important;
        border-bottom: none !important;
    }
    .widget_acw_recent_comments a.acw-comment-link:hover {
        text-decoration: underline !important;
    }
    .widget_acw_recent_comments .acw-comment-content {
        font-size: 0.82em !important;
        color: #555 !important;
        line-height: 1.5 !important;
        margin-top: 4px !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 4 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }
    /* Emojis im Kommentar-Widget ausblenden */
    .widget_acw_recent_comments .acw-comment-content img.emoji {
        display: none !important;
    }

    /* === NEWSLETTER WIDGET – eleganter Redesign === */
    .widget_mailpoet_form .widget-title {
        color: #C24400 !important;
        font-size: 1.05em !important;
        font-weight: 700 !important;
        margin-bottom: 0.5em !important;
    }
    #mailpoet_form_1 .mailpoet_form_form {
        background: linear-gradient(135deg, #f8f9fb 0%, #f0f2f5 100%) !important;
        border: 1px solid rgba(0, 24, 137, 0.10) !important;
        border-radius: 12px !important;
        padding: 1.5em !important;
    }
    /* Intro-Text (Emoji-Zeile) dezenter */
    #mailpoet_form_1 .mailpoet_form_form > .mailpoet_form_paragraph:first-of-type {
        background: none !important;
        border-radius: 0 !important;
        padding: 0 0 0.8em 0 !important;
        margin: 0 !important;
        font-size: 0.9em !important;
        color: #555 !important;
        text-align: left !important;
        line-height: 1.5 !important;
    }
    /* Input-Felder */
    #mailpoet_form_1 .mailpoet_text {
        width: 100% !important;
        padding: 10px 14px !important;
        border: 1px solid #ddd !important;
        border-radius: 8px !important;
        font-size: 0.9em !important;
        background: #fff !important;
        color: #333 !important;
        transition: border-color 0.2s ease !important;
        box-sizing: border-box !important;
    }
    #mailpoet_form_1 .mailpoet_text:focus {
        border-color: #C24400 !important;
        outline: none !important;
        box-shadow: 0 0 0 3px rgba(194, 68, 0, 0.1) !important;
    }
    #mailpoet_form_1 .mailpoet_form_paragraph {
        margin: 0 0 0.6em 0 !important;
        padding: 0 !important;
        background: none !important;
    }
    /* Datenschutz-Checkbox-Bereich */
    #mailpoet_form_1 .mailpoet_form_form .mailpoet_paragraph.last {
        background: none !important;
        border-radius: 0 !important;
        padding: 0 !important;
        margin: 0.5em 0 !important;
        font-size: 0.8em !important;
        color: #777 !important;
    }
    /* Submit-Button */
    #mailpoet_form_1 .mailpoet_submit {
        width: 100% !important;
        padding: 12px 20px !important;
        background: #C24400 !important;
        color: #fff !important;
        border: none !important;
        border-radius: 8px !important;
        font-size: 0.95em !important;
        font-weight: 600 !important;
        cursor: pointer !important;
        transition: background 0.2s ease, transform 0.1s ease !important;
        letter-spacing: 0.02em !important;
    }
    #mailpoet_form_1 .mailpoet_submit:hover {
        background: #e04d00 !important;
        transform: translateY(-1px) !important;
    }
    /* Inline-Styles vom MailPoet-Editor überschreiben */
    #mailpoet_form_1 .mailpoet_form_form div,
    #mailpoet_form_1 .mailpoet_form_form p {
        background-color: transparent !important;
        color: #555 !important;
        text-align: left !important;
    }
    #mailpoet_form_1 .mailpoet_form_form p a {
        color: #C24400 !important;
        text-decoration: underline !important;
        font-weight: 600 !important;
        border-bottom: none !important;
    }

    /* === KONTAKTFORMULAR WIDGET (Quform) – eleganter Look === */
    #text-4 .widget-title {
        color: #C24400 !important;
        font-size: 1.05em !important;
        font-weight: 700 !important;
        margin-bottom: 0.3em !important;
        text-align: center !important;
    }
    #text-4 .textwidget {
        background: linear-gradient(135deg, #f8f9fb 0%, #f0f2f5 100%) !important;
        border: 1px solid rgba(0, 24, 137, 0.10) !important;
        border-radius: 12px !important;
        padding: 1.5em !important;
    }
    /* Intro-Text */
    #text-4 .textwidget > p:first-of-type {
        font-size: 0.88em !important;
        color: #555 !important;
        line-height: 1.6 !important;
        margin-bottom: 1em !important;
    }
    /* Datenschutz-Checkbox-Zeile */
    #text-4 .quform-element-checkbox,
    #text-4 [class*="privacy"],
    #text-4 label[for*="privacy"],
    #text-4 .textwidget > p:has(input[type="checkbox"]) {
        font-size: 0.78em !important;
        color: #888 !important;
        line-height: 1.4 !important;
        margin-bottom: 1em !important;
    }
    #text-4 [class*="privacy"] a,
    #text-4 label a {
        color: #C24400 !important;
        text-decoration: underline !important;
        font-weight: 600 !important;
        border-bottom: none !important;
    }
    /* Labels */
    #text-4 .quform-label,
    #text-4 .quform-element > label {
        font-size: 0.82em !important;
        font-weight: 600 !important;
        color: #333 !important;
        margin-bottom: 4px !important;
    }
    /* Input & Textarea */
    #text-4 .quform-field-text,
    #text-4 .quform-field-email,
    #text-4 .quform-field-textarea {
        width: 100% !important;
        padding: 10px 14px !important;
        border: 1px solid #ddd !important;
        border-radius: 8px !important;
        font-size: 0.9em !important;
        background: #fff !important;
        color: #333 !important;
        transition: border-color 0.2s ease !important;
        box-sizing: border-box !important;
    }
    #text-4 .quform-field-text:focus,
    #text-4 .quform-field-email:focus,
    #text-4 .quform-field-textarea:focus {
        border-color: #C24400 !important;
        outline: none !important;
        box-shadow: 0 0 0 3px rgba(194, 68, 0, 0.1) !important;
    }
    #text-4 .quform-field-textarea {
        min-height: 100px !important;
        resize: vertical !important;
    }
    /* Abstände zwischen Feldern */
    #text-4 .quform-element,
    #text-4 .quform-elements > .quform-element {
        margin-bottom: 0.8em !important;
    }
    /* Submit-Button */
    #text-4 .quform-submit,
    #text-4 .quform-submit-inner input[type="submit"],
    #text-4 .quform-submit-inner button {
        width: 100% !important;
        padding: 12px 20px !important;
        background: #C24400 !important;
        color: #fff !important;
        border: none !important;
        border-radius: 8px !important;
        font-size: 0.95em !important;
        font-weight: 600 !important;
        cursor: pointer !important;
        transition: background 0.2s ease, transform 0.1s ease !important;
    }
    #text-4 .quform-submit-inner input[type="submit"]:hover,
    #text-4 .quform-submit-inner button:hover {
        background: #e04d00 !important;
        transform: translateY(-1px) !important;
    }
    /* Datenschutz-Text unter dem Formular */
    #text-4 .textwidget > p:last-of-type {
        font-size: 0.78em !important;
        color: #888 !important;
        line-height: 1.4 !important;
        margin-top: 0.5em !important;
    }
    #text-4 .textwidget > p:last-of-type a {
        color: #C24400 !important;
        text-decoration: underline !important;
        border-bottom: none !important;
    }

    /* Doppelter Datenschutz-Hinweis im Quform ausblenden */
    #text-4 .quform-element-1_16 {
        display: none !important;
    }
    /* DSGVO-Checkbox nach unten (vor Submit) verschieben */
    #text-4 .quform-form {
        display: flex !important;
        flex-direction: column !important;
    }
    #text-4 .quform-form-inner {
        order: 1 !important;
    }
    #text-4 .stm-dsgvo-wrap {
        order: 2 !important;
    }
    #text-4 .quform-default-submit {
        order: 3 !important;
    }
    #text-4 .stm-hp-wrap {
        order: 12 !important;
    }

    /* === FLOATING SHARE-BAR === */
    #stm-share-bar {
        position: fixed !important;
        left: 20px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 9998 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        opacity: 0 !important;
        transition: opacity 0.3s ease !important;
    }
    .stm-share-btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 42px !important;
        height: 42px !important;
        border-radius: 50% !important;
        text-decoration: none !important;
        border: none !important;
        transition: transform 0.2s ease, box-shadow 0.2s ease !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
    }
    .stm-share-btn:hover {
        transform: scale(1.15) !important;
        box-shadow: 0 4px 16px rgba(0,0,0,0.25) !important;
    }
    @media (max-width: 1200px) {
        #stm-share-bar {
            display: none !important;
        }
    }

    /* === CALLOUT-BOXEN (Praxisregel, Tipp, Wichtig, Hinweis) === */
    .stm-callout {
        display: flex !important;
        align-items: flex-start !important;
        padding: 1.2em 1.5em !important;
        margin: 1.8em 0 !important;
        border-radius: 12px !important;
        border: 1px solid rgba(0,0,0,0.06) !important;
        font-size: 0.95em !important;
        line-height: 1.7 !important;
    }
    .stm-callout-icon {
        font-size: 1.5em !important;
        margin-right: 0.8em !important;
        flex-shrink: 0 !important;
        margin-top: 0.1em !important;
    }
    .stm-callout-content {
        flex: 1 !important;
    }
    .stm-callout-content strong {
        color: inherit !important;
    }
    .stm-callout-praxis {
        background: linear-gradient(135deg, rgba(194, 68, 0, 0.06) 0%, rgba(194, 68, 0, 0.02) 100%) !important;
        border-left: 4px solid #C24400 !important;
    }
    .stm-callout-tipp {
        background: linear-gradient(135deg, rgba(16, 185, 129, 0.06) 0%, rgba(16, 185, 129, 0.02) 100%) !important;
        border-left: 4px solid #10B981 !important;
    }
    .stm-callout-wichtig {
        background: linear-gradient(135deg, rgba(245, 158, 11, 0.08) 0%, rgba(245, 158, 11, 0.02) 100%) !important;
        border-left: 4px solid #F59E0B !important;
    }
    .stm-callout-hinweis {
        background: linear-gradient(135deg, rgba(0, 24, 137, 0.06) 0%, rgba(0, 24, 137, 0.02) 100%) !important;
        border-left: 4px solid #001889 !important;
    }
    .stm-callout-beispiel {
        background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, rgba(99, 102, 241, 0.02) 100%) !important;
        border-left: 4px solid #6366F1 !important;
    }

    /* === PULL-QUOTES === */
    blockquote.stm-pullquote {
        border-left: none !important;
        border: none !important;
        background: none !important;
        text-align: center !important;
        padding: 2em 3em !important;
        margin: 2.5em auto !important;
        max-width: 85% !important;
        position: relative !important;
        font-size: 1.3em !important;
        font-weight: 500 !important;
        font-style: normal !important;
        color: #001889 !important;
        line-height: 1.6 !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }
    blockquote.stm-pullquote::before {
        content: '\201C' !important;
        font-size: 4em !important;
        color: #C24400 !important;
        opacity: 0.3 !important;
        position: absolute !important;
        top: -0.1em !important;
        left: 0.1em !important;
        font-family: Georgia, serif !important;
        line-height: 1 !important;
    }
    blockquote.stm-pullquote::after {
        content: '' !important;
        display: block !important;
        width: 60px !important;
        height: 3px !important;
        background: #C24400 !important;
        margin: 1em auto 0 !important;
        border-radius: 2px !important;
    }
    blockquote.stm-pullquote p {
        font-size: inherit !important;
        font-weight: inherit !important;
        color: inherit !important;
        line-height: inherit !important;
        font-style: normal !important;
        margin: 0 !important;
    }

    /* === ADDTOANY SHARE BUTTONS — Magazin-Redesign === */
    body.single-post .addtoany_share_save_container {
        border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
        padding: 1.8em 0 0.5em !important;
        margin: 2.5em 0 0 !important;
        text-align: center !important;
    }
    /* Header-Text */
    body.single-post .addtoany_header {
        font-size: 11px !important;
        text-transform: uppercase !important;
        letter-spacing: 0.12em !important;
        color: #999 !important;
        font-weight: 600 !important;
        margin-bottom: 14px !important;
    }
    /* Button-Container */
    body.single-post .addtoany_list {
        display: flex !important;
        justify-content: center !important;
        gap: 10px !important;
    }
    /* Einzelne Buttons — rund, orange-getönt */
    body.single-post .addtoany_list a {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 42px !important;
        height: 42px !important;
        border-radius: 50% !important;
        background: rgba(194, 68, 0, 0.08) !important;
        border: 1.5px solid rgba(194, 68, 0, 0.2) !important;
        padding: 0 !important;
        transition: all 0.2s ease !important;
        text-decoration: none !important;
        line-height: 1 !important;
    }
    body.single-post .addtoany_list a:hover {
        background: #ce4800 !important; /* weisses Icon auf #C24400 waere nur 3,36:1 */
        border-color: #ce4800 !important;
        transform: translateY(-2px) !important;
        box-shadow: 0 4px 12px rgba(194, 68, 0, 0.3) !important;
    }
    /* SVG-Icons — orange, weiß bei Hover.
       AddToAny setzt das fill als Attribut an die Pfade selbst (mal am <path>,
       beim Plus-Knopf am <g>). Ein am <svg> gesetztes fill wird nur vererbt —
       und ein geerbter Wert verliert gegen das Attribut am Kind. Die Regel muss
       deshalb auf die Kinder zeigen, sonst bleiben die Icons weiß und stehen
       unsichtbar auf dem hellen Kreis. */
    body.single-post .addtoany_list a svg {
        width: 18px !important;
        height: 18px !important;
        transition: fill 0.2s ease !important;
    }
    body.single-post .addtoany_list a svg,
    body.single-post .addtoany_list a svg * {
        fill: #c34400 !important; /* dunkler als #C24400: das helle Orange kam auf dem
                                  getoenten Kreis nur auf 3,05:1 */
    }
    body.single-post .addtoany_list a:hover svg,
    body.single-post .addtoany_list a:hover svg * {
        fill: #fff !important;
    }
    /* Originale farbige Hintergründe entfernen */
    body.single-post .addtoany_list a span.a2a_svg {
        background: none !important;
        padding: 0 !important;
        width: auto !important;
        height: auto !important;
        line-height: 1 !important;
        border-radius: 0 !important;
    }
    /* Text-Labels neben Icons ausblenden */
    body.single-post .addtoany_list a span.a2a_label {
        display: none !important;
    }

    /* === INHALTSVERZEICHNIS (TOC) === */
    .stm-toc {
        background: linear-gradient(135deg, #f8f9fb 0%, #f0f2f5 100%) !important;
        border: 1px solid rgba(0, 24, 137, 0.10) !important;
        border-left: 4px solid #001889 !important;
        border-radius: 0 12px 12px 0 !important;
        padding: 0 !important;
        margin: 2em 0 2.5em 0 !important;
        overflow: hidden !important;
    }
    .stm-toc-header {
        display: flex !important;
        align-items: center !important;
        padding: 1em 1.5em !important;
        cursor: pointer !important;
        user-select: none !important;
        transition: background 0.2s ease !important;
    }
    .stm-toc-header:hover {
        background: rgba(0, 24, 137, 0.04) !important;
    }
    .stm-toc-icon {
        font-size: 1.2em !important;
        margin-right: 0.6em !important;
        color: #001889 !important;
    }
    .stm-toc-title {
        font-weight: 700 !important;
        font-size: 1.05em !important;
        color: #1a1a1a !important;
        flex-grow: 1 !important;
    }
    .stm-toc-count {
        font-size: 0.8em !important;
        color: #888 !important;
        margin-right: 0.8em !important;
    }
    .stm-toc-toggle {
        font-size: 0.7em !important;
        color: #888 !important;
        transition: transform 0.3s ease !important;
    }
    .stm-toc-collapsed .stm-toc-toggle {
        transform: rotate(-90deg) !important;
    }
    .stm-toc-list {
        list-style: none !important;
        counter-reset: toc-counter !important;
        margin: 0 !important;
        padding: 0 0 0.5em 0 !important;
        max-height: 600px !important;
        overflow-y: auto !important;
        transition: max-height 0.4s ease, opacity 0.3s ease, padding 0.3s ease !important;
        opacity: 1 !important;
    }
    .stm-toc-collapsed .stm-toc-list {
        max-height: 0 !important;
        opacity: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }
    .stm-toc-list li {
        counter-increment: toc-counter !important;
        margin: 0 !important;
        padding: 0 !important;
        border-top: 1px solid rgba(0, 24, 137, 0.05) !important;
    }
    /* Emojis im TOC ausblenden */
    .stm-toc-list li a img.emoji,
    .stm-toc-list li a .emoji {
        display: none !important;
    }
    .stm-toc-list li a {
        display: block !important;
        padding: 0.7em 1.5em 0.7em 1.5em !important;
        color: #2d2d2d !important;
        text-decoration: none !important;
        font-size: 0.95em !important;
        line-height: 1.5 !important;
        transition: background 0.15s ease, color 0.15s ease, padding-left 0.15s ease !important;
        border-bottom: none !important;
    }
    .stm-toc-list li::before {
        content: counter(toc-counter, decimal-leading-zero) !important;
        color: #C24400 !important;
        font-weight: 700 !important;
        font-size: 0.85em !important;
        position: absolute !important;
        left: 1.5em !important;
        top: 0.75em !important;
    }
    .stm-toc-list li {
        position: relative !important;
    }
    .stm-toc-list li a {
        padding-left: 3.5em !important;
    }
    .stm-toc-list li a:hover {
        background: rgba(194, 68, 0, 0.06) !important;
        color: #C24400 !important;
        padding-left: 4em !important;
    }

    /* Header-Logo: feste Dimensionen gegen CLS (Layout-Shift) */
    .branding img,
    .branding a img,
    .masthead .branding img {
        max-height: 120px;
        max-width: 400px;
        width: auto;
        height: auto;
        object-fit: contain;
    }
    .branding {
        max-height: 120px;
        overflow: visible;
    }