/* TransSP global design tokens — colors and typography.
   Import this file BEFORE styles.css on every page. */
:root {
  /* Colors */
  --color-navy-dark: #071A33;
  --color-navy: #0A3161;
  --color-blue: #0A3161;
  --color-blue-hover: #06264D;
  --color-orange: var(--color-blue);
  --color-yellow: #B31942;
  --color-red: #B31942;
  --color-blue-gray: #818EA0;
  --color-gray-light: #ECF0F0;
  --color-gray-lighter: #F7F7F7;
  --color-white: #FFFFFF;

  /* Semantic aliases */
  --color-primary: var(--color-blue);
  --color-secondary: var(--color-navy-dark);
  --color-accent: var(--color-red);
  --color-danger: var(--color-red);
  --color-bg: var(--color-white);
  --color-bg-muted: var(--color-gray-lighter);
  --color-text: var(--color-navy-dark);
  --color-text-inverse: var(--color-white);

  /* Typography */
  --font-heading: "Poppins", sans-serif;
  --font-body: "Inter", sans-serif;

  --font-weight-heading: 600;
  --font-weight-body-regular: 400;
  --font-weight-body-bold: 600;

  --letter-spacing-heading: -2px;

  /* Compact layout rhythm: one clear message per viewport. */
  --layout-content-max: 1080px;
  --layout-section-space: clamp(2.5rem, 5vw, 4rem);
  --layout-copy-max: 560px;
  --layout-body-size: 0.9rem;
  --layout-body-line: 1.52;
}