/* ==========================================================================
   Z Pack Service — Neon theme · Responsive
   ========================================================================== */

@media (max-width: 1280px) {
  .fc-a, .fc-b { top: -360px; }
}

@media (max-width: 1100px) {
  .float-chip { display: none; }
  .bento { grid-template-columns: repeat(2, 1fr); }
  .span-4, .span-3, .span-2 { grid-column: span 1; }
  .span-4.wide-md { grid-column: span 2; }
  .row-2 { grid-row: span 1; }
  .tool-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 991px) {
  section { padding: 88px 0; }
  .nav-shell { top: 10px; }
  .n-navbar { border-radius: 24px; padding: 10px 10px 10px 18px; }
  .n-navbar .navbar-collapse { padding: 14px 4px 6px; }
  .n-navbar .nav-link { padding: 12px 14px !important; }
  .n-navbar .nav-cta { margin-top: 10px; }
  .n-navbar .nav-cta .btn-n { width: 100%; }

  .hero-n { padding: 150px 0 72px; }
  .showreel { aspect-ratio: 16 / 9; margin-top: 56px; }
  .method { grid-template-columns: repeat(2, 1fr); row-gap: 40px; }
  .sticky-col { position: static; margin-bottom: 40px; }
  .page-hero-n { padding: 150px 0 64px; }
  .about-img { margin-top: 40px; }
  .about-img img { height: 380px; }
  .case-panel .cp-img { min-height: 280px; }
  .case-panel .cp-body { padding: 36px; }
  .stat-n { margin-bottom: 24px; }
  .svc-row .s-img { margin-top: 28px; }
  .legal-n .l-toc { position: static; margin-bottom: 32px; }
  .contact-side { margin-top: 48px; }
}

@media (max-width: 767px) {
  section { padding: 72px 0; }
  .container { padding-left: 16px; padding-right: 16px; }
  .lead { font-size: 1.05rem; }
  .head-row { margin-bottom: 40px; }
  .bento { grid-template-columns: 1fr; }
  .span-4.wide-md { grid-column: span 1; }
  .tile { min-height: 220px; }
  .marquee-item { font-size: 1.4rem; gap: 20px; padding-right: 20px; }
  .showreel .sr-badge { width: 76px; height: 76px; font-size: 1.4rem; right: 16px; bottom: 16px; }
  .showreel .sr-label { left: 18px; bottom: 18px; right: 100px; }
  .showreel .sr-label strong { font-size: 1.1rem; }
  .why-list li { grid-template-columns: 44px 1fr; gap: 12px; }
  .check-n { grid-template-columns: 1fr; }
  .tool-grid { grid-template-columns: repeat(2, 1fr); }
  .cp-steps li { grid-template-columns: 1fr; gap: 4px; }
  .case-panel .cp-body { padding: 28px 20px; }
  .form-n { padding: 28px 20px; }
  .faq-n .accordion-button { font-size: 1.05rem; }
  .faq-n .accordion-body { padding-right: 0; }
  .big-cta { padding: 96px 0; }
  .footer-n .f-col { margin-bottom: 32px; }
  .f-bottom { flex-direction: column; text-align: center; }
}

@media (max-width: 576px) {
  .btn-n { width: 100%; }
  .hero-n .actions, .big-cta .actions { flex-direction: column; }
  .method { grid-template-columns: 1fr; }
  .m-step .m-num { font-size: 3.4rem; }
  .filter-row { flex-wrap: nowrap; overflow-x: auto; margin-left: -16px; margin-right: -16px; padding: 0 16px 6px; scrollbar-width: none; }
  .filter-row::-webkit-scrollbar { display: none; }
  .f-bottom nav { flex-direction: column; gap: 8px; }
  .hero-proof { flex-direction: column; gap: 8px; }
}