/* Подбор налогового режима */

.tr-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .9fr);
  gap: clamp(28px, 4vw, 48px);
  align-items: start;
}

.tr-controls { display: grid; gap: 28px; }
.tr-step { display: grid; gap: 10px; padding-bottom: 22px; border-bottom: var(--bw) solid var(--line); }
.tr-step:last-child { border-bottom: 0; padding-bottom: 0; }
.tr-step-h {
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.tr-step-n {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: .06em;
  color: var(--ink-3);
}
.tr-step-h b { font-size: 16px; font-weight: 600; }
.tr-step .caption { max-width: 52ch; }

.tr-range { width: 100%; }
.tr-range-out {
  font-family: var(--font-mono);
  font-size: 18px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.tr-range-scale {
  display: flex;
  justify-content: space-between;
  margin-top: 6px;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-4);
}

.tr-emp-row { display: flex; align-items: center; gap: 12px; }
.tr-emp-val {
  min-width: 48px;
  text-align: center;
  font-family: var(--font-mono);
  font-size: 22px;
  font-weight: 500;
}

.tr-result {
  position: sticky;
  top: 88px;
  background: var(--surface);
  border: var(--bw) solid var(--line-strong);
  border-radius: var(--r-3, 4px);
  padding: 24px 22px 22px;
  display: grid;
  gap: 18px;
}
.tr-kicker { color: var(--accent-text); margin: 0 0 8px; }
.tr-best-name {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(28px, 3.2vw, 36px);
  font-weight: 500;
  letter-spacing: -.02em;
  line-height: 1.15;
}
.tr-best-sum { margin: 12px 0 0; font-size: 28px; font-weight: 600; }
.tr-best-sum .tr-unit { font-size: 15px; font-weight: 400; color: var(--ink-3); }
.tr-cmp { margin: 10px 0 0; }
.tr-cmp b { color: var(--ink); font-weight: 600; }
.tr-why { margin: 14px 0 0; max-width: 36ch; }

.tr-rows { display: grid; gap: 14px; padding-top: 4px; border-top: var(--bw) solid var(--line); }
.tr-row { display: grid; gap: 6px; }
.tr-row-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.tr-row-top b { font-size: 15px; font-weight: 550; }
.tr-row-sum { margin: 0; font-size: 18px; font-weight: 600; }
.tr-bar {
  height: 6px;
  background: var(--bg-alt);
  border-radius: 99px;
  overflow: hidden;
}
.tr-bar i {
  display: block;
  height: 100%;
  background: var(--ink-3);
  border-radius: inherit;
}
.tr-row.is-best .tr-bar i { background: var(--accent); }
.tr-row.is-off { opacity: .55; }
.tr-row.is-off .tr-row-top b { font-weight: 500; }
.tr-foot { margin: 0; }
.tr-result .btn { margin-top: 4px; }

.tr-rules {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  border-top: var(--bw) solid var(--line-strong);
}
.tr-rule {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr);
  gap: 16px 24px;
  padding: 22px 0;
  border-bottom: var(--bw) solid var(--line);
}
.tr-rule:nth-child(odd) { padding-right: 28px; border-right: var(--bw) solid var(--line); }
.tr-rule:nth-child(even) { padding-left: 28px; }
.tr-rule b { font-size: 16px; font-weight: 600; }
.tr-rule p { margin: 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.5; }

@media (max-width: 960px) {
  .tr-layout { grid-template-columns: 1fr; }
  .tr-result { position: static; }
}
@media (max-width: 720px) {
  .tr-rules { grid-template-columns: 1fr; }
  .tr-rule,
  .tr-rule:nth-child(odd),
  .tr-rule:nth-child(even) {
    grid-template-columns: 1fr;
    padding-left: 0;
    padding-right: 0;
    border-right: 0;
  }
}