/* ============================================================
   video.css — Estilos de vídeo para o site SUNDERAK
   ============================================================ */

/* Container principal do vídeo */
.video-certificacao-container {
  position: relative;
  float: right;
  width: 40%;
  max-width: 480px;
  margin-top: 20px;
  margin-left: 20px;
  background: rgba(0, 0, 0, 0.05);
  border-radius: 12px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  padding: 10px;
}

/* Proporção 16:9 para iframes ou vídeos locais */
.ratio-16x9 {
  position: relative;
  width: 100%;
}
.ratio-16x9::before {
  content: "";
  display: block;
  padding-top: 56.25%; /* 16:9 */
}
.ratio-16x9 > iframe,
.ratio-16x9 > video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 10px;
}

/* Legenda abaixo do vídeo */
.video-legenda {
  font-size: 0.9rem;
  text-align: center;
  color: #555;
  margin-top: 8px;
  font-style: italic;
}

/* Responsividade */
@media (max-width: 768px) {
  .video-certificacao-container {
    float: none;
    width: 100%;
    max-width: 100%;
    margin: 15px auto;
  }
}