/** At this monitor size it is wider than Figma */
.pricing {
  --pricing-bg: var(--onion);
  --text-color: var(--black);
  --pricing-border: var(--dark-light);
  --button-bg: var(--white);

  background-color: var(--pricing-bg);
  padding: 3.125rem 2.5rem;
  border: 1px solid var(--pricing-border);
  border-radius: 1.5625rem;
  box-shadow: 0 0 1rem var(--pricing-border);
  background-image: url('./assets/peas.svg');
  background-position: top right;
  background-repeat: no-repeat;
  color: var(--text-color);
}
.pricing p,.pricing strong,.pricing ul,.pricing li,.pricing span,.pricing h3,.pricing h2 {
    color: var(--text-color);
  }
.pricing strong {
    font-weight: 500;
  }
.pricing .pricing__title {
    margin-block-end: 1rem;
    font-size: 1.75rem;
    font-weight: 500;
    letter-spacing: 1.5px;
  }
.pricing .pricing__price {
    margin-top: 1.25rem;
    margin-bottom: 0.625rem;
    font-size: 2.5rem;
    font-weight: 400;
    letter-spacing: 1.5px;
  }
.pricing .pricing__description {
    margin-block-end: 1rem;
    font-size: 0.875rem;
    font-weight: 400;
  }
.pricing .pricing__body {
    border-top: 1px solid var(--pricing-border);
    margin-top: 1.875rem;
    padding-top: 1.375rem;
    margin-block-end: 1rem;
    font-size: 0.875rem;
  }
.pricing .pricing__body ul li {
      font-size: 0.875rem;
    }
.pricing .pricing__button {
    width: 100%;
  }
.pricing[data-variant="feature"] {
    --pricing-bg: var(--cauliflower);
  }