@keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideInDown { from { opacity: 0; transform: translateY(-30px); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideInLeft { from { opacity: 0; transform: translateX(-30px); } to { opacity: 1; transform: translateX(0); } }
@keyframes slideInRight { from { opacity: 0; transform: translateX(30px); } to { opacity: 1; transform: translateX(0); } }
@keyframes zoomIn { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } }
@keyframes bounceIn { 0% { opacity: 0; transform: scale(0.3); } 50% { opacity: 1; transform: scale(1.05); } 70% { transform: scale(0.9); } 100% { transform: scale(1); } }
@keyframes slideUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-30px); } to { opacity: 1; transform: translateY(0); } }

.product-image-main:hover { transform: scale(1.05) rotateY(2deg); }
.product-info-card:hover { box-shadow: 0 15px 40px rgba(220, 53, 69, 0.15); }
.info-badge { animation: bounceIn 0.6s ease-out; }
.info-item { animation: slideInRight 0.6s ease-out; }
.info-item:hover { padding-left: 10px; background: rgba(220, 53, 69, 0.05); }
.info-item:hover .info-icon { transform: scale(1.2) rotate(10deg); }

.feature-box::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(220, 53, 69, 0.1), transparent); transition: left 0.6s ease; }
.feature-box:hover::before { left: 100%; }
.feature-box:hover { transform: translateY(-8px) scale(1.02); box-shadow: 0 15px 40px rgba(220, 53, 69, 0.2); }
.feature-box:hover .feature-icon { transform: scale(1.3) rotate(15deg); }
.feature-box:hover .feature-title { color: #dc3545; }
.feature-box:hover .feature-text { color: #555; }

.section-title { animation: slideDown 0.6s ease-out; }
.section-title::after { animation: slideInRight 0.6s ease-out 0.3s both; }

.cta-button { animation: bounceIn 0.8s ease-out; }
.cta-button:hover { transform: translateY(-4px) scale(1.05); box-shadow: 0 15px 40px rgba(220, 53, 69, 0.4); }

.related-product-card { border-radius: 16px; position: relative; }
.related-product-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(135deg, #dc3545 0%, #c82333 100%); }
.related-product-card:hover { transform: translateY(-15px) scale(1.02); box-shadow: 0 25px 60px rgba(220, 53, 69, 0.3); }
.related-product-image { background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%); display: flex; align-items: center; justify-content: center; padding: 15px; }
.related-product-card:hover .related-product-image img { transform: scale(1.12) rotate(2deg); }
.related-product-card .card-body { animation: slideUp 0.6s ease-out 0.2s both; }
.related-product-card:hover .card-title { color: #dc3545; }
.related-product-card .btn-outline-primary:hover { background: linear-gradient(135deg, #dc3545 0%, #c82333 100%); border-color: #dc3545; color: white; transform: translateY(-2px); }

.nav-tabs { animation: slideDown 0.6s ease-out; }
.nav-tabs .nav-link:hover { transform: translateY(-3px); }
.tab-content { animation: fadeInUp 0.6s ease-out; }

.info-item:nth-child(1) { animation-delay: 0.1s; }
.info-item:nth-child(2) { animation-delay: 0.2s; }
.info-item:nth-child(3) { animation-delay: 0.3s; }
.info-item:nth-child(4) { animation-delay: 0.4s; }
.info-item:nth-child(5) { animation-delay: 0.5s; }

.feature-box:nth-child(1) { animation-delay: 0.1s; }
.feature-box:nth-child(2) { animation-delay: 0.2s; }
.feature-box:nth-child(3) { animation-delay: 0.3s; }
.feature-box:nth-child(4) { animation-delay: 0.4s; }

.related-product-card:nth-child(1) { animation-delay: 0.1s; }
.related-product-card:nth-child(2) { animation-delay: 0.2s; }
.related-product-card:nth-child(3) { animation-delay: 0.3s; }

.product-section { animation: fadeInUp 0.8s ease-out; }
.cta-section { animation: slideUp 0.8s ease-out; }
.cta-section h2 { animation: slideDown 0.6s ease-out; }
.cta-section p { animation: fadeInUp 0.6s ease-out 0.2s both; }
.cta-section .btn { animation: bounceIn 0.8s ease-out 0.4s both; }
