#tai-tabber-module {
  position: relative !important;
  padding: 60px 20px !important;
  color: #ffffff !important;
  overflow: hidden !important;
}

/* =========================
   HERO
========================= */

.tri-hero-wrapper {
  text-align: center !important;
  margin-bottom: 70px !important;
}

.tri-hero-sub {
  font-size: 18px !important;
  opacity: 0.7 !important;
  margin-bottom: 12px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.tri-hero-title {

  font-size: 64px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;

  margin-bottom: 24px !important;

  background:
    linear-gradient(
      90deg,
      #ffffff,
      #17f1b1
    ) !important;

  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.tri-hero-desc {

  max-width: 900px !important;

  margin: auto !important;

  font-size: 18px !important;

  line-height: 1.9 !important;

  color: rgba(255,255,255,0.72) !important;
}

/* =========================
   TABS
========================= */

.tai-tabs {

  display: flex !important;

  justify-content: center !important;

  flex-wrap: wrap !important;

  gap: 14px !important;

  margin-bottom: 60px !important;
}

.tai-tab-btn {

  padding: 12px 24px !important;

  border-radius: 999px !important;

  border:
    1px solid rgba(255,255,255,0.08) !important;

  background:
    rgba(255,255,255,0.04) !important;

  color:
    rgba(255,255,255,0.7) !important;

  cursor: pointer !important;

  transition:
    all 0.35s ease !important;

  backdrop-filter:
    blur(12px) !important;
}

.tai-tab-btn:hover,
.tai-tab-btn.active {

  background:
    linear-gradient(
      135deg,
      #17f1b1,
      #2ec5ff
    ) !important;

  color: #000000 !important;

  transform:
    translateY(-2px) !important;

  box-shadow:
    0 8px 30px rgba(23,241,177,0.2) !important;
}

/* =========================
   TAB CONTENT
========================= */

.tai-tab-content {
  display: none !important;
}

.tai-tab-content.active {
  display: block !important;
}

/* =========================
   SLIDER WRAPPER
========================= */

.tai-slider-wrapper {

  position: relative !important;

  width: 100% !important;

  padding: 0 90px !important;

  overflow: hidden !important;
}

/* =========================
   SCROLL AREA
========================= */

.tai-slider-scroll {

  overflow-x: auto !important;

  overflow-y: hidden !important;

  scrollbar-width: none !important;

  -ms-overflow-style: none !important;

  scroll-behavior: smooth !important;

  cursor: grab !important;

  width: 100% !important;
}

.tai-slider-scroll::-webkit-scrollbar {
  display: none !important;
}

.tai-slider-scroll.dragging {
  cursor: grabbing !important;
}

/* =========================
   TRACK
========================= */

.tai-slider-track {

  display: flex !important;

  gap: 28px !important;

  width: max-content !important;

  padding: 10px 0 30px !important;
}

/* =========================
   CARD
========================= */

.tai-card {

  flex: 0 0 calc((100vw - 260px) / 3) !important;

  max-width: 420px !important;

  min-width: 320px !important;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0.05),
      rgba(255,255,255,0.015)
    ) !important;

  backdrop-filter:
    blur(18px) !important;

  border-radius: 28px !important;

  overflow: hidden !important;

  color: #ffffff !important;

  border:
    1px solid rgba(255,255,255,0.08) !important;

  transition:
    transform 0.45s ease,
    box-shadow 0.45s ease,
    border-color 0.45s ease !important;

  position: relative !important;

  display: flex !important;

  flex-direction: column !important;
}

.tai-card:hover {

  transform:
    translateY(-10px) !important;

  border-color:
    rgba(23,241,177,0.35) !important;

  box-shadow:
    0 20px 50px rgba(0,0,0,0.45),
    0 0 40px rgba(23,241,177,0.08) !important;
}

/* =========================
   IMAGE
========================= */

.tai-card-image {
  overflow: hidden !important;
}

.tai-card-image img {

  width: 100% !important;

  height: 250px !important;

  object-fit: cover !important;

  display: block !important;

  transition:
    transform 0.8s ease !important;
}

.tai-card:hover .tai-card-image img {

  transform:
    scale(1.06) !important;
}

/* =========================
   BODY
========================= */

.tai-card-body {

  padding:30px 28px 0px 28px!important;

  display: flex !important;

  flex-direction: column !important;

  height: 100% !important;
}

.tai-card-body h4 {

  font-size: 28px !important;

  line-height: 1.25 !important;

  margin-bottom: 18px !important;

  color: #17f1b1 !important;

  font-weight: 500 !important;

  letter-spacing: -0.03em !important;
}

