/*
 * WExAct Component Styles
 * ───────────────────────
 * Layout primitives, typography utilities, and reusable UI components
 * used in WExAct custom page templates (e.g., Who We Work With).
 *
 * Naming:  BEM-ish, all classes prefixed .wx-
 * Depends: wexact-tokens.css (must load first)
 */

/* ═══════════════════════════════════════════════════════════════
   BASELINE RESETS — scoped to .wx-root
   Neutralise Blocksy / WordPress default heading & paragraph
   margins so WExAct's own spacing system is fully in control.
   ═══════════════════════════════════════════════════════════════ */

.wx-root h1,
.wx-root h2,
.wx-root h3,
.wx-root h4,
.wx-root h5,
.wx-root h6 {
  margin:  0 !important;
  padding: 0 !important;
}

.wx-root p {
  margin:  0 !important;
  padding: 0 !important;
}

.wx-root ul,
.wx-root ol {
  list-style: none !important;
  margin:     0 !important;
  padding:    0 !important;
}

.wx-root a {
  color:           inherit;
  text-decoration: none !important;
  border:          none !important;
}

/* ═══════════════════════════════════════════════════════════════
   LAYOUT PRIMITIVES
   ═══════════════════════════════════════════════════════════════ */

.wx-container {
  max-width: var(--wx-col-max);
  margin: 0 auto;
  padding: 0 var(--wx-gutter);
}

.wx-container--narrow {
  max-width: var(--wx-col-narrow);
}

.wx-section {
  padding: var(--wx-section-y) 0;
}

.wx-section--tinted {
  background: var(--wx-paper-1);
}

.wx-section--dark {
  background: var(--wx-ink-surface);
  color: var(--wx-paper-0);
}

.wx-section--no-top {
  padding-top: 0;
}

/* ═══════════════════════════════════════════════════════════════
   TYPOGRAPHY UTILITIES
   ═══════════════════════════════════════════════════════════════ */

/* Eyebrow — small uppercase tracking label */
.wx-eyebrow {
  font-family:     var(--wx-font-sans);
  font-weight:     600;
  font-size:       var(--wx-fs-eyebrow);
  letter-spacing:  var(--wx-ls-eyebrow);
  text-transform:  uppercase;
  color:           var(--wx-ink-2);
}

.wx-eyebrow--accent {
  color: var(--wx-accent);
}

/* Page H1 used in WExAct section pages */
.wx-page-title {
  font-family:     var(--wx-font-display);
  font-weight:     400;
  font-size:       clamp(36px, 8vw, 60px);
  line-height:     1.05;
  letter-spacing:  -0.022em;
  color:           var(--wx-ink-0);
  text-wrap:       balance;
  margin:          20px 0 0;
  max-width:       880px;
}

/* Section H2 */
.wx-section-title {
  font-family:    var(--wx-font-display);
  font-weight:    400;
  font-size:      var(--wx-fs-h2);
  line-height:    1.1;
  letter-spacing: var(--wx-ls-h);
  color:          var(--wx-ink-0);
  text-wrap:      balance;
  margin:         0;
}

.wx-section--dark .wx-section-title {
  color: var(--wx-paper-0);
}

/* Section lead / lede */
.wx-lede {
  font-family:    var(--wx-font-display);
  font-weight:    300;
  font-size:      var(--wx-fs-lead);
  line-height:    1.55;
  color:          var(--wx-ink-1);
  margin:         0;
  max-width:      620px;
}

/* Section header: eyebrow + title on left, lede on right */
.wx-section-header {
  display:       grid;
  grid-template-columns: 1fr 2fr;
  gap:           48px;
  margin-bottom: 64px;
  align-items:   start;
}

.wx-section-header__left {
  display:        flex;
  flex-direction: column;
  gap:            14px;
}

@media (max-width: 859px) {
  .wx-section-header {
    grid-template-columns: 1fr;
    gap:           16px;
    margin-bottom: 40px;
  }
  .wx-lede {
    max-width: 100%;
  }
}

/* ═══════════════════════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════════════════════ */

.wx-btn {
  display:         inline-flex;
  align-items:     center;
  gap:             10px;
  font-family:     var(--wx-font-sans);
  font-weight:     600;
  font-size:       0.875rem;
  padding:         13px 22px;
  border-radius:   var(--wx-r-2);
  cursor:          pointer;
  transition:      all var(--wx-dur-base) var(--wx-ease-out);
  text-decoration: none;
  border:          1px solid transparent;
  letter-spacing:  0.01em;
}

/* Primary — brand blue fill */
.wx-btn--primary {
  background: var(--wx-accent);
  color:      var(--wx-paper-0);
}
.wx-btn--primary:hover {
  background: var(--wx-accent-hover);
  color:      var(--wx-paper-0);
}
.wx-btn--primary:active {
  transform: scale(0.96);
}

/* Primary on dark surface — white fill */
.wx-btn--primary-light {
  background: var(--wx-paper-0);
  color:      var(--wx-ink-0);
}
.wx-btn--primary-light:hover {
  background: var(--wx-paper-1);
}

/* Ghost — text with underline */
.wx-btn--ghost {
  background:    transparent;
  color:         var(--wx-ink-0);
  padding:       13px 0;
  border-radius: 0;
  border:        none;
  border-bottom: 1px solid currentColor;
}
.wx-btn--ghost:hover {
  color: var(--wx-accent);
}

/* ═══════════════════════════════════════════════════════════════
   AUDIENCE GRID (Who We Work With page)
   ═══════════════════════════════════════════════════════════════ */

/*
 * 2-column grid with hairline borders between cells.
 * On mobile (<640px) collapses to 1-column.
 *
 * Border strategy:
 *  - Top border on the container (.wx-audience-grid) acts as header rule.
 *  - Right border on odd cells (col 1) creates the vertical divider.
 *  - Bottom border on first-row cells creates the horizontal divider.
 *  - No border on last row or last column.
 */

.wx-audience-grid {
  display:               grid;
  grid-template-columns: repeat(2, 1fr);
  border-top:            1px solid var(--wx-line);
}

.wx-audience-card {
  padding:        32px 32px 36px;
  display:        flex;
  flex-direction: column;
  gap:            14px;
  min-height:     240px;
  transition:     background var(--wx-dur-base) var(--wx-ease-out);
  text-decoration:none;
  color:          inherit;
}

.wx-audience-card:hover {
  background: var(--wx-paper-1);
}

/* Hairline right border on left-column cells */
.wx-audience-card:nth-child(odd) {
  border-right: 1px solid var(--wx-line);
}

/* Hairline bottom border on first-row cells (items 1 and 2) */
.wx-audience-card:nth-child(-n+2) {
  border-bottom: 1px solid var(--wx-line);
}

.wx-audience-card__number {
  font-family:    var(--wx-font-sans);
  font-weight:    600;
  font-size:      var(--wx-fs-eyebrow);
  letter-spacing: var(--wx-ls-eyebrow);
  text-transform: uppercase;
  color:          var(--wx-accent);
}

.wx-audience-card__title {
  margin:         0;
  font-family:    var(--wx-font-display);
  font-weight:    500;
  font-size:      clamp(22px, 3vw, 28px);
  line-height:    1.18;
  color:          var(--wx-ink-0);
  letter-spacing: -0.01em;
  text-wrap:      balance;
}

.wx-audience-card__subtitle {
  font-family: var(--wx-font-display);
  font-size:   15px;
  color:       var(--wx-ink-2);
}

.wx-audience-card__desc {
  margin:      0;
  font-family: var(--wx-font-sans);
  font-size:   var(--wx-fs-body-sm);
  line-height: var(--wx-lh-relax);
  color:       var(--wx-ink-2);
}

.wx-audience-card__cta {
  margin-top:    auto;
  align-self:    flex-start;
  font-family:   var(--wx-font-sans);
  font-size:     0.8125rem;
  font-weight:   600;
  color:         var(--wx-ink-0);
  border-bottom: 1px solid var(--wx-ink-0);
  text-decoration: none;
  padding-bottom: 1px;
  transition:
    color       var(--wx-dur-fast) var(--wx-ease-out),
    border-color var(--wx-dur-fast) var(--wx-ease-out);
}
.wx-audience-card__cta:hover {
  color:        var(--wx-accent);
  border-color: var(--wx-accent);
}

/* Mobile: collapse to 1 column */
@media (max-width: 639px) {
  .wx-audience-grid {
    grid-template-columns: 1fr;
  }
  .wx-audience-card {
    padding:    28px 0 32px;
    min-height: 0;
  }
  /* Override nth-child borders for single column */
  .wx-audience-card:nth-child(odd) {
    border-right: none;
  }
  .wx-audience-card:nth-child(-n+2) {
    border-bottom: none;
  }
  /* Re-apply bottom border between all cards except last */
  .wx-audience-card:not(:last-child) {
    border-bottom: 1px solid var(--wx-line);
  }
}

/* ═══════════════════════════════════════════════════════════════
   CTA BLOCK (dark navy bar at page bottom)
   ═══════════════════════════════════════════════════════════════ */

/* CTA block — dark navy strip between capability list and footer.
   Handoff §7: padding 48px 0 (40px mobile); grid 1fr auto; gap 32px;
   heading 36px/400/lh1.18/-.015em/#fff; button radius 2px.
   Same background as footer (#0E1924) so both zones read as one dark band. */
.wx-cta-block {
  background:    var(--wx-ink-surface);
  color:         var(--wx-paper-0);
  padding:       48px 0;   /* handoff: 48px 0 — NOT clamp */
  margin-bottom: 0;
}

.wx-cta-block__inner {
  max-width:   var(--wx-col-max);
  margin:      0 auto;
  padding:     0 var(--wx-gutter);    /* vertical pad is on .wx-cta-block */
  display:     grid;
  grid-template-columns: 1fr auto;
  gap:         32px;                  /* handoff: 32px fixed — NOT clamp */
  align-items: center;
}

.wx-cta-block__text {
  display:        flex;
  flex-direction: column;
  gap:            8px;    /* handoff: 8px eyebrow→heading gap */
}

/* CTA eyebrow — blue on dark background */
.wx-cta-block .wx-eyebrow--accent {
  color: var(--wx-brand) !important;
}

/* CTA heading — handoff: 36px/400/lh1.18/-.015em/#fff; max-width 640px */
.wx-cta-block__title {
  font-family:    var(--wx-font-display) !important;
  font-weight:    400 !important;
  font-size:      36px !important;    /* handoff: 36px fixed — NOT clamp */
  line-height:    1.18 !important;
  letter-spacing: -0.015em !important;
  color:          var(--wx-paper-0) !important;
  max-width:      640px;
  text-wrap:      balance;
  margin:         0 !important;
}

/* CTA button — handoff: radius 2px (not the default 4px from .wx-btn) */
.wx-cta-block .wx-btn {
  border-radius: var(--wx-r-1) !important;   /* 2px — square corners */
}

/* Mobile / foldable / narrow tablet: stack CTA so buttons do not squeeze titles */
@media (max-width: 859px) {
  .wx-cta-block {
    padding: 40px 0;   /* handoff: 40px mobile */
  }
  .wx-cta-block__inner {
    grid-template-columns: 1fr;
    gap:     24px;
    padding: 0 var(--wx-gutter);
  }
  .wx-cta-block__title {
    font-size: 26px !important;   /* handoff: 26px mobile — NOT 22px */
    text-wrap: pretty;             /* avoid balance splitting into tiny lines */
    width: 100%;
    max-width: 100%;
  }
  .wx-cta-block .wx-btn {
    align-self: flex-start;
  }

  body.wx-page--who .wx-cta-block--who .wx-btn,
  body.wx-page--what .wx-cta-block--what .wx-btn {
    display: inline-flex;
    width: auto;
    max-width: max-content;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    justify-self: start;
    align-self: flex-start;
  }
}

/* ═══════════════════════════════════════════════════════════════
   METHODOLOGY GRID (shared, used on Home and What pages)
   ═══════════════════════════════════════════════════════════════ */

.wx-methodology-grid {
  display:               grid;
  grid-template-columns: repeat(3, 1fr);
  border-top:            1px solid var(--wx-line);
}

.wx-methodology-card {
  padding:        32px 28px 36px;
  display:        flex;
  flex-direction: column;
  gap:            12px;
  min-height:     220px;
}

/* Vertical dividers between columns */
.wx-methodology-card:not(:nth-child(3n)) {
  border-right: 1px solid var(--wx-line);
}
/* Horizontal dividers between rows */
.wx-methodology-card:nth-child(-n+3) {
  border-bottom: 1px solid var(--wx-line);
}

.wx-methodology-card__num {
  font-family:         var(--wx-font-display);
  font-weight:         300;
  font-size:           44px;
  color:               var(--wx-ink-0);
  line-height:         1;
  letter-spacing:      -0.02em;
  font-feature-settings: "lnum","tnum";
  height:              52px;
  display:             flex;
  align-items:         flex-start;
}

.wx-methodology-card__rule {
  width:      28px;
  height:     1px;
  background: var(--wx-accent);
}

.wx-methodology-card__name {
  margin:      0;
  margin-top:  8px;
  font-family: var(--wx-font-sans);
  font-size:   18px;
  font-weight: 600;
  color:       var(--wx-ink-0);
}

.wx-methodology-card__desc {
  margin:      0;
  margin-top:  auto;
  font-family: var(--wx-font-sans);
  font-size:   14px;
  line-height: 1.55;
  color:       var(--wx-ink-2);
}

@media (max-width: 639px) {
  .wx-methodology-grid {
    grid-template-columns: 1fr;
  }
  .wx-methodology-card {
    padding:    28px 0 32px;
    min-height: 0;
  }
  .wx-methodology-card:not(:nth-child(3n)) {
    border-right: none;
  }
  .wx-methodology-card:nth-child(-n+3) {
    border-bottom: none;
  }
  .wx-methodology-card:not(:last-child) {
    border-bottom: 1px solid var(--wx-line);
  }
}

@media (min-width: 640px) and (max-width: 1023px) {
  .wx-methodology-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .wx-methodology-card:not(:nth-child(3n)) {
    border-right: none;
  }
  .wx-methodology-card:not(:nth-child(2n)) {
    border-right: 1px solid var(--wx-line);
  }
  .wx-methodology-card:nth-child(-n+3) {
    border-bottom: none;
  }
  .wx-methodology-card:nth-child(-n+4) {
    border-bottom: 1px solid var(--wx-line);
  }
}

/* ═══════════════════════════════════════════════════════════════
   ROLE CARDS (3-column, used on Home page)
   ═══════════════════════════════════════════════════════════════ */

.wx-role-grid {
  display:               grid;
  grid-template-columns: repeat(3, 1fr);
  border-top:            1px solid var(--wx-line);
}

.wx-role-card {
  padding:        36px 32px;
  display:        flex;
  flex-direction: column;
  gap:            14px;
  min-height:     280px;
}
.wx-role-card:not(:last-child) {
  border-right: 1px solid var(--wx-line);
}

.wx-role-card__title {
  margin:         0;
  font-family:    var(--wx-font-display);
  font-weight:    500;
  font-size:      clamp(20px, 2.5vw, 26px);
  line-height:    1.2;
  color:          var(--wx-ink-0);
  text-wrap:      balance;
}

.wx-role-card__body {
  margin:      0;
  font-family: var(--wx-font-sans);
  font-size:   var(--wx-fs-body-sm);
  line-height: var(--wx-lh-relax);
  color:       var(--wx-ink-2);
}

@media (max-width: 639px) {
  .wx-role-grid {
    grid-template-columns: 1fr;
  }
  .wx-role-card {
    padding:    28px 0;
    min-height: 0;
  }
  .wx-role-card:not(:last-child) {
    border-right:  none;
    border-bottom: 1px solid var(--wx-line);
  }
}

/* ═══════════════════════════════════════════════════════════════
   INSIGHT CARD
   ═══════════════════════════════════════════════════════════════ */

.wx-insight-card {
  display:        flex;
  flex-direction: column;
  gap:            12px;
  cursor:         pointer;
  text-decoration: none;
  color:          inherit;
}

.wx-insight-card__title {
  margin:         0;
  font-family:    var(--wx-font-display);
  font-weight:    500;
  font-size:      22px;
  line-height:    1.2;
  color:          var(--wx-ink-0);
  letter-spacing: -0.012em;
  text-wrap:      balance;
  transition:     color var(--wx-dur-fast) var(--wx-ease-out);
}

.wx-insight-card:hover .wx-insight-card__title {
  color: var(--wx-accent);
}

.wx-insight-card--large .wx-insight-card__title {
  font-size: 28px;
}

.wx-insight-card__lede {
  margin:      0;
  font-family: var(--wx-font-sans);
  font-size:   16px;
  line-height: var(--wx-lh-relax);
  color:       var(--wx-ink-2);
}

.wx-insight-card__meta {
  font-family:    var(--wx-font-sans);
  font-size:      12px;
  color:          var(--wx-ink-3);
  display:        flex;
  gap:            12px;
  margin-top:     4px;
  flex-wrap:      wrap;
}

/* ═══════════════════════════════════════════════════════════════
   FORM ELEMENTS (used in newsletter subscribe strip)
   ═══════════════════════════════════════════════════════════════ */

.wx-input {
  font-family:  var(--wx-font-sans);
  font-size:    14px;
  color:        var(--wx-ink-1);
  background:   var(--wx-paper-0);
  border:       1px solid var(--wx-ink-3);
  padding:      12px 14px;
  outline:      none;
  transition:   border-color var(--wx-dur-fast) var(--wx-ease-out);
}
.wx-input:focus {
  border-color: var(--wx-accent);
}

.wx-input--underline {
  background:    transparent;
  border:        none;
  border-bottom: 1px solid var(--wx-ink-3);
  padding:       8px 0;
}
.wx-input--underline:focus {
  border-bottom-color: var(--wx-accent);
}

/* ═══════════════════════════════════════════════════════════════
   SUBSCRIBE STRIP
   ═══════════════════════════════════════════════════════════════ */

.wx-subscribe-strip {
  background: var(--wx-paper-1);
  padding:    36px;
  border:     1px solid var(--wx-line);
  display:    grid;
  grid-template-columns: 1fr auto;
  gap:        24px;
  align-items: center;
}

.wx-subscribe-strip__form {
  display:     flex;
  align-items: stretch;
  gap:         0;
}

.wx-subscribe-strip__form .wx-input {
  border-right: none;
  min-width:    260px;
}

@media (max-width: 639px) {
  .wx-subscribe-strip {
    grid-template-columns: 1fr;
    padding: 24px;
  }
  .wx-subscribe-strip__form {
    flex-direction: column;
    gap:            0;
  }
  .wx-subscribe-strip__form .wx-input {
    border-right:  1px solid var(--wx-ink-3);
    border-bottom: none;
    min-width:     0;
  }
}

/* ═══════════════════════════════════════════════════════════════
   PAGE HERO LAYOUT (shared for Who, What, Network, About, etc.)
   ═══════════════════════════════════════════════════════════════ */

.wx-page-hero {
  padding-bottom: 48px;
}

.wx-page-hero--with-rule {
  padding-bottom: 48px;
  border-bottom:  1px solid var(--wx-line);
}

/* Two-col hero: eyebrow on left, title+lede on right */
.wx-page-hero--two-col {
  display:               grid;
  grid-template-columns: 1fr 1.5fr;
  gap:                   64px;
  align-items:           end;
}

@media (max-width: 639px) {
  .wx-page-hero--two-col {
    grid-template-columns: 1fr;
    gap:                   24px;
  }
}

/* ═══════════════════════════════════════════════════════════════
   WHAT WE DO — HERO
   Handoff §6A: 1fr 1.5fr grid, 64px gap, align-items:end,
   48px padding-bottom + 1px hairline. H1 = 64px/400/lh1.04/-.025em.
   Lede = 22px/300/lh1.55/ink-1, max-width 640px, margin-top 20px.
   ═══════════════════════════════════════════════════════════════ */

.wx-what-hero-section {
  /* section-y padding on top from .wx-section; no bottom padding —
     .wx-what-hero carries its own bottom padding + border */
  padding-bottom: 0;
}

.wx-what-hero {
  display:               grid;
  grid-template-columns: 1fr 1.5fr;   /* handoff: 1fr 1.5fr — NOT 1fr 2fr */
  gap:                   64px;         /* handoff: 64px fixed — NOT clamp */
  align-items:           end;          /* eyebrow baseline-aligns to lede bottom */
  padding-bottom:        48px;         /* handoff: 48px fixed — NOT clamp */
  border-bottom:         1px solid var(--wx-line);
}

/* Left column: eyebrow label, bottom-aligned */
.wx-what-hero__left {
  display:        flex;
  align-items:    flex-end;
  padding-bottom: 6px;   /* optical alignment with the lede baseline */
}

/* Right column: H1 + lede stacked */
.wx-what-hero__right {
  display:        flex;
  flex-direction: column;
  gap:            20px;   /* handoff: lede margin-top 20px from H1 */
}

/* Page H1: editorial weight-400, 64px desktop — handoff §6A + type ramp */
.wx-what-hero__title {
  font-family:    var(--wx-font-display) !important;
  font-weight:    400 !important;
  font-size:      64px !important;      /* handoff: 64px fixed desktop */
  line-height:    1.04 !important;
  letter-spacing: -0.025em !important;  /* handoff: -0.025em */
  color:          var(--wx-ink-0) !important;
  text-wrap:      balance;
  margin:         0 !important;
}

/* Lede: light weight, ink-1, 22px — handoff §6A type ramp */
.wx-what-hero__lede {
  font-family: var(--wx-font-sans) !important;
  font-weight: 300 !important;
  font-size:   22px !important;         /* handoff: 22px fixed desktop */
  line-height: 1.55 !important;
  color:       var(--wx-ink-1) !important;  /* handoff: ink-1, NOT ink-2 */
  max-width:   640px;                   /* handoff: 640px */
  margin:      0 !important;
}

/* Tablet 640–1023: same 2-col grid, slightly tighter gap */
@media (min-width: 640px) and (max-width: 1023px) {
  .wx-what-hero {
    grid-template-columns: 1fr 1.5fr;
    gap:                   40px;
  }
}

/* Mobile <640: single column — eyebrow above title+lede */
@media (max-width: 639px) {
  .wx-what-hero {
    grid-template-columns: 1fr;
    gap:                   24px;        /* handoff: 24px mobile gap */
    padding-bottom:        48px;        /* handoff: keep 48px mobile */
    align-items:           start;
  }
  .wx-what-hero__left {
    align-items:    flex-start;
    padding-bottom: 0;
  }
  .wx-what-hero__right {
    gap: 16px;
  }
  .wx-what-hero__title {
    font-size: clamp(36px, 8vw, 56px) !important;  /* handoff: clamp(36–56) mobile */
  }
  /* ZH capability labels can be long — lower minimum for denser glyphs */
  body.lang-zh .wx-what-hero__title {
    font-size: clamp(28px, 8vw, 48px) !important;
  }
  .wx-what-hero__lede {
    font-size: 17px !important;    /* handoff: 17px mobile */
    max-width: 100%;
  }
}

