/* ==========================================================================
   Breakpoints
   ========================================================================== */

@media (max-width: 1280px) {
  .foot-grid { grid-template-columns: 1fr 1fr 1fr; }
  .foot-about { grid-column: 1 / -1; }
  .people { grid-template-columns: repeat(3, 1fr); }
}

/* ----------------------------------------------------------- <= 1080px */
@media (max-width: 1080px) {
  .hero__grid { grid-template-columns: 1fr; }
  .hero__col { display: none; }

  .value__grid,
  .caps,
  .proc,
  .cols,
  .cols--even,
  .cols--flip,
  .contact { grid-template-columns: 1fr; }

  .cols__sticky, .proc__sticky, .contact__aside { position: static; }
  .proc__step { opacity: 1; }

  .work-row { grid-template-columns: 1fr; }
  .work-row:nth-child(even) .work-row__media { order: 0; }

  .journal, .tgrid, .cap-grid { grid-template-columns: repeat(2, 1fr); }
  .metrics, .stat-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-cell:nth-child(2), .metrics div:nth-child(2) { border-right: 0; }
  .stat-cell:nth-child(-n+2), .metrics div:nth-child(-n+2) { padding-bottom: 1.5rem; }

  .big-row { grid-template-columns: 62px minmax(0, 1fr) 46px; row-gap: 0.5rem; }
  .big-row p { grid-column: 2 / 3; }
}

/* ------------------------------------------------------------ <= 900px */
@media (max-width: 900px) {
  .nav-links { display: none; }
  .menu-btn { display: inline-flex; }

  /* Sticky stages fall back to plain stacked layouts */
  .pillars { height: auto; }
  .pillars .pillars__stage { position: static; height: auto; display: block; }
  .pillars .pillars__media { display: none; }
  .pillars .pillars__head { position: static; margin-bottom: 2.5rem; }
  .pillars .pillar {
    position: static;
    opacity: 1;
    transform: none;
    pointer-events: auto;
    padding-block: clamp(1.75rem, 5vw, 2.75rem);
    border-top: 1px solid var(--line-ink);
  }
  .pillars .pillars__in { padding-block: clamp(3rem, 9vw, 5rem); }
  .pillars .pillars__dots { display: none; }

  .feat { height: auto; }
  .feat .feat__stage { position: static; height: auto; display: block; padding-block: var(--section-y); }
  .feat .feat__frame { width: 100%; transform: none !important; border-radius: var(--r-lg) !important; }
  .feat .feat__frame::after { opacity: 1; }
  .feat .feat__copy { position: static; opacity: 1; transform: none; padding: 1.5rem 0 0; color: var(--text); }
  .feat .feat__copy h2 { color: var(--text); }
  .feat .feat__copy p { color: var(--text-2); }
  .feat .feat__copy .tag { border-color: var(--line-2); color: var(--text-2); }
  .feat .feat__copy .arrow-link { color: var(--text); }
  .feat .feat__copy .arrow-link i { border-color: var(--line-2); }

  .people { grid-template-columns: repeat(2, 1fr); }
  .trail { display: none; }
}

/* ------------------------------------------------------------ <= 680px */
@media (max-width: 680px) {
  :root { --section-y: clamp(3rem, 9vw, 5rem); }

  .journal, .tgrid, .cap-grid, .wgrid { grid-template-columns: 1fr; }
  .metrics, .stat-grid { grid-template-columns: 1fr; }
  .stat-cell, .metrics div { border-right: 0; border-bottom: 1px solid var(--line-ink); }
  .metrics div { border-bottom-color: var(--line); }
  .stat-cell:last-child, .metrics div:last-child { border-bottom: 0; }

  .caps__item { grid-template-columns: 1fr; gap: 0.35rem; }
  .caps__item:hover { padding-left: 0; }
  .index-list li, .tl li { grid-template-columns: 1fr; gap: 0.4rem; }
  .big-row { grid-template-columns: 1fr 46px; }
  .big-row__n { grid-column: 1 / -1; }
  .big-row p { grid-column: 1 / 2; }
  .big-row:hover { padding-left: 0; }

  .foot-grid { grid-template-columns: 1fr; }
  .foot-mark { font-size: 20vw; }
  .foot-legal { flex-direction: column; gap: 0.5rem; }

  .hero__foot { flex-direction: column; align-items: flex-start; }
  .hero__lede { flex-direction: column; gap: 1.25rem; }

  .cursor, .cursor-txt { display: none; }
  .scroll-count { display: none; }
  .next-link:hover { padding-left: 0; }
}

/* --------------------------------------------------- Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .pillars { height: auto; }
  .pillars .pillars__stage { position: static; height: auto; display: block; }
  .pillars .pillars__media { display: none; }
  .pillars .pillars__head { position: static; margin-bottom: 2.5rem; }
  .pillars .pillar { position: static; opacity: 1; transform: none; pointer-events: auto; padding-block: 2rem; border-top: 1px solid var(--line-ink); }
  .pillars .pillars__dots { display: none; }

  .feat { height: auto; }
  .feat .feat__stage { position: static; height: auto; display: block; padding-block: var(--section-y); }
  .feat .feat__frame { width: 100%; transform: none !important; }
  .feat .feat__copy { position: static; opacity: 1; transform: none; padding: 1.5rem 0 0; color: var(--text); }
  .feat .feat__copy h2 { color: var(--text); }

  .marquee__track { transform: none !important; }
  .proc__step { opacity: 1; }
}