or try this ( replacing your GTM-IDs ) with copy&paste:

i think it is ok to have both in head section

function ava_g_tag_custom_script() { 
?>
<!-- Google Tag Manager -->
<script>
  (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
  new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
  j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
  'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
  })(window,document,'script','dataLayer','GTM-XXXXX');
</script>
<!-- End Google Tag Manager -->  

<!-- Google Tag Manager (noscript) -->
<noscript>
  <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXX"
  height="0" width="0" style="display:none;visibility:hidden"></iframe>
</noscript>
<!-- End Google Tag Manager (noscript) --> 
<?php
}
add_action('wp_head', 'ava_g_tag_custom_script');

but if you like to have the noscript in body tag:

function ava_g_tag_custom_script() { 
?>
<!-- Google Tag Manager -->
<script>
  (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
  new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
  j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
  'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
  })(window,document,'script','dataLayer','GTM-XXXXX');
</script>
<!-- End Google Tag Manager -->  

<!-- Google Tag Manager (noscript) -->
<noscript>
  <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXX"
  height="0" width="0" style="display:none;visibility:hidden"></iframe>
</noscript>
<!-- End Google Tag Manager (noscript) --> 
<?php
}
add_action('wp_head', 'ava_g_tag_custom_script');

did you compare the htaccess files – if there are differences between those who work and those which do not work?

espacially look for : application/octet-stream

by the way for Enfold Download Button – fill out only the Use File Input field

well there is on element itself on adanced tab – link setting – choose manual:

Doing this – will end on a wrap all inside that element with an anchor tag.
This anchor tag is displayed as block – so the whole width of the element ( if it is inside a 1/1 column it will have active click for the whole width.

if you only like to have the active click area on that element:

put this to quick css:

.avia-animated-number {
    display: inline-block;
    left: 50%;
    transform: translateX(-50%);
}

your welcome – but if you like send me the link anyway.

have a look inside your svg code – i guess both will have the same st classes ( these are former illustrator standard classes) in the mean-time it is cls. But different name same shit.
if you inspect my test page: https://webers-testseite.de/
i only use my colored svg logo – have unique classes set and the transparency logo isn’t a different one but just different fill:

.html_header_transparency #header:not(.header-scrolled) .buchstabe {
  fill: #FFF;
}

may i see your page it concerns?

well – put your code block just inside a color-section – that color section set custom class to: special-vids
inside you got your html structure like:

<section id="scrubs" class="vid">
	<div class="holder">
		<video src="/wp-content/uploads/Time-Lapse.mp4" autoplay muted loop playsinline></video>
	</div>

	<div class="story">
		<div>
			<h3>In the heart of Wildrise…</h3>
		</div>
		<div>
			<h3>…where the breezes play.</h3>
		</div>
		<div>
			<h3>We embrace the call of the wild each day.</h3>
		</div>
		<div>
			<h3>Untamed places stretch,</h3>
		</div>
		<div>
			<h3>vast and wide.</h3>
		</div>
		<div>
			<h3>Whispering secrets of a world outside.</h3>
		</div>
	</div>
</section>

put this to your child-theme functions.php:

function scrub_preparation_of_color_section() { 
?>
<script>
window.addEventListener("DOMContentLoaded", function () { 
	(function($){
		$('.avia-section.special-vids ').each(function() {
			var vids = $(this).find('.vid').detach().html();
			$(vids).prependTo($(this));
			$(this).addClass('vid').find('.container').remove();
		});
	})(jQuery);
});
</script>
<?php
}
add_action('wp_footer', 'scrub_preparation_of_color_section');

see: https://webers-testseite.de/scrubbing-videos/

my css on that page is:

.responsive body#top {
    overflow-x: visible;
}

#wrap_all {
    overflow: visible;
}

.avia-section.vid {
  height: 600vh;
  position: relative;
}

.avia-section.vid div.holder {
  position: sticky;
  top: var(--enfold-header-height);
}

.avia-section.vid video {
  width: 100%;
  height: 100vh;
  object-fit: cover !important;
}

