/* "Cómo trabajamos" de /gestion-de-sistemas: el paso a paso desde la consulta hasta que queda definido. */
.pasos{list-style:none;margin:0;padding:0;display:grid;gap:14px;grid-template-columns:repeat(4,minmax(0,1fr))}
.pasos li{position:relative;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:18px 18px 16px;display:grid;align-content:start;gap:6px}
.pasos .pn{width:34px;height:34px;border-radius:50%;background:color-mix(in oklab,var(--primary) 12%,var(--card));color:var(--primary);display:grid;place-items:center;font-weight:800;font-size:.95rem;margin-bottom:6px}
.pasos b{font-size:1rem;color:var(--foreground);line-height:1.3}
.pasos p{margin:0;color:var(--muted-foreground);font-size:.86rem;line-height:1.55}
.pasos li:last-child{border-color:color-mix(in oklab,var(--primary) 35%,var(--border));background:color-mix(in oklab,var(--primary) 5%,var(--card))}
.pasos li:last-child .pn{background:var(--primary);color:var(--light)}
.pasos li:not(:last-child)::after{content:"";position:absolute;top:34px;right:-11px;width:8px;height:8px;border-top:2px solid var(--primary);border-right:2px solid var(--primary);transform:rotate(45deg);opacity:.45}
.pasos-cta{margin-top:18px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.pasos-cta .product-button{width:auto}
.pasos-cta span{color:var(--muted-foreground);font-size:.86rem}
@media (max-width:900px){.pasos{grid-template-columns:repeat(2,minmax(0,1fr))}.pasos li::after{display:none}}
@media (max-width:560px){
  .pasos{grid-template-columns:1fr;gap:10px}
  .pasos li{grid-template-columns:34px 1fr;column-gap:12px;padding:14px}
  .pasos .pn{grid-row:span 2;margin:0}
  .pasos-cta .product-button{width:100%}
}