/* ==========================================================================
   Inscrições · Figma 1:728 (1920 × 966, fundo com rastros de luz)
   Título · stepper de lotes 760 · card de preço 1000 × 500.
   Estados (ativo/próximo/encerrado), etiqueta, preços e contador vêm de
   js/modules/lotes.js a partir de LOTES (js/evento.js).
   ≤1023: mesma base do desktop (decisão do Lucas): stepper igual, card
   empilhado na mesma ordem e os dois preços um embaixo do outro.
   ========================================================================== */

.cn-inscricoes {
  position: relative; /* sem isolation: a borboleta 1:843 desce sobre o Presencial */
  padding-block: var(--inscricoes-pad);
  color: var(--white);
}
.cn-inscricoes__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 100%; } /* fitas de luz ancoradas embaixo */
.cn-inscricoes__inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; }

.cn-inscricoes__head { display: flex; flex-direction: column; align-items: center; gap: var(--space-12); text-align: center; }
.cn-inscricoes__sub { font: var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-sans); color: var(--gray-400); }

/* ---------- Stepper (1:732) ---------- */
.cn-lots {
  --lot-line: color-mix(in srgb, var(--lilac-400) 45%, transparent);
  width: min(100%, var(--lots-w)); margin-top: var(--space-48);
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
}
.cn-lot { display: flex; flex-direction: column; align-items: center; gap: var(--space-10); text-align: center; }
.cn-lot__line { display: flex; align-items: center; width: 100%; height: 56px; }
.cn-lot__trail { flex: 1; height: 2px; background: var(--lot-line); transform-origin: left center; }
.cn-lot:first-child .cn-lot__trail:first-child { background: linear-gradient(90deg, transparent, var(--lot-line)); }
.cn-lot:last-child .cn-lot__trail:last-child { background: linear-gradient(90deg, var(--lot-line), transparent); }
/* trilho "percorrido" (lotes encerrados e o trecho até o ativo) */
.cn-lot.is-done .cn-lot__trail,
.cn-lot.is-active .cn-lot__trail:first-child { background: var(--lilac-400); }
.cn-lot.is-done:first-child .cn-lot__trail:first-child,
.cn-lot.is-active:first-child .cn-lot__trail:first-child { background: var(--grad-lot-track); }

.cn-lot__circle {
  position: relative; flex: none; display: grid; place-items: center;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--purple-950); border: 2px dashed var(--lot-line); color: var(--lilac-400);
}
.cn-lot__circle > * { grid-area: 1 / 1; }
.cn-lot__num { font: var(--fw-semibold) var(--fs-body)/1 var(--font-sans); color: var(--white); }
.cn-lot__num, .cn-lot__done { display: none; }
.cn-lot.is-active .cn-lot__circle {
  width: 56px; height: 56px; background: var(--purple-650); border-style: solid; box-shadow: var(--glow-lot-active);
}
.cn-lot.is-active .cn-lot__num { display: block; }
.cn-lot.is-active .cn-lot__lock, .cn-lot.is-done .cn-lot__lock { display: none; }
.cn-lot.is-done .cn-lot__circle { background: var(--purple-700); border: 2px solid var(--lilac-400); color: var(--white); }
.cn-lot.is-done .cn-lot__done { display: block; }

.cn-lot__name { font: var(--fw-semibold) var(--fs-body)/var(--lh-body) var(--font-sans); color: var(--gray-400); }
.cn-lot.is-active .cn-lot__name { color: var(--white); }
.cn-lot__status { font: var(--fw-regular) var(--fs-body-s)/var(--lh-body-s) var(--font-sans); color: var(--gray-400); }

@media (prefers-reduced-motion: no-preference) {
  .cn-lot.is-active .cn-lot__circle { animation: cn-lot-breathe 2.8s ease-in-out infinite; }
}
@keyframes cn-lot-breathe {
  50% { box-shadow: inset 0 4px 11.8px var(--lilac-500), 0 0 32px color-mix(in srgb, var(--lilac-500) 90%, transparent); }
}

/* ---------- Card de preço (1:761) ---------- */
.cn-price-wrap { position: relative; width: min(100%, var(--price-card-w)); margin-top: var(--space-48); }
.cn-price {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; grid-template-columns: var(--price-left-w) auto minmax(0, 1fr); gap: var(--space-32);
  padding: 60px 53px;
  border-radius: var(--radius-price);
  background: var(--surface-card); color: var(--text-strong);
}
/* Brilho roxo no canto inferior direito (1:762, blur 250 no Figma → gradiente radial, mais leve — T4) */
.cn-price::before {
  content: ""; position: absolute; z-index: -1; right: -160px; bottom: -180px; width: 520px; height: 460px;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--purple-450) 55%, transparent), transparent);
}
@media (prefers-reduced-motion: no-preference) {
  .cn-price::before { animation: cn-price-glow 6s ease-in-out infinite alternate; }
}
@keyframes cn-price-glow { to { opacity: .6; transform: scale(1.12); } }

