@import "https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;600&display=swap";
*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;max-width:100vw;min-height:100%;overflow-x:hidden}body{color:#e8e0d0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#0a0a0f;font-family:JetBrains Mono,monospace}a{color:inherit;text-decoration:none}#grid-container{background-color:#0a0a0f;grid-template-columns:80px minmax(0,1fr);width:100%;min-height:100vh;display:grid}.site-header{background-color:#0a0a0f;border-right:.5px solid #1a1a2a;justify-content:center;align-items:center;width:80px;height:100vh;min-height:100vh;display:flex;position:sticky;top:0}.navbar{justify-content:center;align-items:center;width:100%;padding:1rem;display:flex}.nav-links{flex-direction:column;align-items:center;gap:2rem;margin:0;padding:0;list-style:none;display:flex}.navLayout{color:#88a;align-items:center;gap:1rem;transition:color .2s;display:flex}.navLayout:hover{color:#ff3cac}.navIcon{transition:transform .2s;display:inline-block}.navIcon:hover{transform-origin:bottom-left;transform:rotate(15deg)}.main-content{justify-content:center;align-items:flex-start;min-width:0;min-height:100vh;padding:32px;display:flex;overflow-x:hidden}.bento-grid{grid-template-columns:380px 450px;grid-template-areas:"info hero""projects exploring""blog socials""tech tech";grid-auto-rows:min-content;align-content:start;align-items:stretch;gap:12px;width:672px;max-width:100%;margin:0;padding:0;display:grid}.info{grid-area:info}.hero{grid-area:hero}.projects{grid-area:projects}.exploring{grid-area:exploring}.blog{grid-area:blog}.socials{grid-area:socials}.tech{grid-area:tech}.card{background:#0d0d1a;border:.5px solid #1a1a2a;border-radius:12px;width:100%;height:100%;min-height:0;padding:20px;position:relative;overflow:hidden}.card h1{color:#ff3cac;margin-bottom:.6rem;font-size:1.4rem}.card h2{color:#ff3cac;letter-spacing:.05em;margin-bottom:.8rem;font-size:13px}.card p{color:#e8e0d0;font-size:12px;line-height:1.6}.float{animation:4s ease-in-out infinite zeroGravity}@keyframes zeroGravity{0%{transform:translateY(0)}50%{transform:translateY(-8px)}to{transform:translateY(0)}}.typing{opacity:0;white-space:nowrap;color:#e8e0d0;width:0;animation:3.5s steps(60,end) forwards type,.75s step-end infinite blink;animation-delay:var(--delay,0s);font-size:13px;line-height:1.8;display:block;overflow:hidden}.typing:first-child{color:#ff3cac;font-size:1.4rem}@keyframes type{0%{opacity:0;width:0}to{opacity:1;width:100%}}@keyframes blink{0%,50%{border-color:#0000}50.1%,to{border-color:#ff3cac}}.info{flex-direction:column;gap:1rem;display:flex}.infoTop{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.profile{border:2px solid #1a1a2a;border-radius:50%;flex-shrink:0;width:150px;height:150px;position:relative;overflow:hidden}.profileImg{object-fit:cover}.infoButton{color:#88a;cursor:pointer;background-color:#0000;border:.5px solid #1a1a2a;border-radius:6px;align-items:center;gap:.4rem;padding:4px 10px;font-family:JetBrains Mono,monospace;font-size:11px;transition:border-color .2s,color .2s;display:flex}.infoButton:hover{color:#ff3cac;border-color:#ff3cac}.infoDownload{color:#ffb347}.profileContent{flex-wrap:wrap;gap:.5rem;display:flex}.profileCard{white-space:nowrap;color:#88a;background-color:#121018;border:.5px solid #1a1a2a;border-radius:6px;align-items:center;gap:.4rem;padding:3px 10px;font-size:11px;display:flex}.hero{flex-direction:column;justify-content:center;gap:.3rem;min-height:240px;display:flex}.projects,.blog{flex-direction:column;gap:.5rem;display:flex}.exploring,.socials{flex-direction:column;display:flex}.socialLinks{flex-direction:column;align-items:flex-start;gap:.5rem;margin-top:.4rem;display:flex}.socialLink{color:#88a;align-items:center;gap:.5rem;font-size:12px;transition:color .2s;display:flex}.socialLink:hover{color:#ff3cac}.bentoCta{color:#00d4ff;letter-spacing:.05em;width:fit-content;margin-top:.8rem;font-size:11px;transition:color .2s;display:inline-block}.bentoCta:hover{color:#ff3cac}.techGrid{grid-template-columns:repeat(4,1fr);gap:.8rem;display:grid}.techItem{flex-direction:column;align-items:center;gap:.5rem;display:flex}.iconBox{background:#121018;border:.5px solid #1a1a2a;justify-content:center;align-items:center;width:48px;height:48px;display:flex;position:relative}.icon{color:#e8e0d0;justify-content:center;align-items:center;font-size:1.3rem;display:flex}.techItem p{color:#88a;text-align:center;margin:0;font-size:10px}.dot{background:#ff3cac;border-radius:50%;width:4px;height:4px;position:absolute}.topLeft{top:-2px;left:-2px}.topRight{top:-2px;right:-2px}.bottomLeft{bottom:-2px;left:-2px}.bottomRight{bottom:-2px;right:-2px}@media (max-width:900px){.main-content{padding:24px}.bento-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);grid-template-areas:"info hero""projects exploring""blog socials""tech tech";width:min(100%,752px)}.profile{width:125px;height:125px}.typing{white-space:normal}}@media (max-width:768px){#grid-container{flex-direction:column;display:flex}.site-header{z-index:100;border-top:.5px solid #1a1a2a;border-right:none;width:100%;height:60px;min-height:0;position:fixed;inset:auto 0 0}.navbar{width:100%;height:100%;padding:0}.nav-links{flex-direction:row;justify-content:center;gap:3rem}.main-content{width:100%;min-height:100vh;padding:12px 12px 80px}.bento-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"hero""info""projects""exploring""blog""socials""tech";gap:10px;width:100%}.hero{min-height:220px}.infoTop{justify-content:flex-start}.techGrid{grid-template-columns:repeat(4,1fr);gap:.5rem}.iconBox{width:40px;height:40px}.icon{font-size:1.1rem}}@media (max-width:480px){.card{padding:16px}.infoTop{flex-wrap:wrap}.profile{width:120px;height:120px}.techGrid{grid-template-columns:repeat(2,1fr);row-gap:1rem}}
