{% scope_css %}

/* =========================
   WRAPPER (alignment control)
   ========================= */
.hs-btn-swap-wrap{
  width: 100%;
  display: block;
  text-align: left;
}
.hs-btn-swap-wrap[style*="--btn-align:left"]{ text-align: left; }
.hs-btn-swap-wrap[style*="--btn-align:center"]{ text-align: center; }
.hs-btn-swap-wrap[style*="--btn-align:right"]{ text-align: right; }

/* =========================
   BUTTON BASE / FALLBACKS
   ========================= */
.hs-btn-swap{
  /* Fallbacks if inline vars ever fail */
  --btn-font: "Montserrat", Arial, sans-serif;
  --btn-font-weight: 600;
  --btn-font-size: 24px;

  --btn-padding-y: clamp(14px, 1.6vw, 25px);
  --btn-padding-x: clamp(14px, 2.2vw, 22px);
}

/* =========================
   BUTTON STYLES
   ========================= */
.hs-btn-swap,
.hs-btn-swap.cta_button{
  font-family: var(--btn-font) !important;
  font-size: var(--btn-font-size) !important;

  font-weight: var(--btn-font-weight) !important;
  font-variation-settings: "wght" var(--btn-font-weight) !important;

  padding: var(--btn-padding-y) var(--btn-padding-x) !important;
  background: var(--btn-bg) !important;

  color: var(--btn-text) !important;
  text-decoration: none !important;
  cursor: pointer;

  border: var(--btn-border-width) solid var(--btn-border) !important;
  border-radius: var(--btn-radius) !important;

  /* Auto-width by default (shrink-wrap to content) */
  width: auto !important;
  max-width: 100% !important;
  min-width: max-content;

  display: inline-grid !important;
  place-items: center !important;
  text-align: center !important;

  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

/* Remove any theme-added shadows/glow (often applied to .cta_button) */
.hs-btn-swap,
.hs-btn-swap.cta_button,
.hs-btn-swap:hover,
.hs-btn-swap:focus,
.hs-btn-swap:focus-visible,
.hs-btn-swap:active{
  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
}

/* If --btn-width is > 0, force that width */
.hs-btn-swap[style*="--btn-width: 0px"]{
  width: auto !important;
}
.hs-btn-swap:not([style*="--btn-width: 0px"]){
  width: var(--btn-width) !important;
}

/* Stack labels in same grid cell */
.hs-btn-swap__sizer,
.hs-btn-swap__text{
  grid-area: 1 / 1;

  /* inherit the computed size from the button */
  font-size: inherit !important;
  font-family: inherit !important;
  font-weight: inherit !important;
  font-variation-settings: inherit !important;

  white-space: normal !important;
  text-align: center !important;
  line-height: 1.15 !important;

  color: var(--btn-text) !important;
  transition: opacity .15s ease;
}

/* Hidden sizer controls the "max" height/width on desktop */
.hs-btn-swap__sizer{
  visibility: hidden;
  pointer-events: none;
}

/* Swap text on hover */
.hs-btn-swap__text--hover{ opacity: 0; }

.hs-btn-swap:hover,
.hs-btn-swap:focus-visible{
  background: var(--btn-bg-hover) !important;
  border-color: var(--btn-border-hover) !important;
}

.hs-btn-swap:hover .hs-btn-swap__text--default,
.hs-btn-swap:focus-visible .hs-btn-swap__text--default{
  opacity: 0;
}

.hs-btn-swap:hover .hs-btn-swap__text--hover,
.hs-btn-swap:focus-visible .hs-btn-swap__text--hover{
  opacity: 1;
}

/* Optional: press + focus */
.hs-btn-swap:active{ transform: translateY(1px); }

.hs-btn-swap:focus-visible{
  outline: 3px solid rgba(255,255,255,.45);
  outline-offset: 3px;
}

/* MOBILE: no true hover + hover label is longer (hide it) */
@media (max-width: 768px){
  .hs-btn-swap__text--hover{
    display: none !important;
    opacity: 0 !important;
  }

  .hs-btn-swap__text--default{
    opacity: 1 !important;
  }

  .hs-btn-swap__sizer{
    display: none !important;
  }
}

{% end_scope_css %}