Как переделать структру сайта без существенных потерь?

У страниц же будут другие адреса, будет путаница в индексации и множество ошибок.

Прочитайте хелпы поисковиков на тему переездов адресов. Обычно это в разделе переезд на новый домен. Но суть одна, нужно правильно настроить переадресацию.
Смысла менять домен не видно.

сайт делался без каких-либо знаний сео! То есть надо было сначала ...

Хорошо бы сначала думать об удобстве посетителей

Он медленный, неудобный, черный фон мешает чтению.

Да, вот об этом.
И не грузить картинки размером 300х300 в полмегабайта весом.

В связи с этим есть вопрос: целесообразно и возможно ли переделать всю структуру сайта?

Какие альтернативы? Оставить как есть? Удалить и больше не делать сайты?
Конечно, усовершенствовать. Потом снова и снова.

Как сверстать такой блок?

Как сверстать пунктирную рамку такой неправильной формы у блока?
Как сделать такой блок?

Как сделать эти точки и их меню?

media там понадобятся, только если картинка меняется (пропорции), если нет, то через банальный calc и проценты.

Как задать высоту списку?

1. Высоту списку задавать не нужно. В верстке не принято задавать высоту элементам с контентом. Просто потому что мы никогда не знаем сколько его там будет на самом деле.

2. За отступы между элементами отвечает margin. Или gap в сетках на флексах и гридах.

3. Остальное можно сказать, только смотря в ваш код.
Научитесь делать песочницы с кодом, например, на codepen.io

Как уместить изображение в div блок?

pet1987,

те полностью отображаться без обрезки и умеситься в div блок.

Пропорции нас не волнуют, правильно я понимаю? Стали круги овалами и черт с ними, так? И пальцы немного раздуло.

Я к чему: это всё банальная геометрия.
Если она вам не нравится, то рисуйте свою картинку под каждый размер окна. Столько, сколько нужно, чтобы нравилось.

Как уместить изображение в div блок?

pet1987, ну уж при contain изображение нигде не обрезается, тут уж не грешите. При contain оно как раз таки полностью видно без искажения пропорций.
Но ок, ваши страдания понятны.

Что сделать следующим ходом?
Нарисуйте, а как оно должно выглядеть?
Вот берете ширину на которой вас не устраивает текущее положение дел и рисуете как должно быть.
Где хотите, в фигме, фотошопе, на бумажке.

Как уместить изображение в div блок?

pet1987, попробуйте всё таки посмотреть какие ещё есть значения у bg size кроме "cover" и "убрать cover".
И выберите подходящее.

Как уместить изображение в div блок?

У меня вопрос: так зачем вы ставите bg size cover, если не хотите, чтобы оно обрезалось?

Да ещё и с important...

Как сверстать и отцентрировать?

rootnoroot, первая же статья https://sitist.ru/info-centering-blocks.htm

Как сверстать и отцентрировать?

Гуглить статьи по "css контент по центру, фон по ширине".

А так, банальная математика

Как расположить кнопки слайдера в Swiper.js правильно?

Клим Куликов, так открывайте девтулз и смотрите чем перекрывает, обрезает и что происходит.
Либо делайте песочницу на codepen.io

Как расположить кнопки слайдера в Swiper.js правильно?

Подозреваю, что их нужно вынуть из slide-content
И спозиционировать куда вам нужно.

Как плавно изменять одну картинку на другую?

Меняйте прозрачность. Или что-то ещё что меняется плавно и устроит вас визуально.

Но у вас там SVG с подозрительными названиями. А вы меняете одну картинку на другую вместо SVG-анимаций.
Да и ссылки вызывают вопросы.

Как прикрепить HTML-код с тегом 'code'?

<code>
  форматирование чего
    не сломать
</code>

Как сверстать такой блок на флексах с изменением порядка его элементов?

Влад, не будем флудить в чужом ответе.

См. изображение в вопросе. 1) Десктоп 2) Смартфон

Никакие обёртки тут не нужны, иначе порядок не поменяешь и 3-й блок не воткнёшь между 1-м и 2-м.

Я смотрю изображения. На них нет 3 между 1 и 2. Но обоих скринах идет 1, 2 потом 3. Т.е. 1 и 2 легко объединяются оберткой.

Но если нужно поменять, то в теории есть display contents, но это не поможет вашему клиенту с его древним компом.

Как сверстать такой блок на флексах с изменением порядка его элементов?

Влад, эммммм, теперь уже мне сложно.
Ответ с доп обертками вы отметили решением, что вам в нём не понятно?

Как сверстать такой блок на флексах с изменением порядка его элементов?

Влад, да сколько можно-то? Я ведь в комментарии под вопросом уже написала, что при неизвестном содержимом без доп оберток или js никак

Как сделать margin в процентах, чтобы не ломался блок?

Breeze1, да, действительно, та же круговая зависимость остается (что логично)

Как сделать margin в процентах, чтобы не ломался блок?

Более или менее альтернатива: заменить margin на gap, а padding на тень/outline

Как сделать margin в процентах, чтобы не ломался блок?

Breeze1, так зачем вы пишете, что отступ должен зависеть и от размера кнопок? Определитесь сначала.

margin в процентах считается от ширины родителя. Но вы делаете родителя по контенту. Итого, кнопки всегда будут выпадать из родителя на размер суммы отступов.

Т.е. либо доп обертки либо js.