.ux-laptop { margin: 28px auto 8px; max-width: 860px; }
.ux-laptop h2 { margin: 0 0 8px; }
.ux-laptop-lead { margin: 0 0 16px; color: #1e3a8a; font-size: 16px; line-height: 1.45; }
.ux-laptop-screen {
  padding: 14px 14px 0;
  border: 12px solid #0f172a;
  border-bottom-width: 18px;
  border-radius: 18px 18px 8px 8px;
  background: #0f172a;
  box-shadow: 0 22px 40px rgba(15, 23, 42, .18);
}
.ux-laptop-play, .ux-laptop-frame {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: 8px;
  background: #0f172a;
  color: #fff;
  cursor: pointer;
}
.ux-laptop-play { position: relative; overflow: hidden; min-height: 180px; padding: 0; }
.ux-laptop-play img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ux-laptop-play::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(15, 23, 42, .72), rgba(15, 23, 42, .12) 48%, rgba(15, 23, 42, 0));
}
.ux-laptop-play strong, .ux-laptop-play span { position: relative; z-index: 1; }
.ux-laptop-play strong {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 16px;
  border-radius: 999px;
  background: #1d4ed8;
  font-size: 16px;
}
.ux-laptop-play span { display: block; margin-top: 10px; color: #dbeafe; font-size: 15px; }
.ux-laptop-base {
  width: 46%;
  height: 14px;
  margin: 0 auto;
  border-radius: 0 0 10px 10px;
  background: #bfdbfe;
}
@media (prefers-reduced-motion: reduce) {
  .ux-laptop-screen { box-shadow: none; }
}