.avia-section.vid div.story {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.avia-section.vid div.story div {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

but i do not want to style it till the end. have a look how that is made in that video. – and how to handle the other .avia-section
Edit: you had to adopt now the scrubbing script to its selectors. And perhaps a debounce and resize will be needed.

you can use the embedded debounce function of enfold:

function ava_add_custom_script(){
?>
<script>
(function($){
  function b() {
      // here comes the script …
  }

  $(window).on('debouncedresize', function() {
    b();
  });
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'ava_add_custom_script');

i do not see any white gap on the bottom – neither on dev tools nor on my iPhone.

I usually use this type of notation using a function name to help me remember what the function is supposed to do. However, this also requires a meaningful function name. Something like : insert_widget_before_footer
Note that the function names are separated by an underscore.

You can also use a notation that makes a function name superfluous:

add_action('ava_before_footer', function() {
	if (is_page(3416)) {
		dynamic_sidebar( 'maps' );
	}
	dynamic_sidebar( 'CTA-Footer' );
});

Incidentally, there are plugins that build conditional logic into widgets. The standard plugin is complex but powerful; another small plugin is more intuitive to use: https://wordpress.org/plugins/widget-options/
but all these rules the widgets itself and not the widget areas. But f.e. if you have one widget area – you can put in the cta-button and maps widget and determine that the maps widget only is shown on contact page.

And maybe you decide to have the burger-menu on top:

#top #header #av-burger-menu-ul {
  vertical-align: top;
  padding: 125px 0 !important;
}

Well enfold provided the option to only show submenu items on hover or on click.

If you choose click we can edit that to only show one toggle open.
then put this to your child-theme functions.php:

function only_one_submenu_open_on_burger(){
?>
<script>
window.addEventListener("DOMContentLoaded", function () { 
  (function($) {
    $('body').on( 'click touch', '.av-active-burger-items > a', function () {
      $(this).parent('li').siblings().removeClass('av-show-submenu');
      $(this).parent('li').siblings().find('ul').slideUp( "fast");
    });
    $('body').on( 'click touch', '.av-active-burger-items .av-width-submenu > a', function () {
      $(this).closest('.sub-menu').siblings().find('li').removeClass('av-show-submenu');
      $(this).closest('.sub-menu').siblings().find('ul').slideUp( "fast");
    });
  })(jQuery);
});
</script>
<?php
}
add_action('wp_footer', 'only_one_submenu_open_on_burger');

after doing that i will have a look to your site to optimize if needed.

https://kriesi.at/documentation/enfold/intro-to-layout-builder/#customization

This is a real good docu – unfortunately, there is too little research being done here

PS : above there are the two lines listed ( 876 and 877 newest Enfold 6.0.8) – but only the 876 has been changed .
but i guess it is easier to replace that little block of those two lines.

see: https://webers-testseite.de/blog/

try it – if it does not work ;) you can delete it afterwards. But default folder for those child-theme ALB elements is “shortcodes”
and if you got this snippet inside your child-theme functions.php they are loaded instead:

function avia_include_shortcode_template($paths){
  $template_url = get_stylesheet_directory();
      array_unshift($paths, $template_url.'/shortcodes/');
  return $paths;
}
add_filter('avia_load_shortcodes', 'avia_include_shortcode_template', 15, 1);

this is based on the snippet above. – but you had to be aware that portfolio links are all url links – so the link goes then to the lightbox – and not to the portfolio page.
You could possibly check whether it is an internal link or not.

the snippet looks to the anchor – and to its href – if href is an image link – then all stayes as it is – if not …

function lightbox_with_mixed_content_type() { 
?>
<script type="text/javascript">
window.addEventListener("DOMContentLoaded", function () { 
	(function($){
		$('.mixed-contenttype a').each(function(){
			var anchorLink = $(this).attr('href');
			if (/\.(jpg|png|gif|webp|jpeg)$/.test(anchorLink)) {
				//console.log(anchorLink + " is an image link");
			} else {
				$(this).attr('rel', 'lightbox').addClass('mfp-iframe');
			}
		});	
	})(jQuery);
});
</script>
<?php 
}
add_action('wp_footer', 'lightbox_with_mixed_content_type', 999);

but as mentioned above – the ajax portfolio grid will not do that .

yes but i suppose that then the av-masonry-entry is not the right selector too.
What kind of element do you use?
Inspect your page with developer tools and have a look what class the link itself has – on masonry it is av-masonry-entry.

On Portfolio Grid – you had choosen the Option : !Open a preview of the entry (known as AJAX Portfolio)” these are totaly different settings. Choose “Open in lightbox” then we can talk about mixed content.
The custom link could be done on the portfolio page itself – via “Additional Portfolio Settings” !

etc. Each of those elements need an own solution. – sometimes there had to be a preventDefault or a stopPropagation of the existing event.