/* หน้า landing แนวขนส่งโลกอนาคต (22 ต.ค. 2569 เจ้าของสั่ง "ทำจริง" จาก _delivery/mockup_landing_future) · ใช้เฉพาะ landing*.html */
:root{
  --n9:#040b1c;--n8:#081631;--n7:#0d2147;--n6:#14306a;
  --blue:#2563ff;--cyan:#35d4ff;--or:#ff6a13;--or2:#ff9a3d;--orink:#c94f0c;
  --ink:#0f172a;--ink2:#475569;--line:#e5e9f0;--bg:#f5f7fb;--card:#fff;
  --r:18px;--wrap:1200px;
  --fh:'Prompt','IBM Plex Sans Thai',sans-serif;--fb:'IBM Plex Sans Thai','Prompt',sans-serif;--fn:'Inter','Prompt',sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--fb);color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--fh);margin:0;line-height:1.25}
.wrap{width:min(var(--wrap),100% - 40px);margin-inline:auto}
.ic{width:24px;height:24px;flex:none}

/* ---------- แถบบน ---------- */
.nav{position:fixed;inset:0 0 auto;z-index:50;transition:background .3s,box-shadow .3s,backdrop-filter .3s}
.nav.is-solid{background:rgba(4,11,28,.82);backdrop-filter:blur(14px);box-shadow:0 1px 0 rgba(255,255,255,.06)}
.nav-in{display:flex;align-items:center;gap:28px;height:72px}
.logo{display:flex;align-items:center;gap:10px;color:#fff;font-family:var(--fh);font-weight:700;font-size:19px;letter-spacing:.02em}
.logo img{width:40px;height:40px;border-radius:10px;background:#fff;padding:3px}
.logo b{color:var(--or2);font-weight:700}
.logo small{display:block;font:500 11px var(--fb);color:#9fb3d9;letter-spacing:0}
.menu{display:flex;gap:26px;margin-left:auto}
.menu a{color:#d6e2ff;font-size:15px;font-weight:500;position:relative;padding:6px 0}
.menu a:after{content:'';position:absolute;left:0;right:100%;bottom:0;height:2px;background:var(--or);transition:right .25s}
.menu a:hover{color:#fff}.menu a:hover:after{right:0}
.nav-act{display:flex;gap:10px;align-items:center}
.lang{color:#d6e2ff;font:600 13px var(--fn);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:7px 12px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 22px;border-radius:12px;font:600 15px var(--fh);border:0;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}
.btn-or{background:linear-gradient(135deg,var(--or),#ff4d00);color:#fff;box-shadow:0 10px 28px rgba(255,106,19,.35)}
.btn-or:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(255,106,19,.45)}
.btn-glass{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(8px)}
.btn-glass:hover{background:rgba(255,255,255,.16)}
.btn-sm{height:40px;padding:0 16px;font-size:14px;border-radius:10px}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;background:var(--n9);color:#fff;isolation:isolate}
.hero-bg{position:absolute;inset:-4%;background:var(--ph-hero-d,url(img/fx/fut_hero_d.webp)) center/cover no-repeat;animation:kb 26s ease-in-out infinite alternate;z-index:-3}
@keyframes kb{from{transform:scale(1.08) translate(1.5%,0)}to{transform:scale(1) translate(-1.5%,-1%)}}
.hero:before{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(4,11,28,.92) 0%,rgba(4,11,28,.72) 38%,rgba(4,11,28,.15) 70%,rgba(4,11,28,.35) 100%),linear-gradient(0deg,rgba(4,11,28,.9) 0%,transparent 30%)}
#fx{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}
.hero-in{padding:120px 0 150px;max-width:760px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 13px var(--fn);letter-spacing:.14em;color:var(--cyan);text-transform:uppercase;padding:7px 14px;border:1px solid rgba(53,212,255,.35);border-radius:999px;background:rgba(53,212,255,.08)}
.eyebrow i{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 0 rgba(53,212,255,.7);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(53,212,255,0)}100%{box-shadow:0 0 0 0 rgba(53,212,255,0)}}
.hero h1{font-size:clamp(38px,5.4vw,68px);font-weight:800;margin:22px 0 18px;letter-spacing:-.01em}
.hero h1 span{display:block;font-size:.84em;text-wrap:balance;background:linear-gradient(90deg,#ffb067,var(--or) 45%,#ff3d00);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.lead{font-size:18px;color:#c7d5f2;max-width:560px;margin:0 0 30px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.hero-cta .btn{height:54px;padding:0 28px;font-size:16px;border-radius:14px}
.trust{display:flex;gap:26px;flex-wrap:wrap;margin-top:38px;color:#b7c7e6;font-size:14px}
.trust div{display:flex;align-items:center;gap:8px}
.trust .ic{width:20px;height:20px;color:var(--or2)}

/* การ์ดเส้นทางสด */
.route{position:absolute;right:max(20px,calc((100% - var(--wrap))/2));bottom:150px;width:340px;padding:18px 20px;border-radius:18px;background:rgba(8,22,49,.55);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(16px);box-shadow:0 30px 60px rgba(0,0,0,.35)}
.route-h{display:flex;justify-content:space-between;align-items:center;font:600 12px var(--fn);letter-spacing:.1em;color:#9fb3d9;text-transform:uppercase}
.route-h b{display:flex;align-items:center;gap:6px;color:#4ade80}.route-h b:before{content:'';width:7px;height:7px;border-radius:50%;background:#4ade80;animation:pulse 2s infinite}
.route-p{display:flex;justify-content:space-between;margin:14px 0 10px;font-family:var(--fh)}
.route-p div{font-size:18px;font-weight:700}.route-p small{display:block;font:500 12px var(--fb);color:#9fb3d9}
.route-p div:last-child{text-align:right}
.track{position:relative;height:4px;border-radius:4px;background:rgba(255,255,255,.12);margin:6px 0 16px}
.track:before{content:'';position:absolute;inset:0 auto 0 0;width:62%;border-radius:4px;background:linear-gradient(90deg,var(--cyan),var(--or))}
.track i{position:absolute;left:62%;top:50%;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;display:grid;place-items:center;background:var(--or);box-shadow:0 0 0 6px rgba(255,106,19,.25),0 0 24px var(--or);animation:bob 3s ease-in-out infinite}
.track i .ic{width:16px;height:16px;color:#fff}
@keyframes bob{50%{transform:translateY(-3px)}}
.route-m{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.route-m div{padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.06);font-size:12px;color:#9fb3d9}
.route-m b{display:block;color:#fff;font:700 15px var(--fh)}

.scroll{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;color:#9fb3d9;font:600 11px var(--fn);letter-spacing:.2em}
.scroll i{width:22px;height:36px;border:2px solid rgba(255,255,255,.35);border-radius:12px;position:relative}
.scroll i:after{content:'';position:absolute;left:50%;top:7px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:#fff;animation:wheel 1.6s infinite}
@keyframes wheel{to{transform:translateY(12px);opacity:0}}

/* ---------- ตัวเลข + ลูกโลก ---------- */
.stats{position:relative;color:#fff;background:var(--n9) var(--ph-globe,url(img/fx/fut_globe.webp)) right center/cover no-repeat;overflow:hidden}
.stats:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,11,28,.96) 0%,rgba(4,11,28,.8) 45%,rgba(4,11,28,.1) 100%)}
.stats .wrap{position:relative;padding:110px 0}
.kicker{font:700 13px var(--fn);letter-spacing:.16em;text-transform:uppercase;color:var(--or2)}
.stats h2{font-size:clamp(28px,3.4vw,44px);font-weight:700;margin:12px 0 14px;max-width:620px}
.stats p{color:#b7c7e6;max-width:560px;margin:0 0 54px;font-size:16px}
.nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;max-width:1000px}
.num{padding:4px 26px;border-left:1px solid rgba(255,255,255,.16)}
.num:first-child{padding-left:0;border-left:0}
.num small{display:block;color:#9fb3d9;font-size:14px;margin-bottom:6px}
.num div{display:flex;align-items:flex-start;gap:2px}.num b{display:block;font:800 clamp(30px,3.3vw,48px)/1 var(--fn);letter-spacing:-.02em;background:linear-gradient(180deg,#fff,#c9d7ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.num em{font-style:normal;color:var(--or2);font:700 26px/1 var(--fn)}
.num span{display:block;color:#7f93ba;font-size:13px;margin-top:8px}
.src{margin-top:34px;color:#6b7fa6;font-size:12px}

/* ---------- โลโก้แพลตฟอร์มเลื่อน ---------- */
.plats{background:#fff;border-bottom:1px solid var(--line);padding:34px 0;overflow:hidden}
.plats-h{text-align:center;color:var(--ink2);font-size:14px;margin-bottom:22px}
.plats-h b{color:var(--ink)}
.marq{display:flex;width:max-content;animation:marq 38s linear infinite}
.plats:hover .marq{animation-play-state:paused}
.marq div{display:flex;align-items:center;justify-content:center;width:190px;height:64px;margin:0 14px;flex:none}
.marq img{max-height:40px;max-width:150px;width:auto;height:auto;filter:grayscale(1) opacity(.62);transition:filter .25s}
.marq img.sq{max-height:48px;border-radius:11px}
.marq div:hover img{filter:none}
@keyframes marq{to{transform:translateX(-50%)}}

/* ---------- ส่วนทั่วไป ---------- */
.sec{padding:110px 0}
.sec-h{max-width:720px;margin:0 auto 54px;text-align:center}
.sec-h .kicker{color:var(--orink)}
.sec-h h2{font-size:clamp(28px,3.4vw,44px);font-weight:700;margin:12px 0 14px;color:var(--ink)}
.sec-h p{color:var(--ink2);margin:0;font-size:16px}

/* บริการ */
.svc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.svc a{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:440px;border-radius:22px;overflow:hidden;color:#fff;isolation:isolate;box-shadow:0 20px 40px rgba(15,23,42,.12)}
.svc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.svc a:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(4,11,28,0) 30%,rgba(4,11,28,.92) 100%);transition:background .3s}
.svc a:hover img{transform:scale(1.07)}
.svc a:hover:after{background:linear-gradient(180deg,rgba(4,11,28,.1) 0%,rgba(8,22,49,.96) 100%)}
.svc-b{padding:26px}
.svc-i{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:rgba(255,106,19,.92);margin-bottom:16px}
.svc-i .ic{color:#fff}
.svc h3{font-size:22px;font-weight:700;margin-bottom:8px}
.svc p{margin:0;color:#c7d5f2;font-size:14px}
.svc-f{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.16);font-size:13px;color:#9fb3d9}
.svc-f b{color:#fff;font:700 17px var(--fh)}
.svc-f .ic{width:20px;height:20px;color:var(--or2);transition:transform .25s}
.svc a:hover .svc-f .ic{transform:translateX(4px)}

/* ใบขน (พื้นเข้ม) */
.legal{background:radial-gradient(ellipse at 85% 0%,rgba(37,99,255,.28),transparent 55%),radial-gradient(ellipse at 0% 100%,rgba(255,106,19,.16),transparent 50%),var(--n8);color:#fff;position:relative;overflow:hidden}
.legal:before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(180deg,#000,transparent)}
.legal .wrap{position:relative;display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center}
.legal h2{font-size:clamp(26px,2.9vw,38px);text-wrap:balance;font-weight:700;margin:12px 0 16px}
.legal h2 span{color:var(--or2)}
.legal p{color:#b7c7e6;margin:0 0 26px}
.chk{list-style:none;padding:0;margin:0 0 32px;display:grid;gap:12px}
.chk li{display:flex;gap:12px;align-items:flex-start;color:#dbe5fb}
.chk .ic{width:22px;height:22px;color:#4ade80;margin-top:2px}
.lgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.lgrid div{padding:20px;border-radius:16px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09);transition:background .25s,border-color .25s,transform .25s}
.lgrid div:hover{background:rgba(255,255,255,.08);border-color:rgba(255,154,61,.45);transform:translateY(-3px)}
.lgrid .ic{width:28px;height:28px;color:var(--or2);margin-bottom:12px}
.lgrid b{display:block;font:600 16px var(--fh);margin-bottom:4px}
.lgrid span{font-size:13px;color:#9fb3d9}

/* ขั้นตอน */
.steps{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.steps:before{content:'';position:absolute;top:34px;left:10%;right:10%;height:2px;background:repeating-linear-gradient(90deg,#cbd5e1 0 8px,transparent 8px 16px)}
.steps:after{content:'';position:absolute;top:29px;left:10%;width:12px;height:12px;border-radius:50%;background:var(--or);box-shadow:0 0 0 6px rgba(255,106,19,.18);animation:run 6s ease-in-out infinite}
@keyframes run{0%{left:10%}100%{left:calc(90% - 12px)}}
.step{position:relative;text-align:center;padding:0 6px}
.step i{position:relative;z-index:1;display:grid;place-items:center;width:70px;height:70px;margin:0 auto 18px;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 24px rgba(15,23,42,.08);color:var(--orink)}
.step i .ic{width:30px;height:30px}
.step em{position:absolute;top:-8px;right:-8px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--n7);color:#fff;font:700 12px/1 var(--fn);font-style:normal;text-align:center}
.step b{display:block;font:600 17px var(--fh);margin-bottom:4px}
.step span{font-size:14px;color:var(--ink2)}

/* ภาพจริง */
.real{background:#fff}
.rgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:220px;gap:14px}
.rgrid figure{position:relative;margin:0;border-radius:16px;overflow:hidden}
.rgrid figure.big{grid-column:span 2;grid-row:span 2}
.rgrid figure.wide{grid-column:span 2}
.rgrid img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.rgrid figure:hover img{transform:scale(1.05)}
.rgrid figcaption{position:absolute;left:0;right:0;bottom:0;padding:30px 14px 12px;background:linear-gradient(transparent,rgba(4,11,28,.85));color:#fff;font:500 13px var(--fb)}

/* FAQ */
.faq{max-width:860px;margin:0 auto;display:grid;gap:12px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:0 22px;transition:box-shadow .2s}
.faq details[open]{box-shadow:0 14px 30px rgba(15,23,42,.07)}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;font:600 16px var(--fh);cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ic{width:20px;height:20px;color:var(--orink);transition:transform .2s}
.faq details[open] summary .ic{transform:rotate(45deg)}
.faq details p{margin:0 0 20px;color:var(--ink2)}

/* CTA */
.cta{position:relative;overflow:hidden;color:#fff;background:linear-gradient(120deg,#ff4d00,var(--or) 45%,#ff8f3a)}
.cta:before{content:'';position:absolute;right:-120px;top:-160px;width:520px;height:520px;border-radius:50%;border:1px solid rgba(255,255,255,.25);box-shadow:0 0 0 70px rgba(255,255,255,.05),0 0 0 140px rgba(255,255,255,.04)}
.cta .wrap{position:relative;display:flex;justify-content:space-between;align-items:center;gap:30px;padding:76px 0}
.cta h2{font-size:clamp(26px,3vw,40px);font-weight:700}
.cta p{margin:10px 0 0;color:#fff3e8;font-size:16px}
.cta-b{display:flex;gap:12px;align-items:center}.cta .btn-w{background:#fff;color:var(--orink);height:56px;padding:0 30px;font-size:16px;border-radius:14px;box-shadow:0 14px 30px rgba(120,30,0,.25)}
.cta .btn-glass{height:56px;padding:0 26px;font-size:16px;border-radius:14px}

.lx-foot{background:var(--n9);color:#9fb3d9;padding:64px 0 30px;font-size:14px}
.fgrid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:40px}
.lx-foot h4{color:#fff;font:600 15px var(--fh);margin:0 0 14px}
.lx-foot a{display:block;padding:4px 0}.lx-foot a:hover{color:#fff}
.fbot{margin-top:46px;padding-top:22px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px}

/* เผยตอนเลื่อน */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.js .rv.on{opacity:1;transform:none}
.js .rv.d1{transition-delay:.08s}.js .rv.d2{transition-delay:.16s}.js .rv.d3{transition-delay:.24s}

@media (max-width:1024px){
  .menu{display:none}
  .route{display:none}
  .svc{grid-template-columns:repeat(2,minmax(0,1fr))}
  .legal .wrap{grid-template-columns:1fr;gap:40px}
  .nums{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:34px}
  .num:nth-child(3){padding-left:0;border-left:0}
  .fgrid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .wrap{width:calc(100% - 32px)}
  .nav-in{height:62px;gap:12px}.logo{font-size:16px}.logo small{display:none}.lang{display:none}
  .hero-bg{background-image:var(--ph-hero-m,url(img/fx/fut_hero_m.webp))}
  .hero:before{background:linear-gradient(180deg,rgba(4,11,28,.9) 0%,rgba(4,11,28,.7) 48%,rgba(4,11,28,.2) 75%,rgba(4,11,28,.85) 100%)}
  .hero-in{padding:104px 0 120px}
  .hero p.lead{font-size:16px}
  .hero-cta .btn{flex:1;min-width:0;padding:0 14px}
  .trust{gap:12px 18px;margin-top:28px;font-size:13px}
  .stats{background-position:70% center}
  .stats:before{background:linear-gradient(180deg,rgba(4,11,28,.94),rgba(4,11,28,.78))}
  .stats .wrap{padding:76px 0}
  .sec{padding:76px 0}.sec-h{margin-bottom:36px}
  .svc{grid-template-columns:1fr}.svc a{min-height:340px}
  .lgrid{grid-template-columns:1fr 1fr;gap:10px}.lgrid div{padding:16px}
  .steps{grid-template-columns:1fr;gap:22px}
  .steps:before{top:10%;bottom:10%;left:34px;right:auto;width:2px;height:auto;background:repeating-linear-gradient(180deg,#cbd5e1 0 8px,transparent 8px 16px)}
  .steps:after{display:none}
  .step{display:grid;grid-template-columns:70px 1fr;column-gap:18px;text-align:left;align-items:center}
  .step i{margin:0;grid-row:span 2}
  .rgrid{grid-template-columns:1fr 1fr;grid-auto-rows:150px;gap:10px}
  .cta .wrap{flex-direction:column;align-items:flex-start;padding:56px 0}
  .cta-b{display:flex;gap:10px;width:100%}.cta-b .btn{flex:1}
  .fgrid{grid-template-columns:1fr 1fr;gap:28px}.fgrid>div:first-child{grid-column:span 2}
}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.js .rv{opacity:1;transform:none}}

/* เมนูภาษา */
.lgm{position:relative}
.lgm summary{list-style:none;display:flex;align-items:center;gap:6px;cursor:pointer;color:#d6e2ff;font:600 13px var(--fn);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:7px 12px}
.lgm summary::-webkit-details-marker{display:none}
.lgm summary .ic{width:16px;height:16px}
.lgm[open] summary{background:rgba(255,255,255,.1)}
.lgm div{position:absolute;right:0;top:calc(100% + 8px);min-width:170px;padding:6px;border-radius:14px;background:#0b1a38;border:1px solid rgba(255,255,255,.12);box-shadow:0 20px 40px rgba(0,0,0,.4);display:grid}
.lgm a{padding:9px 12px;border-radius:9px;color:#d6e2ff;font-size:14px}
.lgm a:hover{background:rgba(255,255,255,.08);color:#fff}
.lgm a.is-on{color:var(--or2);font-weight:600}

/* คำถามที่พบบ่อย (โครง .sp-acc ให้ตัว build ดึงเป็น FAQPage ได้) */
.faq summary span{flex:1}
.faq details>div{margin:0 0 20px;color:var(--ink2)}
.faq-note{max-width:860px;margin:18px auto 0;color:#8a96aa;font-size:12.5px;text-align:center}

/* ติดต่อท้ายหน้า */
.fct{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.fct a{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#d6e2ff}
.fct a:hover{background:rgba(255,255,255,.12);color:#fff}
.fct .ic{width:18px;height:18px;color:var(--or2)}
.fbot a{display:inline;padding:0}
.fbot nav{display:flex;gap:14px;flex-wrap:wrap}
/* มือถือ: เข้าสู่ระบบ+สมัคร ต้องเห็นทั้งคู่ (เดิมซ่อนเข้าสู่ระบบ ลูกค้าหาไม่เจอ 31 ต.ค.)  ย่อโลโก้เป็นสองบรรทัดให้พอที่ */
@media (max-width:640px){.lgm summary{padding:6px 10px}.nav-in{gap:8px}.nav-act{gap:6px;flex:none}.nav-act .btn-sm{height:36px;padding:0 10px;font-size:13px;border-radius:9px}.logo{gap:8px;min-width:0;overflow:hidden;font-size:14px;line-height:1.1}.logo img{width:36px;height:36px}.logo b{display:block}}
@media (max-width:360px){.logo span{display:none}}

/* ภาษาที่ข้อความยาว (พม่า ฮินดี ลาว): ปุ่มขึ้นบรรทัดใหม่ได้ ไม่ตัดหาย · หัวข้อแบ่งบรรทัดสมดุล */
.sec-h h2,.stats h2,.cta h2{text-wrap:balance}
@media (max-width:640px){.hero-cta,.cta-b{flex-direction:column;align-items:stretch}.hero-cta .btn,.cta-b .btn,.legal .btn{white-space:normal;height:auto;min-height:52px;padding:12px 18px;line-height:1.35;text-align:center}.hero h1{font-size:clamp(30px,9vw,40px)}}

