/* Página /campus/ (QR Code de eventos). Pensada primeiro para celular. Prefixo cp-. */
.cp h1 { font-size: var(--t-40); letter-spacing: -0.03em; }
.cp .hero__sub { max-width: none; }

.cp__aviso { margin-top: var(--e-5); padding: var(--e-4); border-radius: var(--raio-p); background: var(--azul-50); border: 1px solid var(--azul-200); color: var(--azul-noite); font-weight: 500; }

.cp__form { margin-top: var(--e-6); display: grid; gap: var(--e-6); }
.cp__passo { display: grid; gap: var(--e-4); }
.cp__passo h2 { display: flex; align-items: center; gap: var(--e-3); font-size: var(--t-22); }
.cp__num { flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--azul-100); color: var(--azul); font-size: var(--t-14); font-weight: 700; display: flex; align-items: center; justify-content: center; letter-spacing: 0; }
.cp__campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-4); }

.cp__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e-3); }
.cp__cartao { width: 100%; display: flex; align-items: flex-start; gap: var(--e-4); padding: var(--e-4); text-align: left; font: inherit; color: inherit; background: #fff; border: 1px solid var(--linha-forte); border-radius: var(--raio); box-shadow: var(--sombra-1); }
button.cp__cartao { cursor: pointer; transition: border-color .2s, box-shadow .2s, transform .2s; }
button.cp__cartao:hover, button.cp__cartao:focus-visible { border-color: var(--azul); box-shadow: var(--sombra-2); outline: none; }
button.cp__cartao:active { transform: scale(.99); }
button.cp__cartao[aria-busy="true"] { opacity: .6; pointer-events: none; }
.cp__icone { flex: none; width: 44px; height: 44px; border-radius: 12px; background: var(--azul-50); color: var(--azul); display: flex; align-items: center; justify-content: center; }
.cp__icone .ic { width: 24px; height: 24px; }
.cp__texto { display: grid; gap: 2px; min-width: 0; }
.cp__texto small { font-size: 13px; font-weight: 600; color: var(--suave); }
.cp__texto strong { font-size: var(--t-18); line-height: 1.25; color: var(--tinta); letter-spacing: -0.01em; }
.cp__texto > span { font-size: 15px; color: var(--suave); }
.cp__texto em, .cp__texto a { margin-top: var(--e-2); display: inline-flex; align-items: center; gap: 6px; font-style: normal; font-size: 15px; font-weight: 600; color: var(--azul); }
.cp__texto em .ic, .cp__texto a .ic { width: 16px; height: 16px; }

.cp__cartao--breve { background: var(--fundo-suave); border-style: dashed; box-shadow: none; }
.cp__cartao--breve .cp__icone { background: #fff; color: var(--suave); }
.cp__cartao--breve small { justify-self: start; padding: 2px 10px; border-radius: 999px; background: var(--azul-100); color: var(--azul); }

.cp__nota { display: flex; align-items: center; gap: var(--e-2); font-size: var(--t-14); color: var(--suave); }
.cp__nota .ic { width: 16px; height: 16px; flex: none; }

.cp__medida { margin-top: var(--e-7); padding: var(--e-5); border-radius: var(--raio); background: var(--azul-noite); color: #C9D8EE; display: grid; gap: var(--e-3); justify-items: start; }
.cp__medida h2 { color: #fff; font-size: var(--t-22); }
/* O botão secundário do site é transparente: sobre o fundo escuro precisa de fundo próprio */
.cp__medida .btn, .cp__medida .btn:hover { background: #fff; color: var(--tinta); border-color: #fff; }
.cp__medida .btn .ic { color: var(--verde-wa); }

@media (max-width: 560px) {
  .cp__campos { grid-template-columns: minmax(0, 1fr); }
  .cp__medida .btn { width: 100%; }
}