
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Manrope:wght@200..800&family=Sora:wght@100..800&display=swap');
/* @import url(https://db.onlinewebfonts.com/c/3ba3d430101f4117426fd5eb8276fd7c?family=Deacon+Test+Book); */


@font-face {
    font-family: "deacon";
    src: url("/assets/font/DeaconTest-Bold-BF63c8afcee0ca9.otf");
    font-weight: 900;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.deacon{
    font-family: deacon;
}

.inter{
    font-family: "Inter", sans-serif;
}
.manrope{
    font-family: "Manrope", sans-serif;
}

.sora{
    font-family: "Sora", sans-serif;
}

button {
    outline-style: none !important;
}

html {
    scroll-behavior: smooth;
}


.box-shadow {
    box-shadow: 0px 56px 103px 0px rgba(201, 201, 224, 0.25);
}

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


.accordion-item.activeClick .accordion-content {
    max-height: 1000px;
    margin-top: 27px;
}
@media screen and (max-width: 1024px){
    .accordion-item.activeClick .accordion-content {
        margin-top: 13px;
    }
}
.accordion-icon {
    transition: transform 0.3s ease;
}


.text-center {
    text-align: center !important;
}

.text-left {
    text-align: left !important;
}

.text-gradient {
    background: linear-gradient(to right, #7D55E5, #D9F200, #D9F200);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-align: left !important;
}

.new-style-button:active,
.new-style-button:hover {
    color: #fff;
}

@media screen and (max-width:768px) {
    .text-gradient {
        text-align: center !important;
    }
}

@media screen and (max-width:1024px) {
    .menuTransition {
        transition: all .5s;
        width: 250px;
    }
}

.carousel-container {
    position: relative;
    margin: auto;
    overflow: hidden;
}

.carousel {
    display: flex;
    transition: transform 0.5s ease;
}

.carousel-item {
    min-width: 400px;
    box-sizing: border-box;
    transition: opacity 0.5s ease, transform 0.5s ease;
    transform: scale(0.9);
    opacity: 0.4;

}
.gr{
background-image: linear-gradient(#CBEE64B8 72%, #EEB520B8 72%);

opacity: 0.7;
filter: blur(58.621192932128906px);
}
.carousel-item.inactive {
    opacity: 0.4;
}

.carousel-item.active {
    position: relative;
    top: 20px
}
@media screen and (max-width:1024px) {
    .menuTransition {
        transition: all .5s;
        width: 250px;
    }
}

  
  /* For smaller screens */
  @media (max-width: 1024px) {
    .carousel-item {
      width: 100vw !important;
      min-width: 100vw;
      margin: 0;
    }
    .carousel-item.inactive {
    opacity: 1;
}
  }

  .wrapper {
  width: fit-content;
  overflow: hidden;
}


.wrapper .typing-text {
  position: relative;
  color: #144618;
  width: fit-content;

}

.wrapper .typing-text::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%; 
  background: #fff;
  top: 0;
  left: 0;
  border-left: 3px solid #144618;
  animation: anim 4s steps(12) infinite;
}

@keyframes anim {
  40%,
  60% {
    left: calc(100% + 14px);
  }
  100% {
    left: 0%;
  }
}

@media (max-width: 400px){
    .text{
        font-size: 35px !important;
        line-height: 40px !important ;
        letter-spacing: -1px !important;
    }
}

@media (max-width: 300px){
    .text{
        font-size: 30px !important;
        line-height: 35px !important ;
        letter-spacing: -1px !important;

    }
}
