:root {
  --black: #000000;
  --blueMedium: #3072B1;
  --gold: #95784C;
  --green: #A2D6D6;
  --greyCharcoal: #343A40;
  --greyLight: #F2F2F2;
  --greyLighter: #EEEEEE;
  --greyDarker: #485163;
  --orange: #A85604;
  --orangeEarthy: #BC591C;
  --orangeLighter: #AA7A32;
  --orangeAlt: #E58A56;
  --red: #DC3545;
  --white: #FFFFFF;

  /* PALETTE */
  --bodyBgColor: var(--greyLighter);
  --bodyColor: var(--white);
  --headerBgColor: var(--greyDarker);
  --textColor: var(--greyDarker);
  --qridaOrange: var(--orange);
  --qridaBlue: var(--blueMedium);

  --danger: #9F0612;
  --warning: #A85604;
  --success: #3A6E00;
  --info: #3C6EC7;

  --transition: 0.12s ease-in-out 0s;
  --boxShadow: 0 0 20px rgba(0, 0, 0, 0.08);

  /* TYPOGRAPHY SYSTEM */
  
  /* Font Families */
  --font-family-primary: 'Lato', -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-family-system: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI", "Segoe UI Symbol";
  --font-family-headings: var(--font-family-primary);
  --font-family-body: var(--font-family-primary);
  --font-family-ui: var(--font-family-primary);
  
  /* Font Weights */
  --font-weight-light: 300;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;
  
  /* Line Heights */
  --line-height-tight: 1.1;
  --line-height-snug: 1.2;
  --line-height-normal: 1.4;
  --line-height-relaxed: 1.5;
  --line-height-loose: 1.6;
  --line-height-extra-loose: 1.8;
  
  /* Letter Spacing */
  --letter-spacing-tighter: -0.05em;
  --letter-spacing-tight: -0.025em;
  --letter-spacing-normal: 0;
  --letter-spacing-wide: 0.025em;
  --letter-spacing-wider: 0.05em;
  --letter-spacing-widest: 0.1em;

  /* Fluid Typography Scale */
  --font-size-xs: clamp(0.75rem, 0.71rem + 0.2vw, 0.875rem);
  --font-size-sm: clamp(0.875rem, 0.82rem + 0.275vw, 1rem);
  --font-size-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --font-size-lg: clamp(1.125rem, 1.06rem + 0.325vw, 1.25rem);
  --font-size-xl: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
  --font-size-2xl: clamp(1.5rem, 1.35rem + 0.75vw, 1.875rem);
  
  /* Heading Sizes (Fluid) - Reduced scale for better hierarchy */
  --font-size-h1: clamp(1.75rem, 1.375rem + 1.875vw, 2.75rem);
  --font-size-h2: clamp(1.5rem, 1.25rem + 1.25vw, 2.25rem);
  --font-size-h3: clamp(1.25rem, 1.125rem + 0.625vw, 1.75rem);
  --font-size-h4: clamp(1.125rem, 1.06rem + 0.325vw, 1.5rem);
  --font-size-h5: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
  --font-size-h6: clamp(0.875rem, 0.82rem + 0.275vw, 1.125rem);
  
  /* Display Sizes (For hero text/large displays) */
  --font-size-display-sm: clamp(1.8225rem, 1.4175rem + 2.025vw, 3.0375rem);
  --font-size-display-md: clamp(2.2275rem, 1.62rem + 3.0375vw, 3.645rem);
  --font-size-display-lg: clamp(2.835rem, 2.025rem + 4.05vw, 4.86rem);
  
  /* Specific Use Cases */
  --font-size-caption: var(--font-size-xs);
  --font-size-small: var(--font-size-sm);
  --font-size-lead: var(--font-size-xl);
  --font-size-blockquote: clamp(1.125rem, 1.06rem + 0.325vw, 1.25rem);
  
  /* Form Elements */
  --font-size-label: clamp(0.875rem, 0.84rem + 0.175vw, 0.929rem);
  --font-size-input: var(--font-size-base);
  --font-size-button: var(--font-size-base);
  
  /* UI Elements */
  --font-size-nav: var(--font-size-sm);
  --font-size-menu: var(--font-size-sm);
  --font-size-breadcrumb: var(--font-size-sm);
  --font-size-pagination: var(--font-size-sm);
  
  /* Spacing Scale (Typography Related) */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 0.75rem;
  --space-lg: 1rem;
  --space-xl: 1.25rem;
  --space-2xl: 1.5rem;
  --space-3xl: 2rem;
  --space-4xl: 2.5rem;
  --space-5xl: 3rem;
  
  /* Text Margins */
  --text-margin-bottom: 1rem;
  --heading-margin-bottom: 1em;
}