:root{--d:#2e3033;--d2:#45484c;--m:#6f7378;--b:#9a6f3f;--bl:#c9a27a;--l:#efece8;--w:#fff}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:"Noto Sans Thai","Sarabun",system-ui,sans-serif;color:var(--d);background:var(--w);line-height:1.75}
img{max-width:100%;display:block}a{color:inherit}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--b);outline-offset:2px}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
header{background:var(--w);border-bottom:3px solid var(--b);position:sticky;top:0;z-index:5}
.bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 24px;padding-top:12px;padding-bottom:12px}
.logo{text-decoration:none;font-weight:700;font-size:1.35rem;color:var(--d)}
nav{display:flex;flex-wrap:wrap;gap:4px 20px}nav a{text-decoration:none;padding:4px 0;border-bottom:2px solid transparent;color:var(--d2)}
nav a:hover,nav a[aria-current]{color:var(--b);border-color:var(--b)}
h1,h2,h3{line-height:1.3;margin:0 0 .5em}h1{font-size:clamp(1.8rem,4vw,2.8rem)}h2{font-size:1.6rem;margin-top:1.8em}h3{font-size:1.2rem}
.lead{font-size:1.1rem;color:var(--d2);max-width:680px}
.hero{position:relative;background:var(--d);color:#fff;padding:104px 0;overflow:hidden}
.hero .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.4}
.hero .wrap{position:relative}.hero p{max-width:620px;color:#ece9e5}
.btn{display:inline-block;background:var(--b);color:#fff;border:0;padding:12px 28px;font:inherit;font-weight:700;text-decoration:none;cursor:pointer;border-radius:4px;margin-top:8px}
.btn:hover{background:#80592f}
.svc{display:grid;grid-template-columns:1fr 1.2fr;gap:28px;align-items:center;margin:32px 0;background:var(--l);border-radius:6px;overflow:hidden}
.svc:nth-of-type(even) img{order:2}.svc img{width:100%;height:100%;min-height:260px;object-fit:cover;background:#d9d5cf}
.svc div{padding:24px}.svc h3{color:var(--b)}.svc ul{padding-left:1.2em;margin:.6em 0 0;color:var(--d2)}
.band{background:var(--d);color:#fff;padding:24px 0 48px;margin-top:40px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}.grid3>div{background:var(--d2);padding:20px;border-radius:6px;border-top:3px solid var(--bl)}
.grid3 p{color:#dcd9d5;margin:0}
.page{padding-top:48px;padding-bottom:56px}.two{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:start;margin-top:24px}
.two img{border-radius:6px;width:100%;background:var(--l);min-height:200px;object-fit:cover}
.info dt{font-weight:700;margin-top:14px;color:var(--b)}.info dd{margin:0}
form label{display:block;font-weight:700;margin-bottom:14px}
input,textarea{display:block;width:100%;margin-top:4px;padding:10px;font:inherit;border:1px solid var(--m);border-radius:4px;background:var(--w)}
.map{width:100%;height:320px;border:0;margin-top:40px;border-radius:6px}
.prose{max-width:760px}.prose h2{color:var(--b);font-size:1.3rem}
footer{background:var(--d);color:#cfcbc6;padding-top:32px;border-top:3px solid var(--b)}.foot{display:grid;grid-template-columns:1.4fr 1fr;gap:24px}
footer p{margin:.3em 0}.copy{border-top:1px solid var(--d2);margin-top:24px;padding:14px 20px;text-align:center;font-size:.9rem}
@media(max-width:760px){.svc,.two,.foot{grid-template-columns:1fr}.svc:nth-of-type(even) img{order:0}.hero{padding:64px 0}}
