/* Mobile overrides for Quantum Mind site + pages.
   Inline styles are aggressive, so we override with !important inside media queries. */

/* ---- TABLET (≤ 900px) ---- */
@media (max-width: 900px) {
  .qm-grid {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
  /* Containers shrink their horizontal padding */
  nav > div,
  section > div,
  footer > div {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

/* ---- PHONE (≤ 720px) ---- */
@media (max-width: 720px) {
  html, body { -webkit-text-size-adjust: 100%; overflow-x: hidden; }

  /* Everything with display: grid stacks */
  [style*="display: grid"],
  [style*="display:grid"],
  .qm-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  /* Nav: hide the link row, keep brand + CTA */
  nav[style*="position: sticky"] > div,
  nav[style*="position:sticky"] > div {
    padding: 12px 18px !important;
  }
  nav .qm-nav-links {
    display: none !important;
  }
  nav .qm-nav-cta {
    padding: 10px 16px !important;
    font-size: 13px !important;
  }

  /* Section padding */
  section {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
  section > div {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* Cap large headlines */
  h1, h2, h3 {
    letter-spacing: -0.02em !important;
  }
  [style*="fontSize: 68"],
  [style*="fontSize: 64"],
  [style*="fontSize: 62"],
  [style*="fontSize: 60"],
  [style*="fontSize: 58"],
  [style*="fontSize: 56"],
  [style*="fontSize: 54"] {
    font-size: 38px !important;
    line-height: 1.08 !important;
    letter-spacing: -1.2px !important;
  }
  [style*="fontSize: 48"],
  [style*="fontSize: 46"],
  [style*="fontSize: 44"],
  [style*="fontSize: 42"],
  [style*="fontSize: 40"],
  [style*="fontSize: 38"] {
    font-size: 30px !important;
    line-height: 1.15 !important;
  }
  [style*="fontSize: 36"],
  [style*="fontSize: 34"],
  [style*="fontSize: 32"] {
    font-size: 24px !important;
    line-height: 1.2 !important;
  }
  [style*="fontSize: 28"],
  [style*="fontSize: 26"] {
    font-size: 20px !important;
  }

  /* Phone mockup scaling — prevent overflow */
  [style*="width: 320"],
  [style*="width: 340"],
  [style*="width: 360"] {
    max-width: 100% !important;
  }

  /* Buttons stack */
  [style*="display: flex"][style*="gap: 12"],
  [style*="display:flex"][style*="gap:12"] {
    flex-wrap: wrap !important;
  }

  /* Footer column collapse to single column */
  footer [style*="display: grid"] {
    grid-template-columns: 1fr 1fr !important;
    gap: 32px !important;
  }
  /* Footer brand block gets full width */
  footer [style*="gridTemplateColumns"] > div:first-child {
    grid-column: 1 / -1 !important;
  }
  /* Footer bottom row stacks */
  footer [style*="justifyContent: 'space-between'"] {
    flex-direction: column !important;
    gap: 10px !important;
    align-items: flex-start !important;
    text-align: left !important;
  }

  /* Pricing: hide the "most popular" bottom card on mobile stacking, not needed */
  /* (keep simple — let grid stack) */
}

/* ---- Very small (≤ 400px) ---- */
@media (max-width: 400px) {
  footer [style*="display: grid"] {
    grid-template-columns: 1fr !important;
  }
}