<!-- BLOCK core-bleed — full-bleed image, optional caption.
     Slots: image_url, image_alt, caption -->
<section class="de-block de-block--flush de-bleed">
  <img class="de-bleed__img" src="{{image_url}}" alt="{{image_alt}}">
  {{#caption}}<p class="de-bleed__cap">{{caption}}</p>{{/caption}}
</section>

{
  "block": "core-bleed",
  "data": {
    "image_url": "assets/photo-pending.svg",
    "image_alt": "Photo pending",
    "caption": "The Chicago home buying team · photograph pending"
  }
}

<!-- BLOCK core-cta — the ask, off-axis.
     Set inverse:true to run it on the ink ground; set straddle:true and the
     block pulls the PREVIOUS sheet down across its own top edge, which is the
     single cheapest depth moment in the system — the object is in front of both
     grounds, so both fall behind it.
     Slots: inverse, straddle, kicker, headline, body, primary_label,
            primary_url, secondary_label, secondary_url, aside -->
<section class="de-block de-cta{{#inverse}} de-block--inverse{{/inverse}}{{#straddle}} de-block--straddle{{/straddle}}">
  <div class="de-shell">
    <div class="de-cta__grid">
      <div>
        {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
        <h2 class="de-h2">{{headline}}</h2>
        {{#body}}<p class="de-body de-lead">{{body}}</p>{{/body}}
      </div>
      <div class="de-cta__act">
        <a class="de-btn" href="{{primary_url}}">{{primary_label}}</a>
        {{#secondary_label}}<a class="de-btn de-btn--ghost" href="{{secondary_url}}">{{secondary_label}}</a>{{/secondary_label}}
        {{#aside}}<p class="de-meta" style="margin-top: var(--sp-4);">{{aside}}</p>{{/aside}}
      </div>
    </div>
  </div>
</section>

{
  "block": "core-cta",
  "data": {
    "inverse": true,
    "kicker": "Enter your zip code",
    "headline": "Request your cash offer.",
    "body": "Tell us the address and we will do the rest of the research ourselves. No obligation.",
    "primary_label": "Get Cash Offer",
    "primary_url": "#",
    "aside": "Or call (312) 313-7568 · 1-888-906-1110"
  }
}

<!-- BLOCK core-footer — contact, links, legal, unsubscribe.
     unsubscribe_url is REQUIRED on the email lane and must be the slug-based
     opt-out URL, not a host-specific one. Slots: brand_name, address, phone,
     email, columns[] {title, links[] {label, url}}, legal, unsubscribe_url,
     unsubscribe_label -->
<section class="de-block de-footer">
  <div class="de-shell">
    <div class="de-footer__grid">
      <div>
        <p class="de-kicker">{{brand_name}}</p>
        {{#address}}<p class="de-meta" style="margin:0 0 var(--sp-2);">{{address}}</p>{{/address}}
        {{#phone}}<p class="de-meta" style="margin:0;">{{phone}}</p>{{/phone}}
        {{#email}}<p class="de-meta" style="margin:0;"><a href="mailto:{{email}}">{{email}}</a></p>{{/email}}
      </div>
      {{#columns}}
      <div>
        <p class="de-kicker">{{title}}</p>
        <ul class="de-footer__links">
          {{#links}}<li><a href="{{url}}">{{label}}</a></li>{{/links}}
        </ul>
      </div>
      {{/columns}}
    </div>
    <p class="de-footer__legal">
      {{legal}}
      {{#unsubscribe_url}}<br><a href="{{unsubscribe_url}}">{{unsubscribe_label}}</a>{{/unsubscribe_url}}
    </p>
  </div>
</section>

{
  "block": "core-footer",
  "data": {
    "brand_name": "Diamond Equity Investments",
    "address": "Chicago, IL",
    "phone": "(312) 313-7568",
    "email": "",
    "columns": [
      {
        "title": "Company",
        "links": [
          {
            "label": "How it works",
            "url": "#"
          },
          {
            "label": "About",
            "url": "#"
          }
        ]
      },
      {
        "title": "Legal",
        "links": [
          {
            "label": "Privacy",
            "url": "#"
          },
          {
            "label": "Terms",
            "url": "#"
          }
        ]
      }
    ],
    "legal": "Diamond Equity Investments buys houses directly. We are not acting as your agent or broker.",
    "unsubscribe_url": "#",
    "unsubscribe_label": "Unsubscribe"
  }
}

<!-- BLOCK core-hero — the opening statement, composed as a packet.
     The plate is a STACK (backing sheets fanned +0.5°/-0.35°) and the seal
     hangs off its corner so it occludes both the plate and the ground. That
     asymmetry is deliberate: kicker → centred headline → subhead → two buttons
     is the arrangement every generated page reaches for, and it is why the
     first pass of this set read as templated.
     Slots: kicker, headline, subhead, primary_label, primary_url,
            secondary_label, secondary_url, image_url, image_alt,
            seal_cap, seal_value -->
<section class="de-block de-hero">
  <div class="de-shell">
    <div class="de-hero__grid">
      <div class="de-hero__copy">
        {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
        <h1 class="de-h1">{{headline}}</h1>
        {{#subhead}}<p class="de-body de-lead de-hero__sub">{{subhead}}</p>{{/subhead}}
        {{#primary_label}}
        <div class="de-hero__actions">
          <a class="de-btn" href="{{primary_url}}">{{primary_label}}</a>
          {{#secondary_label}}<a class="de-btn de-btn--ghost" href="{{secondary_url}}">{{secondary_label}}</a>{{/secondary_label}}
        </div>
        {{/primary_label}}
      </div>
      {{#image_url}}
      <div class="de-hero__plate de-stack">
        <img class="de-img de-img--tall" src="{{image_url}}" alt="{{image_alt}}">
        {{#seal_value}}
        <span class="de-hero__seal de-over de-seal">
          <span class="de-seal__cap">{{seal_cap}}</span>{{seal_value}}
        </span>
        {{/seal_value}}
      </div>
      {{/image_url}}
    </div>
  </div>
</section>

{
  "block": "core-hero",
  "data": {
    "kicker": "We buy houses in Chicago, IL",
    "headline": "Just sell it as is.",
    "subhead": "Experience the fast and convenient sale. You make no repairs, you pay no agent fees, and we will even handle the clean-out.",
    "primary_label": "Get Cash Offer",
    "primary_url": "#",
    "secondary_label": "How this works",
    "secondary_url": "#",
    "image_url": "assets/photo-pending.svg",
    "image_alt": "Chicago property — photograph pending",
    "seal_cap": "Offer within",
    "seal_value": "24 hours"
  }
}

<!-- BLOCK core-masthead — logo bar.
     THE DIAMOND IS LOCKED ARTWORK. logo_url is sized and positioned here and
     nowhere else: never filter it, mask it, recolour it, or swap it for a
     redrawn mark. Slots: logo_url, home_url, brand_name, brand_where, aside -->
<section class="de-block de-block--flush">
  <div class="de-shell" style="padding-inline: var(--gutter);">
    <header class="de-masthead">
      <a class="de-masthead__lockup" href="{{home_url}}">
        <img class="de-masthead__gem" src="{{logo_url}}" alt="{{brand_name}}" width="34">
        <span>
          <span class="de-masthead__name">{{brand_name}}</span>
          {{#brand_where}}<span class="de-masthead__where">{{brand_where}}</span>{{/brand_where}}
        </span>
      </a>
      {{#aside}}<span class="de-masthead__aside">{{aside}}</span>{{/aside}}
    </header>
  </div>
</section>

{
  "block": "core-masthead",
  "data": {
    "logo_url": "assets/dei-diamond.png",
    "home_url": "#",
    "brand_name": "Diamond Equity Investments",
    "brand_where": "Chicago",
    "aside": "(312) 313-7568"
  }
}

<!-- BLOCK core-prose — headline plus body copy. The workhorse; repeat freely.
     Slots: kicker, headline, paragraphs[] (array of strings) -->
<section class="de-block de-prose">
  <div class="de-shell de-shell--narrow">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    {{#headline}}<h2 class="de-h2">{{headline}}</h2>{{/headline}}
    <div class="de-prose__body">
      {{#paragraphs}}<p class="de-body">{{.}}</p>{{/paragraphs}}
    </div>
  </div>
</section>

{
  "block": "core-prose",
  "data": {
    "kicker": "Guaranteed closing",
    "headline": "We guarantee our deal will go to closing.",
    "paragraphs": [
      "We understand how stressful it can be when you need to sell your house fast in Chicago. It can seem like finding a buyer is nearly impossible when your home isn't perfect.",
      "Our process can take as little as seven days. If you're selling a house in Chicago and don't have time to wait, call us for a quick offer and a fast closing process."
    ]
  }
}

<!-- BLOCK core-rule — the torn deckled edge. Set plain:true for a hairline.
     Slots: plain -->
<section class="de-block de-block--flush de-rule{{#plain}} de-rule--plain{{/plain}}">
  <div class="de-shell" style="padding-inline: var(--gutter);">
    <div class="de-rule__torn" role="separator"></div>
  </div>
</section>

{
  "block": "core-rule",
  "data": {}
}

<!-- BLOCK core-split — image beside text. Set flip:true to put the image right.
     Slots: flip, kicker, headline, paragraphs[], cta_label, cta_url,
            image_url, image_alt -->
<section class="de-block de-split{{#flip}} de-split--flip{{/flip}}">
  <div class="de-shell">
    <div class="de-split__grid">
      <div class="de-split__media">
        <img class="de-img de-img--square" src="{{image_url}}" alt="{{image_alt}}">
      </div>
      <div class="de-split__copy">
        {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
        <h2 class="de-h2">{{headline}}</h2>
        {{#paragraphs}}<p class="de-body">{{.}}</p>{{/paragraphs}}
        {{#cta_label}}<p style="margin-top: var(--sp-5);"><a class="de-btn de-btn--ghost" href="{{cta_url}}">{{cta_label}}</a></p>{{/cta_label}}
      </div>
    </div>
  </div>
</section>

{
  "block": "core-split",
  "data": {
    "kicker": "Any condition",
    "headline": "We'll even handle the clean-out.",
    "paragraphs": [
      "Leave unwanted items behind. Selling is easy.",
      "There's no need for repairs when we buy houses in Chicago — and we can even help you move."
    ],
    "cta_label": "Get Cash Offer",
    "cta_url": "#",
    "image_url": "assets/photo-pending.svg",
    "image_alt": "Photo pending"
  }
}

<!-- BLOCK deal-beforeafter — the renovation pair. Two photos, two labels, no
     slider: it must read the same in an email and on paper.
     Slots: kicker, headline, body, before_url, before_alt, before_label,
            after_url, after_alt, after_label -->
<section class="de-block de-ba">
  <div class="de-shell">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    {{#headline}}<h2 class="de-h2">{{headline}}</h2>{{/headline}}
    {{#body}}<p class="de-body">{{body}}</p>{{/body}}
    <div class="de-ba__pair" style="margin-top: var(--sp-6);">
      <figure style="margin:0;">
        <img class="de-img de-img--wide" src="{{before_url}}" alt="{{before_alt}}">
        <figcaption class="de-ba__label">{{before_label}}</figcaption>
      </figure>
      <figure style="margin:0;">
        <img class="de-img de-img--wide" src="{{after_url}}" alt="{{after_alt}}">
        <figcaption class="de-ba__label">{{after_label}}</figcaption>
      </figure>
    </div>
  </div>
</section>

{
  "block": "deal-beforeafter",
  "data": {
    "kicker": "What we do after",
    "headline": "The house gets its second life",
    "body": "What happens next is our cost and our problem.",
    "before_url": "assets/photo-pending.svg",
    "before_alt": "Before",
    "before_label": "The day we bought it",
    "after_url": "assets/photo-pending.svg",
    "after_alt": "After",
    "after_label": "The day it relisted"
  }
}

<!-- BLOCK deal-breakdown — the cash-offer maths, line by line. The numbers are
     the design; do not decorate them.
     Slots: kicker, headline, note, col_label, col_amount,
            lines[] {label, amount}, total_label, total_amount -->
<section class="de-block de-breakdown">
  <div class="de-shell de-shell--narrow">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    {{#headline}}<h2 class="de-h2">{{headline}}</h2>{{/headline}}
    <table class="de-breakdown__table">
      <thead>
        <tr><th scope="col">{{col_label}}</th><th scope="col">{{col_amount}}</th></tr>
      </thead>
      <tbody>
        {{#lines}}<tr><td>{{label}}</td><td class="de-num">{{amount}}</td></tr>{{/lines}}
        <tr class="de-breakdown__total"><td>{{total_label}}</td><td class="de-num">{{total_amount}}</td></tr>
      </tbody>
    </table>
    {{#note}}<p class="de-meta" style="margin-top: var(--sp-5);">{{note}}</p>{{/note}}
  </div>
</section>

{
  "block": "deal-breakdown",
  "data": {
    "kicker": "The maths",
    "headline": "What you keep",
    "col_label": "Line",
    "col_amount": "Amount",
    "lines": [
      {
        "label": "Offer price",
        "amount": "$——,———"
      },
      {
        "label": "Agent commission",
        "amount": "$0"
      },
      {
        "label": "Closing costs — we cover",
        "amount": "$0"
      },
      {
        "label": "Repairs required",
        "amount": "$0"
      }
    ],
    "total_label": "Net to you at closing",
    "total_amount": "$——,———",
    "note": "The zeroes are the client's published terms. The offer figure is filled in at the walkthrough."
  }
}

<!-- BLOCK deal-compare — the direct-buyer argument, line by line, against a
     traditional sale. This is the client's own comparison and it is the single
     most persuasive thing they publish; it earns a first-class block.
     Below 700px the header row is hidden and the accent rule carried onto OUR
     column becomes the only thing distinguishing the two stacked values —
     without it the mobile view is two unlabelled values per row and the
     argument is destroyed. Real table markup with scope attributes throughout;
     the media query changes display only.
     Slots: kicker, headline, col_axis, col_us, col_them,
            rows[] {axis, us, them}, note -->
<section class="de-block">
  <div class="de-shell">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    {{#headline}}<h2 class="de-h2">{{headline}}</h2>{{/headline}}
    <table class="de-compare" style="margin-top: var(--sp-6);">
      <thead>
        <tr>
          <th scope="col">{{col_axis}}</th>
          <th scope="col">{{col_us}}</th>
          <th scope="col">{{col_them}}</th>
        </tr>
      </thead>
      <tbody>
        {{#rows}}
        <tr>
          <th scope="row">{{axis}}</th>
          <td>{{us}}</td>
          <td>{{them}}</td>
        </tr>
        {{/rows}}
      </tbody>
    </table>
    {{#note}}<p class="de-meta" style="margin-top: var(--sp-5);">{{note}}</p>{{/note}}
  </div>
</section>

{
  "block": "deal-compare",
  "data": {
    "kicker": "The difference",
    "headline": "Us, against a traditional sale.",
    "col_axis": "Points",
    "col_us": "Diamond Equity",
    "col_them": "Traditional home sale",
    "rows": [
      {
        "axis": "Average days to close",
        "us": "As little as 24 hours",
        "them": "Could take over a month or two"
      },
      {
        "axis": "Average commissions",
        "us": "No commissions",
        "them": "Depends on the final price"
      },
      {
        "axis": "Transaction costs",
        "us": "No transaction cost",
        "them": "Up to $25K"
      },
      {
        "axis": "Estimated agent fees",
        "us": "No agent fees",
        "them": "Up to 6%"
      },
      {
        "axis": "Repairs required to sell",
        "us": "None",
        "them": "Could be a substantial amount"
      },
      {
        "axis": "Closing date",
        "us": "You pick your own closing date",
        "them": "It depends on the realtors"
      }
    ]
  }
}

<!-- BLOCK deal-neighborhood — the map or street photo beside the local numbers.
     Slots: kicker, headline, body, image_url, image_alt,
            rows[] {label, value} -->
<section class="de-block de-hood">
  <div class="de-shell">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    {{#headline}}<h2 class="de-h2">{{headline}}</h2>{{/headline}}
    <div class="de-hood__grid" style="margin-top: var(--sp-6);">
      <img class="de-img de-img--wide" src="{{image_url}}" alt="{{image_alt}}">
      <div>
        {{#body}}<p class="de-body">{{body}}</p>{{/body}}
        <ul class="de-hood__list">
          {{#rows}}<li><span class="de-meta">{{label}}</span><b>{{value}}</b></li>{{/rows}}
        </ul>
      </div>
    </div>
  </div>
</section>

{
  "block": "deal-neighborhood",
  "data": {
    "kicker": "Context",
    "headline": "What the block is doing",
    "body": "Specimen comparables — pull real figures from current Cook County records.",
    "image_url": "assets/photo-pending.svg",
    "image_alt": "Map pending",
    "rows": [
      {
        "label": "Median sale, 0.5 mi, 90 days",
        "value": "$000,000"
      },
      {
        "label": "Days on market, median",
        "value": "00"
      },
      {
        "label": "Active listings, 0.5 mi",
        "value": "00"
      }
    ]
  }
}

<!-- BLOCK deal-property — one address, its photo and its facts, as a sheet in
     the packet. Each card is a `.de-stack`: two backing sheets fanned behind it,
     so a row of properties reads as a stack of records rather than a card grid.
     ⚠️ .de-stack and .de-marks both use ::before/::after — never both on one
     element. The card is a stack, so it gets no marks.
     Slots: kicker, headline, properties[] {image_url, image_alt, address,
            city, facts[] {label, value}, status} -->
<section class="de-block de-property">
  <div class="de-shell">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    {{#headline}}<h2 class="de-h2">{{headline}}</h2>{{/headline}}
    <div class="de-grid de-grid--3" style="margin-top: var(--sp-7); row-gap: var(--sp-8);">
      {{#properties}}
      <article class="de-stack de-stack--tight de-property__card">
        <div class="de-frame" style="overflow:hidden;">
          <img class="de-img de-img--wide" src="{{image_url}}" alt="{{image_alt}}" style="border-radius:0;">
          <div class="de-property__body">
            <h3 class="de-property__addr">{{address}}</h3>
            <p class="de-property__city">{{city}}</p>
            <dl class="de-property__facts">
              {{#facts}}
              <div class="de-property__fact"><dt>{{label}}</dt><dd>{{value}}</dd></div>
              {{/facts}}
            </dl>
          </div>
        </div>
      </article>
      {{/properties}}
    </div>
  </div>
</section>

{
  "block": "deal-property",
  "data": {
    "kicker": "Recently bought in Cook County",
    "headline": "We buy houses in any condition.",
    "properties": [
      {
        "image_url": "assets/photo-pending.svg",
        "image_alt": "Photo pending",
        "address": "SUBJECT PROPERTY A",
        "city": "Chicago, IL",
        "facts": [
          {
            "label": "Beds",
            "value": "3"
          },
          {
            "label": "Baths",
            "value": "1.5"
          },
          {
            "label": "Sq ft",
            "value": "1,420"
          }
        ]
      },
      {
        "image_url": "assets/photo-pending.svg",
        "image_alt": "Photo pending",
        "address": "SUBJECT PROPERTY B",
        "city": "Chicago, IL",
        "facts": [
          {
            "label": "Beds",
            "value": "4"
          },
          {
            "label": "Baths",
            "value": "2"
          },
          {
            "label": "Sq ft",
            "value": "1,980"
          }
        ]
      },
      {
        "image_url": "assets/photo-pending.svg",
        "image_alt": "Photo pending",
        "address": "SUBJECT PROPERTY C",
        "city": "Chicago, IL",
        "facts": [
          {
            "label": "Beds",
            "value": "3"
          },
          {
            "label": "Baths",
            "value": "1"
          },
          {
            "label": "Sq ft",
            "value": "1,150"
          }
        ]
      }
    ]
  }
}

<!-- BLOCK deal-situations — Any Reason / Any Condition / Any Challenge.
     Three ruled columns of plain words. No cards, no icons, no pills: the
     LENGTH of the lists is the argument. A seller in probate or a tax sale is
     scanning for their own situation, and finding it named is the conversion.
     Slots: kicker, headline, body, columns[] {title, items[]} -->
<section class="de-block">
  <div class="de-shell">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    {{#headline}}<h2 class="de-h2">{{headline}}</h2>{{/headline}}
    {{#body}}<p class="de-body de-lead">{{body}}</p>{{/body}}
    <div class="de-situations" style="margin-top: var(--sp-7);">
      {{#columns}}
      <div class="de-situations__col">
        <h3 class="de-situations__head">{{title}}</h3>
        <ul class="de-situations__list">
          {{#items}}<li>{{.}}</li>{{/items}}
        </ul>
      </div>
      {{/columns}}
    </div>
  </div>
</section>

{
  "block": "deal-situations",
  "data": {
    "kicker": "Any reason · any condition · any challenge",
    "headline": "We're ready to buy your house.",
    "body": "Out of all the companies that buy houses in Chicago, we deal with the most unsatisfactory situations.",
    "columns": [
      {
        "title": "Any Reason",
        "items": [
          "Divorce",
          "Bankruptcy",
          "Foreclosure",
          "Massive Repairs Needed",
          "Inherited Properties",
          "Downsizing",
          "Relocation",
          "Health Issues"
        ]
      },
      {
        "title": "Any Condition",
        "items": [
          "Unfinished Construction",
          "Full of Stuff or Trash",
          "Fire Damage",
          "Storm Damage",
          "Major Repairs Needed",
          "Termite Damage",
          "Problem Tenants",
          "Old, Outdated Houses"
        ]
      },
      {
        "title": "Any Challenge",
        "items": [
          "Hoarder Home",
          "Low Equity",
          "Late on Mortgage Payments",
          "Code Violations",
          "Family Matters",
          "Out of Area Property",
          "Large Liens",
          "Title Issues"
        ]
      }
    ]
  }
}

<!-- BLOCK deal-status — the direct-buyer lifecycle: Just Bought, Under
     Contract, Renovation Complete, Just Listed, Just Sold.
     A DOT PLUS A WORD. Never a pill or capsule — that is a design law.
     Each step's `state` is one of: past | done | now | next
     Slots: kicker, headline, steps[] {label, state}, note -->
<section class="de-block de-block--tight">
  <div class="de-shell">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    {{#headline}}<h2 class="de-h3 de-h-flat" style="margin-bottom: var(--sp-5);">{{headline}}</h2>{{/headline}}
    <div class="de-status">
      {{#steps}}
      <span class="de-status__item" data-state="{{state}}">
        <span class="de-status__dot"></span>{{label}}
      </span>
      {{/steps}}
    </div>
    {{#note}}<p class="de-meta" style="margin-top: var(--sp-5);">{{note}}</p>{{/note}}
  </div>
</section>

{
  "block": "deal-status",
  "data": {
    "kicker": "Where this stands",
    "headline": "Receive your money ASAP",
    "steps": [
      {
        "label": "House viewed",
        "state": "done"
      },
      {
        "label": "Cash offer issued",
        "state": "now"
      },
      {
        "label": "Paperwork",
        "state": "next"
      },
      {
        "label": "Closing",
        "state": "next"
      }
    ],
    "note": "You pick your own closing date. It can be as little as a week."
  }
}

<!-- BLOCK long-columns — two-column body copy. Collapses to one on narrow
     screens and in email. Use for anything over ~400 words.
     Slots: kicker, headline, paragraphs[] -->
<section class="de-block de-columns">
  <div class="de-shell">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    {{#headline}}<h2 class="de-h2">{{headline}}</h2>{{/headline}}
    <div class="de-columns__body">
      {{#paragraphs}}<p class="de-body">{{.}}</p>{{/paragraphs}}
    </div>
  </div>
</section>

{
  "block": "long-columns",
  "data": {
    "kicker": "Why Diamond Equity",
    "headline": "Selling a house fast in Chicago, IL",
    "paragraphs": [
      "When your house isn't in perfect condition, finding a buyer that pays cash for houses in Chicago is important. Out of all the companies that buy houses in Chicago, we deal with the most unsatisfactory situations.",
      "If you're unable to produce the cash to make the renovations on your home, we can provide the help you need. We also deal with foreclosure when you need to sell a house fast in Chicago.",
      "You will never have any money taken out of your selling price to benefit a sales agent. You will also avoid the time-consuming process of dealing with a real estate company.",
      "There's no need for staging a home or taking photographs for large numbers of people showing up for walkthroughs."
    ]
  }
}

<!-- BLOCK long-faq — static markup, deliberately. No <details>, no JS: it must
     render identically in a browser, an email client and on paper.
     Slots: kicker, headline, items[] {q, a} -->
<section class="de-block">
  <div class="de-shell de-shell--narrow">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    {{#headline}}<h2 class="de-h2">{{headline}}</h2>{{/headline}}
    <div class="de-faq__list" style="margin-top: var(--sp-6);">
      {{#items}}
      <div class="de-faq__item">
        <h3 class="de-faq__q">{{q}}</h3>
        <p class="de-faq__a">{{a}}</p>
      </div>
      {{/items}}
    </div>
  </div>
</section>

{
  "block": "long-faq",
  "data": {
    "kicker": "Questions",
    "headline": "Why choose Diamond Equity?",
    "items": [
      {
        "q": "How fast can I get an offer?",
        "a": "When you search for fast Chicago home buyers, we can make you an offer within 24 hours."
      },
      {
        "q": "Will I pay closing fees?",
        "a": "You won't ever pay any closing fees, and our cash home buyers in Chicago won't ever take a commission."
      },
      {
        "q": "What if the house needs work?",
        "a": "There's no need for repairs when we buy houses in Chicago. We can even help you move."
      }
    ]
  }
}

<!-- BLOCK long-pagebreak — invisible on screen, a hard break on paper. Print
     lane only; harmless anywhere else. No slots. -->
<div class="de-pagebreak" aria-hidden="true"></div>

{
  "block": "long-pagebreak",
  "data": {}
}

<!-- BLOCK long-quote — the pull quote. One per page; it stops being a pull
     quote when there are two. Slots: quote, attribution -->
<section class="de-block de-block--tight">
  <div class="de-shell de-shell--narrow">
    <blockquote class="de-quote">
      <p>{{quote}}</p>
      {{#attribution}}<cite>{{attribution}}</cite>{{/attribution}}
    </blockquote>
  </div>
</section>

{
  "block": "long-quote",
  "data": {
    "quote": "Needed to move fast and save property from tax sale. You guys went the extra mile!",
    "attribution": "Saul · one of 217 seller review videos"
  }
}

<!-- BLOCK long-signature — closes a letter or an offer sheet.
     Slots: signature_url, signature_alt, name, title, date -->
<section class="de-block de-block--tight">
  <div class="de-shell de-shell--narrow">
    <div class="de-signature">
      {{#signature_url}}<img class="de-signature__mark" src="{{signature_url}}" alt="{{signature_alt}}">{{/signature_url}}
      <hr class="de-signature__rule">
      <p class="de-signature__who" style="margin:0;">{{name}}{{#title}} · {{title}}{{/title}}{{#date}} · {{date}}{{/date}}</p>
    </div>
  </div>
</section>

{
  "block": "long-signature",
  "data": {
    "name": "Acquisition Manager",
    "title": "Diamond Equity Investments · Chicago",
    "date": "Date of issue"
  }
}

<!-- BLOCK long-steps — the numbered process. Counters are CSS-generated, so
     adding or removing a step never leaves a stale number behind.
     Slots: kicker, headline, steps[] {title, body} -->
<section class="de-block">
  <div class="de-shell de-shell--narrow">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    {{#headline}}<h2 class="de-h2">{{headline}}</h2>{{/headline}}
    <ol class="de-steps__list" style="margin-top: var(--sp-6);">
      {{#steps}}
      <li>
        <div>
          <h3 class="de-h3 de-h-flat" style="font-size:1rem; margin-bottom: var(--sp-2);">{{title}}</h3>
          <p class="de-body de-meta" style="margin:0;">{{body}}</p>
        </div>
      </li>
      {{/steps}}
    </ol>
  </div>
</section>

{
  "block": "long-steps",
  "data": {
    "kicker": "Receive your money ASAP",
    "headline": "Four steps, then it is done",
    "steps": [
      {
        "title": "We'll schedule a time to view house",
        "body": "One visit. No staging, no photographs, no showings."
      },
      {
        "title": "You'll receive a cash offer on the spot",
        "body": "An offer within 24 hours, with no obligation."
      },
      {
        "title": "We'll handle all the paperwork",
        "body": "No mortgage companies delaying closing."
      },
      {
        "title": "Attend closing and get your cash",
        "body": "You pick your own closing date — as little as a week."
      }
    ]
  }
}

<!-- BLOCK packet-docket — THE SET'S ORGANIZING IDEA.
     The email, the page and the printed sheet are three sheets of ONE packet,
     and this is the line that says so: the property, the sheet number, the date
     and the expiry, set as an instrument rather than as a header. Someone who
     gets the email and later the printed sheet recognises them as one document.
     Use this INSTEAD OF core-masthead on anything belonging to a specific deal.
     THE DIAMOND IS LOCKED ARTWORK — sized and positioned only.
     Slots: logo_url, home_url, brand_name, fields[] {label, value}, sheet -->
<section class="de-block de-block--tight">
  <div class="de-shell">
    <header class="de-docket">
      <a class="de-docket__lockup" href="{{home_url}}">
        <img class="de-docket__gem" src="{{logo_url}}" alt="{{brand_name}}" width="28">
        <span class="de-docket__name">{{brand_name}}</span>
      </a>
      <dl class="de-docket__fields">
        {{#fields}}
        <div class="de-docket__field"><dt>{{label}}</dt><dd>{{value}}</dd></div>
        {{/fields}}
      </dl>
      {{#sheet}}<span class="de-docket__sheet">{{sheet}}</span>{{/sheet}}
    </header>
  </div>
</section>

{
  "block": "packet-docket",
  "data": {
    "logo_url": "assets/dei-diamond.png",
    "home_url": "#",
    "brand_name": "Diamond Equity Investments",
    "fields": [
      {
        "label": "Subject",
        "value": "SUBJECT PROPERTY"
      },
      {
        "label": "Market",
        "value": "Chicago, IL"
      },
      {
        "label": "Direct",
        "value": "(312) 313-7568"
      }
    ],
    "sheet": "Sheet 01 / 03"
  }
}

<!-- BLOCK trust-badges — third-party proof: the marks that are not ours.
     Sits on the ground under a hairline rule, never inside cards. Marks are
     images the client already publishes; anything without an image degrades to
     a plain mono word rather than a broken icon.
     Slots: label, badges[] {image_url, alt, text} -->
<section class="de-block de-block--tight">
  <div class="de-shell">
    {{#label}}<p class="de-kicker">{{label}}</p>{{/label}}
    <div class="de-badges">
      {{#badges}}
      {{#image_url}}<img src="{{image_url}}" alt="{{alt}}">{{/image_url}}
      {{^image_url}}<span class="de-badges__text">{{text}}</span>{{/image_url}}
      {{/badges}}
    </div>
  </div>
</section>

{
  "block": "trust-badges",
  "data": {
    "label": "Not our marks",
    "badges": [
      {
        "text": "Forbes Business Council"
      },
      {
        "text": "BBB Accredited"
      },
      {
        "text": "Neighborhood Beautification"
      },
      {
        "text": "As Seen On TV"
      }
    ]
  }
}

<!-- BLOCK trust-guarantee — the promise, on its own slip, with sheets behind it.
     Set straddle:true to hang it across the seam into the section below: the
     slip is then in front of both grounds, which is the strongest depth moment
     available and costs one negative margin.
     Slots: straddle, seal, headline, paragraphs[], signoff -->
<section class="de-block{{#straddle}} de-block--straddle{{/straddle}}">
  <div class="de-shell de-shell--narrow">
    <div class="de-stack{{#straddle}} de-straddler{{/straddle}}">
      <div class="de-guarantee__slip">
        {{#seal}}<span class="de-guarantee__seal">{{seal}}</span>{{/seal}}
        <h2 class="de-h2">{{headline}}</h2>
        {{#paragraphs}}<p class="de-body">{{.}}</p>{{/paragraphs}}
        {{#signoff}}<p class="de-meta" style="margin-top: var(--sp-5);">{{signoff}}</p>{{/signoff}}
      </div>
    </div>
  </div>
</section>

{
  "block": "trust-guarantee",
  "data": {
    "seal": "Guaranteed closing",
    "headline": "We guarantee our deal will go to closing.",
    "paragraphs": [
      "\"As is\" — you make no repairs. No agent fees, no commissions and no hidden costs. Quick cash closing, with no mortgage companies delaying closing.",
      "We'll even handle the clean-out. Leave unwanted items behind."
    ],
    "signoff": "Diamond Equity Investments · Chicago"
  }
}

<!-- BLOCK trust-manager — the acquisition manager. A named person with a real
     direct number; this block is the reason a seller calls back.
     Slots: kicker, photo_url, photo_alt, name, role, bio, phone, email,
            cta_label, cta_url -->
<section class="de-block de-manager">
  <div class="de-shell">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    <div class="de-manager__grid">
      <img class="de-img de-manager__photo de-img--square" src="{{photo_url}}" alt="{{photo_alt}}">
      <div>
        <h3 class="de-h3" style="margin-bottom: var(--sp-1);">{{name}}</h3>
        <p class="de-manager__role">{{role}}</p>
        {{#bio}}<p class="de-body" style="margin-top: var(--sp-4);">{{bio}}</p>{{/bio}}
        <ul class="de-manager__contact">
          {{#phone}}<li><a href="tel:{{phone}}">{{phone}}</a></li>{{/phone}}
          {{#email}}<li><a href="mailto:{{email}}">{{email}}</a></li>{{/email}}
        </ul>
        {{#cta_label}}<p style="margin-top: var(--sp-5);"><a class="de-btn de-btn--ghost" href="{{cta_url}}">{{cta_label}}</a></p>{{/cta_label}}
      </div>
    </div>
  </div>
</section>

{
  "block": "trust-manager",
  "data": {
    "kicker": "Your acquisition manager",
    "photo_url": "assets/photo-pending.svg",
    "photo_alt": "Portrait pending",
    "name": "Acquisition Manager",
    "role": "Diamond Equity Investments · Chicago",
    "bio": "One person owns your file start to finish, from the walkthrough to the closing table.",
    "phone": "(312) 313-7568",
    "email": "",
    "cta_label": "Get Cash Offer",
    "cta_url": "#"
  }
}

<!-- BLOCK trust-rating — the score line. `stars` is literal text (e.g. ★★★★★)
     so it survives email clients that strip everything clever.
     Slots: stars, score, source, count -->
<section class="de-block de-block--tight">
  <div class="de-shell">
    <div class="de-rating">
      <span class="de-rating__stars" aria-hidden="true">{{stars}}</span>
      <span class="de-rating__score de-num">{{score}}</span>
      <span class="de-meta">{{count}} · {{source}}</span>
    </div>
  </div>
</section>

{
  "block": "trust-rating",
  "data": {
    "stars": "★★★★★",
    "score": "5.0",
    "count": "189 reviews",
    "source": "SoTellUs"
  }
}

<!-- BLOCK trust-stats — the proof numbers. Three or four; more reads as noise.
     Slots: kicker, headline, stats[] {number, label} -->
<section class="de-block">
  <div class="de-shell">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    {{#headline}}<h2 class="de-h2">{{headline}}</h2>{{/headline}}
    <div class="de-grid de-grid--3" style="margin-top: var(--sp-6);">
      {{#stats}}
      <div class="de-stats__item">
        <span class="de-stats__n de-num">{{number}}</span>
        <span class="de-stats__k">{{label}}</span>
      </div>
      {{/stats}}
    </div>
  </div>
</section>

{
  "block": "trust-stats",
  "data": {
    "kicker": "The record",
    "stats": [
      {
        "number": "000",
        "label": "Houses bought in Cook County"
      },
      {
        "number": "00",
        "label": "Average days to close"
      },
      {
        "number": "$0.0M",
        "label": "Paid to Chicago sellers"
      }
    ]
  }
}

<!-- BLOCK trust-testimonial — a seller in their own words, inside crop marks.
     `.de-marks` gives containment without a card, so the quote stays flat on
     the paper and never needs elevation. The name and the town are load-bearing:
     an unattributed quote is worth nothing on a page asking for someone's house.
     ⚠️ .de-marks uses ::before/::after — never combine with .de-stack.
     Slots: kicker, quote, name, detail, photo_url, photo_alt, source -->
<section class="de-block de-testimonial">
  <div class="de-shell de-shell--narrow">
    {{#kicker}}<p class="de-kicker">{{kicker}}</p>{{/kicker}}
    <div class="de-marks" style="padding: var(--sp-6);">
      <div class="de-testimonial__grid">
        {{#photo_url}}<img class="de-img de-testimonial__photo" src="{{photo_url}}" alt="{{photo_alt}}">{{/photo_url}}
        <blockquote style="margin:0;">
          <p class="de-testimonial__quote">{{quote}}</p>
          <p class="de-testimonial__who">{{name}}{{#detail}} · {{detail}}{{/detail}}{{#source}} · {{source}}{{/source}}</p>
        </blockquote>
      </div>
    </div>
  </div>
</section>

{
  "block": "trust-testimonial",
  "data": {
    "kicker": "A seller, in their own words",
    "quote": "I just want to thank you again for buying my sisters house. I also want to thank you for being so professional in my stressed out state.",
    "name": "Audrey P.",
    "detail": "Schaumburg, IL",
    "source": "SoTellUs",
    "photo_url": "assets/photo-pending.svg",
    "photo_alt": "Portrait pending"
  }
}