/* Quinbis responsive alignment final pass
   Purpose: keep every page in a consistent reading lane, remove narrow split layouts
   on phones, and preserve deliberate tablet compositions. */

/* Shared safety */
html,body{max-width:100%;overflow-x:hidden}
img,svg{max-width:100%}

/* Article/source links must never escape the reading lane. */
.qa-article a,
.insights-page a{overflow-wrap:anywhere}

/* Mobile and small-phone/tablet browser widths */
@media (max-width:640px){
  :root{--shell:min(500px,calc(100vw - 40px))!important}
  .shell{width:var(--shell)!important;margin-inline:auto!important}

  /* Header remains balanced and contained. */
  .nav-shell{
    width:calc(100% - 28px)!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
  }
  .brand{min-width:0!important}
  .nav-actions{margin-left:auto!important;flex:0 0 auto!important}

  /* Insights landing: one clear narrative, then a compact 2x2 topic group. */
  .insights-hero-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:24px!important;
    align-items:start!important;
    text-align:center!important;
  }
  .insights-hero-copy,
  .insights-hero-side{
    width:100%!important;
    max-width:500px!important;
    margin-inline:auto!important;
  }
  .insights-hero-side{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:18px!important;
    padding:0!important;
  }
  .insights-hero-side>p{
    width:100%!important;
    max-width:400px!important;
    margin:0 auto!important;
    text-align:center!important;
  }
  .insights-topic-rail{
    width:100%!important;
    max-width:440px!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    margin:0 auto!important;
    border:0!important;
    text-align:left!important;
  }
  .insights-topic-rail a{
    min-width:0!important;
    min-height:58px!important;
    padding:13px 14px!important;
    border:1px solid var(--palette-line)!important;
    border-radius:15px!important;
    background:var(--palette-lime-soft)!important;
    line-height:1.25!important;
  }

  /* Every Insights collection becomes a complete single-card reading sequence. */
  .featured-insight-card,
  .insight-wide-card,
  .growth-insight-card,
  .insight-card,
  .trust-card{
    width:100%!important;
    max-width:500px!important;
    margin-inline:auto!important;
  }
  .featured-insight-card,
  .growth-insight-card{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:24px!important;
  }
  .insight-grid,
  .insight-grid-money,
  .insight-pair,
  .trust-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
    width:100%!important;
    max-width:500px!important;
    margin-inline:auto!important;
  }
  .insight-cluster-head{
    display:block!important;
    max-width:500px!important;
    margin-inline:auto!important;
    text-align:center!important;
  }
  .insight-cluster-head>p{max-width:400px!important;margin-inline:auto!important}
  .growth-readiness{width:100%!important;max-width:none!important}

  /* The closing editorial strip must not behave like a desktop three-column footer. */
  .insights-close-line{
    width:100%!important;
    max-width:500px!important;
    min-height:0!important;
    margin-inline:auto!important;
    padding:24px 0!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    text-align:center!important;
  }
  .insights-close-line p{max-width:390px!important;margin-inline:auto!important}
  .insights-close-line a{justify-self:center!important}

  /* Insight articles: all prose, links, notes and diagrams share the same lane. */
  .qa-article .shell,
  .insight-article-page .shell{width:var(--shell)!important;margin-inline:auto!important}
  .qa-article .qa-hero-grid,
  .qa-article .qa-reading-grid,
  .qa-article .qa-two-col,
  .qa-article .qa-product-frame,
  .qa-article .qa-next-grid{
    width:100%!important;
    max-width:500px!important;
    margin-inline:auto!important;
    grid-template-columns:1fr!important;
  }
  .qa-article .qa-body,
  .qa-article .qa-section-head,
  .qa-article .qa-side-head,
  .qa-article .qa-caption,
  .qa-article .qa-disclaimer,
  .qa-article .qa-source-note{
    width:100%!important;
    max-width:500px!important;
    margin-inline:auto!important;
    box-sizing:border-box!important;
  }
  .qa-article .qa-source-note{padding-left:0!important;padding-right:0!important}
  .qa-article .qa-source-note p{width:100%!important}
  .qa-article .qa-source-note a{
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  /* Footer: avoid three tiny columns on phones. */
  .site-footer .footer-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:30px 28px!important;
    text-align:left!important;
  }
  .site-footer .footer-brand{grid-column:1/-1!important;max-width:320px!important}
  .site-footer .footer-col{align-items:flex-start!important;min-width:0!important}
  .site-footer .footer-col:last-child{grid-column:1/-1!important}
  .site-footer .footer-bottom{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:8px!important;
    text-align:left!important;
  }
}

/* Regular tablet widths: preserve usable information density without desktop leftovers. */
@media (min-width:641px) and (max-width:759px){
  .insights-hero-side{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:20px!important;
  }
  .insights-topic-rail{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:100%!important;
    max-width:620px!important;
    gap:10px!important;
  }
  .insight-grid,
  .insight-grid-money,
  .insight-pair,
  .trust-grid{grid-template-columns:1fr!important}
  .growth-insight-card{grid-template-columns:1fr!important}
  .insights-close-line{grid-template-columns:1fr!important;text-align:center!important}
}

/* Tablet: three package choices stay visible in one row, as approved. */
@media (min-width:760px) and (max-width:1180px){
  .package-grid,
  .design-package-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    max-width:none!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
  }
  .setup-package-card,
  .design-package-card{min-width:0!important;max-width:none!important;width:100%!important}

  /* Keep the header weight balanced. */
  .nav-shell{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
  }
  .nav-actions{margin-left:auto!important}
}