/* Design tokens: the one place colours, spacing and type scale are defined. */
:root {
  --amx-navy: #001e62;
  --amx-navy-900: #001e62;
  --amx-blue: #087ddd;
  --amx-red: #eb2127;
  --amx-link: #c36;
  --amx-ink: #373737;
  --amx-ink-strong: #0c112b;
  --amx-muted: #5b6673;
  --amx-line: #d6e2ee;
  --amx-bg: #ffffff;
  --amx-bg-soft: #f3faff;
  --amx-tile: #d9eeff;
  --amx-tile-soft: #e8f5ff;
  --amx-space-1: .25rem;
  --amx-space-2: .5rem;
  --amx-space-3: 1rem;
  --amx-space-4: 1.5rem;
  --amx-space-5: 2.5rem;
  --amx-space-6: 4rem;
  --amx-radius: 10px;
  --amx-radius-lg: 20px;
  --amx-shadow: 0 6px 24px rgba(0, 30, 98, .08);
  --amx-container: 2000px;
  --amx-font: "aptos-display", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --amx-section-y: 80px;

  /* Scale follows the live site's breakpoints: 1400, 1200, 1024 and 767. */
  --amx-text: 18px;
  --amx-text-lh: 26px;
  --amx-heading: 50px;
  --amx-heading-lh: 60px;
  --amx-heading-ls: -2px;
  --amx-title: 34px;
  --amx-title-lh: 44px;

  --amx-step-0: var(--amx-text);
  --amx-step-1: clamp(1.2rem, 1.1rem + .4vw, 1.35rem);
  --amx-step-2: clamp(1.5rem, 1.3rem + .8vw, 1.9rem);
  --amx-step-3: clamp(1.9rem, 1.5rem + 1.6vw, 2.75rem);
  --amx-step-4: clamp(2.3rem, 1.7rem + 2.6vw, 3.75rem);
}

@media (max-width: 1400px) {
  :root { --amx-section-y: 70px; --amx-text: 17px; --amx-heading: 40px; --amx-heading-lh: 50px; --amx-title: 30px; --amx-title-lh: 40px; }
}
@media (max-width: 1200px) {
  :root { --amx-section-y: 60px; --amx-text: 16px; --amx-text-lh: 24px; --amx-heading: 34px; --amx-heading-lh: 44px; --amx-title: 26px; --amx-title-lh: 36px; }
}
@media (max-width: 1024px) {
  :root { --amx-section-y: 50px; --amx-text: 15px; --amx-text-lh: 22px; --amx-heading: 32px; --amx-heading-lh: 42px; --amx-title: 23px; --amx-title-lh: 33px; }
}
@media (max-width: 767px) {
  :root { --amx-section-y: 40px; --amx-text: 16px; --amx-text-lh: 26px; --amx-heading: 28px; --amx-heading-lh: 38px; --amx-title: 22px; --amx-title-lh: 32px; }
}