:root { --primary-color: #00BFFF; /* Deep Sky Blue */ --secondary-color: #00E5EE; /* Cyan */ --background-color: #0D1117; /* Rich Black */ --surface-color: #161B22; /* Darker Gray */ --text-color: #E6EDF3; /* Light Gray */ --border-color: #30363D; --border-radius: 0.5rem; --shadow-color: rgba(0, 191, 255, 0.5); } body { font-family: 'Orbitron', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; background-color: var(--background-color); color: var(--text-color); } .navbar { background-color: rgba(13, 17, 23, 0.8); backdrop-filter: blur(10px); transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out; } .navbar-scrolled { background-color: var(--surface-color); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .navbar .navbar-brand, .navbar .nav-link { color: var(--text-color); } .hero { color: white; background: var(--background-color); padding: 8rem 0; border-bottom: 1px solid var(--border-color); box-shadow: 0 5px 15px rgba(0,0,0,0.2); } .btn { border-radius: var(--border-radius); transition: all 0.3s ease; box-shadow: 0 0 5px var(--shadow-color); } .btn-primary { background-color: var(--primary-color); border-color: var(--primary-color); color: #fff; } .btn-primary:hover { box-shadow: 0 0 15px var(--shadow-color); transform: translateY(-2px); } .btn-secondary { background-color: transparent; border-color: var(--primary-color); color: var(--primary-color); } .btn-secondary:hover { background-color: var(--primary-color); color: #fff; } .section-icon { font-size: 2.5rem; color: var(--primary-color); text-shadow: 0 0 10px var(--shadow-color); } .card { background-color: var(--surface-color); border: 1px solid var(--border-color); border-radius: var(--border-radius); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); transition: transform 0.3s ease, box-shadow 0.3s ease; } .card:hover { transform: translateY(-5px); box-shadow: 0 0 20px var(--shadow-color); } .partner-logo { filter: grayscale(100%) brightness(3); opacity: 0.7; transition: opacity 0.3s ease; } .partner-logo:hover { opacity: 1; } .footer { background-color: var(--surface-color); border-top: 1px solid var(--border-color); } .form-control, .form-select { background-color: var(--surface-color); color: var(--text-color); border-color: var(--border-color); } .form-control:focus, .form-select:focus { background-color: var(--surface-color); color: var(--text-color); border-color: var(--primary-color); box-shadow: 0 0 5px var(--shadow-color); } .form-control::placeholder { color: #8B949E; } .text-muted { color: #8B949E !important; }