/* ============================================
   EQUESTRIAN HUB — Design Tokens
   Brand: Teal (#35d7df) + Navy (#001b48)
   Fonts: Fraunces (headings) + Open Sans (body)
   ============================================ */

:root {
  /* Brand Colours */
  --color-navy:        #001b48;
  --color-navy-deep:   #000f2e;
  --color-white:       #FFFFFF;
  --color-off-white:   #F5F5F5;
  --color-light-gray:  #F2F3F6;
  --color-charcoal:    #454b5d;
  --color-text-navy:   #001b48;
  --color-accent:      #35d7df;
  --color-accent-hover:#2bc4cc;
  --color-accent-deep: #A7144C;
  --color-mid-gray:    #888888;
  --color-border:      #E0E0E0;

  /* Typography */
  --font-heading: 'Fraunces', Georgia, serif;
  --font-body:    'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Font Sizes */
  --text-xs:   0.6875rem;   /* 11px */
  --text-sm:   0.8125rem;   /* 13px */
  --text-base: 0.9375rem;   /* 15px */
  --text-md:   1rem;        /* 16px */
  --text-lg:   1.125rem;    /* 18px */
  --text-xl:   1.5rem;      /* 24px */
  --text-2xl:  2rem;        /* 32px */
  --text-3xl:  2.5rem;      /* 40px */
  --text-4xl:  3.25rem;     /* 52px */

  /* Spacing */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  40px;
  --space-2xl: 64px;
  --space-3xl: 80px;

  /* Layout */
  --max-width:       1200px;
  --container-pad:   24px;
  --section-padding:  80px 0;
  --card-radius:     8px;
  --btn-radius:      28px;

  /* Transitions */
  --transition-fast:  0.2s ease;
  --transition:       0.3s ease;
  --transition-slow:  0.5s ease;

  /* Shadows */
  --shadow-sm:   0 1px 3px rgba(0, 27, 72, 0.08);
  --shadow-md:   0 4px 12px rgba(0, 27, 72, 0.1);
  --shadow-lg:   0 8px 30px rgba(0, 27, 72, 0.12);
  --shadow-nav:  0 2px 20px rgba(0, 27, 72, 0.15);
}