/* =========================================================
   SEÇÃO 7: PROVA SOCIAL (stories 3D + antes e depois)
   ========================================================= */
.stories{position:relative;width:100%;max-width:960px;margin:0 auto;height:calc(min(66vw,300px) * 16 / 9 + 14px);perspective:1300px;touch-action:pan-y}
.story{position:absolute;left:50%;top:0;width:min(66vw,300px);aspect-ratio:9/16;margin-left:calc(min(66vw,300px) / -2);border:0;padding:0;border-radius:26px;overflow:hidden;color:#fff;text-align:left;background:var(--c-escuro-2);box-shadow:0 46px 80px -34px rgba(0,0,0,.8),0 0 0 2px var(--c-escuro-3);transition:transform .9s var(--ease),filter .9s,opacity .9s}
.story .st-ph{position:absolute;inset:60px 16px 120px;display:grid;place-items:center;text-align:center;border:3px dashed rgba(255,255,255,.25);border-radius:20px;font-family:var(--f-titulo);font-size:18px;line-height:1.2;color:var(--c-suave-esc);padding:10px}
.st-barras{position:absolute;left:10px;right:10px;top:10px;z-index:3;display:flex;gap:4px}
.st-barras span{flex:1;height:4px;border-radius:4px;background:rgba(255,255,255,.3);overflow:hidden}
.st-barras i{display:block;height:100%;width:0;background:var(--c-acido)}
.st-barras span.feito i{width:100%}
.story.ativo .st-barras span.agora i{animation:barra-st 5.5s linear forwards}
.stories.parado .story.ativo .st-barras span.agora i{animation-play-state:paused}
@keyframes barra-st{to{width:100%}}
.st-topo{position:absolute;left:12px;right:12px;top:24px;z-index:3;display:flex;align-items:center;gap:8px;font-weight:700;font-size:16px}
.st-topo .av{width:34px;height:34px;border-radius:50%;background:var(--c-acido);color:var(--c-escuro);display:grid;place-items:center;font-family:var(--f-titulo)}
.st-txt{position:absolute;left:14px;right:14px;bottom:16px;z-index:3;font-size:17px;font-weight:700;line-height:1.3}
.st-txt small{display:block;font-weight:400;color:var(--c-suave-esc);margin-top:6px;font-size:16px}
.story .pp{position:absolute;left:50%;top:44%;z-index:3;width:66px;height:66px;margin:-33px 0 0 -33px;border-radius:50%;display:grid;place-items:center;background:var(--c-acido);color:var(--c-escuro);opacity:0;transform:scale(.6);transition:opacity .5s,transform .6s var(--mola)}
.story.ativo .pp{opacity:1;transform:none}
.controles{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:22px;flex-wrap:wrap}
.seta-g{width:62px;height:62px;border-radius:50%;border:0;background:var(--c-acido);color:var(--c-escuro);font-size:24px;display:grid;place-items:center;box-shadow:0 14px 24px -12px rgba(var(--rgb-acido),.8);transition:transform .15s}
.seta-g:active{transform:scale(.9)}
.f-gelo .seta-g,.f-branco .seta-g{box-shadow:0 0 0 3px var(--c-escuro)}
.pausa{min-height:56px;padding:0 20px;border-radius:999px;border:3px solid var(--c-acido);background:transparent;color:var(--c-acido);font-family:var(--f-titulo);font-size:17px;display:inline-flex;align-items:center;gap:8px}
.f-gelo .pausa,.f-branco .pausa{border-color:var(--c-escuro);color:var(--c-escuro)}
.pausa[aria-pressed="true"]{background:var(--c-acido);color:var(--c-escuro)}
.ad-g{display:grid;gap:22px;align-items:center;max-width:960px;margin:64px auto 0}
.ad{position:relative;width:100%;max-width:400px;margin:0 auto;aspect-ratio:4/5;border-radius:28px;overflow:hidden;touch-action:pan-y;box-shadow:0 0 0 3px var(--c-escuro-3),var(--sombra);--p:50%}
.ad .lado-ad{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:24px;font-family:var(--f-titulo);font-size:20px;line-height:1.2}
.ad .antes{background:#16505F;color:var(--c-suave-esc)}
.ad .depois{background:#1D6275;color:#fff;clip-path:inset(0 0 0 var(--p))}
.ad .lab{position:absolute;top:14px;z-index:4;font-weight:700;font-size:16px;padding:4px 12px;border-radius:999px}
.ad .lab.a{left:14px;background:rgba(0,0,0,.6);color:#fff}.ad .lab.b{right:14px;background:var(--c-acido);color:var(--c-escuro)}
.ad .linha{position:absolute;top:0;bottom:0;left:var(--p);width:4px;margin-left:-2px;background:var(--c-acido);z-index:5;pointer-events:none}
.ad .pega{position:absolute;top:50%;left:var(--p);width:60px;height:60px;margin:-30px 0 0 -30px;border-radius:50%;background:var(--c-acido);color:var(--c-escuro);display:grid;place-items:center;font-size:22px;font-weight:700;z-index:6;pointer-events:none;box-shadow:0 8px 24px rgba(0,0,0,.4)}
.ad input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;z-index:7;cursor:ew-resize}
.ad-tx h3{font-size:clamp(28px,7vw,40px);margin-bottom:10px}
.ad-tx p{color:var(--c-suave-esc)}
.regras{list-style:none;display:grid;gap:8px;margin-top:14px}
.regras li{display:flex;gap:10px;font-size:19px;font-weight:700}
.regras li::before{content:"✓";color:var(--c-acido)}
@media(min-width:900px){.stories{height:calc(300px * 16 / 9 + 14px)}.ad-g{grid-template-columns:1fr 1fr;gap:50px}}

