/* ==========================================================================
   BEGRIDS — RESPONSIVE RULES
   Desktop-first. Breakpoints tested at 1920 / 1440 / 1280 / 1024 / 768 /
   425 / 375 / 320. Layouts are re-composed (not just shrunk) at each step.
   ========================================================================== */

/* ---------- Large screens (1600px+) ---------- */
@media (min-width: 1600px) {
  :root { --container: 1360px; }
  .hero-visual { min-height: 520px; }
}

/* ---------- ≤1280px: tighten header ---------- */
@media (max-width: 1280px) {
  .nav-link { padding: 0.55rem 0.55rem; font-size: 0.86rem; }
  .header-cta .btn { padding-inline: 1rem; }
  .mega-inner { gap: 1.1rem; }
  .footer-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 2rem 1.2rem; }
  .footer-brand { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; align-items: start; }
}

/* ---------- ≤1199px: hamburger navigation ---------- */
@media (max-width: 1199px) {
  .primary-nav, .header-cta { display: none; }
  .nav-toggle { display: inline-flex; }
  .stats-card { grid-template-columns: repeat(5, 1fr); }
  .stats-intro { grid-column: 1 / -1; text-align: center; }
  .footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .footer-brand { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; align-items: start; }
  .footer-brand p { max-width: none; }
  .process-compact { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .why-layout { grid-template-columns: 1fr; }
  .why-layout .section-head { position: static; margin-bottom: 0.5rem; }
}

/* ---------- ≤1024px: tablets landscape ---------- */
@media (max-width: 1024px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-copy { max-width: 680px; }
  .hero-visual { min-height: 440px; max-width: 640px; width: 100%; margin: 0 auto; }
  .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stack-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .split, .feature-row { grid-template-columns: 1fr; }
  .split.reverse > :first-child, .feature-row.reverse .feature-media { order: 0; }
  .feature-media { max-width: 640px; }
  .process { grid-template-columns: 1fr; }
  .process-compact.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pricing-card { grid-template-columns: 1fr; }
  .carousel-slide { flex-basis: 50%; }
  .cta-band { grid-template-columns: 1fr; }
  .cta-actions { justify-content: flex-start; }
  .blog-layout { grid-template-columns: 1fr; }
  .sidebar { position: static; grid-template-columns: repeat(2, 1fr); }
  .page-hero-grid { grid-template-columns: 1fr; }
  .page-hero-media { max-width: 560px; }
  .post-featured { grid-template-columns: 1fr; }
  .post-featured .post-cover { aspect-ratio: 16 / 9; }
  .media-frame .float-note { left: 12px; }
}

/* ---------- ≤900px ---------- */
@media (max-width: 900px) {
  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stats-card { grid-template-columns: repeat(6, 1fr); }
  .stat { grid-column: span 2; }
  .stat:nth-last-child(-n+2) { grid-column: span 3; }
  .process-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- ≤768px: tablets portrait / large phones ---------- */
@media (max-width: 768px) {
  :root { --header-h: 68px; }
  .brand-name { font-size: 1.18rem; }
  .brand-mark { width: 30px; height: 30px; }

  /* Floating desktop buttons give way to the bottom bar */
  .fab-contact { display: none; }
  .mobile-cta-bar { display: grid; }
  body { padding-bottom: calc(60px + env(safe-area-inset-bottom, 0px)); }
  .back-to-top { bottom: calc(74px + env(safe-area-inset-bottom, 0px)); right: 14px; width: 44px; height: 44px; }

  .hero { padding-top: 2.8rem; }
  .hero-visual { min-height: 400px; }
  .hv-editor { width: 86%; left: 0; }
  .hv-chart { width: 54%; top: 42%; }
  .hv-chat { width: 62%; }
  .hv-phone { right: 2%; width: 27%; }

  .form-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-brand { grid-template-columns: 1fr; }
  .footer-cta-inner { flex-direction: column; align-items: flex-start; }
  .modal-grid { grid-template-columns: 1fr; }
  .check-list.cols-2 { grid-template-columns: 1fr; }
  .sidebar { grid-template-columns: 1fr; }
  .dropdown.dropdown-wide { min-width: 0; }
}

/* ---------- ≤640px ---------- */
@media (max-width: 640px) {
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .industries-grid.grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stack-grid { grid-template-columns: 1fr; }
  .carousel-slide { flex-basis: 100%; }
  .stats-card { grid-template-columns: repeat(2, 1fr); }
  .stat, .stat:nth-last-child(-n+2) { grid-column: span 1; }
  .stat:last-child { grid-column: 1 / -1; }
  .hero-actions .btn, .page-hero .hero-actions .btn { flex: 1 1 100%; }
  .cta-actions .btn { flex: 1 1 calc(50% - 0.35rem); }
  .cta-actions .btn:first-child { flex-basis: 100%; }
  .filters { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 0.4rem; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); scrollbar-width: none; }
  .filters::-webkit-scrollbar { display: none; }
  .filter-btn { flex-shrink: 0; }
  .process-compact.cols-4 { grid-template-columns: 1fr; }
}

/* ---------- ≤640px: simplify the hero composition ---------- */
@media (max-width: 640px) {
  .hero-visual { min-height: 360px; }
  .hv-editor { width: 100%; left: 0; top: 0; }
  .hv-chart { right: 0; left: auto; top: 44%; width: 64%; }
  .hv-chat, .hv-phone { display: none; }
  .hv-toast { display: flex; left: 0; right: auto; bottom: 0; }
}

/* ---------- ≤425px: phones ---------- */
@media (max-width: 425px) {
  .hero-visual { min-height: 350px; }
  .hv-card { font-size: 0.72rem; }
  .hv-code { font-size: 0.66rem; line-height: 1.75; padding: 0.7rem; }
  .hv-chart { width: 70%; padding: 0.75rem; }
  .hv-kpi { font-size: 1.1rem; }
  .hv-bars { height: 44px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 1.8rem 1rem; }
  .testimonial { padding: 1.3rem; }
  .media-frame .float-note { position: static; margin-top: 1rem; }
  .industries-grid.grid-4 { grid-template-columns: 1fr; }
}

/* ---------- ≤360px: small phones ---------- */
@media (max-width: 360px) {
  :root { --gutter: 0.9rem; }
  .brand-name { font-size: 1.05rem; }
  .btn { padding-inline: 1.1rem; }
  .hero-visual { min-height: 330px; }
  .footer-grid { grid-template-columns: 1fr; }
  .stats-card { grid-template-columns: 1fr; }
  .stat, .stat:nth-last-child(-n+2), .stat:last-child { grid-column: auto; }
  .mobile-cta-bar a { font-size: 0.72rem; }
}

/* ---------- Print ---------- */
@media print {
  .site-header, .mobile-nav, .fab-contact, .mobile-cta-bar, .back-to-top, .site-footer, .cta-band { display: none !important; }
  body { padding: 0; color: #000; }
  .hero, .page-hero { background: none; color: #000; }
  .hero h1, .page-hero h1 { color: #000; }
}