:root{--LY:70px;--amber-bg:#fff6d9;--amber-line:#eadca9;--amber-ink:#584817}
/* sales process map */
  .portal { width: min(1280px,100%); margin: auto; padding: 30px 26px 52px; }

  .hero { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 30px 38px; border-radius: 26px; background: linear-gradient(120deg,#071b36 0%,#0d2b56 72%,#123b72 100%); color: #fff; box-shadow: 0 24px 64px rgba(7,27,54,.17); }
  .hero::after { content: ""; position: absolute; width: 360px; height: 360px; left: -85px; bottom: -235px; border: 1px solid rgba(255,204,42,.35); border-radius: 50%; box-shadow: 0 0 0 35px rgba(255,204,42,.06), 0 0 0 70px rgba(255,204,42,.035); }
  .hero > * { position: relative; z-index: 1; }
  .eyebrow { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; color: #ffdc71; font-size: 12px; font-weight: 700; }
  .eyebrow::before { content: ""; width: 21px; height: 2px; background: var(--ms-gold); }
  .hero h1 { margin: 0; font-size: clamp(24px,3vw,34px); line-height: 1.4; letter-spacing: -.02em; font-weight: 800; }
  .hero p { margin: 8px 0 0; color: #d7e3f2; font-size: 13px; }
  .hero .meta { text-align: left; color: #b9c9de; font-size:12px; white-space: nowrap; }
  .hero .meta b { display: block; color: #fff; font-size: 13px; margin-bottom: 2px; letter-spacing: .04em; }

  .prereq { display: flex; align-items: center; gap: 8px; margin: 14px 4px 0; color: var(--ms-muted); font-size: 12px; }
  .prereq::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--ms-gold); }

  .legend { display: flex; flex-wrap: wrap; gap: 18px; margin: 14px 4px 0; color: var(--ms-muted); font-size:12px; }
  .legend span { display: inline-flex; align-items: center; gap: 7px; }
  .legend i { display: inline-block; width: 14px; height: 14px; border-radius: 50%; background: var(--ms-navy); }
  .legend i.g { background: var(--ms-gold); }
  .legend i.q { border-radius: 4px; background: var(--amber-bg); border: 1px solid var(--amber-line); }
  .legend i.n { border-radius: 4px; background: #f2f4f8; border: 1px solid var(--ms-line); }

  /* ── مسیر ── */
  .flow-card { position: relative; margin-top: 14px; padding: 26px 30px 12px; border: 1px solid var(--ms-line); border-radius: 22px; background: #fff; box-shadow: var(--ms-shadow); }
  .row { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); padding-bottom: 26px; min-height: 270px; }
  .row.ltr { direction: ltr; }
  .row.last { min-height: 0; padding-bottom: 14px; }

  .flow-line { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
  .step { position: relative; direction: rtl; text-align: center; padding: 0 14px; }
  .step h2 { margin: 0; height: 34px; line-height: 34px; font-size: 15px; font-weight: 800; color: var(--ms-navy); }
  .node { position: relative; z-index: 1; width: 46px; height: 46px; margin: 7px auto 0; border-radius: 50%; display: grid; place-items: center; background: var(--ms-navy); color: #fff; font-size: 19px; font-weight: 800; }
  .node.g { background: var(--ms-gold); color: var(--ms-navy); }

  .role { margin-top: 12px; color: var(--ms-muted); font-size:12px; font-weight: 600; }
  .desc { margin-top: 5px; min-height: 62px; font-size: 12.5px; line-height: 1.85; }
  .desc span { display: block; }
  .box { margin-top: 10px; padding: 9px 11px; border-radius: 13px; border: 1px solid var(--ms-line); background: #f2f4f8; color: #4a5a72; font-size:12px; line-height: 1.85; }
  .box.q { background: var(--amber-bg); border-color: var(--amber-line); color: var(--amber-ink); }
  .box span { display: block; }

  /* ── پایین صفحه ── */
  .strip { display: flex; align-items: flex-start; gap: 12px; margin-top: 14px; padding: 14px 18px; border: 1px solid #cad9fb; border-radius: 15px; background: #f5f8ff; color: #1746b5; font-size: 12.5px; font-weight: 700; }
  .strip svg { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 3px; }
  .note { margin-top: 12px; padding: 14px 18px; border: 1px solid var(--amber-line); border-radius: 15px; background: #fffaf0; color: var(--amber-ink); font-size: 12px; }
  .foot { margin-top: 22px; padding-top: 14px; border-top: 1px solid var(--ms-line); color: var(--ms-muted); font-size:12px; text-align: center; }

  /* ── واکنش‌گرا: در موبایل فهرست عمودی ── */
  @media screen and (max-width: 980px) {
    .portal { padding: 18px 13px 36px; }
    .hero { flex-direction: column; align-items: flex-start; padding: 24px 22px; border-radius: 20px; }
    .hero .meta { text-align: right; }
    .flow-card { padding: 16px; }
    .row, .row.ltr { grid-template-columns: 1fr; direction: rtl; min-height: 0; padding-bottom: 0; }
    .flow-line { display: none; }
    .step { text-align: right; padding: 16px 0; border-bottom: 1px solid var(--ms-line); display: grid; grid-template-columns: 46px 1fr; column-gap: 14px; }
    .step h2 { grid-column: 2; height: auto; line-height: 1.5; text-align: right; }
    .node { grid-column: 1; grid-row: 1 / span 2; margin: 0; box-shadow: none; }
    .role, .desc, .box { grid-column: 2; }
    .role { margin-top: 0; }
    .desc { min-height: 0; }
  }
  .hero{align-items:center}.hero h1{margin:0}.ver{display:inline-flex;align-items:center;gap:7px;color:#b9c9de;font-size:12px;white-space:nowrap}.ver svg,.prereq svg{width:16px;height:16px}.prereq{display:flex;align-items:center;gap:8px}.role{display:flex;align-items:center;justify-content:center;gap:7px}.role svg{width:18px;height:18px;color:var(--ms-navy);flex:0 0 auto}
  .print-btn{display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(255,255,255,.28);border-radius:12px;background:rgba(255,255,255,.1);color:#fff;cursor:pointer;transition:background .15s}
  .print-btn:hover{background:rgba(255,255,255,.2)}
  .print-btn svg{width:20px;height:20px}
  .hero{display:flex;align-items:center;gap:14px}.hero h1{flex:1}
  @page{size:A3 landscape;margin:10mm}
  @media print{
    *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
    html,body.ms-portal-body{background:#fff;height:auto}
    .ms-sitebar,.ms-site-footer,.print-btn,.strip{display:none!important}
    .portal{width:var(--flow-w,auto);margin:0;padding:0;zoom:var(--print-zoom,1)}
    .hero{padding:0 4px 12px;border:0;border-radius:0;background:none;box-shadow:none;color:var(--ms-navy)}
    .hero::after{display:none}
    .hero h1{color:var(--ms-navy)}
    .ver{color:var(--ms-muted)}
    .flow-card{box-shadow:none}
    .row,.legend{break-inside:avoid}
  }
  /* print sheet: the page rendered inside the hidden print frame (?print=1) */
  .print-sheet .ms-sitebar,.print-sheet .ms-site-footer,.print-sheet .print-btn,.print-sheet .strip{display:none!important}
  .print-sheet body.ms-portal-body{background:#fff}
  .print-sheet .portal{width:1500px;max-width:none;margin:0;padding:0}
  .print-sheet .hero{padding:0 4px 12px;border:0;border-radius:0;background:none;box-shadow:none;color:var(--ms-navy)}
  .print-sheet .hero::after{display:none}
  .print-sheet .hero h1{color:var(--ms-navy)}
  .print-sheet .ver{color:var(--ms-muted)}
  .print-sheet .flow-card{box-shadow:none}

/* nine-stage map and the sections below it */
.flow-card.cols3 .row{grid-template-columns:repeat(3,minmax(0,1fr))}
.flow-card.cols3 .step{padding:0 22px}
.jump{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0}
.jump a{padding:8px 14px;border:1px solid var(--ms-line);border-radius:999px;background:#fff;color:var(--ms-navy);font-size:13px;font-weight:800;text-decoration:none}
.jump a:hover{border-color:#90adff;background:#f5f8ff}
.more{display:grid;gap:18px;margin-top:18px}
.sec{padding:22px;border:1px solid var(--ms-line);border-radius:22px;background:#fff;box-shadow:var(--ms-shadow);scroll-margin-top:90px}
.sec-t{display:flex;align-items:center;gap:12px;margin:0 0 6px;color:var(--ms-navy);font-size:19px}
.sec-n{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--ms-gold);color:var(--ms-navy);font-size:15px;font-weight:900;flex:none}
.sec-lead{margin:6px 0 12px;color:var(--ms-muted);font-size:13.5px;line-height:1.9}
.sec-note{margin:14px 0 0;padding:12px 14px;border:1px solid var(--amber-line);border-radius:14px;background:#fffaf0;color:var(--amber-ink);font-size:13px;line-height:1.9}
.sec-note.strong{border-color:#cad9fb;background:#f5f8ff;color:#1746b5;font-weight:700}
.sub{margin:20px 0 8px;color:var(--ms-navy);font-size:15px}
.tbl{display:grid;gap:0;border:1px solid var(--ms-line);border-radius:16px;overflow:hidden;margin-top:12px}
.tbl .tr{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.2fr) minmax(0,2.2fr);gap:0}
.tbl .tr>div{padding:11px 14px;border-bottom:1px solid var(--ms-line);font-size:13px;line-height:1.85}
.tbl .tr:last-child>div{border-bottom:0}
.tbl .tr.th>div{background:var(--ms-navy);color:#fff;font-weight:800;border-bottom:0}
.tbl .tr:not(.th)>div:first-child{font-weight:800;color:var(--ms-navy);background:#f7f9fc}
.chk{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.chk li{position:relative;padding:8px 38px 8px 12px;border-radius:12px;background:#f6f8fb;font-size:13px;line-height:1.85}
.chk li::before{content:"";position:absolute;inset-inline-start:auto;right:13px;top:14px;width:12px;height:7px;border-left:2.5px solid #14804a;border-bottom:2.5px solid #14804a;transform:rotate(-45deg)}
.paths{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr))}
.path{padding:14px;border:1px solid var(--ms-line);border-radius:18px;background:#fff}
.path h3{margin:0 0 4px;color:var(--ms-navy);font-size:15px}
.warn{margin:10px 0 0;padding:9px 11px;border-radius:12px;background:#fff1f0;color:#a6261b;font-size:12.5px;font-weight:700;line-height:1.85}
.gate{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:6px}
.gate-i{padding:14px;border:2px solid var(--ms-gold);border-radius:18px;background:#fffdf3}
.gate-i b{display:block;color:var(--ms-navy);font-size:15px}
.gate-i p{margin:6px 0;font-size:13px;line-height:1.85}
.gate-i span{display:inline-block;padding:3px 10px;border-radius:999px;background:var(--ms-navy);color:#fff;font-size:12px;font-weight:700}
.split{display:grid;gap:10px;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:12px}
.split div{padding:12px;border-radius:14px;background:#f5f8ff;border:1px solid #cad9fb}
.split b{display:block;color:var(--ms-navy);font-size:14px}
.split span{font-size:12.5px;line-height:1.8;color:#35507f}
.ctl{border:1px solid var(--ms-line);border-radius:14px;background:#fff;margin-top:8px}
.ctl summary{cursor:pointer;padding:13px 16px;font-weight:800;color:var(--ms-navy);font-size:14px;list-style:none;display:flex;align-items:center;gap:10px}
.ctl summary::-webkit-details-marker{display:none}
.ctl summary::after{content:"";width:9px;height:9px;margin-inline-start:auto;border-inline-end:2px solid var(--ms-muted);border-bottom:2px solid var(--ms-muted);transform:rotate(45deg);transition:transform .15s}
.ctl[open] summary::after{transform:rotate(-135deg)}
.ctl>div{padding:0 16px 14px;font-size:13px;line-height:1.9}
.ctl p{margin:8px 0 0}
.cards{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}
.card{padding:14px;border:1px solid var(--ms-line);border-radius:16px;background:#f9fafc}
.card b{color:var(--ms-navy);font-size:14px}
.card p{margin:6px 0 0;font-size:12.5px;line-height:1.85;color:#40526a}
.docs{margin:8px 0 0;padding:0;list-style:none;counter-reset:d;display:grid;gap:6px;grid-template-columns:repeat(2,minmax(0,1fr))}
.docs li{counter-increment:d;display:flex;gap:10px;align-items:flex-start;padding:9px 12px;border-radius:12px;background:#f6f8fb;font-size:13px;line-height:1.85}
.docs li::before{content:counter(d,persian);flex:none;display:grid;place-items:center;min-width:26px;height:26px;border-radius:50%;background:var(--ms-navy);color:#fff;font-size:12px;font-weight:800}
@media screen and (max-width:980px){
  .flow-card.cols3 .row,.flow-card.cols3 .row.ltr{grid-template-columns:1fr}
  .flow-card.cols3 .step{padding:16px 0}
  .paths,.gate,.cards,.split{grid-template-columns:1fr}
  .docs{grid-template-columns:1fr}
  .tbl .tr.th{display:none}
  .tbl .tr{grid-template-columns:1fr;border-bottom:1px solid var(--ms-line)}
  .tbl .tr:last-child{border-bottom:0}
  .tbl .tr>div{border-bottom:0;padding:6px 14px}
  .tbl .tr>div::before{content:attr(data-l) ": ";color:var(--ms-muted);font-size:11.5px;font-weight:700}
  .tbl .tr>div:first-child::before{content:""}
  .tbl .tr:not(.th)>div:first-child{padding-top:10px}
  .sec{padding:16px}
}
@media print{.more,.jump{display:none!important}}
.print-sheet .more,.print-sheet .jump{display:none!important}