Danny Arty

В скрипте инициализации добавь слушатель события ready

document.addEventListener("DOMContentLoaded", function () {
    Fancybox.bind("[data-fancybox]", {
        on: {
            ready: (fancybox, slide) => {
                let iframe = document.querySelector(slide.$content).querySelector("iframe");
                if (iframe) {                    
                    setTimeout(() => {
                        iframe.contentWindow.postMessage('{"type":"player:play"}', "*");
                    }, 500);
                }
            }
        }
    });
});

Не понял, вы в форму модального окна вставляете картинку и заголовок, но не знаете как их отправить?
Ну так вставляйте их в скрытые поля. И чанке письма, если такой есть, отобразите имя поля, в которое будет вставляться заголовок. Картинка будет во вложении. Чтобы вложение отправить добавьте форме атрибут enctype="multipart/form-data"

Я использовал maphilight.js

Ну дык ты get-запрос делаешь на страницу izbrannoe.html, которой у тебя нет, или она не опубликована. Твой скрипт тупо падает

Если я правильно понял задачу.

function activeNUM() {
    let currentNum = 42;
    numList.each(function(idx) {
      if (idx != numList.length - 1) {
        if (currentNum >= $(this).attr('data-num') && currentNum < numList.eq(idx + 1).attr('data-num')) {
          $(this).addClass('active');
        }
      }
    });
}

Потому что swiper у вас инициализирован с самого начала.
Вы бы хоть доку почитали, она ведь максимально понятная.

768: {
enabled: false,
slidesPerView: 5,
}

Я так понимаю, что этими строчками вы якобы хотели инициировать swiper по бреикпоинту, но это так не работает.
Сделайте так:

let breakpoint_mobile_min = window.matchMedia('(min-width: 768px)'),
         projectInit = false,
         projectSlider= Swiper;

function projectSliderInit() {
        if (breakpoint_mobile_min.matches) {
            if (projectInit) {
                if ($('#slider3').hasClass('swiper-initialized')) {
                    projectSlider.destroy();
                    projectInit = false;
                }                
            }            
        } else { 
            if (!projectInit) {
                projectInit = true;
                projectSlider= new Swiper('#slider3', {
                    navigation: {
                       nextEl: '.swiper-button-next',
                       prevEl: '.swiper-button-prev',
                       enabled: false,  //определитесь нужны вам стрелки или нет
                    },
                    pagination: {
                       el: '.swiper-pagination',
                       clickable: true,
                    },    
                    slidesPerView: 1,
                });
            }           
        }
}
$(window).on('resize load', function () {
   projectSliderInit();
});

Конечно будет пустое пространство, ведь теперь у него position: static.
А почему его там нет?
Потому что есть еще один стиль transform: translateY(-200%);. Уберите его и margin-bottom, если вам не нужен отступ снизу.

1) Зачем делать div-ами то, что должно быть формой?
2) Зачем вешать обработчик через инлайновый onclick? Вынесите нормально в js
3) Что вообще делает ваш код? Т.е. почему у первого подобия кнопки в send указан data_1, а у второго data_2?
4) Почему у вас одинаковые id у двух пар элементов? От этого страница конечно работать не перестанет, но вы нарушаете семантику, ведь id - это все таки уникальный идентификатор.

Зачем такие велосипеды придумывать? Вы же разметку в HTML наверное задаете? Не проще ли в слайде с текстом первым поставить тот, который связан со вторым слайдом фото и не придется ничего изобретать.