:root{--bg:#0a0a0f;--bg-card:#12121a;--bg-nav:#0a0a0fd9;--text:#8b8b9e;--text-h:#e4e4e7;--accent:#818cf8;--accent-hover:#6366f1;--border:#1e1e2a;--sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--mono:"JetBrains Mono", "Fira Code", ui-monospace, Consolas, monospace;scroll-behavior:smooth;font:16px/1.6 var(--sans);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100svh}::selection{background:var(--accent);color:#fff}h1,h2,h3,h4{color:var(--text-h);line-height:1.2}a{color:var(--accent);text-decoration:none;transition:color .2s}a:hover{color:var(--accent-hover)}img{max-width:100%;display:block}section{padding:96px 24px}.container{max-width:800px;margin:0 auto}@media (width<=640px){section{padding:64px 16px}}.navbar{z-index:100;background:0 0;transition:background .3s,-webkit-backdrop-filter .3s,backdrop-filter .3s;position:fixed;top:0;left:0;right:0}.navbar.scrolled{background:var(--bg-nav);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}.nav-inner{justify-content:space-between;align-items:center;height:72px;padding:0 24px;display:flex}.logo{font-family:var(--mono);color:var(--text-h);font-size:1.25rem;font-weight:700}.logo .dot{color:var(--accent)}.nav-links{gap:40px;list-style:none;display:flex}.nav-links a{color:var(--text);padding-bottom:4px;font-size:.9rem;position:relative}.nav-links a:after{content:"";background:var(--accent);width:0;height:2px;transition:width .3s;position:absolute;bottom:0;left:0}.nav-links a:hover:after,.nav-links a.active:after{width:100%}.nav-links a.active{color:var(--accent)}#home{justify-content:center;align-items:center;min-height:100svh;padding-top:64px;display:flex}.hero{text-align:center}.hero-greeting{color:var(--accent);font-size:1.15rem;font-family:var(--mono);margin-bottom:8px}.hero-name{letter-spacing:-2px;margin-bottom:16px;font-size:clamp(3rem,10vw,5.5rem);font-weight:800}.hero-tagline{max-width:480px;margin:0 auto 32px;font-size:1.25rem}.hero-tagline .accent{color:var(--accent);font-weight:600}.hero-actions{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.btn{cursor:pointer;border-radius:8px;padding:12px 28px;font-size:.95rem;font-weight:600;transition:all .2s;display:inline-block}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover);color:#fff;transform:translateY(-2px)}.btn-secondary{border:1px solid var(--border);color:var(--text-h)}.btn-secondary:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}.section-title{text-align:center;margin-bottom:12px;font-size:2rem;font-weight:700}.section-desc{text-align:center;margin-bottom:48px;font-size:1.05rem}.about-content{flex-direction:column;gap:20px;max-width:640px;margin:0 auto;font-size:1.05rem;line-height:1.75;display:flex}.about-content strong{color:var(--text-h)}.skills-grid{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.skill-badge{font-size:.9rem;font-weight:600;font-family:var(--mono);background:#ffffff08;border:1px solid;border-radius:999px;padding:8px 20px;transition:all .2s}.skill-badge:hover{transform:translateY(-2px);box-shadow:0 0 20px #818cf826}.blog-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;display:grid}.blog-card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:24px;transition:all .2s}.blog-card:hover{border-color:var(--accent);transform:translateY(-4px)}.blog-date{font-size:.8rem;font-family:var(--mono);color:var(--text)}.blog-title{margin:8px 0;font-size:1.15rem;font-weight:600}.blog-desc{font-size:.9rem;line-height:1.5}.contact-links{flex-direction:column;align-items:center;gap:16px;display:flex}.contact-item{background:var(--bg-card);border:1px solid var(--border);color:var(--text);font-size:1rem;font-family:var(--mono);border-radius:10px;align-items:center;gap:12px;min-width:280px;padding:14px 28px;transition:all .2s;display:flex}.contact-item:hover{border-color:var(--accent);color:var(--accent);transform:translate(4px)}.contact-icon{text-align:center;width:24px;font-size:1.2rem}.footer{border-top:1px solid var(--border);text-align:center;padding:32px 24px;font-size:.85rem}@media (width<=640px){.nav-links{gap:16px}.nav-links a{font-size:.85rem}.hero-name{font-size:clamp(2.5rem,12vw,3.5rem)}.hero-tagline{font-size:1.05rem}.blog-grid{grid-template-columns:1fr}.contact-item{min-width:100%}}