/* Página da Assinatura (v7). Todo seletor começa em .pg-assinatura. Base: celular de 390 px; telas maiores pelos @media (min-width). */
.pg-assinatura { display: grid; gap: var(--e3); }
.pg-assinatura > * { min-width: 0; }

/* Abertura: superfície da Assinatura (.painel--assinatura, .faixa atrás do cabeçalho), retrato 120 px e cabeça com o nome na cor da Assinatura. */
.pg-assinatura .pg-assinatura__voltar { display: inline-flex; align-items: center; min-height: 44px; color: var(--tinta); font: 600 15px/1 var(--sans); text-decoration: underline; text-underline-offset: 3px; }
.pg-assinatura .pg-assinatura__topo { display: grid; justify-items: start; gap: var(--e4); margin-top: var(--e2); }
.pg-assinatura .pg-assinatura__topo > .cabeca { margin-block-end: 0; }
.pg-assinatura .pg-assinatura__retrato { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; background: var(--branco); }
.pg-assinatura .pg-assinatura__abertura .t-titulo { color: var(--ass); }

/* Painel branco: palco (foto-padrão só desta Assinatura) e a lista de combinações com amostras. */
.pg-assinatura .pg-assinatura__escolha-bloco { display: grid; gap: var(--e5); }
.pg-assinatura .pg-assinatura__escolha-bloco > * { min-width: 0; }
.pg-assinatura .pg-assinatura__palco { margin: 0; display: grid; gap: var(--e3); }
.pg-assinatura .pg-assinatura__quadro { display: grid; place-items: center; aspect-ratio: 4 / 5; max-height: 440px; border-radius: var(--raio-cartao); background: var(--ass-sup); overflow: hidden; }
.pg-assinatura .pg-assinatura__peca { height: 88%; width: auto; max-width: 90%; object-fit: contain; }
/* Com foto por IA da peça sorteada: quadro quadrado, foto ocupando tudo. */
.pg-assinatura .pg-assinatura__quadro--foto { aspect-ratio: 1; }
.pg-assinatura .pg-assinatura__quadro--foto .pg-assinatura__peca { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.pg-assinatura .pg-assinatura__legenda { display: grid; gap: var(--e2); color: var(--suave); font-size: 14px; }
.pg-assinatura .pg-assinatura__lado { display: grid; gap: var(--e4); align-content: start; }
.pg-assinatura .pg-assinatura__combinacoes { margin: 0; padding: 0; border: 0; min-width: 0; }
.pg-assinatura .pg-assinatura__lista { display: grid; gap: var(--e2); }
.pg-assinatura .pg-assinatura__combinacao { display: grid; gap: var(--e2); padding: var(--e3) var(--e4); border: 1px solid var(--filete); border-radius: var(--raio-cartao); background: var(--papel); transition: background-color var(--rapido) var(--curva), border-color var(--rapido) var(--curva); }
.pg-assinatura .pg-assinatura__combinacao:has(input:checked) { background: var(--branco); border-color: var(--ass); box-shadow: inset 0 0 0 1px var(--ass); }
.pg-assinatura .pg-assinatura__combinacao:has(input:focus-visible) { outline: 3px solid var(--oliva); outline-offset: 3px; }
.pg-assinatura .pg-assinatura__escolha { display: flex; align-items: center; gap: var(--e2); min-height: 44px; min-width: 0; font: 600 16px/1.3 var(--sans); cursor: pointer; }
.pg-assinatura .pg-assinatura__escolha::before { content: ''; flex: none; width: 20px; height: 20px; border-radius: 50%; border: 1px solid var(--contorno); background: var(--branco); }
.pg-assinatura .pg-assinatura__combinacao:has(input:checked) .pg-assinatura__escolha::before { border: 6px solid var(--ass); }
.pg-assinatura .pg-assinatura__cta { justify-self: start; }

/* Kits com a Assinatura: grade de 2 colunas (.grade-2 do base.css). */
.pg-assinatura .pg-assinatura__kits { display: grid; gap: var(--e5); }
/* Cartão de kit com foto própria: foto em cima, texto embaixo (mesmas regras de /kits). */
.pg-assinatura .cartao-mosaico__linha { grid-column: 1 / -1; }
.pg-assinatura .cartao-mosaico .botao-seta { grid-column: 2; }
.pg-assinatura .cartao-mosaico__grade > img:only-child { grid-column: 1 / -1; }

/* Outras Assinaturas: pílulas com retrato (visual do interruptor do C12, sem o trilho: é link). */
.pg-assinatura .pg-assinatura__pilulas { display: grid; grid-template-columns: repeat(auto-fit, minmax(158px, 1fr)); gap: var(--e2); }
.pg-assinatura .pg-assinatura__pilula { display: flex; align-items: center; gap: 10px; min-height: 56px; min-width: 0; padding: 6px 14px 6px 6px; border: 1px solid var(--filete); border-radius: var(--raio-pilula); background: rgb(255 253 248 / .7); color: var(--tinta); font: 600 15px/1.2 var(--sans); text-decoration: none; transition: border-color var(--rapido) var(--curva); }
.pg-assinatura .pg-assinatura__pilula-gata { flex: none; width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
@media (hover: hover) {
  .pg-assinatura .pg-assinatura__pilula:hover { border-color: var(--ass); }
}

@media (min-width: 1000px) {
  .pg-assinatura { gap: var(--e5); }
  .pg-assinatura .pg-assinatura__topo { grid-template-columns: 120px minmax(0, 1fr); align-items: center; column-gap: var(--e7); }
  .pg-assinatura .pg-assinatura__escolha-bloco { grid-template-columns: minmax(0, 45%) minmax(0, 1fr); align-items: start; gap: var(--e7); }
}