/* tp-extras.min.css — bundled 2026-05-18_23:27:03 */
/* SOURCE: tokens.css */
/*
 * TwoPixels Brand Design System — Tokens & Komponenten
 * Stand: 2026-05-16
 *
 * Diese Datei definiert globale Design-Tokens und wiederverwendbare Komponenten,
 * die in der gesamten Webseite einheitlich verwendet werden.
 */

:root {
    /* === Brand-Farben === */
    --tp-orange:        #E85D3F;
    --tp-orange-hover:  #F07654;
    --tp-orange-dark:   #D45436;
    --tp-orange-soft:   rgba(232, 93, 63, 0.08);
    --tp-orange-glow:   rgba(232, 93, 63, 0.25);

    /* === Neutral === */
    --tp-dark:          #2D3748;
    --tp-dark-gray:     #1A202C;
    --tp-text:          #4A5568;
    --tp-text-soft:     #718096;
    --tp-text-muted:    #A0AEC0;
    --tp-bg:            #F7FAFC;
    --tp-border:        #E2E8F0;
    --tp-border-soft:   #F1F2F4;
    --tp-white:         #FFFFFF;

    /* === Semantic === */
    --tp-success:       #48BB78;
    --tp-success-dark:  #2F855A;
    --tp-warning:       #ED8936;
    --tp-warning-dark:  #C05621;
    --tp-error:         #F56565;
    --tp-error-dark:    #C53030;
    --tp-info:          #4299E1;

    /* === Spacing === */
    --tp-space-1:       4px;
    --tp-space-2:       8px;
    --tp-space-3:       12px;
    --tp-space-4:       16px;
    --tp-space-5:       20px;
    --tp-space-6:       24px;
    --tp-space-8:       32px;
    --tp-space-10:      40px;
    --tp-space-12:      48px;
    --tp-space-16:      64px;
    --tp-space-20:      80px;

    /* === Border-Radius === */
    --tp-radius-sm:     8px;
    --tp-radius-md:     12px;
    --tp-radius-lg:     16px;
    --tp-radius-xl:     24px;
    --tp-radius-pill:   999px;

    /* === Shadows === */
    --tp-shadow-sm:     0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
    --tp-shadow-md:     0 8px 24px rgba(15, 23, 42, 0.08), 0 2px 4px rgba(15, 23, 42, 0.04);
    --tp-shadow-lg:     0 20px 48px rgba(15, 23, 42, 0.12), 0 4px 12px rgba(15, 23, 42, 0.06);
    --tp-shadow-glow:   0 0 0 4px var(--tp-orange-glow);
    --tp-shadow-orange: 0 8px 24px var(--tp-orange-glow);

    /* === Motion === */
    --tp-trans-fast:    all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    --tp-trans:         all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --tp-trans-slow:    all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    --tp-bounce:        all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);

    /* === Layout === */
    --tp-container:     1200px;
    --tp-container-sm:  720px;
}

/* === GLOBAL CARD COMPONENT (.tp-card) === */
.tp-card {
    background: var(--tp-white);
    border: 2px solid var(--tp-border);
    border-radius: var(--tp-radius-lg);
    padding: var(--tp-space-6) var(--tp-space-6) var(--tp-space-5);
    transition: var(--tp-bounce);
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.tp-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, var(--tp-orange-soft) 0%, transparent 60%);
    opacity: 0;
    transition: opacity 0.25s ease;
    z-index: 0;
}
.tp-card:hover {
    border-color: var(--tp-orange);
    transform: translateY(-3px);
    box-shadow: var(--tp-shadow-lg);
}
.tp-card:hover::before { opacity: 1; }
.tp-card > * { position: relative; z-index: 1; }

.tp-card-icon {
    width: 64px; height: 64px;
    border-radius: var(--tp-radius-md);
    background: linear-gradient(135deg, var(--tp-orange-soft) 0%, rgba(232, 93, 63, 0.04) 100%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 2.2rem;
    margin-bottom: var(--tp-space-4);
    transition: var(--tp-bounce);
}
.tp-card:hover .tp-card-icon {
    transform: scale(1.08) rotate(-3deg);
    background: linear-gradient(135deg, var(--tp-orange) 0%, var(--tp-orange-dark) 100%);
}

.tp-card-title {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--tp-dark);
    margin: 0 0 var(--tp-space-2);
    line-height: 1.3;
}
.tp-card-desc {
    font-size: 0.92rem;
    color: var(--tp-text);
    line-height: 1.55;
    margin: 0 0 var(--tp-space-4);
    flex-grow: 1;
}
.tp-card-badge {
    display: inline-block;
    padding: 5px 12px;
    background: var(--tp-orange-soft);
    color: var(--tp-orange);
    border-radius: var(--tp-radius-pill);
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    align-self: flex-start;
}

