/* =========================================================
   TOKENS — a única fonte de verdade do design.

   UM verde só: #14AE5C. Ele aparece em tudo que é marca —
   pílula, destaques do título, botões, ícones, bordas, preço.
   Os outros tons existem só para função, não para decoração:
     --verde-forte  → hover (precisa ser mais escuro para o olho notar)
     --verde-fundo  → fundo de bloco
     --escuro       → rodapé (fundo escuro precisa de contraste com o texto)
   ========================================================= */

:root{
  /* ---------- cor ---------- */
  --verde:        #14AE5C;   /* A cor da marca. Se for mudar uma coisa, é esta. */
  --verde-forte:  #108B4A;   /* só hover */
  --verde-fundo:  #ECF9F2;   /* fundo dos cards de bônus, oferta, garantia, FAQ aberto */

  --escuro:       #08512C;   /* rodapé */
  --laranja-forte:#EA580C;

  --tinta:        #111827;   /* títulos */
  --cinza-texto:  #6B7280;   /* texto de apoio */
  --cinza-fundo:  #F8FAFC;   /* fundo alternado de seção */
  --branco:       #FFFFFF;

  /* ---------- gradientes ---------- */
  --grad-cta:   linear-gradient(135deg, #14AE5C 0%, #2FC073 50%, #66CA95 100%);
  --grad-cta-h: linear-gradient(135deg, #108B4A 0%, #14AE5C 100%);
  /* Ícones circulares: fica no miolo do verde para o ícone branco não sumir. */
  --grad-icone: linear-gradient(135deg, #0F9A50 0%, #14AE5C 55%, #35BF77 100%);
  --grad-barra: linear-gradient(90deg, #108B4A, #14AE5C, #2FC073, #66CA95);
  --grad-timer: linear-gradient(135deg, #EA580C 0%, #F97316 50%, #FB923C 100%);

  /* ---------- tipografia ---------- */
  --fonte-titulo: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --fonte-corpo:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* ---------- espaço ---------- */
  --sec:  clamp(3rem, 6vw, 4.5rem);   /* respiro vertical da seção */
  --col:  1200px;                     /* largura do container */
  --gutter: 20px;

  /* ---------- forma ---------- */
  --raio:      12px;
  --raio-card: 20px;
  --raio-pill: 50px;

  --sombra-card:  0 2px 12px rgba(0,0,0,.05);
  --sombra-hover: 0 8px 25px rgba(0,0,0,.09);
  --sombra-cta:   0 6px 20px rgba(20,174,92,.45);
  --sombra-icone: 0 6px 20px rgba(20,174,92,.4);
}