.ta{
  max-width:860px;
  margin:0 auto;
  line-height:2;
  direction:rtl;
  text-align:right;
}

.ta h1,
.ta h2,
.ta h3{
  color:var(--primary,#1a5276);
}

.ta h1{
  font-size:1.45em;
  margin:0 0 6px;
  padding-bottom:8px;
  border-bottom:3px solid var(--border,#d3dcea);
}

.ta h2{
  font-size:1.28em;
  margin:34px 0 8px;
  padding-bottom:7px;
  border-bottom:2px solid var(--border,#d3dcea);
}

.ta h3{
  font-size:1.08em;
  margin:28px 0 8px;
}

.ta p,
.ta li{
  color:var(--text-soft,#52627e);
}

.ta strong{
  color:var(--text,#24344d);
}

.ta-sub{
  font-weight:700;
  color:#1fb589;
  font-size:1.08em;
  margin-bottom:8px;
}

.ta-badge{
  display:inline-block;
  border:1px solid #f5b942;
  color:#b7791f;
  background:rgba(245,185,66,.07);
  border-radius:6px;
  padding:1px 10px;
  font-size:14px;
  font-weight:700;
}

.ta-fig{
  margin:16px 0 20px;
  text-align:center;
}

.ta-fig img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  margin:0 auto;
  border-radius:8px;
  border:1px solid var(--border,#d3dcea);
}

.ta-fig figcaption{
  font-size:13.5px;
  color:var(--text-soft,#52627e);
  margin-top:6px;
}

.ta-tbl{
  overflow-x:auto;
  border:1px solid var(--border,#d3dcea);
  border-radius:8px;
  margin:10px 0 16px;
}

.ta-tbl table{
  width:100%;
  min-width:520px;
  border-collapse:collapse;
  font-size:.92em;
}

.ta-tbl th{
  background:linear-gradient(135deg,#1a5276,#2980b9);
  color:#fff;
  padding:9px 11px;
  text-align:right;
  white-space:nowrap;
}

.ta-tbl td{
  padding:8px 11px;
  border-bottom:1px solid var(--border,#d3dcea);
  color:var(--text-soft,#52627e);
  vertical-align:top;
}

.ta-tbl tr:last-child td{
  border-bottom:0;
}

.ta-note{
  background:#fef9e7;
  border-right:4px solid #f39c12;
  border-radius:8px;
  padding:10px 14px;
  margin:18px 0 4px;
}

.ta-note,
.ta-note *{
  color:#1b1b1b!important;
}

.ta-steps{
  padding:0;
  list-style:none;
  counter-reset:ta;
}

.ta-steps>li{
  counter-increment:ta;
  position:relative;
  padding:2px 48px 2px 0;
  margin:10px 0;
}

.ta-steps>li::before{
  content:counter(ta);
  position:absolute;
  right:0;
  top:4px;
  width:32px;
  height:32px;
  border-radius:50%;
  background:#2980b9;
  color:#fff;
  font-weight:700;
  display:grid;
  place-items:center;
  line-height:1;
}

@media(max-width:640px){
  .ta{
    padding:0 10px;
  }

  .ta h1{
    font-size:1.3em;
  }

  .ta h2{
    font-size:1.16em;
  }

  .ta-tbl table{
    min-width:500px;
  }
}
