@media (max-width: 1280px) { .rail { display: none; } }

@media (max-width: 1100px) {
  .hero { grid-template-columns: minmax(0, 1fr); min-height: 0; gap: var(--s7); }
  .hero-copy { padding-top: var(--s7); }
  .hero h1 { font-size: clamp(1.7rem, 7.15vw, 4.6rem); }
  .stage { max-width: 760px; margin-inline: auto; aspect-ratio: 1 / 0.92; }
  .stage-axis { top: 0; }
  .show, .show:nth-of-type(even) { grid-template-columns: minmax(0, 1fr); gap: var(--s5); }
  .show:nth-of-type(even) .show-view { order: 0; }
  .cap-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cap { min-height: 180px; }
  .ind-layout, .contact-grid, .about-cols, .detail-title { grid-template-columns: minmax(0, 1fr); }
  .ind { grid-template-columns: minmax(0, 1fr); }
  .ind-nav { position: static; display: flex; overflow-x: auto; gap: var(--s4); padding-bottom: var(--s2); }
  .ind-nav a { white-space: nowrap; }
  .feature-show, .feature-show:nth-of-type(even) { grid-template-columns: minmax(0, 1fr); gap: var(--s4); }
  .feature-show:nth-of-type(even) .ui { order: 0; }
  .market-feature { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .market-feature a:nth-child(3) { display: none; }
  .index-peek { display: none; }
}

@media (max-width: 960px) {
  .nav-toggle { display: inline-grid; margin-left: auto; }
  .nav-cta { display: none; }
  .nav-links {
    position: fixed; inset: var(--header-h) 0 0; z-index: 60; flex-direction: column; gap: 0; margin: 0; padding: var(--s4) var(--pad) var(--s6);
    background: var(--void); visibility: hidden; opacity: 0; transition: 0.25s var(--ease); overflow-y: auto;
  }
  .nav-links.open { visibility: visible; opacity: 1; }
  .menu-open { overflow: hidden; }
  .menu-open .site-header { background: var(--void); }
  .nav-links a { display: flex; align-items: baseline; gap: var(--s4); padding: 16px 0; border-bottom: 1px solid var(--border); }
  .nav-links a small { display: block; flex: 0 0 8ch; font-family: var(--mono); font-size: 0.6875rem; color: var(--dim); }
  .nav-links a span { font: 300 clamp(1.7rem, 8vw, 2.8rem)/1.05 var(--display); font-stretch: 125%; text-transform: uppercase; color: var(--paper); }
  .nav-links a[aria-current='page']::after { display: none; }
  .nav-links a[aria-current='page'] span { color: var(--amber); }
  .section-head { grid-template-columns: minmax(0, 1fr); gap: var(--s3); }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .stat:nth-child(3) { border-left: 0; padding-left: 0; }
  .stat:nth-child(n + 3) { border-top: 1px solid var(--border); }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-brand { grid-column: 1 / -1; }
  .log li { grid-template-columns: minmax(0, 1fr); gap: var(--s2); }
  .cap-grid, .about-grid { grid-template-columns: minmax(0, 1fr); }
  .flow-line { grid-auto-flow: row; padding: 0 0 0 30px; gap: var(--s4); }
  .flow-line::before { top: 0; bottom: 0; left: 6px; right: auto; width: 1px; height: auto; background: linear-gradient(var(--amber), var(--cobalt-soft)); }
  .flow-line li::before { top: 3px; left: -30px; }
  .stack-layers div { grid-template-columns: minmax(0, 1fr); gap: var(--s2); }
}

@media (max-width: 640px) {
  :root { --s8: 60px; --s9: 88px; }
  .hero-hud span:last-child { display: none; }
  .hero h1 { font-size: 7.15vw; }
  .hero { gap: var(--s5); padding-bottom: var(--s5); }
  .hero-copy { padding-top: var(--s6); }
  .hero .lead { margin-bottom: var(--s5); font-size: var(--t-md); }
  .hero .btn-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s2); }
  .hero .btn { min-height: 48px; padding: 0 8px; font-size: 0.8125rem; }
  .stage-ring::after { display: none; }
  .ind-head h2 { font-size: clamp(1.4rem, 7vw, 2rem); }

  /* Phone hero: one lead window and the phone, stacked as a deliberate pair */
  .stage { aspect-ratio: 1 / 1.06; margin-top: var(--s2); }
  .stage-ring { top: 22%; width: 56cqi; height: 56cqi; margin: -28cqi; }
  .stage-moon { top: 22%; width: 34cqi; height: 34cqi; margin: -17cqi; }
  .fw-1 { left: 0; top: 34%; width: 76%; }
  .fw-2, .fw-5 { display: none; }
  .fw-3 { left: 0; right: auto; top: 70%; width: 64%; }
  .fw-4 { right: 0; top: 22%; width: 44%; z-index: 3; }
  .stage-cursor { display: none; }

  .marquee span { gap: var(--s4); padding-right: var(--s4); }
  .show-view { padding: 12px; }
  .show-1 .show-view > .ui:not(.show-over), .show-2 .show-view > .ui:not(.show-over) { width: 100%; }
  .show-over { display: none; }
  .index-row { grid-template-columns: 34px minmax(0, 1fr) auto; }
  .cap-list { grid-template-columns: minmax(0, 1fr); }
  .cap { min-height: 0; }
  .cap .icon { margin-bottom: var(--s4); }
  .footer-sign { white-space: normal; font-size: 12vw; }
  .form-grid { grid-template-columns: minmax(0, 1fr); }
  .market-feature { grid-template-columns: minmax(0, 1fr); }
  .market-feature a:nth-child(2) { display: none; }
  .filter-bar { position: static; }
  .filter-bar .field, .filter-bar select { flex: 1 1 46%; max-width: none; width: 100%; }
  .filter-bar .grow { flex-basis: 100%; }
  .t-compact { flex-direction: column; }
  .t-compact .tile-view { flex: none; padding: var(--s3) var(--s3) 0; }
  .t-compact .ui { width: 100%; border: 1px solid var(--border); border-bottom: 0; }
  .t-compact .tile-body { border-left: 0; border-top: 1px solid var(--border); }
  .mosaic.list .app-card { flex-direction: column; }
  .mosaic.list .tile-view { flex: none; padding: var(--s3) var(--s3) 0; }
  .mosaic.list .tile-body { border-left: 0; }

  /* Tables become labelled stacks */
  .data-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .data-table, .data-table tbody, .data-table tr, .data-table td { display: block; width: 100%; }
  .data-table tr { padding: 8px 14px; border-bottom: 1px solid var(--border); }
  .data-table td { display: flex; justify-content: space-between; align-items: center; gap: var(--s4); padding: 5px 0; border: 0; text-align: right; overflow-wrap: anywhere; }
  .data-table td::before { content: attr(data-label); color: var(--muted); text-align: left; flex: none; max-width: 45%; }
  .data-table td.row-actions { justify-content: flex-end; width: 100%; }
  .data-table td.row-actions::before { content: none; }
  .row-actions .icon-btn { width: 44px; height: 44px; }
  .search-box { flex: 1 1 100%; }
  .filter { flex: 1 1 40%; }
  .filter select { max-width: none; width: 100%; }
  .table-toolbar .spacer { display: none; }
  .table-toolbar .btn { flex: 1; min-height: 44px; }
}
