/* site menu */
.mh{position:sticky;top:0;z-index:60;background:#04050d;border-bottom:1px solid rgba(150,190,230,.16)}
.mh .mbar{max-width:1240px;margin:0 auto;padding:0 24px;height:72px;display:flex;align-items:center;gap:14px}
.mh .mbrand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#eef3ff;min-width:0}
.mh .mbrand b{display:block;font:600 17px/1.1 "Prompt",sans-serif}.mh .mbrand i{font-style:normal;font-size:11px;letter-spacing:2px;color:#54ade2;margin-left:6px}
.mh .mbrand small{display:block;font-size:11px;color:#93a0c4;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mh .mlinks{display:flex;gap:2px;margin-left:auto}
.mh .mlinks a{font:500 15px "Prompt",sans-serif;color:#d6def3;text-decoration:none;padding:8px 12px;border-radius:8px}
.mh .mlinks a:hover{background:rgba(255,255,255,.07);color:#fff}
.mh .mlang{display:flex;border:1px solid rgba(150,190,230,.3);border-radius:8px;overflow:hidden}
.mh .mlang a,.mh .mlang button{background:none;border:0;color:#c3cdea;font:600 13px "Prompt",sans-serif;padding:7px 11px;cursor:pointer;text-decoration:none}
.mh .mlang .on{background:#eef3ff;color:#04050d}
.mh .mquote{font:600 14px "Prompt",sans-serif;background:#0088cf;color:#fff;text-decoration:none;padding:9px 16px;border-radius:8px;white-space:nowrap}
.mh .mquote:hover{background:#0a77b5}
.mbtn{display:inline-flex;align-items:center;gap:8px;font:600 14px "Prompt",sans-serif;color:#eef3ff;background:transparent;border:1px solid rgba(238,243,255,.55);border-radius:8px;padding:8px 14px;cursor:pointer;white-space:nowrap}
.mbtn:hover{background:rgba(255,255,255,.08)}
.mbtn svg{width:18px;height:18px}
.mov{position:fixed;inset:0;z-index:100;background:rgba(2,3,10,.72);display:none;overflow-y:auto;padding:88px 20px 40px}
.mov.open{display:block}
.mpanel{position:relative;max-width:1100px;margin:0 auto;background:#0d1328;border:1px solid rgba(150,190,230,.2);border-radius:14px;padding:36px 40px 32px;color:#eef3ff;font-family:"Sarabun","Prompt",sans-serif}
.mpanel .mtop{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px;gap:12px}
.mpanel .mtop strong{font:600 22px "Prompt",sans-serif}
.mclose{display:inline-flex;align-items:center;gap:8px;font:600 15px "Prompt",sans-serif;color:#eef3ff;background:transparent;border:1px solid rgba(238,243,255,.55);border-radius:8px;padding:9px 16px;cursor:pointer}
.mclose:hover{background:rgba(255,255,255,.08)}
.mcols{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.mcols h3{font:600 21px "Prompt",sans-serif;margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid rgba(150,190,230,.2);color:#fff}
.mcols ul{list-style:none;margin:0;padding:0}
.mcols li{margin:0}
.mcols a{display:block;font-size:17.5px;line-height:1.4;color:#d6def3;text-decoration:none;padding:8px 0}
.mcols a:hover{color:#54ade2}
.mcols p{font-size:16px;color:#aab5d6;margin:8px 0 0;line-height:1.55}
body.mlock{overflow:hidden}
@media(max-width:1180px){.mh .mlinks{display:none}.mh .mquote{margin-left:auto}}
@media(max-width:900px){.mcols{grid-template-columns:1fr 1fr}}
@media(max-width:640px){
 .mh .mbar{padding:0 14px;gap:8px;height:64px}.mh .mbrand img{width:96px;height:auto}.mh .mbrand small{display:none}.mh .mbrand b{font-size:14px}
 .mh .mquote{display:none}.mh .mlang{margin-left:auto}
 .mov{padding:0}.mpanel{max-width:none;min-height:100%;border-radius:0;border:0;padding:20px 20px 40px}
 .mcols{grid-template-columns:1fr;gap:24px}
 .mcols a{font-size:18px;padding:13px 0;border-bottom:1px solid rgba(150,190,230,.1)}
}
/* mobile overflow guard: single-column grids must not grow past the viewport */
@media(max-width:980px){
 .hgrid,.sys,.aigrid,.est,.cgrid2,.selector,.prow,.lhero,.made,.diag,.tpanel{grid-template-columns:minmax(0,1fr)}
 .tpanel>*,.est>*,.cgrid2>*,.hgrid>*,.sys>*,.aigrid>*,.selector>*,.prow>*,.lhero>*,.made>*,.diag>*{min-width:0}
 .tpanel,.ttable,#contact,.est{overflow-wrap:anywhere}
 .ttable{width:100%;table-layout:fixed}
}
@media(max-width:640px){#contact .btn,.est .btn{white-space:normal;max-width:100%;flex-wrap:wrap;text-align:center;justify-content:center}}
html,body{max-width:100%;overflow-x:clip}
/* small portrait phones: keep logo, TH/EN and Menu on one line */
.mh .mlang,.mh .mbtn,.mh .mquote{flex-shrink:0}
.mh .mbrand{flex:0 1 auto;min-width:0}.mh .mbrand>span{min-width:0;overflow:hidden}
@media(max-width:640px){.mh .mbrand i{display:none}.mh .mbrand b{white-space:nowrap}.mh .mbtn{padding:8px 12px}}
@media(max-width:430px){.mh .mbrand>span{display:none}.mh .mbrand img{width:110px}}