/* ==========================================================================
   IGGAK — لایه‌ی فارسی / راست‌چین
   fa.css  —  آخرین استایلی که بارگذاری می‌شود، بعد از base / site / mirror.

   این فایل عمداً یک «لایه» است و نه بازنویسی: base.css و site.css دست‌نخورده
   می‌مانند. اگر این یک <link> را بردارید و dir="rtl" را از <html> پاک کنید،
   سایت دقیقاً به نسخه‌ی انگلیسی برمی‌گردد.

   سه چیز اینجا اتفاق می‌افتد:

   ۱. فونت‌ها — تیترها با Diodrum Arabic، متن با وزیرمتن.
   ۲. تایپوگرافی فارسی — letter-spacing روی خط فارسی حروف چسبان را از هم
      باز می‌کند و کلمه را می‌شکند، پس همه‌جا صفر می‌شود و فقط روی رشته‌های
      لاتین (.lat) برمی‌گردد. text-transform هم برای خط فارسی بی‌معنی است.
      line-height هم بالا می‌رود؛ خط فارسی به فضای عمودی بیشتری نیاز دارد.
   ۳. راست‌چین — چند خاصیت فیزیکی (left/right) که در فایل‌های اصلی مانده‌اند
      به خاصیت منطقی تبدیل می‌شوند.
   ========================================================================== */

/* --- ۱. فونت‌ها ----------------------------------------------------------- */

