/* ==========================================================================
   Get reVAmp HQ — Responsive Rules
   Breakpoints: 1080px (laptop) / 900px (tablet) / 640px (mobile) / 400px (small)
   ========================================================================== */

/* ---- Laptop ---- */
@media (max-width: 1080px) {
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .pricing-grid { grid-template-columns: repeat(2, 1fr); }
  .process { grid-template-columns: repeat(3, 1fr); }

  .hero__inner { grid-template-columns: 1fr; gap: var(--sp-7); }
  .hero__visual { min-height: 380px; max-width: 560px; }
}

/* ---- Tablet ---- */
@media (max-width: 900px) {
  :root { --nav-height: 68px; }

  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .portfolio-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }

  /* Mobile navigation drawer */
  .nav-toggle { display: flex; }
  .nav__links {
    position: fixed;
    top: var(--nav-height);
    left: 0; right: 0;
    z-index: 1450;
    flex-direction: column;
    align-items: stretch;
    gap: var(--sp-1);
    padding: var(--sp-4) var(--sp-5) var(--sp-6);
    background: var(--bg-elevated);
    border-bottom: 1px solid var(--border);
    box-shadow: var(--shadow-lg);
    transform: translateY(-12px);
    opacity: 0;
    visibility: hidden;
    transition: transform var(--speed) var(--ease), opacity var(--speed), visibility var(--speed);
  }
  .nav__links.is-open { transform: none; opacity: 1; visibility: visible; }
  .nav__links a { padding: var(--sp-3) var(--sp-4); font-size: var(--fs-base); }
  .nav__cta-desktop { display: none; }
}

/* ---- Mobile ---- */
@media (max-width: 640px) {
  .grid-2, .grid-3, .grid-4,
  .portfolio-grid,
  .pricing-grid,
  .form-grid { grid-template-columns: 1fr; }

  .process { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: var(--sp-6); }

  .hero { min-height: auto; }
  .hero__stats { gap: var(--sp-5); }
  .hero__visual { min-height: 420px; }
  .float-card--main { position: relative; inset: auto; width: 100%; margin-bottom: var(--sp-4); }
  .float-card--a { position: relative; top: auto; left: auto; margin-bottom: var(--sp-4); }
  .float-card--b { position: relative; bottom: auto; right: auto; }

  .cta-band { border-radius: var(--radius-lg); }
  .testimonial { padding: var(--sp-5); }
  .testimonial__quote { font-size: var(--fs-md); }
  .slider__arrows { display: none; }

  .newsletter-form { flex-direction: column; }
  .newsletter-form .btn { width: 100%; }

  .back-to-top, .whatsapp-fab { width: 46px; height: 46px; right: var(--sp-4); }

  .cookie-banner { flex-direction: column; align-items: stretch; text-align: center; }
  .cookie-banner__actions { justify-content: center; }
}

/* ---- Small Mobile ---- */
@media (max-width: 400px) {
  .process { grid-template-columns: 1fr; }
  .hero__ctas .btn { width: 100%; }
  .stat__value { font-size: 1.6rem; }
  .container { width: calc(100% - 1.75rem); }
}

/* ---- Print: strip chrome ---- */
@media print {
  .site-header, .site-footer, .whatsapp-fab, .back-to-top,
  .cookie-banner, .progress-bar, .loader { display: none !important; }
  body { background: #fff; color: #000; }
}