/* eslint-disable */
function Reviews() {
  const r = [
    { name: "Sarah K.", verified: true, rating: 5, title: "Wear it every day, no tarnish.", body: "I've had the Amelia for 4 months — shower, pool, gym. Looks brand new.", img: "assets/hero-main.jpg" },
    { name: "Marcus T.", verified: true, rating: 5, title: "Solid weight, real chain feel.", body: "Was worried it'd feel flimsy. It doesn't. Heavier than my old silver chain.", img: "assets/hero-mens.jpg" },
    { name: "Jules R.", verified: true, rating: 5, title: "Made the bundle worth it.", body: "Bought the 3-piece. Layers perfectly with what I already had.", img: "assets/banner-bundles.jpg" },
  ];
  return (
    <section className="reviews">
      <div className="eyebrow center">CUSTOMERS SAY</div>
      <h2 className="center">★★★★★ <span className="rev-num">4.9 from 50,000+ reviews</span></h2>
      <div className="rev-grid">
        {r.map((x,i) => (
          <article key={i} className="rev-card">
            <div className="rev-stars">★★★★★</div>
            <div className="rev-title">{x.title}</div>
            <p className="rev-body">{x.body}</p>
            <div className="rev-foot">
              <div className="rev-thumb" style={{backgroundImage:`url(${x.img})`}}></div>
              <div>
                <div className="rev-name">{x.name}</div>
                {x.verified && <div className="rev-verified">✓ Verified buyer</div>}
              </div>
            </div>
          </article>
        ))}
      </div>
    </section>
  );
}
window.Reviews = Reviews;

/* Footer moved to Footer.jsx */