/* چیدمان‌های جایگزین صفحه اول: اپ‌محور، بنتو، پرتال، پرتال کامل (فقط وقتی مدیر انتخاب کند بارگذاری می‌شود).
   رنگ‌ها از توکن‌های سایت می‌آیند؛ پس با هر پالت و سبک و حالت تیره هماهنگ‌اند. */
.hm { padding-bottom: 8px; }
.hm-title { font-family: var(--font-display); font-weight: 400; font-size: clamp(2rem, 1.3rem + 3vw, 3.2rem); line-height: 1.3; color: var(--stub-ink); margin: 0 0 12px; }
.hm-sub { margin: 0 0 16px; color: var(--muted); }
.hm-badge { display: inline-block; width: max-content; padding: 1px 12px; border-radius: var(--radius-pill); background: var(--hot-soft); color: var(--hot); font-weight: 800; font-size: .8rem; border: 1px solid var(--hot-line); }
.hm-stat { text-align: center; }
.hm-stat b { display: block; font: 400 2rem/1.1 var(--font-display); color: var(--stub-ink); font-variant-numeric: tabular-nums; }
.hm-stat span { color: var(--muted); font-size: .85rem; font-weight: 600; }

/* نوار جست‌وجوی بزرگ */
.hm-search { display: flex; align-items: center; gap: 10px; padding: 8px 8px 8px 12px; padding-inline-start: 18px; background: var(--surface); border: 1.5px solid var(--line); border-radius: 20px; box-shadow: var(--shadow-2); }
.hm-search > .ic { color: var(--muted); width: 22px; height: 22px; }
.hm-search input { flex: 1; min-width: 0; min-height: 48px; border: 0 !important; background: transparent !important; box-shadow: none !important; font-size: 1.05rem; }
.hm-filter { display: inline-flex; gap: 6px; align-items: center; padding: 8px 14px; border-radius: 12px; background: var(--primary-soft); color: var(--primary); font-weight: 800; text-decoration: none; white-space: nowrap; }
.hm-filter .ic { width: 18px; height: 18px; }
.hm-search .btn { min-height: 48px; border-radius: 14px; padding-inline: 28px; }
@media (max-width: 560px) { .hm-filter { display: none; } .hm-search .btn { padding-inline: 18px; } .hm-strip { grid-template-columns: 1fr 1fr; } }

/* دایره‌های دسته */
.hm-circles { list-style: none; display: flex; gap: 22px; margin: 22px 0 6px; padding: 0 0 6px; overflow-x: auto; scrollbar-width: none; }
.hm-circles::-webkit-scrollbar { display: none; }
.hm-circles a { display: grid; justify-items: center; gap: 6px; min-width: 76px; color: var(--ink-2); text-decoration: none; font-weight: 700; font-size: .88rem; }
.hm-circles i { width: 66px; height: 66px; border-radius: 50%; display: grid; place-items: center; background: var(--surface); border: 3px solid var(--turq); color: var(--primary); transition: transform 200ms var(--ease-smooth); }
.hm-circles i .ic { width: 28px; height: 28px; }
.hm-circles small { margin-top: -4px; color: var(--muted); font-weight: 600; }
.hm-circles a[aria-current="page"] i { background: var(--primary); border-color: var(--primary); color: var(--primary-ink); }
@media (hover: hover) { .hm-circles a:hover i { transform: translateY(-3px); } }

