body,html{overflow-x:hidden}.nav,.nav-link.active:after,.nav-link:hover:after{width:100%}.about-text p,.about-text strong,.about-text ul{line-height:1.7;color:var(--color-text-light)}.about-text .footnote-text,.about-text .signature{font-weight:light;color:var(--color-text-lighter)}.contact-method,.nav-link,.nav-logo,.skill-tag a{text-decoration:none}.contact-method:hover,.stat-item:hover,.visual-center{box-shadow:var(--shadow-lg)}.about-text .footnote-text a,.nav-arrow,.nav-toggle,a,body{cursor:none}#cursor,#cursorPt,.floating-elements{pointer-events:none}.footer,.hero-content,.loader-content,.section-header,.stat-item{text-align:center}.arrow-icon,.nav,.spinner-container{backdrop-filter:blur(10px)}:root{--color-primary:#2563eb;--color-secondary:#f8fafc;--color-accent:#ec4899;--color-text:#1e293b;--color-text-light:#64748b;--color-text-lighter:#94a3b8;--color-white:#fff;--color-gray:#f1f5f9;--color-dark:#0f172a;--color-soft-gray:#9ca3af;--font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--font-mono:"JetBrains Mono","Monaco","Menlo",monospace;--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--font-size-5xl:3rem;--font-size-6xl:3.75rem;--font-size-7xl:4.5rem;--font-size-8xl:6rem;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-2xl:3rem;--spacing-3xl:4rem;--spacing-4xl:6rem;--spacing-5xl:8rem;--border-radius:0.5rem;--border-radius-lg:1rem;--border-radius-xl:1.5rem;--transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);--shadow:0 1px 3px 0 rgba(0, 0, 0, 0.1),0 1px 2px 0 rgba(0, 0, 0, 0.06);--shadow-lg:0 10px 15px -3px rgba(0, 0, 0, 0.1),0 4px 6px -2px rgba(0, 0, 0, 0.05)}.hn,.name-row.henry{color:var(--color-primary)}.nav,.nav-link,.nav-logo,.nav-toggle span{transition:var(--transition)}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px}body{font-family:var(--font-family);font-size:var(--font-size-base);line-height:1.6;min-height:101vh!important;color:var(--color-text);background-color:var(--color-white);scrollbar-width:none;-ms-overflow-style:none}body::-webkit-scrollbar{display:none}a:focus,button:focus,input:focus,textarea:focus{outline:2px solid var(--color-primary);outline-offset:2px}.hn{font-weight:600}.about-text h4,.about-text sup,.awc,.com{font-weight:400}.awc{color:var(--color-accent)}.com{color:var(--color-text-lighter)}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-lg)}.section{padding:var(--spacing-5xl) 0;min-height:100vh;display:flex;align-items:center}.section-header{margin-bottom:var(--spacing-4xl)}.contact-title,.section-title{font-size:var(--font-size-4xl);font-weight:700;margin-bottom:var(--spacing-md);color:var(--color-text)}.section-subtitle{font-size:var(--font-size-lg);color:var(--color-text-light);max-width:600px;margin:0 auto}.nav{position:fixed;top:0;left:0;background-color:hsla(0,0%,100%,.95);border-bottom:1px solid var(--color-gray);z-index:10000}.hero,.hero-title,.name-container,.name-row,.nav-link{position:relative}.nav-container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-lg);display:flex;align-items:center;justify-content:space-between;height:70px}.nav-logo{font-size:var(--font-size-xl);font-weight:600}.nav-logo:hover{transform:translateY(-1px)}.nav-menu{display:flex;list-style:none;gap:var(--spacing-xl)}.nav-link{color:var(--color-text);font-weight:500;padding:var(--spacing-sm) 0}.nav-link:after{content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background-color:var(--color-primary);transition:width .3s}.skill-tag.secondary,.skill-tag:hover{background:var(--color-accent)}.nav-toggle{display:none;flex-direction:column;background:0 0;border:none;padding:var(--spacing-sm)}.nav-toggle span{width:25px;height:2px;background-color:var(--color-text);margin:3px 0}.hero{background-color:var(--color-white);padding-top:100px}.hero-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-2xl)}.hero-title{font-size:var(--font-size-8xl);font-weight:800;line-height:1.1;margin-bottom:var(--spacing-lg);overflow:hidden}.name-container{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm)}.name-row{display:block;opacity:0;transform:translateY(100px) rotateX(90deg);transition:1s cubic-bezier(.175, .885, .32, 1.275);transform-origin:center bottom}.name-letter.animate,.name-row.animate{opacity:1;transform:translateY(0) rotateX(0)}.name-row.henry{animation-delay:.5s}.name-row.nugraha{color:var(--color-soft-gray);animation-delay:1.2s}.name-letter{display:inline-block;opacity:0;transform:translateY(50px) rotateX(45deg);transition:.6s cubic-bezier(.175, .885, .32, 1.275);transform-origin:center bottom}.hero-description,.hero-subtitle{margin:0 auto;opacity:0;transform:translateY(30px)}.name-bg{position:absolute;top:-10px;left:-20px;width:calc(100% + 40px);height:calc(100% + 20px);background:linear-gradient(45deg,rgba(37,99,235,.1),rgba(156,163,175,.1),rgba(37,99,235,.1));background-size:400% 400%;animation:4s ease-in-out infinite morphBackground;border-radius:var(--border-radius-lg);z-index:-1;opacity:0;transition:opacity .5s}.skill-tag,.stat-item{transition:var(--transition)}.loader-sequence.active,.name-container:hover .name-bg{opacity:1}.hero-subtitle{font-size:var(--font-size-xl);color:var(--color-text-light);max-width:600px;animation:1s 2.5s forwards slideUpFade}.hero-description{font-size:var(--font-size-lg);color:var(--color-text-lighter);max-width:500px;min-height:64px;animation:1s 3s forwards slideUpFade}.central-icon,.visual-center{transform:translate(-50%,-50%)}.about,.contact{background-color:var(--color-white);padding-top:100px}.about-content{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-4xl);align-items:center}.about-description{margin-left:0}.about-skills,.about-text,.contact-methods{display:flex;flex-direction:column;gap:var(--spacing-lg)}.about-text h3{font-size:var(--font-size-4xl);margin-bottom:-4px;color:var(--color-text)}.about-text h4{font-size:var(--font-size-lg);color:var(--color-text-light);font-style:italic}.about-text .signature{font-size:var(--font-size-xs);margin-bottom:var(--spacing-md)}.about-text strong{font-size:var(--font-size-xl);margin-bottom:var(--spacing-xs)}.about-text sup{font-size:var(--font-size-xs)}.about-text p,.about-text ul,.skills-category h4{font-size:var(--font-size-lg);margin-bottom:var(--spacing-md)}.about-text ul{margin-left:var(--spacing-lg)}.about-text .footnote-line{width:40%;border:none;border-top:1px solid var(--color-dark);margin:var(--spacing-xl) auto var(--spacing-sm) var(--spacing-xs)}.about-text .footnote-text{font-size:var(--font-size-xs);line-height:1.3;margin-bottom:var(--spacing-sm)}.about-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-lg);margin-top:var(--spacing-xl)}.stat-item{padding:var(--spacing-lg);background:var(--color-gray);border-radius:var(--border-radius-lg)}.floating-element,.skill-tag,.skill-tag.secondary:hover{background:var(--color-primary)}.stat-item:hover{transform:translateY(-5px)}.stat-number{font-size:var(--font-size-3xl);font-weight:700;color:var(--color-primary);display:block}.skill-tag,.stat-label{font-size:var(--font-size-sm)}.stat-label{color:var(--color-text-light);margin-top:var(--spacing-xs)}.skills-category h4{margin-top:var(--spacing-lg);color:var(--color-text)}.skill-tag,.skill-tag a,.visual-center{color:var(--color-white)}.skills-list{display:flex;flex-wrap:wrap;gap:var(--spacing-sm)}.skill-tag{padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--border-radius);font-weight:500}.skill-tag a{cursor:none}.skill-tag:hover{transform:translateY(-2px)}.about-visual{position:relative;display:flex;justify-content:center;align-items:center}.visual-container{position:relative;width:400px;height:400px}.visual-circle{position:absolute;border-radius:50%;border:2px solid;animation:20s linear infinite rotate}.floating-element,.visual-center{position:absolute;border-radius:50%}.visual-circle:first-child{width:100%;height:100%;border-color:rgba(37,99,235,.2);animation-duration:20s}.visual-circle:nth-child(2){width:80%;height:80%;top:10%;left:10%;border-color:rgba(236,72,153,.2);animation-duration:15s;animation-direction:reverse}.visual-circle:nth-child(3){width:60%;height:60%;top:20%;left:20%;border-color:rgba(148,163,184,.2);animation-duration:10s}.visual-center{top:50%;left:50%;width:120px;height:120px;display:flex;align-items:center;justify-content:center;font-size:1250%;font-weight:700}.floating-elements{position:absolute;top:0;left:0;width:100%;height:100%}.floating-element{width:20px;height:20px;opacity:.1;animation:6s ease-in-out infinite float}.floating-element:first-child{top:20%;left:10%;animation-delay:0s}.floating-element:nth-child(2){top:60%;right:15%;animation-delay:2s;background:var(--color-accent)}.nav-arrow.right,.swipe-indicator{right:var(--spacing-xl)}.floating-element:nth-child(3){bottom:30%;left:20%;animation-delay:4s;background:var(--color-text-lighter)}.contact-content{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-4xl);align-items:center;min-height:70vh}.contact-visual{position:relative;width:100%;height:500px;background:linear-gradient(135deg,var(--color-primary),var(--color-accent));border-radius:var(--border-radius-xl);overflow:hidden;display:flex;align-items:center;justify-content:center}.connection-network{position:relative;width:100%;height:100%}.network-node{position:absolute;width:12px;height:12px;background:hsla(0,0%,100%,.8);border-radius:50%;animation:2s ease-in-out infinite pulse}.network-node:first-child{top:20%;left:15%;animation-delay:0s}.network-node:nth-child(2){top:30%;left:70%;animation-delay:.5s}.network-node:nth-child(3){top:60%;left:25%;animation-delay:1s}.network-node:nth-child(4){top:70%;left:80%;animation-delay:1.5s}.network-node:nth-child(5){top:40%;left:45%;animation-delay:2s}.network-node:nth-child(6){top:80%;left:50%;animation-delay:.3s}.network-line{position:absolute;height:1px;background:linear-gradient(90deg,hsla(0,0%,100%,.3),hsla(0,0%,100%,.1));animation:3s ease-in-out infinite lineGlow}.network-line:nth-child(7){top:25%;left:20%;width:45%;transform:rotate(15deg);animation-delay:.2s}.network-line:nth-child(8){top:45%;left:30%;width:35%;transform:rotate(-20deg);animation-delay:.8s}.network-line:nth-child(9){top:65%;left:35%;width:40%;transform:rotate(25deg);animation-delay:1.2s}.central-icon{position:absolute;top:50%;left:50%;width:80px;height:80px;background:hsla(0,0%,100%,.2);border:2px solid hsla(0,0%,100%,.5);border-radius:50%;display:flex;align-items:center;justify-content:center;animation:4s ease-in-out infinite centralPulse}.central-icon svg{width:40px;height:40px;stroke:hsla(0,0%,100%,0.9);stroke-width:1.5}.arrow-icon:hover svg,.contact-icon svg{stroke:var(--color-white)}.contact-info{display:flex;flex-direction:column;gap:var(--spacing-2xl)}.contact-icon,.contact-method{align-items:center;display:flex;transition:var(--transition)}.contact-header{opacity:0;transform:translateY(30px);animation:1s .3s forwards slideUpFade}.contact-subtitle{font-size:var(--font-size-lg);color:var(--color-text-light);margin-bottom:var(--spacing-xl)}.contact-method{gap:var(--spacing-md);padding:var(--spacing-lg);background:var(--color-gray);border-radius:var(--border-radius-lg);color:var(--color-text);opacity:0;transform:translateX(90px);animation:.8s 1.6s forwards slideLeftFade}.contact-method:first-child,.stagger-6{animation-delay:.6s}.contact-method:nth-child(2),.stagger-8{animation-delay:.8s}.contact-method:nth-child(3){animation-delay:1s}.contact-method:hover{transform:translateY(-3px);background:var(--color-white)}.arrow-icon:hover,.contact-icon{background:var(--color-primary)}.contact-icon{width:50px;height:50px;border-radius:var(--border-radius);justify-content:center}.contact-method:hover .contact-icon{background:var(--color-accent);transform:scale(1.1)}.nav-arrow.left:hover,.nav-arrow:hover{transform:translateY(-50%) translateX(5px)}.contact-icon svg{width:24px;height:24px;stroke-width:2}.contact-details h4{font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--spacing-xs);color:var(--color-text)}.availability h4,.footer-content p{margin-bottom:var(--spacing-sm)}.contact-details p{font-size:var(--font-size-base);color:var(--color-text-light)}.availability{margin-top:var(--spacing-xl);padding:var(--spacing-lg);background:linear-gradient(135deg,rgba(37,99,235,.1),rgba(236,72,153,.1));border-radius:var(--border-radius-lg);border-left:4px solid var(--color-primary);opacity:0;transform:translateY(-30px);animation:1s .5s forwards slideDownFade}.availability h4{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text)}.availability p{color:var(--color-text-light);font-size:var(--font-size-base)}.footer{background-color:var(--color-gray);color:var(--color-text);padding:var(--spacing-2xl) 0;z-index:10000;position:relative}.nav-arrow{position:fixed;top:50%;transform:translateY(-50%);z-index:1000;transition:var(--transition);opacity:0;visibility:hidden;animation:2s 4.5s forwards arrowFadeIn}#cursor,#cursorPt,.swipe-indicator{z-index:99999;visibility:hidden;position:fixed}.nav-arrow.show{opacity:.7s;visibility:visible}.nav-arrow:hover{opacity:1}.nav-arrow.left{left:var(--spacing-xl)}.nav-arrow.right:hover{transform:translateY(-50%) translateX(-5px)}.arrow-icon{width:60px;height:60px;border:2px solid var(--color-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;background:hsla(0,0%,100%,.9);transition:var(--transition)}.arrow-icon:hover{transform:scale(1.1)}.arrow-icon svg{width:24px;height:24px;stroke:var(--color-primary);transition:var(--transition)}.swipe-indicator{bottom:var(--spacing-xl);display:none;flex-direction:column;align-items:center;gap:var(--spacing-sm);opacity:0}.swipe-indicator.show{opacity:.6;visibility:visible;animation:3s forwards swipeIndicatorFadeIn,3s ease-in-out 3s infinite pulse}.swipe-text{font-size:var(--font-size-sm);color:var(--color-text-light);writing-mode:horizontal-tb;text-orientation:mixed}.hello-text,.loader-text{color:var(--color-text)}.swipe-line{width:40px;height:2px;background:linear-gradient(to right,var(--color-primary),var(--color-soft-gray));border-radius:1px}.swipe-area{position:fixed;top:0;left:0;width:100px;height:100vh;z-index:999;background:0 0}.loader,.spinner-container{display:flex;background-color:var(--color-white)}.swipe-area.left{left:0}.swipe-area.right{right:0}#cursorPt{width:7px;height:7px;background:var(--color-accent);border-radius:50%}#cursor{--color:var(--color-primary);width:30px;height:30px;background-image:linear-gradient(90deg,var(--color) 10px,transparent 0),linear-gradient(180deg,var(--color) 10px,transparent 0),linear-gradient(270deg,var(--color) 10px,transparent 0),linear-gradient(180deg,var(--color) 10px,transparent 0),linear-gradient(90deg,var(--color) 10px,transparent 0),linear-gradient(0deg,var(--color) 10px,transparent 0),linear-gradient(270deg,var(--color) 10px,transparent 0),linear-gradient(0deg,var(--color) 10px,transparent 0);background-repeat:no-repeat;background-position:0 0,0 0,100% 0,100% 0,0 100%,0 100%,100% 100%,100% 100%;background-size:20px 2px,2px 20px,20px 2px,2px 20px,20px 2px,2px 20px,20px 2px,2px 20px}.loader{position:fixed;top:0;left:0;width:100%;height:100%;align-items:center;justify-content:center;z-index:9999;transition:opacity .3s}.loader-content{position:relative}.loader-text{font-size:var(--font-size-4xl);font-weight:600;height:80px;display:flex;align-items:center;justify-content:center}.loader-sequence{position:absolute;top:0;left:50%;transform:translateX(-50%);opacity:0;white-space:nowrap;transition:opacity .5s}.fade-overlay,.spinner-container{position:fixed;left:0;width:100%;visibility:hidden}.live-text{color:var(--color-primary)}.listen-text{color:var(--color-accent)}.learn-text{color:var(--color-text-lighter)}.fade-overlay{top:0;height:100%;background:var(--color-white);z-index:9998;opacity:0;transition:.6s}.fade-overlay.active,.spinner-container.active{opacity:1;visibility:visible}.spinner-container{top:70px;height:calc(100vh - 70px);align-items:center;justify-content:center;z-index:9999;opacity:0;transition:opacity .8s}.configure-border-1,.spinner-box{justify-content:center;width:115px;height:115px;display:flex}.spinner-box{position:relative;align-items:center}.configure-border-1{position:absolute;background:var(--color-primary);animation:3s ease-in-out infinite alternate configure-clockwise;padding:3px;align-items:center}.configure-border-2{left:-115px;background:var(--color-accent);transform:rotate(45deg);animation:3s ease-in-out infinite alternate configure-xclockwise;width:115px;height:115px;padding:3px;display:flex;justify-content:center;align-items:center}.configure-core{width:100%;height:100%;background-color:var(--color-white)}.barba-container{position:relative}.barba-container[data-barba=container]{opacity:0}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes float{0%,to{transform:translateY(0) scale(1);opacity:.1}50%{transform:translateY(-20px) scale(1.2);opacity:.3}}@keyframes slideUp{to{opacity:1;transform:translateY(0)}}@keyframes slideLeft{to{opacity:1;transform:translateX(0)}}@keyframes slideRight{to{opacity:1;transform:translateX(0)}}@keyframes popIn{to{opacity:1;transform:scale(1)}}@keyframes morphBackground{0%,to{background-position:0 50%}50%{background-position:100% 50%}}@keyframes slideUpFade{to{opacity:1;transform:translateY(0)}}@keyframes slideDownFade{to{opacity:1;transform:translateY(0)}}@keyframes slideLeftFade{to{opacity:1;transform:translateX(0)}}@keyframes slideRightFade{to{opacity:1;transform:translateX(0)}}@keyframes arrowFadeIn{to{opacity:.7;visibility:visible}}@keyframes swipeIndicatorFadeIn{from{opacity:0;visibility:visible;transform:translateX(var(--spacing-xl))}to{opacity:.6;visibility:visible;transform:translateX(0)}}@keyframes pulse{0%,to{opacity:.6}50%{opacity:1}}@keyframes lineGlow{0%,to{opacity:.3}50%{opacity:.8}}@keyframes centralPulse{0%,to{transform:translate(-50%,-50%) scale(1);opacity:.8}50%{transform:translate(-50%,-50%) scale(1.1);opacity:1}}@keyframes configure-clockwise{0%{transform:rotate(0)}25%{transform:rotate(90deg)}50%{transform:rotate(180deg)}75%{transform:rotate(270deg)}100%{transform:rotate(360deg)}}@keyframes configure-xclockwise{0%{transform:rotate(45deg)}25%{transform:rotate(-45deg)}50%{transform:rotate(-135deg)}75%{transform:rotate(-225deg)}100%{transform:rotate(-315deg)}}@keyframes fadeIn{to{opacity:1}}@media (max-width:768px){main{padding:25.6% 0}.nav-menu{font-size:var(--font-size-sm);gap:var(--spacing-md)}.footer{margin-top:var(--spacing-3xl);background:linear-gradient(to right,transparent,rgba(0,0,0,.16),transparent) top center no-repeat;background-size:80% 1px;width:100%;text-align:center;padding:var(--spacing-md) var(--spacing-sm) var(--spacing-xs) 0;margin-top:25.6%;margin-bottom:-25.6%}.footer .container{flex:1 0 auto}.hero-title{font-size:var(--font-size-6xl)}.hero-subtitle{max-width:73%}.hero-description{max-width:51%}.contact-title,.section-title{font-size:var(--font-size-3xl)}.container{padding:0 var(--spacing-md)}.section{padding:var(--spacing-md) 0;min-height:auto}.about-content,.contact-content{grid-template-columns:1fr;gap:var(--spacing-2xl)}.about-stats{grid-template-columns:1fr}.contact-visual{height:300px;order:2}.contact-info{order:1}.visual-container{width:300px;height:300px}.nav-arrow{display:none}.swipe-indicator{display:flex;flex-direction:row;bottom:var(--spacing-lg);transform:translateX(50%)}.swipe-text{writing-mode:horizontal-tb;text-orientation:mixed}.swipe-line{width:40px;height:2px;background:linear-gradient(90deg,var(--color-primary),var(--color-soft-gray))}}@media (max-width:480px){.hero-title{font-size:var(--font-size-5xl)}.contact-title,.section-title{font-size:var(--font-size-2xl)}.contact-visual{height:250px}}@media (prefers-contrast:high){:root{--color-primary:#00f;--color-text:#000;--color-text-light:#333}}@media (prefers-reduced-motion:reduce){*{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important}}.animate-slide-up{opacity:0;transform:translateY(50px);animation:.8s forwards slideUp}.animate-slide-left{opacity:0;transform:translateX(-50px);animation:.8s forwards slideLeft}.animate-slide-right{opacity:0;transform:translateX(50px);animation:.8s forwards slideRight}.animate-pop-in{opacity:0;transform:scale(.8);animation:.6s cubic-bezier(.175,.885,.32,1.275) forwards popIn}.stagger-1{animation-delay:.1s}.stagger-2{animation-delay:.2s}.stagger-3{animation-delay:.3s}.stagger-4{animation-delay:.4s}.stagger-5{animation-delay:.5s}.stagger-7{animation-delay:.7s}.stagger-9{animation-delay:.9s}