{{- $c := site.Data.content -}}
<section class="fees sheet" id="fees" aria-labelledby="fees-h">
    <div class="g4">
      <h2 class="label" id="fees-h">{{ $c.fees.h2_1 }}</h2>
      <p class="statement rv">{{ $c.fees.text_2 }} <span class="hl">{{ $c.fees.text_3 }}<svg class="squiggle" viewBox="0 0 300 20" preserveAspectRatio="none" aria-hidden="true"><path pathLength="1" d="M3 12C28 3 46 18 74 10s48-8 74 1 50 9 76-1 50-8 73 2" /></svg></span>{{ $c.fees.text_4 }}</p>
    </div>
    <div class="notes">
      <article class="note rv">
        <h3>{{ $c.fees.h3_5 }}</h3>
        <p class="price">{{ $c.fees.p_6_html | safeHTML }}</p>
        <ul><li>{{ $c.fees.li_7 }}</li><li>{{ $c.fees.li_8 }}</li><li>{{ $c.fees.li_9 }}</li></ul>
      </article>
      <article class="note rv" style="--d:.1s">
        <h3>{{ $c.fees.h3_10 }}</h3>
        <p class="price">{{ $c.fees.p_11_html | safeHTML }}</p>
        <ul><li>{{ $c.fees.li_12 }}</li><li>{{ $c.fees.li_13 }}</li><li>{{ $c.fees.li_14 }}</li></ul>
      </article>
      <article class="note rv" style="--d:.2s">
        <h3>{{ $c.fees.h3_15 }}</h3>
        <p class="price">{{ $c.fees.p_16_html | safeHTML }}</p>
        <ul><li>{{ $c.fees.li_17 }}</li><li>{{ $c.fees.li_18 }}</li><li>{{ $c.fees.li_19 }}</li></ul>
      </article>
    </div>
    <div class="fee-foot">
      <p class="rv">{{ $c.fees.p_20_html | safeHTML }}</p>
      <p class="rv" style="--d:.1s">{{ $c.fees.p_21_html | safeHTML }}</p>
    </div>
  </section>