/* ============================================================================
📱 responsivo.css – Responsividade Global Padrão Agroverso
🎯 Ajustes finos para mobile, tablet, desktop grande
============================================================================ */

/* ============================================================================
📱 Telas pequenas: smartphones (até 480px)
============================================================================ */

@media (max-width: 480px) {
  body {
    font-size: 0.95rem;
  }

  .secao-titulo {
    font-size: 1.3rem;
  }

  .container,
  .section-container {
    padding: var(--espaco-md) var(--espaco-sm);
  }

  .card {
    max-width: 100%;
    margin-bottom: var(--espaco-md);
  }

  .carrossel img {
    max-height: 240px;
  }

  .formulario-orcamento,
  .login-form {
    padding: 0;
    gap: var(--espaco-sm);
  }

  .btn-primary,
  .whatsapp-btn,
  .formulario-orcamento button {
    width: 100%;
    font-size: 0.95rem;
  }
}

/* ============================================================================
📲 Telas médias: tablets (481px até 1024px)
============================================================================ */

@media (min-width: 481px) and (max-width: 1024px) {
  .cards-container,
  .dashboard-cards {
    flex-direction: column;
    align-items: center;
  }

  .dashboard-card {
    width: 90%;
  }

  .login-container {
    padding: var(--espaco-lg) var(--espaco-md);
  }

  .carrossel img {
    max-height: 360px;
  }

  .chamada-final {
    padding: var(--espaco-lg) var(--espaco-sm);
  }

  .container,
  .section-container {
    padding: var(--espaco-lg) var(--espaco-sm);
  }
}

/* ============================================================================
🖥️ Telas grandes: desktops > 1280px
============================================================================ */

@media (min-width: 1280px) {
  body {
    font-size: 1.05rem;
  }

  .container,
  .section-container {
    padding: var(--espaco-xl);
  }

  .conteudo-produto p,
  .cta-texto {
    font-size: 1.1rem;
    line-height: 1.8;
  }

  .carrossel img {
    max-height: 520px;
  }
}