#main[data-page=join]{background:var(--white)}
#main[data-page=join] .hero-inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s4);align-items:center;padding-block:var(--s4)}
#main[data-page=join] .hero h1{font-size:calc(var(--fs-fig) * 1.2)!important;line-height:1.1!important;max-width:19ch;margin-bottom:var(--s2)}
#main[data-page=join] .hero .lede{font-size:var(--fs-md);max-width:60ch}
#main[data-page=join] .photo-hero{aspect-ratio:3/2}
#main[data-page=join] .hero-actions{margin-top:var(--s3)}
#main[data-page=join] .section>.container{padding-block:var(--s3);border-top:0}
#main[data-page=join] .section h2{font-size:calc(var(--fs-lg) * 1.2)!important;line-height:1.25!important;margin:0 0 var(--s2);letter-spacing:normal;max-width:32ch}
#main[data-page=join] .section h2::after{display:none}
#main[data-page=join] #why-join>.container{padding-block:var(--s2) var(--s3)}
#main[data-page=join] .membership-value-grid{margin-top:var(--s2)}
#main[data-page=join] .membership-value-grid h3{font-size:var(--fs-md)!important;line-height:1.25}
#main[data-page=join] .membership-value-grid p{font-size:var(--fs-base)}
.join-primary-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5);margin-top:var(--s3)}
.join-option h3{font-size:var(--fs-lg)!important;line-height:1.2;margin:0 0 var(--s2)}
.join-option p{font-size:var(--fs-base);margin:0 0 var(--s2)}
.join-price strong{font-size:calc(var(--fs-base) * 2);font-weight:600;line-height:1.2}
.join-price span{font-size:var(--fs-base);color:var(--text-soft)}
.join-option-lifetime>.text-link{color:var(--crimson);font-weight:600}
.join-eligibility{font-size:var(--fs-sm);margin-top:var(--s3);max-width:90ch}
.join-eligibility summary{cursor:pointer;font-weight:500;padding-block:var(--s1)}
.join-eligibility p{margin-block:var(--s2)}
.join-joint{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:var(--s4);align-items:start}
#main[data-page=join] #joint-membership>.container{padding-block:var(--s3);border-top:1px solid var(--line)}
.join-joint p{font-size:var(--fs-base);margin:0 0 var(--s2)}
.join-joint .join-joint-note{font-size:var(--fs-sm)}
.join-joint-note a{color:var(--crimson);text-decoration:underline}
#main[data-page=join] #legacy-membership{background:var(--surface-cool)}
#main[data-page=join] #legacy-membership .intro{font-size:var(--fs-base);max-width:90ch;border:0;padding-top:0}
#main[data-page=join] .membership-legacy-columns{margin-top:var(--s3)}
#main[data-page=join] .membership-legacy-columns .button{background:transparent;border:0;padding:0;color:var(--crimson);font-size:var(--fs-base);min-height:44px}
#main[data-page=join] .membership-legacy-columns .membership-legacy-price{font-size:calc(var(--fs-lg) * 1.1)}
.join-other-options article{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.5fr) minmax(0,1fr);gap:var(--s3);align-items:start;padding-block:var(--s2)}
.join-other-options h3{font-size:var(--fs-md)!important;margin:0 0 var(--s1)}
.join-other-options p{font-size:var(--fs-base);margin:0}
.join-other-price{color:var(--text-soft)}
#main[data-page=join] #friend-of-hae>.container{padding-block:var(--s3) var(--s4)}
#main[data-page=join] #friend-of-hae p{font-size:var(--fs-base);max-width:85ch}
@media(max-width:700px){
 #main[data-page=join] .hero-inner,.join-primary-options,.join-joint{grid-template-columns:1fr;gap:var(--s3)}
 #main[data-page=join] .hero h1{font-size:var(--fs-fig)!important}
 .join-other-options article{grid-template-columns:1fr;gap:var(--s1)}
}

