/* Knowledge-section composition and the original figure geometry. */
.home-knowledge { padding-block: var(--space-48) var(--space-32); }
.home-knowledge-inner {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr);
  gap: var(--space-48);
  align-items: start;
}
.home-knowledge-intro, .home-knowledge-grid { min-width: 0; }
.home-knowledge-intro { padding: var(--space-24) var(--frame-inset); }
.home-knowledge h2 {
  margin: 0 0 var(--space-20);
  font-size: var(--text-h2);
  font-weight: var(--weight-heading);
  line-height: var(--lh-h2);
  letter-spacing: var(--tracking-h2);
}
.home-knowledge h2 span { display: block; }
.home-knowledge-lead {
  margin: 0 0 var(--space-32);
  max-width: var(--reading-measure);
  color: var(--ink-muted);
  font-size: var(--text-lead);
  line-height: var(--lh-lead);
  letter-spacing: var(--tracking-lead);
}
.home-knowledge-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-24); }
.home-knowledge-card { min-height: var(--knowledge-card-min-height); }
.home-knowledge-card-head { display: flex; align-items: start; justify-content: space-between; gap: var(--space-12); }
.home-knowledge-arrow { display: grid; place-items: center; flex: 0 0 var(--space-24); width: var(--space-24); height: var(--space-24); }
.home-knowledge-arrow svg { width: var(--icon-size); height: var(--icon-size); }
.home-knowledge-diagram { position: relative; width: 100%; max-width: 385px; aspect-ratio: 385 / 135; margin: var(--space-8) auto 0; }
.home-knowledge-diagram img { width: 100%; height: auto; }
.home-knowledge-caption { position: absolute; top: 75%; width: 32%; font-size: var(--text-figure); font-weight: var(--weight-label); line-height: var(--lh-label); text-align: center; transform: translateX(-50%); }
.home-knowledge-diagram--sip .home-knowledge-caption:nth-child(1) { left: 13%; }
.home-knowledge-diagram--sip .home-knowledge-caption:nth-child(2) { left: 50%; }
.home-knowledge-diagram--sip .home-knowledge-caption:nth-child(3) { left: 87%; top: 69%; }
.home-knowledge-diagram--comparison .home-knowledge-caption, .home-knowledge-diagram--sms .home-knowledge-caption { top: 74%; width: 48%; font-size: var(--text-label); }
.home-knowledge-diagram--comparison .home-knowledge-caption:first-child, .home-knowledge-diagram--sms .home-knowledge-caption:first-child { left: 19%; }
.home-knowledge-diagram--comparison .home-knowledge-caption:last-child, .home-knowledge-diagram--sms .home-knowledge-caption:last-child { left: 80%; }
.home-knowledge-caption small { display: block; margin-top: var(--space-4); color: var(--ink-muted); font-size: var(--text-figure); font-weight: var(--weight-body); line-height: var(--lh-lead); }
.home-knowledge-diagram--comparison::before { content: ""; position: absolute; top: 7px; bottom: 7px; left: 50%; border-left: var(--rule-width) dashed var(--surface-divider); }
.home-knowledge-versus { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: var(--space-24); height: var(--space-24); background: var(--surface-raised); color: var(--ink-muted); font-size: var(--text-figure); font-weight: var(--weight-strong); transform: translate(-50%, -50%); }
@media (max-width: 1023px) {
  .home-knowledge-inner, .home-knowledge-grid { grid-template-columns: minmax(0, 1fr); }
  .home-knowledge-inner { gap: var(--space-32); }
  .home-knowledge h2 span { display: inline; }
}