@import "tailwindcss";

:root {
  --background: #ffffff;
  --foreground: #171717;
  --font-nunito: 'Nunito', sans-serif;
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --font-sans: var(--font-geist-sans);
  --font-mono: var(--font-geist-mono);
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
  }
}

.curved-edge-1 {
  mask: radial-gradient(55% 80px at top, transparent 100%, black);
  height: 100%;

}

.title {
  font-size: 35px;
  color: #101427;
  font-weight: 500;
}

.subtitle {
  font-size: 15px;
  color: #5e6d80;
  font-weight: 500;
}

@media(max-width:767px) {
  .title {
    font-size: 25px;

  }

  .subtitle {
    font-size: 14px;

  }

  .swiper {

    padding-bottom: 20px !important;
  }
}

@media(max-width:425px) {
  .title {
    font-size: 21px;

  }

  .subtitle {
    font-size: 13px;

  }

  .swiper {

    padding-bottom: 10px !important;
  }
}

/* @keyframes scroll {
  0% { transform: translateY(0); }
  100% { transform: translateY(-50%); } 
}

.animate-scroll {
  animation: scroll 10s linear infinite;
} */
.swiper {

  padding-bottom: 40px !important;
}

.shadow-0 {
  box-shadow: 10px 10px #ff0077;

}

.custom-bg {
  background-image: radial-gradient(circle at 10% 20%, rgba(6, 78, 59, 0.55), transparent 15%),
    linear-gradient(135deg, #456487 0%, #611c72 25%, #8c372b 40%, #000 70%);
  background-blend-mode: overlay;
  background-size: 100% 200%;
  background-position: center top;
}

/* For top 3 cards */
.bg-top-half {
  background-position: center top;
  background-size: 100% 200%;
  background-image: radial-gradient(circle at 10% 20%, rgba(6, 78, 59, 0.55), transparent 15%),
    linear-gradient(135deg, #456487 0%, #611c72 25%, #8c372b 40%, #000 70%);
  background-blend-mode: overlay;
}

/* For bottom 3 cards */
.bg-bottom-half {
  background-position: center bottom;
  background-size: 100% 200%;
  background-image: radial-gradient(circle at 10% 20%, rgba(6, 78, 59, 0.55), transparent 15%),
    linear-gradient(135deg, #456487 0%, #611c72 25%, #8c372b 40%, #000 70%);
  background-blend-mode: overlay;
  position: relative;
  overflow: hidden;
}

.tbb {
  position: absolute;
  width: 100%;
  height: 123px;
  left: 0;
  background: #fff;
  top: 38%;
}


.bt-hover:hover {
    background-color: #fff !important;
}
.contentS p {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.4;
}