/* Custom CSS for Dockline Global */

/* Base & Reset */
html.lenis {
  height: auto;
}
.lenis.lenis-smooth {
  scroll-behavior: auto;
}
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}
.lenis.lenis-stopped {
  overflow: hidden;
}

/* Custom Cursor */
.cursor-dot,
.cursor-outline {
  position: fixed;
  top: 0;
  left: 0;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  z-index: 9999;
  pointer-events: none;
}
.cursor-dot {
  width: 8px;
  height: 8px;
  background-color: #d4af37;
}
.cursor-outline {
  width: 40px;
  height: 40px;
  border: 1px solid rgba(212, 175, 55, 0.5);
  transition: width 0.2s, height 0.2s, background-color 0.2s;
}

/* Text Effects */
.stroke-text {
  -webkit-text-stroke: 1px #fff; /* Fallback */
  color: transparent;
}
.text-stroke-dark {
  -webkit-text-stroke: 1px #0a0a0a;
  color: transparent;
}

/* Scroll Down Animation */
@keyframes scrolldown {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(100%); }
}
.animate-scrolldown {
  animation: scrolldown 2s cubic-bezier(0.77, 0, 0.175, 1) infinite;
}

/* Horizontal Scroll Section */
.pin-wrap-sticky {
  height: 100vh;
  width: 100%;
  overflow: hidden;
}

.pin-wrap {
  height: 100vh;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  /* width will be set by JS or large enough to contain elements */
}

/* Magnetic Button */
.magnetic-btn {
  display: inline-block;
  cursor: pointer;
}

/* Smooth Image Reveal */
.reveal-img {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1s cubic-bezier(0.77, 0, 0.175, 1);
}
.reveal-img.is-visible {
  clip-path: inset(0 0 0 0);
}

/* Preloader */
.preloader {
    transition: opacity 0.5s ease-out, visibility 0.5s ease-out;
}
.preloader.fade-out {
    opacity: 0;
    visibility: hidden;
}