/* Professional Portfolio Theme */
*{margin:0;padding:0;box-sizing:border-box;scroll-behavior:smooth;font-family:'Poppins',sans-serif}
:root{
--bg:#0b1120;--surface:#111827;--surface2:#1f2937;--primary:#2563eb;--accent:#60a5fa;
--text:#f8fafc;--muted:#cbd5e1;--border:rgba(255,255,255,.08);
}
body{background:var(--bg);color:var(--muted);line-height:1.7}
header{position:fixed;top:0;width:100%;z-index:1000;background:rgba(11,17,32,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
.navbar{width:90%;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:18px 0}
.logo h2{color:#fff;font-size:30px}
.nav-links{display:flex;list-style:none;gap:28px}
.nav-links a{color:var(--muted);text-decoration:none;position:relative;transition:.3s}
.nav-links a:hover,.nav-links a.active{color:#fff}
.nav-links a:after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:var(--accent);transition:.3s}
.nav-links a:hover:after,.nav-links a.active:after{width:100%}
.hero{min-height:100vh;padding:120px 10%;display:flex;align-items:center;background:linear-gradient(135deg,#020617,#0b1120,#1d4ed8)}
.hero-content{display:flex;align-items:center;justify-content:space-between;gap:60px}
.hero-text h4{color:var(--accent)} .hero-text h1{font-size:68px;color:#fff}
.hero-text h3{font-size:30px;color:#dbeafe}.profession{color:var(--accent);font-weight:600;font-size:22px;margin:18px 0}
.objective{text-align:justify;max-width:700px}
.hero-buttons{display:flex;gap:20px;margin-top:35px}
.btn{padding:14px 30px;border-radius:40px;background:var(--primary);color:#fff;text-decoration:none;transition:.3s}
.btn:hover{transform:translateY(-4px);background:#3b82f6}
.btn-outline{background:transparent;border:2px solid var(--accent)}
.hero-image img{width:360px;height:360px;border-radius:50%;object-fit:cover;border:6px solid var(--accent);box-shadow:0 0 30px rgba(96,165,250,.5)}
section{padding:90px 10%}
.section-title{text-align:center;font-size:42px;color:#fff;margin-bottom:55px}
.section-title:after{content:"";display:block;width:90px;height:4px;background:var(--primary);margin:12px auto;border-radius:10px}
.about-content,.education-card,.experience-card,.project-card,.certificate-card,.contact-info{
background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:0 15px 35px rgba(0,0,0,.25)}
.about-content{padding:35px}
.education-card,.experience-card,.project-card,.certificate-card,.contact-info{padding:30px;margin-bottom:30px;transition:.35s}
.education-card:hover,.experience-card:hover,.project-card:hover,.certificate-card:hover,.contact-info:hover{transform:translateY(-10px);border-color:var(--primary)}
.education-card h3,.experience-card h3,.project-card h3,.certificate-card h3{color:var(--accent)}
.project-container,.skills-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:25px}
.project-card a{display:inline-block;margin-top:15px;padding:12px 22px;background:var(--primary);color:#fff;text-decoration:none;border-radius:30px}
.project-card a:hover{background:#3b82f6}
.skills-grid span{background:var(--surface2);border:1px solid var(--border);padding:16px;border-radius:12px;text-align:center;color:#fff;transition:.3s}
.skills-grid span:hover{background:var(--primary);transform:translateY(-5px)}
.certificate-card img{width:100%;border-radius:12px}
.contact-info a{color:var(--muted);text-decoration:none}
.contact-info a:hover{color:var(--accent)}
footer{background:#020617;padding:60px 10% 30px;border-top:1px solid var(--border)}
.footer-content{text-align:center;max-width:1100px;margin:auto}
.footer-content h2{color:var(--accent)}
.footer-contact{display:flex;justify-content:center;flex-wrap:wrap;gap:20px;margin:25px 0}
.footer-contact a{background:var(--surface);color:#fff;text-decoration:none;padding:14px 22px;border-radius:12px;border:1px solid var(--border);transition:.3s}
.footer-contact a:hover{background:var(--primary);transform:translateY(-5px)}
footer hr{border:none;height:1px;background:var(--border);margin:20px 0}
.copyright{text-align:center;color:#94a3b8}
.hidden{opacity:0;transform:translateY(40px);transition:.8s}.show{opacity:1;transform:none}
@media(max-width:900px){
.hero-content{flex-direction:column-reverse;text-align:center}
.hero-text h1{font-size:48px}.hero-image img{width:280px;height:280px}
.navbar{flex-direction:column}.nav-links{flex-wrap:wrap;justify-content:center}
}