{
  "id": "atoll-market-lookbook",
  "name": "Lookbook",
  "theme": "atoll-market",
  "category": "Landing",
  "description": "A collection landing page that opens on a full-bleed figure with the collection name set at 72px over empty aqua, and never shows a product grid.",
  "layout": "A full-bleed tall image with an offset serif title, then an asymmetric editorial run where no two rows share the same column split.",
  "modules": [
    {
      "key": "open",
      "name": "Opening figure",
      "html": "\n<header class=\"op\"><img src=\"{{ART model}}\" alt=\"{{ARTALT model}}\"><div class=\"ti\"><span class=\"k\">Resort · Collection 04</span><h1>Everything Here<br>Was Made<br>For Heat</h1></div></header>"
    },
    {
      "key": "note",
      "name": "Collection note",
      "html": "\n<section class=\"cn\"><p>Eighteen pieces in a single wool-linen and one silk. The palette came from a week on a coast where the water is genuinely this colour and everything built on it is either bone or crimson, and we did not add a third.</p><p class=\"by\">Photographed at Kilcarn Point over two mornings.</p></section>"
    },
    {
      "key": "run",
      "name": "Editorial run",
      "html": "\n<section class=\"rn\">\n  <figure class=\"a\"><img src=\"{{ART hero}}\" alt=\"{{ARTALT hero}}\"><figcaption><b>The Long Crimson Coat</b><span class=\"pr\">£620</span></figcaption></figure>\n  <figure class=\"b\"><img src=\"{{ART fabric}}\" alt=\"{{ARTALT fabric}}\"><figcaption><b>Folded Silk, Aqua</b><span class=\"pr\">£240</span></figcaption></figure>\n  <figure class=\"c\"><img src=\"{{ART water}}\" alt=\"{{ARTALT water}}\"><figcaption><b>The location</b><span class=\"pr\">Kilcarn Point</span></figcaption></figure>\n  <figure class=\"d\"><img src=\"{{ART still}}\" alt=\"{{ARTALT still}}\"><figcaption><b>Two Objects</b><span class=\"pr\">£145</span></figcaption></figure>\n</section>"
    },
    {
      "key": "close",
      "name": "Closing line",
      "html": "\n<footer class=\"cl\"><span class=\"k\">Available now</span><h2>Eighteen pieces, made once</h2><a class=\"btn\" href=\"#\">See everything</a></footer>"
    }
  ],
  "moduleCount": 4,
  "reorderable": true,
  "meta": {
    "id": "atoll-market-lookbook",
    "model": "Claude Opus 5",
    "author": "Claude Code",
    "createdAt": "2026-09-02T00:13:22+09:00",
    "updatedAt": "2026-09-02T00:13:22+09:00",
    "version": "1.0.0",
    "isNew": false
  },
  "link": "/api/v1/designs/atoll-market-lookbook.json",
  "structure": "A full-bleed tall image with an offset serif title, then an asymmetric editorial run where no two rows share the same column split.",
  "html": "<div class=\"dz dz-atoll-market-lookbook\" data-design=\"atoll-market-lookbook\" data-theme=\"atoll-market\">\n<section class=\"dz-mod\" data-mod=\"open\" aria-label=\"Opening figure\">\n<header class=\"op\"><img src=\"https://designlookbook.dev/assets/img/atoll-market-model.webp\" alt=\"A figure in crimson against a bright aqua backdrop\"><div class=\"ti\"><span class=\"k\">Resort · Collection 04</span><h1>Everything Here<br>Was Made<br>For Heat</h1></div></header></section>\n<section class=\"dz-mod\" data-mod=\"note\" aria-label=\"Collection note\">\n<section class=\"cn\"><p>Eighteen pieces in a single wool-linen and one silk. The palette came from a week on a coast where the water is genuinely this colour and everything built on it is either bone or crimson, and we did not add a third.</p><p class=\"by\">Photographed at Kilcarn Point over two mornings.</p></section></section>\n<section class=\"dz-mod\" data-mod=\"run\" aria-label=\"Editorial run\">\n<section class=\"rn\">\n  <figure class=\"a\"><img src=\"https://designlookbook.dev/assets/img/atoll-market-hero.webp\" alt=\"A crimson garment hanging against an aqua wall\"><figcaption><b>The Long Crimson Coat</b><span class=\"pr\">£620</span></figcaption></figure>\n  <figure class=\"b\"><img src=\"https://designlookbook.dev/assets/img/atoll-market-fabric.webp\" alt=\"Crimson fabric folded against an aqua ground\"><figcaption><b>Folded Silk, Aqua</b><span class=\"pr\">£240</span></figcaption></figure>\n  <figure class=\"c\"><img src=\"https://designlookbook.dev/assets/img/atoll-market-water.webp\" alt=\"Shallow turquoise water over pale sand\"><figcaption><b>The location</b><span class=\"pr\">Kilcarn Point</span></figcaption></figure>\n  <figure class=\"d\"><img src=\"https://designlookbook.dev/assets/img/atoll-market-still.webp\" alt=\"Two objects arranged on aqua with hard shadows\"><figcaption><b>Two Objects</b><span class=\"pr\">£145</span></figcaption></figure>\n</section></section>\n<section class=\"dz-mod\" data-mod=\"close\" aria-label=\"Closing line\">\n<footer class=\"cl\"><span class=\"k\">Available now</span><h2>Eighteen pieces, made once</h2><a class=\"btn\" href=\"#\">See everything</a></footer></section>\n</div>",
  "css": "\n.dz-atoll-market-lookbook { background: var(--background); color: var(--foreground); font-family: var(--pv-body); padding: 0 0 72px; overflow: hidden; }\n.dz-atoll-market-lookbook .k { text-transform: uppercase; letter-spacing: .18em; font-size: 10.5px; font-weight: 600; color: var(--muted-foreground); }\n.dz-atoll-market-lookbook .op { position: relative; margin-bottom: 72px; }\n.dz-atoll-market-lookbook .op img { width: 100%; height: 520px; object-fit: cover; display: block; filter: var(--img-filter); }\n.dz-atoll-market-lookbook .ti { position: absolute; left: 38px; bottom: 38px; }\n.dz-atoll-market-lookbook h1 { font-family: var(--pv-display); font-weight: 400; font-size: 72px; line-height: 1.04; margin: 10px 0 0; letter-spacing: -.02em; color: var(--primary-foreground); }\n.dz-atoll-market-lookbook .ti .k { color: var(--primary-foreground); opacity: .85; }\n.dz-atoll-market-lookbook .cn { padding: 0 38px; margin-bottom: 72px; max-width: 640px; margin-left: 38%; }\n.dz-atoll-market-lookbook .cn p { margin: 0 0 12px; font-size: 16px; line-height: 1.62; }\n.dz-atoll-market-lookbook .by { text-transform: uppercase; letter-spacing: .18em; font-size: 10.5px; font-weight: 600; color: var(--muted-foreground); }\n.dz-atoll-market-lookbook .rn { display: grid; grid-template-columns: repeat(12, 1fr); gap: 26px 26px; padding: 0 38px; margin-bottom: 72px; }\n.dz-atoll-market-lookbook .rn figure { margin: 0; }\n.dz-atoll-market-lookbook .a { grid-column: 1 / span 5; }\n.dz-atoll-market-lookbook .b { grid-column: 8 / -1; margin-top: 72px; }\n.dz-atoll-market-lookbook .c { grid-column: 3 / span 6; margin-top: 72px; }\n.dz-atoll-market-lookbook .d { grid-column: 10 / -1; }\n.dz-atoll-market-lookbook .rn img { width: 100%; object-fit: cover; display: block; filter: var(--img-filter); box-shadow: 0 20px 50px -22px color-mix(in oklab, var(--foreground) 40%, transparent); }\n.dz-atoll-market-lookbook .a img { height: 460px; }\n.dz-atoll-market-lookbook .b img { height: 340px; }\n.dz-atoll-market-lookbook .c img { height: 300px; }\n.dz-atoll-market-lookbook .d img { height: 240px; }\n.dz-atoll-market-lookbook figcaption { padding-top: 12px; display: grid; gap: 4px; }\n.dz-atoll-market-lookbook figcaption b { font-family: var(--pv-display); font-weight: 400; font-size: 22px; }\n.dz-atoll-market-lookbook .pr { font-family: var(--pv-mono); font-size: 12.5px; letter-spacing: .02em; color: var(--muted-foreground); }\n.dz-atoll-market-lookbook .cl { padding: 0 38px; text-align: center; }\n.dz-atoll-market-lookbook h2 { font-family: var(--pv-display); font-weight: 400; font-size: 38px; margin: 10px 0 20px; }\n.dz-atoll-market-lookbook .btn { display: inline-block; text-transform: uppercase; letter-spacing: .18em; font-size: 10.5px; font-weight: 600; background: var(--accent); color: var(--accent-foreground); padding: 14px 30px; text-decoration: none; border-radius: var(--pv-radius); }\n",
  "requiredTheme": "/api/v1/themes/atoll-market.json",
  "googleFontsHref": "https://fonts.googleapis.com/css2?family=Prata:wght@400;500;600;700&family=Instrument+Sans:wght@400;500;600;700&family=Geist+Mono:wght@400;500;600;700&display=swap"
}