.s-testimonials {
    position: relative;
    margin-top: -3.5rem;
    padding-top: 12rem;
    opacity: 1;
    color: var(--color-white)
}

.s-testimonials__wrapper {
    position: relative;
    min-height: 23rem;
    will-change: height
}

.s-testimonials__wave {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-brand-2)
}

.s-testimonials__title {
    font: 400 var(--font-size-h-xl)/0.8 var(--font-heading);
    letter-spacing: normal;
    margin: 0 auto .805em;
    max-width: 6.04em;
    text-align: center
}

@media only screen and (max-width: 1280px) {
    .s-testimonials__title {
        margin-bottom: 0;
    }
}

.s-testimonials__items {
    display: grid;
    grid-template-columns:1fr;
    row-gap: 9rem
}

@media only screen and (max-width: 1680px) {
    .s-testimonials__items {
        -moz-column-gap: 2rem;
        column-gap: 2rem
    }
}

@media only screen and (max-width: 767px) {
    .s-testimonials__items {
        grid-template-columns:1fr
    }
}

.s-testimonials__item {
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-end;
    justify-content: center
}

@media only screen and (max-width: 1280px) {
    .s-testimonials__item {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: flex-end
    }
}

.s-testimonials__fig {
    display: flex;
    flex-direction: column;
    align-items: normal;
    justify-content: space-between;
    position: relative;
    z-index: 4;
    align-self: flex-start;
    margin: 0;
    padding: 0 0 8.5rem;
    height: 100%
}

@media only screen and (max-width: 1280px) {
    .s-testimonials__fig {
        align-self: center;
        padding-bottom: 0
    }
}

.s-testimonials__image {
    position: relative
}

@media only screen and (max-width: 1280px) {
    .s-testimonials__image {
        margin-bottom: 1rem
    }
}

.s-testimonials__img {
    position: relative;
    margin-top: 14%;
    padding-bottom: 110%;
    width: calc(2 * var(--grid-column-width) + 1 * var(--grid-gutter-width));
    height: 0
}

@media only screen and (max-width: 1280px) {
    .s-testimonials__img {
        margin: 0;
        width: calc(3 * var(--grid-column-width) + 2 * var(--grid-gutter-width))
    }
}

@media only screen and (max-width: 767px) {
    .s-testimonials__img {
        width: calc(4 * var(--grid-column-width) + 3 * var(--grid-gutter-width))
    }
}

.s-testimonials__img > img {
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: bottom;
    object-position: bottom
}

.s-testimonials__text {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    font: 400 var(--font-size-t-sm)/1.5 var(--font-text);
    letter-spacing: .1em;
    position: relative;
    flex: 1;
    margin: 0;
    width: 50em;
    min-height: 5em;
}

@media only screen and (max-width: 1280px) {
    .s-testimonials__text {
        min-width: auto;
        text-align: center;
        margin: 5em 0 0 0;
        width: 25em;
    }
}

.s-testimonials__text:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 2.22em;
    height: 1.61em;
    background: url("../images/presentation/quote.svg") no-repeat center/contain;
    transform: translate(-130%, -30%);
    content: ""
}

@media only screen and (max-width: 1280px) {
    .s-testimonials__text:before {
        display: none
    }
}

.s-testimonials__brush {
    position: absolute;
    right: 50%;
    bottom: 0;
    z-index: 3;
    width: 130%;
    transform: translate3d(50%, 80%, 0);
    pointer-events: none
}

@media only screen and (max-width: 1280px) {
    .s-testimonials__brush:after {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        content: "";
        pointer-events: none
    }
}

.s-testimonials__cloud {
    position: absolute;
    top: 0;
    right: 50%;
    width: 130%;
    transform: translate3d(50%, -35%, 0);
    pointer-events: none
}

.s-testimonials__cap {
    display: flex;
    flex-direction: row;
    align-items: normal;
    justify-content: normal;
    font: 400 var(--font-size-h-xs)/1 var(--font-heading);
    letter-spacing: normal;
    margin: .93em 0 0 2.2em;
    color: var(--color-brand-2);
    line-height: 1.2
}

@media only screen and (max-width: 1280px) {
    .s-testimonials__cap {
        justify-content: center;
        margin: .93em 0 0;
        text-align: center
    }
}

.s-testimonials__desc {
    font: 400 var(--font-size-t-sm)/1.5 var(--font-text);
    letter-spacing: .1em;
    color: var(--color-cream-1)
}

.s-testimonials__buttons {
    position: absolute;
    top: 5.3rem;
    display: none;
    width: 100%
}

.s-testimonials.has-js .s-testimonials__buttons {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between
}

.s-testimonials.has-js .s-testimonials__item {
    display: none
}

.s-testimonials.has-js .s-testimonials__item.is-visible {
    display: flex
}

.s-testimonials__prev, .s-testimonials__next {
    background: none;
    border: none;
    cursor: pointer
}

.s-testimonials__prev:disabled, .s-testimonials__next:disabled {
    opacity: 0;
    pointer-events: none
}

.s-testimonials__prev:after, .s-testimonials__next:after {
    display: block;
    width: 1.1rem;
    height: 1.85rem;
    background: var(--color-cream-2);
    transition: .05s ease-in-out;
    transition-property: transform, background;
    content: "";
    -webkit-mask: url("../images/arrow-right.svg") no-repeat center/contain;
    mask: url("../images/arrow-right.svg") no-repeat center/contain;
    mask-mode: alpha
}

.s-testimonials__prev:hover:after, .s-testimonials__next:hover:after {
    background: var(--color-accent-1);
    transform: translateX(50%)
}

.s-testimonials__prev {
    transform: rotate(180deg) translateX(100%)
}

@media only screen and (max-width: 1680px) {
    .s-testimonials__prev {
        margin-left: -2rem;
        transform: rotate(180deg)
    }
}

@media only screen and (max-width: 987px) {
    .s-testimonials__prev {
        margin: 0;
        transform: rotate(180deg)
    }
}

.s-testimonials__next {
    transform: translateX(100%)
}

@media only screen and (max-width: 1680px) {
    .s-testimonials__next {
        margin-right: -2rem;
        transform: none
    }
}

@media only screen and (max-width: 987px) {
    .s-testimonials__next {
        margin: 0;
        transform: none
    }
}

.s-testimonials__bg {
    position: relative;
    margin-top: 8.5rem;
    height: 24vw;
    max-height: 23rem
}

@media only screen and (max-width: 987px) {
    .s-testimonials__bg {
        margin-top: 5rem
    }
}

.s-testimonials__bg-inner, .s-testimonials__bg:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    will-change: transform
}

.s-testimonials__bg:after {
    background: url("../images/presentation/lines.svg") no-repeat center/cover;
}

.s-testimonials__bg-inner {
    /*background: url("../images/testimonials.svg") repeat-x top/contain*/
}

.s-testimonials.has-js .s__anim {
    width: 100%;
    -webkit-clip-path: inset(-2% 0%);
    clip-path: inset(-2% 0%);
    transform: translateZ(0)
}

.s-testimonials.has-js .s__anim > span {
    display: inline-block;
    transform: translateY(130%)
}

.s-testimonials.has-js .s-testimonials__items {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%
}
