/* Emdad Master · ویجت مدل‌های خودرو */
.emdad-models{
  display:grid;gap:14px;list-style:none;margin:0;padding:0;
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.emdad-models__card{
  display:flex;flex-direction:column;align-items:center;gap:10px;height:100%;
  background:var(--card,#fff);border:1px solid var(--line,#E7E7E3);
  border-radius:var(--r,14px);padding:16px 12px;text-align:center;text-decoration:none;
  color:var(--ink,#0C0C0D);
  transition:background var(--t,200ms),border-color var(--t,200ms),transform var(--t,200ms);
}
.emdad-models__card:hover{
  border-color:var(--h-card-line,#D6D6D1);transform:translateY(var(--h-lift,-2px));
}
.emdad-models__thumb{width:100%}
.emdad-models__thumb img,.emdad-models__thumb svg{
  width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-sm,10px);display:block;
}
.emdad-models__thumb svg{fill:var(--line,#E7E7E3);padding:14%}
/* align-items:center روی کارت باعث می‌شود فرزندان بدون width عرضشان بر اساس
   محتوا حساب شود، نه عرض کارت — پس متن بلند/تک‌کلمه از کارت بیرون می‌زند.
   width:100% این را می‌بندد. */
.emdad-models__name{width:100%;font-weight:800;font-size:15.5px;line-height:1.5;overflow-wrap:break-word}
.emdad-models__intro{
  width:100%;font-size:13px;line-height:1.8;color:var(--muted,#63636A);
  overflow-wrap:break-word;word-break:break-word;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;min-height:calc(1.8em * 2);
}
.emdad-models__btn{
  margin-top:auto;display:inline-block;font-size:13.5px;font-weight:700;
  color:var(--ink,#0C0C0D);border-bottom:2px solid var(--yellow,#FFC629);padding-bottom:2px;
}

@media (max-width:900px){.emdad-models{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:600px){.emdad-models{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------------------------------------------------------------------
   حالت «برندها (تب‌دار)» — بدون جاوااسکریپت: radio مخفی + :checked
   حداکثر ۱۲ تب. رادیوها فقط از دید پنهان‌اند تا با صفحه‌کلید کار کنند. */
.emdad-models-tabs{position:relative}
.emdad-models-tabs>.emt-in{
  position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;margin:0;
}
.emdad-models__tabbar{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.emdad-models__tab{
  cursor:pointer;padding:9px 20px;border-radius:999px;
  border:1px solid var(--line,#E7E7E3);background:var(--card,#fff);
  color:var(--ink,#0C0C0D);font-weight:700;font-size:14px;line-height:1.6;
  transition:background var(--t,200ms),color var(--t,200ms),border-color var(--t,200ms);
}
.emdad-models__tab:hover{border-color:var(--h-card-line,#D6D6D1)}
.emdad-models--panel{display:none}

/* تب فعال + پنل فعال — یک قاعده برای هر اندیس */
.emt-in-0:checked~.emdad-models__tabbar .emt-tab-0,
.emt-in-1:checked~.emdad-models__tabbar .emt-tab-1,
.emt-in-2:checked~.emdad-models__tabbar .emt-tab-2,
.emt-in-3:checked~.emdad-models__tabbar .emt-tab-3,
.emt-in-4:checked~.emdad-models__tabbar .emt-tab-4,
.emt-in-5:checked~.emdad-models__tabbar .emt-tab-5,
.emt-in-6:checked~.emdad-models__tabbar .emt-tab-6,
.emt-in-7:checked~.emdad-models__tabbar .emt-tab-7,
.emt-in-8:checked~.emdad-models__tabbar .emt-tab-8,
.emt-in-9:checked~.emdad-models__tabbar .emt-tab-9,
.emt-in-10:checked~.emdad-models__tabbar .emt-tab-10,
.emt-in-11:checked~.emdad-models__tabbar .emt-tab-11{
  background:var(--ink,#0C0C0D);color:var(--yellow,#FFC629);border-color:var(--ink,#0C0C0D);
}
.emt-in-0:checked~.emt-panel-0,
.emt-in-1:checked~.emt-panel-1,
.emt-in-2:checked~.emt-panel-2,
.emt-in-3:checked~.emt-panel-3,
.emt-in-4:checked~.emt-panel-4,
.emt-in-5:checked~.emt-panel-5,
.emt-in-6:checked~.emt-panel-6,
.emt-in-7:checked~.emt-panel-7,
.emt-in-8:checked~.emt-panel-8,
.emt-in-9:checked~.emt-panel-9,
.emt-in-10:checked~.emt-panel-10,
.emt-in-11:checked~.emt-panel-11{display:grid}

/* حلقه فوکوس صفحه‌کلید روی تب متناظر */
.emt-in-0:focus-visible~.emdad-models__tabbar .emt-tab-0,
.emt-in-1:focus-visible~.emdad-models__tabbar .emt-tab-1,
.emt-in-2:focus-visible~.emdad-models__tabbar .emt-tab-2,
.emt-in-3:focus-visible~.emdad-models__tabbar .emt-tab-3,
.emt-in-4:focus-visible~.emdad-models__tabbar .emt-tab-4,
.emt-in-5:focus-visible~.emdad-models__tabbar .emt-tab-5,
.emt-in-6:focus-visible~.emdad-models__tabbar .emt-tab-6,
.emt-in-7:focus-visible~.emdad-models__tabbar .emt-tab-7,
.emt-in-8:focus-visible~.emdad-models__tabbar .emt-tab-8,
.emt-in-9:focus-visible~.emdad-models__tabbar .emt-tab-9,
.emt-in-10:focus-visible~.emdad-models__tabbar .emt-tab-10,
.emt-in-11:focus-visible~.emdad-models__tabbar .emt-tab-11{
  outline:3px solid var(--h-focus,#E6AE00);outline-offset:2px;
}
