/** Shopify CDN: Minification failed

Line 52:2 Unexpected "{"
Line 52:3 Expected identifier but found "%"
Line 53:4 Unexpected "{"
Line 53:5 Expected identifier but found "%"
Line 54:28 Unexpected "{"
Line 54:35 Expected ":"
Line 65:4 Unexpected "{"
Line 65:5 Expected identifier but found "%"
Line 66:2 Unexpected "{"
Line 66:3 Expected identifier but found "%"
... and 16 more hidden warnings

**/


/* CSS from section stylesheet tags */
.collection-products {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(500px, 1fr));
  }
.collections {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(var(--collection-card-size), 100%), 1fr));
    gap: var(--grid-gap);
  }
  .collections--compact {
    --collection-card-size: 160px;
  }
  .collections--full {
    --collection-card-size: 280px;
  }
  .collection-card {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
.content-grid__grid {
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: 480px 312px 332px 480px;
    grid-auto-rows: 480px;
  }

  @media (min-width: 750px) and (max-width: 1023px) {
    .content-grid__grid {
      grid-template-rows: 283px 184px 184px 283px;
    }
  }

  /* Per-block gradient overlays */
  {% for block in section.blocks %}
    {% if block.type == 'content_item' and block.settings.show_gradient_overlay %}
      .content-grid__item--{{ block.id }} .content-grid__item-inner::before {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 100%;
        background: linear-gradient(180deg, rgba(9, 11, 18, 0) 49.97%, #090B12 87.77%);
        z-index: 1;
        pointer-events: none;
      }
    {% endif %}
  {% endfor %}
.custom-section {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: var(--padding-top-mobile);
    padding-bottom: var(--padding-bottom-mobile);
  }
  
  @media (min-width: 750px) {
    .custom-section {
      padding-top: var(--padding-top-desktop);
      padding-bottom: var(--padding-bottom-desktop);
    }
  }
  
  .custom-section__background {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
    overflow: hidden;
  }
  
  .custom-section__background img {
    position: absolute;
    width: 100%;
    height: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  
  .custom-section__content {
    display: grid;
    grid-template-columns: var(--content-grid);
  }
  
  .custom-section__content > * {
    grid-column: 2;
  }
  
  /* Standard layout styles */
  .custom-section--standard-layout .custom-section__content {
    display: block;
  }
  
  .custom-section__content.container {
    max-width: var(--base-max-width);
    margin: 0 auto;
    padding: 0 var(--base-padding-inline);
  }
.footer {
    background: var(--c__black-900);
  }

  .footer__content {
    padding-inline: var(--base-padding-inline);
    max-width: var(--base-max-width);
    margin: auto;
    padding-block: 30px;
  }

  .footer__header {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-bottom: 30px;
  }

  .footer__newsletter {
    display: none;
  }

  .footer__links {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;
    width: 100%;
    padding-bottom: 30px;
    border-bottom: 1px solid var(--c__white);
    margin-bottom: 30px;
  }

  .footer__links-menu {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    justify-content: center;
  }

  .footer__links-menu a:not(.button),
  .footer__links-menu .gorgias-btn {
    display: inline-block;
    padding: 14px 12px;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--c__white);
    font-family: var(--font-family-heading);
  }

  .footer__links-social {
    display: flex;
    gap: 16px;
    justify-content: center;
  }

  .footer__footer {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    font-size: 0.875rem;
  }

  .footer__footer-legal {
    display: flex;
    gap: 24px;
    flex-direction: column;
    text-align: center;
  }

  .footer__footer-legal a {
    text-decoration: none;
  }

  .footer__links-menu .footer__links--cta {
    display: none;
  }

  .wessex-mint .footer__links-menu a {
    text-decoration: none;
  }

  /* Tablet styles - use desktop layout */
  @media (min-width: 750px) and (max-width: 1139px) {
    .footer__links-menu .footer__links--cta {
      display: inline-block;
    }

    .footer__content {
      padding-block: 48px;
    }

    .footer__newsletter {
      display: block;
    }

    .footer__header {
      margin-bottom: 48px;
      justify-content: space-between;
    }

    .footer__links {
      flex-direction: column;
      justify-content: space-between;
      padding-bottom: 48px;
      margin-bottom: 48px;
    }

    .footer__links-menu {
      justify-content: flex-start;
      flex-direction: row;
      gap: 2px;
    }

    .footer__links-social {
      justify-content: flex-end;
      align-self: flex-end;
    }

    .footer__footer {
      flex-direction: row;
      justify-content: space-between;
    }

    .footer__footer-legal {
      gap: 60px;
      flex-direction: row;
    }
  }

  @media (min-width: 1140px) {
    .footer__links-menu .footer__links--cta {
      display: inline-block;
    }

    .footer__content {
      padding-block: 48px;
    }

    .footer__newsletter {
      display: block;
    }

    .footer__header {
      margin-bottom: 48px;
      justify-content: space-between;
    }

    .footer__links-menu {
      gap: 16px;
    }

    .footer__links {
      flex-direction: row;
      justify-content: space-between;
      padding-bottom: 48px;
      margin-bottom: 48px;
    }

    .footer__links-menu {
      justify-content: flex-start;
      flex-direction: row;
      gap: 7px;
    }

    .footer__links-social {
      justify-content: flex-end;
    }

    .footer__footer {
      flex-direction: row;
      justify-content: space-between;
    }

    .footer__footer-legal {
      gap: 60px;
      flex-direction: row;
    }
  }

  @media (min-width: 1280px) {
    .footer__links-menu {
      gap: 16px;
    }

    .footer__links-menu a {
      padding: 14px 24px;
    }
  }
.shopify-section:has(main-header) {
  position: sticky;
  top: 0;
  z-index: 100;
  background-color: var(--c__black-1000);
}

  main-header {
    width: 100%;
    display: block;
  }

  .header {
    padding-inline: var(--base-padding-inline);
    max-width: var(--base-max-width);
    margin: auto;
    padding-block: 22px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    position: relative;
  }

  .header__nav--desktop {
    display: none;
  }

  .header__actions {
    display: flex;
    align-items: center;
    gap: 0px;

    @media (min-width: 750px) {
      gap: 10px;
    }
   }

  .header__left {
    display: flex;
    gap: 10px;
    align-items: center;
  }

  .header__action.button {
    display: none;
  }

  .header__logo-link {
    width: 140px;
  }

  .mobile-menu {
    max-width: 350px;
    position: fixed;
    top: 0;
    left: 0;
    height: 100dvh;
    width: 100%;
    background: var(--c__black-1000);
    z-index: 100;

    display: flex;
    flex-direction: column;

    transform: translateX(-100%);
    transition: transform 0.3s ease-in-out;
  }

  .mobile-menu.is-open {
    transform: translateX(0);
  }

  .mobile-menu__backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
  }

  .mobile-menu__backdrop.is-open {
    opacity: 1;
    visibility: visible;
  }

  .mobile-menu__header {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;

    background: var(--c__black-900);
    padding-top: 60px;
    padding-bottom: 20px;
    padding-inline: var(--base-padding-inline);
  }

  .mobile-menu__close {
    position: absolute;
    left: 20px;
    top: 60px;
  }

  .mobile-menu__header .button {
    padding-block: 14px;
  }

  .mobile-menu__nav {
    display: flex;
    flex-direction: column;
    padding: 32px 20px;
    gap: 16px;
  }

  .mobile-menu__nav-link {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #A0ABD133;
    border-radius: var(--border-radius-xs);
    padding: 12px;
    color: var(--c__white);
    font-family: var(--font-family-heading);
    font-size: 1rem;
  }

  .mobile-menu__footer {
    margin-top: auto;
    width: 100%;
    padding-inline: var(--base-padding-inline);
    padding-bottom: 30px;
  }

  .mobile-menu__footer .button {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    font-weight: 400;
  }

  .header__action--account {
    display: none;
  }

  .header__action--cart {
    position: relative;
    padding: 6px;
    margin-right: 0;

    :is(svg) {
      width: 24px;
      height: 24px;

      @media (min-width: 750px) {
        width: 28px;
        height: 28px;
        margin-right: 6px;
      }
    }
  }

  .header__cart-counter {
    position: absolute;
    top: 0px;
    right: 0px;
    background: #4557a3;
    color: var(--c__white);
    font-size: clamp(7px, 0.75rem, 10px);
    font-weight: 600;
    border-radius: 50%;
    padding: 4px;
    height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    @media (min-width: 750px) {
      top: 1px;
      right: 4px;
    }
  }


   /* Tablet-specific styles */
    @media (min-width: 750px) and (max-width: 950px) {

      .header {
      padding-block: 30px;
    }

    .header__action--account {
      display: block;
    }

    .mobile-menu-toggle {
      display: none;
    }

    .header__nav--desktop {
      display: flex;
      align-items: center;
      gap: 16px;
      position: static;
      left: auto;
      transform: none;
      white-space: nowrap;
      justify-content: center;
    }

    .header__logo-link {
      width: 180px;
      height: auto;
    }

    .header__action.button {
      display: block;
      white-space: nowrap;
    }

    .header__actions {
      gap: 10px;
    }
    
  }

    @media (min-width: 951px) {
    .header {
      padding-block: 30px;
    }

    .header__action--account {
      display: block;
    }

    .mobile-menu-toggle {
      display: none;
    }

    .header__nav--desktop {
      display: flex;
      align-items: center;
      gap: 40px;

      position: absolute;
      left: 50%;
      transform: translateX(-50%);
    }

    .header__logo-link {
      width: 180px;
      height: auto;
    }

    .header__action.button {
      display: block;
    }
  }
.welcome {
    display: grid;
    grid-template-columns: var(--content-grid);
    background-color: #f6f6f7;
    padding: 72px 0;
  }

  .welcome-content {
    grid-column: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    width: 100%;
    padding: 0 24px;
  }

  .welcome-description {
    max-width: 80ch;
    line-height: 1.4;
    margin-top: 1.5rem;
  }

  .icon {
    width: 300px;
  }

  .highlights {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 50px;
  }

  @media (max-width: 1100px) {
    .highlights {
      grid-template-columns: 1fr;
    }
  }

  .highlight {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 24px;
    border-radius: 8px;
    background-color: #eef3ff;
    color: rgb(92, 95, 98);
    line-height: 1.4;
  }

  .highlight > * + * {
    margin-top: 1rem;
  }

  .highlight h3 {
    font-size: 1rem;
    color: rgb(32, 34, 35);
  }

  .highlight-description {
    flex: 1 1;
  }

  .highlight a {
    display: flex;
    width: fit-content;
    background-color: rgb(250, 251, 251);
    box-shadow: rgba(0, 0, 0, 0.2) 0px -3px 0px 0px inset, rgba(255, 255, 255, 0.9) 0px 2px 0px 0px inset;
    border: 1px solid rgb(140, 145, 150);
    border-radius: 4px;
    color: rgb(92, 95, 98);
    padding: 3px 10px 5px;
    text-decoration: none;
  }
.search-results {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  }
  .search-results .prev,
  .search-results .page,
  .search-results .next {
    grid-column: 1 / -1;
  }
.sbms {
      color: #ffffff;
      font-family: var(--font-primary--family);
      overflow-x: hidden;
    }

    /* Allow plans to overflow on mobile */
    @media (min-width: 750px) {
      padding: 2rem 0;
    }

    /* Allow plans to overflow on mobile */
    @media (max-width: 750px) {
      .sbms__step,
      .sbms__content,
      .sbms__selection {
        overflow-x: visible;
      }
    }

    /* Ensure all buttons inherit the correct font */
    .sbms button {
      font-family: var(--font-primary--family) !important;
    }

    .sbms__step {
      display: none;
      max-width: var(--base-max-width);
      margin: 0 auto;
       padding: 0 var(--base-padding-inline);
    }

    .sbms__step--active {
      display: block;
    }

    .sbms__star-rating {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      margin-bottom: 1.5rem;
    }

    .sbms__stars {
      display: flex;
      gap: 2px;
    }

    .sbms__stars svg {
      width: 20px;
      height: 20px;
      fill: #FFD700;
    }

    .sbms__star-rating-text {
      font-size: 1rem;
      color: #ffffff;
    }

    .sbms__benefits {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      row-gap: 4px;
      column-gap: 12px;
      margin-bottom: 1.5rem;
    }

    .sbms__benefit {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      font-size: 0.875rem;
      color: #ffffff;
    }

    .sbms__checkmark {
      flex-shrink: 0;
      width: 16px;
      height: 16px;
    }

    .sbms__plan .sbms__checkmark {
      width: 12px;
      height: 12px;
    }

    .sbms__content {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 3rem;
      align-items: start;
    }

    .sbms__product-image {
      text-align: center;
      /* background: radial-gradient(48.46% 50% at 50% 50%, #FFFFFF 0%, rgba(66, 87, 163, 0) 100%); */
    }

    .sbms__product-image img {
      max-width: 100%;
      height: auto;
      border-radius: 8px;
    }

    .sbms__product-image img:not(.sbms__step-image) {
      height: auto;
    }

    /* Crop step images to remove top/bottom spacing */
    .sbms__product-image .sbms__step-image {
      width: 100% !important;
      height: 400px !important;
      max-height: 400px !important;
      object-fit: cover !important;
      object-position: center center !important;
    }

    /* Gallery Styles */
    product-gallery,
    .sbms__gallery {
      display: block;
      width: 100%;
    }

    /* Desktop Gallery */
    .sbms__gallery-desktop {
      display: block;
    }

    .sbms__gallery-main {
      margin-bottom: 1rem;
    }

    .sbms__gallery-main-image {
      width: 100%;
      max-width: 600px;
      height: auto;
      object-fit: contain;
      border-radius: 8px;
    }

    .sbms__gallery-thumbnails {
      display: flex;
      gap: 0.5rem;
      justify-content: center;
      flex-wrap: wrap;
    }

    .sbms__gallery-thumbnail {
      width: 80px;
      height: 80px;
      padding: 0;
      border: 2px solid transparent;
      border-radius: 6px;
      overflow: hidden;
      cursor: pointer;
      background: transparent;
      transition: all 0.2s ease;
    }

    .sbms__gallery-thumbnail img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 4px;
    }

    .sbms__gallery-thumbnail:hover {
      border-color: #6aa0ff;
      transform: scale(1.05);
    }

    .sbms__gallery-thumbnail--active {
      border-color: #6aa0ff;
    }

    /* Mobile Gallery */
    .sbms__gallery-mobile {
      display: none;
      position: relative;
    }

    .sbms__gallery-mobile .splide__track {
      padding: 0;
    }

    .sbms__gallery-mobile .splide__slide {
      display: flex;
      align-items: center;
      justify-content: center;
      max-height: 210px;
    }

    .sbms__gallery-mobile .splide__slide img {
      width: 100%;
      height: auto;
      max-height: 226px;
      object-fit: contain;
      border-radius: 8px;
    }

    /* Splide Custom Styles */
    .sbms__gallery-mobile .splide__pagination {
      bottom: -1.5rem;
      position: absolute;
    }

    .sbms__gallery-mobile .splide__pagination__page {
      background: white;
      opacity: 1;
      width: 12px;
      height: 12px;
      margin: 0 0.25rem;
      transform: none;
    }

    .sbms__gallery-mobile .splide__pagination__page.is-active {
      background: var(--c__blue-900);
      transform: none;
    }

    .sbms__step-title {
      font-size: 1.875rem;
      font-weight: 700;
      margin-bottom: 10px;
      color: #ffffff;
    }

    .sbms__step-subtitle {
      font-size: 1rem;
      color: #ffffff;
      margin-bottom: 20px;
    }

    .sbms__step-subtitle:has(+ .sbms__selection-title) {
      margin-bottom: 0;
    }

    .sbms__selection-title {
      font-size: 1rem;
      color: var(--c__blue-400);
      font-weight: bold;
      margin-bottom: 20px;
      min-height: 1.5rem;
    }

    .sbms__selection-title:has(+ .sbms__selection-description:not(:empty)) {
      margin-bottom: 0;
    }

    .sbms__selection-description {
      font-size: 1rem;
      color: #ffffff;
      margin-bottom: 20px;
      min-height: 1.2rem;
    }

    .sbms__selection-description:empty {
      display: none;
      margin: 0;
      min-height: 0;
    }

    .sbms__plans {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1rem;
      margin-bottom: 0.875rem;
    }

    .sbms__plan {
      background: transparent;
      border: 1px solid #F4FAFF;
      border-radius: 8px;
      padding: 10px;
      position: relative;
      cursor: pointer;
      transition: all 0.2s ease;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
    }

    .sbms__plan:hover {
      border-color: var(--c__blue-900);
      transform: translateY(-2px);
    }

    .sbms__plan--selected {
      border-width: 3px;
      border-color: var(--c__blue-900);
      background: transparent;
    }

    .sbms__plan-badge {
      position: absolute;
      top: -12px;
      left: 50%;
      transform: translateX(-50%);
      background: var(--c__blue-900);
      color: white;
      padding: 0.25rem 0.75rem;
      border-radius: 20px;
      font-size: 0.75rem;
      font-weight: 600;
      text-align: center;
      width: max-content;
    }

    .sbms__plan-savings {
      background: #F4FAFF;
      color: var(--c__blue-900);
      padding: 2px 8px;
      border-radius: 4px;
      font-size: 0.875rem;
      font-weight: bold;
      text-align: center;
      margin-bottom: 10px;
      width: max-content;
      text-wrap: balance;
      margin-left: auto;
      margin-right: auto;
    }

    .sbms__plan-savings--placeholder {
      background: transparent;
      color: transparent;
      visibility: hidden;
    }

    .sbms__plan-header {
      text-align: center;
      margin-bottom: 0;
      padding-top: 8px;
    }

    .sbms__plan-name {
      font-size: 1.5rem;
      font-weight: 700;
      margin-bottom: 0;
      color: #ffffff;
    }

    .sbms__plan-pricing {
      display: flex;
      flex-direction: row;
      gap: 0.5rem;
      align-items: center;
      justify-content: center;
      margin-bottom: 6px;
    }

    .sbms__plan-quantity {
      font-size: 1rem;
      font-weight: bold;
      color: #ffffff;
    }

    .sbms__plan-price {
      font-size: 0.875rem;
      font-weight: normal;
      color: #ffffff;
    }

    .sbms__plan-features {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .sbms__plan-feature {
      display: flex;
      align-items: flex-start;
      gap: 2px;
      font-size: 0.85rem;
      color: #ffffff;
      min-height: 14px;
      line-height: 1;
    }

    .sbms__plan-feature .text-highlight {
      color: var(--c__blue-400);
    }

    .sbms__plan-feature .sbms__checkmark--highlighted path {
      stroke: #a0abd1;
    }

    .sbms__compare-link {
      text-align: center;
      margin-bottom: 15px;
    }

    .sbms__compare-toggle {
      color: var(--c__blue-400);
      text-decoration: underline;
      font-size: 0.9rem;
      background: none;
      border: none;
      cursor: pointer;
      padding: 0;
      font-family: inherit;
    }

    .sbms__compare-toggle:hover {
      text-decoration: underline;
    }

    /* Compare Modal Styles */
    .sbms__compare-modal {
      position: fixed;
      inset: 0;
      z-index: 999999;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }

    .sbms__compare-modal[hidden] {
      display: none;
    }

    .sbms__compare-modal__overlay {
      position: fixed;
      inset: 0;
      background-color: rgba(0, 0, 0, 0.5);
      backdrop-filter: blur(4px);
    }

    .sbms__compare-modal__content {
      position: relative;
      background-color: white;
      border-radius: 1.5rem;
      padding: 5rem 1.25rem 2rem;
      max-width: 800px;
      width: 100%;
      max-height: 90vh;
      display: flex;
      flex-direction: column;
      box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    }

    .sbms__compare-modal__header {
      position: sticky;
      top: -5rem;
      background: white;
      padding-bottom: 1.5rem;
      margin-bottom: 0;
      z-index: 1;
    }

    .sbms__compare-modal__close {
      position: absolute;
      top: -50px;
      right: 0;
      background: none;
      border: none;
      padding: 0;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 1.5rem;
      height: 1.5rem;
      transition: opacity 0.2s ease;
    }

    .sbms__compare-modal__close:hover {
      opacity: 0.7;
    }

    .sbms__compare-modal__close:focus {
      outline: 2px solid var(--c__blue-900);
      outline-offset: 2px;
      border-radius: 4px;
    }

    .sbms__compare-modal__title {
      font-size: 1.35rem;
      font-weight: 700;
      margin: 0 0 1.5rem 0;
      color: #191818;
      text-align: center;
      line-height: 1.2;
    }

    .sbms__compare-modal__plans {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1rem;
      text-align: center;
    }

    .sbms__compare-modal__plan-header {
      font-size: 1.125rem;
      font-weight: 600;
      color: #191818;
    }

    .sbms__compare-modal__body {
      overflow-y: auto;
      flex: 1;
      scrollbar-width: thin;
      scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
    }

    /* Webkit scrollbar styling */
    .sbms__compare-modal__body::-webkit-scrollbar {
      width: 6px;
    }

    .sbms__compare-modal__body::-webkit-scrollbar-track {
      background: transparent;
    }

    .sbms__compare-modal__body::-webkit-scrollbar-thumb {
      background-color: rgba(0, 0, 0, 0.2);
      border-radius: 3px;
    }

    .sbms__compare-modal__body::-webkit-scrollbar-thumb:hover {
      background-color: rgba(0, 0, 0, 0.3);
    }

    .sbms__compare-modal__item {
      padding-bottom: 1.5rem;
      margin-bottom: 1.5rem;
      border-bottom: 1px solid #CFCFD0;
      text-align: center;
    }

    .sbms__compare-modal__item:last-child {
      margin-bottom: 0;
    }

    .sbms__compare-modal__item-title {
      font-size: 1.125rem;
      font-weight: 600;
      color: #191818;
      margin: 0 0 0.625rem 0;
    }

    .sbms__compare-modal__item-description {
      font-size: 1rem;
      color: #191818;
      margin-bottom: 1.5rem;
      line-height: 1.5;
    }

    .sbms__compare-modal__item-description p {
      margin: 0;
    }

    .sbms__compare-modal__item-description p + p {
      margin-top: 0.625rem;
    }

    .sbms__compare-modal__item-plans {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1rem;
    }

    .sbms__compare-modal__item-plan {
      display: flex;
      justify-content: center;
      align-items: center;
    }

    @media screen and (min-width: 750px) {
      .sbms__compare-modal__content {
        padding: 3rem;
      }

      .sbms__compare-modal__header {
        top: -3rem;
      }

      .sbms__compare-modal__close {
        top: 0;
        right: 0;
      }

      .sbms__price-lock-options {
        padding-inline: 36px;
      }

    }

    /* Price Lock Info Modal Styles */
    .sbms__price-lock-modal {
      position: fixed;
      inset: 0;
      z-index: 999999;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }

    .sbms__price-lock-modal[hidden] {
      display: none;
    }

    .sbms__price-lock-modal__overlay {
      position: fixed;
      inset: 0;
      background-color: rgba(0, 0, 0, 0.5);
      backdrop-filter: blur(4px);
    }

    .sbms__price-lock-modal__content {
      position: relative;
      background-color: white;
      border-radius: 1rem;
      gap: 1.5rem;
      padding: 3rem;
      width: 786px;
      max-width: 100%;
      display: flex;
      flex-direction: column;
    }

    .sbms__price-lock-modal__header {
      position: sticky;
      top: -3rem;
      background: white;
      margin-bottom: 0;
      z-index: 1;
    }

    .sbms__price-lock-modal__close {
      position: absolute;
      top: -30px;
      right: 0;
      background: none;
      border: none;
      padding: 0;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 1.5rem;
      height: 1.5rem;
      transition: opacity 0.2s ease;
    }

    .sbms__price-lock-modal__close:hover {
      opacity: 0.7;
    }

    .sbms__price-lock-modal__close:focus {
      outline: 2px solid var(--c__blue-900);
      outline-offset: 2px;
      border-radius: 4px;
    }

    .sbms__price-lock-modal__title {
      font-size: 1.5rem;
      font-weight: 700;
      margin: 0 0 1.5rem 0;
      color: #191818;
      text-align: center;
      line-height: 1.2;
    }

    .sbms__price-lock-modal__body {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
    }

    .sbms__price-lock-modal__content-text {
      font-size: 1.125rem;
      line-height: 1.6;
      color: #191818;
      max-width: 500px;
    }

    .sbms__price-lock-modal__content-text p {
      margin: 0 0 1rem 0;
    }

    .sbms__price-lock-modal__content-text p:last-child {
      margin-bottom: 0;
    }

    .sbms__price-lock-modal__content-text h1,
    .sbms__price-lock-modal__content-text h2,
    .sbms__price-lock-modal__content-text h3,
    .sbms__price-lock-modal__content-text h4,
    .sbms__price-lock-modal__content-text h5,
    .sbms__price-lock-modal__content-text h6 {
      margin: 0 0 1rem 0;
      color: #191818;
    }

    .sbms__price-lock-modal__content-text ul,
    .sbms__price-lock-modal__content-text ol {
      margin: 0 0 1rem 0;
      padding-left: 1.5rem;
    }

    .sbms__price-lock-modal__content-text li {
      margin-bottom: 0.5rem;
    }

    .sbms__price-lock-modal__content-text a {
      color: var(--c__blue-900);
      text-decoration: underline;
    }

    .sbms__price-lock-modal__content-text a:hover {
      opacity: 0.8;
    }

    .sbms__price-lock-modal__content-text strong {
      font-weight: 700;
    }

    .sbms__price-lock-modal__content-text em {
      font-style: italic;
    }

    @media screen and (min-width: 750px) {
      .sbms__price-lock-modal__content {
        padding: 3rem;
      }

      .sbms__price-lock-modal__header {
        top: -3rem;
      }

      .sbms__price-lock-modal__close {
        top: 0;
        right: 0;
      }
    }

    .sbms__price-lock-info-link {
      text-align: center;
      margin-bottom: 15px;
    }

    .sbms__price-lock-info-toggle {
      color: var(--c__blue-400);
      text-decoration: underline;
      font-size: 0.9rem;
    }

    .sbms__price-lock-info-toggle:hover {
      text-decoration: underline;
    }

    .sbms__pricing {
      text-align: center;
      margin-bottom: 1.275rem;
    }

    .sbms__price-display {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 1rem;
    }

    .sbms__price-old {
      text-decoration: line-through;
      color: #A0A0A0;
      font-size: 1.5rem;
    }

    .sbms__price-new {
      font-size: 2.5rem;
      font-weight: 700;
      color: #ffffff;
    }

    .sbms__price-badge {
      background: #F4FAFF;
      color: var(--c__blue-900);
      padding: 2px 8px;
      border-radius: 4px;
      font-size: 0.875rem;
      font-weight: bold;
    }

    .sbms__price-disclaimer {
      font-size: 1rem;
      color: #ffffff;
    }

    .sbms__continue-btn {
      background: var(--c__blue-900);
      color: white;
      border: none;
      padding: 1rem 2rem;
      border-radius: 8px;
      font-size: 1.1rem;
      font-weight: 600;
      font-family: var(--font-primary--family) !important;
      cursor: pointer;
      transition: all 0.2s ease;
      display: block;
      margin: 0 auto;
      min-width: 250px;
    }

    .sbms__button-group .sbms__continue-btn {
      flex: 1;
      margin: 0;
    }

    .sbms__continue-btn:hover {
      background: var(--c__blue-900);
      opacity: 0.9;
      transform: translateY(-1px);
    }

    .sbms__designs {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 0.75rem;
      margin-bottom: 1rem;
    }

    .sbms__design {
      background: transparent;
      border: 1px solid white;
      border-radius: 8px;
      height: 68px;
      cursor: pointer;
      transition: all 0.2s ease;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 8px;
      position: relative;
    }

    .sbms__design:hover {
      border-color: var(--c__blue-900);
      transform: translateY(-1px);
    }

    .sbms__design--selected {
      border: 3px solid var(--c__blue-900);
    }

    .sbms__design img {
      max-width: 100%;
      max-height: 100%;
      height: auto;
      width: auto;
      object-fit: contain;
    }

    .sbms__design-title {
      display: none;
    }

    .sbms__step-actions {
      display: flex;
      justify-content: space-between;
      gap: 1rem;
    }

    .sbms__btn {
      padding: 0.75rem 1.5rem;
      border: none;
      border-radius: 6px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.2s ease;
    }

    .sbms__btn--primary {
      background: #6aa0ff;
      color: white;
    }

    .sbms__btn--primary:hover {
      background: #5b8fd8;
    }

    .sbms__btn--secondary {
      background: #374151;
      color: white;
    }

    .sbms__btn--secondary:hover {
      background: #4b5563;
    }

    .sbms__price-lock-options {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
      margin-top: 20px;
      margin-bottom: 2rem;
    }

    .sbms__price-lock-option {
      aspect-ratio: 1 / 1;
      border-radius: 8px;
      background: transparent;
      border: 1px solid white;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: all 0.2s ease;
      padding: 1rem;
    }

    .sbms__price-lock-option span {
      font-size: 18px;
      font-weight: bold;
      color: white;
      text-align: center;
    }

    .sbms__price-lock-option:hover {
      transform: translateY(-2px);
    }

    .sbms__price-lock-option--selected {
      border: 3px solid var(--c__blue-900);
    }



    /* Mobile responsiveness */
    @media (max-width: 750px) {
      .sbms__content {
        grid-template-columns: 1fr;
        gap: 1rem;
        max-width: 100%;
        overflow: hidden;
      }

      /* Extra spacing for step 1 mobile to accommodate gallery pagination dots */
      [data-step="1"] .sbms__content {
        gap: 1rem;
      }

      .sbms__selection {
        max-width: 100%;
        overflow: hidden;
      }

      .sbms__benefits {
        display: none;
      }

      .sbms__step-title {
        font-size: 1rem;
        margin-bottom: 2px;
        font-weight: 600;
      }

      .sbms__step-subtitle {
        margin-bottom: 14px;
        font-size: 0.875rem;
      }

      .sbms__compare-link {
        margin-bottom: 15px;
      }

      .sbms__price-lock-info-link {
        margin-bottom: 15px;
      }

      .sbms__star-rating-text {
        font-size: 0.875rem;
      }

      .sbms__star-rating {
        margin-bottom: 0.875rem;
      }

      .sbms__plan-header {
        padding-top: 4px;
      }

      .sbms__continue-btn {
        width: 100%;
      }

      .sbms__plans {
        display: flex;
        gap: 7px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 12px 0;
        max-width: none;
        margin-bottom: 0px;
        width: calc(100% + 2 * var(--base-padding-inline));
        margin-left: calc(-1 * var(--base-padding-inline));
        padding-left: var(--base-padding-inline);
        padding-right: var(--base-padding-inline);
      }

      .sbms__pricing {
        margin-bottom: 1rem;
      }

      .sbms__price-display {
        margin-bottom: 0px;
        height: 36px;
      }

      .sbms__plans::-webkit-scrollbar {
        display: none;
      }

      .sbms__plan {
        padding: 12px;
        flex: 0 0 53%;
        scroll-snap-align: center;
      }

      .sbms__plan-pricing {
        margin-bottom: 0;
      }

      .sbms__plan-savings {
        margin-bottom: 0px;
      }

      .sbms__price-new {
        font-size: 2.25rem;
      }

      .sbms__price-disclaimer {
        font-size: 0.875rem;
      }

      .sbms__designs {
        grid-template-columns: repeat(4, 1fr);
        gap: 0.5rem;
      }
            .sbms__design img {
          width: 38px;
          height: 40px;
}
      .sbms__design {
        height: auto;
        aspect-ratio: 83 / 60;
        padding: 8px;
      }

      /* Step image mobile adjustments */
      .sbms__product-image .sbms__step-image {
        height: 226px !important;
        max-height: 226px !important;
      }

      /* Gallery Mobile Styles */
      .sbms__gallery-desktop {
        display: none;
      }

      .sbms__gallery-mobile {
        display: block;
        padding-bottom: 2rem;
      }
    }

    /* Step 4 specific styles */
    .sbms__button-group {
      display: flex;
      gap: 1rem;
      margin-bottom: 2rem;
      justify-content: center;
    }

    .sbms__back-btn {
      background: transparent;
      border: 2px solid var(--c__blue-900);
      color: var(--c__blue-900);
      padding: 0.75rem 2rem;
      border-radius: 8px;
      font-size: 1.1rem;
      font-weight: 600;
      font-family: var(--font-primary--family) !important;
      cursor: pointer;
      transition: all 0.2s ease;
      flex: 1;
    }

    .sbms__back-btn:hover {
      background: var(--c__blue-900);
      color: white;
      transform: translateY(-1px);
    }

    .sbms__payment-plans {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
      margin-bottom: 2rem;
    }

    .sbms__payment-plan {
      background: transparent;
      border: 1px solid #F4FAFF;
      border-radius: 8px;
      padding: 1.5rem;
      cursor: pointer;
      transition: all 0.2s ease;
      text-align: left;
      position: relative;
      display: flex;
      flex-direction: column;
    }

    .sbms__payment-plan-content {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }

    .sbms__payment-plan .sbms__plan-features {
      margin-top: auto;
    }

    .sbms__payment-plan-title {
      margin-top: auto;
    }

    .sbms__payment-plan:hover {
      border-color: var(--c__blue-900);
      transform: translateY(-2px);
    }

    .sbms__payment-plan--selected {
      border-width: 3px;
      border-color: var(--c__blue-900);
    }

    .sbms__payment-plan-badge {
      position: absolute;
      top: -12px;
      left: 50%;
      transform: translateX(-50%);
      background: var(--c__blue-900);
      color: white;
      padding: 0.25rem 0.75rem;
      border-radius: 20px;
      font-size: 0.75rem;
      font-weight: 600;
      text-align: center;
      white-space: normal;
      max-width: 90%;
    }

    .sbms__payment-plan-title {
      font-size: 1.5rem;
      font-weight: 700;
      color: #ffffff;
      margin-bottom: 0.5rem;
    }

    .sbms__payment-plan-price {
      font-size: 2rem;
      font-weight: 700;
      color: #ffffff;
      margin-bottom: 0.25rem;
    }

    .sbms__payment-plan-frequency {
      font-size: 0.75rem;
      font-weight: 400;
      opacity: 0.8;
    }

    .sbms__payment-plan-details {
      font-size: 0.875rem;
      color: #ffffff;
      line-height: 1.4;
    }

    .sbms__payment-plan-subtitle {
      font-size: 0.875rem;
      color: #ffffff;
      opacity: 0.8;
      margin-bottom: 1rem;
    }

    @media (max-width: 750px) {
      .sbms__button-group {
        display: flex;
        gap: 0.5rem;
      }

      .sbms__back-btn,
      .sbms__button-group .sbms__continue-btn {
        flex: 1;
        width: auto;
        padding: 0.75rem 1rem;
      }

      .sbms__payment-plans {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
      }

      .sbms__payment-plan {
        padding: 0.75rem;
        min-width: 0; /* Prevent grid blowout */
      }

      .sbms__payment-plan-title {
        font-size: 1.125rem;
        word-break: break-word;
      }

      .sbms__payment-plan-subtitle {
        font-size: 0.75rem;
        word-break: break-word;
      }

      .sbms__plan-features {
        font-size: 0.75rem;
        gap: 2px;
      }

      .sbms__plan-feature span {
        word-break: break-word;
      }

      .sbms__plan-savings {
        font-size: 0.75rem;
        padding: 2px 4px;
        max-width: 160px;
        width: auto;
      }

      .sbms__payment-plan-content {
        justify-content: flex-end;
      }
    }

    /* Third plan badge background color - all breakpoints */
    .sbms__plans > div:nth-child(3) > .sbms__plan-badge {
      background-color: #7A89BF;
    }

    /* Tablet styles */
    @media screen and (min-width: 750px) and (max-width: 1023px) {
      .sbms__step-title {
        font-size: 1.15rem;
      }

      .sbms__benefit {
        font-size: 0.625rem;
        gap: 4px;
      }

      .sbms__benefits {
        column-gap: 6px;
      }

      .sbms__plan-feature {
        font-size: 0.5625rem;
        line-height: 1.2;
      }

      .sbms__step {
        padding: 0 16px;
      }

      .sbms__content {
        gap: 30px;
      }

      .sbms__plans {
        gap: 5px;
      }

      .sbms__plan {
        padding: 5px;
      }

      .sbms__plan-features {
        gap: 0;
      }

      .sbms__plan-quantity {
        font-size: 0.625rem;
      }

      .sbms__plan-price {
        font-size: 0.625rem;
      }

      .sbms__plan-name {
        font-size: 1.25rem;
      }

      .sbms__plan-savings {
        font-size: 0.625rem;
        margin-bottom: 5px;
      }

      .sbms__plan-header {
        padding-top: 10px;
      }

      .sbms__plan-badge {
        font-size: 0.625rem;
      }

      .sbms__step-subtitle {
        font-size: 0.75rem;
      }

      .sbms__price-new {
        font-size: 1.5rem;
      }

      .sbms__price-old {
        font-size: 1rem;
      }

      .sbms__price-badge {
        font-size: 0.625rem;
      }

      .sbms__gallery-thumbnail {
        width: 48px;
        height: 48px;
      }

      .sbms__gallery-thumbnails {
        gap: 4px;
      }

      .sbms__star-rating {
        margin-bottom: 10px;
      }

      .sbms__star-rating-text {
        font-size: 0.625rem;
      }

      .sbms__price-disclaimer {
        font-size: 0.875rem;
      }

      .sbms__selection-description {
        font-size: 0.75rem;
      }

      .sbms__compare-toggle {
        font-size: 0.75rem;
      }
    }

        .sbms__gallery-mobile.splide{
      padding-bottom: 5px;
    }
.sbns {
      color: #ffffff;
      font-family: var(--font-primary--family);
      overflow-x: hidden;
    }

    .sbns__content {
      display: grid;
      grid-template-columns: 1.2fr 1fr;
      gap: 3rem;
      align-items: start;
      width: 100%;

      @media (max-width: 750px) {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
      }

      @media screen and (max-width: 750px) {
        grid-template-columns: 1fr !important;
      }

      @supports (-webkit-touch-callout: none) {
        @media (max-width: 750px) {
          grid-template-columns: 1fr !important;
          gap: 1rem !important;
        }
      }
    }

    .sbns__product-image {
      flex: 1;
    }

    .sbns__selection {
      flex: 1;
    }

    /* Design items on desktop */
    .sbns__design {
      height: auto;
      min-height: 224px !important;
      display: flex;
      flex-direction: column;

      @media (max-width: 1024px) {
        min-height: 180px !important;
      }
    }

    .sbns__design-title {
      display: flex;
      align-items: center
      justify-content: center;
      font-size: clamp(12px, 0.933vw, 14px);
      color: #ffffff;
      line-height: 1.2;
    }

    /* Allow plans to overflow on mobile */
    @media (max-width: 750px) {
      .sbns__step,
      .sbns__content,
      .sbns__selection {
        overflow-x: visible;
      }
    }

    /* Ensure all buttons inherit the correct font */
    .sbns button {
      font-family: var(--font-primary--family) !important;
    }

    .sbns__step {
      display: none;
      max-width: var(--base-max-width);
      margin: 0 auto;
      padding: 0 30px;

      @media (max-width: 850px) {
        padding: 0 10px;
      }
      @media (max-width: 750px) {
        padding: 0px;
      }
    }

    .sbns__step--active {
      display: block;
    }

    .sbns__star-rating {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      margin-bottom: 1.5rem;
    }

    .sbns__stars {
      display: flex;
      gap: 2px;
    }

    .sbns__stars svg {
      width: 20px;
      height: 20px;
      fill: #FFD700;
    }

    .sbns__star-rating-text {
      font-size: 1rem;
      color: #ffffff;
    }

    .sbns__benefits {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      row-gap: 4px;
      column-gap: 12px;
      margin-bottom: 1.5rem;
    }

    .sbns__benefit {
      display: flex;
      align-items: center;
      gap: 0.3rem;
      font-size: 0.875rem;
      color: #ffffff;
      @media (max-width: 850px) {
        font-size: 10px;
      }
    }

    .sbns__checkmark {
      flex-shrink: 0;
      width: 16px;
      height: 16px;
    }

    .sbns__plan .sbns__checkmark {
      width: 12px;
      height: 12px;
    }

    /* Removed duplicate .sbns__content definition - consolidated above */

    .sbns__product-image {
      text-align: center;
      min-width: 0;
      min-height: 400px;
      display: flex;
      align-items: center;
      justify-content: center;
      @media (max-width: 750px) {
        display: none !important;
      }
    }

    .sbns__product-image img {
      max-width: 100%;
      height: auto;
      border-radius: 8px;
    }

    .sbns__selection {
      min-width: 0;
      width: 100%;
    }

    .sbns__product-image img:not(.sbns__step-image) {
      height: 700px;

    }

    /* Crop step images to remove top/bottom spacing */
    .sbns__product-image .sbns__step-image {
      width: 100% !important;
      height: 600px !important;
      max-height: 400px !important;
      object-fit: cover !important;
      object-position: center center !important;
    }

    /* Gallery Styles */
    product-gallery,
    .sbns__gallery {
      display: block;
      width: 100%;
    }

    /* Desktop Gallery */
    .sbns__gallery-desktop {
      display: block;
    }

    .sbns__gallery-main {
      margin-bottom: 1rem;
    }

    .sbns__gallery-main-image {
      width: 100%;
      max-width: 600px;
      height: auto;
      object-fit: contain;
      border-radius: 8px;
    }

    .sbns__gallery-thumbnails {
      display: flex;
      gap: 0.5rem;
      justify-content: center;
      flex-wrap: wrap;
    }

    .sbns__gallery-thumbnail {
      width: 80px;
      height: 80px;
      padding: 0;
      border: 2px solid transparent;
      border-radius: 6px;
      overflow: hidden;
      cursor: pointer;
      background: transparent;
      transition: all 0.2s ease;
    }

    .sbns__gallery-thumbnail img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 4px;
    }

    .sbns__gallery-thumbnail:hover {
      border-color: #6aa0ff;
      transform: scale(1.05);
    }

    .sbns__gallery-thumbnail--active {
      border-color: #6aa0ff;
    }

    /* Mobile Gallery */
    .sbns__gallery-mobile {
      display: none;
      position: relative;
    }

    .sbns__gallery-mobile .splide__track {
      padding: 0;
    }

    .sbns__gallery-mobile .splide__slide {
      display: flex;
      align-items: center;
      justify-content: center;
      max-height: 210px;
    }

    .sbns__gallery-mobile .splide__slide img {
      width: 100%;
      height: auto;
      max-height: 226px;
      object-fit: contain;
      border-radius: 8px;
    }

    /* Splide Custom Styles */
    .sbns__gallery-mobile .splide__pagination {
      bottom: -1.5rem;
      position: absolute;
    }

    .sbns__gallery-mobile .splide__pagination__page {
      background: white;
      opacity: 1;
      width: 12px;
      height: 12px;
      margin: 0 0.25rem;
      transform: none;
    }

    .sbns__gallery-mobile .splide__pagination__page.is-active {
      background: var(--c__blue-900);
      transform: none;
    }

    .sbns__step-title {
      font-size: 1.875rem;
      font-weight: 700;
      margin-bottom: 6px;
      color: #ffffff;
    }

    .sbns__step-title--centered {
      text-align: center;
    }

    .sbns__step-subtitle {
      font-size: 1rem;
      color: #ffffff;
      margin-bottom: 20px;
    }

    .sbns__step-subtitle--centered {
      text-align: center;
    }

    .sbns__step-subtitle:has( + .sbns__selection-title) {
      margin-bottom: 0;
    }

    .sbns__selection-title {
      font-size: 1rem;
      color: var(--c__blue-400);
      font-weight: bold;
      margin-bottom: 20px;
      min-height: 1.5rem;
    }

    .sbns__selection-title:has( + .sbns__selection-description:not(:empty)) {
      margin-bottom: 0;
    }

    .sbns__selection-description {
      font-size: 1rem;
      color: #ffffff;
      margin-bottom: 20px;
      min-height: 1.2rem;
    }

    .sbns__selection-description:empty {
      display: none;
      margin: 0;
      min-height: 0;
    }

    .sbns__plans {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1rem;
      margin-bottom: 0.875rem;
    }

    .sbns__plan {
      background: transparent;
      border: 1px solid #F4FAFF;
      border-radius: 8px;
      padding: 10px 0 6px;
      position: relative;
      cursor: pointer;
      transition: all 0.2s ease;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
    }

    @media (hover: hover) {
      .sbns__plan:hover {
        border-color: var(--c__blue-900);
        transform: translateY(-2px);
      }
    }

    .sbns__plan--selected {
      border-width: 3px;
      border-color: var(--c__blue-900);
      background: transparent;
    }

    .sbns__plan-badge {
      position: absolute;
      top: -12px;
      left: 50%;
      transform: translateX(-50%);
      background: var(--c__blue-900);
      color: white;
      padding: 0.25rem 0.75rem;
      border-radius: 5px;
      font-size: 10px;
      font-weight: 600;
      text-align: center;
      width: max-content;
    }

    .sbns__plan-savings {
      background: #F4FAFF;
      color: var(--c__blue-900);
      padding: 2px 8px;
      border-radius: 4px;
      font-size: 12px;
      font-weight: bold;
      text-align: center;
      margin-bottom: 10px;
      width: max-content;
      text-wrap: balance;
      margin-left: auto;
      margin-right: auto;
    }

    .sbns__plan-savings--placeholder {
      background: transparent;
      color: transparent;
      visibility: hidden;
    }

    .sbns__plan-header {
      text-align: center;
      margin-bottom: 0;
      padding-top: 8px;
    }

    .sbns__plan-name {
      font-size: clamp(24px, 1.911vw, 32px);
      font-weight: 700;
      margin-bottom: 0;
      color: #ffffff;

      @media (max-width: 750px) {
        font-size: 19px;
      }
    }

    .sbns__plan-pricing {
      display: flex;
      flex-direction: row;
      gap: 0.5rem;
      align-items: center;
      justify-content: center;
      margin-bottom: 6px;
    }

    .sbns__plan-quantity {
      font-size: 1rem;
      font-weight: bold;
      color: #ffffff;
    }

    .sbns__plan-price {
      font-size: clamp(12px, 1.811vw, 16px);
      font-weight: normal;
      color: #ffffff;
    }

    .sbns__plan-features {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .sbns__plan-feature {
      display: flex;
      align-items: flex-start;
      gap: 2px;
      font-size: 0.85rem;
      color: #ffffff;
      min-height: 14px;
      line-height: 1;
    }

    .sbns__plan-feature .text-highlight {
      color: var(--c__blue-400);
    }

    .sbns__plan-feature .sbns__checkmark--highlighted path {
      stroke: #a0abd1;
    }

    .sbns__compare-link {
      text-align: center;
      margin-bottom: 15px;
    }

    .sbns__compare-toggle {
      color: var(--c__blue-400);
      text-decoration: underline;
      font-size: 0.9rem;
      background: none;
      border: none;
      cursor: pointer;
      padding: 0;
      font-family: inherit;
    }


    /* Compare Modal Styles */
    .sbns__compare-modal {
      position: fixed;
      inset: 0;
      z-index: 999999;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }

    .sbns__compare-modal[hidden] {
      display: none;
    }

    .sbns__compare-modal__overlay {
      position: fixed;
      inset: 0;
      background-color: rgba(0, 0, 0, 0.5);
      backdrop-filter: blur(4px);
    }

    .sbns__compare-modal__content {
      position: relative;
      background-color: white;
      border-radius: 1.5rem;
      padding: 5rem 1.25rem 2rem;
      max-width: 800px;
      width: 100%;
      max-height: 90vh;
      display: flex;
      flex-direction: column;
      box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1)
      , 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    }

    .sbns__compare-modal__header {
      position: sticky;
      top: -5rem;
      background: white;
      padding-bottom: 1.5rem;
      margin-bottom: 0;
      z-index: 1;
    }

    .sbns__compare-modal__close {
      position: absolute;
      top: -50px;
      right: 0;
      background: none;
      border: none;
      padding: 0;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 1.5rem;
      height: 1.5rem;
      transition: opacity 0.2s ease;
    }

    .sbns__compare-modal__close:hover {
      opacity: 0.7;
    }

    .sbns__compare-modal__close:focus {
      outline: 2px solid var(--c__blue-900);
      outline-offset: 2px;
      border-radius: 4px;
    }

    .sbns__compare-modal__title {
      font-size: 1.35rem;
      font-weight: 700;
      margin: 0 0 1.5rem;
      color: #191818;
      text-align: center;
      line-height: 1.2;
    }

    .sbns__compare-modal__plans {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1rem;
      text-align: center;
    }

    .sbns__compare-modal__plan-header {
      font-size: 1.125rem;
      font-weight: 600;
      color: #191818;
    }

    .sbns__compare-modal__body {
      overflow-y: auto;
      flex: 1;
      scrollbar-width: thin;
      scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
    }

    /* Webkit scrollbar styling */
    .sbns__compare-modal__body::-webkit-scrollbar {
      width: 6px;
    }

    .sbns__compare-modal__body::-webkit-scrollbar-track {
      background: transparent;
    }

    .sbns__compare-modal__body::-webkit-scrollbar-thumb {
      background-color: rgba(0, 0, 0, 0.2);
      border-radius: 3px;
    }

    .sbns__compare-modal__body::-webkit-scrollbar-thumb:hover {
      background-color: rgba(0, 0, 0, 0.3);
    }

    .sbns__compare-modal__item {
      padding-bottom: 1.5rem;
      margin-bottom: 1.5rem;
      border-bottom: 1px solid #CFCFD0;
      text-align: center;
    }

    .sbns__compare-modal__item:last-child {
      margin-bottom: 0;
    }

    .sbns__compare-modal__item-title {
      font-size: 1.125rem;
      font-weight: 600;
      color: #191818;
      margin: 0 0 0.625rem;
    }

    .sbns__compare-modal__item-description {
      font-size: 1rem;
      color: #191818;
      margin-bottom: 1.5rem;
      line-height: 1.5;
    }

    .sbns__compare-modal__item-description p {
      margin: 0;
    }

    .sbns__compare-modal__item-description p + p {
      margin-top: 0.625rem;
    }

    .sbns__compare-modal__item-plans {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1rem;
    }

    .sbns__compare-modal__item-plan {
      display: flex;
      justify-content: center;
      align-items: center;
    }

    @media screen and (min-width: 750px) {
      h2.sbns__step-title--centered:nth-of-type(2) {
        padding-top: 14px;
      }

      .sbns__compare-modal__content {
        padding: 3rem;
      }

      .sbns__compare-modal__header {
        top: -3rem;
      }

      .sbns__compare-modal__close {
        top: 0;
        right: 0;
      }

      .sbns__price-lock-options {
        padding-inline: 36px;
      }

    }

    /* Price Lock Info Modal Styles */
    .sbns__price-lock-modal {
      position: fixed;
      inset: 0;
      z-index: 999999;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }

    .sbns__price-lock-modal[hidden] {
      display: none;
    }

    .sbns__price-lock-modal__overlay {
      position: fixed;
      inset: 0;
      background-color: rgba(0, 0, 0, 0.5);
      backdrop-filter: blur(4px);
    }

    .sbns__price-lock-modal__content {
      position: relative;
      background-color: white;
      border-radius: 1rem;
      gap: 1.5rem;
      padding: 3rem;
      width: 786px;
      max-width: 100%;
      display: flex;
      flex-direction: column;
    }

    .sbns__price-lock-modal__header {
      position: sticky;
      top: -3rem;
      background: white;
      margin-bottom: 0;
      z-index: 1;
    }

    .sbns__price-lock-modal__close {
      position: absolute;
      top: -30px;
      right: 0;
      background: none;
      border: none;
      padding: 0;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 1.5rem;
      height: 1.5rem;
      transition: opacity 0.2s ease;
    }

    .sbns__price-lock-modal__close:hover {
      opacity: 0.7;
    }

    .sbns__price-lock-modal__close:focus {
      outline: 2px solid var(--c__blue-900);
      outline-offset: 2px;
      border-radius: 4px;
    }

    .sbns__price-lock-modal__title {
      font-size: 1.5rem;
      font-weight: 700;
      margin: 0 0 1.5rem;
      color: #191818;
      text-align: center;
      line-height: 1.2;
    }

    .sbns__price-lock-modal__body {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
    }

    .sbns__price-lock-modal__content-text {
      font-size: 1.125rem;
      line-height: 1.6;
      color: #191818;
      max-width: 500px;
    }

    .sbns__price-lock-modal__content-text p {
      margin: 0 0 1rem;
    }

    .sbns__price-lock-modal__content-text p:last-child {
      margin-bottom: 0;
    }

    .sbns__price-lock-modal__content-text h1,
    .sbns__price-lock-modal__content-text h2,
    .sbns__price-lock-modal__content-text h3,
    .sbns__price-lock-modal__content-text h4,
    .sbns__price-lock-modal__content-text h5,
    .sbns__price-lock-modal__content-text h6 {
      margin: 0 0 1rem;
      color: #191818;
    }

    .sbns__price-lock-modal__content-text ul,
    .sbns__price-lock-modal__content-text ol {
      margin: 0 0 1rem;
      padding-left: 1.5rem;
    }

    .sbns__price-lock-modal__content-text li {
      margin-bottom: 0.5rem;
    }

    .sbns__price-lock-modal__content-text a {
      color: var(--c__blue-900);
      text-decoration: underline;
    }

    .sbns__price-lock-modal__content-text a:hover {
      opacity: 0.8;
    }

    .sbns__price-lock-modal__content-text strong {
      font-weight: 700;
    }

    .sbns__price-lock-modal__content-text em {
      font-style: italic;
    }

    @media screen and (min-width: 750px) {
      .sbns__price-lock-modal__content {
        padding: 3rem;
      }

      .sbns__price-lock-modal__header {
        top: -3rem;
      }

      .sbns__price-lock-modal__close {
        top: 0;
        right: 0;
      }
    }

    .sbns__price-lock-info-link {
      text-align: center;
      margin-bottom: 15px;
    }

    .sbns__price-lock-info-toggle {
      color: var(--c__blue-400);
      text-decoration: underline;
      font-size: 0.9rem;
    }

    .sbns__price-lock-info-toggle:hover {
      text-decoration: underline;
    }

    .sbns__pricing {
      text-align: center;
      margin-bottom: 1.275rem;
    }

    .sbns__price-display {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 1rem;
    }

    .sbns__price-old {
      text-decoration: line-through;
      color: #A0A0A0;
      font-size: clamp(20px, 1.25vw, 24px);
    }

    .sbns__price-new {
      font-size: 2.5rem;
      font-weight: 700;
      color: #ffffff;
    }

    .sbns__price-badge {
      background: #F4FAFF;
      color: var(--c__blue-900);
      padding: 2px 8px;
      border-radius: 4px;
      font-size: 0.775rem;
      font-weight: bold;
    }

    .sbns__price-disclaimer {
      font-size: 1rem;
      color: #ffffff;
    }

    .sbns__continue-btn {
      background: var(--c__blue-900);
      color: white;
      border: none;
      padding: 1rem 2rem;
      border-radius: 8px;
      font-size: 1.1rem;
      font-weight: 600;
      font-family: var(--font-primary--family) !important;
      cursor: pointer;
      transition: all 0.2s ease;
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 1;
      width: 100%;
    }

    @media (min-width: 1241px) {
      .sbns__continue-btn {
        width: 100%;
        max-width: none;
      }
    }

    .sbns__button-group .sbns__continue-btn {
      flex: 1;
      margin: 0;
    }

    @media (hover: hover) {
      .sbns__continue-btn:hover {
        background: var(--c__blue-900);
        opacity: 0.9;
        transform: translateY(-1px);
      }
    }

    .sbns__buttons-container {
      display: flex;
      gap: 1rem;
      align-items: stretch;
      justify-content: center;
      width: 100%;
    }


    @media (max-width: 1240px) {
      .sbns__buttons-container {
        flex-direction: column;
        gap: 8px;
        padding: 0 20px;
      }

      .sbns__continue-btn {
        width: 100%;
        flex: 1;
      }
    }

    .sbns__designs {
      position: relative;
    }

    .sbns__designs .splide__slide {
      display: flex;
      align-items: stretch;
    }

    .sbns__designs .splide__slide .sbns__design {
      width: 100%;
      display: flex;
      flex-direction: column;
    }

    .sbns__designs .splide__pagination {
      bottom: -1.5rem;
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      z-index: 5;
      display: flex !important;

      @media (max-width: 750px) {
        bottom: -1.2rem;
        display: none !important;
      }
    }

    .sbns__designs .splide__pagination__page {
      background: white;
      opacity: 0.5;
      width: 8px;
      height: 8px;
      margin: 0 0.25rem;
      transform: none;
      transition: all 0.3s ease;
    }

    .sbns__designs .splide__pagination__page.is-active {
      background: var(--c__blue-900);
      opacity: 1;
      transform: none;
    }

    .sbns__designs .splide__arrow {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      background: none;
      border: none;
      border-radius: 50%;
      width: 40px;
      height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      z-index: 10;
      transition: all 0.3s ease;
      opacity: 1;
    }

    .sbns__designs .splide__arrow--prev {
      left: -37px;
    }

    .sbns__designs .splide__arrow--next {
      right: -37px;
    }

    .sbns__designs .splide__arrow svg {
      fill: white;
      width: 22px;
      height: 22px;
    }

    .sbns__designs .splide__arrow:disabled {
      opacity: 0.3;
      cursor: not-allowed;
    }

    @media (max-width: 750px) {
      .sbns__designs .splide__arrow {
        display: none;
      }

      .sbns__designs .splide__track {
        overflow: visible !important;
        touch-action: pan-x;
        -webkit-overflow-scrolling: touch;
      }

      .sbns__designs.splide {
        overflow: visible !important;
        width: 100vw;
        margin-left: 50%;
        transform: translateX(-50%);
        padding: 0 20px;
        touch-action: pan-x;
        -webkit-overflow-scrolling: touch;
      }

      .sbns__designs .splide__list {
        overflow: visible !important;
        touch-action: pan-x;
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
      }

      .sbns__designs .splide__slide {
        touch-action: manipulation;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        user-select: none;
      }
    }

    @media (min-width: 751px) {
      .sbns__designs .splide__arrow {
        display: flex !important;
        opacity: 1 !important;
      }

      .sbns__designs .splide__pagination {
        display: flex !important;
      }
    }

    .sbns__design {
      background: transparent;
      border: 1px solid white;
      border-radius: 8px;
      min-height: 181px;
      cursor: pointer;
      transition: all 0.2s ease;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 0 8px 8px ;
      position: relative;
      height: auto;
    }

    @media (hover: hover) {
      .sbns__design:hover {
        border-color: var(--c__blue-900);
        transform: translateY(-1px);
      }
    }

    .sbns__design--selected {
      border: 3px solid var(--c__blue-900);
    }

    .sbns__design img {
      max-width: 100%;
      max-height: 100%;
      height: auto;
      object-fit: contain;

      @media (max-width: 750px) {
        height: 100%;
      }
    }

    .sbns__design-title {
      display: flex;
      align-items: flex-start;
      justify-content: center;
      font-size: clamp(12px, 0.933vw, 14px);
      font-weight: 600;
      color: #ffffff;
      text-align: center;
      line-height: 1.2;
      word-wrap: break-word;
      hyphens: auto;
      white-space: normal;
    }

    .sbns__step-actions {
      display: flex;
      justify-content: space-between;
      gap: 1rem;
    }

    .sbns__btn {
      padding: 0.75rem 1.5rem;
      border: none;
      border-radius: 6px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.2s ease;
    }

    .sbns__btn--primary {
      background: #6aa0ff;
      color: white;
    }

    .sbns__btn--primary:hover {
      background: #5b8fd8;
    }

    .sbns__btn--secondary {
      background: #374151;
      color: white;
    }

    .sbns__btn--secondary:hover {
      background: #4b5563;
    }

    .sbns__price-lock-options {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
      margin-top: 20px;
      margin-bottom: 2rem;
    }

    .sbns__price-lock-option {
      aspect-ratio: 1 / 1;
      border-radius: 8px;
      background: transparent;
      border: 1px solid white;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: all 0.2s ease;
      padding: 1rem;
    }

    .sbns__price-lock-option span {
      font-size: 18px;
      font-weight: bold;
      color: white;
      text-align: center;
    }

    .sbns__price-lock-option:hover {
      transform: translateY(-2px);
    }

    .sbns__price-lock-option--selected {
      border: 3px solid var(--c__blue-900);
    }


    @media (max-width: 750px) {
      .sbns__content {
        max-width: 100%;
        overflow: hidden;
      }

      [data-step="1"] .sbns__content {
        gap: 1rem;
      }

      .sbns__selection {
        max-width: 100%;
        overflow: hidden;
      }

      .sbns__benefits {
        display: none;
      }

      .sbns__step-title {
        font-size: 1.15rem;
        margin-bottom: 6px;
        font-weight: 600;
      }
      h2.sbns__step-title--centered:nth-of-type(2) {
        margin-bottom: 0;
      }

      .sbns__step-subtitle {
        margin-bottom: 4px;
        padding: 0 20px;
        font-size: 0.875rem;
      }

      .sbns__compare-link {
        margin-bottom: 15px;
      }

      .sbns__price-lock-info-link {
        margin-bottom: 15px;
      }

      .sbns__star-rating-text {
        font-size: 0.875rem;
      }

      .sbns__star-rating {
        margin-bottom: 0.875rem;
      }

      .sbns__plan-header {
        padding-top: 4px;
      }

      .sbns__continue-btn {
        width: 100%;
      }

      .sbns__plans {
        display: flex;
        gap: 7px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 12px 40px;
        max-width: none;
        margin-bottom: 0;
        width: calc(100% + 2 * var(--base-padding-inline));
        margin-left: calc(-1 * var(--base-padding-inline));
      }

      .sbns__pricing {
        margin-bottom: 0.65rem;
      }

      .sbns__price-display {
        margin-bottom: 0;
        height: 36px;
      }

      .sbns__plans::-webkit-scrollbar {
        display: none;
      }

      .sbns__plan {
        scroll-snap-align: center;
        flex: 0 0 31.8%;
      }

      .sbns__plan-pricing {
        margin-bottom: 0;
      }

      .sbns__plan-savings {
        margin-bottom: 0;
      }

      .sbns__price-new {
        font-size: 2rem;
      }

      .sbns__price-disclaimer {
        font-size: 0.875rem;
      }

      .sbns__designs {
        margin-bottom: 0.6rem;
      }

      .sbns__design {
        width: -webkit-fill-available;
        height: auto;
        padding: 0 6px 6px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
      }

      .sbns__design img {
        width: 100%;
        max-height: clamp(140px, 8.33333vw, 160px);
        flex-shrink: 0;
      }

      .sbns__design-title {
        font-size: 12px;
        display: flex;
        align-items: flex-start;
        justify-content: center;
        min-height: 2rem;
        line-height: 1.2;
        word-wrap: break-word;
        hyphens: auto;
        white-space: normal;
      }

      /* Step image mobile adjustments */
      .sbns__product-image .sbns__step-image {
        height: 226px !important;
        max-height: 226px !important;
      }

      /* Gallery Mobile Styles */
      .sbns__gallery-desktop {
        display: none;
      }

      .sbns__gallery-mobile {
        display: block;
        padding-bottom: 2rem;
      }
    }

    /* Step 4 specific styles */
    .sbns__button-group {
      display: flex;
      gap: 1rem;
      margin-bottom: 2rem;
      justify-content: center;
    }

    .sbns__back-btn {
      background: transparent;
      border: 2px solid var(--c__blue-900);
      color: var(--c__blue-900);
      padding: 0.75rem 2rem;
      border-radius: 8px;
      font-size: 1.1rem;
      font-weight: 600;
      font-family: var(--font-primary--family) !important;
      cursor: pointer;
      transition: all 0.2s ease;
      flex: 1;
    }

    .sbns__back-btn:hover {
      background: var(--c__blue-900);
      color: white;
      transform: translateY(-1px);
    }

    .sbns__payment-plans {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
      margin-bottom: 2rem;
    }

    .sbns__payment-plan {
      background: transparent;
      border: 1px solid #F4FAFF;
      border-radius: 8px;
      padding: 1.5rem;
      cursor: pointer;
      transition: all 0.2s ease;
      text-align: left;
      position: relative;
      display: flex;
      flex-direction: column;
    }

    .sbns__payment-plan-content {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }

    .sbns__payment-plan .sbns__plan-features {
      margin-top: auto;
    }

    .sbns__payment-plan-title {
      margin-top: auto;
    }

    .sbns__payment-plan:hover {
      border-color: var(--c__blue-900);
      transform: translateY(-2px);
    }

    .sbns__payment-plan--selected {
      border-width: 3px;
      border-color: var(--c__blue-900);
    }

    .sbns__payment-plan-badge {
      position: absolute;
      top: -12px;
      left: 50%;
      transform: translateX(-50%);
      background: var(--c__blue-900);
      color: white;
      padding: 0.25rem 0.75rem;
      border-radius: 20px;
      font-size: 0.75rem;
      font-weight: 600;
      text-align: center;
      white-space: normal;
      max-width: 90%;
    }

    .sbns__payment-plan-title {
      font-size: 1.5rem;
      font-weight: 700;
      color: #ffffff;
      margin-bottom: 0.5rem;
    }

    .sbns__payment-plan-price {
      font-size: 2rem;
      font-weight: 700;
      color: #ffffff;
      margin-bottom: 0.25rem;
    }

    .sbns__payment-plan-frequency {
      font-size: 0.75rem;
      font-weight: 400;
      opacity: 0.8;
    }

    .sbns__payment-plan-details {
      font-size: 0.875rem;
      color: #ffffff;
      line-height: 1.4;
    }

    .sbns__payment-plan-subtitle {
      font-size: 0.875rem;
      color: #ffffff;
      opacity: 0.8;
      margin-bottom: 1rem;
    }

    @media (max-width: 750px) {
      .sbns__button-group {
        display: flex;
        gap: 0.5rem;
      }

      .sbns__back-btn,
      .sbns__button-group .sbns__continue-btn {
        flex: 1;
        width: auto;
        padding: 0.7rem 1rem;
      }

      .sbns__continue-btn {
        padding: 0.7rem 1.5rem;
        font-size: 1rem;
      }

      .sbns__payment-plans {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
      }

      .sbns__payment-plan {
        padding: 0.75rem;
        min-width: 0;
        /* Prevent grid blowout */
      }

      .sbns__payment-plan-title {
        font-size: 1.125rem;
        word-break: break-word;
      }

      .sbns__payment-plan-subtitle {
        font-size: 0.75rem;
        word-break: break-word;
      }

      .sbns__plan-features {
        font-size: 0.75rem;
        gap: 2px;
      }

      .sbns__plan-feature span {
        word-break: break-word;
      }

      .sbns__plan-savings {
        font-size: 0.75rem;
        padding: 2px 8px;
        max-width: 160px;
      }

      .sbns__payment-plan-content {
        justify-content: flex-end;
      }
    }

    /* Third plan badge background color - all breakpoints */
    .sbns__plans > div:nth-child(3) > .sbns__plan-badge {
      background-color: #00B67A;
    }

    /* Tablet styles */
    @media screen and (min-width: 750px) and(max-width: 1023px) {
      .sbns__step-title {
        font-size: 1.15rem;
      }

      .sbns__benefit {
        font-size: 0.625rem;
        gap: 4px;
      }

      .sbns__benefits {
        column-gap: 6px;
      }

      .sbns__plan-feature {
        font-size: 0.5625rem;
        line-height: 1.2;
      }

      .sbns__step {
        padding: 0 16px;
      }

      .sbns__content {
        gap: 30px;
      }

      .sbns__plan-quantity {
        font-size: 0.625rem;
      }

      .sbns__plan-price {
        font-size: 12px;
      }

      .sbns__plan-name {
        font-size: 1.25rem;
      }

      .sbns__plan-savings {
        font-size: 0.625rem;
        margin-bottom: 5px;
      }

      .sbns__plan-header {
        padding-top: 10px;
      }

      .sbns__plan-badge {
        font-size: 0.625rem;
      }

      .sbns__step-subtitle {
        font-size: 0.75rem;
      }

      .sbns__price-new {
        font-size: 1.5rem;
      }

      .sbns__price-old {
        font-size: 1rem;
      }

      .sbns__price-badge {
        font-size: 0.625rem;
      }

      .sbns__gallery-thumbnail {
        width: 48px;
        height: 48px;
      }

      .sbns__gallery-thumbnails {
        gap: 4px;
      }

      .sbns__star-rating {
        margin-bottom: 10px;
      }

      .sbns__star-rating-text {
        font-size: 0.625rem;
      }

      .sbns__price-disclaimer {
        font-size: 0.875rem;
      }

      .sbns__selection-description {
        font-size: 0.75rem;
      }

      .sbns__compare-toggle {
        font-size: 0.75rem;
      }
    }

    .sbns__gallery-mobile.splide {
      padding-bottom: 5px;
    }
