/**
 * video-checklist block styles（由 style-index.css / style-index-ext.css 迁移拆分）
 */

@layer zj-block {
.zj-x-videochk__panel {
  display: grid;
  grid-template-columns: minmax(480px, 1.15fr) minmax(340px, 0.85fr);
  background: #f6f8fb;
  border: 1px solid var(--zjx-line);
  box-shadow: 0 18px 38px rgba(7, 31, 73, 0.08);
}
.zj-x-videochk__panel figure {
  position: relative;
  min-height: 430px;
  margin: 0;
  overflow: hidden;
  background: #101821;
}
.zj-x-videochk__panel figure img {
  width: 100%;
  height: 100%;
  min-height: 430px;
  object-fit: cover;
  opacity: 0.78;
}
.zj-x-videochk__panel figure::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(7, 31, 73, 0.46), rgba(7, 31, 73, 0.04));
}
.zj-x-videochk__panel button {
  position: absolute;
  left: 34px;
  bottom: 34px;
  z-index: 1;
  display: grid;
  grid-template-columns: 48px auto;
  align-items: center;
  gap: 14px;
  color: var(--zjx-white);
  font-weight: 900;
  background: transparent;
  border: 0;
  cursor: pointer;
}
.zj-x-videochk__panel button::before {
  content: "";
  width: 48px;
  height: 48px;
  background: var(--zjx-action);
  clip-path: polygon(32% 22%, 32% 78%, 78% 50%);
}
.zj-x-videochk__panel > div {
  display: grid;
  align-content: center;
  gap: 18px;
  padding: 46px;
  background: var(--zjx-navy);
  color: var(--zjx-white);
}
.zj-x-videochk__panel > div span {
  color: var(--zjx-action);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
.zj-x-videochk__panel > div h3 {
  margin: 0;
  color: var(--zjx-white);
  font-size: 34px;
  line-height: 1.08;
}
.zj-x-videochk__panel ul {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.zj-x-videochk__panel li {
  position: relative;
  padding-left: 22px;
  color: rgba(255, 255, 255, 0.78);
  line-height: 1.45;
}
.zj-x-videochk__panel li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7em;
  width: 10px;
  height: 2px;
  background: var(--zjx-action);
}
.zj-x-videochk__panel .zj-x-btn {
  justify-self: start;
}
}

@layer zj-responsive {
@media (max-width: 1040px) {
  .zj-x-videochk__panel {
    grid-template-columns: 1fr;
  }
}
}