/* Seleção de pacote em /arsul/inscricao (mantém o mesmo card da home) */
.valores--inscricao label.valores__card {
  font-family: inherit;
}

.valores--inscricao .valores__card input[type='radio'] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.valores--inscricao .valores__card.is-selected {
  transform: translateY(-2px);
  box-shadow: 0 18px 42px color-mix(in srgb, var(--arsul-ink) 18%, transparent);
}

.valores--inscricao .valores__card.is-selected:focus-within {
  outline: 2px solid var(--arsul-prog-gold);
  outline-offset: 3px;
}

/* Cabeçalho do card: título + indicador de vagas empilhados */
.valores--inscricao .valores__card-head {
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 0.45rem;
  padding-bottom: clamp(0.65rem, 1.6vw, 0.85rem);
}

.valores--inscricao .valores__name {
  max-width: none;
}

/* Indicador de vagas sobre o gradiente da foto (vidro claro, tipografia do site) */
.valores--inscricao .vagas-badge {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.1rem;
  max-width: min(100%, 11.5rem);
  margin: 0;
  padding: 0.3rem 0.6rem 0.35rem;
  border-radius: 0.4rem;
  border: 1px solid rgb(255 255 255 / 0.38);
  background: rgb(255 255 255 / 0.16);
  color: #fff;
  font-family: 'Inter', system-ui, sans-serif;
  line-height: 1.2;
  text-align: center;
  text-shadow: 0 1px 6px rgb(0 0 0 / 0.22);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.valores--inscricao .vagas-badge__valor {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.valores--inscricao .vagas-badge__label {
  font-size: 0.5625rem;
  font-weight: 500;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  opacity: 0.92;
}

.valores--inscricao .vagas-badge--ok {
  border-color: rgb(255 255 255 / 0.45);
  background: rgb(255 255 255 / 0.2);
}

.valores--inscricao .vagas-badge--alerta {
  border-color: color-mix(in srgb, var(--arsul-prog-gold) 65%, #fff);
  background: color-mix(in srgb, var(--arsul-prog-gold) 28%, rgb(255 255 255 / 0.12));
}

.valores--inscricao .vagas-badge--alerta .vagas-badge__valor {
  color: #fff8ef;
}

.valores--inscricao .vagas-badge--off {
  border-color: rgb(255 255 255 / 0.28);
  background: rgb(0 0 0 / 0.28);
  opacity: 0.95;
}

.valores--inscricao .vagas-badge--off .vagas-badge__valor {
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

@media (prefers-reduced-motion: reduce) {
  .valores--inscricao .vagas-badge {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}