.hf3 > #your-ai {
  position: relative;
  top: auto;
  height: auto;
  overflow: visible;
}

#your-ai .ai-screen {
  height: auto;
  padding-block: clamp(36px, 6vw, 80px);
}

#your-ai .section-head {
  margin-bottom: 22px;
}

#your-ai .section-head h2 {
  font-size: clamp(34px, 4.2vw, 60px);
  max-width: 22ch;
  margin-bottom: 12px;
}

.handoff-paths {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.handoff-path {
  border: 1px solid #d7dced;
  border-radius: 16px;
  padding: clamp(18px, 2.8vw, 30px);
  background: var(--paper);
}

.handoff-path h3,
.handoff-sources h3 {
  color: var(--blue);
  font: 700 clamp(18px, 2vw, 24px)/1.25 Jakarta, Arial, sans-serif;
  margin: 0 0 8px;
}

.handoff-path p,
.handoff-path-notes p,
.handoff-sources p {
  max-width: 70ch;
  margin: 0;
}

.handoff-path .handoff-interface-note {
  margin-top: 8px;
  color: var(--muted);
  font-size: .875em;
}

.handoff-path-notes {
  margin-top: 20px;
}

.handoff-path-notes p + p {
  margin-top: 8px;
}

.handoff-sources {
  border-top: 1px solid #d7dced;
  padding-top: 20px;
  margin-top: 28px;
}

.handoff-sources .ai-names {
  gap: 8px 16px;
  margin: 12px 0;
}

.handoff-sources .ai-names span {
  font-size: clamp(15px, 1.6vw, 20px);
}

@media (max-width: 760px) {
  .handoff-paths {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .handoff-path p,
  .handoff-path-notes p,
  .handoff-sources p {
    font-size: 16px;
  }
}
