/* ISO Wizard — ظاهر جدید (فقط CSS؛ HTML و JS بدون تغییر)
   رنگ‌های اصلی: #243c4f و #0077C8 روی زمینهٔ سفید
   همه استایل‌ها زیر .isow اسکوپ شده‌اند */

.isow{
  --navy:#243c4f; --navy-deep:#182a39;
  --blue:#0077C8; --blue-deep:#005f9e;
  --blue-soft:#eaf4fc; --blue-line:#b9dbf3;
  --ink:#243c4f; --muted:#5f7283;
  --line:#e1e8ee; --bg:#fff; --soft:#f5f8fb;
  --shadow-1:0 1px 2px rgba(36,60,79,.06),0 8px 20px -10px rgba(36,60,79,.16);
  --shadow-2:0 2px 4px rgba(36,60,79,.08),0 16px 32px -14px rgba(36,60,79,.26);
  --ring:0 0 0 3px rgba(0,119,200,.38);
    font-family: 'IRANYekan',Tahoma,Arial,sans-serif;
  color: var(--ink);background: var(--bg);max-width: 880px;margin: 0 auto;
  padding: 22px 16px 28px;line-height: 1.8;box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}
.isow *{box-sizing: border-box}
.isow button,.isow input,.isow select,.isow textarea,.isow a{font-family: 'IRANYekan',Tahoma,Arial,sans-serif}

/* ---------- Header ---------- */
.isow-head{text-align: center;margin-bottom: 22px}
.isow-title{margin: 0;font-size: clamp(1.25rem,4.6vw,1.75rem);font-weight: 800;color: var(--navy);line-height: 1.5}
.isow-sub{margin: 6px 0 0;color: var(--muted);font-size: .92rem}

