archelon

у меня так:

<video id="myVideo" src="" muted playsinline autoplay loop poster="/media/poster.jpg"></video>

document.addEventListener('DOMContentLoaded', function () {
  const myVideo = document.getElementById('myVideo'); 

  if (myVideo) {
    setMyVideoSource();
  }

  function setMyVideoSource() {
    if (window.innerHeight < window.innerWidth) {
      myVideo.setAttribute('src', '/media/video-desktop.mp4');
      myVideo.load();
      myVideo.play();
    } else if (window.innerHeight > window.innerWidth) {
      myVideo.setAttribute('src', '/media/video-mobile.mp4');
      myVideo.load();
      myVideo.play();
    }
  }
});

в else if можно добавить условия для разных разрешений.
например,

else if (window.innerWidth > 640 && window.innerHeight > window.innerWidth) 
else if (window.innerWidth < 641 && window.innerHeight > window.innerWidth)

также можно дополнительно повесить эту функцию на onresize

1. не использовать таблицу. сверстать на флексбокс, каждую строку обернуть в ссылку.

<a href="#" class="link">
  <span class="name">Ремонт1</span>
  <span class="hours">3-5 часов</span>
  <span class="price">1190 ₽</span>
</a>

2 . javascript: повесить на tr событие onclick

<tr class="link3" data-url="https://yandex.ru" onclick="goToUrl(this)">
    <td>Text</td>
</tr>
<script>
      function goToUrl(i) {
        const url = i.dataset.url
        window.location.href = url
      }
</script>

.header-link {
display: flex; /*или inline-flex*/
align-items:center;
}
.header-link img {
flex-shrink: 0;
margin-right: .5em;
}

Кнопку делаете аналогично.

Вот чеклист, с него можно начать https://www.wuhcag.com/wcag-checklist/
Дополнительно поиск по запросу accessibility
например, на хабре https://habr.com/ru/hub/accessibility/

Например, абсолютом внутри контейнера с фиксированной шириной и высотой.
Но лучше просто картинкой.

А зачем у вас дублируется правило?

body{
    font-family: 'Jura', sans-serif;

    font-family: 'Chakra Petch', sans-serif;
}

Второе правило переписывает предыдущее.
Причем шрифт Chakra Petch указан дважды для body, и затем еще для нескольких элементов, хотя судя по показанному коду, он даже не подключен.

tldr: подключайте svg и не мучайтесь.

а) Трудозатраты
Подключить картинку быстрее и проще.
б) Надежность
Изображение будет гарантированно отображаться как надо на всех устройствах. Если где-то вдруг не загрузится шрифт, или не успеют прогрузиться стили, вы потеряете оформление.
в) Индексация
Теоретически может оказаться полезным то, что текст будет прочитан и учтен поисковиками, хотя обычно это не дает каких-то преимуществ.
г) Оптимизация
В разных случаях меньше будет весить картинка или оформленный текст.
Если для текстового логотипа надо прилинковать пару нестандартных шрифтов, это значительно увеличит количество кБайтов. Если нет, текст будет немного меньше весить, но выигрыш будет несущественным.
д) Особенности дизайна
В некоторых случаях может быть нестандартный дизайн, где текстовый логотип — необходимость.
е) Действительно простой логотип
Ну и конечно, если логотип — это банально название компании / марки, набранное уже подключенным шрифтом, и никаких дополнительных итераций (интерлиньяж, трекинг и т.п.) не требуется, тогда, действительно, проще набрать текстом.

Помимо решения с position: absolute, картинке можно задать такие свойства:
1. transform: translateY(-50px)
или
2. margin-top:-50px

приблизительно так

<header>
  <div class="container d-flex">
    <img class="col-1" src="logo.svg">
    <div class="col-11">
      <div class="container d-flex flex-wrap justify-content-right">
        <form class="col-12 col-lg-auto mb-3 mb-lg-0 poisk_form">
          <input type="search" class="form-control" placeholder="ПОИСК..." aria-label="Поиск">
        </form>
        <ul class="nav justify-content-right">
          <li class="nav-item-vector"><a href="#" class="nav-link link-dark px-2" aria-current="page"><img src="Vector.svg"></a></li>
          <li class="nav-item-vector"><a href="#" class="nav-link link-dark px-2" aria-current="page"><img src="Vector2.svg"></a></li>
          <li class="nav-item-number nav-link link-dark">8 (381) 233-50-35</li>
          <li class="nav-item-vector"><a href="#" class="nav-link link-dark px-2" aria-current="page"><img src="корзина.svg"></a></li>
        </ul>
      </div>
      <nav class="container flex-wrap">
        <ul class="nav justify-content-right">
          <li class="nav-item-burger"><img src="burger.svg"></li>
          <li class="nav-item"><a href="#" class="nav-link link-dark px-2" aria-current="page">Каталог</a></li>
          <li class="nav-item"><a href="#" class="nav-link link-dark px-2 active">Новинки</a></li>
          <li class="nav-item"><a href="#" class="nav-link link-dark px-2">Акции</a></li>
          <li class="nav-item"><a href="#" class="nav-link link-dark px-2">Доставка</a></li>
          <li class="nav-item"><a href="#" class="nav-link link-dark px-2">О нас</a></li>
          <li class="nav-item"><a href="#" class="nav-link link-dark px-2">Контакты</a></li>
        </ul>
      </nav>
    </div>
  </div>
</header>

кнопка абсолютом поверх input
https://jsfiddle.net/ntf05zsp/