Как расположить элемент в grid контейнере?

nwtoneseo, так и пишите, что нужно с 3 по 5, а не с 2 по 4. Или просто span 2

Как расположить элемент в grid контейнере?

Покажите скрином что нужно. А из кода сделайте работающую песочницу на codepen.io

Какую максимально эффективную и простую капчу посоветуете?

максимально простые для посетителя капчи без действий

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

Тут обсуждали недавно
Нужно ли обычную форму обратной связи лендинга защищать от спам-ботов?

Как подогнать ширину блока внутри flex под контент?

Вячеслав Яшников, да, бывает не везет

Что делаю не так Html5 PHP JS?

Максим К, это что за дичь в селекторе? У вас у кнопки есть класс.

но вот с PHP в связке с JS мало сталкивался.

Ну, развлекайтесь.

Как выровнять кнопки по вертикали относительно друг друга?

1. Флекс колонками и margit-top auto для кнопки
2. Гриды и 1fr для той строки, которая должна растягиваться.
Как вариант, можно и для той в которой кнопка и кнопке align-self.
3. subgrid https://caniuse.com/?search=subgrid

Что делаю не так Html5 PHP JS?

Имеет смысл почитать про теги div, form, a, button

Проще всего поменять разметку на адекватную задаче. Данные собирает форма, а отправляет её кнопка.

Либо писать JS. В вопросе он у вас упомянут, но кода нет.

Как правильно прописать стили анимации блика в блоке с абсолютным позиционированием?

Влад, ну поменяйте ссылке позиционирование на absolute и поставьте куда надо.

Можете просто из всей разметки оставить только ссылку и проверить, что у неё всё хорошо.
Ну а потом уже позиционировать её куда угодно и как угодно.

Как правильно прописать стили анимации блика в блоке с абсолютным позиционированием?

Влад,

Если не делать обёртки, а обойтись только тегом , то псевдо-блик будет выходить за рамки основного тега.

У меня сейчас выходит?

Если нужно, чтобы блик проходил и по синей границе, то замените border на внутреннюю тень или градиент.

Как правильно прописать стили анимации блика в блоке с абсолютным позиционированием?

Влад,

А как вы спозиционируете кнопку с позишн релатив в блоке тоже с позишн релатив?

Никто же вас не заставлял так писать.
В вашем сценарии: ссылка абсолютом, полоска-псевдо в ней тоже абсолютом. Всё.

Но вообще проще гридами, как-то так.
https://codepen.io/AnnaSummer/pen/NWJVygG

Осталось выяснить зачем в разметке нужны left и right.
Если в них нет полезного содержимого, то замените на псевдо.

Как правильно прописать стили анимации блика в блоке с абсолютным позиционированием?

Ничего у вас не выходит за их пределы.
Блоки квадратные, в их области и видна полоска.

И не нужны две обертки

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

Ну-ну

Как сделать кнопку такой фигурой?

Замените рамку на drop-shadow
Или сделайте svg фоном
Или нарисуйте градиентом

Почему заливка картинки больше самой заливки?

Сергей delphinpro, ага, я упростила. Не права, надо было, конечно, полностью написать.

Почему заливка картинки больше самой заливки?

Ещё можно задать vertical-align в явном виде, например, top

Как пофиксить баг с font-weight при наведении?

GR么ND, я бы разбиралась с backdrop-filter

Как сделать такую оберткудля формы?

С помощью сочетания линейного градиента и border-image
Статейка: https://sitist.ru/gradient-border.html

Как пофиксить баг с font-weight при наведении?

А лучше живой пример на codepen.io
Пока делаете, найдете в чем дело.

Почему не обрезается длинный текст внутри GRID, вместо этого GRID-элемент выходи за границы родителя?

Задайте grid для div3

Как расположить панель внизу через стили css?

Старый способ: абсолютом
Современный способ: флексы, гриды.
Гуглите стики футер