/* Color */
:root {
  --c-black: #000;
  --c-white: #fff;
  --c-gray-900: #030e13;
  --c-gray-800: #0a2036;
  --c-gray-700: #344054;
  --c-gray-600: #475467;
  --c-gray-500: #667085;
  --c-gray-400: #858585;
  --c-gray-450: #cbcbcb;
  --c-gray-300: #d0d5dd;
  --c-gray-200: #ececec;
  --c-gray-100: #f2f4f7;
  --c-gray-50: #f9fafb;
  --c-gray-25: #fbfbf8;
  --c-info-300: #0f3757;
  --c-info-250: #2077bd;
  --c-info-200: #3673b4;
  --c-info-100: #4787f3;
  --c-info-50: #4381c3;
  --c-info-25: #f5f9ff;
  --c-error-200: #d92d20;
  --c-error-100: #f93232;
  --c-error-50: #ffa4a3;
  --c-error-25: #ffe6e3;
  --c-warning-200: #d6900a;
  --c-warning-100: #ffb82e;
  --c-warning-50: #ffe19a;
  --c-warning-25: #fff7e3;
  --c-success-200: #109356;
  --c-success-100: #12b76a;
  --c-success-50: #a6f4c5;
  --c-success-25: #f6fef9;
  --c-primary-200: #124687;
  --c-primary-100: #0967ad;
  --c-primary-50: #1087c9;
  --c-primary-25: #5ab8e7;
  --c-brown-400: #967a4d;
  --c-midnight-blue: #0d1d2e;
  --c-deep-navy: #020b13;
  --c-facebook: #1877f2;
  --c-instagram: #845ddb;
  --c-twitter: #00acee;
  --c-youtube: #c4302b;
  --c-linkedin: #0077b5;
  --c-whatsapp: #25d366;
  --c-viber: #675ca8;
  --c-pdf: #bd0f17;
  --c-word: #1b56b4;
  --c-excel: #18753f;
  --c-powerpoint: #bc3922;
  --c-archive: #fdd977;
  /* Font family */
  --ff-primary: 'Libre Franklin';
  --ff-secondary: 'Merriweather';
  /* Font size */
  --fs-2xs: 10px;
  --fs-xs: 12px;
  --fs-sm: 14px;
  --fs-md: 16px;
  --fs-lg: 20px;
  --fs-xl: 24px;
  --fs-2xl: 30px;
  --fs-3xl: 40px;
  --fs-4xl: 64px;
  /* Line height */
  --lh-xs: 110%;
  --lh-sm: 120%;
  --lh-md: 140%;
  --lh-lg: 160%;
  /* Border radius */
  --br-sm: 4px;
  --br-tooltip: 6px;
  --br-md: 8px;
  --br-lg: 18px;
  --br-xl: 20px;
  --br-half: 50%;
  /* Form */
  --form-height: 50px;
  --form-font-size: var(--fs-md);
  /* Button */
  --button-padding-y: 9px;
  --button-padding-x: 24px;
  --button-radius: 18px;
  --button-padding-alt: 24px;
  --button-border: 1px solid var(--c-info-200);
  --button-icon-margin: 10px;
  --button-outline-size: 1px;
  --button-outline-offset: 2px;
  /* Input */
  --input-placeholder: var(--c-gray-25);
  --input-background: var(--c-white);
  --input-background-hover: var(--c-white);
  --input-background-active: var(--c-white);
  --input-background-disabled: var(--c-gray-50);
  --input-border: 1px solid var(--c-info-200);
  --input-border-hover: var(--c-brown-400);
  --input-border-active: var(--c-brown-400);
  --input-border-disabled: var(--c-gray-100);
  --input-border-radius: var(--br-md);
  /* Input Text */
  --input-text-bottom-border: 1px solid var(--c-gray-300);
  /* Input Checker */
  --checker-size-sm: 16px;
  --checker-size-md: 20px;
  --checker-color: var(--primary-200);
  --checker-color-disabled: var(--c-gray-200);
  --checkbox-br-sm: 4px;
  --checkbox-br-md: 6px;
  /* Spacing */
  --tag-spacing: 1.4em;
  /* Section Spacing */
  --section-spacing: 64px 0 96px;
}
@media (max-width: 576px) {
  :root {
    --fs-4xl: 28px;
    --fs-3xl: 24px;
    --fs-2xl: 22px;
    --fs-xl: 20px;
  }
}
@media (max-width: 375px) {
  :root {
    --fs-lg: 16px;
  }
}
@media (max-width: 678px) {
  :root {
    --fs-lg: 18px;
  }
}
@media (max-width: 768px) {
  :root {
    --section-spacing: 40px 0 64px;
  }
}
@media (max-width: 992px) {
  :root {
    --fs-xl: 20px;
  }
}