How can I align text and icon on my webpage?

[FindWorld]

hello community,

I would like to leave this part of my page, as it is in the second image, could you help me, please?
I can't fix the text and add the cart icon.
It is like this:

I would like it to look like this:

And I also need to get these items on the computer and I'm not getting it.

Thanks.

My store: findworld.com.br
Password: edit321

[ZestardTech]

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.scss.css and paste this at the bottom of the file:

@media screen and (min-width:749px){
.help1 .box-footer.large:first-child > div:nth-child(1) {
width: 80% !important;
}

.help1 .box-footer.large:last-child > div:nth-child(1) {
width: 50% !important;
}
}

.line-info .item .icon img {
width: 100%;
}

[FindWorld]

Hello friend, thanks for the help.

Can you tell me how to leave it like this?
I needed to remove the purple part of the first part, because this is cutting the form, I tried to change the code you sent me, but this purple doesn't come out at all.
again thanks for the help.

[ZestardTech · Accepted solution]

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.scss.css and paste this at the bottom of the file:

@media screen and (min-width:749px){
.help1 .box-footer-large:first-child {
width: calc(50% - 20px);
margin-right: 20px;
}
.help1 .box-footer-large:first-child>div {
width: 100% !important;
margin-right: 0;
}

.help1 .box-footer-large:first-child>div .desc {
width: 100%;
word-break: break-all;
}
.help1 .box-footer-large:last-child {
width: 50% !important;
}
}

[FindWorld]

Hello friend, thanks for the help.
Could you help me fix the icons? I need to remove this code, but I can't because it's in the index

.icon {
display: inline-block;
width: 20px; < remove
height: 20px; < remove
vertical-align: middle;
fill: currentColor;
}