/* ============================================================
   MEMBERSHIP / JOIN PAGE — HERO  (matched to Figma node 4053:4)
   Applies to the .eb-join-hero block pasted into page 5,
   above the <cf_mgsubscriptionform> tag.
   Fonts (Cal Sans + Poppins) are loaded by top.cfm already.
   ============================================================ */
:root{
  --ejh-navy:#153550;
  --ejh-lightgrey:#F4F6F8;
  --ejh-green:#2FAE62;
  --ejh-black:#252525;
  --ejh-grey:#D1D5D9;
  --ejh-radius:20px;
}
/* Join page only. Live inspector: body.mgcontentpage.page-672 >
   section.mgsectioncontainer.container { background: var(--eb-navy-900) !important }
   from style.min.css, plus h1.articleheadline above section.eb-join-hero. */
html:has(.eb-join-hero),
html:has(section.eb-join-hero),
body.eb-has-join,
body.mgcontentpage:has(.eb-join-hero),
body.page-672,
body:has(.eb-join-hero),
body:has(section.eb-join-hero){
  background:#F4F6F8 !important;
}
body.eb-has-join .container-fluid,
body.page-672 .container-fluid,
body:has(.eb-join-hero) .container-fluid,
body.mgcontentpage:has(.eb-join-hero) .container-fluid,
body.eb-has-join .mgsectioncontainer,
body.eb-has-join section.mgsectioncontainer,
body.eb-has-join .mgsectioncontainer.container,
body.page-672 .mgsectioncontainer,
body.page-672 section.mgsectioncontainer,
body.page-672 .mgsectioncontainer.container,
body.mgcontentpage:has(.eb-join-hero) .mgsectioncontainer,
body.mgcontentpage:has(.eb-join-hero) .mgsectioncontainer.container,
body.mgcontentpage:has(.eb-join-hero) section.mgsectioncontainer.container,
body:has(.eb-join-hero) .mgsectioncontainer,
body:has(.eb-join-hero) section.mgsectioncontainer,
body:has(.eb-join-hero) .mgsectioncontainer.container,
body:has(.eb-join-hero) section.mgsectioncontainer.container,
body.eb-has-join main.mgcontent,
body.page-672 main.mgcontent,
body:has(.eb-join-hero) main.mgcontent,
body:has(.eb-join-hero) main.mgcontent#main,
body.mgcontentpage:has(.eb-join-hero) main.mgcontent{
  background:#F4F6F8 !important;
  color:#153550;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  padding-top:0 !important;
  float:none !important;
}
body.eb-has-join nav.left,
body:has(.eb-join-hero) nav.left,
body.eb-has-join nav.right,
body:has(.eb-join-hero) nav.right,
body.eb-has-join nav.responsive,
body:has(.eb-join-hero) nav.responsive,
body.eb-has-join .bgAttach,
body:has(.eb-join-hero) .bgAttach,
body.eb-has-join .eb-carousel,
body.eb-has-join .eb-page-hero,
body:has(.eb-join-hero) .eb-page-hero,
body.eb-has-join .bannerInfo,
body.eb-has-join #breadcrumb,
body:has(.eb-join-hero) #breadcrumb,
body.eb-has-join .mgbreadcrumb,
body:has(.eb-join-hero) .mgbreadcrumb{
  display:none !important;
}
body.eb-has-join h1.articleheadline,
body.page-672 h1.articleheadline,
body:has(.eb-join-hero) h1.articleheadline,
body:has(.eb-join-hero) .articleheadline,
body.mgcontentpage:has(.eb-join-hero) h1.articleheadline,
body.eb-has-join main.mgcontent > h1:first-child,
body:has(.eb-join-hero) main.mgcontent > h1:first-child,
body:has(.eb-join-hero) .mgcontent > h1:first-child{
  display:none !important;
}

