.rea-page {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 44px;
  width: 100%;
  min-width: 0;
  min-height: 100%;
  padding: 38px 64px 40px;
  background: #121c19;
  color: #f0f3e9;
  font-family: Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.rea-page *,
.rea-page *::before,
.rea-page *::after { box-sizing: border-box; }

.rea-page :where(h1, h2, p) { margin: 0; }
.rea-page :where(header, section, div) { min-width: 0; }

.rea-page .rea-kicker {
  color: #c2b8ff;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.rea-page .rea-title {
  margin-top: 16px;
  color: #f0f3e9;
  font-size: 66px;
  font-weight: 550;
  line-height: 1.06;
  letter-spacing: -.06em;
}

.rea-page .rea-title-next { color: #b8c5bb; }

.rea-page .rea-potential {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  flex: 1;
  align-items: center;
  gap: 72px;
}

.rea-page .rea-scale {
  color: #d0f5a5;
  font-size: 184px;
  font-weight: 650;
  line-height: .94;
  letter-spacing: -.085em;
}

.rea-page .rea-scale-note {
  margin-top: 8px;
  color: #d0f5a5;
  font-size: 39px;
  font-weight: 450;
  line-height: 1.12;
  letter-spacing: -.045em;
}

.rea-page .rea-history {
  max-width: 420px;
  margin-top: 24px;
  color: #aabbb0;
  font-size: 19px;
  line-height: 1.5;
  letter-spacing: -.015em;
}

.rea-page .rea-outcome {
  padding-top: 24px;
  font-size: 48px;
  font-weight: 450;
  line-height: 1.16;
  letter-spacing: -.055em;
}

.rea-page .rea-payoff {
  color: #c2b8ff;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 10px;
}

.rea-page .rea-chain {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 44px minmax(0, 1fr) 44px minmax(0, 1fr);
  align-items: start;
  gap: 24px;
  padding-top: 26px;
  border-top: 1px solid #35483d;
}

.rea-page .rea-step-title {
  color: #f0f3e9;
  font-size: 21px;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -.025em;
}

.rea-page .rea-step-copy {
  max-width: 330px;
  margin-top: 12px;
  color: #aabbb0;
  font-size: 17px;
  line-height: 1.5;
  letter-spacing: -.01em;
}

.rea-page .rea-arrow {
  display: block;
  width: 44px;
  height: 20px;
  margin-top: 4px;
  color: #c2b8ff;
}

@container reader (max-width: 1300px) {
  .rea-page { gap: 30px; padding: 28px 36px 30px; }
  .rea-page .rea-title { font-size: clamp(38px, 4.8cqw, 60px); }
  .rea-page .rea-potential { gap: 44px; }
  .rea-page .rea-scale { font-size: clamp(100px, 13.7cqw, 164px); }
  .rea-page .rea-scale-note { font-size: 32px; }
  .rea-page .rea-outcome { font-size: clamp(32px, 3.6cqw, 44px); }
  .rea-page .rea-chain { grid-template-columns: minmax(0, 1fr) 32px minmax(0, 1fr) 32px minmax(0, 1fr); gap: 18px; }
  .rea-page .rea-arrow { width: 32px; }
  .rea-page .rea-step-title { font-size: 20px; }
  .rea-page .rea-step-copy { font-size: 16px; }
}

@container reader (max-width: 820px) {
  .rea-page { gap: 34px; padding: 26px 28px 30px; }
  .rea-page .rea-title { font-size: clamp(32px, 5.7cqw, 46px); }
  .rea-page .rea-potential { grid-template-columns: minmax(0, 1fr); flex: none; gap: 24px; }
  .rea-page .rea-scale { font-size: clamp(100px, 17cqw, 140px); }
  .rea-page .rea-scale-note { font-size: 30px; }
  .rea-page .rea-history { max-width: 560px; }
  .rea-page .rea-outcome { padding-top: 0; font-size: 32px; }
  .rea-page .rea-chain { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .rea-page .rea-arrow { margin: 6px 0 6px 8px; transform: rotate(90deg); }
  .rea-page .rea-step-title { font-size: 22px; }
  .rea-page .rea-step-copy { max-width: 560px; font-size: 17px; }
}

@container reader (max-width: 480px) {
  .rea-page { gap: 28px; padding: 24px 20px 28px; }
  .rea-page .rea-title { font-size: clamp(28px, 7.5cqw, 34px); }
  .rea-page .rea-scale { font-size: clamp(88px, 24cqw, 110px); }
  .rea-page .rea-scale-note { font-size: 27px; }
  .rea-page .rea-history { margin-top: 18px; font-size: 17px; }
  .rea-page .rea-outcome { font-size: 30px; }
}

@container reader (max-width: 360px) {
  .rea-page { padding-inline: 16px; }
}