/* ==========================================================================
   Ao Vivo — a missa transmitida, com o chat do YouTube, dentro da página
   ========================================================================== */
.av{background:#05070b}
.av-hero{position:relative;padding:150px 0 clamp(40px,5vw,70px);overflow:hidden;isolation:isolate}
.av-hero .amb{position:absolute;inset:-20%;z-index:-2;background-size:cover;background-position:center;filter:blur(80px) saturate(1.3) brightness(.45);transition:background-image 1s}
.av-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(5,7,11,.4),#05070b 92%)}
.av-hero h1{font-family:var(--ff-display);font-weight:400;font-size:clamp(56px,8.6vw,136px);line-height:.9;color:#f7f1e3;margin:16px 0 20px}
.av-hero h1 em{font-style:italic;color:var(--ouro-claro)}
.av-top{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;flex-wrap:wrap}
.av-state{display:inline-flex;align-items:center;gap:12px;padding:12px 20px 12px 16px;border:1px solid rgba(255,255,255,.16);background:rgba(8,10,16,.55);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:13.5px;color:#efe9db}
.av-state .dot{width:10px;height:10px;border-radius:50%;background:#7b8394}
.av-state b{color:#fff;font-weight:600}
.av-state .cd{color:var(--ouro-claro);font-variant-numeric:tabular-nums}
.av.is-live .av-state{border-color:rgba(229,72,77,.6);background:rgba(229,72,77,.12)}
.av.is-live .av-state .dot{background:#e5484d;animation:avPulse 1.6s infinite}
@keyframes avPulse{0%{box-shadow:0 0 0 0 rgba(229,72,77,.65)}70%{box-shadow:0 0 0 14px rgba(229,72,77,0)}100%{box-shadow:0 0 0 0 rgba(229,72,77,0)}}

/* palco: vídeo + chat */
.av-stage{position:relative;padding-bottom:clamp(60px,7vw,100px)}
.av-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;transition:grid-template-columns .8s cubic-bezier(.2,.8,.2,1)}
.av.is-live .av-grid{grid-template-columns:minmax(0,1fr) minmax(300px,380px)}
.av-screen{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden;box-shadow:0 60px 140px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.06)}
.av-screen iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.av-screen .face{position:absolute;inset:0;border:0;padding:0;cursor:pointer;background:#000;display:block;width:100%}
.av-screen .face img{width:100%;height:100%;object-fit:cover;filter:brightness(.62);transition:transform 1.6s cubic-bezier(.19,1,.22,1),filter .8s}
.av-screen .face:hover img{transform:scale(1.03);filter:brightness(.75)}
.av-screen .face .pl{position:absolute;left:50%;top:50%;width:86px;height:86px;margin:-43px 0 0 -43px;border-radius:50%;display:grid;place-items:center;background:rgba(201,162,75,.92);box-shadow:0 0 0 12px rgba(201,162,75,.18),0 20px 50px rgba(0,0,0,.5);transition:transform .5s}
.av-screen .face:hover .pl{transform:scale(1.08)}
.av-screen .face .pl svg{width:28px;height:28px;color:#14100a;margin-left:4px}
.av-screen .face .ov{position:absolute;left:28px;right:28px;bottom:24px;text-align:left;color:#fff}
.av-screen .face .ov small{display:block;font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--ouro-claro)}
.av-screen .face .ov strong{display:block;margin-top:8px;font-family:var(--ff-display);font-weight:400;font-size:clamp(20px,2.4vw,32px);line-height:1.2}
/* o selo fica na faixa abaixo do vídeo (11/11/2026): em cima do player cobria o nome do canal */
.av-screen .badge{display:none}
.av-now .badge{position:relative;vertical-align:middle;line-height:1;display:none;align-items:center;gap:11px;padding:8px 14px 8px 12px;background:linear-gradient(180deg,#ef5156,#d63a40);color:#fff;font-size:11px;font-weight:800;letter-spacing:.22em;box-shadow:0 8px 26px -6px rgba(229,72,77,.75),inset 0 1px 0 rgba(255,255,255,.25);pointer-events:none}
.av.is-live .av-now .badge{display:inline-flex}
.av.is-live .av-now .k{display:none}
.av.is-live .av-now h2{margin-top:14px}
/* selo AO VIVO emitindo ondas: um ponto branco que solta três anéis em sequência */
.av-now .badge .ondas{position:relative;flex:none;width:9px;height:9px;border-radius:50%;background:#fff;box-shadow:0 0 8px rgba(255,255,255,.9)}
.av-now .badge .ondas::before,.av-now .badge .ondas::after,.av-now .badge::before{content:"";position:absolute;border-radius:50%;border:1.5px solid rgba(255,255,255,.85);animation:avOnda 2.1s cubic-bezier(.2,.6,.3,1) infinite;pointer-events:none}
.av-now .badge .ondas::before,.av-now .badge .ondas::after{inset:-1px}
.av-now .badge .ondas::after{animation-delay:.7s}
.av-now .badge::before{left:11.5px;top:50%;width:9px;height:9px;margin-top:-4.5px;animation-delay:1.4s}
@keyframes avOnda{0%{transform:scale(1);opacity:.95}100%{transform:scale(3.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.av-now .badge .ondas::before,.av-now .badge .ondas::after,.av-now .badge::before{animation:none;opacity:0}}
.av-chat{position:relative;display:none;flex-direction:column;background:#0b0e15;border:1px solid rgba(255,255,255,.08);min-height:420px}
.av.is-live .av-chat{display:flex}
.av-chat .hd{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.08);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ouro)}
.av-chat .hd a{font-size:10.5px;letter-spacing:.1em;text-transform:none;color:var(--texto-dim)}
.av-chat iframe{flex:1;width:100%;border:0;min-height:380px;background:#0b0e15}
.av-chat .nota{padding:10px 14px;font-size:12px;line-height:1.5;color:var(--texto-mute);border-top:1px solid rgba(255,255,255,.06)}
.av-now{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;margin-top:22px;flex-wrap:wrap}
.av-now .k{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--ouro)}
.av-now h2{margin-top:8px;font-family:var(--ff-display);font-weight:400;font-size:clamp(22px,2.4vw,32px);color:#f3eddf}
.av-now p{margin-top:6px;font-size:14px;color:var(--texto-dim)}
.av-now .yt{display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border:1px solid var(--linha);color:var(--texto-dim);font-size:12px;letter-spacing:.08em;text-decoration:none}
.av-now .yt:hover{border-color:#fff;color:#fff}
.av-now .yt svg{width:16px;height:16px}

/* lista das últimas transmissões */
.av-list{padding:clamp(70px,8vw,120px) 0;border-top:1px solid var(--linha-sutil)}
.av-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:22px;margin-top:40px}
.av-card{display:block;text-align:left;border:0;padding:0;background:none;color:inherit;cursor:pointer;opacity:0;transform:translateY(16px);transition:opacity .8s,transform .8s cubic-bezier(.2,.8,.2,1)}
.av-cards.in .av-card{opacity:1;transform:none}
.av-card .th{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#0b0e15}
.av-card .th img{width:100%;height:100%;object-fit:cover;filter:brightness(.8) saturate(.95);transition:transform 1.2s cubic-bezier(.19,1,.22,1),filter .6s}
.av-card:hover .th img{transform:scale(1.06);filter:brightness(1)}
.av-card .du{position:absolute;right:10px;bottom:10px;padding:4px 7px;background:rgba(0,0,0,.75);font-size:11.5px;color:#fff;font-variant-numeric:tabular-nums}
.av-card.on .th{box-shadow:0 0 0 2px var(--ouro)}
.av-card small{display:block;margin-top:14px;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ouro)}
.av-card b{display:block;margin-top:6px;font-weight:500;font-size:15px;line-height:1.4;color:#efe9db}
.av-card span{display:block;margin-top:4px;font-size:12.5px;color:var(--texto-mute)}

/* horários */
.av-hor{padding:clamp(70px,8vw,110px) 0;background:linear-gradient(180deg,#05070b,#0a0d14)}
.av-hgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:36px}
.av-h{padding:30px;border:1px solid var(--linha-sutil);background:rgba(255,255,255,.02)}
.av-h span{display:block;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--texto-mute)}
.av-h b{display:block;margin-top:10px;font-family:var(--ff-display);font-weight:400;font-size:clamp(40px,5vw,70px);line-height:1;color:#fff}
.av-h.hoje{border-color:rgba(45,164,159,.6);background:rgba(45,164,159,.08)}
.av-h.hoje span{color:var(--verde-claro)}

@media (max-width:980px){
  .av.is-live .av-grid{grid-template-columns:1fr}
  .av-chat{min-height:480px}
  /* no celular, o selo AO VIVO e o título vêm logo abaixo do vídeo, antes do chat (11/11/2026) */
  .av-stage .wrap{display:flex;flex-direction:column}
  .av-stage .av-grid{display:contents}
  .av-stage .av-screen{order:1}
  .av-stage .av-now{order:2;margin-top:16px}
  .av-stage .av-chat{order:3;margin-top:18px}
}
@media (max-width:620px){ .av-hgrid{grid-template-columns:1fr} }