{{include "header.html"}}
{{include "nav.html"}}

{{if .Single}}
<main class="tt-main tt-main--office">
  {{$banner := index .Single.Ext "banner_img"}}
  {{if $banner}}
  <section class="tt-pagebanner">
    <img src="{{$banner}}" alt="{{.Single.Name}}">
    <div class="tt-pagebanner__shade"></div>
    <div class="tt-pagebanner__caption">
      <span class="tt-eyebrow tt-eyebrow--light">{{.Single.Name}}</span>
      {{if .Single.Description}}<h1>{{.Single.Description}}</h1>{{end}}
    </div>
  </section>
  {{end}}

  <section class="tt-office">
    <article class="tt-office__copy tt-prose">{{.Single.Content|Str2Html}}</article>

    {{$principles := index .Single.Ext "principles"}}
    {{if $principles}}
    <aside class="tt-office__principles">
      <span class="tt-eyebrow">Principles</span>
      <ul>
        {{range $principles}}
        <li>
          <h4>{{.title}}</h4>
          <p>{{.desc}}</p>
        </li>
        {{end}}
      </ul>
    </aside>
    {{end}}
  </section>

  <section class="tt-section tt-partners tt-partners--office">
    <span class="tt-eyebrow">Selected partners and networks</span>
    <div class="tt-partners__row">
      {{range (index .ThemesExt "partners")}}<span class="tt-partner">{{.name}}</span>{{end}}
    </div>
  </section>

  <section class="tt-cta">
    <h2>Visit the studio, share a site, or send a question.</h2>
    <a class="tt-cta__btn" href="/contacts">Contacts →</a>
  </section>
</main>
{{end}}

{{include "footer.html"}}
{{include "js.html"}}