/* =====================================================================
   Ritmo entre seções (30/09/2026)
   Um padrão só para a distância entre as seções, carregado por último.

   --ritmo        distância entre o fim de uma seção e o começo da outra
                  quando as duas têm o mesmo fundo (claro com claro).
                  Cada seção põe metade em cima e metade embaixo.
   --ritmo-troca  respiro de cada lado quando o fundo muda de cor
                  (escuro para claro, claro para roxo, roxo para escuro).
   ===================================================================== */
:root {
  --ritmo: clamp(96px, 8.9vw, 128px);
  --ritmo-meio: calc(var(--ritmo) / 2);
  --ritmo-troca: clamp(72px, 8vw, 120px);
}

/* O que muda: sai do escuro do início (troca) e encosta na roda de serviços (mesmo fundo) */
.FullWidthCardCarousel { padding: clamp(56px, 6vw, 88px) 0 var(--ritmo); }
.Applications__carouselWrap { padding-bottom: 0; }
/* no tablet em pé o anel da roda já começa uns 120px abaixo do topo da seção */
@media (min-width: 768px) and (max-width: 1023px) and (orientation: portrait) { .FullWidthCardCarousel { padding-bottom: 0; } }

/* Como nós trabalhamos: a roda termina colada na borda de baixo, então o respiro inteiro fica aqui */
.Metodo { padding: var(--ritmo) 0 var(--ritmo-meio); }
/* abaixo de 1024px o texto do último serviço fica uns 60px acima do fim da roda */
@media (max-width: 1023px) { .Metodo { padding-top: var(--ritmo-meio); } }

/* Teste, cases e FAQ: mesmo fundo claro, metade em cima e metade embaixo */
.Momento { padding: var(--ritmo-meio) 0; }
.Cases { padding: var(--ritmo-meio) 0; }
.Faq { padding: var(--ritmo-meio) 0 var(--ritmo-troca); }

/* Próximo passo (roxo) e rodapé (escuro): troca de fundo, respiro maior */
.Proximo { padding: var(--ritmo-troca) 0; }