/* ---------- Stepper ---------- */
.isow-progress{list-style: none;margin: 0 0 24px;padding: 0;display: flex;font-size: .76rem;color: var(--muted)}
.isow-progress li{
  flex: 1;position: relative;display: flex;flex-direction: column;align-items: center;
  gap: 6px;text-align: center;line-height: 1.4;padding: 0 2px;transition: color .3s;
}
.isow-progress li b{
  position: relative;z-index: 1;width: 34px;height: 34px;display: grid;place-items: center;
  border-radius: 50%;background: #fff;border: 2px solid var(--line);color: var(--muted);
  font-size: .82rem;font-weight: 700;transition: background .3s,border-color .3s,color .3s,box-shadow .3s;
}
.isow-progress li:not(:last-child)::after{
  content: "";position: absolute;top: 16px;height: 2px;inset-inline-start: 50%;width: 100%;
  background: var(--line);transition: background .4s;
}
.isow-progress li.done{color: var(--blue-deep)}
.isow-progress li.done b{background: var(--blue);border-color: var(--blue);color: #fff}
.isow-progress li.done::after{background: var(--blue)}
.isow-progress li.cur{color: var(--navy);font-weight: 700}
.isow-progress li.cur b{background: var(--navy);border-color: var(--navy);color: #fff;box-shadow: 0 0 0 5px rgba(0,119,200,.18)}
.isow-bar{display: none} /* جایگزین شده با stepper */

/* ---------- Stage ---------- */
.isow-pane{animation: isowIn .35s ease}
@keyframes isowIn{from{opacity: 0;transform: translateY(8px)}to{opacity: 1;transform: none}}
.isow-q{margin: 0 0 6px;font-size: clamp(1.1rem,3.8vw,1.35rem);font-weight: 800;color: var(--navy);line-height: 1.6;outline: none}
.isow-hint{margin: 0 0 16px;color: var(--muted);font-size: .88rem;display: flex;justify-content: space-between;align-items: center;gap: 8px;flex-wrap: wrap}
.isow-count{background: var(--blue-soft);color: var(--blue-deep);font-weight: 700;font-size: .78rem;padding: 2px 12px;border-radius: 20px}
.isow-count:empty{display: none}
.isow-grid{display: grid;gap: 10px;grid-template-columns: 1fr}
@media(min-width:640px){.isow-grid{grid-template-columns: 1fr 1fr;gap: 12px}}

.isow-crumb{
  display: inline-flex;align-items: center;gap: 4px;font-size: .8rem;color: var(--muted);
  background: var(--blue-soft);border: 1px solid var(--blue-line);
  padding: 4px 14px;border-radius: 20px;margin-bottom: 12px;
}
.isow-crumb b{color: var(--blue-deep);font-weight: 700}

/* ---------- Selection cards ---------- */
.isow-card{
  display: flex;gap: 12px;align-items: center;text-align: right;width: 100%;min-height: 68px;
  font: inherit;color: inherit;background: var(--bg);border: 1.5px solid var(--line);
  border-radius: 16px;padding: 12px 14px;cursor: pointer;position: relative;
  transition: border-color .2s,background .2s,box-shadow .2s,transform .15s;
}
@media(hover:hover){
  .isow-card:hover{border-color: var(--blue-line);background: var(--soft);box-shadow: var(--shadow-1)}
}
.isow-card:active{transform: scale(.985)}
.isow-card:focus-visible{outline: none;box-shadow: var(--ring)}
.isow-card.sel{border-color: var(--blue);background: var(--blue-soft);box-shadow: 0 0 0 1px var(--blue) inset,0 8px 20px -12px rgba(0,119,200,.5)}
.isow-ico{font-size: 1.5rem;width: 44px;height: 44px;flex: none;display: grid;place-items: center;background: var(--soft);border-radius: 12px;transition: background .2s}
.isow-card.sel .isow-ico{background: #fff}
.isow-txt{min-width: 0}
.isow-txt b{display: block;font-size: .95rem;font-weight: 700;color: var(--navy);line-height: 1.6}
.isow-txt small{display: block;color: var(--muted);font-size: .78rem;line-height: 1.6}
.isow-mark{
  margin-inline-start: auto;width: 24px;height: 24px;flex: none;border: 1.5px solid #cbd5de;
  border-radius: 8px;display: grid;place-items: center;color: transparent;font-size: .8rem;font-weight: 700;
  transition: background .2s,border-color .2s,color .2s,transform .2s;
}
.isow-mark.r{border-radius: 50%}
.isow-card.sel .isow-mark{background: var(--blue);border-color: var(--blue);color: #fff;transform: scale(1.05)}

/* ---------- Buttons & nav ---------- */
.isow-nav{display: flex;justify-content: space-between;align-items: center;gap: 10px;margin-top: 24px}
.isow-nav:empty{display: none}
.isow-btn{
  font: inherit;font-weight: 700;border: 0;border-radius: 14px;padding: 12px 24px;min-height: 48px;
  cursor: pointer;transition: background .2s,border-color .2s,box-shadow .2s,transform .15s,color .2s;
  font-size: .95rem;text-decoration: none;display: inline-flex;align-items: center;justify-content: center;text-align: center;
}
.isow-btn.primary{background: var(--blue);color: #fff;box-shadow: 0 8px 18px -8px rgba(0,119,200,.7)}
.isow-btn.primary:hover:not(:disabled){background: var(--blue-deep)}
.isow-btn:active:not(:disabled){transform: translateY(1px)}
.isow-btn.ghost{background: #fff;color: var(--navy);border: 1.5px solid var(--line)}
.isow-btn.ghost:hover{border-color: var(--blue);color: var(--blue-deep);background: var(--blue-soft)}
.isow-btn:disabled{opacity: .4;cursor: not-allowed;box-shadow: none}
.isow-btn:focus-visible{outline: none;box-shadow: var(--ring)}

/* ---------- Result sections ---------- */
.isow-sec{margin: 0 0 28px}
.isow-sec h3{margin: 0 0 2px;font-size: 1.08rem;font-weight: 800;color: var(--navy);display: flex;align-items: center;gap: 10px}
.isow-sec h3::before{content: "";width: 4px;height: 20px;border-radius: 4px;background: #c80000;flex: none}
.isow-sec>p{margin: 0 0 14px;color: var(--muted);font-size: .85rem;padding-inline-start: 14px}

/* ---------- Result cards ---------- */
.isow-res{
  position: relative;overflow: hidden;background: #fff;border: 1px solid var(--line);
  border-radius: 20px;padding: 16px 18px 16px 18px;padding-inline-start: 22px;
  margin-bottom: 12px;box-shadow: var(--shadow-1);transition: box-shadow .25s,transform .25s;
}
.isow-res::before{content: "";position: absolute;inset-block: 0;inset-inline-start: 0;width: 4px;background: linear-gradient(180deg, #c80000, #ec6262)}
@media(hover:hover){.isow-res:hover{box-shadow: var(--shadow-2);transform: translateY(-2px)}}
.isow-rhead{display: flex;align-items: center;gap: 10px;flex-wrap: wrap}
.isow-rank{min-width: 32px;height: 32px;display: grid;place-items: center;background: var(--navy);color: #fff;border-radius: 10px;padding: 0 8px;font-size: 1.3rem;font-weight: 700}
.isow-code{font-size: 1.12rem;font-weight: 800;color: var(--navy);direction: ltr;unicode-bidi: isolate;letter-spacing: .01em}
.isow-rtitle{color: var(--muted);font-size: .9rem}
.isow-badge{
  margin-inline-start: auto;font-size: .74rem;font-weight: 700;white-space: nowrap;
  padding: 3px 12px;border-radius: 20px;background: var(--soft);color: var(--muted);border: 1px solid var(--line);
}
.isow-badge.b2{background: var(--blue-soft);color: var(--blue-deep);border-color: var(--blue-line)}
.isow-badge.b3{background: var(--blue);color: #fff;border-color: var(--blue)}
.isow-meter{height: 6px;background: #e8eef3;border-radius: 6px;margin: 12px 0;overflow: hidden}
.isow-meter span{display: block;height: 100%;background: linear-gradient(90deg, #0019c8, #ea5d5d);border-radius: 6px;transform-origin: 100% 50%;animation: isowFill .9s cubic-bezier(.2,.7,.2,1) both .15s}
@keyframes isowFill{from{transform: scaleX(0)}to{transform: scaleX(1)}}
.isow-reason{margin: 0;font-size: .88rem;color: #3b5163;line-height: 1.95}
.isow-tag{
  display: inline-flex;align-items: center;margin-top: 10px;font-size: .74rem;font-weight: 700;color: var(--navy);
  background: var(--soft);border: 1px solid var(--line);border-radius: 20px;padding: 1px 12px;
}
.isow-tag::before{content: "";width: 6px;height: 6px;border-radius: 50%;background: var(--blue);margin-inline-end: 7px}
.isow-guides{display: flex;flex-wrap: wrap;gap: 6px;align-items: center;margin-top: 12px;padding-top: 12px;border-top: 1px solid var(--line)}
.isow-glbl{font-size: .75rem;color: var(--muted);font-weight: 700}
.isow-gtag{font-size: .72rem;color: var(--blue-deep);background: var(--blue-soft);border: 1px solid var(--blue-line);border-radius: 8px;padding: 2px 9px;line-height: 1.7}
.isow-gtag b{font-weight: 700}

/* ---------- Hero card ---------- */
.isow-hero{
  position: relative;overflow: hidden;color: #fff;
  background: radial-gradient(120% 90% at 0% 0%,rgba(0,119,200,.62),transparent 58%),
    linear-gradient(160deg,#484848 0%,var(--navy) 55%,var(--navy-deep) 100%);
  border-radius: 24px;padding: 22px 20px;margin: 18px 0 28px;
  box-shadow: 0 24px 40px -22px rgba(58,58,58,.7),0 4px 10px rgba(58,58,58,.12);
}
.isow-hero::after{ /* حلقهٔ تزئینی */
  content: "";position: absolute;width: 260px;height: 260px;border-radius: 50%;
  inset-block-end: -130px;inset-inline-end: -90px;pointer-events: none;
  border: 36px solid rgba(255,255,255,.05);
}
.isow-hero>*{position: relative;z-index: 1}
.isow-hero-lbl{
  display: inline-flex;align-items: center;gap: 6px;font-size: .8rem;font-weight: 700;color: #fff;
  background: rgba(255,255,255,.14);border: 1px solid rgba(255,255,255,.28);
  padding: 4px 14px;border-radius: 20px;margin-bottom: 14px;
  -webkit-backdrop-filter: blur(6px);backdrop-filter: blur(6px);
}
.isow-hero-head{display: flex;align-items: center;gap: 8px 12px;flex-wrap: wrap;margin-bottom: 4px}
.isow-hero-head .isow-code{font-size: clamp(1.55rem,6vw,2rem);font-weight: 800;color: #fff;line-height: 1.3}
.isow-hero-head .isow-rtitle{font-size: .98rem;color: rgba(255,255,255,.78);order: 2;flex-basis: 100%}
.isow-hero-head .isow-badge{order: 1;margin-inline-start: auto;background: #fff;color: var(--navy);border-color: #fff;font-size: .76rem}
.isow-hero .isow-meter{height: 8px;margin: 14px 0;background: rgba(255,255,255,.18)}
.isow-hero .isow-meter span{background: linear-gradient(90deg,#3da2e6,#bfe3fb)}
.isow-hero .isow-reason{font-size: .92rem;line-height: 1.95;color: rgba(255,255,255,.9)}
.isow-hero .isow-tag{color: #fff;background: rgba(255,255,255,.12);border-color: rgba(255,255,255,.26)}
.isow-hero .isow-tag::before{background: #7cc4f2}
.isow-hero .isow-guides{border-top-color: rgba(255,255,255,.2)}
.isow-hero .isow-glbl{color: rgba(255,255,255,.72)}
.isow-hero .isow-gtag{color: #fff;background: rgba(255,255,255,.12);border-color: rgba(255,255,255,.24)}

/* ===== مکمل‌ها (HACCP/HALAL/CE) ===== */
.isow-supp-sec h3::before{background: #9aa9b6}
.isow-supp{
  border-inline-start-color: #c3d2de;
  background: linear-gradient(180deg,#fff,#fafcfe);
}
.isow-supp::before{background: linear-gradient(180deg,#9fb3c3,#c9d6e0)}
.isow-supp .isow-badge{background: #eef2f6;color: #5f7283;border-color: #d5dee6}
.isow-supp .isow-reason{font-size: .85rem;color: #5f7283}
/* ===== Loading state ===== */
.isow-loading{
  display: flex;flex-direction: column;align-items: center;justify-content: center;
  text-align: center;padding: 56px 20px 48px;min-height: 340px;
}
.isow-spinner{
  width: 56px;height: 56px;border-radius: 50%;
  border: 4px solid var(--blue-soft);border-top-color: var(--blue);
  animation: isowSpin .9s linear infinite;margin-bottom: 22px;
}
@keyframes isowSpin{to{transform: rotate(360deg)}}
.isow-loading-title{
  margin: 0 0 8px;font-size: clamp(1.05rem,3.6vw,1.25rem);font-weight: 800;color: var(--ink);
}
.isow-loading-msg{
  margin: 0 0 22px;color: var(--muted);font-size: .92rem;min-height: 1.6em;
}
.isow-loading-bar{
  width: min(320px,80%);height: 6px;background: #e8eef3;border-radius: 6px;overflow: hidden;
}
.isow-loading-bar span{
  display: block;height: 100%;width: 0;
  background: linear-gradient(90deg,var(--blue),#5db3ea);
  border-radius: 6px;
  transition: width 3.8s cubic-bezier(.35,0,.25,1);
}
@media(prefers-reduced-motion:reduce){
  .isow-spinner{animation: none}
  .isow-loading-bar span{transition: none;width: 100%}
}

/* ---------- Extras ---------- */
.isow-ims{
  background: linear-gradient(135deg,var(--blue-soft),#fff);border: 1px solid var(--blue-line);
  border-inline-start: 4px solid var(--blue);border-radius: 16px;padding: 14px 18px;margin-bottom: 26px;font-size: .9rem;
}
.isow-ims b{color: var(--navy)}
.isow-empty{background: var(--soft);border: 1px dashed #c9d5df;border-radius: 18px;padding: 24px;text-align: center;color: #3b5163}
.isow-note{font-size: .78rem;color: var(--muted);margin: 14px 0 0;text-align: center}
.isow-actions{display: flex;gap: 10px;flex-wrap: wrap;justify-content: center;margin-top: 20px}

/* ---------- Mobile ---------- */
@media(max-width:639px){
  .isow{padding: 18px 14px 24px}
  .isow-progress{font-size: .7rem;margin-bottom: 20px}
  .isow-progress li b{width: 30px;height: 30px}
  .isow-progress li:not(:last-child)::after{top: 14px}
  .isow-card{padding: 12px}
  .isow-res{padding: 14px 14px 14px;padding-inline-start: 18px;border-radius: 18px}
  /* ردیف اول: رتبه + کد + نشان | ردیف دوم: عنوان */
  .isow-res .isow-rtitle{order: 2;flex-basis: 100%}
  .isow-res .isow-badge{order: 1}
  .isow-hero{padding: 20px 16px;border-radius: 22px}
  /* نوار ناوبری چسبیده به پایین برای دسترسی با انگشت شست */
  .isow-nav{
    position: sticky;bottom: 0;z-index: 5;margin: 20px -14px -24px;
    padding: 12px 14px calc(12px + env(safe-area-inset-bottom,0px));
    background: rgba(255,255,255,.94);border-top: 1px solid var(--line);
    -webkit-backdrop-filter: blur(10px);backdrop-filter: blur(10px);
  }
  .isow-nav .isow-btn.primary{flex: 1}
  .isow-actions{flex-direction: column}
  .isow-actions .isow-btn{width: 100%}
}

@media(prefers-reduced-motion:reduce){.isow *{animation: none!important;transition: none!important}}

/* QAL page integration */
.iso-analysis-page .qal-inner-hero{background: linear-gradient(128deg,#061d2a 0%,#07384d 48%,#08758b 100%)}
.iso-analysis-page .qal-inner-hero::after{background: #f8fbfd}
.iso-analysis-page .qal-inner-hero__orb::before,.iso-analysis-page .qal-inner-hero__orb::after{border-color: rgba(103,232,249,.12)}
.iso-analysis-page .qal-inner-breadcrumb a:hover{color: #67e8f9}
body.modern-home.theme-dark .iso-analysis-page .qal-inner-hero{background: linear-gradient(128deg,#061d2a 0%,#07384d 48%,#08758b 100%)}
body.modern-home.theme-dark .iso-analysis-page .qal-inner-hero::after{background: #091923}
.iso-analysis-shell{position: relative;padding: 64px 0 88px;background: radial-gradient(circle at 8% 12%,rgba(0,119,200,.08),transparent 27%),linear-gradient(180deg,#f8fbfd,#edf5fb)}.iso-analysis-shell .isow{position: relative;overflow: hidden;max-width: 980px;padding: 38px 42px 42px;border: 1px solid rgba(36,60,79,.13);border-radius: 30px;box-shadow: 0 25px 65px rgba(36,60,79,.1)}.iso-analysis-shell .isow:before{position: absolute;right: -100px;top: -120px;width: 280px;height: 280px;border: 1px solid rgba(0,119,200,.07);border-radius: 50%;box-shadow: 0 0 0 42px rgba(0,119,200,.025);content: "";pointer-events: none}.iso-analysis-shell .isow>*{position: relative}.iso-analysis-badge{display: inline-flex;margin-bottom: 10px;padding: 5px 13px;border-radius: 999px;background: #eaf4fc;color: #005f9e;font-size: .72rem;font-weight: 800}.iso-analysis-shell .isow-head{margin-bottom: 30px}.iso-analysis-shell .isow-title{font-size: clamp(1.45rem,3vw,2rem)}body.modern-home.theme-dark .iso-analysis-shell{background: radial-gradient(circle at 8% 12%,rgba(0,119,200,.05),transparent 27%),#091923}body.modern-home.theme-dark .iso-analysis-shell .isow{--ink: #e3eef5;--muted: #a5b9c9;--line: rgba(125,179,215,.14);--bg: #102532;--soft: #163141;--blue-soft: #18394f;--blue-line: rgba(83,165,220,.24);background: #102532;border-color: rgba(125,179,215,.13)}body.modern-home.theme-dark .isow-title,body.modern-home.theme-dark .isow-q,body.modern-home.theme-dark .isow-txt b,body.modern-home.theme-dark .isow-sec h3,body.modern-home.theme-dark .isow-code,body.modern-home.theme-dark .isow-ims b{color: #e5f1f9}body.modern-home.theme-dark .isow-card,body.modern-home.theme-dark .isow-res,body.modern-home.theme-dark .isow-progress li b,body.modern-home.theme-dark .isow-btn.ghost{background: #163141}body.modern-home.theme-dark .isow-reason{color: #c0d3e1}
@media(max-width:767px){.iso-analysis-shell{padding: 42px 0 60px}.iso-analysis-shell .isow{padding: 27px 18px 30px;border-radius: 22px}}

/* Result and mobile dark-mode consistency */
.iso-analysis-shell .isow{scroll-margin-top: 18px}
body.modern-home.theme-dark .isow-ims{border-color: rgba(83,165,220,.24);border-inline-start-color: #53a5dc;background: linear-gradient(135deg,#18394f,#122c3d);color: #c9dfed}
body.modern-home.theme-dark .isow-actions .isow-btn.ghost{border-color: rgba(83,165,220,.24);background: #163141;color: #e3eef5}
body.modern-home.theme-dark .isow-actions .isow-btn.ghost:hover{border-color: #53a5dc;background: #1b4057;color: #f1f8fd}
body.modern-home.theme-dark .isow-nav .isow-btn.ghost{border-color: rgba(125,179,215,.42);background: #1a3b50;color: #edf6fc;box-shadow: 0 5px 16px rgba(0,0,0,.16)}
body.modern-home.theme-dark .isow-nav .isow-btn.ghost:hover{border-color: #77bde9;background: #214b64;color: #fff}
@media(max-width:639px){body.modern-home.theme-dark .isow-nav{border-top-color: rgba(125,179,215,.14);background: rgba(16,37,50,.96)}}
