# Logos

A section showing a centred heading and a horizontal marquee of logo assets (otherMedia). Logos are duplicated to create an infinite scroll effect (animate-logos-marquee). Use for partner or customer logo strips. Section can have backgroundColour and textColour; heading uses textColour.

## What it looks like

Full-width section with optional centred heading (h3) and a horizontally scrolling row of logo tiles. Each logo is in a light rounded box (bg-light rounded-logo, w-cols-2 aspect-2/1). The row is animated (marquee). Section uses container-row-1-8 and container-row-6-8 with overflow-hidden. If otherMedia is empty, the component returns null and nothing is rendered.

## Typography

- **Heading:** Typography class `h3`, centred. Semantic level: first block → `<h1>`, else `<h2>`.

## Colours

**How colours are applied:** Section wrapper receives `information` (including backgroundColour and textColour). The heading uses `lookupColourString(textColour, 'text')`. Section-level background and heading text colour follow the palette.

**Valid values:** backgroundColour and textColour from the design system palette.

## Used fields

| Field | Type | Effect when set | Effect when empty/removed |
|-------|------|-----------------|---------------------------|
| `heading` | Symbol | Centred title above logos (h3) | No heading; logos still show |
| `otherMedia` | Array | Logo assets shown in marquee (duplicated for loop) | Component returns null; nothing rendered |
| `textColour` | Symbol | Heading text colour | Default/inherited |
| `backgroundColour` | Symbol | Section background | Default/inherited |
| `cmsLabel` | Symbol | Internal/analytics | No visible effect |
| `componentType` | Symbol | "Logos" | N/A |
| `id` | Symbol | Entry id for preview | No visible effect |
| `index` | Number | Affects heading level | N/A |

## Behaviour

- **Empty otherMedia:** Component returns null; no output.
- **Marquee:** Logos are rendered twice (allLogos = [...logos, ...logos]) for seamless scroll.
- **Position (index):** Affects heading semantic level (h1 vs h2).

## Impact of content changes

| Change | Result |
|--------|--------|
| Add/remove heading | Heading appears or disappears above logos |
| Add/remove otherMedia items | Number of logos in marquee changes; empty list hides component |
| Set textColour / backgroundColour | Section and heading colours update |

## Screenshots to capture

Recommended variants: default, no-heading, dark-bg, primary-blue-bg, minimal.