/* ===== Identidade Me Inscreve Aí =====
   Azul principal #2340d9 · azul-marinho #0b1f4d · laranja de destaque #ff7a1a */
:root {
  --fundo: #f2f5fb;
  --papel: #ffffff;
  --tinta: #0b1f4d;        /* azul-marinho (textos) */
  --tinta-2: #45506b;
  --tinta-3: #5a647d;
  --linha: #dde3f0;
  --cor: #2340d9;          /* azul principal (botões, balão do logo) */
  --cor-escura: #1a31b0;
  --cor-clara: #e8ecff;
  --destaque: #ff7a1a;     /* laranja: só pra detalhes */
  --destaque-claro: #ffb27a;
  --verde: #0d7151;  --verde-claro: #e3f5ee;
  --amarelo: #8c5408; --amarelo-claro: #fdf2dc;
  --vermelho: #c62828; --vermelho-claro: #fdeaea;
  --raio: 14px;
  --sombra: 0 1px 2px rgba(20,23,31,.04), 0 8px 24px rgba(20,23,31,.06);
  --link: #1a31b0;
  --campo: #ffffff;
  --vidro: rgba(255,255,255,.86);
  --brilho-1: rgba(35,64,217,.16);
  --brilho-2: rgba(255,122,26,.10);
  --fundo-desenho: url('fundo-rotas.svg');
  color-scheme: light;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  background: var(--fundo);
  color: var(--tinta);
  line-height: 1.5;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
a { color: var(--link); }
h1, h2, h3 { line-height: 1.15; letter-spacing: -.02em; margin: 0 0 .4em; }
h1 { font-size: clamp(1.6rem, 4vw, 2.1rem); font-weight: 800; }
h2 { font-size: 1.25rem; font-weight: 700; }
h3 { font-size: 1.05rem; font-weight: 700; }
.sub { color: var(--tinta-2); margin: 0 0 1.5rem; }
.miudo { font-size: .82rem; color: var(--tinta-3); }

/* ---------- Topo ---------- */
.topo {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 20px;
  background: var(--papel);
  border-bottom: 1px solid var(--linha);
  position: sticky; top: 0; z-index: 10;
}
/* Logo: "me inscreve" + balão azul com "aí!" */
.marca { color: var(--tinta); text-decoration: none; }
.logo { display: inline-flex; align-items: flex-end; gap: .2em; font-weight: 800; line-height: 1; font-size: 26px; }
.logo-texto { letter-spacing: -.045em; }
.logo-balao { position: relative; display: inline-block; width: 2em; height: 1.46em; margin-bottom: .27em; }
.logo-balao svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.logo-balao span { position: absolute; left: 0; right: 0; top: .08em; text-align: center; color: #fff; font-size: .81em; letter-spacing: -.03em; line-height: 1.3em; }
.logo-claro { color: #fff; }
.topo nav { display: flex; align-items: center; gap: 16px; font-size: .92rem; }
.topo nav a { color: var(--tinta); text-decoration: none; font-weight: 600; }
.topo nav .link-sair { color: var(--tinta-3); font-weight: 500; }

/* ---------- Estrutura ---------- */
.conteudo { flex: 1; width: 100%; max-width: 960px; margin: 0 auto; padding: 28px 16px 48px; }
.rodape {
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px;
  padding: 20px; font-size: .85rem; color: var(--tinta-3);
  border-top: 1px solid var(--linha);
}
.rodape a { color: var(--tinta-3); }

.cartao {
  background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio);
  box-shadow: var(--sombra);
  padding: 28px; max-width: 440px; margin: 0 auto 20px;
}
.cartao-largo { max-width: 760px; }
.bloco { margin-bottom: 36px; }
.bloco-titulo { display: flex; justify-content: space-between; align-items: baseline; }
.bloco-titulo a { font-weight: 600; font-size: .92rem; }

/* ---------- Formulários ---------- */
form label { display: block; font-size: .88rem; font-weight: 600; margin-bottom: 14px; }
input, select {
  display: block; width: 100%; margin-top: 6px;
  font: inherit; font-weight: 500; font-size: 1rem;
  padding: 12px 14px;
  border: 1.5px solid var(--linha); border-radius: 10px;
  background: var(--campo); color: var(--tinta);
  transition: border-color .15s, box-shadow .15s;
}
input:focus, select:focus { outline: none; border-color: var(--cor); box-shadow: 0 0 0 4px var(--cor-clara); }
input:disabled { background: var(--fundo); color: var(--tinta-3); }
small { display: block; font-weight: 400; color: var(--tinta-3); margin-top: 4px; font-size: .8rem; }
.opcional { font-weight: 400; color: var(--tinta-3); }

fieldset { border: 0; padding: 0; margin: 0 0 18px; }
legend {
  font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
  color: var(--tinta-3); margin-bottom: 12px; padding: 0;
}
.grade { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 14px; }
.grade .col-2 { grid-column: span 2; }

.check { display: flex !important; gap: 10px; align-items: flex-start; font-weight: 500 !important; margin: 6px 0 20px !important; }
.check input { width: 20px; height: 20px; margin: 1px 0 0; flex-shrink: 0; accent-color: var(--cor); }

.link-direita { text-align: right; margin: -6px 0 16px; font-size: .88rem; }
.rodape-form { text-align: center; font-size: .92rem; color: var(--tinta-2); margin: 18px 0 0; }
.voltar { text-decoration: none; font-weight: 600; font-size: .9rem; color: var(--tinta-2); }

/* ---------- Botões ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  font: inherit; font-weight: 700; font-size: .95rem;
  padding: 12px 20px; border-radius: 10px; cursor: pointer;
  border: 1.5px solid var(--tinta); background: transparent; color: var(--tinta);
  text-decoration: none; transition: transform .1s, background .15s;
}
.btn:hover { background: var(--tinta); color: #fff; }
.btn:active { transform: scale(.98); }
.btn-cheio { background: var(--cor); border-color: var(--cor); color: #fff; width: 100%; }
.btn-cheio:hover { background: var(--cor-escura); border-color: var(--cor-escura); }
a.btn-cheio, .boas-vindas .btn-cheio, .hero .btn-cheio { width: auto; }
.btn-pequeno { padding: 8px 14px; font-size: .88rem; color: #fff !important; background: var(--tinta); }
.btn-grande { padding: 16px 28px; font-size: 1.05rem; }
.btn[disabled] { opacity: .6; cursor: wait; }

/* ---------- Alertas e selos ---------- */
.alerta { padding: 12px 16px; border-radius: 10px; margin-bottom: 18px; font-size: .92rem; font-weight: 500; }
.alerta ul { margin: 0; padding-left: 18px; }
.alerta-erro    { background: var(--vermelho-claro); color: var(--vermelho); }
.alerta-sucesso { background: var(--verde-claro); color: var(--verde); }
.alerta-aviso   { background: var(--amarelo-claro); color: var(--amarelo); }
.conteudo > .alerta { max-width: 760px; margin-left: auto; margin-right: auto; }

.selo { display: inline-block; font-size: .75rem; font-weight: 700; padding: 5px 10px; border-radius: 999px; white-space: nowrap; }
.selo-verde   { background: var(--verde-claro); color: var(--verde); }
.selo-amarelo { background: var(--amarelo-claro); color: var(--amarelo); }
.selo-cinza   { background: var(--fundo); color: var(--tinta-3); }

/* ---------- Página inicial ---------- */
.hero { padding: 28px 0 40px; }
.hero h1 { font-size: clamp(2.2rem, 7vw, 3.6rem); line-height: 1.02; letter-spacing: -.035em; }
.hero p { color: var(--tinta-2); font-size: 1.1rem; max-width: 460px; margin: 0 0 24px; }

.grade-eventos { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; }
.evento-card { background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; box-shadow: var(--sombra); }
.evento-capa { aspect-ratio: 8 / 5; background: linear-gradient(135deg, var(--tinta), var(--cor)) center/cover; }
.evento-corpo { padding: 16px; }
.evento-corpo p { margin: 0 0 12px; color: var(--tinta-2); font-size: .92rem; }
.evento-data { font-size: .78rem; font-weight: 700; color: var(--cor-escura); text-transform: uppercase; letter-spacing: .05em; }

/* ---------- Minha conta ---------- */
.boas-vindas { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 32px; }
.boas-vindas .sub { margin: 0; }
.vazio { background: var(--papel); border: 1.5px dashed var(--linha); border-radius: var(--raio); padding: 32px; text-align: center; color: var(--tinta-2); }

.lista-inscricoes { display: grid; gap: 12px; }
.inscricao {
  display: flex; align-items: center; gap: 16px;
  background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); padding: 14px 16px;
}
.data-bloco { width: 56px; flex-shrink: 0; text-align: center; background: var(--cor-clara); border-radius: 10px; padding: 8px 0; color: var(--cor-escura); }
.data-bloco strong { display: block; font-size: 1.35rem; line-height: 1; }
.data-bloco span { font-size: .7rem; font-weight: 700; }
.inscricao-info { flex: 1; min-width: 0; }
.inscricao-info h3 { margin: 0; }
.inscricao-info p { margin: 2px 0 0; font-size: .9rem; color: var(--tinta-2); }

.dados { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--linha); border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; margin: 0; }
.dados div { background: var(--papel); padding: 12px 16px; }
.dados dt { font-size: .75rem; color: var(--tinta-3); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.dados dd { margin: 2px 0 0; font-weight: 600; overflow-wrap: anywhere; }

/* ---------- Termos ---------- */
.texto-longo h2 { margin-top: 1.4em; font-size: 1.05rem; }
.texto-longo p { color: var(--tinta-2); }
.aviso-rascunho { background: var(--amarelo-claro); color: var(--amarelo); padding: 10px 14px; border-radius: 10px; font-weight: 600; font-size: .88rem; }

/* ---------- Celular ---------- */
@media (max-width: 640px) {
  .cartao { padding: 22px 18px; }
  .grade { grid-template-columns: 1fr; }
  .grade .col-2 { grid-column: auto; }
  .dados { grid-template-columns: 1fr; }
  .inscricao { flex-wrap: wrap; }
  .inscricao .selo { margin-left: 72px; }
  .topo nav { gap: 10px; }
}

/* ===================== PASSO 3: evento e inscrição ===================== */
a.evento-card { display: block; color: inherit; text-decoration: none; transition: transform .15s, box-shadow .15s; }
a.evento-card:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(20,23,31,.1); }

