/* ============================================================
   SalarWeb — قالب مدرن — اسلایدر اصلی (sw-hero)  v2
   نقطه‌ها با کلاس اختصاصی sw-dot (محصن در برابر تداخل CSS قدیمی)
   اسلایدهای بدون تصویر: طرح مهندسی‌شده، نه سرمه‌ای صاف
   تصویر: fade-in هنگام لود + تبدیل خودکار به اسلاید طرحی اگر بارگذاری نشود
   ============================================================ */

.sw-hero{position:relative;padding:26px 0 8px}

/* ---------- قاب ---------- */
.sw-hero-frame{
  position:relative;
  overflow:hidden;
  border-radius:22px;
  aspect-ratio:2.55;
  background:
    radial-gradient(circle at 85% 18%,rgba(70,130,200,.28),transparent 34%),
    linear-gradient(115deg,#14406a 0%,#0e2f4f 52%,#0a2138 100%);
  box-shadow:0 22px 48px rgba(9,33,58,.18);
}
.sw-hero-frame:after{
  content:"";
  position:absolute;inset:0;z-index:8;
  border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);
  pointer-events:none;
}

/* ---------- اسلایدها (کراس‌فید) ---------- */
.sw-hero-slide{
  position:absolute;inset:0;
  opacity:0;visibility:hidden;
  transition:opacity .55s ease,visibility 0s linear .55s;
  pointer-events:none;
}
.sw-hero-slide.is-active{
  opacity:1;visibility:visible;
  transition:opacity .55s ease;
  pointer-events:auto;
  z-index:2;
}

