/* ============================================================
   LiveJalso – Responsive Stylesheet
   ============================================================ */

/* Large desktops */
@media (min-width: 1400px) {
  .container { max-width: 1320px; }
  .hero-title { font-size: 5.5rem; }
}

/* Tablets landscape */
@media (max-width: 991px) {
  .section-pad { padding: 70px 0; }
  .hero-stats { gap: 1.5rem; }
  .hero-stat-num { font-size: 1.6rem; }
  .pricing-card.featured { transform: scale(1); }
  .footer-top { padding: 50px 0 30px; }
  .footer-desc { max-width: 100%; }
}

/* Tablets portrait */
@media (max-width: 767px) {
  .section-pad { padding: 55px 0; }
  .section-pad-sm { padding: 40px 0; }
  .hero-stats { flex-wrap: wrap; gap: 1.25rem; }
  .hero-stat-num { font-size: 1.5rem; }
  #mainNav .navbar-toggler { border-color: rgba(255,255,255,.3); }
  #mainNav .navbar-toggler-icon { filter: invert(1); }
  #mainNav .navbar-collapse {
    background: var(--navy);
    padding: 1rem;
    border-radius: var(--radius);
    margin-top: .5rem;
  }
  .contact-form-wrap { padding: 1.5rem; }
  .stat-num { font-size: 2.2rem; }
  .wa-float { bottom: 16px; right: 16px; }
  .call-float { bottom: 80px; right: 16px; }
}

/* Mobile */
@media (max-width: 575px) {
  .section-pad { padding: 45px 0; }
  .hero-title { font-size: 2.4rem; }
  .hero-desc { font-size: 1rem; }
  .btn-primary-lj, .btn-outline-lj, .btn-orange-lj {
    padding: .65rem 1.5rem;
    font-size: .875rem;
  }
  .service-icon { width: 50px; height: 50px; font-size: 1.2rem; }
  .pricing-header { padding: 1.5rem 1.5rem 1rem; }
  .pricing-body { padding: 1.5rem; }
  .pricing-price { font-size: 2rem; }
  .section-title { font-size: 1.9rem; }
  .page-hero { padding: 70px 0 40px; }
  #scrollTop { bottom: 16px; left: 16px; }
  .hero-stats { gap: 1rem; }
  .hero-stat-num { font-size: 1.4rem; }
  .footer-social a { width: 32px; height: 32px; font-size: .8rem; }
}

/* Dark mode (future-ready) */
@media (prefers-color-scheme: dark) {
  /* Override intentionally left minimal — brand is light-bg */
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .wa-float { animation: none; }
}

/* Print */
@media print {
  #mainNav, .wa-float, .call-float, #scrollTop, .hero-overlay { display: none !important; }
  body { color: #000; }
  a { color: #000; }
}