/* Faixa "Pague sua cartela física" — primeira coisa que aparece na página inicial */
.pf-faixa { background: linear-gradient(180deg,#8b0000,#6e0000); color:#fff; padding:14px 16px; border-bottom:4px solid #f5b800; }
.pf-in { max-width:960px; margin:0 auto; display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; justify-content:center; }
.pf-tit { font-size:17px; line-height:1.25; text-align:center; flex:1 1 260px; }
.pf-tit b { color:#ffd54a; }
.pf-tit small { display:block; font-size:12.5px; opacity:.9; margin-top:2px; }
.pf-form { display:flex; gap:8px; flex:1 1 340px; max-width:460px; width:100%; }
.pf-form input { flex:1; min-width:0; font-size:18px; font-weight:700; letter-spacing:.5px; padding:12px 14px; border-radius:10px; border:2px solid #f5b800; background:#fff; color:#222; }
.pf-form input::placeholder { font-weight:500; letter-spacing:0; color:#8a8a8a; }
.pf-form button { font-size:16px; font-weight:800; padding:12px 16px; border:0; border-radius:10px; background:#f5b800; color:#3a1f00; cursor:pointer; white-space:nowrap; }
.pf-form button:hover { background:#ffca2c; }
.pf-msg { flex-basis:100%; text-align:center; font-size:13px; min-height:16px; color:#ffd9d9; margin:0; }
.pf-destaque { animation: pfPulse 1.4s ease-in-out 3; }
@keyframes pfPulse { 50% { box-shadow: inset 0 0 0 4px #f5b800; } }
@media (max-width:520px){ .pf-tit { font-size:16px; } .pf-form { flex-direction:column; } .pf-form button { width:100%; } }

/* Destaque reforçado da entrada rápida */
.pf-faixa { padding:20px 16px 18px; box-shadow:0 6px 18px rgba(0,0,0,.28); position:relative; z-index:2; }
.pf-tit { font-size:22px; font-weight:800; }
.pf-tit b { text-transform:uppercase; letter-spacing:.3px; }
.pf-tit small { font-size:14px; font-weight:500; }
.pf-form { background:rgba(255,255,255,.12); padding:10px; border-radius:14px; border:2px dashed #f5b800; }
.pf-form input { font-size:22px; text-align:center; }
.pf-form button { font-size:18px; padding:14px 20px; box-shadow:0 3px 0 #b88a00; animation:pfBtn 2s ease-in-out infinite; }
@keyframes pfBtn { 50% { box-shadow:0 3px 0 #b88a00, 0 0 0 6px rgba(245,184,0,.45); } }
@media (prefers-reduced-motion:reduce){ .pf-form button{ animation:none; } }
@media (max-width:520px){ .pf-tit { font-size:19px; } }

/* Miniatura da cartela ao lado do texto */
.pf-topo { display:flex; align-items:center; gap:14px; flex:1 1 300px; justify-content:center; }
.pf-mini { width:96px; height:auto; flex:none; border-radius:8px; border:2px solid #f5b800; box-shadow:0 4px 12px rgba(0,0,0,.4); transform:rotate(-4deg); background:#fff; }
.pf-topo .pf-tit { flex:0 1 auto; text-align:left; }
@media (max-width:520px){
  .pf-topo { flex-basis:100%; gap:12px; }
  .pf-mini { width:84px; }
  .pf-topo .pf-tit { font-size:17px; }
  .pf-topo .pf-tit small { font-size:13px; }
}

/* Recorte oficial (paisagem 4:3) */
.pf-mini { width:150px; transform:rotate(-2deg); }
@media (max-width:520px){ .pf-mini { width:118px; } .pf-topo .pf-tit { font-size:16px; } }

/* mensagens ao digitar o número: contagem, conferência e situação da cartela */
.pf-msg:not(:empty){ border-radius:10px; padding:9px 12px; font-size:15px; font-weight:800; line-height:1.35; text-align:center; width:100%; }
.pf-msg.pf-conta{ background:#efe9ff; color:#3b1f8f; border:2px solid #b39ef0; }
.pf-msg.pf-confere{ background:#f1f3f6; color:#374151; border:2px solid #cbd2dc; font-weight:700; }
.pf-msg.pf-paga{ background:#e0f2fe; color:#0c4a6e; border:2px solid #7dd3fc; }
.pf-msg.pf-aguarda{ background:#fff7de; color:#5b4a1a; border:2px solid #ecd58a; }
.pf-msg.pf-livre{ background:#fff; color:#8b0000; border:2px solid #f5b800; }
.pf-msg.pf-erro{ background:#fdeaea; color:#8b0000; border:2px solid #f3b8b8; }
.pf-form button:disabled{ opacity:.7; cursor:not-allowed; animation:none; box-shadow:none; }
.pf-form button.pf-pago{ background:#7dd3fc; color:#0c4a6e; }