.mgcontent .eb-join-hero,
.mgcontent section.eb-join-hero,
main.mgcontent section.eb-join-hero,
.eb-join-hero{
  width:min(1384px, calc(100% - 56px)) !important;
  max-width:1384px !important;
  min-height:606px;
  height:606px;
  margin:0 auto !important;
  background:var(--ejh-navy) !important;
  border-radius:var(--ejh-radius);
  padding:120px 24px;
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box !important;
  overflow:hidden;
}
.eb-join-hero *{ box-sizing:border-box; }
.eb-join-hero-inner{
  width:100%;
  max-width:873px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:30px;
  text-align:center;
}
.eb-join-hero h1{
  margin:0;
  font-family:'Cal Sans','Poppins',sans-serif;
  font-weight:400;
  font-size:64px;
  line-height:1.2;
  color:#fff;
}
.eb-join-hero .ejh-sub{
  margin:0;
  font-family:'Poppins',sans-serif;
  font-weight:400;
  font-size:24px;
  line-height:1.5;
  color:#fff;
  max-width:873px;
}
.eb-join-hero .ejh-actions{
  display:flex;
  gap:20px;
  justify-content:center;
  flex-wrap:wrap;
}
.eb-join-hero .ejh-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  font-family:'Poppins',sans-serif;
  font-weight:600;
  font-size:20px;
  line-height:1.5;
  text-transform:uppercase;
  text-decoration:none;
  border:1px solid transparent;
  cursor:pointer;
  transition:opacity .15s ease, background .15s ease, color .15s ease;
}
.eb-join-hero .ejh-btn-primary{ background:var(--ejh-lightgrey); color:var(--ejh-black); }
.eb-join-hero .ejh-btn-primary:hover{ opacity:.9; }
.eb-join-hero .ejh-btn-outline{ background:transparent; color:var(--ejh-green); border-color:var(--ejh-green); }
.eb-join-hero .ejh-btn-outline:hover{ background:var(--ejh-green); color:#fff; }
.eb-join-hero .ejh-fine{
  margin:0;
  font-family:'Poppins',sans-serif;
  font-weight:400;
  font-size:14px;
  line-height:1.5;
  color:var(--ejh-grey);
}

/* Homepage Membership block, scoped to Join (do not wrap Join in .eb-home). */
.eb-join-plans,
.mgcontent .eb-join-plans,
.mgcontent section.eb-join-plans,
main.mgcontent section.eb-join-plans{
  width:min(1282px, calc(100% - 56px)) !important;
  max-width:1282px !important;
  margin:0 auto !important;
  padding:40px 0 80px !important;
  box-sizing:border-box !important;
  background:transparent !important;
  color:#153550;
  font-family:Poppins,system-ui,sans-serif;
}
.eb-join-plans *{ box-sizing:border-box; }
.eb-join-plans .plans-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:24px;
  margin-bottom:40px;
}
.eb-join-plans .kicker{
  margin:0;
  font-size:24px;
  line-height:1.5;
  color:#153550;
  opacity:.75;
}
.eb-join-plans h2{
  margin:30px 0 0;
  font-family:'Cal Sans',Poppins,sans-serif !important;
  font-weight:400 !important;
  font-size:48px !important;
  line-height:1.1 !important;
  color:#153550 !important;
  text-transform:none !important;
}
.eb-join-plans .eb-toggle{
  display:flex;
  align-items:center;
  border:1px solid #153550;
  border-radius:20px;
  padding:4px;
  background:#F4F6F8;
  width:185px;
  height:41px;
  flex:none;
}
.eb-join-plans .eb-toggle button{
  flex:1;
  border:0;
  background:transparent;
  border-radius:20px;
  height:33px;
  cursor:pointer;
  color:#153550;
  font-family:Poppins,sans-serif;
  font-size:14px;
}
.eb-join-plans .eb-toggle button.is-on{
  background:#153550;
  color:#F4F6F8;
}
.eb-join-plans .plan-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:20px;
  align-items:stretch;
}
.eb-join-plans .plan{
  background:#fff;
  border:1px solid #D1D5D9;
  padding:40px;
  min-height:694px;
  display:flex;
  flex-direction:column;
  position:relative;
  color:#153550;
}
.eb-join-plans .plan.featured{
  border:2px solid #1498D5;
  box-shadow:0 50px 110px -30px rgba(21,53,80,.3);
}
.eb-join-plans .ribbon{
  position:absolute;
  top:0;
  right:0;
  background:#1498D5;
  color:#F4F6F8;
  font-size:14px;
  font-weight:700;
  padding:9px 20px;
}
.eb-join-plans .plan .tier{
  margin:0;
  opacity:.75;
  font-size:16px;
}
.eb-join-plans .plan .price{
  font-family:'Cal Sans',Poppins,sans-serif;
  font-size:32px;
  margin:10px 0 20px;
  font-feature-settings:"lnum" 1, "pnum" 1;
  color:#153550;
}
.eb-join-plans .plan hr{
  border:0;
  border-top:1px solid #D1D5D9;
  margin:0 0 24px;
}
.eb-join-plans .plan ul{
  flex:1;
  margin:0;
  padding:0 0 0 1.15em;
  list-style:disc;
  color:#153550;
}
.eb-join-plans .plan li{
  line-height:30px;
  margin:0;
  color:#153550;
}
.eb-join-plans .plan .eb-btn{
  width:100%;
  border-radius:0;
  margin-top:24px;
  font-weight:400 !important;
  text-decoration:none;
}
@media (max-width:1023px){
  .eb-join-plans,
  .mgcontent section.eb-join-plans{
    width:calc(100% - 32px) !important;
    padding:32px 0 64px !important;
  }
  .eb-join-plans .plans-head{
    flex-direction:column;
    align-items:flex-start;
  }
  .eb-join-plans h2{ font-size:clamp(32px, 6vw, 40px) !important; }
  .eb-join-plans .plan-grid{ grid-template-columns:1fr; }
  .eb-join-plans .plan{ min-height:0; padding:28px 20px; }
}
@media (max-width:1024px){
  .eb-join-hero{ padding:90px 24px; height:auto; min-height:0; }
  .eb-join-hero h1{ font-size:52px; }
}
@media (max-width:768px){
  .eb-join-hero,
  .mgcontent section.eb-join-hero{ width:calc(100% - 32px) !important; padding:56px 20px; border-radius:16px; height:auto; min-height:0; }
  .eb-join-hero-inner{ gap:22px; }
  .eb-join-hero h1{ font-size:36px; }
  .eb-join-hero .ejh-sub{ font-size:17px; }
  .eb-join-hero .ejh-actions{ flex-direction:column; align-items:stretch; width:100%; max-width:360px; }
  .eb-join-hero .ejh-btn{ font-size:16px; padding:16px; }
  .eb-join-hero .ejh-fine{ font-size:13px; }
}

