{
  "id": "powder-room-refill",
  "name": "Refill Plans",
  "theme": "powder-room",
  "category": "Pricing",
  "description": "Refill pricing where each plan is headed by the discs it covers rather than by a feature list, and the per-shade cost is the figure in serif.",
  "layout": "Three plans as rounded cards, each opening with a row of 40px discs standing for the shades included, then price and a pill button.",
  "modules": [
    {
      "key": "head",
      "name": "Refill header",
      "html": "\n<header class=\"rh\"><span class=\"k\">Refills</span><h1>Buy the colour, not the case</h1><p>Every shade is sold as a refill pan. The case is bought once, in metal, and it outlives every colour that goes into it.</p></header>"
    },
    {
      "key": "plans",
      "name": "Plan cards",
      "html": "\n<section class=\"pl\">\n<article><span class=\"k\">Single</span><div class=\"discs\"><span class=\"dc sm\" style=\"background:#B4515F\"></span></div><p class=\"pz\">£18<small> a refill</small></p><ul><li>Any one shade, any finish</li><li>Posted in a card sleeve</li><li>Old pan returned free</li></ul><button class=\"gh\">Buy a refill</button></article>\n<article class=\"on\"><span class=\"k\">Four a year</span><div class=\"discs\"><span class=\"dc sm\" style=\"background:#B4515F\"></span><span class=\"dc sm\" style=\"background:#D66A55\"></span><span class=\"dc sm\" style=\"background:#CE9791\"></span><span class=\"dc sm\" style=\"background:#A33F51\"></span></div><p class=\"pz\">£58<small> a year · £14.50 each</small></p><ul><li>Four refills, chosen when you want them</li><li>Swap a chosen shade until it ships</li><li>Old pans returned free</li><li>Comparison tray holds six instead of four</li></ul><button class=\"pri\">Choose four a year</button></article>\n<article><span class=\"k\">The kit</span><div class=\"discs\"><span class=\"dc sm\" style=\"background:#D4636B\"></span><span class=\"dc sm\" style=\"background:#B4515F\"></span><span class=\"dc sm\" style=\"background:#A33F51\"></span><span class=\"dc sm\" style=\"background:#D66A55\"></span><span class=\"dc sm\" style=\"background:#CE9791\"></span><span class=\"dc sm\" style=\"background:#DDC3A5\"></span></div><p class=\"pz\">£96<small> · £12 each</small></p><ul><li>Eight refills and the metal case</li><li>Case engraved, if you want</li><li>Old pans returned free</li><li>Comparison tray holds six</li></ul><button class=\"gh\">Choose the kit</button></article>\n</section>"
    },
    {
      "key": "note",
      "name": "Return note",
      "html": "\n<footer class=\"nt\"><span class=\"k\">On returns</span><p>Send the empty pans back in the sleeve the new ones arrived in. We do not give a discount for it and we do not want you to feel virtuous about it — it is just where the aluminium should go.</p></footer>"
    }
  ],
  "moduleCount": 3,
  "reorderable": true,
  "meta": {
    "id": "powder-room-refill",
    "model": "Claude Opus 5",
    "author": "Claude Code",
    "createdAt": "2026-09-02T01:32:49+09:00",
    "updatedAt": "2026-09-02T01:32:49+09:00",
    "version": "1.0.0",
    "isNew": false
  },
  "link": "/api/v1/designs/powder-room-refill.json",
  "structure": "Three plans as rounded cards, each opening with a row of 40px discs standing for the shades included, then price and a pill button.",
  "html": "<div class=\"dz dz-powder-room-refill\" data-design=\"powder-room-refill\" data-theme=\"powder-room\">\n<section class=\"dz-mod\" data-mod=\"head\" aria-label=\"Refill header\">\n<header class=\"rh\"><span class=\"k\">Refills</span><h1>Buy the colour, not the case</h1><p>Every shade is sold as a refill pan. The case is bought once, in metal, and it outlives every colour that goes into it.</p></header></section>\n<section class=\"dz-mod\" data-mod=\"plans\" aria-label=\"Plan cards\">\n<section class=\"pl\">\n<article><span class=\"k\">Single</span><div class=\"discs\"><span class=\"dc sm\" style=\"background:#B4515F\"></span></div><p class=\"pz\">£18<small> a refill</small></p><ul><li>Any one shade, any finish</li><li>Posted in a card sleeve</li><li>Old pan returned free</li></ul><button class=\"gh\">Buy a refill</button></article>\n<article class=\"on\"><span class=\"k\">Four a year</span><div class=\"discs\"><span class=\"dc sm\" style=\"background:#B4515F\"></span><span class=\"dc sm\" style=\"background:#D66A55\"></span><span class=\"dc sm\" style=\"background:#CE9791\"></span><span class=\"dc sm\" style=\"background:#A33F51\"></span></div><p class=\"pz\">£58<small> a year · £14.50 each</small></p><ul><li>Four refills, chosen when you want them</li><li>Swap a chosen shade until it ships</li><li>Old pans returned free</li><li>Comparison tray holds six instead of four</li></ul><button class=\"pri\">Choose four a year</button></article>\n<article><span class=\"k\">The kit</span><div class=\"discs\"><span class=\"dc sm\" style=\"background:#D4636B\"></span><span class=\"dc sm\" style=\"background:#B4515F\"></span><span class=\"dc sm\" style=\"background:#A33F51\"></span><span class=\"dc sm\" style=\"background:#D66A55\"></span><span class=\"dc sm\" style=\"background:#CE9791\"></span><span class=\"dc sm\" style=\"background:#DDC3A5\"></span></div><p class=\"pz\">£96<small> · £12 each</small></p><ul><li>Eight refills and the metal case</li><li>Case engraved, if you want</li><li>Old pans returned free</li><li>Comparison tray holds six</li></ul><button class=\"gh\">Choose the kit</button></article>\n</section></section>\n<section class=\"dz-mod\" data-mod=\"note\" aria-label=\"Return note\">\n<footer class=\"nt\"><span class=\"k\">On returns</span><p>Send the empty pans back in the sleeve the new ones arrived in. We do not give a discount for it and we do not want you to feel virtuous about it — it is just where the aluminium should go.</p></footer></section>\n</div>",
  "css": "\n.dz-powder-room-refill { background: var(--background); color: var(--foreground); font-family: var(--pv-body); padding: 44px 30px; }\n.dz-powder-room-refill .k { text-transform: uppercase; letter-spacing: .18em; font-size: 10px; font-weight: 700; color: var(--muted-foreground); display: block; margin-bottom: 12px; }\n\n.dz-powder-room-refill .dc { width: 64px; height: 64px; border-radius: 9999px; flex: none; display: block; box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--foreground) 12%, transparent); }\n.dz-powder-room-refill .dc.sm { width: 40px; height: 40px; }\n.dz-powder-room-refill .dc.lg { width: 96px; height: 96px; }\n.dz-powder-room-refill .dc.kit { outline: 2px solid var(--accent); outline-offset: 3px; }\n.dz-powder-room-refill .rh { text-align: center; margin-bottom: 32px; }\n.dz-powder-room-refill h1 { font-family: var(--pv-display); font-weight: 400; font-size: 66px; line-height: 1.04; letter-spacing: -.02em; margin: 6px 0 12px; }\n.dz-powder-room-refill .rh p { margin: 0 auto; font-size: 16px; line-height: 1.62; color: var(--muted-foreground); max-width: 58ch; }\n.dz-powder-room-refill .pl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1080px; margin: 0 auto; }\n.dz-powder-room-refill .pl article { background: var(--card); border: 1px solid var(--border); border-radius: 18px; padding: 24px; }\n.dz-powder-room-refill .pl .on { border-color: var(--primary); border-width: 2px; padding: 23px; }\n.dz-powder-room-refill .discs { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 18px; min-height: 40px; }\n.dz-powder-room-refill .pz { font-family: var(--pv-display); font-weight: 400; font-size: 44px; line-height: 1; letter-spacing: -.015em; margin: 0 0 18px; }\n.dz-powder-room-refill .pz small { font-size: 14px; color: var(--muted-foreground); letter-spacing: 0; }\n.dz-powder-room-refill ul { list-style: none; margin: 0 0 20px; padding: 0; }\n.dz-powder-room-refill li { padding: 9px 0; border-bottom: 1px solid var(--border); font-size: 14px; }\n.dz-powder-room-refill button { width: 100%; border-radius: 9999px; padding: 13px; font: inherit; font-weight: 600; cursor: pointer; }\n.dz-powder-room-refill .pri { background: var(--primary); color: var(--primary-foreground); border: 0; }\n.dz-powder-room-refill .gh { background: transparent; color: var(--primary); border: 1px solid var(--primary); }\n.dz-powder-room-refill .nt { max-width: 1080px; margin: 32px auto 0; padding-top: 18px; border-top: 1px solid var(--border); }\n.dz-powder-room-refill .nt p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--muted-foreground); max-width: 66ch; }\n@media (prefers-reduced-motion: reduce) { .dz-powder-room-refill *, .dz-powder-room-refill *::before, .dz-powder-room-refill *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; } }\n",
  "requiredTheme": "/api/v1/themes/powder-room.json",
  "googleFontsHref": "https://fonts.googleapis.com/css2?family=DM+Serif+Display:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700&family=Syne+Mono:wght@400;500;600;700&display=swap"
}