/* ============================================================================
   آرشیو برندها — از «برندها.dc.html»؛ مقدارها همه از توکن‌ها.
   ============================================================================ */

.sy-brand-archive { background: var(--sy-white); }

/* ---------------------------------------------------------------- ظرف مشترک */
.sy-arch-in { max-width: 1180px; margin: 0 auto; padding: clamp(32px, 4.5vw, 54px) clamp(16px, 4vw, 40px); }

/* ------------------------------------------------------------------- هیرو */
.sy-arch-hero { background: linear-gradient(180deg, var(--sy-surface), var(--sy-hairline)); }
.sy-arch-hero .sy-arch-in { padding-block: clamp(28px, 4vw, 50px); }
.sy-arch-eyebrow { font-size: 15px; font-weight: 700; color: var(--sy-primary); }
.sy-arch-title { margin: 10px 0 14px; font-size: clamp(27px, 4vw, 40px); line-height: 1.3; font-weight: 800; color: var(--sy-ink); }
.sy-arch-lead { margin: 0; max-width: 62ch; font-size: clamp(17px, 2vw, 19px); line-height: 1.9; color: var(--sy-body); }

/* ------------------------------------------------------------- کارت برند */
.sy-brand-grid-wrap { background: var(--sy-white); }
.sy-brand-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 20px; }
.sy-brand-card { border: 1px solid var(--sy-border); border-radius: 20px; padding: 26px; background: var(--sy-white); display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.sy-brand-logo { width: 100%; height: 74px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid var(--sy-hairline-soft); }
.sy-brand-logo img { max-height: 52px; max-width: 80%; object-fit: contain; }
.sy-brand-card h3 { margin: 4px 0 0; font-size: 19px; font-weight: 800; color: var(--sy-ink); }
.sy-brand-card p { margin: 0; font-size: 15.5px; line-height: 1.75; color: var(--sy-body); }
.sy-brand-card .sy-badge--sm { align-self: center; font-size: 14px; padding: 6px 12px; margin-top: 0; }

/* ------------------------------------------------------ یادداشت صادقانه */
.sy-brand-note { background: var(--sy-surface); }
.sy-brand-note .sy-arch-in { max-width: 840px; padding-block: clamp(30px, 4.5vw, 52px); }
.sy-brand-note-box { background: linear-gradient(135deg, var(--sy-surface-tint), var(--sy-surface-3)); border: 1.5px solid var(--sy-tint); border-radius: 24px; padding: clamp(24px, 3.5vw, 36px); display: flex; gap: 18px; align-items: flex-start; flex-wrap: wrap; }
.sy-brand-note-ic { width: 50px; height: 50px; border-radius: 14px; background: var(--sy-white); display: flex; align-items: center; justify-content: center; flex: none; }
.sy-brand-note-box > div { flex: 1; min-width: 250px; }
.sy-brand-note-box h2 { margin: 0 0 12px; font-size: 21px; font-weight: 800; color: var(--sy-ink); }
.sy-brand-note-box .sy-prose > p { font-size: 17.5px; line-height: 2; color: var(--sy-body); }