.como-funciona {
  padding: 40px 0;

  .como-funciona-itens {
    display: flex;
    gap: 24px;

    .como-funciona-card {
      width: -webkit-fill-available;
      box-shadow: 0px 8px 12px #00000f1e;
      border-radius: 8px;
      overflow: hidden;

      .thumbnail {
        img {
          width: -webkit-fill-available;
          height: 282px;
          object-fit: cover;
        }
      }

      .text-content {
        padding: 16px 20px;
        display: grid;
        justify-content: space-between;

        h3 {
          margin: 0;
          color: #1d1d1b;
          font-size: 24px;
          font-weight: 700;
          margin-bottom: 8px;
        }

        p {
          margin: 0;
          color: #565654;
          font-size: 16px;
          font-weight: 400;
          margin-bottom: 8px;
        }

        .input-Url {
          a {
            display: flex;
            border: 1px solid #ebebeb;
            border-radius: 999px;
            padding: 6px 12px;
            font-size: 14px;
            width: fit-content;
            font-weight: 400;
            color: #30302e;
            align-items: center;
          }
        }

        .remove-item-btn {
          font-size: 16px;
          font-weight: 400;
          padding: 0;
        }
      }
    }

    .components-button {
      height: auto;
      padding: 0 5px;
      transition: 0.4s ease;
    }
    .components-button:hover {
      transform: scale(1.03);
    }
  }
}