/* ==========================================================================
   Maria MDS — Custom Styles, Keyframes & Elevations
   ========================================================================== */

/* Lenis Smooth Momentum Scrolling Styles */
html.lenis, html.lenis body {
  height: auto;
}
.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}
.lenis.lenis-stopped {
  overflow: hidden;
}
.lenis.lenis-smooth iframe {
  pointer-events: none;
}

/* Unbreakable Seamless Infinite Marquee */
@keyframes marquee-lane-anim {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-100% - 1.5rem));
  }
}
@keyframes marquee-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-100% - 1.5rem));
  }
}

.marquee-row {
  display: flex;
  gap: 1.5rem;
  width: max-content;
}

.marquee-lane, .carousel-track {
  display: flex;
  gap: 1.5rem;
  flex-shrink: 0;
  animation: marquee-lane-anim 28s linear infinite;
  will-change: transform;
}

/* Only pause on hover on devices that support true pointer hovering, and on active touch press */
@media (hover: hover) and (pointer: fine) {
  .marquee-container:hover .marquee-lane,
  .marquee-container:hover .carousel-track {
    animation-play-state: paused;
  }
}
.marquee-container:active .marquee-lane,
.marquee-container:active .carousel-track {
  animation-play-state: paused;
}

/* 3D-Look Car Elevation Shadow */
.car-3d-shadow {
  filter: drop-shadow(0 18px 16px rgba(0, 0, 0, 0.45));
}

/* Clean Card Elevation */
.clean-card {
  background-color: #FFFFFF;
  border: 1px solid #E8E2D8;
  box-shadow: 0 4px 20px -2px rgba(12, 27, 42, 0.05);
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}
.clean-card:hover {
  border-color: #D97706;
  box-shadow: 0 12px 32px -4px rgba(12, 27, 42, 0.1);
}

/* Roadside Sign Group Styling */
.roadside-sign-bg,
.mobile-sign-bg {
  filter: drop-shadow(0 10px 18px rgba(12, 27, 42, 0.22));
  transition: stroke 0.45s ease-out, stroke-width 0.45s ease-out;
}

.roadside-sign-group,
.mobile-vertical-sign-group {
  pointer-events: auto;
  cursor: default;
}

.roadside-sign-group:hover .roadside-sign-bg,
.mobile-vertical-sign-group:hover .mobile-sign-bg {
  stroke: #D97706;
  stroke-width: 4px;
}