/* scoped: si-memberships-MembershipLaunchSection */

  .ml-section:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    width: 100%;
    padding: 64px 50px 80px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 44px;
    background: linear-gradient(2.19deg, #FFFFFF 71.1%, #999999 220.56%);
    box-sizing: border-box;
  }

  /* ── Intro ── */
  .ml-intro:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    width: 820px;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-align: center;
  }

  .ml-intro-lead:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-family: 'Afacad', sans-serif;
    font-weight: 700;
    font-size: 26px;
    line-height: 135%;
    color: #272727;
    margin: 0;
  }

  .ml-intro-text:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 160%;
    color: #272727;
    margin: 0;
  }

  /* ── Cards: reuse MembershipsCardsSection, widened for three tiers ── */
  .ml-section .ml-cards{
    width: 100%;
    padding: 0;
    gap: 0;
    background: none;
    backdrop-filter: none;
  }

  .ml-section .ml-cards .content-box{
    max-width: 1320px;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 20px;
  }

  /* Shared card is a fixed 410px; let four share the row and shrink evenly.
     Below ~1180px they fall to a 2x2 grid rather than squeezing further. */
  .ml-section .ml-cards .card{
    width: auto;
    flex: 1 1 270px;
    max-width: 410px;
    display: flex;
    flex-direction: column;
  }

  .ml-section .ml-cards .card-middle{
    flex: 1;
  }

  /* Closed-offer button keeps the card's shape without looking clickable. */
  .ml-section .ml-cards .ml-btn-closed{
    background: #D9D9E0;
    color: #6A6A75;
    cursor: not-allowed;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    line-height: 1.15;
  }

  .ml-section .ml-cards .ml-btn-note{
    font-style: normal;
    font-weight: 400;
    font-size: 10px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #8A8A95;
  }

  .ml-live-flag:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    color: #157A3C;
    margin: 6px 0 0;
  }

  .ml-offday:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 13px;
    line-height: 155%;
    color: #FFFFFF;
    margin: 6px 0 0;
  }

  /* ── Waitlist form ── */
  /* ── Waitlist band (sits under the cards, not inside one) ── */
  .ml-waitlist-band:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    width: 1180px;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 28px 32px 30px;
    border-radius: 10px;
    border: 1px solid #E5E5EB;
    border-left: 5px solid #D62121;
    background: #FFFFFF;
    box-shadow: 0 2px 18px rgba(0, 0, 0, 0.06);
    box-sizing: border-box;
  }

  .ml-waitlist-head:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    display: flex;
    flex-direction: column;
    gap: 6px;
  }

  .ml-waitlist-title:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-family: 'Afacad', sans-serif;
    font-weight: 700;
    font-size: 26px;
    line-height: 110%;
    text-transform: uppercase;
    color: #272727;
    margin: 0;
  }

  .ml-waitlist-sub:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 160%;
    color: #4A4A55;
    margin: 0;
  }

  .ml-waitlist:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    display: flex;
    flex-direction: column;
    gap: 14px;
  }

  /* Four across on the 1440 canvas; there is room here, unlike in a card. */
  .ml-waitlist-fields:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    display: flex;
    gap: 12px;
  }

  .ml-waitlist-input:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    flex: 1 1 0;
    min-width: 0;
    box-sizing: border-box;
    height: 46px;
    padding: 0 14px;
    border: 1px solid #D8D8DE;
    border-radius: 4px;
    background: #FFFFFF;
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    color: #272727;
  }

  .ml-waitlist-input::placeholder:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    color: #8A8A95;
  }

  .ml-waitlist-input:focus:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    outline: 2px solid #D62121;
    outline-offset: 1px;
  }

  /* TCPA consent. Required before anything is submitted. */
  .ml-consent:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
  }

  .ml-consent-box:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin: 2px 0 0;
    accent-color: #D62121;
    cursor: pointer;
  }

  .ml-consent-text:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 160%;
    color: #6A6A75;
  }

  .ml-consent-text a:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    color: #D62121;
    text-decoration: underline;
    text-underline-offset: 2px;
  }

  .ml-waitlist-actions:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    display: flex;
    align-items: center;
    gap: 14px;
  }

  .ml-waitlist-btn:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    flex: 0 0 auto;
    height: 46px;
    padding: 0 28px;
    border: none;
    border-radius: 4px;
    background: linear-gradient(90deg, #D62121 0%, #701111 100%);
    box-shadow: 0 4px 20.4px rgba(214, 33, 33, 0.40);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: #FFFFFF;
    cursor: pointer;
  }

  .ml-waitlist-btn:hover:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    opacity: 0.9;
  }

  .ml-waitlist-msg:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
    line-height: 150%;
    margin: 0;
    min-height: 1px;
  }

  .ml-waitlist-msg.is-ok:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){ color: #1B7F3B; }
  .ml-waitlist-msg.is-err:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){ color: #C41E1E; }

  /* ── Includes + FAQ ── */
  .ml-includes:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *),
  .ml-faq:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    width: 900px;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }

  .ml-includes-title:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-family: 'Afacad', sans-serif;
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    text-transform: uppercase;
    text-align: center;
    color: #272727;
    margin: 0;
  }

  .ml-includes-underline:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    width: 60px;
    height: 4px;
    background: #D62121;
    flex-shrink: 0;
  }

  .ml-includes-list:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    width: 100%;
    margin: 8px 0 0;
    padding-left: 22px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    list-style-type: disc;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 165%;
    color: #272727;
  }

  .ml-includes-list strong:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-weight: 700;
  }

  .ml-faq-list:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 8px;
  }

  .ml-faq-item:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    background: #FFFFFF;
    border: 1px solid #E5E5EB;
    border-radius: 8px;
    padding: 16px 18px;
  }

  .ml-faq-q:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-family: 'Afacad', sans-serif;
    font-weight: 700;
    font-size: 19px;
    line-height: 120%;
    text-transform: uppercase;
    color: #272727;
    margin: 0 0 6px;
  }

  .ml-faq-a:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 165%;
    color: #272727;
    margin: 0;
  }

  .ml-fine-print:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 13px;
    line-height: 150%;
    color: #6A6A75;
    margin: 18px 0 0;
  }

  /* ── Mobile (430 canvas) ── */
  html.is-mobile .ml-section:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    padding: 44px 20px 56px;
    gap: 32px;
  }

  /* On the 430 canvas the shared card keeps its fixed 376px width and the
     row keeps a max-width, which pushed cards past the screen edge. Let the
     wrapper, the row and the cards all fill the available width instead. */
  html.is-mobile .ml-section .ml-cards,
  html.is-mobile .ml-section .ml-cards .content-box{
    width: 100%;
    max-width: 100%;
  }

  /* The shared mobile rule re-adds 60px/40px padding; the section already
     provides the gutter, so the cards get the full width. */
  html.is-mobile .ml-section .ml-cards{
    padding: 0;
  }

  html.is-mobile .ml-section .ml-cards .content-box{
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
  }

  html.is-mobile .ml-section .ml-cards .card{
    width: 100%;
    max-width: 100%;
    flex: 0 0 auto;
    /* Stacked cards do not need to match heights, so let each hug its own
       content instead of stretching to the shared 390px minimum. */
    min-height: 0;
  }

  html.is-mobile .ml-section .ml-cards .card-middle{
    flex: 0 0 auto;
  }

  html.is-mobile .ml-intro-lead:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-size: 21px;
  }

  html.is-mobile .ml-includes-title:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-size: 24px;
  }


  html.is-mobile .ml-waitlist-band:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    width: 100%;
    padding: 24px 20px 26px;
    gap: 16px;
  }

  html.is-mobile .ml-waitlist-title:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    font-size: 22px;
  }

  /* Stacked, the field row is a column flex container, where `flex: 1` applies
     to the vertical axis and would squash the inputs to nothing. */
  html.is-mobile .ml-waitlist-fields:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    flex-direction: column;
  }

  html.is-mobile .ml-waitlist-input:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    flex: 0 0 auto;
    width: 100%;
  }

  html.is-mobile .ml-waitlist-actions:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  html.is-mobile .ml-waitlist-btn:where(.si-memberships-MembershipLaunchSection, .si-memberships-MembershipLaunchSection *){
    width: 100%;
  }

  /* Four-up cards run narrower than the two-up original. */
  .ml-section .ml-cards .card-middle{
    padding: 20px 16px 10px;
  }

  .ml-section .ml-cards .price-pill{
    width: auto;
    max-width: 100%;
    white-space: nowrap;
  }

  .ml-section .ml-cards .card-buttons .btn{
    font-size: 12px;
    line-height: 1.2;
    padding: 0 8px;
    text-align: center;
  }