/* =============================================================
   CURSO DSM · Faixa da oferta com cronômetro
   Fica no topo de todas as telas (site, login, área do aluno).
   O offer.js mede a altura da faixa e empurra o resto da página
   pela variável --offer-h.
   ============================================================= */
:root{--offer-h:0px}
.offer{position:fixed;top:0;left:0;right:0;z-index:900;background:linear-gradient(90deg,#4A0F22,#861C3A 50%,#4A0F22);border-bottom:1px solid rgba(255,255,255,.22);box-shadow:0 10px 30px -12px rgba(0,0,0,.8);color:#fff;font-family:"Manrope","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif}
.offer[hidden]{display:none}
.offer [hidden]{display:none !important}
.offer *,.offer *::before,.offer *::after{box-sizing:border-box}
.offer p{margin:0}
.offer__inner{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.35rem 1.1rem;max-width:1200px;margin:0 auto;padding:.55rem 3.2rem .55rem 1rem}
.offer__text{display:flex;align-items:center;gap:.6rem;font-size:.92rem;font-weight:700;letter-spacing:.01em}
.offer__time{display:inline-flex;align-items:center;justify-content:center;min-width:4.4rem;min-height:34px;padding:0 .75rem;border-radius:999px;background:rgba(10,10,11,.55);border:1px solid rgba(255,255,255,.35);font-size:1.25rem;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.offer.is-urgent .offer__time{background:#A82B4D;border-color:rgba(255,255,255,.7)}
.offer__price{font-size:.9rem;color:#FBE3EA}
.offer__price s{color:#E9B8C5;text-decoration-thickness:2px}
.offer__price b{color:#fff;font-size:1.05rem}
.offer__cta{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 1.15rem;border-radius:999px;background:#fff;color:#4A0F22;font-size:.82rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;transition:transform .3s,box-shadow .3s}
.offer__cta:hover{transform:translateY(-1px);box-shadow:0 8px 20px -8px rgba(0,0,0,.7)}
.offer :focus-visible{outline:2px solid #fff;outline-offset:3px}
.offer__close{position:absolute;right:.4rem;top:50%;width:44px;height:44px;margin-top:-22px;display:grid;place-items:center;border:0;border-radius:50%;background:none;color:#fff;font-size:1.5rem;line-height:1;cursor:pointer}
.offer__close:hover{background:rgba(255,255,255,.14)}
.offer__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Empurra a página para baixo da faixa */
body{padding-top:var(--offer-h)}
.header,.progress{top:var(--offer-h)}
#membros .topbar{top:var(--offer-h)}

/* Cartão de preço da página de vendas: mostra a oferta ou o valor cheio, conforme o estado */
[data-when="ended"]{display:none}
html[data-offer="ended"] [data-when="ended"]{display:block}
html[data-offer="ended"] [data-when="offer"]{display:none}

@media (max-width:560px){
  /* Linha 1: texto e tempo. Linha 2: preço à esquerda e botão à direita */
  .offer__inner{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.25rem .6rem;padding:.45rem .75rem .5rem}
  .offer__text{grid-column:1 / -1;justify-content:center;font-size:.85rem}
  .offer__time{min-width:4rem;min-height:30px;font-size:1.05rem}
  .offer__price{font-size:.8rem;line-height:1.3}
  .offer__price b{font-size:.95rem}
  .offer__cta{min-height:40px;padding:0 .85rem;font-size:.72rem}
  .offer__close{top:.1rem;right:0;margin-top:0;width:40px;height:40px}
}
@media (prefers-reduced-motion:reduce){.offer__cta{transition:none}}
@media print{.offer{display:none !important}body{padding-top:0}}
