html { scroll-behavior: smooth; } .profit-glow { text-shadow: 0 0 20px rgba(34, 211, 238, 0.5), 0 0 40px rgba(34, 211, 238, 0.3); transition: text-shadow 0.3s ease; } .risk-mask { mask-image: linear-gradient(to bottom, black 60%, transparent 100%); } .animate-pulse-slow { animation: pulse 3s ease-in-out infinite; } @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.7; } } .hover-scale { transition: transform 0.3s ease, box-shadow 0.3s ease; } .hover-scale:hover { transform: scale(1.05); box-shadow: 0 10px 20px rgba(0, 255, 255, 0.2); } .section-title { font-family: 'Space Grotesk', sans-serif; background: linear-gradient(45deg, #22d3ee, #3b82f6); -webkit-background-clip: text; background-clip: text; color: transparent; } .card-bg { background: linear-gradient(135deg, rgba(31, 41, 55, 0.8), rgba(17, 24, 39, 0.9)); backdrop-filter: blur(10px); transition: all 0.3s ease; } .button-glow { position: relative; overflow: hidden; } .button-glow::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.3), transparent ); transition: 0.5s; } .button-glow:hover::before { left: 100%; } .particles-section { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 0; } .cta-pulse { animation: ctaPulse 2s infinite; } @keyframes ctaPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(34, 211, 238, 0.7); } 50% { box-shadow: 0 0 0 10px rgba(34, 211, 238, 0); } } .font-quicksand { font-family: 'Quicksand', sans-serif; } /* Menu Styles */ nav { border-bottom: 1px solid rgba(34, 211, 238, 0.2); } .nav-link { position: relative; outline: none; box-shadow: none; transition: color 0.3s ease, text-shadow 0.3s ease, transform 0.3s ease; } .nav-link:hover, .nav-link:focus { color: #22d3ee; text-shadow: 0 0 10px rgba(34, 211, 238, 0.8); outline: none; box-shadow: none; } .nav-link::after { content: ''; position: absolute; bottom: -2px; left: 0; width: 0; height: 2px; background-color: #22d3ee; transition: width 0.3s ease; } .nav-link:hover::after { width: 100%; } #mobile-menu { transition: all 0.3s ease; } #mobile-menu.hidden { transform: translateY(-100%); opacity: 0; } #mobile-menu:not(.hidden) { transform: translateY(0); opacity: 1; } #mobile-menu a { display: block; padding: 8px 0; } #menu-toggle svg { transition: transform 0.3s ease; } #menu-toggle.active svg { transform: rotate(90deg); } /* Chart Styles */ .chart-container { position: relative; width: 100%; height: 400px; /* Tăng chiều cao để đẹp hơn trong section riêng */ }