Hover-Spotlight Photo Gallery — Cinematic Storytelling Page

What it does

• Hover-driven spotlight — pointing at any image dims its neighbors and pushes the focused shot forward, like a stage light finding the subject
• Layered photo composition — images overlap in a deliberate arrangement instead of a flat grid, giving the page a designed, editorial feel
• Dark, cinematic register — moody background, soft edges, and rich photography turn the gallery into a mini visual experience
• Caption reveals on focus — short titles, dates, or location labels surface alongside the spotlighted image to add context
• Sequenced storytelling — images are ordered to walk the visitor through chapters of a story rather than feeling random
• Quiet rest state — when nothing is hovered the gallery sits in a balanced composition that's beautiful on its own

Best use cases

• Touring musicians and performers — three-night tour pages with one cinematic shot per stop
• Photographers and visual artists — portfolio chapters that let the viewer drive their own attention
• Retreat and travel programs — a visual walkthrough of locations, moments, and on-site experiences
• Premium course creators — a moody intro page that sets the brand tone before any sales copy
• Workshop and event hosts — a recap or 'what you'll experience' gallery for an upcoming cohort
• Documentary and narrative brands — chapter-by-chapter storytelling pages where photography carries the meaning

What you can change with your DNA

When you run this through the remix skill, your CCOS DNA — brand, voice, audience — drives these decisions automatically:

• Colors — slots for the deep background, image frame edges, caption text, and a single accent used on dates or labels
• Fonts — two roles: a confident display font for chapter titles and a quiet body font for captions and metadata
• Copy — page intro, three to seven photo cards each with a short title, location or date, and optional 1-2 sentence caption
• Images — the heart of the page; swap in your own moody, sequenced photography (locations, behind-the-scenes, signature moments)
• Behavior — tune how strongly neighbors dim on hover, how quickly the spotlight transitions, and whether captions fade or slide in