/*
 * Thai site (docs/handoff-th/DESIGN_HANDOFF_TH.md, Figma qHZQTrt3pwfrAKhimZwuEt).
 * Loaded after the other stylesheets on pages whose language is Thai (<html lang="th">).
 * Thai rules: IBM Plex Sans Thai, no negative tracking, no uppercase eyebrows, line heights of 1.35 or more on headings.
 */

/* IBM Plex Sans Thai 400–700, SIL Open Font License 1.1 (assets/fonts/OFL-ibm-plex-sans-thai.txt). */
@font-face { font-family: "IBM Plex Sans Thai"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/ibm-plex-sans-thai-thai-400.woff2") format("woff2"); unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC; }
@font-face { font-family: "IBM Plex Sans Thai"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/ibm-plex-sans-thai-thai-500.woff2") format("woff2"); unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC; }
@font-face { font-family: "IBM Plex Sans Thai"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/ibm-plex-sans-thai-thai-600.woff2") format("woff2"); unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC; }
@font-face { font-family: "IBM Plex Sans Thai"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/ibm-plex-sans-thai-thai-700.woff2") format("woff2"); unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC; }
@font-face { font-family: "IBM Plex Sans Thai"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/ibm-plex-sans-thai-latin-400.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Sans Thai"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/ibm-plex-sans-thai-latin-500.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Sans Thai"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/ibm-plex-sans-thai-latin-600.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Sans Thai"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/ibm-plex-sans-thai-latin-700.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* ---------- Tokens ---------- */
html:lang(th) {
	--font-sans: "IBM Plex Sans Thai", "Noto Sans Thai", system-ui, sans-serif;
	--font-display-latin: "Inter", var(--font-sans);
	--color-warning-text: #B54708;
	--color-warning-bg: #FFF6E5;
	--gradient-card-visual: linear-gradient(135deg, #F1F7FE 0%, #D1E6FC 100%);
	--section-y: 88px;
}

/* ---------- Thai typography ---------- */
html:lang(th) body { line-height: 1.7; }
html:lang(th) * { letter-spacing: 0; }
/* Component rules with higher specificity (eyebrows, labels, headings) also lose their Latin tracking. */
html:lang(th) body :is(.eyebrow-label, .eyebrow-pill, .mini-label, .type-tag, .footer-col .footer-title, .sec-head .eyebrow-label, .home-hero .eyebrow-pill, .service-hero .eyebrow-pill, .service-section .eyebrow-label, .contact-panel .eyebrow-label, .ext-pair .eyebrow-label, .ext-problems .eyebrow-label, .spotlight-copy .eyebrow-label, .service-group-intro .eyebrow-label, .about-intro-statement .eyebrow-label, .sec-head--on-dark .eyebrow-label) { letter-spacing: 0; }
html:lang(th) :is(h1, h2, h3, h4, h5, h6) { font-weight: 700; line-height: 1.4; text-wrap: balance; }
html:lang(th) :is(.eyebrow-label, .eyebrow-pill, .mini-label, .footer-col .footer-title, .type-tag) { text-transform: none; }
html:lang(th) .eyebrow-label { font-size: 13px; }
html:lang(th) .section-title { line-height: 1.4; }

/* ---------- Header (Figma 16:3) ---------- */
html:lang(th) .utility-bar { line-height: 20px; }
html:lang(th) .header-inner { padding-block: 16px; }
html:lang(th) .nav-list { gap: 36px; }
html:lang(th) .nav-item > a { font-weight: 600; line-height: 22px; }
html:lang(th) .button { padding-block: 12px; line-height: 22px; }

/* ---------- Page hero (Figma 16:158) ---------- */
html:lang(th) .page-hero { padding: 64px 0 72px; }
html:lang(th) .page-hero-inner { gap: 16px; }
html:lang(th) .page-hero h1 { font-size: 50px; font-weight: 700; line-height: 68px; }
html:lang(th) .page-hero-subtitle { max-width: 760px; font-size: 18px; line-height: 31px; }

/* ---------- Footer (Figma 16:35) ---------- */
html:lang(th) .footer-brand p { max-width: 260px; line-height: 25px; }
html:lang(th) .footer-col .footer-title { color: rgba(255, 255, 255, .55); font-size: 13px; line-height: 20px; }
html:lang(th) .footer-contact { flex: 1 1 0; }
html:lang(th) .footer-col ul { gap: 12px; line-height: 23px; }

/* ---------- Home (Figma 2:2) ---------- */
html:lang(th) .home-hero { padding: 80px 0 96px; }
html:lang(th) .home-hero-copy { gap: 26px; }
html:lang(th) .home-hero .eyebrow-pill { font-size: 13px; line-height: 20px; }
html:lang(th) .home-hero-title { font-size: 54px; font-weight: 700; line-height: 74px; }
html:lang(th) .home-hero-lead { max-width: 560px; line-height: 31px; }
html:lang(th) .check-list--inline li { font-size: 14px; line-height: 22px; }
html:lang(th) .section-title { font-size: 38px; line-height: 54px; }
html:lang(th) .sec-head-aside { line-height: 29px; }
html:lang(th) .proof-item h3 { line-height: 1.5; }
html:lang(th) .contact-panel h2 { font-size: 38px; line-height: 54px; }

/* ---------- Services page (Figma 16:162) ---------- */
html:lang(th) .service-group-intro h2 { font-size: 24px; line-height: 36px; text-wrap: wrap; }

/* ---------- Service detail, SEO, GEO (Figma 17:153, 18:199, 18:624) ---------- */
html:lang(th) .service-hero { padding: 60px 0 76px; }
html:lang(th) .service-hero h1 { font-size: 52px; font-weight: 700; line-height: 70px; }
html:lang(th) .service-detail--extended .service-hero h1 { font-size: 50px; line-height: 68px; }
html:lang(th) .service-hero-lead { line-height: 31px; }
html:lang(th) .content-title, html:lang(th) .service-detail--extended .content-title { font-size: 30px; line-height: 44px; }
html:lang(th) .ext-problems { padding: 60px 0; }
html:lang(th) .ext-problems .eyebrow-label { margin-bottom: 24px; }
html:lang(th) .ext-problem .ext-problem-title { line-height: 1.5; }
html:lang(th) .faq-item summary { line-height: 1.5; }

/* ---------- Legal template (Figma 21:484) ---------- */
html:lang(th) .legal-body { padding: 60px 0 96px; }
html:lang(th) .legal-layout { gap: 64px; }
html:lang(th) .legal-toc .mini-label { font-size: 12px; line-height: 18px; }
html:lang(th) .legal-toc a { gap: 4px; padding: 7px 0 7px 14px; line-height: 22px; }
html:lang(th) .legal-toc .legal-toc-num { font-size: inherit; font-weight: inherit; }
html:lang(th) .legal-main { gap: 28px; }
html:lang(th) .legal-prose { font-size: 17px; line-height: 31px; }
html:lang(th) .legal-prose > * { margin-bottom: 12px; }
html:lang(th) .legal-prose h2 { margin: 28px 0 12px; font-size: 24px; line-height: 36px; }
html:lang(th) .legal-prose > h2:first-child { margin-top: 0; }
html:lang(th) .legal-prose h2::before { margin-right: 6px; color: inherit; }
html:lang(th) .legal-prose ul { padding-left: 26px; }

/* ---------- 404 (Figma 21:644) ---------- */
html:lang(th) .not-found { padding: 120px 0; }
html:lang(th) .not-found-code { background: linear-gradient(90deg, #087FF5 0%, #0B3B73 100%); -webkit-background-clip: text; background-clip: text; font-family: var(--font-display-latin); line-height: 170px; }
html:lang(th) .not-found h1 { font-size: 40px; line-height: 56px; }
html:lang(th) .not-found-text { line-height: 30px; }
html:lang(th) .not-found .search-box { width: 520px; }
html:lang(th) .search-box input { font-size: 15px; }
html:lang(th) .search-box .button-arrow { display: none; }

/* ---------- Search results (Figma 21:826) ---------- */
html:lang(th) .search-body--th { padding: 44px 0 104px; }
html:lang(th) .search-body--th .search-layout { grid-template-columns: minmax(0, 1fr); }
html:lang(th) .search-body--th .search-results { display: flex; flex-direction: column; gap: 28px; }
html:lang(th) .search-body--th .search-box { width: 760px; }
html:lang(th) .search-body--th .search-box input { font-size: 16px; font-weight: 500; }
html:lang(th) .search-body--th .search-tabs { padding-top: 0; }
html:lang(th) .search-body--th .search-tabs a { padding-bottom: 12px; line-height: 22px; }
html:lang(th) .search-body--th .search-tabs a.is-active { font-weight: 600; }
html:lang(th) .search-body--th .search-count { padding: 3px 10px; background: #F4F6F9; font-weight: 600; line-height: 18px; }
html:lang(th) .search-body--th .search-tabs a.is-active .search-count { background: var(--color-soft-blue); color: var(--color-brand-blue); }
html:lang(th) .search-body--th .search-list { max-width: 860px; margin: 0; }
html:lang(th) .search-body--th .search-item { padding: 22px 0; }
html:lang(th) .search-body--th .search-item-meta .type-tag { padding: 3px 10px; font-size: 12px; font-weight: 600; line-height: 18px; }
html:lang(th) .search-body--th .type-tag--article { background: var(--color-soft-blue); color: var(--color-brand-blue); }
html:lang(th) .search-body--th .type-tag--service { background: var(--color-brand-navy); color: var(--color-white); }
html:lang(th) .search-body--th .search-item h2 { font-size: 21px; line-height: 32px; }
html:lang(th) .search-body--th .search-item mark { color: inherit; }
html:lang(th) .search-body--th .search-item-text { line-height: 25px; }
html:lang(th) .search-body--th .search-results .pager { padding-top: 8px; }
html:lang(th) .search-body--th .search-empty { max-width: 860px; }

@media (max-width: 767px) {
	html:lang(th) .service-hero h1, html:lang(th) .service-detail--extended .service-hero h1 { font-size: 34px; line-height: 48px; }
	html:lang(th) .content-title, html:lang(th) .service-detail--extended .content-title { font-size: 26px; line-height: 38px; }
	html:lang(th) .home-hero-title { font-size: 36px; line-height: 52px; }
	html:lang(th) .page-hero h1 { font-size: 34px; line-height: 48px; }
	html:lang(th) .page-hero-subtitle { font-size: 17px; line-height: 29px; }
	html:lang(th) .section-title { font-size: 28px; }
	html:lang(th) .not-found { padding: 64px 0 40px; }
	html:lang(th) .not-found-code { line-height: 110px; }
	html:lang(th) .not-found h1 { font-size: 30px; line-height: 44px; }
	html:lang(th) .search-body--th { padding: 32px 0 72px; }
	html:lang(th) .search-body--th .search-results { gap: 20px; }
	html:lang(th) .search-body--th .search-item h2 { font-size: 19px; line-height: 29px; }
}