Style: Editorial & Storytelling. Type: General. Keywords: Editorial, storytelling, lifestyle, imagery, magazine, monochrome, content-first, longform, visual narrative, scroll-driven, photography-heavy, brand story, editorial scroll. Primary Colors: Monochrome, Black #000000, White #FFFFFF, Off-white #F7F7F7. Secondary Colors: Muted Pink #FAF2F4, Warm Grey #E8E5E0, Accent Blue #0600FF (sparingly). Effects & Animation: Smooth scroll transitions (300-400ms), image parallax, text fade-in on scroll, full-bleed image reveals, subtle hover opacity (0.8). Best For: Beauty brands, fashion e-commerce, lifestyle platforms, DTC brands, editorial magazines, content-driven landing pages. Do Not Use For: Data-heavy dashboards, developer tools, complex SaaS, enterprise apps. Light Mode: ✓ Full. Dark Mode: ✓ Full. Performance: ⚡ Good. Accessibility: ✓ WCAG AA. Mobile-Friendly: ✓ High. Conversion-Focused: ✓ High. Framework Compatibility: Tailwind 10/10, CSS-in-JS 9/10, Bootstrap 8/10. Era/Origin: 2010s Modern. Complexity: Low. AI Prompt Keywords: Design an editorial landing page with storytelling layout. Use full-bleed lifestyle photography, monochrome palette with minimal accent, magazine-style typography, scroll-driven content reveals. Content is the design — let imagery and copy lead.. CSS/Technical: font-family: serif or clean sans, max-width: 100vw for bleed, object-fit: cover, scroll-snap-type: y proximity, color: #000/#fff, mix-blend-mode for overlays. Implementation Checklist: ☐ Full-bleed imagery edge-to-edge, ☐ Typography hierarchy clear (serif heading + sans body), ☐ Monochrome palette verified, ☐ Content-first layout, ☐ Scroll transitions smooth, ☐ Mobile image optimization. Design System Variables: --font-heading: serif, --font-body: sans-serif, --color-text: #000, --color-bg: #fff, --color-muted: #F7F7F7, --accent: single color only, --image-ratio: 16/9 or 3/2.