/* === GLOBAL HERO PATTERN (.tp-hero) === */
.tp-hero {
    position: relative;
    background: linear-gradient(135deg, var(--tp-dark) 0%, var(--tp-dark-gray) 100%);
    color: var(--tp-white);
    padding: var(--tp-space-20) 0 var(--tp-space-16);
    overflow: hidden;
    isolation: isolate;
}
.tp-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 20% 30%, var(--tp-orange-glow) 0%, transparent 50%),
                radial-gradient(circle at 80% 70%, rgba(232, 93, 63, 0.15) 0%, transparent 50%);
    z-index: -1;
}
.tp-hero-inner {
    position: relative;
    z-index: 2;
    text-align: center;
}
.tp-hero h1, .tp-hero .tp-h1 {
    font-size: clamp(2rem, 5vw, 3.4rem);
    font-weight: 700;
    line-height: 1.15;
    margin: 0 auto var(--tp-space-5);
    max-width: 880px;
    color: var(--tp-white);
    letter-spacing: -0.02em;
}
.tp-hero p, .tp-hero .tp-hero-sub {
    font-size: clamp(1rem, 2vw, 1.2rem);
    line-height: 1.6;
    max-width: 720px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.85);
}
.tp-hero-eyebrow {
    display: inline-block;
    padding: 8px 18px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--tp-radius-pill);
    font-size: 0.85rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    margin-bottom: var(--tp-space-5);
    letter-spacing: 0.02em;
}

/* === GLOBAL BUTTON (.tp-btn) === */
.tp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 28px;
    border-radius: var(--tp-radius-md);
    font-weight: 700;
    font-size: 1rem;
    text-decoration: none;
    cursor: pointer;
    transition: var(--tp-trans);
    border: none;
    font-family: inherit;
}
.tp-btn-primary {
    background: linear-gradient(135deg, var(--tp-orange) 0%, var(--tp-orange-dark) 100%);
    color: var(--tp-white);
    box-shadow: var(--tp-shadow-orange);
}
.tp-btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 32px var(--tp-orange-glow);
    color: var(--tp-white);
}
.tp-btn-ghost {
    background: transparent;
    color: var(--tp-text);
    border: 1px solid var(--tp-border);
}
.tp-btn-ghost:hover {
    background: var(--tp-bg);
    color: var(--tp-dark);
    border-color: var(--tp-text-soft);
}

