/* Keep each screen's complete composition centered in the available height. */
.flow {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 110px 10%;
}
.section-grid { width: 100%; margin: 0 auto; }
.feature-strip { width: 100%; margin: 64px auto 0; }
.route-stage { aspect-ratio: 1.3; }
.diagram-label { top: 0; }
.route-mac { left: 1%; top: 36%; width: 33%; aspect-ratio: auto; }
.route-speaker { right: 0; top: 8%; width: 27%; height: auto; }
.route-headphones { right: 1%; bottom: 2%; width: 25%; height: auto; opacity: .52; }
.product-image { position: relative; overflow: hidden; width: 100%; }
.product-image img { position: absolute; display: block; max-width: none; }
.mac-image { aspect-ratio: 1; }
.mac-image img { width: 190%; height: auto; left: -45%; top: -45%; }
.pod-image { aspect-ratio: 1.06; mix-blend-mode: multiply; }
.pod-image img { width: 242%; height: auto; left: -70%; top: -128%; }
.headphones-image { aspect-ratio: 1; }
.headphones-image img { width: 100%; height: 100%; object-fit: contain; }
.route-stage .device-name {
  position: static; width: 100%; margin: 13px 0 0;
  font: 500 12px/1.5 -apple-system, BlinkMacSystemFont, sans-serif;
  letter-spacing: 0; color: #4f574a;
}
.route-stage .device-state { position: static; width: 100%; margin: 4px 0 0; font-size: 10px; }
.quiet { align-content: center; row-gap: 64px; padding: 110px 10%; }
.privacy-line { margin-top: 0; }
.download-intro h2 { text-align: center; }
.download-intro h2 span { display: block; }
@media (max-width: 1000px) and (min-width: 701px) {
  .flow, .quiet { padding-left: 8%; padding-right: 8%; }
  .section-grid { gap: 3%; }
  .section-copy h2, .quiet-copy h2 { font-size: 48px; }
}
@media (max-width: 700px) {
  .flow { padding: 90px 8% 76px; }
  .section-grid { gap: 28px; }
  .section-copy { width: 100%; text-align: center; }
  .section-copy .body-copy { font-size: 14px; }
  .flow-tabs { justify-content: center; }
  .route-caption { text-align: center; }
  .route-stage { width: 100%; max-width: 420px; aspect-ratio: 1.16; margin: 12px auto 0; }
  .route-mac { top: 37%; }
  .route-headphones { bottom: 5%; }
  .route-stage .device-name { margin-top: 8px; font-size: 10px; }
  .route-stage .device-state { font-size: 8px; margin-top: 3px; }
  .feature-strip { margin-top: 34px; }
  .quiet { padding: 90px 8% 76px; gap: 32px; justify-content: center; }
  .quiet-copy { text-align: center; }
  .quiet-visual { margin-top: 0; min-height: 290px; }
  .privacy-line { margin-top: 0; }
}
.release-note { margin: 14px auto 0; color: var(--muted); font-size: 12px; line-height: 1.7; }