.eb-visually-hidden{
  position:absolute;
  left:-999px;
  width:1px;
  height:1px;
  overflow:hidden;
}

/* Member stories — same carousel as Home */
.eb-join-stories,
.mgcontent section.eb-join-stories,
main.mgcontent section.eb-join-stories{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:80px 0 64px !important;
  overflow:hidden;
  background:transparent !important;
  color:#153550;
  font-family:Poppins,system-ui,sans-serif;
}
.eb-join-stories *{ box-sizing:border-box; }
.eb-join-stories .stories-head{
  width:min(1282px, calc(100% - 56px));
  margin:0 auto 40px;
  text-align:center;
}
.eb-join-stories .kicker{
  margin:0;
  font-size:24px;
  color:#153550;
}
.eb-join-stories h2{
  margin:30px auto 0;
  max-width:598px;
  font-family:'Cal Sans',Poppins,sans-serif !important;
  font-weight:400 !important;
  font-size:48px !important;
  line-height:1.1 !important;
  color:#153550 !important;
  text-align:center;
}
.eb-join-stories h2 span{ color:#1498D5; }
.eb-join-stories .story-viewport{
  position:relative;
  width:100%;
  height:400px;
  overflow:hidden;
  touch-action:pan-y pinch-zoom;
}
.eb-join-stories .story-track{
  position:absolute;
  top:0;
  left:0;
  display:flex;
  gap:20px;
  height:400px;
  cursor:grab;
  will-change:transform;
}
.eb-join-stories .story-track.is-dragging{ cursor:grabbing; }
.eb-join-stories .story{
  flex:0 0 386px;
  height:400px;
  background:#fff;
  border:0.5px solid #0F2A40;
  padding:32px;
  display:flex;
  flex-direction:column;
  user-select:none;
  color:#153550;
  transition:transform .3s ease, box-shadow .3s;
}
.eb-join-stories .story:hover{
  transform:translateY(-6px);
  box-shadow:0 20px 40px rgba(15,42,64,.1);
}
.eb-join-stories .stars{
  display:flex;
  gap:10px;
  margin-bottom:30px;
}
.eb-join-stories .stars img{
  width:20px;
  height:19px;
  -webkit-user-drag:none;
}
.eb-join-stories .stars i{
  display:block;
  width:20px;
  height:19px;
  background:url("../landingpage/assets/star.svg") center / contain no-repeat;
}
.eb-join-stories .story blockquote{
  margin:0;
  font-style:italic;
  font-size:21px;
  flex:1;
  color:#153550;
}
.eb-join-stories .story cite{
  font-style:normal;
  font-size:16px;
}
.eb-join-stories .story small{
  display:block;
  margin-top:3px;
  font-size:12px;
}

/* FAQ — Join Figma (not on Home) */
.eb-join-faq,
.mgcontent section.eb-join-faq,
main.mgcontent section.eb-join-faq{
  width:min(873px, calc(100% - 56px)) !important;
  max-width:873px !important;
  margin:0 auto !important;
  padding:24px 0 80px !important;
  background:transparent !important;
  color:#153550;
  font-family:Poppins,system-ui,sans-serif;
}
.eb-join-faq h2{
  margin:0 0 32px;
  text-align:center;
  font-family:'Cal Sans',Poppins,sans-serif !important;
  font-weight:400 !important;
  font-size:48px !important;
  line-height:1.1 !important;
  color:#153550 !important;
}
.eb-join-faq .faq-list{ display:flex; flex-direction:column; gap:12px; }
.eb-join-faq details{
  background:#fff;
  border:1px solid #D1D5D9;
  border-radius:8px;
  padding:0;
}
.eb-join-faq summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:20px 24px;
  cursor:pointer;
  font-weight:600;
  font-size:18px;
  color:#153550;
}
.eb-join-faq summary::-webkit-details-marker{ display:none; }
.eb-join-faq summary::after{
  content:"+";
  font-size:24px;
  font-weight:400;
  line-height:1;
  color:#153550;
  flex:none;
}
.eb-join-faq details[open] summary::after{ content:"\2212"; }
.eb-join-faq details p{
  margin:0;
  padding:0 24px 20px;
  font-size:16px;
  line-height:1.5;
  color:#153550;
  opacity:.85;
}

