/* =========================================================
   V67 Heading Weight Fix
   Purpose:
   - Normalize and soften h1, h2, h3 visual weight across the main website.
   - Avoid unsupported 950 weights that can render inconsistently.
   - Keep brand typography: Red Hat Display for EN, Prompt for TH.
   ========================================================= */

:root {
  --ctl-heading-weight: 800;
  --ctl-heading-letter-spacing: -0.05em;
}

html[lang="th"] {
  --ctl-heading-weight: 600;
  --ctl-heading-letter-spacing: -0.012em;
}

/* Base heading normalization */
body h1,
body h2,
body h3,
body .hero-title,
body .section-heading h2,
body .service-card h3,
body .package-plan-card h3,
body .package-card h4,
body .rehab-copy h2,
body .international-copy h2,
body .library-section h2,
body .faq-section h2,
body .contact-shell h2,
body .contact-panel h3,
body .doctor-page-main h1,
body .doctor-page-main h2,
body .doctor-page-main h3,
body .services-main h1,
body .services-main h2,
body .services-main h3,
body .services-main h4,
body .package-detail-main h1,
body .package-detail-main h2,
body .package-detail-main h3,
body .international-page-main h1,
body .international-page-main h2,
body .international-page-main h3 {
  font-family: var(--ctl-font-en, "Red Hat Display", "Prompt", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif) !important;
  font-weight: var(--ctl-heading-weight) !important;
  letter-spacing: var(--ctl-heading-letter-spacing);
  font-synthesis-weight: none;
}

/* Thai pages should use Prompt and equal weight across all h1-h3. */
html[lang="th"] body h1,
html[lang="th"] body h2,
html[lang="th"] body h3,
html[lang="th"] body .hero-title,
html[lang="th"] body .section-heading h2,
html[lang="th"] body .service-card h3,
html[lang="th"] body .package-plan-card h3,
html[lang="th"] body .package-card h4,
html[lang="th"] body .rehab-copy h2,
html[lang="th"] body .international-copy h2,
html[lang="th"] body .library-section h2,
html[lang="th"] body .faq-section h2,
html[lang="th"] body .contact-shell h2,
html[lang="th"] body .contact-panel h3,
html[lang="th"] body .doctor-page-main h1,
html[lang="th"] body .doctor-page-main h2,
html[lang="th"] body .doctor-page-main h3,
html[lang="th"] body .services-main h1,
html[lang="th"] body .services-main h2,
html[lang="th"] body .services-main h3,
html[lang="th"] body .services-main h4,
html[lang="th"] body .package-detail-main h1,
html[lang="th"] body .package-detail-main h2,
html[lang="th"] body .package-detail-main h3,
html[lang="th"] body .international-page-main h1,
html[lang="th"] body .international-page-main h2,
html[lang="th"] body .international-page-main h3 {
  font-family: var(--ctl-font-th, "Prompt", "Red Hat Display", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif) !important;
  font-weight: var(--ctl-heading-weight) !important;
}

/* Remove overly-heavy unsupported custom weights from common large titles. */
body .hero-title,
body .section-heading h2,
body .services-hero-copy h1,
body .intl-hero-copy h1,
body .doctor-page-hero h1,
body .doctor-profile-intro h1,
body .package-detail-hero h1 {
  font-weight: var(--ctl-heading-weight) !important;
}

/* Keep small labels and nav visually separate from headings. */
body .eyebrow,
body .nav a,
body .btn,
body .language-switcher,
body .package-plan-kicker,
body .blog-tag,
body .contact-pill {
  font-weight: 850;
}

/* Browser support fallback for Safari/older Chrome if font-synthesis-weight is ignored. */
@supports not (font-synthesis-weight: none) {
  body h1,
  body h2,
  body h3 {
    font-weight: var(--ctl-heading-weight) !important;
  }
}


/* =========================================================
   V69 Thai Heading Size + Weight Refinement
   Thai headings looked visually too heavy/large with Prompt.
   This pass makes Thai headings lighter and reduces oversized hero titles.
   ========================================================= */

html[lang="th"] body h1,
html[lang="th"] body h2,
html[lang="th"] body h3 {
  font-weight: 600 !important;
  letter-spacing: -0.012em !important;
}

/* Main hero Thai title: reduce size and improve line-height. */
html[lang="th"] body .hero-title,
html[lang="th"] body .hero-copy h1,
html[lang="th"] body .hero h1 {
  font-size: clamp(42px, 5.2vw, 76px) !important;
  line-height: 1.13 !important;
  font-weight: 600 !important;
  letter-spacing: -0.014em !important;
}

/* Section headings on Thai pages should feel softer, not poster-bold. */
html[lang="th"] body .section-heading h2,
html[lang="th"] body .services-hero-copy h1,
html[lang="th"] body .intl-hero-copy h1,
html[lang="th"] body .doctor-page-hero h1,
html[lang="th"] body .doctor-profile-intro h1,
html[lang="th"] body .package-detail-hero h1 {
  font-size: clamp(34px, 4.2vw, 58px) !important;
  line-height: 1.18 !important;
  font-weight: 600 !important;
  letter-spacing: -0.012em !important;
}

/* Card titles and h3 titles in Thai: keep readable, not too thick. */
html[lang="th"] body .service-card h3,
html[lang="th"] body .package-plan-card h3,
html[lang="th"] body .package-card h4,
html[lang="th"] body .contact-panel h3,
html[lang="th"] body .faq-item summary,
html[lang="th"] body .rehab-card h3,
html[lang="th"] body .article-card h3 {
  font-weight: 600 !important;
  letter-spacing: -0.006em !important;
}

/* Thai navigation/button text was also visually heavy in Prompt. */
html[lang="th"] body .nav a,
html[lang="th"] body .btn,
html[lang="th"] body .language-switcher,
html[lang="th"] body .eyebrow,
html[lang="th"] body .contact-pill,
html[lang="th"] body .package-plan-kicker {
  font-weight: 700 !important;
  letter-spacing: -0.004em !important;
}

/* Mobile/tablet Thai hero should not dominate the whole first screen. */
@media (max-width: 980px) {
  html[lang="th"] body .hero-title,
  html[lang="th"] body .hero-copy h1,
  html[lang="th"] body .hero h1 {
    font-size: clamp(38px, 8vw, 60px) !important;
    line-height: 1.15 !important;
  }
}

@media (max-width: 560px) {
  html[lang="th"] body .hero-title,
  html[lang="th"] body .hero-copy h1,
  html[lang="th"] body .hero h1 {
    font-size: clamp(34px, 10vw, 48px) !important;
    line-height: 1.18 !important;
  }
}