/* Regina's compact membership reference; existing site type and tokens. */
#main[data-site-preview=editorial][data-page=join] .hero .hero-copy h1{max-width:20ch!important;text-wrap:initial}
#main[data-site-preview=editorial][data-page=join] .hero>.hero-inner{border-bottom:1px solid var(--rule-neutral)}
#main[data-site-preview=editorial][data-page=join]>.section>.container{padding-block:var(--s3)!important}
#main[data-site-preview=editorial][data-page=join] .section h2{font-size:calc(var(--fs-lg) * 1.5)!important;max-width:none}
#main[data-page=join] .join-primary-options{gap:var(--s6);margin-top:var(--s2)}
#main[data-page=join] .join-option+.join-option{border-left:1px solid var(--rule-neutral);padding-left:var(--s6)}
#main[data-page=join] .join-option h3{font-size:var(--fs-lg)!important;margin-bottom:var(--s1)}
#main[data-page=join] .join-price strong{font-size:var(--fs-fig);font-weight:400}
#main[data-page=join] .join-option .button{color:var(--white);min-width:calc(var(--s6) * 2)}
#main[data-page=join] .join-eligibility{margin-top:var(--s1)}
#main[data-site-preview=editorial][data-page=join] #legacy-membership{background:var(--white)!important}
#main[data-site-preview=editorial][data-page=join] #legacy-membership>.container{background:var(--surface-sky);width:min(calc(100% - var(--s4)),calc(var(--max) + var(--s6)));padding-inline:var(--s4);padding-block:var(--s3)!important}
#main[data-page=join] .membership-legacy-columns{gap:var(--s4);margin-top:var(--s2)}
#main[data-page=join] .membership-legacy-columns>article+article{border-left:1px solid var(--rule-neutral);padding-left:var(--s4)}
#main[data-page=join] .membership-legacy-columns h3{font-size:var(--fs-lg)!important;margin-bottom:var(--s1)}
#main[data-page=join] .membership-legacy-columns .membership-legacy-price{font-size:calc(var(--fs-base) * 2);font-weight:400;margin-bottom:var(--s1)}
#main[data-page=join] .join-benefits-intro{margin-bottom:var(--s3);font-size:var(--fs-base);max-width:none}
.join-benefits-columns{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s3)}
.join-benefits-columns>article{display:flex;flex-direction:column;min-width:0}
.join-benefits-columns>article+article{border-left:1px solid var(--rule-neutral);padding-left:var(--s3)}
#main[data-page=join] .join-benefits-columns h3{font-size:var(--fs-md)!important;margin:0 0 var(--s1)}
.join-benefits-columns p{font-size:var(--fs-sm);line-height:1.5;margin:0 0 var(--s1)}
.join-benefits-columns .text-link{font-size:var(--fs-sm);margin-top:auto;align-self:flex-start}
#main[data-site-preview=editorial][data-page=join] #joint-membership>.container,#main[data-site-preview=editorial][data-page=join] #other-memberships>.container,#main[data-site-preview=editorial][data-page=join] #friend-of-hae>.container{border-top:1px solid var(--rule-neutral)!important}
.join-other-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--s4)}
#main[data-page=join] .join-other-layout .join-other-options article{grid-template-columns:minmax(0,.6fr) minmax(0,1.7fr) auto;gap:var(--s3);padding-block:var(--s2)}
.join-other-options article:first-child{padding-top:0}
.join-other-options article+article{border-top:1px solid var(--rule-neutral)}
#main[data-page=join] .join-other-options h3{font-size:var(--fs-md)!important}
.join-other-options .text-link{font-size:var(--fs-sm);align-self:center}
.join-friend-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:var(--s4)}
#main[data-page=join] .join-friend-layout p{margin:0 0 var(--s1)}
@media(max-width:900px){
 .join-benefits-columns{grid-template-columns:repeat(2,minmax(0,1fr))}
 .join-benefits-columns>article:nth-child(3){border-left:0;padding-left:0}
 .join-other-layout{grid-template-columns:1fr}
}
@media(max-width:700px){
 #main[data-page=join] .join-primary-options{gap:var(--s3)}
 #main[data-page=join] .join-option+.join-option,#main[data-page=join] .membership-legacy-columns>article+article{border:0;padding-left:0}
 .join-friend-layout{grid-template-columns:1fr;gap:var(--s2)}
 #main[data-page=join] .join-other-layout .join-other-options article{grid-template-columns:1fr;gap:var(--s1)}
 #main[data-site-preview=editorial][data-page=join] #legacy-membership>.container{width:min(calc(100% - var(--s4)),var(--max));padding-inline:var(--s2)}
}
@media(max-width:500px){
 .join-benefits-columns{grid-template-columns:1fr}
 .join-benefits-columns>article+article{border-left:0;padding-left:0}
}
#main[data-site-preview=editorial][data-page=join] .band-head{margin-bottom:var(--s1)}
#main[data-site-preview=editorial][data-page=join] .hero.hero-typographic>.hero-inner{border-bottom-color:var(--rule-neutral)}
#main[data-page=join] .join-option{display:flex;flex-direction:column;align-items:flex-start}
#main[data-page=join] .join-option>.button{margin-top:auto}
#main[data-page=join] .join-price strong,#main[data-page=join] .membership-legacy-price{color:var(--ink-neutral)}
#main[data-page=join] .membership-legacy-columns>article{display:flex;flex-direction:column;align-items:flex-start}
#main[data-page=join] .membership-legacy-columns>article>.button{margin-top:auto}
@media(max-width:900px){#main[data-site-preview=editorial][data-page=join] #legacy-membership>.container{width:calc(100% - var(--s2));padding-inline:calc(var(--gutter) - var(--s1))}}
#main[data-page=join] .membership-legacy-columns .membership-legacy-price{color:var(--ink-neutral)}
/* A little breathing room between the masthead and membership choices. */
#main[data-site-preview=editorial][data-page=join] #membership-options>.container{padding-top:calc(var(--s3) + var(--s1))!important}

#main[data-page=join] #legacy-membership .membership-legacy-lead{font-size:var(--fs-md);font-weight:500;color:var(--ink-neutral);margin:0 0 var(--s1)}
#main[data-site-preview=editorial][data-page=join] #joint-membership h2{font-size:calc(var(--fs-lg) * 1.33)!important}

/* Keep benefits on white; separate them quietly from Legacy Membership. */
main#main[data-site-preview=editorial][data-page=join] #member-benefits{background:var(--white)!important;margin-top:0}
main#main[data-site-preview=editorial][data-page=join] #member-benefits>.container{border-top:1px solid var(--crimson)!important}

/* Membership reference: benefits first, clean rules, compact supporting rows. */
main#main[data-site-preview=editorial][data-page=join] .hero>.hero-inner{border-bottom:0}
main#main[data-site-preview=editorial][data-page=join] #membership-options>.container{border-top:1px solid var(--crimson)!important}
main#main[data-page=join] .join-joint,
main#main[data-page=join] .join-other-layout,
main#main[data-page=join] .join-friend-layout{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
main#main[data-page=join] .join-joint>div+div,
main#main[data-page=join] .join-other-layout>div+div,
main#main[data-page=join] .join-friend-layout>div+div{border-left:1px solid var(--rule-neutral);padding-left:var(--s4)}
main#main[data-page=join] #legacy-membership .membership-legacy-lead{font-weight:600}
@media(max-width:700px){
 main#main[data-page=join] .join-joint,main#main[data-page=join] .join-other-layout,main#main[data-page=join] .join-friend-layout{grid-template-columns:1fr}
 main#main[data-page=join] .join-joint>div+div,main#main[data-page=join] .join-other-layout>div+div,main#main[data-page=join] .join-friend-layout>div+div{border:0;padding-left:0}
}

#main[data-page=join] .join-whatsapp-note{margin-top:var(--s3);font-size:var(--fs-sm);max-width:none}
