:root{
  --esw-accent:#ff6a00;
  --esw-card-bg:#fff;
  --esw-cols:4;
}

/* Contenedor */
.esw-steps{position:relative}
.esw-heading{
  text-align:center;
  font-weight:800;
  margin:0 0 22px;
}

/* Línea de progreso superior */
.esw-progress{
  position:relative;
  height:34px;
  max-width:980px;
  margin:0 auto 16px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.esw-progress .esw-line{
  position:absolute;
  left:20px; right:20px; top:16px;
  height:2px;
  background:linear-gradient(90deg, var(--esw-accent), var(--esw-accent));
  opacity:.35;
}
.esw-progress .esw-dot{
  position:relative;
  z-index:1;
  width:26px; height:26px; border-radius:50%;
  background:#fff; border:2px solid var(--esw-accent);
  box-shadow:0 2px 6px rgba(0,0,0,.08);
}

/* Grid de tarjetas */
.esw-grid{
  display:grid;
  grid-template-columns: repeat(var(--esw-cols), minmax(0,1fr));
  gap:18px;
  max-width:1200px;
  margin:0 auto;
}
.esw-card{
  background:var(--esw-card-bg);
  border-radius:12px;
  padding:18px 18px 20px;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 12px 20px rgba(0,0,0,.04);
  position:relative;
  min-height:146px;
}
.esw-step-badge{
  position:absolute; top:-14px; left:16px;
  width:28px; height:28px; border-radius:50%;
  background:#fff; color:#111; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  border:2px solid var(--esw-accent);
}
.esw-card h4{
  margin:6px 0 8px; font-weight:700; font-size:15px;
}
.esw-card p{
  margin:0; color:#555; font-size:13.5px; line-height:1.5;
}

/* CTA */
.esw-cta{ text-align:center; margin-top:18px; }
.esw-btn{
  display:inline-block; padding:10px 18px; border-radius:8px;
  background:var(--esw-accent); color:#fff; font-weight:800; text-decoration:none;
  box-shadow:0 8px 16px rgba(0,0,0,.1);
}
.esw-btn:hover{ filter:brightness(1.05); transform:translateY(-1px); }

/* Responsivo */
@media (max-width: 1024px){
  .esw-grid{ --esw-cols:3; }
}
@media (max-width: 768px){
  .esw-grid{ --esw-cols:2; }
  .esw-progress{ display:none; } /* en móvil ocultamos la línea para limpiar */
}
@media (max-width: 520px){
  .esw-grid{ --esw-cols:1; }
  .esw-step-badge{ left:14px; }
}
