/* Demo video: click-to-play facade. The frame keeps 16:9 so nothing shifts when
   the poster loads or when the iframe replaces the button (no layout shift). */
body.cshq .cshq-video--light { background: var(--cshq-bg-light, #f6f8fb); }
body.cshq .cshq-video--panel { background: var(--cshq-panel, #eef1f6); }
body.cshq .cshq-video--navy  { background: var(--cshq-ink-900); }
body.cshq .cshq-video--navy .cshq-h2,
body.cshq .cshq-video--navy .cshq-video__sub,
body.cshq .cshq-video--navy .cshq-video__cap { color: #fff; }
body.cshq .cshq-video--navy .cshq-eyebrow { color: rgba(255, 255, 255, .72); }

body.cshq .cshq-video__head { max-width: 760px; margin: 0 auto 26px; text-align: center; }
body.cshq .cshq-video__sub {
  margin: 10px 0 0; font-size: 18px; line-height: 1.6; color: var(--cshq-fine-1);
}

body.cshq .cshq-video__frame {
  position: relative; max-width: 900px; margin: 0 auto; aspect-ratio: 16 / 9;
  border-radius: 16px; overflow: hidden; background: var(--cshq-ink-900);
  box-shadow: 0 30px 60px -24px rgba(10, 37, 64, .38), 0 8px 18px -10px rgba(10, 37, 64, .18);
}

body.cshq .cshq-video__facade {
  position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0;
  cursor: pointer; background: none; display: block;
}
body.cshq .cshq-video__facade img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
/* Slight scrim so the play button holds up over a bright poster frame. */
body.cshq .cshq-video__facade::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(10, 37, 64, .18) 0%, rgba(10, 37, 64, .34) 100%);
  transition: background .18s ease;
}
body.cshq .cshq-video__facade:hover::after { background: rgba(10, 37, 64, .18); }

body.cshq .cshq-video__play {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 78px; height: 78px; border-radius: 999px; z-index: 1;
  background: var(--cshq-brand); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 10px 30px -8px rgba(10, 37, 64, .5);
  transition: transform .18s ease;
}
body.cshq .cshq-video__facade:hover .cshq-video__play { transform: translate(-50%, -50%) scale(1.06); }
body.cshq .cshq-video__facade:focus-visible { outline: 3px solid var(--cshq-brand); outline-offset: 3px; }

body.cshq .cshq-video__iframe { width: 100%; height: 100%; border: 0; display: block; }

body.cshq .cshq-video__cap {
  max-width: 900px; margin: 14px auto 0; text-align: center;
  font-size: 14px; color: var(--cshq-fine-1);
}

@media (max-width: 860px) {
  body.cshq .cshq-video__frame { border-radius: 12px; }
  body.cshq .cshq-video__play { width: 60px; height: 60px; }
  body.cshq .cshq-video__play svg { width: 26px; height: 26px; }
  body.cshq .cshq-video__sub { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  body.cshq .cshq-video__facade::after,
  body.cshq .cshq-video__play { transition: none; }
  body.cshq .cshq-video__facade:hover .cshq-video__play { transform: translate(-50%, -50%); }
}