| @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); | |
| body { | |
| font-family: 'Inter', sans-serif; | |
| } | |
| .gradient-text { | |
| background: linear-gradient(90deg, #6366f1 0%, #8b5cf6 100%); | |
| -webkit-background-clip: text; | |
| background-clip: text; | |
| color: transparent; | |
| } | |
| .glass-card { | |
| background: rgba(255, 255, 255, 0.05); | |
| backdrop-filter: blur(10px); | |
| -webkit-backdrop-filter: blur(10px); | |
| border: 1px solid rgba(255, 255, 255, 0.1); | |
| } | |
| .space-bg { | |
| background: radial-gradient(circle at 50% 50%, rgba(30, 30, 60, 0.8) 0%, rgba(10, 10, 20, 0.9) 100%); | |
| } | |
| .orbit-animation { | |
| animation: orbit 20s linear infinite; | |
| } | |
| @keyframes orbit { | |
| 0% { transform: rotate(0deg) translateX(100px) rotate(0deg); } | |
| 100% { transform: rotate(360deg) translateX(100px) rotate(-360deg); } | |
| } | |
| .star-field { | |
| position: relative; | |
| overflow: hidden; | |
| } | |
| .star-field::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background-image: | |
| radial-gradient(2px 2px at 20px 30px, #eee, transparent), | |
| radial-gradient(2px 2px at 40px 70px, #fff, transparent), | |
| radial-gradient(1px 1px at 90px 40px, #ddd, transparent), | |
| radial-gradient(1px 1px at 130px 80px, #fff, transparent), | |
| radial-gradient(1.5px 1.5px at 160px 30px, #eee, transparent); | |
| background-repeat: repeat; | |
| background-size: 200px 100px; | |
| animation: twinkle 4s ease-in-out infinite alternate; | |
| } | |
| @keyframes twinkle { | |
| 0% { opacity: 0.3; } | |
| 100% { opacity: 0.8; } | |
| } | |
| .terminal-window { | |
| background: #1a1b26; | |
| border: 1px solid #2a2b3a; | |
| border-radius: 8px; | |
| font-family: 'Courier New', monospace; | |
| } | |
| .code-snippet { | |
| background: rgba(26, 27, 38, 0.8); | |
| border: 1px solid rgba(42, 43, 58, 0.5); | |
| border-radius: 6px; | |
| font-family: 'Courier New', monospace; | |
| } | |
| .hover-scale { | |
| transition: transform 0.3s ease; | |
| } | |
| .hover-scale:hover { | |
| transform: scale(1.03); | |
| } |