xversus

При flex-basis: auto ширина элементов высчитывается через width или, если width не указан, по ширине контента. Первый элемент не может занять всю строку, потому что flex-wrap по умолчанию nowrap, а место для остальных элементов тоже должно остаться.
Подробнее можете почитать здесь: https://medium.com/@stasonmars/%D1%80%D0%B0%D0%B7%...

Можно, но необязательно, вполне достаточно абсолютного позиционирования с вложенностью. У него и браузерная поддержка пошире будет.
https://codepen.io/redstone-m/pen/RwwoPPW

Как вариант - убрать position: relative у .info .info__item:first-child и проставить его для .item:last-child.
Псевдоэлемент будет спозиционирован относительно более далекого предка, и height: 100% сработает. Останется только подправить высоту псевдоэлемента с учетом высоты h3, например, с помощью calc.

https://codepen.io/redstone-m/pen/gOOLOgz
Примерно так.