'use client';

import { motion } from 'framer-motion';
import { Container } from '@/components/primitives/Container';
import { fraseAncla } from '@/lib/content';
import { fadeInUp, viewportOnce } from '@/lib/motion';

export function FraseAncla() {
  return (
    <section className="bg-base">
      <Container className="py-24 md:py-32 text-center max-w-4xl">
        <motion.blockquote
          variants={fadeInUp}
          initial="hidden"
          whileInView="visible"
          viewport={viewportOnce}
          className="font-serif italic text-2xl md:text-4xl font-bold leading-snug text-ink"
        >
          <span className="text-gold">“</span>
          {fraseAncla.quote.before}{' '}
          <span className="text-gold">{fraseAncla.quote.accent}</span>
          <span className="text-gold">”</span>
        </motion.blockquote>
      </Container>
    </section>
  );
}