.tai-card-body p {

  font-size: 16px !important;

  line-height: 1.9 !important;

  color:
    rgba(255,255,255,0.72) !important;
}

/* =========================
   BUTTON
========================= */


.tai-card-btn {
  margin-top:20px;

  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  padding: 14px 24px !important;

  border-radius: 999px !important;

  text-decoration: none !important;

  font-size: 15px !important;

  font-weight: 600 !important;

  color: #000000 !important;

  background:
    linear-gradient(
      135deg,
      #17f1b1,
      #2ec5ff
    ) !important;

  transition:
    all 0.35s ease !important;

  box-shadow:
    0 10px 30px rgba(23,241,177,0.22) !important;
}

.tai-card-btn:hover {

  transform:
    translateY(-2px) !important;

  box-shadow:
    0 14px 35px rgba(23,241,177,0.35) !important;

  filter: brightness(1.05) !important;
}

/* =========================
   FIXED ARROWS
========================= */

.tai-slider-arrow {

  position: absolute !important;

  top: 50% !important;

  transform:
    translateY(-50%) !important;

  width: 68px !important;

  height: 68px !important;

  border-radius: 50% !important;

  border:
    2px solid rgba(255,255,255,0.16) !important;

  background:
    rgba(8,8,8,0.92) !important;

  color: #ffffff !important;

  font-size: 34px !important;

  font-weight: 300 !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  z-index: 9999 !important;

  cursor: pointer !important;

  transition:
    all 0.35s ease !important;

  box-shadow:
    0 10px 40px rgba(0,0,0,0.45) !important;

  backdrop-filter:
    blur(10px) !important;

  -webkit-backdrop-filter:
    blur(10px) !important;
}

/* LEFT */

.tai-slider-arrow.left {
  left: 0 !important;
}

/* RIGHT */

.tai-slider-arrow.right {
  right: 0 !important;
}

/* HOVER */

.tai-slider-arrow:hover {

  background:
    linear-gradient(
      135deg,
      #17f1b1,
      #2ec5ff
    ) !important;

  color: #000000 !important;

  border-color:
    rgba(255,255,255,0.4) !important;

  box-shadow:
    0 15px 45px rgba(23,241,177,0.35) !important;
}

/* ACTIVE */

.tai-slider-arrow:active {

  transform:
    translateY(-50%)
    scale(0.92) !important;
}

/* =========================
   EDITOR MESSAGE
========================= */

.tai-editor-message {

  padding: 40px !important;

  text-align: center !important;

  background:
    rgba(255,255,255,0.03) !important;

  border-radius: 20px !important;

  border:
    1px solid rgba(255,255,255,0.08) !important;
}

/* =========================
   TABLET
========================= */

@media(max-width: 992px) {

  .tri-hero-title {
    font-size: 46px !important;
  }

  .tri-hero-desc {
    font-size: 16px !important;
  }

  .tai-slider-wrapper {
    padding: 0 70px !important;
  }

  .tai-card {

    flex: 0 0 calc((100vw - 180px) / 2) !important;

    min-width: 280px !important;
  }

  .tai-card-image img {
    height: 220px !important;
  }

  .tai-slider-arrow {

    width: 54px !important;

    height: 54px !important;

    font-size: 24px !important;
  }

}

/* =========================
   MOBILE
========================= */

@media(max-width: 768px) {

  #tai-tabber-module {
    padding: 70px 16px !important;
  }

  .tri-hero-title {
    font-size: 34px !important;
  }

  .tri-hero-desc {

    font-size: 15px !important;

    line-height: 1.7 !important;
  }

  .tai-tabs {

    gap: 10px !important;

    margin-bottom: 40px !important;
  }

  .tai-tab-btn {

    padding: 10px 18px !important;

    font-size: 14px !important;
  }

  .tai-slider-wrapper {
    padding: 0 48px !important;
  }

  .tai-card {

    flex: 0 0 82vw !important;

    min-width: 82vw !important;

    max-width: 82vw !important;
  }

  .tai-card-image img {
    height: 210px !important;
  }

  .tai-card-body {
    padding: 22px !important;
  }

  .tai-card-body h4 {
    font-size: 22px !important;
  }

  .tai-card-body p {

    font-size: 15px !important;

    line-height: 1.7 !important;
  }

  .tai-slider-arrow {.tai-card-btn-wrap

    width: 42px !important;.tai-card-btn-wrap

    height: 42px !important;

    font-size: 18px !important;
  }

}