.about-item {
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-self: center;
    text-align: center;
    max-width: 320px;
    font-size: calc(var(--fontsize) + 2px);
    font-weight: 200;
    margin-top: calc(var(--unit) * 10);
    padding-bottom: calc(var(--unit) * 10);
}

@media screen and (min-width: 700px) {
    .about-item {
        max-width: 700px;
        padding: 0 calc(var(--unit) * 4) calc(var(--unit) * 12) calc(var(--unit) * 4);
        margin-top: calc(var(--unit) * 20);
    }
}

.about-item p {
    margin-bottom: var(--unit);
}


.about-item .more-button {
    font-weight: 400;
}

.about-item .more-button-arrow {
    display: inline-block;
    transform: translateX(calc(var(--unit) * -2));
    opacity: 0;
    transition: transform .45s var(--easier), opacity .45s var(--easier);
}

.about-item .more-button:hover .more-button-arrow {
    transform: translateX(calc(var(--unit) * 2));
    opacity: 1;
}

.about-item .more-button-name {
    display: inline-block;
    transform: translateX(calc(var(--unit) * -1));
    transition: transform .45s var(--easier);
}

.about-item .more-button:hover .more-button-name {
    transform: translateX(calc(var(--unit) * 2));
    transition: transform .45s var(--easier);
}

@media screen and (min-width: 700px) {
    .about-item:has( + .featured-section:is(.background-true)) {
        padding-bottom: calc(var(--unit) * 20) !important;
    }
}