/* =========================================================
   FLEXIBLE BUSINESS SYSTEMS, INC. — Responsive Rules
   ========================================================= */

/* Tablet / small laptop */
@media (max-width: 1024px) {
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .grid--3 { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .header-phone { display: none !important; }
}

/* Navigation collapses to mobile menu */
@media (max-width: 900px) {
  .nav-toggle { display: inline-flex; }
  .primary-nav {
    position: fixed;
    inset: 0 0 0 auto;
    top: 66px;
    width: min(340px, 86vw);
    height: calc(100vh - 66px);
    background: var(--c-navy-950);
    border-left: var(--border-w) solid var(--surface-line-dark);
    transform: translateX(100%);
    transition: transform var(--dur-med) var(--ease-out);
    overflow-y: auto;
    padding: var(--sp-6) var(--sp-5);
  }
  .primary-nav.is-open { transform: translateX(0); }
  .primary-nav ul { flex-direction: column; align-items: flex-start; gap: var(--sp-1); width: 100%; }
  .primary-nav > ul > li { width: 100%; border-bottom: var(--border-w) solid var(--surface-line-dark); }
  .primary-nav a { display: block; padding: var(--sp-4) var(--sp-2); font-size: 0.95rem; }
  .submenu {
    position: static;
    opacity: 1; visibility: visible; transform: none;
    display: none;
    border: 0;
    background: rgba(255,255,255,0.03);
    margin-bottom: var(--sp-2);
  }
  .has-submenu.is-open .submenu { display: grid; }
  .has-submenu > a { display: flex; justify-content: space-between; align-items: center; }
  .header-cta .btn--primary { display: none; }
}

@media (min-width: 901px) {
  .header-phone { display: block; }
}

/* Tablet stacking */
@media (max-width: 780px) {
  .grid--2 { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--sp-6); }
  .hero-inner { padding-block: var(--sp-8) var(--sp-7); }
  .section { padding-block: var(--sp-8); }
}

/* Mobile */
@media (max-width: 640px) {
  .grid--3, .grid--4 { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: var(--sp-6); }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
  .hero-meta { gap: var(--sp-5); }
  .flow-list { flex-direction: column; align-items: stretch; }
  .flow-list li { flex-direction: column; align-items: stretch; }
  .flow-arrow { transform: rotate(90deg); align-self: center; }
  .flow-node { text-align: center; }
  h1 { max-width: none !important; }
}