/* Digest — same as Home */
.eb-join-digest,
.mgcontent section.eb-join-digest,
main.mgcontent section.eb-join-digest{
  width:min(1282px, calc(100% - 56px)) !important;
  max-width:1282px !important;
  margin:0 auto 80px !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,478px);
  gap:24px;
  align-items:stretch;
  min-height:397px;
  background:transparent !important;
  color:#153550;
  font-family:Poppins,system-ui,sans-serif;
}
.eb-join-digest .digest-copy{ padding:0 40px 0 0; }
.eb-join-digest .kicker{
  margin:0 0 10px;
  font-size:24px;
  color:#153550;
}
.eb-join-digest h2{
  margin:0;
  font-family:'Cal Sans',Poppins,sans-serif !important;
  font-weight:400 !important;
  font-size:48px !important;
  line-height:1.1 !important;
  color:#153550 !important;
}
.eb-join-digest .digest-copy > p{
  margin:20px 0 0;
  font-size:24px;
  opacity:.75;
}
.eb-join-digest .digest-panel{
  position:relative;
  min-height:397px;
  color:#F4F6F8;
  padding:163px 30px 30px;
  overflow:hidden;
}
.eb-join-digest .digest-panel::before{
  content:"";
  position:absolute;
  inset:0;
  background:#153550;
}
.eb-join-digest .digest-panel img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.43;
  z-index:0;
  pointer-events:none;
}
.eb-join-digest .digest-panel > *:not(img){ position:relative; z-index:1; }
.eb-join-digest .digest-panel h3{
  margin:0;
  font-size:32px !important;
  color:#F4F6F8 !important;
  font-family:'Cal Sans',Poppins,sans-serif !important;
  font-weight:400 !important;
}
.eb-join-digest .digest-panel .sub{ margin:10px 0 20px; color:#F4F6F8; }
.eb-join-digest .digest-panel .eb-btn,
.eb-join-digest .digest-panel .eb-btn-blue{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:100%;
  border:0 !important;
  border-radius:0;
  padding:20px !important;
  background:#1498D5 !important;
  color:#F4F6F8 !important;
  font-family:Poppins,sans-serif !important;
  font-weight:600 !important;
  font-size:20px !important;
  line-height:30px !important;
  text-decoration:none !important;
  cursor:pointer;
}
.eb-join-digest .digest-panel .eb-btn:hover{ background:#0f86be !important; }
.eb-join-digest .digest-panel .fine{ margin-top:10px; font-size:14px; color:#F4F6F8; }
.eb-join-digest .eb-digest-form input[type="email"]{
  display:none;
  width:100%;
  margin:0 0 12px;
  padding:14px;
  border:0;
}
.eb-join-digest .eb-digest-form input[type="email"].is-open{ display:block; }
.eb-join-subscribe-slot{
  width:min(1282px, calc(100% - 56px));
  margin:0 auto 24px;
  padding:28px 24px;
  border:1px dashed #D1D5D9;
  color:#153550;
  text-align:center;
  font-family:Poppins,system-ui,sans-serif;
}
.eb-join-subscribe-slot p{ margin:0; opacity:.75; }
@media (max-width:1023px){
  .eb-join-stories h2,
  .eb-join-faq h2,
  .eb-join-digest h2{ font-size:clamp(32px, 6vw, 40px) !important; }
  .eb-join-digest,
  .mgcontent section.eb-join-digest{
    grid-template-columns:1fr;
    width:calc(100% - 32px) !important;
  }
  .eb-join-digest .digest-copy{ padding:0; }
  .eb-join-faq,
  .mgcontent section.eb-join-faq{ width:calc(100% - 32px) !important; }
  .eb-join-stories .story{ flex-basis:min(320px, 82vw); }
}

/* ============================================================
   v54 — SECTION SPACING + CONTAINERS  (Figma node 4053:4)
   Figma tokens:  content sections = 1200px centred
                  hero            = 1384px
                  vertical gap between EVERY section = 120px
   Appended last so it overrides the earlier width/margin rules.
   Only section-level layout is touched — components untouched.
   ============================================================ */
main.mgcontent section.eb-join-plans,
main.mgcontent section.eb-join-stories,
main.mgcontent section.eb-join-faq,
main.mgcontent section.eb-join-digest,
main.mgcontent #subscribe,
main.mgcontent section.eb-join-subscribe{
  max-width:1200px !important;
  width:min(1200px, calc(100% - 48px)) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box;
}

#digest {
  margin-bottom: 100px !important;
}

/* consistent 120px gap between every section (top-margin driven) */
main.mgcontent section.eb-join-plans,
main.mgcontent section.eb-join-stories,
main.mgcontent section.eb-join-faq,
main.mgcontent section.eb-join-digest,
main.mgcontent #subscribe,
main.mgcontent section.eb-join-subscribe{
  margin-top:120px !important;
  margin-bottom:0 !important;
}
main.mgcontent section.eb-join-hero{ margin-top:40px !important; margin-bottom:0 !important; }
/* FAQ list stays ~740px wide inside its 1200 section (Figma) */
main.mgcontent section.eb-join-faq .faq-list{ max-width:740px; margin-left:auto; margin-right:auto; }

@media (max-width:768px){
  main.mgcontent section.eb-join-plans,
  main.mgcontent section.eb-join-stories,
  main.mgcontent section.eb-join-faq,
  main.mgcontent section.eb-join-digest,
  main.mgcontent #subscribe,
  main.mgcontent section.eb-join-subscribe{ margin-top:64px !important; }
  main.mgcontent section.eb-join-hero{ margin-top:24px !important; }
}

/* ============================================================
   v55 — JOIN FORM STYLING  (scoped to .eb-join-form only)
   Targets MemberGate's real subscription-form markup so it
   matches the Figma design language. Nothing here leaks to the
   same shortcode used on any other page — it needs .eb-join-form.
   Payment logic / fields / steps untouched — styling only.
   ============================================================ */
.eb-join-form{ font-family:'Poppins',sans-serif; color:#153550; }
.eb-join-form *{ box-sizing:border-box; }

/* ---- progress / stepper row ---- */
.eb-join-form #mgSubscriptionProgress{ align-items:center; margin-bottom:28px; }
.eb-join-form .mgStep{ position:relative; text-align:center; }
.eb-join-form .mgStep i{ color:#B7C0CA; transition:color .2s ease; }
.eb-join-form .mgStep.inProgress i,
.eb-join-form .mgStep.complete i{ color:#1498D5; }
/* connector line between steps */
.eb-join-form #mgSubscriptionProgress .mgStep:not(.mgStepLast)::after{
  content:""; position:absolute; top:50%; left:62%; width:76%; height:2px;
  background:#E1E7EC; transform:translateY(-50%); z-index:0;
}
.eb-join-form .mgStep.complete:not(.mgStepLast)::after{ background:#1498D5; }

/* ---- section headings ---- */
.eb-join-form h5{
  font-family:'Cal Sans','Poppins',sans-serif; font-weight:400;
  font-size:22px; color:#153550; margin:6px 0 20px;
}

/* ---- form panels as cards ---- */
.eb-join-form #mgSubscriptionForm{
  background:#fff; border:1px solid #E4E9EF; border-radius:16px;
}
.eb-join-form #mgSubscriptionPlan{ }

/* ---- inputs / selects (floating-label pattern) ---- */
.eb-join-form .form-label-group{ position:relative; margin-bottom:22px; }
.eb-join-form .form-label-group > input,
.eb-join-form .form-label-group > select,
.eb-join-form .form-label-group .iti input[type=tel]{
  width:100%; height:56px; padding:16px 14px; border:1px solid #D3DBE3;
  border-radius:10px; font-size:15px; color:#153550; background:#fff;
}
.eb-join-form .form-label-group > input:focus,
.eb-join-form .form-label-group > select:focus,
.eb-join-form .form-label-group .iti input[type=tel]:focus{
  outline:none; border-color:#1498D5; box-shadow:0 0 0 3px rgba(20,152,213,.12);
}
.eb-join-form .form-label-group > label{
  position:absolute; top:-8px; left:12px; background:#fff; padding:0 6px;
  font-size:12px; font-weight:500; color:#6B7A8A; pointer-events:none;
}
.eb-join-form .form-label-group input.error,
.eb-join-form .form-label-group select.error{ border-color:#DC3545; }
.eb-join-form .error{ color:#DC3545; font-size:12.5px; margin-top:5px; }

/* ---- plan option cards ---- */
.eb-join-form .plan-card{
  border:1.5px solid #D3DBE3; border-radius:12px; cursor:pointer; height:100%;
  transition:border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.eb-join-form .plan-card .card-body{ padding:20px; }
.eb-join-form .plan-card p{ margin:0; color:#153550; }
.eb-join-form .plan-card:hover{ border-color:#9FB0C0; }
.eb-join-form .plan-card.plan-selected{
  border-color:#2FAE62; background:#F1FBF5; box-shadow:0 0 0 1px #2FAE62 inset;
}

/* ---- bolt-on cards ---- */
.eb-join-form .bolton-card{
  border:1.5px solid #D3DBE3; border-radius:12px; overflow:hidden; cursor:pointer; height:100%;
  transition:border-color .15s ease;
}
.eb-join-form .bolton-card .card-header{
  background:#153550; color:#fff; padding:12px 16px; font-weight:600; border:0;
}
.eb-join-form .bolton-card .card-body{ padding:16px; }
.eb-join-form .bolton-card .card-body p{ margin:0; color:#4A5C6E; }
.eb-join-form .bolton-card.bolton-selected,
.eb-join-form .bolton-card.selected{ border-color:#2FAE62; }

/* ---- buttons (Continue / Go Back) ---- */
.eb-join-form .btnSubscriptionForm.buttons{
  background:#2FAE62; color:#fff; border:1px solid #2FAE62; border-radius:8px;
  padding:14px 26px; font-weight:600; font-size:14px; letter-spacing:.03em;
  text-transform:uppercase; cursor:pointer; transition:filter .15s ease;
}
.eb-join-form .btnSubscriptionForm.buttons:hover{ filter:brightness(.94); }
.eb-join-form .btnSubscriptionForm.buttons.inverse,
.eb-join-form .btnSubscriptionForm.mgSubscriptionPrev{
  background:transparent; color:#153550; border:1px solid #C6D0DA;
}

/* ---- "Your Plan" / "Today's Payment" summary ---- */
.eb-join-form #youpay{
  background:#fff; border:1px solid #E4E9EF; border-radius:16px; overflow:hidden;
}
.eb-join-form #yourplan.bg-secondary{ background:#153550 !important; }
.eb-join-form #todayspayment.bg-dark{ background:#0F2A40 !important; }
.eb-join-form #youpay .yourplanrow{ border-bottom:1px solid #EEF2F6; }

/* ---- agree checkbox ---- */
.eb-join-form .form-check-input{ width:18px; height:18px; margin-top:2px; }
.eb-join-form .agreetext p{ margin:0; font-size:14px; color:#4A5C6E; }

/* ---- fine print rows ---- */
.eb-join-form .row p{ color:#5A6B7C; }

/* ---- responsive ---- */
@media (max-width:991px){
  .eb-join-form #mgSubscriptionPlan{ margin-top:24px; }
}
