:root {
    /* Brand Colors */
  --brand-primary: #12214c;
  --brand-secondary: #c32228;
  --brand-accent: #f7931d;

  /* State Colors */
  --info-color: #1955dd;
  --success-color: #2dac56;
  --warning-color: #f4d530;
  --error-color: #e73f32;

  /* Black Colors */
  --black-1: #000000;
  --black-2: #1d1d1d;
  --black-3: #333333;
  --white: #ffffff;

  /* Grey Colors */
  --grey-1: #4c4c4c;
  --grey-2: #7c7c7c;
  --grey-3: #b4b4b4;
  --grey-4: #dddddd;
  --grey-5: #f2f2f2;

     /* Font Family */
     --font-primary: 'Montserrat', sans-serif;

     /* Heading Font Sizes & Line Heights */
     --h1-size: 56px;
     --h1-line-height: 61.6px;
   
     --h2-size: 48px;
     --h2-line-height: 52.8px;
   
     --h3-size: 40px;
     --h3-line-height: 44px;
   
     --h4-size: 32px;
     --h4-line-height: 35px;
   
     --h5-size: 24px;
     --h5-line-height: 28px;
   
     --h6-size: 20px;
     --h6-line-height: 22px;
  
  
     /* Body Font Family */
    --font-body: 'Roboto', sans-serif;
  
    /* Body Text Sizes & Line Heights */
    --text-large-size: 20px;
    --text-large-line-height: 28px;
  
    --text-medium-size: 18px;
    --text-medium-line-height: 25.2px;
  
    --text-normal-size: 16px;
    --text-normal-line-height: 22.4px;
  
    --text-small-size: 14px;
    --text-small-line-height: 19.6px;
}


/* Headings */

.header-56 {
    font-family: var(--font-primary);
    font-size: var(--h1-size);
    line-height: var(--h1-line-height);
  }
  
  .header-48 {
    font-family: var(--font-primary);
    font-size: var(--h2-size);
    line-height: var(--h2-line-height);
  }
  
  .header-40 {
    font-family: var(--font-primary);
    font-size: var(--h3-size);
    line-height: var(--h3-line-height);
  }
  
  .header-32 {
    font-family: var(--font-primary);
    font-size: var(--h4-size);
    line-height: var(--h4-line-height);
  }
  
  .header-24 {
    font-family: var(--font-primary);
    font-size: var(--h5-size);
    line-height: var(--h5-line-height);
  }
  
  .header-20 {
    font-family: var(--font-primary);
    font-size: var(--h6-size);
    line-height: var(--h6-line-height);
  }
  
  
  /* Body Text */
  
  .text-20 {
    font-family: var(--font-body);
    font-size: var(--text-large-size);
    line-height: var(--text-large-line-height);
  }
  
  .text-18 {
    font-family: var(--font-body);
    font-size: var(--text-medium-size);
    line-height: var(--text-medium-line-height);
  }
  
  .text-16 {
    font-family: var(--font-body);
    font-size: var(--text-normal-size);
    line-height: var(--text-normal-line-height);
  }
  
  .text-14 {
    font-family: var(--font-body);
    font-size: var(--text-small-size);
    line-height: var(--text-small-line-height);
  }
  
 /* Swiper Variables */

 :root{
    --swiper-pagination-color:#202F64;
 }