/* Tutorials. */

.tutorials {

}

.tutorials-head {
    flex-wrap: wrap;
}

.tutorials-content  {
    max-width: 636px;
    text-wrap: balance;
}

.tutorials-list:not(:first-child) {
    margin-top: var(--i1);
}

.tutorials-li {
    box-shadow: 0 10px 30px rgba(0, 0, 0, .03);
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
}

.tutorials-li__media {
    position: relative;
}

.tutorials-li__media button {
    --size: 100px;

    position: absolute;
    top: calc(50% - var(--size) * .5);
    left: calc(50% - var(--size) * .5);

    width: var(--size);
}

.tutorials-li__media button img {
    aspect-ratio: auto;
}

.tutorials-li__media video,
.tutorials-li__media img {
    width: 100%;
    aspect-ratio: 635/380;
    object-fit: cover;
    object-position: center;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
}

.tutorials-li__content {
    padding: var(--i4)
}

/* Tutorials. */