{{- $c := site.Data.content -}}
<section class="top" id="projects" aria-labelledby="projects-title">
    <h2 id="projects-title">{{ $c.projects.h2_1 }}</h2>
    <article class="row" style="--pc:#b7ac85">
      <a class="img" href="{{ ($c.projects.a_2_href_image | relURL) }}" data-view><img src="{{ ($c.projects.img_3_image | relURL) }}" width="1200" height="1200" alt="{{ $c.projects.img_3_alt }}" loading="lazy"></a>
      <div class="text"><div class="inner">
        <span class="path">{{ $c.projects.span_4 }}</span>
        <div class="props">{{ $c.projects.div_5 }}</div>
        <h3>{{ $c.projects.h3_6 }}</h3>
        <p>{{ $c.projects.p_7 }}</p>
        <div class="coda"><ul><li>{{ $c.projects.li_8 }}</li><li>{{ $c.projects.li_9 }}</li><li>{{ $c.projects.li_10 }}</li></ul><button class="more" type="button" data-view-img="{{ ($c.projects.button_11_data_view_img_image | relURL) }}" data-alt="Harbor penthouse">{{ $c.projects.button_12 }}</button></div>
      </div></div>
    </article>
    <article class="row" style="--pc:#d3b573">
      <a class="img" href="{{ ($c.projects.a_13_href_image | relURL) }}" data-view><img src="{{ ($c.projects.img_14_image | relURL) }}" width="1200" height="1200" alt="{{ $c.projects.img_14_alt }}" loading="lazy"></a>
      <div class="text"><div class="inner">
        <span class="path">{{ $c.projects.span_15 }}</span>
        <div class="props">{{ $c.projects.div_16 }}</div>
        <h3>{{ $c.projects.h3_17 }}</h3>
        <p>{{ $c.projects.p_18 }}</p>
        <div class="coda"><ul><li>{{ $c.projects.li_19 }}</li><li>{{ $c.projects.li_20 }}</li><li>{{ $c.projects.li_21 }}</li></ul><button class="more" type="button" data-view-img="{{ ($c.projects.button_22_data_view_img_image | relURL) }}" data-alt="ORO restaurant">{{ $c.projects.button_23 }}</button></div>
      </div></div>
    </article>
    <article class="row" style="--pc:#c28faf">
      <a class="img" href="{{ ($c.projects.a_24_href_image | relURL) }}" data-view><img src="{{ ($c.projects.img_25_image | relURL) }}" width="1200" height="1200" alt="{{ $c.projects.img_25_alt }}" loading="lazy"></a>
      <div class="text"><div class="inner">
        <span class="path">{{ $c.projects.span_26 }}</span>
        <div class="props">{{ $c.projects.div_27 }}</div>
        <h3>{{ $c.projects.h3_28 }}</h3>
        <p>{{ $c.projects.p_29 }}</p>
        <div class="coda"><ul><li>{{ $c.projects.li_30 }}</li><li>{{ $c.projects.li_31 }}</li><li>{{ $c.projects.li_32 }}</li></ul><button class="more" type="button" data-view-img="{{ ($c.projects.button_33_data_view_img_image | relURL) }}" data-alt="BLOOM salon">{{ $c.projects.button_34 }}</button></div>
      </div></div>
    </article>
    <article class="row" style="--pc:#2c3d2f">
      <a class="img" href="{{ ($c.projects.a_35_href_image | relURL) }}" data-view><img src="{{ ($c.projects.img_36_image | relURL) }}" width="1200" height="1200" alt="{{ $c.projects.img_36_alt }}" loading="lazy"></a>
      <div class="text"><div class="inner">
        <span class="path">{{ $c.projects.span_37 }}</span>
        <div class="props">{{ $c.projects.div_38 }}</div>
        <h3>{{ $c.projects.h3_39 }}</h3>
        <p>{{ $c.projects.p_40 }}</p>
        <div class="coda"><ul><li>{{ $c.projects.li_41 }}</li><li>{{ $c.projects.li_42 }}</li><li>{{ $c.projects.li_43 }}</li></ul><button class="more" type="button" data-view-img="{{ ($c.projects.button_44_data_view_img_image | relURL) }}" data-alt="FERN apartment">{{ $c.projects.button_45 }}</button></div>
      </div></div>
    </article>
    <article class="row" style="--pc:#c1ac90">
      <a class="img" href="{{ ($c.projects.a_46_href_image | relURL) }}" data-view><img src="{{ ($c.projects.img_47_image | relURL) }}" width="1200" height="1200" alt="{{ $c.projects.img_47_alt }}" loading="lazy"></a>
      <div class="text"><div class="inner">
        <span class="path">{{ $c.projects.span_48 }}</span>
        <div class="props">{{ $c.projects.div_49 }}</div>
        <h3>{{ $c.projects.h3_50 }}</h3>
        <p>{{ $c.projects.p_51 }}</p>
        <div class="coda"><ul><li>{{ $c.projects.li_52 }}</li><li>{{ $c.projects.li_53 }}</li></ul><button class="more" type="button" data-view-img="{{ ($c.projects.button_54_data_view_img_image | relURL) }}" data-alt="Linen House">{{ $c.projects.button_55 }}</button></div>
      </div></div>
    </article>
  </section>