{{- $c := site.Data.content -}}
<section class="contacts" id="contacts" aria-labelledby="ct-h">
    <h1 class="huge ct-head" id="ct-h" tabindex="-1" data-rise>{{ $c.contacts.h1_1 }}</h1>
    <p class="ct-intro reveal">{{ $c.contacts.p_2 }}</p>
    <div class="rows">
      <div class="row"><p>{{ $c.contacts.p_3 }}</p><p class="t">{{ $c.contacts.p_4_html | safeHTML }}</p><p class="t"><a href="tel:+390200000000">{{ $c.contacts.a_5 }}</a><br><a href="mailto:info@example.com">{{ $c.contacts.a_6 }}</a></p></div>
      <div class="row"><p>{{ $c.contacts.p_7 }}</p><p class="t">{{ $c.contacts.p_8_html | safeHTML }}</p><p class="t"><a href="tel:+390200000001">{{ $c.contacts.a_9 }}</a><br><a href="mailto:milano@example.com">{{ $c.contacts.a_10 }}</a></p></div>
      <div class="row"><p>{{ $c.contacts.p_11 }}</p><p class="t">{{ $c.contacts.p_12_html | safeHTML }}</p><p class="t">{{ $c.contacts.p_13 }}</p></div>
      <div class="row"><p>{{ $c.contacts.p_14 }}</p><p class="t">{{ $c.contacts.p_15_html | safeHTML }}</p><p class="t"><a href="tel:+39031000000">{{ $c.contacts.a_16 }}</a><br><a href="mailto:como@example.com">{{ $c.contacts.a_17 }}</a></p></div>
      <div class="row"><p>{{ $c.contacts.p_18 }}</p><p class="t">{{ $c.contacts.p_19 }}</p><p class="t">{{ $c.contacts.p_20 }}</p></div>
    </div>

    <div class="service">
      <h2 class="huge" data-rise>{{ $c.contacts.h2_21_html | safeHTML }}</h2>
      <div class="row"><p>{{ $c.contacts.p_22 }}</p><p>{{ $c.contacts.p_23 }}</p><p></p></div>
      <div class="row"><p>{{ $c.contacts.p_24 }}</p><p class="t">{{ $c.contacts.p_25_html | safeHTML }}</p><p class="t"><a href="tel:+393000000000">{{ $c.contacts.a_26 }}</a><br><a href="mailto:service@example.com">{{ $c.contacts.a_27 }}</a></p></div>
    </div>

    <h2 class="huge fm-head" data-rise>{{ $c.contacts.h2_28 }}</h2>
    <p class="fm-intro reveal">{{ $c.contacts.p_29 }}</p>

    
    <form id="fg-form" action="https://formgong.com/submit" method="POST" enctype="multipart/form-data" data-sitekey>
      <input type="hidden" name="access_key" value="{{ $c.form.access_key }}">
      <input type="hidden" name="_lang" value="en">
      <div aria-hidden="true" style="position:absolute;inset-inline-start:0;top:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)"><label>{{ $c.contacts.text_30 }}<input name="botcheck" tabindex="-1" autocomplete="off"></label></div>
      <div class="fr"><label for="f-name">{{ $c.contacts.label_31 }}</label><input id="f-name" name="name" type="text" required maxlength="80" autocomplete="name" placeholder="Enter name and surname *"></div>
      <div class="fr"><label for="f-email">{{ $c.contacts.label_32 }}</label><input id="f-email" name="email" type="email" required maxlength="120" autocomplete="email" placeholder="Enter your email *"></div>
      <div class="fr"><label for="f-phone">{{ $c.contacts.label_33 }}</label><input id="f-phone" name="phone" type="tel" maxlength="40" autocomplete="tel" placeholder="Enter your phone"></div>
      <div class="fr"><label for="f-city">{{ $c.contacts.label_34 }}</label><input id="f-city" name="city" type="text" maxlength="80" autocomplete="address-level2" placeholder="Where is the house?"></div>
      <div class="fr msg"><label for="f-message">{{ $c.contacts.label_35 }}</label><textarea id="f-message" name="message" required maxlength="3000" placeholder="Enter request *"></textarea></div>
      
      <div data-turnstile hidden></div>
      <div class="fr-end">
        <div class="checks">
          <label class="check"><input type="checkbox" name="privacy" value="yes" required><span>{{ $c.contacts.span_36_html | safeHTML }}</span></label>
          <label class="check"><input type="checkbox" name="marketing" value="yes"><span>{{ $c.contacts.span_37 }}</span></label>
        </div>
        <button class="send caps" type="submit"><span data-send-label>{{ $c.contacts.span_38 }}</span></button>
      </div>
      <p class="status" data-status role="status"></p>
      <div class="sent" tabindex="-1">
        <p class="caps">{{ $c.contacts.p_39 }}</p>
        <p class="t">{{ $c.contacts.p_40_html | safeHTML }}</p>
        <button type="button" class="send caps" data-again>{{ $c.contacts.button_41 }}</button>
      </div>
    </form>
    <p class="credit">{{ $c.contacts.p_42_html | safeHTML }}</p>

    <footer class="foot">
      <div class="f-cols">
        <div class="f-col"><h3>{{ $c.contacts.h3_43 }}</h3><p>{{ $c.contacts.p_44_html | safeHTML }}</p><p>{{ $c.contacts.p_45_html | safeHTML }}</p></div>
        <nav class="f-col" aria-label="Footer"><h3>{{ $c.contacts.h3_46 }}</h3><a href="#home">{{ $c.contacts.a_47 }}</a><br><a href="#home" data-cat="0">{{ $c.contacts.a_48 }}</a><br><a href="#home" data-cat="1">{{ $c.contacts.a_49 }}</a><br><a href="#home" data-cat="2">{{ $c.contacts.a_50 }}</a><br><a href="#contacts">{{ $c.contacts.a_51 }}</a></nav>
        <div class="f-col"><h3>{{ $c.contacts.h3_52 }}</h3><p>{{ $c.contacts.p_53_html | safeHTML }}</p></div>
        <div class="f-col"><h3>{{ $c.contacts.h3_54 }}</h3><p>{{ $c.contacts.p_55_html | safeHTML }}</p></div>
        <div class="f-col"><h3>{{ $c.contacts.h3_56 }}</h3><a href="#">{{ $c.contacts.a_57 }}</a><br><a href="#">{{ $c.contacts.a_58 }}</a><br><a href="#">{{ $c.contacts.a_59 }}</a><br><a href="#">{{ $c.contacts.a_60 }}</a></div>
      </div>
      <div class="f-legal">
        <p>{{ $c.contacts.p_61_html | safeHTML }}</p>
        <nav aria-label="Legal"><a href="#">{{ $c.contacts.a_62 }}</a><a href="#">{{ $c.contacts.a_63 }}</a><a href="https://formgong.com" rel="noopener">{{ $c.contacts.a_64 }}</a></nav>
      </div>
    </footer>
  </section>