/* ============ INDEX PAGE UTILITIES — add to end of ssi.css ============ */

/* Sidebar column stack */
.sidebar-stack {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Card stack (why-ssi differentiator cards etc.) */
.card-stack {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.card-stack > .card {
    margin-bottom: 24px;
}

.card-stack > .card:last-child {
    margin-bottom: 0;
}

/* Smaller card padding variant */
.card-sm {
  padding: 20px 24px;
}

/* Full-width button utility */
.btn-full {
  width: 100%;
  justify-content: center;
}

/* Section intro paragraph */
.section-intro {
  max-width: 640px;
  margin-bottom: 48px;
}

/* Centered section header block */
.section-header-center {
  text-align: center;
  margin-bottom: 24px;
}

/* Centered section intro (under centered headers) */
.section-intro-center {
  max-width: 640px;
  margin: 16px auto 48px;
  text-align: center;
}

/* FAQ container */
.faq-container {
  max-width: 800px;
  margin: 0 auto;
}

/* Spacing utilities */
.mb-5  { margin-bottom: 20px; }
.mb-10 { margin-bottom: 40px; }
.mb-3  { margin-bottom: 12px; }

/* Text size utilities */
.text-sm  { font-size: 14px; }
.text-xs  { font-size: 13px; }
.text-11  { font-size: 11px; }

/* card-navy label (eyebrow above h3 in navy cards) */
.card-navy-label {
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--navy-light);
  display: block;
  margin-bottom: 8px;
}

/* card-navy body text */
.card-navy p {
  color: var(--navy-lighter);
}

/* card-navy h3 */
.card-navy h3 {
  color: #fff;
}

/* card-navy check-list spacing */
.card-navy .check-list {
  margin-bottom: 20px;
}

/* Two-col layout: content left, cards right (why-ssi pattern) */
.layout-prose-cards {
  align-items: start;
  gap: 48px;
}

/* Section h2 size override for 2rem contexts */
.h2-lg {
  font-size: 2rem;
  margin-bottom: 16px;
}