feat: crimson CTA accents, white surfaces, Zeitung font, diagonal dividers

- 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>
This commit is contained in:
Dorian
2026-06-22 09:47:06 +01:00
parent 47ebd1ce6c
commit ab0f7da50d
82 changed files with 148 additions and 127 deletions

View File

@@ -152,7 +152,7 @@ onBeforeUnmount(() => {
<div class="flex flex-col items-center text-center gap-4 max-w-3xl mx-auto">
<h1 class="font-display font-normal leading-[1.05] tracking-tight text-cream text-headline-lg">
{{ t('shop.headline') }}
<em class="italic font-light text-accent-soft">{{ t('shop.headline.em') }}</em>
<em class="italic font-light text-cream">{{ t('shop.headline.em') }}</em>
</h1>
<p class="text-base md:text-lg leading-relaxed text-cream/80 max-w-2xl">
{{ t('shop.sub') }}
@@ -186,7 +186,7 @@ onBeforeUnmount(() => {
/>
</div>
<div class="flex flex-col items-center text-center gap-1">
<p class="eyebrow text-accent">{{ tile.label }}</p>
<p class="eyebrow text-cream/75">{{ tile.label }}</p>
<h3 class="font-display text-lg md:text-xl font-normal leading-tight text-cream">
{{ tile.product.title }}
</h3>