/* app/assets/stylesheets/video.css (or in your main CSS) */
/* Constrains the outer container and centers it */
.video-shell {
  max-width: clamp(320px, 90vw, 64rem); /* ~1024px cap, scales down nicely */
  width: 100%;
  margin-inline: auto;                  /* centers horizontally */
}

/* 16:9 wrapper */
.video-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
}

/* Fill the wrapper */
.video-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Offscreen (kept for bots, hidden from users) */
.offscreen {
  position: absolute;
  left: -5000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}