Если вы хотите использовать нестандартные формы, да еще и при этом делать для них правильные тени, то вам поможет только svg. Я не уверен насчет того, можно ли это реализовать с помощью какого-нибудь svg-mask, но вот для отдельного svg элемента тень делается легко.
Так что в вашем случае это скорее всего выглядит как явный оверкилл, и эту самую тень лучше симулировать с помощью :before допустим.
На случай если вам интересна тема с свг, я вот даже недавно делал демку с динамической тенью для svg (треугольник по центру) -
codepen.io/suez/pen/GgGMGo
*Примечание для комментаторов оригинального сообщения: нет, box-shadow не поможет для элемента, со скошенными углами, сделанными с помощью border. Тень будет рендерится прямоугольной, относительно width/height объекта.
