@media (max-width: 1024px) {
  /* Hairline frame transitions to a tighter, safe 15px on smaller viewports */
  .frame-line {
    transition: top 0.5s ease, bottom 0.5s ease, left 0.5s ease, right 0.5s ease;
  }
  .frame-top { top: 15px; left: 15px; right: 15px; }
  .frame-bottom { bottom: 15px; left: 15px; right: 15px; }
  .frame-left { top: 15px; bottom: 15px; left: 15px; }
  .frame-right { top: 15px; bottom: 15px; right: 15px; }

  .editorial-grid,
  .about-hero-grid,
  .services-hero-grid,
  .portfolio-hero-grid,
  .case-hero-grid,
  .pricing-hero-grid,
  .contact-hero-grid,
  .asymmetric-dna-grid,
  .case-narrative-grid,
  .chapter-grid,
  .chapter-grid.reverse {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .chapter-visual.sticky-col {
    position: relative;
    top: 0;
  }
  .dna-blocks {
    border-left: none;
    padding-left: 0;
  }
  .about-hero-image,
  .services-hero-image,
  .portfolio-hero-image,
  .case-hero-image,
  .pricing-hero-image,
  .contact-hero-image {
    max-width: 500px;
    height: 40vh;
    margin: 0 auto;
  }
  .container {
    padding: 0 40px;
  }
  nav {
    padding: 40px 40px;
  }
  nav.scrolled {
    padding: 25px 40px;
  }
  .nav-links {
    display: none;
  }
  .menu-trigger {
    display: flex;
  }
  .showcase-ui {
    left: 40px;
    right: 40px;
  }
  .slide {
    padding: 0 5%;
  }
  .leaders-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .leader-card.offset-down,
  .loop-card.offset-card {
    transform: translateY(0);
  }
  .ex-card.small-card {
    width: 100%;
  }
  .exhibition-grid {
    grid-template-columns: 1fr;
    gap: 50px 0;
  }

  /* Responsive fallbacks for filter sections */
  .filter-container-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
  }
  .filter-wrapper {
    flex-wrap: wrap; 
  }
  .grid-layout-switcher {
    display: none; 
  }

  .exhibition-grid.grid-3-col {
    grid-template-columns: 1fr;
  }
  .modular-builder-grid {
    grid-template-columns: 1fr;
  }
  .case-meta-grid,
  .stats-editorial {
    grid-template-columns: repeat(2, 1fr);
  }
  .case-gallery-grid {
    grid-template-columns: 1fr;
  }
  .gallery-item.full-width {
    grid-column: span 1;
  }
  .builder-row {
    grid-template-columns: 0.5fr 2.5fr 1fr;
  }
  .calc-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
  }
  .calc-checkout {
    width: 100%;
    justify-content: space-between;
  }
  .form-row {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-bottom: 20px;
  }
  .grid-2,
  .leadership-header,
  .value-row,
  .loop-grid {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: flex-start;
    gap: 50px;
  }
  .about-hero,
  .services-hero,
  .portfolio-hero,
  .case-hero,
  .pricing-hero,
  .contact-hero {
    height: auto;
    padding: 120px 0 50px 0;
  }
}

@media (max-width: 768px) {
  .leaders-grid {
    grid-template-columns: 1fr;
  }
  .case-meta-grid,
  .stats-editorial {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .calc-checkout {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }
  .mobile-nav-footer {
    flex-direction: column;
    gap: 20px;
  }
}