html{scroll-behavior:smooth}
:root{--accent:#6366f1;--accent-2:#06b6d4;--grad:linear-gradient(135deg,#6366f1 0%,#06b6d4 100%)}
body{font-family:'Inter',system-ui,-apple-system,sans-serif}
[data-bs-theme=dark]{--bs-body-bg:#0b1020;--bs-body-bg-rgb:11,16,32;--bs-tertiary-bg:#121a33;--bs-tertiary-bg-rgb:18,26,51;--bs-border-color:#232f55;--bs-secondary-color:rgba(203,213,235,.72)}
[data-bs-theme=light]{--bs-tertiary-bg:#f6f8fc;--bs-tertiary-bg-rgb:246,248,252}
section{scroll-margin-top:80px}
.section{padding:5.5rem 0}

.text-gradient{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.btn-gradient{background:var(--grad);border:0;color:#fff;font-weight:600;transition:.25s}
.btn-gradient:hover{color:#fff;transform:translateY(-2px);box-shadow:0 10px 25px rgba(99,102,241,.35)}

/* Navbar */
.navbar-brand{font-weight:800;letter-spacing:-.5px;font-size:1.4rem}
#topNav{transition:.3s;padding:.9rem 0}
#topNav.scrolled{background:rgba(var(--bs-body-bg-rgb),.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--bs-border-color);padding:.55rem 0}
#topNav .nav-link{font-weight:500}
#topNav .nav-link.active{color:var(--accent)}
@media(max-width:991.98px){#topNav .navbar-collapse{background:var(--bs-tertiary-bg);border:1px solid var(--bs-border-color);border-radius:1rem;padding:1rem;margin-top:.8rem}}

/* Hero */
.hero{min-height:100vh;padding:7rem 0 4rem;background:radial-gradient(600px 400px at 85% 15%,rgba(99,102,241,.22),transparent 60%),radial-gradient(500px 350px at 5% 90%,rgba(6,182,212,.16),transparent 60%)}
.cursor{animation:blink 1s steps(1) infinite;color:var(--accent-2)}
@keyframes blink{50%{opacity:0}}
.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#22c55e;margin-right:8px;animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.7)}70%{box-shadow:0 0 0 8px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.photo-ring{width:min(340px,80vw);aspect-ratio:1;border-radius:50%;padding:6px;background:var(--grad);box-shadow:0 25px 60px rgba(99,102,241,.35)}
.photo-ring img,.photo-placeholder{width:100%;height:100%;border-radius:50%;object-fit:cover;background:var(--bs-tertiary-bg);border:6px solid var(--bs-body-bg)}
.photo-placeholder{display:flex;align-items:center;justify-content:center;font-size:5rem;color:var(--accent)}

/* Shared components */
.tag{display:inline-block;padding:.3rem .8rem;border-radius:999px;font-size:.78rem;font-weight:600;background:rgba(99,102,241,.12);color:var(--accent);border:1px solid rgba(99,102,241,.25)}
[data-bs-theme=dark] .tag{color:#a5b4fc}
.social{width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;border:1px solid var(--bs-border-color);color:var(--bs-body-color);text-decoration:none;transition:.25s}
.social:hover{background:var(--grad);color:#fff;border-color:transparent;transform:translateY(-3px)}
.section-title{font-weight:800;margin-bottom:.5rem}
.section-title::after{content:"";display:block;width:60px;height:4px;border-radius:4px;background:var(--grad);margin-top:.6rem}
.glass-card{background:var(--bs-tertiary-bg);border:1px solid var(--bs-border-color);border-radius:1.1rem;transition:.3s}
.glass-card:hover{transform:translateY(-5px);border-color:var(--accent);box-shadow:0 18px 40px rgba(99,102,241,.15)}
.stat{text-align:center}
.stat .num{font-size:2rem;font-weight:800}
.skill-bar{background:var(--grad)}

/* Timeline */
.timeline{position:relative;padding-left:2rem}
.timeline::before{content:"";position:absolute;left:7px;top:6px;bottom:6px;width:2px;background:var(--bs-border-color)}
.timeline-item{position:relative;margin-bottom:1.5rem}
.timeline-dot{position:absolute;left:-2rem;top:1.7rem;width:16px;height:16px;border-radius:50%;background:var(--grad);box-shadow:0 0 0 4px var(--bs-body-bg)}

/* Projects */
.project-img{width:100%;height:190px;object-fit:cover}
.project-img-placeholder{display:flex;align-items:center;justify-content:center;font-size:3rem;color:#fff;background:var(--grad)}

/* Scroll reveal + spam honeypot */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}
.reveal.show{opacity:1;transform:none}
.hp-field{position:absolute;left:-9999px;opacity:0}
.site-footer{border-top:1px solid var(--bs-border-color)}
