@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{--bg:#07111f;--surface:#0d1b2a;--surface2:#10263a;--text:#eaf2f8;--muted:#9eb1c3;--accent:#5eead4;--accent2:#60a5fa;--line:rgba(255,255,255,.10);--max:1160px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f7fafc;color:#102033;font-family:Inter,Arial,sans-serif;line-height:1.7}a{text-decoration:none;color:inherit}.container{width:min(var(--max),calc(100% - 40px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(7,17,31,.90);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}.nav{height:72px;display:flex;align-items:center;justify-content:space-between}.brand{color:#fff;font-family:"Space Grotesk";font-weight:700;font-size:18px;display:flex;align-items:center;gap:10px}.brand span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#07111f}.nav-links{display:flex;gap:25px;color:#b9c8d6;font-size:14px;font-weight:600}.nav-links a:hover,.nav-links .active{color:#fff}.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:24px}
.hero,.page-hero{background:radial-gradient(circle at 85% 25%,rgba(96,165,250,.18),transparent 28%),radial-gradient(circle at 15% 20%,rgba(94,234,212,.12),transparent 25%),var(--bg);color:#fff}.hero{padding:100px 0 90px}.hero-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:70px;align-items:center}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:800;color:var(--accent);margin-bottom:18px}.hero h1,.page-hero h1{font-family:"Space Grotesk";font-size:clamp(42px,6vw,76px);line-height:1.02;margin:0 0 25px;letter-spacing:-2px}.hero h1 span{color:var(--accent)}.hero-copy{font-size:18px;color:#b6c6d4;max-width:700px}.hero-actions{display:flex;gap:12px;margin:30px 0}.btn{display:inline-block;padding:12px 18px;border-radius:10px;font-weight:700;border:1px solid var(--line)}.btn.primary{background:var(--accent);color:#06131e}.btn.secondary{color:#fff;background:rgba(255,255,255,.05)}.stats{display:flex;gap:45px;margin-top:45px}.stats strong{display:block;font-family:"Space Grotesk";font-size:30px}.stats small{color:#8fa4b7}.hero-card{padding:35px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.02));box-shadow:0 25px 80px rgba(0,0,0,.25)}.avatar{width:92px;height:92px;border-radius:24px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#07111f;font:700 30px "Space Grotesk";margin-bottom:25px}.avatar.small{width:62px;height:62px;font-size:21px;border-radius:17px}.hero-card h2{font:700 28px "Space Grotesk";margin:0}.hero-card p{color:#a9bdce}.chip-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.chip-row span,.skill-cloud span,.chip-column span{padding:6px 10px;border:1px solid rgba(94,234,212,.18);border-radius:99px;background:rgba(94,234,212,.06);font-size:12px;color:#5f7588}.hero-card .chip-row span{color:#c9f9f2;border-color:var(--line)}
.section{padding:90px 0}.dark-section{background:var(--bg);color:#fff}.section-heading{display:flex;gap:15px;align-items:center;margin-bottom:35px}.section-heading span{font:700 13px "Space Grotesk";color:var(--accent)}.section-heading h2{font:700 34px "Space Grotesk";margin:0;letter-spacing:-.5px}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.glass-card{padding:32px;border:1px solid #e5ebf0;border-radius:20px;background:#fff;box-shadow:0 15px 50px rgba(16,32,51,.06)}.skill-cloud{display:flex;align-content:flex-start;flex-wrap:wrap;gap:10px}.skill-cloud span{font-weight:700;color:#284257;background:#eef7f6;border-color:#d7efeb}
.project-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.project-card{padding:30px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,#0e2235,#0a1726)}.project-card.featured{border-color:rgba(94,234,212,.35)}.project-icon{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;background:rgba(94,234,212,.1);color:var(--accent);font-weight:800}.project-meta,.tag{font-size:11px;letter-spacing:1.4px;color:var(--accent);font-weight:800;margin-top:20px}.project-card h3{font:700 24px "Space Grotesk";margin:7px 0}.project-card p{color:#9fb2c2}.project-card .chip-row span{color:#c5d4df;border-color:var(--line)}
.content-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.content-card{padding:30px;border:1px solid #e2e9ef;border-radius:20px;background:#fff;transition:.2s;box-shadow:0 10px 40px rgba(16,32,51,.04)}.content-card:hover,.blog-card:hover{transform:translateY(-4px);box-shadow:0 18px 50px rgba(16,32,51,.10)}.card-number{color:#5d7183;font-size:12px}.content-card h3{font:700 24px "Space Grotesk"}.content-card p{color:#607487}.content-card strong{color:#167b70}.contact-section{background:#eef5f8}.contact-card{background:var(--bg);color:#fff;border-radius:24px;padding:45px;display:flex;justify-content:space-between;gap:30px;align-items:center}.contact-card h2{font:700 34px "Space Grotesk";margin:0}.contact-card p{color:#a7bac9;max-width:680px}.contact-links{display:flex;flex-direction:column;gap:10px}.contact-links a{padding:10px 15px;border:1px solid var(--line);border-radius:10px;min-width:150px;text-align:center}.page-hero{padding:75px 0}.page-hero h1{font-size:60px;margin-bottom:12px}.page-hero p{color:#b5c6d4;font-size:18px;margin-bottom:25px}
.resume-layout{display:grid;grid-template-columns:280px 1fr;gap:55px}.resume-side{border-right:1px solid #e5ebf0;padding-right:35px}.profile-mini{padding-bottom:25px;border-bottom:1px solid #e5ebf0;margin-bottom:25px}.profile-mini h3{font:700 22px "Space Grotesk";margin:10px 0 2px}.profile-mini p{margin:0;color:#6a7d8d;font-size:14px}.resume-side h4{font:700 13px "Space Grotesk";text-transform:uppercase;letter-spacing:1px}.chip-column{display:flex;flex-wrap:wrap;gap:8px}.resume-main .resume-block{margin-bottom:55px}.resume-main .section-heading{margin-bottom:20px}.resume-main p{color:#566b7c}.timeline{border-left:2px solid #dbe6ed;padding-left:25px}.timeline-item{position:relative;margin-bottom:30px}.timeline-item:before{content:"";position:absolute;left:-32px;top:7px;width:12px;height:12px;border-radius:50%;background:#5eead4}.timeline-item>span{font-size:12px;font-weight:700;color:#167b70}.timeline-item h3,.mini-projects h3{font:700 20px "Space Grotesk";margin:5px 0}.mini-projects{display:grid;grid-template-columns:1fr 1fr;gap:18px}.mini-projects>div{padding:22px;border:1px solid #e3eaf0;border-radius:15px}.mini-projects p{margin:5px 0}
.blog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.blog-card{padding:32px;border:1px solid #e2e9ef;border-radius:20px;background:#fff;transition:.2s}.blog-card h2{font:700 26px "Space Grotesk";line-height:1.2}.blog-card p{color:#627789}.blog-card a{font-weight:700;color:#167b70}.qa-list{max-width:900px}.qa-list details{background:#fff;border:1px solid #e0e8ee;border-radius:15px;margin-bottom:14px;padding:0 22px;box-shadow:0 5px 25px rgba(16,32,51,.04)}.qa-list summary{cursor:pointer;padding:20px 0;font:700 18px "Space Grotesk"}.qa-list details p{color:#5e7181;padding:0 0 20px;margin:0}
.article{max-width:820px;margin:auto}.article h1{font:700 50px "Space Grotesk";line-height:1.1}.article h2{font:700 28px "Space Grotesk";margin-top:45px}.article p,.article li{color:#526878;font-size:17px}.code{background:#0a1726;color:#d7e5ed;padding:22px;border-radius:14px;overflow:auto;font-family:monospace;font-size:14px}
footer{background:#06101c;color:#8296a8;padding:28px 0;font-size:13px}
@media(max-width:850px){.nav-links{display:none;position:absolute;top:72px;left:0;right:0;background:#07111f;padding:20px;flex-direction:column}.nav-links.open{display:flex}.menu-toggle{display:block}.hero{padding:65px 0}.hero-grid,.about-grid,.resume-layout{grid-template-columns:1fr}.resume-side{border-right:0;border-bottom:1px solid #e5ebf0;padding:0 0 30px}.project-grid,.content-grid,.blog-grid,.mini-projects{grid-template-columns:1fr}.contact-card{flex-direction:column;align-items:flex-start}.hero-card{display:none}.stats{gap:22px}.page-hero h1{font-size:45px}}