/* ═══════════════════════════════════════════════════════════════
   WHAT WE DO — CAPABILITY LIST
   Handoff §6B: 3-column grid 120px · 1fr · 2fr
     col 1 (120px): large ordinal numeral, 80px/300/lh1/ink-0, no opacity
     col 2 (1fr):   capability title H3, 32px/500/lh1.15/ink-0
     col 3 (2fr):   lede 20px/300/lh1.55/ink-1 + bullets 15px/400/ink-2
   Row padding: 56px 0 (fixed). Hairlines between rows. Hover: paper-1.
   Hover stays inside the row — no edge-bleed (prototype constraint).
   ═══════════════════════════════════════════════════════════════ */

/* The list container — spacing is handled by article padding */
.wx-cap-list {
  /* intentionally empty */
}

/* ── Row grid ─────────────────────────────────────────────────── */

.wx-cap-article {
  display:               grid;
  grid-template-columns: 120px 1fr 2fr;   /* handoff: 120px 1fr 2fr */
  column-gap:            48px;              /* handoff: 48px fixed */
  row-gap:               0;
  padding:               56px 0;           /* handoff: 56px 0 fixed */
  align-items:           start;
  transition:            background var(--wx-dur-base) var(--wx-ease-out);
  /* NO negative margin: hover stays inside the row (handoff constraint) */
}

/* Hover: paper-1 wash contained within the row */
.wx-cap-article:hover {
  background: var(--wx-paper-1);
}

/* Hairline between rows (not after the last row) */
.wx-cap-article--divider {
  border-bottom: 1px solid var(--wx-line);
}

/* ── Column 1: ordinal numeral ────────────────────────────────── */

.wx-cap-article__number {
  font-family:           var(--wx-font-display) !important;
  font-weight:           300 !important;      /* handoff: 300 light */
  font-size:             80px !important;     /* handoff: 80px fixed desktop */
  line-height:           1 !important;
  letter-spacing:        -0.03em !important;  /* handoff: -0.03em */
  color:                 var(--wx-ink-0) !important;
  font-feature-settings: "lnum", "tnum";
  white-space:           nowrap;
  word-break:            normal;
  overflow-wrap:         normal;
  writing-mode:          horizontal-tb;
  text-orientation:      mixed;
  user-select:           none;
  /* NO opacity: handoff uses full ink-0, no fade */
}

/* ── Column 2: capability title ──────────────────────────────── */

.wx-cap-article__title {
  font-family:    var(--wx-font-display) !important;
  font-weight:    500 !important;
  font-size:      32px !important;         /* handoff: 32px fixed desktop */
  line-height:    1.15 !important;
  letter-spacing: -0.012em !important;
  color:          var(--wx-ink-0) !important;
  text-wrap:      balance;
  margin:         0 !important;
}

/* Title link — inherits ink-0 from the title; stays dark on hover.
   Only the dash bullet marker uses brand blue. Title must NOT turn blue on row hover. */
.wx-cap-article .wx-cap-article__link {
  color:           inherit !important;
  text-decoration: none !important;
  border:          none !important;
  transition:      color var(--wx-dur-fast) var(--wx-ease-out);
}
.wx-cap-article:hover .wx-cap-article__title,
.wx-cap-article:hover .wx-cap-article__link {
  color: var(--wx-ink-0) !important;   /* stays dark — only bg tint changes on hover */
}

/* ── Column 3: description block ─────────────────────────────── */

.wx-cap-article__body {
  display:        flex;
  flex-direction: column;
  gap:            14px;   /* handoff: 14px body gap */
}

/* One-sentence lede — handoff: 20px / 300 / lh1.55 / ink-1 */
.wx-cap-article__lede {
  font-family: var(--wx-font-sans) !important;
  font-weight: 300 !important;     /* handoff: 300 (light), NOT 400 */
  font-size:   20px !important;    /* handoff: 20px fixed desktop */
  line-height: 1.55 !important;
  color:       var(--wx-ink-1) !important;
  margin:      0 !important;
}

/* Short bullet list — 3 deliverable highlights */
.wx-cap-article .wx-cap-article__points {
  list-style: none !important;
  margin:     0 !important;
  padding:    0 !important;
  display:    flex;
  flex-direction: column;
  gap:        10px;    /* handoff: 10px between bullets */
}

/* Bullet item — handoff: 15px / 400 / ink-2; padding-left 18px */
.wx-cap-article .wx-cap-article__point {
  position:     relative;
  padding-left: 18px !important;    /* handoff: 18px */
  font-family:  var(--wx-font-sans) !important;
  font-size:    15px !important;    /* handoff: 15px fixed */
  line-height:  1.6;
  color:        var(--wx-ink-2) !important;   /* handoff: ink-2 — NOT ink-3 */
  list-style:   none !important;
}

/* Accent dash: 8px × 1px blue horizontal rule — handoff: left 0, top 0.65em */
.wx-cap-article__dash {
  position:   absolute !important;
  left:       0 !important;
  top:        0.65em !important;   /* handoff: 0.65em */
  width:      8px !important;
  height:     1px !important;
  background: var(--wx-brand) !important;   /* brand blue */
  display:    block !important;
}

/* ── Tablet (640–1023px): 3-col with narrower number ─────────── */
/* Handoff: 60px 1fr 1.4fr; gap 20px 28px; padding 56px 0; num 52px; title 24px */

@media (min-width: 640px) and (max-width: 1023px) {
  .wx-cap-article {
    grid-template-columns: minmax(2.5ch, 60px) 1fr 1.4fr;  /* handoff: 3-col tablet */
    column-gap:            28px;
    row-gap:               20px;
    padding:               56px 0;           /* handoff: 56px 0 tablet */
  }
  .wx-cap-article__number {
    font-size: 52px !important;   /* handoff: 52px tablet */
    display: inline-block;
    width: max-content;
    min-width: 2.2ch;
    max-width: none;
    white-space: nowrap;
    word-break: normal;
    overflow-wrap: normal;
    writing-mode: horizontal-tb;
    text-orientation: mixed;
    line-height: 1 !important;
  }
  .wx-cap-article__title {
    font-size: 24px !important;   /* handoff: 24px tablet */
  }
  .wx-cap-article__lede {
    font-size: 18px !important;
  }
}

/* ── Mobile (<640px): single-column stack ────────────────────── */
/* Handoff: 1fr; gap 12px; padding 36px 0; num 48px; title 22px; lede 16px */

@media (max-width: 639px) {
  .wx-cap-article {
    grid-template-columns: 1fr;
    column-gap:            0;
    gap:                   12px;   /* handoff: 12px stacked gap */
    padding:               36px 0; /* handoff: 36px 0 mobile */
  }
  .wx-cap-article__number {
    font-size: 48px !important;   /* handoff: 48px mobile */
    display: inline-block;
    width: max-content;
    min-width: 2.2ch;
    max-width: none;
    white-space: nowrap;
    word-break: normal;
    overflow-wrap: normal;
    writing-mode: horizontal-tb;
    text-orientation: mixed;
    line-height: 1 !important;
  }
  .wx-cap-article__title {
    font-size: 22px !important;   /* handoff: 22px mobile */
  }
  .wx-cap-article__lede {
    font-size: 16px !important;   /* handoff: 16px mobile */
  }
  .wx-cap-article .wx-cap-article__point {
    font-size: 15px !important;   /* keep 15px on mobile */
  }
}

/* ═══════════════════════════════════════════════════════════════
   ACCESSIBILITY HELPERS
   ═══════════════════════════════════════════════════════════════ */

@media (prefers-reduced-motion: reduce) {
  .wx-audience-card,
  .wx-btn,
  .wx-insight-card__title,
  .wx-audience-card__cta,
  .wx-cap-article {
    transition: none;
  }
}

/* ── Mobile tap highlight ──────────────────────────────── */
/* Suppress iOS gray tap flash on navigation and card links.
   Keyboard :focus-visible outlines are unaffected and remain visible. */
body.wx-site .wx-header__nav-link,
body.wx-site .wx-header__drawer-link,
body.wx-site .wx-header__lang-toggle,
body.wx-site .wx-header__cta,
body.wx-site .wx-header__hamburger--mobile,
body.wx-site .wx-audience-card,
body.wx-site .wx-insight-card__link,
body.wx-site .wx-resource-card__link,
body.wx-site .wx-contact-selector__item {
  -webkit-tap-highlight-color: transparent;
}

/* ═══════════════════════════════════════════════════════════════
   BODY / GLOBAL RESETS FOR WExAct PAGES
   Scoped to body.wx-site — Elementor pages are completely untouched.
   All rules use !important where Blocksy's global img/a/ul resets
   would otherwise win the cascade.
   ═══════════════════════════════════════════════════════════════ */

