{{ define "main" }}
    {{ partial "hero.html" . }}
    {{ partial "usps.html" . }}
    {{ if .Params.info_section }}
    <section class="info-section py-5 my-lg-5">
        <div class="container">
            <div class="row align-items-center g-5">
                
                <div class="col-lg-5 pe-lg-5">
                    <div class="info-image-wrapper">
                        {{ with .Params.info_section.image }}
                        <img src="{{ . | relURL }}" 
                             alt="{{ $.Params.info_section.image_alt | default "Van Emous Mantelzorgwoningen" }}" 
                             class="img-fluid rounded-img shadow fade-left">
                        {{ end }}
                    </div>
                </div>

                <div class="col-lg-7 ps-lg-5">
                    {{ with .Params.info_section.eyebrow }}
                    <span class="h6 text-primary mb-3 d-block">
                        {{ . }}
                    </span>
                    {{ end }}

                    <h2 class="display-5 mb-4">
                        {{ .Params.info_section.title }}
                    </h2>
                    
                    <div class="info-content">
                        {{ range .Params.info_section.text_paragraphs }}
                            <div class="mb-4">
                                {{ .paragraph | markdownify }}
                            </div>
                        {{ end }}
                    </div>
                </div>

            </div>
        </div>
    </section>
    {{ end }}
    
    {{ partial "mogelijkheden.html" . }}
    {{ partial "map.html" . }}
    {{ partial "modellen.html" . }}

    {{ if .Content }}
    <div class="container my-5">
        {{ .Content }}
    </div>
    {{ end }}

    {{ if .Params.about_section }}
    <section class="info-section py-5 my-lg-5">
        <div class="container">
            <div class="row align-items-center g-5">
                
                <div class="col-lg-5 pe-lg-5">
                    <div class="info-image-wrapper">
                        {{ with .Params.about_section.image }}
                        <img src="{{ . | relURL }}" 
                             alt="{{ $.Params.info_section.image_alt | default "Van Emous Mantelzorgwoningen" }}" 
                             class="img-fluid rounded-img shadow">
                        {{ end }}
                    </div>
                </div>

                <div class="col-lg-7 ps-lg-5">
                    {{ with .Params.about_section.eyebrow }}
                    <span class="h6 text-primary mb-3 d-block">
                        {{ . }}
                    </span>
                    {{ end }}

                    <h2 class="display-5 mb-4">
                        {{ .Params.about_section.title }}
                    </h2>
                    
                    <div class="info-content">
                        {{ range .Params.about_section.text_paragraphs }}
                            <p class="mb-4">
                                {{ . | markdownify }}
                            </p>
                        {{ end }}
                    </div>
                </div>

            </div>
        </div>
    </section>
    {{ end }}

    {{ partial "faq.html" . }}

    {{ partial "footer-contact.html" . }}

{{ end }}