{{#with data.websiteDetails}}
<div class="agent-website-home-page">
    <div id="{{@root/dom/divHeroBackgroundImg}}"
        class="search-section ps-r paint-first-border-before paint-bloomingdale-first-background-before paint-shaw-first-background-before">
        <div class="search-bar-container bs4--d-flex bs4--flex-column bs4--justify-content-center">
            <h1 id="{{@root/dom/headlineText}}" class="rew-headline-text text-white bs4--text-center">
                {{#if websiteSettings.headline}}{{websiteSettings.headline}}{{else}}Find your next home{{/if}}
            </h1>
            <h2 id="{{@root/dom/subHeadlineText}}"
                class="rew-subheadline-text text-white bs4--text-center font-20 bs4--mb-6 theme-secondary-font {{#unless websiteSettings.subHeadline}}bs4--d-none{{/unless}}">
                {{websiteSettings.subHeadline}}</h2>
            <div id="{{@root/dom/divSearchBar}}"></div>
        </div>
    </div>
    <!-- Agent Section -->
    <div class="container agent-section">
        <div class="col-xs-12 col-sm-4 text-center">
            <div id="{{@root/dom/divUserProfileImage}}" class="headshot-div ml-15"></div>
            {{#if entityDetails.agentDetails.license}}<div class="font-16 bs4--mt-4 bs4--mb-n2">
                {{entityDetails.agentDetails.license}}</div>{{/if}}
            {{#or websiteSettings.logoUrl entityDetails.brand}}
            <div class="agent-logo-img bs4--mx-auto bs4--mt-3">
                <img class="logo img-responsive bs4--w-auto bs4--mx-auto"
                    src="{{#if websiteSettings.logoUrl}}{{websiteSettings.logoUrl}}{{else}}{{entityDetails.brand.image.url.default}}{{/if}}"
                    alt="{{#unless websiteSettings.logoUrl}}{{entityDetails.brand.name}}{{/unless}}" loading="lazy"
                    width="160" height="89">
            </div>
            {{/or}}
        </div>
        <div class="col-xs-12 col-sm-8 agent-description-container">
            <div id="{{@root/dom/divStoriesContainer}}" class="row"></div>

            <div class="rew-small-heading text-uppercase theme-main-font">
                {{entityDetails.name.full}}
            </div>
            <div id="{{@root/dom/divIntroText}}" class="rew-body-text bio-container ps-r paint-first-background-after">
                {{#if websiteSettings.homeText}}
                {{websiteSettings.homeText}}
                {{else}}
                I’m a real estate agent with {{entityDetails.agentDetails.brokerage}} in
                {{entityDetails.agentDetails.office.city}}, {{entityDetails.agentDetails.office.state}} and the nearby
                area, providing home-buyers and sellers with professional, responsive and attentive real estate
                services. Want an agent who'll really listen to what you want in a home? Need an agent who knows how to
                effectively market your home so it sells? Give me a call! I'm eager to help and would love to talk to
                you.
                {{/if}}
            </div>
            <div>
                <div class="rew-small-heading text-uppercase pv-20">contact me</div>
                <div class="rew-body-sm-text">
                    {{#if entityDetails.phones.0.phone}}
                    <span>Direct: </span>
                    <a id="{{@root/dom/aPhone}}" class="no-hover paint-first-font paint-first-font-selectable"
                        itemprop="telephone"
                        href="tel:{{entityDetails.phones.0.phone.withDashes}}">{{entityDetails.phones.0.phone.withDots}}</a><br>
                    {{/if}}
                    {{#if entityDetails.agentDetails.office.phone}}
                    <span>Office: </span>
                    <a id="{{@root/dom/aPhoneOffice}}" class="no-hover paint-first-font paint-first-font-selectable"
                        itemprop="telephone"
                        href="tel:{{entityDetails.agentDetails.office.phone.withDashes}}">{{entityDetails.agentDetails.office.phone.withDots}}</a><br>
                    {{/if}}
                    {{#if entityDetails.email}}
                    <a id="{{@root/dom/aEmail}}" class="no-hover paint-first-font paint-first-font-selectable"
                        itemprop="email" href="mailto:{{entityDetails.email}}"
                        target="_parent">{{entityDetails.email}}</a><br>
                    {{/if}}
                    {{#with websiteSettings}}
                    {{#or facebookUrl instagramUrl linkedInUrl twitterUrl youtubeUrl}}
                    <div id="{{@root/dom/divSocialMedia}}" class="bs4--mt-2"></div>
                    {{/or}}
                    {{/with}}
                </div>
            </div>
        </div>
    </div>
    <div id="{{@root/dom/divLeadQualifier}}"></div>
    <div id="{{@root/dom/divFeaturedArea}}"
        class="featured-area-section paint-brookland-first-background paint-base-font"></div>

    <div id="{{@root/dom/divFeaturedListings}}"
        class="featured-listings-section paint-brookland-first-border-l-after paint-brookland-first-border-r-after">
    </div>

    <div class="newsletter-section ps-r paint-first-background paint-eckington-second-background">
        <div class="container-lg clearfix paint-first-border-before">
            <div class="col-xs-6 text-center hidden-xs">
                <img class="phone-img img-responsive bs4--mx-auto" width="461" loading="lazy"
                    src="{{paths 'img'}}/Non_Branded_Newsletter.png" alt="Newsletter on Iphone">
            </div>
            <div
                class="col-xs-12 col-sm-6 newsletter-form-container text-center paint-first-background paint-eckington-second-background paint-base-font">
                <h1 class="headline-2">Sign Up for My Newsletter</h1 c>
                <p>Get weekly updates about new homes and market activities</p>
                <form id="{{@root/dom/formLead}}" class="form-container">
                    <div class="input-container">
                        <label class="sr-only" for="{{@root/dom/inputName}}">Name</label>
                        <input type="text" id="{{@root/dom/inputName}}" name="name" class="name-input" required
                            placeholder="Your Name" />
                    </div>
                    <div class="input-container">
                        <label class="sr-only" for="{{@root/dom/inputEmail}}">Email</label>
                        <input type="email" id="{{@root/dom/inputEmail}}" name="email" class="email-input" required
                            placeholder="Your Email" />
                    </div>
                    <div class="input-container">
                        <label class="sr-only" for="{{@root/dom/inputPhone}}">Phone Number</label>
                        <input type="text" id="{{@root/dom/inputPhone}}" name="phone" class="phone-input" required
                            placeholder="Phone Number" />
                    </div>
                    <div class="button rew-home-newsletter-button">
                        <button type="submit" id="{{@root/dom/btnSubmit}}"
                            class="template-btn paint-second-background paint-eckington-first-background paint-shaw-first-background paint-brookland-first-background paint-base-font paint-item-selectable">
                            <div id="{{@root/dom/btnText}}" class="btn-text">Send</div>
                            <div id="{{@root/dom/divLoader}}" class="dot-loader hidden">
                                <span></span>
                                <span></span>
                                <span></span>
                            </div>
                        </button>
                        <div id="{{@root/dom/divSuccessPanel}}" class="success-panel hidden mt-10">
                            <p>Thank you for subscribing to my newsletter!</p>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div id={{@root/dom/divReviews}} class="bs4--container"></div>
    <div class="office-address-container bs4--position-relative">
        <div id="{{@root/dom/divFooterBackgroundImg}}" class="office-address-section">
        </div>
        <div class="address-container bs4--position-absolute theme-main-font">
            {{#or websiteSettings.logoUrl entityDetails.brand}}
            <img class="logo bs4--mx-auto"
                src="{{#if websiteSettings.logoUrl}}{{websiteSettings.logoUrl}}{{else}}{{entityDetails.brand.image.url.default}}{{/if}}"
                alt="{{#unless websiteSettings.logoUrl}}{{entityDetails.brand.name}}{{/unless}}">
            {{/or}}
            <div class="theme-main-font">
                {{#with entityDetails.agentDetails.office}}
                {{name}}<br />
                {{address.fullStreetAddress}}<br />
                {{address.cityStateZip}}
                {{/with}}
            </div>
        </div>
    </div>
</div>
{{/with}}