.cn-price__left { display: flex; flex-direction: column; gap: var(--space-24); padding: var(--space-8); }
.cn-price__tag {
  display: grid; place-items: center; height: 120px;
  border-radius: var(--radius-lg); background: var(--grad-lot-tag);
  font: italic var(--fw-semibold) var(--fs-lot-tag)/1 var(--font-serif); font-variation-settings: var(--fraunces-axes);
  color: var(--white);
}
.cn-price__incl { display: flex; flex-direction: column; gap: var(--space-24); }
.cn-price__incl .t-card { color: var(--text-strong); }
.cn-price__items { display: flex; flex-direction: column; gap: var(--space-16); }

.cn-price__divider { width: 0; border-left: 2px dashed var(--border-divider); }

.cn-price__right { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-16); padding: var(--space-8); }
.cn-price__cards { display: flex; gap: var(--space-16); }
.cn-price-card {
  width: var(--price-box-w);
  display: flex; flex-direction: column; align-items: center; gap: var(--space-6);
  padding: var(--space-20) 9px; /* o CTA de 218 quase encosta nas laterais, como no Figma */
  border: 1px solid var(--border-price); border-radius: var(--radius-card);
  background: var(--surface-soft);
}
.cn-price-card__label { color: var(--lilac-500); }
.cn-price-card__value { display: flex; align-items: baseline; gap: var(--space-4); font-weight: var(--fw-semibold); color: var(--text-strong); font-variant-numeric: tabular-nums; }
.cn-price-card__cur { font-size: var(--fs-price-cur); }
.cn-price-card__int { font-size: var(--fs-price); line-height: 1; letter-spacing: var(--ls-price); }
.cn-price-card__cents { font-size: var(--fs-price-cents); }
.cn-price-card__parcel { font: var(--fw-semibold) var(--fs-body-s)/1.75 var(--font-sans); color: var(--text-strong); }
.cn-price-card .cn-btn { margin-top: var(--space-6); width: 100%; }

.cn-price__ends { font: var(--fw-regular) var(--fs-body-s)/var(--lh-body-s) var(--font-sans); color: var(--text-body); }
.cn-price__links { display: flex; gap: var(--space-16); font: var(--fw-regular) var(--fs-caption)/1.5 var(--font-sans); color: var(--text-body); }
.cn-price__policy { text-decoration: underline; text-underline-offset: 2px; }
.cn-price__policy:hover { color: var(--purple-700); }

/* Encerradas: some o que é de compra */
.cn-inscricoes.is-closed .cn-price-card .cn-btn,
.cn-inscricoes.is-closed .cn-mini-count,
.cn-inscricoes.is-closed .cn-price-card__parcel { display: none; }

/* ---------- Borboletas ---------- */
.cn-inscricoes__butterfly-card { width: 267px; top: -118px; right: -114px; }  /* 1:842 */
.cn-inscricoes__butterfly { width: 467px; left: -104px; top: 734px; }        /* 1:843 */
/* abaixo de 1680 o card chega perto da borda e a borboleta cobriria os itens: vai para trás do card */
@media (max-width: 1679px) { .cn-inscricoes__butterfly { z-index: 0; } }

/* ---------- Modal da política (C10) ---------- */
.cn-policy-modal .cn-modal__card { width: min(100%, var(--policy-w)); display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-16); }
.cn-policy-modal .t-h3 { color: var(--purple-900); }
.cn-policy-modal__text { display: grid; gap: var(--space-12); font: var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-sans); color: var(--text-body); }
.cn-policy-modal__text a { color: var(--purple-700); text-decoration: underline; }

/* ---------- ≤1023: mesma base do desktop, empilhado ---------- */
@media (max-width: 1023px) {
  .cn-inscricoes { padding-block: var(--space-80); }
  .cn-price-wrap { width: min(100%, 560px); }
  .cn-price { grid-template-columns: minmax(0, 1fr); gap: var(--space-28); padding: var(--space-32) var(--space-28); }
  .cn-price::before { width: 300px; height: 260px; right: -130px; bottom: -110px; } /* brilho proporcional ao card estreito */
  .cn-price__left, .cn-price__right { padding: 0; }
  .cn-price__divider { width: 100%; height: 0; border-left: 0; border-top: 2px dashed var(--border-divider); }
  .cn-price__cards { flex-direction: column; align-self: stretch; }
  .cn-price-card { width: 100%; }
  .cn-price__links { flex-wrap: wrap; justify-content: center; }

  .cn-inscricoes__butterfly-card { width: 170px; top: -80px; right: -40px; }
  .cn-inscricoes__butterfly { width: 260px; left: -80px; top: auto; bottom: -130px; }
}

@media (max-width: 767px) {
  .cn-inscricoes { padding-block: var(--space-64); }
  .cn-lots { margin-top: var(--space-32); }
  .cn-lot__name { font-size: var(--fs-body-s); }
  .cn-lot__status { font-size: var(--fs-caption); }
  .cn-price-wrap { margin-top: var(--space-40); }
  .cn-price { padding: var(--space-24) var(--space-20); gap: var(--space-24); }
  .cn-price__tag { height: 96px; font-size: var(--fs-lot-tag-m); }
  .cn-price-card__int { font-size: var(--fs-price-m); }
  .cn-inscricoes__butterfly-card { width: 110px; top: -54px; right: -24px; }
  .cn-inscricoes__butterfly { width: 170px; left: -60px; bottom: -90px; }
}
