/* Página de compra: urgência compacta com o prazo real da oferta e o checkout largo no computador. */
.pg-comprar { background: radial-gradient(70% 40% at 50% 0%, rgba(255, 106, 0, .10), transparent 70%), var(--bg); min-height: 100vh; }
.cp-cabeca { position: relative; }
.cp-cabeca .barra { position: relative; }
.cp-main { padding: 18px var(--lado, 16px) 64px; }

/* bloco de urgência: uma linha no computador, duas no celular */
.cp-urg { max-width: 1080px; margin: 0 auto 18px; display: flex; align-items: center; gap: 12px 18px; flex-wrap: wrap; padding: 10px 14px; border-radius: 14px;
  background: linear-gradient(90deg, rgba(255, 106, 0, .16), rgba(255, 106, 0, .05)); border: 1px solid rgba(255, 122, 0, .5); }
.cp-chip { display: inline-flex; align-items: center; gap: 7px; margin: 0; padding: 5px 10px; border-radius: 99px; background: linear-gradient(90deg, #FF4D00, #FF7A00);
  color: #fff; font-weight: 800; font-size: 11.5px; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.cp-chip .fo-raio { width: 13px; height: 13px; }
.cp-chip .fo-pct { text-transform: none; padding: 2px 6px; font-size: 11.5px; }
.cp-texto { flex: 1 1 200px; min-width: 0; }
.cp-titulo { margin: 0; font-size: 15px; font-weight: 600; color: var(--tx); line-height: 1.3; }
.cp-sub { margin: 1px 0 0; font-size: 13px; color: var(--tx-2); line-height: 1.35; }
.cp-sub b { color: var(--tx); }
.cp-timer { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.cp-anel { width: 34px; height: 34px; transform: rotate(-90deg); flex: none; }
.cp-anel circle { fill: none; stroke-width: 4; }
.cp-anel-fundo { stroke: rgba(255, 122, 0, .22); }
.cp-anel-seg { stroke: #FF7A00; stroke-linecap: round; stroke-dasharray: 60; stroke-dashoffset: 0; transition: stroke-dashoffset .95s linear; filter: drop-shadow(0 0 4px rgba(255, 122, 0, .7)); }
.cp-relogio { display: inline-flex; font-family: var(--fm); font-size: 26px; font-weight: 600; line-height: 1; letter-spacing: -.01em; font-variant-numeric: tabular-nums; color: #FFB27A; }
.cp-relogio .fo-dig, .cp-relogio .fo-sep { display: inline-block; min-width: .62em; text-align: center; }
.cp-relogio .fo-sep { min-width: .4em; opacity: .7; }
.cp-relogio .fo-dig.vira { animation: fo-vira .35s cubic-bezier(.2, .8, .2, 1); }
@keyframes fo-vira { from { transform: translateY(-55%); opacity: 0; filter: blur(2px); } to { transform: none; opacity: 1; filter: none; } }
@media (prefers-reduced-motion: reduce) { .cp-relogio .fo-dig.vira { animation: none; } .cp-anel-seg { transition: none; } }
@media (max-width: 520px) { .cp-timer { margin-left: 0; } .cp-relogio { font-size: 22px; } }

/* checkout largo no computador: dados e pagamento à esquerda, resumo à direita */
.pg-comprar .checkout-faixa { max-width: 1080px; margin-top: 0; }
.ck-grade { display: grid; gap: 14px; }
.ck-col-principal, .ck-col-resumo { display: grid; gap: 12px; align-content: start; min-width: 0; }
@media (min-width: 900px) {
  .pg-comprar .checkout-painel { padding: 32px 34px 28px; }
  .ck-grade { grid-template-columns: minmax(0, 1.45fr) minmax(300px, 1fr); gap: 24px; align-items: start; }
  .ck-col-resumo { position: sticky; top: 20px; }
}
/* celular: os dados primeiro, o resumo depois */
@media (max-width: 899px) { .ck-col-resumo { order: 2; } }
.ck-bumps-tit { margin: 4px 0 2px; font-size: 14px; font-weight: 600; letter-spacing: .01em; color: var(--tx-2); text-transform: none; }
.ck-linhas-bumps .ck-linha { font-size: 14px; color: var(--tx-2); }
/* rodapé legal discreto no pé da página de compra */
.pg-comprar .rodape { max-width: 1080px; margin: 8px auto 0; padding: 18px 16px 36px; text-align: center; font-size: 12px; line-height: 1.6; color: var(--tx-3, #7E8696); }
.pg-comprar .rodape p { margin: 2px 0; }
.pg-comprar .rodape strong { color: var(--tx-2, #A9B0BF); font-weight: 600; }
.pg-comprar .rodape a { color: var(--tx-3, #7E8696); text-underline-offset: 2px; }
.cp-renovada { margin: 2px 0 0; font-size: 12.5px; font-weight: 600; color: #FFB27A; }
