%section.overflow-hidden.bg-cover.bg-center.bg-no-repeat{style: bg(section)}
  .mx-auto.max-w-screen-2xl.px-4.py-8.sm:px-6.lg:px-8
    .grid.grid-cols-1.gap-4.md:grid-cols-2
      .p-8.md:p-12.lg:px-16.lg:py-24{class: 'bg-black/25'}
        .mx-auto.max-w-xl.text-center
          %h2.text-2xl.font-bold.text-white.md:text-5xl
            = section["header"]
          %p.hidden.sm:mt-4.sm:block.text-2xl.text-white
            = section["text"]
          .mt-4.md:mt-8
            -if section["button_text"]
              %a.inline-block.rounded.border.border-white.bg-white.px-12.py-3.text-sm.font-medium.text-blue-500.transition.hover:bg-transparent.hover:text-white.focus:outline-none.focus:ring.focus:ring-yellow-400{:href => section["button_link"]}
                =section["button_text"]
      .grid.grid-cols-2.gap-4.md:grid-cols-1.lg:grid-cols-2