.evento-topo {
  position: relative; border-radius: var(--raio); overflow: hidden;
  min-height: 240px; aspect-ratio: 16 / 6; display: flex; align-items: flex-end;
  background-color: #0b1f4d;
  background-image: linear-gradient(135deg, #0b1f4d, #2340d9);
  background-size: cover; background-position: center; background-repeat: no-repeat;
  margin-bottom: 28px;
}
.evento-topo::before { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(10,12,18,.85), rgba(10,12,18,.05) 70%); }
.evento-topo-texto { position: relative; padding: 28px; color: #fff; }
.evento-topo-texto h1 { font-size: clamp(1.8rem, 5vw, 2.8rem); margin: 4px 0 6px; }
.evento-topo-texto p { margin: 0; opacity: .85; }
.evento-topo .evento-data { color: var(--destaque-claro); }

.evento-layout { display: grid; grid-template-columns: 1fr 300px; gap: 28px; align-items: start; }
.evento-lateral { position: sticky; top: 84px; }
.cartao-lateral { margin: 0; padding: 22px; }
.cartao-lateral .btn { width: 100%; margin-top: 14px; }
.texto-evento { color: var(--tinta-2); }

.lista-modalidades { display: grid; gap: 10px; }
.modalidade { display: flex; justify-content: space-between; align-items: center; gap: 12px; background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); padding: 16px 18px; }
.modalidade h3 { margin: 0; }
.modalidade p { margin: 2px 0 0; }
.modalidade-preco { text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.modalidade-preco strong { font-size: 1.15rem; }
.modalidade.esgotada { opacity: .55; }

.opcoes-modalidade { display: grid; gap: 10px; }
.opcao {
  display: flex !important; align-items: center; gap: 14px; margin: 0 !important; cursor: pointer;
  border: 1.5px solid var(--linha); border-radius: 12px; padding: 14px 16px; transition: border-color .15s, background .15s;
}
.opcao input { width: 20px; height: 20px; margin: 0; flex-shrink: 0; accent-color: var(--cor); }
.opcao-corpo { flex: 1; display: flex; flex-direction: column; }
.opcao-corpo .miudo { font-weight: 500; }
.opcao-preco { font-weight: 800; font-size: 1.05rem; }
.opcao:has(input:checked) { border-color: var(--cor); background: var(--cor-clara); }
.opcao-off { opacity: .5; cursor: not-allowed; }

.linha-cupom { display: flex; gap: 10px; }
.linha-cupom input { margin: 0; text-transform: uppercase; }
.linha-cupom .btn { flex-shrink: 0; }
.msg-cupom { font-size: .88rem; font-weight: 600; margin: 8px 0 0; min-height: 1.2em; }
.msg-cupom.ok { color: var(--verde); }
.msg-cupom.erro { color: var(--vermelho); }

.resumo { background: var(--fundo); border-radius: 12px; padding: 16px 18px; margin: 8px 0 20px; }
.resumo > div { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; }
.resumo .r-desconto { color: var(--verde); font-weight: 600; }
.resumo .r-total { border-top: 1px solid var(--linha); margin-top: 6px; padding-top: 10px; font-weight: 800; font-size: 1.15rem; }
.resumo .miudo { margin: 8px 0 0; }

.lista-metodos { display: grid; gap: 10px; }
.metodo { display: flex; justify-content: space-between; align-items: center; gap: 12px; border: 1.5px solid var(--linha); border-radius: 12px; padding: 14px 16px; opacity: .7; }
.metodo div { display: flex; flex-direction: column; }
.metodo-total { font-size: 1.05rem; }

.inscricao-acao { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.inscricao-acao .btn-pequeno { background: var(--cor); }
.link-botao { background: none; border: 0; padding: 0; font: inherit; color: var(--tinta-3); text-decoration: underline; cursor: pointer; }

@media (max-width: 800px) {
  .evento-layout { grid-template-columns: 1fr; }
  .evento-lateral { position: static; order: -1; }
}
@media (max-width: 640px) {
  .inscricao-acao { flex-direction: row; margin-left: 72px; }
  .inscricao .inscricao-acao .selo { margin-left: 0; }
  .evento-topo-texto { padding: 20px; }
}

/* ===== Detalhes da identidade ===== */
.destaque-azul { color: var(--cor); }
.hero h1 { font-weight: 800; }
.btn-pequeno { background: var(--tinta); border-color: var(--tinta); }
@media (max-width: 640px) {
  .logo { font-size: 20px; }
}

/* ===== Fundo ilustrado suave (linhas de mapa e percurso) ===== */
body {
  background-color: var(--fundo);
  /* brilho azul no alto à direita, brilho laranja à esquerda e o desenho de relevo/percurso */
  background-image:
    radial-gradient(900px 520px at 88% -6%, var(--brilho-1), transparent 70%),
    radial-gradient(700px 480px at -8% 38%, var(--brilho-2), transparent 70%),
    var(--fundo-desenho);
  background-repeat: no-repeat;
  background-position: top center, top left, top center;
  background-size: 100% 1200px, 100% 1400px, max(1600px, 100%) auto;
}
.topo { background: var(--vidro); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.rodape { background: var(--vidro); }
@media (max-width: 640px) {
  body { background-size: 1100px auto; background-position: 70% 0; }
}

/* ===================== PASSO 4: pagamento e confirmação ===================== */
.abas-pagamento { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 8px; }
.aba {
  font: inherit; text-align: left; cursor: pointer; background: var(--papel); color: var(--tinta);
  border: 1.5px solid var(--linha); border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 2px;
  transition: border-color .15s, background .15s;
}
.aba strong { font-size: 1rem; }
.aba span { font-size: .85rem; color: var(--tinta-2); }
.aba.ativa { border-color: var(--cor); background: var(--cor-clara); }
.painel-pagamento { margin: 18px 0 8px; }
.painel-pagamento .btn-cheio { width: 100%; }

.pix-caixa { display: flex; gap: 24px; align-items: flex-start; background: var(--papel); border: 1.5px solid var(--linha); border-radius: var(--raio); padding: 20px; }
.pix-caixa img { flex-shrink: 0; border-radius: 8px; background: #fff; }
.pix-instrucoes { flex: 1; min-width: 0; }
.pix-instrucoes p { margin: 0 0 8px; font-size: .95rem; }
.pix-instrucoes textarea {
  display: block; width: 100%; margin-top: 6px; font: inherit; font-size: .8rem; padding: 10px; resize: none;
  border: 1.5px solid var(--linha); border-radius: 10px; color: var(--tinta-2); background: var(--fundo); word-break: break-all;
}
.aguardando { display: flex; align-items: center; gap: 10px; font-size: .92rem; color: var(--tinta-2); margin: 14px 0 0; }
.bolinha { width: 10px; height: 10px; border-radius: 50%; background: var(--destaque); animation: pulsar 1.4s infinite; }
@keyframes pulsar { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .35; transform: scale(.8); } }
@media (prefers-reduced-motion: reduce) { .bolinha { animation: none; } }
.msg-pagamento { font-weight: 600; font-size: .92rem; margin: 12px 0 0; padding: 10px 14px; border-radius: 10px; }
.msg-pagamento.erro { background: var(--vermelho-claro); color: var(--vermelho); }
.msg-pagamento.aviso { background: var(--amarelo-claro); color: var(--amarelo); }
.link-miudo { font-size: .85rem; font-weight: 600; }

.confirmada-topo { text-align: center; margin: 8px auto 28px; max-width: 520px; }
.confirmada-topo .sub { margin-bottom: 0; }
.check-grande { display: inline-flex; align-items: center; justify-content: center; width: 72px; height: 72px; border-radius: 50%; background: var(--verde); margin-bottom: 14px; box-shadow: 0 0 0 10px var(--verde-claro); }
.confirmada-grade { display: grid; grid-template-columns: 300px 1fr; gap: 32px; align-items: start; }
.card-stories {
  aspect-ratio: 9 / 16; border-radius: 22px; padding: 26px 22px; color: #fff; display: flex; flex-direction: column; justify-content: space-between;
  background: var(--cor) url('fundo-rotas.svg') no-repeat 30% 0 / 900px auto;
  box-shadow: 0 18px 40px rgba(35,64,217,.28);
}
.cs-rotulo { margin: 0; font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--destaque-claro); }
.cs-frase { margin: 0; font-size: 1.85rem; font-weight: 800; line-height: 1.08; letter-spacing: -.03em; }
.cs-frase span { color: var(--destaque-claro); }
.cs-rodape { display: flex; flex-direction: column; gap: 14px; font-size: .88rem; color: #dfe4ff; }
.card-stories .logo { font-size: 20px; color: #fff; }
.card-stories .logo-balao svg path { fill: #ffffff; }
.card-stories .logo-balao span { color: var(--cor); }
.botoes-compartilhar { display: flex; gap: 10px; flex-wrap: wrap; }
.botoes-compartilhar .btn-cheio { width: auto; }

@media (max-width: 760px) {
  .confirmada-grade { grid-template-columns: 1fr; }
  .card-stories { max-width: 300px; margin: 0 auto; }
}
@media (max-width: 560px) {
  .pix-caixa { flex-direction: column; align-items: center; }
  .abas-pagamento { grid-template-columns: 1fr; }
}

/* Banner da prova no celular: altura fixa em vez de proporção (evita passar da largura da tela) */
.evento-topo { width: 100%; }
.evento-topo-texto { min-width: 0; }
.evento-topo-texto h1 { overflow-wrap: anywhere; }
@media (max-width: 700px) {
  .evento-topo { aspect-ratio: auto; min-height: 220px; }
}

/* ===== Topo no celular: logo sempre numa linha ===== */
.marca { flex-shrink: 0; }
.logo, .logo-texto { white-space: nowrap; }
.topo nav a { white-space: nowrap; }
@media (max-width: 480px) {
  .topo { padding: 12px 16px; }
  .logo { font-size: 19px; }
  /* No celular fica só "Entrar"; o "Criar conta" já aparece grande na página inicial e na tela de login */
  .topo nav .btn-pequeno { display: none; }
  .topo nav a { font-size: .95rem; }
}
@media (max-width: 340px) {
  .logo { font-size: 17px; }
}

/* ===== Pedidos de cancelamento/transferência (atleta) ===== */
textarea { display: block; width: 100%; margin-top: 6px; font: inherit; font-size: 1rem; padding: 12px 14px; border: 1.5px solid var(--linha); border-radius: 10px; resize: vertical; color: var(--tinta); background: var(--campo); }
textarea:focus { outline: none; border-color: var(--cor); box-shadow: 0 0 0 4px var(--cor-clara); }
.regras { background: var(--fundo); border-radius: 12px; padding: 14px 16px; margin: 0 0 18px; }
.regras h2 { font-size: 1rem; margin-bottom: 6px; }
.regras p { margin: 0; color: var(--tinta-2); font-size: .92rem; }
.ajuda-inscricao { margin-top: 26px; border-top: 1px solid var(--linha); padding-top: 16px; }
.ajuda-inscricao > summary { cursor: pointer; font-weight: 700; color: var(--tinta-2); list-style: none; }
.ajuda-inscricao > summary::-webkit-details-marker { display: none; }
.ajuda-inscricao > summary::after { content: ' ▾'; }
.ajuda-inscricao[open] > summary::after { content: ' ▴'; }
.ajuda-inscricao .botoes-compartilhar { margin-top: 10px; }
.pedido-status { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 12px; margin-top: 22px; background: var(--papel); border: 1px solid var(--linha); border-radius: 12px; padding: 14px 16px; }
.pedido-status > div { display: flex; flex-direction: column; }
.pedido-resposta { flex-basis: 100%; margin: 4px 0 0; font-size: .92rem; color: var(--tinta-2); }
.politica { margin-top: 14px; background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); padding: 14px 18px; font-size: .9rem; }
.politica > summary { cursor: pointer; font-weight: 700; }
.politica ul { margin: 10px 0 0; padding-left: 18px; color: var(--tinta-2); }
.politica li { margin-bottom: 6px; }
.politica p { color: var(--tinta-2); margin: 8px 0 0; }

/* Menu com "Resultados": no celular o "Sair" fica dentro de Minha conta */
@media (max-width: 480px) {
  .topo nav .so-pc { display: none; }
  .topo nav { gap: 14px; }
}
@media (max-width: 360px) {
  .topo nav a { font-size: .88rem; }
}
.cartao-lateral .btn-resultado { margin: 0 0 14px; background: var(--tinta); border-color: var(--tinta); }
.rodape-links a { color: var(--tinta-3); }

/* ---------- Carrossel de provas (página inicial) ---------- */
.carrossel { position: relative; margin: 0 0 28px; border-radius: var(--raio); overflow: hidden; background: var(--papel); border: 1px solid var(--linha); box-shadow: var(--sombra); }
.carrossel-trilho { display: grid; }
.carrossel-slide { grid-area: 1 / 1; display: block; color: var(--tinta); text-decoration: none; opacity: 0; visibility: hidden; transition: opacity .6s ease, visibility .6s; }
.carrossel-slide.ativo { opacity: 1; visibility: visible; }
.carrossel-imagem { aspect-ratio: 8 / 3; background: linear-gradient(135deg, var(--tinta), var(--cor)) center/cover no-repeat; }
.carrossel-imagem-card { background-size: cover; }
.carrossel-legenda { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 20px 30px; }
.carrossel-legenda h2 { margin: 2px 0 2px; font-size: 1.35rem; }
.carrossel-legenda p { margin: 0; color: var(--tinta-2); font-size: .95rem; }
.carrossel-acao { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.carrossel-acao .btn { width: auto; }
.carrossel-seta { position: absolute; top: calc((100% - 82px) / 2); transform: translateY(-50%); width: 42px; height: 42px; border-radius: 50%; border: 0; background: rgba(255,255,255,.92); color: var(--tinta); font-size: 1.7rem; line-height: 1; cursor: pointer; box-shadow: 0 2px 10px rgba(0,0,0,.15); display: grid; place-items: center; padding: 0 0 4px; }
.carrossel-seta:hover { background: #fff; color: var(--cor); }
.carrossel-anterior { left: 12px; }
.carrossel-proxima { right: 12px; }
.carrossel-pontos { position: absolute; left: 0; right: 0; bottom: 10px; display: flex; justify-content: center; gap: 6px; }
.carrossel-pontos button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 999px; background: var(--linha); cursor: pointer; transition: width .3s, background .3s; }
.carrossel-pontos button.ativo { width: 22px; background: var(--cor); }

.faixa-conta { display: flex; align-items: center; justify-content: space-between; gap: 16px; background: var(--cor-clara); border-radius: var(--raio); padding: 16px 20px; margin: 0 0 32px; }
.faixa-conta p { margin: 0; color: var(--tinta-2); }
.faixa-conta strong { color: var(--tinta); }
.faixa-conta .btn { width: auto; flex-shrink: 0; }

@media (max-width: 640px) {
  .carrossel { margin-left: -4px; margin-right: -4px; }
  .carrossel-legenda { flex-direction: column; align-items: flex-start; gap: 10px; padding: 12px 14px 28px; }
  .carrossel-legenda h2 { font-size: 1.12rem; }
  .carrossel-acao { width: 100%; justify-content: space-between; }
  .carrossel-seta { width: 34px; height: 34px; font-size: 1.4rem; top: calc((100vw - 32px) * 3 / 16); }
  .carrossel-anterior { left: 8px; } .carrossel-proxima { right: 8px; }
  .faixa-conta { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) { .carrossel-slide { transition: none; } }

/* Página da prova com banner: imagem inteira, sem texto por cima (o banner já costuma ter arte e texto) */
.evento-cabeca { background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; box-shadow: var(--sombra); margin-bottom: 28px; }
.evento-banner { display: block; width: 100%; height: auto; }
.evento-cabeca-texto { padding: 18px 22px 20px; }
.evento-cabeca-texto h1 { font-size: clamp(1.5rem, 4.5vw, 2.3rem); margin: 4px 0 4px; overflow-wrap: anywhere; }
.evento-cabeca-texto p { margin: 0; color: var(--tinta-2); }
@media (max-width: 640px) { .evento-cabeca { margin-left: -4px; margin-right: -4px; } .evento-cabeca-texto { padding: 14px 16px 16px; } }

/* ===== Página da prova: resumo, percursos, programação, local ===== */
.ico { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.evento-etiquetas { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; margin-top: 10px !important; }
.etiqueta { background: var(--cor-clara); color: var(--cor-escura); font-weight: 700; font-size: .78rem; padding: 4px 10px; border-radius: 999px; }

.resumo-prova { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin: -12px 0 18px; }
.resumo-prova > div { display: flex; gap: 12px; align-items: flex-start; background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); padding: 14px 16px; min-width: 0; }
.resumo-prova .ico { width: 22px; height: 22px; color: var(--cor); margin-top: 2px; }
.resumo-prova span { display: flex; flex-direction: column; min-width: 0; }
.resumo-prova small { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-3); font-weight: 700; }
.resumo-prova b { font-size: 1rem; overflow-wrap: anywhere; }
.resumo-prova em { font-style: normal; font-size: .82rem; color: var(--tinta-2); }

.atalhos-prova { display: flex; gap: 6px; overflow-x: auto; margin: 0 0 24px; padding-bottom: 2px; scrollbar-width: none; }
.atalhos-prova a { flex-shrink: 0; text-decoration: none; color: var(--tinta); font-weight: 600; font-size: .88rem; padding: 7px 14px; border-radius: 999px; background: var(--papel); border: 1px solid var(--linha); }
.atalhos-prova a:hover { border-color: var(--cor); color: var(--cor); }
.evento-principal section[id] { scroll-margin-top: 90px; }
.texto-evento h2, .evento-principal h2 { color: var(--tinta); }

.lista-percursos { display: grid; gap: 14px; }
.percurso { background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); padding: 18px; box-shadow: var(--sombra); }
.percurso.esgotada { opacity: .6; }
.percurso-topo { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; }
.percurso-topo h3 { margin: 0 0 8px; font-size: 1.2rem; }
.percurso-dados { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.percurso-dados li { display: inline-flex; align-items: center; gap: 5px; font-size: .82rem; font-weight: 600; color: var(--tinta-2); background: var(--fundo); border-radius: 8px; padding: 5px 9px; }
.percurso-dados .ico { width: 15px; height: 15px; color: var(--cor); }
.percurso-graficos { display: grid; grid-template-columns: 1fr 140px; gap: 12px; margin-top: 16px; }
.percurso-graficos figure { margin: 0; background: var(--fundo); border-radius: 10px; padding: 10px 10px 6px; min-width: 0; }
.percurso-graficos figcaption { font-size: .74rem; color: var(--tinta-3); text-align: center; margin-top: 2px; display: flex; align-items: center; justify-content: center; gap: 5px; }
.perfil-svg, .rota-svg { display: block; width: 100%; height: auto; }
.perfil-svg .area { fill: var(--cor); opacity: .16; }
.perfil-svg .linha { fill: none; stroke: var(--cor); stroke-width: 2; stroke-linejoin: round; }
.perfil-svg .grade { stroke: var(--linha); stroke-width: 1; }
.perfil-svg text { font-size: 10px; fill: var(--tinta-3); font-family: inherit; }
.rota-svg .trajeto { fill: none; stroke: var(--tinta); stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; }
.rota-svg .largada { fill: var(--verde); stroke: #fff; stroke-width: 2; }
.rota-svg .chegada { fill: var(--destaque); stroke: #fff; stroke-width: 2; }
.ponto-largada, .ponto-chegada { width: 8px; height: 8px; border-radius: 50%; display: inline-block; background: var(--verde); }
.ponto-chegada { background: var(--destaque); margin-left: 6px; }
.percurso-obs { margin: 12px 0 0; font-size: .88rem; color: var(--tinta-2); background: var(--amarelo-claro); border-radius: 8px; padding: 8px 12px; }
.percurso-arquivos { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.btn-arquivo { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; font-size: .88rem; }
.dica-gps { margin-top: 12px; font-size: .88rem; color: var(--tinta-2); }
.dica-gps summary { cursor: pointer; font-weight: 600; color: var(--cor-escura); }
.dica-gps p { margin: 8px 0 0; }

.programacao { list-style: none; margin: 0; padding: 0; background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; }
.programacao li { display: flex; gap: 16px; padding: 12px 18px; border-bottom: 1px solid var(--linha); }
.programacao li:last-child { border-bottom: 0; }
.prog-hora { font-weight: 800; color: var(--cor); min-width: 48px; font-variant-numeric: tabular-nums; }

.cartao-local { background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; }
.mapa { display: block; width: 100%; height: 260px; border: 0; background: var(--fundo); }
.local-texto { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px 18px; }
.local-texto p { margin: 0; }
.local-botoes { display: flex; gap: 8px; }
.local-botoes .btn { padding: 9px 14px; font-size: .88rem; }

.preco-a-partir { margin: 12px 0 0; }
.preco-a-partir small { color: var(--tinta-3); }
.preco-a-partir b { font-size: 1.4rem; }
.lateral-links { display: grid; gap: 4px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--linha); }
.lateral-links a, .link-compartilhar { display: flex; align-items: center; gap: 8px; padding: 7px 0; color: var(--tinta); text-decoration: none; font-weight: 600; font-size: .92rem; background: none; border: 0; font-family: inherit; cursor: pointer; text-align: left; }
.lateral-links a:hover, .link-compartilhar:hover { color: var(--cor); }
.lateral-links .ico { color: var(--cor); }

.barra-inscrever { display: none; }
@media (max-width: 800px) {
  .barra-inscrever { display: flex; align-items: center; justify-content: space-between; gap: 12px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; background: var(--papel); border-top: 1px solid var(--linha); padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); box-shadow: 0 -6px 20px rgba(11,31,77,.08); }
  .barra-inscrever small { display: block; font-size: .72rem; color: var(--tinta-3); }
  .barra-inscrever b { font-size: 1.1rem; }
  .barra-inscrever .btn { width: auto; }
  body:has(.barra-inscrever) .rodape { padding-bottom: 90px; }
}
@media (max-width: 640px) {
  .resumo-prova { grid-template-columns: 1fr 1fr; margin-top: -10px; }
  .resumo-prova > div { padding: 12px; gap: 8px; }
  .percurso { padding: 14px; }
  .percurso-topo { flex-direction: column; }
  .percurso-topo .modalidade-preco { align-items: flex-start; text-align: left; }
  .percurso-graficos { grid-template-columns: 1fr 96px; }
  .mapa { height: 220px; }
}
.percurso .modalidade-preco strong, .percurso .modalidade-preco .miudo { white-space: nowrap; }
.perfil-svg text { font-size: 11px; }
@media (max-width: 640px) {
  .percurso-graficos { grid-template-columns: 1fr 104px; gap: 8px; }
  .percurso-graficos figure { padding: 8px 6px 4px; }
  .percurso-graficos .rota figcaption { font-size: .66rem; gap: 3px; flex-wrap: wrap; }
}


/* ===================== MODO NOTURNO ===================== */
html[data-tema="escuro"] {
  --fundo: #0a1020;
  --papel: #121a2e;
  --tinta: #e9eefb;
  --tinta-2: #b3bdd6;
  --tinta-3: #8792ad;
  --linha: #26314c;
  --cor: #4664ff;
  --cor-escura: #3552f0;
  --cor-clara: #1b2753;
  --destaque-claro: #ffb27a;
  --verde: #4fd1a1;  --verde-claro: #11352a;
  --amarelo: #f5c062; --amarelo-claro: #372a0f;
  --vermelho: #ff8a8a; --vermelho-claro: #3d1719;
  --sombra: 0 1px 2px rgba(0,0,0,.3), 0 10px 28px rgba(0,0,0,.35);
  --link: #9fb0ff;
  --campo: #0e1528;
  --vidro: rgba(14,21,40,.82);
  --brilho-1: rgba(70,100,255,.22);
  --brilho-2: rgba(255,122,26,.10);
  --fundo-desenho: url('fundo-rotas-escuro.svg');
  color-scheme: dark;
}
html[data-tema="escuro"] .btn:hover { color: var(--fundo); }
html[data-tema="escuro"] .btn-pequeno { background: var(--cor); border-color: var(--cor); }
html[data-tema="escuro"] .evento-data,
html[data-tema="escuro"] .data-bloco { color: var(--link); }
html[data-tema="escuro"] .carrossel-seta { background: rgba(18,26,46,.92); color: var(--tinta); }
html[data-tema="escuro"] .carrossel-seta:hover { background: var(--papel); color: var(--link); }
html[data-tema="escuro"] .rota-svg .largada, html[data-tema="escuro"] .rota-svg .chegada { stroke: var(--papel); }
html[data-tema="escuro"] .percurso-graficos figure { background: #0e1528; }
html[data-tema="escuro"] .perfil-svg .area { opacity: .28; }
html[data-tema="escuro"] .perfil-svg .linha { stroke: #7f95ff; }
html[data-tema="escuro"] .etiqueta { color: var(--link); }
html[data-tema="escuro"] .faixa-conta { background: #16214a; }
html[data-tema="escuro"] .mapa { filter: brightness(.85) contrast(1.05); }
html[data-tema="escuro"] img { opacity: .97; }

/* Botão de tema (lua / sol) no topo */
.botao-tema { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--linha); background: var(--papel); color: var(--tinta); cursor: pointer; padding: 0; flex-shrink: 0; }
.botao-tema:hover { border-color: var(--cor); color: var(--cor); }
.botao-tema svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.botao-tema .ico-sol { display: none; }
html[data-tema="escuro"] .botao-tema .ico-sol { display: block; }
html[data-tema="escuro"] .botao-tema .ico-lua { display: none; }
/* No escuro, textos em azul usam o tom mais claro pra ter contraste */
html[data-tema="escuro"] .destaque-azul, html[data-tema="escuro"] .resumo-prova .ico, html[data-tema="escuro"] .percurso-dados .ico,
html[data-tema="escuro"] .prog-hora, html[data-tema="escuro"] .lateral-links .ico, html[data-tema="escuro"] .atalhos-prova a:hover { color: var(--link); }
html[data-tema="escuro"] .card-stories .logo-balao span { color: #2340d9; }

/* ===== Comprovante com QR Code ===== */
.qr { display: block; width: 100%; height: auto; border-radius: 8px; }
.comprovante { max-width: 820px; margin: 0 auto; background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; box-shadow: var(--sombra); }
.comprovante-faixa { padding: 12px 22px; font-weight: 800; letter-spacing: .02em; }
.comprovante-ok { background: var(--verde-claro); color: var(--verde); }
.comprovante-aviso { background: var(--amarelo-claro); color: var(--amarelo); }
.comprovante-erro { background: var(--vermelho-claro); color: var(--vermelho); }
.comprovante-corpo { display: grid; grid-template-columns: 240px 1fr; gap: 26px; padding: 24px; }
.comprovante-qr { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.comprovante-qr .qr { background: #fff; padding: 6px; border: 1px solid var(--linha); }
.comprovante-codigo { font-size: 1.6rem; letter-spacing: .14em; margin-top: 6px; }
.qr-invalido { width: 100%; aspect-ratio: 1; display: grid; place-items: center; border: 2px dashed var(--linha); border-radius: 12px; color: var(--tinta-3); font-weight: 700; }
.comprovante-dados h1 { margin: 4px 0; }
.comprovante-nota { margin: 14px 0; }
.comprovante-botoes { display: flex; gap: 8px; flex-wrap: wrap; }
.comprovante-botoes .btn { width: auto; }
.comprovante-mini { display: flex; gap: 16px; align-items: center; margin-top: 18px; padding: 14px; background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); }
.comprovante-mini .qr { width: 128px; flex-shrink: 0; background: #fff; padding: 4px; }
.comprovante-mini p { margin: 4px 0 10px; }
.comprovante-mini .btn { width: auto; }
@media (max-width: 640px) { .comprovante-corpo { grid-template-columns: 1fr; } .comprovante-qr { max-width: 240px; margin: 0 auto; } }
@media print {
  .topo, .rodape, .comprovante-botoes, .barra-inscrever { display: none !important; }
  body { background: #fff !important; }
  .comprovante { box-shadow: none; border-color: #ccc; }
  html[data-tema="escuro"] { --papel: #fff; --tinta: #0b1f4d; --tinta-2: #45506b; --linha: #dde3f0; --fundo: #fff; }
}

/* ===== Inscrição: quem vai correr, outra pessoa, lista de espera ===== */
.quem-corre { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 4px 0 22px; padding: 6px; background: var(--fundo); border-radius: 12px; }
.quem-corre > span { font-weight: 700; font-size: .88rem; color: var(--tinta-2); padding: 0 8px; }
.quem-corre a { text-decoration: none; font-weight: 700; font-size: .9rem; color: var(--tinta-2); padding: 8px 14px; border-radius: 9px; }
.quem-corre a.ativo { background: var(--papel); color: var(--tinta); box-shadow: 0 1px 3px rgba(11,31,77,.12); }
.form-cpf-terceiro { max-width: 420px; }
.form-cpf-terceiro .btn { margin: 4px 0 12px; }
.inscrevendo-outro { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 16px; margin-bottom: 18px; border: 1.5px solid var(--cor); border-radius: 12px; background: var(--cor-clara); }
.inscrevendo-outro div { display: flex; flex-direction: column; }
.inscrevendo-outro small { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; color: var(--tinta-3); }
.inscrevendo-outro b { font-size: 1.1rem; }
.inscrevendo-outro a { font-weight: 700; }
.aviso-espera { display: flex; flex-direction: column; gap: 4px; padding: 12px 16px; margin-bottom: 18px; border-radius: 12px; background: var(--amarelo-claro); color: var(--tinta); }
.aviso-espera.convidado { background: var(--verde-claro); }
.aviso-espera form { margin: 4px 0 0; }
.opcao-linha { display: flex; flex-direction: column; gap: 6px; }
.btn-espera { align-self: flex-start; width: auto; padding: 8px 14px; font-size: .86rem; margin: -2px 0 6px 2px; }
.opcao-linha > .selo { align-self: flex-start; margin: -2px 0 6px 2px; }
.botao-oculto { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.para-quem { color: var(--cor-escura); }
html[data-tema="escuro"] .para-quem { color: var(--link); }
.lista-inscricoes form { margin: 0; }
.link-espera { font-size: .8rem; font-weight: 700; white-space: nowrap; }
[hidden] { display: none !important; }
.dados div:last-child:nth-child(odd) { grid-column: 1 / -1; }
@media (max-width: 480px) {
  .topo nav { gap: 12px; }
  .topo nav a[href="resultados/"] { display: none; }   /* continua no rodapé */
  .quem-corre > span { flex-basis: 100%; padding: 4px 8px 0; }
  .quem-corre a { flex: 1; text-align: center; }
}
html[data-tema="escuro"] .dica-gps summary { color: var(--link); }

/* Aviso de virada de lote */
.aviso-lote { display: block; font-size: .78rem; font-weight: 700; color: var(--tinta-2); margin-top: 2px; }
.aviso-lote.urgente { color: #b94a00; }
html[data-tema="escuro"] .aviso-lote.urgente { color: #ffb27a; }
.selo-laranja { background: #fff0e4; color: #9a3d00; }
html[data-tema="escuro"] .selo-laranja { background: #3a2210; color: #ffb27a; }

/* Filtros da página inicial */
.filtros-provas { display: flex; align-items: stretch; margin: 0 0 18px; background: var(--campo); border: 1px solid var(--linha); border-radius: 12px; overflow: hidden; }
.filtros-provas input, .filtros-provas select { margin: 0; border: 0; border-radius: 0; background-color: var(--campo); box-shadow: none; height: 46px; min-height: 0; font-size: .9rem; }
.filtros-provas input { flex: 1 1 260px; min-width: 180px; padding-left: 40px;
  background: var(--campo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%238a93a8' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='m13 13 4 4'/%3E%3C/svg%3E") no-repeat 14px center; }
.filtros-provas select { flex: 0 0 auto; width: auto; max-width: 170px; text-overflow: ellipsis; border-left: 1px solid var(--linha); padding-right: 30px; cursor: pointer; }
.filtros-provas input:focus, .filtros-provas select:focus { outline: none; box-shadow: inset 0 -2px 0 var(--link); }
.filtros-provas select.ativo { color: var(--link); font-weight: 700; }
.evento-card[hidden] { display: none; }
.evento-corpo .selo + .selo { margin-left: 4px; }
@media (max-width: 720px) {
  .filtros-provas { flex-wrap: wrap; }
  .filtros-provas input { flex: 1 0 100%; min-width: 0; border-bottom: 1px solid var(--linha); }
  .filtros-provas select { flex: 1 1 0; max-width: none; min-width: 0; height: 42px; font-size: .82rem; padding-left: 8px; padding-right: 20px; background-position: right 4px center; text-overflow: ellipsis; }
  .filtros-provas input + select { border-left: 0; }
}

/* Lista pública de inscritos */
.filtros-lista { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.filtros-lista input { flex: 2 1 220px; margin: 0; } .filtros-lista select { flex: 1 1 160px; margin: 0; }
.tabela-lista { overflow-x: auto; border: 1px solid var(--linha); border-radius: 12px; margin-bottom: 12px; }
.tabela-lista table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.tabela-lista th { text-align: left; font-size: .74rem; text-transform: uppercase; letter-spacing: .05em; color: var(--tinta-3); padding: 10px 12px; border-bottom: 1px solid var(--linha); background: var(--fundo); }
.tabela-lista td { padding: 9px 12px; border-bottom: 1px solid var(--linha); }
.tabela-lista tr:last-child td { border-bottom: 0; }
.tabela-lista tr[hidden] { display: none; }
.form-alterar { display: grid; gap: 10px; margin-top: 10px; max-width: 420px; }
.form-alterar label { margin: 0; } .form-alterar .btn { width: auto; justify-self: start; }

/* Indique e ganhe */
.linha-indicacao { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 16px; background: var(--papel); border: 1px solid var(--linha); border-radius: 12px; margin-bottom: 8px; }
.linha-indicacao > div:first-child { display: flex; flex-direction: column; }
.botoes-indicacao { display: flex; gap: 8px; flex-wrap: wrap; }
.botoes-indicacao .btn { width: auto; padding: 8px 14px; font-size: .88rem; margin: 0; }
.cupons-ganhos { display: grid; gap: 8px; }
.cupom-ganho { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 14px; border: 1.5px dashed var(--cor); border-radius: 12px; background: var(--cor-clara); }
.cupom-ganho code { font-weight: 800; font-size: 1.05rem; letter-spacing: .06em; }
.cupom-ganho.usado { border-color: var(--linha); background: var(--papel); opacity: .75; }
.indique-box { margin: 14px 0 0; padding: 16px 18px; }
.indique-box p { margin: 6px 0 10px; }

/* Inscrição em grupo */
.link-grupo { display: block; text-align: center; margin-top: 10px; font-weight: 700; font-size: .9rem; }
.destaque-grupo { color: var(--verde); }
.caixa-adicionar { padding: 16px; border: 1.5px solid var(--cor); border-radius: 14px; background: var(--cor-clara); margin-bottom: 14px; }
.caixa-adicionar .btn { width: auto; }
.linha-cpf-grupo { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }
.linha-cpf-grupo label { flex: 1 1 240px; margin: 0; }
.linha-cpf-grupo .btn { width: auto; }
.aviso-grupo { background: var(--amarelo-claro); color: var(--tinta); padding: 10px 14px; border-radius: 10px; }
.finalizar-grupo { margin-top: 14px; display: grid; gap: 12px; }
.tabela-lista form { margin: 0; }
@media (max-width: 480px) { .quem-corre a { flex: 1 1 30%; padding: 8px 6px; } }

/* Meus resultados e certificado */
.lista-resultados { display: grid; gap: 10px; }
.resultado-item { display: grid; grid-template-columns: 1fr auto auto; gap: 16px; align-items: center; background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); padding: 14px 18px; }
.resultado-item h3 { margin: 0; }
.resultado-item p { margin: 2px 0 0; }
.resultado-numeros { display: flex; gap: 16px; }
.resultado-numeros span { display: flex; flex-direction: column; align-items: center; }
.resultado-numeros small { font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; color: var(--tinta-3); font-weight: 700; }
.resultado-numeros b { font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.resultado-numeros i { font-style: normal; font-size: .8rem; color: var(--tinta-3); font-weight: 600; }
.resultado-acoes { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.certificado-pagina canvas { display: block; width: 100%; max-width: 432px; height: auto; margin: 0 auto 16px; border-radius: 18px; box-shadow: var(--sombra); }
.botoes-certificado { display: flex; gap: 8px; justify-content: center; }
.botoes-certificado .btn { width: auto; }
@media (max-width: 640px) { .resultado-item { grid-template-columns: 1fr; } .resultado-acoes { flex-direction: row; align-items: center; justify-content: space-between; } }

/* Lista aberta dos selects (no Windows o navegador usa o fundo do campo; com fundo transparente ficava branco) */
select option, select optgroup { background-color: var(--papel); color: var(--tinta); }
html[data-tema="escuro"] select option, html[data-tema="escuro"] select optgroup { background-color: #182238; color: #e9edf7; }

/* Vitrine da página inicial: carrossel + 2 provas em destaque ao lado */
.vitrine { margin: 0 0 28px; }
.vitrine .carrossel { margin: 0; }
.vitrine.com-lado { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 14px; width: min(1240px, calc(100vw - 48px)); margin-left: 50%; transform: translateX(-50%); }
.vitrine-lado { display: grid; grid-template-rows: 1fr 1fr; gap: 14px; min-height: 0; }
.destaque-card { position: relative; display: flex; flex-direction: column; min-height: 0; border-radius: var(--raio); overflow: hidden; background: var(--papel); border: 1px solid var(--linha); box-shadow: var(--sombra); color: var(--tinta); text-decoration: none; transition: transform .2s, box-shadow .2s; }
.destaque-card:hover { transform: translateY(-2px); }
.destaque-imagem { flex: 1; min-height: 90px; background: linear-gradient(135deg, var(--tinta), var(--cor)) center/cover no-repeat; }
.destaque-info { display: grid; gap: 1px; padding: 10px 14px 12px; }
.destaque-info strong { font-size: 1rem; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.destaque-info small { color: var(--tinta-2); font-size: .8rem; }
.destaque-info small span::before { content: '· '; color: var(--tinta-2); font-weight: 400; }
.destaque-info .evento-data { font-size: .7rem; }
.texto-verde { color: var(--verde); font-weight: 700; }
.destaque-selo { position: absolute; top: 10px; right: 10px; background: rgba(10,16,32,.78); color: #fff; font-size: .72rem; font-weight: 700; padding: 4px 9px; border-radius: 999px; backdrop-filter: blur(4px); }
@media (max-width: 900px) {
  .vitrine.com-lado { display: block; width: auto; margin-left: 0; transform: none; }
  .vitrine-lado { grid-template-rows: none; grid-template-columns: 1fr 1fr; margin-top: 12px; gap: 10px; }
  .destaque-imagem { flex: none; aspect-ratio: 16 / 9; min-height: 0; }
  .destaque-info { padding: 8px 10px 10px; }
  .destaque-info strong { font-size: .88rem; }
  .destaque-info small { font-size: .74rem; }
}
@media (max-width: 640px) {
  .destaque-info small span { display: none; }
  .destaque-info small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .destaque-selo { top: 6px; right: 6px; font-size: .64rem; padding: 3px 7px; }
}

/* Pesquisa: nome da prova + cidade */
.filtros-provas input + input { border-left: 1px solid var(--linha); }
.filtros-provas .campo-cidade { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%238a93a8' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M9 17s6-5.2 6-10A6 6 0 0 0 3 7c0 4.8 6 10 6 10z'/%3E%3Ccircle cx='9' cy='7' r='2.2'/%3E%3C/svg%3E"); }
@media (max-width: 720px) { .filtros-provas input + input { border-left: 0; border-bottom: 0; } }

/* Faixa fina "crie sua conta" em cima do carrossel */
.faixa-aviso { display: flex; align-items: center; justify-content: center; gap: 14px; margin: -12px 0 14px; padding: 7px 16px; border-radius: 999px; background: var(--cor-clara); color: var(--tinta-2); font-size: .86rem; line-height: 1.3; text-decoration: none; transition: background .2s; }
.faixa-aviso:hover { background: var(--linha); }
.faixa-aviso strong { color: var(--tinta); }
.faixa-aviso b { color: var(--link); white-space: nowrap; }
.faixa-aviso.larga { width: min(1240px, calc(100vw - 48px)); margin-left: 50%; transform: translateX(-50%); }
.faixa-curto { display: none; }
html[data-tema="escuro"] .faixa-aviso { background: #16214a; }
html[data-tema="escuro"] .faixa-aviso:hover { background: #1d2a5c; }
@media (max-width: 900px) { .faixa-aviso.larga { width: auto; margin-left: 0; transform: none; } }
@media (max-width: 760px) {
  .faixa-longo { display: none; } .faixa-curto { display: inline; }
  .faixa-aviso { margin: -14px 0 12px; font-size: .8rem; gap: 8px; padding: 7px 12px; }
}


/* Lista de provas na mesma largura da vitrine: 4 cards por linha no PC */
.bloco-largo { width: min(1240px, calc(100vw - 48px)); margin-left: 50%; transform: translateX(-50%); }
.bloco-largo .grade-eventos { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1000px) { .bloco-largo .grade-eventos { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .bloco-largo { width: auto; margin-left: 0; transform: none; } }
@media (max-width: 760px) { .bloco-largo .grade-eventos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .bloco-largo .grade-eventos { grid-template-columns: 1fr; } }