:root{
  --ink:#1d1d1f;
  --ink-soft:#66666b;
  --line:#dedee2;
  --bg:#ffffff;
  --bg-alt:#f5f5f7;
  --accent:#0066cc;
  --accent-ink:#ffffff;
  --btn-bg:#1d1d1f;
  --btn-bg-hover:#3b3b3e;
  --max:1160px;
  --gutter:30px;
  
  --muted:var(--ink-soft);
  --blue:var(--accent);
  --soft:var(--bg-alt);
}


.nsfoot{display:block;max-width:none;margin:0;border-top:1px solid var(--line);padding:46px var(--gutter);
  font-family:"IBM Plex Sans Thai","Noto Sans Thai",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:15px;line-height:1.6;background:transparent;color:var(--ink-soft)}
.nsfoot__in{max-width:var(--max);margin:0 auto;display:flex;flex-wrap:wrap;gap:12px 26px;align-items:center}
.nsfoot a{color:var(--ink-soft);text-decoration:none;font-size:15px;padding:6px 0}
.nsfoot a:hover{color:var(--ink)}
.nsfoot a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.nsfoot__ns{margin-left:auto;display:inline-flex;align-items:center;gap:8px;color:var(--ink-soft);font-size:13px}
.nsfoot__ns img{height:22px;width:auto;border-radius:2px;display:block}
@media (max-width:700px){.nsfoot{padding:36px 22px}.nsfoot__ns{margin-left:0;width:100%}}
@media print{.nsfoot{display:none}}


.nsfam{display:block;margin:0;padding:var(--s6,48px) var(--gutter);background:var(--bg-alt);border-top:1px solid var(--line);
  font-family:"IBM Plex Sans Thai","Noto Sans Thai",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink-soft)}
.nsfam__in{max-width:var(--max);margin:0 auto}
.nsfam h2{margin:0 0 var(--s3,24px);font-size:1.125rem;line-height:1.5;font-weight:600;color:var(--ink)}
.nsfam__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:0;border-top:2px solid var(--ink)}
.nsfam__list li{border-bottom:1px solid var(--line)}
.nsfam__list a{display:flex;flex-direction:column;gap:2px;min-height:44px;padding:var(--s2,16px) 0;text-decoration:none;color:var(--ink-soft)}
.nsfam__n{font-size:1.0625rem;line-height:1.5;font-weight:500;color:var(--ink)}
.nsfam__h{font-size:.9375rem;line-height:1.5;color:var(--ink-soft)}
.nsfam__d{font-size:.9375rem;line-height:1.6;color:var(--ink-soft)}
.nsfam__list a:hover .nsfam__n{text-decoration:underline;text-underline-offset:4px}
.nsfam__list a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
@media (min-width:700px){
  .nsfam__list{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 var(--s4,32px);border-top:0}
  .nsfam__list li{border-top:2px solid var(--ink);border-bottom:0}
  .nsfam__list a{padding-top:var(--s2,16px);padding-bottom:var(--s1,8px)}
}
@media print{.nsfam{display:none}}


:root{
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;--s6:64px;--s7:96px;
  --sec:clamp(56px,8vw,96px);
  --radius:2px;
  --font:"IBM Plex Sans Thai","Noto Sans Thai",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --fs-h1:clamp(2.125rem,1.2rem + 3.6vw,3.75rem);
  --fs-h2:clamp(1.75rem,1.1rem + 2.2vw,2.625rem);
  --fs-h3:1.375rem;
  --fs-lead:clamp(1.125rem,1rem + .5vw,1.375rem);
  --fs-body:1.125rem;
  --fs-small:.9375rem;
}
@media (max-width:600px){:root{--gutter:20px}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:var(--fs-body);line-height:1.8;text-align:left;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-wrap:break-word}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{margin:0;font-weight:600;color:var(--ink);text-wrap:balance}
h1{font-size:var(--fs-h1);line-height:1.25}
h2{font-size:var(--fs-h2);line-height:1.3}
h3{font-size:var(--fs-h3);line-height:1.4;font-weight:500}
.h-sm{font-size:1.25rem;line-height:1.5;margin:0 0 var(--s3)}
p{margin:0 0 var(--s2)}
a{color:var(--accent)}
ul,ol{list-style:none;margin:0;padding:0}
address{font-style:normal}
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--bg);color:var(--ink);padding:12px 18px;border-radius:var(--radius);font-weight:500}
.skip:focus{left:8px;outline:3px solid var(--accent)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
main:focus{outline:none}
.lead{font-size:var(--fs-lead);line-height:1.7;color:var(--ink-soft);max-width:44em}
.eyebrow{font-size:var(--fs-small);line-height:1.5;font-weight:500;color:var(--ink-soft);margin:0 0 var(--s2)}


.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--btn-bg);color:var(--accent-ink);border:1px solid var(--btn-bg);cursor:pointer;
  font:500 1rem/1.4 var(--font);text-decoration:none;min-height:52px;padding:0 32px;border-radius:30px;text-align:center;gap:6px}
