/* ==========================================================================
   SATGOLD TECHNOL — RESPONSIVE RULES
   Mobile-first overrides. Breakpoints target common device widths.
   ========================================================================== */

/* ---------- ≤1024px : tablets / small laptops ---------- */
@media (max-width: 1024px) {
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .portfolio-grid { grid-template-columns: repeat(2, 1fr); }
  .addons-grid { grid-template-columns: repeat(2, 1fr); }
  .timeline { grid-template-columns: repeat(2, 1fr); row-gap: 2.5rem; }
  .timeline::before { display: none; }
  .founder { grid-template-columns: 1fr; }
  .founder-photo { max-width: 320px; margin-inline: auto; }
  .price-highlight { grid-template-columns: 1fr; text-align: center; }
  .price-highlight-text p { margin-inline: auto; }
}

/* ---------- ≤900px : nav collapses ---------- */
@media (max-width: 900px) {
  .nav-links { display: none; }
  .nav-cta .btn-outline { display: none; }
  .nav-toggle { display: flex; }
  .mobile-panel.is-open { display: flex; }

  .hero .container { grid-template-columns: 1fr; }
  .hero-visual { min-height: 300px; order: -1; }
  .hero-panel { min-height: 300px; }

  .pricing-grid { grid-template-columns: 1fr; }
  .price-card.is-popular { transform: none; order: -1; }

  .contact-layout { grid-template-columns: 1fr; }
  .testimonial-track { grid-template-columns: 1fr; }
}

/* ---------- ≤768px : general tablet/phone ---------- */
@media (max-width: 768px) {
  .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .portfolio-grid { grid-template-columns: 1fr; }
  .addons-grid { grid-template-columns: repeat(2, 1fr); }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .timeline { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .footer-top { grid-template-columns: repeat(2, 1fr); row-gap: 2.5rem; }
  .topbar .container { justify-content: center; text-align: center; }
  .topbar-msg { display: none; }
  .blog-controls { flex-direction: column; align-items: stretch; }
  .blog-search { max-width: none; }
  section { padding-block: clamp(2.5rem, 9vw, 4rem); }
}

/* ---------- ≤600px : phones ---------- */
@media (max-width: 600px) {
  .addons-grid { grid-template-columns: 1fr; }
  .footer-top { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .hero-actions { flex-direction: column; align-items: flex-start; }
  .cta-actions { flex-direction: column; width: 100%; }
  .cta-actions .btn { width: 100%; justify-content: center; }
  .float-card { font-size: 0.82rem; padding: 0.75rem 0.9rem; }
  .float-card .dot { width: 28px; height: 28px; }
  .wa-float { width: 50px; height: 50px; bottom: 1rem; right: 1rem; }
  .wa-float svg { width: 24px; height: 24px; }
}

/* ---------- ≤480px : small phones ---------- */
@media (max-width: 480px) {
  .container { padding-inline: 1.1rem; }
  .brand-sub { display: none; }
  h1 { word-break: break-word; }
  .btn { padding: 0.8rem 1.3rem; font-size: 0.9rem; }
  .price-card.is-popular { transform: none; }
  .topbar-links { gap: 0.9rem; }
}

/* ---------- ≤360px : very small phones ---------- */
@media (max-width: 360px) {
  .brand-mark { width: 34px; height: 34px; font-size: 0.95rem; }
  .stat-num { font-size: 1.6rem; }
  .price-amount { font-size: 2.1rem; }
}

/* ---------- ≥1440px : large desktop refinement ---------- */
@media (min-width: 1440px) {
  :root { --container: 1280px; }
  body { font-size: 1.02rem; }
}