#benefit {
  --icon-container-size: 28px;
  --icon-size: 16px;
  --icon-color: #e14b00;
  --icon-bg: #ffd1ba;

  .grid-2 {
    gap: 80px;
  }

  & .benefit-illustration img {
    border-radius: 40px;
  }
}

& .benefit-content {
  justify-content: center;

  & .benefit-heading {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  & .benefits-list {
    display: flex;
    flex-direction: column;
    gap: 20px;

    & .benefit-item {
      display: flex;
      gap: 20px;

      .icon {


        background-color: var(--icon-bg);
        border-radius: 50%;
        width: var(--icon-container-size);
        height: var(--icon-container-size);
        display: grid;
        place-content: center;

        margin-top: 4px;

        & svg {
          width: var(--icon-size);
          height: var(--icon-size);

          & .stroke {
            stroke: var(--icon-color);
            stroke-width: 3px;
          }
        }
      }
    }

  }

  & .benefit-quote {
    display: flex;
    flex-direction: column;
    gap: 12px;

    background-color: #dadada;
    padding: 20px;
    border-left: 2px solid var(--icon-color);

    & h3 {
      font-weight: lighter;
      text-transform: uppercase;
    }

    & p {
      font-style: italic;

      &::before,
      &::after {
        content: "\"";
      }
    }
  }
}