.content-editor h1,
.content-editor h2 {
    font-weight: 700;
}

.content-editor h2,
.content-editor h3,
.content-editor h4,
.content-editor h5,
.content-editor h6 {
    color: var(--color-primary-light);
}

.content-editor h3:not(:first-child),
.content-editor h4:not(:first-child),
.content-editor h5:not(:first-child),
.content-editor h6:not(:first-child) {
    margin-top: 24rem;
}

.content-editor h1 {
    font-size: 32rem;
    line-height: 40rem;
    color: var(--color-primary);
}

.content-editor h2 {
    font-size: 24rem;
    line-height: 30rem;
}

.content-editor h2:not(:first-child) {
    margin-top: 32rem;
}

.content-editor h3 {
    font-size: 20rem;
    line-height: 26rem;
}

.content-editor h4 {
    font-size: 18rem;
    line-height: 24rem;
}

.content-editor h5 {
    font-size: 16rem;
    line-height: 22rem;
}

.content-editor p:not(:first-child),
.content-editor ul:not(:first-child),
.content-editor ol:not(:first-child) {
    margin-top: 16rem;
}

.content-editor ul > li {
    position: relative;
    padding-left: 12rem;
}

.content-editor ul > li:not(:first-child) {
    margin-top: 8rem;
}

.content-editor ul > li:before {
    content: '';
    width: 4rem;
    height: 4rem;
    position: absolute;
    top: 8rem;
    left: 0;
    background-color: var(--color-primary);
    border-radius: 50%;
}

.content-editor ol {
    counter-reset: accordionOrderedList;
}

.content-editor ol > li {
    position: relative;
    counter-increment: accordionOrderedList;
    padding-left: 24rem;
}

.content-editor ol > li:not(:first-child) {
    margin-top: 8rem;
}

.content-editor ol > li:before {
    content: counter(accordionOrderedList) '.';
    position: absolute;
    top: 0;
    left: 0;
    font-weight: 700;
    color: var(--color-primary);
}

.content-editor mark {
    background-color: transparent;
    color: var(--color-primary);
}

.content-editor a {
    color: var(--color-primary-light);
    text-decoration: underline;
    -webkit-transition: color var(--transition-duration);
    transition: color var(--transition-duration);
}

.content-editor-block {
    width: 100%;
    border: 1px solid var(--color-primary-dark);
    border-radius: var(--border-radius);
    padding: 24rem;
}

@media screen and (min-width: 768px) {
    .content-editor h1 {
        font-size: 48rem;
        line-height: 56rem;
    }

    .content-editor-block {
        padding: 32rem;
    }
}

@media screen and (min-width: 1024px) and (orientation: landscape) {
    .content-editor-container {
        max-width: calc(1024rem + var(--container-padding-x) * 2);
    }
}

@media (hover: hover) {
    .content-editor a:hover {
        color: var(--color-primary);
    }
}