/* ===== صفحه‌ی اول ای‌داد (طرح Site Hero v4) =====
   پایه‌ی مشترک همه‌ی صفحه‌ها (رنگ‌ها، هدر، فوتر)؛ هر صفحه یک CSS جدا روی آن سوار می‌کند. */

:root {
  --ink: #16201b;
  --body: #2c3530;
  --sub: #3f4a44;
  --muted: #54605a;
  --soft: #6b756f;
  --faint: #8a948e;
  --faint2: #9aa39e;
  --g: #306f57;
  --gd: #27583f;
  --teal: #00a79d;
  --line: #e3e9e5;
  --line2: #eef2ee;
  --line3: #edf2ee;
  --mint: #f5f9f6;
  --mint2: #edf5f0;
  --mint3: #e4f0e9;
  --grad: linear-gradient(135deg, #3d8568, #27583f);
  --ease: cubic-bezier(.22, .61, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; background: #ffffff; }
/* پرش به بخش‌ها (مثل «اشتراک» در منو) نرم انجام شود و زیر هدرِ چسبان نرود. */
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { font-family: 'Vazirmatn', system-ui, sans-serif; color: var(--ink); -webkit-font-smoothing: antialiased; }
a { color: var(--g); text-decoration: none; }
a:hover { color: var(--gd); }
img { max-width: 100%; }
button { font-family: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--g); outline-offset: 2px; }

@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes caret { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
@keyframes drift { from { transform: translate(0, 0) scale(1); } to { transform: translate(40px, 30px) scale(1.08); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .5; } }
@keyframes pfill { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes dot { 0%, 80%, 100% { opacity: .25; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }

.r0 { animation: rise .7s var(--ease) both; }
.r1 { animation: rise .8s .08s var(--ease) both; }
.r2 { animation: rise .8s .16s var(--ease) both; }
.r3 { animation: rise .9s .24s var(--ease) both; }
.r4 { animation: rise .8s .38s var(--ease) both; }

.page { position: relative; min-height: 100vh; background: #ffffff; }
/* هاله‌های پس‌زمینه در قابِ خودشان بریده می‌شوند تا صفحه اسکرول افقی نگیرد
   و هدرِ چسبان هم کار کند. */
.bg { pointer-events: none; position: absolute; top: 0; right: 0; left: 0; height: 1000px; overflow: hidden; }
.blob1 { position: absolute; top: -240px; right: -140px; height: 680px; width: 680px; border-radius: 999px; background: radial-gradient(closest-side, rgba(48,111,87,.16), rgba(48,111,87,0)); animation: drift 16s ease-in-out infinite alternate; }
.blob2 { position: absolute; top: 60px; left: -200px; height: 620px; width: 620px; border-radius: 999px; background: radial-gradient(closest-side, rgba(0,167,157,.11), rgba(0,167,157,0)); animation: drift 20s ease-in-out -6s infinite alternate-reverse; }

.ico { display: block; flex-shrink: 0; }

/* ---------- هدر ---------- */
.hdr { position: sticky; top: 0; z-index: 50; margin: 0 auto; max-width: 1200px; padding: 14px 24px; }
.hdr-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; border-radius: 18px; border: 1px solid rgba(227,233,229,.9); background: rgba(255,255,255,.72); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); padding: 10px 18px 10px 10px; box-shadow: 0 1px 2px rgba(16,40,32,.03), 0 14px 34px -26px rgba(16,48,36,.3); }
.logo { display: flex; align-items: center; }
.logo img { height: 34px; display: block; }
.hdr-nav { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.hdr-nav a { border-radius: 10px; padding: 8px 14px; font-size: 14.5px; font-weight: 600; color: var(--muted); }
.hdr-nav a:hover { background: #f2f6f3; color: var(--ink); }
.hdr-act { display: flex; align-items: center; gap: 8px; }
.hdr-login { border-radius: 10px; padding: 9px 14px; font-size: 14.5px; font-weight: 700; color: var(--ink); }
.hdr-login:hover { background: #f2f6f3; color: var(--ink); }
.btn-dl { display: inline-flex; align-items: center; border-radius: 10px; background: var(--g); padding: 10px 18px; font-size: 14.5px; font-weight: 700; color: #fff; }
.btn-dl:hover { background: var(--gd); color: #fff; }
.menu-btn { display: none; height: 40px; width: 40px; flex-shrink: 0; place-items: center; border: 1px solid var(--line); background: #ffffff; border-radius: 10px; cursor: pointer; color: var(--ink); padding: 0; }
.menu-btn .ic-x { display: none; }
.menu-btn[aria-expanded="true"] .ic-x { display: block; }
.menu-btn[aria-expanded="true"] .ic-bars { display: none; }
.mmenu { margin-top: 8px; display: flex; flex-direction: column; border-radius: 18px; border: 1px solid rgba(227,233,229,.9); background: rgba(255,255,255,.97); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); padding: 8px; box-shadow: 0 24px 50px -24px rgba(16,48,36,.35); animation: rise .25s var(--ease) both; }
.mmenu a { border-radius: 12px; padding: 13px 14px; font-size: 15.5px; font-weight: 600; color: var(--ink); }
.mmenu a:hover { background: #f2f6f3; color: var(--ink); }
.mmenu .sep { margin: 6px; height: 1px; background: var(--line2); }
.mmenu a.mm-login { display: flex; align-items: center; justify-content: center; border: 1px solid #d7e6dc; padding: 12px 14px; font-size: 15px; font-weight: 700; color: var(--gd); }

/* ---------- هیرو ---------- */
.hero { position: relative; margin: 0 auto; max-width: 1200px; padding: 68px 24px 92px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.pill { display: inline-flex; align-items: center; gap: 9px; border-radius: 999px; border: 1px solid #d7e6dc; background: rgba(255,255,255,.85); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); padding: 5px 14px 5px 5px; font-size: 13px; font-weight: 600; color: var(--sub); box-shadow: 0 1px 2px rgba(16,40,32,.04); }
.pill-ic { display: grid; height: 24px; width: 24px; place-items: center; border-radius: 999px; background: var(--grad); box-shadow: 0 4px 10px -4px rgba(39,88,63,.6); }
.hero h1 { margin: 24px 0 0; max-width: 22ch; font-size: clamp(32px, 5.4vw, 64px); font-weight: 900; line-height: 1.22; letter-spacing: -.02em; color: var(--ink); text-wrap: balance; }
.grad-text { background: linear-gradient(100deg, #306f57 15%, #00a79d 95%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lead { margin: 20px 0 0; max-width: 40rem; font-size: clamp(16px, 1.6vw, 18.5px); line-height: 1.95; color: var(--muted); text-wrap: pretty; }

/* جعبه‌ی پرسش */
.composer { position: relative; margin-top: 44px; width: 100%; max-width: 860px; }
.composer-glow { pointer-events: none; position: absolute; inset: 40px 6% -24px; border-radius: 48px; background: linear-gradient(90deg, rgba(48,111,87,.35), rgba(0,167,157,.28)); filter: blur(46px); opacity: .55; }
.composer-ring { position: relative; border-radius: 26px; padding: 1.5px; background: linear-gradient(160deg, #cfe3d7, #f1f6f3 38%, #ffffff 60%, #cde7e2); box-shadow: 0 1px 2px rgba(16,40,32,.05), 0 40px 80px -40px rgba(16,48,36,.35); transition: box-shadow .2s; }
.composer-ring:focus-within { box-shadow: 0 0 0 3px rgba(48,111,87,.14), 0 40px 80px -40px rgba(16,48,36,.35); }
.composer-card { border-radius: 24.5px; background: #ffffff; padding: 16px; text-align: right; }
.cmp-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 2px 4px 12px; border-bottom: 1px solid var(--line2); }
.cmp-id { display: flex; align-items: center; gap: 10px; }
.cmp-mark { display: grid; height: 34px; width: 34px; flex-shrink: 0; place-items: center; border-radius: 11px; background: var(--grad); box-shadow: 0 0 0 4px var(--mint2); }
.cmp-mark img, .mock-logo img { height: 18px; display: block; }
.cmp-name { font-size: 14px; font-weight: 800; color: var(--ink); }
.cmp-status { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: #3f7a5f; }
.cmp-status i { height: 6px; width: 6px; border-radius: 999px; background: #2fa36b; }
.quota { border-radius: 999px; background: var(--mint2); padding: 5px 12px; font-size: 12.5px; font-weight: 700; color: var(--gd); }

.thread { max-height: 380px; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; padding: 16px 4px 4px; }
.msg { display: flex; max-width: 90%; }
.msg.me { align-self: flex-end; }
.msg.ai, .msg.err { align-self: flex-start; }
.bubble { white-space: pre-wrap; overflow-wrap: anywhere; }
.msg.me .bubble { border-radius: 14px 4px 14px 14px; background: var(--g); padding: 10px 15px; font-size: 14.5px; font-weight: 600; line-height: 1.85; color: #fff; }
.msg.ai .bubble { border-radius: 4px 14px 14px 14px; background: #f5f8f6; border: 1px solid var(--line3); padding: 11px 15px; font-size: 14.5px; line-height: 2; color: var(--body); }
.msg.err .bubble { border-radius: 4px 14px 14px 14px; background: #fdf2ee; border: 1px solid #f6d9cc; padding: 10px 15px; font-size: 14px; line-height: 1.85; color: #9a3b12; }
.cursor { display: inline-block; width: 7px; height: 1em; vertical-align: -.15em; margin-right: 3px; border-radius: 2px; background: var(--g); animation: caret .9s steps(1) infinite; }
.thinking { display: flex; align-items: center; gap: 10px; align-self: flex-start; border-radius: 4px 14px 14px 14px; background: #f5f8f6; border: 1px solid var(--line3); padding: 11px 15px; }
.dots { display: inline-flex; gap: 4px; }
.dots i { height: 6px; width: 6px; border-radius: 999px; background: #6b9a83; animation: dot 1s infinite; }
.dots i:nth-child(2) { animation-delay: .15s; }
.dots i:nth-child(3) { animation-delay: .3s; }
.thinking span:last-child { font-size: 13.5px; font-weight: 600; color: var(--muted); }
.ask-hint { align-self: center; font-size: 12.5px; font-weight: 600; color: var(--soft); }
.locked { border-radius: 16px; background: var(--mint2); padding: 16px 18px; }
.locked p { margin: 0; font-size: 14px; line-height: 1.95; color: var(--body); }
.locked a { margin-top: 12px; display: inline-flex; align-items: center; border-radius: 10px; background: var(--g); padding: 10px 16px; font-size: 14px; font-weight: 700; color: #fff; }
.locked a:hover { background: var(--gd); color: #fff; }

.cmp-input { margin-top: 8px; display: flex; flex-direction: column; gap: 8px; padding: 6px 6px 2px; }
.cmp-input textarea { width: 100%; min-height: 104px; max-height: 200px; resize: none; border: none; outline: none; background: transparent; font-family: inherit; font-size: 17px; font-weight: 500; line-height: 1.8; color: var(--ink); padding: 4px 6px; }
.cmp-input textarea:focus-visible { outline: none; }
.cmp-input textarea::placeholder { color: var(--faint2); }
.cmp-input textarea:disabled { cursor: not-allowed; }
.cmp-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-top: 12px; border-top: 1px dashed #e6ece7; }
.kbd-hint { font-size: 12px; font-weight: 500; color: var(--faint); }
.send { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 20px; flex-shrink: 0; margin-inline-start: auto; border: none; border-radius: 12px; font-size: 14.5px; font-weight: 700; cursor: default; transition: all .2s; background: #e3e9e5; color: var(--faint2); }
.send.on { background: var(--grad); color: #fff; box-shadow: 0 12px 24px -12px rgba(39,88,63,.75); cursor: pointer; }

/* ردیف اعتماد زیر جعبه‌ی پرسش */
.trust { margin-top: 52px; display: flex; align-items: center; justify-content: center; gap: 14px 26px; flex-wrap: wrap; }
.trust-item { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; color: var(--sub); }
.t-ic { display: grid; height: 32px; width: 32px; flex-shrink: 0; place-items: center; border-radius: 10px; background: #f1f7f3; box-shadow: inset 0 0 0 1px #dcebe2; }
.trust .vsep { height: 20px; width: 1px; background: var(--line); }
.trust-link { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; color: var(--g); }
.trust-m { display: none; margin-top: 32px; width: 100%; max-width: 420px; flex-direction: column; gap: 12px; }
.trust-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-radius: 18px; border: 1px solid #e8eee9; background: rgba(255,255,255,.8); }
.trust-grid > div { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 6px; text-align: center; }
.trust-grid > div + div { border-right: 1px solid var(--line2); }
.trust-grid .t-ic { height: 36px; width: 36px; border-radius: 11px; }
.trust-grid span:last-child { font-size: 12.5px; font-weight: 600; line-height: 1.6; color: var(--sub); text-wrap: balance; }
.trust-m > a { display: flex; align-items: center; justify-content: center; gap: 6px; border-radius: 14px; background: var(--mint2); padding: 13px 16px; font-size: 14.5px; font-weight: 700; color: var(--gd); }
.trust-m > a:hover { background: #e2efe7; color: var(--gd); }
.disclaimer { margin: 22px 0 0; font-size: 12px; color: var(--soft); }

/* ---------- بخش‌ها ---------- */
.sec { position: relative; border-top: 1px solid var(--line2); background: #ffffff; }
.sec-product { background: linear-gradient(180deg, #ffffff 0%, #f5f9f6 22%, #f5f9f6 100%); }
.sec-pricing { background: var(--mint); }
.sec-in { margin: 0 auto; max-width: 1200px; padding: 96px 24px 104px; }
.sec-head { display: flex; flex-direction: column; align-items: center; text-align: center; }
.kicker { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 700; color: var(--g); }
.kicker i { height: 6px; width: 6px; border-radius: 999px; background: var(--g); }
.sec-head h2 { margin: 14px 0 0; font-size: clamp(24px, 3.8vw, 44px); font-weight: 900; line-height: 1.35; letter-spacing: -.015em; color: var(--ink); text-wrap: balance; }
.sec-product .sec-head h2 { white-space: nowrap; font-size: clamp(22px, 3.8vw, 44px); }
.sec-head p { margin: 14px 0 0; font-size: 16.5px; line-height: 1.95; color: var(--muted); text-wrap: balance; }
.btn-grad { display: inline-flex; align-items: center; gap: 8px; border-radius: 12px; background: var(--grad); padding: 13px 24px; font-size: 15px; font-weight: 700; color: #fff; box-shadow: 0 14px 28px -14px rgba(39,88,63,.7); }
.btn-grad:hover { color: #fff; filter: brightness(1.06); }

/* امکانات: زبانه‌ها */
.ptabs { margin-top: 44px; }
.tabbar-wrap { display: flex; justify-content: center; }
.tabbar { display: flex; gap: 3px; border-radius: 15px; background: #e9f1ec; padding: 4px; }
.tab { position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex-shrink: 0; border: none; border-radius: 11px; cursor: pointer; padding: 10px 20px; font-size: 14px; font-weight: 700; transition: all .2s; background: transparent; color: var(--soft); }
.tab[aria-selected="true"] { background: #ffffff; color: var(--gd); box-shadow: 0 1px 2px rgba(16,40,32,.08), 0 6px 14px -8px rgba(16,40,32,.18); }
.tab .bar { position: absolute; bottom: 0; right: 12px; left: 12px; height: 2px; border-radius: 2px; background: var(--g); transform-origin: right; animation: pfill 7s linear forwards; }
.pgrid { margin-top: 36px; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 56px; align-items: center; }
.ptext { text-align: right; }
.pnum { font-size: 13px; font-weight: 700; letter-spacing: .04em; color: var(--g); }
.ptext h3 { margin: 10px 0 0; font-size: clamp(22px, 2.4vw, 30px); font-weight: 900; line-height: 1.45; color: var(--ink); text-wrap: balance; }
.ptext p { margin: 10px 0 0; font-size: 15.5px; line-height: 1.95; color: var(--muted); text-wrap: pretty; }
.bullets { margin: 24px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 13px; }
.bullets li { display: flex; align-items: flex-start; gap: 11px; font-size: 14.5px; font-weight: 600; line-height: 1.8; color: var(--body); }
.ck { margin-top: 3px; display: grid; height: 20px; width: 20px; flex-shrink: 0; place-items: center; border-radius: 999px; background: var(--mint3); }
.show { animation: rise .45s var(--ease) both; }

.mock-wrap { position: relative; }
.mock-glow { pointer-events: none; position: absolute; inset: 8% 6% -4%; border-radius: 40px; background: linear-gradient(120deg, rgba(48,111,87,.22), rgba(0,167,157,.16)); filter: blur(40px); }
.mock { position: relative; display: flex; min-height: 380px; border-radius: 22px; border: 1px solid var(--line); background: #fbfcfb; overflow: hidden; box-shadow: 0 1px 2px rgba(16,40,32,.04), 0 34px 70px -40px rgba(16,48,36,.4); }
.mock-side { display: flex; width: 62px; flex-shrink: 0; flex-direction: column; align-items: center; gap: 8px; border-left: 1px solid var(--line3); background: #ffffff; padding: 16px 0; }
.mock-logo { margin-bottom: 10px; display: grid; height: 36px; width: 36px; place-items: center; border-radius: 11px; background: var(--grad); }
.side-ic { display: grid; height: 38px; width: 38px; place-items: center; border-radius: 11px; color: #a3aca6; }
.side-ic.on { background: var(--mint2); color: var(--g); }
.mock-main { min-width: 0; flex: 1; padding: 24px; }
.mock-title { font-size: 16px; font-weight: 800; color: var(--ink); }
.panes { margin-top: 20px; display: grid; }
.pane { grid-area: 1 / 1; min-width: 0; }

.card-row { display: flex; align-items: center; gap: 14px; border-radius: 14px; background: #ffffff; border: 1px solid var(--line3); padding: 16px; }
.avatar { display: grid; height: 40px; width: 40px; flex-shrink: 0; place-items: center; border-radius: 999px; background: var(--mint3); font-size: 14px; font-weight: 800; color: var(--gd); }
.row-main { min-width: 0; flex: 1; }
.row-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; font-weight: 700; color: var(--ink); }
.row-s { margin-top: 2px; font-size: 11.5px; color: var(--faint); }
.chip { flex-shrink: 0; border-radius: 999px; padding: 4px 10px; font-size: 11.5px; font-weight: 800; }
.chip.next { background: var(--g); color: #fff; }
.chip.open { background: var(--mint3); color: var(--gd); }
.chip.closed { background: #f0f2f1; color: #7a847e; }
.stack { display: flex; flex-direction: column; gap: 10px; }

.cal-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 14px; }
.cal { border-radius: 14px; background: #ffffff; border: 1px solid var(--line3); padding: 12px; }
.cal-head { display: flex; align-items: center; justify-content: space-between; padding: 0 4px 10px; }
.cal-head b { font-size: 13.5px; font-weight: 800; color: var(--ink); }
.cal-head span { display: flex; gap: 10px; font-size: 15px; font-weight: 700; color: var(--faint2); }
.cal-wd, .cal-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-wd { text-align: center; font-size: 10.5px; font-weight: 700; color: var(--faint2); padding-bottom: 6px; }
.cal-days { gap: 2px; }
.cal-days > div { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; height: 36px; border-radius: 10px; font-size: 12.5px; font-weight: 700; color: var(--body); }
.cal-days > div.sel { background: var(--g); color: #fff; box-shadow: 0 8px 16px -8px rgba(39,88,63,.7); }
.cal-days i { height: 4px; width: 4px; border-radius: 999px; background: var(--teal); }
.cal-days .sel i { background: #fff; }
.day-label { padding: 2px 2px 0; font-size: 12.5px; font-weight: 700; color: var(--faint); }
.ev { display: flex; gap: 10px; border-radius: 14px; background: #ffffff; border: 1px solid var(--line3); padding: 11px 12px; }
.ev > i { width: 3px; flex-shrink: 0; border-radius: 3px; background: var(--g); }
.ev > i.teal { background: var(--teal); }
.ev-t { font-size: 13px; font-weight: 700; color: var(--ink); }
.ev-s { margin-top: 2px; font-size: 11.5px; color: var(--faint); }
.tags { margin-top: 8px; display: flex; gap: 6px; flex-wrap: wrap; }
.tag-hot { border-radius: 999px; background: #fdf0e7; padding: 2px 8px; font-size: 10.5px; font-weight: 800; color: #b5501a; }
.tag { display: inline-flex; align-items: center; gap: 4px; border-radius: 999px; background: #f0f5f2; padding: 2px 8px; font-size: 10.5px; font-weight: 700; color: var(--muted); }

.cdays { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 3px; border-radius: 14px; background: #f0f5f2; padding: 4px; }
.cdays > span { min-width: 0; border-radius: 11px; padding: 7px 2px; text-align: center; color: var(--soft); }
.cdays > span.on { background: #ffffff; color: var(--gd); box-shadow: 0 1px 2px rgba(16,40,32,.08), 0 6px 14px -8px rgba(16,40,32,.22); }
.cdays b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; font-weight: 600; opacity: .8; }
.cdays em { display: block; margin-top: 2px; font-style: normal; font-size: 15px; font-weight: 800; }
.cslots { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.cslots > div { display: flex; flex-direction: column; align-items: center; gap: 1px; border-radius: 12px; padding: 8px 0; border: 1px dashed #cfe0d6; background: #ffffff; color: var(--gd); }
.cslots > div.booked { border: 0; background: var(--mint3); }
.cslots > div.new { border: 0; background: var(--g); color: #fff; box-shadow: 0 0 0 3px rgba(48,111,87,.18); }
.cslots b { font-size: 13.5px; font-weight: 800; }
.cslots span { font-size: 10.5px; font-weight: 600; color: #9ab8a8; }
.cslots .booked span { color: #5b8a72; }
.cslots .new span { color: rgba(255,255,255,.85); }
.notice { display: flex; align-items: center; gap: 12px; border-radius: 16px; border: 1px solid #e6eee9; background: #ffffff; padding: 12px 14px; box-shadow: 0 20px 40px -24px rgba(16,48,36,.4); animation: rise .5s .35s var(--ease) both; }
.notice .avatar { position: relative; height: 38px; width: 38px; }
.notice .avatar i { position: absolute; top: -1px; left: -1px; height: 11px; width: 11px; border-radius: 999px; background: #fb8230; border: 2px solid #ffffff; }
.notice-t { font-size: 13px; font-weight: 800; color: var(--ink); }
.notice-s { margin-top: 1px; font-size: 12px; color: var(--soft); }
.notice time { flex-shrink: 0; font-size: 11px; font-weight: 600; color: var(--faint2); }

.tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.tool { display: flex; align-items: center; gap: 12px; border-radius: 14px; background: #ffffff; border: 1px solid var(--line3); padding: 12px; }
.tool-ic { display: grid; height: 34px; width: 34px; flex-shrink: 0; place-items: center; border-radius: 10px; background: var(--mint2); color: var(--g); }
.tool b, .tool span span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tool b { font-size: 13px; font-weight: 700; color: var(--ink); }
.tool span span { margin-top: 2px; font-size: 11px; font-weight: 500; color: var(--faint); }
.tool > span { min-width: 0; }
.tools-more { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; border-radius: 14px; background: var(--mint2); padding: 12px; font-size: 13px; font-weight: 700; color: var(--gd); }

/* برای موکلین */
.steps { margin-top: 52px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.step { display: flex; flex-direction: column; border-radius: 24px; border: 1px solid #dfe9e3; background: #f1f7f3; padding: 24px; box-shadow: 0 1px 2px rgba(16,40,32,.04), 0 18px 40px -30px rgba(16,48,36,.35); }
.step-h { display: flex; align-items: center; gap: 10px; }
.step-n { display: grid; height: 28px; width: 28px; place-items: center; border-radius: 999px; background: var(--g); font-size: 13px; font-weight: 800; color: #ffffff; }
.step h3 { margin: 0; font-size: 18px; font-weight: 800; color: var(--ink); }
.step > p { margin: 10px 0 0; font-size: 14px; line-height: 1.9; color: var(--muted); }
.step-box { margin-top: 20px; flex: 1; display: flex; flex-direction: column; gap: 10px; border-radius: 18px; background: #ffffff; padding: 16px; box-shadow: 0 1px 2px rgba(16,40,32,.04); }
.filters { display: flex; gap: 6px; flex-wrap: wrap; }
.filters span { display: inline-flex; align-items: center; gap: 6px; border-radius: 9px; background: var(--mint3); padding: 6px 10px; font-size: 12px; font-weight: 700; color: var(--gd); }
.lawyer { display: flex; align-items: center; gap: 10px; border-radius: 12px; background: #ffffff; border: 1px solid var(--line3); padding: 10px 12px; }
.lawyer .avatar { height: 34px; width: 34px; font-size: 13px; }
.lawyer-n { font-size: 13px; font-weight: 700; color: var(--ink); }
.lawyer-m { margin-top: 1px; font-size: 11.5px; color: var(--faint); }
.profile { border-radius: 14px; background: #ffffff; border: 1px solid var(--line3); padding: 14px; }
.profile-h { display: flex; align-items: center; gap: 12px; }
.profile-h .avatar { height: 46px; width: 46px; background: var(--grad); font-size: 17px; color: #ffffff; }
.profile-n { font-size: 14.5px; font-weight: 800; color: var(--ink); }
.profile-m { margin-top: 2px; font-size: 11.5px; color: var(--faint); }
.profile-tags { margin-top: 12px; display: flex; gap: 6px; flex-wrap: wrap; }
.profile-tags span { border-radius: 999px; background: var(--mint2); padding: 3px 10px; font-size: 11.5px; font-weight: 700; color: var(--gd); }
.profile-f { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line2); font-size: 12px; font-weight: 600; color: var(--muted); }
.slot3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.slot3 span { border-radius: 10px; border: 1px solid #cfe0d6; background: #ffffff; padding: 8px 0; text-align: center; font-size: 13px; font-weight: 700; color: var(--gd); }
.slot3 span.on { border-color: var(--g); background: var(--g); color: #ffffff; box-shadow: 0 0 0 3px rgba(48,111,87,.18); }
.fake-btn { margin-top: auto; display: flex; align-items: center; justify-content: center; border-radius: 12px; background: var(--grad); padding: 11px; font-size: 13.5px; font-weight: 700; color: #ffffff; }
.assure { margin-top: 36px; display: flex; align-items: center; justify-content: center; gap: 14px 28px; flex-wrap: wrap; }
.assure span { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--sub); }
.center-cta { margin-top: 28px; display: flex; justify-content: center; }

/* اشتراک */
.periods-wrap { margin-top: 36px; display: flex; justify-content: center; }
.periods { display: flex; gap: 3px; border-radius: 15px; background: #e6efe9; padding: 4px; }
.period { display: inline-flex; align-items: center; justify-content: center; gap: 7px; flex-shrink: 0; border: none; border-radius: 11px; cursor: pointer; padding: 9px 16px; font-size: 14px; font-weight: 700; transition: all .2s; background: transparent; color: var(--soft); }
.period[aria-pressed="true"] { background: #ffffff; color: var(--gd); box-shadow: 0 1px 2px rgba(16,40,32,.08), 0 6px 14px -8px rgba(16,40,32,.18); }
.period .save { border-radius: 999px; padding: 2px 7px; font-size: 11px; font-weight: 800; background: rgba(255,255,255,.7); color: #3f7a5f; }
.period[aria-pressed="true"] .save { background: var(--mint3); color: var(--gd); }
.plans-skel { margin-top: 32px; height: 480px; border-radius: 24px; border: 1px solid #e6ece8; background: #ffffff; animation: pulse 1.4s ease-in-out infinite; }
.plans-err { margin: 32px auto 0; max-width: 460px; display: flex; flex-direction: column; align-items: center; gap: 14px; border-radius: 20px; border: 1px dashed #d7e3db; background: #ffffff; padding: 32px 24px; text-align: center; }
.plans-err p { margin: 0; font-size: 15px; font-weight: 600; line-height: 1.9; color: var(--sub); }
.plans-err button { border: 1px solid #d7e6dc; background: #ffffff; cursor: pointer; border-radius: 11px; padding: 9px 18px; font-size: 14px; font-weight: 700; color: var(--gd); }
.plans-err button:hover { background: #f2f6f3; }
.ptable { margin-top: 32px; overflow: hidden; border-radius: 24px; border: 1px solid #e3eae5; background: #ffffff; box-shadow: 0 1px 2px rgba(16,40,32,.03), 0 30px 60px -44px rgba(16,48,36,.35); }
.pt-grid { display: grid; }
.pt-grid > div { display: flex; align-items: center; justify-content: center; text-align: center; padding: 14px 10px; border-top: 1px solid var(--line2); }
.pt-grid > .pt-corner { align-items: flex-end; justify-content: flex-start; padding: 22px 22px 18px; border-top: 0; font-size: 13px; font-weight: 700; color: var(--faint); }
.pt-grid > .pt-head { flex-direction: column; justify-content: flex-start; padding: 18px 14px 20px; border-top: 0; }
.pt-grid > .pt-label { justify-content: flex-start; text-align: right; padding: 14px 22px; font-size: 13.5px; font-weight: 600; color: var(--sub); }
.pt-grid > .feat { background: #f3f9f5; }
.pt-badge-row { display: flex; min-height: 22px; justify-content: center; }
.badge { border-radius: 999px; background: var(--grad); padding: 2px 10px; font-size: 10.5px; font-weight: 800; color: #ffffff; }
.pt-title { margin-top: 6px; font-size: 16px; font-weight: 800; color: var(--ink); }
.pt-price { margin-top: 12px; width: 100%; }
.price-line { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; column-gap: 4px; }
.price-line b { font-size: clamp(17px, 1.6vw, 22px); font-weight: 900; letter-spacing: -.01em; color: var(--ink); }
.price-line span { font-size: 11.5px; font-weight: 600; color: var(--soft); }
.price-contact { font-size: 18px; font-weight: 900; color: var(--ink); }
.price-sub { margin-top: 4px; font-size: 11.5px; color: var(--faint); }
.price-sub + .price-sub { margin-top: 2px; }
.price-old { margin-top: 4px; display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 11px; }
.price-old s { color: var(--faint2); }
.price-old span { border-radius: 999px; background: #fdf0e7; padding: 1px 7px; font-weight: 800; color: #b5501a; }
.pt-cta { margin-top: auto; width: 100%; padding-top: 14px; }
.cta-plan { display: flex; width: 100%; align-items: center; justify-content: center; border-radius: 11px; padding: 10px; font-size: 13.5px; font-weight: 700; border: 1px solid #cfe0d6; background: #ffffff; color: var(--gd); }
.cta-plan:hover { background: #f2f6f3; color: var(--gd); }
.cta-plan.feat { border-color: transparent; background: var(--grad); color: #ffffff; box-shadow: 0 12px 24px -12px rgba(39,88,63,.7); }
.cta-plan.feat:hover { color: #fff; filter: brightness(1.06); }
.v-num { font-size: 13.5px; font-weight: 800; color: var(--ink); }
.v-none { font-size: 13.5px; font-weight: 600; color: #b3bab6; }
.v-on { display: grid; height: 22px; width: 22px; place-items: center; border-radius: 999px; background: var(--mint3); }
.v-off { font-size: 15px; font-weight: 700; color: #c9d0cc; }
.m-chips { margin: 24px auto 0; max-width: 460px; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.m-chip { flex-shrink: 0; border-radius: 999px; cursor: pointer; padding: 8px 15px; font-size: 13.5px; font-weight: 700; border: 1px solid #dfe8e2; background: #ffffff; color: var(--sub); }
.m-chip[aria-pressed="true"] { border-color: var(--g); background: var(--g); color: #ffffff; }
.m-card { margin: 12px auto 0; max-width: 460px; border-radius: 22px; background: #ffffff; padding: 22px; border: 1px solid #e3eae5; }
.m-card.feat { border: 1.5px solid var(--g); }
.m-card-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.m-card-h b { font-size: 18px; font-weight: 800; color: var(--ink); }
.m-card-h .badge { padding: 3px 10px; font-size: 11px; }
.m-price { margin-top: 14px; text-align: center; }
.m-price .price-line b { font-size: 28px; }
.m-price .price-contact { font-size: 24px; }
.m-price .pt-cta { padding-top: 14px; }
.m-rows { margin-top: 18px; display: flex; flex-direction: column; }
.m-rows > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 0; border-top: 1px solid var(--line2); }
.m-rows > div > span:first-child { font-size: 13.5px; font-weight: 600; color: var(--sub); }
.price-foot { margin-top: 28px; display: flex; align-items: center; justify-content: center; gap: 10px 22px; flex-wrap: wrap; font-size: 13px; font-weight: 600; color: var(--soft); }
.price-foot .vsep { height: 16px; width: 1px; background: #dfe7e2; }
.price-foot img { height: 28px; width: 28px; object-fit: contain; }
.pay-with { display: inline-flex; align-items: center; gap: 8px; }

/* دعوت به دانلود */
.cta-in { margin: 0 auto; max-width: 1200px; padding: 88px 24px; }
.cta-box { position: relative; overflow: hidden; border-radius: 32px; background: linear-gradient(135deg, #337a5e 0%, #27583f 50%, #1b4230 100%); box-shadow: 0 44px 90px -48px rgba(24,64,46,.75); }
.cta-glow1 { pointer-events: none; position: absolute; top: -200px; right: -140px; height: 520px; width: 520px; border-radius: 999px; background: radial-gradient(closest-side, rgba(255,255,255,.14), rgba(255,255,255,0)); }
.cta-glow2 { pointer-events: none; position: absolute; bottom: -220px; left: -120px; height: 560px; width: 560px; border-radius: 999px; background: radial-gradient(closest-side, rgba(0,167,157,.38), rgba(0,167,157,0)); }
.cta-mark { pointer-events: none; position: absolute; bottom: -70px; left: 5%; height: 320px; opacity: .07; }
.cta-body { position: relative; padding: clamp(48px, 6.5vw, 84px) 24px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.cta-pill { display: inline-flex; align-items: center; gap: 8px; border-radius: 999px; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.08); padding: 6px 14px; font-size: 12.5px; font-weight: 700; color: rgba(255,255,255,.9); }
.cta-pill i { height: 6px; width: 6px; border-radius: 999px; background: #7fe0b0; box-shadow: 0 0 0 3px rgba(127,224,176,.25); }
.cta-body h2 { margin: 18px 0 0; font-size: clamp(26px, 3.6vw, 44px); font-weight: 900; line-height: 1.4; letter-spacing: -.015em; color: #ffffff; text-wrap: balance; }
.cta-body p { margin: 14px 0 0; max-width: 34rem; font-size: 16.5px; line-height: 1.95; color: rgba(255,255,255,.8); text-wrap: balance; }
.cta-btns { margin-top: 32px; display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; }
.cta-w { display: inline-flex; align-items: center; gap: 10px; border-radius: 14px; background: #ffffff; padding: 14px 22px; font-size: 15.5px; font-weight: 800; color: var(--gd); box-shadow: 0 16px 32px -16px rgba(0,0,0,.5); }
.cta-w:hover { background: #f1f7f3; color: var(--gd); }
.cta-o { display: inline-flex; align-items: center; gap: 10px; border-radius: 14px; border: 1px solid rgba(255,255,255,.32); background: rgba(255,255,255,.06); padding: 14px 22px; font-size: 15.5px; font-weight: 700; color: #ffffff; }
.cta-o:hover { background: rgba(255,255,255,.14); color: #ffffff; }
.cta-body :focus-visible { outline-color: #ffffff; }

/* فوتر */
.foot { background: #f6f9f7; border-top: 1px solid #e8eee9; }
.foot-in { margin: 0 auto; max-width: 1200px; padding: 64px 24px 28px; }
.foot-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr)) minmax(0, 1.4fr); gap: 36px 28px; }
.f-brand { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.f-brand > img { height: 34px; display: block; }
.f-brand p { margin: 0; max-width: 22rem; font-size: 14px; line-height: 2; color: var(--muted); }
.f-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.f-btn { display: inline-flex; align-items: center; gap: 7px; border-radius: 11px; border: 1px solid transparent; background: var(--g); padding: 9px 14px; font-size: 13px; font-weight: 700; color: #ffffff; }
.f-btn:hover { background: var(--gd); color: #ffffff; }
.f-btn.ghost { border-color: #d7e6dc; background: #ffffff; color: var(--gd); }
.f-btn.ghost:hover { background: #f2f6f3; color: var(--gd); }
.soc { display: flex; gap: 8px; }
.soc a { display: grid; height: 38px; width: 38px; place-items: center; border-radius: 11px; border: 1px solid var(--line); background: #ffffff; color: var(--muted); }
.soc a:hover { border-color: #a9cbb7; color: var(--gd); }
.f-col { display: flex; flex-direction: column; gap: 2px; }
.f-col h3, .f-contact h3 { margin: 0 0 4px; font-size: 14px; font-weight: 800; color: var(--ink); }
.f-col a { padding: 7px 0; font-size: 14px; font-weight: 500; color: var(--muted); }
.f-col a:hover { color: var(--gd); }
.f-contact { display: flex; flex-direction: column; gap: 12px; }
.f-row { display: flex; align-items: flex-start; gap: 10px; }
.f-ic { display: grid; height: 30px; width: 30px; flex-shrink: 0; place-items: center; border-radius: 9px; background: #e9f2ec; color: var(--g); }
.phones { display: flex; flex-wrap: wrap; gap: 0 14px; }
.phones a { padding: 6px 0; font-size: 14.5px; font-weight: 700; color: var(--ink); }
.phones a:hover { color: var(--gd); }
.f-addr { margin: 0; padding-top: 4px; font-size: 13.5px; line-height: 1.95; color: var(--muted); }
.f-postal { align-items: center; font-size: 13.5px; color: var(--muted); }
.foot-m { display: none; flex-direction: column; align-items: center; text-align: center; gap: 18px; }
.foot-m > img { height: 30px; display: block; }
.foot-m .soc { justify-content: center; }
.fm-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 18px; }
.fm-links a { padding: 6px 0; font-size: 13.5px; font-weight: 600; color: var(--sub); }
.fm-links a:hover { color: var(--gd); }
.fm-contact { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.fm-contact .phones { justify-content: center; gap: 0 16px; }
.fm-contact p { margin: 0; max-width: 20rem; font-size: 12.5px; line-height: 1.9; color: var(--soft); }
.foot-bot { margin-top: 44px; padding-top: 24px; border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.badges { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.badges > * { display: grid; height: 56px; width: 56px; place-items: center; border-radius: 14px; border: 1px solid var(--line); background: #ffffff; }
.badges img { max-height: 40px; max-width: 44px; object-fit: contain; }
.copy { font-size: 13px; color: var(--soft); }

/* ---------- واکنش‌گرا ---------- */
@media (max-width: 1000px) {
  .foot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .f-brand, .f-contact { grid-column: 1 / -1; }
}
@media (min-width: 721px) {
  .mmenu { display: none !important; }
}
@media (max-width: 720px) {
  .hdr-nav, .hdr-login, .kbd-hint, .trust { display: none; }
  .menu-btn { display: grid; }
  .trust-m { display: flex; }
  .sec-in { padding: 64px 20px 72px; }
  .cta-in { padding: 56px 16px; }
  .tabbar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; }
  .tab { flex-direction: column; gap: 4px; padding: 9px 4px; font-size: 12.5px; }
  .pgrid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .mock-side { display: none; }
  .cal-grid, .steps { grid-template-columns: minmax(0, 1fr); }
  .periods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; max-width: 380px; }
  .period { padding: 9px 8px; }
  .foot-in { padding: 40px 20px 24px; }
  .foot-grid { display: none; }
  .foot-m { display: flex; }
  .foot-bot { margin-top: 28px; }
}
@media (max-width: 380px) {
  .sec-product .sec-head h2 { white-space: normal; }
  .mock-main { padding: 16px; }
  .tools { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; animation-delay: 0s !important; transition-duration: .01ms !important; }
  .tab .bar { display: none; }
}
.soc:empty { display: none; }
.sd { display: inline-block; width: 3px; height: 3px; margin: 0 6px; border-radius: 999px; background: currentColor; opacity: .55; vertical-align: middle; }