/* === PILL/BADGE === */
.tp-pill {
    display: inline-block;
    padding: 5px 14px;
    background: var(--tp-orange-soft);
    color: var(--tp-orange);
    border-radius: var(--tp-radius-pill);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* === SECTION-EYE-CATCHER === */
.tp-section-eyebrow {
    text-align: center;
    color: var(--tp-orange);
    font-size: 0.84rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: var(--tp-space-3);
}
.tp-section-title {
    text-align: center;
    font-size: clamp(1.6rem, 3.5vw, 2.4rem);
    color: var(--tp-dark);
    margin: 0 auto var(--tp-space-4);
    max-width: 720px;
    line-height: 1.25;
    font-weight: 700;
}
.tp-section-sub {
    text-align: center;
    color: var(--tp-text);
    font-size: 1.05rem;
    max-width: 640px;
    margin: 0 auto var(--tp-space-10);
    line-height: 1.6;
}

/* === GRID HELPERS === */
.tp-grid { display: grid; gap: var(--tp-space-5); }
.tp-grid-2 { grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); }
.tp-grid-3 { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.tp-grid-4 { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }

/* === A11Y / Reduced Motion === */
@media (prefers-reduced-motion: reduce) {
    .tp-card:hover, .tp-btn:hover { transform: none; }
    * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* === BUTTON-COLOR-OVERRIDE (gegen globale a-color-Regeln) === */
a.tp-btn,
.tp-btn-primary,
a.tp-btn-primary,
.tp-anim-hero a.tp-btn-primary,
.tp-vhero a.tp-btn-primary {
    color: #FFFFFF !important;
}
a.tp-btn-primary:hover,
.tp-btn-primary:hover {
    color: #FFFFFF !important;
}
a.tp-btn-ghost,
.tp-btn-ghost {
    color: var(--tp-text) !important;
}
a.tp-btn-ghost:hover,
.tp-btn-ghost:hover {
    color: var(--tp-dark) !important;
}

/* === Bestehende .btn-Klassen-Sicherheit === */
a.btn-primary, .btn-primary,
a.btn-secondary, .btn-secondary {
    color: #FFFFFF !important;
}
a.btn-outline, .btn-outline {
    color: var(--primary-orange) !important;
}
a.btn-outline:hover, .btn-outline:hover {
    color: #FFFFFF !important;
}

/* Auch CTA-Section auf Buttons */
.cta-section a.btn,
.cta-section .btn {
    color: var(--primary-orange) !important;
}
.cta-section a.btn:hover,
.cta-section .btn:hover {
    color: var(--primary-orange-dark) !important;
}

/* SOURCE: factbox.css */
/* TwoPixels Faktenbox — Citation-Ready Komponente */
.tp-factbox {
    background: linear-gradient(135deg, #FFF8F4 0%, #FFFFFF 100%);
    border: 2px solid #E85D3F;
    border-radius: 16px;
    padding: 28px 32px;
    margin: 32px auto;
    max-width: 720px;
    box-shadow: 0 8px 24px rgba(232, 93, 63, 0.08);
}
.tp-factbox-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #2D3748;
    margin: 0 0 18px;
    padding-bottom: 12px;
    border-bottom: 2px solid rgba(232, 93, 63, 0.15);
    display: flex;
    align-items: center;
    gap: 10px;
}
.tp-factbox-title::before {
    content: '⚡';
    font-size: 1.1em;
    background: #E85D3F;
    color: #fff;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95em;
}
.tp-factbox-list {
    margin: 0;
    padding: 0;
}
.tp-factbox-row {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 16px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    align-items: baseline;
}
.tp-factbox-row:last-child {
    border-bottom: none;
}
.tp-factbox-row dt {
    font-weight: 600;
    color: #4A5568;
    font-size: 0.92rem;
}
.tp-factbox-row dd {
    color: #2D3748;
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.5;
}
.tp-factbox-row dd strong {
    color: #E85D3F;
    font-weight: 700;
}
.tp-factbox-note {
    margin: 16px 0 0;
    font-size: 0.82rem;
    color: #718096;
    font-style: italic;
}
@media (max-width: 640px) {
    .tp-factbox {
        padding: 20px 22px;
        margin: 24px auto;
    }
    .tp-factbox-row {
        grid-template-columns: 1fr;
        gap: 2px;
    }
    .tp-factbox-row dt {
        font-size: 0.85rem;
        color: #718096;
    }
}

/* SOURCE: faq.css */
/* TwoPixels FAQ-Sektion — GEO-optimiert */
.tp-faq-section {
    padding: 60px 0;
    background: linear-gradient(180deg, #FFFFFF 0%, #F7FAFC 100%);
}
.tp-faq-title {
    text-align: center;
    font-size: clamp(1.6rem, 3.5vw, 2.2rem);
    color: #2D3748;
    margin: 0 0 36px;
    font-weight: 700;
}
.tp-faq-list {
    max-width: 820px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.tp-faq-item {
    background: #fff;
    border: 1px solid #E2E8F0;
    border-radius: 14px;
    padding: 0;
    overflow: hidden;
    transition: all 0.25s ease;
}
.tp-faq-item:hover {
    border-color: #E85D3F;
    box-shadow: 0 6px 16px rgba(232, 93, 63, 0.08);
}
.tp-faq-item[open] {
    border-color: #E85D3F;
    box-shadow: 0 8px 24px rgba(232, 93, 63, 0.12);
}
.tp-faq-item summary {
    cursor: pointer;
    padding: 18px 24px 18px 56px;
    font-weight: 600;
    color: #2D3748;
    font-size: 1.02rem;
    list-style: none;
    position: relative;
    user-select: none;
}
.tp-faq-item summary::-webkit-details-marker { display: none; }
.tp-faq-item summary::before {
    content: '+';
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 26px;
    height: 26px;
    background: rgba(232, 93, 63, 0.1);
    color: #E85D3F;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1;
    transition: all 0.25s ease;
}
.tp-faq-item[open] summary::before {
    content: '−';
    background: #E85D3F;
    color: #fff;
    transform: translateY(-50%) rotate(180deg);
}
.tp-faq-answer {
    padding: 0 24px 22px 56px;
    color: #4A5568;
    line-height: 1.65;
    font-size: 0.95rem;
}
@media (max-width: 640px) {
    .tp-faq-section { padding: 40px 0; }
    .tp-faq-item summary {
        padding: 16px 20px 16px 48px;
        font-size: 0.96rem;
    }
    .tp-faq-answer {
        padding: 0 20px 18px 48px;
    }
}

/* SOURCE: scroll-fix.css */
/* === MOBILE SCROLL FIX V4 — Targeted, kein !important auf body-overflow === */

/* === HTML/BODY: nur explizite Properties, lässt JS-Toggles am Leben === */
html {
    overflow-x: clip;
    -webkit-text-size-adjust: 100%;
    touch-action: pan-y;
}
body {
    overflow-x: clip;
    overscroll-behavior-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* === Hero-Sections: Touch durchlassen, dekorative Layer sperren === */
.tp-anim-hero,
.tp-master-hero,
.jtl-hero,
.its-hero,
.hero-fullscreen {
    touch-action: pan-y !important;
    overflow-x: hidden;
}

/* === ALLE dekorativen Layer im Hero: kein Touch-Catch === */
.tp-anim-hero > *:not(.container):not(.tp-anim-hero-content),
.tp-master-hero > *:not(.container):not(.tp-master-content),
.jtl-hero > *:not(.container):not(.jtl-hero-inner) {
    pointer-events: none !important;
}

.tp-anim-mesh,
.tp-master-constellation,
.tp-master-badges,
.tp-master-badges > *,
.tp-master-cards,
.tp-master-cards > *,
.tp-master-backdrop,
.jtl-hero-bg,
.jtl-hero-bgimg,
.jtl-hero-blob,
section[class*="hero"] svg,
section[class*="hero"]::before,
section[class*="hero"]::after {
    pointer-events: none !important;
}

/* === Pseudo-Elemente niemals interaktiv === */
.tp-anim-hero::before,
.tp-anim-hero::after,
.tp-master-hero::before,
.tp-master-hero::after,
.jtl-hero::before,
.jtl-hero::after {
    pointer-events: none !important;
}

/* === Floating-Buttons: nur Tap, keine Scroll-Hijacks === */
.tp-sticky-cta,
.tp-sticky-cta *,
#tp-remote-float,
.back-to-top-btn,
.cookie-banner,
.cookie-banner button,
.woot-widget-bubble,
.woot--bubble-holder,
.a11y-toggle-btn,
.tp-ai-promo,
.tp-ai-promo * {
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: rgba(232, 93, 63, 0.2);
}

/* === Section-Container niemals Scroll-Block === */
section,
.jtl-section,
.jtl-cross-section,
.jtl-section-intro,
.jtl-section-alt,
.jtl-section-faq,
.jtl-cta-section,
.tp-sp-wall,
.tp-trust-strip,
.tp-faq-section {
    touch-action: pan-y;
}

/* === iOS-Safari spezifisch === */
@supports (-webkit-touch-callout: none) {
    body { -webkit-overflow-scrolling: touch; }
}

/* === Mobile-spezifisch === */
@media (max-width: 1024px) {
    section[class*="hero"] {
        contain: layout style paint;
    }
    .cookie-banner {
        max-height: 50vh;
        overflow-y: auto;
    }
}

/* === Listen + Grids niemals Scroll-Block === */
.jtl-list, .jtl-list li,
.jtl-cross-grid, .jtl-cross-grid li, .jtl-cross-grid a,
.tp-glossar-grid, .tp-glossar-card {
    touch-action: manipulation;
}

/* SOURCE: perf-fix.css */
/* === TwoPixels Performance-Fix V2 (2026-05-16) ===
   Korrigiert V1: Animationen bleiben, NUR backdrop-filter raus auf Mobile.
   Header behält Original-Style. */

/* === HOME-MASTERCLASS Mobile-Optimierung === */
@media (max-width: 1024px) {
    /* Tech-Badges: backdrop-filter weg → opaker rgba, Animation BLEIBT */
    .tp-master-badge {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(45, 55, 72, 0.78) !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.25);
    }

    /* Service-Cards: backdrop-filter weg → semi-opak background, Animation BLEIBT */
    .tp-master-card {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: linear-gradient(135deg, rgba(45,55,72,0.78) 0%, rgba(26,32,44,0.78) 100%) !important;
        box-shadow: 0 12px 24px rgba(0,0,0,0.25);
    }

    /* Eyebrow + Secondary-CTA: backdrop-filter weg */
    .tp-master-eyebrow {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(255,255,255,0.14) !important;
    }
    .tp-master-cta-secondary {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(255,255,255,0.18) !important;
    }

    /* Aurora-Filter: blur(80px) → blur(50px) auf Tablet/Mobile */
    .tp-master-hero::before {
        filter: blur(50px);
        opacity: 0.5;
        animation-duration: 36s !important;
    }
}

/* === Mobile (≤768px): noch etwas weniger === */
@media (max-width: 768px) {
    /* Aurora: noch weniger blur + langsamere Animation */
    .tp-master-hero::before {
        filter: blur(36px);
        opacity: 0.42;
        animation-duration: 48s !important;
    }

    /* Constellation: bleibt animiert, aber langsamer */
    .tp-master-constellation .star-bright {
        animation-duration: 5s !important;
    }

    /* Cards bleiben animiert (transform ist GPU-cheap) — keine !important off mehr */
}

/* === Will-change optimieren (nur dort wo wirklich nötig) === */
.tp-master-badge,
.tp-master-card,
.tp-anim-marketing .post-card,
.tp-anim-shop .product-card {
    will-change: auto;
}
.tp-master-hero::before,
.tp-anim-mesh {
    will-change: transform;
}

/* === ANIMATED-HEROES: nur backdrop-filter weg auf Mobile === */
@media (max-width: 768px) {
    .tp-anim-marketing .post-card,
    .tp-anim-marketing .social-bubble,
    .tp-anim-webdesign .wireframe,
    .tp-anim-webdesign .float-card,
    .tp-anim-shop .product-card,
    .tp-anim-app .phone {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

/* === Inline-Style .trust-badge: backdrop weg auf Mobile === */
@media (max-width: 1024px) {
    .trust-badge {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(255,255,255,0.92) !important;
    }
}

/* === Span-Blobs mit blur(70px+): nur auf Mobile reduzieren === */
@media (max-width: 768px) {
    span[style*="filter"][style*="blur"] {
        filter: blur(30px) !important;
        opacity: 0.35 !important;
    }
}

/* === Content-Visibility für off-screen Sections (Performance ohne Visual-Impact) === */
.tp-sp-wall,
.tp-trust-strip,
.tp-faq-section,
.jtl-section,
.jtl-cross-section,
section.section,
section[class*="extended-content"] {
    content-visibility: auto;
    contain-intrinsic-size: auto 500px;
}

/* === GPU-Hint nur auf Hero === */
.tp-master-hero {
    transform: translateZ(0);
}

/* === P1: Off-Screen-Pause via IntersectionObserver (perf-observer.js) === */
.tp-anim-paused,
.tp-anim-paused *,
.tp-anim-paused::before,
.tp-anim-paused::after {
    animation-play-state: paused !important;
}
/* Body-Klasse pausiert ALLES wenn Tab versteckt */
body.tp-anim-paused * {
    animation-play-state: paused !important;
}

/* === P2: Mobile-Layer-Reduktion — nur 1 Layer pro Hero auf <768px === */
@media (max-width: 768px) {
    /* Bridge: nur Nodes pulsen, keine Packet-Bewegung + nur 1 Linie */
    .tp-anim-bridge .packet,
    .tp-anim-bridge .line { animation: none !important; opacity: 0.3 !important; }

    /* Home: weniger Pixel pulsen — jeder 3. wird statisch */
    .tp-anim-home .pixel:nth-child(3n+1),
    .tp-anim-home .pixel:nth-child(3n+2) { animation: none !important; opacity: 0.18 !important; }

    /* WMS: Slot-Grid auf 1/3 reduzieren */
    .tp-anim-wms .slot:nth-child(n+21) { display: none !important; }
    .tp-anim-wms .slot:nth-child(3n+1),
    .tp-anim-wms .slot:nth-child(3n+2) { animation: none !important; }

    /* Security: nur 1 Scan-Line + 1 Code-Column */
    .tp-anim-security .scan-line:nth-child(n+2) { display: none !important; }
    .tp-anim-security .code-col:nth-child(n+3) { display: none !important; }

    /* AI-Content: Synapse-Flow weg, Neurons reduziert */
    .tp-anim-ai-content .synapse { animation: none !important; opacity: 0.25 !important; }
    .tp-anim-ai-content .neuron:nth-child(n+4) { display: none !important; }

    /* Marketing: nur 2 Social-Bubbles statt 4 */
    .tp-anim-marketing .social-bubble:nth-child(n+3) { display: none !important; }

    /* Shop: nur 2 Product-Cards */
    .tp-anim-shop .product-card:nth-child(n+3) { display: none !important; }

    /* Mesh-Background überall langsamer (Compositor-Last halbieren) */
    .tp-anim-mesh { animation-duration: 40s !important; }
}

/* === Verschärfte prefers-reduced-motion: ALLES stehen lassen === */
@media (prefers-reduced-motion: reduce) {
    [class*="tp-anim-"] *,
    [class*="tp-anim-"]::before,
    [class*="tp-anim-"]::after,
    .tp-anim-mesh {
        animation: none !important;
        transition: none !important;
    }
    /* Aurora/Mesh: ohne Bewegung statisch zeigen */
    .tp-anim-mesh { opacity: 0.6 !important; transform: scale(1.05); }
}