<script setup>
import { features } from '../data/homepage'
import IconMark from './IconMark.vue'
import SectionTitle from './SectionTitle.vue'
</script>

<template>
  <section id="platform" class="platform-section page-section">
    <div class="container">
      <SectionTitle title="患者精细化管理服务平台" />
      <div class="feature-grid">
        <article v-for="feature in features" :key="feature.title" class="feature-card">
          <div class="feature-head">
            <div class="feature-icon">
              <IconMark :name="feature.icon" :size="44" />
            </div>
            <h3>{{ feature.title }}</h3>
          </div>
          <ul class="feature-list">
            <li v-for="item in feature.items" :key="item">
              <span class="check-dot">
                <IconMark name="check" :size="11" />
              </span>
              {{ item }}
            </li>
          </ul>
        </article>
      </div>
    </div>
  </section>
</template>
