/*
 * G2 Hero Slider — استایل فرانت
 *
 * • همهٔ مقادیر متغیر از صفت style عنصر ریشه می‌آیند (CSS variable).
 *   هیچ بلوک <style> تولید نمی‌شود چون LiteSpeed این سایت با
 *   optm-css_comb_ext_inl=1 استایل‌های inline را داخل فایل ترکیبی می‌کشد.
 * • از color-mix استفاده نشده تا روی مرورگرهای قدیمی اندروید هم کار کند.
 * • همهٔ کلاس‌ها با g2hs پیشوند دارند تا با قالب رویال تداخل نکنند.
 */

.g2hs{
  --g2hs-bg:#0a0a0a;
  --g2hs-fg:#fff;
  --g2hs-fg-soft:rgba(255,255,255,.62);
  --g2hs-hairline:rgba(255,255,255,.13);
  --g2hs-accent:#ffaa00;
  --g2hs-accent-fg:#161003;
  --g2hs-accent-soft:rgba(255,170,0,.16);
  --g2hs-accent-line:rgba(255,170,0,.4);
  --g2hs-card-bg:#15161a;
  --g2hs-card-fg:#fff;
  --g2hs-btn-bg:transparent;
  --g2hs-btn-fg:#ffaa00;
  --g2hs-btn-line:rgba(255,170,0,.45);
  --g2hs-radius:20px;
  --g2hs-grain:.06;
  --g2hs-gap:13px;
  --g2hs-pad:22px;
  --g2hs-per-d:6;
  --g2hs-per-t:4;
  --g2hs-per-m:2.2;
  --g2hs-per:var(--g2hs-per-d);
  --g2hs-card-w:calc((100% - (var(--g2hs-per) - 1) * var(--g2hs-gap)) / var(--g2hs-per));

  position:relative;
  border-radius:var(--g2hs-radius);
  background:transparent;
  color:var(--g2hs-fg);
  padding:var(--g2hs-pad) 0;
  overflow:hidden;
  isolation:isolate;
  direction:rtl;
}
.g2hs--nobg{background:transparent}

