<section class="w-full px-4 md:px-12 lg:px-24 py-20 md:py-32 lg:py-40" data-component-type="Content">
  <!-- TAG -->
  <div class="flex justify-center w-full">
    <div
      class="inline-block px-4 py-2 md:px-6 md:py-2 rounded-xl text-white text-[20px] md:text-[22px] lg:text-[32px] font-normal bg-white/[0.07] border border-white/[0.12] backdrop-blur-[18px] mb-5"
      data-node="achievements_tag"
      data-node-type="text"
      data-node-default="Our Achievements"
    >
      {{achievements_tag}}
    </div>
  </div>

  <!-- TITLE -->
  <h2
    class="text-center mx-auto mb-5 md:mb-12 lg:mb-20 text-white font-medium leading-[0.95] text-[30px] md:text-[40px] lg:text-[64px] max-w-[1000px]"
    data-node="achievements_title"
    data-node-type="text"
    data-node-default="Real outcomes across industries and markets."
  >
    {{achievements_title}}
  </h2>

  <!-- TABLE - Desktop -->
  <div class="w-full">
    <table class="w-full border-collapse table-fixed">
      <thead>
        <tr>
          <th
            class="text-left text-[24px] font-normal text-white pb-10 w-[12%]"
            data-node="achievements_table_header_1"
            data-node-label="Achievements Table Header 1"
            data-node-type="text"
            data-node-default="Year"
          >
            {{achievements_table_header_1}}
          </th>
          <th
            class="text-left text-[24px] font-normal text-white pb-10 w-[28%]"
            data-node="achievements_table_header_2"
            data-node-label="Achievements Table Header 2"
            data-node-type="text"
            data-node-default="Awards & Recognition"
          >
            {{achievements_table_header_2}}
          </th>
          <th
            class="text-left text-[24px] font-normal text-white pb-10 w-[25%]"
            data-node="achievements_table_header_3"
            data-node-label="Achievements Table Header 3"
            data-node-type="text"
            data-node-default="Project"
          >
            {{achievements_table_header_3}}
          </th>
          <th
            class="text-left text-[24px] font-normal text-white pb-10 w-[35%]"
            data-node="achievements_table_header_4"
            data-node-label="Achievements Table Header 4"
            data-node-type="text"
            data-node-default="Description"
          >
            {{achievements_table_header_4}}
          </th>
        </tr>
      </thead>
      <tbody>
        <!-- ROW 1 -->
        <tr class="border-b border-white/15">
          <td
            data-node="achievement_data_row_1_1"
            data-node-label="Achievement Data Row 1 Column 1"
            data-node-type="text"
            data-node-default="2021"
            class="text-[24px] text-white font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_1_1}}
          </td>
          <td
            data-node="achievement_data_row_1_2"
            data-node-label="Achievement Data Row 1 Column 2"
            data-node-type="text"
            data-node-default="Emerging Digital Partner"
            class="text-[24px] text-white font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_1_2}}
          </td>
          <td
            data-node="achievement_data_row_1_3"
            data-node-label="Achievement Data Row 1 Column 3"
            data-node-type="text"
            data-node-default="SaaS Growth Campaign"
            class="text-[24px] text-white font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_1_3}}
          </td>
          <td
            data-node="achievement_data_row_1_4"
            data-node-label="Achievement Data Row 1 Column 4"
            data-node-type="textarea"
            data-node-default="Helped a B2B SaaS brand achieve a 3× lead increase through funnel optimization."
            class="text-[24px] text-[#7E7E7E] font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_1_4}}
          </td>
        </tr>
        <!-- ROW 2 -->
        <tr class="border-b border-white/15">
          <td
            data-node="achievement_data_row_2_1"
            data-node-label="Achievement Data Row 2 Column 1"
            data-node-type="text"
            data-node-default="2022"
            class="text-[24px] text-white font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_2_1}}
          </td>
          <td
            data-node="achievement_data_row_2_2"
            data-node-label="Achievement Data Row 2 Column 2"
            data-node-type="text"
            data-node-default="Best Performance Campaign"
            class="text-[24px] text-white font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_2_2}}
          </td>
          <td
            data-node="achievement_data_row_2_3"
            data-node-label="Achievement Data Row 2 Column 3"
            data-node-type="text"
            data-node-default="E-commerce Brand Expansion"
            class="text-[24px] text-white font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_2_3}}
          </td>
          <td
            data-node="achievement_data_row_2_4"
            data-node-label="Achievement Data Row 2 Column 4"
            data-node-type="textarea"
            data-node-default="Built SEO and paid content systems that reduced CPA by 42% while scaling traffic."
            class="text-[24px] text-[#7E7E7E] font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_2_4}}
          </td>
        </tr>
        <!-- ROW 3 -->
        <tr class="border-b border-white/15">
          <td
            data-node="achievement_data_row_3_1"
            data-node-label="Achievement Data Row 3 Column 1"
            data-node-type="text"
            data-node-default="2023"
            class="text-[24px] text-white font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_3_1}}
          </td>
          <td
            data-node="achievement_data_row_3_2"
            data-node-label="Achievement Data Row 3 Column 2"
            data-node-type="text"
            data-node-default="Brand Transformation Excellence"
            class="text-[24px] text-white font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_3_2}}
          </td>
          <td
            data-node="achievement_data_row_3_3"
            data-node-label="Achievement Data Row 3 Column 3"
            data-node-type="text"
            data-node-default="Service-Based Business Rebrand"
            class="text-[24px] text-white font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_3_3}}
          </td>
          <td
            data-node="achievement_data_row_3_4"
            data-node-label="Achievement Data Row 3 Column 4"
            data-node-type="textarea"
            data-node-default="Delivered a full brand and website overhaul that improved conversion rates across all channels."
            class="text-[24px] text-[#7E7E7E] font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_3_4}}
          </td>
        </tr>
        <!-- ROW 4 -->
        <tr class="border-b border-white/15">
          <td
            data-node="achievement_data_row_4_1"
            data-node-label="Achievement Data Row 4 Column 1"
            data-node-type="text"
            data-node-default="2024"
            class="text-[24px] text-white font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_4_1}}
          </td>
          <td
            data-node="achievement_data_row_4_2"
            data-node-label="Achievement Data Row 4 Column 2"
            data-node-type="text"
            data-node-default="Conversion-Focused Web Experience"
            class="text-[24px] text-white font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_4_2}}
          </td>
          <td
            data-node="achievement_data_row_4_3"
            data-node-label="Achievement Data Row 4 Column 3"
            data-node-type="text"
            data-node-default="Multi-Industry Marketing Portfolio"
            class="text-[24px] text-white font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_4_3}}
          </td>
          <td
            data-node="achievement_data_row_4_4"
            data-node-label="Achievement Data Row 4 Column 4"
            data-node-type="textarea"
            data-node-default="Designed and launched high-converting landing pages and websites across SaaS, startups, and enterprises."
            class="text-[24px] text-[#7E7E7E] font-normal py-7 leading-[1.3]"
          >
            {{achievement_data_row_4_4}}
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</section>
