/* Home — route planner promo & hero scroll indicator (matches siphtml design) */

/* Space below the overlapping search card before the route planner section */
.home-search-below {
  margin-bottom: 3rem;
}

@media (min-width: 768px) {
  .home-search-below {
    margin-bottom: 4.5rem;
  }
}

.home-hero-scroll {  animation: home-scroll-bounce 2s ease-in-out infinite;
}

@keyframes home-scroll-bounce {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(8px);
  }
}

.home-route-planner-visual {
  position: relative;
  height: 480px;
}

@media (max-width: 1023px) {
  .home-route-planner-visual {
    height: 360px;
    margin-bottom: 2rem;
  }
}

.home-route-card--trail {
  position: absolute;
  top: -1rem;
  right: -1rem;
  width: 11rem;
  z-index: 10;
}

.home-route-card--ai {
  position: absolute;
  bottom: -1rem;
  left: -1rem;
  width: 13rem;
  z-index: 10;
}

@media (max-width: 640px) {
  .home-route-card--trail {
    right: 0;
    top: -0.5rem;
    width: 10rem;
  }

  .home-route-card--ai {
    left: 0;
    bottom: -0.5rem;
    width: 11.5rem;
  }
}

.home-search-icon {
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  color: hsl(var(--primary));
}

.home-route-step-icon {
  width: 1rem;
  height: 1rem;
  color: hsl(var(--primary));
}

.home-route-step-chevron {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  margin-left: auto;
  color: hsl(var(--primary));
}

/* Plan Your Journey column: force white copy (theme foreground can be dark on bg-secondary) */
.home-route-journey .home-route-journey-copy,
.home-route-journey .home-route-journey-copy h2,
.home-route-journey .home-route-journey-copy p,
.home-route-journey .home-route-journey-copy .font-medium {
  color: #ffffff !important;
}

.home-route-journey .home-route-journey-kicker {
  color: #ffffff !important;
}

.home-route-journey .home-route-journey-lede {
  color: rgba(255, 255, 255, 0.92) !important;
}

.home-route-journey .home-route-journey-copy .home-route-step-icon,
.home-route-journey .home-route-journey-copy .home-route-step-chevron {
  color: #ffffff !important;
  stroke: #ffffff;
}