Generate Customer Success Stories Section

Create a customer success stories section:

Story Card Content:

  Customer photo or avatar
  Customer name and location: [NAME], [LOCATION]
  Story title/headline
  Short preview text (2-3 sentences)
  Key transformation metric: [METRIC_BEFORE] to [METRIC_AFTER]
  Products used (linked to product pages)
  “Read Full Story” expand button
  Date or duration of customer journey


Expanded Story View:

  Full narrative text (rich text with paragraphs)
  Additional photos (gallery or inline)
  Timeline of customer journey milestones
  Products used with images and links
  Customer quote pullout
  Related stories suggestions


Layout Options:

  Card grid: [2/3] cards per row
  Featured story with supporting stories below
  Carousel slider for story cards
  List view with image left, content right
  Card style: [clean/bordered/image-header]


Section Settings:

  Section heading: [SECTION_HEADING]
  Subheading: [SUBHEADING]
  Background color: [BACKGROUND_COLOR]
  Padding: [TOP_PADDING]px / [BOTTOM_PADDING]px
  CTA: [CTA_TEXT] linking to [CTA_URL] (e.g., “Share Your Story”)
  Filter by product or category (optional)


Design Settings:

  Card image aspect ratio: [16:9/4:3/square]
  Accent color: [ACCENT_COLOR]
  Typography: heading [SIZE]px, body [SIZE]px
  Hover effect: [elevate/image-zoom/highlight]
  Expand animation: [slide-down/modal/new-page]


Requirements:

  Responsive layout
  Accessible expand/collapse with ARIA attributes
  Lazy load images
  Schema markup for customer stories
  Support for at least [NUMBER] stories
  Smooth expand animation
  SEO-friendly with proper heading hierarchy