/* ================================
   WSI Signature Styles (Scoped: .wsi)
   ================================ */

/* IRANSans لوکال */
@font-face{
  font-family:'IRANSans';
  src:url('/modules/header-a/storage/fonts/IRANSans.eot');
  src:url('/modules/header-a/storage/fonts/IRANSans.eot?#iefix') format('embedded-opentype'),
      url('/modules/header-a/storage/fonts/IRANSans.woff2') format('woff2'),
      url('/modules/header-a/storage/fonts/IRANSans.woff') format('woff'),
      url('/modules/header-a/storage/fonts/IRANSans.ttf') format('truetype');
  font-style:normal;font-weight:400;font-display:swap;
}
.wsi{
  --brand:#5b6cff; --brand2:#7b8bff; --accent:#ff6a95; --ink:#0f1230; --muted:#6d7390;
  --surface:#ffffff; --soft:#f6f7ff; --glass:rgba(255,255,255,.55); --stroke:#e8ebff;
  --radius:18px; --r12:12px; --shadow:0 16px 36px rgba(15,18,48,.12);
  font-family: IRANSans, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--ink);
}
.wsi__container{max-width:1200px;margin:0 auto;padding:18px}

/* ---------- HERO ---------- */
.wsi-hero{
  position:relative; overflow:hidden;
  display:grid; grid-template-columns: 1fr .9fr; gap:20px; align-items:center;
  background:linear-gradient(135deg,#fafbff,#ffffff);
  border:1px solid var(--stroke); border-radius:var(--radius); box-shadow:var(--shadow);
  padding:20px 20px;
}
@media (max-width:980px){ .wsi-hero{grid-template-columns:1fr} }

/* جابجایی ستون‌ها با کلاس wsi--swap */
.wsi--swap .wsi-hero{ grid-template-columns: .9fr 1fr; }
.wsi--swap .wsi-hero__art{ order:2; }
.wsi--swap .wsi-hero__text{ order:1; }
@media (max-width:980px){
  .wsi--swap .wsi-hero{ grid-template-columns:1fr; }
  .wsi--swap .wsi-hero__art, .wsi--swap .wsi-hero__text{ order:unset; }
}

.wsi-hero__art{position:relative; min-height:220px; isolation:isolate}
.wsi-orb{
  position:absolute; border-radius:50%; filter: blur(32px); pointer-events:none; transform: translateZ(0);
}
.wsi-orb--a{ width:360px;height:360px; inset:auto -60px -120px auto;
  background:radial-gradient(circle at 30% 30%, rgba(255,106,149,.45), rgba(91,108,255,.28), transparent 70%); }
.wsi-orb--b{ width:260px;height:260px; inset:-40px auto auto -40px;
  background:radial-gradient(circle at 30% 30%, rgba(91,108,255,.38), rgba(123,139,255,.26), transparent 70%); }

/* چیپ‌های شیشه‌ای */
.wsi-glasschip{
  position:absolute; display:flex; align-items:center; gap:8px;
  padding:10px 14px; border-radius:14px; backdrop-filter: blur(10px);
  background:var(--glass); border:1px solid rgba(255,255,255,.6);
  box-shadow:0 12px 26px rgba(15,18,48,.12); font-weight:900; color:#2a2e56;
  will-change: transform;
}
.wsi-glasschip i{
  width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--accent));
}
/* چیدمان نامنظم ۵ چیپ */
.wsi-glasschip--1{ inset:  8px auto auto 18px; }                    /* بالا چپ */
.wsi-glasschip--2{ inset: auto 22px 18px auto; }                    /* پایین راست */
.wsi-glasschip--3{ inset: 50% auto auto 40px; transform:translateY(-50%);} /* میانه چپ */
.wsi-glasschip--4{ inset: auto auto 10px 50%; transform:translateX(-30%);}  /* پایین میانه */
.wsi-glasschip--5{ inset: 22px 28% auto auto; }                     /* بالا راست داخل */
@media (max-width:980px){
  .wsi-glasschip--1{ inset:  8px auto auto 10px; }
  .wsi-glasschip--2{ inset: auto 10px 10px auto; }
  .wsi-glasschip--3{ inset: 55% auto auto 8px; transform:translateY(-50%); }
  .wsi-glasschip--4{ inset: auto auto 6px 45%; transform:translateX(-30%); }
  .wsi-glasschip--5{ inset: 12px 18% auto auto; }
}

/* متن هرو */
.wsi-pill{
  display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;
  background:linear-gradient(135deg,rgba(91,108,255,.14),rgba(255,106,149,.18)); font-weight:900; color:#2a2e56;
}
.wsi-pill i{ color:var(--brand) }
.wsi-title{
  font-family:'Lalezar', cursive; font-size:42px; line-height:1.15; margin:10px 0 6px; letter-spacing:.3px; color:#0f1230;
}
.wsi-lead{ margin:0 0 12px; color:var(--muted); line-height:2; font-size:15px }

/* CTA */
.wsi-cta{ display:flex; gap:10px; flex-wrap:wrap }
.wsi-btn{
  display:inline-flex; align-items:center; gap:8px; text-decoration:none; line-height:1;
  padding:11px 16px; border-radius:12px; border:1px solid transparent; font-weight:900;
  transition: transform .12s ease, box-shadow .15s ease, filter .15s ease;
}
.wsi-btn i{ font-size:14px }
.wsi-btn--primary{ color:#fff; background:linear-gradient(135deg,var(--brand),var(--accent));
  box-shadow:0 14px 28px rgba(91,108,255,.22); }
.wsi-btn--ghost{ color:var(--brand); background:#fff; border-color:var(--stroke) }
.wsi-btn:hover{ transform: translateY(-1px) }
.wsi-btn--ghost:hover{ background:#f9faff }
.wsi-btn--primary:hover{ filter:saturate(1.06) }

/* ---------- FEATURES ---------- */
.wsi-features{ margin-top:16px }
.wsi-subtitle{
  display:flex; align-items:center; gap:8px; margin:0 6px 10px; font-weight:900; color:#101438;padding: 15px;
}
.wsi-subtitle i{
  width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--accent));
}
.wsi-grid{
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px;
}
@media (max-width:1180px){ .wsi-grid{grid-template-columns:repeat(3,1fr)} }
@media (max-width:720px){  .wsi-grid{grid-template-columns:1fr} }

.wsi-card{
  position:relative; background:var(--surface); border:1px solid var(--stroke); border-radius:16px;
  padding:14px; box-shadow:0 12px 26px rgba(15,18,48,.08); transform: translateY(0);
  transition: transform .18s ease, box-shadow .18s ease;
}
.wsi-card.is-shift{ transform: translateY(8px) }
.wsi-card:hover{ transform: translateY(-4px); box-shadow:0 16px 34px rgba(15,18,48,.12) }
.wsi-card__icon{
  width:40px;height:40px;border-radius:10px;display:grid;place-items:center;margin-bottom:8px;color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--accent));
}
.wsi-card__icon i{ font-size:16px }
.wsi-card__title{ margin:0 0 4px; font-weight:900 }
.wsi-card__desc{ margin:0; color:var(--muted); line-height:1.9 }

/* کمی فشرده‌تر از حالت پیش‌فرض */
.wsi-hero{ padding:18px }
.wsi-title{ font-size:38px }
@media (max-width:980px){ .wsi-title{ font-size:34px } }

/* Dark mode */