/* Fonts  */

@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Quattrocento:wght@400;700&display=swap");

.montserrat {
  font-family: "Montserrat", sans-serif;
  font-style: normal;
}

.Inter {
  font-family: "Inter", sans-serif;
  font-style: normal;
}
.Quattrocento {
  font-family: "Quattrocento", serif;
  font-style: normal;
}

@font-face {
  font-family: "Chalofa";
  src: url("../fonts/Chalofa.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}

.Chalofa {
  font-family: "Chalofa", cursive;
  font-size: 94px;
}

@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/SFPRODISPLAYREGULAR.OTF") format("opentype");
  font-weight: normal;
  font-style: normal;
}
.SF-PRO {
  font-family: "SF Pro Display", sans-serif;
}

/* ----------------------- */

/* Common CSS  */

.bg-Primary {
  background: #35b1ef !important;
}
.text-Primary {
  color: #35b1ef !important;
}

/* --------------------------- */

.container-xxl,
.container {
  max-width: 1457px !important;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 43px;
  background-color: #2b4760;
  color: #ffffff;
  padding: 11.5px 25px 13px 25px;
  font-size: 14px;
  font-weight: 400;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: background 0.3s ease;
}

.button:hover {
  background-color: #3a5b7a;
}

.title {
  font-size: 84px;
  font-family: "Montserrat", sans-serif;
  font-style: normal;
  font-weight: 700;
  line-height: 85%; /* 71.4px */
  letter-spacing: -1.68px;
  color: #2b4760;
  text-align: center;
}

@media (max-width: 576px) {
  .Chalofa {
    font-size: 54px;
  }
  .title {
    font-size: 56px;
  }
}

@media (max-width: 950px) {
  .Chalofa {
    font-size: 74px;
  }
  .title {
    font-size: 58px;
  }
}