/* Base page background and font for WExAct pages. */
body.wx-site {
  background:  var(--wx-paper-0) !important;
  color:       var(--wx-ink-1);
  font-family: var(--wx-font-sans);
  font-size:   var(--wx-fs-body);
  line-height: var(--wx-lh-relax);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/*
 * Suppress any Blocksy / WP page chrome that sneaks through.
 * These selectors target elements Blocksy outputs even for pages
 * using a custom PHP template. !important is required because Blocksy
 * uses high-specificity selectors for its header/footer blocks.
 */
body.wx-site .ct-container:not(.wx-container),
body.wx-site .ct-main-container,
body.wx-site .singular-content-area__prefix,
body.wx-site .page-header,
body.wx-site .ct-page-title-area,
body.wx-site .ct-breadcrumbs,
body.wx-site .entry-header,
body.wx-site .ct-page-header {
  display: none !important;
}

body.wx-site :where(
  .breadcrumbs,
  #breadcrumbs,
  .breadcrumb,
  .breadcrumb-trail,
  .rank-math-breadcrumb,
  .yoast-breadcrumb,
  .seopress-breadcrumbs,
  [class*="breadcrumbs"],
  [class*="breadcrumb"]
):not(.wx-insight-breadcrumb):not(.wx-resource-breadcrumb):not(.wx-cap-detail-meta) {
  display: none !important;
}

body.wx-site #main,
body.wx-site .site-main,
body.wx-site .ct-main {
  padding:    0 !important;
  margin:     0 !important;
  max-width:  none !important;
  width:      100% !important;
}

/* Hide Blocksy native header/footer — WExAct provides its own. */
body.wx-site #header,
body.wx-site .site-header,
body.wx-site .ct-header,
body.wx-site #footer,
body.wx-site .site-footer,
body.wx-site .ct-footer {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════════════
   WExAct SITE HEADER
   All link and image properties use !important to beat Blocksy's
   global `a { color: … }`, `img { height: auto }` resets.
   ═══════════════════════════════════════════════════════════════ */

.wx-header {
  position:      sticky !important;
  top:           0;
  z-index:       var(--wx-z-nav) !important;
  background:    transparent;
  border-bottom: 1px solid transparent;
  transition:
    background      var(--wx-dur-base) var(--wx-ease-out),
    border-color    var(--wx-dur-base) var(--wx-ease-out),
    backdrop-filter var(--wx-dur-base) var(--wx-ease-out);
  /* Ensure the header spans full viewport width regardless of Blocksy
     container constraints. */
  width:         100%;
  box-sizing:    border-box;
}

body.wx-site {
  --wx-header-offset: 0px;
  --wx-header-mobile-h: 63px;
}

/* Capability detail pages have long, full-width sections that pass directly
   under the sticky header. Keep this page family below the WExAct nav without
   changing shared header behavior elsewhere. */
body.wx-page--capability-detail .wx-header {
  z-index: 1000 !important;
}

body.wx-page--capability-detail .wx-root {
  position: relative;
  z-index: 0;
}

body.wx-page--capability-detail :where(
  .wx-cap-detail-hero,
  .wx-cap-detail-when,
  .wx-cap-detail-questions,
  .wx-cap-detail-connects,
  .wx-cap-detail-not,
  .wx-cap-detail-cta
) {
  z-index: auto;
}

/* Scrolled / menu-open state: frosted cool white.
   Class 'is-scrolled' is toggled by wx-nav.js (threshold 8px scroll).
   Also supports legacy BEM class 'wx-header--scrolled' for compatibility.
   Uses rgba(255,255,255,0.85) — cool white, NOT the prototype's warm ivory rgba(250,247,241,0.95).
   blur(18px) is more visible than 12px across light/dark page sections.
   Border uses a very subtle rgba tint rather than the full --wx-line token. */
.wx-header.is-scrolled,
.wx-header--scrolled,
.wx-header--menu-open {
  background:              rgba(255, 255, 255, 0.85) !important;
  backdrop-filter:         blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border-bottom-color:     rgba(20, 23, 28, 0.08) !important;
}

/* WP admin bar offsets. */
body.admin-bar {
  --wx-header-offset: 32px;
}

body.admin-bar .wx-header {
  top: var(--wx-header-offset);
}
@media screen and (max-width: 782px) {
  body.admin-bar {
    --wx-header-offset: 0px;
  }
}

/* Inner wrapper: max-width rail, flex row. */
.wx-header__inner {
  max-width:       var(--wx-col-max);
  margin:          0 auto;
  padding:         18px var(--wx-gutter);
  display:         flex !important;
  align-items:     center;
  justify-content: space-between;
  gap:             24px;
  box-sizing:      border-box;
}

/* ── Logo ─────────────────────────────────────────────────── */

.wx-header__logo {
  display:         flex !important;
  align-items:     center;
  flex-shrink:     0;
  text-decoration: none !important;
  border:          none !important;
  outline:         none;
  box-shadow:      none;
}

/* Logo image: !important on height/width to beat global img resets.
   The inline style on the <img> tag provides the same values as a
   zero-CSS fallback. */
.wx-header__logo-img {
  display:   block !important;
  height:    44px !important;
  width:     auto !important;
  max-width: none !important;
  /* Prevent Blocksy's img { height: auto } from overriding. */
}

/* ── Desktop nav ─────────────────────────────────────────── */

.wx-header__nav--desktop {
  display:         flex !important;
  gap:             22px;
  justify-content: center;
  flex:            1;
  align-items:     center;
  list-style:      none;
  margin:          0;
  padding:         0;
}

/* Nav links: !important on color and text-decoration to beat Blocksy's
   global `a { color: var(--theme-link-…); text-decoration: underline; }`. */
.wx-header .wx-header__nav-link {
  font-family:     var(--wx-font-sans) !important;
  font-size:       13px !important;
  font-weight:     500 !important;
  color:           var(--wx-ink-2) !important;
  text-decoration: none !important;
  border-bottom:   1px solid transparent !important;
  padding-bottom:  4px;
  transition:
    color        var(--wx-dur-fast) var(--wx-ease-out),
    border-color var(--wx-dur-fast) var(--wx-ease-out);
  white-space:     nowrap;
  background:      transparent !important;
  box-shadow:      none !important;
}

.wx-header .wx-header__nav-link:hover {
  color:        var(--wx-ink-0) !important;
  border-color: var(--wx-accent) !important;
}

.wx-header .wx-header__nav-link--active {
  color:        var(--wx-ink-0) !important;
  border-color: var(--wx-accent) !important;
}

/* ── Right actions cluster ────────────────────────────────── */

.wx-header__actions {
  display:     flex !important;
  gap:         12px;
  align-items: center;
  flex-shrink: 0;
}

/* Language toggle (link element) */
.wx-header .wx-header__lang-toggle {
  font-family:     var(--wx-font-sans) !important;
  font-size:       13px !important;
  color:           var(--wx-ink-2) !important;
  text-decoration: none !important;
  background:      transparent !important;
  border:          none !important;
  cursor:          pointer;
  padding:         4px 8px;
  border-radius:   var(--wx-r-1);
  transition:      background var(--wx-dur-fast), color var(--wx-dur-fast);
}
.wx-header .wx-header__lang-toggle:hover {
  background: var(--wx-paper-2) !important;
  color:      var(--wx-ink-0) !important;
}

/* "Talk to us" CTA (desktop) — handoff §5: 14px/600, padding 11·18, radius 2px, ls .01em */
.wx-header__cta--desktop {
  padding:        11px 18px !important;
  font-size:      14px !important;   /* handoff: 14px not 13 */
  font-weight:    600 !important;
  border-radius:  var(--wx-r-1) !important;  /* 2px — square, not pill */
  letter-spacing: 0.01em;
  white-space:    nowrap;
}

/* ── Hamburger ─────────────────────────────────────────────── */

.wx-header__hamburger--mobile {
  display:        none; /* flex at < 960px */
  background:     transparent !important;
  border:         none !important;
  cursor:         pointer;
  padding:        6px;
  flex-direction: column;
  gap:            5px;
  box-shadow:     none !important;
}

.wx-header__bar {
  display:    block !important;
  width:      22px;
  height:     1.5px !important;
  background: var(--wx-ink-0) !important;
  border:     none !important;
  transition:
    transform var(--wx-dur-base) var(--wx-ease-out),
    opacity   var(--wx-dur-fast) var(--wx-ease-out);
}

.wx-header__hamburger--open .wx-header__bar--top {
  transform: translateY(6.5px) rotate(45deg);
}
.wx-header__hamburger--open .wx-header__bar--mid {
  opacity: 0;
}
.wx-header__hamburger--open .wx-header__bar--bot {
  transform: translateY(-6.5px) rotate(-45deg);
}

/* ── Mobile drawer ─────────────────────────────────────────── */

.wx-header__drawer {
  display:    none; /* shown as block at < 960px */
  background: var(--wx-paper-0);
  border-top: 0;
  padding:    0 var(--wx-gutter);
  overflow:   hidden;
  max-height: 0;
  pointer-events: none;
  transition: max-height var(--wx-dur-base) var(--wx-ease-out);
}
.wx-header__drawer[aria-hidden="true"] {
  display: none !important;
}
.wx-header__drawer--open {
  display: block !important;
  max-height: calc(100dvh - var(--wx-header-mobile-h) - var(--wx-header-offset));
  overflow-y: auto;
  padding-top: 8px;
  padding-bottom: 28px;
  pointer-events: auto;
  -webkit-overflow-scrolling: touch;
}

.wx-header__drawer-nav {
  display:        flex !important;
  flex-direction: column;
  list-style:     none !important;
  margin:         0;
  padding:        0;
}

.wx-header .wx-header__drawer-link {
  display:         flex !important;
  justify-content: space-between;
  align-items:     center;
  font-family:     var(--wx-font-sans) !important;
  font-size:       16px !important;
  font-weight:     500 !important;
  color:           var(--wx-ink-2) !important;
  text-decoration: none !important;
  padding:         13px 0;
  border-bottom:   1px solid var(--wx-line) !important;
  transition:      color var(--wx-dur-fast) var(--wx-ease-out);
}
.wx-header .wx-header__drawer-link:hover,
.wx-header .wx-header__drawer-link--active {
  color: var(--wx-ink-0) !important;
}

.wx-header__drawer-dot {
  display:       block !important;
  width:         6px;
  height:        6px;
  border-radius: 50%;
  background:    var(--wx-accent) !important;
  flex-shrink:   0;
}

.wx-header__drawer-footer {
  margin-top: 22px;
}

/* ── Compact breakpoint < 960px ──────────────────────────── */
@media (max-width: 959px) {
  body.wx-site {
    padding-top: calc(var(--wx-header-mobile-h) + var(--wx-header-offset)) !important;
  }

  body.wx-site:has(.wx-header__drawer--open) {
    overflow: hidden;
  }

  .wx-header {
    position: fixed !important;
    top: var(--wx-header-offset) !important;
    left: 0;
    right: 0;
    background: rgba(255, 255, 255, 0.96) !important;
    border-bottom-color: rgba(20, 23, 28, 0.08) !important;
  }

  .wx-header__inner {
    min-height: var(--wx-header-mobile-h);
    padding: 10px var(--wx-gutter);
  }
  .wx-header__logo-img {
    height: 34px !important;
  }
  .wx-header__nav--desktop {
    display: none !important;
  }
  .wx-header__cta--desktop {
    display: none !important;
  }
  .wx-header__hamburger--mobile {
    display: flex !important;
  }

  /* Thicker bars for better visibility on high-DPI mobile screens */
  .wx-header__bar {
    height: 2px !important;
  }
  .wx-header__drawer {
    display: none !important;
    position: fixed;
    top: calc(var(--wx-header-offset) + var(--wx-header-mobile-h));
    left: 0;
    right: 0;
    z-index: calc(var(--wx-z-nav) - 1);
    background: var(--wx-paper-0);
    border-top: 0;
    box-shadow: 0 16px 30px rgba(14, 25, 36, 0.08);
    padding-top: 0;
  }

  .wx-header__drawer--open {
    display: block !important;
    padding-top: 8px;
    padding-bottom: 28px;
  }
  .wx-header .wx-header__lang-toggle {
    font-size:    12px !important;
    border:       1px solid var(--wx-line) !important;
    padding:      4px 10px;
    border-radius: var(--wx-r-1);
  }

  /* iOS safe-area: ensure drawer CTA clears the home indicator */
  .wx-header__drawer-footer {
    padding-bottom: env(safe-area-inset-bottom);
  }
}

/* ═══════════════════════════════════════════════════════════════
   WExAct SITE FOOTER
   All text / link / list properties use !important to beat Blocksy's
   global `a { color: … }`, `ul { list-style: disc; padding: … }` resets.
   ═══════════════════════════════════════════════════════════════ */

.wx-footer {
  background: var(--wx-ink-surface) !important;
  color:      var(--wx-paper-0) !important;
  margin-top: 0 !important;
}

.wx-footer__inner {
  max-width: var(--wx-col-max);
  margin:    0 auto;
  box-sizing: border-box;
}

/* Main grid: 1.4fr 1fr 1fr 1fr */
.wx-footer__grid {
  display:               grid !important;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap:                   48px;
  padding:               var(--wx-s-9) var(--wx-gutter) var(--wx-s-7);
  box-sizing:            border-box;
}

/* Brand column logo: inline style on the <img> is the primary constraint;
   this !important rule is the CSS belt-and-suspenders. */
.wx-footer .wx-footer__logo {
  display:       block !important;
  height:        32px !important;
  width:         auto !important;
  max-width:     none !important;
  margin-bottom: 20px !important;
}

.wx-footer__tagline {
  font-family: var(--wx-font-display) !important;
  font-weight: 300 !important;
  font-size:   17px !important;
  line-height: 1.5 !important;
  color:       var(--wx-paper-2) !important;
  max-width:   380px;
  margin:      0 !important;
}

.wx-footer__locations {
  font-family:    var(--wx-font-sans) !important;
  font-size:      12px !important;
  color:          var(--wx-ink-4) !important;
  margin-top:     14px !important;
  letter-spacing: 0.02em;
}

/* ── Footer social icon buttons ─────────────────────────────── */
/* Prototype §footer: 36×36 square tiles, 1px rgba border, radius 4px */

.wx-footer__social {
  display:     flex !important;
  gap:         12px;
  margin-top:  20px !important;
  flex-wrap:   wrap;
}

.wx-footer__social-link {
  display:         flex !important;
  align-items:     center !important;
  justify-content: center !important;
  width:           36px !important;
  height:          36px !important;
  border:          1px solid rgba(255, 255, 255, 0.15) !important;
  border-radius:   var(--wx-r-2) !important;   /* 4px — matches prototype */
  color:           var(--wx-paper-2) !important;
  text-decoration: none !important;
  flex-shrink:     0;
  position:        relative;
  transition:      border-color 200ms, color 200ms, background 200ms;
}

/* LinkedIn: brand blue hover */
.wx-footer__social-link--linkedin:hover {
  border-color: var(--wx-brand-60) !important;
  color:        var(--wx-paper-0) !important;
  background:   rgba(6, 114, 181, 0.20) !important;
}

/* WeChat: green hover */
.wx-footer__social-link--wechat:hover {
  border-color: #07C160 !important;
  color:        var(--wx-paper-0) !important;
  background:   rgba(7, 193, 96, 0.15) !important;
}

.wx-footer__social-icon {
  display:    block !important;
  flex-shrink: 0;
}

/* WeChat QR tooltip — visible on :hover */
.wx-footer__social-tip {
  display:          none;
  position:         absolute;
  bottom:           calc(100% + 8px);
  left:             50%;
  transform:        translateX(-50%);
  background:       var(--wx-paper-0);
  color:            var(--wx-ink-1);
  font-size:        11px;
  font-family:      var(--wx-font-sans);
  padding:          6px 10px;
  border-radius:    var(--wx-r-2);
  white-space:      nowrap;
  box-shadow:       0 4px 14px rgba(0, 0, 0, 0.2);
  z-index:          10;
  pointer-events:   none;
}
.wx-footer__social-link--wechat:hover .wx-footer__social-tip {
  display: block;
}

/* Link column headings */
.wx-footer__col-heading {
  font-family:    var(--wx-font-sans) !important;
  font-size:      11px !important;
  font-weight:    600 !important;
  letter-spacing: 0.18em;
  text-transform: uppercase !important;
  color:          var(--wx-accent) !important;
  margin-bottom:  16px !important;
  display:        block;
}

/* Link column lists: reset browser + Blocksy ul defaults. */
.wx-footer .wx-footer__col-list {
  list-style: none !important;
  padding:    0 !important;
  margin:     0 !important;
  display:    flex !important;
  flex-direction: column;
  gap:        10px;
}

/* List items */
.wx-footer .wx-footer__col-list li {
  list-style: none !important;
  padding:    0 !important;
  margin:     0 !important;
}

/* Footer links: !important on color + text-decoration to beat Blocksy. */
.wx-footer .wx-footer__col-link {
  font-family:     var(--wx-font-sans) !important;
  font-size:       14px !important;
  color:           var(--wx-paper-2) !important;
  text-decoration: none !important;
  border:          none !important;
  display:         inline;
  transition:      color var(--wx-dur-fast) var(--wx-ease-out);
}
.wx-footer .wx-footer__col-link:hover {
  color: var(--wx-paper-0) !important;
}

/* Bottom bar */
.wx-footer__bottom {
  padding:         var(--wx-s-5) var(--wx-gutter);
  border-top:      1px solid var(--wx-line-strong) !important;
  display:         flex !important;
  justify-content: space-between;
  flex-wrap:       wrap;
  gap:             8px;
  font-family:     var(--wx-font-sans) !important;
  font-size:       12px !important;
  color:           var(--wx-ink-4) !important;
  box-sizing:      border-box;
}

/* ── Narrow breakpoint: 640px–859px — 3 equal link columns ─── */
@media (min-width: 640px) and (max-width: 859px) {
  .wx-footer__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 36px;
  }
  .wx-footer__brand {
    grid-column: 1 / -1;
  }
}

.wx-footer__legal a {
  color:           inherit;
  text-decoration: none;
  opacity:         0.75;
  transition:      opacity 0.2s ease;
}
.wx-footer__legal a:hover,
.wx-footer__legal a:focus {
  opacity: 1;
  text-decoration: underline;
}

/* ── Mobile breakpoint: < 640px — single column ──────────── */
@media (max-width: 639px) {
  .wx-footer__grid {
    grid-template-columns: 1fr;
    gap: 28px;
    padding: var(--wx-s-7) var(--wx-gutter) var(--wx-s-5);
  }
  .wx-footer__bottom {
    flex-direction: column;
    gap: 4px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   AUDIENCE DETAIL PAGE
   Components for page-audience-detail.php.
   Classes: wx-aud-hero, wx-phases, wx-help-section
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Hero ──────────────────────────────────────────────────────────────── */

.wx-aud-hero {
  padding:       72px 0 64px;
  border-bottom: 1px solid var(--wx-line);
}

.wx-aud-hero__inner {
  max-width: 860px;
}

/* Back navigation link */
.wx-aud-hero__back {
  display:        inline-block !important;
  font-size:      13px !important;
  font-weight:    500 !important;
  color:          var(--wx-ink-3) !important;
  letter-spacing: 0.01em;
  margin-bottom:  32px !important;
  transition:     color var(--wx-dur-fast) var(--wx-ease-out);
}
.wx-aud-hero__back:hover {
  color: var(--wx-brand) !important;
}

/* Eyebrow spacing when above H1 */
.wx-aud-hero__eyebrow {
  margin-bottom: 20px !important;
}

/* H1 — narrative audience title ("For regional consultants…") */
.wx-aud-hero__title {
  font-family:    var(--wx-font-display) !important;
  font-size:      clamp(36px, 5vw, 60px) !important;
  font-weight:    400 !important;
  line-height:    1.05 !important;
  letter-spacing: -0.022em !important;
  color:          var(--wx-ink-0) !important;
  margin:         0 0 28px !important;
}

/* EN lede */
.wx-aud-hero__lede {
  font-size:      22px !important;
  font-weight:    300 !important;
  line-height:    1.5 !important;
  color:          var(--wx-ink-1) !important;
  margin:         0 0 12px !important;
  max-width:      720px;
}

/* CN subtitle */
.wx-aud-hero__cn-lede {
  font-size:   16px !important;
  font-weight: 300 !important;
  line-height: 1.5 !important;
  color:       var(--wx-ink-3) !important;
  margin:      0 !important;
  max-width:   720px;
}

/* ── Engagement section header ─────────────────────────────────────────── */

.wx-phases {
  background: var(--wx-paper-1);
  padding:    80px 0 72px;
}

/* Eyebrow + large H2 above phase grid */
.wx-aud-engagement__header {
  margin-bottom: 48px;
}

.wx-aud-engagement__title {
  font-family:    var(--wx-font-display) !important;
  font-size:      clamp(26px, 3vw, 44px) !important;
  font-weight:    400 !important;
  line-height:    1.1 !important;
  letter-spacing: -0.018em !important;
  color:          var(--wx-ink-0) !important;
  max-width:      800px;
  margin:         14px 0 0 !important;
}

/* ── Phase grid — border-based column dividers, no gap ─────────────────── */

.wx-phases__grid {
  display:               grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap:                   0 !important;
  border-top:            1px solid var(--wx-line);
}

/* Phase card */
.wx-phase {
  padding:        32px 24px 36px !important;
  border-right:   1px solid var(--wx-line);
  display:        flex !important;
  flex-direction: column !important;
  gap:            0 !important;
  min-height:     240px;
}

/* Last card in each row — remove right border */
.wx-phase--row-end,
.wx-phases__grid > .wx-phase:last-child {
  border-right: none !important;
}

/* Large display number: 44px / weight 300 */
.wx-phase__number {
  font-family:         var(--wx-font-display) !important;
  font-size:           44px !important;
  font-weight:         300 !important;
  line-height:         1 !important;
  color:               var(--wx-ink-0) !important;
  height:              52px;
  display:             flex;
  align-items:         flex-start;
  font-feature-settings: "lnum", "tnum";
  margin:              0 !important;
  text-transform:      none !important;
  letter-spacing:      0 !important;
}

/* Blue accent rule between number and phase name */
.wx-phase__accent-line {
  width:      28px;
  height:     1px;
  background: var(--wx-brand);
  margin:     12px 0 0;
  flex-shrink: 0;
}

/* Phase name: 17px / 600 */
.wx-phase__name {
  font-size:   17px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color:       var(--wx-ink-0) !important;
  margin:      8px 0 0 !important;
}

/* Phase description: 14px / ink-2 — pushed to bottom of card */
.wx-phase__desc {
  font-size:   14px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  color:       var(--wx-ink-2) !important;
  margin-top:  auto !important;
  padding-top: 12px;
}

/* ── Help / Not-for-you section ────────────────────────────────────────── */

.wx-help-section {
  background:    var(--wx-paper-0);
  padding:       80px 0 72px;
  border-bottom: 1px solid var(--wx-line);
}

.wx-help-grid {
  display:               grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap:                   80px !important;
  align-items:           start;
}

/* Column heading — eyebrow class already sets font/size/tracking/case.
   Only add spacing here. */
.wx-help-col__heading {
  margin-bottom: 18px !important;
}

/* List: border-bottom rows, no gap */
.wx-help-list {
  display:        flex !important;
  flex-direction: column !important;
  gap:            0 !important;
  list-style:     none !important;
  margin:         0 !important;
  padding:        0 !important;
}

.wx-help-item {
  display:       flex !important;
  gap:           16px !important;
  align-items:   flex-start !important;
  padding:       16px 0 !important;
  border-bottom: 1px solid var(--wx-line) !important;
}

/* Numbered marker — mono / 12px / ink-3 (NOT brand blue) */
.wx-help-item__num {
  font-family:  var(--wx-font-mono) !important;
  font-size:    12px !important;
  font-weight:  400 !important;
  color:        var(--wx-ink-3) !important;
  min-width:    28px;
  flex-shrink:  0;
  line-height:  1.6;
  margin:       0 !important;
}

/* × marker — mono / 12px / ink-4 */
.wx-help-item__x {
  font-family:  var(--wx-font-mono) !important;
  font-size:    12px !important;
  font-weight:  400 !important;
  color:        var(--wx-ink-4) !important;
  min-width:    28px;
  flex-shrink:  0;
  line-height:  1.6;
  margin:       0 !important;
}

/* Help item body text */
.wx-help-item__text {
  font-size:   16px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  color:       var(--wx-ink-1) !important;
  margin:      0 !important;
}

/* Not-for-you items: slightly smaller and more muted */
.wx-not-item .wx-help-item__text {
  font-size: 15px !important;
  color:     var(--wx-ink-2) !important;
}

/* ── Responsive: audience detail breakpoints ───────────────────────────── */

/* Tablet: phases → 2-column, help → stacked */
@media (max-width: 859px) {

  .wx-aud-hero {
    padding: 48px 0 40px;
  }
  .wx-aud-hero__title {
    font-size: clamp(30px, 7vw, 48px) !important;
  }
  .wx-aud-hero__lede {
    font-size: 19px !important;
  }

  .wx-aud-engagement__title {
    font-size: clamp(22px, 4vw, 32px) !important;
  }

  .wx-phases {
    padding: 56px 0 48px;
  }
  /* 2-col grid: reset right-border on old row-ends, add divider after col 2 */
  .wx-phases__grid {
    grid-template-columns: 1fr 1fr !important;
  }
  /* Re-apply right border to all cards, then strip from every 2nd */
  .wx-phases__grid .wx-phase {
    border-right: 1px solid var(--wx-line) !important;
  }
  .wx-phases__grid .wx-phase:nth-child(2n),
  .wx-phases__grid .wx-phase:last-child {
    border-right: none !important;
  }
  /* Add bottom border between rows */
  .wx-phases__grid .wx-phase:nth-child(-n+2) {
    border-bottom: 1px solid var(--wx-line);
  }

  .wx-help-section {
    padding: 48px 0;
  }
  .wx-help-grid {
    grid-template-columns: 1fr !important;
    gap: 48px !important;
  }
}

/* Mobile: phases → 1-column */
@media (max-width: 639px) {

  .wx-aud-hero__title {
    font-size: 30px !important;
  }
  .wx-aud-hero__lede {
    font-size: 17px !important;
  }
  .wx-aud-hero__cn-lede {
    font-size: 14px !important;
  }

  .wx-aud-engagement__header {
    margin-bottom: 32px;
  }

  .wx-phases {
    padding: 48px 0 40px;
  }
  /* 1-col grid: all right borders off, add bottom border between each card */
  .wx-phases__grid {
    grid-template-columns: 1fr !important;
  }
  .wx-phases__grid .wx-phase {
    border-right: none !important;
    border-bottom: 1px solid var(--wx-line);
  }
  .wx-phases__grid .wx-phase:last-child {
    border-bottom: none;
  }
  .wx-phase {
    min-height: auto;
  }

  .wx-help-item__text {
    font-size: 15px !important;
  }
  .wx-not-item .wx-help-item__text {
    font-size: 14px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   SPRINT 1 — GLOBAL NETWORK PAGE
   Classes: wx-network-why, wx-region-grid, wx-region-card,
            wx-network-how-grid, wx-network-how-card, wx-openness-grid
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── §2 Why — editorial prose layout ────────────────────────────────────── */

.wx-network-why {
  display:               grid;
  grid-template-columns: 1fr 1.5fr;
  gap:                   64px;
  align-items:           start;
}

.wx-network-why__header {
  display:        flex;
  flex-direction: column;
  gap:            16px;
}

.wx-network-why__title {
  font-family:    var(--wx-font-display) !important;
  font-weight:    400 !important;
  font-size:      clamp(26px, 3vw, 40px) !important;
  line-height:    1.15 !important;
  letter-spacing: -0.018em !important;
  color:          var(--wx-ink-0) !important;
  margin:         0 !important;
}

.wx-network-why__body {
  display:        flex;
  flex-direction: column;
  gap:            20px;
}

.wx-network-why__body p {
  font-size:   17px !important;
  line-height: 1.65 !important;
  color:       var(--wx-ink-1) !important;
  margin:      0 !important;
}

@media (max-width: 859px) {
  .wx-network-why {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

/* ── §3 Region grid — 3-col bordered ────────────────────────────────────── */

.wx-network-regions__header {
  margin-bottom: 40px;
}

.wx-network-regions__note {
  font-size:   14px !important;
  color:       var(--wx-ink-3) !important;
  margin:      12px 0 0 !important;
  max-width:   640px;
  line-height: 1.55 !important;
}

/* 3-col grid — same border pattern as methodology grid */
.wx-region-grid {
  display:               grid;
  grid-template-columns: repeat(3, 1fr);
  border-top:            1px solid var(--wx-line);
}

.wx-region-card {
  padding:        32px 28px 36px;
  display:        flex;
  flex-direction: column;
  gap:            10px;
  min-height:     200px;
}

/* Right border on col 1 and col 2 */
.wx-region-card:not(:nth-child(3n)) {
  border-right: 1px solid var(--wx-line);
}

/* Bottom border between rows */
.wx-region-card:nth-child(-n+3) {
  border-bottom: 1px solid var(--wx-line);
}

.wx-region-card__num {
  /* eyebrow class handles font/size/tracking */
}

.wx-region-card__name {
  font-family:    var(--wx-font-display) !important;
  font-weight:    500 !important;
  font-size:      20px !important;
  line-height:    1.2 !important;
  color:          var(--wx-ink-0) !important;
  margin:         0 !important;
}

.wx-region-card__desc {
  font-size:   14px !important;
  line-height: 1.6 !important;
  color:       var(--wx-ink-2) !important;
  margin:      0 !important;
  margin-top:  auto !important;
}

@media (max-width: 859px) {
  .wx-region-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .wx-region-card:not(:nth-child(3n)) {
    border-right: none;
  }
  .wx-region-card:nth-child(-n+3) {
    border-bottom: none;
  }
  .wx-region-card:not(:nth-child(2n)) {
    border-right: 1px solid var(--wx-line);
  }
  .wx-region-card:nth-child(-n+4) {
    border-bottom: 1px solid var(--wx-line);
  }
}

@media (max-width: 639px) {
  .wx-region-grid {
    grid-template-columns: 1fr;
  }
  .wx-region-card {
    min-height: 0;
    padding: 28px 0 32px;
  }
  .wx-region-card:not(:nth-child(2n)) {
    border-right: none;
  }
  .wx-region-card:nth-child(-n+4) {
    border-bottom: none;
  }
  .wx-region-card:not(:last-child) {
    border-bottom: 1px solid var(--wx-line);
  }
}

/* ── §4 How we work — 4-col bordered card grid ───────────────────────────── */

.wx-network-how-grid {
  display:               grid;
  grid-template-columns: repeat(4, 1fr);
  gap:                   0;
  border-top:            1px solid var(--wx-line);
}

.wx-network-how-card {
  padding:        32px 24px 36px;
  border-right:   1px solid var(--wx-line);
  display:        flex;
  flex-direction: column;
  gap:            0;
  min-height:     220px;
}

.wx-network-how-card:last-child {
  border-right: none;
}

.wx-network-how-card__num {
  font-family:         var(--wx-font-display) !important;
  font-size:           44px !important;
  font-weight:         300 !important;
  line-height:         1 !important;
  color:               var(--wx-ink-0) !important;
  height:              52px;
  display:             flex;
  align-items:         flex-start;
  font-feature-settings: "lnum","tnum";
  margin:              0 !important;
}

.wx-network-how-card__name {
  font-size:   17px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color:       var(--wx-ink-0) !important;
  margin:      8px 0 0 !important;
}

.wx-network-how-card__desc {
  font-size:   14px !important;
  line-height: 1.6 !important;
  color:       var(--wx-ink-2) !important;
  margin-top:  auto !important;
  padding-top: 12px;
}

@media (max-width: 859px) {
  .wx-network-how-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .wx-network-how-card {
    border-right: 1px solid var(--wx-line) !important;
  }
  .wx-network-how-card:nth-child(2n),
  .wx-network-how-card:last-child {
    border-right: none !important;
  }
  .wx-network-how-card:nth-child(-n+2) {
    border-bottom: 1px solid var(--wx-line);
  }
}

@media (max-width: 639px) {
  .wx-network-how-grid {
    grid-template-columns: 1fr;
  }
  .wx-network-how-card {
    border-right: none !important;
    border-bottom: 1px solid var(--wx-line);
    min-height: 0;
  }
  .wx-network-how-card:last-child {
    border-bottom: none;
  }
}

/* ── §5 Openness — 2-col tag list ────────────────────────────────────────── */

.wx-openness-grid {
  display:               grid;
  grid-template-columns: repeat(2, 1fr);
  border-top:            1px solid var(--wx-line);
}

.wx-openness-item {
  display:       flex;
  align-items:   center;
  gap:           16px;
  padding:       18px 0;
  border-bottom: 1px solid var(--wx-line);
}

.wx-openness-item__marker {
  font-family:  var(--wx-font-mono) !important;
  font-size:    12px !important;
  color:        var(--wx-accent) !important;
  flex-shrink:  0;
  min-width:    20px;
  font-weight:  400 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

.wx-openness-item__text {
  font-size:   16px;
  font-weight: 400;
  color:       var(--wx-ink-1);
  line-height: 1.4;
}

@media (max-width: 639px) {
  .wx-openness-grid {
    grid-template-columns: 1fr;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   SPRINT 1 — ABOUT PAGE
   Classes: wx-about-prose, wx-about-journey-header, wx-about-section-title,
            wx-about-step-grid, wx-about-step, wx-about-approach-grid,
            wx-about-approach-card, wx-about-team-grid, wx-about-team-card,
            wx-about-direction
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Shared: editorial prose block ──────────────────────────────────────── */

.wx-about-prose {
  display:        flex;
  flex-direction: column;
  gap:            20px;
}

.wx-about-prose p {
  font-size:   17px !important;
  line-height: 1.65 !important;
  color:       var(--wx-ink-1) !important;
  margin:      0 !important;
}

/* ── Shared: section eyebrow + H2 header ─────────────────────────────────── */

.wx-about-journey-header {
  margin-bottom: 40px;
}

.wx-about-section-title {
  font-family:    var(--wx-font-display) !important;
  font-weight:    400 !important;
  font-size:      clamp(26px, 3.5vw, 44px) !important;
  line-height:    1.15 !important;
  letter-spacing: -0.018em !important;
  color:          var(--wx-ink-0) !important;
  margin:         14px 0 0 !important;
  max-width:      780px;
}

/* ── §3 Journey — 3-col bordered step grid ───────────────────────────────── */

.wx-about-step-grid {
  display:               grid;
  grid-template-columns: repeat(3, 1fr);
  gap:                   0;
  border-top:            1px solid var(--wx-line);
}

.wx-about-step {
  padding:        32px 24px 36px;
  border-right:   1px solid var(--wx-line);
  display:        flex;
  flex-direction: column;
  gap:            0;
  min-height:     220px;
}

.wx-about-step--row-end,
.wx-about-step-grid > .wx-about-step:last-child {
  border-right: none !important;
}

/* Bottom border between rows */
.wx-about-step-grid > .wx-about-step:nth-child(-n+3) {
  border-bottom: 1px solid var(--wx-line);
}

.wx-about-step__num {
  font-family:         var(--wx-font-display) !important;
  font-size:           44px !important;
  font-weight:         300 !important;
  line-height:         1 !important;
  color:               var(--wx-ink-0) !important;
  height:              52px;
  display:             flex;
  align-items:         flex-start;
  font-feature-settings: "lnum","tnum";
  margin:              0 !important;
}

.wx-about-step__name {
  font-size:   17px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color:       var(--wx-ink-0) !important;
  margin:      8px 0 0 !important;
}

.wx-about-step__desc {
  font-size:   14px !important;
  line-height: 1.6 !important;
  color:       var(--wx-ink-2) !important;
  margin-top:  auto !important;
  padding-top: 12px;
}

@media (max-width: 859px) {
  .wx-about-step-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .wx-about-step {
    border-right: 1px solid var(--wx-line) !important;
  }
  .wx-about-step-grid > .wx-about-step:nth-child(-n+3) {
    border-bottom: none;
  }
  .wx-about-step:nth-child(2n),
  .wx-about-step--row-end,
  .wx-about-step:last-child {
    border-right: none !important;
  }
  .wx-about-step:not(:nth-last-child(-n+2)) {
    border-bottom: 1px solid var(--wx-line);
  }
}

@media (max-width: 639px) {
  .wx-about-step-grid {
    grid-template-columns: 1fr;
  }
  .wx-about-step {
    border-right: none !important;
    border-bottom: 1px solid var(--wx-line) !important;
    min-height: 0;
  }
  .wx-about-step:last-child {
    border-bottom: none !important;
  }
}

/* ── §4 Approach — 2-col bordered card grid ──────────────────────────────── */

.wx-about-approach-grid {
  display:               grid;
  grid-template-columns: repeat(2, 1fr);
  gap:                   0;
  border-top:            1px solid var(--wx-line);
}

.wx-about-approach-card {
  padding:        36px 32px 40px;
  border-right:   1px solid var(--wx-line);
  display:        flex;
  flex-direction: column;
  gap:            14px;
}

.wx-about-approach-card--row-end,
.wx-about-approach-grid > .wx-about-approach-card:last-child {
  border-right: none !important;
}

.wx-about-approach-grid > .wx-about-approach-card:nth-child(-n+2) {
  border-bottom: 1px solid var(--wx-line);
}

.wx-about-approach-card__name {
  font-family:    var(--wx-font-display) !important;
  font-weight:    500 !important;
  font-size:      22px !important;
  line-height:    1.2 !important;
  color:          var(--wx-ink-0) !important;
  margin:         0 !important;
}

.wx-about-approach-card__desc {
  font-size:   15px !important;
  line-height: 1.65 !important;
  color:       var(--wx-ink-2) !important;
  margin:      0 !important;
}

@media (max-width: 639px) {
  .wx-about-approach-grid {
    grid-template-columns: 1fr;
  }
  .wx-about-approach-card {
    border-right: none !important;
    padding: 28px 0 32px;
  }
  .wx-about-approach-grid > .wx-about-approach-card:nth-child(-n+2) {
    border-bottom: none;
  }
  .wx-about-approach-card:not(:last-child) {
    border-bottom: 1px solid var(--wx-line) !important;
  }
}

/* ── §5 Team tiers — 4-col bordered grid ─────────────────────────────────── */

.wx-about-team-grid {
  display:               grid;
  grid-template-columns: repeat(4, 1fr);
  gap:                   0;
  border-top:            1px solid var(--wx-line);
}

.wx-about-team-card {
  padding:        32px 24px 36px;
  border-right:   1px solid var(--wx-line);
  display:        flex;
  flex-direction: column;
  gap:            14px;
}

.wx-about-team-card:last-child {
  border-right: none;
}

.wx-about-team-card__title {
  font-family: var(--wx-font-display) !important;
  font-weight: 500 !important;
  font-size:   18px !important;
  line-height: 1.25 !important;
  color:       var(--wx-ink-0) !important;
  margin:      0 !important;
}

.wx-about-team-card__desc {
  font-size:   14px !important;
  line-height: 1.6 !important;
  color:       var(--wx-ink-2) !important;
  margin:      0 !important;
}

@media (max-width: 859px) {
  .wx-about-team-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .wx-about-team-card {
    border-right: 1px solid var(--wx-line) !important;
  }
  .wx-about-team-card:nth-child(2n),
  .wx-about-team-card:last-child {
    border-right: none !important;
  }
  .wx-about-team-card:nth-child(-n+2) {
    border-bottom: 1px solid var(--wx-line);
  }
}

@media (max-width: 639px) {
  .wx-about-team-grid {
    grid-template-columns: 1fr;
  }
  .wx-about-team-card {
    border-right: none !important;
    border-bottom: 1px solid var(--wx-line) !important;
  }
  .wx-about-team-card:last-child {
    border-bottom: none !important;
  }
}

/* ── §6 Direction — editorial layout ─────────────────────────────────────── */

.wx-about-direction {
  display:               grid;
  grid-template-columns: 1fr 1.5fr;
  gap:                   64px;
  align-items:           start;
}

.wx-about-direction__header {
  display:        flex;
  flex-direction: column;
  gap:            16px;
}

@media (max-width: 859px) {
  .wx-about-direction {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   GLOBAL NETWORK + ABOUT — Claude Design parity rebuild
   New parity selectors are scoped to .wx-network-* and .wx-about-*.
   ═══════════════════════════════════════════════════════════════════════════ */

.wx-network-hero {
  padding: var(--wx-section-y) 0 24px;
  background: var(--wx-paper-0);
}

.wx-network-hero__inner,
.wx-network-presence__inner,
.wx-about-hero__inner,
.wx-about-body__inner {
  max-width: var(--wx-col-max);
  margin: 0 auto;
  padding: 0 var(--wx-gutter);
}

.wx-network-eyebrow,
.wx-about-eyebrow {
  font-family: var(--wx-font-sans);
  font-weight: 600;
  font-size: 12px;
  line-height: 1.2;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--wx-ink-2);
  margin: 0 !important;
}

.wx-network-eyebrow--accent,
.wx-about-eyebrow--accent {
  color: var(--wx-accent);
}

.wx-network-hero__title {
  margin: 12px 0 16px !important;
  font-family: var(--wx-font-display);
  font-weight: 400;
  font-size: 60px;
  line-height: 1.05;
  letter-spacing: -0.022em;
  color: var(--wx-ink-0);
  max-width: 980px;
  text-wrap: balance;
}

.wx-network-hero__lede {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-weight: 300;
  font-size: 22px;
  line-height: 1.55;
  color: var(--wx-ink-1);
  max-width: 720px;
}

.wx-network-presence {
  padding: 0 0 var(--wx-section-y);
  background: var(--wx-paper-0);
}

.wx-network-map {
  background: #ffffff;
  border: 1px solid transparent;
  box-shadow: none;
  padding: 0;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 8px;
  margin-bottom: 32px;
  overflow: hidden;
}

.wx-network-map__canvas {
  position: relative;
  width: 100%;
  height: 480px;
  max-width: 100%;
  background: #ffffff;
  overflow: hidden;
}

.wx-network-map__canvas canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.wx-network-map__canvas,
.wx-network-map__canvas canvas {
  touch-action: pan-y;
}

.wx-network-map__svg {
  width: 100%;
  height: auto;
  display: block;
}

.wx-network-map__field circle {
  fill: var(--wx-ink-4);
  opacity: 0.42;
}

.wx-network-map__arc {
  fill: none;
  stroke: var(--wx-accent);
  stroke-width: 0.8;
  opacity: 0.55;
}

.wx-network-map__node circle {
  fill: var(--wx-accent);
}

.wx-network-map__node text {
  font-family: var(--wx-font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  fill: var(--wx-ink-2);
}

.wx-globe-visual {
  width: min(100%, 620px);
  max-width: 100%;
  aspect-ratio: 1 / 1;
  margin-inline: auto;
  position: relative;
  overflow: hidden;
  background: transparent;
}

.wx-globe-visual canvas {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
}

.wx-globe-visual,
.wx-globe-visual canvas {
  touch-action: pan-y;
}

.wx-globe-visual--network {
  width: min(100%, 720px);
  background: #ffffff;
  box-shadow: none;
}

.wx-network-map .wx-globe-visual {
  background: #ffffff;
  box-shadow: none;
}

.wx-globe-visual--home {
  width: min(100%, 700px);
}

.wx-home-net__panel,
.wx-home-net__map,
.wx-globe-visual--home {
  background: transparent;
  border: 0;
  box-shadow: none;
}

.wx-globe-visual--home {
  aspect-ratio: 1.28 / 1;
  overflow: hidden;
}

.wx-home-net__map,
.wx-network-map {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

@media (max-width: 900px) {
  .wx-network-map {
    margin-top: 6px;
    margin-bottom: 24px;
  }

  .wx-network-map__canvas {
    height: 320px;
  }
}

@media (max-width: 768px) {
  .wx-globe-visual,
  .wx-globe-visual--home,
  .wx-globe-visual--network {
    width: 100%;
    max-width: 100%;
    aspect-ratio: 1 / 1;
  }

  .wx-home-net__map,
  .wx-network-map {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
  }

}

@media (max-width: 640px) {
  .wx-network-map {
    margin-top: 4px;
    margin-bottom: 20px;
  }

  .wx-network-map__canvas {
    height: 240px;
  }
}

.wx-network-regions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--wx-line);
}

.wx-network-region {
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.wx-network-region:not(:nth-child(3n)) {
  border-right: 1px solid var(--wx-line);
}

/* Row separator: first row (items 1–3) in 3-col × 2-row desktop layout */
.wx-network-region:nth-child(-n+3) {
  border-bottom: 1px solid var(--wx-line);
}

.wx-network-region__name {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-weight: 500;
  font-size: 28px;
  line-height: 1.18;
  color: var(--wx-ink-0);
}

.wx-network-region__note {
  margin: 0 !important;
  font-family: var(--wx-font-sans);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.55;
  color: var(--wx-ink-2);
}

.wx-about-hero {
  padding: var(--wx-section-y) 0;
  background: var(--wx-paper-0);
}

.wx-about-hero__title {
  margin: 12px 0 0 !important;
  font-family: var(--wx-font-display);
  font-weight: 400;
  font-size: 60px;
  line-height: 1.05;
  letter-spacing: -0.022em;
  color: var(--wx-ink-0);
  max-width: 880px;
  text-wrap: balance;
}

.wx-about-body {
  padding: 0 0 var(--wx-section-y);
  background: var(--wx-paper-0);
}

.wx-about-row {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 64px;
  padding: 48px 0;
  border-top: 1px solid var(--wx-line);
  align-items: start;
}

.wx-about-row__title {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-weight: 500;
  font-size: 30px;
  line-height: 1.18;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-about-row__body {
  margin: 14px 0 0 !important;
  font-family: var(--wx-font-sans);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.7;
  color: var(--wx-ink-2);
  max-width: 680px;
}

@media (max-width: 1023px) {
  .wx-network-regions {
    grid-template-columns: 1fr 1fr;
  }

  /* Reset desktop right-border rule; apply 2-col rule */
  .wx-network-region:not(:nth-child(3n)) {
    border-right: 0;
  }

  .wx-network-region:nth-child(odd) {
    border-right: 1px solid var(--wx-line);
  }

  /* Reset desktop row separator; apply 2-col row separators (rows 1 and 2) */
  .wx-network-region:nth-child(-n+3) {
    border-bottom: 0;
  }

  .wx-network-region:not(:nth-last-child(-n+2)) {
    border-bottom: 1px solid var(--wx-line);
  }
}

@media (max-width: 639px) {
  .wx-network-hero {
    padding-bottom: 16px;
  }

  .wx-network-hero__title,
  .wx-about-hero__title {
    font-size: clamp(34px, 8vw, 56px);
  }

  .wx-network-hero__lede {
    font-size: 17px;
  }

  .wx-network-map {
    padding: 0;
    margin-top: 4px;
    margin-bottom: 20px;
    background: #ffffff;
    border-color: transparent;
    box-shadow: none;
  }

  .wx-network-map__canvas {
    height: 240px;
  }

  .wx-globe-visual,
  .wx-globe-visual--home,
  .wx-globe-visual--network {
    width: 100%;
    max-width: 100%;
    aspect-ratio: 1 / 1;
  }

  .wx-home-net__map,
  .wx-network-map {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
  }

  .wx-network-regions {
    grid-template-columns: 1fr;
  }

  .wx-network-region {
    padding: 28px 0;
    border-right: 0 !important;
  }

  /* Reset tablet row-separator rule; mobile uses not(:last-child) */
  .wx-network-region:not(:nth-last-child(-n+2)) {
    border-bottom: 0;
  }

  .wx-network-region:not(:last-child) {
    border-bottom: 1px solid var(--wx-line);
  }

  .wx-about-row {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 32px 0;
  }

  .wx-about-row__title {
    font-size: 22px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   CONTACT PAGE — Sprint 1 Rev 2
   Two-column split: left (intro + audience selector) / right (form card)

   Classes: wx-contact-page, wx-contact-split, wx-contact-left,
            wx-contact-right, wx-contact-intro, wx-contact-selector,
            wx-contact-selector__item, wx-contact-form-card, wx-contact-pf,
            wx-contact-admin-note, wx-contact-direct-section,
            wx-contact-info-grid, wx-contact-info-item
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Two-column split layout ─────────────────────────────────────────────── */

.wx-contact-split {
  display:               grid;
  grid-template-columns: 1fr 1fr;
  gap:                   80px;
  align-items:           start;
}

/* ── Left column ─────────────────────────────────────────────────────────── */

.wx-contact-left {
  display:        flex;
  flex-direction: column;
  gap:            40px;
}

/* Intro: eyebrow + H1 + lede */
.wx-contact-intro {
  display:        flex;
  flex-direction: column;
}

.wx-contact-intro__title {
  font-family:    var(--wx-font-display) !important;
  font-weight:    400 !important;
  font-size:      clamp(36px, 5vw, 58px) !important;
  line-height:    1.08 !important;
  letter-spacing: -0.022em !important;
  color:          var(--wx-ink-0) !important;
  margin:         16px 0 0 !important;
}

.wx-contact-intro__lede {
  font-size:   17px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  color:       var(--wx-ink-2) !important;
  margin:      16px 0 0 !important;
  max-width:   480px;
}

/* ── Audience selector list ──────────────────────────────────────────────── */

.wx-contact-selector {
  list-style: none !important;
  margin:     0 !important;
  padding:    0 !important;
  border-top: 1px solid var(--wx-line);
}

.wx-contact-selector__item {
  display:       flex;
  align-items:   center;
  gap:           12px;
  padding:       15px 0;
  border-bottom: 1px solid var(--wx-line);
  cursor:        pointer;
  user-select:   none;
  outline:       none;
  transition:    background   var(--wx-dur-fast) var(--wx-ease-out),
                 padding-left var(--wx-dur-fast) var(--wx-ease-out);
}

.wx-contact-selector__item:hover {
  background:   var(--wx-paper-1);
  padding-left: 10px;
}

.wx-contact-selector__item:focus-visible {
  outline:        2px solid var(--wx-brand);
  outline-offset: -2px;
}

/* Mono number badge */
.wx-contact-selector__num {
  font-family: var(--wx-font-mono) !important;
  font-size:   11px !important;
  font-weight: 400 !important;
  color:       var(--wx-ink-3) !important;
  min-width:   28px;
  flex-shrink: 0;
  line-height: 1;
  transition:  color var(--wx-dur-fast) var(--wx-ease-out);
}

/* Audience name */
.wx-contact-selector__name {
  font-size:   15px !important;
  font-weight: 400 !important;
  color:       var(--wx-ink-2) !important;
  flex:        1;
  line-height: 1.35;
  transition:  color       var(--wx-dur-fast) var(--wx-ease-out),
               font-weight var(--wx-dur-fast) var(--wx-ease-out);
}

/* "— select" / "— selected →" affordance */
.wx-contact-selector__tag {
  font-family: var(--wx-font-mono) !important;
  font-size:   11px !important;
  color:       var(--wx-ink-4) !important;
  flex-shrink: 0;
  white-space: nowrap;
  transition:  color var(--wx-dur-fast) var(--wx-ease-out);
}

/* Active / selected state */
.wx-contact-selector__item--active .wx-contact-selector__num {
  color: var(--wx-brand) !important;
}

.wx-contact-selector__item--active .wx-contact-selector__name {
  font-weight: 600 !important;
  color:       var(--wx-ink-0) !important;
}

.wx-contact-selector__item--active .wx-contact-selector__tag {
  color: var(--wx-ink-1) !important;
}

/* ── Right column: form card ─────────────────────────────────────────────── */

.wx-contact-right {
  position: sticky;
  top:      80px; /* sits below nav */
}

.wx-contact-form-card {
  background:    #fff;
  border:        1px solid var(--wx-line);
  border-radius: var(--wx-r-4, 4px);
  overflow:      hidden;
}

/* "YOU ARE: AUDIENCE" header bar */
.wx-contact-form-card__header {
  padding:       18px 28px;
  background:    var(--wx-paper-1);
  border-bottom: 1px solid var(--wx-line);
  display:       flex;
  align-items:   center;
  gap:           8px;
}

.wx-contact-form-card__you-are {
  font-family:    var(--wx-font-mono) !important;
  font-size:      10px !important;
  font-weight:    400 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color:          var(--wx-ink-3) !important;
  flex-shrink:    0;
}

.wx-contact-form-card__audience {
  font-family:    var(--wx-font-mono) !important;
  font-size:      10px !important;
  font-weight:    700 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color:          var(--wx-ink-0) !important;
  transition:     opacity 120ms ease;
}

/* Card body */
.wx-contact-form-card__body {
  padding: 32px 28px 36px;
}

/* ── Placeholder form ────────────────────────────────────────────────────── */

.wx-contact-pf {
  display:        flex;
  flex-direction: column;
  gap:            18px;
}

.wx-contact-pf__field {
  display:        flex;
  flex-direction: column;
  gap:            6px;
}

.wx-contact-pf__label {
  font-size:      10px !important;
  font-weight:    600 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color:          var(--wx-ink-3) !important;
  margin:         0 !important;
}

/* Consent checkbox row: override the 10px-uppercase field-label style */
.wx-contact-pf__field:has(input[type="checkbox"]) .wx-contact-pf__label {
  font-size:      13px !important;
  font-weight:    400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color:          var(--wx-ink-2) !important;
  display:        flex;
  align-items:    flex-start;
  gap:            10px;
  line-height:    1.5;
  cursor:         pointer;
}
.wx-contact-pf__field:has(input[type="checkbox"]) input[type="checkbox"] {
  flex:       0 0 auto;
  margin-top: 3px !important;
  width:      16px;
  height:     16px;
  cursor:     pointer;
}
.wx-contact-pf__checkbox-text {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
}

.wx-consent-option {
  display: flex !important;
  align-items: flex-start;
  gap: 12px;
  margin: 0 0 18px !important;
  font-family: var(--wx-font-sans);
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.6;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--wx-ink-2) !important;
  cursor: pointer;
}

.wx-consent-option input[type="checkbox"] {
  flex: 0 0 auto;
  margin-top: 0.35em !important;
  width: 16px;
  height: 16px;
  cursor: pointer;
}

.wx-consent-option span {
  flex: 1 1 auto;
  min-width: 0;
  text-transform: none !important;
}

.wx-consent-option a {
  text-decoration: underline !important;
}

@media (max-width: 640px) {
  .wx-consent-option {
    gap: 10px;
    align-items: flex-start;
  }
}

.wx-contact-pf__input,
.wx-contact-pf__textarea {
  width:              100%;
  box-sizing:         border-box;
  background:         #fff;
  border:             1px solid var(--wx-line);
  border-radius:      var(--wx-r-2, 2px);
  padding:            10px 14px;
  font-family:        var(--wx-font-display) !important;
  font-size:          15px;
  color:              var(--wx-ink-0);
  line-height:        1.5;
  outline:            none;
  -webkit-appearance: none;
  transition:         border-color var(--wx-dur-fast) var(--wx-ease-out),
                      box-shadow   var(--wx-dur-fast) var(--wx-ease-out);
}

.wx-contact-pf__input:focus,
.wx-contact-pf__textarea:focus {
  border-color: var(--wx-brand);
  box-shadow:   0 0 0 3px rgba(6, 114, 181, 0.1);
}

.wx-contact-pf__textarea {
  resize:     vertical;
  min-height: 96px;
}

.wx-contact-pf__field--submit {
  margin-top: 6px;
}

/* Admin-only setup note — compact and visually secondary; never shown to visitors */
.wx-contact-admin-note {
  margin-top:  12px;
  font-size:   12px !important;
  line-height: 1.5 !important;
  color:       var(--wx-ink-4) !important;
}

.wx-contact-admin-note code {
  font-family: var(--wx-font-mono);
  font-size:   11px;
  color:       var(--wx-ink-3);
}

.wx-lead-error {
  box-sizing: border-box;
  width: 100%;
  margin: 0 0 18px;
  padding: 12px 14px;
  border-left: 3px solid var(--wx-accent);
  background: var(--wx-accent-tint);
  color: var(--wx-ink-1);
  font-family: var(--wx-font-sans);
  font-size: 14px;
  line-height: 1.5;
}

.wx-insights-subscribe__form .wx-lead-error {
  grid-column: 1 / -1;
}

/* ── Lead Intake privacy notice modal ───────────────────────────────────── */

.wx-privacy-modal[hidden] {
  display: none !important;
}

.wx-privacy-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.wx-privacy-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(14, 25, 36, 0.62);
}

.wx-privacy-modal__panel {
  position: relative;
  width: min(100%, 620px);
  max-height: min(78vh, 680px);
  overflow: auto;
  background: var(--wx-paper-0);
  border: 1px solid var(--wx-line);
  border-radius: var(--wx-r-2, 2px);
  box-shadow: 0 24px 72px rgba(14, 25, 36, 0.24);
  padding: 28px;
  outline: none;
}

.wx-privacy-modal__close {
  position: absolute;
  top: 12px;
  right: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--wx-line);
  border-radius: 50%;
  background: var(--wx-paper-0);
  color: var(--wx-ink-1);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.wx-privacy-modal__title {
  margin: 0 40px 16px 0 !important;
  font-family: var(--wx-font-display);
  font-size: 22px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--wx-ink-0);
}

.wx-privacy-modal__body p {
  margin: 0 0 12px !important;
  font-family: var(--wx-font-sans);
  font-size: 14px;
  line-height: 1.65;
  color: var(--wx-ink-2);
}

.wx-privacy-modal__body p:last-child {
  margin-bottom: 0 !important;
}

.wx-privacy-modal-is-open {
  overflow: hidden;
}

.wx-privacy-modal-trigger {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ── §2 Direct contact section ───────────────────────────────────────────── */

.wx-contact-direct-section {
  padding-top: calc(var(--wx-section-y) * 0.5) !important;
}

.wx-contact-info-grid {
  display:               grid;
  grid-template-columns: repeat(4, 1fr);
  gap:                   0;
  border-top:            1px solid var(--wx-line);
}

.wx-contact-info-item {
  padding:        28px 24px 32px;
  border-right:   1px solid var(--wx-line);
  display:        flex;
  flex-direction: column;
  gap:            8px;
}

.wx-contact-info-item:last-child {
  border-right: none;
}

.wx-contact-info-item__label {
  font-family:    var(--wx-font-display);
  font-weight:    600;
  font-size:      var(--wx-fs-eyebrow);
  letter-spacing: var(--wx-ls-eyebrow);
  text-transform: uppercase;
  color:          var(--wx-ink-3);
}

.wx-contact-info-item__value {
  font-size:   16px;
  color:       var(--wx-ink-0);
  line-height: 1.45;
}

a.wx-contact-info-item__value {
  text-decoration: none;
  transition: color var(--wx-dur-fast) var(--wx-ease-out);
}

a.wx-contact-info-item__value:hover {
  color: var(--wx-accent);
}

/* ── Responsive ──────────────────────────────────────────────────────────── */

/* Tablet: tighten the column gap */
@media (max-width: 1023px) {
  .wx-contact-split {
    gap: 56px;
  }
}

/* Tablet: stack to single column, form card below selector */
@media (max-width: 767px) {
  .wx-contact-split {
    grid-template-columns: 1fr;
    gap:                   48px;
  }

  .wx-contact-right {
    position: static; /* un-sticky when stacked */
  }

  .wx-contact-intro__lede {
    max-width: none;
  }

  .wx-contact-selector__item:hover {
    padding-left: 0; /* no indent on touch */
  }
}

/* Direct contact grid: 2-col on tablet */
@media (max-width: 859px) {
  .wx-contact-info-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .wx-contact-info-item {
    border-right: 1px solid var(--wx-line) !important;
  }
  .wx-contact-info-item:nth-child(2n),
  .wx-contact-info-item:last-child {
    border-right: none !important;
  }
  .wx-contact-info-item:nth-child(-n+2) {
    border-bottom: 1px solid var(--wx-line);
  }
}

/* Direct contact grid: 1-col on mobile */
@media (max-width: 639px) {
  .wx-contact-info-grid {
    grid-template-columns: 1fr;
  }
  .wx-contact-info-item {
    border-right:  none !important;
    border-bottom: 1px solid var(--wx-line) !important;
    padding:       20px 0;
  }
  .wx-contact-info-item:last-child {
    border-bottom: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   SPRINT 2 — INSIGHTS LISTING
   New selectors are scoped to .wx-insights-*.
   ═══════════════════════════════════════════════════════════════ */

.wx-insights-hero {
  padding-bottom: 76px;
}

.wx-insights-hero__inner {
  max-width: 860px;
}

.wx-insights-hero__title {
  margin-top: 18px !important;
  font-family: var(--wx-font-display);
  font-size: clamp(42px, 7vw, 76px);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -0.02em;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-insights-hero__lede {
  margin-top: 22px !important;
  max-width: 640px;
  font-size: 18px;
  line-height: 1.65;
  color: var(--wx-ink-2);
}

.wx-insights-tabs {
  border-top: 1px solid var(--wx-line);
  border-bottom: 1px solid var(--wx-line);
}

.wx-insights-tabs__list {
  display: flex;
  gap: 36px;
  overflow-x: auto;
}

.wx-insights-tabs__item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 64px;
  padding-top: 2px;
  border-bottom: 2px solid transparent !important;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 600;
  color: var(--wx-ink-2);
}

.wx-insights-tabs__item span:last-child {
  color: var(--wx-ink-3);
  font-size: 12px;
}

.wx-insights-tabs__item--active {
  color: var(--wx-ink-0);
  border-bottom-color: var(--wx-accent) !important;
}

.wx-insights-filter {
  padding: 32px 0 0;
}

.wx-insights-filter__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.wx-insights-filter__chip {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--wx-line) !important;
  border-radius: var(--wx-r-pill);
  font-size: 13px;
  color: var(--wx-ink-2);
  background: var(--wx-paper-0);
}

.wx-insights-filter__chip--active,
.wx-insights-filter__chip:hover {
  color: var(--wx-ink-0);
  background: var(--wx-paper-1);
  border-color: var(--wx-ink-3) !important;
}

.wx-insights-publication {
  padding-top: 48px;
}

.wx-insights-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--wx-line);
}

.wx-insights-card {
  min-height: 330px;
  border-bottom: 1px solid var(--wx-line);
}

.wx-insights-card:nth-child(odd) {
  border-right: 1px solid var(--wx-line);
}

.wx-insights-card__link {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 100%;
  padding: 34px 34px 30px;
  color: inherit;
  transition: background var(--wx-dur-base) var(--wx-ease-out);
}

.wx-insights-card__link:hover {
  background: var(--wx-paper-1);
}

.wx-insights-card__label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--wx-accent);
}

.wx-insights-card__title {
  font-family: var(--wx-font-display);
  font-size: clamp(24px, 3vw, 34px);
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: -0.018em;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-insights-card__lede {
  max-width: 620px;
  font-size: 16px;
  line-height: 1.68;
  color: var(--wx-ink-2);
}

.wx-insights-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: auto;
  padding-top: 28px;
  font-size: 13px;
  color: var(--wx-ink-3);
}

.wx-insights-empty {
  padding: 48px 0;
  color: var(--wx-ink-2);
}

.wx-insights-empty a {
  display: inline-block;
  margin-top: 12px;
  color: var(--wx-accent);
  font-weight: 600;
}

.wx-insights-subscribe {
  padding-top: 0;
}

.wx-insights-subscribe__inner {
  display: grid;
  grid-template-columns: 1fr minmax(320px, 460px);
  gap: 48px;
  align-items: center;
  padding: 42px;
  background: var(--wx-paper-1);
  border: 1px solid var(--wx-line);
}

.wx-insights-subscribe__title {
  margin-top: 10px !important;
  max-width: 620px;
  font-family: var(--wx-font-display);
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 400;
  line-height: 1.18;
  color: var(--wx-ink-0);
}

.wx-insights-subscribe__form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
}

.wx-insights-subscribe__form input {
  min-height: 48px;
  border: 1px solid var(--wx-line);
  border-radius: var(--wx-r-1);
  padding: 0 14px;
  font: inherit;
  color: var(--wx-ink-1);
  background: var(--wx-paper-0);
}

.wx-insights-subscribe__form input[type="checkbox"] {
  min-width: 0;
  width: auto;
  height: auto;
  min-height: 0;
  padding: 0;
  border: 0;
  margin: 3px 8px 0 0;
  flex: 0 0 auto;
}

/* Subscribe consent label: flex alignment so checkbox sits at text top */
.wx-insights-subscribe__form label:not(.screen-reader-text) {
  display:     flex;
  align-items: flex-start;
  gap:         8px;
  font-size:   13px;
  line-height: 1.5;
  color:       var(--wx-ink-2);
  margin-bottom: 4px;
}
.wx-insights-subscribe__form label:not(.screen-reader-text) input[type="checkbox"] {
  margin: 2px 0 0 !important;
}

.wx-insights-subscribe__form button {
  min-height: 48px;
  border: 0;
  border-radius: var(--wx-r-1);
  padding: 0 18px;
  font-weight: 600;
  color: var(--wx-paper-0);
  background: var(--wx-accent);
}

@media (max-width: 799px) {
  .wx-insights-grid,
  .wx-insights-subscribe__inner,
  .wx-insights-subscribe__form {
    grid-template-columns: 1fr;
  }

  .wx-insights-card:nth-child(odd) {
    border-right: 0;
  }

  .wx-insights-card__link {
    padding: 28px 0;
  }

  .wx-insights-subscribe__inner {
    padding: 30px 24px;
  }
}

/* ═══════════════════════════════════════════════════════════════
   SPRINT 2 — SINGLE INSIGHT
   New selectors are scoped to .wx-insight-*.
   ═══════════════════════════════════════════════════════════════ */

.wx-insight-path {
  display: flex;
  gap: 14px;
  align-items: center;
  margin-bottom: 46px;
  font-size: 13px;
  color: var(--wx-ink-3);
}

.wx-insight-path a {
  color: var(--wx-ink-0);
  font-weight: 600;
}

.wx-insight-article {
  position: relative;
  z-index: 0;
}

.wx-insight-hero {
  padding-bottom: 56px;
}

.wx-insight-hero__inner {
  max-width: 900px;
}

.wx-insight-hero__title {
  margin-top: 18px !important;
  font-family: var(--wx-font-display);
  font-weight: 400;
  font-size: clamp(38px, 5vw, 56px);
  line-height: 1.1;
  letter-spacing: 0;
  color: var(--wx-ink-0);
  text-wrap: balance;
  position: relative;
  z-index: 0;
}

.wx-insight-hero__lede {
  margin-top: 24px !important;
  max-width: 720px;
  font-size: 20px;
  font-weight: 300;
  line-height: 1.62;
  color: var(--wx-ink-1);
}

.wx-insight-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-top: 30px;
  font-size: 13px;
  color: var(--wx-ink-3);
}

.wx-insight-rule {
  height: 1px;
  background: var(--wx-line);
}

.wx-insight-body {
  padding-top: 64px;
}

.wx-insight-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 760px);
  gap: 84px;
  align-items: start;
}

.wx-insight-toc {
  position: sticky;
  top: 112px;
  padding-top: 4px;
}

.wx-insight-toc__label {
  margin-bottom: 22px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  color: var(--wx-ink-3);
}

.wx-insight-toc__list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.wx-insight-toc__list li {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 10px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--wx-ink-2);
}

.wx-insight-toc__list li span:first-child {
  color: var(--wx-accent);
  font-family: var(--wx-font-mono);
  font-size: 12px;
}

.wx-insight-body__content {
  font-size: 18px;
  line-height: 1.78;
  color: var(--wx-ink-1);
}

.wx-insight-body__content > * + * {
  margin-top: 1.3em !important;
}

.wx-insight-body__content h2 {
  margin-top: 2.4em !important;
  padding-top: 24px;
  border-top: 1px solid var(--wx-line);
  font-family: var(--wx-font-display);
  font-size: clamp(30px, 3.5vw, 42px);
  font-weight: 400;
  line-height: 1.16;
  letter-spacing: -0.016em;
  color: var(--wx-ink-0);
}

.wx-insight-body__content h3 {
  margin-top: 2em !important;
  font-family: var(--wx-font-display);
  font-size: 24px;
  font-weight: 500;
  line-height: 1.22;
  color: var(--wx-ink-0);
}

.wx-insight-body__content blockquote {
  margin: 34px 0 !important;
  padding: 6px 0 6px 24px;
  border-left: 3px solid var(--wx-accent);
  color: var(--wx-ink-0);
  font-family: var(--wx-font-display);
  font-size: 24px;
  font-weight: 300;
  line-height: 1.45;
}

.wx-insight-body__content ol {
  list-style: decimal-leading-zero !important;
  padding-left: 2.2em !important;
  border-top: 1px solid var(--wx-line);
}

.wx-insight-body__content ol li {
  padding: 16px 0 16px 8px;
  border-bottom: 1px solid var(--wx-line);
}

.wx-insight-body__content ul {
  list-style: disc !important;
  padding-left: 1.2em !important;
}

.wx-insight-related {
  background: var(--wx-paper-1);
}

.wx-insight-related__header {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 48px;
  margin-bottom: 42px;
}

.wx-insight-related__title {
  font-family: var(--wx-font-display);
  font-size: var(--wx-fs-h3);
  font-weight: 400;
  line-height: 1.16;
  color: var(--wx-ink-0);
}

.wx-insight-related__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--wx-line);
}

.wx-insight-related__card {
  min-height: 230px;
  border-right: 1px solid var(--wx-line);
}

.wx-insight-related__card:last-child {
  border-right: 0;
}

.wx-insight-related__link {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
  padding: 30px;
  color: inherit;
}

.wx-insight-related__meta {
  font-size: 11px;
  font-weight: 700;
  color: var(--wx-accent);
  text-transform: uppercase;
  letter-spacing: 0.14em;
}

.wx-insight-related__card-title {
  font-family: var(--wx-font-display);
  font-size: 22px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--wx-ink-0);
}

.wx-insight-related__link p {
  font-size: 14px;
  line-height: 1.62;
  color: var(--wx-ink-2);
}

.wx-insight-bottom-cta {
  background: var(--wx-ink-surface);
  color: var(--wx-paper-0);
  padding: 48px 0;
}

.wx-insight-bottom-cta__inner {
  max-width: var(--wx-col-max);
  margin: 0 auto;
  padding: 0 var(--wx-gutter);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 32px;
  align-items: center;
}

.wx-insight-bottom-cta__title {
  margin-top: 8px !important;
  max-width: 720px;
  font-family: var(--wx-font-display);
  font-size: 36px;
  font-weight: 400;
  line-height: 1.18;
  color: var(--wx-paper-0);
}

@media (max-width: 899px) {
  .wx-insight-hero__title {
    font-size: clamp(34px, 9vw, 44px);
    line-height: 1.12;
  }

  .wx-insight-layout,
  .wx-insight-related__header,
  .wx-insight-bottom-cta__inner {
    grid-template-columns: 1fr;
  }

  .wx-insight-toc {
    position: static;
    border-bottom: 1px solid var(--wx-line);
    padding-bottom: 24px;
  }

  .wx-insight-related__grid {
    grid-template-columns: 1fr;
  }

  .wx-insight-related__card {
    border-right: 0;
    border-bottom: 1px solid var(--wx-line);
  }
}

/* ═══════════════════════════════════════════════════════════════
   SPRINT 3 — HOME PAGE
   New selectors are scoped to .wx-home-*.
   ═══════════════════════════════════════════════════════════════ */

.wx-home-hero {
  position: relative;
  overflow: hidden;
  padding: 96px 0 64px;
}

.wx-home-hero__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.18;
  background-image:
    linear-gradient(var(--wx-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--wx-line) 1px, transparent 1px);
  background-size: 48px 48px;
}

.wx-home-hero__inner,
.wx-home-section__inner,
.wx-home-cta__inner {
  max-width: var(--wx-col-max);
  margin: 0 auto;
  padding: 0 var(--wx-gutter);
}

.wx-home-hero__inner {
  position: relative;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 64px;
  align-items: end;
}

.wx-home-hero__copy {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.wx-home-eyebrow {
  margin: 0 !important;
  font-family: var(--wx-font-sans);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--wx-ink-2);
}

.wx-home-eyebrow--accent {
  color: var(--wx-accent) !important;
}

.wx-home-hero__title {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: clamp(48px, 6vw, 80px);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -0.025em;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-home-hero__title em {
  color: var(--wx-accent);
  font-style: italic;
}

body.lang-zh .wx-home-hero__title em {
  margin-inline-end: 0.08em;
}

.wx-home-hero__lede {
  max-width: 620px;
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 22px;
  font-weight: 300;
  line-height: 1.55;
  color: var(--wx-ink-1);
}

.wx-home-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 8px;
}

.wx-home-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  padding: 13px 22px;
  border: 1px solid transparent;
  border-radius: 2px;
  font-family: var(--wx-font-sans);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.01em;
  text-decoration: none;
  cursor: pointer;
  transition: all 200ms var(--wx-ease-out);
}

