{{ define "main" }}
  {{ $heroImage := .Params.heroImage | default "images/visuels/Photo equipe.jpg" }}
  {{ $heroBg := resources.Get $heroImage }}
  <section class="quisommesnous-hero" {{ if $heroBg }}style="background-image: url('{{ $heroBg.RelPermalink }}')"{{ end }}>
  </section>

  <section class="page-quisommesnous">
    <h1 class="page-title">{{ .Params.headline | default "Qu'est-ce que la Maison de la Mobilité Solidaire ?" }}</h1>

    <div class="quisommesnous-content">
      <div class="quisommesnous-text">
        {{ .Content }}
      </div>
      {{ $visuel := resources.Get "images/visuels/visuel-mms43.svg" }}
      {{ if $visuel }}
        <div class="quisommesnous-image">
          <img src="{{ $visuel.RelPermalink }}" alt="Maison de la Mobilité Solidaire" />
        </div>
      {{ end }}
    </div>

  </section>

  {{ if .Params.savoirPlusLinks }}
    <div class="quisommesnous-savoirplus">
      <h2 class="savoirplus-title">{{ .Params.savoirPlusTitle | default "Pour en savoir plus" }}</h2>
      {{ $arrowIcon := resources.Get "images/picto/arrow_right_alt_24dp_1F1F1F_FILL1_wght400_GRAD0_opsz24.svg" }}
      <ul class="savoirplus-links">
        {{ range .Params.savoirPlusLinks }}
          <li class="savoirplus-item">
            {{ if $arrowIcon }}
              <img src="{{ $arrowIcon.RelPermalink }}" alt="" class="savoirplus-arrow" />
            {{ end }}
            <a href="{{ .url }}" target="_blank" class="savoirplus-link">{{ .text }}</a>
          </li>
        {{ end }}
      </ul>
    </div>
  {{ end }}
{{ end }}