/**
 * Mobile experience (edits §7) — spacing, diagrams, touch.
 * Typography stays on Tailwind classes in Twig + inst-editorial.css (no mobile overrides).
 */

@media (max-width: 1023px) {
  /* Inner pages — clearer stack */
  .inst-shell > div.mx-auto.max-w-7xl {
    padding-top: 2rem;
    padding-bottom: 2.5rem;
  }

  .inst-shell header > div.mx-auto {
    padding-top: 2rem;
    padding-bottom: 1rem;
  }

  .inst-content-body > * + * {
    margin-top: 1.5rem;
  }

  .inst-content-body section.rounded-2xl,
  .inst-content-body .inst-exec-summary {
    padding: 1.25rem;
  }

  /* Homepage sections */
  .inst-platform main > section {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  .inst-platform main > section.min-h-\[520px\] {
    min-height: auto;
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  /* What We Do tabs — full-width tap */
  .inst-platform [data-home-whatwedo-tabs] .wwd-tab {
    min-height: 3.25rem;
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
  }

  .inst-wwd-tab-icon {
    min-height: 3rem;
  }

  /* Diagrams — horizontal scroll, no squeeze */
  .inst-diagram-scroll,
  .inst-gov-diagram > div,
  .inst-content-body [class*="overflow-x-auto"],
  .inst-home-gov-panel [class*="overflow-x-auto"] {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-padding-inline: 0.5rem;
  }

  .inst-gov-diagram svg {
    min-width: 20rem;
  }

  .inst-diagram-scroll-hint {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--inst-color-muted, #6b7785);
  }

  /* Touch targets */
  .inst-shell details summary,
  #inst-mobile-menu nav a,
  #inst-mobile-menu .mobile-menu-close,
  .inst-platform .inst-utility-bar button,
  .inst-platform .inst-utility-bar a,
  .inst-nav-desktop__trigger {
    min-height: 2.75rem;
  }

  .inst-shell details summary {
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
  }

  #inst-mobile-menu nav a {
    display: flex;
    align-items: center;
    min-height: 2.75rem;
  }

  /* Engagement / pipeline cards — full width stack */
  .inst-platform .inst-engagement-card,
  .inst-platform .inst-pipeline-rail {
    width: 100%;
  }

  /* Utility bar — wrap cleanly */
  .inst-platform .inst-utility-bar {
    gap: 0.75rem 1rem;
  }

  .inst-platform .inst-utility-bar button {
    min-height: 2.75rem;
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
  }
}

@media (max-width: 639px) {
  .inst-content-body > * + * {
    margin-top: 1.25rem;
  }

  .inst-platform main > section {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  .inst-home-map-card {
    margin-top: 1rem;
  }
}

@media (min-width: 1024px) {
  .inst-diagram-scroll-hint {
    display: none;
  }
}