# E-TIB Website Redesign - Task List

## 1. Project Initialization & Infrastructure
- [x] Initialize Next.js Application with `pnpm` (App Router, TypeScript).
- [x] Implement `docker-compose.yml` and `docker-compose.dev.yml` following the `klz-2026` reference pattern (App, DB, Reverse Proxy, Redis, Qdrant).
- [x] Configure `Dockerfile` and `Dockerfile.dev`.
- [x] Integrate internal Mintel packages: `@mintel/ui`, `@mintel/next-config`, `@mintel/next-utils`, `@mintel/payload-ai`.
- [x] Setup TailwindCSS v4 with E-TIB color palette (`#117c61`, `#333333`, `#fafafa`) and modern industrial tokens.
- [x] **Configure Next.js i18n (German Default, English) mirroring KLZ-2026 setup.**

## 2. Payload CMS Integration
- [x] Initialize Payload v3 with Postgres adapter.
- [x] Create Collections: `Pages`, `Media`, `Competences` (Kompetenzen), `References` (Referenzen), `Team`, `Jobs`.
- [x] Setup Global configuration for `Header`, `Footer`, and `Company Data`.
- [x] Setup seeders for legacy content (texts and placeholder videos/images).

## 3. Core Component Library (UI)
- [x] Build global Layout (Industrial Navigation Header, Universal Footer).
- [x] Create Hero Section with background video support (reference: schleicher-gruppe.de).
- [x] Create Sub-Company Tiles Component (E-TIB GmbH, Verwaltung, Ingenieurgesellschaft, Bohrtechnik).
- [x] Build Bento-grid layout for the Competences overview.
- [x] Create visual Timeline component for the "Über uns" section.
- [x] Build interactive Contact Form utilizing `@mintel/mail`.

## 4. Page Implementation
- [x] **Startseite**
  - Hero Video with overlay.
  - Group overview tiles.
  - Competences preview grid.
  - References preview slider.
- [x] **Kompetenzen**
  - High-fidelity grid detailing all services (Kabelbau, Querung, Kabelpflugarbeiten, etc.).
- [x] **Über uns**
  - Timeline of company foundations (2015 - 2025).
- [x] **Kontakt**
  - Interactive Map (Leaflet) & Contact Persons grid pulled from Payload.
- [x] **Karriere & Messen**
  - Dynamic job listings and exhibition dates.
- [x] **Pflichtseiten**
  - Impressum, Datenschutz, Cookie Content Manager.

## 5. Animations & Micro-Interactions
- [x] Add framer-motion scroll-triggered animations for group tiles and timeline points.
- [x] Implement modern hover states on cards, links, and buttons (glassmorphism accents).
- [x] Smooth layout transitions and floating visual accents.

## 6. Content, QA & Deployment
- [x] Process legacy assets (`./assets`) and integrate into `public` or Payload media base.
- [x] Ensure SEO setup based on legacy meta-data (porting from `_site_profile.json`).
- [x] Pre-flight checks (Lighthouse testing, PA11y accessibility audit, responsive testing on mobile/tablet).
- [x] Sync environments / initial deployment to infrastructure.