@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Quicksand:wght@300..700&display=swap");

body {
  font-family: "Open Sans", sans-serif;
  margin: 0px;
  padding: 0px;
}

:root {
  --grad1: #FFB823; /* mint green */
  --grad2: #ff8c1a; /* orange gold */
  --grad3: #ff5f6d; /* coral pink */
  --grad4: #d64b6a; /* magenta rose */
  --grad5: #6a5acd; /* soft violet */
  --grad6: #0072ff; /* royal blue */
  --grad7: #00c6ff; /* sky cyan */
 
  --background: linear-gradient(90deg, #FF4D12 0%, #FF7361 25.48%, #B659FF 52.4%, #00BCFF 75.96%, #00CF7F 100%);
}

.bg-gradient {
  background: linear-gradient(
    90deg,
    var(--grad1),
    var(--grad2),
    var(--grad3),
    var(--grad4),
    var(--grad5),
    var(--grad6),
    var(--grad7)
    
  );
  background-size: 300% 300%;
  animation: gradientMove 8s ease infinite;
}

@keyframes gradientMove {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}
.text-gradient {
  background: linear-gradient(
    90deg,
    var(--grad1),
    var(--grad2),
    var(--grad3),
    var(--grad4),
    var(--grad5),
    var(--grad6),
    var(--grad7)
  );
  background-size: 300% 300%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: gradientMove 8s ease infinite;
  font-weight: 700;
  display: inline-block;
}
.hero-heading {
  line-height: 5rem;
}
.main-banner .item h6 {
  text-transform: uppercase;
  font-size: 18px;
  color: #ffffff;
  margin-bottom: 15px;
  font-weight: 600;
}
.main-blue-button-hover {
  display: inline-block;
  background-color: #03a4ed;
  font-size: 15px;
  font-weight: 400;
  color: #fff;
  text-transform: capitalize;
  padding: 12px 25px;
  border-radius: 23px;
  letter-spacing: 0.25px;
  transition: all 0.3s;
}
.call-button {
  color: #ff695f;
  font-size: 15px;
  font-weight: 500;
}
.call-button {
  display: inline-block;
}
.call-button > i {
  margin-right: 5px;
  width: 46px;
  height: 46px;
  display: inline-block;
  text-align: center;
  line-height: 46px;
  border-radius: 50%;
  background: rgb(255, 104, 95);
  background: linear-gradient(
    105deg,
    rgba(255, 104, 95, 1) 0%,
    rgba(255, 144, 104, 1) 100%
  );
  color: #fff;
  font-size: 20px;
}

.main-banner .item h2 span {
  color: #ff695f;
}
.text-orange{
     color: #ff695f;
}

.hero-section {
  background-color: rgb(224, 224, 224);
    background-repeat: no-repeat;
    background-image: url('../img/hero-section.png');
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100dvh;
    opacity: 1;
    visibility: inherit;
    z-index: 20;
}
.inner-section {
  background-color: rgb(224, 224, 224);
    background-repeat: no-repeat;
    background-image: url('../img/hero-section.png');
    background-size: cover;
    background-position: center center;
    width: 100%;
    opacity: 1;
    visibility: inherit;
    z-index: 20;
}

@keyframes scroll {
  0% {
    transform: translateX(20%);
  }
  100% {
    transform: translateX(-100%);
  }
}

.animate-scroll {
  display: inline-flex;
  animation: scroll 20s linear infinite;
}
.award-card img{
  width:100px!important;
}
.owl-carousel .owl-stage-outer{
  padding: 20px 0px!important;
}
.contact-area{
  background-image: url('../img/contact.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%!important;
  
}
  @keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
  }
  .animate-float {
    animation: float 4s ease-in-out infinite;
  }

.pricing-card {
  background-color: #ffffff;
  border-radius: 16px;          /* rounded-2xl */
  padding: 24px;                /* p-6 */
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08); /* shadow */
  transition: box-shadow 0.3s ease;
}

.pricing-card:hover {
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12); /* hover:shadow-xl */
}

.pricing-card h4 {
  font-size: 18px;              /* text-lg */
  font-weight: 600;             /* font-semibold */
  color: #1f2937;               /* text-gray-800 */
}

.pricing-card p {
  font-size: 14px;              /* text-sm */
  color: #6b7280;               /* text-gray-500 */
  margin-top: 4px;              /* mt-1 */
}

.pricing-card span {
  display: block;               /* block */
  margin-top: 16px;             /* mt-4 */
  font-size: 24px;              /* text-2xl */
  font-weight: 700;             /* font-bold */
  color: #111827;               /* text-gray-900 */
}

.highlight {
  border: 2px solid #2563eb;    /* border-blue-600 */
  position: relative;
}

.module {
  background-color: #f3f4f6;    /* bg-gray-100 */
  border-radius: 8px;           /* rounded-lg */
  padding: 12px 16px;           /* py-3 px-4 */
  font-weight: 500;             /* font-medium */
}
