/* Восьмой экран: знакомая ситуация и желаемое направление изменений. */
.club-changes {
  margin-top: -48px;
  margin-bottom: 48px;
  padding: 64px 32px 68px;
  border-bottom: 1px solid #eae4d9;
  background: #fff;
  color: #29261f;
}

.club-changes .changes-inner { width: 100%; max-width: 1120px; margin: 0 auto; }
.club-changes .changes-title { max-width: 980px; margin: 0 auto; font-family: 'Bebas Neue', Arial, sans-serif; font-size: clamp(36px, 4.35vw, 52px); font-weight: 700; line-height: 1.17; letter-spacing: .8px; text-align: center; text-wrap: balance; }
.club-changes .changes-title::before { content: ''; display: block; width: 44px; height: 2px; margin: 0 auto 23px; background: #b5955a; }
.club-changes .changes-intro { max-width: 830px; margin: 25px auto 0; color: #655e53; font-size: 18px; line-height: 1.85; text-align: center; text-wrap: pretty; }

.club-changes .changes-table { width: 100%; margin: 27px 0 0; border-collapse: separate; border-spacing: 0 12px; table-layout: fixed; font-size: 17px; line-height: 1.8; }
.club-changes .changes-table thead th { width: 50%; padding: 6px 29px 9px; color: #81796b; font-size: 20px; font-weight: 400; text-align: left; }
.club-changes .changes-table thead th:last-child { padding-left: 43px; color: #927641; }
.club-changes .changes-table tbody td { position: relative; width: 50%; padding: 22px 29px; border-block: 1px solid #e4dccd; vertical-align: middle; text-align: left; }
.club-changes .changes-table tbody td:first-child { padding-right: 42px; border-left: 1px solid #e4dccd; border-radius: 9px 0 0 9px; background: #f7f6f2; color: #6a6358; }
.club-changes .changes-table tbody td:last-child { padding-left: 43px; border-inline: 1px solid #e4dccd; border-radius: 0 9px 9px 0; background: #fdfaf3; color: #3f3628; }
.club-changes .changes-mobile-label { display: none; }

.club-changes .changes-arrow { position: absolute; z-index: 1; top: 50%; left: -15px; display: grid; place-items: center; width: 29px; height: 29px; border: 1px solid #c8b180; border-radius: 50%; background: #fff; color: #a88a50; transform: translateY(-50%); }
.club-changes .changes-arrow svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.5; }

.club-changes .changes-choice { max-width: 910px; margin: 28px auto 0; padding: 27px 30px 29px; border: 1px solid #e9dfcd; border-radius: 9px; background: #faf7f0; text-align: center; }
.club-changes .changes-note { max-width: 740px; margin: 0 auto; color: #655b4b; font-size: 18px; line-height: 1.8; text-wrap: pretty; }
.club-changes .changes-question { margin: 23px 0 0; color: #302a20; font-family: 'Brutal Type', Arial, sans-serif; font-size: 25px; font-weight: 400; line-height: 1.5; text-wrap: balance; }
.club-changes .club-cta { margin-top: 23px; }

@media (max-width: 980px) {
  .club-changes { padding: 56px 26px 58px; }
  .club-changes .changes-table { font-size: 16px; }
  .club-changes .changes-table tbody td { padding-block: 20px; }
  .club-changes .changes-table tbody td:first-child { padding-left: 24px; padding-right: 33px; }
  .club-changes .changes-table tbody td:last-child { padding-left: 34px; padding-right: 24px; }
}

@media (max-width: 767px) {
  .club-changes { margin-top: -36px; margin-bottom: 36px; padding: 48px 22px 50px; }
  .club-changes .changes-title { max-width: 550px; font-size: 36px; letter-spacing: .4px; }
  .club-changes .changes-intro { max-width: 540px; margin-top: 22px; font-size: 16px; text-align: left; }
  .club-changes .changes-choice { max-width: 540px; padding: 24px; margin-top: 26px; }
  .club-changes .changes-note { font-size: 16px; }
  .club-changes .changes-question { font-size: 23px; margin-top: 21px; }
}

/* Пары остаются рядом: на телефоне результат расположен под ситуацией. */
@media (max-width: 680px) {
  .club-changes .changes-table { display: block; max-width: 540px; margin: 28px auto 0; border-spacing: 0; }
  .club-changes .changes-table thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .club-changes .changes-table tbody { display: grid; gap: 18px; }
  .club-changes .changes-table tbody tr { display: block; overflow: hidden; border: 1px solid #e0d5c1; border-radius: 9px; }
  .club-changes .changes-table tbody td { display: block; width: 100%; border: 0; border-radius: 0; }
  .club-changes .changes-table tbody td:first-child { padding: 20px 23px 24px; border: 0; border-radius: 0; }
  .club-changes .changes-table tbody td:last-child { padding: 25px 23px 21px; border: 0; border-top: 1px solid #e5d9c2; border-radius: 0; }
  .club-changes .changes-mobile-label { display: block; margin-bottom: 8px; color: #948672; font-size: 11px; line-height: 1.5; letter-spacing: .8px; }
  .club-changes .changes-table td:last-child .changes-mobile-label { color: #927641; }
  .club-changes .changes-arrow { top: 0; left: calc(50% - 15px); transform: translateY(-50%) rotate(90deg); }
}

@media (max-width: 374px) {
  .club-changes { padding-inline: 18px; }
  .club-changes .changes-title { font-size: 32px; }
  .club-changes .changes-table tbody td:first-child { padding-inline: 20px; }
  .club-changes .changes-table tbody td:last-child { padding-inline: 20px; }
  .club-changes .changes-choice { padding-inline: 19px; }
  .club-changes .changes-question { font-size: 22px; }
}