.wx-home-btn--primary {
  background: var(--wx-accent);
  color: var(--wx-paper-0);
}

.wx-home-btn--primary:hover {
  background: var(--wx-accent-hover);
  color: var(--wx-paper-0);
}

.wx-home-btn--ghost {
  padding: 13px 0;
  border: 0;
  border-bottom: 1px solid currentColor;
  border-radius: 0;
  background: transparent;
  color: var(--wx-ink-0);
}

.wx-home-btn--ghost:hover {
  color: var(--wx-accent);
}

.wx-home-btn--light {
  background: var(--wx-paper-0) !important;
  color: var(--wx-ink-0) !important;
  border-color: var(--wx-paper-0) !important;
}

.wx-home-btn--light:hover {
  background: var(--wx-paper-2) !important;
  color: var(--wx-ink-0) !important;
  border-color: var(--wx-paper-2) !important;
}

.wx-home-section--dark .wx-home-btn--light,
.wx-home-cta .wx-home-btn--light {
  background: var(--wx-paper-0) !important;
  color: var(--wx-ink-0) !important;
  border-color: var(--wx-paper-0) !important;
}

.wx-home-section--dark .wx-home-btn--light:hover,
.wx-home-cta .wx-home-btn--light:hover {
  background: var(--wx-paper-2) !important;
  color: var(--wx-ink-0) !important;
  border-color: var(--wx-paper-2) !important;
}

