%section.overflow-hidden.bg-cover.bg-center.bg-no-repeat{style: bg(section)}
  .p-8.md:p-12.lg:px-16.lg:py-24
    .max-w-lg.text-center.sm:text-left{:class => "bg-black/25"}
      %h2.text-2xl.font-bold.text-white.sm:text-3xl.md:text-5xl
        = section["header"]
      %p.hidden.max-w-md.md:mt-6.md:block.md:text-lg.md:leading-relaxed{:class => "text-white/90"}
        = section["text"]
      -if section["button_text"]
        .mt-4.sm:mt-8
          %a.inline-flex.items-center.rounded-full.bg-indigo-700.px-8.py-3.text-white.shadow-lg.transition.hover:bg-indigo-600.focus:outline-none.focus:ring{:href => section["button_link"]}
            %span.text-sm.font-medium section["button_text"]
            %svg.ml-3.h-5.w-5{:fill => "none", :stroke => "currentColor", :viewbox => "0 0 24 24", :xmlns => "http://www.w3.org/2000/svg"}
              %path{:d => "M17 8l4 4m0 0l-4 4m4-4H3", "stroke-linecap" => "round", "stroke-linejoin" => "round", "stroke-width" => "2"}