Spaces:
Running
Running
| @import "tailwindcss"; | |
| html { | |
| scroll-behavior: smooth; | |
| } | |
| @keyframes fadeInUp { | |
| from { opacity: 0; transform: translateY(30px); } | |
| to { opacity: 1; transform: translateY(0); } | |
| } | |
| @keyframes fadeInLeft { | |
| from { opacity: 0; transform: translateX(-30px); } | |
| to { opacity: 1; transform: translateX(0); } | |
| } | |
| @keyframes fadeInRight { | |
| from { opacity: 0; transform: translateX(30px); } | |
| to { opacity: 1; transform: translateX(0); } | |
| } | |
| @keyframes float { | |
| 0%, 100% { transform: translateY(0px); } | |
| 50% { transform: translateY(-12px); } | |
| } | |
| @keyframes pulse-ring { | |
| 0% { box-shadow: 0 0 0 0 rgba(245,158,11,0.6); } | |
| 70% { box-shadow: 0 0 0 16px rgba(245,158,11,0); } | |
| 100% { box-shadow: 0 0 0 0 rgba(245,158,11,0); } | |
| } | |
| @keyframes gradient-x { | |
| 0%, 100% { background-position: 0% 50%; } | |
| 50% { background-position: 100% 50%; } | |
| } | |
| @keyframes blink { | |
| 0%, 100% { opacity: 1; } | |
| 50% { opacity: 0; } | |
| } | |
| @keyframes shimmer { | |
| 0% { background-position: -200% center; } | |
| 100% { background-position: 200% center; } | |
| } | |
| .animate-fade-up { animation: fadeInUp 0.7s ease both; } | |
| .animate-fade-left { animation: fadeInLeft 0.7s ease both; } | |
| .animate-fade-right { animation: fadeInRight 0.7s ease both; } | |
| .animate-float { animation: float 4s ease-in-out infinite; } | |
| .animate-pulse-ring { animation: pulse-ring 2s ease-out infinite; } | |
| .animate-gradient { background-size: 200% 200%; animation: gradient-x 5s ease infinite; } | |
| .animate-blink { animation: blink 1s step-end infinite; } | |
| .animate-shimmer { background-size: 200% auto; animation: shimmer 3s linear infinite; } | |
| .delay-100 { animation-delay: 0.1s; } | |
| .delay-200 { animation-delay: 0.2s; } | |
| .delay-300 { animation-delay: 0.3s; } | |
| .delay-400 { animation-delay: 0.4s; } | |
| .delay-500 { animation-delay: 0.5s; } | |
| .delay-600 { animation-delay: 0.6s; } | |
| .glass { | |
| background: rgba(255,255,255,0.04); | |
| backdrop-filter: blur(14px); | |
| -webkit-backdrop-filter: blur(14px); | |
| border: 1px solid rgba(255,255,255,0.08); | |
| } | |
| .card-hover { | |
| transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; | |
| } | |
| .card-hover:hover { | |
| transform: translateY(-6px); | |
| box-shadow: 0 24px 48px rgba(0,0,0,0.35); | |
| border-color: rgba(245,158,11,0.4); | |
| } | |
| ::-webkit-scrollbar { width: 5px; } | |
| ::-webkit-scrollbar-track { background: #0a1628; } | |
| ::-webkit-scrollbar-thumb { background: #f59e0b; border-radius: 3px; } | |