/* BASE CSS START */
body {
  font-family: "Hanken Grotesk", sans-serif;
  padding: 0;
}

.s-container {
  display: block;
  max-width: 1376px;
  padding: 0 2rem;
  margin: 0 auto;
  width: 100%;
}

@media screen and (max-width: 767px) {
  .s-container {
    padding: 0 1rem;
  }
}

:root {
  --Primary: #1363df;
  --Primary-2: #47b5ff;
  --Primary-BG: #fafafa;
  --Primary-BG-3: #7e7e8f;
  --Primary-BG-7: #dff6ff;
  --Primary-BG-9: #1d3e52;
  --Primary-Lighter: #e1ecf5;
  --Primary-Border: #e1e1eb;
  --Secondary: #274252;
  --Secordary-2: #071c29;
  --soluk-text: #757e83;
  --Paragraph: #7a7a7a;
  --Paragraph-2: #1d3e52;
  --White: #fff;
  --Territory: #00417a;
  --header-height: 69px;
}

::-webkit-scrollbar {
  display: none;
}

/* BASE CSS END */
/* COMPONENTS START */

.show-device,
.show-device-2 {
  display: none;
}

.hidden-device {
  display: block;
}

.default-btn {
  display: inline-flex;
  padding: 12px 24px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  text-align: center;
  font-size: clamp(15px, 1.1vw, 19px);
  font-weight: 400;
  line-height: 1;
  border: 1px solid transparent;
  border-radius: 100px;
  width: max-content;
  transition: 0.4s;
  cursor: pointer;
}

.default-btn-primary {
  background: var(--Primary);
  color: var(--Primary-BG);
}

.default-btn-primary-outline {
  border-color: var(--Primary);
  color: var(--Primary);
  background: transparent;
}

.h-full {
  height: 100%;
}

.product-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
  height: 100%;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  padding: 0 0 1rem;
}

.product-card .product-img-wrapper {
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: center;
  gap: 48px;
  border-radius: 20px;
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: 390px;
}

.product-card .product-img-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 389.33/389.33;
  max-height: 390px;
  transition: 0.4s;
  border-radius: 16px;
}

.product-card .product-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.product-card .product-info .info-title {
  color: var(--Secordary-2);
  text-align: center;
  font-size: 26px;
  font-weight: 600;
  line-height: 32px;
  letter-spacing: -0.52px;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
}

.product-card .product-info .info-price {
  color: #1d3e52;
  text-align: center;
  font-size: 17px;
  font-weight: 400;
  line-height: 26px;
}

.default-header {
  margin-bottom: 3rem;
}

.blog-gallery .default-header {
  margin-bottom: 1.5rem;
}

.default-header .show-all {
  color: #1d3e52;
  font-size: 14px;
  font-weight: 500;
  line-height: 32px;
  /* 228.571% */
  letter-spacing: 0.84px;
  margin-bottom: 12px;
  display: inline-block;
}

.default-header .header-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4rem;
}

.default-header .header-content .content-title {
  color: var(--Secordary-2);
  font-size: 40px;
  font-weight: 600;
  line-height: 56px;
  /* 140% */
  letter-spacing: -0.8px;
  margin: 0;
}

.default-header .header-content .content-nav {
  display: flex;
  padding: 4px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  border-radius: 16px;
  background: var(--White);
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset,
    0px 2px 2px 0px rgba(0, 0, 0, 0.08);
}

.default-header .header-content .content-nav .nav-btn {
  display: flex;
  width: 48px;
  height: 48px;
  padding: 6.857px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6.857px;
  cursor: pointer;
  border-radius: 12px;
  transition: all 300ms ease-out;
  color: var(--Paragraph);
  flex-shrink: 0;
}

.default-header .header-content .content-nav .nav-btn.swiper-button-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.default-header .header-content .content-nav .nav-btn:first-child {
  border-right: 1px solid rgb(122 122 122 / 8%);
}

.default-header .header-content .content-nav .nav-fraction {
  display: flex;
  padding: 0px 8px;
  align-items: center;
  gap: 8px;
  color: var(--Paragraph);
  text-align: center;
  font-weight: 400;
  line-height: normal;
  height: 48px;
  border-right: 1px solid rgb(122 122 122 / 8%);
  border-left: 1px solid rgb(122 122 122 / 8%);
}

.default-header .header-content .content-nav.has-fraction .nav-btn {
  border-right: 0;
}

.default-header .header-content .content-nav .nav-btn svg {}

.default-header .header-content .content-nav .nav-btn svg path {}

.blog-card {
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 1 0 0;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset,
    0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08);
  transition: 0.4s;
  height: 100%;
}

.blog-card .blog-header {
  display: flex;
  padding: 32px 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
  margin-bottom: 8px;
  flex: 1;
}

.blog-card .blog-header .blog-header-top {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.blog-card .blog-header .blog-category {
  color: var(--Paragraph-2);
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  line-height: 26px;
  /* 185.714% */
}

.blog-card .blog-header .blog-date {
  color: var(--Primary-BG-3);
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
  /* 185.714% */
}

.blog-card .blog-body {}

.blog-card .blog-title {
  color: var(--Secordary-2);
  font-size: 21px;
  font-weight: 600;
  line-height: 26px;
  /* 123.81% */
  letter-spacing: -0.42px;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.blog-card .blog-img {
  height: 219px;
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  width: 100%;
}

.blog-card .blog-img img {
  width: 100%;
  height: 100%;
  aspect-ratio: 389.33/219;
  align-self: stretch;
  object-fit: cover;
  border-radius: 16px;
  transition: 0.4s;
  will-change: transform;
}

.media-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 1 0 0;
  border-radius: 16px;
  overflow: hidden;
  transition: all 400ms ease;
  height: 100%;
}

.media-item .media-img {
  position: relative;
  overflow: hidden;
  height: 237px;
  margin-bottom: 8px;
  border-radius: 8px;
  width: 100%;
}

.all-media-container .media-item .media-img {
  height: 175px;
}

.media-item .media-img img {
  aspect-ratio: 421.33/237;
  border-radius: 8px;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.4s;
  will-change: transform;
}

.media-item .media-img .media-icon {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  z-index: 1;
}

.media-item .media-img .media-icon svg {}

.media-item .media-img .media-icon svg path {}

.media-item .media-body {
  display: flex;
  padding: 8px 12px;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}

.media-item .media-body .media-name {
  color: var(--Secordary-2);
  font-size: clamp(16px, 1.2vw, 21px);
  font-weight: 600;
  line-height: 26px;
  /* 123.81% */
  letter-spacing: -0.42px;
  margin: 0;
  transition: color 400ms ease;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
}

.media-item .media-footer {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 0 12px 8px;
}

.media-item .media-footer .media-category-name {
  color: var(--Paragraph-2);
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  line-height: 26px;
  /* 185.714% */
}

.media-item .media-footer .media-date {
  color: var(--Primary-BG-3);
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
  /* 185.714% */
}

.references-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  height: 100%;
}

.references-item .references-img {
  padding: 12px 0;
  flex: 1;
}

.references-item .references-img img {
  max-height: 190px;
  width: 100%;
  object-fit: contain;
}

.references-item .references-view {
  display: flex;
  padding: 4px 16px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  color: var(--Primary-BG-3);
  border-radius: 100px;
  background: var(--Primary-BG);
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  /* 142.857% */
  transition: 0.4s;
  cursor: pointer;
}

.references-item .references-view svg {}

.references-item .references-view svg path {}

.hidden-form {
  position: absolute;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
}

.stats-item {
  display: flex;
  padding: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  flex: 1 0 0;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 1.724px 0px #fff inset;
}

.stats-item .item-numb {
  color: var(--Primary);
  font-size: 64px;
  font-weight: 600;
  line-height: 73px;
  /* 114.063% */
  letter-spacing: -1.28px;
}

.stats-item .item-desc {
  color: var(--Secordary-2);
  font-size: 26px;
  font-weight: 600;
  line-height: 32px;
  /* 123.077% */
  letter-spacing: -0.52px;
}

.blog-card-item {
  display: flex;
  min-width: 400px;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 1 0 0;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset,
    0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08);
}

.blog-card-item .blog-card-img {
  width: 100%;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
}

.blog-card-item .blog-card-img img {
  height: 219px;
  align-self: stretch;
  aspect-ratio: 389.33/219;
  border-radius: 8px;
  object-fit: cover;
  width: 100%;
  transition: 0.4s;
}

.blog-card-item .blog-card-info {
  display: flex;
  padding: 12px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
}

