.contact-faq, .contact-hero {
  /* ---------- Color ---------- */
  --color-forest: #404C2C;   /* primary — logo, headings, key accents */
  --color-linen:  #F4F1EA;   /* primary — main background */
  --color-mist:   #DFE4E4;   /* atmosphere sections only, never the main background */
  --color-stone:  #8C7B66;   /* secondary */
  --color-wood:   #D8B790;   /* secondary */
  --color-steel:  #3F3E41;   /* text, lines */
  --color-water:  #91B0B6;   /* accent, small areas only */
  --color-white:  #FFFFFF;

  /* Usage ratio guide: linen 35 / forest 22 / mist 12 / stone 10 / wood 9 / steel 7 / water 5 */

  --text-primary:   #2B2A26;
  --text-secondary: #6E685C;
  --border-subtle:  #E4DFD3;
  --border-default: #CFC8B8;
  --overlay-forest: rgba(64, 76, 44, 0.70); /* text-on-image band */

  /* ---------- Font families ---------- */
  --font-display-en: "Cormorant Garamond", Georgia, serif; /* EN headings, quotes, logo. Never Light. */
  --font-thai:       "Anuphan", sans-serif; /* ALL Thai text + EN body copy */

  /* ---------- Type scale (mobile → desktop) ---------- */
  --fs-h1-en: clamp(40px, 2.4rem + 2vw, 64px);   /* lh 1.05 · Cormorant 500 */
  --fs-h1-th: clamp(32px, 1.6rem + 1.4vw, 48px); /* lh 1.30 · Anuphan 500 */
  --fs-h2-en: clamp(28px, 1.5rem + 1vw, 40px);   /* lh 1.10 · Cormorant 500 */
  --fs-h2-th: clamp(24px, 1.3rem + 0.6vw, 32px); /* lh 1.35 · Anuphan 500 */
  --fs-h3-en: 26px;                               /* Cormorant 500 */
  --fs-h3-th: clamp(20px, 1.2rem + 0.2vw, 22px);  /* Anuphan 500 */
  --fs-body:  clamp(16px, 0.95rem + 0.1vw, 17px); /* lh 1.7 · Anuphan 300 */
  --fs-label: 12px;                               /* Anuphan 500 · uppercase · tracking 0.16em */

  --lh-tight: 1.05;
  --lh-heading-en: 1.1;
  --lh-heading-th: 1.35;
  --lh-body: 1.7;

  --tracking-logo: 0.08em;
  --tracking-label: 0.16em;
  --tracking-endorse: 0.22em;
}