/* ===== Responsive rules ===== */

/* Tablet */
@media (max-width: 1024px) {
  .hero__inner { grid-template-columns: 1fr; gap: 2rem; }
  .hero__visual { height: 320px; max-width: 380px; margin: 0 auto; }
  .stats__grid { grid-template-columns: repeat(2, 1fr); }
  .about-grid { grid-template-columns: 1fr; gap: 3rem; }
  .contact-grid { grid-template-columns: 1fr; }
  .service-detail { grid-template-columns: 1fr; }
  .card--contact { position: static; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

/* Small tablet / large phone */
@media (max-width: 820px) {
  .desktop-nav { display: none; }
  .menu-toggle { display: block; }
  .site-header__actions .btn--primary { display: none; }
  .section { padding: 3.5rem 0; }
  .page-header { padding: 6rem 0 2.5rem; }
  .hero { min-height: auto; padding: 8rem 0 4rem; }
  .hero__visual { height: 260px; }
  .hero__card { width: 90px; height: 90px; font-size: 2rem; }
  .cta-box { flex-direction: column; text-align: center; padding: 2rem 1.5rem; }
  .footer-newsletter { flex-direction: column; align-items: stretch; }
  .form-row { grid-template-columns: 1fr; }
  .values-list { grid-template-columns: 1fr; }
  .about-mv { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .footer-legal { justify-content: center; }
}

/* Phone */
@media (max-width: 560px) {
  .container { padding: 0 1rem; }
  .section { padding: 3rem 0; }
  .hero__actions { flex-direction: column; }
  .hero__actions .btn { width: 100%; }
  .hero__trust { flex-direction: column; gap: .5rem; }
  .stats__grid { grid-template-columns: 1fr 1fr; gap: 1.25rem; }
  .stat__value { font-size: 1.85rem; }
  .footer-grid { grid-template-columns: 1fr; }
  .site-logo img { height: 32px; }
  .float-btn { width: 46px; height: 46px; font-size: 1.15rem; right: 1rem; }
  .float-btn--whatsapp { bottom: 5rem; }
  .float-btn--phone { bottom: 8.5rem; }
  .about-grid__badge { bottom: -16px; right: 1rem; padding: 1rem 1.25rem; }
}

/* Prevent horizontal overflow */
img, iframe, video { max-width: 100%; }