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

        /* === MAGAZIN-AUTORENBOX (Ende des Beitrags) === */
        .premium-author-box {
            margin: 3em 0 2em 0 !important;
            padding: 0 !important;
            background: #fff !important;
            border-radius: 16px !important;
            box-shadow: 0 2px 16px rgba(0,0,0,0.06) !important;
            overflow: hidden !important;
            position: relative !important;
            border: 1px solid rgba(0, 24, 137, 0.06) !important;
        }

        .premium-author-box::before {
            content: '' !important;
            position: absolute !important;
            top: 0 !important;
            left: 0 !important;
            right: 0 !important;
            height: 3px !important;
            background: linear-gradient(90deg, #C24400 0%, #001889 100%) !important;
        }

        /* Header: dezente Überschrift */
        .author-box-header {
            padding: 20px 30px 0 !important;
            text-align: left !important;
        }

        .author-intro {
            margin: 0 !important;
            font-size: 11px !important;
            color: #999 !important;
            font-weight: 600 !important;
            font-style: normal !important;
            text-transform: uppercase !important;
            letter-spacing: 0.1em !important;
            display: block !important;
        }
        .author-intro svg {
            display: none !important;
        }
        .author-intro::after {
            display: none !important;
        }

        /* Layout: Avatar links, Details rechts */
        .author-box-inner {
            display: flex !important;
            gap: 24px !important;
            padding: 18px 30px 24px !important;
            align-items: flex-start !important;
        }

        .author-avatar-section {
            flex-shrink: 0 !important;
            text-align: center !important;
            display: flex !important;
            flex-direction: column !important;
            align-items: center !important;
            gap: 10px !important;
        }

        .author-avatar {
            position: relative !important;
            display: inline-block !important;
            margin-bottom: 0 !important;
        }

        .author-avatar img {
            width: 130px !important;
            height: 130px !important;
            border-radius: 50% !important;
            border: 3px solid #C24400 !important;
            box-shadow: 0 4px 14px rgba(0,0,0,0.1) !important;
            object-fit: cover !important;
        }

        .experience-badge {
            display: none !important;
        }

        .author-stats {
            display: none !important;
        }
        
        /* Kontakt-Button unter dem Avatar */
        .contact-author-btn {
            background: transparent !important;
            color: #001889 !important;
            border: 1.5px solid #001889 !important;
            padding: 7px 16px !important;
            border-radius: 20px !important;
            cursor: pointer !important;
            font-weight: 500 !important;
            font-size: 12px !important;
            display: inline-flex !important;
            align-items: center !important;
            gap: 5px !important;
            transition: all 0.2s ease !important;
            box-shadow: none !important;
            white-space: nowrap !important;
        }

        .contact-author-btn:hover {
            background: #C24400 !important;
            color: #fff !important;
            border-color: #C24400 !important;
            transform: none !important;
            box-shadow: none !important;
        }

        .author-details {
            flex: 1 !important;
            min-width: 0 !important;
        }

        .author-name {
            margin: 0 0 2px 0 !important;
            font-size: 22px !important;
            font-weight: 700 !important;
            color: #1a1a1a !important;
            line-height: 1.3 !important;
        }
        
        .author-name a {
            color: inherit;
            text-decoration: none;
            transition: color 0.3s ease;
        }
        
        .author-name a:hover {
            color: #C24400;
        }
        
        .author-title {
            margin: 0 0 10px 0 !important;
            color: #777 !important;
            font-size: 14px !important;
            font-weight: 400 !important;
            line-height: 1.4 !important;
        }

        .author-motto {
            display: none !important;
        }

        .author-bio {
            margin: 0 0 12px !important;
            color: #444 !important;
            line-height: 1.7 !important;
            font-size: 15px !important;
        }

        /* Bio-Content: initial 3 Zeilen, per JS aufklappbar */
        .author-bio .bio-content {
            display: -webkit-box !important;
            -webkit-line-clamp: 3 !important;
            -webkit-box-orient: vertical !important;
            overflow: hidden !important;
            transition: all 0.3s ease !important;
        }
        .author-bio.bio-expanded .bio-content {
            display: block !important;
            -webkit-line-clamp: unset !important;
            overflow: visible !important;
        }

        /* "Mehr lesen" Button — dezent inline */
        .read-more-btn {
            background: transparent !important;
            border: none !important;
            color: #C24400 !important;
            padding: 2px 0 !important;
            border-radius: 0 !important;
            cursor: pointer !important;
            font-weight: 600 !important;
            font-size: 13px !important;
            display: inline-flex !important;
            align-items: center !important;
            gap: 4px !important;
            transition: color 0.2s ease !important;
            margin-top: 2px !important;
        }
        .read-more-btn:hover {
            color: #001889 !important;
            background: transparent !important;
        }
        .read-more-btn .btn-icon {
            transition: transform 0.2s ease !important;
        }
        .read-more-btn.expanded .btn-icon {
            transform: rotate(180deg) !important;
        }

        .author-specialties {
            margin: 8px 0 0 !important;
        }

        .specialties-title {
            display: none !important;
        }

        .specialties-tags {
            display: flex !important;
            flex-wrap: wrap !important;
            gap: 6px !important;
        }

        .specialty-tag {
            background: rgba(0, 24, 137, 0.06) !important;
            padding: 4px 12px !important;
            border-radius: 20px !important;
            font-size: 12px !important;
            color: #001889 !important;
            border: none !important;
            transition: all 0.2s ease !important;
        }

        .specialty-tag:hover {
            background: #C24400 !important;
            color: white !important;
            border-color: transparent !important;
            transform: none !important;
            box-shadow: none !important;
        }

        /* Max 5 Fachgebiete anzeigen */
        .specialties-tags .specialty-tag:nth-child(n+6) {
            display: none !important;
        }

        .author-social {
            margin: 12px 0 0 !important;
        }

        .social-title {
            display: none !important;
        }

        .social-links {
            display: flex !important;
            gap: 8px !important;
        }

        .social-link {
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            width: 34px !important;
            height: 34px !important;
            background: #f5f6f8 !important;
            border-radius: 50% !important;
            transition: all 0.2s ease !important;
            box-shadow: none !important;
            border: none !important;
        }

        .social-link:hover {
            background: #C24400 !important;
            transform: none !important;
            box-shadow: none !important;
            border: none !important;
        }

        .social-link svg {
            width: 16px !important;
            height: 16px !important;
            fill: #555 !important;
            transition: fill 0.2s ease !important;
        }

        .social-link:hover svg {
            fill: #fff !important;
        }

        /* "Alle Artikel" Link — dezent unter den Social Icons */
        .view-all-posts {
            display: inline-flex !important;
            align-items: center !important;
            gap: 5px !important;
            margin-top: 10px !important;
            color: #C24400 !important;
            text-decoration: none !important;
            font-weight: 600 !important;
            font-size: 13px !important;
            transition: color 0.2s ease !important;
            padding: 0 !important;
            border: none !important;
            border-radius: 0 !important;
        }

        .view-all-posts:hover {
            color: #001889 !important;
            background: transparent !important;
            border: none !important;
            gap: 8px !important;
            transform: none !important;
        }
        
        /* Kontaktformular Styles */
        .author-contact-form {
            background: white;
            margin: 0 40px 40px;
            padding: 30px;
            border-radius: 15px;
            box-shadow: 0 5px 20px rgba(0,0,0,0.08);
            border: 2px solid #C24400;
        }
        
        .author-contact-form h4 {
            margin: 0 0 20px 0;
            color: #1B3A8C;
            font-size: 20px;
        }
        
        .form-group {
            margin-bottom: 20px;
        }
        
        .form-group label {
            display: block;
            margin-bottom: 5px;
            color: #1B3A8C;
            font-weight: 500;
        }
        
        .form-group input,
        .form-group textarea {
            width: 100%;
            padding: 10px 15px;
            border: 2px solid #e2e8f0;
            border-radius: 8px;
            font-size: 16px;
            transition: border-color 0.3s ease;
        }
        
        .form-group input:focus,
        .form-group textarea:focus {
            outline: none;
            border-color: #C24400;
        }
        
        .form-actions {
            display: flex;
            gap: 10px;
        }
        
        .send-btn {
            background: #C24400;
            color: white;
            border: none;
            padding: 12px 30px;
            border-radius: 25px;
            cursor: pointer;
            font-weight: 600;
            transition: all 0.3s ease;
        }
        
        .send-btn:hover:not(:disabled) {
            background: #1B3A8C;
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(27, 58, 140, 0.4);
        }
        
        .send-btn:disabled {
            opacity: 0.6;
            cursor: not-allowed;
        }
        
        .cancel-btn {
            background: transparent;
            color: #1B3A8C;
            border: 2px solid #1B3A8C;
            padding: 12px 30px;
            border-radius: 25px;
            cursor: pointer;
            font-weight: 500;
            transition: all 0.3s ease;
        }
        
        .cancel-btn:hover {
            background: #1B3A8C;
            color: white;
        }
        
        .form-message .success {
            color: #10b981;
            margin: 10px 0 0;
            font-weight: 500;
        }
        
        .form-message .error {
            color: #ef4444;
            margin: 10px 0 0;
            font-weight: 500;
        }
        
        /* Responsive Design */
        @media (max-width: 768px) {
            .premium-author-box {
                margin: 2em 0 1.5em 0 !important;
                border-radius: 14px !important;
            }

            .author-box-header {
                padding: 16px 20px 0 !important;
            }

            .author-box-inner {
                flex-direction: column !important;
                padding: 14px 20px 20px !important;
                gap: 16px !important;
                align-items: center !important;
                text-align: center !important;
            }

            .author-avatar img {
                width: 100px !important;
                height: 100px !important;
                border-width: 3px !important;
            }

            .author-name {
                font-size: 19px !important;
            }

            .specialties-tags {
                justify-content: center !important;
            }

            .social-links {
                justify-content: center !important;
            }

            .author-contact-form {
                margin: 0 20px 20px !important;
                padding: 20px !important;
                border-width: 1px !important;
            }
        }
    

        
        /* Experience Badge mit Tooltip */
        .widget-experience-badge,
        .shortcode-experience-badge {
            position: absolute;
            bottom: 5px;
            right: 5px;
            background: #C24400;
            color: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            box-shadow: 0 3px 8px rgba(194, 68, 0, 0.4);
            cursor: pointer;
            transition: all 0.3s ease;
        }
        
        .widget-experience-badge:hover,
        .shortcode-experience-badge:hover {
            transform: scale(1.1);
            box-shadow: 0 5px 15px rgba(194, 68, 0, 0.6);
        }
        
        /* Tooltip für Experience Badge */
        .widget-experience-badge[data-tooltip],
        .shortcode-experience-badge[data-tooltip] {
            position: relative;
        }
        
        .widget-experience-badge[data-tooltip]:hover::after,
        .shortcode-experience-badge[data-tooltip]:hover::after {
            content: attr(data-tooltip);
            position: absolute;
            bottom: calc(100% + 15px);
            left: 50%;
            transform: translateX(-50%);
            background: #1B3A8C;
            color: white;
            padding: 12px 18px;
            border-radius: 8px;
            font-size: 13px;
            white-space: normal;
            min-width: 250px;
            max-width: 400px;
            width: auto;
            box-shadow: 0 4px 12px rgba(0,0,0,0.2);
            z-index: 10000;
            font-weight: normal;
            line-height: 1.6;
            text-align: left;
            word-break: break-word;
            animation: tooltipFadeIn 0.3s ease-in-out;
        }
        
        @keyframes tooltipFadeIn {
            from {
                opacity: 0;
                transform: translateX(-50%) translateY(5px);
            }
            to {
                opacity: 1;
                transform: translateX(-50%) translateY(0);
            }
        }
        
        .widget-experience-badge[data-tooltip]:hover::before,
        .shortcode-experience-badge[data-tooltip]:hover::before {
            content: '';
            position: absolute;
            bottom: calc(100% + 8px);
            left: 50%;
            transform: translateX(-50%);
            border: 7px solid transparent;
            border-top-color: #1B3A8C;
            z-index: 10001;
            animation: tooltipArrowFadeIn 0.3s ease-in-out;
        }
        
        @keyframes tooltipArrowFadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }
        
        /* Extra Abstand bei sehr großen Avataren */
        .avatar-size-200 .widget-experience-badge[data-tooltip]:hover::after,
        .avatar-size-200 .shortcode-experience-badge[data-tooltip]:hover::after {
            bottom: calc(100% + 18px);
        }
        
        .avatar-size-400 .widget-experience-badge[data-tooltip]:hover::after,
        .avatar-size-400 .shortcode-experience-badge[data-tooltip]:hover::after {
            bottom: calc(100% + 25px);
        }
        
        .avatar-size-200 .widget-experience-badge[data-tooltip]:hover::before,
        .avatar-size-200 .shortcode-experience-badge[data-tooltip]:hover::before {
            bottom: calc(100% + 11px);
        }
        
        .avatar-size-400 .widget-experience-badge[data-tooltip]:hover::before,
        .avatar-size-400 .shortcode-experience-badge[data-tooltip]:hover::before {
            bottom: calc(100% + 18px);
        }
        
        /* Fix für schmale Container */
        .widget-author-avatar,
        .shortcode-author-avatar {
            overflow: visible !important;
        }
        
        /* Sicherstellen, dass Parent-Container den Tooltip nicht abschneiden */
        .widget-author-header,
        .shortcode-author-header {
            overflow: visible !important;
        }
        
        .shortcode-author-item {
            overflow: visible !important;
        }
        
        /* Nur horizontales Overflow verstecken für den oberen Streifen */
        .shortcode-author-item {
            overflow-x: hidden;
            overflow-y: visible;
        }
        
        /* Beitragsliste mit Thumbnails */
        .widget-posts-list.with-thumbnails li,
        .shortcode-posts-list.with-thumbnails li {
            display: flex;
            align-items: flex-start;
            gap: 12px;
        }
        
        .widget-post-thumbnail,
        .shortcode-post-thumbnail {
            flex-shrink: 0;
            overflow: hidden;
            border-radius: 8px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
        }
        
        .widget-post-thumbnail img,
        .shortcode-post-thumbnail img {
            display: block;
            width: 100%;
            height: auto;
            transition: transform 0.3s ease;
        }
        
        .widget-post-thumbnail:hover img,
        .shortcode-post-thumbnail:hover img {
            transform: scale(1.05);
        }
        
        /* Thumbnail Größen */
        .widget-post-thumbnail img[class*="size-thumbnail"],
        .shortcode-post-thumbnail img[class*="size-thumbnail"] {
            width: 60px;
            height: 60px;
            object-fit: cover;
        }
        
        .widget-post-thumbnail img[class*="size-medium"],
        .shortcode-post-thumbnail img[class*="size-medium"] {
            width: 80px;
            height: 80px;
            object-fit: cover;
        }
        
        .widget-post-thumbnail img[class*="size-large"],
        .shortcode-post-thumbnail img[class*="size-large"] {
            width: 100px;
            height: 100px;
            object-fit: cover;
        }
        
        .widget-post-content,
        .shortcode-post-content {
            flex: 1;
            min-width: 0;
        }
        
        .bio-text {
            margin-bottom: 8px;
        }
        
        .bio-toggle-btn {
            background: transparent;
            border: 1px solid #C24400;
            color: #C24400;
            padding: 5px 12px;
            border-radius: 15px;
            cursor: pointer;
            font-size: 12px;
            font-weight: 500;
            transition: all 0.3s ease;
        }
        
        .bio-toggle-btn:hover {
            background: #C24400;
            color: white;
        }
        
        .widget-contact-btn,
        .shortcode-contact-btn {
            background: #1B3A8C;
            color: white;
            border: none;
            padding: 6px 14px;
            border-radius: 20px;
            cursor: pointer;
            font-weight: 500;
            font-size: 12px;
            display: inline-flex;
            align-items: center;
            gap: 5px;
            margin-top: 8px;
            transition: all 0.3s ease;
        }
        
        .widget-contact-btn:hover,
        .shortcode-contact-btn:hover {
            background: #C24400;
            transform: translateY(-1px);
            box-shadow: 0 3px 10px rgba(194, 68, 0, 0.3);
        }
        
        /* Kontaktformular Modal */
        .widget-contact-modal {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            z-index: 99999;
            align-items: center;
            justify-content: center;
        }
        
        .widget-contact-modal.active {
            display: flex;
        }
        
        .widget-contact-form {
            background: white;
            padding: 30px;
            border-radius: 15px;
            max-width: 500px;
            width: 90%;
            max-height: 90vh;
            overflow-y: auto;
            position: relative;
        }
        
        .widget-contact-form h4 {
            margin: 0 0 20px 0;
            color: #1B3A8C;
            font-size: 20px;
        }
        
        .widget-form-group {
            margin-bottom: 15px;
        }
        
        .widget-form-group label {
            display: block;
            margin-bottom: 5px;
            color: #1B3A8C;
            font-weight: 500;
            font-size: 14px;
        }
        
        .widget-form-group input,
        .widget-form-group textarea {
            width: 100%;
            padding: 10px 12px;
            border: 2px solid #e2e8f0;
            border-radius: 8px;
            font-size: 14px;
            transition: border-color 0.3s ease;
        }
        
        .widget-form-group input:focus,
        .widget-form-group textarea:focus {
            outline: none;
            border-color: #C24400;
        }
        
        .widget-form-actions {
            display: flex;
            gap: 10px;
            margin-top: 20px;
        }
        
        .widget-send-btn {
            background: #C24400;
            color: white;
            border: none;
            padding: 10px 25px;
            border-radius: 25px;
            cursor: pointer;
            font-weight: 600;
            transition: all 0.3s ease;
        }
        
        .widget-send-btn:hover:not(:disabled) {
            background: #1B3A8C;
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(27, 58, 140, 0.4);
        }
        
        .widget-send-btn:disabled {
            opacity: 0.6;
            cursor: not-allowed;
        }
        
        .widget-cancel-btn {
            background: transparent;
            color: #666;
            border: 2px solid #e2e8f0;
            padding: 10px 25px;
            border-radius: 25px;
            cursor: pointer;
            font-weight: 500;
            transition: all 0.3s ease;
        }
        
        .widget-cancel-btn:hover {
            border-color: #1B3A8C;
            color: #1B3A8C;
        }
        
        .widget-form-message {
            margin-top: 15px;
            padding: 10px;
            border-radius: 8px;
            font-size: 14px;
        }
        
        .widget-form-message.success {
            background: #d4edda;
            color: #155724;
            border: 1px solid #c3e6cb;
        }
        
        .widget-form-message.error {
            background: #f8d7da;
            color: #721c24;
            border: 1px solid #f5c6cb;
        }
        
        .widget-author-motto .motto-label,
        .shortcode-author-motto .motto-label {
            font-style: normal;
            font-weight: 600;
            display: block;
            margin-bottom: 4px;
            font-size: 12px;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            opacity: 0.8;
        }
        
        .widget-author-posts {
            margin: 15px 0;
        }
        
        .widget-posts-title {
            margin: 0 0 10px 0;
            font-size: 14px;
            font-weight: 600;
            color: #1B3A8C;
        }
        
        .widget-posts-list {
            list-style: none;
            margin: 0;
            padding: 0;
        }
        
        .widget-posts-list li {
            padding: 8px 0;
            border-bottom: 1px solid rgba(0,0,0,0.05);
            display: flex;
            flex-direction: column;
            gap: 3px;
        }
        
        .widget-posts-list li:last-child {
            border-bottom: none;
        }
        
        .widget-posts-list a {
            color: #333;
            text-decoration: none;
            font-size: 14px;
            font-weight: 500;
            line-height: 1.4;
            transition: color 0.3s ease;
            display: block;
        }
        
        .widget-posts-list a:hover {
            color: #C24400;
        }
        
        .widget-post-meta {
            font-size: 12px;
            color: #999;
        }
        
        /* Footer Widget Anpassungen */
        .footer-widget-area .premium-authors-widget {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
            gap: 20px;
            margin: 0;
        }
        
        .footer-widget-area .widget-author-item {
            margin: 0;
            background: rgba(255,255,255,0.05);
            border-color: rgba(255,255,255,0.1);
        }
        
        .footer-widget-area .widget-author-name a,
        .footer-widget-area .widget-posts-title {
            color: inherit;
        }
        
        /* Alternative Tooltip-Position wenn oben kein Platz */
        .widget-author-item:first-child .widget-experience-badge[data-tooltip]:hover::after,
        .shortcode-author-item:first-child .shortcode-experience-badge[data-tooltip]:hover::after {
            bottom: auto;
            top: calc(100% + 15px);
            animation: tooltipFadeInDown 0.3s ease-in-out;
        }
        
        @keyframes tooltipFadeInDown {
            from {
                opacity: 0;
                transform: translateX(-50%) translateY(-5px);
            }
            to {
                opacity: 1;
                transform: translateX(-50%) translateY(0);
            }
        }
        
        .widget-author-item:first-child .widget-experience-badge[data-tooltip]:hover::before,
        .shortcode-author-item:first-child .shortcode-experience-badge[data-tooltip]:hover::before {
            bottom: auto;
            top: calc(100% + 8px);
            border-top-color: transparent;
            border-bottom-color: #1B3A8C;
        }
        @media (min-width: 769px) {
            .widget-author-item:first-child .widget-experience-badge[data-tooltip]:hover::after,
            .shortcode-author-item:first-child .shortcode-experience-badge[data-tooltip]:hover::after {
                left: 0;
                transform: translateX(0);
            }
            
            .widget-author-item:last-child .widget-experience-badge[data-tooltip]:hover::after,
            .shortcode-author-item:last-child .shortcode-experience-badge[data-tooltip]:hover::after {
                left: auto;
                right: 0;
                transform: translateX(0);
            }}
        body.dark-mode .widget-author-item {
            background: #2a2a2a;
            border-color: #3a3a3a;
        }
        
        body.dark-mode .widget-author-motto {
            background: rgba(194, 68, 0, 0.1);
        }
        
        body.dark-mode .widget-posts-list a {
            color: #e0e0e0;
        }
        
        /* Responsive Design */
        @media (max-width: 768px) {
            
            /* Tooltip auf Mobil verstecken und Touch-Alternative */
            .widget-experience-badge[data-tooltip]:hover::after,
            .widget-experience-badge[data-tooltip]:hover::before,
            .shortcode-experience-badge[data-tooltip]:hover::after,
            .shortcode-experience-badge[data-tooltip]:hover::before {
                display: none;
            }
            
            /* Auf Touch-Geräten Badge klickbar machen */
            @media (hover: none) and (pointer: coarse) {
                .widget-experience-badge[data-tooltip],
                .shortcode-experience-badge[data-tooltip] {
                    cursor: pointer;
                }}}
        
        /* Premium Authors Shortcode Styles */
        .premium-authors-shortcode {
            margin: 30px 0;
            padding-top: 30px; /* Extra Padding für Tooltips */
        }
        
        .shortcode-author-item {
            background: #f8f9fa;
            border-radius: 15px;
            padding: 25px;
            margin-bottom: 20px;
            box-shadow: 0 5px 15px rgba(0,0,0,0.08);
            border: 1px solid #e5e7eb;
            position: relative;
            transition: all 0.3s ease;
        }
        
        .shortcode-author-item::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg, #C24400 0%, #1B3A8C 100%);
            z-index: 1;
        }
        
        .shortcode-author-item:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 25px rgba(0,0,0,0.12);
        }
        
        .shortcode-author-header {
            display: flex;
            align-items: flex-start;
            gap: 20px;
            margin-bottom: 15px;
        }
        
        .shortcode-author-avatar {
            position: relative;
            flex-shrink: 0;
        }
        
        .shortcode-author-avatar img {
            border-radius: 50%;
            border: 3px solid #C24400;
            object-fit: cover;
            transition: transform 0.3s ease;
        }
        
        /* Avatar-Größen für Shortcode */
        .avatar-size-80 .shortcode-author-avatar img {
            width: 80px;
            height: 80px;
        }
        
        .avatar-size-120 .shortcode-author-avatar img {
            width: 120px;
            height: 120px;
        }
        
        .avatar-size-200 .shortcode-author-avatar img {
            width: 200px;
            height: 200px;
            border-width: 4px;
        }
        
        .avatar-size-400 .shortcode-author-avatar img {
            width: 400px;
            height: 400px;
            border-width: 5px;
        }
        
        .shortcode-author-avatar:hover img {
            transform: scale(1.05);
        }
        
        .shortcode-experience-badge {
            position: absolute;
            bottom: -5px;
            right: -5px;
            background: #C24400;
            color: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            box-shadow: 0 2px 5px rgba(194, 68, 0, 0.3);
        }
        
        /* Experience Badge Größen für Shortcode */
        .avatar-size-80 .shortcode-experience-badge {
            width: 28px;
            height: 28px;
            font-size: 11px;
        }
        
        .avatar-size-120 .shortcode-experience-badge {
            width: 36px;
            height: 36px;
            font-size: 12px;
        }
        
        .avatar-size-200 .shortcode-experience-badge {
            width: 50px;
            height: 50px;
            font-size: 15px;
        }
        
        .avatar-size-400 .shortcode-experience-badge {
            width: 70px;
            height: 70px;
            font-size: 18px;
        }
        
        .shortcode-author-info {
            flex: 1;
        }
        
        .shortcode-author-name {
            margin: 0 0 5px 0;
            font-size: 22px;
            font-weight: 700;
            line-height: 1.2;
        }
        
        .shortcode-author-name a {
            color: #1B3A8C;
            text-decoration: none;
            transition: color 0.3s ease;
        }
        
        .shortcode-author-name a:hover {
            color: #C24400;
        }
        
        .shortcode-author-title {
            margin: 0 0 8px 0;
            color: #666;
            font-size: 16px;
            font-weight: 500;
        }
        
        .shortcode-post-count {
            display: inline-block;
            background: rgba(27, 58, 140, 0.1);
            color: #1B3A8C;
            padding: 5px 12px;
            border-radius: 20px;
            font-size: 13px;
            font-weight: 500;
        }
        
        .shortcode-author-bio {
            margin: 15px 0;
            color: #333;
            line-height: 1.6;
            font-size: 15px;
        }
        
        .shortcode-author-specialties {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-bottom: 15px;
        }
        
        .shortcode-specialty-tag {
            background: rgba(194, 68, 0, 0.1);
            color: #C24400;
            padding: 6px 14px;
            border-radius: 20px;
            font-size: 13px;
            font-weight: 500;
            border: 1px solid rgba(194, 68, 0, 0.2);
        }
        
        .shortcode-author-motto {
            background: rgba(194, 68, 0, 0.05);
            border-left: 3px solid #C24400;
            padding: 12px 18px;
            margin: 15px 0;
            font-style: italic;
            color: #1B3A8C;
            font-size: 14px;
            line-height: 1.6;
            border-radius: 0 8px 8px 0;
        }
        
        .shortcode-author-motto .motto-label {
            font-style: normal;
            font-weight: 600;
            display: block;
            margin-bottom: 4px;
            font-size: 13px;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            opacity: 0.8;
        }
        
        .shortcode-author-posts {
            margin: 20px 0;
        }
        
        .shortcode-posts-title {
            margin: 0 0 12px 0;
            font-size: 16px;
            font-weight: 600;
            color: #1B3A8C;
        }
        
        .shortcode-posts-list {
            list-style: none;
            margin: 0;
            padding: 0;
        }
        
        .shortcode-posts-list li {
            padding: 10px 0;
            border-bottom: 1px solid rgba(0,0,0,0.05);
            display: flex;
            flex-direction: column;
            gap: 4px;
        }
        
        .shortcode-posts-list li:last-child {
            border-bottom: none;
        }
        
        .shortcode-posts-list a {
            color: #333;
            text-decoration: none;
            font-size: 15px;
            font-weight: 500;
            line-height: 1.4;
            transition: color 0.3s ease;
        }
        
        .shortcode-posts-list a:hover {
            color: #C24400;
        }
        
        .shortcode-post-meta {
            font-size: 13px;
            color: #999;
        }
        
        .shortcode-view-all {
            display: inline-flex;
            align-items: center;
            color: #1B3A8C;
            text-decoration: none;
            font-weight: 600;
            font-size: 14px;
            transition: all 0.3s ease;
            margin-top: 15px;
            padding: 8px 16px;
            border: 2px solid #1B3A8C;
            border-radius: 25px;
        }
        
        .shortcode-view-all:hover {
            background: #C24400;
            color: white;
            border-color: #C24400;
            padding-right: 20px;
        }
        
        /* Grid Layout */
        .authors-grid {
            display: grid;
            gap: 20px;
        }
        
        .authors-grid.cols-2 {
            grid-template-columns: repeat(2, 1fr);
        }
        
        .authors-grid.cols-3 {
            grid-template-columns: repeat(3, 1fr);
        }
        
        .authors-grid.cols-4 {
            grid-template-columns: repeat(4, 1fr);
        }
        
        .authors-grid .shortcode-author-item {
            margin-bottom: 0;
        }
        
        /* Responsive Design für Shortcode */
        @media (max-width: 768px) {
            .authors-grid {
                grid-template-columns: 1fr !important;
            }
            
            .shortcode-author-header {
                flex-direction: column;
                text-align: center;
            }
            
            .shortcode-author-avatar {
                margin: 0 auto;
            }
            
            .shortcode-author-info {
                text-align: center;
            }
            
            .shortcode-author-specialties {
                justify-content: center;
            }
            
            /* Responsive Avatar-Größen */
            .avatar-size-200 .shortcode-author-avatar img,
            .avatar-size-400 .shortcode-author-avatar img {
                width: 150px;
                height: 150px;
                border-width: 3px;
            }
            
            .avatar-size-200 .shortcode-experience-badge,
            .avatar-size-400 .shortcode-experience-badge {
                width: 40px;
                height: 40px;
                font-size: 13px;
            }}


        /* ===== ab hier: Neufassung Autoren-Widget, 18.08.2026 ===== */
        /* ==========================================================================
           STM Autoren-Widget – Neufassung 18.08.2026
           Ziel: schmale Sidebar (~250 px Kartenbreite) sauber bedienen.
           Regeln, die hier bewusst NICHT vorkommen:
           - kein transform beim :hover der Karte  -> Karte kann unter dem Mauszeiger
             nicht mehr weglaufen (das war das "Zittern" beim Scrollen)
           - keine Groessenaenderung beim :hover (kein padding-Wechsel)
           - kein CSS-Tooltip in der Sidebar (250 px Spalte, 400 px Tooltip)
           ========================================================================== */

        .premium-authors-widget,
        .premium-authors-widget *,
        .premium-authors-widget *::before,
        .premium-authors-widget *::after {
            box-sizing: border-box;
        }

        .premium-authors-widget {
            margin: 0;
            padding: 0;
            container-type: inline-size;
        }

        .premium-authors-widget .paw-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 14px;
        }

        /* Ab ausreichend breitem Container (z. B. Sidebar unter dem Text auf Tablet)
           automatisch mehrspaltig – nicht an die Fensterbreite gekoppelt. */
        @container (min-width: 520px) {
            .premium-authors-widget .paw-grid {
                grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
                gap: 18px;
            }
        }

        /* ---------- Karte ---------- */
        .premium-authors-widget .widget-author-item {
            position: relative;
            margin: 0;
            padding: 16px;
            background: #fff;
            border: 1px solid #e3e7f1;
            border-radius: 14px;
            box-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 10px 22px -16px rgba(16, 24, 40, .55);
            overflow: hidden;
            transition: border-color .25s ease, box-shadow .25s ease;
        }

        .premium-authors-widget .widget-author-item::before {
            content: none;
        }

        .premium-authors-widget .widget-author-item:hover {
            border-color: #c6cfe1;
            box-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 14px 28px -16px rgba(16, 24, 40, .75);
            transform: none;
        }

        /* ---------- Verfasser des aktuellen Beitrags hervorheben ---------- */
        .premium-authors-widget .widget-author-item.is-post-author {
            border-color: #ffd3b1;
            box-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 10px 24px -16px rgba(194, 68, 0, .6);
        }

        .premium-authors-widget .widget-author-item.is-post-author:hover {
            border-color: #ffb98a;
        }

        .premium-authors-widget .paw-author-flag {
            display: inline-flex;
            align-items: center;
            gap: 5px;
            margin: 0 0 10px;
            padding: 3px 9px;
            border-radius: 999px;
            background: rgba(194, 68, 0, .1);
            color: #b84a00;
            font-size: 9.5px;
            font-weight: 700;
            letter-spacing: .07em;
            line-height: 1.6;
            text-transform: uppercase;
            white-space: nowrap;
            max-width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .premium-authors-widget .paw-author-flag::before {
            content: "";
            flex: 0 0 auto;
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: #C24400;
        }

        /* ---------- Kopfzeile: Bild + Name + Funktion ---------- */
        .premium-authors-widget .widget-author-header {
            display: flex;
            align-items: center;
            gap: 12px;
            margin: 0 0 12px;
            overflow: visible;
        }

        .premium-authors-widget .widget-author-avatar {
            position: relative;
            flex: 0 0 auto;
            line-height: 0;
        }

        .premium-authors-widget .widget-author-avatar a {
            display: block;
            line-height: 0;
        }

        .premium-authors-widget .widget-author-avatar img {
            width: 62px;
            height: 62px;
            border: 0;
            border-radius: 50%;
            object-fit: cover;
            box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(194, 68, 0, .85);
            transition: box-shadow .25s ease;
            transform: none;
        }

        .premium-authors-widget .widget-author-item:hover .widget-author-avatar img {
            box-shadow: 0 0 0 2px #fff, 0 0 0 4px #C24400;
            transform: none;
        }

        /* Erfahrungs-Plakette: schmale Pille unter dem Bild, kein CSS-Tooltip mehr,
           der volle Text steht im title-Attribut. */
        .premium-authors-widget .widget-experience-badge {
            position: absolute;
            left: 50%;
            bottom: -7px;
            transform: translateX(-50%);
            width: auto;
            height: auto;
            padding: 2px 7px;
            background: #C24400;
            color: #fff;
            border: 2px solid #fff;
            border-radius: 999px;
            font-size: 10px;
            font-weight: 700;
            line-height: 1.3;
            letter-spacing: .01em;
            white-space: nowrap;
            box-shadow: 0 2px 6px rgba(194, 68, 0, .35);
            cursor: help;
            transition: none;
        }

        .premium-authors-widget .widget-experience-badge:hover {
            transform: translateX(-50%);
            box-shadow: 0 2px 6px rgba(194, 68, 0, .35);
        }

        .premium-authors-widget .widget-author-info {
            flex: 1 1 auto;
            min-width: 0;
            /* min-width:0 ist der eigentliche Fix: ohne das kann die Spalte nicht
               schmaler werden als das laengste Wort ("Maschmeyer") und der Name
               schiebt sich ueber den rechten Kartenrand hinaus. */
        }

        .premium-authors-widget .widget-author-name {
            margin: 0 0 3px;
            font-size: 15px;
            line-height: 1.25;
            font-weight: 700;
            letter-spacing: -.01em;
            overflow-wrap: break-word;
            hyphens: auto;
        }

        .premium-authors-widget .widget-author-name a {
            color: #16265c;
            text-decoration: none;
            transition: color .2s ease;
        }

        .premium-authors-widget .widget-author-name a:hover {
            color: #C24400;
        }

        /* Die Funktionsbezeichnung steht bewusst in einem <span>, nicht in einem <p>:
           das Theme erzwingt fuer Absaetze in der Sidebar
           `body.single-post #sidebar p { font-size:14px !important; line-height:1.6 !important }`.
           Diese Regel enthaelt eine ID – dagegen kommt keine Klassen-Kombination an.
           Ein <span> trifft die Regel gar nicht erst. */
        .premium-authors-widget .widget-author-title {
            display: -webkit-box;
            margin: 0;
            font-size: 11.5px;
            line-height: 1.4;
            font-weight: 500;
            color: #737b8c;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        /* ---------- Kurzvorstellung ---------- */
        .premium-authors-widget .widget-author-bio {
            margin: 0 0 10px;
            font-size: 12.5px;
            line-height: 1.6;
            color: #4a5261;
        }

        .premium-authors-widget .bio-text {
            margin: 0;
        }

        .premium-authors-widget .bio-text.bio-clamped {
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        .premium-authors-widget .bio-text.bio-clamped.is-expanded {
            display: block;
            overflow: visible;
        }

        .premium-authors-widget .bio-toggle-btn {
            margin: 5px 0 0;
            padding: 0;
            background: none;
            border: 0;
            border-radius: 0;
            color: #C24400;
            font-size: 11.5px;
            font-weight: 600;
            line-height: 1.3;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            gap: 4px;
            transition: color .2s ease;
        }

        .premium-authors-widget .bio-toggle-btn::after {
            content: "";
            width: 6px;
            height: 6px;
            margin-top: -3px;
            border-right: 1.6px solid currentColor;
            border-bottom: 1.6px solid currentColor;
            transform: rotate(45deg);
            transition: transform .2s ease;
        }

        .premium-authors-widget .bio-toggle-btn[data-expanded="true"]::after {
            transform: rotate(-135deg);
            margin-top: 2px;
        }

        .premium-authors-widget .bio-toggle-btn:hover {
            background: none;
            color: #cc5200;
            text-decoration: underline;
            text-underline-offset: 2px;
        }

        /* ---------- Fachgebiete ---------- */
        .premium-authors-widget .widget-author-specialties {
            display: flex;
            flex-wrap: wrap;
            gap: 5px;
            margin: 0 0 10px;
        }

        .premium-authors-widget .widget-specialty-tag {
            max-width: 100%;
            padding: 3px 9px;
            background: rgba(27, 58, 140, .055);
            border: 1px solid rgba(27, 58, 140, .11);
            border-radius: 999px;
            color: #2c4285;
            font-size: 10.5px;
            font-weight: 600;
            line-height: 1.6;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        /* ---------- Motto ----------
           The7 stylt jedes blockquote ueber `blockquote:not(.wp-block-quote):not(.elementor-blockquote)`
           (Spezifitaet 0,2,1) mit der h5-Schrift und einer eigenen Hintergrundfarbe.
           Deshalb steht hier das Element im Selektor: 0,3,1 schlaegt das sicher. */
        .premium-authors-widget .widget-author-item blockquote.widget-author-motto {
            margin: 0 0 12px;
            padding: 9px 11px;
            border: 0;
            border-left: 3px solid #C24400;
            border-radius: 0 8px 8px 0;
            background-color: transparent;
            background-image: linear-gradient(90deg, rgba(194, 68, 0, .075), rgba(194, 68, 0, 0));
            color: #2c4285;
            font-family: inherit;
            font-size: 11.5px;
            font-style: italic;
            font-weight: 400;
            line-height: 1.5;
            letter-spacing: normal;
            text-transform: none;
        }

        .premium-authors-widget .widget-author-item blockquote.widget-author-motto::before,
        .premium-authors-widget .widget-author-item blockquote.widget-author-motto::after {
            content: none;
        }

        .premium-authors-widget .widget-author-motto .motto-label {
            display: block;
            margin: 0 0 3px;
            font-size: 9.5px;
            font-style: normal;
            font-weight: 700;
            letter-spacing: .08em;
            text-transform: uppercase;
            color: #9aa2b1;
            opacity: 1;
        }

        /* ---------- Aktionen ---------- */
        .premium-authors-widget .widget-author-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

        .premium-authors-widget .widget-contact-btn,
        .premium-authors-widget .widget-view-all {
            flex: 1 1 100px;
            min-width: 0;
            margin: 0;
            padding: 8px 11px;
            border-radius: 999px;
            font-size: 11.5px;
            font-weight: 600;
            line-height: 1.2;
            white-space: nowrap;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 5px;
            cursor: pointer;
            text-decoration: none;
            transition: background-color .2s ease, border-color .2s ease, color .2s ease;
        }

        .premium-authors-widget .widget-contact-btn {
            background: #1B3A8C;
            border: 1px solid #1B3A8C;
            color: #fff;
        }

        .premium-authors-widget .widget-contact-btn:hover {
            background: #C24400;
            border-color: #C24400;
            color: #fff;
            transform: none;
            box-shadow: none;
        }

        .premium-authors-widget .widget-contact-btn svg {
            flex: 0 0 auto;
            width: 13px;
            height: 13px;
        }

        .premium-authors-widget .widget-view-all {
            background: #fff;
            border: 1px solid #d9dfea;
            color: #1B3A8C;
        }

        .premium-authors-widget .widget-view-all:hover {
            background: #f5f7fc;
            border-color: #1B3A8C;
            color: #1B3A8C;
            padding: 8px 11px;
        }

        .premium-authors-widget .widget-view-all .wva-arrow {
            display: inline-block;
            transition: transform .2s ease;
        }

        .premium-authors-widget .widget-view-all:hover .wva-arrow {
            transform: translateX(3px);
        }

        /* ---------- Sehr schmale Container ---------- */
        @container (max-width: 219px) {
            .premium-authors-widget .widget-author-header {
                gap: 10px;
            }

            .premium-authors-widget .widget-author-avatar img {
                width: 52px;
                height: 52px;
            }

            .premium-authors-widget .widget-contact-btn,
            .premium-authors-widget .widget-view-all {
                flex: 1 1 100%;
            }
        }

        @media (prefers-reduced-motion: reduce) {
            .premium-authors-widget * {
                transition: none !important;
            }
        }

        /* ===== Ende Neufassung ===== */
    

    /* 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;
        }
    }
    

        /* Autoren-Intro-Box Styles - Optimiert für Symmetrie */
        .author-intro-box {
            background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
            border: 1px solid #dee2e6;
            border-left: 4px solid #C24400;
            border-radius: 12px;
            padding: 25px;
            margin: 20px 0 30px 0;
            box-shadow: 0 4px 12px rgba(0,0,0,0.08);
            transition: all 0.3s ease;
            position: relative;
            /* Symmetrie für nachfolgende Elemente */
            margin-bottom: 40px;
        }
        
        .author-intro-box::before {
            content: '';
            position: absolute;
            top: -1px;
            right: -1px;
            bottom: -1px;
            left: -1px;
            background: linear-gradient(135deg, #C24400, #1B3A8C, #C24400);
            border-radius: 12px;
            z-index: -1;
            opacity: 0;
            transition: opacity 0.3s ease;
        }
        
        .author-intro-box:hover::before {
            opacity: 0.1;
        }
        
        .author-intro-box:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 20px rgba(0,0,0,0.12);
        }
        
        .author-intro-content {
            display: flex;
            align-items: flex-start;
            gap: 25px;
        }
        
        .author-intro-avatar {
            flex-shrink: 0;
        }
        
        .author-intro-avatar img {
            width: 160px !important;
            height: 160px !important;
            border-radius: 50%;
            border: 4px solid #C24400;
            object-fit: cover;
            transition: transform 0.3s ease;
            box-shadow: 0 4px 15px rgba(194, 68, 0, 0.2);
        }
        
        .author-intro-avatar:hover img {
            transform: scale(1.05);
            box-shadow: 0 6px 20px rgba(194, 68, 0, 0.3);
        }
        
        .author-intro-text {
            flex: 1;
        }
        
        .intro-message {
            margin: 0 0 15px 0;
            font-size: 17px;
            line-height: 1.6;
            color: #495057;
            /* Motivierende Hervorhebung */
            font-weight: 500;
        }
        
        .intro-message strong {
            color: #1B3A8C;
            font-weight: 600;
        }
        
        .intro-message a {
            color: #1B3A8C;
            text-decoration: none;
            transition: color 0.3s ease;
            /* Zusätzliche Hervorhebung für Namen */
            text-shadow: 0 1px 2px rgba(27, 58, 140, 0.1);
        }
        
        .intro-message a:hover {
            color: #C24400;
            text-shadow: 0 1px 2px rgba(194, 68, 0, 0.2);
        }
        
        /* Fachgebiete in Orange */
        .specialties-highlight {
            color: #C24400 !important;
            font-weight: 700;
        }
        
        /* Abschlusstext */
        .intro-closing {
            margin: 15px 0 0 0;
            font-size: 16px;
            line-height: 1.5;
            color: #1B3A8C;
            font-style: italic;
            padding: 12px 0;
            border-top: 2px solid rgba(194, 68, 0, 0.2);
        }
        
        .intro-closing strong {
            color: #C24400;
            font-weight: 700;
        }
        
        .author-intro-contact-inline {
            margin: 15px 0;
        }
        
        .intro-contact-btn {
            background: #1B3A8C;
            color: white;
            border: none;
            padding: 10px 20px;
            border-radius: 25px;
            cursor: pointer;
            font-weight: 500;
            font-size: 14px;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            transition: all 0.3s ease;
            box-shadow: 0 3px 10px rgba(27, 58, 140, 0.3);
        }
        
        .intro-contact-btn:hover {
            background: #C24400;
            transform: translateY(-2px);
            box-shadow: 0 6px 20px rgba(194, 68, 0, 0.4);
        }
        
        .intro-contact-btn svg {
            transition: transform 0.3s ease;
        }
        
        .intro-contact-btn:hover svg {
            transform: scale(1.1);
        }
        
        /* Kontaktformular Modal für Intro */
        .intro-contact-modal {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            z-index: 99999;
            align-items: center;
            justify-content: center;
        }
        
        .intro-contact-modal.active {
            display: flex;
        }
        
        .intro-contact-form {
            background: white;
            padding: 30px;
            border-radius: 15px;
            max-width: 500px;
            width: 90%;
            max-height: 90vh;
            overflow-y: auto;
            position: relative;
            box-shadow: 0 20px 40px rgba(0,0,0,0.15);
        }
        
        .intro-contact-form h4 {
            margin: 0 0 20px 0;
            color: #1B3A8C;
            font-size: 20px;
        }
        
        .intro-form-group {
            margin-bottom: 15px;
        }
        
        .intro-form-group label {
            display: block;
            margin-bottom: 5px;
            color: #1B3A8C;
            font-weight: 500;
            font-size: 14px;
        }
        
        .intro-form-group input,
        .intro-form-group textarea {
            width: 100%;
            padding: 10px 12px;
            border: 2px solid #e2e8f0;
            border-radius: 8px;
            font-size: 14px;
            transition: border-color 0.3s ease;
            box-sizing: border-box;
        }
        
        .intro-form-group input:focus,
        .intro-form-group textarea:focus {
            outline: none;
            border-color: #C24400;
        }
        
        .intro-form-actions {
            display: flex;
            gap: 10px;
            margin-top: 20px;
        }
        
        .intro-send-btn {
            background: #C24400;
            color: white;
            border: none;
            padding: 10px 25px;
            border-radius: 25px;
            cursor: pointer;
            font-weight: 600;
            transition: all 0.3s ease;
        }
        
        .intro-send-btn:hover:not(:disabled) {
            background: #1B3A8C;
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(27, 58, 140, 0.4);
        }
        
        .intro-send-btn:disabled {
            opacity: 0.6;
            cursor: not-allowed;
        }
        
        .intro-cancel-btn {
            background: transparent;
            color: #666;
            border: 2px solid #e2e8f0;
            padding: 10px 25px;
            border-radius: 25px;
            cursor: pointer;
            font-weight: 500;
            transition: all 0.3s ease;
        }
        
        .intro-cancel-btn:hover {
            border-color: #1B3A8C;
            color: #1B3A8C;
        }
        
        .intro-form-message {
            margin-top: 15px;
            padding: 10px;
            border-radius: 8px;
            font-size: 14px;
        }
        
        .intro-form-message.success {
            background: #d4edda;
            color: #155724;
            border: 1px solid #c3e6cb;
        }
        
        .intro-form-message.error {
            background: #f8d7da;
            color: #721c24;
            border: 1px solid #f5c6cb;
        }
        
        /* Shortcode Variante */
        .author-intro-shortcode .author-intro-box {
            margin: 30px 0;
            background: linear-gradient(135deg, #fff 0%, #f8f9fa 100%);
            border-color: #1B3A8C;
            border-left-color: #C24400;
        }
        
        .author-intro-shortcode .author-intro-contact-inline {
            text-align: left;
        }
        
        /* Responsive Design */
        @media (max-width: 768px) {
            .author-intro-content {
                flex-direction: column;
                text-align: center;
                gap: 20px;
            }
            
            .author-intro-avatar {
                margin: 0 auto;
            }
            
            .author-intro-avatar img {
                width: 120px !important;
                height: 120px !important;
                border-width: 3px;
            }
            
            .intro-message {
                font-size: 16px;
            }
            
            .author-intro-contact-inline {
                text-align: center;
            }
            
            .intro-contact-btn {
                padding: 10px 20px;
                font-size: 13px;
            }
        }
        
        @media (max-width: 480px) {
            .author-intro-box {
                margin-left: -20px;
                margin-right: -20px;
                border-radius: 0;
                border-left-width: 4px;
                border-right: none;
                padding: 20px;
            }
            
            .author-intro-content {
                gap: 15px;
            }
            
            .author-intro-avatar img {
                width: 100px !important;
                height: 100px !important;
                border-width: 3px;
            }
            
            .intro-message {
                font-size: 15px;
            }
            
            .intro-closing {
                font-size: 14px;
            }
            
            .intro-contact-btn {
                padding: 8px 16px;
                font-size: 12px;
            }
            
            /* Mobile Symmetrie-Fixes */
            .author-intro-box + * {
                text-align: center !important;
            }
        }
        
        /* Layout-Container nach Author-Box zentrieren */
        .author-intro-box ~ .aligncenter,
        .author-intro-box ~ .wp-block-image.aligncenter,
        .author-intro-box ~ figure.aligncenter {
            margin-left: auto !important;
            margin-right: auto !important;
            text-align: center !important;
        }
        
        /* Universelle Zentrierung für nachfolgende Blöcke */
        .author-intro-box + .wp-block-group,
        .author-intro-box + .wp-block-columns {
            margin-left: auto !important;
            margin-right: auto !important;
        }
        
        /* Symmetrie-Fixes für nachfolgende Elemente */
        .author-intro-box + * {
            margin-top: 0 !important;
        }
        
        .author-intro-box + .entry-content,
        .author-intro-box + .post-content,
        .author-intro-box + img,
        .author-intro-box + figure,
        .author-intro-box + .wp-block-image {
            margin-top: 40px !important;
        }
        
        /* Badge/Tag Symmetrie direkt nach Author Box */
        .author-intro-box + .entry-tags,
        .author-intro-box + .post-tags,
        .author-intro-box + .entry-categories,
        .author-intro-box + .post-categories {
            margin-top: 20px !important;
            margin-bottom: 20px !important;
            text-align: left;
        }
        
        /* Teaser-Bild Symmetrie */
        .author-intro-box ~ img:first-of-type,
        .author-intro-box ~ .wp-block-image:first-of-type,
        .author-intro-box ~ figure:first-of-type {
            margin-left: auto !important;
            margin-right: auto !important;
            display: block !important;
            text-align: center !important;
        }
        
        /* Dark Mode Support */
        @media (prefers-color-scheme: dark) {
            .author-intro-box {
                background: linear-gradient(135deg, #2d3238 0%, #1a1d20 100%);
                border-color: #495057;
                color: #e9ecef;
            }
            
            .intro-message {
                color: #e9ecef;
            }
            
            .intro-message strong {
                color: #ffc107;
            }
            
            .intro-message a {
                color: #ffc107;
            }
            
            .intro-message a:hover {
                color: #C24400;
            }
            
            .intro-closing {
                color: #ffc107;
            }
        }
        
        body.dark-mode .author-intro-box {
            background: linear-gradient(135deg, #2d3238 0%, #1a1d20 100%);
            border-color: #495057;
            color: #e9ecef;
        }
        
        body.dark-mode .intro-message {
            color: #e9ecef;
        }
        
        body.dark-mode .intro-message strong {
            color: #ffc107;
        }
        
        body.dark-mode .intro-message a {
            color: #ffc107;
        }
        
        body.dark-mode .intro-message a:hover {
            color: #C24400;
        }
        
        body.dark-mode .intro-closing {
            color: #ffc107;
        }
    

@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; }
}


/* ------------------------------------------------------------------ 1) Initiale
   .stm-drop-cap::first-letter stand auf line-height .8 (67,2 px) plus margin-top
   .05em (4,2 px) = 71,4 px. Zwei Textzeilen sind 70 px hoch — die Box ragte also
   1,4 px in die DRITTE Zeile und zog sie in den Umfluss. Ergebnis: unter der
   Initiale klaffte eine 25 px hohe Lücke. Gilt auf Telefon UND Desktop gleich,
   deshalb ohne Media Query. Mit .76 + .04em ist die Box 67,2 px hoch. */
/* Höhere Spezifität als die Ursprungsregel: die steht in einem Stylesheet, das
   NACH wp_head ausgegeben wird — bei Gleichstand gewinnt dort die spätere. */
body.single-post p.stm-drop-cap::first-letter {
    line-height: .76 !important;
    margin-top: .04em !important;
}

/* ------------------------------------------- 2) Inhaltsverzeichnis: eine Zeile
   Die Teile des Kopfes waren in em bemessen (.8em, .7em, 1.05em), wurden aber von
   ".entry-content …{font-size:18px !important}" alle auf 18 px gehoben — bei
   gleicher Spezifität gewinnt die spätere Regel. Der Kopf brauchte damit 280 px
   bei 261 verfügbaren, und "10 Kapitel" brach in zwei Zeilen um. Feste Größen mit
   höherer Spezifität stellen die gedachte Staffelung wieder her. */
.stm-toc .stm-toc-header .stm-toc-icon   { font-size: 17px !important; }
.stm-toc .stm-toc-header .stm-toc-title  { font-size: 17px !important; min-width: 0 !important; }
.stm-toc .stm-toc-header .stm-toc-count  { font-size: 14px !important; white-space: nowrap !important; flex: 0 0 auto !important; }
.stm-toc .stm-toc-header .stm-toc-toggle { font-size: 12px !important; flex: 0 0 auto !important; }
@media (max-width: 768px) {
    .stm-toc .stm-toc-header { padding: 1em .9em !important; }
    .stm-toc .stm-toc-header .stm-toc-icon { margin-right: .45em !important; }
}

/* ------------------------------------------ 3) Autoren-Intro grenzt oben an
   Zwischen Hero und grauem Kasten lagen 71 px: 30 px margin-bottom des Heros,
   20 px margin-top der Box, 20 px Polster. Margin und Polster der Box selbst
   reagieren nicht (auch nicht per Inline-Style mit !important) — der Weg, der
   messbar wirkt, führt über den Hero und über das innere Element. */
@media (max-width: 768px) {
    .single-post .stm-ph-wrapper       { margin-bottom: 0 !important; }
    .single-post .author-intro-content { margin-top: -40px !important; }

    /* Das Portraet ragt in den Hero hinein (Kundenwunsch 08.09.2026). Es steht
       im Fluss, das negative margin zieht also alles darunter mit nach oben -
       erwuenscht: der Abstand zwischen Bild und Text bleibt so bei 15 px.
       position/z-index, damit es ueber der dunklen Flaeche liegt und nicht von
       einem spaeteren Stapelkontext verdeckt wird. */
    .single-post .author-intro-avatar {
        margin-top: -55px !important;
        position: relative !important;
        z-index: 3 !important;
    }
}

/* ---------------------------------------------------- 4) Krumen im Beitrags-Hero
   Vier Zeilen auf dem Telefon: der Kategoriename trägt einen Claim, der Titel
   stand mit acht Wörtern in der Kette, und die geerbte Zeilenhöhe war 28 px bei
   12 px Schrift. Die Namenskürzung passiert in stm-post-header.php. */
@media (max-width: 768px) {
    .stm-ph-breadcrumbs { margin-bottom: 14px !important; }
    .stm-ph-breadcrumbs li {
        line-height: 1.5 !important;
        font-size: 11.5px !important;
    }
    /* Die aktuelle Seite bleibt einzeilig und wird bei Bedarf beschnitten */
    .stm-ph-breadcrumbs li[aria-current="page"] {
        min-width: 0 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}

.stm-auto-related-image img{aspect-ratio:4/3!important;object-fit:cover!important;width:100%!important;height:auto!important;display:block!important}.stm-auto-related-image{width:340px!important;max-width:38%!important}.stm-teaser-clear{clear:both!important;display:block!important;height:0!important;margin:0!important;padding:0!important;border:0!important;font-size:0!important;line-height:0!important}body .stm-auto-related-image .stm-teaser-label{display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;font-size:0.72em!important;letter-spacing:0.04em!important;line-height:1.3!important;margin:0 0 4px 0!important;opacity:0.75!important}body .stm-auto-related-image .stm-teaser-title{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;line-height:1.4!important;min-height:2.8em!important}body .stm-auto-related-image .stm-teaser-body{padding:9px 12px 11px!important}@media (max-width:980px){.stm-auto-related-image{float:none!important;width:100%!important;max-width:420px!important;margin:24px 0 28px 0!important}}

@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;}

/* ============================================
   STM POST HEADER – SEO Edition
   Akzent: #F9A825
   ============================================ */

/* Original The7 Page-Title + Featured Image komplett verbergen (unser Header zeigt beides) */
.single-post .page-title {
    display: none !important;
}
/* Theme-Breadcrumbs auf Single Posts verbergen (unser Header hat eigene) */
.single-post .stm-breadcrumb-container {
    display: none !important;
}
/* The7 Featured Image – alle bekannten Selektoren */
.single-post .post-thumbnail,
.single-post .dt-post-media-wrap,
.single-post .entry-thumbnail,
.single-post .single-post-thumbnail,
.single-post article > .post-thumbnail,
.single-post .post-media,
.single-post .dt-media-container,
.single-post .dt-post-featured-image,
.single-post .the7-single-post-thumbnail,
.single-post .dt-featured-image,
.single-post article > .dt-post-media-wrap,
.single-post .wf-container .post-thumbnail {
    display: none !important;
}

/* ---- NEUER HEADER (server-seitig gerendert) ---- */
.stm-ph-wrapper {
    position: relative;
    overflow: hidden;
    background: linear-gradient(160deg, #0a0e27 0%, #0d1340 35%, #0a0e27 70%, rgba(249,168,37,.12) 100%);
    border-bottom: 3px solid transparent;
    border-image: linear-gradient(90deg, #F9A825, #F9A82580 40%, transparent 80%) 1;
    /* Full-Bleed: aus dem Content-Container ausbrechen */
    width: 100vw;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 30px;
    /* Scrollbar-Kompensation */
    max-width: 100vw;
}

/* Dezentes Grid-Pattern */
.stm-ph-wrapper::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
    z-index: 0;
}

/* Partikel-Canvas */
#stm-ph-particles {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
}

/* Akzent-Glow */
.stm-ph-wrapper::after {
    content: '';
    position: absolute;
    top: -80px; right: -80px;
    width: 350px; height: 350px;
    border-radius: 50%;
    background: radial-gradient(circle, #F9A82522 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
    animation: stmPH_glowPulse 6s ease-in-out infinite;
}
@keyframes stmPH_glowPulse {
    0%, 100% { opacity: .6; transform: scale(1); }
    50%      { opacity: 1; transform: scale(1.15); }
}

/* Inner Container */
.stm-ph-inner {
    position: relative;
    z-index: 1;
    max-width: 1400px;
    margin: 0 auto;
    padding: 30px 20px 35px;
}

/* ---- Breadcrumbs ---- */
.stm-ph-breadcrumbs {
    margin-bottom: 18px;
}
.stm-ph-breadcrumbs ol {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    margin: 0;
    padding: 0;
}
.stm-ph-breadcrumbs li {
    font-size: 12px;
    color: rgba(255,255,255,.4);
}
.stm-ph-breadcrumbs li + li::before {
    content: '›';
    margin: 0 6px;
    opacity: .4;
}
.stm-ph-breadcrumbs a {
    color: rgba(255,255,255,.5);
    text-decoration: none;
    transition: color .2s;
}
.stm-ph-breadcrumbs a:hover {
    color: #F9A825;
}
/* Zusammengefaltete Mitte: auf dem Desktop unnoetig, dort steht die volle Kette. */
.stm-ph-breadcrumbs li.stm-ph-fold {
    display: none;
}
@media (max-width: 768px) {
    .stm-ph-breadcrumbs li.stm-ph-mid { display: none; }
    .stm-ph-breadcrumbs li.stm-ph-fold { display: list-item; }
    /* Der Beitrag steht in einer eigenen Zeile. Sonst rutscht beim Umbruch der
       Trenner allein an den Zeilenanfang ("› Agentic Commerce…"). */
    .stm-ph-breadcrumbs li[aria-current="page"] {
        display: block;
        width: 100%;
        margin-top: 1px;
    }
    .stm-ph-breadcrumbs li[aria-current="page"]::before { content: none; }
}

/* ---- Kategorie-Badge ---- */
.stm-ph-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    border-radius: 6px;
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .8px;
    margin-bottom: 14px;
    background: #F9A82518;
    color: #F9A825;
    border: 1px solid #F9A82530;
    text-decoration: none;
    transition: background .3s;
}
.stm-ph-badge:hover {
    background: #F9A82528;
    color: #F9A825;
}
.stm-ph-badge-icon { font-size: .95rem; }

/* ---- Zwei-Spalten-Layout ---- */
.stm-ph-columns {
    display: flex;
    align-items: flex-start;
    gap: 40px;
}
.stm-ph-content {
    flex: 1;
    min-width: 0;
}

/* ---- Featured Image (rechte Spalte – schwebend) ---- */
.stm-ph-featured {
    flex-shrink: 0;
    width: 380px;
    position: relative;
    cursor: default;
    overflow: visible;
    border-radius: 16px;
    animation: stmPH_imgFloat .6s ease-out .1s both;
    align-self: center;
    margin-right: -20px;
    transform: translateY(-8px) rotate(1.5deg);
    transition: transform .5s cubic-bezier(.25,.46,.45,.94);
}
.stm-ph-featured:hover {
    transform: translateY(-14px) rotate(0deg);
}

/* Schwebender Schatten */
.stm-ph-featured::before {
    content: '';
    position: absolute;
    inset: 15px 20px -12px 20px;
    background: #F9A82530;
    border-radius: 20px;
    filter: blur(25px);
    z-index: -1;
    transition: filter .5s ease, inset .5s ease;
}
.stm-ph-featured:hover::before {
    filter: blur(35px);
    inset: 10px 15px -18px 15px;
}

/* Akzentfarben-Glow hinter dem Bild */
.stm-ph-featured::after {
    content: '';
    position: absolute;
    top: -6px;
    right: -6px;
    bottom: -6px;
    left: -6px;
    border-radius: 18px;
    background: linear-gradient(135deg, #F9A82525 0%, transparent 50%, #F9A82515 100%);
    z-index: -1;
    opacity: 0;
    transition: opacity .5s ease;
}
.stm-ph-featured:hover::after {
    opacity: 1;
}

.stm-ph-featured-img {
    width: 100%;
    max-height: 300px;
    object-fit: contain;
    object-position: center;
    display: block;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    box-shadow:
        0 20px 50px rgba(0,0,0,.4),
        0 0 0 1px rgba(255,255,255,.06);
    transition: box-shadow .5s ease;
}
.stm-ph-featured:hover .stm-ph-featured-img {
    box-shadow:
        0 25px 60px rgba(0,0,0,.5),
        0 0 0 1px rgba(255,255,255,.1),
        0 0 40px #F9A82515;
}

/* Hover-Overlay */
.stm-ph-featured-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 40%, rgba(0,0,0,.8) 100%);
    display: flex;
    align-items: flex-end;
    padding: 18px;
    border-radius: 14px;
    opacity: 0;
    transition: opacity .4s ease;
    pointer-events: none;
}
.stm-ph-featured:hover .stm-ph-featured-overlay {
    opacity: 1;
}
.stm-ph-featured-overlay-text {
    color: #fff;
    font-size: .78rem;
    line-height: 1.5;
    font-weight: 400;
    text-shadow: 0 1px 3px rgba(0,0,0,.5);
}

/* Verbindungslinie Text ↔ Bild */
.stm-ph-columns::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 60px;
    height: 1px;
    background: linear-gradient(90deg, #F9A82540, transparent);
    transform: translateX(-30px);
    pointer-events: none;
    opacity: .5;
}
.stm-ph-columns { position: relative; }

@keyframes stmPH_imgFloat {
    from { opacity: 0; transform: translateY(30px) rotate(3deg); }
    to   { opacity: 1; transform: translateY(-8px) rotate(1.5deg); }
}

/* ---- H1 Titel ---- */
.stm-ph-wrapper h1 {
    color: #ffffff;
    font-size: 2.2rem;
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 14px;
    max-width: 900px;
    animation: stmPH_fadeUp .6s ease-out both;
}
@keyframes stmPH_fadeUp {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ---- Subtitle / Excerpt ---- */
.stm-ph-subtitle {
    color: #ffbf42;
    font-size: 1.15rem;
    line-height: 1.55;
    max-width: 720px;   /* auf zwei Zeilen ausgelegt (typ. 140-165 Zeichen) */
    text-wrap: balance;
    margin: 0 0 18px;
    animation: stmPH_fadeUp .6s ease-out .12s both;
}

/* ---- CTA "Jetzt lesen" ---- */
.stm-ph-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #fff;
    font-size: .82rem;
    font-weight: 600;
    text-decoration: none;
    padding: 7px 18px;
    border-radius: 20px;
    background: #F9A82530;
    border: 1px solid #F9A82550;
    margin-bottom: 20px;
    transition: background .3s, border-color .3s, transform .2s;
    animation: stmPH_fadeUp .6s ease-out .16s both;
}
.stm-ph-cta:hover {
    background: #F9A82550;
    border-color: #F9A825;
    color: #fff;
    transform: translateY(2px);
}

/* Anker-Scroll-Offset (Platz für fixiertes Menü) */
#artikel-start {
    scroll-margin-top: 80px;
}

/* ---- Meta-Leiste ---- */
.stm-ph-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 12px;
}

/* Autor-Chip */
.stm-ph-author {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,.06);
    padding: 6px 14px 6px 6px;
    border-radius: 30px;
    border: 1px solid rgba(255,255,255,.08);
    text-decoration: none;
    transition: border-color .3s;
}
.stm-ph-author:hover {
    border-color: #F9A82550;
}
.stm-ph-avatar {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    object-fit: cover;
    object-position: top;
    border: 2px solid #F9A82560;
}
.stm-ph-author-name {
    color: #fff;
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.2;
}
.stm-ph-author-role {
    color: rgba(255,255,255,.72);
    font-size: .8rem;
    font-weight: 400;
}

/* Meta-Pills */
.stm-ph-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .78rem;
    color: rgba(255,255,255,.55);
    background: rgba(255,255,255,.05);
    padding: 6px 12px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,.06);
    white-space: nowrap;
}
.stm-ph-pill-icon { font-size: .8rem; opacity: .7; }

