feat: primitives (Wordmark, Container, CTA) with tests

components/primitives/__tests__/CTA.test.tsx

@@ -0,0 +1,14 @@
+import { render, screen } from '@testing-library/react';
+import { describe, it, expect } from 'vitest';
+import { CTA } from '../CTA';
+
+describe('<CTA />', () => {
+  it('renders the label with arrow', () => {
+    render(<CTA href="#contacto" label="Define tu siguiente movimiento" />);
+    expect(screen.getByRole('link', { name: /define tu siguiente movimiento/i })).toBeInTheDocument();
+  });
+  it('uses the href', () => {
+    render(<CTA href="#contacto" label="x" />);
+    expect(screen.getByRole('link').getAttribute('href')).toBe('#contacto');
+  });
+});

components/primitives/__tests__/Wordmark.test.tsx

@@ -0,0 +1,22 @@
+import { render, screen } from '@testing-library/react';
+import { describe, it, expect } from 'vitest';
+import { Wordmark } from '../Wordmark';
+
+describe('<Wordmark />', () => {
+  it('renders the wordmark in lowercase', () => {
+    render(<Wordmark />);
+    const text = screen.getByText(/cre/).closest('span')?.textContent;
+    expect(text?.toLowerCase()).toBe('creeer.');
+  });
+  it('renders the accent "e" separately for gold styling', () => {
+    const { container } = render(<Wordmark />);
+    const accent = container.querySelector('[data-accent="true"]');
+    expect(accent).not.toBeNull();
+    expect(accent?.textContent).toBe('e');
+  });
+  it('never renders uppercase CREEER', () => {
+    const { container } = render(<Wordmark />);
+    expect(container.textContent).not.toMatch(/CREEER/);
+    expect(container.textContent).not.toMatch(/Creeer/);
+  });
+});