# Visual Rhythm Rules

## Client Type Defaults

### Corporate or B2B

Use straighter corners, formal tone, conservative typography, strong grid alignment, and restrained color.

### Creative or Agency

Use mixed corners, premium tone, bold or oversized typography, asymmetry, portfolio visuals, and memorable transitions.

### Tech, SaaS, or Startup

Use gradients, dark mode or mixed tone, mockups, glass effects, crisp iconography, and a strong product or offer hero.

### Health or Wellness

Use light tone, soft colors, friendly typography, spacious sections, human imagery, and warm CTA language.

### Ecommerce or Fashion

Use dominant imagery, 50/50 splits, editorial grids, overlap, high-contrast product visuals, and image-led sections.

## Never Rules

- Never default to Inter, Roboto, Arial, or system fonts.
- Never use a purple gradient on a plain white page as the main design idea.
- Never use cards that are all visually identical when the page needs rhythm.
- Never stack dense text sections without visual rest.
- Never use more than three similar section types in a row.
- Never ignore left-right alternation for split sections.
- Never hide mobile navigation without a functional hamburger replacement.
- Never create a predictable AI-looking page.

## Recommended Services Page Flow

1. Hero.
2. Quick benefits bar.
3. Client logos or marquee.
4. Services grid, numbered services, or cards.
5. Visual rest: parallax or metrics.
6. Split section for benefit 1.
7. Reversed split section for benefit 2.
8. Centered impact phrase.
9. Testimonials.
10. FAQ accordion.
11. Final CTA.

## Mobile Rules

- Navigation must become a working hamburger menu.
- Hamburger must have visible three-line icon, open a panel with all links, close on link click, and close when tapping outside.
- Three-column grids become one column by 768px.
- Split layouts stack vertically on mobile.
- Hero text stays at least 32px.
- CTA buttons have at least 48px height.
- Test nav, hero, grids, forms, and CTA at 375px.

## Design Review Checklist

- Does the first viewport immediately communicate brand, offer, or category?
- Is there one memorable visual idea?
- Is the section order varied?
- Is there visual rest after dense content?
- Are CTAs obvious but not repetitive?
- Does mobile preserve navigation and hierarchy?
- Does the page feel designed rather than assembled?
