/* ============================================================
   DISIPHEE — قالب صفحات صنایع (Solutions)
   یک فایل برای هر ده صنف. ساختار، فاصله‌ها و کامپوننت‌ها ثابت‌اند؛
   فقط «Mood» عوض می‌شود و از data-mood روی .sol خوانده می‌شود.

   ثابت  → رنگ، فونت، دکمه، گردی، اسپیسینگ
   متغیر → تصویر هرو، انیمیشن، مثال‌ها، لحن

   یادداشت برند: Glow و Mouse-follow و Grid گرادیانی پیاده نشده‌اند
   (درخشش و گرادیان ممنوع‌اند). شبکه‌ی نقطه‌ای هرو با SVG ساخته شده،
   نه با background-image.
   ============================================================ */

.sol, .sol *{ box-sizing:border-box; }

.sol-rise{
  opacity:0; transform:translateY(18px);
  transition:opacity .55s ease, transform .55s ease;
}
.sol-rise.is-in{ opacity:1; transform:none; }

/* ---------- مسیر ناوبری ---------- */
.sol-crumb{ background:var(--white); border-bottom:1px solid var(--stroke); padding:14px var(--dzf-gutter); }
.sol-crumb__inner{
  max-width:var(--dzf-container); margin:0 auto;
  display:flex; align-items:center; flex-wrap:wrap; gap:8px;
  font-size:13px; color:var(--dzf-muted-2);
}
.sol-crumb a{ color:var(--dzf-muted); }
.sol-crumb a:hover{ color:var(--primary); }
.sol-crumb b{ color:var(--primary); font-weight:600; }

/* ---------- چیپ ---------- */
.sol-chip{
  display:inline-flex; align-items:center; gap:8px;
  margin-bottom:12px;
  padding:7px 16px; border-radius:999px;
  border:1px solid var(--stroke);
  font-size:12px; font-weight:700; color:var(--primary);
  unicode-bidi:plaintext;
}
.sol-chip--accent{ background:var(--accent); border-color:var(--accent); }
.sol-chip__ico{ display:flex; }
.sol-chip__ico svg{ width:15px; height:15px; }

/* ============================================================
   هرو
   ============================================================ */
.sol-hero{
  background:var(--white);
  padding:var(--dzf-space-xxl) var(--dzf-gutter);
  border-bottom:1px solid var(--stroke);
}
.sol-hero__inner{
  max-width:var(--dzf-container); margin:0 auto;
  display:grid; grid-template-columns:1.05fr .95fr;
  gap:var(--dzf-space-xl); align-items:center;
}
.sol-hero__t{
  margin:0 0 var(--dzf-space-sm);
  font-size:clamp(1.7rem, 3.6vw, 2.7rem);
  font-weight:800; line-height:1.35; color:var(--primary);
  text-wrap:balance;
}
.sol-hero__l{
  margin:0 0 var(--dzf-space-md); max-width:58ch;
  font-size:15.5px; line-height:2; color:var(--dzf-muted);
}
.sol-hero__btns{ display:flex; flex-wrap:wrap; gap:12px; }
.sol-hero__facts{
  display:flex; flex-wrap:wrap; gap:var(--dzf-space-md);
  margin:var(--dzf-space-lg) 0 0; padding:var(--dzf-space-sm) 0 0;
  border-top:1px solid var(--stroke); list-style:none;
}
.sol-hero__facts b{ display:block; font-size:1.4rem; font-weight:800; color:var(--primary); }
.sol-hero__facts span{ display:block; font-size:12px; color:var(--dzf-muted-2); }

/* ---------- ایده → برند ---------- */
.sol-idea{ position:relative; }
.sol-idea__grid{
  position:absolute; inset:0; width:100%; height:100%;
  pointer-events:none;
}
.sol-idea__grid circle{
  opacity:0;
  transition:opacity .4s ease;
  transition-delay:var(--i, 0ms);
}
.sol-idea.is-in .sol-idea__grid circle{ opacity:1; }

/* ------------------------------------------------------------
   زنجیره‌ی هرو استارتاپ

   دو ایراد داشت:
   ۱) هر ردیف فقط آیکون و دو خط متن داشت و بقیه‌ی عرض خالی می‌ماند؛
      پنج مستطیلِ نیمه‌خالی، «ناتمام» به نظر می‌رسیدند.
   ۲) «زنجیره» نامیده می‌شد ولی هیچ حلقه‌ای به حلقه‌ی بعد وصل نبود —
      فقط پنج کارت جدا روی هم چیده شده بودند.
   ------------------------------------------------------------ */
.sol-idea__chain{
  position:relative; z-index:2;
  display:flex; flex-direction:column; gap:10px;
  margin:0; padding:0; list-style:none;
}
.sol-idea__chain li{
  position:relative;
  display:flex; align-items:center; gap:14px;
  background:var(--white);
  border:1px solid var(--stroke);
  border-radius:18px;
  padding:14px var(--dzf-space-sm);
  opacity:0; transform:translateY(14px);
  transition:opacity .5s ease, transform .5s ease,
             border-color .22s ease, background-color .22s ease;
  transition-delay:var(--i, 0ms);
}
.sol-idea.is-in .sol-idea__chain li{ opacity:1; transform:none; }
.sol-idea__chain li:hover{ border-color:var(--primary); }

/* حلقه‌ی اتصال به مرحله‌ی بعد — دقیقاً زیر مرکز آیکون
   (۱۶px پدینگ + ۲۱px نصف کاشی = ۳۷px) */
.sol-idea__chain li:not(:last-child)::after{
  content:""; position:absolute; top:100%;
  inset-inline-start:37px; width:2px; height:10px;
  background:var(--stroke);
}

/* حلقه‌ی آخر، مقصد است */
.sol-idea__chain li:last-child{ background:var(--accent); border-color:var(--accent); }

.sol-idea__ico{
  display:flex; align-items:center; justify-content:center;
  width:42px; height:42px; flex-shrink:0;
  border-radius:14px;
  background:var(--primary); color:var(--accent);
  transition:background-color .22s ease, color .22s ease;
}
/* کاشی روشن با آیکونِ نازکِ تیره، در عمل محو دیده می‌شد.
   حالا کاشی تیره است و آیکون زرد — هم خواناتر، هم زنجیره را
   از فاصله‌ی دور هم قابل دنبال‌کردن می‌کند. */
.sol-idea__chain li:last-child .sol-idea__ico{
  background:var(--primary); color:var(--accent);
}
.sol-idea__ico svg{ width:20px; height:20px; }

.sol-idea__txt{ flex:1; min-width:0; }
.sol-idea__chain strong{ display:block; font-size:14.5px; color:var(--primary); }
/* به .sol-idea__txt محدود است. قبلاً `.sol-idea__chain span` بود و
   چون هم .sol-idea__ico و هم .sol-idea__n یک <span> هستند، با ویژگی
   بالاتر (۰,۱,۱ در برابر ۰,۱,۰) رویشان می‌نشست: آیکون‌ها به‌جای رنگ
   خودشان --dzf-muted-2 می‌گرفتند و display:flex هم به block تبدیل
   می‌شد، پس svg از وسط کاشی درمی‌رفت. همان باگی که در Roadmap و
   Brand Book و چند صفحه‌ی دیگر هم پیدا شد. */
.sol-idea__txt span{ display:block; font-size:11.5px; color:var(--dzf-muted-2); unicode-bidi:plaintext; }
.sol-idea__chain li:last-child .sol-idea__txt span{ color:var(--primary); opacity:.65; }

/* شماره‌ی مرحله، لبه‌ی مقابل */
.sol-idea__n{
  flex-shrink:0;
  font-size:13px; font-weight:800; letter-spacing:.02em;
  color:var(--dzf-muted-3); unicode-bidi:plaintext;
}
.sol-idea__chain li:last-child .sol-idea__n{ color:var(--primary); opacity:.45; }

/* ============================================================
   سکشن پایه
   ============================================================ */
.sol-sec{ padding:var(--dzf-space-xxl) var(--dzf-gutter); }
.sol-sec__inner{ max-width:var(--dzf-container); margin:0 auto; }
.sol-sec__head{ max-width:72ch; margin-bottom:var(--dzf-space-xl); }
.sol-sec__head h2{
  margin:0 0 12px; font-size:clamp(1.3rem, 2.6vw, 1.9rem);
  font-weight:800; line-height:1.5; color:var(--primary); text-wrap:balance;
}
.sol-sec__head p{ margin:0; font-size:15px; line-height:2; color:var(--dzf-muted); }
.sol-sec__head--light h2{ color:var(--white); }
.sol-sec__head--light p{ color:var(--bg); opacity:.72; }

/* ============================================================
   چالش‌ها
   ============================================================ */
.sol-pain-sec{ background:var(--white); }
.sol-pains{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  gap:var(--dzf-space-sm);
}
.sol-pain{
  background:var(--white); border:1px solid var(--stroke);
  border-radius:20px; padding:var(--dzf-space-md);
  transition:opacity .55s ease, transform .55s ease, border-color .22s ease;
}
.sol-pain:hover{ border-color:var(--primary); }
.sol-pain__ico{
  display:flex; align-items:center; justify-content:center;
  width:44px; height:44px; margin-bottom:12px;
  border-radius:14px; background:var(--bg); color:var(--primary);
}
.sol-pain__ico svg{ width:21px; height:21px; }
.sol-pain strong{ display:block; font-size:15px; color:var(--primary); }
.sol-pain p{ margin:8px 0 0; font-size:13px; line-height:1.9; color:var(--dzf-muted-2); }
.sol-pain__note{
  margin:var(--dzf-space-lg) 0 0;
  max-width:70ch; font-size:15px; line-height:2; color:var(--dzf-muted);
}

/* ============================================================
   تشکیل هسته
   ============================================================ */
.sol-dna-sec{ background:var(--primary); }
.sol-assembly{
  position:relative;
  max-width:640px; margin:0 auto;
  min-height:340px;
  display:flex; align-items:center; justify-content:center;
}
.sol-assembly__core{
  position:relative; z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:6px;
  width:180px; height:180px; border-radius:999px;
  background:var(--accent); color:var(--primary);
  justify-content:center; text-align:center;
  transform:scale(.86); opacity:.5;
  transition:transform .7s cubic-bezier(.22,.8,.28,1) .5s, opacity .7s ease .5s;
}
.sol-assembly.is-in .sol-assembly__core{ transform:scale(1); opacity:1; }
.sol-assembly__core span{ display:flex; }
.sol-assembly__core svg{ width:34px; height:34px; }
.sol-assembly__core strong{ font-size:15px; unicode-bidi:plaintext; }
.sol-assembly__core em{ font-style:normal; font-size:12px; opacity:.7; }

/* چهار عنصر از چهار گوشه به مرکز می‌آیند */
.sol-assembly__i{
  position:absolute; z-index:2;
  display:flex; flex-direction:column; gap:2px;
  padding:12px 20px; border-radius:16px;
  background:rgba(226,227,231,.08);
  border:1px solid rgba(226,227,231,.18);
  transition:transform .8s cubic-bezier(.22,.8,.28,1), opacity .6s ease;
  opacity:0;
}
.sol-assembly__i b{ font-size:14px; color:var(--white); unicode-bidi:plaintext; }
.sol-assembly__i em{ font-style:normal; font-size:11.5px; color:var(--bg); opacity:.6; }

.sol-assembly__i--1{ top:0;    inset-inline-start:0;  transform:translate(0, -40px); }
.sol-assembly__i--2{ top:0;    inset-inline-end:0;    transform:translate(0, -40px); }
.sol-assembly__i--3{ bottom:0; inset-inline-start:0;  transform:translate(0, 40px); }
.sol-assembly__i--4{ bottom:0; inset-inline-end:0;    transform:translate(0, 40px); }
.sol-assembly.is-in .sol-assembly__i{ opacity:1; transform:translate(0, 0); }

/* ============================================================
   نقشه‌ی رشد
   ============================================================ */
.sol-road{
  margin:0; padding:0; list-style:none; position:relative;
}
.sol-road::before{
  content:""; position:absolute; top:14px; bottom:14px;
  inset-inline-start:18px; width:2px; background:var(--stroke);
  transform:scaleY(0); transform-origin:top;
  transition:transform 1.4s cubic-bezier(.22,.8,.28,1);
}
.sol-road.is-drawn::before{ transform:scaleY(1); }
.sol-road li{
  position:relative;
  display:flex; align-items:flex-start; gap:18px;
  padding-bottom:var(--dzf-space-md);
}
.sol-road li:last-child{ padding-bottom:0; }
.sol-road__dot{
  position:relative; z-index:2;
  display:flex; align-items:center; justify-content:center;
  width:38px; height:38px; flex-shrink:0; border-radius:999px;
  background:var(--white); border:2px solid var(--stroke);
  font-size:13px; font-weight:800; color:var(--dzf-muted-2);
  transition:background-color .3s ease, border-color .3s ease, color .3s ease;
}
.sol-road li:hover .sol-road__dot{
  background:var(--accent); border-color:var(--accent); color:var(--primary);
}
.sol-road li:last-child .sol-road__dot{
  background:var(--accent); border-color:var(--accent); color:var(--primary);
}
.sol-road__body{
  flex:1; min-width:0;
  background:var(--white); border:1px solid var(--stroke);
  border-radius:20px; padding:var(--dzf-space-md);
  transition:border-color .22s ease;
}
.sol-road li:hover .sol-road__body{ border-color:var(--primary); }
.sol-road__body strong{ font-size:15.5px; color:var(--primary); }
.sol-road__en{
  display:inline-block; margin-inline-start:8px;
  font-size:11.5px; color:var(--dzf-muted-3); unicode-bidi:plaintext;
}
.sol-road__body p{ margin:8px 0 0; font-size:13.5px; line-height:1.9; color:var(--dzf-muted-2); }
/* روایت برند خیالی — فقط هنگام هاور دیده می‌شود */
.sol-road__story{
  display:block; margin-top:10px;
  padding-top:10px; border-top:1px dashed var(--stroke);
  font-style:normal; font-size:12.5px; color:var(--primary);
  opacity:0; max-height:0; overflow:hidden;
  transition:opacity .3s ease, max-height .3s ease, margin .3s ease, padding .3s ease;
}
.sol-road li:hover .sol-road__story,
.sol-road li:focus-within .sol-road__story{ opacity:1; max-height:60px; }

.sol-ready{
  display:flex; align-items:center; gap:16px;
  margin-top:var(--dzf-space-lg);
  background:var(--primary); border-radius:20px;
  padding:var(--dzf-space-md);
}
.sol-ready > span{
  display:flex; align-items:center; justify-content:center;
  width:44px; height:44px; flex-shrink:0; border-radius:999px;
  background:var(--accent); color:var(--primary);
}
.sol-ready svg{ width:22px; height:22px; }
.sol-ready strong{ display:block; font-size:1.05rem; color:var(--accent); unicode-bidi:plaintext; }
.sol-ready p{ margin:5px 0 0; font-size:13.5px; line-height:1.85; color:var(--bg); opacity:.72; }

