Banner Component - Metalsmith Call-to-Action Section

- sectionType: banner
  containerTag: aside
  classes: ''
  id: ''
  isDisabled: false
  isReverse: false
  isAnimated: true
  containerFields:
    inContainer: false          # Stretch across viewport
    noMargin:
      top: true
      bottom: true
    noPadding:
      top: false
      bottom: false
    background:
      color: ''
      image: '/assets/images/sample8.jpg'
      imageScreen: 'light'     # Options: light, dark, none
  text:
    leadIn: 'With Background Image'
    title: CTA Banner Example
    titleTag: 'h2'
    subTitle: Uses light image screen for better text contrast
    prose: Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies.
  ctas:
    - url: 'https://apple.com'
      label: 'go to apple'
      isButton: true
      buttonStyle: 'primary'
    - url: 'https://ibm.com'
      label: 'go to big brother'
      isButton: false
      buttonStyle: 'primary'

Configuration Options

Container Layout

Property	Type	Required	Description
`inContainer`	boolean	No	`true` restricts width to content width, `false` stretches banner across viewport

Background Options

Property	Type	Required	Description
`image`	string	No	Background image URL
`color`	string	No	Background color
`isDark`	boolean	No	Indicates dark background for text color adjustment
`imageScreen`	string	No	Screen overlay for better text readability ('light', 'dark', 'none')

Content

Property	Type	Required	Description
`text`	object	Yes	Standard text block with leadIn, title, subtitle, and prose
`ctas`	array	No	Array of call-to-action buttons or links