Verspielte, bunte Bildung

Create a playful and colorful education platform website. The design should feel fun, energetic, and inviting — like a digital playground for learning.

Design Requirements

Color Palette: Bold, vibrant colors used liberally — #f59e0b, #8b5cf6, #10b981, #f43f5e — each section gets its own color

Shapes: Circles, squiggly lines, blob shapes, wavy dividers — nothing too angular

Typography: Outfit, rounded and friendly, bouncy weights

Illustrations: Geometric character illustrations, abstract shapes as decorations

Animations: Bouncy, springy animations — use CSS ease-out or cubic-bezier(0.68, -0.55, 0.27, 1.55)

Sections to Include

Header — Colorful logo, pill-shaped nav links each a different color, "Start Learning" bouncy button

Hero — Large playful headline with words in different colors, floating shape illustrations, bouncy CTA

Course Cards — Colorful cards with rounded corners, each card a different color, emoji or icon badges

Stats — Fun animated counters with bouncy numbers, each stat a different color

How It Works — Numbered steps with connected dotted line, each step in a colored circle

Testimonials — Speech bubble-shaped cards, colorful, with cartoon-style avatars

Pricing — Playful tiered cards, the popular one is slightly larger and tilted

Footer — Wavy multicolor top border, colorful sections

Technical Details

CSS bounce: animation: bounce 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55)

Wavy section dividers: SVG paths with colorful fills

Slight CSS rotation on hover for playful feel

Confetti or floating shapes animation in hero

Responsive: maintain energy, simplify shapes on mobile