/* ---------- اسلاید بدون تصویر: طرح مهندسی‌شده ---------- */
.sw-hero-slide--plain{
  background:
    radial-gradient(circle at 18% 30%,rgba(90,160,235,.20),transparent 30%),
    radial-gradient(circle at 82% 82%,rgba(255,201,74,.10),transparent 36%),
    linear-gradient(115deg,#14406a 0%,#0e2f4f 52%,#0a2138 100%);
}
.sw-hero-slide--plain:before{ /* شبکهٔ تکنولوژی ظریف */
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(circle at 75% 45%,#000 0%,transparent 72%);
  mask-image:radial-gradient(circle at 75% 45%,#000 0%,transparent 72%);
  pointer-events:none;
}
.sw-hero-slide--plain:after{ /* حلقه‌های درخشان */
  content:"";
  position:absolute;z-index:1;
  right:-140px;top:50%;
  width:420px;height:420px;
  transform:translateY(-50%);
  border-radius:50%;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 0 0 56px rgba(255,255,255,.028),0 0 0 118px rgba(255,255,255,.016);
  pointer-events:none;
}

/* ---------- تصویر ---------- */
.sw-hero-media{position:absolute;inset:0;background:#0a2138}
.sw-hero-media img{
  display:block;width:100%;height:100%;
  object-fit:cover;
  object-position:center 42%;
  opacity:0;
  transition:opacity .6s ease;
}
.sw-hero-media img.is-loaded{opacity:1}
.sw-hero-media.is-broken{display:none}
.sw-hero-slide.is-active .sw-hero-media img.is-loaded{
  animation:sw-hero-zoom 9s ease-out forwards;
}
@keyframes sw-hero-zoom{
  from{transform:scale(1.055)}
  to{transform:scale(1)}
}

/* ---------- سکرم (خوانایی متن) ---------- */
.sw-hero-scrim{
  position:absolute;inset:0;
  background:linear-gradient(to left,
    rgba(6,20,34,.92) 0%,
    rgba(6,20,34,.62) 26%,
    rgba(6,20,34,.24) 50%,
    rgba(6,20,34,0) 72%);
}
.sw-hero-slide--plain .sw-hero-scrim{
  background:linear-gradient(to left,
    rgba(6,20,34,.55) 0%,
    rgba(6,20,34,.2) 45%,
    rgba(6,20,34,0) 75%);
}

/* ---------- متن اسلاید ---------- */
.sw-hero-copy{
  position:absolute;z-index:3;
  top:0;bottom:0;inset-inline-start:0;
  display:flex;flex-direction:column;justify-content:center;
  width:54%;max-width:620px;
  padding:44px 58px 64px 40px;
  color:#fff;
  direction:rtl;text-align:right;
}
.sw-hero-badge{
  align-self:flex-start;
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 15px;
  border-radius:999px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2);
  backdrop-filter:blur(6px);
  color:#ffe3a6;
  font-size:11px;font-weight:700;
  letter-spacing:.2px;
}
.sw-hero-badge:before{
  content:"";
  width:7px;height:7px;border-radius:50%;
  background:var(--accent,#ffc94a);
  box-shadow:0 0 10px var(--accent,#ffc94a);
}
.sw-hero-title{
  margin:16px 0 10px;
  font-size:clamp(26px,2.9vw,40px);
  font-weight:800;line-height:1.5;
  max-width:30ch;
  overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  text-shadow:0 2px 18px rgba(0,0,0,.35);
}
.sw-hero-text{
  margin:0;
  color:rgba(235,244,250,.86);
  font-size:13.5px;line-height:2.15;
  max-width:44ch;
  overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
}
.sw-hero-cta{
  align-self:flex-start;
  margin-top:22px;
  min-height:44px;
  display:inline-flex;align-items:center;justify-content:center;
  padding:0 28px;
  border-radius:999px;
  background:linear-gradient(135deg,#ffe29b,#ffbd55);
  color:#15344b;
  font-size:14px;font-weight:800;
  text-decoration:none;
  box-shadow:0 10px 26px rgba(255,190,80,.28);
  transition:transform .25s ease,box-shadow .25s ease;
}
.sw-hero-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 32px rgba(255,190,80,.4);
  color:#15344b;
}
.sw-hero-cta:active{transform:translateY(0) scale(.98)}

/* ---------- فلش‌ها ---------- */
.sw-hero-arrow{
  position:absolute;z-index:5;top:50%;
  transform:translateY(-50%);
  width:44px;height:44px;border-radius:50%;
  border:1px solid rgba(255,255,255,.24);
  background:rgba(10,25,40,.34);
  backdrop-filter:blur(8px);
  color:#fff;
  display:grid;place-items:center;
  cursor:pointer;
  opacity:.55;
  transition:opacity .25s ease,background .25s ease,transform .15s ease;
  -webkit-tap-highlight-color:transparent;
}
.sw-hero-arrow:hover{opacity:1;background:rgba(10,25,40,.58)}
.sw-hero-arrow:active{transform:translateY(-50%) scale(.92)}
.sw-hero-arrow svg{width:20px;height:20px;display:block}
.sw-hero-arrow[data-sw-prev]{inset-inline-start:16px}
.sw-hero-arrow[data-sw-next]{inset-inline-end:16px}
[dir="rtl"] .sw-hero-arrow svg{transform:scaleX(-1)}

/* ---------- نقطه‌ها (رشتهٔ ظریف، سبک دیجی‌کالا) — v3 محکم ----------
   min-width/height:0 + !important به‌صراحت برای خنثی‌کردن قواعد سراسری
   «هدف لمس» (@media pointer:coarse → button{min-height:42px;min-width:42px})
   که در موبایل اندازهٔ نقطه‌ها را به دایره‌های بزرگ تبدیل می‌کرد. */
.sw-hero-dots{
  position:absolute;z-index:5;
  bottom:18px;left:50%;right:50%;
  transform:translateX(50%);
  display:flex;align-items:center;gap:6px;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(6,20,32,.42);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(8px);
}
.sw-hero-dots button,.sw-hero-dots .sw-dot{
  position:relative;overflow:hidden;
  flex:0 0 auto;
  box-sizing:content-box;
  width:7px!important;height:7px!important;
  min-width:0!important;min-height:0!important;
  padding:0!important;margin:0;
  border:0;border-radius:999px;
  background:rgba(255,255,255,.40);
  cursor:pointer;
  transition:width .3s ease,background .3s ease;
  -webkit-tap-highlight-color:transparent;
}
.sw-hero-dots button:hover,.sw-hero-dots .sw-dot:hover{background:rgba(255,255,255,.75)}
.sw-hero-dots button.is-active,.sw-hero-dots .sw-dot.is-active{
  width:24px!important;
  background:rgba(255,255,255,.26);
}
/* لایهٔ اطمینان دوم: هر button داخل جعبهٔ نقطه‌ها، بی‌تقوای min-* می‌شود */
section.sw-hero [data-sw-dots] button,
section.sw-hero .sw-hero-dots button{
  min-width:0!important;min-height:0!important;
  max-width:30px!important;
}
.sw-hero-dots .sw-dot.is-active:after{
  content:"";
  position:absolute;inset:0;width:0;
  border-radius:inherit;
  background:linear-gradient(90deg,#ffe29b,#ffbd55);
}
/* نوار پیشرفت v4: عنصر واقعی که JS (rAF) پخش می‌کند */
.sw-hero-dots .sw-dot .sw-dot-progress{
  position:absolute;inset:0;width:0;
  border-radius:inherit;
  background:linear-gradient(90deg,#ffe29b,#ffbd55);
  pointer-events:none;
}
/* وقتی JS فعال است (کلاس sw-prog-js روی همان جعبه)، نسخهٔ pseudo-element خاموش می‌شود */
.sw-hero-dots.sw-prog-js .sw-dot.is-active:after,
.sw-hero-dots.sw-prog-js button.is-active:after{display:none}
.sw-hero:not(.sw-hero--paused) .sw-hero-dots .sw-dot.is-active:after{
  animation:sw-hero-progress var(--sw-interval,6000ms) linear forwards;
}
@keyframes sw-hero-progress{
  from{width:0}
  to{width:100%}
}

/* ---------- موقعیت‌های تک‌اسلایدی و وضعیت ---------- */
.sw-hero--single .sw-hero-nav,
.sw-hero--single .sw-hero-dots{display:none}
.sw-hero-status{
  position:absolute;width:1px;height:1px;
  overflow:hidden;clip:rect(0 0 0 0);
  clip-path:inset(50%);white-space:nowrap;
}
.sw-hero:focus-visible{
  outline:3px solid rgba(255,201,74,.55);
  outline-offset:3px;
  border-radius:26px;
}

/* ---------- RTL/LTR: اسلاید بدون تصویر، حلقه‌ها سمت خالی ---------- */
[dir="ltr"] .sw-hero-slide--plain:before{
  -webkit-mask-image:radial-gradient(circle at 25% 45%,#000 0%,transparent 72%);
  mask-image:radial-gradient(circle at 25% 45%,#000 0%,transparent 72%);
}
[dir="ltr"] .sw-hero-slide--plain:after{
  right:auto;left:-140px;
}
[dir="ltr"] .sw-hero-scrim{
  background:linear-gradient(to right,
    rgba(6,20,34,.92) 0%,
    rgba(6,20,34,.62) 26%,
    rgba(6,20,34,.24) 50%,
    rgba(6,20,34,0) 72%);
}
[dir="ltr"] .sw-hero-slide--plain .sw-hero-scrim{
  background:linear-gradient(to right,
    rgba(6,20,34,.55) 0%,
    rgba(6,20,34,.2) 45%,
    rgba(6,20,34,0) 75%);
}

/* ---------- تبلت ---------- */
@media (max-width:899px){
  .sw-hero-frame{aspect-ratio:1.7}
  .sw-hero-media img{object-position:center 40%}
  .sw-hero-copy{width:74%;max-width:none;padding:38px 38px 60px 30px}
  .sw-hero-title{font-size:clamp(23px,3.4vw,30px)}
  .sw-hero-arrow{width:38px;height:38px}
  .sw-hero-arrow svg{width:18px;height:18px}
}

/* ---------- موبایل ---------- */
@media (max-width:599px){
  .sw-hero{padding:14px 0 4px}
  .sw-hero-frame{aspect-ratio:.8;border-radius:18px}
  .sw-hero-media img{object-position:12% 42%}
  .sw-hero-scrim{
    background:linear-gradient(to top,
      rgba(5,16,28,.95) 0%,
      rgba(5,16,28,.66) 36%,
      rgba(5,16,28,.2) 62%,
      rgba(5,16,28,0) 82%);
  }
  .sw-hero-copy{
    top:auto;bottom:0;
    width:100%;max-width:none;
    align-items:center;text-align:center;
    padding:18px 20px 58px;
  }
  .sw-hero-badge{font-size:10px;padding:6px 12px}
  .sw-hero-title{margin:12px 0 8px;font-size:clamp(21px,5.8vw,26px);max-width:none;text-align:center}
  .sw-hero-text{font-size:12.5px;line-height:2;max-width:none}
  .sw-hero-cta{margin-top:16px;min-height:42px;padding:0 26px;font-size:13px}
  .sw-hero-nav{display:none}
  .sw-hero-dots{bottom:12px;padding:6px 10px;gap:5px}
  .sw-hero-dots button,.sw-hero-dots .sw-dot{width:6px!important;height:6px!important;min-width:0!important;min-height:0!important}
  .sw-hero-dots button.is-active,.sw-hero-dots .sw-dot.is-active{width:20px!important}
}

/* ---------- کاهش حرکت ---------- */
@media (prefers-reduced-motion:reduce){
  .sw-hero-slide{transition:opacity .2s ease,visibility 0s linear .2s}
  .sw-hero-slide.is-active .sw-hero-media img{animation:none}
  .sw-hero:not(.sw-hero--paused) .sw-hero-dots .sw-dot.is-active:after{
    animation:none;width:100%;
  }
  .sw-hero-cta{transition:none}
}