/* overrides.css
 * Small UX polish on top of the original Webflow CSS. Loaded after the shared
 * sheet so these rules win. Keep this file small and human-readable.
 */

/* Anchor target on Discover - avoid landing under the sticky nav */
#Section-2 { scroll-margin-top: 120px; }

/* Footer contact rows - hit the 44px tap target minimum */
.footer-link-wrapper {
  min-height: 44px;
  padding: 6px 0;
}

/* ---- Week batch UX polish ------------------------------------------------ */

/* Scroll affordance on the team section lateral scroller so users know
 * they can swipe through all 8 members. Thin visible scrollbar + snap.
 * Toolbox scroll is driven by webflow.js scroll-linked interactions,
 * not user-scrollable, so we leave it alone. */
.syndicate-overflow {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, .25) transparent;
  scroll-snap-type: x mandatory;
  scroll-padding-left: 24px;
}
.syndicate-overflow::-webkit-scrollbar {
  height: 4px;
}
.syndicate-overflow::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, .25);
  border-radius: 4px;
}
.syndicate-overflow::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, .05);
}
.syndicate-overflow > * {
  scroll-snap-align: start;
}

/* Mobile hero: stack the two CTAs vertically, full width, bigger tap targets.
 * Webflow's mobile rule switches this wrapper to display:grid 1fr 1fr, so
 * we override the grid columns to a single column rather than flip to flex. */
@media (max-width: 767px) {
  .landing-cta-buttons-wrapper {
    grid-template-columns: 1fr;
    grid-row-gap: 12px;
    width: 100%;
  }
  .landing-cta-buttons-wrapper .w-button {
    width: 100%;
    text-align: center;
    min-height: 48px;
  }
}

/* Mobile: clamp hero section height using svh so Safari's dynamic toolbar
 * doesn't shift the layout during scroll. Non-destructive cap. */
@media (max-width: 767px) {
  .section-1 {
    min-height: min(100vh, 92svh);
  }
}

/* Accessibility: respect prefers-reduced-motion - kill scroll reveal
 * animations and pause background video autoplay. Webflow's interactions
 * rely on `transform`/`opacity` on [data-w-id] nodes; forcing identity
 * transforms keeps content visible without the slide-in. */
@media (prefers-reduced-motion: reduce) {
  [data-w-id] {
    transform: none !important;
    opacity: 1 !important;
    animation: none !important;
    transition: none !important;
  }
  video[autoplay] {
    /* autoplay + muted is already set; browsers that honor the pref
     * will skip autoplay regardless. This is defensive. */
    animation-play-state: paused;
  }
}