:root{--ink:#171918;--paper:#f4f5f2;--muted:#70746f;--chrome:#aeb3b0;--line:rgba(23,25,24,.16)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--paper)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,"Noto Sans Thai",Thonburi,sans-serif;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
.contact-page{min-height:100svh;display:grid;grid-template-columns:minmax(0,1.04fr) minmax(520px,.96fr);background:var(--paper)}
.visual-panel{min-height:100svh;position:sticky;top:0;overflow:hidden;background:#bfc0bd}
.hero-image,.image-shade{position:absolute;inset:0;width:100%;height:100%}
.hero-image{object-fit:cover;object-position:54% center;filter:saturate(.66) contrast(1.04) brightness(.91);transform:scale(1.01)}
.image-shade{background:linear-gradient(180deg,rgba(11,12,12,.42),transparent 32%),linear-gradient(0deg,rgba(11,12,12,.32),transparent 38%)}
.brand-lockup{position:relative;z-index:1;display:flex;align-items:flex-start;justify-content:space-between;padding:42px 44px;color:#fff}
.brand-lockup p{margin:7px 0 0;font-size:10px;font-weight:600;letter-spacing:.24em}
.wordmark{font-size:25px;font-weight:500;line-height:1;letter-spacing:.38em}.wordmark span{letter-spacing:0}.wordmark-light{color:#fff}
.image-caption{position:absolute;z-index:1;left:44px;bottom:40px;display:grid;grid-template-columns:auto minmax(20px,112px) auto;align-items:center;gap:16px;width:max-content;color:#fff;font-size:10px;font-weight:600;letter-spacing:.24em}
.caption-line{height:1px;background:rgba(255,255,255,.72)}
.contact-panel{min-height:100svh;display:flex;flex-direction:column;padding:clamp(40px,5.2vw,76px) clamp(36px,6vw,92px) 34px;border-left:1px solid rgba(255,255,255,.7)}
.mobile-brand{display:none}.contact-intro{margin-bottom:clamp(44px,7vh,82px)}
.eyebrow{margin:0 0 24px;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.22em}
h1{max-width:520px;margin:0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(50px,5.2vw,78px);font-weight:400;line-height:.94;letter-spacing:-.055em}
.intro-thai{margin:30px 0 0;color:#555955;font-size:16px;font-weight:400;line-height:1.8}
.contact-list{border-top:1px solid var(--ink)}
.contact-link{min-height:94px;display:grid;grid-template-columns:40px minmax(0,1fr) 44px;align-items:center;gap:16px;border-bottom:1px solid var(--line);transition:background-color 180ms ease,padding 180ms ease}
.link-index{align-self:start;padding-top:29px;color:var(--muted);font-size:11px;letter-spacing:.14em}
.link-copy{min-width:0;display:flex;flex-direction:column;gap:6px}.link-name{font-family:Georgia,"Times New Roman",serif;font-size:25px;line-height:1;letter-spacing:-.025em}
.link-detail{overflow:hidden;color:var(--muted);font-size:13px;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}
.link-arrow{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--chrome);border-radius:50%;transition:background-color 180ms ease,border-color 180ms ease,transform 180ms ease}
.link-arrow svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.45}
.contact-link:hover,.contact-link:focus-visible{padding-left:12px;padding-right:8px;background:rgba(255,255,255,.54);outline:none}
.contact-link:hover .link-arrow,.contact-link:focus-visible .link-arrow{border-color:var(--ink);background:var(--ink);color:#fff;transform:rotate(4deg)}
.page-footer{margin-top:auto;padding-top:50px;display:flex;justify-content:space-between;color:var(--muted);font-size:10px;font-weight:600;letter-spacing:.18em}
@media(max-width:920px){.contact-page{display:block}.visual-panel{min-height:0;height:min(54svh,500px);position:relative}.brand-lockup{display:none}.contact-panel{min-height:auto;padding:30px clamp(22px,6vw,52px) 28px;border-left:0}.mobile-brand{display:flex;align-items:center;justify-content:space-between;margin-bottom:76px}.mobile-edition{color:var(--muted);font-size:10px;font-weight:600;letter-spacing:.16em}.contact-intro{margin-bottom:48px}.image-caption{left:24px;bottom:24px}}
@media(max-width:560px){.visual-panel{height:38svh;min-height:290px}.hero-image{object-position:42% 58%}.image-caption{grid-template-columns:auto 48px auto;gap:10px}.contact-panel{padding-left:20px;padding-right:20px}.mobile-brand{margin-bottom:62px}h1{font-size:clamp(46px,15vw,62px)}.intro-thai{margin-top:24px;font-size:15px}.contact-link{min-height:88px;grid-template-columns:32px minmax(0,1fr) 40px;gap:11px}.link-index{padding-top:27px}.link-name{font-size:23px}.link-detail{font-size:12px}.link-arrow{width:38px;height:38px}.page-footer{padding-top:38px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important}}