/* Antes e depois: bruto e editado tocando juntos, com a régua dos tempos do vídeo inteiro.
   Medidas iguais às da referência (editiapro.com #prova); cores e fontes são as da LP. */
.ad{--e:.561;--alt:8px;--pega:28px;--fundo:#070816;max-width:1080px;margin:60px auto 0;padding-inline:4px}
.ad-num{font-variant-numeric:tabular-nums}
.ad-head{display:grid;gap:14px;justify-items:center;text-align:center;max-width:820px;margin:0 auto}
.section .ad-head h3{font:700 clamp(1.5rem,7.8vw,2rem)/1.1 Syne,Arial,sans-serif;letter-spacing:-.045em;color:#f1f2f8;margin:0}
.ad-head h3>span{display:block}
.ad-head h3 em{font:inherit;font-style:normal;color:#9299ff}
.section .ad-head p{font:400 1.1875rem/1.4 Manrope,Arial,sans-serif;letter-spacing:-.012em;color:#aaacc7;margin:0;max-width:34em}

.ad-palco{display:grid;grid-template-columns:minmax(0,1fr);gap:34px;margin-top:36px}
.ad-par,.ad-regua{width:100%;max-width:480px;margin-inline:auto}
.ad-par{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;-webkit-user-select:none;user-select:none}
.ad-col{display:grid;gap:10px;min-width:0;margin:0}
.ad-col figcaption{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding-inline:8px;font:600 .875rem/1.43 Manrope,Arial,sans-serif;letter-spacing:-.005em;color:#f1f2f8}
.ad-col figcaption span+span{font-weight:400;color:#aaacc7}
.ad-quadro{position:relative;isolation:isolate;aspect-ratio:9/16;border-radius:22px;overflow:hidden;background:#ffffff14;cursor:pointer}
.ad-quadro::after{content:'';position:absolute;inset:0;z-index:2;border-radius:inherit;box-shadow:inset 0 0 0 1px #ffffff1f;pointer-events:none}
.ad-quadro video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ad-toca{position:absolute;left:50%;bottom:16px;z-index:3;display:grid;place-items:center;width:44px;height:44px;margin-left:-22px;padding:0;border:0;border-radius:50%;background:#f1f2f8;color:var(--fundo);box-shadow:0 0 0 4px var(--fundo);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .32s cubic-bezier(.32,.72,0,1)}
.ad-toca:active{transform:scale(.92)}
.ad-toca:focus-visible{outline:2px solid #aab0ff;outline-offset:2px;box-shadow:0 0 0 7px var(--fundo)}
.ad-toca svg{grid-area:1/1}
.ad-toca .ad-i-pausa,.ad-on .ad-toca .ad-i-toca{display:none}
.ad-on .ad-toca .ad-i-pausa{display:block}

.ad-regua{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;min-width:0}
.ad-linha{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;min-width:0}
.section .ad-conta{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 .5rem;min-width:0;margin:0;font:400 1.0625rem/1.2 Manrope,Arial,sans-serif;letter-spacing:-.01em;color:#aaacc7;white-space:nowrap}
.ad-conta b{font:600 3.5rem/1 Manrope,Arial,sans-serif;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:#f1f2f8}
.ad-l-bruto .ad-conta b{color:#6f7296}
.ad-troca{display:inline-grid}
.ad-troca>span{grid-area:1/1}
.ad-barra{position:relative;height:var(--pega)}
.ad-cheia,.ad-trilho,.ad-clip{position:absolute;left:0;right:0;top:50%;height:var(--alt);margin-top:calc(var(--alt) / -2);border-radius:var(--alt)}
.ad-cheia{background:#6f7296}
.ad-trilho{background:#ffffff1f}
.ad-clip{overflow:hidden}
.ad-fill{position:absolute;inset:0;border-radius:var(--alt);background:linear-gradient(90deg,#4853e6,#8f97ff);transform:translate3d(calc((var(--e) - 1) * 100%),0,0)}
.ad-area{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:pan-y;border-radius:14px;cursor:grab}
.ad-pegou .ad-area{cursor:grabbing}
.ad-area::before{content:'';position:absolute;inset:-10px -14px}
.ad-area:focus-visible{outline:none}
.ad-area:focus-visible .ad-pega i{outline:2px solid #aab0ff;outline-offset:3px}
.ad-pega{position:absolute;left:min(calc(var(--e) * 100%),calc(100% - var(--pega) / 2));top:50%;width:var(--pega);height:var(--pega);margin:calc(var(--pega) / -2) 0 0 calc(var(--pega) / -2);pointer-events:none}
.ad-pega i{display:block;width:100%;height:100%;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #6f7296,0 1px 1.5px #00000024,0 3px 10px #00000052;transition:transform .32s cubic-bezier(.32,.72,0,1)}
.ad-pegou .ad-pega i{transform:scale(1.16)}
.ad-sob{position:relative;height:34px;font:400 .8125rem/1.3 Manrope,Arial,sans-serif;letter-spacing:-.003em}
.ad-cota{position:absolute;left:calc(var(--e) * 100%);right:0;top:7px;height:1px;background:#ffffff38}
.ad-cota::before,.ad-cota::after{content:'';position:absolute;top:-4px;width:1px;height:9px;background:#ffffff38}
.ad-cota::before{left:0}.ad-cota::after{right:0}
.ad-cota-tx{position:absolute;left:calc(var(--e) * 100%);right:0;top:15px;text-align:center;white-space:nowrap;color:#aaacc7;font-variant-numeric:tabular-nums;pointer-events:none}
.ad-cota-tx b{font-weight:600;color:#f1f2f8}
.ad-dica{position:absolute;left:0;top:15px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;color:#8f92b8;opacity:0;pointer-events:none;transition:opacity .32s}
.ad-convida .ad-dica{opacity:1}
.section .ad-fecho{margin:4px 0 0;font:600 1.3125rem/1.2 Manrope,Arial,sans-serif;letter-spacing:-.016em;color:#f1f2f8;text-wrap:balance}

@media(min-width:761px){
 .ad{--alt:10px;--pega:30px;margin-top:104px;padding-inline:0}
 .ad-head{gap:18px}
 .section .ad-head h3{font-size:2.75rem;line-height:1.08}
 .section .ad-head p{font-size:1.3125rem;line-height:1.38;letter-spacing:-.014em}
 .ad-head p span{display:inline-block}
 .ad-palco{gap:48px;margin-top:56px;justify-items:center}
 .ad-par{grid-template-columns:repeat(2,250px);gap:18px;width:auto;max-width:none;margin-inline:0}
 .ad-col{gap:12px}
 .ad-col figcaption{padding-inline:10px;font-size:1.0625rem;letter-spacing:-.01em;line-height:1.3}
 .ad-quadro{border-radius:28px}
 .ad-toca{width:48px;height:48px;margin-left:-24px;bottom:20px;box-shadow:0 0 0 5px var(--fundo)}
 .ad-regua{max-width:518px;gap:18px}
 .ad-conta b{font-size:4.5rem;letter-spacing:-.033em}
 .section .ad-conta{font-size:1.1875rem;letter-spacing:-.012em}
 .ad-linha{gap:4px}
 .ad-sob{height:38px;font-size:.875rem}
 .ad-cota-tx,.ad-dica{top:17px}
 .section .ad-fecho{margin-top:8px;font-size:1.5rem;line-height:1.17;letter-spacing:-.018em}
}
@media(min-width:961px){
 .ad-palco{grid-template-columns:auto minmax(0,1fr);column-gap:clamp(56px,7vw,96px);align-items:center;justify-items:stretch;justify-content:center;margin-top:60px}
 .ad-par{grid-template-columns:repeat(2,clamp(210px,min(calc((100vh - 300px)*.5625),21vw),264px));gap:20px}
 .ad-regua{max-width:460px;margin-inline:0;gap:22px;padding-top:30px}
 .section .ad-fecho{margin-top:14px}
}
@media(min-width:1081px){
 .section .ad-head h3{font-size:3.5rem;line-height:1.07}
 .section .ad-head p{font-size:1.5rem;line-height:1.33;letter-spacing:-.016em}
 .ad-conta b{font-size:5rem;letter-spacing:-.035em}
 .section .ad-conta{font-size:1.3125rem;letter-spacing:-.014em}
 .section .ad-fecho{font-size:1.75rem;line-height:1.14;letter-spacing:-.02em}
}
@media(prefers-reduced-motion:reduce){.ad-toca,.ad-pega i,.ad-dica{transition:none}}
