/* Опыт в районе — 675:27307: фон #181d24, отступы 100/110, колонки по нижнему краю */
.dexp {
  background: var(--ink);
  padding: clamp(56px, 5.2083vw, 100px) var(--gutter);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: clamp(32px, 4vw, 80px);
}
.dexp__left { display: flex; flex-direction: column; gap: 24px; max-width: 600px; }
.dexp__eyebrow {
  font-size: 13px;
  font-weight: 600;
  line-height: 19.5px;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: rgba(207, 164, 79, 0.8);
}
/* число с золотой вертикальной чертой слева (675:27313) */
.dexp__big { position: relative; padding-inline-start: 28px; }
.dexp__big::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 0;
  width: 4px;
  height: 100%;
  border-radius: var(--r-pill);
  background: var(--gold);
}
.dexp__big span {
  display: block;
  font-size: clamp(64px, 7.4063vw, 142.2px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -4px;
  background-image: linear-gradient(159.86deg, #cfa44f 0%, #f5d98a 45%, #cfa44f 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.dexp__what {
  font-size: clamp(19px, 1.25vw, 24px);
  font-weight: 700;
  line-height: 32.5px;
  letter-spacing: 0.65px;
  text-transform: uppercase;
  color: var(--paper);
}
.dexp__rule { display: block; width: 64px; height: 1px; background: var(--gold); }
.dexp__note {
  width: min(480px, 100%);
  font-size: var(--t-body);
  line-height: 27.625px;
  color: rgba(247, 247, 247, 0.6);
}

.dexp__right { display: flex; flex-direction: column; gap: 32px; }
.dexp__chart-title {
  font-size: clamp(19px, 1.25vw, 24px);
  font-weight: 600;
  line-height: 22.5px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--paper);
}
.chart { display: flex; align-items: flex-end; gap: 32px; }
.chart__col { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.chart__val { font-size: 18px; font-weight: 700; line-height: 27px; color: var(--gold); }
.chart__track {
  display: flex;
  align-items: flex-end;
  width: 72px;
  height: 200px;
  border-radius: 12px;
  background: rgba(247, 247, 247, 0.07);
  overflow: hidden;
}
.chart__bar { width: 100%; border-radius: 0 0 12px 12px; background: var(--gold-grad); }
.chart__bar--dim { background: linear-gradient(to top, #a67a2a, var(--gold)); }
.chart__label {
  width: 89px;
  font-size: 16px;
  font-weight: 500;
  line-height: 16.5px;
  text-align: center;
  color: rgba(247, 247, 247, 0.6);
}
.chart__label--wide { width: 129px; }

@media (max-width: 1023px) {
  .dexp { flex-direction: column; align-items: flex-start; }
  .dexp__note { width: 100%; }
}
@media (max-width: 599px) {
  .chart { gap: 16px; }
  .chart__track { width: 56px; height: 150px; }
  .chart__label, .chart__label--wide { width: 72px; font-size: 14px; }
}
