:root { --bg-color: #071426; --glass-bg: rgba(255, 255, 255, 0.08); --glass-border: rgba(255, 255, 255, 0.15); --overlay-gradient: linear-gradient(135deg, rgba(90, 0, 200, 0.35), rgba(0, 120, 255, 0.25), rgba(140, 0, 255, 0.25)); --text-color: white; --text-light: rgba(255, 255, 255, 0.5); --primary-hover: #9bddff; --placeholder-color: white; } body { background: var(--bg-color); font-family: 'Poppins', sans-serif; overflow-x: hidden; padding-top: 80px; } .aurora-overlay { position: fixed; inset: 0; background: var(--overlay-gradient); mix-blend-mode: screen; pointer-events: none; z-index: -1; } .glass { backdrop-filter: blur(14px); background: var(--glass-bg); border: 1px solid var(--glass-border); border-radius: 18px; transition: transform 0.3s ease, box-shadow 0.3s ease; } .glass:hover { transform: translateY(-5px); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3); } .section-title { color: var(--text-color); font-weight: 600; margin-bottom: 20px; } .project-card img { height: 180px; width: 100%; object-fit: cover; border-radius: 12px; } .project-placeholder { height: 180px; width: 100%; border-radius: 12px; background: linear-gradient(135deg, #6a00ff, #007bff); } .social a { color: var(--text-color); font-size: 22px; margin-right: 7px; transition: 0.3s; } .social a:hover { color: var(--primary-hover); } .stats-box { text-align: center; color: var(--text-color); } .stats-box h2 { font-size: 38px; font-weight: 800; } .stats-box p { font-size: 14px; opacity: 0.7; } .reveal { opacity: 0; transform: translateY(40px); transition: all 0.8s ease; } .reveal.active { opacity: 1; transform: translateY(0); } .contact-input { background: var(--bg-color); border: 1px solid rgba(255, 255, 255, 0.2); color: var(--text-color); } .contact-input::placeholder { color: var(--placeholder-color); opacity: 1; } .contact-input:focus { background: var(--bg-color); color: var(--text-color); border-color: var(--primary-hover); box-shadow: none; } /* Go to Top Button */ .go-top-btn { position: fixed; bottom: 25px; right: 25px; width: 50px; height: 50px; border: none; outline: none; background: #9bddff; color: #000; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 22px; cursor: pointer; z-index: 999; display: none; /* hidden by default */ transition: 0.3s; } .go-top-btn:hover { background: white; box-shadow: 0 0 15px rgba(255, 255, 255, 0.4); transform: translateY(-5px); } .li-embed { height: 263px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--text-light); border: 1px dashed var(--glass-border); border-radius: 12px; } .modal-content.glass { background: rgba(0, 0, 0, 0.08); backdrop-filter: blur(100px); border-radius: 15px; }