.btn:hover{background:var(--btn-bg-hover);border-color:var(--btn-bg-hover)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--ghost:hover{background:var(--bg-alt);border-color:var(--ink)}
.btn--sm{min-height:44px;padding:0 24px}
.tlink{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:500;text-decoration:none;color:var(--accent)}
.tlink:hover{text-decoration:underline;text-underline-offset:4px}
.actions{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s4) 0 0}
.lk__sep{display:inline-block;width:1px;height:18px;background:var(--line);margin:0 var(--s2);vertical-align:middle}
.ph{font-size:.8125rem;line-height:1.5;color:var(--ink-soft);border:1px dashed var(--ink-soft);padding:2px 10px;display:inline-block;margin:var(--s1) 0 0;border-radius:var(--radius)}


.hd{position:sticky;top:0;z-index:50;background:var(--bg);border-bottom:1px solid var(--line)}
.hd__in{max-width:var(--max);margin:0 auto;padding:0 var(--gutter);min-height:72px;display:flex;align-items:center;gap:var(--s4)}
.hd__brand{display:flex;align-items:center;min-height:48px;flex:none}
.hd__brand img{width:48px;height:48px;border-radius:var(--radius)}
.menu{display:flex;align-items:center;gap:var(--s4);flex:1;justify-content:flex-start;flex-wrap:wrap}
.menu a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink-soft);text-decoration:none;font-size:1rem;font-weight:500;line-height:1.4;border-bottom:2px solid transparent;border-top:2px solid transparent}
.menu a:hover{color:var(--ink)}
.menu a[aria-current=page]{color:var(--ink);border-bottom-color:var(--ink)}
.hd__tools{display:flex;align-items:center;gap:var(--s1);margin-left:auto}
.hd__cta{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;background:var(--btn-bg);color:var(--accent-ink);font-weight:500;font-size:.9375rem;line-height:1.4;text-decoration:none;white-space:nowrap;border-radius:30px}
.hd__cta:hover{background:var(--btn-bg-hover)}
.menu-btn{display:none;min-height:44px;padding:0 16px;font:500 .9375rem/1.4 var(--font);color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:30px;cursor:pointer}
.menu-btn:hover{border-color:var(--ink)}
@media (max-width:760px){
  .hd__in{flex-wrap:wrap;gap:var(--s1) var(--s2);padding-top:8px;padding-bottom:8px}
  .menu{order:3;flex:0 0 100%;gap:0 var(--s3);padding-bottom:var(--s1)}
  .js .menu-btn{display:inline-flex;align-items:center}
  .js .menu{display:none;flex-direction:column;align-items:stretch;gap:0;border-top:1px solid var(--line);padding:var(--s1) 0 var(--s2)}
  .js .menu.is-open{display:flex}
  .js .menu a{border:0;border-bottom:1px solid var(--line);font-size:1.0625rem;min-height:52px}
  .js .menu a[aria-current=page]{box-shadow:inset 3px 0 0 var(--ink);padding-left:var(--s2)}
}


.hero{padding:var(--sec) 0 var(--s6)}
.hero h1{max-width:15em;font-size:clamp(2.25rem,1.1rem + 4.6vw,4.5rem);line-height:1.2}
.hero .lead{margin:var(--s3) 0 0;max-width:34em}
.phead{padding:var(--sec) 0 var(--s6);border-bottom:1px solid var(--line)}
.phead h1{max-width:18em}
.phead .lead{margin:var(--s3) 0 0}


.sec{padding:var(--sec) 0}
.sec--alt{background:var(--bg-alt)}
.sec--tight{padding:var(--s6) 0}
.sec--rows{padding-top:var(--s5)}
.sec__head{margin-bottom:var(--s5);max-width:48em}
.story{max-width:48em}
.story .lead{margin:var(--s3) 0 0;color:var(--ink)}


