function Quote() {
  const { Reveal, useParallax } = window.JMK;
  const [driftRef, driftY] = useParallax(0.14);
  return (
    <section className="jmk-stage" style={{ background: "var(--color-primary)", padding: "clamp(80px,12vw,120px) clamp(20px,5vw,64px)", overflow: "hidden" }}>
      <div ref={driftRef} style={{ maxWidth: 900 }}>
        <Reveal from="left" distance={40}>
          <p style={{ fontFamily: "var(--font-editorial)", fontStyle: "italic", fontSize: "clamp(32px,5vw,56px)", lineHeight: 1.08, color: "var(--ink-900)", margin: "0 0 32px", transform: `translateY(${driftY * -0.6}px)`, willChange: "transform" }}>
            Expertise&hellip;<br />The compass of proficiency.
          </p>
        </Reveal>
        <Reveal from="up" distance={32} delay={160}>
          <p style={{ fontFamily: "var(--font-ui)", fontSize: "var(--text-lg)", lineHeight: "var(--leading-relaxed)", color: "rgba(17,17,17,0.75)", maxWidth: 640, margin: 0, transform: `translateY(${driftY * 0.4}px)`, willChange: "transform" }}>
            Whether it's infusing creativity into personal endeavours or strategically shaping business initiatives, we seamlessly navigate the delicate balance.
            <br /><br />
            You can call it a true mix of art and maths. Your vision, whether artistic or strategic, finds a home here because we've got you covered.
          </p>
        </Reveal>
      </div>
    </section>
  );
}
window.JMK = window.JMK || {};
window.JMK.Quote = Quote;