/* ========================================
   SCROLL SNAPPING
   Controlled by JavaScript - CSS snap disabled
   ======================================== */

/* Scroll snap is now controlled by controlled-scroll.js */
/* This ensures one tick = one section change */

html {
  scroll-snap-type: none; /* Disabled - JS controls scroll */
  scroll-behavior: smooth; /* Keep smooth for programmatic scrolls */
}

body {
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: none;
}

/* Sections no longer need snap points (JS handles it) */
.hero,
.section,
.footer {
  scroll-snap-align: none;
  scroll-snap-stop: normal;
  scroll-margin-top: 0;
  will-change: scroll-position;
}

/* Contact section should not snap to allow footer visibility */
.contact {
  scroll-snap-align: none !important;
  min-height: auto;
}

/* Add scroll padding to account for fixed header */
/* Header has ~70px height + 20px top inset = ~90px total */
html {
  scroll-padding-top: 100px;
}

/* ========================================
   OPTIMIZATION FOR MOBILE
   ======================================== */

@media (max-width: 768px) {
  /* Scroll-snap is now DISABLED in CSS and enabled by JS after page loads */
  /* This prevents the page from snapping to a section before scroll position is set */
  html {
    scroll-snap-type: none; /* Will be enabled by controlled-scroll.js after 300ms */
  }
  
  html {
    scroll-padding-top: 70px; /* Smaller header on mobile */
  }
}

/* ========================================
   ACCESSIBILITY
   ======================================== */

/* Disable scroll snap for users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-snap-type: none;
  }
}