/* ========== RESPONSIVE ========== */
@media (max-width: 980px) {
  /* Compact mobile header: logo + burger only.
     Phone & CTA live inside the full-screen mobile menu. */
  .nav { display: none; }
  .hdr-row {
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .hdr-right { gap: 12px; justify-self: end; }
  .hdr-phone { display: none; }
  .hdr-cta { display: none; }
  .hdr-burger { display: block; }
  .hdr-mobile-menu { display: flex; }
  .logo { font-size: 17px; }
  .hero-row { grid-template-columns: 1fr; gap: 28px; align-items: start; }
  .hero-meta { grid-template-columns: 1fr 1fr; gap: 24px 16px; }
  .hero-meta > div:nth-child(2) { border-right: 0; }
  .hero-meta > div:nth-child(1), .hero-meta > div:nth-child(2) {
    border-bottom: 1px solid var(--line); padding-bottom: 18px;
  }
  .hero-meta > div:nth-child(3), .hero-meta > div:nth-child(4) {
    padding-top: 18px;
  }
  .adv-grid { grid-template-columns: 1fr 1fr; }
  .calc-card { grid-template-columns: 1fr; }
  .calc-inputs { border-right: 0; border-bottom: 1px solid var(--line); }
  .steps { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .stat:nth-child(2) { border-right: 0; }
  .stat:nth-child(1), .stat:nth-child(2) { border-bottom: 1px solid var(--line); padding-bottom: 28px; }
  .stat:nth-child(3), .stat:nth-child(4) { padding-top: 28px; }
  .tr-head, .tr-rows li {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 14px 18px;
  }
  .tr-unit, .tr-status { grid-column: 1 / -1; padding-top: 6px; }
  .cinema { height: 450vh; height: 450dvh; }
  .cinema-chips { grid-template-columns: repeat(2, 1fr); }
  .cinema-chip:nth-child(2) { border-right: 0; }
  .cinema-chip:nth-child(1),
  .cinema-chip:nth-child(2) { border-bottom: 1px solid var(--line); }
  .block-1 { height: 320vh; height: 320dvh; }
  .geo-grid { grid-template-columns: 1fr 1fr; }
  .about-grid { grid-template-columns: 1fr; gap: 40px; }
  .about-docs { border-left: 0; border-top: 1px solid var(--line); padding-left: 0; padding-top: 32px; position: static; }
  .cta-channels { grid-template-columns: 1fr; }
  .ft-row { grid-template-columns: 1fr; gap: 18px; text-align: center; }
  .ft-nav { justify-content: center; flex-wrap: wrap; }
  .ft-copy { text-align: center; }
}
@media (max-width: 640px) {
  .wrap { padding-left: 20px; padding-right: 20px; }
  /* Even tighter on phones — no decoration on logo */
  .hdr-row { padding-top: 8px; padding-bottom: 8px; gap: 10px; }
  .hdr-right { gap: 10px; }
  .hdr-burger { width: 38px; height: 38px; }
  .hero { padding-top: 90px; }
  .hero-meta-wrap { padding-bottom: 60px; }
  .adv, .calc, .how, .geo, .faq, .transit, .transport, .about, .cta { padding: 70px 0; }
  .stats { padding: 60px 0; }
  .adv-grid { grid-template-columns: 1fr; }
  .geo-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .geo .card { padding: 20px 18px; }
  .geo .card h3 { font-size: 18px; }
  .geo .card p { font-size: 13px; }
  .stats-grid { grid-template-columns: 1fr; }
  .stat { border-right: 0; border-bottom: 1px solid var(--line); padding: 22px 16px; }
  .stat:last-child { border-bottom: 0; }
  .calc-inputs, .calc-result { padding: 26px 22px; }
  .cr-total {
    display: block;
  }
  .cr-total-l { margin-bottom: 8px; }
  .cr-total-v { white-space: nowrap; }
  .cr-vat {
    display: block;
  }
  .cr-vat span { display: block; margin-bottom: 6px; }
  .cr-vat b { white-space: nowrap; }
  .card { padding: 26px; }
  .qa summary { padding: 20px 22px; font-size: 15px; }
  .qa p { padding: 0 22px 20px; }
  .meta-num { font-size: 26px; }
  .ch { padding: 20px 22px; }
  .block-1 { height: 280vh; height: 280dvh; }
  .block-1-hint { font-size: 11px; bottom: clamp(20px, 4vh, 40px); }
  .cinema { height: 380vh; height: 380dvh; }
  .cinema-chips { grid-template-columns: 1fr; }
  .cinema-chip {
    padding: 22px 4px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .cinema-chip:last-child { border-bottom: 0; }
  .cinema-chip b { font-size: 15px; }
  .cinema-chip span { font-size: 13px; }
}

/* ========== Pin-zone overrides for desktop & iOS (-30%) ==========
   Android keeps default media-query heights (uses autoplay-once, not scrub).
   Same frame count, denser playback per scroll unit. */
html[data-device="desktop"] .block-1 { height: 350vh; height: 350dvh; }
html[data-device="desktop"] .cinema  { height: 490vh; height: 490dvh; }

html[data-device="ios"] .block-1 { height: 350vh; height: 350dvh; }
html[data-device="ios"] .cinema  { height: 490vh; height: 490dvh; }
@media (max-width: 980px) {
  html[data-device="ios"] .block-1 { height: 225vh; height: 225dvh; }
  html[data-device="ios"] .cinema  { height: 315vh; height: 315dvh; }
}
@media (max-width: 640px) {
  html[data-device="ios"] .block-1 { height: 195vh; height: 195dvh; }
  html[data-device="ios"] .cinema  { height: 265vh; height: 265dvh; }
}


/* ========== Единый вертикальный ритм секций (16.05) ==========
   Десктоп: все контентные секции 110px (заданы в секционных CSS).
   Мобайл: единые 72px для всех — убираем разнобой 70/90/100/110. */
@media (max-width: 768px) {
  .avail, .brands, .adv, .calc, .how, .stats, .logi,
  .transit, .stories, .gallery, .geo, .about, .faq, .cta {
    padding-top: 72px;
    padding-bottom: 72px;
  }
  .brands { padding-bottom: 0; }   /* бегущая лента вплотную к следующей секции */
  .hero { padding-top: 92px; }
}