/* Deals (12 Nov 2026): /deals/ page, the business page #deals section and the home strip.
   Built like the Updates cards; the photo box never crops, because flyers carry their text to the edges. */
.dtowns .chips{margin-top:18px}
.dtowns .chips.sub{margin-top:10px;padding-left:12px;border-left:2px solid var(--line)}
.dealpage .shopsec{padding-top:24px}

.dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:16px}
.dcard{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surface)}
.dphoto{display:block;aspect-ratio:1/1;background:var(--grey);border-bottom:1px solid var(--line)}
.dphoto img{width:100%;height:100%;object-fit:contain}
.dbody{flex:1;display:flex;flex-direction:column;gap:8px;min-width:0;padding:14px 16px}
.dmeta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.dends{font-size:12.5px;font-weight:700;color:var(--verify)}
.dends.last{color:var(--danger)}
.dbody h3{font-family:var(--body);font-size:17px;font-weight:800;line-height:1.3;letter-spacing:-.01em;overflow-wrap:anywhere}
/* Sellers type line breaks into the details, so they are kept. */
.dbody p{font-size:14.5px;line-height:1.5;white-space:pre-line;overflow-wrap:anywhere}
.dbiz{font-size:13.5px;color:var(--muted);text-decoration:none;overflow-wrap:anywhere}
.dbiz b{color:var(--fg);font-weight:700}
.dbiz:hover b{text-decoration:underline}
.dact{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:4px}
.dact:empty{display:none}
.dact .btn{min-height:44px}

/* Business page: under the updates, above the tabs. */
.wrap > .deals{margin-top:28px}
.deals h2{font-size:22px;margin:0 0 14px}

/* Home strip: four across on wide screens, a swipe row below that. Only the strip scrolls, never the page. */
.dstrip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.dstrip .dbody p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:1000px){
  .dstrip{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:42%;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 2px 4px}
  .dstrip::-webkit-scrollbar{display:none}
  .dstrip .dcard{scroll-snap-align:start}
}
@media (max-width:700px){
  .deals h2{font-size:20px}
  .dstrip{grid-auto-columns:78%;gap:12px}
}