/* kx-statement--navy: port of platform/Unified.tsx (the former kx-steps; markup keeps the .kx-steps classes). Depends on kx-tokens. */
.kx.kx-steps { isolation: isolate; }
.kx.kx-steps > .kx-shell { position: relative; }
.kx.kx-steps .kx-steps__head { display: grid; row-gap: 2.5rem; }
/* Intro in the current pros.com style (client feedback 7 Oct), the same values as kx-statement light:
   compact heavy heading in a one-third column, the right column's lead at 24px in the main ink
   (white on navy, navy on light) instead of blue/green, the body at 16px. */
@media (min-width: 1024px) { .kx.kx-steps .kx-steps__head { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); column-gap: clamp(2.5rem, 4vw, 4rem); } .kx.kx-steps .kx-steps__copy { padding-top: 0.25rem; } }
@media (min-width: 1024px) and (max-width: 1279px) { .kx.kx-steps .kx-steps__head { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } } /* a third left "A Unified / Platform / Experience" (Andre, 8 Oct) */
.kx.kx-steps .kx-steps__heading { max-width: 20ch; font-size: clamp(2.375rem, 3.47vw, 3.125rem); line-height: 1; letter-spacing: -0.025em; font-weight: 800 !important; }
.kx.kx-steps .kx-steps__lead { max-width: 34em; font-size: clamp(1.3125rem, 1.67vw, 1.5rem); line-height: 1.45; letter-spacing: -0.018em; color: var(--kx-ink); }
.kx.kx-steps .kx-steps__p { max-width: 60ch; margin-top: 1.5rem; font-size: 1rem; line-height: 1.55; color: var(--kx-ink); }
.kx.kx-steps.kx-section--dark .kx-steps__p { color: rgb(255 255 255 / 0.85); }
.kx.kx-steps .kx-steps__list { display: grid; margin-top: 5rem; column-gap: 4rem; row-gap: 2.5rem; }
@media (min-width: 1024px) { .kx.kx-steps .kx-steps__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.kx.kx-steps .kx-steps__item { border-top: 1px solid var(--kx-line); padding-top: 1.75rem; }
.kx.kx-steps.kx-section--dark .kx-steps__item { border-top-color: rgb(255 255 255 / 0.15); }
.kx.kx-steps .kx-steps__n { display: block; font-size: var(--kx-text-label); letter-spacing: 0.16em; text-transform: uppercase; font-weight: 600; line-height: 1; color: var(--kx-blue); font-variant-numeric: tabular-nums; }
.kx.kx-steps.kx-section--dark .kx-steps__n { color: var(--kx-green); }
.kx.kx-steps .kx-steps__label { margin-top: 1.25rem; max-width: 16ch; }
/* Numbered items off: the label moves up to the hairline. */
.kx.kx-steps .kx-steps__label:first-child { margin-top: 0; }