.wx-home-hero__metrics {
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding-left: 32px;
  border-left: 1px solid var(--wx-line);
}

.wx-home-metric {
  display: flex;
  gap: 14px;
  align-items: baseline;
}

.wx-home-metric__n {
  font-family: var(--wx-font-display);
  font-size: 48px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--wx-ink-0);
  font-feature-settings: "lnum", "tnum";
}

.wx-home-metric__l {
  max-width: 200px;
  font-family: var(--wx-font-sans);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
  color: var(--wx-ink-2);
}

.wx-home-section {
  padding: var(--wx-section-y) 0;
  background: var(--wx-paper-0);
}

.wx-home-section--paper {
  background: var(--wx-paper-1);
}

.wx-home-section--dark {
  background: var(--wx-ink-surface);
  color: var(--wx-paper-0);
}

.wx-home-head {
  margin-bottom: 64px;
}

.wx-home-head__grid {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 48px;
  align-items: start;
  margin-top: 20px;
}

.wx-home-head__title {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 2.875rem;
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-home-head__lede {
  max-width: 620px;
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 1.375rem;
  font-weight: 300;
  line-height: 1.55;
  letter-spacing: -0.005em;
  color: var(--wx-ink-1);
}

.wx-home-section--dark .wx-home-head__title {
  color: var(--wx-paper-0);
}

.wx-home-section--dark .wx-home-head__lede {
  color: var(--wx-paper-2);
}

.wx-home-role__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--wx-line);
}

.wx-home-role__card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 280px;
  padding: 36px 32px;
}

.wx-home-role__card:not(:last-child) {
  border-right: 1px solid var(--wx-line);
}

.wx-home-role__card h3 {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 26px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-home-role__card p:not(.wx-home-eyebrow) {
  margin: 0 !important;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  color: var(--wx-ink-2);
}

.wx-home-method__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--wx-line);
}

.wx-home-method__cell {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 220px;
  padding: 32px 28px 36px;
}

.wx-home-method__cell:not(:nth-child(3n)) {
  border-right: 1px solid var(--wx-line);
}

.wx-home-method__cell:nth-child(-n+3) {
  border-bottom: 1px solid var(--wx-line);
}

.wx-home-method__num {
  font-family: var(--wx-font-display);
  font-size: 44px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--wx-ink-0);
  font-feature-settings: "lnum", "tnum";
}

.wx-home-method__rule {
  width: 28px;
  height: 1px;
  background: var(--wx-accent);
}

.wx-home-method__cell h3 {
  margin: 8px 0 0 !important;
  font-family: var(--wx-font-sans);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--wx-ink-0);
}

.wx-home-method__cell p {
  margin: auto 0 0 !important;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.55;
  color: var(--wx-ink-2);
}

.wx-home-aud__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid var(--wx-line);
}

.wx-home-aud__card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 240px;
  padding: 32px 32px 36px;
  color: inherit;
  text-decoration: none;
  transition: background 200ms var(--wx-ease-out);
}

.wx-home-aud__card:nth-child(odd) {
  border-right: 1px solid var(--wx-line);
}

.wx-home-aud__card:nth-child(-n+2) {
  border-bottom: 1px solid var(--wx-line);
}

.wx-home-aud__card:hover {
  background: var(--wx-paper-1);
}

.wx-home-aud__card h3 {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 28px;
  font-weight: 500;
  line-height: 1.18;
  letter-spacing: -0.01em;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-home-aud__cn {
  font-family: var(--wx-font-display);
  font-size: 15px;
  font-weight: 400;
  color: var(--wx-ink-2);
}

.wx-home-aud__card p {
  margin: 0 !important;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  color: var(--wx-ink-2);
}

.wx-home-aud__cta {
  align-self: flex-start;
  margin-top: auto;
  padding-bottom: 1px;
  border-bottom: 1px solid currentColor;
  font-size: 13px;
  font-weight: 600;
  color: var(--wx-ink-0);
}

.wx-home-net__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
  gap: 56px;
  align-items: center;
}

.wx-home-net__copy {
  display: flex;
  flex-direction: column;
  gap: 18px;
  max-width: 500px;
}

.wx-home-net__title {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 46px;
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.018em;
  color: var(--wx-paper-0);
  text-wrap: balance;
}

.wx-home-net__title-mobile {
  display: none;
}

.wx-home-net__body {
  max-width: 460px;
  margin: 0 !important;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: var(--wx-paper-2);
}

.wx-home-net__panel {
  padding: 0;
  border: 0;
  background: transparent;
  max-width: 100%;
  overflow: hidden;
  box-shadow: none;
}

.wx-home-net__map {
  color: var(--wx-line-strong);
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

.wx-home-net__map svg {
  display: block;
  width: 100%;
  height: auto;
}

.wx-home-net__dot {
  fill: var(--wx-line-strong);
}

.wx-home-net__dot--accent {
  fill: var(--wx-accent);
}

.wx-home-ins__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 48px;
  padding-top: 36px;
  border-top: 1px solid var(--wx-line);
}

.wx-home-ins__grid > * {
  min-width: 0;
  height: 100%;
}

.wx-home-ins__card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
  height: 100%;
}

.wx-home-ins__card.wx-card-hover {
  padding-top: 12px;
}

.wx-home-ins__card h3 {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 22px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.012em;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-home-ins__card--lg h3 {
  font-size: 22px;
}

.wx-home-ins__card p,
.wx-home-ins__card--lg p {
  margin: 0 !important;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  color: var(--wx-ink-2);
}

.wx-home-ins__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0 12px;
  margin-top: auto;
  padding-top: 4px;
  font-size: 12px;
  font-weight: 400;
  color: var(--wx-ink-3);
}

.wx-home-ins__meta span:not(:last-child)::after {
  content: "·";
  margin-left: 12px;
}

.wx-home-ins__more {
  margin-top: 40px;
  text-align: right;
}

.wx-home-cta {
  margin: 0;
  padding: 48px 0;
  background: var(--wx-ink-surface);
  color: var(--wx-paper-0);
}

.wx-home-cta__inner {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 32px;
  align-items: center;
}

