/* =========================================
   Informatics Developers - Responsive CSS
   ========================================= */

/* --- Large desktops (1200px+) --- */
@media (min-width: 1200px) {
  .container { max-width: 1200px; }
}

/* --- Medium desktops (992px - 1199px) --- */
@media (max-width: 1199px) {
  .hero-title { font-size: clamp(2rem, 4vw, 3rem); }
  .dropdown-menu-custom { min-width: 560px; grid-template-columns: repeat(2, 1fr); }
  .portfolio-grid { grid-template-columns: repeat(2, 1fr); }
  .portfolio-item.wide { grid-column: span 1; }
  .float-card-1, .float-card-2, .float-card-3 { display: none; }
}

/* --- Tablets (768px - 991px) --- */
@media (max-width: 991px) {
  .pad-tb { padding: 70px 0; }

  /* Nav */
  .nav-menu { display: none; }
  .nav-actions .btn-main { display: none; }
  .hamburger { display: flex; }

  /* Hero */
  .hero-content { text-align: center; padding: 140px 0 60px; }
  .hero-subtitle { margin: 0 auto 40px; }
  .hero-actions { justify-content: center; }
  .hero-stats { justify-content: center; }
  .hero-image-side { margin-top: 40px; }

  /* About */
  .about-img-wrap { margin-bottom: 60px; }
  .about-badge-float.badge-1 { bottom: -10px; right: 10px; }
  .about-badge-float.badge-2 { top: -10px; left: 10px; }

  /* Stats */
  .stat-card { margin-bottom: 20px; }

  /* Why us */
  .why-image-wrap { margin-top: 40px; }
  .why-exp-badge { left: 10px; }

  /* Portfolio */
  .portfolio-grid { grid-template-columns: repeat(2, 1fr); }
  .portfolio-item.wide { grid-column: span 1; }

  /* Packages */
  .pricing-card { margin-bottom: 24px; }

  /* Contact */
  .contact-info-card { margin-bottom: 24px; }
  .form-card { padding: 36px 28px; }

  /* Footer */
  footer .col-lg-3, footer .col-lg-2 { margin-bottom: 36px; }

  /* Team */
  .team-card { max-width: 380px; margin: 0 auto; }

  /* Page hero */
  .page-hero { padding: 130px 0 60px; }
}

/* --- Mobile landscape (576px - 767px) --- */
@media (max-width: 767px) {
  .pad-tb { padding: 60px 0; }
  h2 { font-size: 1.75rem; }

  /* Hero */
  .hero-content { padding: 120px 0 50px; }
  .hero-title { font-size: 2rem; }
  .hero-subtitle { font-size: 1rem; }
  .hero-actions { flex-direction: column; align-items: center; }
  .hero-stats { gap: 24px; }
  .hero-stat-divider { display: none; }

  /* Marquee */
  .marquee-item { font-size: 0.85rem; }

  /* About */
  .about-badge-float { display: none; }

  /* Portfolio */
  .portfolio-grid { grid-template-columns: 1fr; }
  .portfolio-filter { gap: 8px; }
  .filter-btn { padding: 7px 16px; font-size: 0.8rem; }

  /* Packages */
  .package-tabs { flex-direction: column; align-items: stretch; }
  .pkg-tab-btn { text-align: center; }

  /* Contact */
  .form-card { padding: 28px 20px; }
  .contact-info-card { padding: 32px 24px; }

  /* CTA section */
  .cta-section { padding: 60px 0; }
  .cta-section .text-center { text-align: center !important; }
  .cta-section .d-flex { flex-direction: column; align-items: center; gap: 16px; }

  /* Blog */
  .blog-card { max-width: 480px; margin: 0 auto; }

  /* FAQ */
  .faq-question { font-size: 0.875rem; }

  /* Footer */
  .footer-desc { max-width: 100%; }
  .newsletter-form { flex-direction: column; }
  .newsletter-form button { border-radius: var(--radius-sm); }
}

/* --- Mobile portrait (< 576px) --- */
@media (max-width: 575px) {
  .pad-tb { padding: 50px 0; }
  .container { padding: 0 16px; }

  /* Nav */
  .nav-container { padding: 0 16px; }
  .nav-brand img { height: 40px; }

  /* Hero */
  .hero-content { padding: 110px 0 40px; }
  .hero-title { font-size: 1.75rem; }
  .hero-badge { font-size: 0.78rem; }
  .hero-stats { flex-direction: column; align-items: center; gap: 16px; }

  /* Buttons */
  .btn-main, .btn-outline, .btn-white { padding: 12px 24px; font-size: 0.875rem; }

  /* Section heading */
  .section-heading { margin-bottom: 40px; }
  .section-heading .subtitle { font-size: 0.78rem; }

  /* Service cards */
  .service-card { padding: 28px 22px; }

  /* Stats */
  .stat-card .stat-num { font-size: 2rem; }

  /* Why */
  .why-item { padding: 16px; }
  .why-item .why-num { font-size: 2rem; }

  /* Pricing */
  .pricing-card { padding: 30px 22px; }
  .pricing-price .amount { font-size: 2.4rem; }

  /* Team */
  .ceo-message-card { padding: 32px 24px; }

  /* Contact */
  .captcha-row { flex-direction: column; align-items: flex-start; gap: 10px; }
  .captcha-input { width: 100%; }

  /* Footer */
  .footer-bottom { text-align: center; }
  .footer-bottom-links { justify-content: center; }
  .footer-bottom .d-flex { flex-direction: column; align-items: center; gap: 12px; }

  /* WhatsApp & back to top */
  .whatsapp-float { width: 48px; height: 48px; bottom: 20px; right: 20px; }
  .whatsapp-float i { font-size: 22px; }
  #back-to-top { width: 38px; height: 38px; bottom: 80px; right: 20px; }

  /* Dropdown (mobile) */
  .dropdown-menu-custom { min-width: 300px; grid-template-columns: 1fr; left: 0; transform: none; }
}

/* --- Print --- */
@media print {
  .main-nav, .whatsapp-float, #back-to-top, .hamburger, .mobile-nav { display: none !important; }
  .hero { min-height: auto; padding: 40px 0; }
  body { background: #fff; color: #000; }
}
