/* 01a · PROVA · prefixo .prv
   Dois cartões (posição na HackerOne e Hall of Fame) e duas faixas de logos das empresas para as quais
   o time já reportou vulnerabilidades. Logos em branco por filtro (a página abre por file://, máscara não serve).
   Estado final é o padrão: logos paradas em linhas. Só sob html.mov as faixas correm. */
.prv{--secao-y:clamp(4rem,6.6vw,6rem);padding-bottom:clamp(3.5rem,6vw,5.5rem)}
.prv .secao-cab{margin-bottom:clamp(32px,4vw,56px)}
.prv .secao-cab .t-lead{margin-top:var(--e-4)}
.prv-logo{display:block;height:auto;max-width:100%;filter:brightness(0) invert(1);opacity:.86}

.prv-cartoes{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--e-4)}
.prv-cartao{display:flex;flex-direction:column;min-width:0;padding:clamp(24px,2.6vw,36px);border:1px solid var(--linha);border-radius:var(--r-superficie);background:var(--c-sup-1)}
.prv-rank{position:relative;overflow:hidden;isolation:isolate;border-color:color-mix(in srgb,var(--c-laranja) 55%,transparent)}
/* hachura de 15° que morre para a esquerda, no lugar do degradê */
.prv-rank::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:repeating-linear-gradient(105deg,transparent 0 22px,color-mix(in srgb,var(--c-laranja) 26%,transparent) 22px 23px);
  -webkit-mask-image:linear-gradient(100deg,transparent 52%,#000 100%);mask-image:linear-gradient(100deg,transparent 52%,#000 100%)}
.prv-rank-cab{display:flex;justify-content:space-between;gap:var(--e-4)}
.prv-top{display:flex;align-items:baseline;gap:.16em;margin-top:var(--e-6);font:700 clamp(4.5rem,8.4vw,7.5rem)/.86 var(--f-sans);letter-spacing:-.055em;color:var(--texto)}
.prv-top b{color:var(--c-laranja)}
.prv-top-sub{margin-top:var(--e-3);font-size:var(--t-lead);line-height:1.35;color:var(--texto-2)}
.prv-fatos{margin-top:var(--e-8);border-top:1px solid var(--linha)}
.prv-fato{display:grid;grid-template-columns:7.5rem minmax(0,1fr);align-items:baseline;gap:var(--e-4);padding-block:12px;border-bottom:1px solid var(--linha)}
.prv-fato dt{font:400 var(--t-rotulo)/1.3 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--texto-3)}
.prv-fato dd{margin:0;font-size:1rem;line-height:1.35;color:var(--texto-2)}
.prv-fato-on dt{color:var(--c-laranja)}
.prv-fato-on dd{font-weight:700;color:var(--texto)}
.prv-quem{display:flex;align-items:center;gap:var(--e-4);margin-top:auto;padding-top:var(--e-8);font-size:var(--t-pequeno);line-height:1.4;color:var(--texto-2)}
.prv-quem img{flex:none;width:56px;height:56px;border-radius:var(--r-moldura);object-fit:cover}
.prv-quem b{display:block;font-size:1rem;color:var(--texto)}
.prv-sub{margin-top:var(--e-3);max-width:22em;font:700 var(--t-h3)/1.2 var(--f-sans);letter-spacing:-.03em;color:var(--texto)}
.prv-grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;flex:1;margin-top:var(--e-6);border-top:1px solid var(--linha);border-left:1px solid var(--linha)}
.prv-grade li{display:flex;align-items:center;justify-content:center;min-height:76px;padding:var(--e-3);border-right:1px solid var(--linha);border-bottom:1px solid var(--linha)}
.prv-nome{font:700 1.375rem/1 var(--f-sans);letter-spacing:-.03em;color:var(--texto);opacity:.86}

.prv-reportes{margin-top:clamp(40px,5vw,72px)}
.prv-rot{margin-bottom:var(--e-6)}
.prv-faixas{display:grid;gap:var(--e-8)}
.prv-faixa{overflow:hidden}
.prv-trilho{display:flex}
.prv-fila{display:flex;flex-wrap:wrap;align-items:center;gap:var(--e-6) clamp(40px,5vw,80px);padding-inline:var(--margem)}
.prv-fila li{flex:none;display:flex;align-items:center;height:40px}
.prv-copia{display:none}

@media (min-width:900px){
  .prv-cartoes{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
}

/* com movimento: uma linha só, que corre sem emenda (a cópia entra atrás) */
.mov .prv-faixa{-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.mov .prv-trilho{width:max-content;animation:prv-corre 56s linear infinite}
.mov .prv-volta .prv-trilho{animation-direction:reverse}
.mov .prv-fila{flex-wrap:nowrap;padding-inline:0 clamp(40px,5vw,80px)}
.mov .prv-copia{display:flex}
.mov-ponteiro .prv-faixas:hover .prv-trilho{animation-play-state:paused}
@keyframes prv-corre{to{transform:translate3d(-50%,0,0)}}
