{{> organisms-header }}
{{> organisms-elections-hero }}

<div class="container container--default pt-8 lg:py-24">
  <div class="text-center">
    {{> molecules-binary-switch(cta1: "Kandidáti", cta2: "Program", secondActive: true) }}
  </div>

  <h1 class="head-alt-md text-center py-8 lg:pt-24 lg:pb-8">Volební program</h1>

  <div class="candidate-card-list grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
    {{> molecules-image-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Otevřenost a zapojení občanů" )}}
    {{> molecules-image-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
    {{> molecules-image-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Řízení a organizační struktura města" )}}
    {{> molecules-image-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Rozvoj města a bydlení" )}}
    {{> molecules-image-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Doprava" )}}
    {{> molecules-image-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Veřejný prostor a zeleň" )}}
    {{> molecules-image-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Vzdělávání" )}}
    {{> molecules-image-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Kultura a volný čas" )}}
  </div>

  <div class="flex flex-col pt-8 lg:pt-24 lg:flex-row lg:space-x-8">
    {{> atoms-super-button(cta: "Povolební strategie", icon: "fa fa-chess", classes: "bg-grey-125 hover:bg-black hover:text-white lg:w-full container-padding--zero lg:container-padding--auto") }}
    {{> atoms-super-button(cta: "Financování kampaně", icon: "fa fa-calculator", classes: "bg-black text-white hover:bg-grey-125 hover:text-black lg:w-full container-padding--zero lg:container-padding--auto") }}
  </div>
</div>


{{> organisms-footer }}