/* ============================================================
   Solution pages (cloud cost, AI forward deployed engineer)
   and the data engineering skills block. Builds on ndt.css.
   ============================================================ */
.sol-read-4 { grid-template-columns: repeat(4, 1fr); }
.sol-flow-5 { grid-template-columns: repeat(5, 1fr); }
.sol-flow-5 .ndt-flow-icon b { font-family: var(--font-family--raleway-bold); font-size: 20px; }
.sol-compare td:first-child { font-family: var(--font-family--raleway-bold); color: var(--color--secondary); white-space: nowrap; }
.sol-compare td:nth-child(2) { font-family: inherit; color: var(--color--main); white-space: normal; }
.sol-compare td:nth-child(3) { white-space: normal; }

/* Data engineering skills (light page) */
.sol-skills { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.sol-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.sol-chip {
  font-size: 13px; font-family: var(--font-family--raleway-semi-bold);
  background: var(--swatch--primary-06); color: var(--color--primary);
  border: 1px solid var(--swatch--primary-15); padding: 5px 12px; border-radius: 40px;
}
@media (max-width: 1199px) {
  .sol-flow-5 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 991px) {
  .sol-skills { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .sol-read-4 { grid-template-columns: repeat(2, 1fr); }
  .sol-flow-5 { grid-template-columns: repeat(2, 1fr); }
  .sol-skills { grid-template-columns: 1fr; }
  .sol-compare td:first-child { white-space: normal; }
}
@media (max-width: 479px) {
  .sol-flow-5 { grid-template-columns: 1fr; }
}

/* ----- Detail pages built on the feature-detail template (light) ----- */
.sol-block { margin-top: 70px; }
.sol-block .ndt-head { margin-bottom: 32px; }
.sol-block .ndt-head p { max-width: 860px; }
.sol-reach { background: var(--swatch--primary-06); border: 1px solid var(--swatch--primary-15); border-radius: var(--border-radius--30); padding: 48px 44px; }
.sol-reach .section-summary { max-width: 760px; }
.sol-reach-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; margin-top: 26px; }
.sol-reach-actions .ndt-btn { margin: 0; }
.feature-primary-detail-content figure img[src$=".svg"] { width: 270px; border-radius: var(--border-radius--30); }
@media (max-width: 767px) {
  .sol-block { margin-top: 48px; }
  .sol-reach { padding: 32px 22px; }
}

.sol-reach { margin-bottom: 56px; }