“focusable” behavior

Task: Suppose, you want to create web-page with few areas. Each area has multiple inputs. When focus “belongs” to a particular area, it is indicated with some CSS and area captures keyboard navigation.

Problem: how to manage focus transfer within the area (that means, between inputs of the area) and between areas – with as less code as possible?