/* کارت آگهی فوری (لاجوردی) */
.hm-hotrow { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 14px; }
.hm-hot { display: grid; gap: 8px; align-content: space-between; padding: 20px; min-height: 140px; border-radius: var(--radius-panel); color: #fff; text-decoration: none; background: radial-gradient(circle at 90% 0, color-mix(in srgb, var(--turq) 40%, transparent), transparent 45%), linear-gradient(135deg, var(--shell), color-mix(in srgb, var(--shell) 70%, #000)); box-shadow: var(--shadow-2); transition: transform 220ms var(--ease-smooth); }
.hm-hot b { font-size: 1.1rem; line-height: 1.55; }
.hm-hot small { opacity: .8; }
.hm-hot em { font-style: normal; font-weight: 800; color: color-mix(in srgb, var(--turq) 60%, #fff); }
@media (hover: hover) { .hm-hot:hover { transform: translateY(-3px); } }

/* ---------- اپ‌محور ---------- */
.hm-app .hm-hero { padding: 26px 0 0; }
.hm-app .hm-hotrow { margin-bottom: 4px; }
.hm-app .hm-hero .wrap { max-width: 1000px; }

/* ---------- بنتو ---------- */
.hm-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 14px; padding-top: 14px; }
.hm-tile { position: relative; overflow: hidden; border-radius: 24px; padding: 20px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-1); color: inherit; text-decoration: none; min-width: 0; }
.t-search { grid-column: span 7; grid-row: span 2; display: grid; align-content: center; color: #fff; background: radial-gradient(circle at 12% 0, color-mix(in srgb, var(--turq) 45%, transparent), transparent 42%), radial-gradient(circle at 100% 100%, rgb(80 110 230 / 50%), transparent 45%), linear-gradient(135deg, var(--shell), color-mix(in srgb, var(--shell) 65%, #000)); border: 0; }
.t-search .hm-title { color: #fff; font-size: clamp(1.8rem, 1.2rem + 2vw, 2.6rem); }
.t-search .hm-sub { color: rgb(255 255 255 / 78%); }
.t-stats { grid-column: span 5; display: grid; align-items: center; }
.hm-stats3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.t-pay { grid-column: span 5; display: grid; gap: 10px; align-content: space-between; background: var(--turq-soft); border-color: color-mix(in srgb, var(--turq) 30%, transparent); }
.t-pay small { color: var(--turq-ink); font-weight: 800; }
.t-pay b { font: 400 2.2rem/1 var(--font-display); color: var(--turq-ink); }
.hm-bars { display: flex; gap: 6px; align-items: flex-end; height: 56px; }
.hm-bars i { flex: 1; background: var(--turq); opacity: .85; border-radius: 6px 6px 2px 2px; height: 50%; }
.hm-bars i.h40 { height: 40%; } .hm-bars i.h55 { height: 55%; } .hm-bars i.h48 { height: 48%; } .hm-bars i.h70 { height: 70%; } .hm-bars i.h62 { height: 62%; } .hm-bars i.h85 { height: 85%; } .hm-bars i.h100 { height: 100%; }
.t-role { grid-column: span 3; display: grid; gap: 6px; align-content: space-between; }
.t-role b { font-size: 1.05rem; } .t-role small { color: var(--muted); }
.t-hot { grid-column: span 4; display: grid; gap: 8px; align-content: space-between; background: var(--hot-soft); border-color: var(--hot-line); }
.t-hot b { font-size: 1.1rem; line-height: 1.55; } .t-hot small { color: var(--hot); }
.t-list { grid-column: span 8; grid-row: span 2; padding: 16px; }
.t-list .job-grid { grid-template-columns: 1fr 1fr; }
.hm-h { margin: 0 0 12px; font-size: 1.1rem; font-weight: 800; }
.t-cta { grid-column: span 4; padding: 0; border: 0; background: none; box-shadow: none; }
.hm-aud { height: 100%; display: grid; gap: 10px; align-content: center; padding: 24px; border-radius: 24px; color: #fff; background: radial-gradient(circle at 90% 0, color-mix(in srgb, var(--turq) 40%, transparent), transparent 45%), linear-gradient(135deg, var(--shell), color-mix(in srgb, var(--shell) 70%, #000)); }
.hm-aud h2 { margin: 0; color: #fff; font-size: 1.4rem; } .hm-aud p { margin: 0; color: rgb(255 255 255 / 82%); }
.hm-aud .btn { justify-self: start; background: #fff; color: var(--shell); }
@media (max-width: 899px) { .hm-grid > * { grid-column: 1 / -1 !important; grid-row: auto !important; } .t-role { grid-column: span 6 !important; } .t-list .job-grid { grid-template-columns: 1fr; } .t-stats, .t-pay { grid-column: 1 / -1 !important; } }

/* ---------- پرتال ---------- */
.hm-tick { display: flex; gap: 22px; padding: 7px 18px; overflow: hidden; white-space: nowrap; font-weight: 700; font-size: .9rem; background: var(--hot-soft); color: var(--hot); border-bottom: 1px solid var(--hot-line); }
.hm-tick b { background: var(--hot); color: #fff; border-radius: 4px; padding: 0 8px; }
.hm-tick.t2 { background: var(--turq-soft); color: var(--turq-ink); border-color: transparent; }
.hm-tick.t2 b { background: var(--turq-ink); }
.hm-hero-p { padding-top: 16px; display: grid; gap: 14px; }
.hm-banners { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 12px; }
.is-full .hm-banners { grid-template-columns: 2fr 1fr 1fr 1fr; }
.hm-banner { display: grid; gap: 2px; align-content: center; padding: 16px 18px; min-height: 96px; border-radius: 18px; color: #fff; text-decoration: none; background: linear-gradient(135deg, var(--shell), var(--primary)); }
.hm-banner b { font: 400 1.3rem/1.4 var(--font-display); } .hm-banner small { opacity: .85; }
.hm-banner.b2 { background: linear-gradient(135deg, var(--turq-ink), var(--turq)); } .hm-banner.b3 { background: linear-gradient(135deg, color-mix(in srgb, var(--c3, #f2a65a) 70%, #000), var(--c3, #f2a65a)); } .hm-banner.b4 { background: linear-gradient(135deg, color-mix(in srgb, var(--c4, #c14fb0) 70%, #000), var(--c4, #c14fb0)); }
.hm-ps { background: var(--surface); border: 1px solid var(--line); border-radius: 22px; padding: 18px 20px; box-shadow: var(--shadow-1); }
.hm-ps .hm-title { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.3rem); }
.hm-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 10px; }
.hm-strip .hm-stat { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 10px 14px; }
.hm-cols { display: grid; gap: 14px; padding-top: 14px; align-items: start; }
.hm-cols.c3 { grid-template-columns: 210px minmax(0, 1fr) 260px; } .hm-cols.c4 { grid-template-columns: 200px minmax(0, 1fr) 250px 230px; }
.hm-box { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; margin-bottom: 12px; overflow: hidden; }
.hm-box > h2 { margin: 0; padding: 10px 14px; font-size: .95rem; font-weight: 800; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--sunken) 60%, transparent); }
.hm-f { display: flex; justify-content: space-between; gap: 8px; padding: 7px 14px; color: var(--ink-2); text-decoration: none; border-bottom: 1px dotted var(--line); }
.hm-f small { background: var(--sunken); border-radius: 99px; padding: 0 8px; color: var(--muted); }
@media (hover: hover) { .hm-f:hover { background: var(--primary-soft); color: var(--primary); } }
.hm-roles { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; padding: 12px; }
.hm-roles a { display: grid; justify-items: center; gap: 4px; padding: 10px 4px; border-radius: 12px; background: var(--sunken); color: var(--ink); text-decoration: none; font-weight: 700; font-size: .88rem; text-align: center; }
.hm-roles i { width: 38px; height: 38px; border-radius: 12px; background: var(--primary-soft); color: var(--primary); display: grid; place-items: center; }
.hm-roles small { color: var(--muted); font-weight: 600; }
.hm-main .job-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); }
.hm-tbl { width: 100%; border-collapse: collapse; } .hm-tbl td { padding: 6px 14px; border-bottom: 1px dotted var(--line); } .hm-tbl td:last-child { text-align: end; font-weight: 800; color: var(--turq-ink); } .hm-tbl a { color: inherit; text-decoration: none; }
.hm-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 14px; }
.hm-chips a { padding: 3px 11px; border-radius: var(--radius-pill); background: var(--sunken); color: var(--ink-2); text-decoration: none; font-size: .88rem; } .hm-chips a.is-hot { background: var(--primary); color: var(--primary-ink); } .hm-chips small { opacity: .7; }
.hm-list { margin: 0; padding: 10px 14px 12px 14px; padding-inline-start: 30px; display: grid; gap: 6px; color: var(--ink-2); font-size: .92rem; } .hm-list a { color: inherit; }
.hm-cta { border-radius: 16px; background: var(--shell); color: #fff; text-align: center; padding: 18px; display: grid; gap: 6px; margin-bottom: 12px; } .hm-cta b { font: 400 1.3rem var(--font-display); } .hm-cta p { margin: 0; opacity: .85; } .hm-cta .btn { justify-self: center; background: var(--turq); color: var(--on-turq); }
.is-full .hm-roles { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
@media (max-width: 1100px) { .hm-cols.c3, .hm-cols.c4 { grid-template-columns: minmax(0, 1fr) 260px; } .hm-cols .hm-side:first-child { display: none; } .hm-cols.c4 .hm-side:last-child { display: none; } }
@media (max-width: 760px) { .hm-cols.c3, .hm-cols.c4 { grid-template-columns: 1fr; } .hm-banners { grid-template-columns: 1fr 1fr; } .hm-banner:first-child { grid-column: 1 / -1; } .hm-side { order: 3; } }

/* طرح ۷: پاپ — دقیقاً مطابق نمونه؛ رنگ و ضخامت‌ها از theme.css (سبک پاپ و تنظیمات پنل) می‌آید */
.hm-pop { --pp-r: 1; }
.pp-hero { display: grid; grid-template-columns: 1.25fr 1fr; gap: 30px; padding-block: 38px 20px; align-items: center; }
.hm-pop .hm-title, .hm-doodle .hm-title { font-size: clamp(2.3rem, 1.2rem + 3.6vw, 3.9rem); line-height: 1.35; margin: 0 0 14px; }
.pp-sub { font-size: 18px; font-weight: 600; margin: 0 0 20px; line-height: 1.9; color: var(--pop-ink, var(--ink)); }
.pp-sb { display: flex; background: #fff; border: var(--pop-b, 3px solid #101a33); border-radius: 18px; box-shadow: var(--shadow-2); overflow: hidden; }
.pp-sb label { display: flex; gap: 10px; align-items: center; padding: 0 18px; color: #5f6b85; font-weight: 700; }
.pp-q { flex: 1; min-width: 0; }
.pp-prov { flex: none; border-inline-start: var(--pop-b, 3px solid #101a33); }
.pp-sb input, .pp-sb select { border: 0 !important; background: transparent !important; box-shadow: none !important; min-height: 56px; font: 700 1rem var(--font-body); color: var(--pop-ink, var(--ink)); min-width: 0; }
.pp-q input { flex: 1; }
.pp-sb .btn { border: 0; border-radius: 0; border-inline-start: var(--pop-b, 3px solid #101a33); box-shadow: none; background: var(--c4); color: #fff; padding: 18px 30px; font-size: 17px; }
.pp-art { position: relative; height: 300px; }
.pp-st { position: absolute; border: var(--pop-b, 3px solid #101a33); border-radius: 20px; box-shadow: var(--shadow-2); padding: 14px 18px; font-weight: 900; color: var(--pop-ink, var(--ink)); }
.pp-st small { display: block; font-weight: 600; opacity: .8; margin-top: 2px; }
.pp-st .big { font: 400 40px/1.1 var(--font-display); display: block; font-variant-numeric: tabular-nums; }
.pp-st.s1 { background: #fff; top: 10px; inset-inline-start: 10px; width: 230px; transform: rotate(calc(-4deg * var(--tilt, 1))); }
.pp-st.s2 { background: var(--c3); top: 120px; inset-inline-end: 10px; width: 200px; transform: rotate(calc(3deg * var(--tilt, 1))); }
.pp-st.s3 { background: var(--turq); color: #fff; bottom: 0; inset-inline-start: 60px; width: 210px; transform: rotate(calc(-2deg * var(--tilt, 1))); }
.pp-cats { list-style: none; display: flex; gap: 12px; flex-wrap: wrap; margin: 0; padding: 10px 4px 10px; }
.pp-cats a { display: flex; gap: 8px; align-items: center; background: #fff; border: var(--pop-b, 3px solid #101a33); border-radius: 99px; padding: 8px 18px; font-weight: 900; box-shadow: 3px 3px 0 var(--pop-ink, #101a33); color: var(--pop-ink, var(--ink)); text-decoration: none; white-space: nowrap; }
.pp-cats .ic { width: 20px; height: 20px; }
.pp-cats a[aria-current="page"] { background: var(--pop-ink, #101a33); color: #fff; }
.pp-cats small { background: var(--c3); color: var(--pop-ink, #101a33); border-radius: 99px; padding: 0 9px; font-weight: 800; }
.pp-h2 { display: flex; justify-content: space-between; align-items: center; padding: 18px 0 10px; }
.pp-h2 h2 { margin: 0; font: 400 30px/1.4 var(--font-display); color: var(--pop-ink, var(--ink)); }
.pp-h2 a { font: 900 15px var(--font-body); text-decoration: underline; color: var(--pop-ink, var(--ink)); }
.pp-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 14px 4px 36px; }
.pj { position: relative; }
.pj-link { display: grid; gap: 10px; align-content: start; height: 100%; background: #fff; border: var(--pop-b, 3px solid #101a33); border-radius: 20px; padding: 16px; box-shadow: var(--shadow-1); color: var(--pop-ink, var(--ink)); text-decoration: none; }
.pj:nth-child(3n+2) .pj-link { background: var(--pop-card1, #fff7d6); }
.pj:nth-child(3n) .pj-link { background: var(--pop-card3, #e6f4ff); }
.pj-h { display: flex; gap: 12px; align-items: center; }
.pj-i { width: 50px; height: 50px; border-radius: 14px; border: 2.5px solid var(--pop-ink, #101a33); background: var(--turq); color: #fff; display: grid; place-items: center; flex: none; }
.pj-i.is-medical { background: var(--c4, #ff6f59); } .pj-i.is-admin { background: var(--pop-blue, #6a7bff); } .pj-i.is-market { background: var(--c3, #ffcf3f); color: var(--pop-ink, #101a33); }
.pj-i .ic { width: 28px; height: 28px; }
.pj h3 { margin: 0; font-size: 16px; line-height: 1.5; }
.pj-o { font-size: 13px; font-weight: 600; color: #39456a; }
.pj-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: flex-start; }
.pj-pill { border: 2px solid var(--pop-ink, #101a33); border-radius: 99px; padding: 2px 12px; font-size: 13px; font-weight: 800; background: #fff; }
.pj-pill.pay { background: #9df0c9; }
.pj-hot { position: absolute; top: -14px; inset-inline-end: 16px; z-index: 1; background: var(--c4); color: #fff; border: 2.5px solid var(--pop-ink, #101a33); border-radius: 99px; padding: 1px 14px; font-weight: 900; font-size: 13px; transform: rotate(calc(3deg * var(--tilt, 1))); }
@media (max-width: 1000px) { .pp-grid { grid-template-columns: repeat(2, 1fr); } .pp-hero { grid-template-columns: 1fr; } .pp-art { height: 190px; } .pp-st { padding: 10px 14px; } .pp-st .big { font-size: 30px; } .pp-st.s1 { width: 190px; } .pp-st.s2 { width: 180px; top: 70px; } .pp-st.s3 { width: 190px; inset-inline-start: 150px; } }
@media (max-width: 640px) {
  .pp-hero { padding-block: 18px 6px; } .pp-art, .pp-sub, .pp-sb .pp-prov { display: none; }
  .hm-pop .hm-title, .hm-doodle .hm-title { font-size: 2rem; } .pp-sb { border-radius: 16px; box-shadow: 5px 5px 0 var(--pop-ink, #101a33); }
  .pp-sb label { padding: 0 14px; font-size: 14px; } .pp-sb input { min-height: 50px; } .pp-sb .btn { padding: 15px 20px; }
  .pp-cats { flex-wrap: nowrap; overflow-x: auto; padding: 8px 4px 14px; scrollbar-width: none; } .pp-cats::-webkit-scrollbar { display: none; }
  .pp-cats a { padding: 6px 14px; font-size: 13px; } .pp-cats small { display: none; }
  .pp-grid { grid-template-columns: 1fr; gap: 20px; }
}

/* طرح ۱۲: مدرسه‌ای و نقاشی‌وار — روی همان ساختار پاپ؛ کاغذ و رنگ‌ها از theme.css (سبک دفترچه‌ای) می‌آید */
.hm-doodle { position: relative; --pop-b: 2.5px solid var(--primary); }
.dd-art { position: absolute; color: var(--primary); opacity: .75; pointer-events: none; z-index: 0; }
.dd-pencil { top: 96px; inset-inline-start: 40%; transform: rotate(-14deg); color: var(--c4); }
.dd-star { top: 44px; inset-inline-start: 36%; transform: rotate(12deg); color: var(--c3); fill: var(--c3); }
.dd-arrow { top: 280px; inset-inline-start: 48%; transform: rotate(-8deg); }
.hm-doodle .pp-hero, .hm-doodle .pp-cats, .hm-doodle .feed { position: relative; z-index: 1; }
.hm-doodle .hm-title { font-weight: 400; text-decoration: underline wavy color-mix(in srgb, var(--c4) 70%, transparent) 2px; text-underline-offset: 10px; }
.hm-doodle .hm-title mark { text-decoration: none; }
.hm-doodle .pp-sub { color: var(--primary); }
.hm-doodle .pp-sb { background: #fffdf5; border: 2.5px dashed var(--primary); border-radius: var(--dd-wob); box-shadow: var(--shadow-2); }
.hm-doodle .pp-prov { border-inline-start: 2.5px dashed var(--primary); }
.hm-doodle .pp-sb .btn { border-inline-start: 2.5px solid var(--primary); border-radius: 0; background: var(--c4); }
.hm-doodle .pp-st { border: 2.5px solid var(--primary); border-radius: var(--dd-wob2); box-shadow: var(--shadow-2); background: #fffdf5; color: var(--primary); }
.hm-doodle .pp-st::before { content: ""; position: absolute; top: -12px; inset-inline-start: 50%; width: 64px; height: 20px; margin-inline-start: -32px; background: color-mix(in srgb, var(--c3) 65%, transparent); transform: rotate(-3deg); border-radius: 2px; }
.hm-doodle .pp-st.s2 { background: var(--c3); } .hm-doodle .pp-st.s3 { background: var(--turq); color: #fff; }
.hm-doodle .pp-cats a { border: 2.5px dashed var(--primary); border-radius: var(--dd-wob); box-shadow: none; background: #fffdf5; color: var(--primary); }
.hm-doodle .pp-cats a[aria-current="page"] { border-style: solid; background: var(--primary); color: #fff; }
.hm-doodle .pp-h2 h2 { color: var(--primary); text-decoration: underline wavy color-mix(in srgb, var(--turq) 70%, transparent) 2px; text-underline-offset: 8px; }
.hm-doodle .pp-h2 a { color: var(--primary); }
.hm-doodle .pj { transform: rotate(calc(-.7deg * var(--tilt))); } .hm-doodle .pj:nth-child(even) { transform: rotate(calc(.6deg * var(--tilt))); }
.hm-doodle .pj-link { border: 2.5px solid var(--primary); border-radius: var(--dd-wob); box-shadow: var(--shadow-1); background: #fffdf5; color: var(--primary); padding-top: 22px; }
.hm-doodle .pj:nth-child(3n+2) .pj-link { background: var(--c3-soft); } .hm-doodle .pj:nth-child(3n) .pj-link { background: color-mix(in srgb, var(--turq) 13%, #fff); }
.hm-doodle .pj::before { content: ""; position: absolute; z-index: 2; top: -9px; inset-inline-start: 50%; width: 58px; height: 18px; margin-inline-start: -29px; background: color-mix(in srgb, var(--c3) 60%, transparent); transform: rotate(2deg); border-radius: 2px; }
.hm-doodle .pj-i { border: 2.5px solid var(--primary); border-radius: var(--dd-wob2); }
.hm-doodle .pj-o { color: color-mix(in srgb, var(--primary) 70%, #fff); }
.hm-doodle .pj-pill { border: 2px dashed var(--primary); background: #fffdf5; }
.hm-doodle .pj-pill.pay { border-style: solid; background: color-mix(in srgb, var(--turq) 24%, #fff); }
.hm-doodle .pj-hot { border: 2.5px solid var(--primary); border-radius: var(--dd-wob); background: var(--c4); }
@media (max-width: 1000px) { .dd-art { display: none; } }

/* طرح ۱۳: آگهی‌محور (دیوارگونه) */

/* طرح ۱۴: بازار مدرن (رُندگونه) */
