/* Ingredients — botanical promise as a three-up feature grid (sand section). */
function Ingredients() {
  const items = [
    ["leaf", "精油植萃配方", "嚴選維吉尼亞雪松與有機波旁天竺葵精油，柔和香氛陪毛孩舒緩情緒。"],
    ["sparkles", "不添加香精與色素", "把多餘的添加拿掉，只留下單純親膚的成分，日常使用也安心。"],
    ["droplets", "溫和潔淨・呵護屏障", "胺基酸系潔淨搭配玻尿酸與維生素 B5，洗後不乾澀，呵護肌膚與毛髮。"],
  ];
  return (
    <section className="section section--sand" id="ingredients">
      <div className="container">
        <div className="section-head">
          <span className="eyebrow">Botanical &amp; Gentle · 天然植萃</span>
          <h2>單純的成分，<br />是我們對牠的溫柔。</h2>
          <p>我們相信，最好的照顧是剛剛好。不多餘添加，把選擇權留給最了解牠的你。</p>
        </div>
        <div className="feature-grid">
          {items.map(([icon, title, body]) => (
            <div className="feature reveal" key={title}>
              <div className="ic"><Icon name={icon} className="lc-24" /></div>
              <h4>{title}</h4>
              <p>{body}</p>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

window.Ingredients = Ingredients;