  /* Scroll behavior */
  html {
    scroll-behavior: smooth;
  }

  /* Reveal on scroll — progressive enhancement via JS */
  .reveal {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.6s ease, transform 0.6s ease;
  }

  .reveal.revealed {
    opacity: 1;
    transform: translateY(0);
  }

  /* Mobile menu transitions */
  #mobile-menu.open {
    opacity: 1;
    pointer-events: all;
  }

  #mobile-menu.closed {
    opacity: 0;
    pointer-events: none;
  }

  /* Navbar solid background when scrolled */
  #navbar.scrolled {
    background: rgba(254, 253, 248, 0.97);
    box-shadow: 0 1px 12px rgba(0, 0, 0, 0.06);
    backdrop-filter: blur(8px);
  }

  /* Subtle pattern for hero overlay */
  #hero {
    position: relative;
  }

  /* Smooth image loading */
  img {
    opacity: 1;
    transition: opacity 0.3s ease;
  }

  /* Selection color */
  ::selection {
    background: #a7f3d0;
    color: #064e3b;
  }

  /* Reduced motion */
  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }
    .reveal {
      transition: none;
    }
    img {
      transition: none;
    }
  }
