/** * Mercedes-Benz MYP Platform - Ausgewogene Raspberry Pi Performance Optimierungen * Optimierte Performance bei Erhaltung des visuellen Designs */ /* ===== SCHONENDE BROWSER OPTIMIERUNGEN ===== */ /* Reduzierte GPU-Layer Optimierung */ .professional-hero, .professional-container, .card-professional, .stat-card, .glass-card, .glass-modal { -webkit-backface-visibility: hidden; backface-visibility: hidden; } /* Entferne will-change nur bei problematischen Elementen */ .glass-base, .glass-strong, .glass-subtle { will-change: auto !important; } /* Sanfte Scroll-Performance */ html { scroll-behavior: auto; } body { overflow-x: hidden; -webkit-overflow-scrolling: touch; } /* ===== MODERATE ANIMATIONEN REDUZIERUNG ===== */ /* Verkürze Transitionen statt sie zu entfernen */ *, *::before, *::after { animation-duration: 0.2s !important; transition-duration: 0.15s !important; } /* Spezielle verkürzte Hover-Effekte */ .optimized-hover { transition: opacity 0.1s ease, background-color 0.1s ease, box-shadow 0.1s ease !important; } .optimized-hover:hover { opacity: 0.95; } /* ===== REDUZIERTE GLASSMORPHISM (nicht komplett entfernt) ===== */ /* Leichtere Glassmorphism-Effekte für bessere Performance */ .glass-base, .glass-strong, .glass-subtle, .glass-card, .glass-nav, .glass-btn, .glass-modal, .glass-input, .glass-dropdown, .mb-glass { backdrop-filter: blur(4px) !important; -webkit-backdrop-filter: blur(4px) !important; } /* Dark Mode: Noch reduzierter */ .dark .glass-base, .dark .glass-strong, .dark .glass-subtle, .dark .glass-card, .dark .glass-nav, .dark .glass-btn, .dark .glass-modal, .dark .glass-input, .dark .glass-dropdown, .dark .mb-glass { backdrop-filter: blur(2px) !important; -webkit-backdrop-filter: blur(2px) !important; } /* ===== MODERATE TRANSFORM OPTIMIERUNGEN ===== */ /* Reduziere nur problematische Transform-Hover-Effekte */ .professional-hero:hover, .professional-container:hover { transform: translateY(-1px) !important; /* Minimal statt -2px */ } .card-professional:hover, .stat-card:hover { transform: none !important; /* Diese waren am problematischsten */ } /* Behalte wichtige Navigation-Effekte */ .nav-item-professional:hover { transform: translateX(2px) !important; /* Reduziert von 4px */ } /* ===== LEICHTE SHADOW OPTIMIERUNGEN ===== */ /* Reduziere nur die schwersten Shadows */ .professional-hero, .professional-container, .card-professional, .stat-card { box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06) !important; } .dark .professional-hero, .dark .professional-container, .dark .card-professional, .dark .stat-card { box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15) !important; } /* ===== FONT RENDERING OPTIMIERUNG ===== */ body, * { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeSpeed; } /* ===== MEMORY OPTIMIERUNGEN ===== */ /* Image Optimierung */ img { image-rendering: auto; -webkit-backface-visibility: hidden; backface-visibility: hidden; } /* SVG Optimierung */ svg { shape-rendering: optimizeSpeed; } /* ===== MOBILE/TABLET OPTIMIERUNGEN ===== */ @media (max-width: 1024px) { /* Weitere Reduzierung für kleinere Geräte */ *, *::before, *::after { animation-duration: 0.1s !important; transition-duration: 0.1s !important; } /* Entferne backdrop-filter nur auf schwächeren Geräten */ .glass-base, .glass-strong, .glass-subtle, .glass-card, .glass-nav, .glass-btn, .glass-modal, .glass-input, .glass-dropdown, .mb-glass { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } } /* ===== REDUCED MOTION SUPPORT ===== */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } /* Entferne Glaseffekte für Nutzer mit reduced motion */ .glass-base, .glass-strong, .glass-subtle, .glass-card, .glass-nav, .glass-btn, .glass-modal, .glass-input, .glass-dropdown, .mb-glass { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } } /* ===== SELEKTIVE CPU INTENSIVE PROPERTIES OVERRIDE ===== */ /* Entferne nur die schwersten Filter */ .glass-professional { backdrop-filter: blur(6px) !important; -webkit-backdrop-filter: blur(6px) !important; } /* Vereinfache Border-Radius nur bei den größten Elementen */ .professional-hero { border-radius: 12px !important; } /* ===== PRINT OPTIMIERUNGEN ===== */ @media print { * { background: white !important; color: black !important; box-shadow: none !important; text-shadow: none !important; animation: none !important; transition: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } } /* ===== ANTI-FLICKER MASSNAHMEN ===== */ /* Verhindere Flackern bei Hover-Übergängen */ .card-professional, .stat-card, .professional-container, .nav-item-professional { transition: all 0.15s ease-out !important; } /* Sanftere Button-Transitionen */ .btn-professional, .btn-secondary-professional { transition: background-color 0.1s ease, box-shadow 0.1s ease !important; } /* ===== FINALER PERFORMANCE-BALANCE ===== */ /* Stelle sicher, dass die schwersten Performance-Killer reduziert sind */ .glass-overlay { backdrop-filter: blur(2px) !important; -webkit-backdrop-filter: blur(2px) !important; } .animate-slide-up, .animate-hover-lift, .animate-scale-in { animation-duration: 0.2s !important; transition: opacity 0.1s ease !important; } .hover-lift:hover { transform: translateY(-1px) !important; /* Reduziert von -2px */ }