.wx-home-cta__text {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.wx-home-cta__title {
  max-width: 640px;
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 36px;
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: -0.015em;
  color: var(--wx-paper-0);
  text-wrap: balance;
}

.wx-home-empty {
  padding: 24px;
  border: 1px dashed var(--wx-line);
  background: var(--wx-paper-1);
  color: var(--wx-ink-2);
  font-size: 14px;
}

@media (max-width: 1023px) {
  .wx-home-hero__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .wx-home-role__grid,
  .wx-home-method__grid,
  .wx-home-ins__grid {
    grid-template-columns: 1fr 1fr;
  }

  .wx-home-method__cell:not(:nth-child(3n)) {
    border-right: 0;
  }

  .wx-home-method__cell:nth-child(odd) {
    border-right: 1px solid var(--wx-line);
  }

  .wx-home-method__cell:nth-child(-n+4) {
    border-bottom: 1px solid var(--wx-line);
  }

  .wx-home-role__card:not(:last-child) {
    border-right: 0;
  }

  .wx-home-role__card:nth-child(odd) {
    border-right: 1px solid var(--wx-line);
  }

  .wx-home-role__card:nth-child(-n+2) {
    border-bottom: 1px solid var(--wx-line);
  }
}

@media (max-width: 859px) {
  .wx-home-head {
    margin-bottom: 40px;
  }

  .wx-home-head__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .wx-home-head__title {
    font-size: clamp(28px, 7vw, 42px);
  }

  .wx-home-head__lede {
    font-size: 17px;
  }

  .wx-home-net__grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .wx-home-net__copy,
  .wx-home-net__body,
  .wx-home-net__panel,
  .wx-home-net__map {
    width: 100%;
    max-width: 100%;
  }

  .wx-home-net__title-desktop {
    display: none;
  }

  .wx-home-net__title-mobile {
    display: inline;
  }

  .wx-home-net__panel {
    max-width: 100%;
    overflow: hidden;
  }

  .wx-home-cta__inner {
    grid-template-columns: 1fr;
    gap: 24px;
    align-items: start;
  }

  .wx-home-cta__title {
    width: 100%;
    max-width: 100%;
    font-size: 26px;
    text-wrap: pretty;
  }
}

@media (max-width: 639px) {
  .wx-home-hero {
    padding: 48px 0 32px;
  }

  .wx-home-hero__copy {
    gap: 20px;
  }

  .wx-home-hero__title {
    font-size: clamp(38px, 9vw, 56px);
  }

  /* ZH titles are denser — lower the floor so hero doesn't consume the viewport */
  body.lang-zh .wx-home-hero__title {
    font-size: clamp(32px, 7vw, 48px);
  }

  /* Keep the ZH accent phrase (em) together — prevents "执行驱/动型" splits */
  body.lang-zh .wx-home-hero__title em {
    display: inline-block;
  }

  .wx-home-hero__lede {
    font-size: 17px;
  }

  .wx-home-hero__actions {
    justify-content: flex-start;
    align-items: flex-start;
    text-align: left;
    margin-left: 0;
    padding-left: 0;
  }

  .wx-home-hero__actions .wx-home-btn {
    align-self: flex-start;
    margin-left: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
  }

  .wx-home-hero__metrics {
    flex-direction: column;
    gap: 20px;
    padding-top: 32px;
    padding-left: 0;
    border-top: 1px solid var(--wx-line);
    border-left: 0;
  }

  .wx-home-metric {
    flex: none;
    width: 100%;
  }

  .wx-home-metric__l {
    max-width: none;
  }

  .wx-home-metric__n {
    font-size: 40px;
  }

  .wx-home-role__grid,
  .wx-home-method__grid,
  .wx-home-aud__grid,
  .wx-home-net__grid,
  .wx-home-ins__grid,
  .wx-home-cta__inner {
    grid-template-columns: 1fr;
  }

  .wx-home-role__card {
    min-height: 0;
    padding: 28px 0;
    border-right: 0 !important;
  }

  .wx-home-role__card:not(:last-child) {
    border-bottom: 1px solid var(--wx-line);
  }

  .wx-home-method__cell {
    min-height: 0;
    padding: 28px 0 32px;
    border-right: 0 !important;
  }

  .wx-home-method__cell:not(:last-child) {
    border-bottom: 1px solid var(--wx-line);
  }

  .wx-home-aud__card {
    min-height: 0;
    padding: 28px 0 32px;
    border-right: 0 !important;
  }

  .wx-home-aud__card:not(:last-child) {
    border-bottom: 1px solid var(--wx-line);
  }

  .wx-home-net__grid {
    gap: 40px;
  }

  .wx-home-net__title {
    font-size: 32px;
  }

  .wx-home-net__panel {
    padding: 0;
  }

  .wx-home-ins__grid {
    gap: 36px;
  }

  .wx-home-ins__card:nth-child(n+3) {
    display: none;
  }

  .wx-home-ins__more {
    text-align: left;
  }

  .wx-home-cta {
    padding: 40px 0;
  }

  .wx-home-cta__inner {
    gap: 24px;
    align-items: start;
  }

  .wx-home-cta__title {
    font-size: 26px;
  }
}

/* ═══════════════════════════════════════════════════════════════
   SPRINT 2 — RESOURCE LANDING
   New selectors are scoped to .wx-resource-*.
   ═══════════════════════════════════════════════════════════════ */

.wx-resource-admin-note {
  margin-bottom: 32px;
  padding: 14px 18px;
  border-left: 3px solid var(--wx-accent);
  background: var(--wx-accent-tint);
  color: var(--wx-ink-1);
  font-size: 14px;
}

/* .wx-resource-hero__grid defined in the Sprint 2 page-resource-landing block below */

.wx-resource-hero__meta {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.wx-resource-hero__facts {
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 13px;
  color: var(--wx-ink-3);
}

.wx-resource-hero__title {
  font-family: var(--wx-font-display);
  font-weight: 400;
  font-size: clamp(38px, 6vw, 64px);
  line-height: 1.06;
  letter-spacing: -0.02em;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-resource-hero__lede {
  margin-top: 24px !important;
  max-width: 720px;
  font-size: var(--wx-fs-lead);
  font-weight: 300;
  line-height: 1.55;
  color: var(--wx-ink-1);
}

.wx-resource-summary {
  padding-top: 0;
}

.wx-resource-summary__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(320px, 0.8fr);
  gap: 56px;
  align-items: start;
}

.wx-resource-summary__content {
  padding-top: 8px;
}

.wx-resource-summary__body {
  margin-top: 24px;
  font-size: 18px;
  line-height: 1.75;
  color: var(--wx-ink-1);
}

.wx-resource-summary__body > * + * {
  margin-top: 1.1em !important;
}

.wx-resource-download {
  position: sticky;
  top: 112px;
  padding: 28px;
  border: 1px solid var(--wx-line);
  background: var(--wx-paper-0);
}

.wx-resource-download__header {
  margin-bottom: 24px;
}

.wx-resource-download__title {
  margin-top: 8px !important;
  font-family: var(--wx-font-display);
  font-size: 28px;
  font-weight: 400;
  line-height: 1.2;
  color: var(--wx-ink-0);
}

.wx-resource-download__form {
  margin-bottom: 20px;
}

.wx-resource-download__placeholder {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 20px;
}

.wx-resource-download__placeholder label {
  font-size: 12px;
  font-weight: 600;
  color: var(--wx-ink-2);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.wx-resource-download__placeholder p {
  font-size: 12px;
  line-height: 1.55;
  color: var(--wx-ink-3);
}

.wx-resource-download__input {
  height: 42px;
  border: 1px solid var(--wx-line);
  background: var(--wx-paper-1);
}

.wx-resource-download__disabled {
  display: block;
  font-size: 13px;
  color: var(--wx-ink-3);
}

.wx-resource-columns {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 56px;
}

.wx-resource-list {
  margin-top: 28px !important;
  border-top: 1px solid var(--wx-line);
}

.wx-resource-list li {
  padding: 18px 0;
  border-bottom: 1px solid var(--wx-line);
  font-size: 16px;
  line-height: 1.6;
  color: var(--wx-ink-1);
}

.wx-resource-related__header {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 48px;
  margin-bottom: 40px;
}

.wx-resource-related__title {
  font-family: var(--wx-font-display);
  font-size: var(--wx-fs-h3);
  font-weight: 400;
  line-height: 1.16;
  color: var(--wx-ink-0);
}

.wx-resource-related__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 360px));
  justify-content: start;
  border-top: 1px solid var(--wx-line);
}

.wx-resource-related__card {
  min-height: 220px;
  border-right: 1px solid var(--wx-line);
}

.wx-resource-related__card:last-child {
  border-right: 0;
}

.wx-resource-related__link {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
  padding: 28px;
  color: inherit;
}

.wx-resource-related__meta {
  font-size: 12px;
  font-weight: 600;
  color: var(--wx-ink-3);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.wx-resource-related__card-title {
  font-family: var(--wx-font-display);
  font-size: 22px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--wx-ink-0);
}

.wx-resource-related__link p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--wx-ink-2);
}

@media (max-width: 899px) {
  .wx-resource-hero__grid,
  .wx-resource-summary__grid,
  .wx-resource-columns,
  .wx-resource-related__header {
    grid-template-columns: 1fr;
  }

  .wx-resource-download {
    position: static;
  }

  .wx-resource-related__grid {
    grid-template-columns: 1fr;
  }

  .wx-resource-related__card {
    border-right: 0;
    border-bottom: 1px solid var(--wx-line);
  }
}

@media (max-width: 639px) {
  .wx-resource-download {
    padding: 22px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   CAPABILITY DETAIL PAGE  (page-capability-detail.php)
   All classes scoped under .wx-cap-detail-* per handoff §19.
   Reuses existing tokens — no new CSS variables introduced.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Admin notice (visible to logged-in editors only) ───────────────────────── */
.wx-cap-detail-admin-notice {
  background:  #fffbe6;
  border-left: 3px solid #f0b429;
  padding:     12px var(--wx-gutter);
  font-family: var(--wx-font-sans);
  font-size:   13px;
  color:       #555;
  max-width:   1280px;
  margin:      24px auto 0;
}

/* ── Shared eyebrow ──────────────────────────────────────────────────────────── */
.wx-cap-detail-eyebrow {
  margin:         0 !important;
  font-family:    var(--wx-font-sans);
  font-weight:    600;
  font-size:      12px;
  line-height:    1.2;
  letter-spacing: .18em;
  text-transform: uppercase;
  color:          var(--wx-ink-2);
}
.wx-cap-detail-eyebrow--accent { color: var(--wx-brand) !important; }

/* ═══════════════════════════════════════════════════════════════
   STRICT PARITY — INSIGHTS / SINGLE INSIGHT / RESOURCE LANDING
   Overrides the older Sprint 2 rules with WExAct-v4 scoped styles.
   ═══════════════════════════════════════════════════════════════ */

.wx-page--insights .wx-insights-hero {
  padding-bottom: var(--wx-section-y);
}

.wx-page--insights .wx-insights-hero__title {
  max-width: 980px;
  margin: 22px 0 24px !important;
  font-family: var(--wx-font-display);
  font-size: 60px;
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -0.022em;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-page--insights .wx-insights-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 28px;
  align-items: baseline;
  margin-top: 24px;
  padding-top: 14px;
  border-top: 1px solid var(--wx-line);
  border-bottom: 0;
}

.wx-page--insights .wx-insights-tab {
  display: inline-flex;
  align-items: baseline;
  min-height: 0;
  padding: 8px 0;
  border-bottom: 2px solid transparent !important;
  font-family: var(--wx-font-display);
  font-size: 22px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--wx-ink-3);
  white-space: nowrap;
}

.wx-page--insights .wx-insights-tab span {
  margin-left: 8px;
  font-family: var(--wx-font-mono);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.06em;
  color: var(--wx-ink-3);
}

.wx-page--insights .wx-insights-tab--active {
  color: var(--wx-ink-0);
  border-bottom-color: var(--wx-accent) !important;
}

.wx-page--insights .wx-insights-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.wx-page--insights .wx-insights-chip {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border: 1px solid var(--wx-line) !important;
  border-radius: 999px;
  font-family: var(--wx-font-sans);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--wx-ink-1);
  background: transparent;
}

.wx-page--insights .wx-insights-chip--on {
  color: var(--wx-paper-0);
  background: var(--wx-ink-0);
}

.wx-page--insights .wx-insights-list {
  padding-top: 0;
}

.wx-page--insights .wx-insights-grid {
  display: grid;
  border-top: 1px solid var(--wx-line);
  padding-top: 40px;
}

.wx-page--insights .wx-insights-grid--articles {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 56px 64px;
}

.wx-page--insights .wx-insights-grid--wp {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
}

.wx-insight-card {
  min-height: 0;
  border: 0;
}

.wx-insight-card__link {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 100%;
  padding: 0;
  color: inherit;
}

.wx-insight-card__title {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 22px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.012em;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-insight-card--large .wx-insight-card__title,
.wx-page--insights .wx-insight-card__title {
  font-size: 28px;
}

.wx-insight-card__lede {
  margin: 0 !important;
  font-family: var(--wx-font-sans);
  font-size: 16px;
  line-height: 1.6;
  color: var(--wx-ink-2);
}

.wx-insight-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0 12px;
  margin-top: 4px;
  padding-top: 0;
  font-family: var(--wx-font-sans);
  font-size: 12px;
  line-height: 1.4;
  color: var(--wx-ink-3);
}

.wx-resource-card,
.wx-resource-card__link {
  display: flex;
  flex-direction: column;
  gap: 14px;
  color: inherit;
}

.wx-resource-card__cover {
  aspect-ratio: 3 / 4;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
  padding: 22px;
  border: 1px solid var(--wx-line);
  background: var(--wx-brand);
  transition: transform 240ms cubic-bezier(.22,1,.36,1);
}

.wx-resource-card__link:hover .wx-resource-card__cover {
  transform: translateY(-2px);
}

.wx-resource-card__cross,
.wx-resource-cover__cross {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 32px;
  height: 32px;
  opacity: 0.4;
}

.wx-resource-cover__cross {
  top: 20px;
  right: 20px;
  width: 48px;
  height: 48px;
}

.wx-resource-card__cross::before,
.wx-resource-card__cross::after,
.wx-resource-cover__cross::before,
.wx-resource-cover__cross::after {
  content: "";
  position: absolute;
  background: rgba(255,255,255,0.9);
}

.wx-resource-card__cross::before,
.wx-resource-cover__cross::before {
  left: 0;
  right: 0;
  top: 50%;
  height: 1px;
}

.wx-resource-card__cross::after,
.wx-resource-cover__cross::after {
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
}

.wx-resource-card__top,
.wx-resource-cover__top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-family: var(--wx-font-mono);
  font-size: 10px;
  line-height: 1.3;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.72);
}

.wx-resource-card__cover-title {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.22;
  letter-spacing: -0.01em;
  color: var(--wx-paper-0);
  text-wrap: balance;
}

.wx-resource-card__region {
  margin-top: 12px;
  font-family: var(--wx-font-mono);
  font-size: 10px;
  line-height: 1.3;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
}

.wx-resource-card__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.wx-resource-card__body p {
  display: -webkit-box;
  overflow: hidden;
  margin: 0 !important;
  font-family: var(--wx-font-sans);
  font-size: 13px;
  line-height: 1.55;
  color: var(--wx-ink-2);
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.wx-resource-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0 10px;
  font-family: var(--wx-font-mono);
  font-size: 11px;
  line-height: 1.4;
  letter-spacing: 0.06em;
  color: var(--wx-ink-3);
}

.wx-insights-pager {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--wx-line);
  font-family: var(--wx-font-sans);
  font-size: 13px;
  color: var(--wx-ink-1);
}

.wx-insights-pager__disabled {
  color: var(--wx-ink-4);
}

.wx-insights-pager__nums {
  display: flex;
  gap: 4px;
}

.wx-insights-pager__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--wx-line) !important;
  font-family: var(--wx-font-mono);
  font-size: 12px;
  color: var(--wx-ink-1);
}

.wx-insights-pager__num--on {
  color: var(--wx-paper-0) !important;
  background: var(--wx-ink-0);
  border-color: var(--wx-ink-0) !important;
}

.wx-page--insights .wx-insights-subscribe {
  padding-top: 0;
}

.wx-page--insights .wx-insights-subscribe__inner {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: center;
  padding: 36px;
  border: 1px solid var(--wx-line);
  background: var(--wx-paper-1);
}

.wx-page--insights .wx-insights-subscribe__title {
  margin: 18px 0 0 !important;
  font-family: var(--wx-font-display);
  font-size: 22px;
  font-weight: 500;
  line-height: 1.22;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-page--insights .wx-insights-subscribe__form {
  display: block;
}

.wx-page--insights .wx-insights-subscribe__form input {
  box-sizing: border-box;
  min-width: 260px;
  height: 44px;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid var(--wx-ink-3);
  border-right: 0;
  border-radius: 0;
  outline: none;
  font-family: var(--wx-font-sans);
  font-size: 14px;
  line-height: 20px;
  color: var(--wx-ink-0);
  background: var(--wx-paper-0);
}

.wx-page--insights .wx-insights-subscribe__form input[type="checkbox"] {
  min-width: 0;
  width: auto;
  height: auto;
  min-height: 0;
  padding: 0;
  border: 0;
  margin: 3px 8px 0 0;
  flex: 0 0 auto;
}

.wx-page--insights .wx-insights-subscribe__form button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 112px;
  height: 44px;
  min-height: 44px;
  padding: 0 22px;
  border: 0;
  border-radius: 0;
  font-family: var(--wx-font-sans);
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
  color: var(--wx-paper-0);
  background: var(--wx-accent);
  white-space: nowrap;
}

.wx-page--insights .wx-insights-subscribe__form input:focus {
  border-color: var(--wx-accent);
  box-shadow: inset 0 0 0 1px var(--wx-accent);
}

.wx-page--insights .wx-insights-subscribe__form button:hover,
.wx-page--insights .wx-insights-subscribe__form button:focus {
  background: var(--wx-ink-0);
}

.wx-insight-breadcrumb,
.wx-resource-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  font-family: var(--wx-font-mono);
  font-size: 11px;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wx-ink-3);
}

.wx-insight-head__titleblock {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: end;
  margin-top: 36px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--wx-line);
}

.wx-insight-head__title {
  max-width: 980px;
  margin: 14px 0 0 !important;
  font-family: var(--wx-font-display);
  font-size: 56px;
  font-weight: 400;
  line-height: 1.06;
  letter-spacing: -0.022em;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-insight-head__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0 14px;
  margin-top: 20px;
  font-family: var(--wx-font-sans);
  font-size: 13px;
  color: var(--wx-ink-3);
}

.wx-insight-head__meta span {
  white-space: nowrap;
}

.wx-insight-body {
  padding-top: 24px;
}

.wx-insight-layout {
  display: grid;
  grid-template-columns: minmax(220px, 240px) minmax(0, 680px);
  gap: clamp(48px, 6vw, 80px);
  align-items: start;
  justify-content: start;
}

.wx-insight-toc {
  position: sticky;
  top: 96px;
  align-self: start;
  padding: 0;
}

.wx-insight-toc__list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 14px !important;
}

.wx-insight-toc__list li,
.wx-insight-toc__item {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  column-gap: 22px;
  align-items: start;
  font-family: var(--wx-font-sans);
  font-size: 13px;
  line-height: 1.35;
  color: var(--wx-ink-2);
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none;
  white-space: normal;
}

.wx-insight-toc__list li span:first-child,
.wx-insight-toc__num {
  font-family: var(--wx-font-mono);
  font-size: 11px;
  line-height: 1.45;
  color: var(--wx-ink-3);
}

.wx-insight-toc__list li a,
.wx-insight-toc__label {
  display: block;
  min-width: 0;
  max-width: none;
  margin: 0;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.35;
  color: inherit;
  border: 0 !important;
  text-decoration: none !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  hyphens: none;
  white-space: normal;
}

.wx-insight-toc__list li a:hover,
.wx-insight-toc__list li a:focus,
.wx-insight-toc__label:hover,
.wx-insight-toc__label:focus {
  color: var(--wx-accent);
}

.wx-insight-article {
  width: 100%;
  max-width: 680px;
}

.wx-insight-article__lede {
  margin: 0 0 28px !important;
  font-family: var(--wx-font-display);
  font-size: 22px;
  font-weight: 300;
  line-height: 1.55;
  color: var(--wx-ink-1);
}

.wx-insight-article__content p {
  margin: 0 0 18px !important;
  font-family: var(--wx-font-sans);
  font-size: 16px;
  line-height: 1.75;
  color: var(--wx-ink-1);
}

.wx-insight-article__content h2 {
  margin: 36px 0 12px !important;
  padding-top: 0;
  border-top: 0;
  font-family: var(--wx-font-display);
  font-size: 28px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.012em;
  color: var(--wx-ink-0);
}

.wx-insight-article__content h3 {
  margin: 24px 0 10px !important;
  font-family: var(--wx-font-sans);
  font-size: 18px;
  font-weight: 600;
  color: var(--wx-ink-0);
}

.wx-insight-article__content blockquote {
  margin: 28px 0 !important;
  padding: 8px 0 8px 20px;
  border-left: 2px solid var(--wx-accent);
  font-family: var(--wx-font-display);
  font-size: 22px;
  font-style: italic;
  font-weight: 400;
  line-height: 1.45;
  color: var(--wx-ink-0);
}

.wx-insight-article__content ul,
.wx-insight-article__content ol {
  margin: 0 0 24px !important;
  padding: 0 !important;
  list-style: none !important;
}

.wx-insight-article__content ol {
  counter-reset: wx-list;
}

.wx-insight-article__content li {
  position: relative;
  padding: 8px 0 8px 28px;
  border-bottom: 1px solid var(--wx-line);
  font-family: var(--wx-font-sans);
  font-size: 15px;
  line-height: 1.55;
  color: var(--wx-ink-1);
}

.wx-insight-article__content ol li {
  counter-increment: wx-list;
}

.wx-insight-article__content ol li::before {
  content: counter(wx-list, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 12px;
  font-family: var(--wx-font-mono);
  font-size: 11px;
  color: var(--wx-accent);
}

.wx-insight-article__content ul li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 18px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--wx-accent);
}

.wx-insight-related,
.wx-resource-related {
  background: var(--wx-paper-1);
}

.wx-insight-related .wx-section-header,
.wx-resource-related .wx-section-header {
  margin-bottom: 32px;
}

.wx-insight-related__grid,
.wx-resource-related__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
  padding-top: 32px;
  border-top: 1px solid var(--wx-line);
}

.wx-resource-related__grid {
  grid-template-columns: repeat(auto-fill, minmax(280px, 360px));
  justify-content: start;
}

.wx-resource-related__grid .wx-resource-card {
  max-width: 360px;
}

.wx-insight-cta {
  padding: 48px 0;
  background: var(--wx-ink-surface);
  color: var(--wx-paper-0);
}

.wx-insight-cta__inner {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 32px;
  align-items: center;
  max-width: var(--wx-col-max);
  margin: 0 auto;
  padding: 0 var(--wx-gutter);
}

