diff --git a/src/components/PhotoPack/PhotoPack.mdx b/src/components/PhotoPack/PhotoPack.mdx
index b3111f0c..e5988a1b 100644
--- a/src/components/PhotoPack/PhotoPack.mdx
+++ b/src/components/PhotoPack/PhotoPack.mdx
@@ -11,7 +11,7 @@ The `PhotoPack` component makes simple photo grids with custom layouts at variou
 `images` are defined with their src, alt text, captions and an optional `maxHeight`, which ensures that an image is no taller than that height in any layout.
 
 ```javascript
- const images = [
+const images = [
   {
     src: 'https://...',
     altText: 'Alt text',
@@ -155,6 +155,7 @@ If you don't specify the `layouts` prop, `PhotoPack` will automatically generate
 The smart defaults use a **bottom-heavy distribution**, meaning earlier rows have fewer images (making them larger and more prominent), while later rows have more images.
 
 **Examples:**
+
 - 5 images, `wide` container, desktop: `[2, 3]` (2 in first row, 3 in second)
 - 7 images, `widest` container, desktop: `[3, 4]` (3 in first row, 4 in second)
 - 4 images, any container, desktop: `[2, 2]` (evenly distributed)
diff --git a/src/components/PhotoPack/utils.ts b/src/components/PhotoPack/utils.ts
index 90f9e69b..ed022ff1 100644
--- a/src/components/PhotoPack/utils.ts
+++ b/src/components/PhotoPack/utils.ts
@@ -62,7 +62,10 @@ export const generateDefaultLayouts = (
   width: ContainerWidth
 ): Layout[] => {
   // Map container width to max images per row for desktop
-  const desktopMaxPerRow = width === 'normal' ? 2 : width === 'widest' || width === 'fluid' ? 4 : 3;
+  const desktopMaxPerRow =
+    width === 'normal' ? 2
+    : width === 'widest' || width === 'fluid' ? 4
+    : 3;
 
   // Tablet always uses max 2 per row
   const tabletMaxPerRow = 2;