@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/bricolage-grotesque-vietnamese-opsz-normal-D9N6E8K1.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/bricolage-grotesque-latin-ext-opsz-normal-IcJDqblK.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/bricolage-grotesque-latin-opsz-normal-Cre6nC2_.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Instrument Sans Variable;font-style:normal;font-display:swap;font-weight:400 700;src:url(/assets/instrument-sans-latin-ext-wght-normal-B5bTHO_g.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Instrument Sans Variable;font-style:normal;font-display:swap;font-weight:400 700;src:url(/assets/instrument-sans-latin-wght-normal-BbzFLZTg.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--primary-light: #ffffff;--primary-gray: #f5f5f5;--gray-100: #f8f9fa;--gray-200: #e9ecef;--gray-300: #dee2e6;--gray-400: #ced4da;--gray-500: #adb5bd;--gray-600: #6c757d;--gray-700: #495057;--gray-800: #343a40;--gray-900: #212529;--secondary: #ff8c00;--secondary-light: #ffb347;--secondary-dark: #e67e00;--transition: all .3s ease;--font-display: "Bricolage Grotesque Variable", "Segoe UI", system-ui, sans-serif;--font-body: "Instrument Sans Variable", "Segoe UI", system-ui, sans-serif}*{margin:0;padding:0;box-sizing:border-box;font-family:var(--font-body)}::selection{background-color:#ff8c0040;color:var(--gray-900)}:focus-visible{outline:2px solid var(--secondary);outline-offset:3px}body{background-color:var(--primary-light);color:var(--gray-800);overflow-x:hidden}section{padding:5rem 2rem}h1,h2,h3,h4{margin-bottom:1rem;line-height:1.2;font-family:var(--font-display);font-weight:700;letter-spacing:-.02em;text-wrap:balance}a{color:var(--secondary);text-decoration:none;transition:var(--transition)}a:hover{color:var(--secondary-dark)}p{margin-bottom:1rem}.container{max-width:1200px;margin:0 auto}.site-header{position:fixed;top:1rem;left:0;right:0;z-index:100;display:flex;justify-content:center;padding:0 1rem;pointer-events:none}.nav-pill{position:relative;display:flex;align-items:center;gap:.75rem;padding:.4rem .5rem .4rem .4rem;background-color:var(--gray-900);border:1px solid rgba(255,255,255,.08);border-radius:999px;box-shadow:0 12px 30px #21252940;pointer-events:auto}.nav-avatar img{display:block;width:38px;height:38px;border-radius:50%;border:2px solid var(--gray-700);object-fit:cover}.nav-divider{width:1px;height:24px;background-color:#ffffff26}.nav-sections{display:flex;gap:.25rem;list-style:none}.nav-sections a{display:block;padding:.5rem .75rem;border-radius:999px;color:var(--gray-200);font-size:.95rem;font-weight:500;white-space:nowrap}.nav-sections a:hover{color:var(--secondary)}.nav-cta{padding:.55rem 1.25rem;border-radius:999px;background-color:var(--secondary);color:var(--primary-light);font-size:.95rem;font-weight:600;white-space:nowrap}.nav-cta:hover{background-color:var(--secondary-dark);color:var(--primary-light)}.nav-icon-btn{display:flex;align-items:center;justify-content:center;gap:.4rem;background:transparent;border:none;border-radius:999px;color:var(--gray-200);font-family:inherit;cursor:pointer;transition:var(--transition)}.nav-icon-btn:hover,.nav-icon-btn[aria-expanded=true]{background-color:#ffffff14}.nav-sections-toggle{display:none;width:38px;height:38px;font-size:1.1rem}.nav-lang{position:relative}.nav-lang-toggle{padding:.45rem .6rem;font-size:.9rem;font-weight:500}.flag{display:block;width:20px;height:14px;border-radius:2px;object-fit:cover}.nav-chevron{transition:transform .2s ease}.nav-lang-toggle[aria-expanded=true] .nav-chevron{transform:rotate(180deg)}.nav-dropdown,.nav-sections.is-open{position:absolute;top:calc(100% + .75rem);min-width:180px;padding:.4rem;list-style:none;background-color:var(--gray-900);border:1px solid rgba(255,255,255,.08);border-radius:16px;box-shadow:0 16px 40px #2125294d}.nav-dropdown{right:0}.nav-dropdown a,.nav-sections.is-open a{display:flex;align-items:center;gap:.6rem;width:100%;padding:.7rem .9rem;border:none;border-radius:10px;background:transparent;color:var(--gray-200);font-family:inherit;font-size:.95rem;font-weight:500;text-align:left;cursor:pointer}.nav-dropdown a:hover,.nav-sections.is-open a:hover{background-color:#ffffff14;color:var(--gray-200)}.nav-dropdown a.is-active{color:var(--secondary)}.hero{min-height:100vh;min-height:100dvh;display:flex;align-items:center;position:relative;overflow:hidden;padding-top:6rem;padding-bottom:6rem;background-color:var(--primary-gray);color:var(--gray-800)}.hero-grid{width:100%;display:grid;grid-template-columns:1.15fr .85fr;gap:3rem;align-items:center}.hero-content{position:relative;z-index:2;max-width:800px}.hero h1{font-size:3.5rem;margin-bottom:1rem}.hero h2{font-size:1.5rem;font-weight:400;margin-bottom:2rem}.hero p{max-width:46ch;color:var(--gray-700);line-height:1.6}.role-rotator{position:relative;display:inline-block;font-weight:600;overflow:hidden;vertical-align:bottom}.role-sizer{visibility:hidden;white-space:nowrap}.role{position:absolute;left:0;top:0;white-space:nowrap;opacity:0;transform:translateY(100%);transition:transform .6s cubic-bezier(.16,1,.3,1),opacity .4s ease}.role.is-active{opacity:1;transform:translateY(0)}.role.is-prev{transform:translateY(-100%)}.hero-visual{display:flex;justify-content:center;perspective:1000px}.cert-deck{--tilt-x: 0deg;--tilt-y: 0deg;position:relative;display:block;width:min(100%,340px);aspect-ratio:3 / 2;transform:rotateX(var(--tilt-y)) rotateY(var(--tilt-x));transition:transform .3s ease-out}.deck-card{position:absolute;inset:0;z-index:calc(10 - var(--i));border-radius:10px;overflow:hidden;background-color:var(--primary-light);box-shadow:0 18px 40px #4950572e;transform-origin:50% 140%;transform:translate(var(--dx),var(--dy)) rotate(var(--rest-rot));transition:transform .6s cubic-bezier(.16,1,.3,1)}.deck-card img{display:block;width:100%;height:100%;object-fit:cover}.cert-deck:hover .deck-card,.cert-deck:focus-visible .deck-card{transform:rotate(var(--fan))}.cert-deck:focus-visible{outline:2px solid var(--secondary);outline-offset:12px;border-radius:10px}@media(prefers-reduced-motion:reduce){.role,.cert-deck,.deck-card{transition:none}}.btn,.btn-career,.submit-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;border:1.5px solid transparent;border-radius:999px;font-size:1rem;font-weight:600;cursor:pointer;transition:background-color .25s ease,color .25s ease,border-color .25s ease,transform .15s ease}.btn:active,.btn-career:active,.submit-btn:active{transform:scale(.97)}.btn{gap:.5rem;padding:.7rem 1.75rem;background-color:var(--secondary);color:var(--primary-light);margin-right:1rem;margin-bottom:1rem}.btn:hover{background-color:var(--secondary-dark);color:var(--primary-light)}.btn-outline{background-color:transparent;border-color:var(--gray-900);color:var(--gray-900)}.btn-outline:hover{background-color:var(--gray-900);color:var(--gray-100)}.btn-logo{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background-color:var(--primary-light)}.btn-logo img{display:block;width:16px;height:16px}.btn-career{width:48px;padding:0;margin-bottom:1rem;background-color:transparent;border-color:var(--gray-900);color:var(--gray-900)}.btn-career:hover{background-color:var(--gray-900);color:var(--secondary)}.about{background-color:var(--primary-light)}.about-content{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}.about-img{position:relative}.about-img img{width:100%;border-radius:100%;box-shadow:0 30px 60px #00000014;transition:var(--transition)}.about-text h2{position:relative;display:inline-block;margin-bottom:2rem;color:var(--gray-800)}.about-text h2:after{content:"";position:absolute;left:0;bottom:-10px;width:60px;height:4px;background:var(--secondary)}.projects{background-color:var(--primary-light)}.projects h2,.resume h2{text-align:center;margin-bottom:3rem;color:var(--gray-800);position:relative;display:inline-block;left:50%;transform:translate(-50%)}.projects h2:after,.resume h2:after{content:"";position:absolute;left:50%;bottom:-10px;width:60px;height:4px;background:var(--secondary);transform:translate(-50%)}.project-card{transition:transform .3s ease,box-shadow .3s ease,opacity .3s ease;opacity:1}.filter-btn{transition:background-color .3s ease,color .3s ease}.projects-grid{min-height:450px}.filter-buttons{display:flex;justify-content:center;gap:.25rem;width:fit-content;margin:0 auto 2rem;padding:.35rem;background-color:var(--gray-900);border-radius:999px;box-shadow:0 12px 30px #2125292e}.filter-btn{padding:.6rem 1.35rem;background-color:transparent;border:none;border-radius:999px;color:var(--gray-200);font-size:.95rem;font-weight:500;cursor:pointer;transition:background-color .25s ease,color .25s ease}.filter-btn:hover{background-color:#ffffff14}.filter-btn.active{background-color:var(--secondary);color:var(--primary-light);font-weight:600}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2rem}.project-card{border:1px solid var(--gray-200);border-radius:10px;overflow:hidden;box-shadow:0 10px 30px #0000000d;transition:var(--transition);display:flex;flex-direction:column;height:100%;background-color:var(--primary-light)}.project-card:hover{transform:translateY(-10px);box-shadow:0 20px 40px #0000001a}.project-image{height:200px;background-color:var(--gray-300);overflow:hidden;text-align:center}.project-image img{width:100%;height:100%;object-fit:cover;transition:var(--transition)}.project-card:hover .project-image img{transform:scale(1.1)}.project-content{padding:1.5rem;flex-grow:1;display:flex;flex-direction:column}.project-content h3{margin-bottom:.5rem;color:var(--gray-800)}.project-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.project-tag{font-size:.8rem;padding:.3rem .8rem;border-radius:50px;background-color:var(--gray-200);color:var(--gray-700)}button.project-tag{border:none;font-family:inherit;line-height:inherit;cursor:pointer;transition:var(--transition)}button.project-tag:hover{background-color:var(--gray-300)}.active-tag-filter{display:flex;justify-content:center;margin:-1rem 0 2rem}.project-tag.active{display:inline-flex;align-items:center;gap:.5rem;background-color:var(--secondary);color:#fff}.project-tag.active:hover{background-color:var(--secondary-dark)}.active-tag-logo{display:inline-flex;align-items:center;padding:.15rem .5rem;border-radius:50px;background-color:#fff}.active-tag-logo img{margin-top:0!important}.project-links{margin-top:auto;display:flex}.resume{background-color:var(--primary-gray)}.resume-intro{max-width:60ch;margin:-1rem auto 3rem;text-align:center;color:var(--gray-700);line-height:1.6}.timeline{--progress: 0;position:relative;max-width:760px;margin:0 auto;padding-left:2.5rem;list-style:none}.timeline:before,.timeline:after{content:"";position:absolute;left:9px;top:.5rem;bottom:.5rem;width:2px;border-radius:2px}.timeline:before{background-color:var(--gray-300)}.timeline:after{background-color:var(--secondary);transform-origin:top;transform:scaleY(var(--progress))}.timeline-item{position:relative;padding-bottom:2.5rem}.timeline-item:last-child{padding-bottom:0}.timeline-dot{position:absolute;left:-37px;top:.3rem;z-index:1;width:14px;height:14px;border:2px solid var(--gray-400);border-radius:50%;background-color:var(--primary-light);transition:background-color .3s ease,border-color .3s ease,transform .3s ease}.timeline-item.is-active .timeline-dot{background-color:var(--secondary);border-color:var(--secondary);transform:scale(1.15)}.timeline-meta{margin-bottom:.25rem;color:var(--gray-600);font-size:.9rem;font-weight:500}.timeline-item h3{margin-bottom:.1rem;font-size:1.3rem;color:var(--gray-800)}.timeline-org{margin-bottom:.5rem;color:var(--gray-700);font-weight:600}.timeline-org a{color:inherit}.timeline-org a:hover{color:var(--secondary)}.timeline-summary{max-width:62ch;margin-bottom:0;color:var(--gray-700);line-height:1.6}.resume-skills{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem 3rem;max-width:760px;margin:3.5rem auto 0;padding-top:2.5rem;border-top:1px solid var(--gray-300)}.resume-skills dt{margin-bottom:.25rem;color:var(--gray-800);font-weight:600}.resume-skills dd{color:var(--gray-700);line-height:1.6}.resume-actions{max-width:760px;margin:2.5rem auto 0}@media(prefers-reduced-motion:reduce){.timeline-dot{transition:none}}.contact{background-color:var(--gray-800);color:var(--primary-light);text-align:center}.contact h2{position:relative;display:inline-block;margin-bottom:2rem;color:var(--primary-light)}.contact h2:after{content:"";position:absolute;left:50%;bottom:-10px;width:60px;height:4px;background:var(--secondary);transform:translate(-50%)}.contact-form{max-width:600px;margin:0 auto}.form-group{margin-bottom:1.5rem}.form-control{width:100%;padding:1rem;border:none;border-radius:4px;background-color:#ffffff1a;color:var(--primary-light);resize:vertical;transition:var(--transition)}.form-control:focus{outline:none;background-color:#fff3}.form-control::placeholder{color:#ffffffb3}.submit-btn{padding:.7rem 2rem;background-color:var(--secondary);color:var(--primary-light)}.submit-btn:hover{background-color:var(--secondary-dark)}.social-links{display:flex;justify-content:center;gap:1.5rem;margin-top:2rem}.social-link{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background-color:#ffffff1a;color:var(--primary-light);transition:var(--transition)}.social-link:hover{background-color:var(--secondary);transform:translateY(-5px)}footer{text-align:center;padding:2rem;background-color:var(--gray-900);color:var(--primary-light)}.cookie-banner{position:fixed;bottom:-200px;left:50%;transform:translate(-50%);width:90%;max-width:400px;background:#000000e6;color:#fff;padding:15px 20px;text-align:center;border-radius:15px;font-size:14px;box-shadow:0 4px 10px #0003;transition:bottom .5s ease-in-out;z-index:999}.cookie-banner.show{bottom:20px}.buttons{margin-top:10px;display:flex;justify-content:center;gap:10px}.cookie-banner button{padding:8px 18px;border-radius:999px;border:1.5px solid transparent;cursor:pointer;font-weight:600;transition:background-color .25s ease,border-color .25s ease}#accept-cookies{background-color:var(--secondary);color:var(--primary-light)}#accept-cookies:hover{background-color:var(--secondary-dark)}#decline-cookies{background-color:transparent;border-color:#ffffff59;color:var(--gray-100)}#decline-cookies:hover{background-color:#ffffff1a}.cookie-settings{position:fixed;bottom:10px;right:10px;z-index:999}.cookie-settings button{background:var(--gray-900);color:#fff;border:1px solid rgba(255,255,255,.08);padding:20px;border-radius:100%;cursor:pointer;box-shadow:0 12px 30px #21252940}.cookie-settings button:hover{background:var(--gray-700)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .8s ease both}.delay-1{animation-delay:.2s}.delay-2{animation-delay:.4s}.delay-3{animation-delay:.6s}@media(max-width:768px){.about-content{grid-template-columns:1fr;gap:2rem}.hero h1{font-size:2.5rem}.hero{padding-top:7rem}.hero-grid{grid-template-columns:1fr;gap:2.5rem}.hero h2{font-size:1.3rem}.hero-visual{display:none}.resume-skills{grid-template-columns:1fr}.nav-pill{gap:.5rem}.nav-divider-start,.nav-lang-code,.nav-chevron{display:none}.nav-sections-toggle{display:flex}.nav-sections{display:none}.nav-sections.is-open{display:block;left:0}.nav-cta{padding:.5rem 1rem}}