.wx-insight-cta__title {
  max-width: 640px;
  margin: 8px 0 0 !important;
  font-family: var(--wx-font-display);
  font-size: 36px;
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: -0.015em;
  color: var(--wx-paper-0);
  text-wrap: balance;
}

.wx-page--single-insight .wx-insight-head {
  padding-bottom: var(--wx-section-y);
}

.wx-page--single-insight .wx-insight-breadcrumb a {
  color: var(--wx-ink-3);
}

.wx-page--single-insight .wx-insight-head__titleblock {
  margin-top: 36px;
  padding-bottom: 32px;
}

.wx-page--single-insight .wx-insight-head__title {
  max-width: 980px;
  font-size: 56px;
  font-weight: 400;
  line-height: 1.06;
  letter-spacing: -0.022em;
}

.wx-page--single-insight .wx-insight-head__meta {
  margin-top: 20px;
  font-size: 13px;
}

.wx-page--single-insight .wx-insight-body {
  padding-top: 24px;
}

.wx-page--single-insight .wx-insight-layout {
  grid-template-columns: minmax(220px, 240px) minmax(0, 680px);
  gap: clamp(48px, 6vw, 80px);
  justify-content: start;
}

.wx-page--single-insight .wx-insight-toc {
  align-self: start;
}

.wx-page--single-insight .wx-insight-toc__list li {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  column-gap: 22px;
  align-items: start;
  font-size: 13px;
  line-height: 1.35;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

.wx-page--single-insight .wx-insight-toc__list li a,
.wx-page--single-insight .wx-insight-toc__label {
  display: block;
  min-width: 0;
  max-width: none;
  margin: 0;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.35;
  color: inherit;
  border: 0 !important;
  text-decoration: none !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  hyphens: none;
  white-space: normal;
}

.wx-page--single-insight .wx-insight-article,
.wx-page--single-insight .wx-insight-content {
  width: 100%;
  max-width: 680px;
}

.wx-page--single-insight .wx-insight-article__lede {
  margin: 0 0 28px !important;
  font-size: 22px;
  font-weight: 300;
  line-height: 1.55;
}

.wx-page--single-insight .wx-insight-article__content h2 {
  margin: 36px 0 12px !important;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.012em;
  scroll-margin-top: 120px;
}

.wx-page--single-insight .wx-insight-article__content h3 {
  margin: 24px 0 10px !important;
  font-size: 18px;
  font-weight: 600;
  line-height: normal;
}

.wx-page--single-insight .wx-insight-article__content p {
  margin: 0 0 18px !important;
  font-size: 16px;
  line-height: 1.75;
  color: var(--wx-ink-1);
}

.wx-page--single-insight .wx-insight-article__content blockquote {
  margin: 28px 0 !important;
  padding: 8px 0 8px 20px;
  border-left: 2px solid var(--wx-accent);
  font-size: 22px;
  font-style: italic;
  font-weight: 400;
  line-height: 1.45;
}

.wx-page--single-insight .wx-insight-article__content li {
  padding: 8px 0 8px 28px;
  font-size: 15px;
  line-height: 1.55;
}

.wx-page--single-insight .wx-insight-article__content ol li::before {
  top: 12px;
  font-size: 11px;
  color: var(--wx-accent);
}

.wx-page--single-insight .wx-insight-article__content ul li::before {
  top: 18px;
}

.wx-page--single-insight:lang(zh) .wx-insight-article__lede,
.wx-page--single-insight:lang(zh-CN) .wx-insight-article__lede {
  line-height: 1.68;
}

.wx-page--single-insight:lang(zh) .wx-insight-article__content p,
.wx-page--single-insight:lang(zh-CN) .wx-insight-article__content p,
.wx-page--single-insight:lang(zh) .wx-insight-article__content li,
.wx-page--single-insight:lang(zh-CN) .wx-insight-article__content li {
  line-height: 1.82;
}

.wx-page--single-insight .wx-insight-related .wx-section-header {
  margin-bottom: 64px;
}

.wx-page--single-insight .wx-insight-related__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
  padding-top: 32px;
}

.wx-page--single-insight .wx-insight-related .wx-insight-card__title {
  font-size: 22px;
}

.wx-page--single-insight .wx-insight-cta {
  padding: 48px 0;
}

.wx-page--single-insight .wx-insight-cta__inner {
  grid-template-columns: 1fr auto;
  gap: 32px;
}

/* Phase 8V: single insight article detail vertical spacing */
.wx-page--single-insight .wx-insight-head__titleblock .wx-eyebrow + .wx-insight-head__title {
  margin-top: 16px !important;
}

.wx-page--single-insight .wx-insight-toc > .wx-eyebrow + .wx-insight-toc__list {
  margin-top: 18px !important;
}

.wx-page--single-insight .wx-insight-cta .wx-eyebrow + .wx-insight-cta__title {
  margin-top: 14px !important;
}

@media (max-width: 768px) {
  .wx-page--single-insight .wx-insight-head__titleblock .wx-eyebrow + .wx-insight-head__title {
    margin-top: 14px !important;
  }

  .wx-page--single-insight .wx-insight-toc > .wx-eyebrow + .wx-insight-toc__list {
    margin-top: 16px !important;
  }

  .wx-page--single-insight .wx-insight-cta .wx-eyebrow + .wx-insight-cta__title {
    margin-top: 12px !important;
  }
}

.wx-resource-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: 64px;
  align-items: start;
  margin-top: 36px;
}

.wx-resource-cover {
  aspect-ratio: 3 / 4;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
  padding: 36px;
  border: 1px solid var(--wx-line);
  background: var(--wx-brand);
}

.wx-resource-cover__top {
  font-size: 11px;
  letter-spacing: 0.14em;
  color: rgba(255,255,255,0.75);
}

.wx-resource-cover__title {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 32px;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--wx-paper-0);
  text-wrap: balance;
}

.wx-resource-cover__region {
  margin-top: 18px;
  font-family: var(--wx-font-mono);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
}

.wx-resource-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0 10px;
  margin-top: 12px;
  font-family: var(--wx-font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--wx-ink-3);
}

.wx-resource-detail__title {
  margin: 12px 0 16px !important;
  font-family: var(--wx-font-display);
  font-size: 36px;
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--wx-ink-0);
  text-wrap: balance;
}

.wx-resource-detail__lede {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.55;
  color: var(--wx-ink-1);
}

.wx-resource-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid var(--wx-line);
}

.wx-resource-facts div {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.wx-resource-facts span {
  font-family: var(--wx-font-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--wx-ink-3);
}

.wx-resource-facts b {
  font-family: var(--wx-font-sans);
  font-size: 13px;
  font-weight: 500;
  color: var(--wx-ink-1);
}

.wx-resource-toc {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--wx-line);
}

.wx-resource-toc ol {
  display: flex;
  flex-direction: column;
  margin-top: 12px !important;
}

.wx-resource-toc li {
  display: flex;
  gap: 14px;
  padding: 10px 0;
  border-bottom: 1px solid var(--wx-line);
  font-family: var(--wx-font-sans);
  font-size: 14px;
  line-height: 1.5;
  color: var(--wx-ink-1);
}

.wx-resource-toc li span:first-child {
  min-width: 28px;
  font-family: var(--wx-font-mono);
  font-size: 12px;
  color: var(--wx-accent);
}

.wx-resource-notes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 28px;
}

.wx-resource-notes ul {
  margin-top: 12px !important;
  border-top: 1px solid var(--wx-line);
}

.wx-resource-notes li {
  padding: 10px 0;
  border-bottom: 1px solid var(--wx-line);
  font-family: var(--wx-font-sans);
  font-size: 14px;
  line-height: 1.55;
  color: var(--wx-ink-1);
}

.wx-resource-form {
  margin-top: 32px;
  padding: 28px;
  border: 1px solid var(--wx-line);
  background: var(--wx-paper-1);
}

.wx-resource-form form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.wx-resource-form h3,
.wx-resource-success h3 {
  margin: 0 !important;
  font-family: var(--wx-font-display);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--wx-ink-0);
}

.wx-resource-success h3 {
  margin-top: 10px !important;
  font-size: 22px;
}

.wx-resource-success p {
  margin: 8px 0 0 !important;
  font-family: var(--wx-font-sans);
  font-size: 14px;
  line-height: 1.55;
  color: var(--wx-ink-2);
}

.wx-resource-form label:not(.wx-resource-form__check):not(.wx-consent-option) {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.wx-resource-form label:not(.wx-consent-option) > span {
  font-family: var(--wx-font-sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--wx-ink-2);
}

.wx-resource-form input:not([type="checkbox"]),
.wx-resource-form select {
  padding: 8px 0;
  border: 0;
  border-bottom: 1px solid var(--wx-ink-3);
  border-radius: 0;
  outline: none;
  font-family: var(--wx-font-sans);
  font-size: 15px;
  color: var(--wx-ink-1);
  background: transparent;
}

.wx-resource-form__check {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-family: var(--wx-font-sans);
  font-size: 12px;
  line-height: 1.5;
  color: var(--wx-ink-2);
}

.wx-resource-form__check input {
  margin-top: 3px;
}

.wx-resource-form .wx-consent-option {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start;
  gap: 12px;
  margin: 0 0 18px !important;
  font-family: var(--wx-font-sans);
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.6;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--wx-ink-2) !important;
  cursor: pointer;
}

.wx-resource-form .wx-consent-option input[type="checkbox"] {
  flex: 0 0 auto;
  margin: 0.35em 0 0 !important;
  width: 16px;
  height: 16px;
  cursor: pointer;
}

.wx-resource-form .wx-consent-option > span {
  flex: 1 1 auto;
  min-width: 0;
  font-family: var(--wx-font-sans);
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.6;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--wx-ink-2) !important;
}

.wx-resource-form .wx-consent-option a {
  text-decoration: underline !important;
}

.wx-resource-form__ghost,
.wx-resource-form__download {
  display: inline-flex;
  width: fit-content;
  margin-top: 20px;
  padding-bottom: 2px;
  border-bottom: 1px solid currentColor !important;
  font-family: var(--wx-font-sans);
  font-size: 13px;
  font-weight: 600;
  color: var(--wx-ink-0);
}

.wx-resource-form__download {
  margin-top: 0;
  color: var(--wx-accent);
}

/* Whitepaper resource detail: hero and request form spacing */
body.wx-page--resource-landing .wx-resource-detail > .wx-eyebrow + .wx-resource-detail__title {
  margin-top: 16px !important;
  margin-bottom: 20px !important;
}

body.wx-page--resource-landing .wx-resource-detail__lede {
  line-height: 1.7 !important;
}

body.lang-zh.wx-page--resource-landing .wx-resource-detail__lede {
  line-height: 1.75 !important;
}

body.wx-page--resource-landing .wx-resource-form__placeholder > .wx-eyebrow + h3 {
  margin-top: 14px !important;
  line-height: 1.45 !important;
}

body.wx-page--resource-landing .wx-resource-form__placeholder > h3 + form.wx-contact-pf {
  margin-top: 28px !important;
}

body.wx-page--resource-landing .wx-resource-form form.wx-contact-pf {
  gap: 18px;
}

@media (max-width: 768px) {
  body.wx-page--resource-landing .wx-resource-detail > .wx-eyebrow + .wx-resource-detail__title {
    margin-top: 14px !important;
    margin-bottom: 16px !important;
  }

  body.wx-page--resource-landing .wx-resource-detail__lede {
    line-height: 1.68 !important;
  }

  body.lang-zh.wx-page--resource-landing .wx-resource-detail__lede {
    line-height: 1.72 !important;
  }

  body.wx-page--resource-landing .wx-resource-form__placeholder > .wx-eyebrow + h3 {
    margin-top: 12px !important;
  }

  body.wx-page--resource-landing .wx-resource-form__placeholder > h3 + form.wx-contact-pf {
    margin-top: 24px !important;
  }

  body.wx-page--resource-landing .wx-resource-form form.wx-contact-pf {
    gap: 16px;
  }
}