@media (max-width: 749px) {
    .video-series {
      padding-top: {{ section.settings.mobile_padding_top }}px !important;
      padding-bottom: {{ section.settings.mobile_padding_bottom }}px !important;
    }
  }
@media (max-width: 749px) {
    .videos {
      padding-top: {{ section.settings.mobile_padding_top }}px !important;
      padding-bottom: {{ section.settings.mobile_padding_bottom }}px !important;
    }
  }

/* CSS from block stylesheet tags */
.accordion {
    flex: 1;
  }

  .accordion--dividers accordion-custom:not(:first-child) .details {
    border-block-start: var(--style-border-width) solid var(--c__white);
  }

  /* When accordion borders are not set, show fallback borders */
  .accordion--dividers {
    --show-fallback-borders: 0;
  }

  .accordion--dividers[style*='--border-width: 0'],
  .accordion--dividers[style*='--border-style: none'] {
    --show-fallback-borders: 1;
  }

  .accordion--dividers accordion-custom:first-child .details {
    border-block-start: calc(var(--style-border-width) * var(--show-fallback-borders)) solid var(--c__white);
  }

  .accordion--dividers accordion-custom:last-child .details {
    border-block-end: calc(var(--style-border-width) * var(--show-fallback-borders)) solid var(--c__white);
  }

  .accordion--dividers .details-content {
    padding-block-end: 1rem;
  }

  .accordion--caret .icon-plus,
  .accordion--plus .icon-caret {
    display: none;
  }

  /* because we can't pass apply a specific class on a block based on its parent block setting */
  .accordion .details__header {
    font-family: var(--summary-font-family);
    font-style: var(--summary-font-style);
    font-weight: var(--summary-font-weight);
    font-size: var(--summary-font-size);
    line-height: var(--summary-font-line-height);
    text-transform: var(--summary-font-case);
    min-height: 45px;
  }
