:root{--ink:#202220;--paper:#fafaf8;--muted:#676b66;--accent:#b79b78;--line:#dcdfd8}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.85 'Noto Sans Thai',sans-serif}body.modal-open{overflow:hidden}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}img{display:block;max-width:100%}h1,h2,h3,p{margin-top:0}h2{font-size:clamp(30px,3.6vw,49px);font-weight:400;line-height:1.45;letter-spacing:-.6px;margin-bottom:20px}h3{font-weight:500}p{color:var(--muted)}.wrap{width:88%;max-width:1280px;margin-inline:auto}.section{padding-block:100px}.eyebrow{font:500 12px/1.6 Arial,sans-serif;letter-spacing:2.2px;margin-bottom:23px}.muted{color:#777c73}.header{position:sticky;top:0;z-index:20;background:#fafaf8f5;backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.nav{display:flex;align-items:center;gap:45px;min-height:94px}.brand{display:flex;align-items:center;gap:11px;font:400 29px/1.1 Arial,sans-serif;letter-spacing:-.8px}.brand small{display:block;font:8px/1.8 Arial;letter-spacing:1.7px;margin-top:7px}.brand-symbol{width:52px;height:64px;overflow:hidden;display:block;flex-shrink:0;position:relative;mix-blend-mode:multiply}.brand-symbol img{position:absolute;max-width:none;width:100px;height:auto;left:-22px;top:-24px}.nav nav{display:flex;gap:32px;margin-left:auto;font-size:14px}.nav nav a{padding:10px 0}.nav nav a:hover{color:#8b6e4b}.nav-contact{font:14px Arial;letter-spacing:1px;border:1px solid #aab0a5;padding:13px 19px}.hero{min-height:680px;height:calc(100svh - 94px);max-height:950px;position:relative;color:#fff;background:#232420;isolation:isolate}.hero-image{width:100%;height:100%;object-fit:cover;object-position:65% 50%;position:absolute;inset:0;z-index:-3}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,17,16,.89) 0%,rgba(13,17,16,.64) 33%,rgba(13,17,16,.1) 80%),linear-gradient(0deg,rgba(8,12,10,.5),transparent 30%);z-index:-1}.hero-content{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding-block:65px 110px}.hero-content .eyebrow{color:#dbd9d1}.hero h1{font-size:clamp(48px,5.2vw,76px);line-height:1.28;font-weight:400;letter-spacing:-1.6px;margin-bottom:22px}.hero p{color:#e1e2dc;font-size:17px;line-height:1.85;margin-bottom:30px}.hero-actions{display:flex;align-items:center;gap:30px}.button{display:inline-flex;justify-content:center;align-items:center;min-height:50px;background:#e4d4bd;color:#242620;border:1px solid #e4d4bd;padding:12px 27px;font-size:15px;font-weight:500;transition:background .2s}.button:hover{background:#f7ebd9}.text-link{font-size:15px;border-bottom:1px solid #9da096;padding:9px 0}.hero-bottom{position:absolute;bottom:27px;left:6%;display:flex;justify-content:space-between;border-top:1px solid #ffffff3b;padding-top:20px;font:11px Arial;letter-spacing:2px;color:#e3e3da}.material-strip{display:flex;justify-content:center;align-items:center;gap:42px;padding:22px 6%;border-bottom:1px solid var(--line);font-size:14px;color:#666c62}.material-strip i{height:4px;width:4px;background:#b29b7e;border-radius:50%}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:45px;margin-bottom:44px}.section-heading h2{margin-bottom:0}.section-note{max-width:410px;font-size:16px;color:var(--muted)}.section-note p{margin-bottom:12px}.section-note span{font-size:13px;color:#73786e}.gallery-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:42px 28px}.gallery-card{margin:0;min-width:0}.card-wide{grid-column:span 3}.card-tall{grid-column:span 2}.card-half{grid-column:span 2}.card-half:last-child{grid-column:span 3}.gallery-card .image-button{width:100%;height:480px}.image-button{display:block;border:0;background:#e5e4df;padding:0;position:relative;overflow:hidden}.image-button img{height:100%;width:100%;object-fit:cover;transition:transform .7s}.image-button:hover img{transform:scale(1.025)}.view-icon{position:absolute;bottom:16px;right:16px;display:grid;place-items:center;background:#f8f7f1ee;width:38px;height:38px;border-radius:50%;font:25px Arial;color:var(--ink)}figcaption{display:flex;justify-content:space-between;gap:15px;padding-top:15px;font-size:15px}figcaption small{font:10px/1.8 Arial;letter-spacing:1px;color:#737a6d;padding-top:5px;text-align:right}.brand-story{background:#eceee8;padding-block:80px}.story-grid{display:grid;grid-template-columns:5fr 6fr;gap:100px;align-items:center}.logo-panel{max-width:380px;margin-inline:auto;width:100%;border:1px solid #dadbd4;padding:16px}.logo-panel img{width:100%;height:auto}.story-copy p{max-width:540px}.underlined{display:inline-block;font-size:14px;border-bottom:1px solid #a09a8e;padding:5px 0;margin-top:10px}.story-signature{font:15px/2 Arial;letter-spacing:2px;margin-top:45px}.story-signature span{font-size:10px;letter-spacing:2.5px;color:#73796e}.services{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.services article{padding:32px 30px 28px 0}.services article+article{border-left:1px solid var(--line);padding-left:30px}.service-number{font:12px Arial;color:#8a755a;letter-spacing:1px}.services h3{font-size:23px;margin:28px 0 12px}.services p{margin-bottom:0;font-size:15px}.concept-section{background:#202420;color:#fff}.concept-section .eyebrow{color:#b7aa97}.concept-section .section-note{color:#c4c8be}.concept-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.concept-grid .concept{height:auto;width:100%;background:transparent}.concept img{width:100%;height:auto;object-fit:contain}.process-section{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;align-items:center}.process-image .image-button{height:660px;width:100%}.process-image img{object-position:45% center}.steps{list-style:none;padding:0;margin:32px 0 0;counter-reset:step}.steps li{counter-increment:step;border-top:1px solid var(--line);padding:20px 0 20px 48px;position:relative}.steps li:before{content:'0' counter(step);position:absolute;left:0;top:24px;font:12px Arial;color:#8a755a}.steps h3{font-size:18px;margin:0 0 5px}.steps p{font-size:15px;margin:0}.experience{background:#e9ece6;padding-block:65px}.experience-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.experience h2{font-size:32px;margin:0}.project-name{font:40px/1.3 Arial;letter-spacing:-1px;margin-bottom:20px}.experience p{margin:0;font-size:15px;max-width:490px}.contact{background:#202420;color:white;padding-bottom:35px}.contact-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:90px}.contact .eyebrow{color:#b8ad9b}.contact h2{font-size:clamp(32px,3.5vw,47px)}.contact p,.contact address{color:#c7cbbf}.contact-actions{display:flex;gap:12px;margin-top:27px}.outline{color:#e1e2dc;background:transparent;border-color:#7c8275}.outline:hover{background:#41483c}.contact-details{padding-top:5px}.phone{display:block;font:clamp(29px,3vw,42px)/1.7 Arial;margin:17px 0;color:#e4d4bd}.contact address{font-style:normal;font-size:15px}.toast{min-height:28px;font-size:14px;margin-bottom:0}.company{margin-top:50px;padding-top:25px;border-top:1px solid #505849;display:flex;justify-content:space-between;gap:20px;font-size:12px;color:#c1c8b9}.company a{text-decoration:underline}.footer{display:flex;justify-content:space-between;padding-block:25px;font-size:12px;color:#747a6d}.footer>span:last-child{font:10px/2 Arial;letter-spacing:1.6px}.skip{position:fixed;top:-80px;left:20px;z-index:100;background:white;padding:10px}.skip:focus{top:12px}:focus-visible{outline:3px solid #b6925d;outline-offset:5px}dialog{border:0;padding:16px 22px 20px;background:#171a17;color:#fff;width:min(1300px,96vw);max-width:96vw;max-height:96svh}dialog::backdrop{background:#0c110eea}.lightbox-toolbar{display:flex;justify-content:space-between;align-items:center;font:13px Arial;color:#ddd}.lightbox-toolbar button{background:none;border:1px solid #687063;color:white;padding:8px 16px}.lightbox-stage{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:15px;align-items:center;margin-top:15px}#large-image{max-width:100%;max-height:75svh;width:auto;height:auto;object-fit:contain;margin:auto}.image-nav{border:1px solid #5c6456;background:transparent;color:white;font:32px Arial;width:44px;height:55px}#image-caption{color:#d9ded3;text-align:center;font-size:14px;margin:14px 0 0}
@media(min-width:1600px){.hero-bottom{left:calc((100% - 1280px)/2)}}
@media(max-width:1000px){.wrap{width:90%}.nav{gap:20px}.nav nav{gap:20px}.nav-contact{padding:12px}.hero-bottom{left:5%}.gallery-card .image-button{height:370px}.story-grid{gap:50px}.process-section{gap:40px}.process-image .image-button{height:580px}.contact-grid{gap:45px}figcaption{display:block}figcaption small{display:block;text-align:left}.section{padding-block:75px}}
@media(max-width:700px){html{scroll-padding-top:83px}.wrap{width:88%}.section{padding-block:57px}.nav{min-height:80px;gap:12px;justify-content:space-between}.brand{font-size:25px;gap:5px}.brand small{font-size:7px;letter-spacing:1.2px}.brand-symbol{transform:scale(.86);margin-left:-5px;margin-right:-3px}.nav nav{gap:19px;font-size:13px;margin:0}.nav nav a:last-child,.nav-contact{display:none}.hero{height:760px;min-height:0;max-height:calc(100svh - 80px)}.hero-image{object-position:59% center}.hero-shade{background:linear-gradient(90deg,#101710d9,#10171072),linear-gradient(0deg,#101710aa,transparent 60%)}.hero-content{padding-block:42px 93px}.hero h1{font-size:49px;letter-spacing:-1px}.hero .eyebrow{font-size:10px;letter-spacing:1.5px}.hero p{font-size:15px}.hero-actions{gap:22px}.button{padding:12px 20px}.hero-bottom{left:6%;font-size:9px;letter-spacing:1px;gap:25px;bottom:22px}.hero-bottom span:last-child{text-align:right;max-width:110px;line-height:1.6}.material-strip{gap:15px;padding:20px 4%;font-size:11px}.material-strip i{width:3px;height:3px}.section-heading{display:block;margin-bottom:28px}.section-note{margin-top:22px;font-size:15px}.section-note span{font-size:12px}.gallery-grid{grid-template-columns:1fr 1fr;gap:30px 14px}.gallery-card.card-wide,.gallery-card.card-half,.gallery-card.card-tall{grid-column:span 1}.gallery-card:first-child,.gallery-card:nth-child(4){grid-column:span 2}.gallery-card .image-button{height:auto;aspect-ratio:3/4}.gallery-card:first-child .image-button,.gallery-card:nth-child(4) .image-button{aspect-ratio:4/3}figcaption{font-size:13px;padding-top:11px}figcaption small{font-size:9px;letter-spacing:.4px}.view-icon{width:28px;height:28px;bottom:10px;right:10px;font-size:20px}.brand-story{padding-block:50px}.story-grid{grid-template-columns:1fr;gap:38px}.logo-panel{max-width:250px;padding:12px}.story-copy{text-align:left}.story-signature{margin-top:26px}.services{grid-template-columns:1fr}.services article,.services article+article{padding:25px 0;border-left:0}.services article+article{border-top:1px solid var(--line)}.services h3{margin:14px 0 10px}.concept-grid{grid-template-columns:1fr 1fr;gap:12px}.process-section{grid-template-columns:1fr;gap:35px}.process-image .image-button{height:auto;aspect-ratio:4/3}.process-copy h2{font-size:30px}.experience-grid{grid-template-columns:1fr;gap:30px}.experience{padding-block:50px}.experience h2{font-size:29px}.project-name{font-size:36px}.contact-grid{grid-template-columns:1fr;gap:34px}.contact h2{font-size:34px}.company{display:block;margin-top:38px}.company>div+div{margin-top:18px}.footer{gap:20px;align-items:center;font-size:11px}.footer>span:last-child{font-size:9px;text-align:right;max-width:125px}dialog{padding:12px 10px;width:96vw}.lightbox-stage{grid-template-columns:30px minmax(0,1fr) 30px;gap:5px}.image-nav{width:30px;height:44px;font-size:26px}#large-image{max-height:70svh}#image-caption{font-size:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}


/* Readable captions at every screen size. */
figcaption small{font-size:12px;letter-spacing:.3px}.section-note span{font-size:14px}@media(max-width:700px){.material-strip{font-size:12px;gap:12px}.hero-bottom{font-size:10px}figcaption small{font-size:12px}}

.service-area-summary{margin-top:38px;max-width:820px}
.service-area-summary h3{font-size:clamp(23px,2.5vw,30px);line-height:1.5;margin-bottom:16px}
.service-area-summary p{font-size:15px;margin-bottom:12px}
.contact-service-area{font-size:15px}
.contact-actions{flex-wrap:wrap}
.line-contact[hidden]{display:none}
.service-product{margin:24px 0 0}
.service-product .image-button{width:100%;aspect-ratio:3/2}
.service-product figcaption{font-size:12px;line-height:1.6;color:var(--muted);padding-top:9px}
/* Selected work: scroll-snap carousel and full-screen photo viewer. */
.portfolio-section{border-top:1px solid var(--line)}.portfolio-controls{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.portfolio-controls>span{font:12px Arial;letter-spacing:2px;color:#80725e}.portfolio-controls>div{display:flex;gap:10px}.portfolio-controls button{width:48px;height:48px;border:1px solid #c7c8bf;background:transparent;border-radius:50%;transition:background .2s}.portfolio-controls button:hover{background:#e4d4bd}.portfolio-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;position:relative;padding-bottom:10px;overscroll-behavior-x:contain}.portfolio-track::-webkit-scrollbar{display:none}.portfolio-card{flex:0 0 42%;min-width:0;margin:0;scroll-snap-align:start}.portfolio-card .image-button{width:100%;height:490px}.portfolio-card figcaption{display:block}.portfolio-card figcaption small{display:block;text-align:left}.portfolio-track::after{content:'';flex:0 0 calc(58% - 24px)}.portfolio-dots{display:flex;gap:9px;justify-content:center;margin:26px 0}.portfolio-dots button{width:24px;height:24px;background:transparent;border:0;position:relative;padding:0}.portfolio-dots button::after{content:'';position:absolute;inset:8px;background:#d1d2c9;border-radius:50%;transition:background .2s,transform .2s}.portfolio-dots button[aria-current=true]::after{background:#927852;transform:scale(1.35)}.portfolio-open{display:flex;margin:0 auto}.lightbox-thumbs{display:flex;gap:8px;overflow-x:auto;margin-top:16px;padding:3px;max-height:76px}.lightbox-thumbs button{background:transparent;border:2px solid transparent;padding:0;flex:0 0 58px;height:58px;opacity:.5}.lightbox-thumbs button[aria-current=true]{border-color:#e4d4bd;opacity:1}.lightbox-thumbs img{height:100%;width:100%;object-fit:cover}.original-image{display:block;text-align:center;font-size:12px;color:#ddd;text-decoration:underline;margin-top:8px}#large-image{max-height:61svh;touch-action:pan-y}.service-product figcaption{min-height:38px}@media(max-width:1000px){.portfolio-card .image-button{height:390px}}@media(max-width:700px){.portfolio-card{flex-basis:86%}.portfolio-track{gap:16px}.portfolio-track::after{flex-basis:calc(14% - 16px)}.portfolio-card .image-button{height:400px}.portfolio-controls button{width:44px;height:44px}.portfolio-card figcaption{font-size:14px}#large-image{max-height:54svh}.lightbox-thumbs{max-height:64px}.lightbox-thumbs button{height:48px;flex-basis:48px}}
/* V9: quiet inquiry flow and useful project details. */
.quote-trigger.text-link,.underlined.quote-trigger{background:none;border:0;border-bottom:1px solid currentColor;color:inherit;padding:8px 0}.quote-trigger.text-link{cursor:pointer}.response-note{font-size:13px;margin:18px 0 0}.work-story{max-width:820px;margin:auto;text-align:center}.work-story p{white-space:pre-line;margin:8px 0;color:#d9ded3}#image-caption{font-size:17px}#image-meta{font-size:12px;color:#c4b9a6}#image-description{font-size:14px}#inquire-work{color:#e4d4bd;font-size:14px}.work-story [hidden]{display:none}#large-image{max-height:52svh}.assurance{border-top:1px solid #505849;padding:24px 0 0;margin-top:36px;max-width:740px}.assurance p{white-space:pre-line;margin-top:14px}.real-reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:35px}.real-reviews blockquote{margin:0;border-top:1px solid #505849;padding-top:20px}.real-reviews cite{font-size:13px;color:#bdb9ab;font-style:normal}.admin-link{font-size:11px;color:var(--muted)}.mobile-contact{display:none}.quote-close{position:absolute;top:18px;right:20px;border:0;background:transparent;font-size:22px}.quote-close:focus-visible{outline:2px solid #9c7d55}#quote-dialog{background:var(--paper);color:var(--ink);width:min(710px,94vw);padding:42px;max-height:92svh;border-radius:3px}#quote-dialog h2{font-size:32px;margin-bottom:14px}#quote-dialog>.eyebrow{margin-right:25px;font-size:10px;margin-bottom:15px}#quote-dialog>p{font-size:14px}#quote-dialog .button{width:100%;margin-top:16px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-grid label,.optional-details label{display:flex;flex-direction:column;gap:6px;font-size:13px}.form-grid label span{color:var(--muted)}input,select,textarea{font:inherit}#quote-dialog input:not([type=checkbox]),#quote-dialog select,#quote-dialog textarea{border:1px solid #cbd0c4;background:#fff;border-radius:2px;padding:11px 12px;min-width:0;width:100%;color:var(--ink);font-size:15px}#quote-dialog input:focus,#quote-dialog select:focus,#quote-dialog textarea:focus{outline:2px solid #a28b68;outline-offset:1px}.optional-details{font-size:13px;margin-top:18px}.optional-details label{margin-top:12px}.consent{display:flex;align-items:flex-start;gap:9px;font-size:12px;line-height:1.8;margin-top:22px}.consent input{margin-top:5px;flex-shrink:0}.privacy-note{font-size:11px;line-height:1.8;margin:12px 0;color:#74786f}.honeypot{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}#quote-status{font-size:13px;margin:12px 0 0}button:disabled{opacity:.55;cursor:wait}#quote-success{text-align:center}.success-check{font-size:40px;color:#6d785d;margin:20px 0}#inquiry-reference{font-size:12px;overflow-wrap:anywhere}.form-grid input::placeholder{font-size:13px;color:#92968b}
@media(max-width:700px){body{padding-bottom:62px}#quote-dialog{padding:35px 23px 26px}.form-grid{gap:13px}.form-grid label{font-size:12px}#quote-dialog h2{font-size:27px}.mobile-contact{position:fixed;bottom:0;left:0;right:0;z-index:19;display:flex;background:#fafaf8f5;backdrop-filter:blur(10px);border-top:1px solid #dcdfd8;padding:10px 6%;gap:12px;padding-bottom:max(10px,env(safe-area-inset-bottom))}.mobile-contact button{flex:1;background:#e4d4bd;border:0;padding:9px 12px;font-size:14px}.mobile-contact a{padding:9px 14px;border:1px solid #b5bdad;font-size:13px}.real-reviews{grid-template-columns:1fr}#large-image{max-height:44svh}.work-story{max-height:20svh;overflow:auto}#image-description{font-size:12px}.footer{flex-wrap:wrap}}
