creo que se va a complicar el degradado...
usa 2 div, uno para la parte de arriba y otro para la seccion que baja
y fijate en google "dibujar formas con css3" o "dibujar triangulos" y fijate como manipulan los bordes para que tenga formas :D
border-radius tambien...
y tal vez transform
http://www.csslab.cl/2011/01/31/anim...ones-con-css3/
usa Skew que es lo que necesitas