<!-- source-hash: 4e95a6a9f9ef814174b92059833949dc -->
Accessible modal dialog component with keyboard navigation, backdrop click-to-close, and scroll locking. Built with React context to share close functionality across sub-components.

## Key Components

| Export | Description |
|--------|-------------|
| `ModalV2` | Root modal container — manages open state, Escape key handling, and body scroll lock |
| `ModalV2Header` | Header row with close button (desktop only); consumes `ModalContext` for `onClose` |
| `ModalV2Title` | Styled `<h2>` heading for the modal title |
| `ModalV2Content` | Scrollable content area with `overflow-y-auto` |
| `ModalV2Footer` | Flex row container for action buttons |

## Usage Example

```typescript
import {
  ModalV2,
  ModalV2Header,
  ModalV2Title,
  ModalV2Content,
  ModalV2Footer,
} from "@/components/modal-v2"

function ExampleModal() {
  const [isOpen, setIsOpen] = React.useState(false)

  return (
    <ModalV2 isOpen={isOpen} onClose={() => setIsOpen(false)}>
      <ModalV2Header>
        <ModalV2Title>Confirm Action</ModalV2Title>
      </ModalV2Header>
      <ModalV2Content>
        <p>Are you sure you want to proceed?</p>
      </ModalV2Content>
      <ModalV2Footer>
        <button onClick={() => setIsOpen(false)}>Cancel</button>
        <button onClick={handleConfirm}>Confirm</button>
      </ModalV2Footer>
    </ModalV2>
  )
}
```

## Behavior Notes

- **Escape key** closes the modal automatically while open
- **Backdrop click** dismisses via the overlay `div`
- **Body scroll** is locked (`overflow: hidden`) while open and restored on close
- **Close button** renders only on `md+` breakpoints; mobile relies on backdrop/Escape
- All sub-components forward refs to their underlying DOM elements