// Diferenciais.jsx — 4 blocos leves
function Diferenciais() {
  const items = [
    { ic: 'heart', t: 'Atendimento acolhedor', d: 'Você recebe atenção individual durante todo o processo.' },
    { ic: 'shield', t: 'Segurança em primeiro lugar', d: 'Atendimento realizado com responsabilidade e cuidados adequados para cada pele.' },
    { ic: 'drop', t: 'Protocolo personalizado', d: 'Cada sessão é planejada de acordo com o seu fototipo e objetivo.' },
    { ic: 'sun', t: 'Estrutura confortável', d: 'Cabine preparada para proporcionar uma experiência mais agradável.' },
  ];
  return (
    <section className="section dif" id="diferenciais">
      <div className="wrap">
        <div className="sec-head center">
          <span className="eyebrow center reveal">Diferenciais</span>
          <h2 className="reveal" data-d="1">Por que escolher a Bronze Terê?</h2>
        </div>
        <div className="dif-grid">
          {items.map((it, i) => (
            <div className="dif-item reveal" data-d={i+1} key={i}>
              <span className="dif-ic">{Ic[it.ic]()}</span>
              <span className="dif-rule"></span>
              <h3>{it.t}</h3>
              <p>{it.d}</p>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}
Object.assign(window, { Diferenciais });
