/* =====================================================================
   Jornais de Sociologia — camada premium v10 (20/10/2026)
   Direção: "Editorial Luxury" + cascata em profundidade (Z-axis).
   Carrega depois de sociologia.css. Remova este arquivo para voltar ao v9 editorial.
   ===================================================================== */
body[data-materia="soc"]{
  --mola:cubic-bezier(.32,.72,0,1);
  --ouro:#C9A24E; --ouro-claro:#E9D3A0; --noite:#1C1916; --noite2:#2A2420; --vinho:#4A1820;
  --sombra-luxo:0 1px 1px rgba(38,35,31,.04),0 8px 24px -6px rgba(38,35,31,.10),0 28px 60px -20px rgba(38,35,31,.18);
  --sec-y:104px;
}
@media (max-width:640px){body[data-materia="soc"]{--sec-y:64px}}
/* grão de papel muito leve, fixo e sem custo de rolagem */
body[data-materia="soc"]::after{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>")}

/* ================= TOPO ================= */
/* faixa "Nesta edição" volta a correr, devagar */
body[data-materia="soc"] .periodic-strip .ps-track{animation:gizDesliza 120s linear infinite!important;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
body[data-materia="soc"] .ps-rot{background:var(--bordo);color:#fff}
body[data-materia="soc"] .ps-rot::before{content:"";width:6px;height:6px;margin-right:8px;border-radius:50%;background:#fff;animation:ao-vivo 1.6s var(--mola) infinite}
@keyframes ao-vivo{50%{opacity:.25}}
/* fundo do topo: papel com luz suave centrada no título e vinheta nas bordas */
body[data-materia="soc"] .hero{background:
  radial-gradient(ellipse 70% 42% at 50% 18%,#FFFDF8 0%,rgba(255,253,248,0) 70%),
  radial-gradient(ellipse 120% 80% at 50% 50%,transparent 60%,rgba(122,41,53,.05) 100%),var(--papel)!important}
/* entrada do cabeçalho: tinta "imprimindo" uma única vez */
.ed-linha,.nameplate,.ed-lema,.manchete-viva,.hero-kicker,.hero h1,.hero-sub{animation:imprime .9s var(--mola) both}
.nameplate{animation-delay:.08s}.ed-lema{animation-delay:.16s}.manchete-viva{animation-delay:.24s}.hero-kicker{animation-delay:.3s}.hero h1{animation-delay:.36s}.hero-sub{animation-delay:.44s}
@keyframes imprime{from{opacity:0;transform:translateY(14px);filter:blur(6px)}to{opacity:1;transform:none;filter:blur(0)}}
.ed-lema{position:relative}
.ed-lema::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:var(--bordo);transform-origin:0 50%;animation:rolo 1.4s .5s var(--mola) both}
@keyframes rolo{from{transform:scaleX(0)}to{transform:scaleX(1);opacity:0}}
/* manchete do dia datilografada */
.manchete-viva{display:inline-flex;align-items:center;gap:12px;max-width:100%;margin:-10px auto 26px;padding:7px 8px 7px 7px;border-radius:999px;background:var(--branco);box-shadow:0 0 0 1px var(--borda),var(--sombra-1)}
.mv-rot{flex:none;padding:5px 11px;border-radius:999px;background:var(--tinta);color:var(--papel);font:700 10.5px var(--sans);letter-spacing:.16em;text-transform:uppercase}
.mv-txt{font:italic 700 16px/1.2 var(--serif);color:var(--bordo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.mv-cur{flex:none;width:2px;height:18px;margin-left:-8px;margin-right:6px;background:var(--bordo);animation:cursor 1s steps(1) infinite}
@keyframes cursor{50%{opacity:0}}
@media (max-width:420px){.mv-txt{font-size:14px}.mv-rot{font-size:9.5px;padding:4px 9px}}
/* título com destaque marcado à mão */
body[data-materia="soc"] .hero h1 .hl{position:relative;display:inline-block;-webkit-text-fill-color:var(--bordo)}
body[data-materia="soc"] .hero h1 .hl::after{content:"";position:absolute;left:-2%;right:-2%;bottom:.04em;height:.2em;z-index:-1;border-radius:3px;background:rgba(201,162,78,.38);transform-origin:0 50%;animation:marca .8s 1.1s var(--mola) both}
@keyframes marca{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* ================= VSL: iPhone + leque de jornais ================= */
.vc-palco{padding:46px 0 40px}
.vc-luz{width:min(860px,140vw);background:radial-gradient(closest-side,rgba(201,162,78,.20),rgba(241,234,221,.6) 50%,rgba(250,247,240,0))}
.vc-filetes{opacity:.4}
/* leque de jornais reais atrás do celular */
.vc-leque{position:absolute;z-index:1;left:50%;top:50%;width:0;height:0;pointer-events:none}
.lq{position:absolute;width:190px;height:auto;aspect-ratio:424/600;object-fit:cover;border-radius:5px;left:-95px;top:-134px;
  box-shadow:0 0 0 1px rgba(38,35,31,.08),0 18px 40px -10px rgba(38,35,31,.35);transform-origin:50% 120%;transition:transform 1.2s var(--mola),opacity 1.2s var(--mola)}
.lq1{transform:translate(-330px,-120px) rotate(-14deg)}
.lq2{transform:translate(-300px,140px) rotate(-6deg)}
.lq3{transform:translate(-190px,10px) rotate(-10deg) scale(.92);opacity:.85}
.lq4{transform:translate(190px,-10px) rotate(10deg) scale(.92);opacity:.85}
.lq5{transform:translate(300px,-140px) rotate(8deg)}
.lq6{transform:translate(330px,120px) rotate(14deg)}
.vsl-cena:not(.vista) .lq{transform:translate(0,0) rotate(0) scale(.8);opacity:0}
.vsl-cena .lq{animation:lqRespira 8s ease-in-out infinite alternate}
.lq2,.lq5{animation-delay:-3s}.lq3,.lq4{animation-delay:-5s}
@keyframes lqRespira{to{translate:0 -5px}}
.vsl-cena.tocando .lq{animation-play-state:paused}
.vc-pag{display:none!important}
/* moldura de iPhone */
.iphone{position:relative;z-index:3;width:min(380px,82vw);padding:11px;border-radius:58px;
  background:linear-gradient(145deg,#4a4642 0%,#1d1b19 22%,#2c2926 50%,#151311 78%,#3a3632 100%);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.14),inset 0 0 0 4px #0b0a09,0 2px 2px rgba(0,0,0,.2),0 34px 70px -20px rgba(38,35,31,.55),0 70px 110px -50px rgba(122,41,53,.35)}
.iphone::before{content:"";position:absolute;inset:4px;border-radius:54px;pointer-events:none;box-shadow:inset 0 1px 1px rgba(255,255,255,.25)}
.ip-lat{position:absolute;width:4px;border-radius:2px;background:linear-gradient(90deg,#1a1816,#4a4642,#1a1816)}
.ip-acao{left:-3px;top:17%;height:5%}.ip-vol1{left:-3px;top:26%;height:9%}.ip-vol2{left:-3px;top:37%;height:9%}.ip-power{right:-3px;top:28%;height:14%}
.vsl-cena .iphone .vsl-frame{width:100%;border-radius:47px;box-shadow:none!important;background:#000}
.ip-ilha{position:absolute;z-index:4;left:50%;top:12px;width:31%;height:26px;translate:-50% 0;border-radius:20px;background:#000;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.ip-ilha::after{content:"";position:absolute;right:14px;top:8px;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2b3a55,#05070a 60%)}
.vsl-cena .vsl-play{z-index:3}
.vsl-cena .vp-ico{width:96px;height:96px;transition:transform .5s var(--mola)}
.vsl-cena .vp-ico::before{content:"";position:absolute;inset:-14px;border-radius:50%;border:2px solid rgba(255,253,250,.7);animation:playOnda 2.4s var(--mola) infinite}
@keyframes playOnda{0%{transform:scale(.85);opacity:.9}100%{transform:scale(1.45);opacity:0}}
.vsl-cena .vsl-play:hover .vp-ico{transform:scale(1.07)}
/* chamada e etiquetas acompanham o iPhone */
@media (min-width:901px){.vc-chamada{right:calc(50% + 214px);top:44%}.vc-etq-1{left:calc(50% + 214px);top:18%}.vc-etq-2{right:calc(50% + 214px);top:74%}}
.vc-etq{border-radius:999px;padding:9px 16px 9px 10px;box-shadow:0 0 0 1px var(--borda),var(--sombra-luxo)}
.vc-etq svg{box-sizing:content-box;padding:5px;border-radius:50%;background:var(--marfim)}
.vc-etq::before{display:none}
.vc-selos{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;margin:14px auto 0;max-width:none;font-size:13px;font-weight:600;color:var(--cinza)}
.vc-selos span::before{content:"";display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;background:var(--ouro);vertical-align:1px}
@media (max-width:900px){
  .vc-palco{padding:60px 0 0}
  .iphone{width:min(360px,82vw);border-radius:52px;padding:10px}.vsl-cena .iphone .vsl-frame{border-radius:42px}
  .lq{width:120px;left:-60px;top:-85px}
  .lq1{transform:translate(-150px,-150px) rotate(-12deg)}.lq6{transform:translate(150px,130px) rotate(12deg)}
  .lq2{transform:translate(-160px,170px) rotate(-8deg)}.lq5{transform:translate(160px,-170px) rotate(9deg)}
  .lq3,.lq4{display:none}
}
@media (max-width:420px){.lq{width:96px;left:-48px}.lq1{transform:translate(-140px,-150px) rotate(-12deg)}.lq6{transform:translate(140px,130px) rotate(12deg)}.lq2{transform:translate(-146px,170px) rotate(-8deg)}.lq5{transform:translate(146px,-170px) rotate(9deg)}}

/* ================= BOTÕES: pílula com ícone aninhado ================= */
body[data-materia="soc"] .btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;border-radius:999px!important;padding:8px 8px 8px 28px!important;min-height:58px;
  transition:transform .55s var(--mola),box-shadow .55s var(--mola),background-color .4s var(--mola)}
body[data-materia="soc"] .btn .b-txt{position:relative;z-index:1}
.b-ico{position:relative;z-index:1;flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;transition:transform .55s var(--mola)}
.b-ico svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body[data-materia="soc"] .btn-cherry .b-ico{background:rgba(255,255,255,.16);color:#fff}
body[data-materia="soc"] .btn-milk .b-ico{background:var(--tinta);color:var(--papel)}
body[data-materia="soc"] .btn:hover .b-ico{transform:translateX(3px) translateY(-1px) scale(1.06)}
body[data-materia="soc"] .btn:active{transform:scale(.98)!important}
/* botões vermelhos: brilho que passa a cada poucos segundos + halo suave */
body[data-materia="soc"] .btn-cherry{position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(180deg,#8E3240,var(--bordo))!important;box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 10px 26px -6px rgba(122,41,53,.55),0 0 0 0 rgba(122,41,53,.35)!important;
  animation:ctaHalo 3.2s var(--mola) infinite!important}
body[data-materia="soc"] .btn-cherry::after{content:""!important;position:absolute;inset:0;z-index:0;
  background:linear-gradient(105deg,transparent 30%,rgba(255,240,215,.38) 48%,transparent 66%);transform:translateX(-120%);animation:ctaBrilho 3.2s var(--mola) infinite!important}
@keyframes ctaBrilho{0%,55%{transform:translateX(-120%)}85%,100%{transform:translateX(120%)}}
@keyframes ctaHalo{0%,100%{box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 10px 26px -6px rgba(122,41,53,.55),0 0 0 0 rgba(122,41,53,.32)}50%{box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 14px 32px -6px rgba(122,41,53,.6),0 0 0 10px rgba(122,41,53,0)}}
body[data-materia="soc"] .btn-cherry .b-ico{animation:icoEmpurra 3.2s var(--mola) infinite}
@keyframes icoEmpurra{0%,60%,100%{transform:none}72%{transform:translateX(4px)}}
body[data-materia="soc"] .btn-cherry:hover{background:linear-gradient(180deg,#9A3746,var(--bordo-esc))!important}
body[data-materia="soc"] .btn-milk{background:var(--branco)!important;color:var(--tinta);box-shadow:0 0 0 1.5px var(--tinta),var(--sombra-1)!important}
body[data-materia="soc"] .barra-compra .btn{min-height:50px;padding:5px 5px 5px 20px!important}
body[data-materia="soc"] .barra-compra .b-ico{width:38px;height:38px}
@media (prefers-reduced-motion:reduce){body[data-materia="soc"] .btn-cherry,body[data-materia="soc"] .btn-cherry::after,body[data-materia="soc"] .btn-cherry .b-ico,.vp-ico::before,.lq,.mv-cur,.ps-rot::before{animation:none!important}}

/* ================= ESTATÍSTICAS ================= */
body[data-materia="soc"] .stat-row{border:0;gap:10px;max-width:760px}
body[data-materia="soc"] .stat{background:var(--branco)!important;border-radius:20px;padding:16px 10px!important;box-shadow:0 0 0 1px var(--borda),var(--sombra-1)!important;outline:1px solid rgba(201,162,78,.25);outline-offset:4px}
body[data-materia="soc"] .stat+.stat{border-left:0}
body[data-materia="soc"] .stat b{font-size:24px}
@media (max-width:560px){body[data-materia="soc"] .stat:nth-child(n+3){border-top:0}}

/* ================= DEMONSTRAÇÃO ================= */
body[data-materia="soc"] .sec-marfim{background:linear-gradient(180deg,var(--marfim),#F5EFE4)!important}
.ap-card{border-radius:20px;border:0;box-shadow:0 0 0 1px var(--borda),var(--sombra-1);outline:1px solid rgba(201,162,78,.18);outline-offset:5px;transition:transform .6s var(--mola),box-shadow .6s var(--mola),outline-color .6s var(--mola)}
.ap-card:hover{transform:translateY(-4px);outline-color:rgba(122,41,53,.35);box-shadow:0 0 0 1px var(--borda),var(--sombra-luxo)}
.ap-thumb{border-radius:12px}
.ap-jornal{border-radius:6px;box-shadow:0 0 0 1px var(--borda),0 0 0 10px rgba(255,253,250,.8),0 0 0 11px var(--borda),var(--sombra-luxo)}
.ap-rodape{border:0;border-radius:999px;background:var(--branco);padding:14px 26px;box-shadow:0 0 0 1px var(--borda),var(--sombra-1);max-width:max-content}
.colecoes-chips span{border-radius:999px;padding:7px 14px;transition:background .4s var(--mola),color .4s var(--mola)}
.colecoes-chips span:hover{background:var(--tinta);color:var(--papel)}

/* ================= BÔNUS: área escura de destaque ================= */
body[data-materia="soc"] .sec-bonus{background:radial-gradient(ellipse 60% 50% at 50% 0%,rgba(201,162,78,.16),transparent 70%),var(--noite)!important;color:var(--papel)}
body[data-materia="soc"] .sec-bonus .note{color:var(--ouro-claro)}
body[data-materia="soc"] .sec-bonus .note::before,body[data-materia="soc"] .sec-bonus .note::after{background:var(--ouro)}
body[data-materia="soc"] .sec-bonus .title{color:#FBF7EE}
body[data-materia="soc"] .sec-bonus .title::after{border-color:var(--ouro)}
body[data-materia="soc"] .sec-bonus .bonus-total{color:#E6DDCC}
body[data-materia="soc"] .sec-bonus .bonus-total s{color:#A79F93}
body[data-materia="soc"] .sec-bonus .bonus-card{border:0;border-radius:22px;background:#FFFDFA;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 0 0 7px rgba(255,255,255,.05),0 24px 50px -16px rgba(0,0,0,.6)!important}
body[data-materia="soc"] .sec-bonus .bonus-card:hover{transform:translateY(-5px)}
body[data-materia="soc"] .sec-bonus .bonus-img{border-radius:16px 16px 0 0}
body[data-materia="soc"] .bonus-foot .free{background:var(--bordo);color:#fff;padding:4px 11px;border-radius:999px;letter-spacing:.1em;font-size:11px}

/* ================= OFERTA: área de decisão ================= */
body[data-materia="soc"] .sec-oferta{background:
  radial-gradient(ellipse 46% 40% at 62% 56%,rgba(201,162,78,.24),transparent 72%),
  linear-gradient(180deg,#F1EADD,#EDE3D2)!important}
@media (max-width:859px){body[data-materia="soc"] .sec-oferta{background:radial-gradient(ellipse 80% 30% at 50% 36%,rgba(201,162,78,.22),transparent 72%),linear-gradient(180deg,#F1EADD,#EDE3D2)!important}}
.comp-destaque{display:flex;align-items:center;justify-content:center;gap:14px;max-width:640px;margin:28px auto 0;padding:10px 20px 10px 10px;border-radius:999px;background:var(--tinta);color:var(--papel);box-shadow:var(--sombra-luxo)}
.comp-destaque p{margin:0;font-size:15px;line-height:1.35;max-width:none}
.comp-destaque b{color:var(--ouro-claro)}
.cd-rot{flex:none;padding:6px 12px;border-radius:999px;background:var(--ouro);color:var(--tinta);font:800 10.5px var(--sans);letter-spacing:.16em;text-transform:uppercase}
@media (max-width:560px){.comp-destaque{border-radius:20px;flex-direction:column;gap:8px;padding:14px 16px;text-align:center}}
body[data-materia="soc"] .plan{border-radius:28px!important;border:0!important;box-shadow:0 0 0 1px var(--borda),var(--sombra-1)!important;outline:1px solid rgba(38,35,31,.06);outline-offset:6px}
body[data-materia="soc"] .plan.featured{box-shadow:0 0 0 2px var(--bordo),0 0 0 9px rgba(255,253,250,.85),0 0 0 10px rgba(201,162,78,.55),var(--sombra-luxo),0 40px 90px -30px rgba(122,41,53,.45)!important;outline:0;transform:translateY(-6px)}
@media (min-width:860px){body[data-materia="soc"] .plan.featured{transform:translateY(-6px) scale(1.03)}}
body[data-materia="soc"] .plan-flag{border-radius:999px!important;padding:8px 18px!important;background:linear-gradient(90deg,var(--bordo),#8E3240)!important;box-shadow:0 8px 18px -6px rgba(122,41,53,.6)!important}

.por-jornal{width:max-content;margin:6px auto 4px;padding:4px 12px;border-radius:999px;background:rgba(201,162,78,.16);color:var(--tinta);font-size:13px;font-weight:600}
.por-jornal b{color:var(--bordo)}
body[data-materia="soc"] .economia{border-radius:999px;background:var(--bordo);color:#fff;border:0}
body[data-materia="soc"] .promo{border-radius:999px;padding:8px 16px}
.passo b{background:var(--branco)}

/* ================= GARANTIA ================= */
.garantia-box{border-radius:28px;border:0;padding:26px 28px;box-shadow:0 0 0 1px var(--borda),var(--sombra-luxo);outline:1px solid rgba(201,162,78,.3);outline-offset:6px}
.g-selo{width:92px;height:92px;background:radial-gradient(circle at 35% 30%,#FFF6E0,#F1E3C0);box-shadow:inset 0 0 0 2px var(--ouro),inset 0 0 0 6px #FFF6E0,inset 0 0 0 7px var(--ouro),0 10px 20px -8px rgba(138,106,51,.55)}
.g-selo b{color:var(--bordo)}
body[data-materia="soc"] .faq details{border-radius:18px}

/* ================= FECHAMENTO ================= */
body[data-materia="soc"] .sec-tinta{background:radial-gradient(ellipse 50% 45% at 50% 30%,rgba(201,162,78,.16),transparent 72%),var(--noite)!important}
.final-jornais img{transition:transform .8s var(--mola)}
.final-jornais:hover img:nth-child(1){transform:rotate(-14deg) translateX(-18px)}
.final-jornais:hover img:nth-child(3){transform:rotate(14deg) translateX(18px)}

/* ================= REVELAÇÃO AO ROLAR ================= */
.rv-on .rv{opacity:0;transform:translateY(26px);filter:blur(6px);transition:opacity .9s var(--mola) var(--rv-d,0ms),transform .9s var(--mola) var(--rv-d,0ms),filter .9s var(--mola) var(--rv-d,0ms)}
.rv-on .rv.rv-in{opacity:1;transform:none;filter:none}
.rv-on .plan.featured.rv.rv-in{transform:translateY(-6px)}
@media (min-width:860px){.rv-on .plan.featured.rv.rv-in{transform:translateY(-6px) scale(1.03)}}
.lq{max-width:none!important}
/* v10.1: leque mais aberto (4 páginas) e chamada sobre etiqueta de papel, sempre legível */
@media (min-width:901px){
  .lq3,.lq4{display:none}
  .lq1{transform:translate(-360px,-110px) rotate(-12deg)}
  .lq2{transform:translate(-330px,150px) rotate(-5deg)}
  .lq5{transform:translate(330px,-130px) rotate(7deg)}
  .lq6{transform:translate(360px,130px) rotate(13deg)}
  .vc-chamada{z-index:5;top:41%;right:calc(50% + 206px);width:auto;padding:12px 18px 10px;border-radius:18px;background:rgba(255,253,250,.96);box-shadow:0 0 0 1px var(--borda),var(--sombra-luxo)}
  .vc-chamada-txt{font-size:20px;white-space:nowrap}
  .vc-chamada-txt br{display:none}
  .vc-seta{position:absolute;right:-70px;top:30px;width:84px;height:64px;margin:0}
  .vc-etq-1{top:12%}.vc-etq-2{top:80%}
}
@media (min-width:901px) and (max-width:1180px){.lq1{transform:translate(-300px,-110px) rotate(-12deg)}.lq2{transform:translate(-280px,150px) rotate(-5deg)}.lq5{transform:translate(280px,-130px) rotate(7deg)}.lq6{transform:translate(300px,130px) rotate(13deg)}.vc-chamada-txt{font-size:17px}}
body[data-materia="soc"] .plan.featured .plan-name small,body[data-materia="soc"] .plan-name small{color:#7A5C2A!important}