/**
 * La Villa Hermosa — Financing page (Figma node 86:2)
 * Process step cards, checklist card, FAQ card grid.
 */

/* ================= How Financing Works ================= */
.process-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-6);
}
.process-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: 40px 36px;
  background: var(--bg-base);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-xl);
}
.process-card__num { font-family: var(--font-display); font-weight: 600; font-size: 20px; color: var(--brand-primary); }
.process-card__title { font-family: var(--font-display); font-weight: 600; font-size: var(--text-h3); line-height: var(--lh-h3); }
.process-card__desc { font-size: var(--text-body-sm); line-height: var(--lh-body-sm); color: var(--text-secondary); }
@media (max-width: 1100px) { .process-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .process-grid { grid-template-columns: 1fr; } }

/* ================= What You'll Need ================= */
.split-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-16);
  align-items: center;
}
.split-row__text { display: flex; flex-direction: column; gap: var(--space-4); }
.checklist-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  max-width: 560px;
  padding: var(--space-10);
  background: var(--bg-surface);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-card);
}
.checklist-item { display: flex; align-items: flex-start; gap: var(--space-3); font-size: var(--text-body); color: var(--text-primary); }
.checklist-item__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--brand-tint); color: var(--brand-primary);
  font-size: 12px; flex-shrink: 0; margin-top: 2px;
}
@media (max-width: 900px) { .split-row { grid-template-columns: 1fr; } .checklist-card { max-width: none; } }

/* ================= Common Questions ================= */
.faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-6);
}
.faq-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: 28px 32px;
  background: var(--bg-base);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
}
.faq-card__q { font-weight: 700; font-size: var(--text-h5); line-height: var(--lh-h5); color: var(--text-primary); margin: 0; }
.faq-card__a { font-size: var(--text-body-sm); line-height: var(--lh-body-sm); color: var(--text-secondary); margin: 0; }
@media (max-width: 900px) { .faq-grid { grid-template-columns: 1fr; } }