/* ==========================================================================
   NexovianTec — responsive.css
   Breakpoints: Desktop (default) > 1200px | Laptop 1024px | Tablet 768px | Mobile 480px
   ========================================================================== */

/* ---------- Laptop / small desktop ---------- */
@media (max-width: 1200px) {
  .container { padding: 0 24px; }
  .modal-prev { left: 16px; }
  .modal-next { right: 16px; }
}

/* ---------- Tablet ---------- */
@media (max-width: 1024px) {
  .main-nav { display: none; }

  .hero-inner { grid-template-columns: 1fr; text-align: left; }
  .hero-content { align-items: flex-start; }
  .hero-visual { order: -1; max-width: 480px; margin: 0 auto; }
  .hero-title { min-height: unset; }

  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-item:nth-child(2) { border-right: none; }
  .stat-item:nth-child(1), .stat-item:nth-child(2) { border-bottom: 1px solid rgba(255,255,255,0.06); }

  .about-inner { grid-template-columns: 1fr; }
  .about-visual { order: -1; max-height: 420px; }
  .about-image { height: 420px; }

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

  .modal-body { grid-template-columns: 1fr; }
  .modal-image { max-height: 320px; }

  .review-card { min-width: calc(50% - 12px); }
  .menu-slide { min-width: 100%; }

  .contact-inner { grid-template-columns: 1fr; }
  .contact-form-wrap { order: -1; }

  .footer-grid { grid-template-columns: 1fr 1fr; }

  .hamburger { display: flex; }
  .header-actions .lang-toggle { display: none; }
}

/* ---------- Tablet portrait / large mobile ---------- */
@media (max-width: 768px) {
  .container { padding: 0 20px; }

  .header-inner { position: relative; }

  .hero { padding-top: 130px; }
  .hero-title { font-size: clamp(2rem, 7vw, 2.6rem); }
  .hero-cta-group { flex-direction: column; align-items: flex-start; gap: 14px; }
  .hero-cta-group .btn { width: 100%; text-align: center; }

  .stats-grid { grid-template-columns: 1fr 1fr; }

  .about { padding: 100px 0 90px; }
  .services { padding: 90px 0; }
  .menu-showcase { padding: 90px 0; }
  .portfolio { padding: 100px 0 90px; }
  .reviews { padding: 90px 0; }
  .contact { padding: 100px 0 90px; }
  .cta-section { padding: 110px 0; }

  .services-grid { grid-template-columns: 1fr; }
  .portfolio-grid { grid-template-columns: 1fr; }

  .portfolio-tabs { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 8px; }
  .portfolio-tabs::-webkit-scrollbar { height: 4px; }

  .form-row { grid-template-columns: 1fr; }
  .contact-form-wrap { padding: 30px; }

  .footer-grid { grid-template-columns: 1fr; gap: 40px; padding-bottom: 50px; }
  .footer-bottom-inner { flex-direction: column; gap: 8px; text-align: center; }

  .marquee-track span { font-size: clamp(2.4rem, 14vw, 5rem); }

  .cta-title { font-size: clamp(1.8rem, 8vw, 2.4rem); }
}

/* ---------- Mobile ---------- */
@media (max-width: 480px) {
  .logo img { height: 34px; }

  .hero-desc { font-size: 0.98rem; }
  .eyebrow { font-size: 11.5px; }

  .stats-grid { grid-template-columns: 1fr 1fr; }
  .stat-item { padding: 36px 12px; }
  .stat-number { font-size: 1.8rem; }

  .section-title { font-size: clamp(1.7rem, 8vw, 2.1rem); }

  .service-card { padding: 30px 24px; }

  .review-card { padding: 32px 24px; min-width: 100%; }
  .review-text { font-size: 1rem; }

  .contact-form-wrap { padding: 24px; }

  .back-to-top { width: 44px; height: 44px; bottom: 20px; right: 20px; }

  .modal-nav { width: 38px; height: 38px; }
  .modal-info { padding: 26px; }
}