/* ============================================================
   خروجی‌ها
   ============================================================ */
.sol-out{ border:1px solid var(--stroke); border-radius:20px; overflow:hidden; }
.sol-out__hd, .sol-out__r{
  display:grid; grid-template-columns:1fr 1.4fr; gap:16px;
  padding:14px var(--dzf-space-md);
}
/* هدر تیره: ردیف عنوان از داده‌ها جدا می‌شود بدون اینکه خط اضافه‌ای
   لازم باشد. رنگ متن --bg است نه سفیدِ کامل، چون عنوانِ ستون باید
   از مقدارها آرام‌تر بخواند. */
/* opacity روی خودِ عنصر بود و پس‌زمینه را هم کم‌رنگ می‌کرد،
   پس #21242A روی زمینه‌ی روشن، خاکستری دیده می‌شد. */
.sol-out__hd{
  background:var(--primary);
  font-size:11.5px; font-weight:700; color:var(--bg);
}
.sol-out__r{ background:var(--white); border-top:1px solid var(--stroke); }
.sol-out__k{ font-size:14px; font-weight:700; color:var(--primary); unicode-bidi:plaintext; }
.sol-out__v{ font-size:13.5px; color:var(--dzf-muted); }

/* ============================================================
   چرا این مسیر
   ============================================================ */
.sol-why-sec{ background:var(--white); }
.sol-why{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--dzf-space-sm); }
.sol-why article{
  border:1px solid var(--stroke); border-radius:20px;
  padding:var(--dzf-space-md);
}
.sol-why__n{
  display:inline-block; margin-bottom:12px;
  padding:5px 12px; border-radius:999px;
  background:var(--accent); color:var(--primary);
  font-size:11.5px; font-weight:800;
}
.sol-why strong{ display:block; font-size:16px; color:var(--primary); }
.sol-why p{ margin:8px 0 0; font-size:13.5px; line-height:1.95; color:var(--dzf-muted-2); }

/* ============================================================
   رشد: دانه تا درخت
   ============================================================ */
.sol-scale{
  display:grid; grid-template-columns:auto 1fr;
  gap:var(--dzf-space-xl); align-items:center;
}
.sol-seed{ text-align:center; }
.sol-seed svg{ width:130px; height:auto; display:block; margin:0 auto; }
.sol-seed__dot{ fill:var(--accent); }
.sol-seed__stem{
  stroke:var(--primary);
  stroke-dasharray:70; stroke-dashoffset:70;
  transition:stroke-dashoffset 1s cubic-bezier(.22,.8,.28,1) .2s;
}
.sol-seed__leafa, .sol-seed__leafb{
  fill:var(--accent);
  opacity:0; transform-origin:60px 100px;
  transform:scale(.4);
  transition:opacity .5s ease, transform .5s cubic-bezier(.22,.8,.28,1);
}
.sol-seed__leafa{ transition-delay:.9s; }
.sol-seed__leafb{ transition-delay:1.05s; }
.sol-seed__crown{
  fill:var(--primary);
  opacity:0; transform-origin:60px 56px; transform:scale(.3);
  transition:opacity .6s ease 1.2s, transform .6s cubic-bezier(.22,.8,.28,1) 1.2s;
}
.sol-scale.is-in .sol-seed__stem{ stroke-dashoffset:0; }
.sol-scale.is-in .sol-seed__leafa,
.sol-scale.is-in .sol-seed__leafb,
.sol-scale.is-in .sol-seed__crown{ opacity:1; transform:scale(1); }
.sol-seed__k{
  display:inline-block; margin-top:12px;
  padding:6px 14px; border-radius:999px;
  background:var(--accent); color:var(--primary);
  font-size:11.5px; font-weight:700;
}

.sol-scale__steps{
  display:flex; flex-wrap:wrap; align-items:center; gap:10px;
  margin:0; padding:0; list-style:none;
}
.sol-scale__steps li{
  padding:11px 22px; border-radius:999px;
  border:1px solid var(--stroke); background:var(--white);
  font-size:13.5px; font-weight:600; color:var(--primary);
  unicode-bidi:plaintext;
  opacity:0; transform:translateY(8px);
  transition:opacity .45s ease, transform .45s ease;
  transition-delay:var(--i, 0ms);
}
.sol-scale.is-in .sol-scale__steps li{ opacity:1; transform:none; }
.sol-scale__steps li:last-child{ background:var(--primary); border-color:var(--primary); color:var(--bg); }

/* ============================================================
   ماژول‌ها
   ============================================================ */
/* دو بخش با ظاهر یکسان ولی نقش متفاوت:
     .sol-system-sec — «سیستم برند این صنف»، امضای اختصاصی صفحه
     .sol-mods-sec   — «ابزارهای این مسیر»، شش ماژول پلتفرم
   قبلاً هر دو کلاس sol-mods-sec داشتند و در چهار صفحه دو بار
   تکرار می‌شد؛ همان استایل روی دو معنی متفاوت. */
.sol-mods-sec,
.sol-system-sec{ background:var(--white); }
.sol-mods{ display:grid; grid-template-columns:repeat(6, minmax(0,1fr)); gap:12px; }
.sol-mod{
  display:flex; flex-direction:column; align-items:flex-start; gap:8px;
  border:1px solid var(--stroke); border-radius:18px;
  padding:var(--dzf-space-sm);
  transition:opacity .55s ease, transform .55s ease, border-color .22s ease;
}
.sol-mod.is-in:hover{ border-color:var(--primary); transform:translateY(-3px); }
.sol-mod__ico{
  display:flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:14px;
  background:var(--bg); color:var(--primary);
  transition:background-color .22s ease;
}
.sol-mod:hover .sol-mod__ico{ background:var(--accent); }
.sol-mod__ico svg{ width:20px; height:20px; }
.sol-mod strong{ font-size:13px; color:var(--primary); unicode-bidi:plaintext; }
.sol-mod__fa{ font-size:11.5px; color:var(--dzf-muted-2); }

/* ============================================================
   قبل و بعد
   ============================================================ */
.sol-ba{
  display:grid; grid-template-columns:.8fr auto 1.2fr;
  gap:var(--dzf-space-md); align-items:center;
}
.sol-ba__side{
  border:1px solid var(--stroke); border-radius:24px;
  padding:var(--dzf-space-lg);
}
.sol-ba__side--after{ background:var(--primary); border-color:var(--primary); }
.sol-ba__k{
  display:inline-block; margin-bottom:var(--dzf-space-md);
  padding:5px 14px; border-radius:999px;
  background:var(--bg); font-size:11.5px; font-weight:700; color:var(--dzf-muted);
}
.sol-ba__side--after .sol-ba__k{ background:var(--accent); color:var(--primary); }

.sol-ba__idea{ display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center; }
.sol-ba__idea span{
  display:flex; align-items:center; justify-content:center;
  width:64px; height:64px; border-radius:999px;
  background:var(--bg); color:var(--dzf-muted-2);
}
.sol-ba__idea svg{ width:30px; height:30px; }
.sol-ba__idea strong{ font-size:15px; color:var(--dzf-muted); }

.sol-ba__arrow{ display:flex; justify-content:center; color:var(--dzf-muted-3); }
.sol-ba__arrow svg{ width:26px; height:26px; }

.sol-ba__core{
  display:flex; align-items:center; gap:12px;
  margin-bottom:var(--dzf-space-md);
  padding:14px var(--dzf-space-sm); border-radius:18px;
  background:var(--accent);
}
.sol-ba__core span{ display:flex; color:var(--primary); }
.sol-ba__core svg{ width:24px; height:24px; }
.sol-ba__core strong{ font-size:15px; color:var(--primary); unicode-bidi:plaintext; }

.sol-ba__assets{
  display:flex; flex-wrap:wrap; gap:10px;
  margin:0; padding:0; list-style:none;
}
.sol-ba__assets li{
  padding:10px 18px; border-radius:999px;
  background:rgba(226,227,231,.08);
  border:1px solid rgba(226,227,231,.18);
  font-size:13px; color:var(--bg);
  /* دارایی‌ها از پایین به سمت هسته جمع می‌شوند */
  opacity:0; transform:translateY(18px);
  transition:opacity .5s ease, transform .5s cubic-bezier(.22,.8,.28,1);
  transition-delay:var(--i, 0ms);
}
.sol-ba.is-in .sol-ba__assets li{ opacity:1; transform:none; }

/* ============================================================
   CTA
   ============================================================ */
