Здарова! Тут тема скорее всего в том, что ты сетке задал z-index: -1, а это значит, что она всегда будет под всеми остальными элементами. Когда элемент с z-indexом меньше чем у других блоков, он просто прячется под ними. Прозрачность тут не спасает, потому что блоки всё равно будут перекрывать сетку.
Чтобы сетка нормально отрисовывалась поверх, можешь попробовать задать сетке более высокий z-index (например, z-index: 0 или больше), а другим блокам назначить z-index, который будет меньше или равен 0, или просто не трогать их z-index, если не нужно.
Вот так попробуй:
#bgsvg {
position: fixed; /* Поменял position на fixed для фиксации сетки */
background-position: center;
background-repeat: no-repeat;
background-image: url("../images/bg.svg");
background-size: auto;
z-index: 0; /* Повышаем индекс, чтобы сетка была выше остальных элементов */
width: 1602px;
height: 642px;
}
Тут мы ещё position: fixed бахнули, чтобы сетка точно двигалась за пользователем и не пряталась под другими элементами. Твой background-attachment: fixed тоже можно убрать, потому что position: fixed уже всё это делает. Короче, попробуй так — должно помочь!