/* =====================================================
   Expertifies — Responsive / Media Queries
   Breakpoints: 1024 (tablet-l), 768 (tablet), 560 (mobile)
   ===================================================== */

/* ---------- <= 1024px ---------- */
@media (max-width: 1024px) {
  :root { --section-padding: 64px 0; }

  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px; }
  .process-grid { grid-template-columns: repeat(2, 1fr); row-gap: 36px; }
  .split { grid-template-columns: 1fr; gap: 36px; }
}

/* ---------- <= 900px : switch to mobile nav ---------- */
@media (max-width: 900px) {
  .nav-links, .nav-actions { display: none; }
  .hamburger { display: flex; }

  /* Pages keep nav background visible by default on mobile */
  .navbar { background: #fff; box-shadow: var(--shadow-sm); }
  .navbar .logo-text { color: var(--color-navy); }
  .navbar .hamburger span { background: var(--color-navy); }
}

/* ---------- <= 768px ---------- */
@media (max-width: 768px) {
  :root { --section-padding: 52px 0; }

  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .pricing-grid { grid-template-columns: 1fr; }
  .pricing-card.featured { transform: none; }
  .form-row { grid-template-columns: 1fr; }
  .checklist { grid-template-columns: 1fr; }

  .hero-buttons { flex-direction: column; align-items: stretch; }
  .hero-buttons .btn { width: 100%; }
  .trust-bar { gap: 12px 24px; }

  .cookie-inner { flex-direction: column; align-items: flex-start; }
  .cookie-actions { width: 100%; }
  .cookie-actions .btn { flex: 1; }

  .newsletter { padding: 32px 20px; }
  .newsletter-form { flex-direction: column; }

  h1 { font-size: clamp(1.9rem, 8vw, 2.4rem); }
  .section-subtitle { font-size: 1rem; }
}

/* ---------- <= 560px ---------- */
@media (max-width: 560px) {
  :root { --container-padding: 0 18px; }

  .footer-grid { grid-template-columns: 1fr; gap: 30px; }
  .process-grid { grid-template-columns: 1fr; }
  .card, .testimonial-card, .feature-box { padding: 24px; }

  .stat-number { font-size: 2.5rem; }
  .back-to-top { bottom: 16px; right: 16px; }

  .pagination a, .pagination span { min-width: 38px; height: 38px; }
}

/* ---------- print ---------- */
@media print {
  .navbar, .site-footer, .cta-banner, .cookie-banner, .back-to-top, .mobile-menu, .menu-overlay { display: none !important; }
}
