/* ═══════════════════════════════════════════════════════════════════
   فونت — پیدا، همان فونت اپ (لایسنس تجاری: fontiran.com)
   ═══════════════════════════════════════════════════════════════════ */
@font-face{font-family:Peyda;src:url(fonts/Peyda-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Peyda;src:url(fonts/Peyda-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Peyda;src:url(fonts/Peyda-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Peyda;src:url(fonts/Peyda-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Peyda;src:url(fonts/Peyda-ExtraBold.woff2) format("woff2");font-weight:800;font-display:swap}

/* ═══════════════════════════════════════════════════════════════════
   توکن‌ها — یک‌به‌یک از app/lib/core/tokens.dart
   ═══════════════════════════════════════════════════════════════════ */
:root{
  /* bg/neutral */
  --bg-1:#FFFFFF; --bg-2:#F8F8F8; --bg-6:#121317;
  /* bg/primary */
  --primary-bg-1:#EFFEF5; --primary-bg-4:#11E775;
  /* border/neutral */
  --bor-1:#F5F5F5; --bor-2:#EBEBEB;
  /* text/neutral */
  --txt-1:#090A0C; --txt-2:#353D44; --txt-4:#777E8B; --txt-6:#FFFFFF;
  /* text/primary */
  --primary-txt-3:#075E4B;
  --danger:#E5484D;

  /* radius */
  --r-12:12px; --r-16:16px; --r-24:24px; --r-40:40px; --r-pill:99px;
  /* space */
  --s-4:4px; --s-6:6px; --s-8:8px; --s-10:10px; --s-12:12px;
  --s-16:16px; --s-20:20px; --s-24:24px; --s-32:32px;
  /* control */
  --control-h:56px;

  /* motion — همان فنرهای Motion در اپ، تقریب‌زده با cubic-bezier */
  --fast:180ms; --standard:320ms; --slow:420ms;
  --spring:cubic-bezier(.22,1.2,.36,1);        /* damping .78 */
  --spring-tight:cubic-bezier(.32,.94,.28,1);  /* damping 1   */
  --spring-bouncy:cubic-bezier(.18,1.5,.4,1);  /* damping .55 */
  --exit:cubic-bezier(.55,.055,.675,.19);

  --glass:rgba(255,255,255,.62);
  --glass-line:rgba(255,255,255,.7);
  --shadow-s:0 1px 2px rgba(9,10,12,.04),0 6px 16px -8px rgba(9,10,12,.08);
  --shadow-m:0 2px 6px rgba(9,10,12,.04),0 18px 44px -20px rgba(9,10,12,.16);
  --shadow-l:0 30px 80px -32px rgba(9,10,12,.28);
}

/* squircle واقعی iOS — با fallback به گوشه‌ی گرد در مرورگرهای قدیمی‌تر */
@supports (corner-shape: squircle){
  .sq{corner-shape:squircle}
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0; background:var(--bg-2); color:var(--txt-1);
  font-family:Peyda,system-ui,"Segoe UI",sans-serif; font-weight:400;
  font-size:16px; line-height:1.75; overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  /* صفحه‌های کوتاه (مثل ۴۰۴) هم فوتر را ته صفحه نگه می‌دارند */
  min-height:100vh; display:flex; flex-direction:column;
}
body > main{flex:1 0 auto}
img,svg{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button{font:inherit; color:inherit}
h1,h2,h3,h4{margin:0; line-height:1.4; font-weight:800; letter-spacing:-.01em}
p{margin:0}
ul{margin:0; padding:0; list-style:none}

.wrap{width:min(1160px,100% - 40px); margin-inline:auto}
@media (max-width:600px){ .wrap{width:calc(100% - 32px)} }

/* ═══════════ نوار بالا — جزیره‌ی شناور شیشه‌ای iOS 26 ═══════════ */
.nav{
  position:fixed; inset-block-start:0; inset-inline:0; z-index:80;
  padding:var(--s-12) 0;
  transition:padding var(--standard) var(--spring);
}
/* با اسکرول کمی جمع می‌شود — همان حس نوار پویای iOS */
.nav .wrap{transition:width var(--slow) var(--spring)}
.nav.stuck .wrap{width:min(980px,100% - 40px)}

.nav-in{
  display:flex; align-items:center; gap:var(--s-12);
  padding:var(--s-8);
  border-radius:var(--r-pill);
  background:var(--glass);
  border:1px solid var(--glass-line);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  backdrop-filter:saturate(180%) blur(20px);
  box-shadow:var(--shadow-s);
  transition:background var(--standard) ease, border-color var(--standard) ease,
             box-shadow var(--standard) ease, padding var(--standard) var(--spring);
}
.nav.stuck .nav-in{
  background:rgba(255,255,255,.78);
  border-color:rgba(255,255,255,.85);
  box-shadow:var(--shadow-m);
}

/* برند — لوگو داخل یک دایره‌ی سفید، خودِ برند هم قرص‌شکل */
.brand{
  display:flex; align-items:center; gap:var(--s-8);
  font-weight:800; font-size:18px;
  padding:var(--s-4) var(--s-12) var(--s-4) var(--s-4);
  border-radius:var(--r-pill);
  transition:background var(--fast) var(--spring);
}
.nav .brand:hover{background:rgba(9,10,12,.04)}
.brand svg,.brand img{
  width:36px; height:36px; flex:none; padding:2px;
  border-radius:var(--r-pill); background:var(--bg-1);
  box-shadow:0 1px 2px rgba(9,10,12,.06);
}

/* آیتم‌های منو — هر کدام یک قرص، با نشانگر بخش فعال */
.nav-links{
  display:flex; align-items:center; gap:var(--s-4);
  margin-inline:auto;
  padding:var(--s-4);
  border-radius:var(--r-pill);
  background:rgba(9,10,12,.035);
}
.nav-links a{
  padding:8px var(--s-16); border-radius:var(--r-pill);
  font-size:13px; font-weight:500; white-space:nowrap; color:var(--txt-2);
  transition:background var(--standard) var(--spring), color var(--fast) linear,
             box-shadow var(--standard) ease;
}
.nav-links a:hover{background:rgba(255,255,255,.75); color:var(--txt-1)}
.nav-links a.on{
  background:var(--bg-1); color:var(--txt-1); font-weight:600;
  box-shadow:0 1px 2px rgba(9,10,12,.08);
}

@media (max-width:760px){
  .nav-links a{padding:8px var(--s-12); font-size:12px}
  .brand span{display:none}
  .brand{padding-inline:var(--s-4)}
}
@media (max-width:520px){
  .nav-links{display:none}
}

/* ═══════════ دکمه‌ها — قرص‌شکل، ارتفاع ۵۶ ═══════════ */
.btn{
  --lift:0px;
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s-8);
  height:var(--control-h); padding-inline:var(--s-32); border:0; cursor:pointer;
  border-radius:var(--r-pill); font-size:14px; font-weight:600; white-space:nowrap;
  background:var(--bg-6); color:var(--txt-6);
  transform:translate(var(--mx,0),calc(var(--my,0px) + var(--lift))) scale(var(--sc,1));
  transition:transform var(--standard) var(--spring), box-shadow var(--standard) ease,
             background var(--fast) linear;
  box-shadow:var(--shadow-s);
}
.btn:hover{--lift:-2px; box-shadow:var(--shadow-m)}
.btn:active{--sc:.96; transition-duration:var(--fast)}
.btn-sm{height:44px; padding-inline:var(--s-20)}
.btn-ghost{
  background:var(--bg-1); color:var(--txt-1); box-shadow:none;
  border:1px solid var(--bor-2);
}
.btn-ghost:hover{background:var(--bg-1); border-color:#dcdcdc}
.btn-accent{background:var(--primary-bg-4); color:var(--primary-txt-3)}

/* ═══════════ کارت پایه — دقیقاً کارت اپ: bg1 + border bor1 + r16 ═══════════ */
.card{
  background:var(--bg-1); border:1px solid var(--bor-1);
  border-radius:var(--r-16); padding:var(--s-24);
}
.glass{
  background:var(--glass); border:1px solid var(--glass-line);
  -webkit-backdrop-filter:saturate(180%) blur(24px);
  backdrop-filter:saturate(180%) blur(24px);
}

.badge{
  display:inline-flex; align-items:center; gap:var(--s-6);
  height:32px; padding-inline:var(--s-12); border-radius:var(--r-pill);
  background:var(--primary-bg-1); color:var(--primary-txt-3);
  font-size:12px; font-weight:500;
}
.badge .dot{
  width:8px; height:8px; border-radius:99px; background:var(--primary-bg-4);
  box-shadow:0 0 0 0 rgba(17,231,117,.6); animation:pulse 2.4s var(--spring-tight) infinite;
}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(17,231,117,.55)}
  70%{box-shadow:0 0 0 10px rgba(17,231,117,0)}
  100%{box-shadow:0 0 0 0 rgba(17,231,117,0)}
}

/* ═══════════ ظاهر شدن با اسکرول ═══════════ */
.js .rise{opacity:0; transform:translateY(28px) scale(.985); filter:blur(6px)}
.js .rise.in{
  opacity:1; transform:none; filter:none;
  transition:opacity var(--slow) ease, transform 620ms var(--spring), filter var(--slow) ease;
  transition-delay:var(--d,0ms);
}
@media (prefers-reduced-motion:reduce){
  .js .rise{opacity:1; transform:none; filter:none}
  *,*::before,*::after{animation-duration:.001ms !important; transition-duration:.001ms !important}
}

/* ═══════════ HERO ═══════════ */
.hero{position:relative; padding:150px 0 90px; overflow:clip}
.hero-grid{
  display:grid; grid-template-columns:1.05fr .95fr; gap:var(--s-32); align-items:center;
}
@media (max-width:960px){ .hero{padding-top:120px} .hero-grid{grid-template-columns:1fr; gap:56px} }

.hero h1{
  font-size:clamp(34px,5.6vw,60px); line-height:1.25; margin:var(--s-20) 0 var(--s-16);
}
.hero h1 .hl{position:relative; white-space:nowrap}
.hero h1 .hl::after{
  content:""; position:absolute; inset-inline:-8px; bottom:.05em; height:.34em; z-index:-1;
  background:var(--primary-bg-4); border-radius:var(--r-12);
  transform:scaleX(var(--hl,0)); transform-origin:right;
  transition:transform 900ms var(--spring) 500ms;
}
.hero p.lead{font-size:clamp(15px,1.7vw,18px); color:var(--txt-4); max-width:46ch}
.hero-cta{display:flex; flex-wrap:wrap; gap:var(--s-12); margin-top:var(--s-32)}
.hero-note{margin-top:var(--s-16); font-size:12px; color:var(--txt-4)}

/* هاله‌های پس‌زمینه */
.aurora{position:absolute; inset:0; z-index:-2; pointer-events:none; overflow:hidden}
.aurora i{position:absolute; border-radius:50%; filter:blur(90px); opacity:.55}
.aurora i:nth-child(1){width:520px; height:520px; background:#C9FFE2; inset-block-start:-160px; inset-inline-start:-120px}
.aurora i:nth-child(2){width:420px; height:420px; background:#E7F0FF; inset-block-start:120px; inset-inline-end:-140px}
.aurora i:nth-child(3){width:360px; height:360px; background:#FFF3D6; inset-block-end:-140px; inset-inline-start:35%}
.grid-bg{
  position:absolute; inset:0; z-index:-1; pointer-events:none;
  background-image:linear-gradient(var(--bor-2) 1px,transparent 1px),
                   linear-gradient(90deg,var(--bor-2) 1px,transparent 1px);
  background-size:64px 64px; opacity:.5;
  -webkit-mask-image:radial-gradient(circle at 50% 30%,#000,transparent 72%);
  mask-image:radial-gradient(circle at 50% 30%,#000,transparent 72%);
}

/* ═══════════ ماکاپ گوشی ═══════════ */
.phone-stage{
  display:flex; justify-content:center; perspective:1400px;
  transform:translateY(var(--par,0px));
}
.phone{
  --rx:0deg; --ry:0deg;
  position:relative; width:min(340px,84vw); aspect-ratio:393/820;
  border-radius:var(--r-40); padding:12px; background:linear-gradient(160deg,#2A2C33,#0C0D10 60%);
  box-shadow:var(--shadow-l), inset 0 0 0 1px rgba(255,255,255,.14);
  transform:rotateX(var(--rx)) rotateY(var(--ry));
  transition:transform 600ms var(--spring);
  transform-style:preserve-3d;
}
.screen{
  position:relative; height:100%; border-radius:32px; overflow:hidden;
  background:var(--bg-2); display:flex; flex-direction:column;
}
.notch{
  position:absolute; inset-block-start:10px; inset-inline:0; margin-inline:auto; z-index:5;
  width:104px; height:30px; border-radius:99px; background:#0C0D10;
}
.s-head{
  padding:46px var(--s-16) var(--s-12); display:flex; align-items:center; gap:var(--s-8);
  background:var(--bg-1); border-bottom:1px solid var(--bor-1);
}
.s-head b{font-size:15px}
.s-search{
  margin:var(--s-12) var(--s-16) var(--s-8); height:40px; border-radius:var(--r-pill);
  background:var(--bg-1); border:1px solid var(--bor-2); display:flex; align-items:center;
  gap:var(--s-8); padding-inline:var(--s-12); font-size:12px; color:var(--txt-4);
}
.s-chips{display:flex; gap:var(--s-6); padding:0 var(--s-16) var(--s-8); overflow:hidden}
.s-chips span{
  font-size:11px; font-weight:500; padding:6px var(--s-12); border-radius:var(--r-pill);
  background:var(--bg-1); border:1px solid var(--bor-2); white-space:nowrap;
}
.s-chips span.on{background:var(--bg-6); color:var(--txt-6); border-color:var(--bg-6)}
.s-list{display:flex; flex-direction:column; gap:var(--s-8); padding:var(--s-8) var(--s-16) var(--s-16); overflow:hidden}
.s-card{
  background:var(--bg-1); border:1px solid var(--bor-1); border-radius:var(--r-16);
  padding:var(--s-12) var(--s-16); display:flex; align-items:center; gap:var(--s-8);
  animation:slide-in 620ms var(--spring) both; animation-delay:var(--i,0ms);
}
@keyframes slide-in{from{opacity:0; transform:translateY(16px) scale(.96)} to{opacity:1; transform:none}}
.s-card .nm{font-size:13px; font-weight:600}
.s-card .br{font-size:11px; color:var(--txt-4)}
.s-card .pr{font-size:13px; font-weight:700; color:var(--txt-1); margin-top:var(--s-6)}
.s-card .heart{margin-inline-start:auto; font-size:16px; color:var(--txt-4)}
.s-card .heart.on{color:var(--danger)}
.chg{
  font-size:10px; font-weight:600; padding:2px var(--s-8); border-radius:var(--r-pill);
  display:inline-block; margin-inline-start:var(--s-6);
}
.chg.up{background:rgba(229,72,77,.12); color:var(--danger)}
.chg.down{background:rgba(17,231,117,.16); color:var(--primary-txt-3)}
.s-tabs{
  margin-top:auto; display:flex; justify-content:space-around; padding:var(--s-12) 0 var(--s-20);
  background:var(--glass); border-top:1px solid var(--bor-1);
  -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px);
}
.s-tabs i{width:22px; height:22px; border-radius:7px; background:var(--bor-2); display:block}
.s-tabs i.on{background:var(--bg-6)}

/* توست شناور کنار گوشی */
.float-toast{
  position:absolute; inset-inline-start:-8%; inset-block-start:26%; z-index:6;
  display:flex; align-items:center; gap:var(--s-10); padding:var(--s-12) var(--s-16);
  border-radius:var(--r-16); box-shadow:var(--shadow-m); font-size:12px; font-weight:500;
  animation:float 6s ease-in-out infinite;
}
.float-toast.b{inset-inline-start:auto; inset-inline-end:-10%; inset-block-start:auto; inset-block-end:16%; animation-delay:-3s}
@keyframes float{0%,100%{transform:translateY(0)} 50%{transform:translateY(-14px)}}
@media (max-width:520px){ .float-toast{display:none} }

/* ═══════════ آمار ═══════════ */
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s-12); margin-top:80px}
.stats .card{text-align:center; padding:var(--s-24) var(--s-12)}
.stats b{display:block; font-size:clamp(22px,3vw,32px); font-weight:800; font-variant-numeric:tabular-nums}
.stats span{font-size:12px; color:var(--txt-4)}
@media (max-width:720px){ .stats{grid-template-columns:repeat(2,1fr)} }

/* ═══════════ بخش‌ها ═══════════ */
section{padding:96px 0}
.sec-head{max-width:62ch; margin-bottom:var(--s-32)}
.sec-head h2{font-size:clamp(26px,3.8vw,40px); margin:var(--s-16) 0 var(--s-12)}
.sec-head p{color:var(--txt-4); font-size:clamp(14px,1.6vw,16px)}
.eyebrow{font-size:12px; font-weight:600; color:var(--primary-txt-3); letter-spacing:.04em}

/* بنتو */
.bento{display:grid; grid-template-columns:repeat(6,1fr); gap:var(--s-16)}
.bento .card{
  --tx:0; --ty:0;
  position:relative; overflow:hidden; padding:var(--s-24);
  transform:perspective(900px) rotateX(var(--ty)) rotateY(var(--tx)) translateZ(0);
  transition:transform 500ms var(--spring), box-shadow var(--standard) ease, border-color var(--standard) ease;
}
.bento .card:hover{box-shadow:var(--shadow-m); border-color:var(--bor-2)}
.bento .card::after{
  content:""; position:absolute; inset:0; opacity:0; pointer-events:none;
  background:radial-gradient(320px circle at var(--px,50%) var(--py,50%),rgba(17,231,117,.16),transparent 65%);
  transition:opacity var(--standard) ease;
}
.bento .card:hover::after{opacity:1}
.b-6{grid-column:span 6} .b-4{grid-column:span 4} .b-3{grid-column:span 3} .b-2{grid-column:span 2}
@media (max-width:900px){ .b-4,.b-3,.b-2{grid-column:span 6} }
.ico{
  width:48px; height:48px; border-radius:var(--r-16); display:grid; place-items:center;
  background:var(--primary-bg-1); color:var(--primary-txt-3); margin-bottom:var(--s-16);
}
.ico svg{width:24px; height:24px}
.bento h3{font-size:16px; font-weight:700; margin-bottom:var(--s-8)}
.bento p{font-size:14px; color:var(--txt-4); line-height:24px}

/* نمودار کوچک داخل بنتو */
.spark{width:100%; height:64px; margin-top:var(--s-16); overflow:visible}
.spark path.line{fill:none; stroke:var(--primary-bg-4); stroke-width:2.5; stroke-linecap:round;
  stroke-dasharray:var(--len); stroke-dashoffset:var(--len);}
.in .spark path.line{transition:stroke-dashoffset 1.6s var(--spring-tight) 200ms; stroke-dashoffset:0}
.spark path.area{fill:url(#g1); opacity:0}
.in .spark path.area{opacity:1; transition:opacity 900ms ease 900ms}

/* ═══════════ مراحل ═══════════ */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s-16); counter-reset:s}
@media (max-width:860px){ .steps{grid-template-columns:1fr} }
.step{position:relative; padding-top:var(--s-32)}
.step::before{
  counter-increment:s; content:counter(s);
  position:absolute; inset-block-start:0; inset-inline-start:0;
  width:40px; height:40px; border-radius:var(--r-pill); display:grid; place-items:center;
  background:var(--bg-6); color:var(--txt-6); font-weight:700; font-size:14px;
  font-feature-settings:"ss01";
}
.step h3{font-size:16px; margin:var(--s-24) 0 var(--s-8)}
.step p{font-size:14px; color:var(--txt-4)}

/* ═══════════ خط لوله‌ی قیمت ═══════════ */
.pipe{display:grid; grid-template-columns:repeat(5,1fr); gap:var(--s-12); align-items:stretch}
@media (max-width:900px){ .pipe{grid-template-columns:1fr} }
.pipe .node{
  position:relative; text-align:center; padding:var(--s-20) var(--s-12);
  border-radius:var(--r-16); background:var(--bg-1); border:1px solid var(--bor-1);
}
.pipe .node b{display:block; font-size:14px; margin-bottom:var(--s-4)}
.pipe .node span{font-size:12px; color:var(--txt-4)}
.pipe .node::after{
  content:""; position:absolute; inset-inline-start:-14px; inset-block-start:50%;
  width:16px; height:2px; background:var(--bor-2);
}
.pipe .node:last-child::after{display:none}
@media (max-width:900px){ .pipe .node::after{display:none} }

/* ═══════════ آکاردئون ═══════════ */
.faq{display:grid; gap:var(--s-12); max-width:820px}
.q{
  background:var(--bg-1); border:1px solid var(--bor-1); border-radius:var(--r-16);
  overflow:hidden; transition:border-color var(--standard) ease, box-shadow var(--standard) ease;
}
.q[open]{border-color:var(--bor-2); box-shadow:var(--shadow-s)}
.q summary{
  list-style:none; cursor:pointer; padding:var(--s-20) var(--s-24);
  display:flex; align-items:center; gap:var(--s-12); font-size:15px; font-weight:600;
}
.q summary::-webkit-details-marker{display:none}
.q summary::after{
  content:""; margin-inline-start:auto; width:10px; height:10px; flex:none;
  border-right:2px solid var(--txt-4); border-bottom:2px solid var(--txt-4);
  transform:rotate(45deg); transition:transform var(--standard) var(--spring);
}
.q[open] summary::after{transform:rotate(-135deg)}
.q .a{padding:0 var(--s-24) var(--s-20); font-size:14px; color:var(--txt-4); line-height:26px}
.q[open] .a{animation:reveal var(--slow) var(--spring)}
@keyframes reveal{from{opacity:0; transform:translateY(-8px)} to{opacity:1; transform:none}}

/* ═══════════ CTA پایانی ═══════════ */
.cta{
  position:relative; overflow:hidden; border-radius:var(--r-40);
  background:var(--bg-6); color:var(--txt-6); padding:clamp(40px,7vw,80px);
  text-align:center;
}
.cta::before{
  content:""; position:absolute; inset:-40%; opacity:.45;
  background:conic-gradient(from 0deg,transparent,rgba(17,231,117,.55),transparent 45%);
  animation:spin 14s linear infinite;
}
@keyframes spin{to{transform:rotate(1turn)}}
.cta > *{position:relative}
.cta h2{font-size:clamp(26px,4vw,44px); margin-bottom:var(--s-16)}
.cta p{color:rgba(255,255,255,.68); max-width:52ch; margin-inline:auto}
.cta .hero-cta{justify-content:center}
.cta .btn{background:var(--bg-1); color:var(--txt-1)}
.cta .btn-accent{background:var(--primary-bg-4); color:var(--primary-txt-3)}

/* ═══════════ فوتر ═══════════ */
footer{padding:56px 0 40px; border-top:1px solid var(--bor-2)}
.f-in{display:flex; flex-wrap:wrap; gap:var(--s-24); align-items:center; justify-content:space-between}
.f-in p{font-size:12px; color:var(--txt-4)}
.f-links{display:flex; gap:var(--s-20); font-size:13px; color:var(--txt-2)}
.f-links a:hover{color:var(--txt-1)}

/* نوار پیشرفت اسکرول بالای صفحه */
.progress{
  position:fixed; inset-block-start:0; inset-inline:0; height:2px; z-index:90;
  background:var(--primary-bg-4); transform-origin:right; transform:scaleX(0);
}

/* ═══════════ نبض بازار و بودجه ═══════════ */
/* ─── نبض بازار ─── */
.pulse-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s-16)}
@media (max-width:900px){ .pulse-grid{grid-template-columns:1fr} }
.pulse-h{display:flex; align-items:center; gap:var(--s-12); margin-bottom:var(--s-16)}
.pulse-h h3{font-size:15px; font-weight:700}
.pulse-h span{font-size:12px; color:var(--txt-4)}
.pulse-ic{
  width:40px; height:40px; flex:none; border-radius:var(--r-12);
  display:grid; place-items:center; font-size:12px;
}
.pulse-ic.up{background:rgba(229,72,77,.12); color:var(--danger)}
.pulse-ic.down{background:var(--primary-bg-1); color:var(--primary-txt-3)}
.pulse-ic.hot{background:#FFF6E0; color:#8A5B00}
.rows{display:flex; flex-direction:column}
.rows li{
  display:flex; align-items:center; gap:var(--s-8);
  padding:var(--s-12) 0; border-top:1px solid var(--bor-1);
  transition:padding-inline var(--standard) var(--spring);
}
.rows li:first-child{border-top:0}
.rows li:hover{padding-inline:var(--s-8)}
.rows .nm{font-size:13px; font-weight:600}
.rows .br{font-size:11px; color:var(--txt-4)}
.rows .pr{margin-inline-start:auto; text-align:start; font-size:13px; font-weight:700; white-space:nowrap}
.rows .sub{display:block; font-size:11px; font-weight:400; color:var(--txt-4)}
.disclaimer{margin-top:var(--s-24); font-size:12px; color:var(--txt-4)}

/* ─── بودجه ─── */
.chips{display:flex; flex-wrap:wrap; gap:var(--s-8); margin-bottom:var(--s-24)}
.chip{
  height:44px; padding-inline:var(--s-20); border-radius:var(--r-pill); cursor:pointer;
  background:var(--bg-1); border:1px solid var(--bor-2); font-size:13px; font-weight:500;
  transition:background var(--standard) var(--spring), color var(--fast) linear,
             border-color var(--fast) linear, transform var(--standard) var(--spring);
}
.chip:hover{transform:translateY(-2px)}
.chip.on{background:var(--bg-6); color:var(--txt-6); border-color:var(--bg-6)}
.budget-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s-12); min-height:190px}
@media (max-width:1000px){ .budget-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:520px){ .budget-grid{grid-template-columns:1fr} }
.b-card{
  background:var(--bg-1); border:1px solid var(--bor-1); border-radius:var(--r-16);
  padding:var(--s-20); animation:pop 520ms var(--spring) both; animation-delay:var(--i,0ms);
}
@keyframes pop{from{opacity:0; transform:translateY(14px) scale(.96)} to{opacity:1; transform:none}}
.b-card .nm{font-size:14px; font-weight:600}
.b-card .br{font-size:12px; color:var(--txt-4); margin-bottom:var(--s-12)}
.b-card .pr{font-size:16px; font-weight:800}
.b-card .unit{font-size:12px; font-weight:400; color:var(--txt-4)}
.b-bar{height:6px; border-radius:99px; background:var(--bor-1); margin-top:var(--s-12); overflow:hidden}
.b-bar i{display:block; height:100%; border-radius:99px; background:var(--primary-bg-4); width:var(--w)}
.empty{grid-column:1/-1; color:var(--txt-4); font-size:14px; padding:var(--s-24) 0}

/* ─── نوار برندها ─── */
.marquee{
  margin-top:var(--s-32); overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
}
.marquee-in{display:flex; gap:var(--s-12); width:max-content; animation:slide 34s linear infinite}
.marquee:hover .marquee-in{animation-play-state:paused}
@keyframes slide{to{transform:translateX(50%)}}
.marquee span{
  padding:10px var(--s-20); border-radius:var(--r-pill); white-space:nowrap;
  background:var(--bg-1); border:1px solid var(--bor-2); font-size:13px; font-weight:500; color:var(--txt-2);
}

/* ═══════════════════════════════════════════════════════════════════
   صفحه‌های داخلی — سربرگ، متن بلند، جدول محتوا، تماس، ۴۰۴
   ═══════════════════════════════════════════════════════════════════ */
.page-hero{position:relative; padding:150px 0 var(--s-32); overflow:clip}
.page-hero h1{font-size:clamp(30px,4.6vw,48px); margin:var(--s-16) 0 var(--s-12)}
.page-hero p{color:var(--txt-4); max-width:60ch; font-size:clamp(14px,1.6vw,17px)}
.page-hero .updated{margin-top:var(--s-20); font-size:12px; color:var(--txt-4)}
@media (max-width:960px){ .page-hero{padding-top:120px} }

.doc{display:grid; grid-template-columns:260px 1fr; gap:var(--s-32); align-items:start; padding-bottom:96px}
@media (max-width:900px){ .doc{grid-template-columns:1fr; gap:var(--s-16)} }

.toc{
  position:sticky; top:96px; background:var(--bg-1); border:1px solid var(--bor-1);
  border-radius:var(--r-16); padding:var(--s-16);
}
@media (max-width:900px){ .toc{position:static; top:auto} }
.toc b{display:block; font-size:12px; color:var(--txt-4); font-weight:500; margin-bottom:var(--s-8)}
.toc a{
  display:block; padding:var(--s-8) var(--s-12); border-radius:var(--r-12);
  font-size:13px; font-weight:500; color:var(--txt-2);
  transition:background var(--fast) var(--spring), color var(--fast) linear;
}
.toc a:hover{background:var(--bg-2); color:var(--txt-1)}
.toc a.on{background:var(--primary-bg-1); color:var(--primary-txt-3)}

.prose{background:var(--bg-1); border:1px solid var(--bor-1); border-radius:var(--r-24); padding:clamp(24px,4vw,40px)}
.prose section + section{margin-top:var(--s-32); padding-top:var(--s-32); border-top:1px solid var(--bor-1)}
.prose h2{font-size:clamp(19px,2.4vw,24px); scroll-margin-top:110px; margin-bottom:var(--s-12)}
.prose h3{font-size:15px; font-weight:700; margin:var(--s-24) 0 var(--s-8)}
.prose p{color:var(--txt-2); font-size:15px; line-height:30px}
.prose p + p{margin-top:var(--s-12)}
.prose ul{margin-top:var(--s-12); display:grid; gap:var(--s-8)}
.prose ul li{
  position:relative; padding-inline-start:var(--s-20); color:var(--txt-2);
  font-size:15px; line-height:28px;
}
.prose ul li::before{
  content:""; position:absolute; inset-inline-start:0; top:11px;
  width:7px; height:7px; border-radius:99px; background:var(--primary-bg-4);
}
.prose b{font-weight:700; color:var(--txt-1)}
.prose a.link{color:var(--primary-txt-3); font-weight:600; text-decoration:underline; text-underline-offset:4px}

.note{
  margin-top:var(--s-16); padding:var(--s-16) var(--s-20); border-radius:var(--r-16);
  background:var(--primary-bg-1); color:var(--primary-txt-3); font-size:14px; line-height:26px;
}
.note.warn{background:#FFF4F4; color:#8E2C2F}

.tbl{width:100%; margin-top:var(--s-16); border-collapse:separate; border-spacing:0; font-size:14px}
.tbl th,.tbl td{text-align:start; padding:var(--s-12); border-bottom:1px solid var(--bor-1)}
.tbl th{font-weight:600; color:var(--txt-4); font-size:12px}
.tbl tr:last-child td{border-bottom:0}
.tbl-wrap{overflow-x:auto}

.contact-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s-16)}
@media (max-width:900px){ .contact-grid{grid-template-columns:1fr} }
.contact-grid .card{display:flex; flex-direction:column; gap:var(--s-8)}
.contact-grid h3{font-size:15px}
.contact-grid p{font-size:13px; color:var(--txt-4)}
.contact-grid .val{margin-top:auto; padding-top:var(--s-12); font-size:14px; font-weight:600; direction:ltr; text-align:start}

/* ۴۰۴ */
.nf{min-height:72vh; display:grid; place-items:center; text-align:center; padding:150px 0 96px}
.nf .code{
  font-size:clamp(80px,18vw,160px); font-weight:800; line-height:1;
  background:linear-gradient(180deg,var(--txt-1),var(--txt-4)); -webkit-background-clip:text;
  background-clip:text; color:transparent;
}
.nf h1{font-size:clamp(22px,3vw,32px); margin:var(--s-16) 0 var(--s-12)}
.nf p{color:var(--txt-4); max-width:44ch; margin-inline:auto}


/* ═══════════════════════════════════════════════════════════════════
   فوتر بزرگ — لینک همه‌ی صفحه‌ها، مجوزها و سلب مسئولیت قیمت
   ═══════════════════════════════════════════════════════════════════ */
footer{
  padding:64px 0 var(--s-24); border-top:1px solid var(--bor-2);
  background:var(--bg-1);
}
.f-top{
  display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:var(--s-32);
  padding-bottom:var(--s-32); border-bottom:1px solid var(--bor-1);
}
@media (max-width:900px){ .f-top{grid-template-columns:1fr 1fr; gap:var(--s-24)} }
@media (max-width:560px){ .f-top{grid-template-columns:1fr} }

.f-brand .brand{margin-bottom:var(--s-12)}
.f-brand p{font-size:13px; color:var(--txt-4); line-height:26px; max-width:38ch}
.f-store{display:flex; flex-wrap:wrap; gap:var(--s-8); margin-top:var(--s-16)}
.f-store a{
  display:inline-flex; align-items:center; gap:var(--s-8); height:44px;
  padding-inline:var(--s-16); border-radius:var(--r-pill);
  background:var(--bg-2); border:1px solid var(--bor-2);
  font-size:13px; font-weight:600;
  transition:transform var(--standard) var(--spring), border-color var(--fast) linear;
}
.f-store a:hover{transform:translateY(-2px); border-color:#dcdcdc}
.f-store svg{width:16px; height:16px}

.f-col h4{font-size:12px; font-weight:600; color:var(--txt-4); margin-bottom:var(--s-12)}
.f-col a{
  display:block; padding:var(--s-6) 0; font-size:14px; color:var(--txt-2);
  transition:color var(--fast) linear, padding-inline-start var(--standard) var(--spring);
}
.f-col a:hover{color:var(--txt-1); padding-inline-start:var(--s-6)}

/* مجوزها و اعتبارها */
.f-trust{
  display:flex; flex-wrap:wrap; gap:var(--s-12); align-items:stretch;
  padding:var(--s-24) 0; border-bottom:1px solid var(--bor-1);
}
.trust{
  display:flex; align-items:center; gap:var(--s-12); flex:1 1 220px;
  padding:var(--s-12) var(--s-16); border-radius:var(--r-16);
  background:var(--bg-2); border:1px dashed var(--bor-2);
  transition:border-color var(--standard) ease, background var(--standard) ease;
}
.trust:hover{border-color:var(--primary-bg-4); background:var(--primary-bg-1)}
.trust .mark{
  width:44px; height:44px; flex:none; border-radius:var(--r-12);
  display:grid; place-items:center; background:var(--bg-1); border:1px solid var(--bor-2);
  color:var(--txt-4);
}
.trust .mark svg{width:22px; height:22px}
.trust b{display:block; font-size:13px}
.trust span{font-size:11px; color:var(--txt-4)}

.f-disclaimer{
  padding:var(--s-20) 0; border-bottom:1px solid var(--bor-1);
  font-size:12px; color:var(--txt-4); line-height:24px;
}
.f-bottom{
  display:flex; flex-wrap:wrap; gap:var(--s-12); align-items:center;
  justify-content:space-between; padding-top:var(--s-20);
}
.f-bottom p{font-size:12px; color:var(--txt-4)}
.f-bottom .f-mini{display:flex; flex-wrap:wrap; gap:var(--s-16); font-size:12px; color:var(--txt-4)}
.f-bottom .f-mini a:hover{color:var(--txt-1)}
.f-top-link{
  display:inline-flex; align-items:center; gap:var(--s-6);
  font-size:12px; font-weight:500; color:var(--txt-2);
}
.f-top-link:hover{color:var(--txt-1)}

/* ═══════════════════════════════════════════════════════════════════
   بلاگ — فهرست، کارت‌ها و صفحه‌ی مطلب
   ═══════════════════════════════════════════════════════════════════ */
.chips a.chip{display:inline-flex; align-items:center; gap:var(--s-8); text-decoration:none}
.chip-n{
  font-size:11px; font-weight:600; padding:1px var(--s-6); border-radius:var(--r-pill);
  background:rgba(9,10,12,.06); color:var(--txt-4);
}
.chip.on .chip-n{background:rgba(255,255,255,.18); color:var(--txt-6)}

.post-meta{
  display:flex; align-items:center; gap:var(--s-8); flex-wrap:wrap;
  font-size:12px; color:var(--txt-4); margin-bottom:var(--s-12);
}
.post-meta .cat{
  padding:4px var(--s-10); border-radius:var(--r-pill);
  background:var(--primary-bg-1); color:var(--primary-txt-3); font-weight:600;
}

/* مطلب شاخص */
.feature-card{
  --tx:0; --ty:0;
  display:grid; grid-template-columns:1.6fr 1fr; gap:var(--s-24); align-items:stretch;
  margin-bottom:var(--s-16); padding:var(--s-32); overflow:hidden;
  background:var(--bg-1); border:1px solid var(--bor-1); border-radius:var(--r-24);
  transform:perspective(1200px) rotateX(var(--ty)) rotateY(var(--tx));
  transition:transform 500ms var(--spring), box-shadow var(--standard) ease, border-color var(--standard) ease;
}
.feature-card:hover{box-shadow:var(--shadow-m); border-color:var(--bor-2)}
@media (max-width:820px){ .feature-card{grid-template-columns:1fr; padding:var(--s-24)} }
.feature-body{display:flex; flex-direction:column; align-items:flex-start}
.feature-card h2{font-size:clamp(20px,2.6vw,28px); margin-bottom:var(--s-12)}
.feature-card p{color:var(--txt-4); font-size:15px; line-height:28px}
.read-more{
  display:inline-flex; align-items:center; gap:var(--s-6); margin-top:var(--s-20);
  font-size:13px; font-weight:600; color:var(--primary-txt-3);
}
.feature-card:hover .read-more svg{transform:translateX(-4px)}
.read-more svg{transition:transform var(--standard) var(--spring)}
.feature-art{
  display:grid; place-items:center; border-radius:var(--r-16);
  background:linear-gradient(150deg,var(--primary-bg-1),#E7F0FF);
  min-height:180px;
}
.feature-art span{
  font-size:88px; font-weight:800; line-height:1;
  color:rgba(7,94,75,.22);
}
@media (max-width:820px){ .feature-art{display:none} }

/* شبکه‌ی مطلب‌ها */
.post-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s-16)}
@media (max-width:1000px){ .post-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:620px){ .post-grid{grid-template-columns:1fr} }
.post-card{
  --tx:0; --ty:0;
  display:flex; flex-direction:column;
  background:var(--bg-1); border:1px solid var(--bor-1); border-radius:var(--r-16);
  padding:var(--s-24);
  transform:perspective(900px) rotateX(var(--ty)) rotateY(var(--tx));
  transition:transform 500ms var(--spring), box-shadow var(--standard) ease, border-color var(--standard) ease;
}
.post-card:hover{box-shadow:var(--shadow-m); border-color:var(--bor-2)}
.post-card h2,.post-card h3{font-size:17px; line-height:1.6; margin-bottom:var(--s-8)}
.post-card a{color:inherit}
.post-card a::after{content:""; position:absolute; inset:0}   /* کل کارت کلیک‌پذیر */
.post-card{position:relative}
.post-card p{font-size:14px; color:var(--txt-4); line-height:26px}
.post-foot{
  margin-top:auto; padding-top:var(--s-16); font-size:12px; color:var(--txt-4);
}

.pager{
  display:flex; align-items:center; justify-content:center; gap:var(--s-16);
  margin-top:var(--s-32);
}
.pager-n{font-size:13px; color:var(--txt-4)}

/* صفحه‌ی مطلب */
.article-hero h1{max-width:22ch}
.crumbs{
  display:flex; align-items:center; gap:var(--s-8); flex-wrap:wrap;
  font-size:12px; color:var(--txt-4); margin-bottom:var(--s-16);
}
.crumbs a{color:var(--txt-4)}
.crumbs a:hover{color:var(--txt-1)}

.article-wrap{display:grid; grid-template-columns:1fr 300px; gap:var(--s-32); align-items:start; padding-bottom:96px}
@media (max-width:960px){ .article-wrap{grid-template-columns:1fr} }
.article-wrap .prose h2{font-size:clamp(20px,2.4vw,26px); margin:var(--s-32) 0 var(--s-12)}
.article-wrap .prose h2:first-child{margin-top:0}
.article-wrap .prose h3{margin-top:var(--s-24)}

.article-cta{
  position:sticky; top:96px;
  background:var(--bg-6); color:var(--txt-6); border-radius:var(--r-24); padding:var(--s-24);
}
@media (max-width:960px){ .article-cta{position:static} }
.article-cta b{display:block; font-size:16px; margin-bottom:var(--s-8)}
.article-cta p{font-size:13px; color:rgba(255,255,255,.66); line-height:24px; margin-bottom:var(--s-16)}
.article-cta .btn{background:var(--primary-bg-4); color:var(--primary-txt-3); width:100%}