/* ==========================================================================
   SATTVA — Responsive & Motion Accessibility Stylesheet
   ========================================================================== */

/* Breakpoint 768px (Tablets & Mobile) */
@media (max-width: 768px) {
  .hero-content-grid {
    grid-template-columns: 1fr !important;
    gap: 2.5rem !important;
    text-align: center;
  }

  .hero-cta-buttons {
    justify-content: center !important;
  }

  .arch-frame-hero {
    max-width: 320px;
    margin: 0 auto;
  }

  .signature-cards-slider {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 1.25rem;
    padding-bottom: 1.5rem;
    -webkit-overflow-scrolling: touch;
  }

  .signature-cards-slider > div {
    flex: 0 0 280px;
    scroll-snap-align: start;
  }

  .story-split-grid {
    grid-template-columns: 1fr !important;
  }

  .gallery-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* Breakpoint 1024px */
@media (max-width: 1024px) {
  #site-header .nav-link {
    font-size: 0.7rem;
  }
}

/* Reduced Motion Override (Accessibility Rule) */
@media (prefers-reduced-motion: reduce) {
  *, ::before, ::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .signature-card:hover {
    transform: none !important;
  }

  .arch-frame img {
    transform: none !important;
  }
}