/* -------------------------------------------------------------------------- */
/* Captação de leads: fallbacks responsivos e movimento reduzido              */
/* -------------------------------------------------------------------------- */

@media (max-width: 767px) {
  /* O painel encosta na base para facilitar alcance com o polegar. */
  .lead-modal {
    align-items: end;
    padding: clamp(8px, 0.8rem, 12px);
  }

  /* A coluna conceitual é removida; o formulário continua completo. */
  .lead-modal__panel {
    display: block;
    max-height: calc(100svh - clamp(16px, 1.6rem, 24px));
    border-radius: clamp(22px, 2.2rem, 32px);
  }

  .lead-modal__signal {
    display: none;
  }

  /* O conteúdo reduz gutters para preservar a largura útil dos campos. */
  .lead-modal__scroll {
    padding: clamp(16px, 1.6rem, 22px) clamp(16px, 1.7rem, 24px) clamp(14px, 1.4rem, 20px);
  }

  /* O fechamento acompanha os gutters menores sem perder área de toque. */
  .lead-modal__close {
    top: clamp(10px, 1rem, 14px);
    right: clamp(10px, 1rem, 14px);
    width: clamp(40px, 4rem, 44px);
  }

  /* A etiqueta preserva leitura sem herdar a escala excessiva de tablets estreitos. */
  .lead-modal__eyebrow {
    margin-right: 52px;
    font-size: clamp(10px, 1rem, 12px);
  }

  /* O título cabe em celulares estreitos sem perder hierarquia. */
  .lead-modal__title {
    margin-top: clamp(8px, 0.8rem, 12px);
    font-size: clamp(32px, 8vw, 40px);
    line-height: 0.94;
  }

  /* Descrição e formulário aproximam-se para tornar o preenchimento mais rápido. */
  .lead-modal__description {
    margin-top: clamp(7px, 0.7rem, 10px);
    font-size: clamp(12px, 1.15rem, 15px);
    line-height: 1.35;
  }

  .lead-modal__form {
    margin-top: clamp(12px, 1.2rem, 16px);
  }

  /* Os campos ficam em uma coluna para evitar áreas estreitas de digitação. */
  .lead-modal__fields {
    grid-template-columns: 1fr;
    gap: clamp(8px, 0.8rem, 11px);
  }

  .lead-modal__field--site {
    grid-column: auto;
  }

  /* Inputs compactos continuam com altura suficiente para toque e digitação. */
  .lead-modal__field {
    gap: clamp(4px, 0.4rem, 6px);
  }

  .lead-modal__field > span {
    font-size: clamp(10px, 1rem, 12px);
  }

  .lead-modal__field input {
    min-height: 42px;
    padding-block: 4px;
    font-size: clamp(16px, 1.55rem, 19px);
  }

  /* A pergunta se aproxima dos dados sem perder separação semântica. */
  .lead-modal__intent {
    margin-top: clamp(12px, 1.2rem, 16px);
  }

  .lead-modal__intent legend {
    font-size: clamp(13px, 1.25rem, 16px);
  }

  /* As escolhas viram linhas compactas e totalmente clicáveis. */
  .lead-modal__choices {
    grid-template-columns: 1fr;
    gap: clamp(5px, 0.5rem, 7px);
    margin-top: clamp(7px, 0.7rem, 10px);
  }

  .lead-modal__choice span {
    grid-template-columns: auto 1fr;
    align-items: center;
    min-height: 42px;
    padding: 8px 12px;
    border-radius: clamp(11px, 1.1rem, 14px);
  }

  .lead-modal__choice small {
    font-size: clamp(9px, 0.85rem, 11px);
  }

  .lead-modal__choice strong {
    align-self: center;
    font-size: clamp(13px, 1.2rem, 15px);
  }

  /* Nota e CTA são empilhados para manter o botão em largura integral. */
  .lead-modal__footer {
    align-items: stretch;
    gap: clamp(7px, 0.7rem, 10px);
    margin-top: clamp(12px, 1.2rem, 16px);
    flex-direction: column;
  }

  .lead-modal__note {
    max-width: none;
    font-size: clamp(10px, 1rem, 12px);
    line-height: 1.35;
  }

  .lead-modal__submit {
    width: 100%;
    min-height: 46px;
    padding-block: 12px;
    font-size: clamp(13px, 1.3rem, 16px);
  }

  /* Blur é removido no mobile para reduzir o custo de composição. */
  .lead-modal__backdrop {
    backdrop-filter: none;
  }
}

/* Tablets estreitos aproveitam a largura para reduzir altura sem remover conteúdo. */
@media (min-width: 560px) and (max-width: 767px) {
  .lead-modal__fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 18px;
  }

  .lead-modal__field--site,
  .lead-modal__no-site {
    grid-column: 1 / -1;
  }

  .lead-modal__choices {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lead-modal__choice span {
    grid-template-columns: 1fr;
    min-height: 68px;
  }

  .lead-modal__footer {
    align-items: center;
    flex-direction: row;
  }

  .lead-modal__note {
    max-width: 28ch;
  }

  .lead-modal__submit {
    width: auto;
  }
}

/* Movimento reduzido mantém abertura e fechamento imediatos. */
@media (prefers-reduced-motion: reduce) {
  .lead-modal__backdrop,
  .lead-modal__panel,
  .lead-modal__close,
  .lead-modal__choice span {
    transition: none;
  }
}