.icon-block {
    display: flex;
    fill: currentcolor;
    flex-shrink: 0;
  }

  .icon-block__media {
    height: auto;
  }
  
  .text-inherit {
    color: inherit;
    text-decoration: none;
  }
.placeholder-image {
    position: relative;
    aspect-ratio: var(--ratio);
    overflow: hidden;
  }

  .placeholder-image img {
    width: 100%;
    height: 100%;
    aspect-ratio: var(--ratio);
  }

  .image-block {
    display: flex;
    justify-content: var(--horizontal-alignment, flex-start);
  }

  .image-block--height-fill .image-block__image {
    height: 100%;
  }

  .image-block__image {
    object-fit: cover;
    aspect-ratio: var(--ratio);
  }
.richtext-block {
    display: flex;
    align-items: var(--icon-alignment, flex-start);
    gap: var(--icon-gap, 1rem);
  }

  .richtext-block__icon {
    flex-shrink: 0;
    width: var(--icon-size);
    height: var(--icon-size);
  }

  .richtext-block__icon-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .richtext-block__content {
    flex: 1;
  }

  .richtext-block__text {
    font-size: var(--text-size);
    font-weight: var(--text-weight);
    line-height: 1.6;
  }

  .richtext-block__text p {
    margin-bottom: 1em;
  }

  .richtext-block__text p:last-child {
    margin-bottom: 0;
  }