.sol-cta{ background:var(--primary); padding:var(--dzf-space-xxl) var(--dzf-gutter); text-align:center; }
.sol-cta__inner{ max-width:760px; margin:0 auto; }
.sol-cta h2{
  margin:0 0 var(--dzf-space-sm);
  font-size:clamp(1.4rem, 2.8vw, 2.1rem); font-weight:800; line-height:1.5;
  color:var(--white); text-wrap:balance;
}
.sol-cta p{ margin:0 auto var(--dzf-space-md); max-width:60ch; font-size:15px; line-height:2; color:var(--bg); opacity:.72; }
.sol-cta__btns{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
.sol-cta .dzf-hbtn--solid{
  background:var(--accent) !important; color:var(--primary) !important; border-color:var(--accent) !important;
}
.sol-cta .dzf-hbtn--solid:hover{ background:var(--white) !important; border-color:var(--white) !important; }
.sol-cta .dzf-hbtn--ghost{ color:var(--bg) !important; border-color:rgba(226,227,231,.35) !important; }
/* بدون این قانون، متن دکمه در هاور روشن می‌ماند و روی زرد خوانده
   نمی‌شود: قانون بالا و `.dzf-hbtn--ghost:hover` در style.css هر دو
   !important و هم‌ویژگی‌اند (۰,۲,۰)، پس فایل دیرتر برنده می‌شود و
   رنگِ حالت عادی روی هاور هم می‌نشیند. */
.sol-cta .dzf-hbtn--ghost:hover{ color:var(--primary) !important; }
/* ویژگی دوکلاسه تا از `.sol-cta p` بالاتر بنشیند. قبلاً فقط margin
   با !important نجات یافته بود و font-size/opacity همچنان از قانون
   بالاتر می‌آمدند — همان الگویی که در Roadmap و Dashboard و
   Brand Book و Digital Assets هم دیده شد. */
.sol-cta .sol-cta__sub{ margin:var(--dzf-space-md) 0 0; font-size:13.5px; opacity:.6; }
.sol-cta .sol-cta__sub a{ color:var(--accent); font-weight:600; }

/* ============================================================
   بلوک‌های صنف «شرکت‌ها» — قابل استفاده برای صنایع دیگر هم
   ============================================================ */

/* پنج چالش به‌جای چهارتا */
.sol-pains--5{ grid-template-columns:repeat(5, minmax(0,1fr)); }

/* ---------- هرو: سازمان چندتیمی ---------- */
.sol-orgmini{
  background:var(--primary); border-radius:24px;
  padding:var(--dzf-space-md);
}
.sol-orgmini__core{
  display:flex; align-items:center; gap:12px;
  padding:14px var(--dzf-space-sm); border-radius:18px;
  background:var(--accent);
  margin-bottom:var(--dzf-space-sm);
}
.sol-orgmini__core span{ display:flex; color:var(--primary); }
.sol-orgmini__core svg{ width:24px; height:24px; }
.sol-orgmini__core strong{ font-size:15px; color:var(--primary); unicode-bidi:plaintext; }

.sol-orgmini__teams{
  display:grid; grid-template-columns:repeat(2, minmax(0,1fr));
  gap:10px; margin:0; padding:0; list-style:none;
}
.sol-orgmini__teams li{
  position:relative;
  padding:14px var(--dzf-space-sm); border-radius:16px;
  background:rgba(226,227,231,.08);
  border:1px solid rgba(226,227,231,.18);
  opacity:0; transform:translateY(12px);
  transition:opacity .5s ease, transform .5s ease;
  transition-delay:var(--i, 0ms);
}
.sol-orgmini.is-in .sol-orgmini__teams li{ opacity:1; transform:none; }
/* خط اتصال کوتاه به سمت هسته */
.sol-orgmini__teams li i{
  display:block; width:2px; height:10px;
  background:var(--accent);
  margin:-24px auto 12px;
}
.sol-orgmini__teams strong{ display:block; font-size:14px; color:var(--white); unicode-bidi:plaintext; }
.sol-orgmini__teams span{ display:block; font-size:11.5px; color:var(--bg); opacity:.55; }

/* ---------- نمودار سازمانی ---------- */
.sol-org svg{ width:100%; height:auto; display:block; }
.sol-org__t{
  font-family:var(--dzf-font); font-size:15px; font-weight:700;
  fill:var(--primary); text-anchor:middle;
}
.sol-org__t--light{ fill:var(--white); }
.sol-org__lines path{
  stroke-dasharray:460; stroke-dashoffset:460;
  transition:stroke-dashoffset 1.2s cubic-bezier(.22,.8,.28,1);
}
.sol-org.is-in .sol-org__lines path{ stroke-dashoffset:0; }
.sol-org.is-in .sol-org__lines path:nth-child(n+2){ transition-delay:.15s; }
.sol-org.is-in .sol-org__lines path:nth-child(n+4){ transition-delay:.3s; }
.sol-org.is-in .sol-org__lines path:nth-child(n+6){ transition-delay:.45s; }
.sol-org__row rect, .sol-org__row text{
  opacity:0; transition:opacity .5s ease .4s;
}
.sol-org.is-in .sol-org__row rect,
.sol-org.is-in .sol-org__row text{ opacity:1; }
.sol-org__note{
  margin:var(--dzf-space-md) 0 0; text-align:center;
  font-size:14px; color:var(--dzf-muted);
}

/* ---------- نقاط تماس ---------- */
.sol-touch-sec{ background:var(--white); }
.sol-touch{
  display:grid; grid-template-columns:repeat(6, minmax(0,1fr));
  gap:12px; margin:0; padding:0; list-style:none;
}
.sol-touch li{
  display:flex; flex-direction:column; align-items:flex-start; gap:8px;
  border:1px solid var(--stroke); border-radius:18px;
  padding:var(--dzf-space-sm);
  transition:opacity .55s ease, transform .55s ease, border-color .22s ease;
}
.sol-touch li:hover{ border-color:var(--primary); }
.sol-touch__ico{
  display:flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:14px;
  background:var(--bg); color:var(--primary);
  transition:background-color .22s ease;
}
.sol-touch li:hover .sol-touch__ico{ background:var(--accent); }
.sol-touch__ico svg{ width:20px; height:20px; }
.sol-touch strong{ font-size:13.5px; color:var(--primary); }
.sol-touch__en{ font-size:11px; color:var(--dzf-muted-3); unicode-bidi:plaintext; }

.sol-touch__to{
  display:flex; justify-content:center;
  padding:var(--dzf-space-md) 0;
  color:var(--dzf-muted-3);
}
.sol-touch__to svg{ width:26px; height:26px; }
.sol-touch__core{
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px;
  background:var(--primary); border-radius:20px;
  padding:var(--dzf-space-md);
  text-align:center;
}
.sol-touch__core span{ display:flex; color:var(--accent); }
.sol-touch__core svg{ width:26px; height:26px; }
.sol-touch__core strong{ font-size:1.1rem; color:var(--white); unicode-bidi:plaintext; }
.sol-touch__core em{ font-style:normal; font-size:13px; color:var(--bg); opacity:.6; }

/* ---------- رشد سازمانی ---------- */
.sol-grow-sec{ background:var(--primary); }
.sol-grow{ display:grid; grid-template-columns:1.4fr .6fr; gap:var(--dzf-space-md); align-items:center; }
.sol-grow__steps{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  gap:12px; margin:0; padding:0; list-style:none;
}
.sol-grow__steps li{
  background:rgba(226,227,231,.08);
  border:1px solid rgba(226,227,231,.18);
  border-radius:18px; padding:var(--dzf-space-md);
  opacity:0; transform:translateY(12px);
  transition:opacity .55s ease, transform .55s ease;
  transition-delay:var(--i, 0ms);
}
.sol-grow.is-in .sol-grow__steps li{ opacity:1; transform:none; }
.sol-grow__steps b{ display:block; font-size:1.8rem; font-weight:800; color:var(--white); }
.sol-grow__steps span{ display:block; font-size:12px; color:var(--bg); opacity:.55; }
.sol-grow__steps em{
  display:block; margin-top:10px; font-style:normal;
  font-size:11.5px; color:var(--bg); opacity:.45;
}
.sol-grow__health{
  background:var(--accent); border-radius:20px;
  padding:var(--dzf-space-md); text-align:center;
}
.sol-grow__health span{ display:block; font-size:12px; color:var(--primary); opacity:.65; unicode-bidi:plaintext; }
.sol-grow__health b{ display:block; margin:6px 0 4px; font-size:2.4rem; font-weight:800; color:var(--primary); }
.sol-grow__health b i{ font-style:normal; }
.sol-grow__health em{ font-style:normal; font-size:11.5px; color:var(--primary); opacity:.7; }

/* ---------- Brand Sync ---------- */
.sol-sync-sec{ background:var(--white); }
.sol-sync{
  border:1px solid var(--stroke); border-radius:24px;
  padding:var(--dzf-space-lg);
}
.sol-sync__stage{ position:relative; }
/* پیش از اتصال، هسته خط‌چین است: «هست ولی هنوز وصل نشده».
   حالت قبلی، خاکستریِ توپُر بود و بیشتر «غیرفعال» می‌خواند تا «منتظر». */
.sol-sync__core{
  display:flex; align-items:center; justify-content:center; gap:12px;
  max-width:280px; margin:0 auto var(--dzf-space-md);
  padding:14px var(--dzf-space-sm); border-radius:18px;
  background:var(--white); color:var(--dzf-muted-2);
  border:1.5px dashed var(--dzf-muted-3);
  transition:background-color .6s ease, color .6s ease, border-color .6s ease;
}
.sol-sync__core span{ display:flex; }
.sol-sync__core svg{ width:24px; height:24px; }
.sol-sync__core strong{ font-size:15px; unicode-bidi:plaintext; }
.sol-sync.is-synced .sol-sync__core{
  background:var(--accent); color:var(--primary);
  border-style:solid; border-color:var(--accent);
}

.sol-sync__teams{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  gap:12px; margin:0; padding:0; list-style:none;
}
.sol-sync__team{
  border:1px solid var(--stroke); border-radius:18px;
  padding:var(--dzf-space-md);
  transition:border-color .6s ease;
}
.sol-sync.is-synced .sol-sync__team{ border-color:var(--accent); }
/* ------------------------------------------------------------
   حالت اولیه: چهار واحد، چهار پالتِ بی‌ربط

   نسخه‌ی قبلی هر واحد را با یک نوار تک‌رنگ از پالت خودِ دیزیفی
   نشان می‌داد (تیره / خاکستری / خاکستری روشن / سفید). نتیجه‌اش
   چهار سایه‌ی خاکستری بود که شبیه اسکلتِ در حال بارگذاری دیده
   می‌شد، نه شبیه چهار برندِ متفاوت. کارت HR هم نوار سفید داشت
   و عملاً خالی به نظر می‌رسید.

   رنگ‌های زیر عمداً بیرون از پالت دیزیفی‌اند — همان استدلالِ
   کارت‌های محصول در صفحه‌ی فروشگاه آنلاین: اینجا برند خودمان را
   نشان نمی‌دهیم، «چهار واحدی که هرکدام ساز خودشان را می‌زنند»
   را نشان می‌دهیم. اگر همه از پالت رسمی بودند، دمو دقیقاً همان
   چیزی را که می‌خواهد ثابت کند از دست می‌داد.
   ------------------------------------------------------------ */
.sol-sync__sw{
  display:flex; gap:3px;
  width:100%; height:38px; border-radius:12px; overflow:hidden;
  margin-bottom:12px;
}
.sol-sync__sw b{
  flex:1;
  transition:background-color .6s cubic-bezier(.22,.8,.28,1);
  transition-delay:var(--i, 0ms);
}
/* Marketing — آبی سرد */
.sol-sync__team--a .sol-sync__sw b:nth-child(1){ background:#2C4A6B; }
.sol-sync__team--a .sol-sync__sw b:nth-child(2){ background:#5B7FA6; }
.sol-sync__team--a .sol-sync__sw b:nth-child(3){ background:#D6E1EC; }
/* Product — سبز زیتونی */
.sol-sync__team--b .sol-sync__sw b:nth-child(1){ background:#4A5D34; }
.sol-sync__team--b .sol-sync__sw b:nth-child(2){ background:#8CA36B; }
.sol-sync__team--b .sol-sync__sw b:nth-child(3){ background:#DFE8D2; }
/* Sales — نارنجیِ آجری */
.sol-sync__team--c .sol-sync__sw b:nth-child(1){ background:#8C4A2C; }
.sol-sync__team--c .sol-sync__sw b:nth-child(2){ background:#C08056; }
.sol-sync__team--c .sol-sync__sw b:nth-child(3){ background:#EFDDCB; }
/* HR — بنفشِ خاکستری */
.sol-sync__team--d .sol-sync__sw b:nth-child(1){ background:#4A3F63; }
.sol-sync__team--d .sol-sync__sw b:nth-child(2){ background:#8177A3; }
.sol-sync__team--d .sol-sync__sw b:nth-child(3){ background:#E0DCEA; }

/* پس از همگام‌سازی: هر چهار واحد، دقیقاً پالت رسمی دیزیفی.
   سه نوار به‌جای یک نوار زردِ توپُر — هم راست‌تر است («یک پالت»،
   نه «یک رنگ»)، هم صفحه را از زرد اشباع نمی‌کند. */
.sol-sync.is-synced .sol-sync__sw b:nth-child(1){ background:var(--primary); }
.sol-sync.is-synced .sol-sync__sw b:nth-child(2){ background:var(--accent); }
.sol-sync.is-synced .sol-sync__sw b:nth-child(3){ background:var(--bg); }

.sol-sync__team strong{ display:block; font-size:14px; color:var(--primary); unicode-bidi:plaintext; }
/* :not(.sol-sync__sw) لازم است — نمونه‌ی رنگ هم یک <span> فرزند
   مستقیم است و این قانون display:block و رنگ متن را رویش می‌نشاند. */
.sol-sync__team > span:not(.sol-sync__sw){ display:block; font-size:12px; color:var(--dzf-muted-2); }

/* برچسب نسخه — پیش و پس از همگام‌سازی، دو متن متفاوت */
.sol-sync__file{
  display:inline-block; margin-top:10px; font-style:normal;
  padding:4px 10px; border-radius:999px;
  background:var(--bg); font-size:10.5px; font-weight:700; color:var(--dzf-muted-2);
  unicode-bidi:plaintext;
  transition:background-color .6s ease, color .6s ease;
}
.sol-sync__fafter{ display:none; }
.sol-sync.is-synced .sol-sync__fbefore{ display:none; }
.sol-sync.is-synced .sol-sync__fafter{ display:inline; }
.sol-sync.is-synced .sol-sync__file{ background:var(--primary); color:var(--bg); }

.sol-sync__ctl{
  display:flex; align-items:center; flex-wrap:wrap; gap:var(--dzf-space-md);
  margin-top:var(--dzf-space-lg);
  padding-top:var(--dzf-space-md);
  border-top:1px solid var(--stroke);
}
.sol-sync__btn{
  padding:12px 28px; border-radius:999px; cursor:pointer;
  background:var(--primary); color:var(--bg);
  border:1.5px solid var(--primary);
  font-family:var(--dzf-font); font-size:14px; font-weight:700;
  transition:background-color .22s ease, color .22s ease, border-color .22s ease;
}
.sol-sync__btn:hover{ background:var(--accent); color:var(--primary); border-color:var(--accent); }
.sol-sync__msg{
  margin:0; flex:1; min-width:220px;
  opacity:0; transform:translateY(6px);
  transition:opacity .5s ease, transform .5s ease;
}
.sol-sync.is-synced .sol-sync__msg{ opacity:1; transform:none; }
.sol-sync__msg strong{ display:block; font-size:1.05rem; color:var(--primary); unicode-bidi:plaintext; }
.sol-sync__msg span{ display:block; margin-top:4px; font-size:13px; color:var(--dzf-muted-2); }

/* ============================================================
   بلوک‌های صنف «فروشگاه‌های آنلاین»
   ============================================================ */

/* ---------- هرو: سه دستگاه، یک هویت ---------- */
.sol-devices{
  position:relative;
  display:grid; grid-template-columns:1.6fr 1fr;
  gap:12px; align-items:start;
  background:var(--primary); border-radius:24px;
  padding:var(--dzf-space-md);
}
.sol-dev{
  background:var(--white); border-radius:16px; padding:12px;
  opacity:0; transform:translateY(14px);
  transition:opacity .5s ease, transform .5s ease;
  transition-delay:var(--i, 0ms);
}
.sol-devices.is-in .sol-dev{ opacity:1; transform:none; }
.sol-dev--desk{ grid-row:span 2; }
.sol-dev__k{
  display:block; margin-bottom:10px;
  font-size:10.5px; font-weight:700; color:var(--dzf-muted-2);
  unicode-bidi:plaintext;
}
.sol-dev__screen{ display:flex; flex-direction:column; gap:8px; }
.sol-dev__bar{ display:flex; gap:4px; }
.sol-dev__bar i{ width:6px; height:6px; border-radius:999px; background:var(--bg); }
.sol-dev__bar i:first-child{ background:var(--accent); }
.sol-dev__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.sol-dev__grid--2{ grid-template-columns:repeat(2,1fr); }
.sol-dev__grid i{ height:34px; border-radius:10px; background:var(--bg); }
.sol-dev__grid i:nth-child(2){ background:var(--primary); }
.sol-dev__cta{
  align-self:flex-start;
  padding:7px 16px; border-radius:999px;
  background:var(--accent); color:var(--primary);
  font-size:11px; font-weight:700;
}
.sol-dev__pack{
  position:relative; height:96px; border-radius:12px;
  background:var(--bg); overflow:hidden;
}
.sol-dev__lid{
  position:absolute; top:26px; inset-inline:0; height:2px;
  background:var(--stroke);
}
.sol-dev__mark{
  position:absolute; inset-inline-start:50%; top:50%;
  width:34px; height:34px; margin:-8px 0 0 -17px;
  border-radius:12px; background:var(--accent);
}
.sol-devices__tag{
  grid-column:1 / -1;
  margin-top:4px; text-align:center;
  font-size:12px; color:var(--bg); opacity:.6;
}

/* ---------- سفر مشتری ---------- */
.sol-journey-sec{ background:var(--primary); }
.sol-journey{
  display:grid; grid-template-columns:repeat(6, minmax(0,1fr));
  gap:12px; margin:0; padding:var(--dzf-space-md) 0 0;
  list-style:none; position:relative;
}
/* ریل مسیر مشتری */
.sol-journey::before{
  content:""; position:absolute; top:7px; right:0; left:0; height:2px;
  background:rgba(226,227,231,.18);
}
.sol-journey::after{
  content:""; position:absolute; top:7px; right:0; height:2px;
  width:100%; background:var(--accent);
  transform:scaleX(0); transform-origin:right;
  transition:transform 1.8s cubic-bezier(.22,.8,.28,1);
}
.sol-journey.is-in::after{ transform:scaleX(1); }

.sol-journey li{
  position:relative; padding-top:var(--dzf-space-md);
  opacity:0; transform:translateY(12px);
  transition:opacity .5s ease, transform .5s ease;
  transition-delay:var(--i, 0ms);
}
.sol-journey.is-in li{ opacity:1; transform:none; }
.sol-journey__dot{
  position:absolute; top:0; inset-inline-start:0;
  width:16px; height:16px; border-radius:999px;
  background:var(--primary); border:2px solid var(--accent);
}
.sol-journey li:last-child .sol-journey__dot{ background:var(--accent); }
.sol-journey strong{ display:block; font-size:14px; color:var(--white); }
.sol-journey__en{
  display:block; margin-top:2px;
  font-size:11px; color:var(--bg); opacity:.45; unicode-bidi:plaintext;
}
.sol-journey p{ margin:8px 0 0; font-size:12px; line-height:1.8; color:var(--bg); opacity:.6; }
.sol-journey__ok{
  display:inline-flex; align-items:center; gap:5px;
  margin-top:10px; font-style:normal;
  padding:5px 10px; border-radius:999px;
  background:var(--accent); color:var(--primary);
  font-size:9.5px; font-weight:700;
  unicode-bidi:plaintext;
}
.sol-journey__ok svg{ width:10px; height:10px; }
.sol-journey__end{
  margin:var(--dzf-space-lg) 0 0; text-align:center;
  font-size:1.15rem; font-weight:700; color:var(--accent);
}

/* ---------- پنج نقطه‌ی تماس ---------- */
.sol-touch--5{ grid-template-columns:repeat(5, minmax(0,1fr)); }

/* ---------- هماهنگ شدن کارت محصول ---------- */
.sol-pcards{
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  gap:var(--dzf-space-sm); margin:0; padding:0; list-style:none;
}
.sol-pcard{
  border:1px solid var(--stroke);
  padding:var(--dzf-space-md);
  transition:border-radius .6s ease, padding .6s ease,
             border-color .6s ease, background-color .6s ease;
}
/* ============================================================
   حالت اولیه: سه کارت، سه سلیقه‌ی متفاوت

   نکته‌ی مهم درباره‌ی رنگ‌ها:
   رنگ‌های این سه کارت عمداً بیرون از پالت دیزیفی‌اند. این تنها جای
   سایت است که چنین چیزی درست است، چون اینجا برند دیزیفی را نشان
   نمی‌دهیم — «برندِ خرابِ یک مشتری» را نشان می‌دهیم. اگر هر سه کارت
   با پالت خودمان ساخته می‌شدند، هر سه شبیه هم و مرتب می‌شدند و
   دمو دقیقاً همان چیزی را که می‌خواهد ثابت کند از دست می‌داد.

   با یک کلیک، همه‌ی این‌ها به پالت رسمی برمی‌گردند — و آن لحظه،
   پیامِ کل بخش است.
   ============================================================ */

/* کارت ۱ — آبی سرد، گوشه‌ی تیز، دکمه‌ی توپُر */
.sol-pcard--a{
  border-radius:6px;
  background:#EEF2F7; border-color:#C9D6E4;
}
/* کارت ۲ — سبز زیتونی، گوشه‌ی خیلی گرد، دکمه‌ی توخالی */
.sol-pcard--b{
  border-radius:24px; padding:12px;
  background:#F1F4EC; border-color:#CFDAC0;
}
/* کارت ۳ — بژ گرم، گوشه‌ی متوسط، دکمه‌ی کم‌رنگ */
.sol-pcard--c{
  border-radius:14px; padding:26px;
  background:#FAF3EA; border-color:#E4D3BC;
}

/* بعد از اعمال قوانین: هر سه دقیقاً یکی — پالت رسمی، بدون استثنا */
.sol-sync.is-synced .sol-pcard{
  border-radius:20px; padding:var(--dzf-space-md);
  background:var(--white); border-color:var(--accent);
}

.sol-pcard__img{
  display:block; height:96px; margin-bottom:12px;
  background:var(--bg);
  transition:border-radius .6s ease, background-color .6s ease, height .6s ease;
}
/* حتی قاب تصویر هم ارتفاع و گردی خودش را دارد */
.sol-pcard--a .sol-pcard__img{ border-radius:4px;  height:104px; background:#DCE5EE; }
.sol-pcard--b .sol-pcard__img{ border-radius:20px; height:88px;  background:#DFE8D2; }
.sol-pcard--c .sol-pcard__img{ border-radius:10px; height:96px;  background:#EFE0CB; }
.sol-sync.is-synced .sol-pcard__img{
  border-radius:14px; height:96px; background:var(--bg);
}

.sol-pcard b{
  display:block; font-size:14.5px; color:var(--primary);
  transition:color .6s ease, font-size .6s ease;
}
/* اندازه و رنگ عنوان هم یکدست نیست */
.sol-pcard--a b{ font-size:13px;   color:#2C4A6B; }
.sol-pcard--b b{ font-size:15.5px; color:#4A5D34; }
.sol-pcard--c b{ font-size:14px;   color:#6B4A2C; }
.sol-sync.is-synced .sol-pcard b{ font-size:14.5px; color:var(--primary); }

.sol-pcard__price{
  display:block; margin-top:4px;
  font-size:12.5px; color:var(--dzf-muted-2);
  transition:color .6s ease;
}
.sol-pcard--a .sol-pcard__price{ color:#6E8299; }
.sol-pcard--b .sol-pcard__price{ color:#7E8C6A; }
.sol-pcard--c .sol-pcard__price{ color:#9A8266; }
.sol-sync.is-synced .sol-pcard__price{ color:var(--dzf-muted-2); }

.sol-pcard__btn{
  display:inline-block; margin-top:12px; font-style:normal;
  font-size:12px; font-weight:700;
  transition:background-color .6s ease, color .6s ease,
             border-radius .6s ease, border-color .6s ease;
}
/* سه دکمه، سه سلیقه */
.sol-pcard--a .sol-pcard__btn{
  padding:8px 16px; border-radius:4px;
  background:#2C4A6B; color:#EEF2F7; border:1.5px solid #2C4A6B;
}
.sol-pcard--b .sol-pcard__btn{
  padding:8px 16px; border-radius:999px;
  background:transparent; color:#4A5D34; border:1.5px solid #A8BC8C;
}
.sol-pcard--c .sol-pcard__btn{
  padding:8px 16px; border-radius:10px;
  background:#E4D3BC; color:#6B4A2C; border:1.5px solid #E4D3BC;
}
.sol-sync.is-synced .sol-pcard__btn{
  padding:9px 20px; border-radius:999px;
  background:var(--accent); color:var(--primary); border:1.5px solid var(--accent);
}
/* بعد از هماهنگی، متن دکمه هم یکی می‌شود */
.sol-sync.is-synced .sol-pcard__btn{ font-size:0; }
.sol-sync.is-synced .sol-pcard__btn::after{ content:"افزودن به سبد"; font-size:12px; }


/* ============================================================
   بلوک‌های صنف «تولیدکنندگان»
   ============================================================ */

/* ---------- هرو: خط تولید ---------- */
.sol-line{
  background:var(--primary); border-radius:24px;
  padding:var(--dzf-space-md);
}
.sol-line__core{
  display:flex; align-items:center; gap:12px;
  padding:14px var(--dzf-space-sm); border-radius:18px;
  background:var(--accent);
  margin-bottom:var(--dzf-space-md);
}
.sol-line__core span{ display:flex; color:var(--primary); }
.sol-line__core svg{ width:24px; height:24px; }
.sol-line__core strong{ font-size:15px; color:var(--primary); unicode-bidi:plaintext; }

.sol-line__belt{
  display:grid; grid-template-columns:repeat(5, minmax(0,1fr));
  gap:8px; margin:0; padding:0; list-style:none;
}
.sol-line__belt li{
  position:relative; text-align:center;
  padding:12px 6px; border-radius:16px;
  background:rgba(226,227,231,.08);
  border:1px solid rgba(226,227,231,.18);
  opacity:0; transform:translateY(12px);
  transition:opacity .5s ease, transform .5s ease;
  transition-delay:var(--i, 0ms);
}
.sol-line.is-in .sol-line__belt li{ opacity:1; transform:none; }
/* آخرین ایستگاه، مقصد است */
.sol-line__belt li:last-child{ background:var(--accent); border-color:var(--accent); }
/* ساقه‌ی اتصال به هسته */
.sol-line__stem{
  display:block; width:2px; height:10px;
  background:var(--accent); margin:-22px auto 10px;
}
.sol-line__ico{
  display:flex; align-items:center; justify-content:center;
  width:34px; height:34px; margin:0 auto 8px;
  border-radius:12px; background:rgba(226,227,231,.12); color:var(--bg);
}
.sol-line__belt li:last-child .sol-line__ico{ background:var(--white); color:var(--primary); }
.sol-line__ico svg{ width:17px; height:17px; }
.sol-line__belt strong{ display:block; font-size:12.5px; color:var(--white); }
.sol-line__belt li:last-child strong{ color:var(--primary); }
.sol-line__en{ display:block; font-size:10px; color:var(--bg); opacity:.5; unicode-bidi:plaintext; }
.sol-line__belt li:last-child .sol-line__en{ color:var(--primary); opacity:.6; }
.sol-line__tag{
  display:block; margin-top:var(--dzf-space-sm); text-align:center;
  font-size:12px; color:var(--bg); opacity:.6;
}

/* ---------- اکوسیستم محصول ---------- */
.sol-eco-sec{ background:var(--primary); }
.sol-eco{ max-width:900px; margin:0 auto; }
.sol-eco__hub{
  display:flex; flex-direction:column; align-items:center; gap:4px;
  width:172px; margin:0 auto;
  padding:var(--dzf-space-sm); border-radius:20px;
  background:var(--accent); color:var(--primary); text-align:center;
  transform:scale(.9); opacity:0;
  transition:transform .6s cubic-bezier(.22,.8,.28,1), opacity .5s ease;
}
.sol-eco.is-in .sol-eco__hub{ transform:scale(1); opacity:1; }
.sol-eco__hub > span{ display:flex; }
.sol-eco__hub svg{ width:28px; height:28px; }
.sol-eco__hub strong{ font-size:15px; }
.sol-eco__hub em{ font-style:normal; font-size:11px; opacity:.6; unicode-bidi:plaintext; }

.sol-eco__rail{
  display:block; width:2px; height:26px; margin:0 auto;
  background:rgba(226,227,231,.28);
  transform:scaleY(0); transform-origin:top;
  transition:transform .5s ease .25s;
}
.sol-eco.is-in .sol-eco__rail{ transform:scaleY(1); }
.sol-eco__rail--down{ transition-delay:.9s; }

.sol-eco__ring{
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  gap:12px; margin:0; padding:0; list-style:none;
}
.sol-eco__ring li{
  position:relative; text-align:center;
  padding:var(--dzf-space-sm); border-radius:18px;
  background:rgba(226,227,231,.08);
  border:1px solid rgba(226,227,231,.18);
  opacity:0; transform:translateY(14px);
  transition:opacity .5s ease, transform .5s ease, border-color .22s ease;
  transition-delay:var(--i, 0ms);
}
.sol-eco.is-in .sol-eco__ring li{ opacity:1; transform:none; }
.sol-eco__ring li:hover{ border-color:var(--accent); }
.sol-eco__stem{
  display:block; width:2px; height:10px;
  background:var(--accent); margin:-22px auto 10px;
}
.sol-eco__ico{
  display:flex; align-items:center; justify-content:center;
  width:38px; height:38px; margin:0 auto 8px;
  border-radius:14px; background:rgba(226,227,231,.12); color:var(--bg);
}
.sol-eco__ico svg{ width:19px; height:19px; }
.sol-eco__ring strong{ display:block; font-size:13.5px; color:var(--white); }
.sol-eco__en{ display:block; font-size:10.5px; color:var(--bg); opacity:.5; unicode-bidi:plaintext; }

.sol-eco__core{
  display:flex; flex-direction:column; align-items:center; gap:4px;
  padding:var(--dzf-space-md); border-radius:20px;
  background:var(--accent); color:var(--primary); text-align:center;
  opacity:0; transform:translateY(14px);
  transition:opacity .5s ease 1.1s, transform .5s ease 1.1s;
}
.sol-eco.is-in .sol-eco__core{ opacity:1; transform:none; }
.sol-eco__core > span{ display:flex; }
.sol-eco__core svg{ width:26px; height:26px; }
.sol-eco__core strong{ font-size:1.05rem; unicode-bidi:plaintext; }
.sol-eco__core em{ font-style:normal; font-size:12.5px; opacity:.7; }
.sol-eco__note{
  margin:var(--dzf-space-lg) auto 0; max-width:64ch; text-align:center;
  font-size:15px; line-height:2; color:var(--bg); opacity:.72;
}

/* ---------- هماهنگ شدن بسته‌بندی ---------- */
.sol-packs{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  gap:var(--dzf-space-sm); margin:0; padding:0; list-style:none;
}
.sol-pack{
  border:1px solid var(--stroke); border-radius:18px;
  padding:var(--dzf-space-md); text-align:center;
  transition:border-color .6s ease, border-radius .6s ease;
}
.sol-sync.is-synced .sol-pack{ border-color:var(--accent); border-radius:20px; }

/* حالت اولیه: هر سری نسخه‌ی خودش را دارد — همه از پالت */
.sol-pack__box{
  position:relative; display:block; height:104px;
  margin-bottom:12px; overflow:hidden;
  transition:background-color .6s ease, border-radius .6s ease;
}
.sol-pack__lid{
  position:absolute; inset-inline:0; height:2px; background:var(--stroke);
  transition:top .6s ease;
}
.sol-pack__mark{
  position:absolute; display:block;
  transition:all .6s cubic-bezier(.22,.8,.28,1);
}
.sol-pack--a .sol-pack__box{ background:var(--bg);          border-radius:4px; }
.sol-pack--b .sol-pack__box{ background:var(--primary);     border-radius:24px; }
.sol-pack--c .sol-pack__box{ background:var(--dzf-muted-3); border-radius:10px; }
.sol-pack--d .sol-pack__box{ background:var(--bg);          border-radius:16px; }
.sol-pack--a .sol-pack__lid{ top:22px; }
.sol-pack--b .sol-pack__lid{ top:40px; }
.sol-pack--c .sol-pack__lid{ top:30px; }
.sol-pack--d .sol-pack__lid{ top:56px; }
.sol-pack--a .sol-pack__mark{ inset-inline-start:14px; top:46px; width:28px; height:28px; border-radius:4px;   background:var(--primary); }
.sol-pack--b .sol-pack__mark{ inset-inline-end:16px;   top:58px; width:36px; height:36px; border-radius:999px; background:var(--accent); }
.sol-pack--c .sol-pack__mark{ inset-inline-start:50%;  top:56px; width:32px; height:22px; margin-inline-start:-16px; border-radius:6px; background:var(--white); }
.sol-pack--d .sol-pack__mark{ inset-inline-start:18px; top:24px; width:24px; height:40px; border-radius:12px;  background:var(--primary); }

.sol-sync.is-synced .sol-pack__box{ background:var(--bg); border-radius:14px; }
.sol-sync.is-synced .sol-pack__lid{ top:30px; }
.sol-sync.is-synced .sol-pack__mark{
  inset-inline-start:50%; inset-inline-end:auto; top:50%;
  width:34px; height:34px; margin:-8px 0 0 -17px;
  border-radius:12px; background:var(--accent);
}

.sol-pack strong{ display:block; font-size:14px; color:var(--primary); }
.sol-pack__en{ display:block; font-size:11px; color:var(--dzf-muted-3); unicode-bidi:plaintext; }
.sol-pack__stamp{
  display:inline-flex; align-items:center; gap:5px;
  margin-top:10px; font-style:normal;
  padding:5px 12px; border-radius:999px;
  background:var(--primary); color:var(--accent);
  font-size:10px; font-weight:700; unicode-bidi:plaintext;
  opacity:0; transform:scale(.86);
  transition:opacity .45s ease, transform .45s cubic-bezier(.22,.8,.28,1);
}
.sol-sync.is-synced .sol-pack__stamp{ opacity:1; transform:none; }
.sol-pack__stamp svg{ width:10px; height:10px; }

/* ---------- قبل/بعد با دو فهرست هم‌وزن ---------- */
.sol-ba--even{ grid-template-columns:1fr auto 1fr; }
.sol-ba__list{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:10px; }
.sol-ba__list li{
  padding:12px var(--dzf-space-sm); border-radius:14px;
  background:var(--bg);
  font-size:13.5px; line-height:1.85; color:var(--dzf-muted);
}

/* ============================================================
   بلوک‌های صنف «کافه‌ها و رستوران‌ها»
   ============================================================ */

/* ---------- هرو: فنجان و بخار ---------- */
.sol-cup{
  position:relative;
  display:flex; flex-direction:column; align-items:center;
  background:var(--primary); border-radius:24px;
  padding:var(--dzf-space-md);
}
.sol-cup__art{ width:100%; max-width:300px; height:auto; display:block; }
.sol-cup__steam path{
  stroke-dasharray:120; stroke-dashoffset:120; opacity:0;
  transition:stroke-dashoffset 1.4s cubic-bezier(.22,.8,.28,1), opacity .6s ease;
}
.sol-cup.is-in .sol-cup__steam path{ stroke-dashoffset:0; opacity:.85; }
.sol-cup.is-in .sol-cup__steam path:nth-child(2){ transition-delay:.18s; }
.sol-cup.is-in .sol-cup__steam path:nth-child(3){ transition-delay:.36s; }
.sol-cup__mark{ opacity:0; transition:opacity .5s ease .5s; }
.sol-cup.is-in .sol-cup__mark{ opacity:1; }

.sol-cup__dna{
  display:inline-flex; align-items:center; gap:8px;
  margin-top:var(--dzf-space-sm);
  padding:9px 20px; border-radius:999px;
  background:var(--accent); color:var(--primary);
  font-size:13px; font-weight:700; unicode-bidi:plaintext;
  opacity:0; transform:translateY(8px);
  transition:opacity .6s ease 1.1s, transform .6s ease 1.1s;
}
.sol-cup.is-in .sol-cup__dna{ opacity:1; transform:none; }
.sol-cup__dna span{ display:flex; }
.sol-cup__dna svg{ width:16px; height:16px; }
.sol-cup__tag{
  margin-top:12px; text-align:center;
  font-size:12px; color:var(--bg); opacity:.6;
}

/* ---------- یک روز از زندگی برند ---------- */
.sol-day-sec{ background:var(--white); }

/* ------------------------------------------------------------
   یک روز از زندگی برند

   محور، ساعت است نه قیف خرید: کافه در هر بازه یک حالت متفاوت
   دارد و دارایی متفاوتی لازم دارد، ولی هر چهار حالت از یک هسته
   می‌آیند.

   چیدمان: چهار کارت هم‌ارتفاع، و زیرشان یک سکوی تیره‌ی یکپارچه.
   نسخه‌ی قبل یک قاب زردِ خالی بود با خط‌های عمودی آویزان از هر
   کارت — خط‌ها به جایی نمی‌رسیدند و قاب چیزی را حمل نمی‌کرد.
   حالا خودِ سکو نقش اتصال را بازی می‌کند: کارت‌ها روی آن نشسته‌اند.
   ------------------------------------------------------------ */
.sol-day{ position:relative; }
.sol-day__steps{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  gap:12px; margin:0 0 12px; padding:0; list-style:none;
  align-items:stretch;
}
.sol-day__steps li{
  display:flex; flex-direction:column;
  border:1px solid var(--stroke); border-radius:20px;
  padding:var(--dzf-space-md);
  opacity:0; transform:translateY(14px);
  transition:opacity .55s ease, transform .55s ease, border-color .22s ease;
  transition-delay:var(--i, 0ms);
}
.sol-day.is-in .sol-day__steps li{ opacity:1; transform:none; }
.sol-day__steps li:hover{ border-color:var(--primary); }

/* گذر نور از صبح تا شب — فقط با پالت رسمی */
.sol-day__steps li:nth-child(1){ background:var(--white); }
.sol-day__steps li:nth-child(2){ background:var(--white); border-color:var(--dzf-muted-3); }
.sol-day__steps li:nth-child(3){ background:var(--bg); border-color:var(--bg); }
.sol-day__steps li:nth-child(4){ background:var(--primary); border-color:var(--primary); }

/* بازه‌ی ساعت — سطر اول، تنها و آرام */
.sol-day__hour{
  display:block; margin-bottom:14px;
  font-size:12px; font-weight:700; letter-spacing:.02em;
  color:var(--dzf-muted-3); unicode-bidi:plaintext;
}
.sol-day__steps li:nth-child(4) .sol-day__hour{ color:var(--bg); opacity:.5; }

/* آیکون و نام، کنار هم — نه دو سطر جدا با فضای خالی وسط */
.sol-day__id{ display:flex; align-items:center; gap:11px; }
.sol-day__ico{
  display:flex; align-items:center; justify-content:center;
  width:38px; height:38px; flex-shrink:0;
  border-radius:12px; background:var(--bg); color:var(--primary);
}
.sol-day__steps li:nth-child(1) .sol-day__ico{ background:var(--accent); }
.sol-day__steps li:nth-child(3) .sol-day__ico{ background:var(--white); }
.sol-day__steps li:nth-child(4) .sol-day__ico{ background:var(--accent); }
.sol-day__ico svg{ width:19px; height:19px; }
.sol-day__name{ display:block; min-width:0; }
.sol-day__steps strong{ display:block; font-size:15.5px; color:var(--primary); }
.sol-day__en{ display:block; font-size:11px; color:var(--dzf-muted-3); unicode-bidi:plaintext; }
.sol-day__steps p{ margin:12px 0 0; font-size:13px; line-height:1.9; color:var(--dzf-muted-2); }
.sol-day__steps li:nth-child(4) strong{ color:var(--white); }
.sol-day__steps li:nth-child(4) .sol-day__en{ color:var(--bg); opacity:.5; }
.sol-day__steps li:nth-child(4) p{ color:var(--bg); opacity:.62; }

/* دارایی‌های همان ساعت — همیشه چسبیده به کف کارت، پس چهار کارت
   با متن‌های نابرابر هم مرتب می‌مانند */
.sol-day__assets{
  display:flex; flex-wrap:wrap; gap:6px;
  margin:auto 0 0; padding:14px 0 0; list-style:none;
}
/* این چیپ‌ها نام دارایی واقعی‌اند، نه برچسب تزئینی — پس باید
   خوانده شوند.

   چیپِ توخالی روی هر چهار پس‌زمینه جواب نمی‌داد: روی کارت‌های روشن
   کم‌رنگ می‌افتاد و روی کارت شب، متن روشن روی زمینه‌ی تیره با
   حاشیه‌ی کم‌رنگ، اصلاً خوانده نمی‌شد.

   قاعده‌ی جدید ساده و ثابت است: چیپ همیشه پُر است و متنش همیشه
   #21242A. فقط رنگِ پُرکننده عوض می‌شود تا روی هر کارت دیده شود. */
.sol-day__assets li{
  padding:6px 12px; border-radius:999px;
  background:var(--bg); border:1px solid transparent;
  font-size:11.5px; font-weight:700; color:var(--primary);
  white-space:nowrap;
}
/* کارت عصر خودش خاکستری است → چیپ سفید */
.sol-day__steps li:nth-child(3) .sol-day__assets li{ background:var(--white); }
/* کارت شب تیره است → چیپ سفید، متن همان #21242A */
.sol-day__steps li:nth-child(4) .sol-day__assets li{
  background:var(--white); color:var(--primary);
}

/* ---------- سکوی ثابت ---------- */
.sol-day__base{
  display:flex; align-items:center; gap:14px;
  padding:16px var(--dzf-space-md);
  border-radius:20px; background:var(--primary);
  opacity:0; transform:translateY(10px);
  transition:opacity .55s ease .55s, transform .55s ease .55s;
}
.sol-day.is-in .sol-day__base{ opacity:1; transform:none; }
.sol-day__baseico{
  display:flex; align-items:center; justify-content:center;
  width:42px; height:42px; flex-shrink:0;
  border-radius:13px; background:var(--accent); color:var(--primary);
}
.sol-day__baseico svg{ width:22px; height:22px; }
.sol-day__basetxt{ flex:1; min-width:0; }
.sol-day__base strong{ display:block; font-size:1.02rem; color:var(--white); unicode-bidi:plaintext; }
.sol-day__base em{ display:block; margin-top:2px; font-style:normal; font-size:12.5px; color:var(--bg); opacity:.6; }
/* چهار چیزی که ثابت می‌مانند، به‌صورت برچسب — تا «ثابت» یک ادعا
   نماند و شمردنی شود */
.sol-day__fixed{
  display:flex; flex-wrap:wrap; gap:6px; margin:0; padding:0; list-style:none;
}
.sol-day__fixed li{
  padding:5px 13px; border-radius:999px;
  border:1px solid rgba(252,193,1,.45);
  font-size:11.5px; font-weight:700; color:var(--accent);
  white-space:nowrap;
}


/* ============================================================
   بلوک مشترک: سلامت برند (سه صنف پوشاک، زیبایی و باشگاه)
   ============================================================ */
.sol-meter{
  display:grid; grid-template-columns:repeat(2, minmax(0,1fr));
  gap:var(--dzf-space-md) var(--dzf-space-lg);
  margin:0; padding:0; list-style:none;
}
.sol-meter li{
  display:grid; grid-template-columns:1fr auto; gap:6px 12px;
  align-items:center;
}
.sol-meter__k{ font-size:14px; font-weight:600; color:var(--primary); }
.sol-meter__v{
  font-size:1.25rem; font-weight:800; color:var(--primary);
  unicode-bidi:plaintext;
}
.sol-meter__bar{
  grid-column:1 / -1;
  display:block; height:8px; border-radius:999px;
  background:var(--bg); overflow:hidden;
}
.sol-meter__bar i{
  display:block; height:100%; width:0; border-radius:999px;
  background:var(--accent);
  transition:width 1.2s cubic-bezier(.22,.8,.28,1);
  transition-delay:var(--i, 0ms);
}
.sol-meter.is-in .sol-meter__bar i{ width:var(--v, 0%); }
/* روی زمینه‌ی تیره */
.sol-meter--light .sol-meter__k{ color:var(--white); }
.sol-meter--light .sol-meter__v{ color:var(--accent); }
.sol-meter--light .sol-meter__bar{ background:rgba(226,227,231,.14); }

/* گونه‌های شمارشی مشترک */
.sol-touch--7{ grid-template-columns:repeat(7, minmax(0,1fr)); }
.sol-journey--5{ grid-template-columns:repeat(5, minmax(0,1fr)); }

/* ============================================================
   بلوک‌های صنف «پوشاک و مد»
   ============================================================ */

/* ---------- هرو: برند از اجزا ساخته می‌شود ---------- */
.sol-kit{
  background:var(--primary); border-radius:24px;
  padding:var(--dzf-space-md);
}
.sol-kit__label{
  position:relative;
  display:flex; flex-direction:column; align-items:center; gap:2px;
  width:180px; margin:0 auto var(--dzf-space-md);
  padding:var(--dzf-space-sm) var(--dzf-space-sm) 14px;
  border-radius:18px; background:var(--accent); color:var(--primary);
  text-align:center;
  transform:scale(.88); opacity:0;
  transition:transform .7s cubic-bezier(.22,.8,.28,1), opacity .5s ease;
}
.sol-kit.is-in .sol-kit__label{ transform:scale(1); opacity:1; }
/* سوراخ تگ لباس */
.sol-kit__hole{
  display:block; width:12px; height:12px; margin-bottom:8px;
  border-radius:999px; border:2px solid var(--primary); opacity:.35;
}
.sol-kit__label strong{ font-size:16px; unicode-bidi:plaintext; }
.sol-kit__label em{ font-style:normal; font-size:11px; opacity:.62; unicode-bidi:plaintext; }

.sol-kit__parts{
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  gap:10px; margin:0; padding:0; list-style:none;
}
.sol-kit__parts li{
  text-align:center;
  padding:12px 8px; border-radius:16px;
  background:rgba(226,227,231,.08);
  border:1px solid rgba(226,227,231,.18);
  opacity:0; transform:translateY(14px);
  transition:opacity .5s ease, transform .5s ease, border-color .22s ease;
  transition-delay:var(--i, 0ms);
}
.sol-kit.is-in .sol-kit__parts li{ opacity:1; transform:none; }
.sol-kit__parts li:hover{ border-color:var(--accent); }
.sol-kit__ico{
  display:flex; align-items:center; justify-content:center;
  width:34px; height:34px; margin:0 auto 8px;
  border-radius:12px; background:rgba(226,227,231,.12); color:var(--bg);
}
.sol-kit__ico svg{ width:17px; height:17px; }
.sol-kit__parts strong{ display:block; font-size:12.5px; color:var(--white); }
.sol-kit__en{ display:block; font-size:10px; color:var(--bg); opacity:.5; unicode-bidi:plaintext; }
.sol-kit__tag{
  display:block; margin-top:var(--dzf-space-sm); text-align:center;
  font-size:12px; color:var(--bg); opacity:.6;
}

/* ---------- فایل‌های پراکنده → کتابخانه‌ی برند ---------- */
.sol-files{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  gap:var(--dzf-space-sm); margin:0; padding:0; list-style:none;
}
.sol-file{
  display:flex; flex-direction:column; align-items:flex-start; gap:10px;
  padding:var(--dzf-space-md); border-radius:18px;
  border:1px solid var(--stroke); background:var(--white);
  transition:transform .6s cubic-bezier(.22,.8,.28,1), border-color .6s ease;
}
/* قبل: هر فایل کج و بی‌نظم افتاده است */
.sol-file--a{ transform:rotate(-2.2deg); }
.sol-file--b{ transform:rotate(1.6deg)  translateY(10px); }
.sol-file--c{ transform:rotate(-1.1deg) translateY(-6px); }
.sol-file--d{ transform:rotate(2.4deg); }
.sol-sync.is-synced .sol-file{ transform:none; border-color:var(--accent); }

.sol-file__ico{
  display:flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:12px;
  background:var(--bg); color:var(--dzf-muted-2);
  transition:background-color .6s ease, color .6s ease;
}
.sol-sync.is-synced .sol-file__ico{ background:var(--accent); color:var(--primary); }
.sol-file__ico svg{ width:19px; height:19px; }
.sol-file__n{
  font-size:12.5px; font-weight:600; color:var(--dzf-muted-2);
  unicode-bidi:plaintext; word-break:break-all;
  transition:color .6s ease;
}
.sol-sync.is-synced .sol-file__n{ color:var(--dzf-muted-3); }
.sol-file__to{
  font-style:normal; font-size:0; font-weight:700;
  padding:0; border-radius:999px; background:var(--primary); color:var(--bg);
  opacity:0; transform:translateY(6px);
  transition:opacity .5s ease, transform .5s ease, padding .5s ease;
}
.sol-sync.is-synced .sol-file__to{
  font-size:11px; padding:6px 14px; opacity:1; transform:none;
}

/* ---------- کالکشن‌ها در گذر فصل ---------- */
.sol-coll{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  gap:12px; margin:0; padding:var(--dzf-space-md) 0 0;
  list-style:none; position:relative;
}
/* ریل فصل‌ها */
.sol-coll::before{
  content:""; position:absolute; top:7px; right:0; left:0; height:2px;
  background:var(--stroke);
}
.sol-coll::after{
  content:""; position:absolute; top:7px; right:0; height:2px;
  width:100%; background:var(--accent);
  transform:scaleX(0); transform-origin:right;
  transition:transform 1.6s cubic-bezier(.22,.8,.28,1);
}
.sol-coll.is-in::after{ transform:scaleX(1); }

.sol-coll li{
  position:relative; padding-top:var(--dzf-space-md);
  opacity:0; transform:translateY(14px);
  transition:opacity .55s ease, transform .55s ease;
  transition-delay:var(--i, 0ms);
}
.sol-coll.is-in li{ opacity:1; transform:none; }
.sol-coll__dot{
  position:absolute; top:0; inset-inline-start:0;
  width:16px; height:16px; border-radius:999px;
  background:var(--white); border:2px solid var(--accent);
}
.sol-coll li:last-child .sol-coll__dot{ background:var(--accent); }
.sol-coll__card{
  border:1px solid var(--stroke); border-radius:20px;
  padding:var(--dzf-space-md); height:100%;
  transition:border-color .22s ease;
}
.sol-coll li:hover .sol-coll__card{ border-color:var(--primary); }
/* ------------------------------------------------------------
   پالت فصل — تنها چیزی که در چهار کارت فرق می‌کند

   کامنت قبلی نوشته بود «فقط ترتیب فرق می‌کند»، ولی در کد هیچ
   تفاوتی نبود: هر چهار نوار عیناً یکی بودند. نتیجه این بود که متن
   بخش می‌گفت «رنگ فصل عوض می‌شود» و طرح خلافش را نشان می‌داد.

   حالا رنگ‌ها همان سه رنگ پالت رسمی‌اند — چیزی که عوض می‌شود
   «وزن» آن‌هاست، دقیقاً همان‌طور که یک برند مد در هر فصل نسبت
   رنگ‌هایش را عوض می‌کند ولی پالت را نه:

     بهار    روشن غالب، یک رگه‌ی زرد
     تابستان زرد غالب
     پاییز   تیره و زرد، متعادل
     زمستان  تیره غالب
   ------------------------------------------------------------ */
.sol-coll__strip{ display:flex; gap:4px; height:34px; }
.sol-coll__strip i{
  border-radius:8px; min-width:8px;
  transition:flex-grow .5s ease;
}
.sol-coll__strip i:nth-child(1){ background:var(--primary); }
.sol-coll__strip i:nth-child(2){ background:var(--accent); }
/* رنگ روشن روی کارت سفید محو می‌شد؛ حاشیه لبه‌اش را برمی‌گرداند */
.sol-coll__strip i:nth-child(3){
  background:var(--bg); border:1px solid var(--stroke);
}

.sol-coll li:nth-child(1) .sol-coll__strip i:nth-child(1){ flex:1; }
.sol-coll li:nth-child(1) .sol-coll__strip i:nth-child(2){ flex:1.4; }
.sol-coll li:nth-child(1) .sol-coll__strip i:nth-child(3){ flex:5; }

.sol-coll li:nth-child(2) .sol-coll__strip i:nth-child(1){ flex:1; }
.sol-coll li:nth-child(2) .sol-coll__strip i:nth-child(2){ flex:5; }
.sol-coll li:nth-child(2) .sol-coll__strip i:nth-child(3){ flex:1.6; }

.sol-coll li:nth-child(3) .sol-coll__strip i:nth-child(1){ flex:3.4; }
.sol-coll li:nth-child(3) .sol-coll__strip i:nth-child(2){ flex:2.6; }
.sol-coll li:nth-child(3) .sol-coll__strip i:nth-child(3){ flex:1; }

.sol-coll li:nth-child(4) .sol-coll__strip i:nth-child(1){ flex:5; }
.sol-coll li:nth-child(4) .sol-coll__strip i:nth-child(2){ flex:1; }
.sol-coll li:nth-child(4) .sol-coll__strip i:nth-child(3){ flex:1.6; }

.sol-coll__cap{
  display:block; margin:7px 0 14px;
  font-size:10.5px; font-weight:700; letter-spacing:.02em;
  color:var(--dzf-muted-3);
}

.sol-coll__season{
  display:block; font-size:11.5px; font-weight:700;
  color:var(--dzf-muted-3); unicode-bidi:plaintext;
}
.sol-coll__card strong{ display:block; margin-top:2px; font-size:15px; color:var(--primary); }
.sol-coll__card p{ margin:8px 0 0; font-size:12.5px; line-height:1.85; color:var(--dzf-muted-2); }

/* ------------------------------------------------------------
   نیمه‌ی ثابت کارت — عیناً در هر چهار فصل
   خط بالای این ردیف، مرز «آنچه عوض می‌شود / آنچه نمی‌شود» است.
   ------------------------------------------------------------ */
.sol-coll__const{
  display:flex; align-items:center; gap:9px;
  margin-top:var(--dzf-space-sm);
  padding-top:12px;
  border-top:1px solid var(--stroke);
}
/* نشان برند — در هر چهار کارت یکی، بدون هیچ تغییری */
.sol-coll__mark{
  flex-shrink:0; position:relative;
  width:24px; height:24px; border-radius:7px;
  background:var(--primary);
}
.sol-coll__mark::after{
  content:""; position:absolute; inset-inline-end:5px; top:5px;
  width:8px; height:8px; border-radius:999px; background:var(--accent);
}
/* برچسب از قرصِ زردِ توپُر به حاشیه‌دار تغییر کرد: چهار قرص زرد
   کنار چهار نوار زرد، تأکید را خنثی می‌کرد. */
.sol-coll__dna{
  display:inline-flex; align-items:center; gap:5px;
  font-style:normal;
  padding:4px 11px; border-radius:999px;
  border:1px solid var(--accent); color:var(--primary);
  font-size:10px; font-weight:700; unicode-bidi:plaintext;
}
.sol-coll__dna svg{ width:10px; height:10px; color:var(--accent); }
.sol-coll li:hover .sol-coll__dna{ background:var(--accent); }

/* ============================================================
   بلوک‌های صنف «زیبایی و مراقبت شخصی»
   ============================================================ */

/* ---------- هرو: از آشنایی تا وفاداری ---------- */
.sol-funnel{
  background:var(--primary); border-radius:24px;
  padding:var(--dzf-space-md);
}
.sol-funnel__in, .sol-funnel__out{
  display:grid; grid-template-columns:repeat(2, minmax(0,1fr));
  gap:8px; margin:0; padding:0; list-style:none;
}
.sol-funnel__in li, .sol-funnel__out li{
  display:flex; align-items:center; gap:9px;
  padding:11px 12px; border-radius:14px;
  opacity:0; transform:translateY(10px);
  transition:opacity .5s ease, transform .5s ease;
  transition-delay:var(--i, 0ms);
}
.sol-funnel.is-in .sol-funnel__in li,
.sol-funnel.is-in .sol-funnel__out li{ opacity:1; transform:none; }
/* ورودی‌ها: هنوز پراکنده‌اند */
.sol-funnel__in li{
  background:rgba(226,227,231,.08);
  border:1px solid rgba(226,227,231,.18);
}
/* خروجی‌ها: نتیجه‌ی عبور از هسته */
.sol-funnel__out li{ background:var(--accent); }
.sol-funnel__in li span{ display:flex; color:var(--bg); }
.sol-funnel__out li span{ display:flex; color:var(--primary); }
.sol-funnel__in svg, .sol-funnel__out svg{ width:17px; height:17px; }
.sol-funnel__in li strong{ font-size:12.5px; font-weight:600; color:var(--white); }
.sol-funnel__out li strong{ font-size:12.5px; font-weight:700; color:var(--primary); }

.sol-funnel__rail{
  display:block; width:2px; height:22px; margin:12px auto;
  background:rgba(226,227,231,.28);
  transform:scaleY(0); transform-origin:top;
  transition:transform .5s ease .35s;
}
.sol-funnel.is-in .sol-funnel__rail{ transform:scaleY(1); }
.sol-funnel__rail--down{ transition-delay:.75s; }

.sol-funnel__core{
  display:flex; align-items:center; justify-content:center; gap:12px;
  padding:14px var(--dzf-space-sm); border-radius:18px;
  background:var(--white);
  transform:scale(.92); opacity:0;
  transition:transform .6s cubic-bezier(.22,.8,.28,1) .45s, opacity .5s ease .45s;
}
.sol-funnel.is-in .sol-funnel__core{ transform:scale(1); opacity:1; }
.sol-funnel__core span{ display:flex; color:var(--primary); }
.sol-funnel__core svg{ width:24px; height:24px; }
.sol-funnel__core strong{ font-size:15px; color:var(--primary); unicode-bidi:plaintext; }
.sol-funnel__tag{
  display:block; margin-top:var(--dzf-space-sm); text-align:center;
  font-size:12px; color:var(--bg); opacity:.6;
}

/* ---------- نتیجه‌ی نهایی ---------- */
.sol-wins{
  display:grid; grid-template-columns:repeat(5, minmax(0,1fr));
  gap:12px; margin:0; padding:0; list-style:none;
}
.sol-wins li{
  display:flex; flex-direction:column; align-items:flex-start; gap:10px;
  padding:var(--dzf-space-md); border-radius:18px;
  background:rgba(226,227,231,.08);
  border:1px solid rgba(226,227,231,.18);
  font-size:13.5px; line-height:1.75; color:var(--white);
  opacity:0; transform:translateY(12px);
  transition:opacity .5s ease, transform .5s ease;
  transition-delay:var(--i, 0ms);
}
.sol-wins.is-in li{ opacity:1; transform:none; }
.sol-wins li span{
  display:flex; align-items:center; justify-content:center;
  width:30px; height:30px; flex-shrink:0;
  border-radius:999px; background:var(--accent); color:var(--primary);
}
.sol-wins li svg{ width:15px; height:15px; }

/* ============================================================
   بلوک‌های صنف «باشگاه‌های ورزشی»
   ============================================================ */

/* ---------- جامعه‌ی برند: نقطه‌های جدا تا شبکه ---------- */
.sol-net-sec{ background:var(--primary); }
.sol-net svg{ width:100%; height:auto; display:block; }
.sol-net__lines path{
  stroke-dasharray:220; stroke-dashoffset:220;
  transition:stroke-dashoffset 1.1s cubic-bezier(.22,.8,.28,1);
}
.sol-net.is-in .sol-net__lines path{ stroke-dashoffset:0; }
.sol-net.is-in .sol-net__lines path:nth-child(n+4){ transition-delay:.2s; }
.sol-net.is-in .sol-net__lines path:nth-child(n+8){ transition-delay:.4s; }
.sol-net__dots circle{
  opacity:0; transform-box:fill-box; transform-origin:center;
  transform:scale(.4);
  transition:opacity .45s ease, transform .45s cubic-bezier(.22,.8,.28,1);
  transition-delay:var(--i, 0ms);
}
.sol-net.is-in .sol-net__dots circle{ opacity:1; transform:scale(1); }
.sol-net__hub{ opacity:0; transition:opacity .5s ease .95s; }
.sol-net.is-in .sol-net__hub{ opacity:1; }
.sol-net__t{
  font-family:var(--dzf-font); font-size:15px; font-weight:700;
  fill:var(--primary); text-anchor:middle;
}
.sol-net__note{
  margin:var(--dzf-space-md) auto 0; max-width:60ch; text-align:center;
  font-size:15px; line-height:2; color:var(--bg); opacity:.72;
}


/* ============================================================
   بلوک مشترک: چهار ستون سیستم برند
   (سلامت، آموزش، فناوری و خدماتی — هر چهار توضیح همین شکل را می‌خواستند)
   ============================================================ */
.sol-pillars{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  gap:var(--dzf-space-sm); margin:0; padding:0; list-style:none;
}
.sol-pillar{
  display:flex; flex-direction:column;
  border:1px solid var(--stroke); border-radius:20px;
  padding:var(--dzf-space-md); background:var(--white);
  transition:opacity .55s ease, transform .55s ease, border-color .22s ease;
}
.sol-pillar:hover{ border-color:var(--primary); }
.sol-pillar__ico{
  display:flex; align-items:center; justify-content:center;
  width:44px; height:44px; margin-bottom:12px;
  border-radius:14px; background:var(--bg); color:var(--primary);
  transition:background-color .22s ease;
}
.sol-pillar:hover .sol-pillar__ico{ background:var(--accent); }
.sol-pillar__ico svg{ width:21px; height:21px; }
.sol-pillar strong{ display:block; font-size:15.5px; color:var(--primary); }
.sol-pillar__q{
  display:block; margin-top:6px;
  font-size:12.5px; line-height:1.8; color:var(--dzf-muted-2);
}
.sol-pillar__list{
  margin:12px 0 0; padding:12px 0 0; list-style:none;
  border-top:1px dashed var(--stroke);
  display:flex; flex-wrap:wrap; gap:6px;
}
.sol-pillar__list li{
  padding:5px 11px; border-radius:999px; background:var(--bg);
  font-size:11.5px; color:var(--dzf-muted); unicode-bidi:plaintext;
}

/* ============================================================
   بلوک‌های صنف «سلامت و مراقبت»
   ============================================================ */

/* ---------- هرو: نردبان اعتماد ---------- */
.sol-stack{
  background:var(--primary); border-radius:24px;
  padding:var(--dzf-space-md);
}
.sol-stack__rows{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; }
.sol-stack__rows li{
  display:flex; align-items:center; gap:12px;
  padding:12px var(--dzf-space-sm); border-radius:16px;
  background:rgba(226,227,231,.08);
  border:1px solid rgba(226,227,231,.18);
  opacity:0; transform:translateX(18px);
  transition:opacity .5s ease, transform .55s cubic-bezier(.22,.8,.28,1);
  transition-delay:var(--i, 0ms);
}
.sol-stack.is-in .sol-stack__rows li{ opacity:1; transform:none; }
.sol-stack__ico{
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px; flex-shrink:0;
  border-radius:12px; background:rgba(226,227,231,.12); color:var(--bg);
}
.sol-stack__ico svg{ width:18px; height:18px; }
.sol-stack__rows strong{ flex:1; font-size:13.5px; font-weight:600; color:var(--white); }
.sol-stack__ok{
  display:flex; align-items:center; justify-content:center;
  width:22px; height:22px; flex-shrink:0;
  border-radius:999px; background:var(--accent); color:var(--primary);
  opacity:0; transform:scale(.5);
  transition:opacity .35s ease, transform .35s cubic-bezier(.22,.8,.28,1);
  transition-delay:calc(var(--i, 0ms) + 260ms);
}
.sol-stack.is-in .sol-stack__ok{ opacity:1; transform:none; }
.sol-stack__ok svg{ width:12px; height:12px; }
.sol-stack__out{
  display:flex; align-items:center; justify-content:center; gap:10px;
  margin-top:12px; padding:14px var(--dzf-space-sm);
  border-radius:18px; background:var(--accent);
  opacity:0; transform:translateY(10px);
  transition:opacity .5s ease .9s, transform .5s ease .9s;
}
.sol-stack.is-in .sol-stack__out{ opacity:1; transform:none; }
.sol-stack__out span{ display:flex; color:var(--primary); }
.sol-stack__out svg{ width:22px; height:22px; }
.sol-stack__out strong{ font-size:15px; color:var(--primary); unicode-bidi:plaintext; }
.sol-stack__tag{
  display:block; margin-top:var(--dzf-space-sm); text-align:center;
  font-size:12px; color:var(--bg); opacity:.6;
}

/* ============================================================
   بلوک‌های صنف «آموزش و مشاوره»
   ============================================================ */

/* ---------- هرو: درخت دارایی‌های آموزشگاه ---------- */
/* ------------------------------------------------------------
   درخت دارایی‌های آموزشگاه

   دو باگ RTL داشت:

   ۱) تنه‌ی درخت در سمت اشتباه بود. `.sol-tree__branch` فضای خالی را
      با padding فیزیکیِ راست رزرو می‌کرد، ولی خط تنه با
      `inset-inline-start:calc(100% - 20px)` عملاً سمت چپ می‌نشست.
      نتیجه: خط عمودی از وسط کارت‌ها رد می‌شد و فضای رزروشده خالی
      می‌ماند.

   ۲) شاخه‌های افقی با `inset-inline-start:100%` از لبه‌ی *پایانی*
      کارت بیرون می‌زدند، یعنی سمت مخالف تنه. در اسکرین‌شات به
      شکل خط‌های کوتاهِ معلق دیده می‌شدند که به هیچ‌جا وصل نبودند.

   حالا هر دو با خاصیت منطقی نوشته شده‌اند و در RTL درست می‌نشینند:
   تنه سمت راست (همان سمتی که خوانده می‌شود)، شاخه‌ها از لبه‌ی
   راستِ هر کارت به تنه می‌رسند.
   ------------------------------------------------------------ */
.sol-tree{
  background:var(--primary); border-radius:24px;
  padding:var(--dzf-space-md);
}
.sol-tree__root{
  display:flex; align-items:center; gap:12px;
  padding:14px var(--dzf-space-sm); border-radius:18px;
  background:var(--accent); margin-bottom:10px;
  transform:scale(.94); opacity:0;
  transition:transform .6s cubic-bezier(.22,.8,.28,1), opacity .5s ease;
}
.sol-tree.is-in .sol-tree__root{ transform:scale(1); opacity:1; }
.sol-tree__root span{
  display:flex; align-items:center; justify-content:center;
  width:30px; height:30px; flex-shrink:0;
  border-radius:10px; background:var(--primary); color:var(--accent);
}
.sol-tree__root svg{ width:17px; height:17px; }
.sol-tree__root strong{ font-size:15px; color:var(--primary); }

.sol-tree__branch{
  position:relative; margin:0; list-style:none;
  /* گودالِ سمت راست، جای تنه و شاخه‌هاست */
  padding:0; padding-inline-start:26px;
}
/* تنه */
.sol-tree__branch::before{
  content:""; position:absolute; top:-10px; bottom:20px;
  inset-inline-start:11px; width:2px;
  background:rgba(226,227,231,.3);
  transform:scaleY(0); transform-origin:top;
  transition:transform .8s cubic-bezier(.22,.8,.28,1) .2s;
}
.sol-tree.is-in .sol-tree__branch::before{ transform:scaleY(1); }

.sol-tree__branch li{
  position:relative;
  display:flex; align-items:center; gap:11px;
  margin-top:7px; padding:11px var(--dzf-space-sm);
  border-radius:14px;
  background:rgba(226,227,231,.1);
  border:1px solid rgba(226,227,231,.22);
  opacity:0; transform:translateX(14px);
  transition:opacity .45s ease, transform .5s cubic-bezier(.22,.8,.28,1),
             border-color .22s ease, background-color .22s ease;
  transition-delay:var(--i, 0ms);
}
.sol-tree.is-in .sol-tree__branch li{ opacity:1; transform:none; }
.sol-tree__branch li:hover{
  border-color:var(--accent); background:rgba(226,227,231,.16);
}
/* شاخه‌ی افقی: از لبه‌ی آغازینِ کارت تا تنه */
.sol-tree__branch li::before{
  content:""; position:absolute; top:50%;
  inset-inline-end:100%; width:15px; height:2px;
  background:rgba(226,227,231,.3);
}
.sol-tree__ico{
  display:flex; align-items:center; justify-content:center;
  width:34px; height:34px; flex-shrink:0;
  border-radius:11px; background:rgba(226,227,231,.14); color:var(--bg);
  transition:background-color .22s ease, color .22s ease;
}
.sol-tree__branch li:hover .sol-tree__ico{
  background:var(--accent); color:var(--primary);
}
.sol-tree__ico svg{ width:16px; height:16px; }
.sol-tree__branch strong{ display:block; font-size:13px; color:var(--white); }
/* ۵۰٪ شفافیت، لاتینِ ۱۰٫۵px را روی زمینه‌ی تیره تقریباً محو می‌کرد */
.sol-tree__en{
  display:block; font-size:10.5px; color:var(--bg); opacity:.62;
  unicode-bidi:plaintext;
}
.sol-tree__tag{
  display:block; margin-top:var(--dzf-space-sm);
  padding-top:var(--dzf-space-sm);
  border-top:1px solid rgba(226,227,231,.16);
  text-align:center;
  font-size:12px; line-height:1.9; color:var(--bg); opacity:.68;
}

/* ============================================================
   بلوک‌های صنف «فناوری و محصولات دیجیتال»
   ============================================================ */

/* ---------- هرو: Brand OS ---------- */
.sol-os{
  position:relative;
  background:var(--primary); border-radius:24px;
  padding:var(--dzf-space-md);
}
.sol-os__ver{
  position:absolute; top:var(--dzf-space-md); inset-inline-end:var(--dzf-space-md);
  padding:5px 12px; border-radius:999px;
  background:rgba(226,227,231,.1); border:1px solid rgba(226,227,231,.2);
  font-size:10.5px; font-weight:700; color:var(--accent);
  unicode-bidi:plaintext;
}
.sol-os svg{ width:100%; height:auto; display:block; }
.sol-os__edge{
  stroke-dasharray:180; stroke-dashoffset:180;
  transition:stroke-dashoffset 1s cubic-bezier(.22,.8,.28,1);
}
.sol-os.is-in .sol-os__edge{ stroke-dashoffset:0; }
.sol-os.is-in .sol-os__edge:nth-child(2){ transition-delay:.1s; }
.sol-os.is-in .sol-os__edge:nth-child(3){ transition-delay:.2s; }
.sol-os.is-in .sol-os__edge:nth-child(4){ transition-delay:.3s; }
.sol-os__node{
  opacity:0; transform-box:fill-box; transform-origin:center; transform:scale(.7);
  transition:opacity .45s ease, transform .45s cubic-bezier(.22,.8,.28,1);
  transition-delay:var(--i, 0ms);
}
.sol-os.is-in .sol-os__node{ opacity:1; transform:scale(1); }
.sol-os__core{
  opacity:0; transform-box:fill-box; transform-origin:center; transform:scale(.8);
  transition:opacity .5s ease .55s, transform .5s cubic-bezier(.22,.8,.28,1) .55s;
}
.sol-os.is-in .sol-os__core{ opacity:1; transform:scale(1); }
/* حلقه‌ی تپش هسته — بدون درخشش، فقط تغییر مقیاس و شفافیت */
@keyframes dzf-os-pulse{
  0%   { transform:scale(1);    opacity:.5; }
  70%  { transform:scale(1.32); opacity:0;  }
  100% { transform:scale(1.32); opacity:0;  }
}
.sol-os__pulse{
  transform-box:fill-box; transform-origin:center;
  opacity:0;
}
.sol-os.is-in .sol-os__pulse{ animation:dzf-os-pulse 2.6s ease-out 1.1s infinite; }
.sol-os__t{
  font-family:var(--dzf-font); font-size:13px; font-weight:700;
  fill:var(--bg); text-anchor:middle;
}
.sol-os__t--core{ font-size:15px; fill:var(--primary); }
.sol-os__tag{
  display:block; margin-top:var(--dzf-space-sm); text-align:center;
  font-size:12px; color:var(--bg); opacity:.6;
}

/* ---------- Digital Twin ---------- */
.sol-twin-sec{ background:var(--primary); }
.sol-twin{
  display:grid; grid-template-columns:1fr auto 1fr;
  gap:var(--dzf-space-md); align-items:center;
}
.sol-twin__side{
  border-radius:24px; padding:var(--dzf-space-lg);
  border:1px solid rgba(226,227,231,.18);
}
.sol-twin__side--twin{ background:var(--accent); border-color:var(--accent); }
.sol-twin__k{
  display:inline-block; margin-bottom:var(--dzf-space-md);
  padding:5px 14px; border-radius:999px;
  background:rgba(226,227,231,.1);
  font-size:11.5px; font-weight:700; color:var(--bg); unicode-bidi:plaintext;
}
.sol-twin__side--twin .sol-twin__k{ background:var(--primary); color:var(--accent); }
.sol-twin__rows{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; }
.sol-twin__rows li{
  display:flex; align-items:center; gap:10px;
  padding:11px 14px; border-radius:14px;
  background:rgba(226,227,231,.08);
  font-size:13px; color:var(--bg); unicode-bidi:plaintext;
  opacity:0; transform:translateY(10px);
  transition:opacity .45s ease, transform .45s ease;
  transition-delay:var(--i, 0ms);
}
.sol-twin.is-in .sol-twin__rows li{ opacity:1; transform:none; }
.sol-twin__side--twin .sol-twin__rows li{
  background:var(--white); color:var(--primary); font-weight:600;
}
.sol-twin__rows li i{
  display:block; width:6px; height:6px; flex-shrink:0;
  border-radius:999px; background:var(--accent);
}
.sol-twin__side--twin .sol-twin__rows li i{ background:var(--primary); }

/* خط داده بین برند واقعی و دوقلوی دیجیتال */
.sol-twin__wire{
  position:relative; align-self:stretch;
  width:44px; min-height:180px;
  display:flex; align-items:center; justify-content:center;
}
.sol-twin__wire::before{
  content:""; position:absolute; top:12%; bottom:12%; width:2px;
  background:rgba(226,227,231,.24);
}
@keyframes dzf-wire{
  0%   { top:12%;  opacity:0; }
  12%  { opacity:1; }
  88%  { opacity:1; }
  100% { top:88%;  opacity:0; }
}
.sol-twin__wire i{
  position:absolute; width:9px; height:9px; border-radius:999px;
  background:var(--accent); opacity:0;
}
.sol-twin.is-in .sol-twin__wire i{ animation:dzf-wire 2.4s ease-in-out infinite; }
.sol-twin.is-in .sol-twin__wire i:nth-child(2){ animation-delay:.8s; }
.sol-twin.is-in .sol-twin__wire i:nth-child(3){ animation-delay:1.6s; }
.sol-twin__note{
  margin:var(--dzf-space-lg) auto 0; max-width:64ch; text-align:center;
  font-size:15px; line-height:2; color:var(--bg); opacity:.72;
}

/* ---------- تکامل نسخه‌ها ---------- */
.sol-ver{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  gap:12px; margin:0; padding:var(--dzf-space-md) 0 0;
  list-style:none; position:relative;
}
.sol-ver::before{
  content:""; position:absolute; top:7px; right:0; left:0; height:2px;
  background:var(--stroke);
}
.sol-ver::after{
  content:""; position:absolute; top:7px; right:0; height:2px;
  width:100%; background:var(--accent);
  transform:scaleX(0); transform-origin:right;
  transition:transform 1.6s cubic-bezier(.22,.8,.28,1);
}
.sol-ver.is-in::after{ transform:scaleX(1); }
.sol-ver > li{
  position:relative; padding-top:var(--dzf-space-md);
  opacity:0; transform:translateY(14px);
  transition:opacity .5s ease, transform .5s ease;
  transition-delay:var(--i, 0ms);
}
.sol-ver.is-in > li{ opacity:1; transform:none; }
.sol-ver__dot{
  position:absolute; top:0; inset-inline-start:0;
  width:16px; height:16px; border-radius:999px;
  background:var(--white); border:2px solid var(--accent);
}
.sol-ver > li:last-child .sol-ver__dot{ background:var(--accent); }
.sol-ver__card{
  border:1px solid var(--stroke); border-radius:20px;
  padding:var(--dzf-space-md); height:100%;
  transition:border-color .22s ease;
}
.sol-ver > li:hover .sol-ver__card{ border-color:var(--primary); }
.sol-ver__n{
  display:inline-block; margin-bottom:10px;
  padding:5px 12px; border-radius:8px;
  background:var(--primary); color:var(--accent);
  font-size:11.5px; font-weight:700; unicode-bidi:plaintext;
}
.sol-ver > li:last-child .sol-ver__n{ background:var(--accent); color:var(--primary); }
.sol-ver__card strong{ display:block; font-size:14.5px; color:var(--primary); }
.sol-ver__log{ margin:10px 0 0; padding:0; list-style:none; }
.sol-ver__log li{
  display:flex; align-items:flex-start; gap:7px;
  margin-top:6px; font-size:12px; line-height:1.8; color:var(--dzf-muted-2);
}
.sol-ver__log li b{
  flex-shrink:0; width:14px;
  font-size:12px; font-weight:800; color:var(--dzf-muted-3);
  unicode-bidi:plaintext;
}

/* ============================================================
   بلوک‌های صنف «کسب‌وکارهای خدماتی»
   ============================================================ */

/* ---------- هرو: از فرد تا برند ---------- */
.sol-lift{
  background:var(--primary); border-radius:24px;
  padding:var(--dzf-space-md);
}
.sol-lift__steps{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; }
.sol-lift__steps li{
  display:grid; grid-template-columns:auto 1fr; gap:2px 12px;
  align-items:center;
  padding:12px var(--dzf-space-sm); border-radius:16px;
  background:rgba(226,227,231,.08);
  border:1px solid rgba(226,227,231,.18);
  opacity:0; transform:translateY(12px);
  transition:opacity .5s ease, transform .5s ease;
  transition-delay:var(--i, 0ms);
}
.sol-lift.is-in .sol-lift__steps li{ opacity:1; transform:none; }
.sol-lift__steps li:last-child{ background:var(--accent); border-color:var(--accent); }
.sol-lift__k{ grid-column:1; font-size:13.5px; font-weight:600; color:var(--white); }
.sol-lift__steps li:last-child .sol-lift__k{ color:var(--primary); font-weight:700; }
.sol-lift__en{
  grid-column:1; font-size:10.5px; color:var(--bg); opacity:.5; unicode-bidi:plaintext;
}
.sol-lift__steps li:last-child .sol-lift__en{ color:var(--primary); opacity:.6; }
/* نقطه‌ها: با هر مرحله، برند از یک نفر به یک ساختار تبدیل می‌شود */
.sol-lift__dots{
  grid-column:2; grid-row:1 / -1;
  display:flex; flex-wrap:wrap; gap:5px; justify-content:flex-end;
}
.sol-lift__dots i{
  display:block; width:9px; height:9px; border-radius:999px;
  background:rgba(226,227,231,.42);
}
.sol-lift__steps li:last-child .sol-lift__dots i{ background:var(--primary); }
.sol-lift__tag{
  display:block; margin-top:var(--dzf-space-sm); text-align:center;
  font-size:12px; color:var(--bg); opacity:.6;
}

/* ---------- چرخه‌ی تبدیل تجربه به دارایی ---------- */
.sol-loop-sec{ background:var(--primary); }
.sol-loop{
  display:grid; grid-template-columns:repeat(5, minmax(0,1fr));
  gap:12px; margin:0; padding:0; list-style:none; position:relative;
}
.sol-loop li{
  position:relative; text-align:center;
  padding:var(--dzf-space-md) var(--dzf-space-sm); border-radius:18px;
  background:rgba(226,227,231,.08);
  border:1px solid rgba(226,227,231,.18);
  opacity:0; transform:translateY(14px);
  transition:opacity .5s ease, transform .5s ease, border-color .22s ease;
  transition-delay:var(--i, 0ms);
}
.sol-loop.is-in li{ opacity:1; transform:none; }
.sol-loop li:hover{ border-color:var(--accent); }
.sol-loop li:last-child{ background:var(--accent); border-color:var(--accent); }
/* پیکان بین مرحله‌ها — در RTL باید رو به چپ باشد.
   قبلاً border-inline-start بود که در RTL به border-right ترجمه
   می‌شود؛ گوشه‌ی راست+بالا با چرخش ۴۵- درجه، پیکان را رو به بالا
   نشان می‌داد. با inline-end (یعنی چپ در RTL) گوشه‌ی چپ+بالا
   ساخته می‌شود و پیکان درست به مرحله‌ی بعد اشاره می‌کند. */
.sol-loop li:not(:last-child)::after{
  content:""; position:absolute; top:50%; inset-inline-end:-11px;
  width:8px; height:8px; margin-top:-4px;
  border-inline-end:2px solid rgba(226,227,231,.34);
  border-block-start:2px solid rgba(226,227,231,.34);
  transform:rotate(-45deg);
}
.sol-loop__n{
  display:block; margin-bottom:8px;
  font-size:10.5px; font-weight:800; color:var(--accent); unicode-bidi:plaintext;
}
.sol-loop li:last-child .sol-loop__n{ color:var(--primary); opacity:.65; }
.sol-loop__ico{
  display:flex; align-items:center; justify-content:center;
  width:38px; height:38px; margin:0 auto 10px;
  border-radius:14px; background:rgba(226,227,231,.12); color:var(--bg);
}
.sol-loop li:last-child .sol-loop__ico{ background:var(--white); color:var(--primary); }
.sol-loop__ico svg{ width:19px; height:19px; }
.sol-loop strong{ display:block; font-size:13.5px; color:var(--white); }
.sol-loop li:last-child strong{ color:var(--primary); }
.sol-loop p{ margin:6px 0 0; font-size:11.5px; line-height:1.75; color:var(--bg); opacity:.58; }
.sol-loop li:last-child p{ color:var(--primary); opacity:.7; }
.sol-loop__back{
  display:flex; align-items:center; justify-content:center; gap:10px;
  margin-top:var(--dzf-space-md); padding:12px var(--dzf-space-sm);
  border-radius:999px; border:1px dashed rgba(226,227,231,.3);
  font-size:13px; color:var(--bg); opacity:0;
  transition:opacity .5s ease .8s;
}
.sol-loop__back.is-in{ opacity:.72; }
.sol-loop__back svg{ width:18px; height:18px; color:var(--accent); }

/* ============================================================
   لایه‌ی Mood — تنها جایی که صنایع با هم فرق می‌کنند
   رنگ و فونت هرگز اینجا عوض نمی‌شوند.
   ============================================================ */
/* استارتاپ: سرعت، نوآوری، رشد — حرکت‌ها کمی سریع‌تر و قاطع‌تر */
.sol[data-mood="startup"] .sol-rise{ transition-duration:.45s; }
.sol[data-mood="startup"] .sol-idea__chain li{ transition-duration:.42s; }

/* شرکت: اعتماد، نظم، مقیاس — حرکت‌ها کندتر و یکنواخت‌تر،
   ریتم بخش‌ها منظم‌تر (روشن و خاکستری یک‌درمیان). */
.sol[data-mood="company"] .sol-rise{ transition-duration:.65s; }
.sol[data-mood="company"] .sol-why-sec{ background:transparent; }

/* فروشگاه: تعامل، فروش، جریان — ریتم متوسط و حرکت افقی */
.sol[data-mood="shop"] .sol-rise{ transition-duration:.5s; }
.sol[data-mood="shop"] .sol-why-sec{ background:transparent; }

/* تولیدکننده: مقیاس، تکرار، نظم — حرکت‌ها منظم و پلکانی */
.sol[data-mood="factory"] .sol-rise{ transition-duration:.58s; }
.sol[data-mood="factory"] .sol-why-sec{ background:transparent; }

/* کافه: تجربه، حضور، تعامل — نرم‌ترین ریتم صفحه‌ها */
.sol[data-mood="cafe"] .sol-rise{ transition-duration:.7s; }
.sol[data-mood="cafe"] .sol-why-sec{ background:transparent; }

/* پوشاک: سیستم، فصل، ظرافت — ریتم متوسط با نظم پلکانی */
.sol[data-mood="fashion"] .sol-rise{ transition-duration:.6s; }
.sol[data-mood="fashion"] .sol-why-sec{ background:transparent; }

/* زیبایی: اعتماد، ظرافت، تجربه — آرام‌ترین ریتم */
.sol[data-mood="beauty"] .sol-rise{ transition-duration:.75s; }
.sol[data-mood="beauty"] .sol-why-sec{ background:transparent; }

/* باشگاه: انرژی، شتاب، جامعه — سریع‌ترین ریتم صفحه‌ها */
.sol[data-mood="fitness"] .sol-rise{ transition-duration:.4s; }
.sol[data-mood="fitness"] .sol-why-sec{ background:transparent; }

/* سلامت: اعتبار، آرامش، رسمیت — رسمی‌ترین صفحه‌ی مجموعه */
.sol[data-mood="health"] .sol-rise{ transition-duration:.68s; }
.sol[data-mood="health"] .sol-why-sec{ background:transparent; }

/* آموزش: دانش، انباشت، جامعه — ریتم متوسط و پلکانی */
.sol[data-mood="education"] .sol-rise{ transition-duration:.6s; }
.sol[data-mood="education"] .sol-why-sec{ background:transparent; }

/* فناوری: سیستم، دقت، تکامل — دقیق‌ترین و فنی‌ترین ریتم */
.sol[data-mood="tech"] .sol-rise{ transition-duration:.5s; }
.sol[data-mood="tech"] .sol-why-sec{ background:transparent; }

/* خدماتی: اعتبار، رابطه، تخصص — آرام و حرفه‌ای */
.sol[data-mood="service"] .sol-rise{ transition-duration:.66s; }
.sol[data-mood="service"] .sol-why-sec{ background:transparent; }

/* ============================================================
   واکنش‌گرایی
   ============================================================ */
@media (max-width:1100px){
  .sol-hero__inner{ grid-template-columns:1fr; gap:var(--dzf-space-lg); }
  .sol-pains--5{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .sol-touch{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .sol-grow{ grid-template-columns:1fr; }
  .sol-grow__steps{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .sol-sync__teams{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .sol-touch--5{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .sol-journey{ grid-template-columns:repeat(3, minmax(0,1fr)); row-gap:var(--dzf-space-lg); }
  .sol-journey::before, .sol-journey::after{ display:none; }
  .sol-devices{ grid-template-columns:1fr 1fr; }
  .sol-dev--desk{ grid-row:auto; grid-column:span 2; }
  .sol-pains{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .sol-mods{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .sol-ba{ grid-template-columns:1fr; }
  .sol-ba__arrow{ transform:rotate(-90deg); }
  .sol-scale{ grid-template-columns:1fr; gap:var(--dzf-space-lg); }
  .sol-line__belt{ grid-template-columns:repeat(3, minmax(0,1fr)); row-gap:12px; }
  .sol-eco__ring{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .sol-packs{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .sol-day__steps{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  /* سکو در عرض کم، ستونی می‌شود تا برچسب‌ها فشرده نشوند */
  .sol-day__base{ flex-direction:column; align-items:flex-start; }
  .sol-ba--even{ grid-template-columns:1fr; }
  .sol-touch--7{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .sol-journey--5{ grid-template-columns:repeat(3, minmax(0,1fr)); row-gap:var(--dzf-space-lg); }
  .sol-files{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .sol-coll{ grid-template-columns:repeat(2, minmax(0,1fr)); row-gap:var(--dzf-space-lg); }
  .sol-coll::before, .sol-coll::after{ display:none; }
  .sol-wins{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .sol-pillars{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .sol-ver{ grid-template-columns:repeat(2, minmax(0,1fr)); row-gap:var(--dzf-space-lg); }
  .sol-ver::before, .sol-ver::after{ display:none; }
  .sol-loop{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .sol-loop li:not(:last-child)::after{ display:none; }
  .sol-twin{ grid-template-columns:1fr; }
  .sol-twin__wire{ width:100%; min-height:56px; }
  .sol-twin__wire::before{ top:auto; bottom:auto; inset-inline:12%; width:auto; height:2px; }
  .sol-twin.is-in .sol-twin__wire i{ animation:none; opacity:1; }
}
@media (max-width:860px){
  .sol-sec, .sol-hero, .sol-cta{ padding-top:var(--dzf-space-xl); padding-bottom:var(--dzf-space-xl); }
  .sol-why{ grid-template-columns:1fr; }
  .sol-assembly{ min-height:auto; flex-direction:column; gap:12px; }
  .sol-assembly__i{ position:static; transform:none !important; opacity:1 !important; width:100%; }
  .sol-assembly__core{ width:150px; height:150px; order:-1; }
}
@media (max-width:560px){
  .sol-pains{ grid-template-columns:1fr; }
  .sol-pains--5, .sol-touch, .sol-sync__teams,
  .sol-grow__steps, .sol-orgmini__teams{ grid-template-columns:1fr; }
  .sol-sync__btn{ width:100%; }
  .sol-journey, .sol-pcards, .sol-touch--5{ grid-template-columns:1fr; }
  .sol-devices{ grid-template-columns:1fr; }
  .sol-dev--desk{ grid-column:auto; }
  .sol-mods{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .sol-out__hd, .sol-out__r{ grid-template-columns:1fr; gap:4px; }
  .sol-road li{ gap:12px; }
  .sol-road::before{ inset-inline-start:18px; }
  .sol-line__belt, .sol-eco__ring, .sol-packs, .sol-day__steps{ grid-template-columns:1fr; }
  .sol-line__stem, .sol-eco__stem{ display:none; }
  .sol-kit__parts, .sol-files, .sol-coll, .sol-wins,
  .sol-touch--7, .sol-journey--5, .sol-meter{ grid-template-columns:1fr; }
  .sol-funnel__in, .sol-funnel__out{ grid-template-columns:1fr; }
  .sol-file--a, .sol-file--b, .sol-file--c, .sol-file--d{ transform:none; }
  .sol-pillars, .sol-ver, .sol-loop{ grid-template-columns:1fr; }
  .sol-tree__branch{ padding-inline-start:0; }
  .sol-tree__branch::before, .sol-tree__branch li::before{ display:none; }
}

/* ============================================================
   احترام به prefers-reduced-motion
   ============================================================ */
@media (prefers-reduced-motion: reduce){
  .sol-rise,
  .sol-idea__chain li,
  .sol-scale__steps li,
  .sol-ba__assets li,
  .sol-assembly__i,
  .sol-assembly__core{
    opacity:1 !important; transform:none !important; transition:none !important;
  }
  .sol-idea__grid circle{ opacity:1 !important; transition:none !important; }
  .sol-road::before{ transform:scaleY(1) !important; transition:none !important; }
  .sol-seed__stem{ stroke-dashoffset:0 !important; transition:none !important; }
  .sol-seed__leafa, .sol-seed__leafb, .sol-seed__crown{
    opacity:1 !important; transform:none !important; transition:none !important;
  }
  .sol-road__story{ opacity:1 !important; max-height:none !important; }
  .sol-mod.is-in:hover{ transform:none; }
  .sol-orgmini__teams li,
  .sol-grow__steps li,
  .sol-touch li{ opacity:1 !important; transform:none !important; transition:none !important; }
  .sol-org__lines path{ stroke-dashoffset:0 !important; transition:none !important; }
  .sol-org__row rect, .sol-org__row text{ opacity:1 !important; transition:none !important; }
  .sol-sync__sw, .sol-sync__core, .sol-sync__file, .sol-sync__msg{ transition:none !important; }
  .sol-dev, .sol-journey li{ opacity:1 !important; transform:none !important; transition:none !important; }
  .sol-journey::after{ transform:scaleX(1) !important; transition:none !important; }
  .sol-pcard, .sol-pcard__img, .sol-pcard__btn{ transition:none !important; }
  .sol-line__belt li,
  .sol-eco__hub, .sol-eco__ring li, .sol-eco__core,
  .sol-day__steps li, .sol-day__base,
  .sol-cup__dna{ opacity:1 !important; transform:none !important; transition:none !important; }
  .sol-eco__rail{ transform:scaleY(1) !important; transition:none !important; }
  .sol-cup__steam path{ stroke-dashoffset:0 !important; opacity:.85 !important; transition:none !important; }
  .sol-cup__mark{ opacity:1 !important; transition:none !important; }
  .sol-pack, .sol-pack__box, .sol-pack__lid, .sol-pack__mark{ transition:none !important; }
  .sol-pack__stamp{ transition:none !important; }
  .sol-kit__label, .sol-kit__parts li,
  .sol-coll li, .sol-wins li,
  .sol-funnel__in li, .sol-funnel__out li, .sol-funnel__core{
    opacity:1 !important; transform:none !important; transition:none !important;
  }
  .sol-funnel__rail{ transform:scaleY(1) !important; transition:none !important; }
  .sol-coll::after{ transform:scaleX(1) !important; transition:none !important; }
  .sol-meter__bar i{ transition:none !important; }
  .sol-file, .sol-file__ico, .sol-file__n, .sol-file__to{ transition:none !important; }
  .sol-file--a, .sol-file--b, .sol-file--c, .sol-file--d{ transform:none !important; }
  .sol-net__lines path{ stroke-dashoffset:0 !important; transition:none !important; }
  .sol-net__dots circle, .sol-net__hub{
    opacity:1 !important; transform:none !important; transition:none !important;
  }
  .sol-stack__rows li, .sol-stack__ok, .sol-stack__out,
  .sol-tree__root, .sol-tree__branch li,
  .sol-twin__rows li, .sol-ver li,
  .sol-lift__steps li, .sol-loop li,
  .sol-os__node, .sol-os__core{
    opacity:1 !important; transform:none !important; transition:none !important;
  }
  .sol-tree__branch::before{ transform:scaleY(1) !important; transition:none !important; }
  .sol-ver::after{ transform:scaleX(1) !important; transition:none !important; }
  .sol-os__edge{ stroke-dashoffset:0 !important; transition:none !important; }
  .sol-os.is-in .sol-os__pulse{ animation:none !important; }
  .sol-twin.is-in .sol-twin__wire i{ animation:none !important; opacity:1 !important; }
  .sol-loop__back{ opacity:.72 !important; transition:none !important; }
}