.g2hs__bg{position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;overflow:hidden}
.g2hs__grain{
  position:absolute;inset:0;opacity:var(--g2hs-grain);mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
.g2hs--nobg .g2hs__grain{display:none}
.g2hs__in{position:relative;z-index:2;padding-inline:18px}

/* ---------- سربرگ ---------- */
.g2hs__hd{display:flex;align-items:flex-start;gap:11px;margin-bottom:14px}
.g2hs__ic{
  flex:none;width:40px;height:40px;border-radius:13px;
  display:flex;align-items:center;justify-content:center;
  background:var(--g2hs-accent-soft);color:var(--g2hs-accent);
}
.g2hs__ic svg{display:block;width:22px;height:22px}
.g2hs__ttl{flex:1;min-width:0}
.g2hs__heading{
  margin:0;font-size:var(--g2hs-h-size,22px);font-weight:800;line-height:1.45;
  color:var(--g2hs-fg);
}
.g2hs__sub{margin:2px 0 0;font-size:12.5px;line-height:1.7;color:var(--g2hs-fg-soft)}
.g2hs__all{
  flex:none;display:inline-flex;align-items:center;gap:5px;text-decoration:none;
  font-size:12.5px;font-weight:800;line-height:1;white-space:nowrap;
  color:var(--g2hs-btn-fg);background:var(--g2hs-btn-bg);
  padding:9px 14px;border-radius:999px;border:1px solid var(--g2hs-btn-line);
  transition:transform .18s cubic-bezier(.22,.61,.36,1),filter .18s cubic-bezier(.22,.61,.36,1);
}
.g2hs__all:hover,.g2hs__all:focus{color:var(--g2hs-btn-fg);transform:translateX(-2px);filter:brightness(1.12)}
.g2hs__all:focus-visible{outline:2px solid var(--g2hs-accent);outline-offset:2px}

/* ---------- ریل ---------- */
.g2hs__vp{position:relative}
.g2hs__track{
  display:grid;grid-auto-flow:column;grid-auto-columns:var(--g2hs-card-w);
  gap:var(--g2hs-gap);
  overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;
  padding-bottom:10px;
  scrollbar-width:none;-ms-overflow-style:none;
  -webkit-overflow-scrolling:touch;
}
.g2hs__track::-webkit-scrollbar{display:none}
.g2hs__track>*{scroll-snap-align:start}
.g2hs__track:focus-visible{outline:2px solid var(--g2hs-accent);outline-offset:3px}

.g2hs .g2hs__nav{
  position:absolute;top:38%;z-index:6;
  width:32px;height:32px;min-width:32px;min-height:32px;max-width:32px;
  margin:0;padding:0;border-radius:50%;
  border:1px solid rgba(0,0,0,.06);
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  color:#15171b;
  display:none;align-items:center;justify-content:center;
  cursor:pointer;overflow:visible;
  font-size:0;line-height:0;letter-spacing:normal;text-transform:none;
  box-shadow:0 2px 10px rgba(0,0,0,.16);
  opacity:0;transform:scale(.9);
  transition:opacity .2s ease,transform .2s cubic-bezier(.22,.61,.36,1),background .2s ease;
}
.g2hs .g2hs__nav svg{display:block;width:14px;height:14px;stroke:currentColor;stroke-width:2.6;fill:none}
/* فاصلهٔ مثبت: ریشه overflow:hidden دارد و مقدار منفی بریده می‌شد */
.g2hs .g2hs__nav--prev{inset-inline-start:8px;left:auto;right:auto}
.g2hs .g2hs__nav--next{inset-inline-end:8px;left:auto;right:auto}
[dir="rtl"] .g2hs .g2hs__nav--prev{right:8px}
[dir="rtl"] .g2hs .g2hs__nav--next{left:8px}
[dir="ltr"] .g2hs .g2hs__nav--prev{left:8px}
[dir="ltr"] .g2hs .g2hs__nav--next{right:8px}
/* مینیمال: تا وقتی نشانگر روی اسلایدر نیامده، دیده نمی‌شوند و تصویر را نمی‌پوشانند */
.g2hs:hover .g2hs__nav:not([hidden]):not([disabled]){opacity:1;transform:scale(1)}
.g2hs .g2hs__nav:hover{background:#fff;color:#000;transform:scale(1.06)}
.g2hs .g2hs__nav[disabled]{opacity:0;pointer-events:none}
.g2hs .g2hs__nav:focus-visible{opacity:1;transform:scale(1);outline:2px solid var(--g2hs-accent);outline-offset:2px}
@media (hover:hover) and (min-width:992px){
  .g2hs .g2hs__nav:not([hidden]){display:inline-flex}
}
.g2hs__prog{margin:4px auto 0;width:min(230px,58%);height:6px;display:flex;gap:3px}
.g2hs__prog i{flex:1;background:var(--g2hs-hairline);border-radius:2px;transition:background .25s}
.g2hs__prog i.is-on{background:var(--g2hs-accent)}

/* ---------- کارت ---------- */
.g2hs__card{
  background:var(--g2hs-card-bg);
  border:1px solid var(--g2hs-hairline);
  border-radius:14px;overflow:hidden;
  display:flex;flex-direction:column;
  transition:transform .22s cubic-bezier(.22,.61,.36,1),box-shadow .22s,border-color .22s;
}
@media (hover:hover){
  .g2hs__card:hover{transform:translateY(-4px);border-color:var(--g2hs-accent-line);box-shadow:0 12px 26px rgba(0,0,0,.26)}
  .g2hs__card:hover .g2hs__img{transform:scale(1.06)}
}
.g2hs__cardlink{
  display:flex;flex-direction:column;flex:1;
  text-decoration:none;color:var(--g2hs-card-fg);
}
.g2hs__cardlink:hover,.g2hs__cardlink:focus{color:var(--g2hs-card-fg);text-decoration:none}
.g2hs__cardlink:focus-visible{outline:2px solid var(--g2hs-accent);outline-offset:-2px}

.g2hs__media{position:relative;overflow:hidden;background:transparent;aspect-ratio:3/4;font-size:0;line-height:0}
/* موقعیت مطلق عمدی است: قالب رویال روی img قانون height:auto دارد که
   با ویژگی بالاتر برنده می‌شد و یک نوار طوسی زیر تصویر می‌ماند.
   با inset:0 ارتفاع از خود جعبه گرفته می‌شود و آن قانون بی‌اثر است. */
.g2hs .g2hs__media .g2hs__img{
  position:absolute;inset:0;
  width:100%;height:100%;max-width:none;
  object-fit:cover;display:block;margin:0;padding:0;border:0;border-radius:0;
  transition:transform .38s cubic-bezier(.22,.61,.36,1);
}

.g2hs__badge{
  position:absolute;top:8px;right:8px;left:auto;z-index:2;
  background:#e11d2e;color:#fff;
  font-size:12px;font-weight:900;line-height:1;
  padding:6px 8px;border-radius:6px;
  box-shadow:0 4px 12px rgba(225,29,46,.42);
}
.g2hs__badge.is-pulse{animation:g2hs-pulse 2.6s cubic-bezier(.22,.61,.36,1) infinite}
.g2hs__badge.is-glow{animation:g2hs-glow 2.2s ease-in-out infinite}
.g2hs__badge.is-shake{animation:g2hs-shake 3.4s cubic-bezier(.36,.07,.19,.97) infinite}
@keyframes g2hs-pulse{0%,74%,100%{transform:scale(1)}82%{transform:scale(1.12)}90%{transform:scale(.99)}}
@keyframes g2hs-glow{0%,100%{box-shadow:0 4px 12px rgba(225,29,46,.42)}50%{box-shadow:0 4px 22px rgba(225,29,46,.95)}}
@keyframes g2hs-shake{0%,88%,100%{transform:translateX(0)}90%{transform:translateX(-2px)}92%{transform:translateX(2px)}94%{transform:translateX(-2px)}96%{transform:translateX(1px)}}

.g2hs__timer{
  position:absolute;bottom:0;inset-inline:0;z-index:2;
  background:linear-gradient(to top,rgba(0,0,0,.88),rgba(0,0,0,0));
  color:#fff;font-size:11.5px;font-weight:700;
  padding:18px 8px 7px;
  display:flex;align-items:center;justify-content:center;gap:5px;
  direction:ltr;font-variant-numeric:tabular-nums;
}
.g2hs__timer svg{flex:none}

.g2hs__body{
  padding:11px 11px 13px;
  display:flex;flex-direction:column;gap:7px;flex:1;
  text-align:center;
}
.g2hs__name{
  margin:0;font-size:12.5px;font-weight:700;line-height:1.65;
  color:var(--g2hs-card-fg);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;min-height:2.7em;
}
.g2hs__price{
  margin-top:auto;
  font-size:13px;font-weight:800;line-height:1.6;
  color:var(--g2hs-card-fg);
  font-variant-numeric:tabular-nums;
}
.g2hs__price .amount{color:inherit}
.g2hs__price del{opacity:.55;font-weight:500;font-size:11px;margin-inline-end:4px}
.g2hs__price ins{text-decoration:none;background:transparent;color:inherit}
.g2hs__price__sep{opacity:.5;margin:0 3px;font-weight:600}
.g2hs__price .woocommerce-Price-currencySymbol{font-size:.82em;font-weight:600;opacity:.75}

/* ---------- واکنش‌گرایی ---------- */
@media (max-width:767px){
  .g2hs{--g2hs-per:var(--g2hs-per-m);--g2hs-gap:10px;--g2hs-pad:16px}
  .g2hs__in{padding-inline:13px}
  .g2hs__sub{display:none}
  .g2hs__track{margin-inline:-13px;padding-inline:13px;scroll-padding-inline-start:13px}
  .g2hs__all{padding:7px 11px;font-size:11.5px}
  .g2hs__heading{font-size:calc(var(--g2hs-h-size,22px) * .8)}
  .g2hs__ic{width:34px;height:34px;border-radius:11px}
  .g2hs__ic svg{width:18px;height:18px}
  .g2hs__name{font-size:12px}
  .g2hs__price{font-size:12px}
}
@media (min-width:768px) and (max-width:991px){
  .g2hs{--g2hs-per:var(--g2hs-per-t)}
}
@media (min-width:992px){
  .g2hs{--g2hs-per:var(--g2hs-per-d)}
}

@media (prefers-reduced-motion:reduce){
  .g2hs *,.g2hs *::before,.g2hs *::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;
  }
}

/* ==========================================================================
   لایه‌های پس‌زمینه (فاز ۲)
   همه با گرادیان CSS ساخته می‌شوند: صفر درخواست شبکهٔ اضافه.
   طرح‌های تزئینی ماسک محوشونده دارند تا مثل کاشیِ یکنواخت دیده نشوند.
   ========================================================================== */
.g2hs__bg > span{position:absolute;inset:0;display:block;pointer-events:none}
/* رنگ پایه: عمداً یک لایهٔ داخلی است. اگر روی خودِ ریشه بود، در گوشه‌های
   گرد یک درز تیره بین پس‌زمینهٔ ریشه و لایهٔ رویی دیده می‌شد. */
.g2hs__bg > .g2hs__bg-base{background:var(--g2hs-bg)}

.g2hs__bg > .g2hs__bg-img{
  background-position:var(--g2hs-img-pos,center center);
  background-size:cover;background-repeat:no-repeat;
}
/* رنگ بالا در حالت «دو رنگ»؛ رنگ پایین همان --g2hs-bg است.
   انتخابگر عمداً دو کلاسه است: قانون `.g2hs__bg > span` ویژگی (0,1,1) دارد
   و اگر اینجا تک‌کلاسه می‌نوشتیم، inset:0 برنده می‌شد و طرح اتصال
   به بالای کادر می‌چسبید و نامرئی می‌شد. */
.g2hs__bg > .g2hs__bg-a{
  top:-1px;left:-1px;right:-1px;bottom:auto;
  height:calc(var(--g2hs-split,58%) + 1px);
  background:var(--g2hs-bg-a);
}
.g2hs__bg > .g2hs__bg-shape{
  top:calc(var(--g2hs-split,58%) - 1px);bottom:auto;left:-1px;right:-1px;
  height:var(--g2hs-shape-h,64px);
  line-height:0;color:var(--g2hs-bg-a);
}
.g2hs__bg > .g2hs__bg-shape svg{display:block;width:100%;height:100%}

/* ---- پوشش‌ها ---- */
.g2hs[data-ovl="top"]    .g2hs__bg-ovl{background:linear-gradient(180deg,rgba(0,0,0,var(--g2hs-ovl-a,.45)),rgba(0,0,0,0))}
.g2hs[data-ovl="bottom"] .g2hs__bg-ovl{background:linear-gradient(0deg,rgba(0,0,0,var(--g2hs-ovl-a,.45)),rgba(0,0,0,0))}
.g2hs[data-ovl="solid"]  .g2hs__bg-ovl{background:rgba(0,0,0,var(--g2hs-ovl-a,.45))}
.g2hs[data-ovl="halo"]   .g2hs__bg-ovl{background:radial-gradient(78% 96% at 50% -12%,rgba(255,255,255,var(--g2hs-ovl-a,.45)),rgba(255,255,255,0) 70%)}

/* ---- طرح‌های تزئینی ---- */
.g2hs__bg > .g2hs__bg-pat{opacity:var(--g2hs-pat-o,.3);color:var(--g2hs-accent)}

.g2hs-pat--aurora .g2hs__bg-pat{
  background:radial-gradient(58% 78% at 18% -10%,var(--g2hs-accent) 0,transparent 62%),
             radial-gradient(46% 66% at 88% 12%,var(--g2hs-bg-a) 0,transparent 66%);
}
.g2hs-pat--spot .g2hs__bg-pat{
  background:radial-gradient(52% 88% at 50% -18%,rgba(255,255,255,.6) 0,transparent 68%);
}
.g2hs-pat--grid .g2hs__bg-pat{
  background-image:linear-gradient(currentColor 1px,transparent 1px),linear-gradient(90deg,currentColor 1px,transparent 1px);
  background-size:var(--g2hs-pat-size,24px) var(--g2hs-pat-size,24px);
  -webkit-mask-image:radial-gradient(74% 110% at 50% -8%,#000 12%,transparent 74%);
          mask-image:radial-gradient(74% 110% at 50% -8%,#000 12%,transparent 74%);
}
.g2hs-pat--dots .g2hs__bg-pat{
  background-image:radial-gradient(currentColor 1.3px,transparent 1.3px);
  background-size:var(--g2hs-pat-size,24px) var(--g2hs-pat-size,24px);
  -webkit-mask-image:radial-gradient(66% 100% at 82% 0%,#000 6%,transparent 70%);
          mask-image:radial-gradient(66% 100% at 82% 0%,#000 6%,transparent 70%);
}
.g2hs-pat--rings .g2hs__bg-pat{
  background-image:repeating-radial-gradient(circle at 84% 6%,currentColor 0 1px,transparent 1px calc(var(--g2hs-pat-size,24px) * 1.9));
  -webkit-mask-image:radial-gradient(58% 88% at 84% 6%,#000 4%,transparent 76%);
          mask-image:radial-gradient(58% 88% at 84% 6%,#000 4%,transparent 76%);
}
.g2hs-pat--speed .g2hs__bg-pat{
  background-image:repeating-linear-gradient(-72deg,currentColor 0 2px,transparent 2px var(--g2hs-pat-size,24px));
  -webkit-mask-image:linear-gradient(-100deg,#000 0,transparent 62%);
          mask-image:linear-gradient(-100deg,#000 0,transparent 62%);
}
.g2hs-pat--hex .g2hs__bg-pat{
  background-image:repeating-linear-gradient(60deg,currentColor 0 1px,transparent 1px var(--g2hs-pat-size,24px)),
                   repeating-linear-gradient(-60deg,currentColor 0 1px,transparent 1px var(--g2hs-pat-size,24px));
  -webkit-mask-image:radial-gradient(70% 100% at 20% 0%,#000 4%,transparent 72%);
          mask-image:radial-gradient(70% 100% at 20% 0%,#000 4%,transparent 72%);
}
.g2hs-pat--carbon .g2hs__bg-pat{
  background-image:repeating-linear-gradient(45deg,currentColor 0 1px,transparent 1px 7px),
                   repeating-linear-gradient(-45deg,currentColor 0 1px,transparent 1px 7px);
  -webkit-mask-image:linear-gradient(#000,transparent 82%);
          mask-image:linear-gradient(#000,transparent 82%);
}
.g2hs-pat--blueprint .g2hs__bg-pat{
  background-image:linear-gradient(currentColor 1px,transparent 1px),linear-gradient(90deg,currentColor 1px,transparent 1px),
                   linear-gradient(currentColor 1px,transparent 1px),linear-gradient(90deg,currentColor 1px,transparent 1px);
  background-size:calc(var(--g2hs-pat-size,24px) * 4) calc(var(--g2hs-pat-size,24px) * 4),
                  calc(var(--g2hs-pat-size,24px) * 4) calc(var(--g2hs-pat-size,24px) * 4),
                  var(--g2hs-pat-size,24px) var(--g2hs-pat-size,24px),
                  var(--g2hs-pat-size,24px) var(--g2hs-pat-size,24px);
  -webkit-mask-image:radial-gradient(80% 120% at 50% 0%,#000 10%,transparent 78%);
          mask-image:radial-gradient(80% 120% at 50% 0%,#000 10%,transparent 78%);
}
.g2hs-pat--beams .g2hs__bg-pat{
  background-image:repeating-linear-gradient(100deg,currentColor 0 2px,transparent 2px calc(var(--g2hs-pat-size,24px) * 2.4));
  -webkit-mask-image:radial-gradient(72% 100% at 50% -10%,#000 0,transparent 72%);
          mask-image:radial-gradient(72% 100% at 50% -10%,#000 0,transparent 72%);
}

/* گردی کارت از تنظیمات تم می‌آید */
.g2hs__card{border-radius:var(--g2hs-card-radius,14px)}

/* ==========================================================================
   تب‌ها و مرتب‌سازی مشتری (فاز ۳)
   ========================================================================== */
.g2hs__bar{display:flex;gap:9px;align-items:center;margin-top:var(--g2hs-bar-gap,14px);margin-bottom:12px}
.g2hs__tabs{flex:1 1 auto;min-width:0;display:flex;gap:6px;overflow-x:auto;
  scrollbar-width:none;-ms-overflow-style:none;
  padding:4px 3px 6px;margin-inline-start:-3px;
  scroll-padding-inline-start:3px}
.g2hs__tabs::-webkit-scrollbar{display:none}

.g2hs .g2hs__tab{
  flex:none;margin:0;font:inherit;font-size:12.5px;font-weight:700;line-height:1;
  padding:8px 14px;border-radius:999px;cursor:pointer;white-space:nowrap;
  border:1px solid var(--g2hs-hairline);background:transparent;color:var(--g2hs-fg);
  text-transform:none;letter-spacing:normal;min-width:0;height:auto;
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s cubic-bezier(.34,1.56,.64,1);
}
.g2hs .g2hs__tab:hover{background:transparent;border-color:var(--g2hs-accent-line);color:var(--g2hs-fg)}
.g2hs .g2hs__tab[aria-selected="true"]{
  background:var(--g2hs-accent);border-color:var(--g2hs-accent);color:var(--g2hs-accent-fg);
  box-shadow:0 2px 10px var(--g2hs-accent-soft);
}
.g2hs .g2hs__tab:focus-visible{outline:2px solid var(--g2hs-accent);outline-offset:2px}

.g2hs__sortw{flex:none;position:relative}
.g2hs .g2hs__sortb{
  margin:0;font:inherit;font-size:12.5px;font-weight:700;line-height:1;
  display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;
  border:1px solid var(--g2hs-hairline);background:transparent;color:var(--g2hs-fg);
  cursor:pointer;text-transform:none;height:auto;min-width:0;
}
.g2hs .g2hs__sortb:hover{background:transparent;color:var(--g2hs-fg);border-color:var(--g2hs-accent-line)}
.g2hs .g2hs__sortb svg{flex:none;opacity:.75}
.g2hs .g2hs__sortb:focus-visible{outline:2px solid var(--g2hs-accent);outline-offset:2px}

.g2hs__menu{
  position:absolute;inset-inline-end:0;top:calc(100% + 6px);z-index:30;
  min-width:190px;background:#fff;color:#15171b;
  border:1px solid rgba(0,0,0,.08);border-radius:14px;
  box-shadow:0 16px 38px rgba(0,0,0,.2);padding:6px;display:none;
}
.g2hs__menu[data-open="true"]{display:block}
.g2hs .g2hs__menu button{
  display:flex;width:100%;align-items:center;gap:8px;margin:0;
  font:inherit;font-size:12.5px;font-weight:600;text-align:start;
  padding:9px 10px;border:0;background:transparent;border-radius:9px;
  cursor:pointer;color:inherit;height:auto;text-transform:none;line-height:1.6;
}
.g2hs .g2hs__menu button:hover{background:#f2f4f7;color:inherit}
.g2hs .g2hs__menu button::before{content:"";width:14px;font-size:11px;flex:none}
.g2hs .g2hs__menu button[aria-checked="true"]{font-weight:800}
.g2hs .g2hs__menu button[aria-checked="true"]::before{content:"✓"}

/* اسکلت هنگام واکشی */
.g2hs__sk{border:1px solid var(--g2hs-hairline);border-radius:var(--g2hs-card-radius,14px);
  overflow:hidden;background:var(--g2hs-card-bg)}
.g2hs__sk i{display:block;aspect-ratio:3/4;
  background:linear-gradient(90deg,rgba(128,128,128,.10) 25%,rgba(128,128,128,.2) 37%,rgba(128,128,128,.10) 63%);
  background-size:400% 100%;animation:g2hs-sh 1.25s ease-in-out infinite}
.g2hs__sk b{display:block;height:10px;margin:11px;border-radius:6px;background:rgba(128,128,128,.16)}
@keyframes g2hs-sh{0%{background-position:100% 0}100%{background-position:0 0}}
.g2hs__track.is-busy{opacity:.6}

@media (max-width:767px){
  .g2hs__bar{flex-direction:column;align-items:stretch;gap:7px}
  .g2hs__tabs{margin-inline:-13px;padding-inline:13px;scroll-padding-inline-start:13px}
  .g2hs__sortw{width:100%}
  .g2hs .g2hs__sortb{width:100%;justify-content:center}
  /* روی موبایل منو تمام‌عرض و زیر دکمه باز می‌شود ⇒ امکان سرریز از کادر صفر */
  .g2hs__menu{position:static;width:100%;min-width:0;box-shadow:none;margin-top:6px}
}

/* حالت خالی: ریل از حالت ستونی خارج می‌شود تا پیام تمام‌عرض بنشیند
   و ارتفاع حداقلی می‌گیرد تا اسلایدر جمع نشود و تب‌ها در دسترس بمانند. */
.g2hs__track.is-empty{
  display:block;min-height:190px;
  scroll-snap-type:none;overflow:hidden;
}
.g2hs__empty{
  margin:0;padding:64px 16px;text-align:center;
  font-size:13px;line-height:1.9;color:var(--g2hs-fg-soft);
}

/* ==========================================================================
   استیکرهای متحرک ژانر
   فقط transform و opacity انیمیت می‌شوند: بدون layout، بدون repaint.
   با prefers-reduced-motion و خارج از دید کاملاً متوقف می‌شوند.
   ========================================================================== */
.g2hs__stk{position:absolute;inset:-14px 0;z-index:1;pointer-events:none;overflow:hidden}
.g2hs__stk-i{
  position:absolute;color:var(--g2hs-accent);
  opacity:var(--g2hs-stk-o,.45);
  will-change:transform;
}
.g2hs__stk-i svg{display:block;width:100%;height:100%;fill:currentColor}
.g2hs__stk--a{inset-inline-end:5%;top:-6px;width:34px;height:34px}
.g2hs__stk--b{inset-inline-end:17%;bottom:-8px;width:24px;height:24px}
.g2hs__stk--c{inset-inline-end:28%;top:14px;width:18px;height:18px}

.g2hs__stk-i.is-float{animation:g2hs-float 5.4s ease-in-out infinite}
.g2hs__stk--b.is-float{animation-duration:7s;animation-delay:.9s;animation-direction:reverse}
.g2hs__stk--c.is-float{animation-duration:6.2s;animation-delay:.4s}
.g2hs__stk-i.is-blink{animation:g2hs-blink 4.2s steps(1) infinite}
.g2hs__stk-i.is-bounce{animation:g2hs-bounce 2.4s cubic-bezier(.34,1.56,.64,1) infinite}
.g2hs__stk-i.is-dash{animation:g2hs-dash 1.9s ease-in-out infinite alternate}
.g2hs__stk-i.is-drip{animation:g2hs-drip 3.6s ease-in infinite}
.g2hs__stk-i.is-wave{animation:g2hs-wave 3.2s ease-in-out infinite}
.g2hs__stk-i.is-twinkle{animation:g2hs-twinkle 2.8s ease-in-out infinite}

@keyframes g2hs-float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(6deg)}}
@keyframes g2hs-blink{0%,90%,100%{opacity:var(--g2hs-stk-o,.45)}94%{opacity:.06}}
@keyframes g2hs-bounce{0%,100%{transform:translateY(0)}45%{transform:translateY(-14px)}72%{transform:translateY(-3px)}}
@keyframes g2hs-dash{0%{transform:translateX(0)}100%{transform:translateX(-14px)}}
@keyframes g2hs-drip{0%{transform:translateY(-4px)}30%{transform:translateY(2px)}100%{transform:translateY(12px)}}
@keyframes g2hs-wave{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(8deg)}}
@keyframes g2hs-twinkle{0%,100%{transform:scale(1);opacity:var(--g2hs-stk-o,.45)}50%{transform:scale(1.25);opacity:1}}

/* خارج از دید: انیمیشن‌ها متوقف می‌شوند تا CPU و باتری مصرف نشود */
.g2hs__stk[data-paused="1"] .g2hs__stk-i{animation-play-state:paused}

@media (max-width:767px){
  .g2hs__stk--c{display:none}
  .g2hs__stk--a{width:26px;height:26px}
  .g2hs__stk--b{width:19px;height:19px}
}
@media (prefers-reduced-motion:reduce){
  .g2hs__stk-i{animation:none!important}
}

/* ==========================================================================
   کشیدن با ماوس روی دسکتاپ
   عمداً پشت (hover:hover) و (pointer:fine) قفل شده تا روی لمسی هیچ اثری
   نگذارد؛ آنجا اسکرول بومی مرورگر بهتر از هر پیاده‌سازی دستی است.
   ========================================================================== */
@media (hover:hover) and (pointer:fine){
  .g2hs__track.is-draggable{cursor:grab}
  .g2hs__track.is-dragging{
    cursor:grabbing;
    /* هنگام کشیدن، snap موقتاً خاموش می‌شود تا حرکت روان باشد؛
       با رها‌کردن دوباره روشن می‌گردد و روی نزدیک‌ترین کارت می‌نشیند. */
    scroll-snap-type:none;
    scroll-behavior:auto;
    user-select:none;-webkit-user-select:none;
  }
  .g2hs__track.is-dragging img{-webkit-user-drag:none}
}
