/* Techno Tulip — responsive adjustments */

@media (max-width: 1199.98px) {
  .tt-nav .navbar-collapse {
    background: rgba(8, 11, 34, .98); border: 1px solid var(--tt-line-dark); border-radius: var(--tt-radius);
    margin-top: .8rem; padding: 1rem; max-height: calc(100vh - var(--tt-nav-h) - 24px); overflow-y: auto;
  }
  .mega-menu { box-shadow: none; padding: .6rem; margin-top: .3rem !important; background: rgba(255, 255, 255, .03); }
  .mega-col + .mega-col { margin-top: 1rem; }
  .tt-nav .nav-cta { margin-top: .8rem; width: 100%; }
  .process-track { grid-template-columns: repeat(4, 1fr); row-gap: 2rem; }
  .process-track::before { display: none; }
}

@media (max-width: 991.98px) {
  .hero { text-align: left; }
  .network-visual { max-width: 460px; margin-top: 2.5rem; }
  .service-visual-wrap { max-width: 340px; margin-top: 2.5rem; }
  .value-strip { margin-top: -2.5rem; }
  .faq-nav, .article-aside { position: static; }
  .case-study .cs-media { min-height: 220px; }
}

@media (max-width: 767.98px) {
  body { font-size: 1rem; }
  /* Large gutters exceed the container padding on phones; keep rows inside the viewport */
  .row.g-5, .row.g-4 { --bs-gutter-x: 1.5rem; }
  .process-track { grid-template-columns: repeat(2, 1fr); }
  .psb-row { grid-template-columns: 1fr; gap: .3rem; }
  .psb-row b { justify-self: start; }
  .compare-table { overflow-x: auto; }
  .compare-table table { min-width: 640px; }
  .footer-bottom { flex-direction: column; }
  .hero-actions .btn { flex: 1 1 auto; }
  /* Keep the WhatsApp button clear of content and form controls */
  .wa-float { width: 52px; height: 52px; font-size: 1.55rem; right: 14px; bottom: 14px; }
  body { padding-bottom: 76px; }
  .wa-float .wa-tip { display: none; }
}

@media (max-width: 575.98px) {
  .value-item { flex-direction: column; gap: .4rem; padding: .5rem .2rem; }
  .value-strip .inner { padding: 1rem; }
}

@media (max-width: 420px) {
  .process-track { grid-template-columns: 1fr; }
  .btn-lg { padding: .9rem 1.4rem; font-size: 1rem; }
  .tt-nav .navbar-brand small { display: none; }
}