/* Divider */
.stm-ph-divider {
    margin: 20px 0 0;
    border: none;
    height: 1px;
    background: linear-gradient(90deg, #F9A82550, #F9A82518 30%, rgba(255,255,255,.05) 60%, transparent);
    animation: stmPH_fadeUp .6s ease-out .32s both;
}

/* === RESPONSIVE === */
@media (max-width: 960px) {
    .stm-ph-featured { width: 300px; }
    .stm-ph-columns { gap: 25px; }
    .stm-ph-columns::after { display: none; }
}
@media (max-width: 768px) {
    .stm-ph-inner { padding: 22px 15px 28px; }
    .stm-ph-wrapper h1 { font-size: 1.6rem; }
    .stm-ph-subtitle { font-size: 1.02rem; max-width: 100%; }
    .stm-ph-meta { gap: 8px; }
    .stm-ph-pill { font-size: .72rem; padding: 4px 9px; }
    .stm-ph-avatar { width: 28px; height: 28px; }
    .stm-ph-featured { display: none; }
    .stm-ph-columns::after { display: none; }
}
@media (max-width: 480px) {
    .stm-ph-wrapper h1 { font-size: 1.35rem; }
    .stm-ph-inner { padding: 18px 12px 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .stm-ph-wrapper::after,
    .stm-ph-wrapper h1,
    .stm-ph-subtitle,
    .stm-ph-meta,
    .stm-ph-divider,
    .stm-ph-featured {
        animation: none !important;
        opacity: 1 !important;
        transform: none !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}
}

#stmJmBtn{top:auto!important;bottom:28px!important;transform:none!important}#stmJmGreet{top:auto!important;bottom:28px!important;transform:none!important}#stmJmPanel{top:auto!important;bottom:20px!important;transform:none!important;max-height:calc(100vh - 40px)!important}@media (max-width:880px){#stmJmBtn{bottom:18px!important}#stmJmGreet{bottom:18px!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);
}



    /* ============================================
       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;
    }
    
