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)
+