/* Homepage typography system: six deliberate text levels.
   Every visible homepage text size must resolve to one of these tokens. */
.home-page {
  --home-type-display: var(--site-type-display);
  --home-type-section: var(--site-type-section);
  --home-type-title: var(--site-type-title);
  --home-type-lead: var(--site-type-lead);
  --home-type-body: var(--site-type-body);
  --home-type-meta: var(--site-type-meta);
}

/* 01 — Display: reserved for the three carousel statements. */
.home-page main .hero h1,
.home-page main .hero h2,
.home-page main .hero-slide:first-child h1,
.home-page main .hero-slide:nth-child(3) h2 {
  font-size: var(--home-type-display);
  line-height: 1.1;
  letter-spacing: -.035em;
}

.home-page main .hero-title-line { display: block; }
.home-page main .hero-title-line:first-child { color: var(--navy); }

@media (min-width: 1161px) {
  .home-page main .hero-slide .hero-copy {
    width: min(960px, 76%);
  }

  .home-page main .hero-title-two-lines {
    max-width: none;
    white-space: nowrap;
  }

  .home-page main .hero-slide .hero-copy { min-height: 390px; }

  .home-page main .hero-shell {
    align-items: flex-start;
    padding-top: 73px;
    padding-bottom: 0;
  }
}

/* 02 — Section headings: one consistent level across every homepage section. */
.home-page main .section h2,
.home-page main .group-about-heading h2,
.home-page main .journey-heading h2,
.home-page main .credentials-heading h2,
.home-page main .split-heading h2,
.home-page main .contact-section h2 {
  font-size: var(--home-type-section);
  line-height: 1.18;
  letter-spacing: -.025em;
}

/* 03 — Card and component titles. */
.home-page main .business-sector-card h3,
.home-page main .journey-milestone-card h3,
.home-page main .credential-card strong,
.home-page main .credential-modal-copy h2,
.home-page main .insight-grid h3,
.home-page main .group-brand-grid strong,
.home-page main .group-brand-grid .group-brand-featured strong,
.home-page .credential-modal-copy h2 {
  font-size: var(--home-type-title);
  line-height: 1.3;
}

/* Display numerals and text-based controls share the title level instead of
   introducing one-off 18px, 19px, 20px or 23px sizes. */
.home-page .brand-mark,
.home-page main .business-sector-number,
.home-page main .journey-milestone-year,
.home-page main .hero-arrow,
.home-page main .credential-nav,
.home-page .credential-modal-close,
.home-page .back-to-top > span {
  font-size: var(--home-type-title);
}

.home-page main .credential-document::after {
  font-size: var(--home-type-title);
}

.home-page .credential-modal-document::after {
  font-size: var(--home-type-section);
}

/* 04 — Leads and highlighted statements. */
.home-page main .hero-intro,
.home-page main .section-heading > p:last-child,
.home-page main .journey-heading .journey-intro,
.home-page main .group-about-copy .group-lead,
.home-page main .group-about-copy .group-belief {
  font-size: var(--home-type-lead);
  line-height: 1.75;
}

/* 05 — Body copy and primary actions. */
.home-page main p,
.home-page main .group-about-copy p,
.home-page main .business-sector-card > p,
.home-page main .journey-milestone-card p,
.home-page main .credentials-summary p,
.home-page main .insight-grid p,
.home-page main .contact-action p,
.home-page main .group-network-visual figcaption,
.home-page main .group-brand-grid .group-brand-featured span,
.home-page main .button,
.home-page .credential-modal-copy > p:not(.credential-modal-type):not(.credential-modal-count) {
  font-size: var(--home-type-body);
  line-height: 1.75;
}

/* One homepage action-button system, based on the compact business-card CTA. */
.home-page main :is(.hero-panel-button, .button, .credential-action) {
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 9px 18px;
  border: 1px solid var(--blue);
  border-radius: 4px;
  background: var(--blue);
  box-shadow: 0 10px 24px rgba(11, 76, 150, .18);
  color: #fff;
  font-size: var(--home-type-meta);
  font-weight: 850;
  letter-spacing: .025em;
  line-height: 1.3;
  text-decoration: none;
}

.home-page main .credential-action {
  display: inline-flex;
  width: max-content;
  margin-top: 14px;
}

.home-page main .credential-action b { display: none; }
.home-page main .credential-card:hover .credential-action {
  border-color: var(--navy);
  background: var(--navy);
  box-shadow: 0 16px 30px rgba(7, 45, 92, .25);
}

.home-page main .button:hover,
.home-page main .button:focus-visible {
  box-shadow: 0 16px 30px rgba(7, 45, 92, .25);
  transform: translateY(-4px);
}

