/* ---------- corporate page only ---------- */
/* what an in-house team already has, against the one thing it usually cannot
   buy. On the cream band: the "have" column is deliberately quieter than the
   "missing" one, because that is the argument the section is making. */
.gap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;margin-top:2.75rem}
@media(max-width:820px){ .gap{grid-template-columns:1fr} }
.gap-col{
  border:1px solid color-mix(in srgb,var(--ink) 14%,transparent);
  border-radius:var(--r-card);padding:1.6rem 1.5rem;
  background:var(--paper);
}
.gap-col h3{margin-bottom:.9rem}
.gap-col ul{list-style:none;display:flex;flex-direction:column;gap:.65rem}
.gap-col li{font-size:.93rem;line-height:1.55;color:var(--ink-2);padding-left:1.25rem;position:relative}
.gap-col li::before{content:"";position:absolute;left:0;top:.62em;width:.42rem;height:.42rem;border-radius:50%;background:var(--copper)}
.gap-col--have li{color:var(--muted)}
.gap-col--have li::before{background:color-mix(in srgb,var(--ink) 28%,transparent)}
.gap-col--need{background:color-mix(in srgb,var(--copper) 9%,var(--paper));border-color:color-mix(in srgb,var(--copper) 45%,transparent)}
.gap-col--need li{color:var(--ink)}

.entry{margin-top:2.5rem;max-width:52rem}
.entry .keyrow{grid-template-columns:13rem minmax(0,1fr)}
@media(max-width:640px){ .entry .keyrow{grid-template-columns:1fr;gap:.3rem} }