@font-face{font-family:Poppins;src:url(/_astro/Poppins-Regular.CTKNfV9P.ttf)format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Poppins;src:url(/_astro/Poppins-Medium.Cxde2ZoM.ttf)format("truetype");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Poppins;src:url(/_astro/Poppins-SemiBold.B_fPDAUb.ttf)format("truetype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Poppins;src:url(/_astro/Poppins-Bold.qTAUjFF7.ttf)format("truetype");font-weight:700;font-style:normal;font-display:swap}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}body{color:#f5f5f5;width:100%;min-height:100vh;font-family:Poppins,Noto Sans Thai,sans-serif;font-size:var(--text-base);font-weight:var(--font-body);background:#080808;margin:0;line-height:1.75}body,button,a{-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button{border:0}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}:root{--type-ratio:1.618;--text-xs:clamp(.6875rem, .66rem + .08vw, .75rem);--text-sm:clamp(.8125rem, .78rem + .1vw, .875rem);--text-base:clamp(.9375rem, .9rem + .12vw, 1rem);--text-lg:clamp(1.25rem, 1.05rem + .55vw, 1.625rem);--text-xl:clamp(1.75rem, 1.35rem + 1.1vw, 2.625rem);--text-2xl:clamp(2.5rem, 1.7rem + 2.2vw, 4.25rem);--text-3xl:clamp(3.25rem, 2rem + 4vw, 6.875rem);--font-label:600;--font-navigation:600;--font-body:400;--font-lead:400;--font-heading:600;--font-display:700;--bg:#080808;--bg-soft:#0d0d0d;--surface:#111;--surface-2:#161616;--surface-3:#1b1b1b;--text:#f5f5f5;--text-soft:#b0b0b0;--text-muted:#707070;--border:#ffffff1a;--border-light:#ffffff29;--accent:#8b7cff;--accent-2:#52d8ff;--max-width:1280px;--page-gutter:clamp(20px, 4vw, 48px);--radius:20px;--radius-small:12px;--ease:cubic-bezier(.22, 1, .36, 1)}.container{width:min(calc(100% - var(--page-gutter) * 2), var(--max-width));margin-inline:auto}.section{padding:clamp(76px,8vw,140px) 0}.section-index{color:var(--text-muted);font-size:var(--text-xs);font-weight:var(--font-label);letter-spacing:.16em;margin-bottom:22px;display:block}.section-heading{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:end;gap:clamp(32px,6vw,80px);margin-bottom:70px;display:grid}.section-heading h2{max-width:720px;font-size:clamp(48px, 5vw, var(--text-2xl));letter-spacing:-.045em;line-height:1.03;font-weight:var(--font-heading);margin:0}.section-heading h2 span{color:var(--text-muted)}.section-heading>p{max-width:360px;color:var(--text-soft);font-size:var(--text-base);margin:0;line-height:1.75}.cursor-glow{pointer-events:none;z-index:0;will-change:transform;background:radial-gradient(circle,#8b7cff14,#0000 70%);border-radius:50%;width:300px;height:300px;transition:transform .25s;position:fixed;top:-150px;left:-150px}.navbar{z-index:100;backdrop-filter:blur(20px);background:#080808b8;border-bottom:1px solid #ffffff12;width:100%;position:fixed;top:0;left:0}.nav-container{justify-content:space-between;align-items:center;height:76px;display:flex}.brand{font-size:var(--text-sm);font-weight:var(--font-display);letter-spacing:.1em;align-items:center;gap:12px;display:flex}.brand-mark{width:34px;height:34px;font-size:var(--text-sm);background:linear-gradient(135deg,#1d1d1d,#0d0d0d);border:1px solid #fff3;border-radius:9px;place-items:center;display:grid}.brand-name{white-space:nowrap}.desktop-nav{align-items:center;gap:34px;display:flex}.desktop-nav a{color:var(--text-soft);font-size:var(--text-sm);font-weight:var(--font-navigation);letter-spacing:.13em;transition:color .3s;position:relative}.desktop-nav a:after{content:"";width:0;height:1px;transition:width .3s var(--ease);background:#fff;position:absolute;bottom:-7px;left:0}.desktop-nav a:hover{color:#fff}.desktop-nav a:hover:after{width:100%}.nav-toggle{cursor:pointer;background:0 0;width:42px;height:42px;display:none;position:relative}.nav-toggle span{background:#fff;width:22px;height:1px;transition:transform .3s;position:absolute;left:10px}.nav-toggle span:first-child{top:16px}.nav-toggle span:last-child{top:23px}.nav-toggle.is-active span:first-child{transform:translateY(3.5px)rotate(45deg)}.nav-toggle.is-active span:last-child{transform:translateY(-3.5px)rotate(-45deg)}.mobile-menu{display:none}.hero{align-items:center;min-height:calc(100svh - 76px);padding-top:calc(76px + clamp(64px,8vh,96px));padding-bottom:clamp(64px,8vh,96px);display:flex;position:relative;overflow:hidden}.hero-background-grid{pointer-events:none;background-image:linear-gradient(#ffffff09 1px,#0000 1px),linear-gradient(90deg,#ffffff09 1px,#0000 1px);background-size:80px 80px;position:absolute;inset:0;mask-image:radial-gradient(#000 10%,#0000 75%)}.hero:after{content:"";filter:blur(30px);pointer-events:none;background:radial-gradient(circle,#52d8ff1a,#0000 68%);width:700px;height:700px;position:absolute;top:50%;right:-250px;transform:translateY(-50%)}.hero-grid{z-index:2;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:48px;display:grid;position:relative}.hero-content{min-width:0}.eyebrow{color:var(--text-muted);font-size:var(--text-xs);font-weight:var(--font-label);letter-spacing:.16em;align-items:center;gap:10px;margin-bottom:28px;display:flex}.status-dot{background:#6df7a5;border-radius:50%;width:7px;height:7px;box-shadow:0 0 15px #6df7a5cc}.hero-title{max-width:100%;font-size:clamp(56px, 5.7vw, var(--text-3xl));letter-spacing:-.055em;overflow-wrap:normal;word-break:normal;line-height:.95;font-weight:var(--font-display);margin:0}.hero-title span{color:var(--text-muted)}.desktop-only-break{display:none}.hero-description{max-width:600px;color:var(--text-soft);font-size:var(--text-base);margin:36px 0 0;line-height:1.75}.hero-actions{align-items:center;gap:14px;margin-top:40px;display:flex}.button{min-height:48px;font-size:var(--text-xs);font-weight:var(--font-label);letter-spacing:.06em;transition:transform .3s var(--ease), background .3s ease, border .3s ease;border-radius:999px;justify-content:center;align-items:center;gap:12px;padding:0 22px;display:inline-flex}.button:hover{transform:translateY(-3px)}.button-primary{color:#050505;background:#fff}.button-secondary{color:#fff;border:1px solid var(--border-light)}.button-secondary:hover{background:var(--surface)}.hero-terrain{justify-self:end;width:90%;min-width:0;max-width:432px}.scroll-indicator{color:var(--text-muted);font-size:var(--text-xs);font-weight:var(--font-label);letter-spacing:.15em;align-items:center;gap:10px;display:flex;position:absolute;bottom:30px;left:50%;transform:translate(-50%)}.scroll-indicator span{background:var(--text-muted);width:24px;height:1px}.stats-section{padding:30px 0 0}.stats-grid{border:1px solid var(--border);border-radius:var(--radius);grid-template-columns:repeat(4,1fr);display:grid;overflow:hidden}.stat-card{background:var(--surface);flex-direction:column;gap:6px;padding:35px;transition:background .3s;display:flex}.stat-card+.stat-card{border-left:1px solid var(--border)}.stat-card:hover{background:var(--surface-2)}.stat-number{font-size:var(--text-xl);letter-spacing:-.04em;line-height:1;font-weight:var(--font-heading)}.stat-label{color:var(--text-muted);font-size:var(--text-xs);letter-spacing:.1em}.projects-section{position:relative}.projects-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(440px,auto);align-items:stretch;gap:18px;display:grid}.project-card{border:1px solid var(--border);border-radius:var(--radius);min-width:0;height:100%;min-height:0;transition:transform .5s var(--ease), border .4s ease;background:linear-gradient(145deg,#111,#0c0c0c);flex-direction:column;justify-content:space-between;padding:clamp(28px,3vw,40px);display:flex;position:relative;overflow:hidden}.project-card:before{content:"";opacity:0;background:radial-gradient(circle,#8b7cff29,#0000 70%);border-radius:50%;width:280px;height:280px;transition:opacity .5s;position:absolute;top:-100px;right:-100px}.project-card:hover{border-color:#fff3;transform:translateY(-6px)}.project-card:hover:before{opacity:1}.project-large{grid-row:auto}.project-wide{min-height:0}.project-accent{background:radial-gradient(circle at 80% 20%,#52d8ff14,#0000 45%),#101010}.project-top{z-index:2;justify-content:space-between;align-items:center;display:flex;position:relative}.project-number{color:var(--text-muted);font-size:var(--text-sm);font-weight:var(--font-navigation);letter-spacing:.1em}.project-status{color:var(--text-muted);font-size:var(--text-xs);font-weight:var(--font-label);letter-spacing:.15em}.project-content{z-index:2;min-width:0;position:relative}.project-category{color:var(--text-muted);font-size:var(--text-xs);font-weight:var(--font-label);letter-spacing:.15em;margin-bottom:14px;display:block}.project-content h3{font-size:clamp(32px, 4vw, var(--text-xl));letter-spacing:-.045em;line-height:1;font-weight:var(--font-heading);margin:0 0 15px}.project-content p{max-width:540px;color:var(--text-soft);font-size:var(--text-base);margin:0;line-height:1.75}.tech-list{flex-wrap:wrap;gap:7px;margin-top:24px;display:flex}.tech-list span,.capability-tags span{border:1px solid var(--border);color:var(--text-muted);font-size:var(--text-xs);letter-spacing:.04em;border-radius:999px;padding:7px 10px;font-weight:500}.project-link{z-index:2;border-top:1px solid var(--border);color:var(--text-soft);font-size:var(--text-sm);font-weight:var(--font-navigation);letter-spacing:.08em;justify-content:space-between;align-items:center;padding-top:20px;transition:color .3s;display:flex;position:relative}.project-link span{transition:transform .3s var(--ease);font-size:18px}.project-link:hover{color:#fff}.project-link:hover span{transform:translate(4px,-4px)}.capabilities-section{background:#0a0a0a}.capabilities-grid{border:1px solid var(--border);border-radius:var(--radius);background:var(--border);grid-template-columns:repeat(3,1fr);gap:1px;display:grid;overflow:hidden}.capability-card{background:#0d0d0d;min-height:310px;padding:30px;transition:background .35s}.capability-card:hover{background:#131313}.capability-number{color:var(--text-muted);font-size:var(--text-xs);margin-bottom:60px;display:block}.capability-card h3{font-size:clamp(32px, 3vw, var(--text-xl));font-weight:var(--font-heading);letter-spacing:-.03em;margin:0 0 12px}.capability-card p{min-height:70px;color:var(--text-muted);font-size:var(--text-base);margin:0;line-height:1.7}.capability-tags{flex-wrap:wrap;gap:6px;margin-top:20px;display:flex}.capability-highlight{background:linear-gradient(135deg,#8b7cff14,#0d0d0d)}.experience-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:clamp(48px,8vw,112px);display:grid}.experience-intro{isolation:isolate;min-height:280px;padding:28px 0}.intro-content{z-index:1;position:relative}.experience-intro{align-self:start;position:sticky;top:130px}.big-letter{z-index:0;pointer-events:none;user-select:none;opacity:.03;letter-spacing:-.1em;color:#fff;font-size:clamp(180px,20vw,280px);font-weight:700;line-height:.8;position:absolute;top:0;left:-12px}.experience-intro p{color:var(--text-muted);font-size:var(--text-xs);margin:0 0 8px}.experience-intro strong{font-size:var(--text-lg);line-height:1.35;font-weight:var(--font-lead);letter-spacing:-.03em}.timeline{border-left:1px solid var(--border);min-width:0}.timeline-item{grid-template-columns:minmax(0,1fr);gap:28px;padding:0 0 80px 30px;display:grid;position:relative}.timeline-marker{background:var(--accent);border-radius:50%;width:8px;height:8px;position:absolute;top:5px;left:-4px;box-shadow:0 0 18px #8b7cff99}.timeline-label{color:var(--text-muted);font-size:var(--text-xs);font-weight:var(--font-label);letter-spacing:.14em}.timeline-content h3{font-size:var(--text-xl);letter-spacing:-.04em;line-height:1.1;font-weight:var(--font-heading);margin:12px 0}.timeline-content p{max-width:550px;color:var(--text-soft);font-size:var(--text-base);margin:0;line-height:1.75}.about-section{background:linear-gradient(#080808,#0d0d0d)}.about-grid{grid-template-columns:.618fr 1fr;gap:55px;display:grid}.about-portrait{aspect-ratio:4/5;border:1px solid var(--border);align-self:start;margin:0;overflow:hidden}.about-portrait img{object-fit:cover;width:100%;height:100%;transition:transform .4s var(--ease)}.about-portrait:hover img{transform:scale(1.015)}.about-copy{min-width:0}.about-title h2{max-width:600px;font-size:clamp(48px, 6vw, var(--text-2xl));letter-spacing:-.06em;line-height:1;font-weight:var(--font-heading);margin:0}.about-title h2 span{color:var(--text-muted)}.about-content{padding-top:34px}.about-large{font-size:var(--text-lg);letter-spacing:-.03em;margin:0 0 35px;line-height:1.3}.about-content>p:not(.about-large){max-width:650px;color:var(--text-soft);font-size:var(--text-base);margin:0 0 20px;line-height:1.75}.about-principles{border-top:1px solid var(--border);border-bottom:1px solid var(--border);grid-template-columns:repeat(3,1fr);margin-top:50px;display:grid}.about-principles div{flex-direction:column;gap:4px;padding:20px 0;display:flex}.about-principles div+div{border-left:1px solid var(--border);padding-left:20px}.about-principles span{color:var(--text-muted);font-size:var(--text-xs)}.about-principles strong{font-size:var(--text-sm);font-weight:500}.contact-section{padding-bottom:80px}.contact-card{border:1px solid var(--border);background:radial-gradient(circle at 90% 10%,#8b7cff21,#0000 35%),#101010;border-radius:28px;padding:70px}.contact-grid{grid-template-columns:1fr .8fr;gap:80px;display:grid}.contact-card h2{max-width:700px;font-size:clamp(48px, 6vw, var(--text-2xl));letter-spacing:-.06em;line-height:1;font-weight:var(--font-heading);margin:0}.contact-card h2 span{color:var(--text-muted)}.contact-card p{max-width:480px;color:var(--text-soft);font-size:var(--text-base);margin-top:30px;line-height:1.75}.contact-actions{flex-direction:column;justify-content:center;gap:10px;display:flex}.contact-button{border-bottom:1px solid var(--border);transition:padding .3s var(--ease);grid-template-columns:80px 1fr auto;align-items:center;gap:20px;padding:20px 0;display:grid}.contact-button:hover{padding-left:10px}.contact-button>span:first-child{color:var(--text-muted);font-size:var(--text-xs);letter-spacing:.12em}.contact-button strong{font-size:var(--text-sm);font-weight:var(--font-navigation)}.footer{border-top:1px solid var(--border);padding:30px 0}.footer-container{grid-template-columns:1fr 1fr 1fr;align-items:center;display:grid}.footer-center{text-align:center;color:var(--text-muted);font-size:var(--text-xs);font-weight:var(--font-label);letter-spacing:.12em}.footer-center span{color:var(--accent);margin:0 5px}.footer-right{text-align:right;color:var(--text-muted);font-size:var(--text-xs)}.reveal{opacity:0;transition:opacity .8s var(--ease), transform .8s var(--ease);transform:translateY(30px)}.reveal.is-visible{opacity:1;transform:translateY(0)}@media (width<=767px){:root{--page-gutter:20px}.section{padding-block:76px}.section-heading{grid-template-columns:1fr;align-items:start;gap:18px;margin-bottom:38px}.section-heading h2{font-size:clamp(2.25rem,9vw,3rem)}.desktop-nav{display:none}.nav-toggle{flex:0 0 42px;display:block}.mobile-menu{max-height:0;padding:0 var(--page-gutter);transition:max-height .4s var(--ease);background:#080808f5;flex-direction:column;display:flex;overflow:hidden}.mobile-menu.is-open{max-height:400px;padding-top:12px;padding-bottom:18px}.mobile-menu a{border-bottom:1px solid var(--border);color:var(--text-soft);font-size:var(--text-sm);font-weight:var(--font-navigation);letter-spacing:.1em;padding:13px 0}.hero{min-height:auto;padding-top:132px;padding-bottom:64px}.hero-grid{grid-template-columns:minmax(0,1fr);gap:40px}.hero-terrain{justify-self:center}.hero-title{font-size:clamp(2.75rem,11vw,4.25rem)}.section-heading{grid-template-columns:1fr}.hero-description{margin-top:24px}.hero-actions{flex-wrap:wrap;gap:10px;margin-top:28px}.button{flex:160px;padding-inline:16px}.scroll-indicator{display:none}.stats-grid,.projects-grid,.capabilities-grid,.experience-layout,.about-grid,.contact-grid{grid-template-columns:1fr}.stat-card{padding:24px}.stat-card+.stat-card{border-left:0;border-top:1px solid var(--border)}.projects-grid{grid-auto-rows:auto}.project-card{height:auto;min-height:360px;padding:clamp(22px,6vw,30px)}.project-status{letter-spacing:.08em}.capability-card{min-height:auto;padding:24px}.capability-number{margin-bottom:28px}.capability-card p{min-height:0}.experience-layout{grid-template-columns:minmax(0,1fr);align-items:start;gap:36px}.experience-intro{align-self:stretch;min-width:0;min-height:0;padding-block:28px;position:relative;top:auto}.intro-content{min-width:0}.big-letter{left:0}.timeline-item{padding:0 0 42px 22px}.timeline-content h3{font-size:clamp(1.5rem,7vw,2rem)}.timeline-label{letter-spacing:.08em}.about-grid{gap:32px}.about-portrait{width:min(100%,420px)}.about-title h2,.contact-card h2{font-size:clamp(2.25rem,9vw,3.5rem)}.about-content{padding-top:22px}.about-principles{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:32px}.about-principles div{padding:16px 8px 16px 0}.about-principles div+div{border-left:1px solid var(--border);border-top:0;padding-left:10px}.contact-card{padding:clamp(24px,6vw,35px)}.contact-grid{gap:30px}.contact-button{grid-template-columns:58px minmax(0,1fr) auto;gap:10px}.contact-button strong{overflow-wrap:anywhere;min-width:0;font-size:var(--text-xs)}.contact-card p{overflow-wrap:anywhere}.footer-container{grid-template-columns:1fr auto;gap:14px}.footer-center{text-align:left;grid-area:2/1/auto/-1}.footer-right{grid-area:1/2}}@media (width>=768px){:root{--page-gutter:clamp(32px, 5vw, 56px)}.section{padding-block:clamp(96px,9vw,128px)}.hero{min-height:calc(100svh - 76px);padding-top:130px;padding-bottom:92px}.hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:clamp(28px,4vw,56px)}.hero-title{font-size:clamp(3.5rem,7vw,5.25rem)}.hero-actions{flex-wrap:wrap}.button{padding-inline:18px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stat-card{padding:clamp(24px,3vw,34px)}.stat-card:nth-child(3),.stat-card:nth-child(4){border-top:1px solid var(--border)}.stat-card:nth-child(3){border-left:0}.projects-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(390px,auto)}.capabilities-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.experience-layout{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(36px,5vw,64px)}.experience-intro{min-height:240px;position:sticky}.about-grid{grid-template-columns:minmax(0,.75fr) minmax(0,1fr);gap:clamp(30px,5vw,56px)}.contact-card{padding:clamp(38px,5vw,64px)}.contact-grid{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(30px,5vw,64px)}.contact-button{grid-template-columns:70px minmax(0,1fr) auto;gap:12px}}@media (width>=768px) and (width<=1023px){.desktop-nav{display:none}.nav-toggle{flex:0 0 42px;display:block}.mobile-menu{max-height:0;padding:0 var(--page-gutter);transition:max-height .4s var(--ease);background:#080808f5;flex-direction:column;display:flex;overflow:hidden}.mobile-menu.is-open{max-height:400px;padding-top:12px;padding-bottom:18px}.mobile-menu a{border-bottom:1px solid var(--border);color:var(--text-soft);font-size:var(--text-sm);font-weight:var(--font-navigation);letter-spacing:.1em;padding:13px 0}}@media (width>=1024px){:root{--page-gutter:clamp(48px, 5vw, 80px)}.hero{padding-top:120px;padding-bottom:96px}.hero-title{font-size:clamp(4.5rem,5.2vw,6.5rem)}.section-heading{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}.capabilities-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.experience-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr)}}@media (width>=768px) and (width<=1099px){.hero-grid{grid-template-columns:minmax(0,1fr)}.hero-terrain{justify-self:center}}@media (width>=1100px){.hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr)}}@media (width>=1440px){:root{--page-gutter:clamp(64px, 5vw, 112px)}.container{max-width:1280px}.hero .container{width:min(100% - clamp(80px,6vw,112px),1440px)}.hero-grid{gap:clamp(56px,5vw,96px)}.hero-title{font-size:clamp(5.5rem,5.2vw,6.875rem)}}@media (width>=1920px){.hero-grid{grid-template-columns:minmax(0,1.2fr) minmax(500px,.9fr)}.section{padding-block:clamp(140px,7.3vw,176px)}.hero .container{width:min(100% - 160px,1600px)}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.reveal{opacity:1;transform:none}.cursor-glow{display:none}}
