/* @font-face {
  font-family: "SF Pro Display";
  src:
    url("path-to-your-fonts/SF-Pro-Display-Regular.woff2") format("woff2"),
    url("path-to-your-fonts/SF-Pro-Display-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
} */

body {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  font-family: "SF Pro Display", sans-serif;
  font-weight: 400 !important;
  height: 100vh;
}

.font_12 {
  font-size: clamp(11px, 1vw, 12px) !important;
}
.font_13 {
  font-size: clamp(12px, 1.1vw, 13px) !important;
}
.font_14 {
  font-size: clamp(13px, 1.2vw, 14px) !important;
}
.font_15 {
  font-size: clamp(14px, 1.3vw, 15px) !important;
}

.font_16 {
  font-size: clamp(14px, 1.4vw, 16px) !important;
}
.font_18 {
  font-size: clamp(16px, 1.6vw, 18px) !important;
}

.font_20 {
  font-size: clamp(18px, 1.8vw, 20px) !important;
}
.font_24 {
  font-size: clamp(20px, 2.2vw, 24px) !important;
}
.font_36 {
  font-size: clamp(28px, 3.2vw, 36px) !important;
}
.font_42 {
  font-size: clamp(32px, 3.8vw, 42px) !important;
}
.font_48 {
  font-size: clamp(36px, 4.4vw, 48px) !important;
}
.icon_20 {
  width: 20px !important;
  height: 20px !important;
}
.icon_26 {
  width: 26px !important;
  height: 26px !important;
}
.icon_24 {
  width: 24px !important;
  height: 24px !important;
}
.icon_28 {
  width: 28px !important;
  height: 28px !important;
}
.icon_30 {
  width: 30px !important;
  height: 30px !important;
}

.icon-logo_24 {
  width: 200px;
  max-width: 100%;
  height: auto;
  min-height: 40px;
  border-radius: 5px !important;
  object-fit: contain;
}

@media (max-width: 575px) {
  .icon-logo_24 {
    width: 150px;
    min-height: 38px;
  }
}

.icon-logo_25 {
  width: 150px;
  max-width: 100%;
  height: auto;
  aspect-ratio: 1;
  border-radius: 10px !important;
  object-fit: cover;
}

@media (max-width: 575px) {
  .icon-logo_25 {
    width: 120px;
  }
}

.w-65 {
  width: 65% !important;
}

.w-fit {
  width: fit-content !important;
}

.ps_30 {
  padding-left: 30px !important;
}
.text_grey {
  color: #4f4f4f !important;
}
.text_lightgrey {
  color: #333333 !important;
}

.bg_secondary {
  background-color: #f2f2f2 !important;
}