Regarding 522 error for each of the resources tried to load up, I assume there is some issue between your hosting provider and Cloudflare, as it could be that Cloudflare is either not allowed to connect to your origin host/server, or some other issue regarding the SSL.
Kindly, may I ask have you checked the suggestions from the below article?:
Are Cloudflare IP addresses allowed to connect to your new host/origin?
Maybe you need to allow Cloudflare IP addresses to connect to your host/origin server:
https://support.cloudflare.com/hc/en-us/articles/201897700-Allowing-Cloudflare-IP-addresses
Cloudflare IP list can be found here:
Has your Website being served over HTTPS before moving to Cloudflare?
Have you had an SSL certificate installed at your host origin/server which covers your domain(s)?
Kindly, check here for a way how to propperly setup an SSL certificate while using Cloudflare:
Moreover, could you check which SSL option have you got selected under SSL tab at Cloudflare dashboard? Is it Flexible, Full SSL or something other?
How about your web server and WordPress website?, does it work on a port which is compatible with Cloudflare as follows in the below article:
https://support.cloudflare.com/hc/en-us/articles/200169156-Identifying-network-ports-compatible-with-Cloudflare-s-proxy
Maybe they are both being served over HTTP rather than HTTPS and maybe too much requests are comming from Cloudflare IP addresses, which are not allowed to either connect and/or sent that much of them?
Or, maybe some mixed content in between.
Maybe due to some packet loss to your origin host/server?
Like the one “… website is offline …”, right?
Does anything changes if you Pause Cloudflare for your domain?
Or temporary switch the 
cloud DNS records to 
cloud?
Try contacting your hosting provider regarding the allowlisting the Cloudflare IP addresses and allowing them to connect to the server.