@import url('https://fonts.googleapis.com/css2?family=K2D:wght@400;500;600;700&display=swap');

:root{color-scheme:dark;--background:#0a0a0a;--foreground:#fff;--muted:#777780;--gold:#d4af37;font-family:'K2D',sans-serif;background:var(--background);color:var(--foreground);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body{margin:0;min-width:0;min-height:100%;background:var(--background)}body{min-height:100dvh;display:flex;flex-direction:column;font-family:'K2D',sans-serif;font-size:14px}a{color:inherit;text-decoration:none}button{font:inherit}.site-header{position:relative;z-index:3;display:flex;align-items:center;gap:40px;flex-shrink:0;height:68px;margin:0 5.5%;line-height:1.6}.site-header::after,.footer-inner::before{position:absolute;right:-20px;left:-20px;height:1px;background:linear-gradient(to right,transparent,rgba(255,255,255,.08) 20%,rgba(255,255,255,.08) 80%,transparent);content:'';pointer-events:none}.site-header::after{bottom:0}.brand{display:block;flex-shrink:0;padding:10px 0;outline-offset:3px}.brand img{display:block;width:124px;height:auto}.main-nav,.header-actions{display:flex;align-items:center}.main-nav{gap:4px}.nav-link{display:flex;align-items:center;height:34px;padding:0 10px;border-radius:6px;color:#b4b4bc;font-size:13.5px;white-space:nowrap;transition:color .15s,background .15s}.nav-link:hover{background:rgba(255,255,255,.03);color:#ededf0}.header-actions{gap:12px;margin-left:auto}.language-switch{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:34px;padding:0 8px;border:0;border-radius:6px;background:transparent;color:#a1a1aa;cursor:pointer;transition:background .15s,color .15s}.language-switch:hover{background:rgba(255,255,255,.04);color:white}.language-switch svg{display:none;width:24px;height:16px;overflow:hidden;border-radius:2px;box-shadow:0 0 0 1px rgba(255,255,255,.15)}html[data-language=th] [data-flag=th],html[data-language=en] [data-flag=en]{display:block}.contact-button{display:flex;align-items:center;gap:10px;height:34px;padding:0 12px;border:1px solid rgba(255,255,255,.2);border-radius:6px;background:rgba(255,255,255,.04);color:#ededf0;font-size:13px;font-weight:500;white-space:nowrap;transition:border-color .15s,background .15s}.contact-button:hover{border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.1);color:#fff}.language-text{display:inline-grid;max-width:100%;align-items:center;justify-items:center;vertical-align:bottom}.language-text>span{grid-area:1/1;visibility:hidden}.language-text>span:first-child{visibility:visible}html[data-language=en] .language-text>span:first-child{visibility:hidden}html[data-language=en] .language-text>span:last-child{visibility:visible}:is(a,button):focus-visible{outline:2px solid #a1a1aa;outline-offset:3px}.home-page{position:relative;isolation:isolate;display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;min-height:50svh;overflow:hidden;padding:64px 20px;background:var(--background);text-align:center}.animated-background{position:fixed;z-index:-1;inset:0;overflow:hidden;opacity:.5;mask-image:radial-gradient(ellipse 35% 45% at 50% 50%,black 0%,transparent 100%);pointer-events:none}.animated-background .grid{position:absolute;inset:0;background-image:linear-gradient(to right,#777780,transparent 1px),linear-gradient(to bottom,#777780,transparent 1px);background-size:48px 48px}.animated-background svg{position:absolute;width:100%;height:100%;overflow:visible}.home-title{position:relative;width:100%;text-align:center}.home-title h1{margin:0;color:#f4f4f5;font-size:clamp(36px,8.5vw,120px);font-weight:600;letter-spacing:-.05em;line-height:1}.home-title>p{position:absolute;top:100%;inset-inline:0;max-width:34em;margin:10px auto 0;color:#888;font-size:16px;line-height:1.8}.content-page{position:relative;isolation:isolate;display:flex;flex:1;overflow:hidden;padding:clamp(12px,3vh,28px) 32px;background:var(--background)}.page-grid{position:absolute;z-index:-1;inset:0;display:none;mask-image:linear-gradient(to bottom,transparent,black 30%,black 70%,transparent)}.page-grid::before{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent,transparent calc(12.5% - 1px),rgba(255,255,255,.035) calc(12.5% - 1px),rgba(255,255,255,.035) 12.5%);mask-image:linear-gradient(to right,black,transparent 35%,transparent 65%,black);content:''}.page-grid i{position:absolute;top:0;bottom:0;width:1px;background:linear-gradient(to bottom,transparent,rgba(212,175,55,.2),transparent)}.page-grid i:first-child{left:12.5%}.page-grid i:last-child{right:12.5%}.contact-page{align-items:center;justify-content:center}.contact-content{position:relative;width:100%;max-width:512px;margin:auto;padding:16px 0 32px}.contact-content h1,.contact-content .intro{text-align:center}.contact-content h1{margin:0;color:#e4e4e7;font-size:30px;font-weight:500;letter-spacing:-.025em}.contact-content .intro{max-width:unset;margin:12px auto 0;color:#71717a;font-size:14px;line-height:24px}.contact-list{display:grid;gap:12px;margin-top:24px}.contact-row{display:flex;min-height:80px;align-items:center;justify-content:space-between;gap:12px;padding:16px;border:1px solid rgba(255,255,255,.1);border-radius:9px;background:var(--background);color:#d4d4d8;transition:color .15s,border-color .15s}.contact-row:hover{border-color:rgba(212,175,55,.3);color:var(--gold)}.contact-row>span:first-child{min-width:0}.label,.value{display:block}.label{color:#71717a;font-size:12px}.value{margin-top:4px;font-size:14px;overflow-wrap:anywhere}.arrow{flex-shrink:0;font-size:18px}.back-link-wrap{margin-top:16px;text-align:center}.back-link{display:inline-flex;min-height:44px;align-items:center;gap:12px;color:#71717a;font-size:12px;transition:color .15s}.back-link:hover{color:#d4d4d8}.project-page{min-height:256px;align-items:center}.empty-projects{position:relative;display:flex;width:100%;flex-direction:column;align-items:center;justify-content:center;margin:auto;text-align:center}.empty-projects h1{margin:0;color:#e4e4e7;font-size:24px;font-weight:500;letter-spacing:-.025em}.empty-projects>p{max-width:320px;margin:12px 0 0;color:#71717a;font-size:14px;line-height:24px}.project-back-link{display:inline-flex;min-height:44px;align-items:center;gap:20px;margin-top:24px;border-bottom:1px solid rgba(212,175,55,.4);padding-bottom:8px;color:#d4d4d8;font-size:12px}.project-back-link:hover{color:var(--gold)}.site-footer{flex-shrink:0;margin: auto 5.5% 0;color:#777780;font-size:12.5px;line-height:1.6}.footer-inner{position:relative;display:flex;min-height:84px;flex-wrap:wrap;align-items:center;gap:12px 24px;padding:20px 0}.footer-inner::before{top:0}.footer-inner nav{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;margin-left:auto}.footer-inner nav a{display:inline-flex;min-height:44px;align-items:center;transition:color .15s}.footer-inner nav a:hover{color:#e4e4e7}.footer-inner nav span{padding-left:2px}@media(min-width:1600px){.site-header,.site-footer{margin-inline:calc((100% - 1424px)/2)}}@media(min-width:701px){.page-grid{display:block}.contact-list{gap:0;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}.contact-row{min-height:80px;padding:20px 0;border:0;border-radius:0;background:transparent}.contact-row+.contact-row{border-top:1px solid rgba(255,255,255,.1)}.contact-row .value{font-size:16px}.contact-content{padding:32px 0}.contact-list{margin-top:32px}.back-link-wrap{margin-top:28px}}@media(max-width:1000px){.site-header,.site-footer{margin-inline:4%}.site-header{gap:16px}.header-actions{gap:8px}}@media(max-width:700px){.site-header{height:auto;min-height:104px;flex-wrap:wrap;gap:0 8px;margin-inline:20px;padding:8px 0}.brand img{width:110px}.main-nav{order:3;width:100%;justify-content:center}.nav-link{min-height:44px;padding-inline:10px}.header-actions{gap:4px}.language-switch{width:44px;height:44px}.contact-button{min-height:44px;padding-inline:10px}.site-footer{margin-inline:20px}.footer-inner{gap:12px 20px;padding:12px 0}.footer-inner nav{gap:8px 20px}.content-page{padding-inline:20px}.contact-content{padding-block:16px}.contact-content h1{font-size:26px}.contact-list{margin-top:24px}.empty-projects h1{font-size:20px}.project-back-link{margin-top:16px}}@media(max-width:480px){.footer-inner nav{width:100%;margin-left:0}}@media(max-height:600px){.empty-projects h1{font-size:20px}.empty-projects>p{margin-top:8px}.project-back-link{margin-top:12px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}