can you please test that snippet!
if you like to have 4 columns – just change it.

if you like to show the blog – then the context is not archive – it is index then ;)

PS: alb element = advanced layout builder element : if you use that – the element itself got some options to define the thumbnail size which is used.
but, as I suspected, you are not using this option

on Enfold : where did you load your jQuery in the header or have you set to load jQuery in the footer?
hasClass belongs to jQuery – but if you load jQuery later than there will be this error. Maybe your plugin has the option too – to load the scripts later.

And you are realy shure that you haven’t set it with Quotationmarks?
Open that element and maybe make a screenshot as i do.

the default quotationmarks in the playlist belongs to mediaplayer of wordpress – and could be deleted by that known snippet:
https://pastebin.com/k0f385TJ

But on top – these comes from Title and Description field of the media library.

Web-safe fonts are fonts that can adapt to any browser on any device. By using these types of fonts, web designers and developers ensure that the intended font will always display properly on a web page, even if these fonts aren’t installed on the user’s computer.

Since this was clear to me, I honestly didn’t read any further about your explanation there. There are quite a few more that could be listed here. But Copperplate does not belong here.

here is the official W3C List:
https://www.w3schools.com/cssref/css_websafe_fonts.php

please show me your page. If you can not make it public – you had to wait for a mod.

can you put this in your child-theme functions.php:

function insert_a_whatsapp_button() { 
?>
<script>
(function($){
	$( '#top' ).append('<div class="whatsapp-button"><a href="https://wa.me/3483883844?text=Salve,%20vorrei%20chiedere%20informazioni" target="_blank"><img width="80" height="80" src="https://srgl.it/aom/wp-content/uploads/2024/03/whatsapp_img-80x80.png" class="image wp-image-864 wa_img attachment-thumbnail size-thumbnail" alt="" style="max-width: 100%; height: auto;" decoding="async" srcset="https://srgl.it/aom/wp-content/uploads/2024/03/whatsapp_img-80x80.png 80w, https://srgl.it/aom/wp-content/uploads/2024/03/whatsapp_img-36x36.png 36w, https://srgl.it/aom/wp-content/uploads/2024/03/whatsapp_img.png 149w" sizes="(max-width: 80px) 100vw, 80px"></a></div>');
	$('.whatsapp-button').css({
		"position": "fixed",
		"bottom": "120px",
		"right": "20px",
		"z-index": "500",
	})
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'insert_a_whatsapp_button');

If this is really the case, I think it would be better to include only platform-independent fonts in the list of Websafe fonts.

Next : BetterZip f.e. has a drop bar – you can there select the option to zip for PC ( that means no hidden Mac Files )

by the way Elsner & Flake got a copperplate with font-weight: 300, 500, 700

first : i do not see your custom class in the dom: image_no_stretch

second: maybe this is not the Element for you to use. It is the avia-fullscreen-slider
it is just the feature that the full-screen slider has the full height.

next: the fullscreen slider has no images as slides – the image is set as background-image to the li !
( so no img tag to select )

maybe better to use instead the fullwidth easy slider !

you can do that inline like your color setting:

<h3>
   <a href="https://site.com/portfolio-item/east-point-lighthouse-n-j-photography-hot-spot/">
      <span style="color: #ffff00; text-transform: uppercase"><strong>EAST POINT LIGHTHOUSE</strong></span>
   </a>
</h3>

or globaly:

#top .avia_textblock h3 strong {
  text-transform: uppercase !important;
}

if you do like to have it only on some h3 – you had to use a custom-class

first – goto Enfold Options – Theme Options – Select Your Editor : “Use WP Classic Editor”

you can add to child-theme functions.php:

function trigger_alb_on_load(){
?>
<script>
window.addEventListener('DOMContentLoaded', function() {
(function($){
      setTimeout(function() {
        $("#avia-builder-button").trigger('click');
      }, 300);
})(jQuery);
});
</script>
<?php
}
add_action('admin_head-post-new.php', 'trigger_alb_on_load');

and if you like to change the editor even on widgets:

add_filter( 'use_widgets_block_editor', '__return_false' );

do you have that logo as svg file? Vectorbased Files are sharper even on small dimensions
If not – what Font is the base for it? (the G and E and T and S will not be there on default – but it is much easier to make an svg of that – if we know the source font.

the button is there too!

It turns out to be very complex if you first want to open the gallery preview in the modal window, and then the items with the next click.

Example Page :
give to the button element a custom class f.e.: link_to_lightbox and link to an ID.
( or if you got many links inside to perform : give that class to a parent-elment (f.e. color-section) )

place your galleries on your page (preferably behind your other content on the site.)
Style them as lightbox galleries!
those galleries must have now a unique ID (that corresponds with your link ID’s) and a custom class: mfp-hide

put this to your child-theme functions.php:

function link_to_gallery_first_item_in_lightbox() {
?>
<script type="text/javascript">
(function($) {
    $(document).on('click', '.link_to_lightbox a', function(event) { 
        event.preventDefault();
        var linkTarget = $(this).attr('href');
        $(linkTarget).find("a.first_thumb").click();
    });
})(jQuery);
</script>
<?php
} 
add_action('wp_footer', 'link_to_gallery_first_item_in_lightbox');

allthough there is no such font-style for sanchez – browser rendering could simulate a 700 Style.

just set it in your quick css to do so for headings.
see on google and developer tools change – on top 400 style – on bottom 700 via css

maybe it has to do with your non existing certificates. Your page is only in http mode to view. But maybe a security setting or plugin hampers to load unsecure sources. Or your Content Security Header settings.

by the way: https://securityheaders.com/?q=http%3A%2F%2Finvebiwp.weblink.it%2Fcontatti%2F&followRedirects=on

Where did you insert those CSPs ? And did you do it the correct way?

Wenn es deine Internetseite betrifft, die sich hinter deinem Nick verbirgt, dann sind es hautpsächlich deine Bilder, die deiner Beachtung würdig sein sollten.

Mal davon abgesehen, das es gar keinen Sinn macht Bilder hochzuladen, die mehr als 2560px ( das ist eine Media-Library Grenze die WordPress selbst hat) groß sind. Dadurch tauchen Bilder auf, die dann WordPress auf diese Grenze herunter rechnet und mit dem addendum -scaled abspeichert.

schau dir den Bericht auf Gtmetrix mal an: Link
Es it garantiert nicht das Pseudo-Element was du oben anführst. ( Es sei denn es hat dort Hintergrundbilder oder ähnliches per css mit drin.)

Es werden auch viele kleinere Bilder (in den Dimensionen nicht vom Dateivolumen) hochscaliert, was auch Zeit benötigt.

Zur Info bezüglich der Art wie Enfold mit hochgeladenen Bildern neue Formate errechnet. : https://kriesi.at/support/topic/enfold-image-bigger-than-original/#post-1355204
Dort findest du dann auch ein Snippet mit dem man den Kompressionslevel von Enfold beim Upload der Bilder reduzieren kann. Und wie man mit der Nutzung von temporär installierten Plugins die anderen Bildformate erneut recalculieren läßt.

Meine Empfehlung : bevor du die Bilder hochlädst, berechne Sie neu in einem Grafikprogramm auf eine Größe, die auch später Verwendung finden könnte.
Wenn man sich die “most common browser viewing sizes” ansieht, sollte man mit 1920px meist auskommen.

hier mal ein Bildvergleich eines deiner Bilder – schau ob sich das wirklich lohnt, hochaufgelöste Bilder im Web zu nutzen ;)
https://webers-testseite.de/bildvergleich/