:root{
  --nh-paper:#f5f2fb; --nh-card:#ffffff; --nh-ink:#1c1730; --nh-mute:#58526f; --nh-line:#d9d1ec; --nh-dash:#a99bd3;
  --nh-brick:#9e2a2b; --nh-brick-d:#7c1f20; --nh-teal:#2a9d8f; --nh-teal-d:#1b6f65; --nh-tint:#ebe6f6;
  --nh-f-th:"IBM Plex Sans Thai",sans-serif; --nh-f-disp:"Bowlby One","IBM Plex Sans Thai",sans-serif;
  --nh-r:12px; --nh-g1:8px; --nh-g2:14px; --nh-g3:22px; --nh-g4:36px; --nh-g5:56px;
}
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;-webkit-text-size-adjust:100%}
body{margin:0;overflow-x:clip;background:var(--nh-paper);color:var(--nh-ink);font-family:var(--nh-f-th);font-size:16.5px;line-height:1.8}
img{max-width:100%;height:auto;display:block}
a{color:var(--nh-brick);text-underline-offset:3px}
a:hover{color:var(--nh-brick-d)}
:focus-visible{outline:2px solid var(--nh-teal-d);outline-offset:2px}
h1,h2,h3{margin:0;font-family:var(--nh-f-th);font-weight:700;line-height:1.35;text-wrap:balance}
p{margin:0 0 var(--nh-g2)}
ul,ol{margin:0;padding:0}
.nh-wrap{max-width:1160px;margin-inline:auto;padding-inline:20px}
.nh-col{max-width:880px}
.nh-jump{position:absolute;left:-999px;top:0;background:var(--nh-ink);color:var(--nh-paper);padding:8px 14px;z-index:90}
.nh-jump:focus{left:8px}