.home-page main .button-light {
  border-color: #fff;
  background: #fff;
  color: var(--navy);
}

.home-page main .button-light:hover,
.home-page main .button-light:focus-visible {
  border-color: #eaf3fb;
  background: #eaf3fb;
  color: var(--navy);
}

/* 06 — Labels, metadata, secondary links and ordered markers. */
.home-page main .eyebrow,
.home-page main .hero-global-tagline,
.home-page main .text-link,
.home-page main .business-sector-card > small,
.home-page main .business-sector-card li,
.home-page main .journey-step,
.home-page main .credential-type,
.home-page main .credential-modal-type,
.home-page main .credential-modal-count,
.home-page main .insight-meta span,
.home-page main .insight-meta time,
.home-page main .group-network-head span,
.home-page main .group-brand-grid small,
.home-page main .network-pin b,
.home-page .credential-modal-type,
.home-page .credential-modal-count,
.home-page .credential-modal-actions button {
  font-size: var(--home-type-meta);
  line-height: 1.5;
}

/* Reduce abrupt label-to-heading jumps and keep section rhythm consistent. */
.home-page main .eyebrow { margin-bottom: 16px; }
.home-page main .hero .eyebrow { margin-bottom: 18px; }
.home-page main .section-heading,
.home-page main .split-heading,
.home-page main .journey-heading,
.home-page main .credentials-heading { margin-bottom: 32px; }
.home-page main .group-network-head { justify-content: flex-start; }
.home-page main .journey-step { font-size: var(--home-type-body); line-height: 1; }
.home-page main .pin-shenzhen { top: 46%; left: 84%; }
.home-page main .pin-hongkong { top: 55%; left: 75%; }

/* Compact homepage section rhythm without collapsing the visual hierarchy. */
.home-page main .section { padding-block: 72px; }
.home-page main .journey-section { padding-block: 56px; }
.home-page main .journey-heading { margin-bottom: 26px; }
.home-page main .group-brand-grid { margin-top: 20px; }
.home-page main .contact-section { padding-top: 32px; }
.home-page .site-footer { padding-top: 56px; }
.home-page .footer-grid { padding-bottom: 42px; }

/* Header and footer text use the three smaller levels from the same system. */
.home-page .brand-name { font-size: var(--home-type-lead); }
.home-page .brand-name small,
.home-page .nav-link,
.home-page .nav-cta,
.home-page .language-switch,
.home-page .language-switcher,
.home-page .language-switcher button,
.home-page .language-switcher > span,
.home-page .home-section-nav a,
.home-page .footer-grid h2,
.home-page .footer-brand-promise strong,
.home-page .footer-bottom,
.home-page .footer-bottom a[href="privacy.html"]::after,
.home-page .back-to-top small { font-size: var(--home-type-meta); }
.home-page .footer-brand p,
.home-page .footer-grid > div > a:not(.brand) { font-size: var(--home-type-body); }

@media (max-width: 1160px) {
  .home-page main .section { padding-block: 64px; }
  .home-page main .journey-section { padding-block: 52px; }
  .home-page main .group-brand-grid { margin-top: 18px; }
}

@media (max-width: 760px) {
  .home-page main .section-heading,
  .home-page main .split-heading,
  .home-page main .journey-heading,
  .home-page main .credentials-heading { margin-bottom: 26px; }

  .home-page main .section { padding-block: 52px; }
  .home-page main .journey-section { padding-block: 44px; }
  .home-page main .group-brand-grid { margin-top: 16px; }
  .home-page main .contact-section { padding-top: 28px; }
  .home-page .site-footer { padding-top: 48px; }
  .home-page .footer-grid { padding-bottom: 34px; }

  .home-page main .hero h1,
  .home-page main .hero h2,
  .home-page main .hero-slide:first-child h1,
  .home-page main .hero-slide:nth-child(3) h2 { line-height: 1.04; }

  .home-page main .hero .eyebrow { margin-bottom: 14px; }
  .home-page main .hero .hero-intro { line-height: 1.65; }
  .home-page main .journey-step { font-size: var(--home-type-meta); }
  .home-page main :is(.hero-panel-button, .button, .credential-action) { min-height: 40px; padding: 8px 16px; }
}
/* Use the Global Education breadcrumb typography across every secondary page. */
:where(.page-breadcrumb,.breadcrumb,.settlement-breadcrumb,.education-breadcrumb,.formation-breadcrumb,.country-formation-breadcrumb,.market-breadcrumb,.service-breadcrumb,.tc-breadcrumb){
  font-family:Inter,"Segoe UI",Arial,sans-serif!important;
  font-size:12px!important;
  font-weight:700!important;
  letter-spacing:.08em!important;
  line-height:1.65!important;
  text-transform:uppercase!important;
}
