:root{
  /* Core palette — extracted from the staging Elementor kit */
  --jh-navy:#1E2A5A;
  --jh-periwinkle:#C3CFF5;
  --jh-blue:#6D94CF;
  --jh-offwhite:#F9F9F9;
  --jh-ink:#151515;
  --jh-purple:#7877DF;
  --jh-white:#FFFFFF;

  /* Site border / overlay tokens */
  --jh-border-dark-soft:#15151524;
  --jh-border-light-soft:#FFFFFF21;
  --jh-transparent:#02010100;

  /* Semantic text */
  --text-body:var(--jh-ink);
  --text-heading:var(--jh-ink);
  --text-muted:#15151599;
  --text-on-dark:var(--jh-offwhite);
  --text-soft-on-dark:var(--jh-periwinkle);
  --text-accent:var(--jh-purple);
  --text-link:var(--jh-ink);
  --text-link-hover:var(--jh-purple);

  /* Semantic surfaces */
  --surface-page:var(--jh-white);
  --surface-alt:var(--jh-offwhite);
  --surface-card:var(--jh-white);
  --surface-dark:var(--jh-navy);
  --surface-ink:var(--jh-ink);
  --surface-pale:var(--jh-periwinkle);
  --surface-header:var(--jh-blue);

  /* Lines, strokes, overlays */
  --border-hairline-dark:var(--jh-border-dark-soft);
  --border-hairline-light:var(--jh-border-light-soft);
  --stroke-icon:var(--jh-blue);
  --overlay-navy:rgba(30,42,90,.62);
  --overlay-navy-deep:rgba(30,42,90,.82);
  --overlay-ink:rgba(21,21,21,.45);
}