/* bar */
.nh-bar{position:sticky;top:0;z-index:50;background:var(--nh-card);border-bottom:1px solid var(--nh-line)}
.nh-bar-row{display:flex;align-items:center;gap:22px;min-height:66px}
.nh-logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--nh-ink);white-space:nowrap}
.nh-logo-mark{display:grid;place-items:center;width:34px;height:34px;border:2px dashed var(--nh-brick);border-radius:8px;font-family:var(--nh-f-disp);color:var(--nh-brick);font-size:18px;line-height:1}
.nh-logo-txt{font-family:var(--nh-f-disp);font-size:20px;letter-spacing:.02em;line-height:1}
.nh-links{display:none;flex:1;gap:2px;align-items:center}
.nh-links a{color:var(--nh-ink);text-decoration:none;font-size:15.5px;padding:8px 12px;border-radius:8px;white-space:nowrap;line-height:1.3}
.nh-links a:hover{background:var(--nh-tint)}
.nh-links a[aria-current="page"]{color:var(--nh-brick);font-weight:600;background:var(--nh-tint)}
.nh-bar-cta{margin-left:auto}
.nh-toggle{width:44px;height:44px;border:1px solid var(--nh-line);background:var(--nh-card);border-radius:10px;display:inline-grid;place-items:center;cursor:pointer;padding:0}
.nh-toggle svg{width:24px;height:24px;fill:none;stroke:var(--nh-ink);stroke-width:2;stroke-linecap:round}
.nh-sheet{position:absolute;left:0;right:0;top:100%;background:var(--nh-card);border-bottom:3px solid var(--nh-brick);box-shadow:0 14px 28px color-mix(in srgb,var(--nh-ink) 18%,transparent);transform:translateY(-12px);opacity:0;visibility:hidden;transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s;max-height:calc(100vh - 80px);overflow:auto}
.nh-sheet.is-open{transform:none;opacity:1;visibility:visible;transition-delay:0s}
.nh-sheet .nh-wrap{display:grid;padding-block:10px}
.nh-sheet a{color:var(--nh-ink);text-decoration:none;padding:13px 6px;border-bottom:1px dashed var(--nh-line);line-height:1.4}
.nh-sheet a.nh-btn{margin-top:12px;border-bottom:0;color:var(--nh-brick-ink,#fff)}

/* buttons */
.nh-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:10px 22px;border-radius:10px;font-family:var(--nh-f-th);font-weight:600;font-size:16px;line-height:1.2;text-decoration:none;white-space:nowrap;border:2px solid var(--nh-brick);cursor:pointer}
.nh-btn-solid{background:var(--nh-brick);color:#fff}
.nh-btn-solid:hover{background:var(--nh-brick-d);color:#fff}
.nh-btn-ghost{background:transparent;color:var(--nh-brick)}
.nh-btn-ghost:hover{background:var(--nh-brick);color:#fff}
.nh-btn-light{background:#fff;border-color:#fff;color:var(--nh-brick-d)}
.nh-btn-light:hover{background:var(--nh-paper);color:var(--nh-brick-d)}
.nh-btn-s{min-height:40px;padding:6px 16px;font-size:15px}
.nh-bar-cta{min-height:42px;padding:6px 18px;font-size:15px}
.nh-btn:active{transform:translateY(1px)}

/* trail */
.nh-trail{background:var(--nh-tint);border-bottom:1px solid var(--nh-line);font-size:14.5px}
.nh-trail ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px 8px;padding-block:9px;line-height:1.5}
.nh-trail li+li::before{content:"\203A";margin-right:8px;color:var(--nh-mute)}
.nh-trail a{color:var(--nh-teal-d)}

/* hero */
.nh-top{padding-block:var(--nh-g4) var(--nh-g5)}
.nh-top-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--nh-g4);align-items:center}
.nh-ribbon{display:inline-block;margin-bottom:var(--nh-g2);padding:4px 14px;border:1px dashed var(--nh-teal-d);border-radius:999px;color:var(--nh-teal-d);font-size:14.5px;font-weight:600;line-height:1.5}
.nh-top h1{font-size:clamp(1.85rem,3.4vw,2.7rem);margin-bottom:var(--nh-g2)}
.nh-lede{color:var(--nh-mute);font-size:1.06rem;max-width:58ch}
.nh-ticks{list-style:none;display:grid;gap:8px;margin:var(--nh-g3) 0}
.nh-ticks li{position:relative;padding-left:32px;line-height:1.6}
.nh-ticks li::before{content:"";position:absolute;left:4px;top:.5em;width:14px;height:8px;border-left:3px solid var(--nh-teal-d);border-bottom:3px solid var(--nh-teal-d);transform:rotate(-45deg)}
.nh-actions{display:flex;flex-wrap:wrap;gap:12px}
.nh-box{position:relative;border:3px dashed var(--nh-dash);border-radius:20px;padding:34px 22px 18px;background:var(--nh-card)}
.nh-box-tag{position:absolute;top:-16px;right:22px;background:var(--nh-brick);color:#fff;font-family:var(--nh-f-disp);font-size:15px;letter-spacing:.06em;padding:4px 14px;border-radius:8px;line-height:1.4}
.nh-box-grid{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.nh-box-grid li{aspect-ratio:1/1;overflow:hidden;border-radius:10px;background:var(--nh-tint)}
.nh-box-grid img{width:100%;height:100%;object-fit:cover;object-position:center 35%}
.nh-box-cap{margin:14px 0 0;color:var(--nh-mute);font-size:14.5px;line-height:1.6}

/* bands */
.nh-band{padding-block:var(--nh-g5)}
.nh-band-tint{background:var(--nh-tint)}
.nh-h2{font-size:clamp(1.45rem,2.5vw,1.95rem);margin-bottom:var(--nh-g3)}
.nh-h2::after{content:"";display:block;width:64px;height:0;border-top:3px dashed var(--nh-brick);margin-top:12px}
.nh-small{color:var(--nh-mute);font-size:15px;margin-bottom:var(--nh-g3)}
.nh-trio{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--nh-g3)}
.nh-trio li{display:flex;gap:16px;align-items:flex-start;padding:20px;background:var(--nh-card);border:1px solid var(--nh-line);border-radius:var(--nh-r)}
.nh-trio svg{flex:none;width:36px;height:36px;fill:none;stroke:var(--nh-teal-d);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.nh-trio strong{display:block;margin-bottom:2px}
.nh-trio span{color:var(--nh-mute);font-size:15.5px;line-height:1.65;display:block}

/* tiles */
.nh-tiles{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--nh-g3)}
.nh-tile{background:var(--nh-card);border:1px solid var(--nh-line);border-radius:var(--nh-r);padding:10px}
.nh-tile-pic{position:relative;aspect-ratio:1/1;overflow:hidden;border-radius:8px;background:var(--nh-tint)}
.nh-tile-pic img{width:100%;height:100%;object-fit:cover;object-position:center 35%}
.nh-tile-prov{position:absolute;left:8px;top:8px;background:var(--nh-ink);color:var(--nh-paper);font-size:12.5px;line-height:1.4;padding:2px 9px;border-radius:6px}
.nh-tile-name{margin:10px 0 2px;font-weight:600;line-height:1.4}
.nh-tile-tag{margin:0;color:var(--nh-teal-d);font-size:13.5px;font-weight:600}

/* prose */
.nh-prose h2{font-size:clamp(1.35rem,2.3vw,1.75rem);margin:var(--nh-g4) 0 var(--nh-g2)}
.nh-prose h2:first-child{margin-top:0}
.nh-prose h3{font-size:1.15rem;margin:var(--nh-g3) 0 8px}
.nh-prose p,.nh-prose ul{max-width:68ch}
.nh-prose ul{padding-left:1.3em;margin-bottom:var(--nh-g2)}
.nh-prose li{margin-bottom:6px}
.nh-prose table{border-collapse:collapse;width:100%;margin-bottom:var(--nh-g3);font-size:15.5px;background:var(--nh-card)}
.nh-prose th,.nh-prose td{border:1px solid var(--nh-line);padding:10px 14px;text-align:left;vertical-align:top;line-height:1.6}
.nh-prose th{background:var(--nh-tint)}
.nh-title{padding-block:var(--nh-g4) var(--nh-g3);border-bottom:1px dashed var(--nh-dash)}
.nh-title h1{font-size:clamp(1.7rem,3vw,2.4rem);margin-bottom:12px}
.nh-aside{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:var(--nh-g4) 0;padding:16px 20px;border:2px dashed var(--nh-dash);border-radius:var(--nh-r);background:var(--nh-card)}
.nh-aside p{margin:0}

/* kids */
.nh-kids{list-style:none;display:grid;gap:var(--nh-g2)}
.nh-kid{display:grid;gap:6px;padding:20px 24px;background:var(--nh-card);border:1px solid var(--nh-line);border-left:6px solid var(--nh-teal);border-radius:var(--nh-r);text-decoration:none;color:var(--nh-ink)}
.nh-kid:hover{border-left-color:var(--nh-brick)}
.nh-kid strong{font-size:1.1rem;line-height:1.45}
.nh-kid span{color:var(--nh-mute);font-size:15.5px;line-height:1.65}
.nh-kid em{font-style:normal;color:var(--nh-brick);font-weight:600;font-size:15px}

/* gallery */
.nh-fig-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:var(--nh-g2)}
.nh-fig{margin:0;background:var(--nh-card);border:1px solid var(--nh-line);border-radius:10px;padding:8px}
.nh-fig img{width:100%;aspect-ratio:1/1;object-fit:cover;object-position:center 35%;border-radius:6px}
.nh-fig figcaption{margin-top:8px;font-size:14px;color:var(--nh-mute);line-height:1.45}

/* compare */
.nh-scroll{overflow-x:auto}
.nh-cmp{border-collapse:collapse;width:100%;background:var(--nh-card);min-width:520px}
.nh-cmp th,.nh-cmp td{border:1px solid var(--nh-line);padding:12px 16px;text-align:left;vertical-align:top;line-height:1.6}
.nh-cmp thead th{background:var(--nh-tint)}
.nh-cmp tbody th{width:20%;color:var(--nh-teal-d)}

/* faq */
.nh-qs{display:grid;gap:10px}
.nh-q{background:var(--nh-card);border:1px solid var(--nh-line);border-radius:var(--nh-r);padding:0 20px}
.nh-q summary{cursor:pointer;list-style:none;padding:16px 34px 16px 0;font-weight:600;position:relative;line-height:1.55}
.nh-q summary::-webkit-details-marker{display:none}
.nh-q summary::after{content:"+";position:absolute;right:2px;top:12px;font-size:24px;color:var(--nh-brick);line-height:1.2}
.nh-q[open] summary::after{content:"\2212"}
.nh-q p{color:var(--nh-mute);padding-bottom:6px}

/* end */
.nh-end{background:var(--nh-brick);color:#fff;padding-block:var(--nh-g4)}
.nh-end-row{display:flex;align-items:center;justify-content:space-between;gap:var(--nh-g3);flex-wrap:wrap}
.nh-end h2{font-size:1.5rem;margin-bottom:6px}
.nh-end p{margin:0;max-width:56ch}

/* foot */
.nh-foot{background:var(--nh-card);border-top:1px solid var(--nh-line);padding-block:var(--nh-g4) var(--nh-g3);font-size:15.5px}
.nh-foot-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:var(--nh-g4)}
.nh-foot-brand{display:grid;gap:12px;justify-items:start}
.nh-foot-brand p{margin:0;color:var(--nh-mute);max-width:42ch}
.nh-foot-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--nh-g3)}
.nh-fh{font-weight:700;margin-bottom:8px;color:var(--nh-teal-d)}
.nh-fcol ul{list-style:none;display:grid;gap:4px}
.nh-fcol a{color:var(--nh-ink);text-decoration:none;line-height:1.5;display:inline-block;padding-block:2px}
.nh-fcol a:hover{color:var(--nh-brick)}
.nh-foot-cmp{margin-top:var(--nh-g4);padding:18px 22px;border:2px dashed var(--nh-dash);border-radius:var(--nh-r);background:var(--nh-paper)}
.nh-foot-cmp dl{margin:0;display:grid;grid-template-columns:max-content 1fr;gap:6px 18px}
.nh-foot-cmp dt{font-weight:600}
.nh-foot-cmp dd{margin:0;color:var(--nh-mute)}
.nh-fine{margin:var(--nh-g3) 0 0;color:var(--nh-mute);font-size:14px;line-height:1.7}