/* Fill opposite direction */
  .layout-panel-flex--column > .spacer-block {
    width: 100%;
  }

  .layout-panel-flex--row > .spacer-block {
    height: 100%;
  }

  /* Desktop - Fill */
  :is(.layout-panel-flex--row, .layout-panel-flex--column) > .spacer-block--width-fill {
    flex: var(--spacer-size);
    max-width: var(--spacer-max-width, none);
  }

  /* Desktop - Fit */
  .layout-panel-flex--row > .spacer-block--width-fit {
    width: var(--spacer-size);
  }

  .layout-panel-flex--column > .spacer-block--width-fit {
    height: var(--spacer-size);
  }

  /* Mobile */
  @media screen and (max-width: 749px) {
    /* Fill */
    .layout-panel-flex--row:not(.mobile-column) > .spacer-block--width-mobile-fill {
      flex: var(--spacer-size-mobile);
      height: 100%;
    }

    .layout-panel-flex--column > .spacer-block--width-mobile-fill,
    .mobile-column > .spacer-block--width-mobile-fill {
      width: 100%;
      flex: var(--spacer-size-mobile);
    }

    /* Fit */
    .layout-panel-flex--row:not(.mobile-column) > .spacer-block--width-mobile-fit {
      width: var(--spacer-size-mobile);
      height: 100%;
    }

    .layout-panel-flex--column > .spacer-block--width-mobile-fit,
    .mobile-column > .spacer-block--width-mobile-fit {
      width: 100%;
      flex: 0;
      height: var(--spacer-size-mobile);
    }
  }

