*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;color:#111;letter-spacing:0;background:#fff;font-family:Noto Sans Thai,Inter,system-ui,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer;color:inherit;background:0 0;border:0}ul{list-style:none}img{max-width:100%;height:auto;display:block}:focus-visible{outline-offset:3px;outline:3px solid #111}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}html{scroll-behavior:auto}}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}h1,h2,h3{text-wrap:balance}.btn{color:#fff;white-space:nowrap;background:#111;border-radius:999px;align-items:center;gap:8px;padding:11px 20px;font-size:14px;font-weight:600;transition:transform .2s;display:inline-flex}.btn:hover{transform:translateY(-1px)}.btn.ghost{color:#111;background:#fff;border:1px solid #0000001f}.btn .line-mark{background:#06c755;border-radius:5px;flex:none;place-items:center;width:18px;height:18px;display:inline-grid}.btn .line-mark:after{content:"";border:1.5px solid #fff;border-radius:6px 6px 6px 1px;width:9px;height:7px}.site-header{z-index:20;width:100%;max-width:1440px;margin:0 auto;padding:12px;position:relative}nav.pill{background:#fff;border-radius:999px;justify-content:space-between;align-items:center;gap:12px;padding:5px 5px 5px 18px;display:flex;box-shadow:0 1px #0000000a,0 10px 30px #0000000f}nav.pill .brand{font-size:15px;font-weight:700}nav.pill .links{gap:22px;font-size:14px;font-weight:500;display:flex}nav.pill .links a{opacity:.75;padding:8px 0}nav.pill .links a:hover,nav.pill .links a[aria-current=page]{opacity:1}nav.pill .right{align-items:center;gap:10px;font-size:13px;display:flex}.lang-toggle{border-radius:999px;gap:4px;padding:8px 10px;font-size:12.5px;font-weight:600;display:inline-flex}.lang-toggle:hover{background:#0000000d}.lang-toggle span{opacity:.4}.lang-toggle span.active{opacity:1}.lang-toggle .sep{opacity:.25}.page-top{background:#f5f5f5}.page-top .site-header{padding-bottom:12px}.hero{background:#efefef;flex-direction:column;min-height:100dvh;display:flex;position:relative;overflow:hidden}.hero-mat{z-index:0;background-color:#efefef;background-image:radial-gradient(#0000001a 1px,#0000 1.2px),linear-gradient(#0000000d 1px,#0000 1px),linear-gradient(90deg,#0000000d 1px,#0000 1px);background-position:12px 12px,0 0,0 0;background-repeat:repeat;background-size:24px 24px,120px 120px,120px 120px;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;position:absolute;inset:0;-webkit-mask-image:radial-gradient(90% 80% at 70% 40%,#000 30%,#0000 100%);mask-image:radial-gradient(90% 80% at 70% 40%,#000 30%,#0000 100%)}.hero:after{content:"";z-index:1;pointer-events:none;background:linear-gradient(#efefef00 55%,#efefefe6 100%);position:absolute;inset:0}.hero-body{z-index:10;flex-direction:column;flex:1;justify-content:flex-end;width:100%;max-width:1440px;margin:0 auto;padding:40px 32px 48px;display:flex;position:relative}.brandline{letter-spacing:-.01em;align-items:center;gap:12px;margin-bottom:16px;font-size:clamp(18px,2vw,26px);font-weight:600;display:flex}.brandline:before{content:"";background:#111;width:28px;height:2px}.hero-body h1{max-width:16ch;font-size:clamp(34px,5.2vw,72px);font-weight:600;line-height:1.16}.hero-body .row{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:28px;margin-top:34px;display:flex}.hero-body .sub{opacity:.8;max-width:44ch;font-size:16px;line-height:1.7}.hero-body .actions{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.badges{flex-wrap:wrap;gap:10px;display:flex}.badges span{background:#fffc;border:1px solid #00000014;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:500}.sec{max-width:1440px;margin:0 auto;padding:clamp(64px,8vw,120px) 32px}.num{opacity:.5;align-items:center;gap:10px;margin-bottom:26px;font-size:13px;font-weight:600;display:flex}.num:before{content:"";background:currentColor;width:28px;height:1px}.intro{grid-template-columns:1.3fr 1fr;align-items:end;gap:48px;display:grid}.intro h2{max-width:18ch;font-size:clamp(30px,4vw,56px);font-weight:600;line-height:1.15}.intro p{opacity:.8;max-width:48ch;font-size:17px;line-height:1.8}.intro .btn{margin-top:26px}.steps{border:1px solid #0000001f;border-radius:22px;grid-column:1/-1;grid-template-columns:repeat(4,1fr);margin-top:64px;display:grid;overflow:hidden}.steps .st{border-left:1px solid #0000001a;padding:26px 24px 28px}.steps .st:first-child{border-left:0}.steps .st b{opacity:.5;font-size:12px;font-weight:600}.steps .st h3{margin:10px 0 8px;font-size:19px;font-weight:600}.steps .st p{opacity:.75;font-size:14px;line-height:1.7}.stats{border-top:1px solid #0000001a;grid-column:1/-1;grid-template-columns:repeat(4,1fr);margin-top:40px;display:grid}.stats div{border-right:1px solid #00000014;padding:26px 20px 26px 0}.stats div:last-child{border:0}.stats b{font-variant-numeric:tabular-nums;font-size:34px;font-weight:600;display:block}.stats span{opacity:.7;font-size:13px}.work{background:#f5f5f5}.work .head{justify-content:space-between;align-items:end;gap:20px;margin-bottom:36px;display:flex}.work h2{font-size:clamp(28px,3.4vw,46px);font-weight:600}.grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}.card{background:#fff;border-radius:22px;flex-direction:column;transition:transform .3s;display:flex;overflow:hidden}.card:hover{transform:translateY(-4px)}.card .media{aspect-ratio:16/10;background:#ececec;position:relative;overflow:hidden}.card .media img{object-fit:cover;width:100%;height:100%}.card .media.ph-a{background:linear-gradient(135deg,#fde7ef,#f9c9d8 45%,#f2a7c3)}.card .media.ph-b{background:linear-gradient(135deg,#e3f0ff,#c2dcff 45%,#9fc3ff)}.card .media.ph-c{background:linear-gradient(135deg,#e6f7ee,#c8ecd8 45%,#9fd9b9)}.card .media .ui{background:#fff;border-radius:14px 14px 0 0;align-content:start;gap:10px;padding:16px;display:grid;position:absolute;inset:14% 10% -8%;box-shadow:0 30px 60px #0000001f}.card .media .ui i{background:#eee;border-radius:6px;height:10px;display:block}.card .media .ui i:first-child{background:#ddd;width:40%}.card .media .ui .cells{grid-template-columns:repeat(6,1fr);gap:6px;display:grid}.card .media .ui .cells i{background:#f3f3f3;height:22px}.card .media .ui .cells i:nth-child(3n){background:#e6e6e6}.card .media .tag{z-index:1;background:#fff;border-radius:999px;padding:6px 11px;font-size:12px;font-weight:600;position:absolute;top:14px;left:14px}.card .body{justify-content:space-between;align-items:flex-start;gap:20px;padding:22px 24px 26px;display:flex}.card .body h3{margin-bottom:6px;font-size:20px;font-weight:600}.card .body p{opacity:.75;max-width:40ch;font-size:14px;line-height:1.7}.card .body a,.card .body .more{white-space:nowrap;border-bottom:1px solid;padding-bottom:2px;font-size:13px;font-weight:600}.services{grid-template-columns:1fr 1fr;gap:20px 60px;display:grid}.services>h2{grid-column:1/-1;margin-bottom:20px;font-size:clamp(28px,3.4vw,46px);font-weight:600}.services .item{border-top:1px solid #0000001f;grid-template-columns:44px 1fr;gap:14px;padding:24px 0;display:grid}.services .item b{opacity:.5;padding-top:4px;font-size:13px;font-weight:600}.services .item h3{margin-bottom:6px;font-size:19px;font-weight:600}.services .item p{opacity:.75;font-size:14.5px;line-height:1.7}.site-footer{color:#fff;background:#111827}.site-footer .cta{border-bottom:1px solid #ffffff1f;max-width:1440px;margin:0 auto;padding:clamp(80px,10vw,140px) 32px 60px}.site-footer .cta .num{opacity:.6}.site-footer .cta h2{max-width:16ch;font-size:clamp(38px,6.4vw,96px);font-weight:600;line-height:1.05}.site-footer .cta .row{flex-wrap:wrap;align-items:center;gap:24px;margin-top:40px;display:flex}.site-footer .cta .btn{color:#111;background:#fff;padding:14px 24px;font-size:15px}.site-footer .cta .mail{opacity:.8;border-bottom:1px solid #fff6;font-size:18px}.site-footer .cta .cta-note{opacity:.6;max-width:52ch;margin-top:28px;font-size:15px;line-height:1.7}.site-footer .cols{grid-template-columns:1.6fr repeat(3,1fr);gap:32px;max-width:1440px;margin:0 auto;padding:48px 32px 32px;font-size:14px;display:grid}.site-footer .cols .about p{opacity:.65;max-width:30ch;margin-top:10px;line-height:1.7}.site-footer .cols h4{opacity:.5;text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px;font-size:12px;font-weight:600}.site-footer .cols li{opacity:.85;margin-bottom:10px}.site-footer .cols li a:hover,.site-footer .cols li button:hover{opacity:1;text-decoration:underline}.site-footer .legal{opacity:.45;flex-wrap:wrap;justify-content:space-between;gap:16px;max-width:1440px;margin:0 auto;padding:0 32px 28px;font-size:12px;display:flex}.line-modal{z-index:100;backdrop-filter:blur(6px);background:#11182799;justify-content:center;align-items:center;padding:20px;display:none;position:fixed;inset:0}.line-modal.open{display:flex}.line-modal .panel{color:#111;text-align:center;background:#fff;border-radius:22px;width:min(440px,100%);padding:32px;position:relative;box-shadow:0 30px 80px #0000004d}.line-modal .close{border-radius:50%;width:36px;height:36px;font-size:20px;line-height:1;position:absolute;top:14px;right:14px}.line-modal .close:hover{background:#0000000f}.line-modal h3{margin-bottom:8px;font-size:22px;font-weight:600}.line-modal p{opacity:.75;font-size:14.5px;line-height:1.7}.line-modal .qr{border:1px solid #0000001a;border-radius:14px;place-items:center;width:220px;height:220px;margin:22px auto;padding:12px;display:grid}.line-modal .qr svg{width:100%;height:100%}.line-modal .oa{font-size:15px;font-weight:600}.line-modal .btn{margin-top:18px}.page-head{max-width:1440px;margin:0 auto;padding:clamp(40px,6vw,80px) 32px 32px}.page-head h1{max-width:18ch;font-size:clamp(32px,4.6vw,60px);font-weight:600;line-height:1.12}.page-head .lead{opacity:.75;max-width:52ch;margin-top:16px;font-size:17px;line-height:1.75}.cats{flex-wrap:wrap;gap:8px;margin-top:28px;display:flex}.cats a{border:1px solid #00000024;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:500}.cats a[aria-current=page]{color:#fff;background:#111;border-color:#111}.posts{grid-template-columns:repeat(3,1fr);gap:20px;max-width:1440px;margin:0 auto;padding:0 32px clamp(64px,8vw,120px);display:grid}.post-card{background:#f5f5f5;border-radius:22px;flex-direction:column;transition:transform .3s;display:flex;overflow:hidden}.post-card:hover{transform:translateY(-4px)}.post-card .cover{aspect-ratio:16/9;background:#e9e9e9;overflow:hidden}.post-card .cover img{object-fit:cover;width:100%;height:100%}.post-card .body{flex-direction:column;flex:1;gap:10px;padding:20px 22px 24px;display:flex}.post-card .meta{opacity:.6;flex-wrap:wrap;gap:8px;font-size:12.5px;display:flex}.post-card h2{font-size:20px;font-weight:600;line-height:1.3}.post-card p{opacity:.75;font-size:14px;line-height:1.7}.post-card .more{margin-top:auto;font-size:13px;font-weight:600}.empty{opacity:.6;grid-column:1/-1;padding:40px 0}.pager{grid-column:1/-1;justify-content:space-between;align-items:center;gap:16px;padding-top:12px;font-size:14px;font-weight:600;display:flex}.pager span{opacity:.5;font-weight:500}.post{max-width:1440px;margin:0 auto;padding:clamp(40px,6vw,80px) 32px clamp(64px,8vw,120px)}.post .back{opacity:.6;font-size:13px;font-weight:600}.post header{max-width:72ch;margin:24px 0 32px}.post header .meta{opacity:.6;flex-wrap:wrap;gap:10px;margin-bottom:14px;font-size:13px;display:flex}.post header h1{font-size:clamp(30px,4.2vw,54px);font-weight:600;line-height:1.16}.post header .excerpt{opacity:.75;margin-top:16px;font-size:18px;line-height:1.7}.post .cover{background:#f0f0f0;border-radius:22px;max-width:1000px;margin:0 0 40px;overflow:hidden}.post .tags{flex-wrap:wrap;gap:8px;margin-top:32px;display:flex}.post .tags span{border:1px solid #0000001f;border-radius:999px;padding:5px 11px;font-size:12.5px}.prose{max-width:68ch;font-size:17px;line-height:1.85}.prose>*+*{margin-top:1.1em}.prose h2{margin-top:2em;font-size:clamp(24px,2.6vw,32px);font-weight:600;line-height:1.25}.prose h3{margin-top:1.6em;font-size:clamp(20px,2vw,24px);font-weight:600;line-height:1.3}.prose h4{font-size:18px;font-weight:600}.prose ul,.prose ol{padding-left:1.4em}.prose ul{list-style:outside}.prose ol{list-style:decimal}.prose li+li{margin-top:.4em}.prose ul.checklist{padding-left:0;list-style:none}.prose ul.checklist li:before{content:"☐ ";opacity:.5}.prose ul.checklist li[data-checked=true]:before{content:"☑ "}.prose blockquote{opacity:.85;border-left:3px solid #111;padding:.2em 0 .2em 1.2em;font-size:1.05em}.prose a{text-underline-offset:3px;text-decoration:underline}.prose code{background:#f3f3f3;border-radius:5px;padding:.1em .35em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em}.prose hr{border:0;border-top:1px solid #0000001f;margin:2.4em 0}.prose figure{margin:2em 0}.prose figure img{border-radius:14px}.prose figcaption{opacity:.6;margin-top:8px;font-size:13px}.post-cta{border:1px solid #0000001f;border-radius:22px;gap:10px;max-width:68ch;margin-top:56px;padding:28px;display:grid}.post-cta h3{font-size:22px;font-weight:600}.post-cta p{opacity:.75;font-size:15px;line-height:1.7}.post-cta .btn{justify-self:start;margin-top:8px}.case .tabs{grid-template-columns:repeat(3,1fr);gap:20px;margin:40px 0;display:grid}.case .tabs>div{background:#f5f5f5;border-radius:22px;padding:26px}.case .tabs h2{opacity:.5;margin-bottom:12px;font-size:13px;font-weight:600}.case .tabs .prose{font-size:15.5px;line-height:1.75}.case .shots{grid-template-columns:repeat(2,1fr);gap:16px;margin-top:24px;display:grid}.case .shots img{border-radius:16px}.case .facts{opacity:.75;flex-wrap:wrap;gap:24px;margin-top:12px;font-size:14px;display:flex}.notfound{max-width:1440px;margin:0 auto;padding:clamp(80px,12vw,160px) 32px}.notfound h1{font-size:clamp(32px,5vw,64px);font-weight:600}.notfound p{opacity:.75;margin:16px 0 28px}@media (width<=900px){nav.pill .links{display:none}nav.pill{padding-left:14px}.hero-body,.page-head,.posts,.post,.sec{padding-left:20px;padding-right:20px}.intro,.grid,.services{grid-template-columns:1fr}.steps{grid-template-columns:1fr 1fr}.steps .st:nth-child(3){border-left:0}.steps .st:nth-child(n+3){border-top:1px solid #0000001a}.stats{grid-template-columns:1fr 1fr}.stats div:nth-child(2n){border-right:0}.site-footer .cta,.site-footer .cols,.site-footer .legal{padding-left:20px;padding-right:20px}.site-footer .cols,.posts{grid-template-columns:1fr 1fr}.case .tabs{grid-template-columns:1fr}}@media (width<=560px){nav.pill .right .btn{padding:9px 14px;font-size:13px}.steps{grid-template-columns:1fr}.steps .st{border-top:1px solid #0000001a;border-left:0}.steps .st:first-child{border-top:0}.card .body{flex-direction:column}.site-footer .cols,.posts,.case .shots{grid-template-columns:1fr}}