Style: Transparent & Honest Pricing. Type: General. Keywords: Transparent, honest, cost breakdown, price justification, ethical, radical transparency, factory cost, markup, trust, value-driven, no hidden fees, fee breakdown, itemized pricing. Primary Colors: Neutral Monochrome, Black #000000, White #FFFFFF, Off-white #F5F5F0. Secondary Colors: Muted Grey #9CA3AF, Success Green #16A34A (for savings), Light Border #E5E5E5. Effects & Animation: Minimal effects, clean number transitions (200ms), cost breakdown expand/collapse, tooltip hover for fee explanations, comparison highlight (subtle bg change). Best For: Ethical fashion, marketplace fee displays, subscription transparency, fintech fee breakdowns, DTC brands, cost-conscious products. Do Not Use For: Luxury brands, aspirational marketing, impulse-buy funnels, entertainment. Light Mode: ✓ Full. Dark Mode: ✓ Full. Performance: ⚡ Excellent. Accessibility: ✓ WCAG AAA. Mobile-Friendly: ✓ High. Conversion-Focused: ✓ High. Framework Compatibility: Tailwind 10/10, Bootstrap 9/10, MUI 9/10. Era/Origin: 2020s Modern. Complexity: Low. AI Prompt Keywords: Design a transparent pricing page with radical honesty. Show cost breakdown (materials, labor, markup). Use clean monochrome palette, clear number hierarchy, itemized fee lines. Trust comes from showing how the price is composed — no decoration needed.. CSS/Technical: display: grid, gap: 1rem, font-variant-numeric: tabular-nums, border-collapse: collapse, color: #000/#1A1A1A, background: #fff/#F5F5F0. Implementation Checklist: ☐ Itemized cost/fee lines visible, ☐ Tabular numbers aligned, ☐ Savings highlighted in green, ☐ No hidden costs below fold, ☐ Tooltip explanations for each fee, ☐ Mobile-readable number sizes. Design System Variables: --font-numeric: tabular-nums, --color-text: #1A1A1A, --color-bg: #fff, --color-savings: #16A34A, --color-muted: #9CA3AF, --border: #E5E5E5, --spacing-line: 0.75rem.