/* === PLANOS JC PRO – Ajustes Finais Responsivos Corrigidos === */

/* 1️⃣ Reorganizar blocos no mobile: move o box "O que você pode fazer aqui" abaixo do texto principal */
@media (max-width: 768px) {
  #jc-hero > div[style*="display:grid"] {
    display: flex !important;
    flex-direction: column !important;
  }
  #jc-hero > div[style*="display:grid"] > div:nth-child(1) {
    order: 1 !important;
  }
  #jc-hero > div[style*="display:grid"] > div:nth-child(2) {
    order: 2 !important;
    margin-top: 25px !important;
  }
}

/* 2️⃣ Ajustar line-height e espaçamento de títulos grandes */
#jc-planos h3,
section.jc-final h2,
section.jc-compare h2,
#jc-hero h1 {
  line-height: 1.25 !important;
}

/* 3️⃣ Ajuste específico para “Agente da Transformação” */
#jc-planos h3 {
  word-break: keep-all;
}
#jc-planos h3:contains("Agente da Transformação"),
#jc-planos h3:has-text("Agente da Transformação") {
  line-height: 1.35 !important;
}

/* 4️⃣ Ajustar títulos longos e textos do rodapé em mobile */
@media (max-width: 480px) {
  #jc-planos h3 {
    font-size: 25px !important;
    line-height: 1.35 !important;
  }
  section.jc-final h2,
  section.jc-compare h2 {
    font-size: 22px !important;
    line-height: 1.35 !important;
    margin-bottom: 15px !important;
  }
  section.jc-final p {
    line-height: 1.6 !important;
  }
  #jc-hero h1 {
    font-size: 25px !important;
    line-height: 1.25 !important;
  }
}

/* 5️⃣ Reduz line-height de "O que você pode fazer aqui" */
#jc-hero p[style*="font-size: 20px"],
#jc-hero ul li {
  line-height: 1.4 !important;
}