.lg{margin:0;aspect-ratio:1/1;width:100%;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.lg img{width:100%;height:100%;object-fit:contain}
.lg--empty,.slot--empty{display:flex;align-items:center;justify-content:center;text-align:center;background:var(--bg-alt);border:1px dashed var(--ink-soft);color:var(--ink-soft)}
.lg--empty figcaption,.slot--empty figcaption{display:flex;flex-direction:column;gap:2px;padding:8px;font-size:.8125rem;line-height:1.4}
.slot{margin:0}
.slot img{width:100%;height:auto;border-radius:var(--radius)}
.slot--empty{width:100%}
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s3) var(--s2);align-items:start}
@media (min-width:640px){.tiles{grid-template-columns:repeat(3,1fr)}}
@media (min-width:980px){.tiles{grid-template-columns:repeat(5,1fr);gap:var(--s3)}}
.tile{display:block;text-decoration:none;color:var(--ink)}
.tile .lg{transition:border-color .15s}
.tile:hover .lg{border-color:var(--ink)}
.lg--name{display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--s2);font-weight:600;font-size:1.25rem;line-height:1.4;color:var(--ink)}
.tile--name:hover .lg{text-decoration:underline;text-underline-offset:4px;border-color:var(--ink)}
.tile__n{display:block;margin-top:var(--s1);font-weight:500;font-size:1rem;line-height:1.5}
.tile:hover .tile__n{text-decoration:underline;text-underline-offset:4px}


.ways{display:grid;grid-template-columns:1fr;gap:var(--s5)}
@media (min-width:800px){.ways{grid-template-columns:1fr 1fr;gap:var(--s5) var(--s6)}}
.way{border-top:2px solid var(--ink);padding-top:var(--s3)}
.way h3{margin-bottom:var(--s2)}
.way p{color:var(--ink-soft)}
.way__act{margin:var(--s2) 0 0;display:flex;flex-wrap:wrap;align-items:center}


.chrows{display:block}
.chrow{display:grid;grid-template-columns:1fr;gap:var(--s3);padding:var(--s5) 0;border-bottom:1px solid var(--line)}
.chrow:last-child{border-bottom:0}
.chrow--logo .lg{max-width:120px}
@media (min-width:760px){
  .chrow--logo{grid-template-columns:200px 1fr;gap:var(--s5)}
  .chrow--logo .lg{max-width:none}
}
.chrow h2{font-size:clamp(1.625rem,1.2rem + 1.4vw,2.25rem);margin-bottom:var(--s2)}
.chrow .lead{margin:0 0 var(--s2);color:var(--ink)}
.chrow p{max-width:40em}
.chrow__act{margin:var(--s3) 0 0}


.boxgrid{display:grid;grid-template-columns:1fr;gap:var(--s5)}
@media (min-width:900px){.boxgrid{grid-template-columns:1.2fr 1fr;gap:var(--s6);align-items:start}}
.pts{display:block}
.pt{display:grid;grid-template-columns:48px 1fr;gap:var(--s2);padding:var(--s4) 0;border-bottom:1px solid var(--line)}
.pt:first-child{padding-top:0}
.pt:last-child{border-bottom:0}
.pt__n{font-size:1rem;font-weight:500;color:var(--ink-soft);padding-top:6px}
.pt h2{font-size:clamp(1.5rem,1.1rem + 1.3vw,2rem);margin-bottom:var(--s1)}
.pt .lead{margin:0}


.facts{margin:0;border-top:2px solid var(--ink)}
.facts>div{display:grid;grid-template-columns:1fr;gap:2px;padding:var(--s2) 0;border-bottom:1px solid var(--line)}
@media (min-width:700px){.facts>div{grid-template-columns:200px 1fr;gap:var(--s3)}}
.facts dt{font-weight:500;color:var(--ink-soft);font-size:1rem}
.facts dd{margin:0}
.tel{font-size:1.5rem;font-weight:500;text-decoration:none;color:var(--ink)}
.tel:hover{text-decoration:underline;text-underline-offset:4px}


.cta__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s4)}
.cta h2{font-size:clamp(1.625rem,1.1rem + 1.8vw,2.25rem)}
.cta .lead{margin:var(--s1) 0 0}
.cta__btn{margin:0}


.nsfoot a{display:inline-flex;align-items:center;min-height:44px;padding:0}
.nsfoot__ns{margin-left:auto}
.nsfoot__legal{margin-top:var(--s1);justify-content:flex-start}
.nsfoot__legal p{margin:0 var(--s3) 0 0;font-size:.8125rem;line-height:1.6}
@media print{.hd,.menu-btn{display:none}}


.phead__grid{display:grid;gap:var(--s5);align-items:center}
.phead__img{margin:0;width:100%;max-width:300px}
.phead__img img{display:block;width:100%;height:auto;border-radius:4px}
@media (min-width:800px){.phead__grid{grid-template-columns:1fr 300px;gap:var(--s6)}.phead__img{justify-self:end;width:300px}}