/* Thrift Plan page only: savings gap stats, capability sub-lines, core features, benefits, projection, Tharaa note. */

/* a long sentence heading inside a split column reads better one step smaller */
/* savings gap */
.gap { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 80px); align-items: start; padding-top: 28px; border-top: 1px solid var(--line); }
.gap-copy { display: grid; gap: 12px; }
.gap-copy h3 { font: 600 var(--step-2)/1.15 var(--font-display); letter-spacing: -.01em; }
.gap-copy p { color: var(--fg-muted); max-width: 44ch; }
.stats { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 3vw, 36px); }
.stats > div { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 10px; }
.stats dd { margin: 0; font: 600 var(--step-4)/1 var(--font-display); color: var(--accent); letter-spacing: -.02em; white-space: nowrap; }
.stats dt { color: var(--fg-muted); font-size: .97rem; line-height: 1.45; }
.stats dt small { display: block; margin-top: 4px; font-size: .85rem; color: var(--fg); font-weight: 500; }
.source-note { margin-top: 22px; color: var(--fg-muted); font-size: .82rem; }
@media (max-width: 860px) { .gap { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) {
  .stats { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .stats > div { flex-direction: row-reverse; justify-content: flex-end; align-items: baseline; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
  .stats > div:first-child { padding-top: 0; }
  .stats dd { font-size: var(--step-3); min-width: 3.6ch; }
}

/* vesting calculator: ten-year projection */
.proj { display: grid; gap: 12px; padding: 16px 18px 18px; border: 1px solid var(--line); border-radius: var(--radius-m); background: var(--bg); }
.proj-title { font-size: .92rem; font-weight: 600; }
.proj .readout { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.proj .readout b { font-size: clamp(1.02rem, .95rem + .35vw, 1.22rem); }
@media (max-width: 1040px) and (min-width: 861px), (max-width: 420px) {
  .proj .readout { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .proj .readout div:first-child { grid-column: 1 / -1; }
}

/* capabilities with a supporting line */
.ticks--sub li small { display: block; margin-top: 2px; color: var(--fg-muted); font-size: .9rem; }

/* core platform features */
.sub-head { font: 600 var(--step-2)/1.15 var(--font-display); letter-spacing: -.01em; margin: clamp(48px, 6vw, 80px) 0 clamp(20px, 3vw, 28px); }
.cap h4 { font-size: 1.12rem; }
@media (min-width: 901px) {
  .caps .cap:nth-last-child(-n+3) { border-bottom: 0; }
}

/* benefits */
.benefits { gap: clamp(20px, 3vw, 32px); }

/* CTA note for people arriving from Tharaa */
.tharaa-note { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); color: var(--fg-muted); font-size: .97rem; max-width: 60ch; }
.tharaa-note b { color: var(--fg); font-weight: 600; }
.proj .readout small { display: block; line-height: 1.35; margin-top: 2px; }
@media (max-width: 900px) {
  .caps { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; }
  .caps .cap, .caps .cap:not(:nth-child(3n+1)) { padding: 20px 0; }
  .caps .cap:nth-last-child(-n+2) { border-bottom: 0; }
}
@media (max-width: 340px) { .caps { grid-template-columns: minmax(0, 1fr); } }
