@font-face {
  font-family: "Metropolis";
  src: url("./fonts/Metropolis-Light.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Metropolis";
  src: url("./fonts/Metropolis-Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Metropolis";
  src: url("./fonts/Metropolis-Medium.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "Metropolis";
  src: url("./fonts/Metropolis-SemiBold.otf") format("opentype");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: "Metropolis";
  src: url("./fonts/Metropolis-Bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "Metropolis";
  src: url("./fonts/Metropolis-ExtraBold.otf") format("opentype");
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: "Metropolis";
  src: url("./fonts/Metropolis-Black.otf") format("opentype");
  font-weight: 900;
  font-style: normal;
}

.faq-item {
  transition: all 0.3s ease;
}

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

.faq-content.active {
  max-height: 200px;
}

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

.faq-icon img.rotate {
  transform: rotate(45deg);
}
.standard {
  box-shadow: 0px 10px 50px 20px #03045e4d;
}
/* Custom animation for mobile menu */
.mobile-menu-enter {
  opacity: 0;
  transform: translateY(-20px);
}

.mobile-menu-enter-active {
  opacity: 1;
  transform: translateY(0);
  transition: all 0.3s ease-out;
}

.mobile-menu-exit {
  opacity: 1;
  transform: translateY(0);
}

.mobile-menu-exit-active {
  opacity: 0;
  transform: translateY(-20px);
  transition: all 0.3s ease-out;
}

/* Hamburger animation */
.hamburger-line {
  transition: all 0.3s ease;
  transform-origin: center;
}

.hamburger-active .line1 {
  transform: rotate(45deg) translate(6px, 6px);
}

.hamburger-active .line2 {
  opacity: 0;
}

.hamburger-active .line3 {
  transform: rotate(-45deg) translate(6px, -6px);
}
