The banner position renders a full-height hero. Two variants — Primary (65% overlay) and Secondary (80% overlay) — switchable via moduleclass_sfx with no CSS required.
Structure
Two layers: background colour/image + semi-transparent overlay for legibility. Inner .hero card controlled independently.
Switching Variants
| moduleclass_sfx | Variant | Overlay |
|---|---|---|
| (empty) | Primary | 65% navy |
alt |
Secondary | 80% near-black |
Key Variables
| Variable | Default | Controls |
|---|---|---|
--hero-height |
70vh |
Height |
--hero-primary-bg-color |
#0d1e3a |
Primary bg |
--hero-card-max-width |
800px |
Card width |
Tip: Use menu assignment to show a different hero per page without duplicating modules.