@media (max-width: 859px) {
  .wx-page--single-insight .wx-insight-layout {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .wx-page--single-insight .wx-insight-toc {
    display: none;
  }

  .wx-page--single-insight .wx-insight-article,
  .wx-page--single-insight .wx-insight-content {
    max-width: 100%;
  }
}

@media (max-width: 1023px) {
  .wx-page--insights .wx-insights-grid--wp,
  .wx-insight-related__grid,
  .wx-resource-related__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 859px) {
  .wx-insight-layout {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .wx-insight-toc {
    display: none;
  }

  /* Resource Landing: switch to single-column earlier for tablet */
  .wx-resource-hero__grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .wx-resource-cover {
    aspect-ratio: 4 / 3;
    max-width: 480px;
  }

  /* Subscribe strip: stack at tablet to avoid cramped 2-col layout */
  .wx-page--insights .wx-insights-subscribe__inner {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 28px;
  }

  .wx-page--insights .wx-insights-subscribe__form {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .wx-page--insights .wx-insights-subscribe__form input {
    min-width: 0;
    width: 100%;
  }
}

/* 860–1023px: keep 2-col but constrain form column so the heading has
   enough width to wrap in 2 balanced lines rather than 4 short ones. */
@media (min-width: 860px) and (max-width: 1023px) {
  .wx-page--insights .wx-insights-subscribe__form {
    max-width: 320px;
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .wx-page--insights .wx-insights-subscribe__form input[type="email"] {
    min-width: 0;
    width: 100%;
  }
}

@media (max-width: 799px) {
  .wx-page--insights .wx-insights-tabs {
    gap: 16px;
  }

  .wx-page--insights .wx-insights-tab {
    font-size: 18px;
  }

  .wx-page--insights .wx-insights-grid--articles,
  .wx-resource-hero__grid,
  .wx-insight-head__titleblock,
  .wx-insight-cta__inner,
  .wx-page--insights .wx-insights-subscribe__inner {
    grid-template-columns: 1fr;
  }

  .wx-page--insights .wx-insights-grid--articles {
    gap: 36px;
  }

  .wx-insight-related__grid {
    grid-template-columns: 1fr;
  }

  .wx-resource-hero__grid {
    gap: 36px;
  }

  .wx-resource-notes,
  .wx-resource-facts {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 639px) {
  .wx-page--single-insight .wx-insight-head {
    padding-bottom: 56px;
  }

  .wx-page--single-insight .wx-insight-head__titleblock {
    margin-top: 28px;
    padding-bottom: 24px;
  }

  .wx-page--single-insight .wx-insight-head__meta {
    gap: 4px 10px;
    font-size: 12px;
  }

  .wx-page--insights .wx-insights-hero__title {
    font-size: clamp(32px, 8vw, 52px);
  }

  .wx-page--insights .wx-insights-grid--wp {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }

  .wx-resource-related__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .wx-resource-related__grid .wx-resource-card {
    max-width: none;
  }

  /* Single Insight related: force 1-col on mobile (overrides strict-parity 3-col) */
  .wx-page--single-insight .wx-insight-related__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .wx-resource-card__cover {
    padding: 16px;
  }

  .wx-resource-card__cover-title {
    font-size: 16px;
  }

  .wx-resource-card__body p {
    font-size: 12px;
  }

  .wx-page--insights .wx-insights-subscribe__inner {
    padding: 24px;
  }

  .wx-page--insights .wx-insights-subscribe__form {
    grid-template-columns: 1fr;
  }

  .wx-page--insights .wx-insights-subscribe__form input {
    min-width: 0;
    width: 100%;
    border-right: 1px solid var(--wx-ink-3);
    border-bottom: 0;
  }

  .wx-page--insights .wx-insights-subscribe__form button {
    width: 100%;
  }

  .wx-insights-pager {
    align-items: flex-start;
  }

  .wx-insight-head__title {
    font-size: clamp(28px, 7vw, 48px);
  }

  .wx-insight-article__lede {
    font-size: 18px;
  }

  .wx-insight-article__content h2 {
    font-size: 22px;
  }

  .wx-insight-article__content blockquote {
    font-size: 18px;
  }

  .wx-page--single-insight .wx-insight-head__title {
    font-size: clamp(28px, 7vw, 48px);
    line-height: 1.12;
  }

  .wx-page--single-insight .wx-insight-article__lede {
    font-size: 18px;
  }

  .wx-page--single-insight .wx-insight-article__content h2 {
    font-size: 22px;
  }

  .wx-page--single-insight .wx-insight-article__content blockquote {
    font-size: 18px;
  }

  .wx-insight-cta__title {
    font-size: 26px;
    max-width: 100%;
    text-wrap: pretty;
  }

  .wx-page--single-insight .wx-insight-cta__inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
  }

  .wx-page--single-insight .wx-insight-cta__inner .wx-btn {
    width: auto;
    max-width: 100%;
    min-width: 0;
    align-self: flex-start;
    justify-content: flex-start;
    padding-inline: 22px;
  }

  .wx-resource-cover {
    padding: 24px;
  }

  .wx-resource-cover__title {
    font-size: 22px;
  }

  .wx-resource-detail__title {
    font-size: 26px;
  }

  .wx-resource-detail__lede {
    font-size: 16px;
  }

  .wx-resource-form {
    padding: 20px;
  }

  body.wx-page--resource-landing .wx-cta-block .wx-btn {
    display: inline-flex;
    width: auto;
    max-width: 100%;
    min-width: 0;
    padding-inline: 18px;
    justify-self: start;
    align-self: flex-start;
    justify-content: center;
    white-space: normal;
    text-align: center;
  }

  /* Stronger underline inputs on mobile for visibility in bright light */
  .wx-resource-form input:not([type="checkbox"]),
  .wx-resource-form select {
    border-bottom-width: 1.5px;
    border-bottom-color: var(--wx-ink-2);
    padding: 10px 0;
  }

  /* Pager: ensure prev/next links have comfortable tap area */
  .wx-insights-pager > a {
    min-height: 44px;
    min-width: 44px;
    display: inline-flex;
    align-items: center;
  }

  /* Card text: prevent awkward mid-word/character breaks in narrow columns */
  .wx-insight-card__title,
  .wx-insight-card__lede,
  .wx-resource-card__cover-title,
  .wx-resource-card__body p,
  .wx-insight-related__card-title,
  .wx-resource-related__card-title,
  .wx-home-role__card h3,
  .wx-home-role__card p,
  .wx-audience-card__title,
  .wx-audience-card__desc {
    word-break: normal;
    overflow-wrap: break-word;
    hyphens: none;
  }

  /* Breadcrumb: keep only the back-link on mobile.
     Hide the separator dot and second item (category/number/label)
     so the breadcrumb reads as a clean "← Parent" on narrow screens. */
  .wx-cap-detail-meta > span,
  .wx-insight-breadcrumb > span,
  .wx-resource-breadcrumb > span {
    display: none;
  }

  /* Hide external breadcrumb "Home/首页" link on mobile.
     Breadcrumbs injected by SEO plugins (Yoast, RankMath, SEOPress, etc.)
     or Blocksy page-header show a "Home" crumb before the current page.
     On narrow screens this wastes vertical space above the WExAct hero.
     WExAct's own back-links (.wx-insight-breadcrumb etc.) are excluded. */
  body.wx-site .breadcrumbs > a:first-child,
  body.wx-site #breadcrumbs > a:first-child,
  body.wx-site [class*="breadcrumb"]:not([class*="wx-insight"]):not([class*="wx-resource"]):not([class*="wx-cap"]) > a:first-child,
  body.wx-site [class*="breadcrumb"]:not([class*="wx-insight"]):not([class*="wx-resource"]):not([class*="wx-cap"]) > span:first-child > a:first-child {
    display: none;
  }
}

/* ── Contact form: slightly larger audience label on mobile ── */
@media (max-width: 767px) {
  .wx-contact-form-card__audience {
    font-size: 11px !important;
  }
}

/* ── Section A: Hero ─────────────────────────────────────────────────────────── */
.wx-cap-detail-hero {
  padding: var(--wx-section-y) 0;
}
.wx-cap-detail-hero__inner {
  max-width: 1280px;
  margin:    0 auto;
  padding:   0 var(--wx-gutter);
}

.wx-cap-detail-meta {
  display:        flex;
  gap:            10px;
  align-items:    center;
  font-family:    var(--wx-font-mono);
  font-size:      11px;
  line-height:    1;
  letter-spacing: .08em;
  text-transform: uppercase;
  color:          var(--wx-ink-3);
}

.wx-cap-detail-back {
  color:           var(--wx-ink-3) !important;
  text-decoration: none !important;
  border:          0 !important;
  transition:      color var(--wx-dur-fast) var(--wx-ease-out);
}
.wx-cap-detail-back:hover { color: var(--wx-brand) !important; }

.wx-cap-detail-hero__grid {
  display:               grid;
  grid-template-columns: 140px 1fr;
  gap:                   48px;
  align-items:           start;
  margin-top:            36px;
  padding-bottom:        40px;
  border-bottom:         1px solid var(--wx-line);
}
.wx-cap-detail-hero__grid--no-num {
  grid-template-columns: 1fr;
}

.wx-cap-detail-num {
  font-family:           var(--wx-font-display);
  font-weight:           300;
  font-size:             110px;
  line-height:           1;
  letter-spacing:        -.03em;
  color:                 var(--wx-ink-0);
  font-feature-settings: "lnum","tnum";
}

.wx-cap-detail-title {
  margin:         12px 0 16px !important;
  font-family:    var(--wx-font-display);
  font-weight:    400;
  font-size:      56px;
  line-height:    1.06;
  letter-spacing: -.022em;
  color:          var(--wx-ink-0);
  text-wrap:      balance;
}

.wx-cap-detail-lede {
  margin:      0 !important;
  font-family: var(--wx-font-display);
  font-weight: 300;
  font-size:   22px;
  line-height: 1.55;
  color:       var(--wx-ink-1);
  max-width:   760px;
}

@media (max-width: 639px) {
  .wx-cap-detail-hero__grid {
    grid-template-columns: 1fr;
    gap:                   4px;
  }
  .wx-cap-detail-num   { font-size: 64px; line-height: 0.85; }
  .wx-cap-detail-title { font-size: clamp(28px, 7vw, 48px) !important; margin-top: 8px !important; }
  .wx-cap-detail-lede  { font-size: 17px !important; }
}

/* ── Section B: When this matters ───────────────────────────────────────────── */
.wx-cap-detail-when {
  padding: clamp(40px, 5vw, 64px) 0 0;
}
.wx-cap-detail-when__inner {
  max-width: 760px;
  margin:    0 auto;
  padding:   0 var(--wx-gutter);
}
.wx-cap-detail-when .wx-cap-detail-eyebrow {
  margin-bottom: 18px !important;
}
.wx-cap-detail-when p {
  margin:      0 0 1.1em !important;
  font-family: var(--wx-font-display);
  font-weight: 300;
  font-size:   20px;
  line-height: 1.7;
  color:       var(--wx-ink-1);
}
.wx-cap-detail-when p:last-of-type { margin-bottom: 0 !important; }

@media (max-width: 639px) {
  .wx-cap-detail-when p { font-size: 17px !important; }
}

/* ── Section C: Key questions we help clarify ───────────────────────────────── */
.wx-cap-detail-questions {
  padding: var(--wx-section-y) 0 0;
}
.wx-cap-detail-questions__inner {
  max-width: 1280px;
  margin:    0 auto;
  padding:   0 var(--wx-gutter);
}

.wx-cap-detail-list {
  list-style:     none !important;
  margin:         18px 0 0 !important;
  padding:        0 !important;
  display:        flex;
  flex-direction: column;
}
.wx-cap-detail-list__row {
  display:     flex;
  gap:         16px;
  padding:     16px 0;
  border-bottom: 1px solid var(--wx-line);
  font-family: var(--wx-font-sans);
  font-size:   16px;
  font-weight: 400;
  line-height: 1.55;
  color:       var(--wx-ink-1);
}
.wx-cap-detail-list__num {
  font-family: var(--wx-font-mono);
  font-size:   12px;
  line-height: 1.55;
  color:       var(--wx-ink-3);
  min-width:   28px;
  flex-shrink: 0;
}

@media (max-width: 639px) {
  .wx-cap-detail-list__row { font-size: 15px !important; }
}

/* ── Section D: How this connects ───────────────────────────────────────────── */
.wx-cap-detail-connects {
  background:  var(--wx-paper-1);
  padding:     var(--wx-section-y) 0;
  margin-top:  var(--wx-section-y);
}
.wx-cap-detail-connects__inner {
  max-width:             1280px;
  margin:                0 auto;
  padding:               0 var(--wx-gutter);
  display:               grid;
  grid-template-columns: 1fr 2fr;
  gap:                   48px;
  align-items:           start;
}
.wx-cap-detail-connects__body {
  margin:      0 !important;
  font-family: var(--wx-font-display);
  font-weight: 300;
  font-size:   20px;
  line-height: 1.6;
  color:       var(--wx-ink-1);
  max-width:   620px;
}

@media (max-width: 859px) {
  .wx-cap-detail-connects__inner {
    grid-template-columns: 1fr;
    gap:                   16px;
  }
}

/* ── Section E: What this is not ─────────────────────────────────────────────── */
.wx-cap-detail-not {
  padding: var(--wx-section-y) 0 0;
}
.wx-cap-detail-not__inner {
  max-width: 1280px;
  margin:    0 auto;
  padding:   0 var(--wx-gutter);
}

.wx-cap-detail-list--neg .wx-cap-detail-list__row {
  font-size: 15px !important;
  color:     var(--wx-ink-2) !important;
}
.wx-cap-detail-list--neg .wx-cap-detail-list__num {
  color: var(--wx-ink-4) !important;
}

@media (max-width: 639px) {
  .wx-cap-detail-list--neg .wx-cap-detail-list__row { font-size: 14px !important; }
}

/* ── Section F: CTA ──────────────────────────────────────────────────────────── */
.wx-cap-detail-cta {
  background: var(--wx-ink-surface);
  color:      var(--wx-paper-0);
  margin-top: var(--wx-section-y);
}
.wx-cap-detail-cta__inner {
  display:               grid;
  grid-template-columns: 1fr auto;
  gap:                   32px;
  align-items:           center;
  max-width:             1280px;
  margin:                0 auto;
  padding:               48px var(--wx-gutter);
}
.wx-cap-detail-cta .wx-cap-detail-eyebrow {
  color: var(--wx-brand) !important;
}
.wx-cap-detail-cta__text {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.wx-cap-detail-cta__text .wx-cap-detail-eyebrow,
.wx-cap-detail-cta__text .wx-cap-detail-cta__title {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.wx-cap-detail-cta__title {
  margin:         16px 0 0 !important;
  font-family:    var(--wx-font-display);
  font-weight:    400;
  font-size:      36px;
  line-height:    1.18;
  letter-spacing: -.015em;
  color:          var(--wx-paper-0);
  max-width:      640px;
  text-wrap:      balance;
}
.wx-cap-detail-cta__btn {
  justify-self:    start;
  display:         inline-flex;
  align-items:     center;
  gap:             10px;
  font-family:     var(--wx-font-sans);
  font-weight:     600;
  font-size:       14px;
  line-height:     1;
  padding:         13px 22px;
  border-radius:   var(--wx-r-1);   /* 2px — square corners */
  background:      var(--wx-brand);
  color:           var(--wx-paper-0) !important;
  text-decoration: none !important;
  transition:      background var(--wx-dur-fast) var(--wx-ease-out);
}
.wx-cap-detail-cta__btn:hover { background: var(--wx-brand-hover); }

@media (max-width: 859px) {
  .wx-cap-detail-cta__inner {
    grid-template-columns: 1fr;
    gap:     24px;
    padding: 40px var(--wx-gutter);
  }
  .wx-cap-detail-cta__text {
    gap: 14px;
  }
  .wx-cap-detail-cta__title {
    margin-top: 14px !important;
    font-size: 26px !important;
    width: 100%;
    max-width: 100%;
    text-wrap: pretty;
  }
}

/* ═══════════════════════════════════════════════════════════════
   PHASE 6A — ZH LANGUAGE OVERRIDES
   Body class .lang-zh is injected by header-wexact.php when
   Polylang detects zh as the current language.
   Eyebrow/heading letter-spacing 0.18em is designed for EN
   uppercase labels; CJK characters use 0 tracking.
   ═══════════════════════════════════════════════════════════════ */

body.lang-zh .wx-eyebrow,
body.lang-zh .wx-home-eyebrow,
body.lang-zh .wx-footer__col-heading,
body.lang-zh .wx-cap-detail-eyebrow,
body.lang-zh .wx-network-eyebrow,
body.lang-zh .wx-about-eyebrow {
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* ── Phase 6B: ZH mobile line-height ───────────────────── */
/* Chinese body text benefits from looser line-height on small screens
   where CJK characters feel denser than Latin text at the same value. */
@media (max-width: 639px) {
  body.lang-zh .wx-lede,
  body.lang-zh .wx-home-hero__lede,
  body.lang-zh .wx-what-hero__lede,
  body.lang-zh .wx-about-prose p,
  body.lang-zh .wx-network-why__body p,
  body.lang-zh .wx-insight-card__lede,
  body.lang-zh .wx-resource-detail__lede,
  body.lang-zh .wx-home-head__lede,
  body.lang-zh .wx-home-aud__card p,
  body.lang-zh .wx-home-role__card p:not(.wx-home-eyebrow),
  body.lang-zh .wx-audience-card__desc,
  body.lang-zh .wx-aud-hero__lede,
  body.lang-zh .wx-aud-hero__cn-lede,
  body.lang-zh .wx-cap-article__lede,
  body.lang-zh .wx-cap-article__point,
  body.lang-zh .wx-contact-intro__lede {
    line-height: 1.72;
  }

  /* ZH page titles: lower the floor for shared hero H1s on Who/Network/About/Contact */
  body.lang-zh .wx-page-title {
    font-size: clamp(28px, 7vw, 46px);
  }

  /* ZH audience detail: hero H1 less heavy, better line-height */
  body.lang-zh .wx-aud-hero__title {
    font-size: clamp(26px, 7vw, 40px) !important;
    line-height: 1.16 !important;
  }

  body.lang-zh .wx-aud-hero__lede {
    font-size: 16px !important;
    line-height: 1.7 !important;
  }

  /* ZH engagement section: more readable phase cards */
  body.lang-zh .wx-phase__name {
    font-size: 16px;
    line-height: 1.4;
  }

  body.lang-zh .wx-phase__desc {
    line-height: 1.7;
  }

  /* ZH audience detail: CN subtitle less dominant on mobile */
  body.lang-zh .wx-aud-hero__cn-lede {
    font-size: 13px !important;
    line-height: 1.65 !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   PHASE 8V-A — Visual Polish
   Typography hierarchy, nowrap, subscribe form, location lines.
   ═══════════════════════════════════════════════════════════════ */

html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

body {
  position: relative;
}

/* ── A. Global typography / spacing hierarchy ─────────────────── */

/* Eyebrow → section title gap in shared section-header component */
.wx-section-header__left {
  gap: 20px;
}

/* Home section head: eyebrow → title grid breathing room */
.wx-home-head__grid {
  margin-top: 28px;
}

/* Home & page-level CTA blocks: eyebrow → headline gap */
.wx-home-cta__text {
  gap: 16px;
}
.wx-cta-block__text {
  gap: 16px;
}

/* Network hero: eyebrow → title → lede */
.wx-network-hero__title {
  margin: 22px 0 24px !important;
}

/* About hero: eyebrow → title */
.wx-about-hero__title {
  margin: 22px 0 0 !important;
}

/* Audience detail engagement section title */
.wx-aud-engagement__title {
  margin: 22px 0 0 !important;
}

/* About section titles (journey, approach, etc.) */
.wx-about-section-title {
  margin: 22px 0 0 !important;
}

/* ── B. Homepage hero — nowrap and CTA polish ─────────────────── */

/* Accent phrase (execution-driven / 执行驱动型): never break mid-phrase */
.wx-home-hero__title em {
  white-space: nowrap;
}

/* Utility nowrap span — used for "Global Growth System" and similar */
.wx-nowrap {
  white-space: nowrap;
}

.wx-desktop-line {
  display: block;
}

.wx-desktop-nowrap {
  white-space: nowrap;
}

@media (max-width: 859px) {
  .wx-desktop-line {
    display: inline;
  }

  .wx-desktop-nowrap {
    white-space: normal;
  }
}

/* Hero primary CTA: white button with border on light background.
   Inverts on hover for a premium editorial feel. */
.wx-home-hero .wx-home-btn--primary {
  background:   var(--wx-paper-0) !important;
  color:        var(--wx-ink-0) !important;
  border-color: rgba(20, 23, 28, 0.22) !important;
}
.wx-home-hero .wx-home-btn--primary:hover {
  background:   var(--wx-ink-0) !important;
  color:        var(--wx-paper-0) !important;
  border-color: var(--wx-ink-0) !important;
}

.wx-home-hero .wx-home-hero__primary-cta {
  background: var(--wx-accent) !important;
  color: var(--wx-paper-0) !important;
  border-color: var(--wx-accent) !important;
}

.wx-home-hero .wx-home-hero__primary-cta .wx-arrow {
  color: var(--wx-paper-0) !important;
}

.wx-home-hero .wx-home-hero__primary-cta:hover,
.wx-home-hero .wx-home-hero__primary-cta:focus-visible {
  background: var(--wx-accent-hover) !important;
  color: var(--wx-paper-0) !important;
  border-color: var(--wx-accent-hover) !important;
}

.wx-home-hero .wx-home-hero__primary-cta:hover .wx-arrow,
.wx-home-hero .wx-home-hero__primary-cta:focus-visible .wx-arrow {
  color: var(--wx-paper-0) !important;
}

@media (max-width: 768px) {
  .wx-home-hero .wx-home-hero__actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 16px;
    margin-left: 0;
    padding-left: 0;
    text-align: left;
  }

  .wx-home-hero .wx-home-hero__actions .wx-home-btn {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    align-self: flex-start;
    justify-self: start;
    width: auto;
    max-width: max-content;
    margin-left: 0;
    margin-inline: 0;
    padding-left: 0;
    transform: none;
    text-align: left;
  }

  .wx-home-hero .wx-home-hero__actions .wx-home-hero__primary-cta {
    justify-content: center;
    text-align: center;
    padding-inline: 28px;
  }

.wx-home-hero .wx-home-hero__actions .wx-home-hero__primary-cta .wx-arrow {
    position: static;
    margin-left: 2px;
  }
}

/* WeChat QR modal */
.wx-wechat-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.wx-wechat-modal.is-open {
  display: flex;
}

.wx-wechat-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8, 18, 28, 0.58);
  backdrop-filter: blur(6px);
}

.wx-wechat-modal__dialog {
  position: relative;
  z-index: 1;
  width: min(100%, 420px);
  background: #ffffff;
  color: #14181f;
  padding: 32px;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.24);
}

.wx-wechat-modal__close {
  position: absolute;
  top: 14px;
  right: 16px;
  border: 0;
  background: transparent;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  color: #66707c;
}

.wx-wechat-modal__eyebrow {
  color: #0672B5;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 12px;
}

.wx-wechat-modal__title {
  margin: 0 0 12px;
  font-size: 28px;
  line-height: 1.2;
}

.wx-wechat-modal__text {
  margin: 0 0 24px;
  color: #5f6875;
  line-height: 1.65;
}

.wx-wechat-modal__qr {
  display: block;
  width: min(100%, 260px);
  height: auto;
  margin-inline: auto;
}

body.wx-modal-open {
  overflow: hidden;
}

@media (max-width: 640px) {
  .wx-wechat-modal {
    padding: 18px;
  }

  .wx-wechat-modal__dialog {
    padding: 28px 22px 24px;
  }

  .wx-wechat-modal__title {
    font-size: 24px;
  }

  .wx-wechat-modal__qr {
    width: min(100%, 240px);
  }
}

/* ── C. Insights subscribe form: email + button on one row ───── */

/* Email + subscribe button flex row */
.wx-subscribe-row {
  display: flex;
  align-items: stretch;
  gap: 12px;
}

/* Email input: grows to fill available width */
.wx-page--insights .wx-subscribe-row input[type="email"] {
  flex: 1;
  min-width: 0 !important;
  border-right: 1px solid var(--wx-ink-3) !important;
}

/* Button: never shrinks, stays right-flush */
.wx-page--insights .wx-subscribe-row button {
  flex-shrink: 0;
}

.wx-page--insights .wx-insights-subscribe__form form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.wx-page--insights .wx-insights-subscribe__form label:not(.screen-reader-text) {
  margin: 0 !important;
  gap: 10px;
  line-height: 1.55;
}

.wx-page--insights .wx-insights-subscribe__form .wx-privacy-modal-trigger {
  margin-left: 0.25em;
}

/* Mobile ≤ 639px: stack vertically, restore borders */
@media (max-width: 639px) {
  .wx-subscribe-row {
    flex-direction: column;
  }
  .wx-page--insights .wx-subscribe-row input[type="email"] {
    border-right: 1px solid var(--wx-ink-3) !important;
    border-bottom: 1px solid var(--wx-ink-3) !important;
    width: 100%;
  }
  .wx-page--insights .wx-subscribe-row button {
    width: 100%;
  }

  .wx-page--insights .wx-insights-subscribe__form form {
    gap: 14px;
  }

  .wx-page--insights .wx-insights-subscribe__form label:not(.screen-reader-text) {
    line-height: 1.55;
  }
}

/* ── D. Location: city line + partner note on separate lines ──── */

/* Cities line — kept on one line (nowrap) on desktop */
.wx-loc-cities {
  display: block;
  white-space: nowrap;
}

/* Partner note — wraps normally on a new line */
.wx-loc-note {
  display: block;
  white-space: normal;
}

/* Very narrow screens: allow cities to wrap gracefully */
@media (max-width: 479px) {
  .wx-loc-cities {
    white-space: normal;
  }
}

/* ═══════════════════════════════════════════════════════════════
   PHASE 8V-B — Visual Polish Round 2
   Precise typography hierarchy and no-wrap refinements.
   ═══════════════════════════════════════════════════════════════ */

/* ── B/C. Eyebrow → Title → Lede hierarchy ────────────────── */

/* Insights hero: eyebrow → title gap increased (C4) */
.wx-page--insights .wx-insights-hero__title {
  margin: 32px 0 24px !important;
}

/* Network hero: eyebrow → title → lede (C5) */
.wx-network-hero__title {
  margin: 32px 0 28px !important;
}

/* About hero: eyebrow → title (C6) */
.wx-about-hero__title {
  margin: 32px 0 0 !important;
}

/* Phase 8V-G1 Addendum: About hero eyebrow-to-title spacing */
body.wx-page--about .wx-about-hero__title {
  margin-top: 40px !important;
}

@media (max-width: 639px) {
  body.wx-page--about .wx-about-hero__title {
    margin-top: 18px !important;
  }
}

/* Contact: eyebrow → title → lede (C7) */
.wx-contact-intro__title {
  margin: 28px 0 0 !important;
}
.wx-contact-intro__lede {
  margin-top: 22px !important;
}

/* Network and contact page hero stack spacing */
body.wx-page--network .wx-network-hero__title {
  margin: 36px 0 30px !important;
}

body.wx-page--network .wx-network-hero__lede {
  line-height: 1.72 !important;
}

body.wx-page--contact .wx-contact-intro__title {
  margin: 34px 0 0 !important;
}

body.wx-page--contact .wx-contact-intro__lede {
  margin-top: 26px !important;
  line-height: 1.72 !important;
}

@media (max-width: 639px) {
  body.wx-page--network .wx-network-hero__title {
    margin: 20px 0 18px !important;
  }

  body.wx-page--network .wx-network-hero__lede {
    line-height: 1.68 !important;
  }

  body.wx-page--contact .wx-contact-intro__title {
    margin-top: 20px !important;
  }

  body.wx-page--contact .wx-contact-intro__lede {
    margin-top: 18px !important;
    line-height: 1.68 !important;
  }
}

/* Capability detail hero: eyebrow → title → lede (C1) */
.wx-cap-detail-title {
  margin: 32px 0 0 !important;
}
.wx-cap-detail-lede {
  margin-top: 24px !important;
}

/* Phase 8V-G1: capability detail hero stack spacing */
body.wx-page--capability-detail .wx-cap-detail-eyebrow--accent {
  display: block;
  margin-bottom: 20px !important;
}

body.wx-page--capability-detail .wx-cap-detail-title {
  margin: 0 0 24px !important;
  line-height: 1.14;
}

body.wx-page--capability-detail .wx-cap-detail-lede {
  margin: 0 !important;
  max-width: 760px;
  line-height: 1.76;
}

@media (max-width: 639px) {
  body.wx-page--capability-detail .wx-cap-detail-eyebrow--accent {
    margin-bottom: 16px !important;
  }

  body.wx-page--capability-detail .wx-cap-detail-title {
    margin-bottom: 20px !important;
    line-height: 1.16;
  }

  body.wx-page--capability-detail .wx-cap-detail-lede {
    line-height: 1.68;
  }
}

/* Capability detail CTA: eyebrow → headline (C8) */
.wx-cap-detail-cta__title {
  margin-top: 16px !important;
}

@media (max-width: 639px) {
  .wx-cap-detail-cta__title {
    margin-top: 14px !important;
  }
}

/* Audience hero: eyebrow → title (C2/C3) */
.wx-aud-hero__eyebrow {
  margin-bottom: 28px !important;
}

/* Audience engagement: eyebrow → section heading */
.wx-aud-engagement__title {
  margin: 30px 0 0 !important;
}

/* Audience detail content rhythm: hero intro, engagement section, phase copy */
body.wx-page--audience-detail .wx-aud-hero__title {
  margin-bottom: 32px !important;
}

body.wx-page--audience-detail .wx-aud-hero__lede {
  line-height: 1.72 !important;
}

body.wx-page--audience-detail .wx-phases {
  padding-top: 96px;
}

body.wx-page--audience-detail .wx-aud-engagement__header {
  margin-bottom: 56px;
}

body.wx-page--audience-detail .wx-aud-engagement__title {
  margin-top: 18px !important;
}

@media (max-width: 859px) {
  body.wx-page--audience-detail .wx-aud-hero__title,
  body.wx-page--audience-detail .wx-cta-block__title {
    width: 100%;
    max-width: 100%;
    text-wrap: pretty;
  }

  body.wx-page--audience-detail .wx-aud-hero__title {
    font-size: clamp(30px, 7vw, 42px) !important;
    line-height: 1.16 !important;
  }
}

body.wx-page--audience-detail .wx-phase__name {
  margin-top: 14px !important;
}

body.wx-page--audience-detail .wx-phase .wx-phase__name + .wx-phase__desc {
  margin-top: 18px !important;
  padding-top: 0 !important;
  line-height: 1.7 !important;
}

body.lang-zh.wx-page--audience-detail .wx-phase .wx-phase__name + .wx-phase__desc {
  line-height: 1.75 !important;
}

@media (max-width: 768px) {
  body.wx-page--audience-detail .wx-aud-hero__title {
    margin-bottom: 22px !important;
  }

  body.wx-page--audience-detail .wx-phases {
    padding-top: 64px;
  }

  body.wx-page--audience-detail .wx-aud-engagement__header {
    margin-bottom: 40px;
  }

  body.wx-page--audience-detail .wx-aud-engagement__title {
    margin-top: 14px !important;
  }

  body.wx-page--audience-detail .wx-phase .wx-phase__name + .wx-phase__desc {
    margin-top: 14px !important;
    padding-top: 0 !important;
    line-height: 1.68 !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   PHASE 8V-E — Visual Polish V3
   Scoped EN hero layout, local nowrap, and insight related spacing.
   ═══════════════════════════════════════════════════════════════ */

/* ── A. EN Home hero: three-line H1 + tighter metrics column ── */

/* wx-hero-line: block on EN desktop gives each line its own baseline */
body:not(.lang-zh) .wx-home-hero__title .wx-hero-line {
  display: block;
  white-space: nowrap;
}

body:not(.lang-zh) .wx-home-hero__title {
  font-size: clamp(46px, 4.1vw, 54px);
  max-width: none;
}

/* EN Home: constrain metrics column to prevent drift to far right */
body:not(.lang-zh) .wx-home-hero__inner {
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, 340px);
  gap: clamp(32px, 5vw, 56px);
}

body:not(.lang-zh) .wx-home-hero__copy {
  max-width: 820px;
}

@media (max-width: 1023px) {
  body:not(.lang-zh) .wx-home-hero__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  body:not(.lang-zh) .wx-home-hero__copy {
    max-width: none;
  }
}

/* Mobile ≤ 639px: hero-line reverts to inline (no forced breaks) */
@media (max-width: 639px) {
  body:not(.lang-zh) .wx-home-hero__title .wx-hero-line {
    display: inline;
    white-space: normal;
  }

  body:not(.lang-zh) .wx-home-hero__title {
    font-size: clamp(36px, 8.8vw, 46px);
  }
}

/* ── D. More insights / 更多洞察: left-aligned, better spacing ─ */

/* Override the two-column section-header to a left-aligned stack */
.wx-page--single-insight .wx-insight-related .wx-section-header {
  grid-template-columns: 1fr;
  gap: 18px;
  margin-bottom: 56px;
  text-align: left;
}