/* Article page: Estedad font (OFL, /fonts/estedad-OFL.txt) and justified Persian text. */
@font-face {
    font-family: 'Estedad';
    src: url('/fonts/estedad-var.woff2') format('woff2-variations'), url('/fonts/estedad-var.woff2') format('woff2');
    font-weight: 100 900;
    font-display: swap;
}
.article-font, .article-font h1, .article-font h2, .article-font h3 { font-family: 'Estedad', 'Vazirmatn', sans-serif; }
.article-font h1 { font-weight: 800; letter-spacing: -0.01em; }
.article-font h2, .article-font h3 { font-weight: 700; }
:is(.article-body, .re-ed) :is(p, li):not(.text-center, .text-left, .text-right) { text-align: justify; text-justify: inter-word; }

/* «مقاله‌های دیگر»: cards with picture, date and title; lift on hover, no underline. */
.more-grid { display: grid; gap: 1rem; }
@media (min-width: 768px) { .more-grid.is-wide { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.latin-num { font-family: 'Vazirmatn', sans-serif; } /* Estedad draws every digit in Persian: B2B must keep its 2 */
.more-card { display: flex; align-items: center; gap: .9rem; padding: .9rem 1rem; border: 1px solid #dbe7e3; border-radius: 1.25rem; background: #fff; color: #1c1917; text-decoration: none; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.more-card:hover, .more-card:focus-visible { text-decoration: none; transform: translateY(-4px); border-color: #1f7a66; box-shadow: 0 12px 28px -14px rgba(31, 122, 102, .45); }
.more-pic { flex: none; width: 4.5rem; height: 4.5rem; border-radius: 9999px; object-fit: cover; border: 3px solid #eef6f3; transition: transform .35s ease; }
.more-card:hover .more-pic { transform: scale(1.06) rotate(-3deg); }
.more-pic-empty { display: grid; place-items: center; background: #eef6f3; color: #1f7a66; font-weight: 800; font-size: 1.5rem; }
.more-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .25rem; }
.more-text small { color: #1f7a66; font-size: .75rem; font-weight: 600; }
.more-text b { font-weight: 700; font-size: .95rem; line-height: 1.7; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.more-arrow { flex: none; display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 9999px; background: #eef6f3; color: #1f7a66; font-size: 1.25rem; transition: background .25s ease, color .25s ease, transform .25s ease; }
.more-card:hover .more-arrow { background: #1f7a66; color: #fff; transform: scale(1.08); }
@media (prefers-reduced-motion: reduce) { .more-card, .more-pic, .more-arrow { transition: none; } .more-card:hover { transform: none; } }

/* Article forms: similar-title hint under the title field. */
.title-hint { margin-top: .5rem; border: 1px solid #fde68a; background: #fffbeb; color: #78350f; border-radius: .75rem; padding: .75rem; font-size: .875rem; line-height: 1.8; }
.title-hint ul { margin-top: .35rem; padding-inline-start: 1.1rem; list-style: disc; }
.title-hint a { color: #1f7a66; text-decoration: underline; }
.article-body .q { color: #1f7a66; font-weight: 600; background: #ecf7f3; border-radius: .35em; padding: 0 .3em; }

/* Guest message sent (supplier box under an article) */
.sent-card{text-align:center;background:#f0fdfa;border-color:#0f766e}
.sent-title{font-size:1.125rem;font-weight:700;color:#134e4a}
.sent-text{margin-top:.25rem;font-size:.875rem;color:#57534e}

/* Related products: dark green band, light cards floating on it. */
/* Full width: the colour runs to both edges of the screen (no extra width, so no sideways scroll). */
.rp{background:#04342c;box-shadow:0 0 0 100vmax #04342c;clip-path:inset(0 -100vmax);padding:28px 0;color:#fff}
.rp-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:18px}
.rp-kicker{margin:0;font-size:12px;color:#9fe1cb;letter-spacing:.02em}
.rp-title{margin:4px 0 0;font-size:18px;font-weight:700;line-height:1.7;color:#fff}
.rp-all{flex:none;font-size:13px;color:#9fe1cb;padding:6px 14px;border:1px solid rgba(159,225,203,.35);border-radius:999px;transition:background .2s,color .2s}
.rp-all:hover{background:#9fe1cb;color:#04342c}
.rp-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.rp-card{display:flex;flex-direction:column;gap:4px;background:#fff;border-radius:16px;padding:8px 8px 12px;color:#1c1917;transition:transform .2s,box-shadow .2s}
.rp-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.25)}
.rp-card:focus-visible{outline:2px solid #9fe1cb;outline-offset:3px}
.rp-pic{position:relative;display:block;aspect-ratio:1;border-radius:11px;overflow:hidden;background:#f5f5f4;margin-bottom:6px}
.rp-pic img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.rp-card:hover .rp-pic img{transform:scale(1.05)}
.rp-none{display:grid;place-items:center;height:100%;color:#d6d3d1}
.rp-badge{position:absolute;top:6px;right:6px;z-index:1;font-size:10px;padding:2px 8px;border-radius:999px;background:rgba(28,25,23,.65);color:#fff}
.rp-name{padding:0 4px;font-size:12.5px;font-weight:500;line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:3.4em}
.rp-price{padding:0 4px;font-size:12.5px;font-weight:600;color:#0f6e56}
.rp-price i{font-style:normal;transition:margin .2s}
.rp-card:hover .rp-price i{margin-right:4px}
.rp-org{display:flex;align-items:center;gap:4px;padding:0 4px;font-size:11px;color:#78716c;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
@media (max-width:1023px){.rp-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:767px){
  .rp{padding:22px 0}
  .rp-head{flex-direction:column;align-items:flex-start}
  .rp-title{font-size:16px}
  .rp-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .rp-card{padding:6px 6px 10px;border-radius:13px}
  .rp-name{font-size:12px}
}

/* The article text sits on a white sheet: soft border, gentle shadow and a thin brand line on top. */
.article-body { position: relative; background: #fff; border: 1px solid #e7e5e4; border-radius: 1.25rem; padding: 1.75rem 2rem; box-shadow: 0 1px 2px rgb(0 0 0 / .03), 0 12px 32px -12px rgb(4 52 44 / .12); overflow: hidden; }
.article-body::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(270deg, var(--color-brand-600), #8fd3bd); }
.article-body > :first-child { margin-top: 0; }
.article-body > :last-child { margin-bottom: 0; }
@media (max-width: 640px) { .article-body { padding: 1.25rem 1rem; border-radius: 1rem; } }