/* Responsive video component. Namespaced to avoid colliding with existing layout. */
.kk-youtube { margin: 2rem 0; max-width: 100%; }
.kk-youtube__player { position: relative; width: 100%; aspect-ratio: 16 / 9;
  min-height: 180px; background: #17191c; overflow: hidden; border-radius: 5px; }
.kk-youtube__load { cursor: pointer; display: flex; align-items: center;
  justify-content: center; flex-direction: column; gap: .7rem; width: 100%; height: 100%;
  padding: 1.5rem; border: 0; background: linear-gradient(140deg,#303034,#121315);
  color: #fff; font: inherit; text-align: center; }
.kk-youtube__load:hover { background: linear-gradient(140deg,#37373a,#191b1e); }
.kk-youtube__load:focus-visible { outline: 3px solid #ffd400; outline-offset: -5px; }
.kk-youtube__play { display: grid; place-items: center; width: 70px; height: 50px;
  padding-left: 4px; background: #c00; color: white; border-radius: 12px; font-size: 24px; }
.kk-youtube__label { font-weight: 750; font-size: clamp(1rem,2.4vw,1.3rem); }
.kk-youtube__privacy { font-size: .82rem; color: #e4e4e4; max-width: 32rem; }
.kk-youtube__player iframe { display: block; width: 100%; height: 100%;
  border: 0; position: absolute; inset: 0; }
.kk-youtube__caption { display: grid; gap: .3rem; padding-top: .75rem;
  font-size: .88rem; line-height: 1.5; color: inherit; }
.kk-youtube__caption strong { font-size: 1rem; }
.kk-youtube__caption a { width: fit-content; text-underline-offset: 3px; }
.kk-youtube__error { font-style: italic; }
@media (max-width: 450px) {
  .kk-youtube__load { padding: .65rem; gap: .45rem; }
  .kk-youtube__play { width: 58px; height: 42px; }
  .kk-youtube__privacy { font-size: .72rem; }
}