{
  "id": "blacktop-recruit",
  "name": "Driver Recruitment",
  "theme": "blacktop",
  "category": "Marketing",
  "description": "A driver recruitment page that leads with the pay and the shift pattern, because those are the only two things anyone reading it wants to know.",
  "layout": "A pay figure filling a full-width white band at the very top, then a two-column split of shift patterns against a plain honest list of what the job is actually like.",
  "modules": [
    {
      "key": "pay",
      "name": "Pay band",
      "html": "\n<div class=\"py\"><b>£38,400</b><span class=\"u\">a year, plus £1,800 in overnight allowance</span><span class=\"m\">Reviewed every April. Published here, not negotiated individually.</span></div>"
    },
    {
      "key": "shifts",
      "name": "Shift patterns",
      "html": "\n<section class=\"sh\"><h2 class=\"hh\">The patterns we run</h2>\n<ol>\n  <li><b>Four on, four off</b><span class=\"m\">12-hour days · 05:00 or 17:00 start · Kirkstall depot</span><span class=\"ct\">14 open</span></li>\n  <li><b>Monday to Friday, days</b><span class=\"m\">9-hour days · 06:00 start · Northfield depot</span><span class=\"ct\">6 open</span></li>\n  <li><b>Trunk nights</b><span class=\"m\">22:00 to 06:00 · four nights · Beckton hub</span><span class=\"ct\">3 open</span></li>\n  <li><b>Weekend only</b><span class=\"m\">Saturday and Sunday · 10-hour days · any depot</span><span class=\"ct\">9 open</span></li>\n</ol></section>"
    },
    {
      "key": "honest",
      "name": "What it is like",
      "html": "\n<aside class=\"hn\"><h2 class=\"hh\">What the job is actually like</h2>\n<ul>\n  <li>You will be outside in weather, all year, for most of the shift.</li>\n  <li>The round is planned but not padded. On a bad day it does not all fit.</li>\n  <li>We do not use a productivity score and there is no league table.</li>\n  <li>Vans are under four years old and serviced on schedule, not on failure.</li>\n  <li>If you cannot finish, you call and we send someone. That is not held against you.</li>\n</ul></aside>"
    },
    {
      "key": "apply",
      "name": "Apply bar",
      "html": "\n<footer class=\"ap\"><div><span class=\"k\">Applying</span><p>One page, no cover letter, no video interview. We call within two working days.</p></div><button type=\"button\" class=\"go\">Apply</button></footer>"
    }
  ],
  "moduleCount": 4,
  "reorderable": true,
  "meta": {
    "id": "blacktop-recruit",
    "model": "Claude Opus 5",
    "author": "Claude Code",
    "createdAt": "2026-09-01T20:18:14+09:00",
    "updatedAt": "2026-09-01T20:18:14+09:00",
    "version": "1.0.0",
    "isNew": false
  },
  "link": "/api/v1/designs/blacktop-recruit.json",
  "structure": "A pay figure filling a full-width white band at the very top, then a two-column split of shift patterns against a plain honest list of what the job is actually like.",
  "html": "<div class=\"dz dz-blacktop-recruit\" data-design=\"blacktop-recruit\" data-theme=\"blacktop\">\n<section class=\"dz-mod\" data-mod=\"pay\" aria-label=\"Pay band\">\n<div class=\"py\"><b>£38,400</b><span class=\"u\">a year, plus £1,800 in overnight allowance</span><span class=\"m\">Reviewed every April. Published here, not negotiated individually.</span></div></section>\n<section class=\"dz-mod\" data-mod=\"shifts\" aria-label=\"Shift patterns\">\n<section class=\"sh\"><h2 class=\"hh\">The patterns we run</h2>\n<ol>\n  <li><b>Four on, four off</b><span class=\"m\">12-hour days · 05:00 or 17:00 start · Kirkstall depot</span><span class=\"ct\">14 open</span></li>\n  <li><b>Monday to Friday, days</b><span class=\"m\">9-hour days · 06:00 start · Northfield depot</span><span class=\"ct\">6 open</span></li>\n  <li><b>Trunk nights</b><span class=\"m\">22:00 to 06:00 · four nights · Beckton hub</span><span class=\"ct\">3 open</span></li>\n  <li><b>Weekend only</b><span class=\"m\">Saturday and Sunday · 10-hour days · any depot</span><span class=\"ct\">9 open</span></li>\n</ol></section></section>\n<section class=\"dz-mod\" data-mod=\"honest\" aria-label=\"What it is like\">\n<aside class=\"hn\"><h2 class=\"hh\">What the job is actually like</h2>\n<ul>\n  <li>You will be outside in weather, all year, for most of the shift.</li>\n  <li>The round is planned but not padded. On a bad day it does not all fit.</li>\n  <li>We do not use a productivity score and there is no league table.</li>\n  <li>Vans are under four years old and serviced on schedule, not on failure.</li>\n  <li>If you cannot finish, you call and we send someone. That is not held against you.</li>\n</ul></aside></section>\n<section class=\"dz-mod\" data-mod=\"apply\" aria-label=\"Apply bar\">\n<footer class=\"ap\"><div><span class=\"k\">Applying</span><p>One page, no cover letter, no video interview. We call within two working days.</p></div><button type=\"button\" class=\"go\">Apply</button></footer></section>\n</div>",
  "css": "\n.dz-blacktop-recruit { background: var(--background); color: var(--foreground); font-family: var(--pv-body); display: grid; grid-template-columns: 3fr 2fr; column-gap: 26px; padding: 0 26px 26px; align-content: start; }\n.dz-blacktop-recruit .py { grid-column: 1 / -1; background: var(--primary); color: var(--primary-foreground); padding: 26px; display: flex; flex-direction: column; gap: 4px; margin-bottom: 26px; }\n.dz-blacktop-recruit .py b { font-family: var(--pv-mono); font-size: 84px; line-height: .94; letter-spacing: -.05em; }\n.dz-blacktop-recruit .u { font-family: var(--pv-display); text-transform: uppercase; font-weight: 400; letter-spacing: .005em; font-size: 22px; }\n.dz-blacktop-recruit .py .m { font-size: 13px; opacity: .78; }\n.dz-blacktop-recruit .hh { font-family: var(--pv-display); text-transform: uppercase; font-weight: 400; letter-spacing: .005em; font-size: 26px; margin: 0 0 14px; }\n.dz-blacktop-recruit .sh ol { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--border); }\n.dz-blacktop-recruit .sh li { display: grid; grid-template-columns: minmax(0, 1fr) 90px; gap: 3px 16px; padding: 14px 0; border-bottom: 2px solid var(--border); }\n.dz-blacktop-recruit .sh b { font-family: var(--pv-display); text-transform: uppercase; font-weight: 400; letter-spacing: .005em; font-size: 24px; }\n.dz-blacktop-recruit .m { font-size: 13px; color: var(--muted-foreground); }\n.dz-blacktop-recruit .ct { grid-row: 1 / 3; font-family: var(--pv-mono); font-size: 14px; text-align: right; color: var(--accent); padding-top: 6px; }\n.dz-blacktop-recruit .hn ul { list-style: none; margin: 0; padding: 0; }\n.dz-blacktop-recruit .hn li { font-size: 14.5px; line-height: 1.55; color: var(--muted-foreground); padding: 10px 0 10px 20px; border-bottom: var(--pv-bw) solid var(--border); position: relative; }\n.dz-blacktop-recruit .hn li::before { content: \"\"; position: absolute; left: 0; top: 18px; width: 10px; height: 2px; background: var(--primary); }\n.dz-blacktop-recruit .ap { grid-column: 1 / -1; display: flex; align-items: center; gap: 26px; border: 2px solid var(--border); border-radius: var(--pv-radius); padding: 20px 24px; margin-top: 26px; }\n.dz-blacktop-recruit .k { font-size: 12px; color: var(--muted-foreground); }\n.dz-blacktop-recruit .ap p { font-size: 15px; margin: 6px 0 0; }\n.dz-blacktop-recruit .ap div { flex: 1; }\n.dz-blacktop-recruit .go { font: inherit; font-family: var(--pv-display); text-transform: uppercase; font-weight: 400; letter-spacing: .005em; font-size: 24px; background: var(--primary); color: var(--primary-foreground); border: 2px solid var(--primary); border-radius: var(--pv-radius); padding: 12px 40px; cursor: pointer; }\n@media (prefers-reduced-motion: reduce) { .dz-blacktop-recruit *, .dz-blacktop-recruit *::before, .dz-blacktop-recruit *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; } }",
  "requiredTheme": "/api/v1/themes/blacktop.json",
  "googleFontsHref": "https://fonts.googleapis.com/css2?family=Anton:wght@400;500;600;700&family=Inter:wght@400;500;600;700&family=Martian+Mono:wght@400;500;600;700&display=swap"
}