/* The video leads in reading/keyboard order: right on desktop, first on phones. */
.v18-home .v18-ai-video {
  grid-template-columns: minmax(0, 1.14fr) minmax(0, .86fr);
  background: #fff;
}
.v18-home .v18-video-pane { border: 0; }
.v18-home .v18-ai-pane { padding: 24px; border-radius: 22px; }
.v18-home .v18-assistant-heading { display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 14px; }
.v18-home .v18-assistant-heading > div:last-child { flex: 1; min-width: 0; }
.v18-home .v18-assistant-label { color: #547184; font-size: .8rem; }
.v18-home .v18-assistant-heading h2 { margin: 5px 0 0; font-size: clamp(1.5rem, 2.3vw, 2rem); }
.v18-home .v18-ai-graphic { position: relative; inset: auto; flex: 0 0 90px; width: 90px; height: 90px; transform: none; opacity: 1; }
.v18-home .v18-ai-graphic b { width: 66px; height: 66px; background: #e0f6fb; color: #007da8; border-color: #64c8e5; box-shadow: 0 5px 0 #b4e2ee; }
.v18-home .v18-ai-graphic i { width: 88px; background: #8ed6ea; }
.v18-home .v18-ai-graphic svg { width: 40px; height: 40px; }
.v18-home .v18-ai-pane > .v18-reference-help { margin: 12px 0 0; color: #526d80; font-size: .77rem; line-height: 1.9; }
.v18-home .v18-search-sources { flex-wrap: wrap; }
@media (max-width: 760px) {
  .figma-v18-body .v18-home .v18-ai-video {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: center;
    gap: 24px;
    height: auto;
    min-height: calc(100svh - var(--topbar-height, 64px));
    padding: 28px 18px 36px;
    overflow: visible;
    background: #fff;
  }
  .v18-home .v18-video-pane, .v18-home .v18-ai-pane { min-width: 0; padding: 0; }
  .v18-home .v18-ai-pane { padding: 18px; }
  .v18-home .v18-ai-graphic { flex-basis: 64px; width: 64px; height: 64px; }
  .v18-home .v18-ai-graphic b { width: 48px; height: 48px; border-radius: 15px; }
  .v18-home .v18-ai-graphic svg { width: 30px; height: 30px; }
  .v18-home .v18-ai-graphic i { width: 63px; }
  .v18-home .v18-assistant-heading { gap: 10px; margin-bottom: 12px; }
  .v18-home .v18-video-pane > h2, .v18-home .v18-ai-pane h2 { font-size: clamp(1.25rem, 5.2vw, 1.7rem); }
  .v18-home .v18-video-caption { margin-bottom: 0; }
  .v18-home .v18-ai-pane > p { font-size: .8rem; }
  .v18-home .v18-search { min-height: 46px; }
  .v18-home .v18-search input { font-size: .82rem; }
  .v18-home .v18-search button { min-width: 88px; font-size: .78rem; }
  .v18-home .v18-search-sources button { min-height: 44px; }
}