@font-face{font-family:'Diodrum Arabic';src:url('../fonts/DiodrumArabic-ExtraLight.woff2') format('woff2');font-weight:200;font-style:normal;font-display:swap}
@font-face{font-family:'Diodrum Arabic';src:url('../fonts/DiodrumArabic-Light.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Diodrum Arabic';src:url('../fonts/DiodrumArabic-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Diodrum Arabic';src:url('../fonts/DiodrumArabic-SemiBold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Diodrum Arabic';src:url('../fonts/DiodrumArabic-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
/* وزیرمتن — متغیر، وزن ۱۰۰ تا ۹۰۰، مجوز SIL OFL (fonts/Vazirmatn-OFL.txt) */
@font-face{font-family:'Vazirmatn';src:url('../fonts/Vazirmatn-Variable.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}

:root{
  /* --- رنگ برند --------------------------------------------------------
     طلایی و تیره، نمونه‌گرفته از خود فایل لوگو: #C9A063 و #261C14.
     توکن‌های bronze در base.css همه‌جا استفاده شده‌اند، پس همان‌ها را
     بازنویسی می‌کنیم و کل سایت با یک بلوک برندینگ می‌شود. */
  --bronze:     #C9A063;
  --bronze-lit: #E3C795;
  --bronze-dim: #7C6134;
  --black:      #0B0906;
  --panel:      #16110B;
  --panel-2:    #1E1710;
  --bone:       #F2EDE4;
  --bone-dim:   #96907F;
  --line:       rgba(201,160,99,.22);

  --display:'Diodrum Arabic','Vazirmatn',system-ui,sans-serif;
  --body:'Vazirmatn','Diodrum Arabic',system-ui,sans-serif;
  /* نقش «data» در نسخه‌ی انگلیسی یک مونواسپیس بود. برای فارسی مونواسپیس
     مناسبی وجود ندارد و ردیف‌های عددی هم لاتین می‌مانند، پس این نقش به
     وزیرمتن با وزن بالاتر می‌رسد و رشته‌های لاتین با .lat مونو می‌شوند. */
  --data:'Vazirmatn',system-ui,sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  /* اعداد و کدهای لاتین از فونت لاتین، حروف فارسی از وزیرمتن —
     جانشینی گلیف‌به‌گلیف، پس «۴۷□۲۱ میلی‌متر» هر دو بخشش درست می‌شود */
  --num:ui-monospace,'SF Mono',Menlo,'Vazirmatn',sans-serif;
}

/* --- ۲. تایپوگرافی فارسی -------------------------------------------------- */

body{font-family:var(--body);line-height:1.85}

/* هیچ فاصله‌ی حرفی روی خط فارسی */
.display,.stamp,.lede,.btn,.chip,.nav-links,.hero-spec,.wordmark .name,
.tt,.parts-rail .part h3,.parts-rail .part p,.scroll-cue,.fact,.fact b,
.card .size,.card .try,.card .house,.card .price,.step h3,.origin figcaption,
.social-foot,.legal,.fcol a,.fcol .stamp,.hint,.diag,.badge3d{
  letter-spacing:0;
}
/* بزرگ‌کردن حروف برای خط فارسی بی‌اثر است و فقط لاتینِ داخل متن را خراب می‌کند */
.display,.stamp,.btn,.chip,.nav-links,.wordmark .name,.tt,.hint,
.origin figcaption,.social-foot,.parts-rail .part p{
  text-transform:none;
}

/* تیترها به فضای عمودی بیشتری نیاز دارند؛ ۱٫۰۲ برای فارسی حروف را می‌برد */
.display{font-family:var(--display);font-weight:700;line-height:1.28}
.display em{font-style:normal;color:var(--bronze)}
.headline{line-height:1.14;font-weight:700}
.headline .thin{font-weight:500;color:var(--bone-dim)}
h2.display,.head h2{font-weight:700}
.closing h2{font-weight:700}
.parts-rail .part h3{font-weight:700;line-height:1.26}
/* متن‌های کوچک: ساده و سبک، تا تیترهای بولد تنها صدای صفحه باشند */
.lede{line-height:2;max-width:56ch;font-weight:300}
.step p,.origin p,.social-note{font-weight:300;line-height:2}
.fact b{font-weight:500}

.stamp{font-family:var(--body);font-weight:500;font-size:.82rem;color:var(--bronze)}
.btn{font-family:var(--body);font-weight:600;font-size:.86rem}
.chip{font-family:var(--body);font-weight:500;font-size:.82rem}
.nav-links{font-family:var(--body);font-weight:500;font-size:.92rem;gap:1.5rem}
.hero-spec{font-family:var(--body);font-size:.86rem}
.tt{font-family:var(--body);font-size:.84rem}
.wordmark .name{font-family:var(--display);font-weight:700;letter-spacing:.42em;
  text-indent:.42em;direction:ltr}   /* «IGGAK» لاتین است و ردیفش می‌ماند */

/* رشته‌های لاتین: کد فریم، اندازه‌ها، دامنه. جداشده از جریان راست‌چین. */
.lat,.price,.adminlink,.diag,#ig-pdInput{
  font-family:var(--mono);direction:ltr;unicode-bidi:isolate;letter-spacing:0;
}
.card .size{font-size:.74rem;direction:rtl}
/* ردیف‌های اندازه در آینه: کد «۴۷□۲۱» هرگز با فونت فارسی */
.mrow b,.calrow b,#ig-mStamp,#ig-mPD,#ig-mFace,#ig-mFront,#ig-mOCD,
#ig-pPrice,.card .size{font-family:var(--num);font-variant-numeric:tabular-nums}
#ig-mStamp{direction:ltr;unicode-bidi:isolate}
.card .size .lat{font-size:.95em}

/* --- لوگوی برند (SVG با currentColor، پس رنگ را از CSS می‌گیرد) ---------- */

.wordmark{gap:0}
.wordmark .mark{width:clamp(104px,11vw,142px);height:auto;color:var(--bronze)}
.wordmark .mark svg{width:100%;height:auto;display:block}
#originArt{width:min(320px,78%);color:var(--bronze);margin-inline:auto}
#originArt svg{width:100%;height:auto;display:block}

/* --- ۳. راست‌چین ---------------------------------------------------------- */

.badge3d{margin-left:0;margin-inline-start:.4rem}
.scroll-cue .bar::after{left:auto;inset-inline-start:0}
.parts-rail{right:auto;inset-inline-end:var(--gut);text-align:start}
.parts-rail .part{right:auto;inset-inline-end:0;
  /* ریل روی عدسیِ روشن هم می‌افتد، پس زمینه‌ی خودش را با خود می‌برد.
     زمینه جامد است و با ماسک شعاعی محو می‌شود؛ گرادیان تنها، گوشه‌های
     مستطیل را نیمه‌شفاف می‌گذاشت و لبه‌ی جعبه دیده می‌شد. */
  padding-block:20px;
  padding-inline-start:24px;   /* راست، در چیدمان راست‌چین */
  padding-inline-end:50px;
  background:rgba(9,7,5,.90);
  /* ماسک باید تمام متن را بپوشاند و فقط لبه‌ی دور را محو کند؛ نسخه‌ی
     تنگ‌ترش سمت چپِ توضیح را نیمه‌شفاف می‌گذاشت و متن گم می‌شد. */
  -webkit-mask-image:radial-gradient(155% 175% at 88% 50%, #000 58%, transparent 100%);
  mask-image:radial-gradient(155% 175% at 88% 50%, #000 58%, transparent 100%);
  text-shadow:0 1px 16px rgba(5,4,2,.95);}
.parts-rail .part .en{display:block;font-family:var(--mono);font-size:.76rem;
  letter-spacing:.16em;color:var(--bronze-lit);opacity:.92;margin:-2px 0 12px;direction:ltr}
.parts-rail .part .hr{margin-inline:0 auto;margin-left:0}
.eyebrow::after{background:linear-gradient(270deg,var(--bronze-dim),transparent)}

/* نوار متحرک باید در جهت خواندن فارسی حرکت کند */
.tt{animation-direction:reverse}

/* آینه */
.calpanel{left:auto;inset-inline-start:.7rem}
.calrow b{text-align:end}
.diag{text-align:start}
.stage-btns{right:auto;inset-inline-end:.7rem}
#ig-adminWrap .calrow>b{text-align:end}
.adminlink{margin-left:0;margin-inline-start:.8rem}
@media(max-width:920px){
  .sheet{border-left:0;border-inline-start:1px solid var(--line)}
}

/* فلش‌های «برو به» در متن انگلیسی رو به راست بودند؛ در فارسی رو به چپ */
.card .try{direction:rtl}
