.luxury-ring-showcase-section {
  background-color: rgb(var(--color-background));

  .lrs-section-area {
    --la-gap-col: 35px;
    display: flex;
    align-items: center;
    column-gap: var(--la-gap-col);
    justify-content: space-between;
  }

  .lrs-section-area .left-side-area .ls-content-area {
    width: 100%;
  }

  .lrs-section-area .left-side-area .ls-content-area span.caption {
    font-size: var(--caption-size);
    font-family: var(--font-family-montserrat);
    font-weight: 600;
    display: block;
  }

  .lrs-section-area .left-side-area .ls-content-area .title {
    font-size: var(--title-size);
    margin-top: 5px;
    margin-bottom: 15px;
    text-transform: capitalize;
    font-family: var(--font-family-playfair);
    font-weight: 600;
    letter-spacing: 1px;
    display: block;
  }

  .lrs-section-area .left-side-area .ls-content-area p.description {
    line-height: 1.5;
    font-family: var(--font-family-montserrat);
    text-transform: capitalize;
    font-size: var(--text-base);
  }

  .lrs-section-area .left-side-area .ls-content-area .button-area {
    margin-top: 40px;
  }

  .lrs-section-area .button-area a.button {
    font-size: var(--button-size);
  }

  .right-side-area {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: var(--la-gap-col);
  }

  .lrs-section-area img {
    object-fit: cover;
  }

  @media screen and (width < 990px) {
    .page-width {
      padding-inline: 0;
    }

    .lrs-section-area {
      flex-direction: column;
    }

    .lrs-section-area .right-side-area {
      width: 100%;
      column-gap: 0;
    }

    .lrs-section-area .left-side-area {
      flex-basis: 100%;
      grid-template-columns: 1fr;
    }

    .lrs-section-area .left-side-area .ls-content-area {
      padding: 2rem;
    }
  }

  @media screen and (width < 750px) {
    .lrs-section-area .left-side-area {
      row-gap: 35px;
      flex-direction: column-reverse;
    }

    .lrs-section-area .left-side-area .ls-content-area {
      text-align: center;
    }

    .lrs-section-area .left-side-area .ls-content-area .button-area {
      margin-top: 15px;
    }
  }

  @media screen and (width >= 990px) {
    .lrs-section-area .right-side-area {
      width: calc((100% - var(--lc-width)) - var(--la-gap-col)/2);
      max-width: calc((100% - var(--lc-width)) - var(--la-gap-col)/2);
    }

    .lrs-section-area .left-side-area {
      width: calc(var(--lc-width) - var(--la-gap-col)/2);
      max-width: calc(var(--lc-width) - var(--la-gap-col)/2);
    }
  }
}