:root{--bg:#0c0c0c;--ink:#d7e2ea;--muted:#9ba4ac;--line:#d7e2ea33;--cta:linear-gradient(123deg,#18011f 7%,#b600a8 37%,#7621b0 72%,#be4c00 100%);color-scheme:dark;font-family:Kanit,sans-serif;font-weight:300}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:36px}body{margin:0;background:var(--bg);color:var(--ink);font-family:Kanit,sans-serif;font-size:16px;line-height:1.55}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid #e2a5ff;outline-offset:6px}h1,h2,h3,p,figure{margin:0}img{display:block;max-width:100%}svg{width:20px;height:20px;flex-shrink:0}button svg,a svg{display:inline-block;vertical-align:middle}::selection{background:#ac20b0;color:#fff}main{overflow-x:clip}main:focus,section:focus,#contact:focus{outline:0}.silver,.section-heading:not(.light .section-heading){background:linear-gradient(180deg,#646973 0%,#bbccd7 100%);background-clip:text;-webkit-background-clip:text;color:transparent}.section-heading{font-weight:900;text-transform:uppercase;letter-spacing:-.025em;font-size:clamp(48px,12vw,160px);line-height:1;text-align:center;margin:0 0 112px}.section-title-row .section-heading{margin-bottom:112px}.skip-link{position:fixed;left:20px;top:-80px;z-index:120;background:#fff;color:#0c0c0c;padding:12px 20px}.skip-link:focus{top:16px}.contact-button{display:inline-flex;align-items:center;justify-content:center;min-height:56px;border-radius:999px;padding:16px 48px;font-size:16px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;background:var(--cta);color:white;outline:2px solid white;outline-offset:-3px;box-shadow:0 4px 4px #b501a740,inset 4px 4px 12px #7721b1;transition:transform .25s,box-shadow .25s}.contact-button:hover{transform:translateY(-3px);box-shadow:0 5px 20px #b501a755,inset 4px 4px 12px #7721b1}.contact-button:focus-visible{outline:3px solid #fff;outline-offset:5px}
.hero{min-height:720px;height:100svh;max-height:1200px;display:flex;flex-direction:column;position:relative;isolation:isolate}.hero-nav{padding:27px 40px 0;position:relative;z-index:30}.desktop-links{display:flex;justify-content:space-between;gap:28px}.desktop-links a{text-transform:uppercase;letter-spacing:.035em;font-size:clamp(16px,1.75vw,24px);font-weight:500;min-height:44px;display:flex;align-items:center;transition:opacity .2s}.desktop-links a:hover{opacity:.7}.menu-toggle{display:none;border:0;background:transparent;padding:8px;min-height:44px;min-width:44px}.hero-heading-wrap{position:relative;z-index:20;pointer-events:none;margin-top:-14px;overflow:hidden}.hero-heading{font-size:15.2vw;line-height:1;letter-spacing:-.035em;font-weight:900;text-transform:uppercase;text-align:center;white-space:nowrap;width:100%}.hero-portrait{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:520px;max-width:54vw;z-index:10}.hero-portrait img{width:100%;height:auto;max-height:68svh;object-fit:contain;object-position:bottom;user-select:none}.magnet{transition:transform .55s ease-out;will-change:transform}.hero-bottom{position:relative;z-index:20;display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-top:auto;padding:30px 40px 40px}.hero-tagline{font-size:clamp(16px,1.4vw,22px);font-weight:300;text-transform:uppercase;max-width:265px;line-height:1.4;letter-spacing:.015em}.hero-name{display:block;margin-top:13px;font-size:12px;text-transform:uppercase;letter-spacing:.09em;color:#aab4bd}.showcase{padding:150px 0 45px;overflow:hidden}.gallery{display:grid;gap:12px}.gallery-window{overflow:hidden}.gallery-track{display:flex;gap:12px;width:max-content;transform:translateX(calc(-1 * var(--gallery-group,1296px) + var(--gallery-offset,0px)));will-change:transform}.gallery-window.reverse .gallery-track{transform:translateX(calc(-1 * var(--gallery-group,1296px) - var(--gallery-offset,0px)))}.gallery-group{display:flex;gap:12px;flex-shrink:0}.gallery-tile{position:relative;width:420px;height:270px;overflow:hidden;flex-shrink:0;border-radius:16px;background:#1a161e}.gallery-tile img{height:100%;width:100%;object-fit:cover;transition:transform .5s}.gallery-tile:hover img{transform:scale(1.045)}.gallery-tile span{position:absolute;inset:auto 0 0;padding:45px 22px 18px;background:linear-gradient(transparent,#09070bd9);font-weight:400;font-size:17px;display:flex;align-items:center;justify-content:space-between}.reverse .gallery-tile:first-child img{object-position:center 65%}.visual-note{font-size:13px;color:var(--muted);text-align:center;max-width:760px;margin:30px auto 0;padding:0 24px;line-height:1.6}
.about{min-height:100svh;position:relative;display:flex;align-items:center;justify-content:center;padding:100px 40px;overflow:hidden}.about-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;gap:60px;width:100%}.about .section-heading{margin-bottom:0}.about-story{max-width:560px;font-size:clamp(18px,2vw,22px);font-weight:500;line-height:1.65;position:relative}.about-story .word{display:inline-block;white-space:nowrap}.about-story .char{opacity:var(--char-opacity,1);transition:opacity .1s}.about-contact{display:flex;align-items:center;justify-content:center;gap:18px 28px;flex-wrap:wrap;scroll-margin-top:80px}.about-contact a{font-size:14px;letter-spacing:.045em;text-transform:uppercase;display:flex;align-items:center;gap:9px;min-height:44px;color:#b4bec6}.about-contact a:hover{color:#fff}.about-contact svg{width:17px;height:17px}.decoration{position:absolute;object-fit:contain;pointer-events:none;z-index:1}.moon{width:210px;top:4%;left:4%}.lego{width:210px;top:4%;right:4%}.smile{width:180px;bottom:8%;left:10%}.cursor{width:220px;bottom:8%;right:10%}.skills-section{padding:128px 0 160px;overflow:hidden}.skills-section .section-heading{margin-bottom:70px}.marquee-controls{display:flex;justify-content:flex-end;padding:0 40px;margin-bottom:20px}.marquee-controls button{display:flex;align-items:center;gap:7px;background:none;border:0;color:var(--muted);min-height:44px;font-size:13px}.marquee-controls svg{width:15px;height:15px}.skills-window{overflow:hidden;margin-top:16px}.skills-track{display:flex;width:max-content;gap:16px;animation:skills-left 45s linear infinite}.skills-group{display:flex;gap:16px;flex-shrink:0}.skills-window.reverse .skills-track{animation-direction:reverse;animation-duration:52s}.skill-pill{display:block;border:1px solid var(--line);background:#d7e2ea0a;color:var(--ink);border-radius:99px;padding:15px 32px;font-size:18px;font-weight:500;white-space:nowrap}.skills-window:hover .skills-track,.motion-paused .skills-track{animation-play-state:paused}@keyframes skills-left{to{transform:translateX(calc(-50% - 8px))}}
.panel{position:relative;z-index:3;border-radius:60px 60px 0 0;margin-top:-56px;padding:128px 40px 170px}.light{background:#fff;color:var(--bg);color-scheme:light}.light>.section-heading{color:var(--bg);background:none}.dark{background:var(--bg);color:var(--ink)}.services-list{max-width:1024px;margin:auto}.service-row{display:flex;align-items:flex-start;gap:48px;padding:48px 0;border-top:1px solid #0c0c0c26}.service-row:first-child{border-top:0}.big-number{font-size:clamp(48px,10vw,140px);font-weight:900;line-height:1;letter-spacing:-.045em;flex-shrink:0;min-width:1.15em}.service-row>div{padding-top:8px;min-width:0}.service-row h3,.numbered-title h3{font-size:clamp(21px,2.2vw,34px);font-weight:500;text-transform:uppercase;line-height:1.2}.service-row p{font-weight:300;font-size:clamp(16px,1.6vw,20px);line-height:1.7;color:#626262;max-width:670px;margin-top:14px}.project-toolbar{max-width:1152px;margin:0 auto 56px;display:flex;align-items:center;justify-content:space-between;gap:20px}.filters{display:flex;flex-wrap:wrap;gap:9px}.filters button{background:none;border:1px solid var(--line);border-radius:99px;padding:10px 22px;font-size:14px;min-height:44px}.filters button[aria-pressed=true]{background:var(--ink);color:var(--bg)}.work-count{font-size:13px;text-transform:uppercase;white-space:nowrap;color:var(--muted)}.project-stack{max-width:1152px;margin:auto}.project-slot{position:sticky;top:calc(65px + var(--card-index)*28px);min-height:72svh;padding-bottom:90px}.project-slot:last-child{min-height:initial;padding-bottom:30px}.project-slot[hidden]{display:none}.project-stack.filtered .project-slot{position:relative;top:auto;min-height:initial;padding-bottom:30px}.project-card{position:relative;display:flex;gap:40px;background:var(--bg);border:2px solid var(--ink);padding:32px;border-radius:60px;transform-origin:center top;will-change:transform;box-shadow:0 -10px 35px #0c0c0c33}.project-copy{flex:1;min-width:0}.numbered-title{display:flex;align-items:center;gap:32px;min-width:0}.numbered-title>div{min-width:0}.eyebrow{display:block;font-size:13px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;line-height:1.6}.project-copy>p{font-size:18px;font-weight:300;color:#adb6bf;line-height:1.65;max-width:530px;margin-top:24px}.outline-button{display:inline-flex;align-items:center;justify-content:center;gap:14px;border:2px solid var(--ink);border-radius:99px;background:transparent;padding:14px 34px;font-weight:500;font-size:15px;letter-spacing:.1em;text-transform:uppercase;min-height:52px;margin-top:30px;transition:background .2s}.outline-button:hover{background:#d7e2ea1a}.project-image{width:34%;max-width:340px;flex-shrink:0;position:relative;align-self:flex-start}.project-image img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:40px}.project-image figcaption{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);text-align:center;margin-top:12px}.record-list{max-width:1152px;margin:auto;display:grid;gap:32px}.record{border-radius:60px;padding:40px;background:var(--bg);color:var(--ink);border:1px solid #d7e2ea1a}.record-top{display:flex;align-items:center;justify-content:space-between;gap:26px}.record .numbered-title{flex:1}.record .big-number{font-size:clamp(48px,8vw,118px)}.record h3{font-size:clamp(20px,2vw,29px)}.date-pill{flex-shrink:0;border:1px solid #d7e2ea4d;border-radius:99px;padding:10px 16px;font-size:12px;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}.record>p,.record li{color:#aab4bd;line-height:1.65;font-size:18px;font-weight:300}.record ul{max-width:890px;margin:26px 0 0;padding-left:20px;list-style:disc}.record li+li{margin-top:9px}.record .record-location{font-size:13px;color:#9ba4ac;margin-top:20px}.record .tools-note{font-size:14px;margin-top:18px}.education-card{background:#d7e2ea0f;border-color:#d7e2ea33}.education-card>p{margin-top:25px}.milestones-section{padding:75px 40px 130px}.milestone-card{border:2px solid var(--ink)}.milestone-card>p{margin-top:24px}.footer{border-top:1px solid var(--line);padding:35px 40px 28px;display:flex;align-items:center;justify-content:space-between;gap:25px;flex-wrap:wrap}.footer-name{text-transform:uppercase;font-size:21px;font-weight:600;letter-spacing:.03em}.footer>div{display:flex;flex-wrap:wrap;gap:25px}.footer a,.footer button{min-height:44px;display:inline-flex;align-items:center;gap:8px}.footer button{background:none;border:none;padding:0;font-size:14px}.footer>div a{font-size:14px}.footer p{width:100%;font-size:12px;color:var(--muted)}.footer svg{width:16px;height:16px}
dialog{margin:auto;padding:0;background:#121212;color:var(--ink);border:1px solid var(--line);border-radius:32px;width:min(620px,calc(100% - 32px));max-height:88svh;overflow:auto;overscroll-behavior:contain}dialog::backdrop{background:#000c;backdrop-filter:blur(12px)}.dialog-inner{padding:42px}.dialog-close,.menu-close{position:absolute;top:17px;right:17px;display:grid;place-items:center;width:44px;height:44px;background:#222;border:1px solid var(--line);border-radius:50%;z-index:3}.dialog-inner h2{font-size:35px;font-weight:600;line-height:1.1;text-transform:uppercase;margin:26px 0 22px}.dialog-inner p,.dialog-inner li{font-size:17px;color:#b5bec6;line-height:1.65}.dialog-inner ul{padding-left:22px;list-style:disc;margin:24px 0}.dialog-inner li+li{margin-top:8px}.dialog-inner .eyebrow{font-size:12px;padding-right:20px}.dialog-inner .dialog-footnote{font-size:13px;border-top:1px solid var(--line);padding-top:20px}.mobile-menu{width:100%;height:100%;max-height:100svh;max-width:100%;border:0;border-radius:0;padding:85px 32px 32px}.mobile-menu nav{display:flex;flex-direction:column;gap:22px}.mobile-menu nav a{font-size:36px;text-transform:uppercase;font-weight:700;line-height:1.25}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--bg);border-radius:99px;padding:14px 25px;font-size:15px;z-index:150;max-width:calc(100% - 30px);text-align:center}.toast[hidden]{display:none}.js-reveal [data-reveal]{opacity:0;transform:translateY(32px);transition:opacity .7s ease,transform .7s ease}.js-reveal [data-reveal].is-visible{opacity:1;transform:none}
.record-list{grid-template-columns:minmax(0,1fr)}.record{min-width:0}.numbered-title h3,.eyebrow{overflow-wrap:anywhere}.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.linkedin-button{gap:10px}.linkedin-button svg{width:18px;height:18px}.footer .linkedin-button{padding:12px 24px;min-height:48px}.about-content>.linkedin-button{max-width:100%;padding-inline:24px;letter-spacing:.045em}.about-content>.linkedin-button span{white-space:normal}.hero-bottom>.linkedin-button{flex-shrink:0}.marquee-controls button:disabled{cursor:default;opacity:.85}
.motion-paused .skills-track{animation:none!important}.motion-paused .gallery-track,.motion-paused .project-card{transform:none!important}.motion-paused .gallery-window,.motion-paused .skills-window{overflow-x:auto}.motion-paused .gallery-group[aria-hidden=true],.motion-paused .skills-group[aria-hidden=true]{display:none}.motion-paused .about-story .char{opacity:1!important}.motion-paused [data-reveal]{opacity:1!important;transform:none!important;transition:none!important}.skills-window:focus-within .skills-track{animation-play-state:paused}
@media(max-height:650px) and (min-width:768px){.project-slot{position:relative;top:auto;min-height:initial;padding-bottom:30px}.project-card{transform:none!important}}
@media(min-width:1600px){.hero-heading{font-size:min(15.2vw,280px)}}
@media(max-width:1100px){.record-top{flex-wrap:wrap}.record-top .date-pill{margin-left:calc(clamp(48px,8vw,118px)*1.15 + 32px)}.project-card{gap:26px}.numbered-title{gap:24px}.hero-tagline{max-width:225px}.hero-bottom .contact-button{padding-inline:34px}.about-story{max-width:510px}.moon,.lego{width:150px}.smile{left:5%;width:135px}.cursor{right:5%;width:155px}}
@media(max-width:1023px){.desktop-links{display:none}.hero-nav{display:flex;justify-content:flex-end;padding-top:22px}.menu-toggle{display:grid;place-items:center}.hero-heading-wrap{margin-top:15px}.hero-portrait{width:440px}.hero-heading{font-size:15vw}.section-heading{margin-bottom:80px}.about{min-height:850px}.about-content{gap:50px}.decoration{opacity:.8}.project-card{border-radius:45px;padding:26px}.project-copy>p{font-size:17px}.project-image img{border-radius:30px}.numbered-title h3{font-size:23px}.project-slot{min-height:65svh}}
@media(max-width:767px){html{scroll-padding-top:20px}.hero{height:100svh;min-height:700px;max-height:920px}.hero-nav{padding:18px 22px 0}.hero-heading-wrap{margin-top:20px}.hero-heading{font-size:14.8vw}.hero-portrait{width:360px;max-width:85vw;bottom:155px}.hero-portrait img{max-height:52svh}.hero-bottom{padding:22px 24px 30px;gap:20px}.hero-tagline{max-width:175px;font-size:14px}.hero-name{font-size:10px;letter-spacing:.04em;max-width:165px}.contact-button{padding:13px 28px;font-size:13px;min-height:48px}.hero-bottom .contact-button{padding-inline:25px}.section-heading{font-size:clamp(46px,12vw,92px);margin-bottom:64px}.section-title-row .section-heading{margin-bottom:64px}.showcase{padding:85px 0 40px}.gallery-tile{width:290px;height:195px}.gallery-tile span{padding:38px 16px 14px;font-size:14px}.visual-note{font-size:12px}.about{padding:110px 24px;min-height:900px}.about-content{gap:38px}.about-story{font-size:18px;max-width:460px;line-height:1.7}.about-contact{gap:7px 20px}.about-contact a{font-size:13px}.moon,.lego{width:105px;top:1%}.moon{left:0}.lego{right:0}.smile{width:90px;left:1%;bottom:3%}.cursor{width:105px;right:1%;bottom:3%}.skills-section{padding:80px 0 125px}.skills-section .section-heading{margin-bottom:35px}.marquee-controls{padding:0 24px;margin-bottom:8px}.skill-pill{font-size:15px;padding:12px 23px}.skills-track,.skills-group{gap:12px}.skills-window{margin-top:12px}.panel{padding:80px 24px 125px;border-radius:40px 40px 0 0;margin-top:-40px}.service-row{gap:24px;padding:32px 0}.service-row .big-number{font-size:64px}.service-row>div{padding-top:4px}.service-row h3{font-size:22px}.service-row p{font-size:16px;margin-top:11px}.project-toolbar{flex-wrap:wrap;margin-bottom:35px}.filters{gap:7px}.filters button{padding:9px 16px;font-size:13px}.work-count{font-size:12px;margin-left:auto}.project-slot{position:relative;top:auto;min-height:initial;padding-bottom:24px}.project-card{display:flex;flex-direction:column;padding:24px;border-radius:36px;gap:25px;transform:none!important}.project-card .big-number{font-size:70px}.numbered-title{gap:18px}.numbered-title h3{font-size:23px}.eyebrow{font-size:11px}.project-copy>p{font-size:16px;margin-top:20px}.outline-button{font-size:13px;padding:12px 25px;margin-top:23px;min-height:48px}.project-image{width:100%;max-width:none}.project-image img{aspect-ratio:1.3;border-radius:26px}.record-list{gap:22px}.record{border-radius:36px;padding:26px}.record-top{display:block}.record .big-number{font-size:70px}.record h3{font-size:22px}.record-top .date-pill{display:inline-block;margin:22px 0 0;font-size:11px}.record>p,.record li{font-size:16px}.record .record-location{font-size:12px}.record ul{margin-top:22px}.record .eyebrow{font-size:11px}.milestones-section{padding:25px 24px 80px}.footer{padding:25px 24px;gap:18px}.footer>div{gap:12px 20px}.footer-name{font-size:20px}.dialog-inner{padding:38px 25px}.dialog-inner h2{font-size:30px}.dialog-inner p,.dialog-inner li{font-size:16px}}
@media(max-width:380px){.hero-bottom{align-items:center;flex-direction:column;text-align:center;padding-bottom:25px;gap:17px}.hero-tagline{max-width:280px;font-size:14px}.hero-name{max-width:none;margin-top:7px}.hero-portrait{bottom:190px;width:295px}.hero-heading-wrap{margin-top:22px}.hero{min-height:760px}.about{min-height:950px}.service-row{gap:18px}.service-row .big-number{font-size:52px}.service-row h3{font-size:20px}.project-card,.record{padding:21px}.record .big-number,.project-card .big-number{font-size:56px}.numbered-title h3{font-size:20px}.section-heading{font-size:11.6vw}.hero-heading{font-size:14.7vw}.filters button{padding:9px 12px}}
@media(max-width:380px){.record .numbered-title{flex-direction:column;align-items:flex-start;gap:18px}}
@media(max-width:767px){.hero-bottom .linkedin-button{padding-inline:18px}.hero-bottom .linkedin-button>svg:last-child{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.magnet,.gallery-track,.project-card{transform:none!important}.gallery-window{overflow-x:auto}.gallery-group[aria-hidden=true]{display:none}.skills-window{overflow-x:auto}.skills-group[aria-hidden=true]{display:none}.js-reveal [data-reveal]{opacity:1;transform:none}.about-story .char{opacity:1!important}}
