/* Animated counter — counts up when scrolled into view */
function Counter({ to, prefix = "", suffix = "", duration = 1800, decimals = 0 }) {
  const ref = React.useRef(null);
  const [val, setVal] = React.useState(0);
  const startedRef = React.useRef(false);

  React.useEffect(() => {
    const el = ref.current;
    if (!el) return;
    const obs = new IntersectionObserver(([entry]) => {
      if (entry.isIntersecting && !startedRef.current) {
        startedRef.current = true;
        const t0 = performance.now();
        const tick = (now) => {
          const p = Math.min(1, (now - t0) / duration);
          // Ease-out
          const eased = 1 - Math.pow(1 - p, 3);
          setVal(to * eased);
          if (p < 1) requestAnimationFrame(tick);
        };
        requestAnimationFrame(tick);
      }
    }, { threshold: 0.4 });
    obs.observe(el);
    return () => obs.disconnect();
  }, [to, duration]);

  const display = decimals > 0 ? val.toFixed(decimals) : Math.round(val).toLocaleString("es-AR");
  return <span ref={ref}>{prefix}{display}{suffix}</span>;
}

function MetricsStrip() {
  return (
    <section className="container" style={{paddingTop: 0, marginBottom: 24}}>
      <div className="metrics">
        <div className="metric">
          <div className="v">+<Counter to={2} decimals={0}/><span className="unit">hs/día</span></div>
          <div className="l">recuperadas por radiólogo</div>
        </div>
        <div className="metric">
          <div className="v"><Counter to={50}/><span className="unit">%</span></div>
          <div className="l">menos tiempo de informe</div>
        </div>
        <div className="metric">
          <div className="v"><Counter to={95}/><span className="unit">%</span></div>
          <div className="l">confianza promedio de la IA</div>
        </div>
        <div className="metric">
          <div className="v"><Counter to={15}/><span className="unit">gratis</span></div>
          <div className="l">informes para que lo pruebes hoy</div>
        </div>
      </div>
    </section>
  );
}

window.Counter = Counter;
window.MetricsStrip = MetricsStrip;