/* v6.css — layout + responsive rules for the v6 landing recomposition.
 * Loaded only by index.html (the v6 home). Plain CSS off the existing token
 * system; pairs with the inline styles in v6-sections.jsx. */

/* Platform logo wall floats just under the hero (no extra top gap). */
.v5-platform-wall { margin-top: 0; padding-bottom: 80px; }

/* ── Promo banner — stays one line on mobile ── */
@media (max-width: 720px) {
  .ld-promo-row {
    padding: 10px 12px !important; min-height: 0 !important;
    gap: 10px !important; font-size: 12.5px !important;
    flex-wrap: nowrap !important; white-space: nowrap !important;
  }
  .ld-promo-row > span:first-child {
    padding: 3px 8px !important; font-size: 9.5px !important; letter-spacing: 0.06em !important;
  }
  .ld-promo-copy { white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 420px) {
  .ld-promo-row { gap: 8px !important; font-size: 11.5px !important; }
  .ld-promo-row > span:last-child svg { width: 10px; height: 10px; }
}

/* ── v6 responsive grids ── */
@media (max-width: 1000px) {
  .v6-hero-grid { grid-template-columns: 1fr !important; gap: 48px !important; }
  .v6-moments-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 980px) {
  .v6-whofor-grid { grid-template-columns: 1fr !important; }
}
@media (max-width: 640px) {
  .v6-moments-grid { grid-template-columns: 1fr !important; }
}

/* ── Hero mobile fixes (≤720px): hide the secondary phone, and drop the
   "Suggested pitch" chip into static flow BELOW the device image ── */
@media (max-width: 720px) {
  .v6-hero-grid .v2-hero-phone { display: none !important; }
  .v6-hero-grid .v2-hero-chip {
    position: static !important;
    right: auto !important; top: auto !important;
    transform: none !important;
    margin: 18px auto 0 !important;
    max-width: 420px; width: 100%;
  }
}

/* Platform row → 3 columns on mobile. */
@media (max-width: 720px) {
  .v5-platform-row { grid-template-columns: repeat(3, 1fr) !important; row-gap: 36px !important; }
}