# Agent Guide

## Project

New Optic is a multilingual premium marketing website for a trusted local optical shop in Temara, Morocco.

The site is built with:

- Next.js App Router
- React
- TypeScript
- Tailwind CSS
- Framer Motion

## Commands

```bash
npm install
npm run dev
npm run build
npm run start
```

Use `npm run build` before considering changes complete.

## Important Files

- `config/business.ts` contains editable business details, phone numbers, map URL, and asset paths.
- `messages/fr.ts` contains French copy. French is the default language.
- `messages/ar.ts` contains Arabic copy and must remain natural/readable with proper RTL support.
- `messages/en.ts` contains English copy.
- `components/SiteShell.tsx` controls active language and page composition.
- `components/Navbar.tsx` contains the sticky navigation and smooth-scroll behavior.
- `components/PhysicsButton.tsx` contains the magnetic/stretch CTA button behavior.
- `components/LiquidGlass.tsx` loads `liquidGL` only on desktop.
- `app/globals.css` contains global visual styling and mobile performance overrides.

## Design Direction

Keep the visual language premium, minimal, Apple-inspired, and calm.

Prefer:

- breathable spacing
- high contrast typography
- soft glass surfaces
- restrained gradients
- subtle motion
- clear conversion CTAs

Avoid:

- loud neon effects
- generic template sections
- fake testimonials
- overhyped luxury wording
- heavy mobile effects

## Multilingual Rules

- French is the default language.
- Arabic must use RTL layout correctly.
- Do not translate word-for-word. Keep copy natural in each language.
- When adding new copy, update all three translation files.

## Mobile Performance Rules

Mobile performance is important.

- Do not load `liquidGL` or `html2canvas` on mobile.
- Avoid `backdrop-filter`, large blur layers, fixed backgrounds, and continuous animations below `1024px`.
- Use optimized images for mobile where possible.
- Keep touch interactions lightweight.

## Business Facts

Use only verified or provided facts:

- Business name: New Optic
- Location: Temara, Morocco
- Area: Massira I / Rue Boujdour
- Phone: `05376-03279`
- WhatsApp: `+212 662-872002`
- Google Maps link: `https://maps.app.goo.gl/LeuFER6h887Cp5aG9`
- Trusted local optical shop since around 2004
- Offers repairs, prescription glasses, sunglasses, kids glasses, budget frames, contact lenses, and colored contact lenses
- Does not offer eye exams
- Offers original/authentic frames only
- Known for fair prices and local reputation

Do not invent opening hours, testimonials, certifications, or brand partnerships.

## Git / Release

Remote repository:

```txt
http://192.168.1.160:3000/oimwiodev/New-Optic.git
```

Main branch:

```txt
main
```

Current release tag:

```txt
v1.0.0
```

## Commit Workflow

When making project changes, commit them locally and push to the Gitea remote unless the user explicitly asks not to.

Before committing:

- Run `npm run build` for code changes.
- Review `git status` and `git diff`.
- Do not commit secrets or local environment files.

Default push target:

```txt
origin main
```