.kanit-thin {
  font-family: "Kanit", serif;
  font-weight: 100;
  font-style: normal;
}

.kanit-extralight {
  font-family: "Kanit", serif;
  font-weight: 200;
  font-style: normal;
}

.kanit-light {
  font-family: "Kanit", serif;
  font-weight: 300;
  font-style: normal;
}

.kanit-regular {
  font-family: "Kanit", serif;
  font-weight: 400;
  font-style: normal;
}

.kanit-medium {
  font-family: "Kanit", serif;
  font-weight: 500;
  font-style: normal;
}

.kanit-semibold {
  font-family: "Kanit", serif;
  font-weight: 600;
  font-style: normal;
}

.kanit-bold {
  font-family: "Kanit", serif;
  font-weight: 700;
  font-style: normal;
}

.kanit-extrabold {
  font-family: "Kanit", serif;
  font-weight: 800;
  font-style: normal;
}

.kanit-black {
  font-family: "Kanit", serif;
  font-weight: 900;
  font-style: normal;
}

.kanit-thin-italic {
  font-family: "Kanit", serif;
  font-weight: 100;
  font-style: italic;
}

.kanit-extralight-italic {
  font-family: "Kanit", serif;
  font-weight: 200;
  font-style: italic;
}

.kanit-light-italic {
  font-family: "Kanit", serif;
  font-weight: 300;
  font-style: italic;
}

.kanit-regular-italic {
  font-family: "Kanit", serif;
  font-weight: 400;
  font-style: italic;
}

.kanit-medium-italic {
  font-family: "Kanit", serif;
  font-weight: 500;
  font-style: italic;
}

.kanit-semibold-italic {
  font-family: "Kanit", serif;
  font-weight: 600;
  font-style: italic;
}

.kanit-bold-italic {
  font-family: "Kanit", serif;
  font-weight: 700;
  font-style: italic;
}

.kanit-extrabold-italic {
  font-family: "Kanit", serif;
  font-weight: 800;
  font-style: italic;
}

.kanit-black-italic {
  font-family: "Kanit", serif;
  font-weight: 900;
  font-style: italic;
}

.teko-regular {
  font-family: "Teko", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.teko-medium {
  font-family: "Teko", serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}
.teko-semibold {
  font-family: "Teko", serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}
.teko-bold {
  font-family: "Teko", serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}

.inter-regular {
  font-family: "Inter", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
.inter-medium {
  font-family: "Inter", serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}
.inter-semibold {
  font-family: "Inter", serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}
.inter-bold {
  font-family: "Inter", serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}

.navbar a,
.curved-arrow {
  position: relative;
}
.navbar a,
#mobile-menu a {
  color: #4e4e4e;
}
.navbar a.active,
#mobile-menu a.active {
  color: #34bec1;
}
.navbar a:hover,
#mobile-menu a:hover {
  color: #34bec1;
}
.navbar a.active:before {
  content: "";
  width: 10px;
  height: 2px;
  background: #34bec1;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(0px, -50%);
}

.gradient-color,
.gradient-button {
  background: linear-gradient(to right, #0891b2, #2563eb);
  transition: all 0.3s ease;
}
.gradient-button:hover {
  background: linear-gradient(to right, #0e7490, #1d4ed8);
  transform: translateY(-1px);
}
/* expertise */
.expertise-item h3.active,
.expertise-item h3:hover {
  color: #34bec1;
}
.expertise-item h3.active {
  padding-left: 30px;
}
.expertise-item h3.active:before {
  content: "";
  width: 15px;
  height: 2px;
  background: #34bec1;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(0px, -4px);
}
