:root{
    --rv-bg:#0A0A0B;
    --rv-ink:#F2F2F3;
    --rv-soft:#121316;
    --rv-line:rgba(255,255,255,.12);
    --rv-acc:var(--accent, #E45A1F);
  }
  
  .rmx-videos{background:var(--rv-bg); color:var(--rv-ink); padding:48px 16px}
  .rv-wrap{max-width:1200px; margin:0 auto}
  
  .rv-head{text-align:center; max-width:820px; margin:0 auto 18px}
  .rv-kicker{font-weight:900; letter-spacing:.14em; color:#FFB794; text-transform:uppercase; margin:0 0 6px}
  .rv-title{font-weight:900; font-size:clamp(26px,4.4vw,40px); margin:0 0 6px}
  .rv-lead{opacity:.95; line-height:1.55; margin:0 auto}
  
  /* Grid 3 col desktop, 1 col mobile */
  .rv-grid{
    display:grid;
    grid-template-columns: repeat(3,1fr);
    gap:16px;
    margin-top:18px;
  }
  @media (max-width:980px){ .rv-grid{ grid-template-columns: 1fr; gap:12px } }
  
  /* Card */
  .rv-card{
    background:linear-gradient(180deg,#121316,#0E0F12);
    border:1px solid var(--rv-line);
    border-radius:16px; padding:12px;
    box-shadow:0 14px 36px rgba(0,0,0,.45);
  }
  
  /* Frame com ratio 9:16 para vídeo vertical */
  .rv-frame{
    position:relative;
    border-radius:12px; overflow:hidden;
    background:
      radial-gradient(220px 140px at 50% 30%, rgba(228,90,31,.10), transparent),
      linear-gradient(180deg,#15171B,#0E0F12);
    border:1px solid rgba(255,255,255,.10);
    aspect-ratio: 9 / 16;
  }
  
  /* Vídeo ocupa todo o frame (contain para não cortar) */
  .rv-video{
    width:100%; height:100%;
    object-fit:cover; /* use "contain" se preferir bordas letterbox */
    display:block;
  }
  
  /* Botão play central */
  .rv-play{
    position:absolute; inset:0; margin:auto;
    width:68px; height:68px;
    border:none; cursor:pointer;
    display:grid; place-content:center;
    border-radius:999px;
    background:linear-gradient(180deg,#F1733A,var(--rv-acc));
    box-shadow:0 10px 26px rgba(228,90,31,.35), 0 0 0 8px rgba(228,90,31,.18);
    transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease;
  }
  .rv-play svg{ width:32px; height:32px; fill:#fff; transform:translateX(2px) }
  .rv-play:hover{ transform:scale(1.05); box-shadow:0 12px 30px rgba(228,90,31,.45), 0 0 0 10px rgba(228,90,31,.20) }
  .rv-play.is-hidden{ opacity:0; pointer-events:none }
  
  @media (max-width:560px){
    .rmx-videos{ padding:36px 12px }
    .rv-card{ padding:10px; border-radius:14px }
    .rv-frame{ border-radius:12px }
    .rv-play{ width:58px; height:58px; box-shadow:0 0 0 6px rgba(228,90,31,.16) }
    .rv-play svg{ width:26px; height:26px }
  }
  
  /* Caption opcional */
  .rv-cap{
    font-size:.92rem; color:#D6DAE2;
    padding:.55rem .25rem 0;
    text-align:center;
    opacity:.9;
  }