/* ค่าเริ่มต้นของ body */
html,body{height:100%}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:Inter,system-ui,Segoe UI,Arial,sans-serif;
}
.container{max-width:1240px; margin:0 auto; padding:0 20px}

body {
  color: #111;
  line-height: 1.6;
}

/* ภาษาไทย → ใช้ Chakra Petch */
:lang(th) {
  font-family: 'Chakra Petch', 'Inter', sans-serif;
}

/* ภาษาอังกฤษ → Inter เป็นค่า default */
:lang(en) {
  font-family: 'Inter', sans-serif;
}

h1:lang(th), h2:lang(th), h3:lang(th),
.hero-title:lang(th) {
  font-family: 'Chakra Petch', sans-serif;
  font-weight: 600;
}

/* =========================================
   Font Management (Thai & English)
   ========================================= */

/* 🇹🇭 หน้าภาษาไทย: ใช้ Chakra Petch */
.lang-th body, 
.lang-th button, 
.lang-th input, 
.lang-th select, 
.lang-th textarea {
  font-family: 'Chakra Petch', sans-serif;
}

/* เน้นหัวข้อภาษาไทยให้ดูคมชัดเหมือนในรูป */
.lang-th h1, .lang-th h2, .lang-th h3, .lang-th .menu a, .lang-th .btn-ghost {
  font-family: 'Chakra Petch', sans-serif;
  font-weight: 500; /* หรือ 600 ถ้าต้องการความหนาแบบในรูป */
  letter-spacing: 0.02em;
}

/* 🇬🇧 หน้าภาษาอังกฤษ: ใช้ Inter */
.lang-en body, 
.lang-en button, 
.lang-en input, 
.lang-en select, 
.lang-en textarea {
  font-family: 'Inter', sans-serif;
}

/* ปรับหัวข้อภาษาอังกฤษให้ดู Clean แบบ Modern */
.lang-en h1, .lang-en h2, .lang-en h3, .lang-en .menu a, .lang-en .btn-ghost {
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  letter-spacing: -0.01em; /* Inter มักจะสวยเมื่อบีบตัวอักษรเข้านิดนึง */
}

/* ===== Reveal on scroll (ไฟล์กลาง ใช้ได้ทุกหน้า) ===== */
@media (prefers-reduced-motion: no-preference) {
  .reveal {
    opacity: 0;
    transform: translate3d(0, 24px, 0);
    transition:
      opacity .8s ease,
      transform .8s cubic-bezier(.2,.65,.2,1);
    will-change: opacity, transform;
  }
  .reveal.is-visible {
    opacity: 1;
    transform: none;
  }

  /* ทิศทางอื่น ๆ เลือกใช้ได้ตามต้องการ */
  .reveal-up   { transform: translate3d(0, 24px, 0); }
  .reveal-down { transform: translate3d(0,-24px, 0); }
  .reveal-left { transform: translate3d(24px, 0, 0); }
  .reveal-right{ transform: translate3d(-24px,0, 0); }
  .reveal-zoom { transform: scale(.96); }

  .reveal-up.is-visible,
  .reveal-down.is-visible,
  .reveal-left.is-visible,
  .reveal-right.is-visible,
  .reveal-zoom.is-visible { transform: none; }

  /* ช่วยให้ดีไซน์หรูขึ้นนิด: เงาฟุ้งตอนปรากฏ */
  .reveal.luxe { filter: drop-shadow(0 8px 24px rgba(0,0,0,.08)); }
  .reveal.luxe.is-visible { filter: none; }
}

[data-lang="en"]{
display:none;
}

