{{- $c := site.Data.content -}}
<section class="sec book dark" id="book" aria-labelledby="book-h">
    <div class="wrap book-grid">
      <div data-r>
        <span class="pill">{{ $c.book.span_1 }}</span>
        <h2 id="book-h">{{ $c.book.h2_2_html | safeHTML }}</h2>
        <p class="lead">{{ $c.book.p_3 }}</p>
        <ul class="facts">
          <li>{{ $c.book.li_4 }}</li>
          <li>{{ $c.book.li_5 }}</li>
          <li>{{ $c.book.li_6 }}</li>
        </ul>
        <div class="reach">
          <a href="tel:+15550163318">{{ $c.book.a_7 }}</a>
          <a href="mailto:hello@tamsa.example">{{ $c.book.a_8 }}</a>
          <span>{{ $c.book.span_9 }}</span>
        </div>
      </div>
      <div data-r style="--d:1">
        
        <form class="form" id="f-contact" action="https://formgong.com/submit" method="POST">
          <input type="hidden" name="access_key" value="{{ $c.form.access_key }}">
          <input type="hidden" name="subject" value="New appointment request from the Tamsa website">
          <div class="hp" aria-hidden="true"><label>{{ $c.book.text_10 }}<input name="botcheck" tabindex="-1" autocomplete="off"></label></div>
          <div class="field full"><label for="c-name">{{ $c.book.label_11 }}</label><input id="c-name" name="name" autocomplete="name" required maxlength="100"></div>
          <div class="field"><label for="c-email">{{ $c.book.label_12 }}</label><input id="c-email" name="email" type="email" autocomplete="email" required maxlength="160"></div>
          <div class="field"><label for="c-phone">{{ $c.book.label_13_html | safeHTML }}</label><input id="c-phone" name="phone" type="tel" autocomplete="tel" maxlength="40"></div>
          <fieldset class="full">
            <legend>{{ $c.book.legend_14 }}</legend>
            <div class="chips">
              <label><input type="radio" name="service" value="Free intro call" checked><span>{{ $c.book.span_15 }}</span></label>
              <label><input type="radio" name="service" value="Baseline check-up"><span>{{ $c.book.span_16 }}</span></label>
              <label><input type="radio" name="service" value="Results review"><span>{{ $c.book.span_17 }}</span></label>
              <label><input type="radio" name="service" value="Membership"><span>{{ $c.book.span_18 }}</span></label>
              <label><input type="radio" name="service" value="Nutrition"><span>{{ $c.book.span_19 }}</span></label>
              <label><input type="radio" name="service" value="Coaching"><span>{{ $c.book.span_20 }}</span></label>
            </div>
          </fieldset>
          <div class="field full"><label for="c-time">{{ $c.book.label_21_html | safeHTML }}</label>
            <select id="c-time" name="preferred_time">
              <option value="Any time">{{ $c.book.option_22 }}</option>
              <option value="Weekday morning">{{ $c.book.option_23 }}</option>
              <option value="Weekday afternoon">{{ $c.book.option_24 }}</option>
              <option value="Weekday evening">{{ $c.book.option_25 }}</option>
              <option value="Saturday morning">{{ $c.book.option_26 }}</option>
            </select>
          </div>
          <div class="field full"><label for="c-msg">{{ $c.book.label_27_html | safeHTML }}</label><textarea id="c-msg" name="message" maxlength="600" aria-describedby="c-hint"></textarea>
            <p class="hint" id="c-hint">{{ $c.book.p_28 }}</p>
          </div>
          <div class="send full">
            <button class="btn" type="submit"><span data-send-label>{{ $c.book.span_29 }}</span> <span class="arr" aria-hidden="true">→</span></button>
            <small>{{ $c.book.small_30 }}</small>
          </div>
          <p class="status full" data-status role="status" aria-live="polite"></p>
          <p class="credit full">{{ $c.book.p_31_html | safeHTML }}</p>
          <div class="thanks" tabindex="-1">
            <div class="tick" aria-hidden="true"><svg width="30" height="30" viewBox="0 0 20 20"><path d="M5 10.5l3.2 3.2L15 7" fill="none" stroke="#1A2420" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" /></svg></div>
            <h3>{{ $c.book.h3_32_html | safeHTML }}</h3>
            <p>{{ $c.book.p_33 }}</p>
            <button class="btn out" type="button" data-again>{{ $c.book.button_34 }}</button>
          </div>
        </form>
      </div>
    </div>
  </section>