@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Vazirmatn:wght@400;500;600;700;800&display=swap');

:root{
  --brand:#1B4FD8;
  --brand-light:#EEF3FF;
  --brand-dark:#0F2E8A;
  --gold:#C8922A;
  --success:#0F6E56;
  --success-light:#E1F5EE;
  --warning:#854F0B;
  --warning-light:#FAEEDA;
  --danger:#A32D2D;
  --danger-light:#FCEBEB;
  --pending:#534AB7;
  --pending-light:#EEEDFE;
  --bg:#F8F9FC;
  --card:#fff;
  --border:#E5E7EB;
  --text:#111827;
  --muted:#6B7280;

  --font-fa:'Vazirmatn','Tahoma','Segoe UI',sans-serif;
  --font-en:'Inter','Segoe UI',Arial,sans-serif;

  --fs-display:clamp(1.6rem, 2.4vw + 1rem, 2.6rem);
  --fs-h1:clamp(1.35rem, 1.7vw + 0.9rem, 1.95rem);
  --fs-h2:clamp(1.15rem, 1vw + 0.8rem, 1.45rem);
  --fs-h3:clamp(1rem, 0.65vw + 0.78rem, 1.15rem);
  --fs-body-lg:clamp(0.96rem, 0.35vw + 0.86rem, 1.05rem);
  --fs-body:clamp(0.9rem, 0.25vw + 0.82rem, 1rem);
  --fs-small:clamp(0.8rem, 0.2vw + 0.74rem, 0.9rem);
  --fs-caption:clamp(0.72rem, 0.15vw + 0.69rem, 0.8rem);

  --lh-tight:1.35;
  --lh-normal:1.65;
  --lh-relaxed:1.85;
}

*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:var(--font-fa);
  background:var(--bg);
  color:var(--text);
  line-height:var(--lh-normal);
  font-size:var(--fs-body);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  font-variant-numeric:tabular-nums;
}

:lang(en){
  font-family:var(--font-en);
}

h1,h2,h3,h4{
  color:var(--text);
  line-height:var(--lh-tight);
  letter-spacing:-0.01em;
}

h1{font-size:var(--fs-h1);font-weight:800}
h2{font-size:var(--fs-h2);font-weight:700}
h3{font-size:var(--fs-h3);font-weight:700}
p,li{font-size:var(--fs-body);line-height:var(--lh-relaxed)}
small{font-size:var(--fs-caption)}

input,select,textarea,button{
  font:inherit;
}

nav{
  background:#fff;
  border-bottom:1px solid var(--border);
  height:56px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:sticky;
  top:0;
  z-index:100;
}

.nav-logo{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:var(--fs-h3);
  font-weight:800;
  color:var(--brand);
  text-decoration:none;
}

.nav-logo-icon{
  width:30px;
  height:30px;
  background:var(--brand);
  border-radius:7px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.nav-logo span{color:var(--gold);}

.page{
  max-width:1120px;
  margin:0 auto;
  padding:1.75rem 1rem;
}

.card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
}

.btn-primary{
  background:var(--brand);
  color:#fff;
  border:none;
  border-radius:9px;
  padding:11px 16px;
  font-weight:700;
  cursor:pointer;
  font-family:inherit;
  font-size:var(--fs-body);
  line-height:1.2;
}

.btn-primary:hover{background:var(--brand-dark);}

@media (max-width: 992px){
  .page{padding:1.35rem 0.9rem}
}

@media (max-width: 640px){
  .page{padding:1rem 0.75rem}
  nav{height:52px}
  .nav-logo{font-size:var(--fs-body)}
}