.ctr-listicle-text {
  --font-heading-family: 'EB Garamond', serif;
  --font-body-family: 'Inter', sans-serif;
}

.ctr-listicle-text__container {
  max-width: var(--content-max-width, 980px);
  margin: 0 auto;
  padding: var(--padding-top-mobile, 40px) 20px var(--padding-bottom-mobile, 40px);
  display: flex;
  flex-direction: column;
  gap: 24px;

  @media (min-width: 768px) {
    padding: var(--padding-top-desktop, 64px) 20px var(--padding-bottom-desktop, 64px);
    gap: 32px;
  }

  &.ctr-listicle-text__container--left {
    align-items: flex-start;
    text-align: left;
  }

  &.ctr-listicle-text__container--center {
    align-items: center;
    text-align: center;
  }

  &.ctr-listicle-text__container--right {
    align-items: flex-end;
    text-align: right;
  }
}

.ctr-listicle-text__heading {
  font-family: var(--font-heading-family);
  font-size: var(--heading-font-size-mobile, 32px);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.96px;
  margin: 0;
  color: var(--color-foreground);
  width: 100%;

  @media (min-width: 768px) {
    font-size: var(--heading-font-size, 48px);
    font-weight: 400;
    line-height: 1.03;
    letter-spacing: -1.44px;
  }

  > * {
    margin: 0;
  }
}

.ctr-listicle-text__body {
  font-family: var(--font-body-family);
  font-size: var(--body-font-size-mobile, 17px);
  font-weight: 400;
  line-height: 1.5;
  color: var(--color-foreground);
  width: 100%;

  @media (min-width: 768px) {
    font-size: var(--body-font-size, 18px);
  }

  > * {
    margin: 0;
  }

  > * + * {
    margin-top: var(--body-spacing, 20px);
  }
}