body {
    margin: 0;
    line-height: normal;
  }
  
  :root {
    /* fonts */
    --font-inter: Inter;
  
    /* font sizes */
    --font-size-3xs: 10px;
    --font-size-sm: 14px;
    --font-size-xs: 12px;
    --font-size-base: 16px;
    --font-size-23xl: 42px;
    --font-size-13xl: 32px;
    --font-size-45xl: 64px;
    --font-size-59xl: 78px;
    --font-size-21xl: 40px;
    --font-size-xl: 20px;
    --font-size-smi-3: 12.3px;
    --font-size-mid-2: 17.2px;
  
    /* Colors */
    --color-gray-200: #8a8a8a;
    --color-gray-100: #191C1F;
    --color-white: #fff;
    --color-firebrick: #ce261b;
    --color-tomato: #e3352a;
    --color-black: #000;
    --color-lightblue: #b1e4f9;
    --color-lavenderblush: #fdf3f5;
    --color-whitesmoke: #f4f6f8;
    --color-silver-100: #c4c4c4;
    --color-silver-200: #bdbdbd;
  
    /* Gaps */
    --gap-41xl: 60px;
    --gap-21xl: 40px;
    --gap-61xl: 80px;
    --gap-3xl: 22px;
    --gap-5xl: 24px;
    --gap-base: 16px;
    --gap-xs: 12px;
    --gap-xl: 20px;
    --gap-11xl: 30px;
    --gap-10xl: 29px;
    --gap-3xs: 10px;
    --gap-5xs: 8px;
    --gap-11xs: 2px;
    --gap-10xs: 3px;
    --gap-0: 0px;
    --gap-18xl: 37px;
    --gap-7xs: 6px;
    --gap-smi: 13px;
    --gap-lg: 18px;
    --gap-45xl: 64px;
    --gap-17xl: 36px;
    --gap-mini: 15px;
    --gap-sm: 14px;
  
    /* Paddings */
    --padding-41xl: 60px;
    --padding-93xl: 112px;
    --padding-5xl: 24px;
    --padding-base: 16px;
    --padding-21xl: 40px;
    --padding-xl: 20px;
    --padding-11xs: 2px;
    --padding-2xs: 11px;
    --padding-15xl: 34px;
    --padding-3xl: 22px;
    --padding-28xl: 47px;
    --padding-25xl: 44px;
    --padding-smi: 13px;
    --padding-143xl: 162px;
    --padding-101xl: 120px;
    --padding-3xs: 10px;
    --padding-81xl: 100px;
    --padding-61xl: 80px;
    --padding-7xs: 6px;
    --padding-5xs: 8px;
    --padding-4xl: 23px;
    --padding-xs: 12px;
    --padding-13xl: 32px;
    --padding-lg: 18px;
    --padding-8xl: 27px;
    --padding-2xl: 21px;
    --padding-261xl: 280px;
    --padding-181xl: 200px;
    --padding-8xs: 5px;
    --padding-9xs: 4px;
  
    /* Border radiuses */
    --br-xl: 20px;
    --br-11xl: 30px;
    --br-5xs-5: 7.5px;
    --br-mid-7: 17.7px;
    --br-3xl-1: 22.1px;
    --br-lg: 18px;
    --br-5xs: 8px;
    --br-6xs-9: 6.9px;
  }
  
@font-face {
  font-family: "Inter";
  src: url("../../assets/css/fonts/interfont/Inter-Bold.ttf");
}
@font-face {
  font-family: "Inter";
  src: url("../../assets/css/fonts/interfont/Inter-Black.ttf");
}
@font-face {
  font-family: "Inter";
  src: url("../../assets/css/fonts/interfont/Inter-ExtraBold.ttf");
}
@font-face {
  font-family: "Inter";
  src: url("../../assets/css/fonts/interfont/Inter-ExtraLight.ttf");
}
@font-face {
  font-family: "Inter-Light";
  src: url("../../assets/css/fonts/interfont/Inter-Light.ttf");
}
@font-face {
  font-family: "Inter";
  src: url("../../assets/css/fonts/interfont/Inter-Medium.ttf");
}
@font-face {
  font-family: "Inter";
  src: url("../../assets/css/fonts/interfont/Inter-Regular.ttf");
}
@font-face {
  font-family: "Inter";
  src: url("../../assets/css/fonts/interfont/Inter-SemiBold.ttf");
}
@font-face {
  font-family: "Inter";
  src: url("../../assets/css/fonts/interfont/Inter-Thin.ttf");
}
@font-face {
  font-family: "Inter";
  src: url("../../assets/css/fonts/interfont/Inter-VariableFont_slnt\,wght.ttf");
}