/* fix-1017a: the /saas page (roadmap item 2). Uses home.css for the hero, stage, steps, FAQ and footer. */
.sx-sec .sub{margin-bottom:0}
.sx-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
.sx-card{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:26px;display:flex;flex-direction:column;min-width:0}
.sx-card .ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--brand-50);color:var(--brand-700);border:1px solid var(--brand-200)}
.sx-card h3{font-size:19px;letter-spacing:-.02em;margin:18px 0 8px}
.sx-card p{margin:0;color:var(--ink-2);font-size:15.5px;line-height:1.55}
.sx-link{margin-top:auto;padding-top:16px;display:inline-flex;align-items:center;gap:6px;font-weight:650;font-size:14.5px;color:var(--brand-700)}
.sx-link:hover{text-decoration:underline}
.sx-link .i{width:16px;height:16px}
.sx-inline{color:var(--brand-700);font-weight:650;text-decoration:underline}
.qa p a{color:var(--brand-700);font-weight:600;text-decoration:underline}
.sx-steps-sec{padding-top:0}
@media (max-width:1100px){.sx-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){
  .sx-grid{grid-template-columns:1fr;gap:14px;margin-top:28px}
  .sx-card{padding:20px}
  .saas-page h1.display{font-size:36px}
}