/* Variable Css Start Here */

/* Font cdn starts here */
@import url("https://fonts.googleapis.com/css2?family=Playfair:ital,opsz,wght@0,5..1200,300..900;1,5..1200,300..900&display=swap");
@font-face {
  font-family: "inter_28pt-regular";
  src: url("../fonts/inter/Inter-Regular.otf");
}
@font-face {
  font-family: "inter_28pt-medium";
  src: url("../fonts/inter/Inter-Medium.otf");
}
@font-face {
  font-family: "inter_28pt-semiBold";
  src: url("../fonts/inter/Inter-SemiBold.otf");
}
@font-face {
  font-family: "inter_28pt-bold";
  src: url("../fonts/inter/Inter-Bold.otf");
}
@font-face {
  font-family: "inter_28pt-thin";
  src: url("../fonts/inter/Inter-Thin-BETA.otf");
}
@font-face {
  font-family: "inter_18pt-light";
  src: url("../fonts/inter/Inter-Light-BETA.otf");
}

@font-face {
  font-family: "tomato-regular";
  src: url("../fonts/tomato/TomatoGrotesk-Regular.otf");
}
@font-face {
  font-family: "tomato-medium";
  src: url("../fonts/tomato/TomatoGrotesk-Medium.otf");
}
@font-face {
  font-family: "tomato-semibold";
  src: url("../fonts/tomato/TomatoGrotesk-SemiBold.otf");
}
@font-face {
  font-family: "tomato-bold";
  src: url("../fonts/tomato/TomatoGrotesk-Bold.otf");
}
@font-face {
  font-family: "tomato-black";
  src: url("../fonts/tomato/TomatoGrotesk-Black.otf");
}
/* Font cdn ends here */

:root {
  /* Typography starts here */
  --secondary-regular-font: "inter_28pt-regular";
  --secondary-medium-font: "inter_28pt-medium";
  --secondary-semibold-font: "inter_28pt-semiBold";
  --secondary-light-font: "inter_28pt-light";
  --secondary-bold-font: "inter_28pt-bold";
  --primary-regular-font: "tomato-regular";
  --primary-bold-font: "tomato-bold";
  --primary-semibold-font: "tomato-semiBold";
  --primary-medium-font: "tomato-medium";
  --primary-black-font: "tomato-black";

  /* Typography ends here */
}
.primary-font,
.heading-font {
  font-family: var(--primary-bold-font);
}
.secondary-regular-font,
.para-font {
  font-family: var(--secondary-regular-font);
}

.secondary-bold-font,
.heading-bold {
  font-family: var(--secondary-bold-font);
}
.secondary-medium-font,
.heading-medium {
  font-family: var(--secondary-medium-font);
}
.secondary-semibold-font,
.heading-semibold {
  font-family: var(--secondary-semibold-font);
}
.secondary-light-font,
.heading-light {
  font-family: var(--secondary-light-font);
}

.primary-light-font {
  font-family: var(--primary-light-font);
}

.primary-regular-font,
.text-font {
  font-family: var(--primary-regular-font);
}

.primary-medium-font {
  font-family: var(--primary-medium-font);
}

.primary-semibold-font {
  font-family: var(--primary-semibold-font);
}

.primary-bold-font {
  font-family: var(--primary-bold-font);
}

.sub-font {
  font-family: var(--sub-font);
}

/* Font Sizes Here */
.level-1 {
  font-size: 58px;
}

.level-2-lg {
  font-size: 46px;
}

.level-2 {
  font-size: 34px;
}

.level-3 {
  font-size: 24px;
}

.level-4 {
  font-size: 20px;
}

.level-5 {
  font-size: 18px;
}

.level-6 {
  font-size: 16px;
}

.level-7 {
  font-size: 14px;
}

.level-8 {
  font-size: 12px;
}

.level-10 {
  font-size: 10px;
}
