/** Shopify CDN: Minification failed

Line 22:2 Unexpected "#"
Line 22:4 Unexpected "{"
Line 22:13 Expected ":"
Line 31:2 Unexpected "#"
Line 31:4 Unexpected "{"
Line 31:13 Expected ":"
Line 44:2 Unexpected "#"
Line 44:4 Unexpected "{"
Line 44:13 Expected ":"
Line 57:2 Unexpected "#"
... and 179 more hidden warnings

**/


/* CSS from section stylesheet tags */
/* ============================================
     SECTION WRAPPER
     ============================================ */
  #{{ section.id }}.shopify-section-new-n {
      width: 100%;
      background-image: var(--section-bg-image);
      background-position: center top;
      background-size: cover;
      background-attachment: fixed;
      color: #fff;
  }

  #{{ section.id }} .section-wrapper {
      width: 100%;
      overflow: clip;
      padding-left: 1rem;
      padding-right: 1rem;
      padding-bottom: 40px;
      padding-top: 40px;
      position: relative;
  }

  /* ============================================
     GRADIENT BACKGROUND
     ============================================ */
  #{{ section.id }} .gradient-background {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      height: 100%;
      width: 100%;
      overflow: hidden;
      display: block;
      pointer-events: none;
      z-index: 0;
  }

  #{{ section.id }} .gradient-circle {
      aspect-ratio: 2.1;
      border-radius: 100%;
      width: 1840px;
      mix-blend-mode: lighten;
      background: radial-gradient(circle, #B78AD9 0%, rgba(0, 0, 0, 0) 70%);
      opacity: 0.3;
      position: relative;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
  }

  /* ============================================
     CONTENT WRAPPER
     ============================================ */
  #{{ section.id }} .content-wrapper {
      position: relative;
      z-index: 1;
  }

  /* ============================================
     HEADER SECTION
     ============================================ */
  #{{ section.id }} .header-section {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      margin-bottom: 2.5rem;
      max-width: 544px;
      margin-left: auto;
      margin-right: auto;
  }

  #{{ section.id }} .main-heading {
      margin-bottom: 1rem;
      text-align: center;
      font-size: 30px;
      line-height: 35px;
      max-width: 260px;
  }

  #{{ section.id }} .main-heading p {
      margin: 0;
  }

  #{{ section.id }} .highlight-text {
      display: block;
      user-select: none;
  }

  #{{ section.id }} .highlight-text::selection {
      background-color: #ff5600;
  }

  #{{ section.id }} .sub-heading {
      margin-bottom: 0;
      font-size: 16px;
      font-weight: var(--font-body-weight-bold);
      text-align: center;
      padding-left: 8px;
      padding-right: 8px;
  }

  /* ============================================
     MAIN CONTENT
     ============================================ */
  #{{ section.id }} .main-content {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 2rem;
  }

  /* ============================================
     IMAGE CONTAINER
     ============================================ */
  #{{ section.id }} .image-container {
      width: 100%;
      width: 300px;
      height: 300px;
      margin-top: -58px;
      margin-bottom: -58px;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
  }

  #{{ section.id }} .background-image {
      width: 100%;
      height: 100%;
      object-fit: contain;
  }

  #{{ section.id }} .product-image {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-40%, -47%);
      width: 92px;
      height: auto;
      z-index: 1;
  }

  /* ============================================
     BENEFITS CONTAINER
     ============================================ */
  #{{ section.id }} .benefits-container {
      display: flex;
      width: auto;
      max-width: 544px;
      flex-direction: column;
      gap: 2.25rem;
      position: relative;
      padding-left: 18px;
  }

  /* ============================================
     VERTICAL LINE
     ============================================ */
  #{{ section.id }} .vertical-line {
      width: 0.5rem;
      height: 85%;
      position: absolute;
      top: 3%;
      left: 0;
      border-left: 2px dashed white;
      margin-top: 22px;
  }

  #{{ section.id }} .horizontal-connector {
      width: 250px;
      height: auto;
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 10px;
      border-top: 2px dashed white;
      display: none;
  }

  /* ============================================
     BENEFIT ITEM
     ============================================ */
  #{{ section.id }} .benefit-item {
      display: flex;
      align-items: center;
      gap: 20px;
      position: relative;
  }

  #{{ section.id }} .benefit-connector {
      width: 14px;
      height: 0.5rem;
      display: block !important;
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: -18px;
      border-top: 2px dashed white;
  }

  #{{ section.id }} .benefit-icon {
      width: 2.5rem;
      height: 2.5rem;
      display: flex;
      align-items: center;
      justify-content: center;
  }

  #{{ section.id }} .icon-image {
      width: auto;
      height: auto;
      object-fit: contain;
      object-position: center;
      flex-shrink: 0;
  }

  #{{ section.id }} .benefit-text {
      display: flex;
      flex-direction: column;
  }

  #{{ section.id }} .benefit-title {
      font-size: 20px;
      line-height: 1;
      margin-bottom: 6px;
  }

  #{{ section.id }} .benefit-description {
      font-size: 18px;
      line-height: 22px;
      margin-right: -0.375rem;
  }

  #{{ section.id }} .mobile-break {
      display: none;
  }

  #{{ section.id }} .cta-container {
      width: 100%;
      display: flex;
      justify-content: center;
      margin-top: 39px;
  }

  #{{ section.id }} .btn-primary {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0.5rem;
      width: 100%;
      max-width: 266px;
      margin-left: auto;
      margin-right: auto;
      padding: 16px 32px;
      text-decoration: none;
      border-radius: 100px;
      font-weight: 900;
      font-size: 18px;
      transition: background-color 0.3s ease, transform 0.2s ease;
      border: 1px solid transparent;
  }

  #{{ section.id }} .btn-primary:hover {
      opacity: 0.85;
      transform: translateY(-2px);
  }

  #{{ section.id }} .btn-primary:active {
      transform: translateY(0);
  }

  #{{ section.id }} .btn-primary svg {
      width: 23px;
      height: 17px;
  }

  @media (min-width: 370px) {
      #{{ section.id }} .section-wrapper {
          padding-left: 1.25rem;
          padding-right: 1.25rem;
      }
  }

  /* Small Screens (412px+) */
  @media (min-width: 412px) {
      #{{ section.id }} .vertical-line {
          height: 87%;
      }
  }

  /* Small Screens (404px+) */
  @media (min-width: 404px) {
      #{{ section.id }} .vertical-line {
          top: 0;
      }
  }

  /* Small Screens (640px) - Standard sm breakpoint */
  @media (min-width: 640px) {
      #{{ section.id }} .main-heading {
          max-width: none;
      }

      #{{ section.id }} .sub-heading {
          padding-left: 0;
          padding-right: 0;
      }

      #{{ section.id }} .benefit-description {
          margin-right: 0;
      }
  }

  /* Custom sm: 680px */
  @media (min-width: 680px) {
      #{{ section.id }} .section-wrapper {
          padding-left: 1.5rem;
          padding-right: 1.5rem;
          padding-bottom: 40px;
          padding-top: 40px;
      }
  }

  /* Medium Screens (md: 768px) */
  @media (min-width: 768px) {
      #{{ section.id }} .main-heading {
          font-size: 45px;
          line-height: 47px;
          margin-bottom: 1.5rem;
      }

      #{{ section.id }} .sub-heading {
          font-size: 20px;
      }

      #{{ section.id }} .btn-primary {
          max-width: 400px;
      }
  }

  /* Medium Screens (896px) - 2md breakpoint */
  @media (min-width: 896px) {
      #{{ section.id }} .header-section {
          max-width: 776px;
      }

      #{{ section.id }} .highlight-text {
          display: inline-block;
      }

      #{{ section.id }} .benefits-container {
          width: 100%;
      }
  }

  /* Large Screens (lg: 1024px) */
  @media (min-width: 1024px) {
      #{{ section.id }} .section-wrapper {
          padding-bottom: 90px;
          padding-top: 90px;
          padding-left: 2rem;
          padding-right: 2rem;
      }

      #{{ section.id }} .header-section {
          margin-bottom: 2.5rem;
      }

      #{{ section.id }} .main-heading {
          font-size: 55px;
          line-height: 55px;
      }

      #{{ section.id }} .main-content {
          flex-direction: row;
      }

      #{{ section.id }} .image-container {
          width: 550px;
          height: 550px;
      }

      #{{ section.id }} .product-image {
          width: 165px;
      }

      #{{ section.id }} .benefits-container {
          padding-left: 0;
      }

      #{{ section.id }} .vertical-line {
          top: 4%;
          left: -45px;
          margin-top: 0.5rem;
      }

      #{{ section.id }} .horizontal-connector {
          display: block !important;
      }

      #{{ section.id }} .benefit-connector {
          width: 32px;
          left: -45px;
      }

      #{{ section.id }} .benefit-title {
          font-size: 24px;
      }

      #{{ section.id }} .mobile-break {
          display: none;
      }

      #{{ section.id }} .cta-container {
          margin-top: 64px;
      }
  }

  /* Extra Large (xl: 1280px) */
  @media (min-width: 1280px) {
      #{{ section.id }} .section-wrapper {
          max-width: var(--page-width);
          margin-left: auto;
          margin-right: auto;
      }
  }

  /* 2XL (2xl: 1440px) */
  @media (min-width: 1440px) {
      #{{ section.id }} .gradient-circle {
          width: 2000px;
      }
  }

  /* 3XL (3xl: 1536px) */
  @media (min-width: 1536px) {
      #{{ section.id }} .section-wrapper {
          padding-left: 3rem;
          padding-right: 3rem;
      }
  }

  /* 4XL (4xl: 1900px) */
  @media (min-width: 1900px) {
      #{{ section.id }} .gradient-circle {
          width: 2200px;
      }
  }

  /* 5XL (5xl: 2500px) */
  @media (min-width: 2500px) {
      #{{ section.id }} .main-heading {
          font-size: 65px;
          line-height: 65px;
      }

      #{{ section.id }} .gradient-circle {
          width: 2500px;
      }
  }