.section-background {
  position: relative;
  overflow: hidden;
}

.section-background::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--bg-url) no-repeat top right;
  background-size: cover;
  transform: rotate(40deg);
  transform-origin: bottom right;
  z-index: -1;
}

.section-background-full {
  position: relative;
  overflow: hidden;
}

.section-background-full::before {
  content: '';
  position: absolute;
  top: -100px;
  right: -200px;
  width: 75%;
  height: 100%;
  background: var(--bg-url) no-repeat top right;
  background-size: cover;
  /* transform: rotate(40deg); */
  /* transform-origin: bottom right; */
  z-index: -1;
}

.section-background-half {
  position: relative;
  overflow: visible;
}

.section-background-half::before {
  content: '';
  position: absolute;
  top: -100px;
  right: -200px;
  width: 100%;
  height: 100%;
  background: var(--bg-url) no-repeat top right;
  background-size: cover;
  /* transform: rotate(40deg); */
  /* transform-origin: bottom right; */
  z-index: -1;
}

.smooth-content {
  width: 100%;
  height: 100%;
  /* Adjust height based on content */
  overflow: hidden;
  /* or 'auto' depending on your design */
  will-change: transform;
  /* Optimize for smooth scrolling */
}

.animate {
  /* opacity: 1;
    transform: scale(1); */
  transform: skewX(1);
  transition: opacity 2s ease-in;
}

.nk-block {
  display: block;
  width: 100%;
  position: relative;
  z-index: 1;
}

.video-background {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.video-background video {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: translate(-50%, -50%);
  z-index: -1;
}

.video-background .content {
  position: relative;
  z-index: 1;
  /* Add additional styling for your content here */
}

/* @media (max-width: 768px) {
    [data-scroll-direction="horizontal"] {
        overflow-x: auto !important;
        transform: none !important;
        will-change: auto !important;
    }
} */