.nh-dock{display:none}

@media (min-width:1021px){
  .nh-links{display:flex}
  .nh-toggle{display:none}
  .nh-sheet{display:none}
}
@media (max-width:1020px){
  .nh-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
  .nh-foot-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  body{padding-bottom:74px}
  .nh-top-grid{grid-template-columns:minmax(0,1fr)}
  .nh-trio{grid-template-columns:minmax(0,1fr)}
  .nh-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--nh-g2)}
  .nh-foot-top{grid-template-columns:minmax(0,1fr)}
  .nh-band{padding-block:var(--nh-g4)}
  .nh-top{padding-block:var(--nh-g3) var(--nh-g4)}
  .nh-foot-cmp dl{grid-template-columns:minmax(0,1fr)}
  .nh-dock{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--nh-card);border-top:1px solid var(--nh-line);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .nh-dock a{display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--nh-mute);text-decoration:none;font-size:13px;line-height:1.2;padding:6px 2px;min-height:48px}
  .nh-dock a[aria-current="page"]{color:var(--nh-brick);font-weight:600}
  .nh-dock svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
}
@media (max-width:420px){
  .nh-wrap{padding-inline:16px}
  .nh-bar-row{gap:10px}
  .nh-logo-txt{font-size:17px}
  .nh-bar-cta{padding-inline:12px;font-size:14.5px}
  .nh-box{padding:28px 14px 14px}
  .nh-foot-cols{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
.nh-note{margin-top:18px;color:var(--nh-mute,inherit);font-size:15.5px}