/* ═══════════════════════════════════════════
   FASTEP ZIMBABWE — BRAND COLOUR SYSTEM
   Primary:   #016FB5  (FaStep Blue)
   Secondary: #A7C6DA  (FaStep Sky)
   ═══════════════════════════════════════════ */
:root {
  /* ── Core brand ── */
  --brand-blue:        #016FB5;   /* primary — buttons, links, nav active      */
  --brand-blue-dark:   #015A94;   /* hover / pressed states                    */
  --brand-blue-deeper: #01457A;   /* deepest shade for dark sections           */
  --brand-blue-mid:    #0284C7;   /* lighter variant used in gradients         */
  --brand-sky:         #A7C6DA;   /* secondary — backgrounds, borders, tints   */
  --brand-sky-dark:    #7DAAC2;   /* darker sky — outlines, dividers           */

  /* ── Light tints (derived from brand) ── */
  --brand-blue-light:  #D9EAF5;   /* icon backgrounds, badge fills             */
  --brand-blue-xlight: #EEF6FB;   /* nav hover bg, card hover bg               */
  --brand-sky-light:   #EDF4F9;   /* page section backgrounds                  */
  --brand-sky-xlight:  #F5F9FC;   /* off-white with blue temperature           */

  /* ── Accent colours ── */
  --accent-teal:   #0EA5C9;
  --accent-green:  #059669;
  --accent-orange: #D97706;
  --accent-gold:   #B45309;

  /* ── Neutrals ── */
  --white:        #FFFFFF;
  --off-white:    #F7FAFC;   /* warm-blue off-white                          */
  --light-gray:   #EEF3F7;
  --border:       #D4E4EE;   /* sky-toned border — softer than plain #E2E8F0 */
  --mid-gray:     #8FA9BB;   /* sky-toned mid grey                           */
  --dark-gray:    #3F5C6E;   /* sky-toned body copy                          */
  --charcoal:     #1C3444;   /* nav text, strong body copy                   */
  --near-black:   #0C1F2C;   /* headings, deep sections                      */

  /* ── Typography ── */
  --font-display: 'Sora', sans-serif;
  --font-body:    'DM Sans', sans-serif;

  /* ── Spacing ── */
  --section-pad:    100px;
  --section-pad-sm: 64px;
  --container:      1220px;

  /* ── Radius ── */
  --r-xs:   4px;
  --r-sm:   8px;
  --r-md:   14px;
  --r-lg:   22px;
  --r-xl:   32px;
  --r-full: 9999px;

  /* ── Shadows ── */
  --sh-xs: 0 1px 3px rgba(1,70,121,.07);
  --sh-sm: 0 2px 8px rgba(1,70,121,.08),0 1px 3px rgba(1,70,121,.04);
  --sh-md: 0 4px 20px rgba(1,70,121,.09),0 2px 6px rgba(1,70,121,.05);
  --sh-lg: 0 12px 44px rgba(1,70,121,.11),0 4px 12px rgba(1,70,121,.06);
  --sh-xl: 0 24px 64px rgba(1,70,121,.13),0 8px 24px rgba(1,70,121,.07);
  --sh-blue: 0 8px 28px rgba(1,111,181,.32);

  /* ── Motion ── */
  --ease: cubic-bezier(0.16,1,0.3,1);
  --t1: 160ms;
  --t2: 260ms;
  --t3: 440ms;
}