/* =================================== 动画 & 特效 =================================== */ /* 呼吸灯动画 */ @keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(0, 240, 255, 0.4); } 70% { box-shadow: 0 0 0 10px rgba(0, 240, 255, 0); } 100% { box-shadow: 0 0 0 0 rgba(0, 240, 255, 0); } } .instruction-hint { animation: pulse 2s infinite; } /* 卡片进场动画 */ @keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } .fade-in-up { animation: fadeInUp 0.6s ease-out; } /* 旋转加载动画 */ @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .rotating { animation: rotate 2s linear infinite; } /* 缩放脉冲动画 */ @keyframes scalePulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } } .scale-pulse { animation: scalePulse 2s ease-in-out infinite; } /* 淡入动画 */ @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fade-in { animation: fadeIn 0.5s ease-out; } /* 从左滑入 */ @keyframes slideInLeft { from { opacity: 0; transform: translateX(-30px); } to { opacity: 1; transform: translateX(0); } } .slide-in-left { animation: slideInLeft 0.5s ease-out; } /* 移动端性能优化 - 使用硬件加速 */ @media (max-width: 768px) { .company-card, .job-card, .segment-card { will-change: transform; transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; } } /* 减弱动画(针对低性能设备) */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } }