/* =========================================================================
   Freedom Business — Design Tokens
   Single source of truth for the entire site.
   Values extracted from live freedommobile.ca styling.
   ========================================================================= */

:root {
  /* ---------- Brand palette ---------- */
  --fm-orange:      #DB5C05;   /* signature Freedom orange (hover, accents) */
  --fm-black:       #000000;   /* primary text, top nav bar */
  --fm-white:       #FFFFFF;   /* backgrounds, text on dark */
  --fm-gray-50:     #F5F5F5;   /* section backgrounds — internally known as "Gris" */
  --fm-gris:        #F5F5F5;   /* semantic alias — use --fm-gris to reference the Gris background */
  --fm-gray-200:    #DEDEDE;   /* muted text on dark */
  --fm-gray-600:    #4E4E4E;   /* nav links, secondary text */

  /* ---------- Semantic aliases ---------- */
  --fm-text:        var(--fm-gray-600);
  --fm-text-strong: var(--fm-black);
  --fm-text-invert: var(--fm-white);
  --fm-accent:      var(--fm-orange);
  --fm-bg:          var(--fm-white);
  --fm-bg-alt:      var(--fm-gray-50);
  --fm-bg-dark:     var(--fm-black);

  /* ---------- Typography ---------- */
  --fm-font-body:   'Ambra', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --fm-fs-xs:       0.75rem;   /* 12px */
  --fm-fs-sm:       0.875rem;  /* 14px */
  --fm-fs-base:     1rem;      /* 16px */
  --fm-fs-md:       1.125rem;  /* 18px */
  --fm-fs-lg:       1.5rem;    /* 24px */
  --fm-fs-xl:       2rem;      /* 32px */
  --fm-fs-2xl:      2.5rem;    /* 40px */
  --fm-fs-3xl:      3.5rem;    /* 56px */
  --fm-lh-tight:    1.15;
  --fm-lh-normal:   1.5;

  /* Ambra Sans Medium is the only weight we ship. We rely on the
     browser's synthetic bolding for stronger weights, and we lean on
     letter-spacing + size for hierarchy. */
  --fm-fw-normal:   500;
  --fm-fw-bold:     700;

  /* ---------- Spacing scale ---------- */
  --fm-sp-1:  0.25rem;
  --fm-sp-2:  0.5rem;
  --fm-sp-3:  0.75rem;
  --fm-sp-4:  1rem;
  --fm-sp-5:  1.5rem;
  --fm-sp-6:  2rem;
  --fm-sp-7:  3rem;
  --fm-sp-8:  4rem;
  --fm-sp-9:  6rem;

  /* ---------- Layout ---------- */
  --fm-container:     1280px;
  --fm-container-pad: 1rem;
  --fm-radius:        10px;
  --fm-radius-sm:     6px;

  /* ---------- Motion ---------- */
  --fm-ease:          cubic-bezier(0.4, 0, 0.2, 1);
  --fm-dur-fast:      150ms;
  --fm-dur-med:       250ms;
}

/* Desktop breakpoint helper */
@media (min-width: 992px) {
  :root {
    --fm-container-pad: 1.5rem;
  }
}