From e428de8df5ea58d1110b83dcec8c19060909e919 Mon Sep 17 00:00:00 2001
From: Pulse Agent <agent@pulse.ai>
Date: Wed, 20 May 2026 19:53:27 -0300
Subject: [PATCH] =?UTF-8?q?docs(LRN):=20atomic-design-3d=20landing=20page?=
 =?UTF-8?q?=20=E2=80=94=20LRN-011=20=E2=80=94=20build=20OK?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .learnings/LEARNINGS.md | 35 +++++++++++++++++++++++++++++++++++
 1 file changed, 35 insertions(+)

diff --git a/.learnings/LEARNINGS.md b/.learnings/LEARNINGS.md
index 6dcd0b8..58a4d73 100644
--- a/.learnings/LEARNINGS.md
+++ b/.learnings/LEARNINGS.md
@@ -320,3 +320,38 @@ Stack `project` não é controlável pelo Portainer enquanto `Attachable=false`.
 ### Para resolver completamente
 Recriar rede `public` com `--attachable` impactando 19 containers — NÃO recomendado agora.
 
+
+## [LRN-20260520-011] atomic-design-3d-threejs-landing-page
+
+**Logged**: 2026-05-20T20:00:00-03:00
+**Priority**: high
+**Status**: reference
+**Area**: frontend | web3d | design-system
+
+### Summary
+Landing page 3D completa usando Atomic Design + Three.js + React Three Fiber + Framer Motion — código funcional com build OK.
+
+### Padrão aplicado
+```
+Átomos (11) → Moléculas (3) → Organismos (2) → Templates (2) → Pages (1)
+```
+
+**Tokens 8 domínios**: space / font / color / shadow / radius / material3d / camera3d / animation
+
+### Stack
+- Vite + React 18 + TS
+- @react-three/fiber + drei
+- framer-motion
+- Build: `npm install && npm run build` ✅
+
+### Decisões
+- Canvas fullscreen com overlay 2D (SceneCanvas + ThreePage template)
+- ScrollControls → scroll move câmera 3D
+- Material tokens: roughness 0.08 + metalness 0.75 = super-reflexivo
+- PointLights accent + secondary por cena
+- CSS vars para dark/light mode + A11y
+
+### Hot Reload (future)
+- `npm run dev` → Vite HMR
+- Adicionar ao stack Swarm `dev` (volume bind mount + dnsrr)
+