Navigation
Durchgängiges Orientierungssystem von Header über Shop-Filter bis Footer für alle Breakpoints
Header
STICKY · BG WHITE · BORDER-BOTTOM 1px #EDEEEF · LOGO LINKS · NAV RECHTS · WARENKORB MIT BETRAG
Logo: KCE-Type-T.svg, h-20px
Nav Links: Pressura 15px/500, color #18191A, hover: bg ce-zinc-100 rounded-[6px], transition-colors 200ms
Produkte Button: Pressura Mono 13px, bg ce-zinc-950, text white, rounded-[8px]
Warenkorb: Pressura Mono 15px, color #313337
Container: sticky, bg white, border-bottom 1px #EDEEEF
Mobile Navigation
BREAKPOINT < 768PX · HAMBURGER ICON · SLIDE-IN DRAWER · BG WHITE
Köln
Münster
Café
Service
Kurse
0,00 Warenkorb
Breakpoint: < 768px (md)
Hamburger Icon: 24x24px, Pfad M3 4h18v2H3V4z...
Produkte Button: neben Hamburger, Pressura Mono 13px, bg ce-zinc-950, text white, rounded-[8px]
Drawer: full-width slide-in, bg white, Nav Links vertikal (ohne Produkte)
Nav Links: Pressura 20px/500, color #18191A
Shop Navigation
BREADCRUMB + FILTER BAR · KATEGORIE-PILLS · SORT DROPDOWN · BG CE-ZINC-50
Breadcrumb: Pressura Mono 12px/500, capitalize, Separator " > " in #B6B7BB
Kategorie-Pills: Pressura Mono 13px/500, Active = Primary-Style, Inactive = Outline-Style
Sort Dropdown: Pressura Mono 13px/500, Outline-Style mit Chevron
Filter Bar BG: ce-zinc-50 (#FBFBFC)
Footer
MONOCHROMATISCH · FOLGT THEME · BG SURFACE-CARD · LOGO --ce-logo-filter · 5 SPALTEN · PRESSURA 14px/500 · INTER 14px/400
Coffee Elements
Standorte Köln
Standorte Münster
Café Kliewe
Barista-Kurse
Support
FAQ
Impressum
Datenschutz
AGB
Produktkategorien
Siebträger
Barmaschinen
Kaffeemühlen
Wasserfilter
Premium Marken
La Marzocco
ECM
Eureka
Profitec
Service Kontakt
Service anfragen
Köln: Tobi
Münster: Frederik
© 2025 Kliewe Coffee Elements GmbH
Breadcrumb
PRESSURA MONO 12px/16px · WEIGHT 500 · COLOR #575A61 · CAPITALIZE · SEPARATOR " > " IN #B6B7BB
1-LEVEL
2-LEVEL
3-LEVEL