/* Responsive rules */

/* =============================================
   TABLET — ≤1024px
   ============================================= */
@media (max-width: 1024px) {
  :root { --gap: 72px; }
  .why-row { grid-template-columns: 1fr; gap: 40px; }
  .proc { grid-template-columns: 1fr 1fr; gap: 32px; }
  .proc::before { display: none; }
  .wg { grid-template-columns: 1fr 1fr; }
  .ft { grid-template-columns: 1fr 1fr; gap: 28px; }
  .svcf-in { grid-template-columns: 1fr; gap: 40px; }
  .svcf.alt .svcf-in { direction: ltr; }
  .about-row { grid-template-columns: 1fr; gap: 40px; }
  .cgrid { grid-template-columns: 1fr; gap: 44px; }
  .wfg { grid-template-columns: 1fr 1fr; }
  .pricing-grid { grid-template-columns: 1fr; }
  .pkg { border-right: none; border-bottom: 1px solid var(--b); }
  .pkg:last-child { border-bottom: none; }
  .addons-grid { grid-template-columns: 1fr 1fr; }
  .maint-grid { grid-template-columns: 1fr; }
  .maint-item { border-right: none; border-bottom: 1px solid var(--b); }
  .maint-item:last-child { border-bottom: none; }
}

/* =============================================
   MOBILE — ≤768px
   ============================================= */
@media (max-width: 768px) {

  /* --- NAV --- */
  .nav-links,
  .nav-right { display: none; }
  .hbg { display: flex; }

  /* --- LOGO --- */
  .brand-icon { width: 36px; height: 36px; }
  .brand-wordmark { font-size: 1rem; }
  .logo-full-img { width: 136px; }

  /* --- HERO --- */
  .hero-in { padding: 60px 0 48px; }
  .hero-h { font-size: clamp(2rem, 8vw, 2.8rem); }
  .hero-sub { font-size: .95rem; }
  .hero-ctas { flex-direction: column; gap: 10px; }
  .hero-ctas .btn { width: 100%; text-align: center; }

  /* --- STATS BAR --- */
  .stats-bar { gap: 20px; border-top: none; padding-top: 20px; margin-top: 32px; }
  .stat-item { border-right: none; padding-right: 0; margin-right: 0; flex-direction: row; align-items: center; gap: 10px; }
  .stat-val { font-size: 1.3rem; }

  /* --- GENERIC GRIDS --- */
  .g2,
  .g3,
  .g4 { grid-template-columns: 1fr; }

  /* --- LAYOUT GRIDS --- */
  .proc { grid-template-columns: 1fr; gap: 24px; }
  .wg { grid-template-columns: 1fr; }
  .wfg { grid-template-columns: 1fr; }
  .addons-grid { grid-template-columns: 1fr; }

  /* --- FOOTER --- */
  .ft { grid-template-columns: 1fr; gap: 32px; }
  .fbot { flex-direction: column; align-items: flex-start; gap: 8px; }

  /* --- INNER PAGE HERO --- */
  .pghero { padding: 100px 0 44px; }

  /* --- CONTACT PAGE --- */
  .cpg { padding: 100px 0 56px; }
  .frow { grid-template-columns: 1fr; }
  .fwrap { padding: 24px 18px; }

  /* --- WORK PAGE --- */
  .sample-project-thumb { height: 210px; }

  /* --- SERVICES PAGE --- */
  .service-image-embed { min-height: 220px; }
  .svis.service-img-wrap { min-height: 220px; }

  /* --- COOKIE BANNER --- */
  .cookie-banner { flex-direction: column; align-items: flex-start; }
  .cookie-actions { width: 100%; }
  .cookie-accept, .cookie-more { flex: 1; text-align: center; }
  .legal-cta { margin: 0 0 56px; }
}