@mixin cygnus-reach-typography() {
  :is(.heading, .label, .paragraph, .mono) {
    &:is(.xs, .sm, .md, .lg, .xl, .xxl, .huge) {
      &:is(.regular, .bold) {
        line-height: normal;
        & > cyg-rs-icon-default {
          display: flex;
        }

        /* Categories */
        &.heading {
          font-family: var(--typography-fontFamily-heading);
        }
        &.label {
          font-family: var(--typography-fontFamily-label);
          text-transform: uppercase;
          letter-spacing: 0.1em;
        }
        &.paragraph {
          font-family: var(--typography-fontFamily-paragraph);
        }
        &.mono {
          font-family: var(--typography-fontFamily-mono);
        }

        /* Sizing */
        &.xs {
          font-size: var(--typography-fontSize-xs);
          & > cyg-rs-icon-default {
            height: var(--typography-fontSize-xs);
            width: var(--typography-fontSize-xs);
          }
        }
        &.sm {
          font-size: var(--typography-fontSize-sm);
          & > cyg-rs-icon-default {
            height: var(--typography-fontSize-sm);
            width: var(--typography-fontSize-sm);
          }
        }
        &.md {
          font-size: var(--typography-fontSize-md);
          & > cyg-rs-icon-default {
            height: var(--typography-fontSize-md);
            width: var(--typography-fontSize-md);
          }
        }
        &.lg {
          font-size: var(--typography-fontSize-lg);
          & > cyg-rs-icon-default {
            height: var(--typography-fontSize-lg);
            width: var(--typography-fontSize-lg);
          }
        }
        &.xl {
          font-size: var(--typography-fontSize-xl);
          & > cyg-rs-icon-default {
            height: var(--typography-fontSize-xs);
            width: var(--typography-fontSize-xs);
          }
        }
        &.xxl {
          font-size: var(--typography-fontSize-xxl);
          & > cyg-rs-icon-default {
            height: var(--typography-fontSize-xxl);
            width: var(--typography-fontSize-xxl);
          }
        }
        &.huge {
          font-size: var(--typography-fontSize-huge);
          & > cyg-rs-icon-default {
            height: var(--typography-fontSize-huge);
            width: var(--typography-fontSize-huge);
          }
        }

        /* Weight */
        &.regular {
          font-weight: var(--typography-fontWeight-regular);
        }
        &.bold {
          font-weight: var(--typography-fontWeight-bold);
        }
      }
    }
  }
}
