@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap");

.inter {
  font-family: "Inter";
}

* {
  font-family: "Inter";
}

#loader {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background: white;
  display: flex;
  justify-content: center;
  align-items: center;
}




.loader {
  width: 45px;
  aspect-ratio: 1;
  --c1: no-repeat linear-gradient(#000 0 0);
  --c2: no-repeat linear-gradient(red 0 0);
  --c3: no-repeat linear-gradient(yellow 0 0);
  background:
    var(--c1) 0% 100%,
    var(--c2) 50% 100%,
    var(--c3) 100% 100%;
  animation: l2 1s infinite linear;
}

@keyframes l2 {
  0% {
    background-size: 20% 100%, 20% 100%, 20% 100%
  }

  20% {
    background-size: 20% 60%, 20% 100%, 20% 100%
  }

  40% {
    background-size: 20% 80%, 20% 60%, 20% 100%
  }

  60% {
    background-size: 20% 100%, 20% 80%, 20% 60%
  }

  80% {
    background-size: 20% 100%, 20% 100%, 20% 80%
  }

  100% {
    background-size: 20% 100%, 20% 100%, 20% 100%
  }
}

/* Navbar */
.dropdown-menu {
  transition: max-height 1s ease-in-out, opacity 1s ease-in-out;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
}

.dropdown-menu.visible {
  max-height: 500px;
  /* Adjust this value based on content */
  opacity: 1;
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-in-out;
}

.faq-answer.open {
  max-height: 1000px;
  /* A large value to ensure full expansion */
}

@keyframes slideDown {
  0% {
    max-height: 0;
    opacity: 0;
  }

  100% {
    max-height: 500px;
    /* Adjust this value based on content */
    opacity: 1;
  }
}

@keyframes slideUp {
  0% {
    max-height: 500px;
    opacity: 1;
  }

  100% {
    max-height: 0;
    opacity: 0;
  }
}

.dropdown-menu.opening {
  animation: slideDown 1s forwards;
}

.dropdown-menu.closing {
  animation: slideUp 1s forwards;
}

/* Navbar Mobile View */
.mobile-listitems {
  transition: max-height 0.6s ease, opacity 0.6s ease;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
}

.mobile-listitems.open {
  max-height: 1000px;
  opacity: 1;
}

.faq-icon {
  transition: transform 0.3s ease;
}

.faq-icon.open {
  transform: rotate(180deg);
}

/* Captain */
.play-button {
  width: 100%;
  height: 100%;
  background-image: url("https://cdn.prod.website-files.com/6602d16d2d471bc3ed693bd1/66507b9d89ed252682b7a9c5_Screenshot%202024-05-24%20at%205.05.51%E2%80%AFPM-p-1600.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 20px;
}
.virtual-width{
  width: 57%;
}

/* success-factors-of-ai */
.success-factors-hero-img {
  background-image: url(/assets/image/image.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (min-width: 320px) and (max-width: 640px) {
  .success-factors-hero-img {
    background-image: url(/assets/image/image.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
  }
}

/*research-transfer  */

.research-transfer-bg-img {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
    url(/assets/image/Research/bg_img.jpg);

  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  background-position: auto, cover;
  height: 400px;
}

@media (min-width: 320px) and (max-width: 640px) {
  .research-transfer-bg-img {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
      url(/assets/image/Research/bg_img.jpg);
    /* background-repeat: no-repeat; */
    background-attachment: fixed;
    /* background-position: auto, cover; */

    /* object-fit: cover; */
    background-size: auto, cover;
  }
}

/* FAQ */
.faq-answer {
  transition: max-height 0.6s ease, opacity 0.6s ease;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
}

.faq-answer.open {
  max-height: 1000px;
  opacity: 1;
}

.faq-toggle {
  transition: transform 0.6s ease;
}

.faq-toggle.open {
  transform: rotate(180deg);
}