/* 
*****************
SCROLL US GENERAL
*****************
*/
.scroll-us-card {
  aspect-ratio: 4 / 3;
}

.card-us-bg {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 0;
}
.card-bg-current {
  z-index: 0;
}

.card-bg-next {
  z-index: 1;
  pointer-events: none;
  opacity: 0;
  transition: all 0.4s ease-in-out;
}
.card-bg-next.fade-in {
  opacity: 1;
}

/* **************
SCROLL US Normal
************** */

.scroll-us-wrapper {
  height: 300lvh;
  position: relative;
}
.scroll-us-container {
  position: sticky;
  height: 100lvh;
  top: 0;
}

#scroll-us p {
  text-decoration: none;
  mix-blend-mode: normal;
  font-size: 4.33rem;
  color: white;
  transition: all 0.4s ease-in-out;
  line-height: 120%;
  font-family: "GothicExpand";
  text-transform: uppercase;
  font-weight: 900;
}

#scroll-us p.active {
  color: var(--acc-sec);
  transform: skew(-13deg);
  text-shadow: 0 0 7px #fff, 0 0 10px #fff, 0 0 21px #fff, 0 0 42px #db952e,
    0 0 82px #db952e, 0 0 92px #db952e, 0 0 102px #db952e, 0 0 151px #db952e;
}

/* **************
SCROLL US SMALL
************** */

.scroll-us-small-wrapper {
  height: 300lvh;
  position: relative;
}
.scroll-us-small-container {
  position: sticky;
  height: 100lvh;
  top: 0;
}

#scroll-us-small p {
  text-decoration: none;
  mix-blend-mode: normal;
  font-size: 2.33rem;
  color: white;
  transition: all 0.4s ease-in-out;
  line-height: 120%;
  font-family: "GothicExpand";
  text-transform: uppercase;
  font-weight: 900;
}

#scroll-us-small p.active {
  color: var(--acc-sec);
  transform: skew(-13deg);
  text-shadow: 0 0 7px #fff, 0 0 10px #fff, 0 0 21px #fff, 0 0 42px #db952e,
    0 0 82px #db952e, 0 0 92px #db952e, 0 0 102px #db952e, 0 0 151px #db952e;
}

@media screen and (max-width: 768px) {
  .scroll-us-wrapper {
    height: 600lvh;
    position: relative;
  }
  .scroll-us-container {
    position: sticky;
    height: 100lvh;
    top: 0;
  }
  #scroll-us p {
    font-size: 1.88rem;
    line-height: 3.33rem;
    transition: all 0.4s ease-in-out;
  }
  #scroll-us p.active {
    color: var(--acc-sec);
    transform: skew(-13deg);
    text-shadow: 0 0 3px #fff, 0 0 7px #fff, 0 0 11px #fff, 0 0 22px #db952e,
      0 0 32px #db952e, 0 0 42px #db952e, 0 0 52px #db952e, 0 0 61px #db952e;
  }
  .scroll-us-card {
    width: auto;
    max-height: 100svh;
    aspect-ratio: 9 / 16;
    filter: brightness(70%);
  }

  #scroll-us p {
    font-size: 4.33rem;
    line-height: 150%;
  }

  /* **************
SCROLL US SMALL
************** */
.scroll-us-small-wrapper {
    height: 300lvh;
    position: relative;
  }
  .scroll-us-small-container {
    position: sticky;
    height: 100lvh;
    top: 0;
  }
  #scroll-us-small p {
    font-size: 1.88rem;
    line-height: 3.33rem;
    transition: all 0.4s ease-in-out;
  }
  #scroll-us-small p.active {
    color: var(--acc-sec);
    transform: skew(-13deg);
    text-shadow: 0 0 3px #fff, 0 0 7px #fff, 0 0 11px #fff, 0 0 22px #db952e,
      0 0 32px #db952e, 0 0 42px #db952e, 0 0 52px #db952e, 0 0 61px #db952e;
  }
  .scroll-us-small-card {
    width: auto;
    max-height: 100svh;
    aspect-ratio: 9 / 16;
    filter: brightness(70%);
  }

  #scroll-us-small p {
    font-size: 4.33rem;
    line-height: 150%;
  }


}