/* Recovery Roadmap offer: integrates the two supplied standalone design exports.
   Scope all rules to this new section; existing site rules are unchanged. */
.rr-roadmap-offer {width:100%;min-width:0;overflow:hidden;background:#375A7D;color:#fff;font-family:'Hanken Grotesk',system-ui,sans-serif;}
.rr-roadmap-offer * { box-sizing:border-box; }
.rr-roadmap-offer a {color:#A9CDF0;}
.rr-roadmap-offer a:hover {color:#C6DEF5;}
.rr-roadmap-offer a[href="#checkout"]{color:#1E3A55;}
.rr-roadmap-offer a[href="#checkout"]:hover{color:#1E3A55;background:#F1F6FA!important;}
.rr-roadmap-offer a:focus-visible{outline:3px solid #A9CDF0;outline-offset:4px;}
.rr-roadmap-offer img{max-width:100%;}
.rr-roadmap-offer-desktop .stage {display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,460px) minmax(0,1fr);gap:24px;align-items:stretch;}
.rr-roadmap-offer-desktop .flank {list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px;min-width:0;}
.rr-roadmap-offer-desktop .flank li{flex:1;min-width:0;}
@media (max-width:1150px){
  .rr-roadmap-offer-desktop .stage{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;}
  .rr-roadmap-offer-desktop .stage .mid{grid-column:1/-1;grid-row:1;max-width:580px;justify-self:center;width:100%;}
  .rr-roadmap-offer-desktop .stage .flank{grid-row:2;}
}
@media (max-width:760px){
  .rr-roadmap-offer-desktop .tablet{aspect-ratio:auto!important;}
  .rr-roadmap-offer-desktop .tab-hero{grid-template-columns:minmax(0,1fr)!important;}
  .rr-roadmap-offer-desktop .tab-hero>div:last-child{height:200px;}
  .rr-roadmap-offer-desktop .tab-stages{grid-template-columns:minmax(0,1fr)!important;}
}
.rr-roadmap-offer-mobile{display:none;}
@media (max-width:960px){
  .rr-roadmap-offer-desktop{display:none;}
  .rr-roadmap-offer-mobile{display:block;}
  .rr-roadmap-offer-mobile .rr-roadmap-offer-artboard{
     width:100%!important; max-width:390px; margin-left:auto; margin-right:auto;
     min-height:0!important; height:auto!important;
  }
}
@media (max-width:389px){
 .rr-roadmap-offer-mobile .rr-roadmap-offer-artboard{padding-left:clamp(12px,5vw,20px)!important;padding-right:clamp(12px,5vw,20px)!important;}
 .rr-roadmap-offer-mobile .rr-roadmap-offer-artboard > header h2{font-size:clamp(26px,8.7vw,34px)!important;white-space:normal!important;}
 .rr-roadmap-offer-mobile .rr-roadmap-offer-artboard > div:nth-of-type(1) > div{max-width:100%;}
 .rr-roadmap-offer-mobile a[href="#checkout"]{font-size:clamp(10px,3.3vw,13px)!important;letter-spacing:.05em!important;}
}


/* v1.3.53 — Member-area preview interaction taken from v1.3.32.
   Only the device shells are interactive, not the feature cards or pricing. */
.rr-roadmap-offer .rr-roadmap-preview-trigger {
  cursor: pointer;
  transition: transform 170ms ease, filter 170ms ease;
  touch-action: manipulation;
}
@media (hover: hover) and (pointer: fine) {
  .rr-roadmap-offer .rr-roadmap-preview-trigger:hover {
    transform: translateY(-2px);
    filter: brightness(1.012);
  }
}
@media (hover: none), (pointer: coarse) {
  .rr-roadmap-offer .rr-roadmap-preview-trigger:active {
    transform: translateY(-2px) scale(1.003);
    filter: brightness(1.012);
  }
}
.rr-roadmap-offer .rr-roadmap-preview-trigger:focus-visible {
  outline: 2px solid #A9CDF0;
  outline-offset: 7px;
  border-radius: 18px;
}
/* v1.3.54 — Member-area preview dialog, matched to the current
   Hanken Grotesk / navy / white landing-page visual system.
   Only the modal appearance changes; triggers, text and purchase behavior
   remain unchanged from v1.3.53. */
html.rr-member-preview-modal-open,
body.rr-member-preview-modal-open {
  overflow: hidden;
}

.rr-member-preview-modal,
.rr-member-preview-modal *,
.rr-member-preview-modal *::before,
.rr-member-preview-modal *::after {
  box-sizing: border-box;
}

.rr-member-preview-modal {
  position: fixed;
  z-index: 10000;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 180ms ease, visibility 180ms ease;
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
}
.rr-member-preview-modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.rr-member-preview-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15,31,48,.66);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}
.rr-member-preview-modal__dialog {
  position: relative;
  z-index: 1;
  width: min(525px, 100%);
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
  padding: 46px 40px 34px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 30px;
  background: #375A7C;
  color: #FFFFFF;
  box-shadow: 0 32px 90px rgba(4,17,28,.27);
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
  outline: none;
  transform: translateY(10px);
  transition: transform 220ms cubic-bezier(.16,1,.3,1);
}
.rr-member-preview-modal.is-open .rr-member-preview-modal__dialog {
  transform: translateY(0);
}
.rr-member-preview-modal__close {
  position: absolute;
  top: 15px;
  right: 16px;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(255,255,255,.20);
  border-radius: 50%;
  background: rgba(255,255,255,.10);
  color: #FFFFFF;
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
  font-size: 25px;
  font-weight: 300;
  line-height: 1;
  cursor: pointer;
}
.rr-member-preview-modal__close:hover {
  background: rgba(255,255,255,.20);
}
.rr-member-preview-modal__eyebrow {
  margin: 0 45px 17px 0;
  color: #DCE8F2;
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
  font-size: 11px;
  line-height: 1.4;
  font-weight: 600;
  letter-spacing: .10em;
  text-transform: uppercase;
}
.rr-member-preview-modal__eyebrow::after { display: none; }
.rr-member-preview-modal__dialog h2 {
  max-width: 450px;
  margin: 0;
  padding-right: 15px;
  color: #FFFFFF;
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
  font-size: clamp(32px, 3vw, 40px);
  line-height: 1.09;
  font-weight: 300;
  letter-spacing: -.04em;
}
.rr-member-preview-modal__dialog p {
  max-width: 440px;
  margin: 18px 0 0;
  color: #DCE8F2;
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
  font-size: 17px;
  line-height: 1.5;
  font-weight: 400;
  letter-spacing: 0;
}
.rr-member-preview-modal__cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  width: 100%;
  min-width: 0;
  min-height: 58px;
  margin-top: 28px;
  padding: 9px 10px 9px 17px;
  border: none;
  border-radius: 15px;
  background: #FFFFFF;
  color: #375A7C;
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .045em;
  text-transform: uppercase;
  text-decoration: none;
  box-shadow: none;
  transition: background-color 150ms ease;
}
.rr-member-preview-modal__cta:hover,
.rr-member-preview-modal__cta:visited:hover {
  background: #F1F6FA;
  color: #2E4F70;
  transform: none;
  filter: none;
}
.rr-member-preview-modal__cta:visited { color: #375A7C; }
.rr-member-preview-modal__cta span:first-child { min-width: 0; }
.rr-member-preview-modal__cta span:last-child {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  border-radius: 50%;
  background: #375A7C;
  color: #FFFFFF;
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1;
  transform: none;
}
.rr-member-preview-modal__close:focus-visible,
.rr-member-preview-modal__cta:focus-visible {
  outline: 3px solid #9CC9EB;
  outline-offset: 3px;
}
@media (max-width: 600px) {
  .rr-member-preview-modal { padding: 14px; }
  .rr-member-preview-modal__dialog {
    border-radius: 24px;
    padding: 42px 22px 27px;
  }
  .rr-member-preview-modal__eyebrow {
    margin-bottom: 14px;
    font-size: 10px;
  }
  .rr-member-preview-modal__dialog h2 {
    font-size: clamp(29px, 8.5vw, 37px);
    line-height: 1.1;
  }
  .rr-member-preview-modal__dialog p {
    margin-top: 17px;
    font-size: 15.5px;
    line-height: 1.48;
  }
  .rr-member-preview-modal__cta {
    margin-top: 23px;
    padding-left: 13px;
    font-size: 11px;
    letter-spacing: .025em;
  }
  .rr-member-preview-modal__cta span:last-child {
    width: 33px;
    height: 33px;
    flex-basis: 33px;
  }
}
@media (max-width: 360px) {
  .rr-member-preview-modal { padding: 10px; }
  .rr-member-preview-modal__dialog { padding: 42px 16px 25px; }
  .rr-member-preview-modal__cta {
    padding-left: 10px;
    padding-right: 7px;
    font-size: 10.15px;
    letter-spacing: 0;
  }
  .rr-member-preview-modal__cta span:last-child {
    width: 31px;
    height: 31px;
    flex-basis: 31px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .rr-member-preview-modal,
  .rr-member-preview-modal__dialog,
  .rr-member-preview-modal__cta {
    transition: none;
  }
}