/* =========================================================
   RIGHT BALANCE PILATES
   REUSABLE PROMOTIONAL COMPONENT
   Fulcrum Marketing Services

   Version: 1.1

   Beaver Builder controls:
   - Background images
   - Background overlays
   - Outer layout and card dimensions

   This stylesheet controls:
   - Typography
   - Content spacing
   - Mindbody Healcode buttons
   - Responsive presentation
   - Accessibility
   ========================================================= */


/* ---------------------------------------------------------
   COMPONENT VARIABLES
   --------------------------------------------------------- */

.rbp-promo {
  --rbp-promo-text: #ffffff;
  --rbp-promo-accent: #8fc3d6;
  --rbp-promo-button-bg: #152d38;
  --rbp-promo-button-hover: #38566b;
  --rbp-promo-button-border: #8fc3d6;

  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  box-sizing: border-box;
  color: var(--rbp-promo-text);
}


/* ---------------------------------------------------------
   INNER CONTENT
   --------------------------------------------------------- */

.rbp-promo .rbp-promo__inner {
  width: 100%;
  max-width: 540px;
  margin: 0 auto;
  padding: 12px 16px;
  box-sizing: border-box;
  text-align: center;
}


/* ---------------------------------------------------------
   SCRIPT HEADING
   --------------------------------------------------------- */

.rbp-promo .rbp-promo__heading {
  margin: 0 0 10px;

  font-family: "Square Peg", cursive;
  font-size: clamp(36px, 3vw, 44px);
  font-weight: 400;
  line-height: 1.05;

  color: var(--rbp-promo-text);
  text-align: center;
  text-transform: none;
}


/* ---------------------------------------------------------
   LOCATION / AVAILABILITY
   --------------------------------------------------------- */

.rbp-promo .rbp-promo__location {
  margin: 0 0 10px;

  font-family: "Oswald", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;

  letter-spacing: 0.08em;
  text-transform: uppercase;

  color: var(--rbp-promo-text);
}


/* ---------------------------------------------------------
   MAIN OFFER
   --------------------------------------------------------- */

.rbp-promo .rbp-promo__offer {
  margin: 0 0 10px;

  font-family: "Oswald", sans-serif;
  font-size: clamp(21px, 2.4vw, 28px);
  font-weight: 400;
  line-height: 1.3;

  letter-spacing: 0.04em;
  text-transform: uppercase;

  color: var(--rbp-promo-text);
}


/* ---------------------------------------------------------
   TERMS / FINE PRINT
   --------------------------------------------------------- */

.rbp-promo .rbp-promo__terms {
  margin: 0 0 20px;

  font-family: "Oswald", sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;

  letter-spacing: 0.02em;

  color: var(--rbp-promo-text);
}

.rbp-promo .rbp-promo__terms em {
  font-style: italic;
}


/* ---------------------------------------------------------
   CTA CONTAINER
   --------------------------------------------------------- */

.rbp-promo .rbp-promo__actions {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 100%;
  margin: 0;
  padding: 0;
}

.rbp-promo .rbp-promo__actions > * {
  margin: 0 !important;
}


/* ---------------------------------------------------------
   MINDBODY HEALCODE BUTTON
   --------------------------------------------------------- */

.rbp-promo .rbp-promo__actions a.rbp-promo__button,
.rbp-promo .rbp-promo__actions a.healcode-pricing-option-text-link {
  display: inline-flex !important;

  align-items: center;
  justify-content: center;

  width: 100%;
  max-width: 300px;
  min-height: 46px;

  margin: 0 auto !important;
  padding: 12px 20px !important;

  box-sizing: border-box;

  background: var(--rbp-promo-button-bg) !important;

  border: 1px solid var(--rbp-promo-button-border) !important;
  border-radius: 16px !important;

  font-family: "Oswald", sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;

  letter-spacing: 0.06em;

  text-transform: uppercase;
  text-align: center;
  text-decoration: none !important;

  color: #ffffff !important;

  cursor: pointer;
  white-space: normal;

  transition:
    background-color 0.2s ease,
    border-color 0.2s ease;
}


/* ---------------------------------------------------------
   BUTTON HOVER
   --------------------------------------------------------- */

.rbp-promo .rbp-promo__actions a.rbp-promo__button:hover,
.rbp-promo .rbp-promo__actions a.healcode-pricing-option-text-link:hover {
  background: var(--rbp-promo-button-hover) !important;
  color: #ffffff !important;
  border-color: var(--rbp-promo-button-border) !important;
}


/* ---------------------------------------------------------
   KEYBOARD ACCESSIBILITY
   --------------------------------------------------------- */

.rbp-promo .rbp-promo__actions a:focus-visible {
  outline: 3px solid #ffffff;
  outline-offset: 3px;
}


/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media (max-width: 900px) {

  .rbp-promo .rbp-promo__inner {
    padding: 16px 14px;
  }

  .rbp-promo .rbp-promo__heading {
    font-size: 40px;
  }

  .rbp-promo .rbp-promo__offer {
    font-size: 24px;
  }

}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 768px) {

  .rbp-promo .rbp-promo__inner {
    padding: 16px 12px;
  }

  .rbp-promo .rbp-promo__heading {
    font-size: 36px;
    line-height: 1;
    margin-bottom: 14px;
  }

  .rbp-promo .rbp-promo__location {
    font-size: 13px;
    line-height: 1.4;
    letter-spacing: 0.06em;
    margin-bottom: 12px;
  }

  .rbp-promo .rbp-promo__offer {
    font-size: 22px;
    line-height: 1.25;
    margin-bottom: 10px;
  }

  .rbp-promo .rbp-promo__terms {
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 18px;
  }

  .rbp-promo .rbp-promo__actions a.rbp-promo__button,
  .rbp-promo .rbp-promo__actions a.healcode-pricing-option-text-link {
    max-width: 280px;
    min-height: 46px;
    padding: 11px 16px !important;
    font-size: 13px !important;
    letter-spacing: 0.05em;
  }

}


/* ---------------------------------------------------------
   SMALL MOBILE
   --------------------------------------------------------- */

@media (max-width: 480px) {

  .rbp-promo .rbp-promo__inner {
    padding: 14px 8px;
  }

  .rbp-promo .rbp-promo__heading {
    font-size: 34px;
    line-height: 1;
  }

  .rbp-promo .rbp-promo__offer {
    font-size: 21px;
  }

  .rbp-promo .rbp-promo__actions a.rbp-promo__button,
  .rbp-promo .rbp-promo__actions a.healcode-pricing-option-text-link {
    max-width: 270px;
    font-size: 13px !important;
  }

}


/* ---------------------------------------------------------
   REDUCED MOTION
   --------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {

  .rbp-promo .rbp-promo__actions a {
    transition: none !important;
  }

}