Филипп Гапоненко

background-size: cover;

Пример

box-shadow: 0 0 0 12px red;
это оно?

Вот описание похожей методики, думаю можно использовать эту идею для вашего случая: https://medium.freecodecamp.org/using-svg-as-place...

d3.js <3 https://d3js.org/

align-items

Перестаньте так делать, это пример плохого скрола, пока человек скролит он видит нижнюю часть контента следующей страницы и чтобы начать читать нужно полностью проскролить предыдущую. Это неудачное решение.

Если в css на элементе нет cursor:pointer то клик в js на айфоне не будет обрабатываться.
*spongebob_rainbow.jpg*

Если возникла такая задача то это повод пересмотреть архитектуру приложения.

linear
https://jsfiddle.net/psr1919plus21/k27hh1jm/2/

Я бы попросил дизайнера прислать иконки.

Можно сделать спрайт из двух логотипов для светлого и для темного фона и переключать их в зависимости от контента.
Надежно и кроссбраузерно.
Минус: надо точно знать какой контент на слайде (например навешивать на такие слайды соответствующий класс и при переключении слайда смотреть есть ли этот класс и если есть туглить логотип).

background-size: cover;
https://jsfiddle.net/psr1919plus21/5khsp9qt/1/