.blog-card-item .blog-card-info .info-header {
  /* 185.714% */
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.blog-card-item .blog-card-info .info-header .blog-category {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  color: var(--Paragraph-2);
  font-size: 14px;
  font-weight: 500;
  line-height: 26px;
}

.blog-card-item .blog-card-info .info-header .blog-date {
  color: var(--Primary-BG-3);
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
  /* 185.714% */
}

.blog-card-item .blog-card-info .info-body {}

.blog-card-item .blog-card-info .info-body .blog-title {
  color: var(--Secordary-2);
  font-size: 21px;
  font-weight: 600;
  line-height: 26px;
  /* 123.81% */
  letter-spacing: -0.42px;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.blog-card-item .blog-card-info .info-footer {
  color: #1d3e52;
  font-size: 17px;
  font-weight: 400;
  line-height: 26px;
  /* 152.941% */
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.blog-card-item .blog-card-info .info-footer p {
  margin: 0;
}

.banner-navigation {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
  gap: 4px;
  border-radius: 16px;
}

.banner-navigation .banner-play-pause {
  padding: 4px;
}

.banner-navigation .banner-play-pause .play {
  display: none;
  cursor: pointer;
  transition: 0.4s;
}

.banner-navigation .banner-play-pause .play path {}

.banner-navigation .banner-play-pause .pause {
  cursor: pointer;
  transition: 0.4s;
}

.banner-navigation .banner-play-pause .pause path {}

.banner-navigation .banner-fraction-wrapper {
  padding: 4px 0;
  padding-right: 4px;
  display: flex;
  align-items: center;
}

.banner-navigation .banner-fraction-wrapper .banner-fraction {
  padding: 0 8px;
  font-size: 13px;
  font-weight: 400;
  line-height: normal;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.banner-navigation .banner-fraction-wrapper .banner-fraction .swiper-pagination-bullet {
  background: #d9d9d9;
  opacity: 1;
}

.banner-navigation .banner-fraction-wrapper .banner-fraction .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: var(--Primary-BG-9);
}

.banner-navigation .banner-nav-btn {
  display: flex;
  align-items: center;
  gap: 4px;
}

.banner-navigation .banner-nav-btn .nav-btn {
  padding: 4px;
  cursor: pointer;
  transition: 0.4s;
}

.banner-navigation .banner-nav-btn .nav-btn.swiper-button-disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.banner-navigation .banner-nav-btn .nav-btn svg {}

.banner-navigation .banner-nav-btn .nav-btn svg path {}

.default-alert-info {
  position: fixed;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  will-change: bottom;
  transition: bottom 200ms ease-out;
}

.default-alert-info .info-text {
  background: var(--teal);
  padding: 0.5rem 1.5rem;
  border-radius: 100px;
  color: var(--Secordary-2);
  font-size: 18px;
}

.default-alert-info.active {
  bottom: 2rem;
}

.detail-breadcrumb {
  width: 100%;
}

.detail-breadcrumb ul,
.detail-breadcrumb ol {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 20px 0;
  white-space: nowrap;
  flex-wrap: nowrap;
  overflow-x: auto;
}

.detail-breadcrumb ul li {}

.detail-breadcrumb ul li.active,
.detail-breadcrumb ol li.active {
  color: var(--Primary);
}

.detail-breadcrumb ul li a,
.detail-breadcrumb ol li a {
  display: flex;
  padding: 4px;
  align-items: center;
  gap: 8px;
  color: var(--Primary-BG-3);
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
}

.detail-breadcrumb ul .breadcrumb-icon {}

.detail-breadcrumb ul .breadcrumb-icon svg {}

.detail-breadcrumb ul .breadcrumb-icon svg path {}

.blog-gallery {
  margin-bottom: 4rem;
  width: 100%;
  position: relative;
  overflow: hidden;
}

.career-detail .blog-gallery {
  margin-bottom: 0;
}

.blog-gallery .gallery-wrapper {
  padding: 24px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
}

.blog-gallery .gallery-wrapper .blog-gallery-swiper {
  position: relative;
  overflow: hidden;
}

.blog-gallery .gallery-wrapper .blog-gallery-swiper .swiper-wrapper {}

.blog-gallery .gallery-wrapper .blog-gallery-swiper .swiper-wrapper .swiper-slide {}

.blog-gallery-swiper .swiper-wrapper .swiper-slide a {}

.blog-gallery .gallery-wrapper .blog-gallery-swiper .swiper-wrapper .swiper-slide a img {
  height: 240px;
  border-radius: 20px;
  width: 100%;
  object-fit: cover;
}

.blog-gallery .nav-fraction .swiper-pagination-bullet {
  color: var(--Primary-BG-3);
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  border-radius: 4px;
  padding: 1.5px 7.5px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 400ms ease;
  width: auto;
  height: auto;
  opacity: 1;
  background: transparent;
}

.blog-gallery .nav-fraction .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: var(--Primary-BG-7);
}

.media-category {
  width: 310px;
  display: grid;
  gap: 1.5rem;
  position: sticky;
  top: calc(var(--header-height) + 1.5rem);
}

.media-category .category-main-title {
  color: var(--Secordary-2);
  font-size: 21px;
  font-weight: 600;
  line-height: 26px;
  /* 123.81% */
  letter-spacing: -0.42px;
  padding: 11px 1rem;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.media-category .category-list {
  display: grid;
  gap: 4px;
}

.media-category .category-list .category-item {
  display: flex;
  padding: 11px 16px;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-radius: 100px;
  cursor: pointer;
  transition: all 400ms ease;
}

.media-category .category-list .category-item .category-title {}

.media-category .category-list .category-item .category-item-info {
  display: flex;
  align-items: center;
  gap: 8px;
}

.media-category .category-list .category-item .category-item-info .category-item-count {
  display: inline-flex;
  padding: 0px 12px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 16px;
  background: var(--Primary-BG);
  color: var(--Primary-BG-3);
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  /* 162.5% */
}

.media-category .category-list .category-item .category-item-info .item-hidden-arrow {
  transition: 0.4s;
  position: relative;
  overflow: hidden;
  width: 0;
  transition: width 400ms ease;
}

.media-category .category-list .category-item .category-item-info .item-hidden-arrow svg {}

.media-category .category-list .category-item .category-item-info .item-hidden-arrow svg path {}

.page.nf404 {
  padding: 6rem 0;
}

.page.nf404 h2 {
  margin: 1.5rem 0;
  color: #00417a;
}

.page.nf404 h3 {
  color: #00417a;
}

.page.nf404 a {
  color: #00417a;
  border-color: #00417a;
  box-shadow: unset !important;
}

.page.nf404 a:hover {
  background-color: #00417a;
  color: white;
}

@media screen and (max-width: 1199px) {
  .blog-card-item {
    min-width: unset;
  }

  .product-card {
    gap: 2rem;
  }

  .product-card .product-info .info-title {
    font-size: 22px;
  }

  .product-card .product-img-wrapper img {
    max-height: 280px;
  }

  .product-card .product-img-wrapper {
    min-height: 280px;
  }

  .default-header .header-content .content-title {
    font-size: 2rem;
  }

  .stats-item .item-numb {
    font-size: 42px;
  }

  .stats-item {
    padding: 1.5rem;
  }

  .hidden-device {
    display: none;
  }

  .show-device-2 {
    display: block;
  }
}

@media screen and (max-width: 991px) {
  .default-header .header-content .content-title {
    font-size: 2rem;
  }

  .blog-card .blog-header {
    padding: 1.5rem 1rem;
  }

  .blog-card .blog-title {
    font-size: 18px;
  }

  .stats-item .item-numb {
    font-size: 52px;
  }

  .stats-item {
    padding: 24px;
  }

  .media-item .media-body .media-name {
    line-height: normal;
    font-size: 17px;
  }

  .show-device {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  .default-header .header-content .content-title {
    line-height: 1.5;
    font-size: 24px;
  }

  .default-header .header-content {
    gap: 2rem;
  }

  .product-card .product-info .info-title {
    font-size: 18px;
    line-height: normal;
  }

  .product-card {
    gap: 1rem;
  }

  .product-card .product-img-wrapper img {
    max-height: 240px;
  }

  .product-card .product-img-wrapper {
    min-height: 240px;
  }

  .media-item .media-body {
    padding: 8px;
  }

  .media-item .media-footer {
    padding: 0 8px 4px;
    flex-direction: column;
    gap: 0;
    align-items: start;
  }

  .all-media-container .media-item .media-body .media-name {
    font-size: 15px;
  }

  .all-media-container .media-item .media-img {
    height: 140px;
  }

  .media-category {
    width: 100%;
  }

  .stats-item .item-numb {
    font-size: 42px;
  }

  .default-header {
    margin-bottom: 2rem;
  }
}

/* COMPONENTS END */
/* BANNER START */
.banner {}

.banner .banner-wrapper {}

.banner .banner-wrapper .banner-swiper {
  position: relative;
  overflow: hidden;
  height: 500px;
  width: 100%;
  margin-bottom: 1rem;
}

.banner .banner-wrapper .banner-swiper .swiper-wrapper {}

.banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  gap: 2rem;
}

.banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content-area-wrapper {
  flex: 1;
}

.banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-video {
  width: 50%;
}

.banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-video video {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-video img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.banner .banner-wrapper .banner-swiper .swiper-wrapper .banner-content-wrapper {
  display: flex;
  align-items: center;
  height: 100%;
}

.banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content {
  position: relative;
  max-width: 480px;
  display: grid;
  gap: 2rem;
  padding-left: 1.5rem;
}

.banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content .content-main {
  display: grid;
  gap: 2rem;
}

.banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content .content-main .content-title {
  color: var(--Secordary-2);
  font-size: 48px;
  font-weight: 600;
  line-height: 56px;
  /* 116.667% */
  letter-spacing: -0.96px;
  margin: 0;
}

.banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content .content-main .content-desc {
  color: #1d3e52;
  font-size: clamp(16px, 1.2vw, 21px);
  font-style: normal;
  font-weight: 400;
  line-height: 32px;
  /* 152.381% */
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content .content-button-group {
  display: inline-flex;
  gap: 1.5rem;
}

.banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content .content-button-group a {
  border-width: 2px;
  font-weight: 500;
}

.banner .banner-wrapper .banner-navigation-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

@media screen and (max-width: 1199px) {
  .banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content .content-main .content-desc {
    line-height: 1.5;
  }

  .banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content .content-button-group {
    gap: 1rem;
  }
}

@media screen and (max-width: 991px) {
  .banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content .content-main .content-title {
    font-size: 38px;
    max-width: 320px;
    line-height: normal;
  }

  .banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content .content-main {
    gap: 1rem;
  }

  .banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content {
    gap: 1.5rem;
  }

  .banner .banner-wrapper .banner-swiper {
    height: auto;
    margin-top: 2rem;
  }

  .banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content .content-main .content-desc {
    max-width: 320px;
  }
}

@media screen and (max-width: 767px) {
  .banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-video {
    position: relative;
    margin-top: 1rem;
    width: 100%;
  }

  .banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-video img {
    object-fit: contain;
    margin-bottom: 2rem;
  }

  .banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide {
    flex-direction: column;
  }

  .banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content {
    width: 100%;
  }

  .banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content .content-main .content-title {
    width: 100%;
  }

  .banner .banner-wrapper .banner-swiper .swiper-wrapper .swiper-slide .banner-content .content-main .content-desc {
    width: 100%;
  }
}

/* BANNER END */
/* HOMEPAGE SERVICES START */
.homepage-services {
  margin: 12px 12px 0;
}

.homepage-services .services-wrapper {}

.homepage-services .services-wrapper .services-header {
  max-width: 720px;
  margin: 88px auto 100px;
}

.homepage-services .services-wrapper .services-header .header-title {
  text-align: center;
  font-size: 64px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -1.28px;
  margin-bottom: 1.5rem;
}

.color-primary {
  color: var(--Primary);
}

.color-secondary {
  color: var(--Secordary-2);
}

.homepage-services .services-wrapper .services-header .header-desc {
  color: var(--soluk-text);
  font-size: clamp(16px, 1.2vw, 21px);
  font-weight: 500;
  line-height: normal;
  text-align: center;
}

.homepage-services .services-wrapper .services-header .header-desc p {
  margin: 0;
}

.homepage-services .services-wrapper .services-list {
  display: flex;
  flex-wrap: wrap;
  padding: 24px;
}

.homepage-services .services-wrapper .services-list .services-item-vertical-wrapper {
  width: 100%;
  position: sticky;
  top: var(--header-height);
  padding: 12px 0;
  background: #fff;
  flex: 0 0 50%;
  max-height: 100%;
  height: auto;
  gap: 1rem;
}

.homepage-services .services-wrapper .services-list .services-item-vertical-wrapper:nth-child(odd) {
  padding-left: 1.5rem;
}

.homepage-services .services-wrapper .services-list .services-item-horizontal-wrapper {
  width: 100%;
  position: sticky;
  top: var(--header-height);
  padding: 12px 0;
  background: #fff;
  flex: 0 0 100%;
}

.services-item-horizontal {
  display: flex;
  padding: 64px 48px;
  justify-content: center;
  align-items: center;
  gap: 64px;
  width: 100%;
  border-radius: 16px;
  background: #f5f5f5;
  position: sticky;
  top: 12px;
}

.services-item-horizontal .item-content {
  width: 56%;
  padding: 0 clamp(2rem, 6.5vw, 120px);
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.services-item-horizontal .item-content .content-title {
  color: var(--Secordary-2);
  font-size: 40px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.8px;
  margin: 0;
}

.services-item-horizontal .item-content .content-desc {
  color: var(--soluk-text);
  font-size: clamp(16px, 1.1vw, 19px);
  font-weight: 400;
  line-height: normal;
  margin: 0;
  max-width: 460px;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.services-item-horizontal .item-content a {
  margin-top: 1.5rem;
  padding: 12px 32px;
  font-weight: 400;
  border-width: 1px;
}

.services-item-horizontal .item-img {
  flex: 1;
  height: 100%;
}

.services-item-horizontal .item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  max-height: 395px;
  aspect-ratio: 700/393.75;
  border-radius: 16px;
}

.services-item-vertical {
  display: flex;
  height: 749px;
  padding: 64px 48px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 64px;
  border-radius: 16px;
  background: #f5f5f5;
  position: sticky;
  top: 0;
}

.services-item-vertical .item-content {
  text-align: center;
  display: grid;
  gap: 1.5rem;
  align-items: center;
}

.services-item-vertical .item-content .content-title {
  color: var(--Secordary-2);
  text-align: center;
  font-size: 32px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.64px;
  margin: 0;
}

.services-item-vertical .item-content .content-desc {
  color: var(--soluk-text);
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  margin: 0;
  max-width: 480px;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.services-item-vertical .item-content a {
  margin: 0 auto;
  margin-top: 0.5rem;
  font-size: 14px;
  font-weight: 400;
  border-width: 1px;
  padding: 6px 24px;
  line-height: 18px;
}

.services-item-vertical .item-img {
  width: 100%;
}

.services-item-vertical .item-img img {
  width: 100%;
  height: 100%;
  max-height: 378px;
  aspect-ratio: 16/9;
  object-fit: cover;
  border-radius: 16px;
}

.more-discover {
  display: flex;
  flex-direction: column;
  padding: 64px 48px;
  justify-content: center;
  align-items: center;
  gap: 1.5rem;
  flex: 1 0 0;
  border-radius: 16px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  margin: 12px 24px;
}

.more-discover .discover-title {
  color: var(--Secordary-2);
  text-align: center;
  font-size: 64px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -1.28px;
}

.more-discover .discover-desc {
  color: var(--soluk-text);
  text-align: center;
  font-size: clamp(16px, 1.2vw, 21px);
  font-weight: 500;
  line-height: normal;
}

.more-discover .discover-btn-group {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.more-discover .discover-btn-group .discover-btn {
  padding: 8px 24px;
  line-height: normal;
  font-size: clamp(16px, 1.2vw, 21px);
  line-height: 40px;
}

@media screen and (max-width: 1199px) {
  .services-item-horizontal .item-content {
    padding: 2rem;
  }

  .homepage-services .services-wrapper .services-header {
    margin: 4rem auto;
  }
}

@media screen and (max-width: 991px) {
  .homepage-services .services-wrapper .services-header .header-title {
    font-size: 48px;
  }

  .homepage-services .services-wrapper .services-header {
    max-width: 520px;
    margin: 3rem auto;
  }

  .services-item-horizontal {
    padding: 1rem;
    gap: 2.5rem;
  }

  .services-item-horizontal .item-content .content-title {
    font-size: 32px;
  }

  .services-item-vertical {
    height: 100%;
    padding: 3rem 2.5rem;
    gap: 2.5rem;
  }

  .services-item-vertical .item-content .content-title {
    font-size: 28px;
  }

  .services-item-vertical .item-content .content-desc {
    font-size: 14px;
  }

  .more-discover .discover-title {
    font-size: 2.5rem;
  }

  .more-discover .discover-btn-group .discover-btn {
    padding: 4px 1.5rem;
  }

  .more-discover {
    padding: 3rem 2.5rem;
  }
}

@media screen and (max-width: 767px) {
  .homepage-services .services-wrapper .services-header .header-title {
    font-size: 32px;
  }

  .homepage-services .services-wrapper .services-header .header-desc {
    font-size: 14px;
  }

  .services-item-horizontal {
    flex-direction: column-reverse;
    gap: 0;
  }

  .services-item-horizontal .item-content {
    width: 100%;
    padding: 1.5rem;
  }

  .services-item-horizontal .item-content .content-title {
    font-size: 28px;
  }

  .services-item-horizontal .item-content .content-desc {
    font-size: 15px;
  }

  .homepage-services {
    margin: 0;
  }

  .homepage-services .services-wrapper .services-list .services-item-vertical-wrapper {
    flex: 1 0 100%;
  }

  .homepage-services .services-wrapper .services-list .services-item-vertical-wrapper:nth-child(odd) {
    padding-left: 0;
  }

  .more-discover .discover-title {
    font-size: 2.2rem;
  }

  .more-discover {
    padding: 2.5rem 2rem;
  }
}

/* HOMEPAGE SERVICES END */
/* HOMEPAGE PRODUCT START */
.homepage-product {
  background: var(--Primary-BG);
  padding-top: 24px;
}

.homepage-product .product-wrapper {
  padding: 8rem 0;
}

.homepage-product .product-wrapper .product-list {
  position: relative;
  overflow: hidden;
}

.homepage-product .product-wrapper .product-list .swiper-wrapper {}

.homepage-product .product-wrapper .product-list .swiper-wrapper .swiper-slide {
  max-height: 100%;
  height: auto;
}

@media screen and (max-width: 991px) {
  .homepage-product .product-wrapper {
    padding: 3rem 0;
  }
}

/* HOMEPAGE PRODUCT END */
/* HOMEPAGE STATS START */
.homepage-stats {}

.homepage-stats .stats-wrapper {
  position: relative;
  padding: 6rem 1rem;
}

.homepage-stats .stats-wrapper .stats-bg {
  position: absolute;
  inset: 0;
  z-index: -1;
}

.homepage-stats .stats-wrapper .stats-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.homepage-stats .stats-wrapper .stats-header {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 3rem;
}

.homepage-stats .stats-wrapper .stats-header .header-title {
  color: var(--Primary-BG);
  text-align: center;
  font-size: 48px;
  font-weight: 600;
  line-height: 56px;
  /* 116.667% */
  letter-spacing: -0.96px;
  margin: 0;
}

.homepage-stats .stats-wrapper .stats-header .header-desc {
  color: var(--Primary-BG);
  text-align: center;
  font-size: 19px;
  font-weight: 400;
  line-height: 32px;
  /* 168.421% */
}

.homepage-stats .stats-wrapper .stats-header .header-desc p {
  margin: 0;
}

.homepage-stats .stats-wrapper .stats-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
}

@media screen and (max-width: 1199px) {
  .homepage-stats .stats-wrapper .stats-list {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media screen and (max-width: 991px) {
  .homepage-stats .stats-wrapper .stats-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }

  .homepage-stats .stats-wrapper {
    padding: 3.5rem 1rem;
  }

  .homepage-stats .stats-wrapper .stats-header .header-title {
    font-size: 2.5rem;
  }
}

@media screen and (max-width: 767px) {
  .homepage-stats .stats-wrapper .stats-list {
    grid-template-columns: 1fr;
  }

  .homepage-stats .stats-wrapper .stats-header .header-desc {
    font-size: 16px;
    line-height: 1.5;
  }

  .homepage-stats .stats-wrapper .stats-header .header-title {
    font-size: 40px;
    line-height: 1.2;
  }
}

/* HOMEPAGE STATS END */
/* HOMEPAGE BLOG START */
.homepage-blog {
  background: var(--Primary-BG);
}

.homepage-blog .blog-wrapper {
  padding: 8rem 0 0;
}

.homepage-blog .blog-wrapper .blog-list {
  position: relative;
  overflow: hidden;
  padding-bottom: 3rem;
}

.homepage-blog .blog-wrapper .blog-list .swiper-slide {
  max-height: 100%;
  height: auto;
}

@media screen and (max-width: 991px) {
  .homepage-blog .blog-wrapper {
    padding: 3rem 0 0;
  }

  .blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list {
    flex-wrap: wrap;
  }
}

/* HOMEPAGE BLOG END */
/* HOMEPAGE REFERENCES START */
.homepage-references {
  background: var(--Primary-BG);
}

.homepage-references .references-wrapper {
  padding: 8rem 0 0;
}

.homepage-references .references-wrapper .references-slider {
  position: relative;
  overflow: hidden;
  padding: 4rem 0 3rem;
}

.homepage-references .references-wrapper .references-slider .swiper-wrapper {}

.homepage-references .references-wrapper .references-slider .swiper-wrapper .swiper-slide {
  max-height: 100%;
  height: auto;
}

@media screen and (max-width: 1199px) {
  .homepage-references .references-wrapper {
    padding-top: 4rem;
  }
}

@media screen and (max-width: 991px) {
  .homepage-references .references-wrapper .references-slider {
    padding: 0;
  }

  .homepage-references .references-wrapper {
    padding-bottom: 0;
    padding: 3rem 0;
  }
}

/* HOMEPAGE REFERENCES END */
/* REFERENCES MODAL START */
.references-modal {
  position: fixed;
  inset: 0;
  z-index: 11;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.4s ease;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

.references-modal.show {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}

.references-modal.show .references-modal-wrapper {
  transform: unset;
}

.references-modal.hide .references-modal-wrapper {
  transform: translateX(-200%);
}

.references-modal .references-modal-backdrop {
  background: rgba(0, 0, 0, 20%);
  position: absolute;
  inset: 0;
}

.references-modal .references-modal-wrapper {
  position: relative;
  display: flex;
  max-width: 720px;
  min-width: 370px;
  padding: 24px;
  gap: 24px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset,
    0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08);
  transition: all 0.4s ease;
  will-change: transform;
  transform: translateX(200%);
}

.references-modal .references-modal-wrapper .modal-img {
  flex: 1;
}

.references-modal .references-modal-wrapper .modal-img img {
  width: 100%;
  object-fit: cover;
  height: 283px;
  border-radius: 8px;
}

.references-modal .references-modal-wrapper .references-modal-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 1 0 0;
  max-width: 324px;
}

.references-modal .references-modal-wrapper .references-modal-content .modal-close {
  align-self: end;
  margin-bottom: 8px;
  transition: 0.4s;
  cursor: pointer;
}

.references-modal .references-modal-wrapper .references-modal-content .modal-close svg {}

.references-modal .references-modal-wrapper .references-modal-content .modal-close svg path {}

.references-modal .references-modal-wrapper .references-modal-content .references-info {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 0 1.5rem;
}

.references-modal .references-modal-wrapper .references-modal-content .references-info .references-title {
  color: var(--Secordary-2);
  font-size: 21px;
  font-weight: 600;
  line-height: 26px;
  /* 123.81% */
  letter-spacing: -0.42px;
}

.references-modal .references-modal-wrapper .references-modal-content .references-info .references-date {
  color: var(--Primary-BG-3);
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
  /* 185.714% */
}

.references-modal .references-modal-wrapper .references-modal-content .references-info .references-desc {
  color: var(--Paragraph-2);
  font-size: 17px;
  font-weight: 500;
  line-height: 26px;
  /* 152.941% */
  max-height: 142px;
  position: relative;
  overflow-y: auto;
}

.references-modal .references-modal-wrapper .references-modal-content .references-info .references-desc p {
  margin: 0;
}

@media screen and (max-width: 767px) {
  .references-modal .references-modal-wrapper {
    flex-direction: column;
    max-width: 85%;
    padding: 20px;
  }

  .references-modal .references-modal-wrapper .references-modal-content {
    width: 100%;
    max-width: 100%;
  }

  .references-modal .references-modal-wrapper .references-modal-content .modal-close {
    position: absolute;
    top: -52px;
    left: 50%;
    transform: translateX(-50%);
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--Secordary-2);
    color: #fff;
  }

  .references-modal .references-modal-wrapper .references-modal-content .references-info {
    padding: 0 1rem;
  }
}

/* REFERENCES MODAL END */
/* CONTACT START */
.contact {
  background: var(--Primary-BG);
}

.contact .contact-wrapper {}

.contact .contact-wrapper .contact-header {
  padding: 4rem 0 1.5rem;
  display: grid;
  gap: 1.5rem;
}

.contact .contact-wrapper .contact-header .header-title {
  color: var(--Secordary-2);
  font-size: 56px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -1.12px;
  margin: 0;
}

.contact .contact-wrapper .contact-header .header-desc {
  color: var(--Secondary);
  font-size: 26px;
  font-weight: 500;
  line-height: normal;
}

.contact .contact-wrapper .contact-header .header-desc p {
  margin: 0;
}

.contact .contact-wrapper .contact-office {
  display: flex;
  gap: 1.5rem;
  padding: 4rem 0 2rem;
}

.contact .contact-wrapper .contact-office .office-info {
  padding: 6rem 0 1.5rem;
  display: flex;
  min-width: 360px;
  padding: 48px 32px;
  flex-direction: column;
  align-items: flex-start;
  flex: 1 0 0;
  border-radius: 16px;
  background: var(--White);
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset,
    0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08);
}

.contact .contact-wrapper .contact-office .office-info .office-header {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
  padding: 0 24px;
  width: 100%;
}

.contact .contact-wrapper .contact-office .office-info .office-header svg {}

.contact .contact-wrapper .contact-office .office-info .office-header svg path {}

.contact .contact-wrapper .contact-office .office-info .office-header .office-name {
  color: var(--Territory);
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  /* 133.333% */
  letter-spacing: -0.48px;
}

.contact .contact-wrapper .contact-office .office-info .office-body {
  display: grid;
  gap: 1rem;
  margin-bottom: 2rem;
  width: 100%;
  padding: 0 1.5rem;
}

.contact .contact-wrapper .contact-office .office-info .office-body .office-text {
  color: var(--soluk-text);
  font-size: 19px;
  font-weight: 400;
  line-height: normal;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e1e1eb;
}

.contact .contact-wrapper .contact-office .office-info .office-body .office-text:last-child {
  border-bottom: 0;
}

.contact .contact-wrapper .contact-office .office-info .office-body .office-text a {
  color: inherit;
}

.contact .contact-wrapper .contact-office .office-info .office-body .office-text address {
  margin: 0;
}

.contact .contact-wrapper .contact-office .office-info .office-navigation {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 1rem;
}

.contact .contact-wrapper .contact-office .office-info .office-navigation .navigation-btn {
  display: flex;
  padding: 12px 0px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  flex: 1 0 0;
  border-radius: 50px;
  background: var(--Primary-BG-7);
  color: var(--Territory);
  text-align: center;
  font-size: 19px;
  font-weight: 400;
  line-height: 20px;
  /* 105.263% */
}

.contact .contact-wrapper .contact-office .office-info .office-navigation .navigation-btn svg {}

.contact .contact-wrapper .contact-office .office-info .office-navigation .navigation-btn svg path {
  transition: 0.4s;
}

.contact .contact-wrapper .contact-office .office-info .office-navigation .navigation-btn span {}

.contact .contact-wrapper .contact-office .office-map {
  display: flex;
  min-width: 360px;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  flex: 1 0 0;
  align-self: stretch;
  border-radius: 16px;
  background: var(--White);
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset,
    0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08);
}

.contact .contact-wrapper .contact-office .office-map .map-wrapper {
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  width: 100%;
  height: 100%;
}

.contact .contact-wrapper .contact-office .office-map .map-wrapper iframe {
  width: 100%;
  height: 100%;
}

.contact .contact-wrapper .contact-career {
  padding: 3rem 0;
}

.contact .contact-wrapper .contact-career .career-wrapper {
  display: flex;
  padding: 32px;
  align-items: center;
  gap: 48px;
  border-radius: 16px;
  background: var(--White);
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
}

.contact .contact-wrapper .contact-career .career-wrapper .career-info {
  display: flex;
  padding-left: 3rem;
  flex-direction: column;
  align-items: flex-start;
  gap: 48px;
  flex: 1 0 0;
}

.contact .contact-wrapper .contact-career .career-wrapper .career-info .career-header {
  display: grid;
  gap: 1.5rem;
  max-width: 456px;
}

.contact .contact-wrapper .contact-career .career-wrapper .career-info .career-header .career-text {
  color: var(--Secordary-2);
  font-size: 40px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.8px;
}

.contact .contact-wrapper .contact-career .career-wrapper .career-info .career-header .career-subtext {
  color: var(--Paragraph);
  font-size: 21px;
  font-weight: 400;
  line-height: normal;
}

.contact .contact-wrapper .contact-career .career-wrapper .career-info .career-btn {}

.contact .contact-wrapper .contact-career .career-wrapper .career-img {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 64px;
  flex: 1 0 0;
}

.contact .contact-wrapper .contact-career .career-wrapper .career-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 16px;
  height: 320px;
}

.contact .contact-wrapper .contact-form-area {
  padding: 4rem 0;
}

.contact .contact-wrapper .contact-form-area .form-wrapper {
  display: flex;
  align-items: flex-start;
  gap: 48px;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .form-info {
  display: flex;
  padding: 64px 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 48px;
  flex: 1 0 0;
  align-self: stretch;
  position: sticky;
  top: 100px;
  height: 100%;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .form-info .info-text {
  display: grid;
  gap: 1rem;
  max-width: 584px;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .form-info .info-text h3 {
  color: var(--Secordary-2);
  font-size: 64px;
  font-weight: 600;
  line-height: normal;
  margin: 0;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .form-info .info-text p {
  color: var(--Primary-BG-3);
  font-size: 21px;
  font-weight: 500;
  line-height: normal;
  margin: 0;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form {
  display: flex;
  padding: 48px;
  flex-direction: column;
  gap: 16px;
  flex: 1 0 0;
  border-radius: 16px;
  background: var(--White);
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset,
    0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08);
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form .form-title {
  color: #1d3e52;
  font-size: 26px;
  font-weight: 600;
  line-height: normal;
  margin-bottom: 10px;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form {
  display: grid;
  gap: 1rem;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-input {}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form input {
  display: flex;
  padding: 20px 16px;
  align-items: center;
  gap: 10px;
  align-self: stretch;
  border-radius: 8px;
  border: 1px solid var(--Primary-Border);
  color: var(--Primary-BG-3);
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
  width: 100%;
  height: 100%;
  transition: 0.4s;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form input::placeholder {
  text-transform: capitalize;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form input:focus {
  border-color: var(--Primary);
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form textarea:focus {
  border-color: var(--Primary);
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-textarea {}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-textarea textarea {
  width: 100%;
  resize: none;
  display: flex;
  height: 240px;
  padding: 20px 16px;
  align-items: flex-start;
  gap: 10px;
  align-self: stretch;
  border-radius: 8px;
  border: 1px solid var(--Primary-Border);
  color: var(--Primary-BG-3);
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
  transition: 0.4s;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-aggrement {
  margin: 10px 0;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-aggrement .info-text {
  color: #1d3e52;
  font-size: 14px;
  font-weight: 400;
  margin: 0;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-aggrement .info-text a {
  color: #1363df;
  /* 152.941% */
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-aggrement .info-text br {}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-captcha-area {}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-captcha-area .form-captcha-wrapper {
  display: flex;
  width: 100%;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-captcha-area .form-captcha-wrapper .form-captcha-input {
  flex: 1;
  max-height: 100%;
  height: auto;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-captcha-area .form-captcha-wrapper .form-captcha a {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--Primary);
  border-radius: 50%;
  color: var(--White);
  transition: 0.4s;
  will-change: transform;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-captcha-area .form-captcha-wrapper .form-captcha img {
  width: 100%;
  max-height: 63px;
  height: 100%;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-captcha-area .form-captcha-wrapper .form-captcha {
  position: relative;
  flex: 1;
  border: 1px solid var(--Primary-Border);
  border-radius: 8px;
  overflow: hidden;
  max-height: 100%;
  height: auto;
}

.contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-captcha-area .contact-form-btn {
  line-height: normal;
  font-size: 21px;
}

@media screen and (max-width: 1199px) {
  .contact .contact-wrapper .contact-career .career-wrapper .career-info {
    padding-left: 2rem;
  }

  .contact .contact-wrapper .contact-career .career-wrapper .career-info .career-header .career-text {
    font-size: 36px;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .form-info .info-text h3 {
    font-size: 48px;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .form-info .info-text {
    gap: 2rem;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-textarea textarea {
    height: 140px;
  }

  .contact .contact-wrapper .contact-header .header-title {
    font-size: 48px;
  }
}

@media screen and (max-width: 991px) {
  .contact .contact-wrapper .contact-office .office-map {
    min-width: unset;
  }

  .contact .contact-wrapper .contact-office .office-info {
    min-width: unset;
    padding: 2rem;
  }

  .contact .contact-wrapper .contact-office .office-info .office-navigation .navigation-btn {
    font-size: 14px;
    gap: 4px;
  }

  .contact .contact-wrapper .contact-office .office-info .office-header {
    padding: 0;
  }

  .contact .contact-wrapper .contact-office .office-info .office-body {
    padding: 0;
  }

  .contact .contact-wrapper .contact-office .office-info .office-body .office-text {
    font-size: 16px;
  }

  .contact .contact-wrapper .contact-office {
    gap: 1rem;
    padding-bottom: 1rem;
    padding-top: 1rem;
  }

  .contact .contact-wrapper .contact-career .career-wrapper .career-info {
    padding-left: 1.5rem;
  }

  .contact .contact-wrapper .contact-career .career-wrapper .career-info .career-header .career-text {
    font-size: 28px;
  }

  .contact .contact-wrapper .contact-career .career-wrapper {
    gap: 2rem;
    padding: 1rem;
  }

  .contact .contact-wrapper .contact-career .career-wrapper .career-info .career-header .career-subtext {
    font-size: 18px;
  }

  .contact .contact-wrapper .contact-career {
    padding: 0;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .form-info .info-text h3 {
    font-size: 32px;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper {
    gap: 3rem;
    flex-direction: column;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .form-info {
    padding: 1.5rem 2rem;
    position: unset;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form {
    display: flex;
    flex-wrap: wrap;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-input {
    flex: 1 0 calc(50% - 1rem);
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-textarea {
    flex: 1 0 100%;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-captcha-area {
    width: 100%;
    text-align: end;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form {
    padding: 2.5rem 2rem;
  }

  .contact .contact-wrapper .contact-header .header-title {
    font-size: 36px;
  }

  .contact .contact-wrapper .contact-header .header-desc {
    font-size: 20px;
    max-width: 60%;
  }

  .contact .contact-wrapper .contact-header {
    padding-top: 3rem;
  }

  .contact .contact-wrapper .contact-form-area {
    padding: 3rem 0 1rem;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .form-info .info-text {
    gap: 1rem;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .form-info .info-text p {
    font-weight: 400;
    font-size: 19px;
    max-width: 80%;
  }
}

@media screen and (max-width: 767px) {
  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form {
    display: grid;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-captcha-area .form-captcha-wrapper .form-captcha a {
    right: 4px;
  }

  .contact .contact-wrapper .contact-form-area {
    padding-bottom: 0;
  }

  .contact .contact-wrapper .contact-office {
    flex-direction: column;
  }

  .contact .contact-wrapper .contact-header .header-desc {
    max-width: 100%;
    font-weight: 300;
    font-size: 19px;
  }

  .contact .contact-wrapper .contact-header .header-title {
    font-size: 32px;
  }

  .contact .contact-wrapper .contact-office .office-map .map-wrapper iframe {
    height: 240px;
  }

  .contact .contact-wrapper .contact-career .career-wrapper {
    flex-direction: column-reverse;
    gap: 1.5rem;
  }

  .contact .contact-wrapper .contact-career .career-wrapper .career-img img {
    height: 240px;
  }

  .contact .contact-wrapper .contact-career .career-wrapper .career-info {
    padding: 0 1rem 1rem;
    gap: 2rem;
  }

  .contact .contact-wrapper .contact-career .career-wrapper .career-info .career-header .career-text {
    font-size: 24px;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-aggrement .info-text {
    font-size: 13px;
    text-align: justify;
    word-break: break-all;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-captcha-area .contact-form-btn {
    width: 100%;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .form-info .info-text p {
    font-size: 16px;
    max-width: 100%;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .form-info {
    padding: 0 1rem;
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .form-info .info-text h3 {
    font-size: 28px;
    max-width: 70%;
  }
}

/* CONTACT END */
/* BLOG START */
.blog {}

.blog.services-blog {
  padding: 3rem 0;
  background: var(--Primary-BG);
}

.blog .blog-wrapper {}

.blog .blog-wrapper .popular-blog .homepage-blog {
  background: var(--Primary-BG-7);
}

.blog .blog-wrapper .popular-blog .homepage-blog .blog-wrapper {
  padding-top: 3rem;
}

.blog .homepage-blog .blog-wrapper .blog-list {
  padding-bottom: 6rem;
}

.blog .blog-wrapper .popular-blog {}

.blog .blog-wrapper .latest-blog {
  padding: 3rem 0;
}

.blog .blog-wrapper .latest-blog .latest-blog-header {
  margin-bottom: 3rem;
  display: grid;
  gap: 1.5rem;
}

.blog .blog-wrapper .latest-blog .latest-blog-header .header-title {
  color: var(--Secordary-2);
  text-align: center;
  font-size: 48px;
  font-weight: 600;
  line-height: 56px;
  /* 116.667% */
  letter-spacing: -0.96px;
  margin: 0;
}

.blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-item,
.blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-other {
  display: flex;
  padding: 5px 16px;
  align-items: center;
  gap: 16px;
  border-radius: 100px;
  transition: 0.4s;
  cursor: pointer;
  color: var(--Primary-BG-3);
  white-space: nowrap;
  text-align: center;
}

.blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-item.active {
  background: var(--White);
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
  color: var(--Secondary);
}

.blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-other .other-category-dropdown {
  position: absolute;
  top: 100%;
  width: max-content;
  background: var(--Primary-BG);
  border-radius: 12px;
  z-index: 1;
  left: 50%;
  transform: translateX(-50%);
  background: var(--White);
  padding: 1rem;
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0.5px 0.5px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
  transition: 0.4s;
  will-change: transform;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  top: 90%;
  cursor: default;
}

.blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-other .other-category-dropdown::before {
  content: "";
  position: absolute;
  top: -4px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  background: var(--white);
  width: 8px;
  height: 8px;
  z-index: -1;
  border-left: 1px solid #d6d6d6;
  border-top: 1px solid #d6d6d6;
}

.blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-other .other-category-dropdown .category-dropdown-menu {
  display: grid;
  gap: 4px;
}

.blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-other .other-category-dropdown .category-dropdown-menu .category-dropdown-item {
  padding: 8px 24px;
  color: var(--Primary-BG-3);
  border-radius: 8px;
  transition: 0.4s;
  cursor: pointer;
}

.blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-other {
  position: relative;
}

.blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-other .other-category-dropdown .category-dropdown-menu .category-dropdown-item.active {
  background: var(--Secordary-2);
  color: var(--Primary-Lighter);
}

.blog .blog-wrapper .latest-blog .latest-blog-tab-content {}

.blog .blog-wrapper .latest-blog .latest-blog-tab-content .tab-content-item {
  display: none;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.blog .blog-wrapper .latest-blog .latest-blog-tab-content .tab-content-item.fade-in-up {
  opacity: 1;
  transform: translateY(0);
}

.blog .blog-wrapper .latest-blog .latest-blog-tab-content .tab-content-item.active {
  display: block;
  position: relative;
}

.blog .blog-wrapper .latest-blog .latest-blog-tab-content .tab-content-item .content-item-wrapper {}

.blog .blog-wrapper .latest-blog .latest-blog-tab-content .tab-content-item .content-item-wrapper .blog-card-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.blog .blog-wrapper .latest-blog .blog-pagination {
  margin-top: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  align-items: center;
}

.blog .blog-wrapper .latest-blog .blog-pagination .pagination-text {
  color: var(--Primary-BG-3);
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
  /* 185.714% */
}

.pagination-nav,
.pag .pagination {
  display: flex;
  padding: 4px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset,
    0px 2px 2px 0px rgba(0, 0, 0, 0.08);
}

.pagination-nav .page-btn {
  display: flex;
  width: 48px;
  height: 48px;
  padding: 6.857px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6.857px;
  border-radius: 12px;
  cursor: pointer;
  transition: 0.4s;
  color: #7e7e8f;
}

.blog .blog-wrapper .latest-blog .blog-pagination .pagination-nav .page-prev svg {}

.blog .blog-wrapper .latest-blog .blog-pagination .pagination-nav .page-prev svg path {}

.pagination-nav .page-numb {
  display: flex;
  padding: 0px 12px;
  align-items: center;
  gap: 8px;
  height: 48px;
  border-left: 1px solid rgb(126 126 143 / 8%);
  border-right: 1px solid rgb(126 126 143 / 8%);
}

.pag .pagination .page-item {
  display: flex;
  padding: 0 4px;
  align-items: center;
  gap: 8px;
  height: 48px;
}

.pagination-nav .page-numb a,
.pag .pagination .page-item .page-link {
  display: flex;
  width: 24px;
  height: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 4px;
  color: var(--Primary-BG-3);
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  cursor: pointer;
  border: none;
}

.pagination-nav .page-numb a.active,
.pag .pagination .page-item.active .page-link {
  background: var(--Primary-BG-7);
}

.blog .blog-wrapper .latest-blog .blog-pagination .pagination-nav .page-numb a:active,
.pag .pagination .page-item.active .page-link {
  background: var(--Primary-BG-7);
}

@media screen and (max-width: 1199px) {
  .blog .blog-wrapper .latest-blog .latest-blog-tab-content .tab-content-item .content-item-wrapper .blog-card-list {
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
  }
}

@media screen and (max-width: 991px) {
  .blog .blog-wrapper .latest-blog .latest-blog-tab-content .tab-content-item .content-item-wrapper .blog-card-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 767px) {
  .blog .blog-wrapper .latest-blog .latest-blog-header .header-title {
    font-size: 36px;
  }

  .blog .blog-wrapper .latest-blog .latest-blog-tab-content .tab-content-item .content-item-wrapper .blog-card-list {
    grid-template-columns: 1fr;
  }

  .blog .blog-wrapper .latest-blog .latest-blog-header {
    margin-bottom: 2rem;
  }
}

/* BLOG END */
/* SERVICES START */
.services {}

.services.services-light {
  background: #f5f5f5;
}

.services.services-dark {
  background: var(--Secordary-2);
}

.services .services-wrapper {
  padding: 6rem 0;
}

.services .services-wrapper .services-header {
  max-width: 784px;
  margin: 0 auto;
  padding: 0 32px;
  margin-bottom: 4rem;
}

.services .services-wrapper .services-header .header-title {
  font-size: 80px;
  font-weight: 700;
  line-height: 92px;
  letter-spacing: -1.6px;
  text-align: center;
  margin-bottom: 1.5rem;
}

.services .services-wrapper .services-header .header-title .color-1 {
  color: var(--Primary);
}

.services .services-wrapper .services-header .header-title .color-2 {
  color: var(--Secordary-2);
}

.services .services-wrapper .services-header .header-desc {
  color: var(--soluk-text);
  text-align: center;
  font-size: 21px;
  font-weight: 500;
  line-height: normal;
}

.services .services-wrapper .services-header .header-desc p {}

.services .services-wrapper .services-category-list {
  padding: 10px 0;
  position: relative;
  overflow: hidden;
}

.services .services-wrapper .services-category-list .services-category-wrapper {}

.services .services-wrapper .services-category-list .services-category-wrapper .services-category-item {
  display: flex;
  padding: 24px 32px;
  align-items: center;
  gap: 24px;
  border-radius: 100px;
  background: rgba(139, 139, 139, 0.1);
  width: max-content;
  white-space: nowrap;
  transition: background 400ms ease;
}

.services .services-wrapper .services-category-list .services-category-wrapper .services-category-item .category-numb {
  color: var(--Secondary);
  font-size: 25px;
  font-weight: 700;
  line-height: 120%;
  /* 30px */
  transition: color 400ms ease;
}

.services .services-wrapper .services-category-list .services-category-wrapper .services-category-item .category-name {
  color: #404040;
  font-size: 21px;
  font-weight: 400;
  line-height: 120%;
  /* 25.2px */
  transition: color 400ms ease;
}

.services .services-wrapper .services-category-list .services-category-wrapper .swiper-slide {
  width: auto !important;
}

.services.services-dark .services-wrapper .services-header .header-title .color-1 {
  color: var(--Primary-2);
}

.services-dark .services-wrapper .services-header .header-title .color-2 {
  color: var(--Primary-BG);
}

.services.services-dark .services-wrapper .services-category-list .services-category-wrapper .services-category-item {
  background: rgba(139, 139, 139, 0.1);
}

.services.services-dark .services-wrapper .services-category-list .services-category-wrapper .services-category-item .category-numb {
  color: var(--Primary-2);
}

.services.services-dark .services-wrapper .services-category-list .services-category-wrapper .services-category-item .category-name {
  color: var(--Primary-BG-7);
}

@media screen and (max-width: 1199px) {
  .services .services-wrapper .services-header .header-title {
    font-size: 60px;
    line-height: 1;
  }

  .services .services-wrapper .services-header .header-desc {
    font-size: 18px;
  }

  .services .services-wrapper {
    padding: 5rem 0;
  }
}

@media screen and (max-width: 767px) {
  .services .services-wrapper .services-header .header-title {
    font-size: 40px;
  }

  .services .services-wrapper .services-header .header-desc {
    font-size: 16px;
  }

  .services .services-wrapper {
    padding: 3rem 0;
  }

  .services .services-wrapper .services-category-list .services-category-wrapper .services-category-item {
    padding: 16px 24px;
    gap: 1rem;
  }

  .services .services-wrapper .services-category-list .services-category-wrapper .services-category-item .category-name {
    font-size: 18px;
  }

  .services .services-wrapper .services-category-list .services-category-wrapper .services-category-item .category-numb {
    font-size: 20px;
  }

  .services-detail .detail-wrapper .detail-img {
    max-width: 100%;
  }

  .services-detail .detail-wrapper {
    flex-direction: column;
    padding-top: 3rem;
  }

  .blog.services-blog .blog-wrapper .latest-blog {
    padding: 0;
  }
}

/* SERVICES END */
/* CAREER START */
.career {
  background: var(--Primary-BG);
}

.career .career-wrapper {}

.career .career-wrapper .career-header {
  padding: 6rem 0;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  align-items: center;
  text-align: center;
}

.career .career-wrapper .career-header .header-info {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.career .career-wrapper .career-header .header-info .info-title {
  color: var(--Secordary-2);
  text-align: center;
  font-size: 40px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.8px;
  margin-bottom: 1rem;
}

.career .career-wrapper .career-header .header-info .info-desc {
  color: var(--Secondary);
  text-align: center;
  font-size: clamp(16px, 1.2vw, 21px);
  font-weight: 400;
  line-height: normal;
  margin: 0;
}

.career .career-wrapper .career-header .career-position-btn {
  padding: 6px 24px;
  font-size: 14px;
  line-height: normal;
}

.career .career-wrapper .career-main-img {}

.career .career-wrapper .career-main-img img {
  height: 440px;
  width: 100%;
  object-fit: cover;
  border-radius: 16px;
}

.career .career-wrapper .career-position {
  padding-bottom: 6rem;
}

.career .career-wrapper .career-position .position-wrapper {}

.career .career-wrapper .career-position .position-wrapper .position-header {
  padding: 6rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4rem;
}

.career .career-wrapper .career-position .position-wrapper .position-header .header-title {
  color: var(--Secordary-2);
  font-size: 40px;
  font-weight: 600;
  line-height: 56px;
  /* 140% */
  letter-spacing: -0.8px;
  margin: 0;
}

.career .career-wrapper .career-position .position-wrapper .position-header .header-desc {
  color: var(--Primary-BG-3);
  font-size: clamp(16px, 1.2vw, 21px);
  font-weight: 400;
  line-height: normal;
}

.career .career-wrapper .career-position .position-wrapper .position-list {
  display: grid;
  gap: 1.5rem;
}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item {
  display: flex;
  padding: 24px;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-radius: 16px;
  background: var(--White);
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset,
    0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08);
  transition: background 400ms ease;
}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-main {}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-main .position-title {
  color: var(--Secondary);
  font-size: 26px;
  font-weight: 600;
  line-height: normal;
  margin: 0;
  transition: color 400ms ease;
}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .position-info-list {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .position-info-list .info-list-item {
  color: var(--Primary-BG-3);
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  line-height: 26px;
  /* 185.714% */
  display: flex;
  align-items: center;
  gap: 0.5rem;
  transition: color 400ms ease;
}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .position-info-list .info-list-item svg {}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .position-info-list .info-list-item svg path {}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .position-info-list .info-list-item span {}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .seperator {
  display: inline-block;
  flex-shrink: 0;
  width: 1px;
  height: 26px;
  opacity: 0.08;
  background: #7e7e8f;
  transition: background 400ms, opacity 400ms ease;
}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .position-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .position-btn span {
  color: var(--Primary-BG-3);
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  line-height: 26px;
  /* 185.714% */
  transition: color 400ms ease;
}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .position-btn svg {
  color: var(--Primary-Border);
}

.career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .position-btn svg path {}

@media screen and (max-width: 991px) {
  .career .career-wrapper .career-header {
    padding: 3rem 0;
  }

  .career .career-wrapper .career-header .header-info .info-title {
    font-size: 2rem;
    max-width: 90%;
  }

  .career .career-wrapper .career-main-img img {
    height: 260px;
  }

  .career .career-wrapper .career-position .position-wrapper .position-header {
    padding: 3rem 0;
    gap: 1rem;
  }

  .career .career-wrapper .career-position .position-wrapper .position-header .header-title {
    font-size: 2rem;
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-main .position-title {
    font-size: 1.5rem;
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .position-info-list {
    gap: 1rem;
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper {
    gap: 1rem;
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item {
    flex-direction: column;
    align-items: start;
    gap: 1.5rem;
  }

  .career .career-wrapper .career-position {
    padding-bottom: 1rem;
  }
}

@media screen and (max-width: 767px) {
  .career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper {
    flex-direction: column;
    align-items: start;
    width: 100%;
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .seperator {
    width: 26px;
    height: 1px;
  }

  .career .career-wrapper .career-position .position-wrapper .position-header .header-title {
    font-size: 24px;
    line-height: normal;
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-main .position-title {
    font-size: 22px;
  }

  .career .career-wrapper .career-position .position-wrapper .position-header .header-desc {
    font-size: 14px;
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .position-info-list .info-list-item {
    flex-direction: column;
    align-items: start;
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item .position-info-wrapper .position-info-list {
    width: 100%;
    justify-content: space-between;
  }
}

/* CAREER END */
/* MEDIA LIST START */
.media {
  background: var(--Primary-BG);
  display: block;
}

.media .media-wrapper {}

.media .media-wrapper .featured-media {
  padding: 3rem 0;
}

.media .media-wrapper .featured-media .featured-media-list {
  position: relative;
  overflow: hidden;
}

.media .media-wrapper .featured-media .featured-media-list .swiper-wrapper {}

.media .media-wrapper .featured-media .featured-media-list .swiper-wrapper .swiper-slide {
  max-height: 100%;
  height: auto;
}

.media .media-wrapper .all-media-container {
  padding: 3rem 0;
}

.media .media-wrapper .all-media-container .all-media-header {
  padding: 6rem 0;
  margin-bottom: 6rem;
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-color: rgb(126 126 143 / 16%);
  display: flex;
  align-items: end;
  justify-content: space-between;
}

.media .media-wrapper .all-media-container .all-media-header .header-title {
  margin: 0;
  color: var(--Secordary-2);
  font-size: 48px;
  font-weight: 600;
  line-height: 56px;
  /* 116.667% */
  letter-spacing: -0.96px;
}

.media .media-wrapper .all-media-container .all-media-header .header-desc {
  color: var(--Primary-BG-3);
  font-size: clamp(16px, 1.2vw, 21px);
  font-weight: 400;
  line-height: normal;
}

.media .media-wrapper .all-media-container .all-media-list-wrapper {
  display: flex;
  align-items: start;
  gap: 1.5rem;
}

.media .media-wrapper .all-media-container .all-media-list-wrapper .media-list-wrapper {
  flex: 1;
}

.media .media-wrapper .all-media-container .all-media-list-wrapper .media-list-wrapper .media-category-title {
  color: var(--Secondary);
  font-size: clamp(14px, 1vw, 18px);
  font-weight: 400;
  line-height: normal;
  padding: 11px 1rem;
  display: inline-flex;
  margin-bottom: 1.5rem;
  gap: 8px;
  align-items: center;
}

.media .media-wrapper .all-media-container .all-media-list-wrapper .media-list-wrapper .media-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.media-category .category-list .category-item.active {
  background: var(--White);
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
}

.media-category .category-list .category-item.active .category-item-info .item-hidden-arrow {
  width: 20px;
}

.media-category-wrapper {
  position: sticky;
  top: calc(var(--header-height) + 1.5rem);
}

@media screen and (max-width: 1199px) {
  .media .media-wrapper .all-media-container .all-media-header {
    padding: 3rem 0;
    margin-bottom: 3rem;
  }

  .media .media-wrapper .all-media-container .all-media-header .header-title {
    font-size: 2rem;
  }

  .media .media-wrapper .featured-media {
    padding-bottom: 1rem;
  }

  .media .media-wrapper .all-media-container .all-media-list-wrapper .media-list-wrapper .media-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 991px) {
  .media .media-wrapper .all-media-container .all-media-list-wrapper {
    flex-direction: column;
  }

  .media .media-wrapper .all-media-container .all-media-list-wrapper .media-list-wrapper .media-list {
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
  }

  .media .media-wrapper .all-media-container .all-media-header .header-title {
    font-size: 28px;
  }

  .media .media-wrapper .all-media-container .all-media-header {
    padding: 1.5rem 0;
    margin-bottom: 1.5rem;
    align-items: center;
  }

  .media-category-wrapper {
    position: fixed;
    top: var(--header-height);
    left: 0;
    bottom: 0;
    z-index: 12;
    background: var(--white);
    padding: 0 1rem;
    transform: translateX(-100%);
    will-change: transform;
    transition: transform 425ms ease;
  }

  .media-category-wrapper.active {
    transform: translateX(0);
  }

  .media-filter-backdrop {
    position: fixed;
    inset: 0;
    top: var(--header-height);
    z-index: 11;
    background: rgb(19 99 223 / 15%);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    transition: transform 325ms ease;
    transition-delay: 0.125s;
    transform: translateX(-100%);
    pointer-events: none;
  }

  .media-filter-backdrop.active {
    transform: translateX(0);
    pointer-events: all;
  }
}

@media screen and (max-width: 767px) {
  .media .media-wrapper .all-media-container .all-media-list-wrapper .media-list-wrapper .media-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem 8px;
  }

  .media-category-wrapper {
    width: 100%;
  }

  .media .media-wrapper .all-media-container {
    padding-bottom: 0;
  }
}

/* MEDIA LIST END */
/* REFERENCES START */
.references {}

.references .references-wrapper {}

.references .references-wrapper .references-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--Primary-BG);
  padding: 6rem 0;
}

.references .references-wrapper .references-header .header-title {
  color: var(--Secordary-2);
  text-align: center;
  font-size: 56px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -1.12px;
  margin-bottom: 1.5rem;
}

.references .references-wrapper .references-header .header-desc {
  color: var(--Secondary);
  text-align: center;
  font-size: 26px;
  font-weight: 500;
  line-height: normal;
  margin: 0;
}

.references .references-wrapper .references-list-wrapper {
  padding: 3rem 0;
}

.references .references-wrapper .references-list-wrapper .references-list {
  padding: 3rem 0;
  gap: 3rem;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
}

.references .references-wrapper .references-list-wrapper .references-list .references-item {
  flex-shrink: unset;
}

.references .references-wrapper .references-list-wrapper .references-seperator {
  height: 1px;
  width: 100%;
  background: rgb(126 126 143 / 20%);
  margin: 4rem 0;
}

@media screen and (max-width: 1199px) {
  .references .references-wrapper .references-list-wrapper .references-seperator {
    margin: 1rem 0;
  }
}

@media screen and (max-width: 991px) {
  .references .references-wrapper .references-list-wrapper .references-seperator {
    margin: 1rem 0;
  }

  .references .references-wrapper .references-list-wrapper .references-list {
    padding: 2rem 0;
  }

  .references .references-wrapper .references-list-wrapper {
    padding: 0;
  }

  .references .references-wrapper .references-header .header-title {
    font-size: 42px;
  }

  .references .references-wrapper .references-header {
    padding: 4rem 0;
  }

  .references .references-wrapper .references-header .header-desc {
    font-size: 22px;
  }
}

@media screen and (max-width: 767px) {
  .references .references-wrapper .references-list-wrapper .references-list .references-item {
    width: 90px;
  }

  .references .references-wrapper .references-list-wrapper .references-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
    gap: 2rem 3rem;
  }

  .references .references-wrapper .references-header .header-title {
    font-size: 32px;
    line-height: normal;
    margin-bottom: 1rem;
  }

  .references .references-wrapper .references-header .header-desc {
    font-size: 18px;
    max-width: 80%;
    margin: 0 auto;
  }

  .references .references-wrapper .references-header {
    padding: 3rem 0;
  }
}

/* REFERENCES END */
/* PRODUCT LIST START */
.product {
  background: var(--Primary-BG);
}

.product .product-wrapper {
  display: flex;
  padding: 3rem 0 6rem;
  gap: 1.5rem;
}

.product .product-wrapper .product-category {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  width: 310px;
}

.product .product-wrapper .product-category .category-main-text {
  color: var(--Secordary-2);
  font-size: 21px;
  font-weight: 600;
  line-height: 26px;
  /* 123.81% */
  letter-spacing: -0.42px;
  padding: 1.5rem 1rem;
}

.product .product-wrapper .product-category .category-main-text .category-close {
  display: none;
}

.product .product-wrapper .product-category .product-category-list-wrapper {}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link {}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header {
  display: flex;
  padding: 11px 16px;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-radius: 100px;
  background: var(--White);
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
  transition: background 400ms ease;
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header.active {
  background: var(--Primary-BG-9);
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header .category-item-left {}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header .category-item-left .category-title {
  color: var(--Secondary);
  font-size: 18px;
  font-weight: 400;
  line-height: normal;
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header.active .category-item-left .category-title {
  color: var(--Primary-Border);
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header .category-item-right {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header .category-item-right .category-item-numb {
  display: inline-flex;
  padding: 0px 12px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 100px;
  background: var(--Primary-BG);
  color: var(--Primary-BG-3);
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  /* 162.5% */
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header .category-item-right .category-item-icon {
  color: var(--Secondary);
  transition: 400ms ease;
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header.active .category-item-right .category-item-icon {
  color: var(--Primary-Border);
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header .category-item-right .category-item-icon svg {}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header .category-item-right .category-item-icon svg path {}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu-wrapper {
  display: none;
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu .category-sub-menu-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 11px 1rem 11px 0;
  position: relative;
  margin-left: 28px;
  padding-left: 28px;
  color: var(--Primary-BG-3);
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu .category-sub-menu-item::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0px;
  width: 21px;
  height: 23px;
  border-left: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-bottom-left-radius: 0.5rem;
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu .category-sub-menu-item:last-child {}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu .category-sub-menu-item::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 46px;
  background: #ccc;
  width: 1px;
  top: 50%;
  transform: translateY(-50%);
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu .category-sub-menu-item:last-child::after {
  height: 20px;
  top: 0;
  transform: unset;
  display: none;
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu .category-sub-menu-item.active {
  color: var(--Primary);
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu .category-sub-menu-item:not(:last-child)::before {
  border-left: 0;
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu .category-sub-menu-item .category-sub-item-name {
  font-size: 18px;
  font-weight: 400;
  line-height: normal;
}

.product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu .category-sub-menu-item .category-sub-item-numb {
  display: flex;
  padding: 0px 12px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 16px;
  background: var(--White);
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  /* 162.5% */
}

.product .product-wrapper .product-list-wrapper {
  flex: 1;
}

.product .product-wrapper .product-list-wrapper .product-list-header {
  padding: 1.5rem 0;
  display: flex;
  align-items: start;
  justify-content: space-between;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-left-wrapper {
  display: flex;
  align-items: start;
  gap: 0.5rem;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-left-wrapper .product-category-menu-open {
  display: none;
  border-radius: 6px;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-left {
  display: flex;
  align-items: start;
  gap: 1.5rem;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-left .product-list-header-title {
  color: var(--Secordary-2);
  font-size: 21px;
  font-weight: 600;
  line-height: 26px;
  /* 123.81% */
  letter-spacing: -0.42px;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-left .product-list-header-subtitle {
  color: var(--Primary-BG-3);
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
  /* 185.714% */
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right {
  display: flex;
  align-items: center;
  gap: 12px;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .search-product {
  display: inline-flex;
  padding: 4px 16px;
  align-items: center;
  border-radius: 100px;
  background: var(--White);
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
  gap: 1rem;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .search-product input {
  color: var(--Primary-BG-3);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  /* 185.714% */
  border: 0;
  outline: none;
  width: 103px;
  background: transparent;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .search-product .search-product-icon {
  margin: 0;
  cursor: pointer;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .search-product .search-product-icon svg {}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .search-product .search-product-icon svg path {}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter {
  cursor: pointer;
  position: relative;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter.active .selected-filter-wrapper {
  border-radius: 16px 16px 0 0;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter .selected-filter-wrapper {
  display: flex;
  padding: 4px 1rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  z-index: 2;
  position: relative;
  border-radius: 30px;
  background: var(--White);
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
  transition: 300ms ease-out;
  min-width: 195px;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter .selected-filter-wrapper .selected-filter {
  color: var(--Primary-BG-3);
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
  /* 185.714% */
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter .selected-filter-wrapper svg {
  transition: 400ms ease-out;
  will-change: transform;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter.active .selected-filter-wrapper svg {
  transform: rotate(180deg);
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter .selected-filter-wrapper svg path {}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter .selected-filter-menu {
  position: absolute;
  top: 100%;
  background: var(--White);
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
  width: 100%;
  border-radius: 0 0 1rem 1rem;
  z-index: 1;
  overflow: hidden;
  top: 50%;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: 300ms ease-out;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter .selected-filter-menu .hiddent-text {
  font-size: 20px;
  margin-bottom: 1rem;
  padding: 0 1rem;
  display: none;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter.active .selected-filter-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  top: 100%;
}

.product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter .selected-filter-menu .filter-item {
  color: var(--Primary-BG-3);
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
  padding: 4px 1rem;
  transition: background 400ms ease;
}

.product .product-wrapper .product-list-wrapper .product-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem 1rem;
  margin-top: 1rem;
}

.product .product-wrapper .product-backdrop {
  display: none;
}

@media screen and (max-width: 1199px) {
  .product .product-wrapper .product-list-wrapper .product-list {
    grid-template-columns: repeat(2, 1fr);
    margin: 0;
  }

  .product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-left {
    flex-direction: column;
    align-items: start;
    gap: 4px;
  }
}

@media screen and (max-width: 991px) {
  .product .product-wrapper {
    flex-direction: column;
    padding-bottom: 0;
    padding: 2rem 0;
  }

  .product .product-wrapper .product-list-wrapper .product-list {
    grid-template-columns: repeat(3, 1fr);
  }

  .product .product-wrapper .product-category {
    position: fixed;
    left: 0;
    background: var(--white);
    z-index: 4;
    height: 100%;
    top: var(--header-height);
    width: 360px;
    padding: 0 2rem 0 1rem;
    gap: 0.5rem;
    pointer-events: none;
    transform: translateX(-100%);
    transition: transform 400ms ease;
    will-change: transfrom;
    pointer-events: none;
  }

  .product .product-wrapper .product-backdrop {
    position: fixed;
    inset: 0;
    z-index: 3;
    top: var(--header-height);
    background: rgb(19 99 223 / 25%);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: transform 325ms ease;
    transition-delay: 0.125s;
    transform: translateX(-100%);
    pointer-events: none;
    display: block;
  }

  .product .product-wrapper .product-backdrop.active {
    transform: translateX(0);
    pointer-events: all;
  }

  .product .product-wrapper .product-category.active {
    transform: translateX(0);
    pointer-events: all;
  }

  .product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header .category-item-left .category-title {
    font-size: 16px;
  }

  .product .product-wrapper .product-category .category-main-text {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    font-size: 23px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu .category-sub-menu-item .category-sub-item-name {
    font-size: 16px;
  }

  .product .product-wrapper .product-category .product-category-list-wrapper {}

  .product .product-wrapper .product-category .category-main-text .category-close {
    display: block;
  }

  .product .product-wrapper .product-list-wrapper .product-list-header {
    padding-top: 0;
  }

  .product .product-wrapper .product-category .product-category-list-wrapper .product-category-list {
    max-height: calc(100vh - (var(--header-height) * 4));
    overflow-y: auto;
    align-items: start;
  }

  .product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-left-wrapper .product-category-menu-open {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  .product .product-wrapper .product-list-wrapper .product-list-header {
    flex-direction: column;
    gap: 1.5rem;
  }

  .product .product-wrapper .product-list-wrapper .product-list {
    grid-template-columns: 1fr 1fr;
  }

  .product .product-wrapper .product-category {
    width: 100%;
    padding-right: 1rem;
    padding-bottom: 1rem;
  }

  .product .product-wrapper {
    padding-bottom: 0;
  }

  .product .product-wrapper .product-category .product-category-list-wrapper .product-category-list {
    max-height: calc(100vh - (var(--header-height) * 4.5));
    overflow-y: auto;
    align-items: start;
  }

  .product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter.active .selected-filter-menu {
    border-radius: 12px 12px 0 0;
    opacity: unset;
    visibility: unset;
  }

  .product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter .selected-filter-menu {
    position: fixed;
    top: unset;
    bottom: 0;
    left: 0;
    right: 0;
    transform: translateY(100%);
    opacity: unset;
    visibility: unset;
    padding: 12px;
    max-width: 95%;
    margin: 0 auto;
    z-index: 12;
    min-height: 230px;
  }

  .product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter.active .selected-filter-menu {
    top: unset;
    bottom: 0;
    transform: translateY(0);
  }

  .product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter.active .selected-filter-wrapper {
    border-radius: 100px;
  }

  .product .product-filter-backdrop {
    position: fixed;
    inset: 0;
    z-index: 11;
    background: rgb(19 99 223 / 15%);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    transition: transform 325ms ease;
    transition-delay: 0.125s;
    transform: translateY(100%);
    pointer-events: none;
  }

  .product .product-filter-backdrop.active {
    transform: translateY(0);
    pointer-events: all;
  }

  .product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter .selected-filter-menu .filter-item {
    margin-bottom: 0.5rem;
    border-radius: 6px;
  }

  .product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter .selected-filter-menu .hiddent-text {
    display: block;
  }

  .product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter .selected-filter-menu .filter-item.selected {
    background: var(--Primary-Border);
  }
}

/* PRODUCT LIST END */
/* ABOUT START */
.about {
  position: relative;
}

.about::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 720px;
  background: var(--Primary-BG-7);
  z-index: -1;
}

.about .about-wrapper {}

.about .about-wrapper .about-banner {}

.about .about-wrapper .about-banner .banner-title {
  color: var(--Secordary-2);
  font-size: 82px;
  font-weight: 600;
  line-height: 92px;
  letter-spacing: -1.64px;
  text-align: center;
  max-width: 643px;
  margin: 0 auto;
  padding: 4rem 0;
}

.about .about-wrapper .about-banner .banner-title span {
  color: var(--Primary);
}

.about .about-wrapper .about-banner .banner-banner {}

.about .about-wrapper .about-banner .banner-banner img {
  max-height: 560px;
  min-height: 240px;
  width: 100%;
  object-fit: cover;
  border-radius: 1.5rem;
}

.about .about-wrapper .about-banner .banner-desc {
  color: var(--Secondary);
  text-align: center;
  font-size: 26px;
  font-weight: 500;
  line-height: normal;
  padding: 8rem 0;
  max-width: 963px;
  margin: 0 auto;
}

.about .about-wrapper .about-banner .banner-desc p {
  margin-bottom: 0;
}

.about-big-title {}

.about-big-title .big-title-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 3rem;
  padding: 12px 0 24px;
}

.about-big-title .big-title-wrapper h2 {
  color: var(--Secordary-2);
  font-size: 64px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -1.28px;
  margin: 0;
  align-self: flex-end;
  margin-bottom: 3rem;
}

.about-big-title .big-title-wrapper h2 span {
  color: var(--Primary);
}

.about-big-title .big-title-wrapper p {
  color: var(--soluk-text);
  font-size: 21px;
  font-weight: 400;
  line-height: normal;
  margin: 0;
  align-self: flex-start;
  padding: 10px 0;
}

.about-big-title .big-title-wrapper img {
  max-height: 560px;
  border-radius: 24px;
  width: 100%;
  object-fit: cover;
  grid-row: 1 / 3;
  grid-column: 2 / 3;
}

.about-why-us {}

.about-why-us .why-us-wrapper {
  padding: 4rem 0 8rem;
}

.about-why-us .why-us-wrapper .why-us-title {
  color: var(--Secordary-2);
  font-size: 48px;
  font-weight: 600;
  line-height: 56px;
  /* 116.667% */
  letter-spacing: -0.96px;
  margin-bottom: 3rem;
}

.about-why-us .why-us-wrapper .why-us-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.about-why-us .why-us-wrapper .why-us-list .why-us-item {
  display: flex;
  padding: 48px 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  flex: 1 0 0;
  border-radius: 16px;
  background: var(--Primary-BG);
  max-height: 100%;
  height: auto;
  transition: background 400ms ease;
  will-change: background;
}

.about-why-us .why-us-wrapper .why-us-list .why-us-item .item-icon {
  position: relative;
  width: 64px;
  height: 64px;
  overflow: hidden;
}

.about-why-us .why-us-wrapper .why-us-list .why-us-item .item-icon img {
  object-fit: contain;
  width: 100%;
  height: 100%;
}

.about-why-us .why-us-wrapper .why-us-list .why-us-item .item-title {
  color: var(--Territory);
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  /* 133.333% */
  letter-spacing: -0.48px;
  margin: 0;
}

.about-why-us .why-us-wrapper .why-us-list .why-us-item .item-desc {
  color: var(--soluk-text);
  font-size: 19px;
  font-weight: 400;
  line-height: normal;
}

.about-why-us .why-us-wrapper .why-us-list .why-us-item .item-desc p {
  margin: 0;
}

.about-vision {
  position: relative;
}

.about-vision .vision-wrapper {}

.about-vision .vision-wrapper .vision-bg {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 640px;
  z-index: -1;
}

.about-vision .vision-wrapper .vision-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0.2) 100%);
  pointer-events: none;
}

.about-vision .vision-wrapper .vision-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about-vision .vision-wrapper .vision-header {}

.about-vision .vision-wrapper .vision-header .header-title {
  color: var(--Primary-BG);
  text-align: center;
  font-size: 64px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -1.28px;
  padding: 8rem 0 6rem;
}

.about-vision .vision-wrapper .vision-body-wrapper {
  max-width: 1440px;
  margin: 0 auto;
  background: var(--White);
  border-radius: 8px;
  padding: 0 1rem;
}

.about-vision .vision-wrapper .vision-body {
  display: flex;
  padding: 3rem;
  justify-content: space-between;
  align-items: start;
  gap: 3rem;
}

.about-vision .vision-wrapper .vision-body .vision-left {
  display: flex;
  width: 405px;
  padding: 24px 0px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 24px;
}

.about-vision .vision-wrapper .vision-body .vision-left .vision-item {
  /* 184.615% */
  width: 100%;
}

.about-vision .vision-wrapper .vision-body .vision-left .vision-item .item-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #e1e1eb;
  padding-bottom: 1.5rem;
  cursor: pointer;
  transition: border-color 400ms ease;
}

.about-vision .vision-wrapper .vision-body .vision-left .vision-item.active .item-title {
  border-color: var(--Primary);
}

.about-vision .vision-wrapper .vision-body .vision-left .vision-item .item-title span {
  color: var(--Paragraph);
  font-family: "Hanken Grotesk";
  font-size: 26px;
  font-style: normal;
  font-weight: 600;
  line-height: 48px;
  /* 184.615% */
  letter-spacing: -0.52px;
  transition: color 400ms ease;
}

.about-vision .vision-wrapper .vision-body .vision-left .vision-item.active .item-title span {
  color: var(--Secondary);
}

.about-vision .vision-wrapper .vision-body .vision-left .vision-item .item-title .item-icon {
  color: var(--Primary-Border);
  transition: color 400ms ease;
}

.about-vision .vision-wrapper .vision-body .vision-left .vision-item.active .item-icon {
  color: var(--Primary);
}

.about-vision .vision-wrapper .vision-body .vision-left .vision-item .item-title .item-icon svg {}

.about-vision .vision-wrapper .vision-body .vision-left .vision-item .item-title .item-icon svg path {}

.about-vision .vision-wrapper .vision-body .vision-content {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 48px;
  flex: 1 0 0;
  align-self: stretch;
  min-height: 420px;
  max-height: 420px;
}

.about-vision .vision-wrapper .vision-body .vision-content .content-item {
  display: none;
  max-height: 420px;
  min-height: 420px;
  overflow-y: auto;
  height: 100%;
}

.about-vision .vision-wrapper .vision-body .vision-content .content-item.active {
  display: block;
}

.about-vision .vision-wrapper .vision-body .vision-content .content-item .item-wrapper {}

.about-vision .vision-wrapper .vision-body .vision-content .content-item .item-wrapper .item-title {
  color: var(--Secordary-2);
  font-size: 32px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.64px;
  margin-bottom: 3rem;
  padding: 4px 0;
}

.about-vision .vision-wrapper .vision-body .vision-content .content-item .item-wrapper .item-desc {
  color: var(--soluk-text);
  font-size: 19px;
  font-weight: 400;
  line-height: normal;
}

.about-vision .vision-wrapper .vision-body .vision-content .content-item .item-wrapper .item-desc p {
  margin: 0;
}

.about-vision .vision-wrapper .vision-body .vision-content .content-item .item-wrapper .item-desc br {}

.about-stats {
  padding: 42px 0 8rem;
}

.about-stats .stats-wrapper {}

.about-stats .stats-wrapper .swiper {
  position: relative;
  overflow: hidden;
}

.about-stats .stats-wrapper .swiper .stats-item {
  background: var(--Primary-BG-7);
}

.about-stats .stats-wrapper .swiper .stats-item .item-desc {
  color: var(--Territory);
}

.about-blog {
  background: var(--Primary-BG);
}

.about-blog .blog-wrapper {
  padding: 6rem 0;
}

.about-blog .blog-wrapper .swiper {
  position: relative;
  overflow: hidden;
  margin-bottom: 1.5rem;
}

.about-blog .blog-wrapper .banner-navigation {
  margin: 0 auto;
  width: 100%;
  padding: 1rem;
}

.about-policies {
  background: var(--Primary-BG);
}

.about-policies .policies-wrapper {
  padding: 8rem 0;
}

.about-policies .policies-wrapper .policies-list {
  position: relative;
  overflow: hidden;
  padding: 4px;
}

.about-policies .policies-wrapper .policies-list .swiper-wrapper {}

.about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide {}

.about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item {
  display: flex;
  padding: 48px 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  flex: 1 0 0;
  border-radius: 16px;
  background: var(--White);
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset,
    0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08);
  transition: background 400ms ease;
  will-change: background;
}

.about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item .item-numb {
  color: var(--Primary);
  font-size: 32px;
  font-weight: 600;
  line-height: 42px;
  /* 131.25% */
  letter-spacing: -0.64px;
}

.about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item .policies-title {
  color: var(--Secordary-2);
  font-size: 26px;
  font-weight: 600;
  line-height: 32px;
  /* 123.077% */
  letter-spacing: -0.52px;
  min-height: 64px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
  margin: 0;
}

.about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item .policies-view {
  display: flex;
  padding: 12px 0px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 50px;
}

.about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item .policies-view>svg {
  color: var(--Primary);
}

.about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item .policies-view svg path {}

.about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item .policies-view span {
  color: var(--Secordary-2);
  font-size: 19px;
  font-weight: 400;
  line-height: 20px;
  /* 105.263% */
  display: flex;
  align-items: center;
  gap: 8px;
}

@media screen and (max-width: 1440px) {
  .about .about-wrapper .about-banner .banner-title {
    font-size: 64px;
    line-height: normal;
  }

  .about-policies .policies-wrapper {
    padding: 4rem 0;
  }

  .about .about-wrapper .about-banner .banner-desc {
    padding: 6rem 0;
  }

  .about-big-title .big-title-wrapper h2 {
    font-size: 52px;
    margin-bottom: 2rem;
  }
}

@media screen and (max-width: 1199px) {
  .about::before {
    height: 59vh;
  }

  .about-big-title .big-title-wrapper h2 {
    font-size: 42px;
  }

  .about-big-title .big-title-wrapper p {
    font-size: 17px;
    line-height: 24px;
  }

  .about-why-us .why-us-wrapper .why-us-list .why-us-item .item-icon {
    width: 40px;
    height: 40px;
  }

  .about-why-us .why-us-wrapper .why-us-list .why-us-item {
    padding: 32px 24px;
  }

  .about-why-us .why-us-wrapper .why-us-list .why-us-item .item-desc {
    font-size: 17px;
  }

  .about-why-us .why-us-wrapper {
    padding-bottom: 4rem;
  }

  .about-vision .vision-wrapper .vision-header .header-title {
    line-height: 1;
    font-size: 52px;
  }

  .about-vision .vision-wrapper .vision-body-wrapper {
    max-width: 940px;
  }

  .about-vision .vision-wrapper .vision-body .vision-left {
    width: 300px;
  }

  .about-vision .vision-wrapper .vision-body .vision-left .vision-item .item-title span {
    font-size: 22px;
  }

  .about-vision .vision-wrapper .vision-body .vision-content .content-item .item-wrapper .item-title {
    font-size: 24px;
    margin-bottom: 2rem;
  }

  .about-vision .vision-wrapper .vision-body .vision-content .content-item .item-wrapper .item-desc {
    font-size: 17px;
  }

  .about-stats {
    padding-bottom: 5rem;
  }

  .about-blog .blog-wrapper {
    padding: 4rem 0;
  }

  .about-policies .policies-wrapper {
    padding: 1rem 0;
  }

  .about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item .policies-title {
    font-size: 22px;
  }

  .about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item .item-numb {
    font-size: 28px;
  }

  .about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item {
    padding: 2rem;
  }

  .about-stats .stats-wrapper .swiper .stats-item .item-desc {
    font-size: 22px;
  }

  .about-why-us .why-us-wrapper .why-us-title {
    font-size: 42px;
  }
}

@media screen and (max-width: 991px) {
  .about .about-wrapper .about-banner .banner-title {
    font-size: 48px;
  }

  .about::before {
    height: 40vh;
  }

  .about .about-wrapper .about-banner .banner-desc {
    padding: 3rem 0;
    font-size: 22px;
  }

  .about-big-title .big-title-wrapper p {
    font-size: 15px;
    line-height: 24px;
    font-weight: 300;
  }

  .about-big-title .big-title-wrapper h2 {
    font-size: 32px;
    margin-bottom: 0.5rem;
  }

  .about-why-us .why-us-wrapper .why-us-title {
    font-size: 38px;
    margin-bottom: 2rem;
  }

  .about-why-us .why-us-wrapper .why-us-list {
    gap: 12px;
  }

  .about-why-us .why-us-wrapper .why-us-list .why-us-item {
    padding: 28px 20px;
  }

  .about-why-us .why-us-wrapper .why-us-list .why-us-item .item-title {
    font-size: 22px;
  }

  .about-why-us .why-us-wrapper .why-us-list .why-us-item .item-desc {
    font-size: 14px;
    line-height: 24px;
  }

  .about-vision .vision-wrapper .vision-body-wrapper {
    max-width: 720px;
  }

  .about-vision .vision-wrapper .vision-body {
    padding: 1.5rem;
  }

  .about-vision .vision-wrapper .vision-body .vision-content {
    padding: 24px 0;
  }

  .about-vision .vision-wrapper .vision-body .vision-content .content-item .item-wrapper .item-title {
    font-size: 20px;
  }

  .about-vision .vision-wrapper .vision-body .vision-content .content-item .item-wrapper .item-desc {
    font-size: 14px;
    line-height: 24px;
  }

  .about-vision .vision-wrapper .vision-body .vision-left {
    width: 250px;
  }

  .about-vision .vision-wrapper .vision-header .header-title {
    padding-top: 5rem;
    font-size: 42px;
  }

  .about-blog .blog-wrapper {
    padding: 3rem 0;
  }
}

@media screen and (max-width: 767px) {
  .about .about-wrapper .about-banner .banner-title {
    font-size: 42px;
    max-width: 90%;
    padding: 3rem 0;
  }

  .about .about-wrapper .about-banner .banner-desc {
    font-size: 18px;
    font-weight: 400;
  }

  .about-big-title .big-title-wrapper {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
  }

  .about-big-title .big-title-wrapper img {
    grid-column: unset;
    max-height: 280px;
    margin-bottom: 1.5rem;
  }

  .about-why-us .why-us-wrapper {
    padding-top: 2rem;
  }

  .about-why-us .why-us-wrapper .why-us-list {
    grid-template-columns: repeat(2, 1fr);
  }

  .about-why-us .why-us-wrapper .why-us-list .why-us-item {
    padding: 1rem;
    gap: 1rem;
  }

  .about-why-us .why-us-wrapper .why-us-list .why-us-item .item-title {
    font-size: 18px;
    line-height: normal;
  }

  .about-why-us .why-us-wrapper .why-us-list .why-us-item .item-desc {
    line-height: normal;
    font-weight: 300;
    font-size: 13.5px;
  }

  .about-why-us .why-us-wrapper .why-us-list .why-us-item .item-icon {
    width: 32px;
    height: 32px;
  }

  .about-vision .vision-wrapper .vision-header .header-title {
    font-size: 36px;
    max-width: 90%;
    margin: 0 auto;
  }

  .about-vision .vision-wrapper .vision-body {
    flex-direction: column;
    gap: 0;
    padding: 0;
  }

  .about-vision .vision-wrapper .vision-body .vision-left {
    width: 100%;
    flex-wrap: nowrap;
    flex-direction: unset;
    overflow-x: auto;
    align-items: start;
    justify-content: start;
    gap: 1.5rem;
  }

  .about-vision .vision-wrapper .vision-body-wrapper {
    max-width: 400px;
  }

  .about-vision .vision-wrapper .vision-bg {
    height: 420px;
  }

  .about-vision .vision-wrapper .vision-body .vision-left .vision-item .item-title {
    padding-bottom: 1rem;
  }

  .about-vision .vision-wrapper .vision-body .vision-content {
    padding-top: 0.5rem;
    min-height: 350px;
    max-height: 360px;
  }

  .about-vision .vision-wrapper .vision-body .vision-left .vision-item .item-title span {
    font-size: 20px;
    font-weight: 500;
  }

  .about-why-us .why-us-wrapper .why-us-title {
    font-size: 32px;
    font-weight: 500;
  }
}

/* ABOUT END */
/* SERVICES DETAIL START */
section.services-category-list {
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  background: #fff;
}

.services-category-list .category-list-wrapper {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 0;
}

.services-category-list .category-list-wrapper .swiper {
  position: relative;
  overflow: hidden;
  flex: 1;
}

.services-category-list .category-list-wrapper .swiper .swiper-wrapper {}

.services-category-list .category-list-wrapper .swiper .swiper-wrapper .swiper-slide {
  width: max-content;
}

.services-category-list .category-list-wrapper .swiper .swiper-wrapper .swiper-slide .category-list-item {
  display: flex;
  padding: 8px 16px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 24px;
  border-radius: 16px;
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
  color: var(--soluk-text);
  font-size: 16px;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.32px;
}

.services-category-list .category-list-wrapper .swiper .swiper-wrapper .swiper-slide .category-list-item.category-active {
  background: var(--Secordary-2);
  color: var(--Primary-Lighter);
}

.services-category-list .category-list-wrapper .category-list-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 16px;
  background: var(--White);
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset,
    0px 2px 2px 0px rgba(0, 0, 0, 0.08);
  overflow: hidden;
}

.services-category-list .category-list-wrapper .category-list-nav .nav-btn {
  display: flex;
  width: 48px;
  height: 37px;
  padding: 6.857px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: var(--Paragraph);
  cursor: pointer;
  transition: all 400ms ease;
}

.services-category-list .category-list-wrapper .category-list-nav .nav-btn.swiper-button-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.services-category-list .category-list-wrapper .category-list-nav .nav-btn:first-child {
  border-right: 1px solid rgb(122 122 122 / 8%);
}

.services-category-list .category-list-wrapper .category-list-nav .nav-btn svg {}

.services-category-list .category-list-wrapper .category-list-nav .nav-btn svg path {}

.services-detail {
  background: var(--Primary-BG);
}

.services-detail .detail-wrapper {
  padding: 4rem 0;
  display: flex;
  gap: 6rem;
}

.services-detail .detail-wrapper .detail-card {
  display: grid;
  justify-content: space-between;
  gap: 3rem;
}

.services-detail .detail-wrapper .detail-card .detail-header {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--soluk-text);
  text-align: center;
  font-size: 19px;
  font-weight: 400;
  line-height: 20px;
  /* 105.263% */
  transition: color 400ms ease;
  cursor: pointer;
}

.services-detail .detail-wrapper .detail-card .detail-header svg {}

.services-detail .detail-wrapper .detail-card .detail-header svg path {}

.services-detail .detail-wrapper .detail-card .detail-header span {}

.services-detail .detail-wrapper .detail-card .detail-body {
  display: grid;
  gap: 1.5rem;
}

.services-detail .detail-wrapper .detail-card .detail-body .services-title {
  color: var(--Secordary-2);
  font-size: 40px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.8px;
  margin: 0;
}

.services-detail .detail-wrapper .detail-card .detail-body .services-desc {
  color: var(--soluk-text);
  font-size: 19px;
  font-weight: 400;
  line-height: normal;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.services-detail .detail-wrapper .detail-card .detail-body .services-desc p {
  margin: 0;
}

.services-detail .detail-wrapper .detail-card .detail-footer {}

.services-detail .detail-wrapper .detail-card .detail-footer .services-discover {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--soluk-text);
  text-align: center;
  font-size: 19px;
  font-weight: 400;
  line-height: 20px;
  /* 105.263% */
  cursor: pointer;
  transition: color 400ms ease;
}

.services-detail .detail-wrapper .detail-card .detail-footer .services-discover span {}

.services-detail .detail-wrapper .detail-card .detail-footer .services-discover svg {}

.services-detail .detail-wrapper .detail-card .detail-footer .services-discover svg path {}

.services-detail .detail-wrapper .detail-img {
  max-width: 642px;
  width: 100%;
  flex-shrink: 0;
}

.services-detail .detail-wrapper .detail-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 16/9;
  border-radius: 1rem;
}

.services-campaign {
  padding: 1.5rem 0;
}

.services-campaign .campaign-wrapper {
  padding: 4rem 0 3rem;
  max-width: 832px;
  margin: 0 auto;
}

.blog-detail .services-campaign .campaign-wrapper {
  padding-top: 2rem;
}

.services-campaign .campaign-wrapper .campaign-header {
  margin-bottom: 3rem;
}

.services-campaign .campaign-wrapper .campaign-header .header-title {
  color: var(--Secordary-2);
  text-align: center;
  font-size: 64px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -1.28px;
  margin-bottom: 1.5rem;
}

.services-campaign .campaign-wrapper .campaign-header .header-title span {
  color: var(--Primary);
}

.services-campaign .campaign-wrapper .campaign-header .header-title br {}

.services-campaign .campaign-wrapper .campaign-header .header-desc {
  color: var(--Secondary);
  text-align: center;
  font-size: 26px;
  font-weight: 500;
  line-height: normal;
}

.services-campaign .campaign-wrapper .campaign-header .header-desc p {
  margin: 0;
}

.services-campaign .campaign-wrapper .campaign-body {
  padding: 24px;
  border-radius: 16px;
  background: var(--Primary-BG-7, #dff6ff);
}

.services-campaign .campaign-wrapper .campaign-body .campaign-card {
  display: flex;
  gap: 3rem;
}

.services-campaign .campaign-wrapper .campaign-body .campaign-card .campaign-img {
  width: 47%;
}

.services-campaign .campaign-wrapper .campaign-body .campaign-card .campaign-img img {
  aspect-ratio: 16/9;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 16px;
}

.services-campaign .campaign-wrapper .campaign-body .campaign-card .campaign-body {
  flex: 1;
}

.services-campaign .campaign-wrapper .campaign-body .campaign-card .campaign-body .campaign-title {
  color: var(--Secordary-2);
  font-size: 24px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.48px;
  margin-bottom: 1rem;
}

.services-campaign .campaign-wrapper .campaign-body .campaign-card .campaign-body .campaign-desc {
  color: var(--Secondary);
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  margin-bottom: 1.5rem;
}

.services-campaign .campaign-wrapper .campaign-body .campaign-card .campaign-body .campaign-desc p {
  margin: 0;
}

.services-campaign .campaign-wrapper .campaign-body .campaign-card .campaign-body .campaign-code {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.services-campaign .campaign-wrapper .campaign-body .campaign-card .campaign-body .campaign-code .campaign-code-clipboard {
  display: flex;
  padding: 6px 24px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 50px;
  background: var(--Secondary);
  color: var(--Primary-BG);
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  /* 125% */
}

.services-campaign .campaign-wrapper .campaign-body .campaign-card .campaign-body .campaign-code .campaign-copy {
  font-size: 16px;
  padding: 7px 1.5rem;
}

.services-certificate {
  padding: 0 1rem;
}

.services-certificate .certificate-wrapper {
  display: flex;
  padding: 6rem 3rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6rem;
  align-self: stretch;
  border-radius: 16px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: var(--Secordary-2);
  max-width: 1488px;
  margin: 0 auto;
  margin-bottom: 4rem;
}

.services-certificate .certificate-wrapper .certificate-header {}

.services-certificate .certificate-wrapper .certificate-header .certificate-title {
  color: var(--Primary-2);
  text-align: center;
  font-size: 48px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.96px;
  margin: 1.5rem;
}

.services-certificate .certificate-wrapper .certificate-header .certificate-desc {
  color: var(--Primary-Lighter);
  text-align: center;
  font-size: 19px;
  font-weight: 400;
  line-height: normal;
}

.services-certificate .certificate-wrapper .certificate-header .certificate-desc p {
  margin: 0;
}

.services-certificate .certificate-wrapper .certificate-img {}

.services-certificate .certificate-wrapper .certificate-img img {
  max-height: 502px;
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 16 / 9;
  border-radius: 16px;
}

.services-certificate .certificate-wrapper .certificate-subtitle {}

.services-certificate .certificate-wrapper .certificate-subtitle h3 {
  color: var(--Primary-BG-7);
  font-size: 64px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -1.28px;
  text-align: center;
  margin: 0;
}

.services-certificate .certificate-wrapper .certificate-subtitle h3 span {
  color: var(--Primary);
}

.services-certificate .certificate-wrapper .certificate-subtitle h3 br {}

.services-certificate .certificate-wrapper .certificate-subdesc {
  color: var(--soluk-text);
  text-align: center;
  font-size: 24px;
  font-weight: 500;
  line-height: normal;
  max-width: 992px;
  margin: 0 auto;
}

.services-certificate .certificate-wrapper .certificate-subdesc p {
  margin: 0;
}

.services-info {}

.services-info .info-wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding: 6rem 0;
  gap: 3rem;
}

.services-info .info-wrapper .info-card {
  padding: 8px;
}

.services-info .info-wrapper .info-card .info-title {
  color: var(--Secordary-2);
  font-size: 32px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.64px;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--Primary-Border);
}

.services-info .info-wrapper .info-card .info-desc {
  color: var(--soluk-text);
  font-size: 19px;
  font-weight: 400;
  line-height: normal;
}

.services-info .info-wrapper .info-card .info-desc p {
  margin: 0;
}

.services-gallery {
  background: var(--Primary-BG);
  padding: 24px;
}

.services-gallery .gallery-wrapper {
  padding: 4rem 0;
}

.services-gallery .gallery-wrapper .gallery-slider {
  position: relative;
  overflow: hidden;
}

.services-gallery .gallery-wrapper .gallery-slider .swiper-wrapper {}

.services-gallery .gallery-wrapper .gallery-slider .swiper-wrapper .swiper-slide {}

.services-gallery .gallery-wrapper .gallery-slider .swiper-wrapper .swiper-slide .gallery-item {}

.services-gallery .gallery-wrapper .gallery-slider .swiper-wrapper .swiper-slide .gallery-item img {
  height: 342.715px;
  aspect-ratio: 420/342.72;
  max-height: 340px;
  width: 100%;
  object-fit: cover;
  border-radius: 20px;
}

@media screen and (max-width: 1199px) {
  .services-detail .detail-wrapper .detail-img {
    max-width: 480px;
  }

  .services-detail .detail-wrapper .detail-card .detail-body .services-title {
    font-size: 2rem;
  }

  .services-detail .detail-wrapper .detail-card .detail-body .services-desc {
    font-size: 16px;
    line-height: 24px;
  }

  .services-detail .detail-wrapper .detail-card {
    gap: 2rem;
  }

  .services-campaign .campaign-wrapper .campaign-header .header-title {
    font-size: 50px;
    line-height: normal;
  }

  .services-campaign .campaign-wrapper .campaign-header .header-desc {
    font-size: 22px;
  }

  .services-certificate .certificate-wrapper {
    padding: 4rem 3rem;
    gap: 4rem;
    margin-bottom: 1rem;
  }

  .services-certificate .certificate-wrapper .certificate-subtitle h3 {
    font-size: 50px;
  }

  .services-certificate .certificate-wrapper .certificate-subdesc {
    font-size: 22px;
  }

  .services-info .info-wrapper {
    padding: 3rem 0 4rem;
  }

  .services-info .info-wrapper .info-card .info-title {
    font-size: 28px;
  }

  .services-info .info-wrapper .info-card .info-desc {
    font-size: 16px;
    line-height: 24px;
  }

  .services-gallery .gallery-wrapper .gallery-slider .swiper-wrapper .swiper-slide .gallery-item img {
    height: 240px;
  }
}

@media screen and (max-width: 991px) {
  .services-detail .detail-wrapper .detail-img {
    max-width: 360px;
  }

  .services-detail .detail-wrapper .detail-card .detail-body .services-title {
    font-size: 28px;
  }

  .services-detail .detail-wrapper {
    gap: 3rem;
  }

  .services-campaign .campaign-wrapper {
    padding-top: 3rem;
  }

  .services-campaign .campaign-wrapper .campaign-header .header-title {
    font-size: 42px;
  }

  .services-campaign .campaign-wrapper .campaign-header .header-desc {
    font-size: 18px;
  }

  .services-certificate .certificate-wrapper .certificate-header .certificate-title {
    font-size: 38px;
  }

  .services-certificate .certificate-wrapper .certificate-subtitle h3 {
    font-size: 42px;
  }

  .services-certificate .certificate-wrapper {
    gap: 3rem;
  }

  .services-info .info-wrapper .info-card .info-desc {
    font-size: 14px;
  }

  .services-info .info-wrapper {
    gap: 1rem;
  }

  .services-info .info-wrapper .info-card .info-title {
    font-size: 24px;
  }

  .services-gallery .gallery-wrapper {
    padding: 1rem 0;
  }

  .blog.services-blog {
    padding: 0;
  }

  .services-certificate .certificate-wrapper .certificate-subdesc {
    font-size: 18px;
  }

  .services-certificate .certificate-wrapper .certificate-img img {
    max-height: 360px;
  }

  .blog .blog-wrapper .latest-blog .latest-blog-header .header-title {
    font-size: 42px;
  }
}

@media screen and (max-width: 767px) {
  .blog .blog-wrapper .latest-blog .latest-blog-header .header-title {
    font-size: 32px;
  }

  .services-gallery {
    padding: 0;
  }

  .services-info .info-wrapper {
    grid-template-columns: 1fr;
  }

  .services-certificate .certificate-wrapper .certificate-header .certificate-title {
    font-size: 2rem;
    max-width: 100%;
    margin: 0 0 1rem;
  }

  .services-certificate .certificate-wrapper .certificate-header .certificate-desc {
    font-size: 16px;
  }

  .services-certificate .certificate-wrapper .certificate-subtitle h3 {
    font-size: 2rem;
  }

  .services-certificate .certificate-wrapper .certificate-subdesc {
    font-size: 14px;
    line-height: 24px;
  }

  .services-certificate .certificate-wrapper {
    padding: 2rem;
    gap: 2rem;
  }

  .services-campaign .campaign-wrapper .campaign-header .header-title {
    font-size: 2rem;
  }

  .services-campaign .campaign-wrapper .campaign-header .header-desc {
    font-size: 14px;
  }

  .services-campaign .campaign-wrapper {
    padding-top: 1rem;
  }
}

/* SERVICES DETAIL END */
/* PRODUCT DETAIL START */
.product-detail {
  padding: 3rem 0 6rem;
  background: var(--Primary-BG);
}

.product-detail .detail-wrapper {
  display: flex;
  align-items: start;
  gap: 3rem;
}

.product-detail .detail-wrapper .product-left {
  flex: 1;
}

.product-detail .detail-wrapper .product-left .product-info {
  display: grid;
  gap: 1.5rem;
  margin-bottom: 3rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgb(126 126 143 / 16%);
  margin-top: 1.5rem;
}

.product-detail .detail-wrapper .product-left .product-info .product-header {}

.product-detail .detail-wrapper .product-left .product-info .product-header .product-name {
  color: var(--Secordary-2);
  font-size: 40px;
  font-weight: 600;
  line-height: 56px;
  /* 140% */
  letter-spacing: -0.8px;
  margin-bottom: 12px;
}

.product-detail .detail-wrapper .product-left .product-info .product-header .product-price {
  color: var(--Secordary-2);
  font-size: 21px;
  font-weight: 600;
  line-height: 26px;
  /* 123.81% */
  letter-spacing: -0.42px;
}

.product-detail .detail-wrapper .product-left .product-info .product-body {
  color: var(--Primary-BG-3);
  font-size: 19px;
  font-weight: 400;
  line-height: 26px;
  /* 136.842% */
}

.product-detail .detail-wrapper .product-left .product-info .product-body p {
  margin: 0;
}

.product-detail .detail-wrapper .product-left .product-info .product-footer {}

.product-detail .detail-wrapper .product-left .product-info .product-footer .product-btn {
  font-size: 21px;
  padding: 8px 24px;
  border-radius: 16px;
  max-width: 310px;
  width: 100%;
  line-height: 1.8;
}

.product-detail .detail-wrapper .product-left .product-description-area {
  display: grid;
  gap: 3rem;
  margin-bottom: 3rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgb(126 126 143 / 16%);
}

.product-detail .detail-wrapper .product-left .product-description-area .product-desc-main-title {
  color: var(--Secordary-2);
  font-size: 40px;
  font-weight: 600;
  line-height: 48px;
  /* 120% */
  letter-spacing: -0.8px;
  padding: 4px;
}

.product-detail .detail-wrapper .product-left .product-description-area .product-desc {
  color: var(--Primary-BG-3);
  font-size: 19px;
  font-weight: 400;
  line-height: 26px;
  /* 136.842% */
}

.product-detail .detail-wrapper .product-left .product-features {
  display: grid;
  gap: 3rem;
  padding-bottom: 3rem;
  margin-bottom: 3rem;
  border-bottom: 1px solid rgb(126 126 143 / 16%);
}

.product-detail .detail-wrapper .product-left .product-features .features-main-title {
  color: var(--Secordary-2);
  font-size: 40px;
  font-weight: 600;
  line-height: 48px;
  /* 120% */
  letter-spacing: -0.8px;
  padding: 4px;
}

.product-detail .detail-wrapper .product-left .product-features .features-list {
  display: grid;
  gap: 0.5rem;
}

.product-detail .detail-wrapper .product-left .product-features .features-list .features-item {
  display: flex;
  padding: 12px 16px;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-radius: 16px;
  background: var(--Primary-Lighter);
  transition: background 400ms ease;
  will-change: background;
}

.product-detail .detail-wrapper .product-left .product-features .features-list .features-item .item-title {
  color: var(--Secondary);
  font-size: 19px;
  font-weight: 400;
  line-height: 26px;
  /* 136.842% */
}

.product-detail .detail-wrapper .product-left .product-features .features-list .features-item .item-desc {
  color: var(--Primary-BG-3);
  font-size: 19px;
  font-weight: 400;
  line-height: 26px;
  /* 136.842% */
}

.product-detail .detail-wrapper .product-left .product-part {
  margin-bottom: 3rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgb(126 126 143 / 16%);
}

.product-detail .detail-wrapper .product-left .product-part .part-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}

.product-detail .detail-wrapper .product-left .product-part .part-title span {
  color: var(--Secondary);
  font-size: 26px;
  font-weight: 600;
  line-height: 48px;
  /* 184.615% */
  letter-spacing: -0.52px;
  will-change: color;
  transition: color 400ms ease;
}

.product-detail .detail-wrapper .product-left .product-part .part-title svg {
  transition: all 400ms ease;
  will-change: transform;
  color: var(--Primary-BG-3);
}

.product-detail .detail-wrapper .product-left .product-part.active .part-title svg {
  transform: rotate(180deg);
  color: var(--Primary);
}

.product-detail .detail-wrapper .product-left .product-part.active .part-title span {
  color: var(--Primary);
}

.product-detail .detail-wrapper .product-left .product-part .part-title svg path {}

.product-detail .detail-wrapper .product-left .product-part .part-accordion {
  color: var(--Primary-BG-3);
  font-size: 19px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  /* 136.842% */
  padding-top: 2rem;
  display: none;
}

.product-detail .detail-wrapper .product-left .product-part .part-accordion p {
  margin: 0;
}

.product-detail .detail-wrapper .product-img-area {
  width: 510px;
  position: sticky;
  top: calc(var(--header-height) + 1.5rem);
}

.product-detail .detail-wrapper .product-img-area .product-img {
  display: flex;
  height: 510px;
  padding: 8px;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
  aspect-ratio: 510/510;
  border-radius: 12px;
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
  margin-bottom: 2rem;
  width: 100%;
  overflow: hidden;
}

.product-detail .detail-wrapper .product-img-area .product-img .swiper {
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  height: 100%;
}

.product-detail .detail-wrapper .product-img-area .product-img .swiper .swiper-wrapper {}

.product-detail .detail-wrapper .product-img-area .product-img .swiper .swiper-wrapper .swiper-slide {}

.product-detail .detail-wrapper .product-img-area .product-img .swiper .swiper-wrapper .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.product-detail .detail-wrapper .product-img-area .product-thumb-img {
  z-index: 1;
  position: relative;
}

.product-detail .detail-wrapper .product-img-area .product-thumb-img .swiper {
  position: relative;
  overflow: hidden;
}

.product-detail .detail-wrapper .product-img-area .product-thumb-img .swiper .swiper-wrapper {}

.product-detail .detail-wrapper .product-img-area .product-thumb-img .swiper .swiper-wrapper .swiper-slide {}

.product-detail .detail-wrapper .product-img-area .product-thumb-img .swiper .swiper-wrapper .swiper-slide img {
  width: 82px;
  height: 82px;
  border-radius: 8px;
  padding: 8px;
  aspect-ratio: 82.8/82.8;
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
  border: 1px solid transparent;
  transition: 400ms ease;
}

.product-detail .detail-wrapper .product-img-area .product-thumb-img .swiper .swiper-wrapper .swiper-slide.swiper-slide-thumb-active img {
  border-color: var(--Primary-2);
}

@media screen and (max-width: 1199px) {
  .product-detail .detail-wrapper .product-img-area {
    width: 450px;
  }
}

@media screen and (max-width: 991px) {
  .product-detail .detail-wrapper .product-img-area {
    width: 280px;
  }

  .product-detail .detail-wrapper .product-left .product-info .product-header .product-name {
    font-size: 2rem;
  }

  .product-detail .detail-wrapper .product-left .product-info .product-body {
    font-size: 16px;
    line-height: 24px;
  }

  .product-detail .detail-wrapper .product-left .product-info {
    margin-bottom: 2rem;
    padding-bottom: 2.5rem;
    margin-top: 0;
  }

  .product-detail .detail-wrapper .product-left .product-description-area .product-desc-main-title {
    font-size: 2rem;
  }

  .product-detail .detail-wrapper .product-left .product-description-area {
    gap: 1.5rem;
    margin-bottom: 2rem;
    padding-bottom: 2rem;
  }

  .product-detail .detail-wrapper .product-left .product-description-area .product-desc {
    font-size: 16px;
    line-height: 24px;
  }

  .product-detail .detail-wrapper .product-left .product-features .features-main-title {
    font-size: 2rem;
  }

  .product-detail .detail-wrapper .product-left .product-features {
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    padding-bottom: 2rem;
  }

  .product-detail .detail-wrapper .product-left .product-features .features-list .features-item .item-title {
    font-size: 16px;
    line-height: 24px;
  }

  .product-detail .detail-wrapper .product-left .product-part .part-accordion {
    font-size: 16px;
    line-height: 24px;
  }

  .product-detail .detail-wrapper .product-left .product-part {
    padding-bottom: 2rem;
    margin-bottom: 2rem;
  }

  .product-detail .detail-wrapper .product-left .product-part .part-title svg {
    width: 32px;
    height: 32px;
  }

  .product-detail .detail-wrapper .product-left .product-part .part-title span {
    font-size: 24px;
  }

  .product-detail .detail-wrapper .product-left .product-info .product-footer .product-btn {
    font-size: 18px;
  }

  .product-detail .detail-wrapper .product-img-area .product-img {
    height: 280px;
  }
}

@media screen and (max-width: 767px) {
  .product-detail .detail-wrapper {
    flex-direction: column-reverse;
    gap: 1rem;
  }

  .product-detail .detail-wrapper .product-img-area {
    position: unset;
    width: 100%;
  }

  .product-detail .detail-wrapper .product-left .product-info .product-header .product-name {
    font-size: 28px;
    line-height: normal;
  }

  .product-detail .detail-wrapper .product-left .product-info .product-footer .product-btn {
    font-size: 16px;
  }

  .product-detail .detail-wrapper .product-left .product-info {
    margin-bottom: 1rem;
    padding-bottom: 2rem;
  }

  .product-detail .detail-wrapper .product-left .product-description-area .product-desc-main-title {
    font-size: 28px;
  }

  .product-detail .detail-wrapper .product-left .product-description-area {
    gap: 1rem;
  }

  .product-detail .detail-wrapper .product-left .product-description-area .product-desc {
    font-size: 14px;
  }

  .product-detail .detail-wrapper .product-left .product-features .features-main-title {
    font-size: 28px;
  }

  .product-detail .detail-wrapper .product-left .product-features {
    gap: 1rem;
  }

  .product-detail .detail-wrapper .product-left .product-features .features-list .features-item .item-title {
    font-size: 14px;
  }

  .product-detail .detail-wrapper .product-left .product-features .features-list .features-item .item-desc {
    font-size: 16px;
  }

  .product-detail .detail-wrapper .product-left .product-part .part-accordion {
    padding-top: 1rem;
  }

  .product-detail {
    padding-bottom: 0;
  }

  .product-detail .detail-wrapper .product-left .product-part:last-child {
    margin-bottom: 0;
  }
}

/* PRODUCT DETAIL END */
/* BLOG DETAIL START */
.blog-detail {}

.blog-detail .detail-wrapper {
  padding: 3rem 1rem;
  max-width: 992px;
  margin: 0 auto;
}

.blog-detail .detail-wrapper .detail-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.blog-detail .detail-wrapper .detail-header .detail-back {
  color: var(--Primary);
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  /* 142.857% */
  display: flex;
  padding: 6px 24px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 50px;
  background: transparent;
  white-space: nowrap;
}

.blog-detail .detail-wrapper .detail-content {
  display: grid;
  gap: 1.5rem;
  margin-top: 1.5rem;
}

.blog-detail .detail-wrapper .detail-content .content-title {
  color: var(--Secordary-2);
  font-size: 40px;
  font-weight: 600;
  line-height: 48px;
  /* 120% */
  letter-spacing: -0.8px;
  margin: 0;
}

.blog-detail .detail-wrapper .detail-content .content-desc {
  color: var(--Primary-BG-3);
  font-size: 21px;
  font-weight: 400;
  line-height: 32px;
  /* 152.381% */
}

.blog-detail .detail-wrapper .detail-content .content-desc p {
  margin: 0;
}

.blog-detail .detail-wrapper .detail-content .blog-header-info {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.blog-detail .detail-wrapper .detail-content .blog-header-info .header-info-item {
  display: flex;
  padding: 10px 24px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 50px;
  background: var(--Primary-BG-7);
  color: var(--Paragraph-2);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  /* 114.286% */
  transition: background 400ms ease;
}

.blog-detail .detail-wrapper .detail-content .blog-header-info .blog-date {}

.blog-detail .detail-wrapper .blog-body {}

.blog-detail .detail-wrapper .blog-body .blog-img {
  margin: 4rem 0;
}

.blog-detail .detail-wrapper .blog-body .blog-img img {
  max-height: 457px;
  border-radius: 8px;
  width: 100%;
  height: auto;
}

.blog-detail .detail-wrapper .blog-editor {
  color: var(--Primary-BG-3);
  font-size: 19px;
  font-weight: 400;
  line-height: 26px;
  /* 136.842% */
}

.blog-detail .detail-wrapper .blog-editor :is(h1, h2, h3, h4, h5, h6) {
  color: var(--Secordary-2);
  font-weight: 600;
  line-height: 48px;
  letter-spacing: -0.8px;
  margin-bottom: 2rem;
}

.blog-detail .detail-wrapper .blog-editor :is(h4, h5, h6) {
  font-weight: 500;
}

.blog-detail .detail-wrapper .blog-editor p {
  margin: 0;
}

.blog-detail .detail-wrapper .blog-editor br {}

.blog-gallery .default-header .header-content .content-title {
  font-size: 2rem;
}

.blog-gallery .default-header .header-content .content-nav .nav-btn {
  width: 32px;
  height: 32px;
}

.blog-gallery .default-header .header-content .content-nav .nav-btn svg {
  width: 16px;
}

.blog-gallery .default-header .header-content .content-nav .nav-fraction {
  height: auto;
}

@media screen and (max-width: 991px) {
  .blog-detail .detail-wrapper {
    padding-top: 1rem;
  }
}

@media screen and (max-width: 767px) {
  .services-campaign .campaign-wrapper .campaign-body .campaign-card {
    flex-direction: column;
    align-items: start;
    gap: 8px;
  }

  .services-campaign .campaign-wrapper .campaign-body .campaign-card .campaign-img {
    width: 100%;
  }

  .blog-detail .detail-wrapper .detail-content .content-title {
    font-size: 28px;
    line-height: normal;
  }

  .blog-detail .detail-wrapper {
    padding: 2rem 1rem;
  }

  .blog-detail .detail-wrapper .detail-content {
    margin-top: 0;
  }

  .blog-detail .detail-wrapper .detail-content .content-desc {
    font-size: 18px;
    line-height: normal;
  }

  .blog-detail .detail-wrapper .blog-editor :is(h1, h2, h3, h4, h5, h6) {
    line-height: 1.2;
  }

  .blog-detail .detail-wrapper .blog-body .blog-img {
    margin: 3rem 0;
  }

  .blog-detail .detail-wrapper .blog-editor {
    font-size: 16px;
    line-height: 24px;
  }

  .blog-detail .services-campaign .campaign-wrapper {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .blog-detail .blog-gallery {
    margin-bottom: 2rem;
  }

  .blog-detail .detail-wrapper .blog-editor h2 {
    font-size: 26px;
  }

  .blog-detail .detail-wrapper .blog-editor h3 {
    font-size: 24px;
  }

  .blog-detail .detail-wrapper .blog-editor h4 {
    font-size: 22px;
  }

  .blog .homepage-blog .blog-wrapper .blog-list {
    padding-bottom: 3rem;
  }

  .blog-detail .detail-wrapper .detail-header {
    flex-direction: column-reverse;
    align-items: start;
  }

  .blog-detail .detail-wrapper .detail-header .detail-back {
    padding: 0;
  }
}

/* BLOG DETAIL END */
/* CAREER DETAIL START */
/* CAREER DETAIL START */
.career-detail {
  background: var(--Primary-BG);
  padding: 3rem 0;
}

.career-detail .career-wrapper {}

.career-detail .career-wrapper .career-header {
  display: flex;
  align-items: center;
  gap: 3rem;
  padding: 0 0 3rem;
  margin-bottom: 3rem;
  border-bottom: 1px solid rgb(126 126 143 / 16%);
}

.career-detail .career-wrapper .career-header .header-btn {
  display: flex;
  padding: 12px 24px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 50px;
  background: var(--Primary);
  color: var(--White);
  font-size: 21px;
  font-weight: 500;
  line-height: 1.2;
}

.career-detail .career-wrapper .career-header .header-btn:hover {
  background: var(--Secondary);
}

.career-detail .career-wrapper .career-header .header-btn svg {}

.career-detail .career-wrapper .career-header .header-btn svg path {}

.career-detail .career-wrapper .career-header .header-title {
  /* 125% */
  margin: 0;
  color: var(--Primary, #1363df);
  font-family: "Hanken Grotesk";
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
  line-height: 56px;
  /* 175% */
  letter-spacing: -0.64px;
}

.career-detail .career-wrapper .career-content-wrapper {
  display: flex;
  align-items: flex-start;
  gap: 3rem;
}

.career-detail .career-wrapper .career-content-wrapper .career-content-area {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  overflow: hidden;
}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top {
  display: flex;
  flex-direction: column;
  gap: 3rem;
  margin-bottom: 3rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgb(126 126 143 / 16%);
}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .content-area-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .content-area-header h1 {
  color: var(--Primary-BG-9);
  font-weight: 600;
  line-height: normal;
  margin: 0;
}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .content-area-header .header-badges {}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .content-area-header .header-badges span {
  display: flex;
  padding: 10px 24px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 50px;
  background: #e1f5e8;
  color: #007a29;
  font-size: 17px;
  font-weight: 400;
  line-height: 20px;
  /* 113.274% */
}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .position-content {}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .position-content .content-item {}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .position-content .content-item svg {}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .position-content .content-item svg path {}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .position-content .content-item span {
  font-size: 16px;
}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .career-desc {
  color: var(--Grey);
  font-size: 21px;
  font-weight: 400;
  line-height: normal;
  opacity: 0.6;
}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .career-desc p {
  margin: 0;
}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-bottom {
  width: 100%;
}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-bottom .bottom-list {}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-bottom .bottom-list .list-item {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  margin-bottom: 3rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgb(126 126 143 / 16%);
}

.career-detail .list-item h1,
.career-detail .list-item h2,
.career-detail .list-item h3,
.career-detail .list-item h4,
.career-detail .list-item h5,
.career-detail .list-item h6 {
  margin: 0;
  color: var(--Primary-BG-9);
  font-weight: 600;
  line-height: normal;
}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-bottom .bottom-list .list-item ul {}

.career-detail .career-wrapper .career-content-wrapper .career-content-area .content-bottom .bottom-list .list-item ul li {
  color: var(--Primary-BG-3);
  font-size: 19px;
  font-weight: 400;
  line-height: normal;
  opacity: 0.6;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area {
  display: flex;
  width: 421px;
  padding: 48px;
  flex-direction: column;
  align-items: center;
  gap: 25px;
  position: sticky;
  top: calc(var(--header-height) + 1.5rem);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
    0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .form-title {
  color: var(--Primary-BG-9);
  text-align: center;
  font-size: 26px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form {
  width: 100%;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-input {
  margin-bottom: 1rem;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form input {
  display: flex;
  padding: 19px 20px;
  align-items: center;
  gap: 10px;
  background: transparent;
  width: 100%;
  transition: 0.4s;
  color: var(--Paragraph);
  font-size: 16px;
  font-weight: 400;
  border-radius: 8px;
  border: 1px solid var(--Primary-Border);
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form input::placeholder {
  text-transform: capitalize;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form input:hover,
.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form input:focus {
  background: #015bac17;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-input label .label-text:hover {
  background: #015bac17;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-input input#cv {
  position: absolute;
  opacity: 0;
  visibility: hidden;
  width: 0;
  height: 0;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form>.form-captcha {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-aggrement {}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-aggrement .info-text {
  color: var(--Primary-BG-3);
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
  opacity: 0.6;
  margin: 0;
  margin: 25px 0;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-aggrement .info-text a {}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-aggrement .info-text br {}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-send {
  padding-top: 8px;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-send button {
  display: flex;
  padding: 8px 24px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  transition: 0.2s linear;
  width: 100%;
  border-radius: 50px;
  font-size: 21px;
  font-weight: 400;
  line-height: 40px;
  /* 190.476% */
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-send button span {}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-send button svg {}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-send button svg path {}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-input label .label-text {
  display: flex;
  padding: 19px 20px;
  align-items: center;
  background: transparent;
  justify-content: space-between;
  width: 100%;
  color: var(--Paragraph);
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  transition: 0.4s;
  cursor: pointer;
  border-radius: 8px;
  border: 1px solid var(--Primary-Border);
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-input label .label-text .changed-label {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  flex: 1;
  max-width: 65%;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-input label {
  width: 100%;
  margin: 0;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-input label .label-text .static-text-wrapper {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-captcha .form-captcha {
  position: relative;
  border-radius: 8px;
  border: 1px solid var(--Primary-Border);
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-captcha .form-captcha img {
  width: 100%;
  height: 64px;
  object-fit: contain;
  border-radius: 0.5rem;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-captcha .form-captcha a {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 8px;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--Primary);
  color: white;
  border-radius: 50%;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-captcha .form-captcha a i {
  font-size: 14px;
}

.career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-captcha .form-captcha a:hover {
  transform: translateY(-50%) rotate(180deg);
}

.position-content {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.5rem;
}

.position-content .content-item {
  color: var(--Paragraph);
  font-size: 17px;
  font-weight: 400;
  line-height: normal;
  display: flex;
  align-items: center;
  gap: 8px;
}

.position-content .content-item svg {}

.position-content .content-item svg path {}

.position-content .content-item span {}

@media screen and (max-width: 1199px) {
  .career-detail .career-wrapper .career-header .header-title {
    font-size: 49px;
  }

  .career-detail .career-wrapper .career-header .header-btn {
    font-size: 18px;
    padding: 16px 28px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area {
    width: 360px;
    padding: 1.5rem;
  }

  .career-detail .career-wrapper .career-content-wrapper {
    gap: 1.5rem;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area {
    padding: 0;
    gap: 0;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .content-area-header h1 {
    font-size: 32px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .position-content .content-item span {
    font-size: 18px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .career-desc {
    font-size: 18px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-bottom .bottom-list .list-item {
    gap: 1.5rem;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-bottom .bottom-list .list-item ul li {
    font-size: 18px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-bottom .bottom-list .list-item .item-title {
    font-size: 32px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-captcha {
    flex-direction: column;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-captcha .footer-item {
    width: 100%;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-input {
    margin-bottom: 10px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-aggrement .info-text {
    font-size: 13px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-send {
    padding-top: 0;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-send button {
    padding: 2px 24px;
    font-size: 18px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .form-title {
    font-size: 27px;
  }

  .career-detail .career-wrapper .career-header {
    margin-bottom: 1rem;
  }
}

@media screen and (max-width: 991px) {
  .career-detail .career-wrapper .career-content-wrapper {
    flex-direction: column;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area {
    width: 100%;
    align-items: start;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-input {
    width: 49.2%;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-captcha {
    flex-direction: row;
    width: 100%;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-captcha .footer-item {
    width: 50%;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}

@media screen and (max-width: 767px) {
  .career-detail .career-wrapper .career-header {
    flex-direction: column;
    align-items: start;
    margin-bottom: 1rem;
    padding: 0 0 1.5rem;
    gap: 1.5rem;
  }

  .career-detail .career-wrapper .career-header .header-title {
    line-height: normal;
    font-size: 32px;
  }

  .career-detail .career-wrapper .career-header .header-btn {}

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .content-area-header h1 {
    font-size: 28px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .content-area-header {
    flex-direction: column;
    align-items: start;
    gap: 1rem;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top {
    gap: 2rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .career-desc {
    font-size: 16px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-bottom .bottom-list .list-item .item-title {
    font-size: 28px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-bottom .bottom-list .list-item ul li {
    font-size: 16px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-bottom .bottom-list .list-item {
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form {
    display: unset;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-input {
    width: 100%;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-captcha {
    flex-direction: column;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-captcha .footer-item {
    width: 100%;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-send button {
    width: 100%;
    border-radius: 4px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-aggrement .info-text {}

  .career-detail {
    padding: 2rem 0;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .content-area-header .header-badges span {
    padding: 8px 16px;
    font-size: 15px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-content-area .content-top .position-content .content-item span {
    font-size: 15px;
  }

  .career-detail .career-wrapper .career-content-wrapper .career-form-area .career-form .form-input label .label-text .changed-label {
    max-width: 170px;
  }
}

/* CAREER DETAL END */
/* MEDIA DETAIL START */
.media-detail {
  background: var(--Primary-BG);
}

.media-detail .detail-wrapper {
  display: flex;
  gap: 1.5rem;
  padding: 3rem 0 6rem;
}

.media-detail .detail-wrapper .detail-content-area {
  width: 100%;
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper {
  margin-top: 1.5rem;
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .frame-img {
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  transition: all 400ms ease;
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .frame-img::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 10%);
  pointer-events: none;
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .frame-img img {
  max-height: 550px;
  width: 100%;
  object-fit: cover;
  will-change: transform;
  transition: 400ms ease;
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .frame-img .frame-img-icon {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .frame-img .frame-img-icon svg {
  transition: 400ms ease;
  will-change: transform;
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .frame-img .frame-img-icon svg path {
  transition: 400ms ease;
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content {
  margin-top: 4rem;
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content .content-title {
  color: var(--Secordary-2);
  font-size: 40px;
  font-weight: 600;
  line-height: 48px;
  /* 120% */
  letter-spacing: -0.8px;
  margin-bottom: 1.5rem;
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content .content-info {}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content .content-info .info-item-list {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content .content-info .info-item-list .info-item {
  display: flex;
  padding: 10px 24px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 50px;
  background: var(--Primary-BG-7);
  color: var(--Paragraph-2);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  /* 114.286% */
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content .info-editor {
  margin-top: 4rem;
  color: var(--Primary-BG-3);
  font-size: 19px;
  font-weight: 400;
  line-height: 26px;
  /* 136.842% */
}

.media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content .info-editor p {
  margin: 0;
}

.media-detail .detail-wrapper .detail-category {}

.media-detail .detail-wrapper .detail-category .media-category {}

.media-detail .detail-wrapper .detail-category .media-category .category-main-title {
  font-size: 24px;
}

@media screen and (max-width: 1199px) {
  .media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content .content-title {
    font-size: 2rem;
  }

  .media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content {
    margin-top: 2rem;
  }

  .media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content .info-editor {
    margin-top: 2rem;
    font-size: 16px;
  }

  .media-detail .detail-wrapper {
    padding-bottom: 3rem;
    padding-top: 2rem;
  }
}

@media screen and (max-width: 991px) {
  .media-detail .detail-wrapper {
    padding: 1rem 0 0;
    gap: 0;
  }

  .media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content .content-title {
    font-size: 28px;
    line-height: normal;
  }

  .media-detail .detail-wrapper .detail-content-area .detail-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
  }

  .media-detail .detail-wrapper .detail-content-area .detail-header .detail-breadcrumb {
    overflow: hidden;
  }

  .media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content .content-title {
    font-size: 24px;
  }
}

@media screen and (max-width: 767px) {
  .media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content .info-editor {
    font-size: 14px;
    line-height: 24px;
    font-weight: 350;
  }

  .media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .detail-content {
    margin-top: 1.5rem;
  }

  .media-detail .detail-wrapper {
    padding-top: 0;
    gap: 0;
  }

  .media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper {
    margin-top: 0;
  }
}

/* MEDIA DETAIL END */
/* CAREER DETAIL END */

/* CAMAPIGN LIST START */

.campaign {}

.campaign .campaign-wrapper {
  padding: 6rem 0;
}

.campaign .campaign-wrapper .campagint-main-title {
  color: var(--Secordary-2);
  text-align: center;
  font-size: 3rem;
  font-weight: 600;
  line-height: 56px;
  /* 116.667% */
  letter-spacing: -0.96px;
  margin-bottom: 4rem;
}

.campaign .campaign-wrapper .campaign-list-wrapper {}

.campaign .campaign-wrapper .campaign-list-wrapper .campaign-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.campaign-item {
  padding: 1rem;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset,
    0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.campaign-item .item-img {}

.campaign-item .item-img img {
  height: 219px;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
}

.campaign-item .campaign-info {
  display: flex;
  padding: 12px;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  align-self: stretch;
}

.campaign-item .campaign-info .campaign-name {
  color: var(--Secordary-2);
  text-align: center;
  font-size: 26px;
  font-weight: 600;
  line-height: 26px;
  /* 100% */
  letter-spacing: -0.52px;
  margin: 0;
}

.campaign-item .campaign-info .campaign-price {
  color: var(--Secordary-2);
  text-align: center;
  font-size: 21px;
  font-weight: 600;
  line-height: 26px;
  /* 123.81% */
  letter-spacing: -0.42px;
}

.campaign-item .campaign-info .campaign-order {
  border-radius: 1rem;
  padding: 8px 24px;
  width: 100%;
  /* 123.81% */
  font-size: 21px;
  font-weight: 400;
  line-height: 40px;
  /* 190.476% */
  max-width: 310px;
}

.campaign-item .campaign-detail {
  display: flex;
  padding: 12px;
  padding-top: 20px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
  border-top: 1px solid rgb(126 126 143 / 16%);
}

.campaign-item .campaign-detail .campaign-detail-main-title {
  color: var(--Secordary-2);
  font-size: 21px;
  font-weight: 600;
  line-height: 26px;
  /* 123.81% */
  letter-spacing: -0.42px;
  margin: 0;
}

.campaign-item .campaign-detail .campaign-detail-list {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.campaign-item .campaign-detail .campaign-detail-list .detail-list-item {
  /* 152.941% */
  display: flex;
  gap: 8px;
  align-items: start;
}

.campaign-item .campaign-detail .campaign-detail-list .detail-list-item svg {
  flex-shrink: 0;
}

.campaign .campaign-wrapper .campaign-list-wrapper .campaign-list .campaign-item .campaign-detail .campaign-detail-list .detail-list-item svg path {}

.campaign-item .campaign-detail .campaign-detail-list .detail-list-item .item-desc {
  color: #1d3e52;
  font-size: 17px;
  font-weight: 400;
  /* 152.941% */
}

@media screen and (max-width: 1199px) {
  .campaign .campaign-wrapper .campaign-list-wrapper .campaign-list {
    gap: 1rem;
  }

  .campaign-item .campaign-detail .campaign-detail-list .detail-list-item .item-desc {
    font-size: 14px;
  }

  .campaign-item .campaign-info .campaign-order {
    font-size: 18px;
    padding: 8px 16px;
  }
}

@media screen and (max-width: 991px) {
  .campaign .campaign-wrapper .campaign-list-wrapper .campaign-list {
    grid-template-columns: repeat(2, 1fr);
  }

  .campaign .campaign-wrapper {
    padding: 4rem 0;
  }

  .campaign .campaign-wrapper .campagint-main-title {
    margin-bottom: 2rem;
  }
}

@media screen and (max-width: 767px) {
  .campaign .campaign-wrapper .campaign-list-wrapper .campaign-list {
    grid-template-columns: 1fr;
  }

  .campaign .campaign-wrapper .campagint-main-title {
    font-size: 32px;
  }

  .campaign .campaign-wrapper {
    padding: 3rem 0;
  }
}

/* CAMPAIGN LIST END */

/* HOVER START */
@media (hover: hover) {
  .default-btn-primary:hover {
    background: transparent;
    color: var(--Primary);
    border-color: var(--Primary);
  }

  .default-btn-primary-outline:hover {
    background: var(--Primary);
    border-color: transparent;
    color: var(--Primary-BG);
  }

  .banner-navigation .banner-play-pause svg:hover {
    transform: scale(0.9);
  }

  .default-header .header-content .content-nav .nav-btn:hover {
    background: var(--Primary-BG-9);
    color: #fff;
  }

  .product-card:hover .product-img-wrapper img {
    transform: scale(1.05);
  }

  .references-modal .references-modal-wrapper .references-modal-content .modal-close:hover {
    opacity: 0.4;
  }

  .references-item .references-view:hover {
    color: var(--Paragraph-2);
    background: var(--Primary-Border);
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form input:hover {
    border-color: var(--Primary);
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form textarea:hover {
    border-color: var(--Primary);
  }

  .contact .contact-wrapper .contact-form-area .form-wrapper .contact-form form .form-captcha-area .form-captcha-wrapper .form-captcha a:hover {
    transform: translateY(-50%) rotate(180deg);
  }

  .contact .contact-wrapper .contact-office .office-info .office-navigation .navigation-btn:hover {
    background: var(--Primary-BG-9);
    color: var(--Primary-Lighter);
  }

  .contact .contact-wrapper .contact-office .office-info .office-navigation .navigation-btn:hover svg path {
    fill: var(--Primary-Lighter);
  }

  .contact .contact-wrapper .contact-office .office-info .office-body .office-text a:hover {
    color: var(--Primary);
  }

  .blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-item:hover,
  .blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-other:hover {
    background: var(--White);
    box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
      0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
  }

  .pagination-nav .page-numb a:hover {
    background: var(--Primary-BG-7);
  }

  .blog .blog-wrapper .latest-blog .blog-pagination .pagination-nav .page-btn:hover {
    background: var(--Secondary);
    color: #fff;
  }

  .blog-card-item:hover .blog-card-img img {
    transform: scale(1.1);
  }

  .blog-card-item:hover {
    background: var(--Primary-Lighter);
  }

  .blog-card:hover {
    background: #f1f1f1;
  }

  .blog-card:hover .blog-img img {
    transform: scale(1.1);
  }

  .blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-other .other-category-dropdown .category-dropdown-menu .category-dropdown-item:not(.active):hover {
    background: #f1f1f1;
  }

  .blog .blog-wrapper .latest-blog .latest-blog-header .blog-category-list .blog-category-other:hover .other-category-dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
    top: 100%;
  }

  .services .services-wrapper .services-category-list .services-category-wrapper .services-category-item:hover {
    background: var(--Primary);
  }

  .services .services-wrapper .services-category-list .services-category-wrapper .services-category-item:hover .category-numb,
  .services .services-wrapper .services-category-list .services-category-wrapper .services-category-item:hover .category-name {
    color: var(--Primary-Lighter);
  }

  .services.services-dark .services-wrapper .services-category-list .services-category-wrapper .services-category-item:hover {
    background: var(--Primary-2);
  }

  .services.services-dark .services-wrapper .services-category-list .services-category-wrapper .services-category-item:hover .category-numb {
    color: var(--Paragraph-2);
  }

  .services.services-dark .services-wrapper .services-category-list .services-category-wrapper .services-category-item:hover .category-name {
    color: var(--Secondary);
  }

  .default-header .show-all:hover {
    color: var(--Primary);
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item:hover {
    background: var(--Secordary-2);
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item:hover .position-main .position-title {
    color: var(--Primary-Border);
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item:hover .position-info-wrapper .position-info-list .info-list-item {
    color: var(--Primary-Border);
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item:hover .position-info-wrapper .seperator {
    background: var(--Primary-Border);
    opacity: 0.6;
  }

  .career .career-wrapper .career-position .position-wrapper .position-list .position-item:hover .position-info-wrapper .position-btn span {
    color: var(--Primary-Border);
  }

  .media-category .category-list .category-item:hover {
    background: var(--White);
  }

  .media-category .category-list .category-item:hover .category-item-info .item-hidden-arrow {
    width: 20px;
  }

  .media-item:hover .media-img img {
    transform: scale(1.1);
  }

  .media-item:hover {
    background: white;
    box-shadow: 0px 1.724px 6.897px 0px rgba(0, 0, 0, 0.08),
      0px 0px 0px 0.5px rgba(0, 0, 0, 0.16) inset;
  }

  .product .product-wrapper .product-list-wrapper .product-list-header .product-list-header-right .product-filter .selected-filter-menu .filter-item:hover {
    background: #eeeeee;
  }

  .product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .category-item-link .category-item-header:hover {
    background: #e7e7e7;
  }

  .services-category-list .category-list-wrapper .swiper .swiper-wrapper .swiper-slide .category-list-item:not(.category-active):hover {
    background: #2742522b;
    color: var(--Secordary-2);
  }

  .services-category-list .category-list-wrapper .category-list-nav .nav-btn:hover {
    background: var(--Primary-BG-9);
    color: var(--Primary-Lighter);
  }

  .services-detail .detail-wrapper .detail-card .detail-footer .services-discover:hover {
    color: var(--Secordary-2);
  }

  .services-detail .detail-wrapper .detail-card .detail-header:hover {
    color: var(--Secordary-2);
  }

  .product-detail .detail-wrapper .product-left .product-features .features-list .features-item:hover {
    background: #c9def0;
  }

  .product .product-wrapper .product-category .product-category-list-wrapper .product-category-list .product-category-item .product-category-sub-menu .category-sub-menu-item:not(.active):hover {
    color: #7fb1ff;
  }

  .detail-breadcrumb ul li a:hover,
  .detail-breadcrumb ol li a:hover {
    color: var(--Primary);
  }

  .nav-fraction .swiper-pagination-bullet:hover {
    background: #ebf6fa;
  }

  .blog-detail .detail-wrapper .detail-header .detail-back:hover {
    color: var(--Primary-Lighter);
    background: var(--Primary);
  }

  .blog-detail .detail-wrapper .detail-content .blog-header-info .header-info-item:hover {
    background: #bfebfc;
  }

  .media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .frame-img:hover .frame-img-icon svg {
    transform: scale(1.2);
  }

  .media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .frame-img:hover img {
    transform: scale(1.03);
  }

  .media-detail .detail-wrapper .detail-content-area .detail-frame-wrapper .frame-img:hover .frame-img-icon svg path {
    fill: #9bd9f2;
  }

  .about-why-us .why-us-wrapper .why-us-list .why-us-item:hover {
    background: var(--Primary-BG-7);
  }

  .about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item .policies-view span svg {
    width: 0;
    transition: width 400ms;
    will-change: width;
  }

  .about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item .policies-view:hover span svg {
    width: 100%;
  }

  .about-policies .policies-wrapper .policies-list .swiper-wrapper .swiper-slide .policies-item .policies-view:hover {
    background: var(--Primary-Lighter);
    padding: 12px 24px;
  }

  .about-vision .vision-wrapper .vision-body .vision-left .vision-item .item-title:hover span {
    color: var(--Secondary);
  }

  .about-vision .vision-wrapper .vision-body .vision-left .vision-item .item-title:hover .item-icon {
    color: var(--Primary);
  }

  .about-vision .vision-wrapper .vision-body .vision-left .vision-item .item-title:hover {
    border-color: var(--Primary);
  }
}