/* CSS from snippet stylesheet tags */
@media (prefers-reduced-motion: reduce) {
    video-background-component video {
      display: none;
    }
  }
.size-style {
    width: var(--size-style-width, fit-content);
    display: inline-block;
  }

  .button-secondary {
    background: transparent;
    color: var(--c__white);
    border: 1px solid var(--c__white);
    padding: 12px 20px;
    border-radius: var(--border-radius-xs);
    font-size: 0.875rem;
    line-height: 1rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
  }

  .button-secondary:hover {
    background: var(--c__white);
    color: var(--c__blue-900);
  }

  .link {
    text-decoration: none;
    color: var(--c__white);
    font-weight: 600;
    transition: opacity 0.3s ease;
  }

  .link:hover {
    opacity: 0.8;
    text-decoration: underline;
  }

  @media (max-width: 749px) {
    .size-style {
      width: var(--size-style-width-mobile, var(--size-style-width, fit-content));
      min-width: var(--size-style-width-mobile-min, auto);
    }
  }
.divider {
    align-self: stretch;
    display: flex;
    align-items: center;
    justify-content: var(--divider-justify-content);
  }

  .divider__line {
    border-bottom: var(--divider-border-thickness) solid var(--color-border);
    border-right: var(--divider-border-thickness) solid var(--color-border);
    border-radius: calc(var(--style-border-radius-sm) * var(--divider-border-rounded));
    flex-basis: var(--divider-flex-basis);
    min-height: var(--divider-flex-basis);
  }
