/*
 * Moments page responsive styles.
 * Kept separate so the gallery base system stays readable.
 */

@media (max-width: 1200px) {
  .gallery-masonry {
    column-count: 3;
  }
}

@media (max-width: 900px) {
  .gallery-masonry {
    column-count: 2;
  }

  .gallery-hero {
    min-height: 84vh;
    min-height: 84svh;
    padding-left: var(--space-lg);
    padding-right: var(--space-lg);
  }

  .gallery-hero-title {
    font-size: 5rem;
  }

  .gallery-hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .gallery-hero-actions .btn {
    width: 100%;
    justify-content: center;
  }

  .gallery-stats {
    margin-top: calc(-1 * var(--space-2xl));
  }

  .stat-card {
    padding: var(--space-lg);
    min-width: 100px;
  }

  .moments-next {
    align-items: flex-start;
    flex-direction: column;
  }

  .moments-next h2 {
    font-size: 2.1rem;
  }

  .moments-next__links {
    justify-content: flex-start;
  }
}

@media (max-width: 768px) {
  .gallery-hero-bg img {
    animation: none;
  }

  .stat-card,
  .gallery-filters,
  .filter-btn {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .gallery-item,
  .gallery-item img {
    transition: none;
    animation: none;
  }

  .gallery-item:hover,
  .gallery-item:hover img {
    transform: none;
  }
}

@media (max-width: 600px) {
  .gallery-hero {
    min-height: 86vh;
    min-height: 86svh;
    margin: 0;
    padding-bottom: var(--space-xl);
  }

  .gallery-hero-content {
    gap: var(--space-sm);
  }

  .gallery-hero-title {
    font-size: 4.1rem;
  }

  .gallery-hero-subtitle {
    letter-spacing: 0.24em;
  }

  .gallery-hero-location {
    gap: var(--space-sm);
    font-size: 0.98rem;
    line-height: 1.45;
  }

  .gallery-hero-location::before,
  .gallery-hero-location::after {
    width: 24px;
  }

  .gallery-hero-stills {
    gap: 0.42rem;
  }

  .gallery-hero-stills img {
    aspect-ratio: 16 / 9;
  }

  .gallery-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-sm);
    max-width: 360px;
    margin-top: calc(-1 * var(--space-xl));
    padding: 0 var(--space-md);
  }

  .stat-card {
    min-height: 90px;
    min-width: 0;
    padding: var(--space-md) var(--space-xs);
    border-radius: 18px;
  }

  .stat-number {
    font-size: 2.15rem;
  }

  .stat-label {
    font-size: 0.52rem;
    letter-spacing: 0.16em;
    overflow-wrap: anywhere;
  }

  .gallery-filters {
    padding: var(--space-md);
    top: 62px;
  }

  .gallery-masonry {
    column-count: 1;
    column-gap: 12px;
  }

  .gallery-item {
    margin-bottom: 12px;
    border-radius: 12px;
  }

  .gallery-item.featured {
    column-span: all;
  }

  .filter-btn {
    padding: 10px 18px;
    font-size: 0.6rem;
  }

  .moments-next {
    width: min(100% - 1.5rem, 420px);
    margin: var(--space-2xl) auto;
    padding: var(--space-xl) 0;
  }

  .moments-next h2 {
    font-size: 1.9rem;
  }

  .moments-next__links,
  .moments-next__link {
    width: 100%;
  }
}
