.field-video-card {
  min-width: 0;
  overflow: hidden;
  background: #fff;
}
.field-video-frame {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #101617;
}
.field-video-frame video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.field-video-frame.is-playing video { object-fit: contain; }
.field-video-play {
  position: absolute;
  inset: 0;
  margin: auto;
  display: grid;
  place-items: center;
  width: clamp(36px, 6vw, 60px);
  height: clamp(36px, 6vw, 60px);
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, .68);
  cursor: pointer;
}
.field-video-play::after {
  content: "";
  margin-left: 3px;
  border-block: 8px solid transparent;
  border-left: 13px solid #fff;
}
.field-video-play:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.field-video-frame.is-playing .field-video-play { display: none; }
.field-video-label {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-height: clamp(26px, 3.2vw, 44px);
  padding: .32em .95em .32em 33%;
  background: #087b7e;
  color: #fff;
  font-size: clamp(11px, 1.65vw, 21px);
  font-weight: 700;
  line-height: 1.2;
  text-align: right;
  overflow-wrap: anywhere;
}
.field-video-label::before {
  content: "";
  position: absolute;
  inset: 28% auto 0 0;
  width: 30%;
  background: #fff;
  clip-path: polygon(0 0, 68% 0, 100% 100%, 0 100%);
}