/* An immediate next step, with the full recovery process visible at every size. */
.recovery-action {
  position: relative;
  overflow: hidden;
  padding: clamp(64px, 7.2vw, 104px) 0;
  background: radial-gradient(ellipse at 5% 0%, #a8000029, transparent 57%), #1a1a1a;
  border-top: 4px solid #e10600;
  color: #ffffff;
}
.recovery-action-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr);
  align-items: center;
  gap: clamp(36px, 5.2vw, 76px);
}
.recovery-action-copy { min-width: 0; }
.recovery-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 25px;
  color: #ff453a;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 1.3px;
}
.recovery-alert .icon { width: 19px; height: 19px; color: #ff453a; }
.recovery-action h2 {
  font-size: clamp(39px, 4.3vw, 59px);
  line-height: 1.1;
  letter-spacing: -2.6px;
  font-weight: 750;
}
.recovery-action h2 span { display: inline-block; margin-top: 7px; color: #ff453a; }
.recovery-action-intro { max-width: 440px; margin-top: 25px; color: #c6c6c6; font-size: 16px; line-height: 1.85; }
.recovery-action .recovery-action-button {
  margin-top: 31px;
  min-height: 58px;
  padding: 16px 23px;
  gap: 27px;
  background: #c9c9c9;
  border-color: #c9c9c9;
  color: #0a0a0a;
  font-size: 15px;
  box-shadow: 0 5px 0 #0a0a0a;
}
.recovery-action .recovery-action-button:hover { background: #dcdcdc; border-color: #dcdcdc; box-shadow: 0 7px 0 #0a0a0a; }
.recovery-action-reassurance { display: flex; align-items: center; gap: 8px; margin-top: 18px; color: #b8b8b8; font-size: 12px; line-height: 1.6; }
.recovery-action-reassurance .icon { width: 15px; height: 15px; }
.recovery-roadmap { min-width: 0; overflow: hidden; background: #ffffff; color: #1e1e1e; border: 1px solid #cfcfcf; border-radius: 12px; box-shadow: 0 20px 50px #00000038; }
.recovery-roadmap-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 19px 26px; background: #f5f5f5; border-bottom: 1px solid #cccccc; color: #535353; font-size: 9px; line-height: 1.5; font-weight: 750; letter-spacing: 1.25px; }
.recovery-roadmap-heading>span:last-child { white-space: nowrap; letter-spacing: .6px; }
.recovery-steps { list-style: none; margin: 0; padding: 0 26px; }
.recovery-step { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: start; gap: 19px; padding: 25px 0; border-bottom: 1px solid #d3d3d3; }
.recovery-step-number { font-family: var(--display); font-size: 29px; font-weight: 750; letter-spacing: -1.5px; line-height: 1; padding-top: 3px; color: #797979; }
.recovery-step-kicker { display: block; margin-bottom: 7px; color: #656565; font-size: 9px; font-weight: 750; line-height: 1.4; letter-spacing: 1.15px; }
.recovery-step h3 { font-size: 20px; font-weight: 750; line-height: 1.25; letter-spacing: -.6px; }
.recovery-step p { margin-top: 9px; color: #616161; font-size: 13px; line-height: 1.75; }
.recovery-step-first .recovery-step-number, .recovery-step-first .recovery-step-kicker { color: #e10600; }
.recovery-step-last { border-bottom: 0; }
.recovery-step-last .recovery-step-number, .recovery-step-last .recovery-step-kicker { color: #0a0a0a; }
.recovery-roadmap-footer { display: flex; align-items: center; gap: 10px; padding: 16px 26px; background: #f5f5f5; color: #494949; font-size: 11px; line-height: 1.6; border-top: 1px solid #cccccc; }
.recovery-roadmap-footer .icon { width: 18px; height: 18px; }

@media (max-width: 1050px) {
  .recovery-action-grid { gap: 32px; }
  .recovery-action h2 { font-size: 43px; letter-spacing: -2px; }
  .recovery-action-intro { font-size: 15px; }
  .recovery-alert { font-size: 9px; letter-spacing: 1px; }
  .recovery-step { grid-template-columns: 34px minmax(0, 1fr); gap: 13px; }
  .recovery-step h3 { font-size: 18px; }
  .recovery-roadmap-heading, .recovery-roadmap-footer { padding-inline: 21px; }
  .recovery-steps { padding-inline: 21px; }
}
@media (max-width: 900px) {
  .recovery-action { padding: 54px 0 56px; }
  .recovery-action-grid { grid-template-columns: minmax(0, 1fr); gap: 34px; }
  .recovery-alert { margin-bottom: 20px; font-size: 9px; line-height: 1.6; }
  .recovery-action h2 { font-size: clamp(36px, 7.5vw, 48px); line-height: 1.13; letter-spacing: -1.8px; }
  .recovery-action h2 span { margin-top: 3px; }
  .recovery-action-intro { max-width: 540px; margin-top: 20px; font-size: 15px; line-height: 1.8; }
  .recovery-action .recovery-action-button { margin-top: 25px; width: 100%; min-height: 56px; justify-content: space-between; padding-inline: 20px; }
  .recovery-action-reassurance { font-size: 12px; margin-top: 15px; }
  .recovery-roadmap-heading { padding: 17px 20px; font-size: 8px; letter-spacing: .9px; }
  .recovery-steps { padding-inline: 20px; }
  .recovery-step { grid-template-columns: 31px minmax(0, 1fr); gap: 14px; padding-block: 23px; }
  .recovery-step-number { font-size: 26px; }
  .recovery-step-kicker { font-size: 8px; letter-spacing: 1px; }
  .recovery-step h3 { font-size: 19px; }
  .recovery-step p { font-size: 14px; line-height: 1.7; }
  .recovery-roadmap-footer { padding: 16px 20px; font-size: 11px; align-items: flex-start; }
}
@media (max-width: 370px) {
  .recovery-action h2 { font-size: 33px; }
  .recovery-alert { font-size: 8px; gap: 7px; }
  .recovery-action .recovery-action-button { font-size: 14px; gap: 14px; }
}