Shop page rebuilt into four brand colour-coded use-group sections (Küche/lime,
Reinigung/grapefruit, Wäsche/plum, Pflege/care/orange): colour banners with diagonal
dividers, per-section grid titles, crimson 'add to cart' + white-outline 'learn more'
CTAs, plain-name eyebrows, first-fold halved + thin white band. Split old Haushalt
group into clean+wash.
Also in this checkpoint (brand-owner feedback items):
- L11: Kaiser-Natron® on every visible mention, hyphenated (de+en, products, logo, nav)
- L4: product-hero headline reworded to the brand versatility voice
- L5/L6: faint 'AI Edited' badge on AI bundle images (data-driven aiEdited flag)
- L10: Revitalization animation row + early-access CTA removed
- U2: membership 'become a member' button removed
- New category tokens (cat-kitchen/clean/wash/care) + Hero/WaveDivider tones
- New /kueche category page (route + copy) — not yet linked (see STYLE-CHANGES caveat)
- Homepage reverted to original ProductTeaser (banners belong on /shop)
dist/ rebuilt and included for the Portainer/gitea deploy. Open decisions tracked
in STYLE-CHANGES.md §20 and memory.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
- Add --color-accent-fill (#cc0230) / -hover / -ink tokens; repoint all
solid yellow "button" surfaces (Button accent, IconButton accent,
language-selector active pill, Navbar cart CTA, Kaiserhacks chip,
accent Badge) to crimson fill + white ink. Yellow --color-accent kept
for functional text accents.
- Secondary button: transparent fill, white border, white text/icons,
translucent-white hover (no longer mimics the primary default).
- Surfaces to pure white: --color-cream and --color-surface -> #ffffff
(cream-toned logo follows via text-cream); theme-color -> #ffffff.
- Self-host Zeitung (Regular/Bold woff2, mirrored from production);
point --font-sans/--font-serif at Zeitung; drop Google Fonts CDN.
- Remove yellow highlighting on hero/title emphasis and hero eyebrows
(text-accent-soft -> text-cream, eyebrows -> text-cream/75).
- WaveDivider + homepage section dividers: straight diagonal (low-left,
high-right) at double height for ~2x the right-to-left difference.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
