@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap";:root{--bg-dark:#050505;--bg-card:#14141499;--border-color:#ffffff14;--text-primary:#fff;--text-secondary:#a1a1aa;--accent:#3b82f6;--accent-glow:#3b82f666;--font-main:"Outfit", sans-serif;--font-mono:"JetBrains Mono", monospace}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--bg-dark);color:var(--text-primary);background-image:radial-gradient(circle at 50% -20%,#3b82f626,#0000 40%),radial-gradient(circle at -20% 80%,#8b5cf61a,#0000 40%);background-attachment:fixed;line-height:1.5;overflow-x:hidden}.bento-container{grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(150px,auto);gap:1.5rem;max-width:1200px;margin:0 auto;padding:4rem 2rem;display:grid}.bento-card{background:var(--bg-card);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-color);border-radius:24px;padding:2rem;transition:transform .3s,box-shadow .3s,border-color .3s;position:relative;overflow:hidden}.bento-card:hover{border-color:#fff3;transform:translateY(-2px);box-shadow:0 10px 40px #0000004d}.card-profile{background:linear-gradient(145deg,#1e283c99,#0a0f1499);flex-direction:column;grid-area:span 2/span 2;justify-content:center;display:flex}.card-terminal{font-family:var(--font-mono);background:#0a0a0a;grid-area:span 1/span 2;font-size:.9rem}.card-stats{text-align:center;flex-direction:column;grid-area:span 1/span 1;justify-content:center;align-items:center;display:flex}.card-aws{background:linear-gradient(135deg,#ff99001a,#0000);flex-direction:column;grid-area:span 1/span 1;justify-content:center;align-items:center;display:flex}h1{letter-spacing:-.5px;margin-bottom:.5rem;font-size:2.5rem;font-weight:800}h2{color:var(--text-secondary);margin-bottom:1.5rem;font-size:1.25rem;font-weight:500}h3{margin-bottom:.5rem;font-size:1.5rem;font-weight:600}.gradient-text{background:linear-gradient(135deg,#fff,#a1a1aa);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.accent-text{color:var(--accent)}.profile-img-container{background:linear-gradient(135deg,#3b82f6,#8b5cf6);border-radius:24px;width:180px;height:200px;margin-bottom:1.5rem;padding:4px}.profile-img{object-fit:cover;object-position:top;border:4px solid var(--bg-dark);border-radius:20px;width:100%;height:100%}.stat-value{margin-bottom:.5rem;font-size:3.5rem;font-weight:800;line-height:1}.experience-container{max-width:1000px;margin:4rem auto;padding:0 2rem}.exp-item{gap:2rem;margin-bottom:4rem;display:flex;position:relative}.exp-logo{background:#fff;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:160px;height:90px;padding:12px;display:flex;box-shadow:0 4px 20px #ffffff1a}.exp-logo img{object-fit:contain;width:100%;height:auto}.exp-content{flex-grow:1}.exp-role{margin-bottom:.25rem;font-size:1.5rem;font-weight:700}.exp-company{color:var(--accent);margin-bottom:1rem;font-size:1.1rem;font-weight:500}.metric-grid{grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1.5rem;display:grid}.metric-card{background:#ffffff08;border:1px solid #ffffff0d;border-radius:12px;padding:1rem}.metric-card strong{color:#fff;margin-bottom:.25rem;font-size:1.25rem;display:block}@media (width<=1024px){.bento-container{grid-template-columns:repeat(2,1fr)}}@media (width<=640px){.bento-container{grid-template-columns:1fr}.card-profile,.card-terminal{grid-column:span 1}.exp-item{flex-direction:column;gap:1rem}.metric-grid{grid-template-columns:1fr}}.navbar{z-index:1000;-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border-color);background:#050505cc;padding:1rem 2rem;position:sticky;top:0}.nav-container{justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;display:flex}.nav-logo{letter-spacing:2px;font-size:1.5rem;font-weight:800;text-decoration:none}.nav-menu{gap:2rem;list-style:none;display:flex}.nav-link{color:var(--text-secondary);padding:.5rem 0;font-weight:500;text-decoration:none;transition:color .3s}.nav-link:hover,.nav-link.active{color:var(--text-primary);border-bottom:2px solid var(--accent)}.mobile-icon{cursor:pointer;color:var(--text-primary);font-size:1.5rem;display:none}@media (width<=768px){.desktop-menu{display:none}.mobile-icon{display:block}.mobile-menu{flex-direction:column;gap:1rem;padding-top:1rem}}
