/* Sample 2 · THE iDELIVER-O-MATIC · skin for every page
   Chunky, playful, sticker-style: thick black outlines and hard shadows. */
:root {
  --ff: "Space Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --ff-head: "Archivo Black", "Space Grotesk", system-ui, sans-serif;
  --bg: #f6efdf;
  --tile: #fff7e0;
  --line: #111;
  --radius: 18px;
  --shadow: 5px 5px 0 #111;
  --k-bg: #fffaf0; --k-tile: #fff3c4; --k-line: #111; --k-fh: "Archivo Black", system-ui, sans-serif;
}
h1, h2 { font-weight: 400; letter-spacing: -.01em; }
.lux { font-family: var(--ff-lux); }
.hdr { border-bottom: 4px solid #fdc41b; }
.btn { border: 3px solid #111; box-shadow: 4px 4px 0 #111; transition: transform .12s, box-shadow .12s; }
.btn:active { transform: translate(4px, 4px); box-shadow: 0 0 0 #111; }
.btn-y { box-shadow: 4px 4px 0 #111; }
.pcard-media { border: 3px solid #111; box-shadow: 6px 6px 0 #111; transition: transform .2s, box-shadow .2s; border-radius: var(--radius); }
.pcard:hover .pcard-media { transform: translate(-3px, -3px); box-shadow: 9px 9px 0 #111; }
.pcard-img { background: #fff7e0 radial-gradient(#e9dfc8 1.2px, transparent 1.3px) 0 0 / 14px 14px; border-radius: calc(var(--radius) - 3px); }
.pcard-body h3 { font-weight: 700; }
.badge { border: 2px solid #111; }
.chip { border: 2.5px solid #111 !important; font-weight: 700; }
.chip.on { background: #fdc41b !important; color: #111 !important; box-shadow: 3px 3px 0 #111; }
.phead { background: #fdc41b; border-bottom: 4px solid #111; }
.phead h1 { text-transform: uppercase; }
.phead .lux { background: #fff; padding: 0 .15em; border: 3px solid #111; }
.review, .panel { border: 3px solid #111 !important; box-shadow: 5px 5px 0 #111; }
.ftr { border-top: 6px solid #fdc41b; }
.ktrust > div { border: 3px solid #111; box-shadow: 4px 4px 0 #111; background: #fff; }
.sec-head h2 { text-transform: uppercase; }

/* beat the v3 'clean pages' rules */
body[data-page] { background: #f6efdf; }
body[data-page] .pcard-img, body[data-page] .pp-gallery { background: #fff7e0 radial-gradient(#e9dfc8 1.2px, transparent 1.3px) 0 0 / 14px 14px; }
body[data-page] .pp-gallery { border: 3px solid #111; box-shadow: 6px 6px 0 #111; }
body[data-page] .phead { background: #fdc41b; border-bottom: 4px solid #111; }
body[data-page] .phead h1 .lux { background: #fff; padding: 0 .15em; border: 3px solid #111; }
body[data-page] .phead p, body[data-page] .crumbs, body[data-page] .crumbs a { color: #111; }

/* keep the iDeliver wordmark the same on every sample */
.brand-name { font-family: "Bricolage Grotesque", system-ui, sans-serif !important; text-transform: none !important; letter-spacing: -.035em !important; font-weight: 800 !important; }
.brand-sub { text-transform: uppercase; }