.group-block__link {
    position: absolute;
    inset: 0;
  }

  .group-block__link ~ :is(.group-block-content, .group-block__media-wrapper) {
    pointer-events: none;
    a,
    button,
    input,
    textarea,
    select {
      pointer-events: auto;
    }
  }

  /* Needs the .group-block__link ~ to be specific enough to take effect. */
  .group-block__link ~ .group-block-content--design-mode {
    pointer-events: auto;
  }
.image {
    display: block;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: auto;
  }

  .image > img {
    width: 100%;
    height: auto;
  }
.overlay {
    position: absolute;
    inset: 0;
    z-index: var(--overlay-layer);
    pointer-events: none;
    border-radius: var(--overlay-border-radius, 0px);
  }

  .overlay--solid {
    background: var(--overlay-color);
  }

  .overlay--gradient {
    background: linear-gradient(var(--overlay-direction), var(--overlay-color), var(--overlay-color--end));
  }
:root {
    --text-align-default: left;
  }

  [style*='--horizontal-alignment: center'] .text-block {
    --text-align-default: center;
  }

  [style*='--horizontal-alignment: flex-end'] .text-block {
    --text-align-default: right;
  }

  [style*='--horizontal-alignment: flex-start'] > .text-block {
    --text-align-default: left;
  }

  [style*='--horizontal-alignment: center'] > .text-block {
    --text-align-default: center;
  }

  [style*='--horizontal-alignment: flex-end'] > .text-block {
    --text-align-default: right;
  }

  .text-block {
    width: var(--width);
    max-width: 100%;
    display: flex;
    flex-direction: column;
    align-items: var(--horizontal-alignment);
  }

  .text-block > * {
    width: var(--width);
    max-width: var(--max-width, 100%);
    text-align: var(--text-align, var(--text-align-default));
    text-wrap: var(--text-wrap);
  }

  .text-block:not(.text-block--full-width).rte,
  .text-block:not(.text-block--full-width).paragraph {
    /* Safari doesn't support pretty, so fallback to balance */
    text-wrap: balance;
    text-wrap: pretty;
  }

  .text-block:not(.text-block--full-width):is(.h1, .h2, .h3, .h4, .h5, .h6, .h7, .h8, .h9) {
    text-wrap: balance;
  }

  /* Hide underline unless text is using paragraph styles. */
  .text-block:is(.h1, .h2, .h3, .h4, .h5, .h6, .h7, .h8, .h9) a {
    text-decoration-color: transparent;
  }

  /* Direct heading styles - apply to the element itself AND its children */
  .text-block.h1,
  .text-block.h1 > * {
    font-size: 3.25rem !important; /* 52px */
    font-family: var(--font-heading--family);
    font-weight: 700;
    line-height: 1.2;
  }

  .text-block.h2,
  .text-block.h2 > * {
    font-size: 3.125rem !important; /* 50px */
    font-family: var(--font-heading--family);
    font-weight: 700;
    line-height: 1.2;
  }

  .text-block.h3,
  .text-block.h3 > * {
    font-size: 3rem !important; /* 48px */
    font-family: var(--font-heading--family);
    font-weight: 700;
    line-height: 1.2;
  }

  .text-block.h4,
  .text-block.h4 > * {
    font-size: 2.75rem !important; /* 44px */
    font-family: var(--font-heading--family);
    font-weight: 600;
    line-height: 1.2;
  }

  .text-block.h5,
  .text-block.h5 > * {
    font-size: 2.5rem !important; /* 40px */
    font-family: var(--font-heading--family);
    font-weight: 600;
    line-height: 1.1;
  }

  .text-block.h6,
  .text-block.h6 > * {
    font-size: 2.25rem !important; /* 36px */
    font-family: var(--font-heading--family);
    font-weight: 600;
    line-height: 1.2;
  }

  .text-block.h7,
  .text-block.h7 > * {
    font-size: 2rem !important; /* 32px */
    font-family: var(--font-heading--family);
    font-weight: 600;
    line-height: 1.2;
  }

  .text-block.h8,
  .text-block.h8 > * {
    font-size: 1.875rem !important; /* 30px */
    font-family: var(--font-heading--family);
    font-weight: 600;
    line-height: 1.2;
  }

  .text-block.h9,
  .text-block.h9 > * {
    font-size: 1.75rem !important; /* 28px */
    font-family: var(--font-heading--family);
    font-weight: 600;
    line-height: 1.1;
  }

  .text-block p,
  .text-block.p > *,
  .text-block.paragraph > * {
    font-family: var(--font-paragraph--family);
    font-size: var(--font-paragraph--size);
    font-weight: var(--font-paragraph--weight);
    line-height: var(--font-paragraph--line-height);
    margin-block: var(--font-paragraph--spacing);
  }

  .text-block > *:first-child {
    margin-block-start: 0;
  }

  .text-block > *:last-child {
    margin-block-end: 0;
  }

  .text-block--align-center,
  .text-block--align-center > * {
    margin-inline: auto;
  }

  .text-block--align-right,
  .text-block--align-right > * {
    margin-inline-start: auto;
  }

  .text-block--background {
    background-color: var(--text-background-color);
    border-radius: var(--text-corner-radius);

    /* To avoid text being cropped when using a border radius we add a minimum padding. */
    padding-block-start: max(var(--text-padding), var(--padding-block-start, 0));
    padding-block-end: max(var(--text-padding), var(--padding-block-end, 0));
    padding-inline-start: max(var(--text-padding), var(--padding-inline-start, 0));
    padding-inline-end: max(var(--text-padding), var(--padding-inline-end, 0));
  }

  .custom-color,
  .custom-color > :is(h1, h2, h3, h4, h5, h6, p, *) {
    color: var(--color);
  }

  /* Custom typography styles */
  .text-block.custom.custom-font-size,
  .text-block.custom.custom-font-size > * {
    font-size: var(--font-size) !important;
  }

  .text-block.custom,
  .text-block.custom > * {
    font-family: var(--font-family);
    font-weight: var(--font-weight);
    line-height: var(--line-height);
    text-transform: var(--text-transform);
    letter-spacing: var(--letter-spacing);
  }