@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;700;900&display=swap";:root{--cherry:#8b0000;--cherry-dark:#8b0000;--cherry-glow:#8b000066;--cherry-faint:#8b000014;--cream:#f5efe6;--glass:#ffffff0a;--glass-border:#ffffff14;--text-dim:#f5efe673}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-snap-type:y mandatory;scroll-behavior:smooth;overflow-y:scroll}body{color:var(--cream);cursor:none;background:#080808;font-family:DM Sans,sans-serif}#cursor{background:var(--cherry);pointer-events:none;z-index:9999;border-radius:50%;width:12px;height:12px;transition:width .3s,height .3s;position:fixed;transform:translate(-50%,-50%)}#cursor-ring{pointer-events:none;z-index:9998;border:1px solid #8b000080;border-radius:50%;width:36px;height:36px;transition:transform .35s cubic-bezier(.16,1,.3,1),width .4s,height .4s;position:fixed;transform:translate(-50%,-50%)}:is(body:has(a:hover) #cursor,body:has(button:hover) #cursor){width:6px;height:6px}:is(body:has(a:hover) #cursor-ring,body:has(button:hover) #cursor-ring){border-color:var(--cherry);width:54px;height:54px}body:after{content:"";z-index:9000;pointer-events:none;opacity:.028;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='1'/%3E%3C/svg%3E");animation:.4s steps(2,end) infinite grain;position:fixed;inset:0}@keyframes grain{0%,to{transform:translate(0)}25%{transform:translate(-2px,3px)}50%{transform:translate(3px,-1px)}75%{transform:translate(-1px,-3px)}}.section{scroll-snap-align:start;justify-content:center;align-items:center;width:100%;height:100vh;display:flex;position:relative;overflow:hidden}#nav-dots{z-index:1000;flex-direction:column;gap:10px;display:flex;position:fixed;top:50%;right:2rem;transform:translateY(-50%)}.dot{background:var(--text-dim);cursor:pointer;border-radius:50%;width:6px;height:6px;transition:background .3s,height .3s}.dot.active{background:var(--cherry);border-radius:3px;height:24px}.section-label{letter-spacing:.25em;color:var(--text-dim);text-transform:uppercase;font-family:Space Mono,monospace;font-size:.65rem;position:absolute;bottom:2.5rem;left:2.5rem}.section-number{color:var(--text-dim);font-family:Space Mono,monospace;font-size:.65rem;position:absolute;bottom:2.5rem;right:4rem}#hero{overflow:visible}.hero-bg{background:radial-gradient(70% 60% at 50% 60%,#8b00001f 0%,#0000 70%);position:absolute;inset:0}.hero-content{text-align:left;flex-direction:column;align-items:flex-start;gap:.2rem;width:100%;max-width:500px;margin-left:0;margin-right:auto;padding:0 6vw;display:flex;position:relative}.hero-intro{color:var(--cherry);text-transform:uppercase;opacity:0;margin-top:1rem;margin-bottom:1rem;font-family:Space Mono,monospace;font-size:1rem;line-height:1;animation:.6s .1s forwards fadeUp}.hero-greeting{margin-bottom:0;line-height:1;overflow:hidden}.hero-greeting .name-row-inner{animation-delay:.15s}.hero-name{color:var(--cream);flex-direction:column;align-items:flex-start;gap:0;font-family:Bebas Neue,sans-serif;font-size:clamp(3.5rem,9.5vw,9.5rem);line-height:.88;display:flex}.name-row{line-height:1.05;display:block;overflow:hidden}.name-row-inner{animation:.9s cubic-bezier(.16,1,.3,1) forwards nameSlideUp;display:block;transform:translateY(105%)}.name-row-inner.cherry{color:var(--cherry)}.name-row:first-child .name-row-inner{animation-delay:.38s}.name-row:nth-child(2) .name-row-inner{animation-delay:.58s}@keyframes nameSlideUp{0%{opacity:0;transform:translateY(105%)}to{opacity:1;transform:translateY(0)}}.hero-sub{color:var(--text-dim);max-width:380px;margin-top:1rem;font-size:clamp(.85rem,1.4vw,1rem);font-weight:300;line-height:1.75}.hero-sub-typed{color:var(--cream);font-weight:500;display:inline}.hero-sub-cursor{vertical-align:text-bottom;background:var(--cherry);width:1px;height:1.15em;margin-left:.15rem;animation:.85s step-end infinite blinkCursor;display:inline-block}@keyframes blinkCursor{0%,49%{opacity:1}50%,to{opacity:0}}.hero-scroll{flex-direction:column;align-items:center;gap:.5rem;display:flex;position:absolute;bottom:1.5rem;left:50%;transform:translate(-50%)}.hero-scroll span{letter-spacing:.3em;color:var(--text-dim);text-transform:uppercase;font-family:Space Mono,monospace;font-size:.6rem}.scroll-track{background:var(--glass-border);width:1px;height:30px;position:relative;overflow:hidden}.scroll-track:after{content:"";background:linear-gradient(to bottom, transparent, var(--cherry));width:100%;height:50%;animation:1.6s ease-in-out infinite scrollLine;position:absolute;top:-100%;left:0}@keyframes scrollLine{0%{top:-50%}to{top:150%}}.about-bg{background:radial-gradient(50% 80% at 80%,#8b000012 0%,#0000 70%);position:absolute;inset:0}.about-content{grid-template-columns:1fr 1fr;align-items:center;gap:4rem;width:90%;max-width:1000px;display:grid;position:relative}.about-eyebrow{letter-spacing:.35em;color:var(--cherry);text-transform:uppercase;margin-bottom:1.5rem;font-family:Space Mono,monospace;font-size:1rem}.about-heading{color:var(--cream);margin-bottom:2rem;font-family:Bebas Neue,sans-serif;font-size:clamp(3rem,7.2vw,4.8rem);line-height:.9}.about-heading em{color:var(--cherry);font-style:normal}.about-bio{color:var(--text-dim);font-size:1rem;font-weight:300;line-height:1.85}.about-right{flex-direction:column;gap:1.5rem;padding-top:2.4rem;display:flex}.stat-card{background:var(--glass);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;padding:1.2rem 1.6rem;transition:transform .4s cubic-bezier(.16,1,.3,1),border-color .3s,box-shadow .3s}.stat-card:hover{border-color:#8b00004d;transform:translate(12px);box-shadow:0 0 30px #8b00001a,inset 0 0 20px #8b000008}.stat-num{color:var(--cherry);font-family:Bebas Neue,sans-serif;font-size:3rem;line-height:1}.stat-label{color:var(--text-dim);letter-spacing:.1em;margin-top:.25rem;font-size:.8rem}.edu-content{width:80%;max-width:1060px;position:relative}.section-eyebrow{letter-spacing:.35em;color:var(--cherry);text-transform:uppercase;margin-top:-3rem;margin-bottom:-6.5rem;font-family:Space Mono,monospace;font-size:1rem}.section-heading{color:var(--cream);margin-bottom:3rem;font-family:Bebas Neue,sans-serif;font-size:clamp(3rem,6vw,5.5rem);line-height:.9}.stepper{flex-direction:column;gap:0;display:flex;position:relative}.step{align-items:stretch;display:flex;position:relative}.step-spine{flex-direction:column;flex-shrink:0;align-items:center;width:36px;display:flex}.step-dot{z-index:2;background:#080808;border:2px solid #8b000040;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;transition:border-color .4s,background .4s,box-shadow .4s;display:flex;position:relative}.step-dot-inner{background:#8b000033;border-radius:50%;width:10px;height:10px;transition:transform .45s cubic-bezier(.34,1.56,.64,1),background .3s;transform:scale(0)}.step.active .step-dot{border-color:var(--cherry);box-shadow:0 0 0 5px #8b00001a,0 0 22px #8b000059}.step.active .step-dot-inner{background:var(--cherry);transform:scale(1)}.step.done .step-dot{border-color:var(--cherry);background:var(--cherry);box-shadow:0 0 12px #8b000066}.step.done .step-dot-inner{background:#fff;transform:scale(1)}.step-dot:after{content:"";opacity:0;border:1.5px solid #8b000059;border-radius:50%;transition:opacity .3s;position:absolute;inset:-6px}.step.active .step-dot:after{opacity:1;animation:1.6s ease-out infinite stepPulse}@keyframes stepPulse{0%{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(1.9)}}.step-line{background:#ffffff0f;flex:1;width:2px;position:relative;overflow:hidden}.step-line-fill{background:linear-gradient(to bottom, var(--cherry), #8b000080);border-radius:2px;height:0;transition:height .7s cubic-bezier(.4,0,.2,1);position:absolute;top:0;left:0;right:0}.step-line.filled .step-line-fill{height:100%}.step:last-child .step-line{display:none}.step-card{opacity:0;flex:1;padding:0 0 3rem 1.5rem;transition:opacity .5s,transform .5s cubic-bezier(.16,1,.3,1);transform:translate(-16px)}.step.active .step-card,.step.done .step-card{opacity:1;transform:translate(0)}.step:last-child .step-card{padding-bottom:0}.edu-achievement{color:var(--text-dim);border-left:2px solid #8b00004d;margin-top:.75rem;margin-bottom:-2.5rem;padding-left:.75rem;font-size:.82rem;font-style:italic;font-weight:300;line-height:1.7}.edu-badge{letter-spacing:.2em;text-transform:uppercase;color:var(--cherry);background:var(--cherry-faint);border:1px solid #8b000040;border-radius:100px;align-items:center;gap:.3rem;margin-bottom:.55rem;padding:.18rem .65rem;font-family:Space Mono,monospace;font-size:.55rem;display:inline-flex}.badge-check{background:var(--cherry);border-radius:50%;width:8px;height:8px;display:none}.step.done .badge-check{display:block}.edu-year{color:var(--text-dim);letter-spacing:.12em;margin-bottom:.3rem;font-family:Space Mono,monospace;font-size:.68rem}.edu-degree{color:var(--cream);margin-bottom:.2rem;font-size:1.1rem;font-weight:700}.edu-school{color:var(--text-dim);margin-bottom:.55rem;font-size:.85rem;line-height:1.5}.edu-grade{flex-wrap:wrap;gap:.5rem;display:inline-flex}.grade-chip{background:var(--cherry-faint);color:var(--cherry);border:1px solid #8b000033;border-radius:100px;padding:.18rem .6rem;font-family:Space Mono,monospace;font-size:.62rem}.skills-content{padding-left:0}.skills-grid{grid-template-columns:repeat(5,1fr);gap:32px;display:grid}.skill-icon-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.skill-group{opacity:0;padding-left:0;transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);transform:translateY(30px)}.skill-group.visible{opacity:1;transform:translateY(0)}.skill-group-label{letter-spacing:.3em;color:var(--cherry);text-transform:uppercase;margin-bottom:1.4rem;font-family:Space Mono,monospace;font-size:.65rem}.skill-icon-item{cursor:default;flex-direction:column;align-items:center;gap:.45rem;display:flex}.skill-icon-wrap{justify-content:center;align-items:center;width:100px;height:100px;transition:transform .35s cubic-bezier(.16,1,.3,1);display:flex}.skill-icon-item:hover .skill-icon-wrap{transform:translateY(-6px)}.skill-icon-img{object-fit:contain;filter:brightness(.95);width:64px;height:64px;transition:transform .3s}.skill-icon-item:nth-child(n) .skill-icon-img[alt=GitHub],.skill-icon-item:nth-child(n) .skill-icon-img[alt=Express\.js]{filter:invert()brightness(.85)}.skill-icon-item:hover .skill-icon-img{transform:scale(1.1)}.skill-icon-name{letter-spacing:.08em;color:var(--text-dim);text-align:center;font-family:Space Mono,monospace;font-size:.58rem;transition:color .3s}.skill-icon-item:hover .skill-icon-name{color:var(--cream)}.proj-slider{flex-direction:row;align-items:center;gap:1.5rem;width:95%;max-width:1200px;height:75vh;margin-top:2rem;display:flex}.proj-image-wrap{background:0 0;border-radius:12px;flex:none;width:80%;height:100%;position:relative;overflow:hidden}s .proj-info{flex-direction:column;flex:1;justify-content:center;align-items:flex-start;gap:.85rem;padding:1rem 0 1rem 1.5rem;display:flex}@keyframes slideFromRight{0%{opacity:0;transform:translate(60px)}to{opacity:1;transform:translate(0)}}.proj-image{object-fit:contain;object-position:center;opacity:0;width:100%;height:100%;transition:opacity .7s cubic-bezier(.4,0,.2,1);position:absolute;inset:0}.proj-title-row{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.proj-num{color:#8b00004d;letter-spacing:.05em;flex-shrink:0;width:48px;font-family:Bebas Neue,sans-serif;font-size:1.8rem;line-height:1}.proj-eyebrow{letter-spacing:.25em;color:var(--cherry);text-transform:uppercase;font-family:Space Mono,monospace;font-size:1rem}.proj-title{color:var(--cream);font-family:Bebas Neue,sans-serif;font-size:1.3rem;line-height:1}.proj-desc{color:var(--text-dim);font-size:.7rem;font-weight:300;line-height:1.5}.project-tech{letter-spacing:.1em;color:var(--cherry);background:var(--cherry-faint);border-radius:4px;padding:.1rem .4rem;font-family:Space Mono,monospace;font-size:.5rem}.proj-image-overlay{display:none}.proj-image.active{opacity:1}.proj-image-overlay{pointer-events:none;background:linear-gradient(#0000,#080808);height:120px;position:absolute;bottom:0;left:0;right:0}.proj-info-right{flex-direction:column;flex:1;gap:.5rem;display:flex}.proj-stack{flex-wrap:wrap;gap:.4rem;display:flex}.proj-dots{gap:10px;margin-top:.25rem;display:flex}.proj-dot{cursor:pointer;background:#ffffff26;border:none;border-radius:50%;width:8px;height:8px;padding:0;transition:background .3s,width .3s}.proj-dot.active{background:var(--cherry);border-radius:4px;width:28px}.cert-slider{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1rem;width:95%;max-width:1160px;min-height:68vh;display:flex}.cert-image-wrap{justify-content:center;align-items:center;width:min(90vw,1100px);height:min(60vh,460px);display:flex;position:relative}.cert-image{object-fit:contain;object-position:center;opacity:0;filter:drop-shadow(0 28px 50px #00000047);width:100%;height:100%;transition:opacity .7s cubic-bezier(.4,0,.2,1);position:absolute;inset:0}.cert-image.active{opacity:1}.cert-info{flex-direction:column;align-items:center;width:min(90vw,1100px);margin-top:-.5rem;display:flex}.cert-title{font-size:1.8rem}.cert-issuer{letter-spacing:.24em;text-transform:uppercase;color:var(--cherry);font-family:Space Mono,monospace;font-size:1rem}.cert-desc{max-width:640px}@keyframes fadeUp{0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}.reveal{opacity:0;transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);transform:translateY(30px)}.reveal.visible{opacity:1;transform:none}.mask-reveal{clip-path:inset(0 100% 0 0);transition:clip-path .9s cubic-bezier(.16,1,.3,1)}.mask-reveal.visible{clip-path:inset(0 0% 0 0)}@media (width<=480px){.hero-name{font-size:clamp(2.8rem,14vw,5rem)}.about-heading{font-size:clamp(2rem,9vw,3rem)}.skills-grid{grid-template-columns:repeat(2,1fr);gap:1rem}.proj-image-wrap{height:52vw}.edu-content{width:94%}.step-dot{width:22px;height:22px}.step-spine{width:28px}}@keyframes fadeLeft{0%{opacity:0;transform:translate(60px)}to{opacity:1;transform:translate(0)}}@keyframes fadeRight{0%{opacity:0;transform:translate(-60px)}to{opacity:1;transform:translate(0)}}@keyframes fadeUp2{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.contact-reveal{opacity:0;transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);transform:translateY(28px)}.contact-reveal.visible{opacity:1;transform:none}.contact-text-up{transform:translateY(34px)}.contact-text-left{opacity:0;transform:translate(48px)}.contact-text-sweep{opacity:0;clip-path:inset(0 100% 0 0);transition:opacity .75s cubic-bezier(.16,1,.3,1),transform .75s cubic-bezier(.16,1,.3,1),clip-path .9s cubic-bezier(.16,1,.3,1);transform:translateY(22px)}.contact-text-sweep.visible{opacity:1;clip-path:inset(0);transform:translateY(0)}.contact-calli-wrap .contact-reveal{will-change:transform, opacity}.nav-wrapper{z-index:10;white-space:nowrap;justify-content:center;align-items:center;animation:3s cubic-bezier(.4,0,.2,1) forwards stagedExpand;display:flex;position:fixed;top:25px;left:50%;overflow:visible;transform:translate(-50%)}@keyframes stagedExpand{0%{opacity:0;width:160px}to{opacity:1;width:fit-content}}.navbar{box-sizing:border-box;background:#000;border-radius:30px;gap:10px;width:auto;margin:0;padding:4px;list-style:none;display:flex;position:relative;overflow:visible}.navbar li{text-align:center;color:#8b0000;cursor:pointer;z-index:2;text-transform:uppercase;flex:none;padding:10px 20px;font-size:.8rem;font-weight:800;transition:color .5s}.navbar li.active{color:#000}.indicator{z-index:1;background:#fff;border-radius:25px;transition:all .6s cubic-bezier(.65,0,.35,1);position:absolute;top:4px;bottom:4px}.nav-wrapper{opacity:1;animation:none}.navbar{clip-path:none;animation:1.8s linear .2s forwards navbarLeadIn;overflow:visible;transform:translate(100%)}@keyframes navbarLeadIn{0%{transform:translate(100%)}to{transform:translate(0)}}.hero-sub{margin-top:-.7rem}.hero-intro,.hero-greeting,.hero-sub{margin-top:.5rem;margin-bottom:.5rem}
