/* Smoke Wagon: the NYPD Academy graduates board on the homepage (includes/sw-home-nypd.php, 2026-11-09) and the store
   look for custom pages such as /nypd. The board copies the Daily Deal Corral: the same weathered wood with scenery at
   both ends, here the New York skyline (Gemini art in assets/images/nypd/, nothing written on it). Type is the site's
   own: Roboto Condensed (headings, nav, buttons) and Roboto for text.
   Wide screens: skyline strip | wood board | skyline strip. Narrow screens: a skyline band above the board. */

html body .sw-nypd { background: #1d140d; padding: 0; border-bottom: 0; }
html body .sw-nypd-board { display: grid; grid-template-columns: minmax(0, 17.6fr) minmax(0, 64.8fr) minmax(0, 17.6fr); }
html body .sw-nypd-sky { background-repeat: no-repeat; background-size: cover; }
html body .sw-nypd-sky--l { background-image: url('/assets/images/nypd/nypd-left.webp'); background-position: right bottom; }
html body .sw-nypd-sky--r { background-image: url('/assets/images/nypd/nypd-right.webp'); background-position: left bottom; }
html body .sw-nypd-wood {
  min-width: 0; padding: 30px clamp(18px, 3vw, 44px) 24px;
  background: #c9a77a url('/assets/images/nypd/nypd-wood.webp') center / 100% 100% no-repeat;
}
html body .sw-nypd-head { text-align: center; margin: 0 auto 18px; }
html body .sw-nypd-kicker { margin: 0 0 4px; font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif; font-weight: 700;
  font-size: 15px; letter-spacing: 3px; text-transform: uppercase; color: #2a1d14; }
html body .sw-nypd-kicker span { color: #9e1b24; }
/* Color and family come from the site's own heading rule (h1-h6: #222 !important, Roboto Condensed), as on every
   other section heading; only size and spacing are set here. */
html body .sw-nypd-title { margin: 0 0 6px; font-weight: 800; font-size: clamp(30px, 3.3vw, 50px); line-height: 1.05;
  letter-spacing: 1px; text-transform: uppercase; text-shadow: 0 1px 0 rgba(255, 244, 222, .55); text-wrap: balance; }
html body .sw-nypd-lead { margin: 0; font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif; font-weight: 700;
  font-size: 19px; color: #2a1d14; }

html body .sw-nypd-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; max-width: 880px; margin: 0 auto; }
html body .sw-nypd-cards--one { grid-template-columns: minmax(0, 430px); justify-content: center; }
html body .sw-nypd-card { min-width: 0; display: flex; flex-direction: column; align-items: center; text-align: center;
  background: #fff; border-radius: 8px; padding: 14px 18px 18px; box-shadow: 0 2px 12px rgba(42, 29, 20, .38); }
html body .sw-nypd-shot { display: flex; align-items: center; justify-content: center; width: 100%; height: 170px; }
html body .sw-nypd-shot img, html body .sw-nypd-img { max-width: 100%; max-height: 170px; width: auto; height: auto;
  object-fit: contain; display: block; margin: 0 auto; }
html body .sw-nypd-name { margin: 10px 0 8px; font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif; font-weight: 700;
  font-size: 23px; line-height: 1.15; letter-spacing: 1.2px; text-transform: uppercase; }
html body .sw-nypd-name a { color: var(--sw-ink, #1d1d1b); text-decoration: none; }
html body .sw-nypd-name a:hover { color: #9e1b24; }
html body .sw-nypd-chips { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
html body .sw-nypd-chips li { margin: 0; padding: 3px 10px; border: 1px solid #d9ccb2; border-radius: 999px; background: #fbf7ef;
  font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif; font-size: 13px; letter-spacing: .6px; text-transform: uppercase;
  color: var(--sw-ink, #1d1d1b); }
html body .sw-nypd-shelf { margin: 0 0 10px; font-size: 14px; font-weight: 700; color: #1e6a38; }
html body .sw-nypd-buy { margin-top: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 14px; }
html body .sw-nypd-price { font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif; font-weight: 700; font-size: 27px;
  color: var(--sw-ink, #1d1d1b); }
html body a.sw-nypd-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 20px;
  background: #a4222a; border: 2px solid #7a1219; border-radius: 6px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25);
  color: #fff !important; text-decoration: none; font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif; font-weight: 700;
  font-size: 15px; letter-spacing: 1.4px; }
html body a.sw-nypd-btn:hover, html body a.sw-nypd-btn:focus-visible { background: #7a1219; }
html body a.sw-nypd-all { margin-top: 10px; font-size: 14px; color: #8a1a22; text-decoration: underline; text-underline-offset: 3px; }

html body .sw-nypd-foot { max-width: 760px; margin: 18px auto 0; text-align: center; padding: 14px 18px;
  background: rgba(251, 247, 239, .9); border-radius: 8px; box-shadow: 0 1px 6px rgba(42, 29, 20, .25); }
html body .sw-nypd-note { margin: 0 0 12px; font-size: 15px; line-height: 1.5; color: #2a1d14; }
html body a.sw-nypd-more { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 22px;
  background: #2a1d14; border-radius: 6px; color: #f6ecd8 !important; text-decoration: none;
  font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif; font-weight: 700; font-size: 15px; letter-spacing: 1.6px; }
html body a.sw-nypd-more:hover, html body a.sw-nypd-more:focus-visible { background: #4a3322; }
html body .sw-nypd-fine { margin: 12px 0 0; font-size: 12.5px; line-height: 1.45; color: #3b2a1a; }
html body .sw-nypd a:focus-visible { outline: 3px solid #1d140d; outline-offset: 3px; }

@media (max-width: 1099px) {
  html body .sw-nypd-board { grid-template-columns: minmax(0, 1fr); }
  html body .sw-nypd-sky--r { display: none; }
  html body .sw-nypd-sky--l { height: clamp(110px, 24vw, 230px); background-position: center 72%;
    background-image: url('/assets/images/nypd/nypd-band-900.webp');
    background-image: image-set(url('/assets/images/nypd/nypd-band-900.webp') 1x, url('/assets/images/nypd/nypd-band-1600.webp') 2x); }
  html body .sw-nypd-wood { background-size: cover; background-image: url('/assets/images/nypd/nypd-wood-900.webp'); }   /* 74 KB, not 325 */
}
@media (max-width: 1099px) and (min-width: 700px) {
  html body .sw-nypd-sky--l { background-image: url('/assets/images/nypd/nypd-band-1600.webp'); }
}
@media (max-width: 640px) {
  html body .sw-nypd-wood { padding: 22px 16px 20px; }
  html body .sw-nypd-cards { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  html body .sw-nypd-kicker { font-size: 13px; letter-spacing: 2px; }
  html body .sw-nypd-lead { font-size: 17px; }
  html body .sw-nypd-buy { flex-direction: column; align-items: stretch; width: 100%; }
  html body a.sw-nypd-btn, html body a.sw-nypd-more { width: 100%; }
}

/* Custom pages (Admin > Custom Pages, e.g. /nypd) in the store's own look instead of the platform default
   (#dc2626, Roboto Condensed). The platform style block sits in the page body, so these selectors carry
   html body to win on specificity, not on order. */
html body .custom-page { background: #fff; color: #2f2418; }
html body .custom-page > h1 { font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif; font-weight: 700; text-transform: uppercase;
  letter-spacing: 2px; color: var(--sw-ink, #1d1d1b); border-bottom-color: var(--sw-red, #c8102e); }
html body .custom-page-body h2, html body .custom-page-body .cp-card > h3 { font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif;
  font-weight: 700; letter-spacing: 1px; color: var(--sw-ink, #1d1d1b); }
html body .custom-page-body a { color: #a00d25; }
html body .custom-page-body a.cp-btn { background: #a4222a; color: #fff !important; font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif;
  font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; border-radius: 6px; }
html body .custom-page-body a.cp-btn:hover, html body .custom-page-body a.cp-btn:focus { background: #7a1219; }
html body .custom-page-body .cp-card { border-color: #e2d8c4; border-top-color: var(--sw-red, #c8102e); background: #fbf7ef; }
html body .custom-page-body .cp-card > img { background: #fff; object-fit: contain; aspect-ratio: 4 / 3; padding: 12px; }
html body .custom-page-body .cp-note, html body .custom-page-body .cp-quote { border-left-color: var(--sw-red, #c8102e); background: #f8f6f2; }
html body .custom-page-body .cp-steps > li::before { background: var(--sw-red, #c8102e); font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif; }
html body .custom-page-body .cp-price { color: var(--sw-ink, #1d1d1b); font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif; }
html body .custom-page-body .cp-fine { font-size: 13px; color: #6b6358; margin-top: 28px; }
html body .custom-page-body .cp-card > dl { margin-left: 18px; margin-right: 18px; }
html body .custom-page-body .cp-card > h3:first-child { margin-top: 18px; }
html body .custom-page-body .cp-grid.sw-cp-top { align-items: start; }
html body .custom-page-body .sw-cp-banner { display: block; width: 100%; height: auto; aspect-ratio: 1600 / 679; object-fit: cover;
  border-radius: 6px; margin: 0 0 18px; }
html body .custom-page-body .sw-cp-visit { margin-top: 20px; }
html body .custom-page-body .cp-card > a.sw-cp-all { display: inline-block; margin: 0 18px 16px; font-size: 14px; }
