/**
 * Homepage video block.
 */

.home-videos__featured {
  margin-bottom: 14px;
}

.home-videos__featured-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.home-videos__thumb {
  position: relative;
  display: block;
  border-radius: var(--card-radius);
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: var(--color-navy-950);
}

.home-videos__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-videos__play {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 52px;
  height: 52px;
  margin: -26px 0 0 -26px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow-soft);
}

.home-videos__play::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 54%;
  transform: translate(-50%, -50%);
  border-style: solid;
  border-width: 9px 0 9px 14px;
  border-color: transparent transparent transparent var(--color-blue-600);
}

.home-videos__play--sm {
  width: 28px;
  height: 28px;
  margin: -14px 0 0 -14px;
}

.home-videos__play--sm::after {
  border-width: 5px 0 5px 8px;
}

.home-videos__featured-overlay {
  position: absolute;
  inset: auto 0 0 0;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  background: linear-gradient(180deg, transparent 0%, rgba(2, 11, 34, 0.85) 100%);
}

.home-videos__featured-title {
  font-size: var(--font-size-sm);
  font-weight: 700;
  line-height: 1.35;
  color: var(--color-white);
}

.home-videos__duration--overlay {
  color: var(--color-white);
}

.home-videos__duration {
  flex-shrink: 0;
  font-size: var(--font-size-xs);
  font-weight: 700;
  color: var(--color-text-muted);
}

.home-videos__list {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
  display: grid;
  gap: 12px;
}

.home-videos__item-link {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  color: inherit;
  text-decoration: none;
}

.home-videos__item-link:hover .home-videos__item-title {
  color: var(--color-blue-600);
}

.home-videos__item-thumb {
  position: relative;
  display: block;
  border-radius: 6px;
  overflow: hidden;
  aspect-ratio: 16 / 10;
  background: var(--color-gray-100);
}

.home-videos__item-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-videos__duration--thumb {
  position: absolute;
  right: 6px;
  bottom: 6px;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(2, 11, 34, 0.78);
  color: var(--color-white);
  font-size: 0.65rem;
  line-height: 1.2;
}

.home-videos__item-title {
  font-size: var(--font-size-sm);
  font-weight: 700;
  line-height: 1.35;
  color: var(--color-blue-600);
  transition: color 180ms ease;
}

.home-videos__cta {
  display: flex;
  width: 100%;
  justify-content: center;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
}