@if (page(); as copy) {
  <div class="content-container stack page">
    <app-page-hero [hero]="copy.hero" [ctas]="copy.ctas" />
    @for (section of copy.sections; track section.id) {
      @if (section.id === 'profile') {
        <app-content-section [section]="section" />
        <ul class="stack">
          @for (line of copy.profile; track $index) {
            <li>{{ line }}</li>
          }
        </ul>
        <app-metric-list [metrics]="copy.metrics" [labelledBy]="'section-profile'" />
        <section class="stack" [attr.aria-labelledby]="'pitch-timeline'">
          <h2 id="pitch-timeline">{{ copy.timelineHeading }}</h2>
          <ol class="stack">
            @for (entry of copy.timeline; track entry.id) {
              <li>
                <p>
                  <strong>{{ entry.period }}</strong>
                  · {{ entry.role }}
                </p>
                <p>{{ entry.body }}</p>
              </li>
            }
          </ol>
        </section>
        <section class="stack" [attr.aria-labelledby]="'pitch-stack'">
          <h2 id="pitch-stack">{{ copy.stackHeading }}</h2>
          <ul class="stack">
            @for (group of copy.coreStack; track group.id) {
              <li>
                <p>
                  <strong>{{ group.title }}</strong>
                  @if (group.body) {
                    — {{ group.body }}
                  }
                </p>
              </li>
            }
          </ul>
        </section>
      }
      @if (section.id === 'featured-cases') {
        <app-content-section [section]="section" />
        <div class="stack">
          @for (caseStudy of featuredCases(); track caseStudy.id) {
            <app-case-card [caseStudy]="caseStudy" />
          }
        </div>
      }
    }
    <app-cta-row [ctas]="copy.ctas" />
  </div>
}