function AutoSlideSection({ workflow }) {
  return (
    <section className="section section-highlight" id="autoslide">
      <div className="section-heading">
        <p className="eyebrow">Product spotlight</p>
        <h2>AutoSlide brings AI into the pathology workflow without adding friction.</h2>
      </div>
      <div className="feature-layout">
        <article className="feature-card feature-card-large">
          <h3>From upload to insight</h3>
          <p>
            AutoSlide is built for users who need a simple, secure-feeling web experience: upload the
            slide, let the AI process the image, and review prioritized findings through a clear interface.
          </p>
          <div className="workflow-list">
            {workflow.map((item) => (
              <div className="workflow-step" key={item}>
                <span className="workflow-index"></span>
                <p>{item}</p>
              </div>
            ))}
          </div>
        </article>

        <article className="feature-card feature-card-side">
          <h3>Why it matters</h3>
          <p>
            Whole slide images are information-dense. AI can help surface patterns faster, supporting
            more efficient review and earlier attention to meaningful abnormalities.
          </p>
          <a className="inline-link" href="https://autoslide.io" target="_blank" rel="noreferrer">
            Explore the platform
          </a>
        </article>
      </div>
    </section>
  );
}