/* ==================== ШРИФТЫ ==================== */
@font-face {
    font-family: 'Ubuntu';
    src: url('font/Ubuntu-Regular.eot');
    src: local('Ubuntu Regular'), local('Ubuntu-Regular'),
        url('font/Ubuntu-Regular.eot?#iefix') format('embedded-opentype'),
        url('font/Ubuntu-Regular.woff') format('woff'),
        url('font/Ubuntu-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Ubuntu';
    src: url('font/Ubuntu-Medium.eot');
    src: local('Ubuntu Medium'), local('Ubuntu-Medium'),
        url('font/Ubuntu-Medium.eot?#iefix') format('embedded-opentype'),
        url('font/Ubuntu-Medium.woff') format('woff'),
        url('font/Ubuntu-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

/* ==================== БАЗОВЫЕ СТИЛИ ==================== */
*, ::after, ::before {
    box-sizing: border-box;
}

* {
    -webkit-tap-highlight-color: transparent;
    margin: 0;
    padding: 0;
}

script {
    display: none !important;
}


html, body {
    height: 100%;
    position: relative;
}

@media only screen and (min-width: 1200px) {
    html, body {
        overflow: hidden;
    }
}

body {
    min-height: 100vh;
    scroll-behavior: smooth;
    text-rendering: optimizeSpeed;
    line-height: 1.5;
    background: url(bg.png) center 0 / 100% auto no-repeat fixed, 
                radial-gradient(50% 50% at 50% 50%, #c95af7 0%, #6e3cb4 100%);
    font-family: 'Ubuntu', sans-serif;
    font-size: 1rem;
    font-weight: 400;
    color: #FFFFFF;
}

/* ==================== ПРЕЛОАДЕР ==================== */
.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #8a54d5 0%, #8a54d5 100%);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    visibility: visible;
    transition: opacity 0.5s ease, visibility 0.5s ease;
}

.preloader.preloader--hidden {
    opacity: 0;
    visibility: hidden;
}

.preloader__inner {
    text-align: center;
}

.preloader__snowflake {
    width: 80px;
    height: 80px;
    margin: 0 auto 20px;
    animation: rotateSnowflake 2s linear infinite;
}

.preloader__snowflake img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.preloader__text {
    color: white;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.5px;
    animation: pulseText 1.5s ease-in-out infinite;
}

@keyframes rotateSnowflake {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes pulseText {
    0%, 100% { opacity: 0.7; }
    50% { opacity: 1; }
}

/* ==================== ШАПКА ==================== */
.page-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: transparent;
    height: 72px;
}

.page-header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
    padding: 16px;
}

.page-header .header-logo-wrapper {
    display: inline-flex;
    align-items: center;
}

.page-header .header-logo-wrapper .logo-link {
    display: block;
    outline: 0;
    margin-top: -4px;
}

.page-header .header-nav-wrapper {
    display: flex;
    flex: 1;
    align-items: center;
}

.page-header .header-buttons {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-left: -12px;
}

.page-header .header-buttons .header-buttons-item {
    height: 100%;
    display: flex;
    align-items: center;
    padding-left: 12px;
}

.page-header .header-buttons .header-button {
    border: none;
    margin: 0;
    padding: 0 32px;
    cursor: pointer;
    text-decoration: none;
    transition: all ease .3s;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    border-radius: 24px;
    background: linear-gradient(90deg, #8a54d5 0%, #8a54d5 100%);
    color: #fff;
    height: 32px;
    font-size: 1rem;
    box-sizing: border-box;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
}

.page-header .header-buttons .header-button:hover {
    background: linear-gradient(90deg, #aa32de 0%, #8a54d5 100%);
}

/* ==================== ОСНОВНЫЕ КОНТЕЙНЕРЫ ==================== */
.page-wraper {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    position: relative;
    width: 100%;
    overflow: visible;
}

.main-container {
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;
}

[data-scroll-section] {
    width: 100%;
    position: relative;
}

/* ==================== КОМПОНЕНТЫ ==================== */
img {
    border-style: none;
    height: auto;
    max-width: 100%;
    vertical-align: middle;
    user-select: none;
    cursor: default;
}

img[data-zoomable] {
    cursor: zoom-in;
}

.parallax-element {
    user-select: none;
    pointer-events: none;
    will-change: transform;
}

button, input, select, textarea {
    font: inherit;
    font-family: 'Ubuntu', sans-serif;
}

/* Лайтбокс */
.image-lightbox {
    display: none;
    position: fixed;
    top: 0; 
    left: 0;
    width: 100%; 
    height: 100%;
    background: rgba(0,0,0,0.55);
    z-index: 9999;
    align-items: center;
    justify-content: center;
}

.image-lightbox.active { 
    display: flex; 
}

.lightbox-img { 
    max-width: 90%; 
    max-height: 90%; 
}

.lightbox-close {
    position: absolute;
    top: 20px; 
    right: 30px;
    color: white; 
    font-size: 40px;
    cursor: pointer;
}

/* ==================== ТЕКСТОВЫЕ БЛОКИ ==================== */
.text-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.text-title {
    font-size: max(3rem, 2vw);
    font-weight: 500;
    margin: 0.5rem 1rem;
    line-height: 1.1;
}

.text-body {
    line-height: 1.4;
    font-size: clamp(1.1rem, 0.8vw, 1.5rem);
    width: clamp(20rem, 46vw, 68rem);
    margin: 0.75rem auto 0;
    max-width: 800px;
    color: #faeeff;
}

.text-image-wrapper {
    position: relative;
    width: 90%;
    margin: 1rem 0 auto;
}

.text-icon {
    width: 1.8rem;
    margin: auto;
}

/* ==================== СЕКЦИЯ ПРИВЕТСТВИЯ ==================== */
.section-intro {
    position: relative;
    text-align: center;
}

.section-intro-inner {
    position: relative;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

@supports (height: 100dvh) {
    .section-intro-inner {
        height: 100dvh;
    }
}

/* Декоративные элементы */
.decoration-element {
    position: absolute;
    pointer-events: none;
}

.decoration-left {
    top: 35%;
    left: -8rem;
    width: 60%;
}

.decoration-right {
    top: 30%;
    width: 45%;
    right: -2rem;
}

.decoration-small {
    width: 10%;
    z-index: -1;
}

.decoration-pos-1 {
    bottom: 0;
    left: 20%;
    max-width: 6rem;
}

.decoration-pos-2 {
    right: 8%;
    bottom: 20%;
    max-width: 6rem;
}

.decoration-pos-3 {
    right: 88%;
    top: 28%;
    max-width: 6rem;
}

/* ==================== СЕКЦИЯ ФОТОГРАФИЙ ==================== */
.section-photos {
    position: relative;
    height: 250vh;
}

@supports (height: 250svh) {
    .section-photos {
        height: 250svh;
    }
}

.section-photos-inner {
    position: relative;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

@supports (height: 100dvh) {
    .section-photos-inner {
        height: 100dvh;
    }
}

.sticky-content {
    position: sticky;
    top: 0;
}

/* Элементы фотографий */
.photo-element {
    position: absolute;
    pointer-events: none;
    z-index: -1;
    max-width: 22rem;
    width: 23%;
}

.photo-1 {
    top: 32%;
    left: 2%;
    transform: rotate(15deg);
}

.photo-2 {
    top: 25%;
    right: 4%;
    transform: rotate(-10deg);
}

.photo-3 {
    top: 65%;
    right: 5%;
    transform: rotate(25deg);
    z-index: -1;
}

.photo-4 {
    top: 64%;
    left: 10%;
    transform: rotate(-20deg);
}

.photo-5 {
    top: 86%;
    right: 12%;
    transform: rotate(5deg);
    z-index: -1;
}

.photo-6 {
    top: 80%;
    left: 1%;
    transform: rotate(-15deg);
}

.photo-7 {
    top: 45%;
    right: 16%;
    transform: rotate(30deg);
    z-index: -1;
}

.photo-8 {
    top: 92%;
    left: 20%;
    transform: rotate(-25deg);
}

.decoration-emoji {
    top: 55%;
    left: 5%;
    width: 10%;
    transform: rotate(10deg);
}

/* ==================== СЕКЦИЯ ОТЗЫВОВ ==================== */
.section-feedback {
    position: relative;
}

.section-feedback-header {
    position: relative;
    height: 75vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
}

@supports (height: 75svh) {
    .section-feedback-header {
        height: 75svh;
    }
}

.sticky-feedback-section {
    position: relative;
    height: 400vh;
}

@supports (height: 400svh) {
    .sticky-feedback-section {
        height: 400svh;
    }
}

.sticky-feedback-container {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

@supports (height: 100dvh) {
    .sticky-feedback-container {
        height: 100dvh;
    }
}

/* Карточки отзывов */
.feedback-cards {
    --size: 88vmin;
    position: relative;
    height: 100%;
    width: var(--size);
    max-width: 620px;
}

.feedback-card {
    position: absolute;
    top: calc(50% - var(--size) / 2);
    width: 100%;
    height: 100%;
    transform-origin: top center;
}

.feedback-card:nth-of-type(1) .feedback-content {
    transform: rotate(-5deg);
}

.feedback-card:nth-of-type(2) .feedback-content {
    transform: rotate(-2deg);
}

.feedback-card:nth-of-type(3) .feedback-content {
    transform: rotate(1deg);
}

.feedback-card:nth-of-type(4) .feedback-content {
    transform: rotate(4deg);
}

.feedback-content {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    border-radius: 5rem;
}

/* Элементы оформления отзывов */
.feedback-decoration {
    position: absolute;
    pointer-events: none;
    z-index: -1;
}

.decoration-top-left {
    width: 22%;
    top: 15%;
    left: 14%;
}

.decoration-top-right {
    width: 30%;
    right: 5%;
    top: 35%;
}

.decoration-bottom-right {
    right: 3%;
    bottom: 50%;
    width: 30%;
}

.decoration-bottom-left {
    left: 3%;
    bottom: 40%;
    width: 30%;
}

.decoration-bottom-center {
    right: 3%;
    bottom: -36%;
    width: 50%;
}

.decoration-large-left {
    left: -5%;
    bottom: 20%;
    width: 35%;
}

/* ==================== СЕКЦИЯ ПРИЗЫВА К ДЕЙСТВИЮ ==================== */
.section-cta {
    position: relative;
    height: auto;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem 0;
}

@supports (height: 100dvh) {
    .section-cta {
        min-height: 100dvh;
    }
}

.cta-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.cta-text-block {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
}

.cta-text-large {
    position: relative;
    width: 80%;
    display: grid;
    grid-auto-flow: column;
    align-items: flex-end;
    margin-top: -1rem;
    transform: scale(.94);
    transition: transform 0s cubic-bezier(.25, .46, .45, .94);
    z-index: 1;
}

.cta-text-visible .cta-text-large {
    transform: scale(1);
    transition-duration: 2s;
    transition-delay: .5s;
}

.cta-letter {
    position: relative;
    opacity: 0;
    filter: blur(4px);
    transform: translateY(20%);
    transition: all 0s cubic-bezier(.25, .46, .45, .94);
}

.cta-letter img {
    width: 100%;
}

.cta-text-visible .cta-letter {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
    transition-duration: 1.6s;
}

.cta-text-visible .cta-letter:nth-child(1) { transition-delay: .3s; }
.cta-text-visible .cta-letter:nth-child(2) { transition-delay: .5s; }
.cta-text-visible .cta-letter:nth-child(3) { transition-delay: .7s; }
.cta-text-visible .cta-letter:nth-child(4) { transition-delay: .9s; }
.cta-text-visible .cta-letter:nth-child(5) { transition-delay: 1s; }
.cta-text-visible .cta-letter:nth-child(6) { transition-delay: 1.2s; }

.letter-spacing-right {
    margin-right: -1.6vw;
}

.cta-body {
    opacity: 0;
    transform: translateY(20%);
    transition: transform 0s cubic-bezier(.215, .61, .355, 1), 
                opacity 0s cubic-bezier(.215, .61, .355, 1);
}

.cta-text-visible .cta-body {
    transform: translateY(0);
    opacity: 1;
    transition-duration: 1s;
    transition-delay: 1.2s;
}

/* Кнопки CTA */
.cta-buttons {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    gap: 1rem;
    margin: 0 auto 2rem;
    opacity: 0;
    transform: translateY(20%);
    transition: transform 0s cubic-bezier(.215, .61, .355, 1), 
                opacity 0s cubic-bezier(.215, .61, .355, 1);
}

.cta-text-visible .cta-buttons {
    transform: translateY(0);
    opacity: 1;
    transition-duration: 1s;
    transition-delay: 1.6s;
}

.action-button {
    font-size: 1rem;
    line-height: 80%;
    border-radius: 1000px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 24px;
    cursor: pointer;
    flex-basis: 50%;
    color: #fff;
    text-decoration: none;
    background: #ff585b;
    transition: all ease .3s;
    font-weight: 500;
    border: none;
    box-sizing: border-box;
}

.action-button:hover {
    background: #ff8285;
}

/* Декор CTA */
.cta-decoration {
    position: absolute;
}

.cta-decoration-smarty {
    bottom: 0;
    z-index: 1;
}

.cta-decoration-tree {
    bottom: 0;
    right: -20%;
    z-index: -1;
    width: 65%;
}

.cta-decoration-1 {
    top: 58%;
    left: 8%;
    width: 30%;
    max-width: 18rem;
    z-index: -1;
}

.cta-decoration-2 {
    top: -26%;
    right: 25%;
    width: 50%;
    max-width: 26rem;
}

.cta-decoration-3 {
    left: 4%;
    width: 50%;
    bottom: 70%;
}

.cta-decoration-4 {
    bottom: 40%;
    right: 10%;
    width: 10%;
}

/* ==================== КОМПОНЕНТЫ ОТЗЫВОВ ==================== */
.feedback-wrapper {
    backdrop-filter: blur(16px);
    box-shadow: inset -42px 42px 42px 0 rgba(255, 255, 255, 0.08), 
                inset 42px -42px 42px 0 rgba(194, 194, 194, 0.08);
    background: rgba(255, 255, 255, 0.24);
    border-radius: 24px;
    padding: 24px;
}

.feedback-screenshot {
    border-radius: 16px;
    background: #fff;
    margin-bottom: 24px;
    overflow: hidden;
}

.feedback-smarty {
    display: flex;
    gap: 16px;
    align-items: flex-end;
}

.smarty-img {
    width: 20%;
    height: 20%;
    flex: 0 0 auto;
}

.smarty-img img {
    width: 100%;
    height: 100%;
}

.smarty-text {
    border-radius: 16px 16px 16px 0;
    padding: 24px;
    background: #6e3cb4;
    font-size: 1rem;
    line-height: 140%;
    color: #fff;
}

/* ==================== МЕДИА-ЗАПРОСЫ ДЛЯ ПЛАНШЕТОВ И ВЫШЕ ==================== */
@media only screen and (min-width: 1200px) {
    /* Шапка */
    .page-header .header-buttons .header-button {
        font-size: 1rem;
        height: 48px;
    }
    
    .page-header {
        height: 92px;
    }
    
    .page-header .container {
        padding: 24px 32px 20px;
    }
    
    .page-header .header-buttons .header-buttons-item {
        padding-left: 20px;
    }
    
    .page-header .header-buttons {
        margin-left: -20px;
    }
    
    .page-header .header-logo-wrapper .logo-link {
        margin-top: -16px;
    }
    
    /* Текстовые блоки */
    .text-image-wrapper {
        width: min(1140px, 56vw);
    }
    
    .text-icon {
        width: 2vw;
    }
    
    /* Декоративные элементы */
    .decoration-left {
        left: clamp(-10%, calc(-10% + 4% * max(0px, min(480px, 100vw - 1440px)) / 480px), -6%);
        width: min(612px, 35vw);
        top: 37%;
    }
    
    .decoration-right {
        top: 18%;
        right: -6%;
        width: min(664px, 35vw);
    }
    
    .decoration-small {
        width: 6%;
    }
    
    /* Фотографии */
    .photo-element {
        width: 17%;
    }
    
    .decoration-emoji {
        width: 8%;
    }
    
    /* Отзывы */
    .section-feedback-header {
        height: 100vh;
    }
    
    .sticky-feedback-section {
        height: 500vh;
    }
    
    @supports (height: 500svh) {
        .sticky-feedback-section {
            height: 500svh;
        }
    }
    
    .feedback-cards {
        --size: 70vmin;
    }
    
    .decoration-top-left {
        width: 16%;
        max-width: 20rem;
        top: 4%;
        left: 14%;
    }
    
    .decoration-top-right {
        right: 20%;
        top: 6%;
        width: 36%;
        max-width: 28rem;
    }
    
    .decoration-bottom-right {
        width: 24%;
        max-width: 34rem;
    }
    
    .decoration-bottom-left {
        bottom: 15%;
        width: 12%;
        max-width: 20rem;
    }
    
    .decoration-bottom-center {
        bottom: -60%;
        width: 30%;
        max-width: 30rem;
        right: 3%;
    }
    
    .decoration-large-left {
        width: 30%;
        max-width: 38em;
    }
    
    /* CTA секция */
    .cta-text-large {
        width: 60%;
        margin-top: 1vw;
    }
    
    .cta-buttons {
        flex-direction: row;
        align-items: stretch;
        justify-content: center;
        width: 95%;
        margin: 1.5% 0;
        gap: 1vw;
    }
    
    .action-button {
        width: min-content;
        font-size: clamp(1.1rem, 0.8vw, 1.5rem);
        padding: 24px 32px;
    }
    
    .cta-decoration-tree {
        bottom: 0;
        right: -12%;
        width: 40%;
    }
    
    .cta-decoration-1 {
        top: 50%;
        left: 8%;
        width: 20%;
        max-width: 16rem;
    }
    
    .cta-decoration-2 {
        right: 30%;
        top: -60%;
        width: 30%;
        max-width: 26rem;
    }
    
    .cta-decoration-3 {
        width: 80%;
        max-width: 30rem;
        left: 4%;
        top: -40%;
    }
    
    .cta-decoration-4 {
        bottom: 68%;
        right: 20%;
        width: 4%;
        max-width: 6rem;
    }
}

/* ==================== МЕДИА-ЗАПРОСЫ ДЛЯ МОБИЛЬНЫХ ==================== */
@media (max-width: 768px) {
    html, body {
        overflow-x: hidden;
        width: 100%;
        position: relative;
    }
        
    body {
        background: url(bg.png) center center / 200% auto no-repeat fixed, 
                    radial-gradient(50% 50% at 50% 50%, #c95af7 0%, #6e3cb4 100%);
    }
    
    .page-wraper {
        overflow-x: hidden;
    }
    
    .text-title {
        font-size: 2rem;
    }
    
    .text-body {
        font-size: 1rem;
        width: 90%;
    }
    
    .photo-element {
        width: 30%;
        max-width: 150px;
    }
    
    .photo-7,
    .photo-5,
    .photo-8 {
        display: none;
    }
    
    .page-header .header-buttons .header-button {
        padding: 20px 16px;
        font-size: 0.875rem;
    }
    
    .decoration-pos-1 {
        bottom: 0;
        left: 10%;
        max-width: 16rem;
        width: 30%;
    }
}

@media (max-width: 560px) {
    .header-logo-wrapper .logo-link .header-logo-image {
        width: 124px;
    }
    
    .text-body {
        font-size: 0.875rem;
    }
    
    .decoration-right {
        top: 40%;
        width: 45%;
        right: -2rem;
    }
    
    .decoration-left {
        top: 42%;
        left: -6rem;
        width: 60%;
    }
    
    .decoration-pos-3 {
        max-width: 8rem;
        width: 20%;
        top: 24%;
        right: 76%;
    }
    
    .decoration-pos-2 {
        right: 8%;
        bottom: 23%;
        max-width: 8rem;
        width: 16%;
    }
    
    .decoration-top-left.ball {
        width: 30%;
        top: -16%;
        left: 14%;
    }
    
    .decoration-top-right {
        width: 55%;
        right: 5%;
        top: 16%;
    }
    
    .smarty-text {
        font-size: 0.875rem;
    }
    
    .smarty-img {
        width: 16%;
        height: 16%;
    }
    
    .feedback-wrapper {
        padding: 16px;
    }
    
    .decoration-bottom-center {
        bottom: -25%;
    }
    
    .cta-text-large {
        margin-top: 0;
    }
    
    .cta-decoration-4 {
        bottom: 80%;
        right: 10%;
        width: 16%;
    }
}

/* ==================== ДОСТУПНОСТЬ ==================== */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/*! locomotive-scroll v4.1.3 | MIT License | https://github.com/locomotivemtl/locomotive-scroll */
html.has-scroll-smooth {
    overflow: hidden
}

html.has-scroll-dragging {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.has-scroll-smooth body {
    overflow: hidden
}

.has-scroll-smooth [data-scroll-container] {
    min-height: 100vh
}

[data-scroll-direction=horizontal] [data-scroll-container] {
    display: inline-block;
    height: 100vh;
    white-space: nowrap
}

[data-scroll-direction=horizontal] [data-scroll-section] {
    display: inline-block;
    height: 100%;
    vertical-align: top;
    white-space: nowrap
}

.c-scrollbar {
    height: 100%;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    transform-origin: center right;
    transition: transform .3s,opacity .3s;
    width: 11px
}

.c-scrollbar:hover {
    transform: scaleX(1.45)
}

.c-scrollbar:hover,.has-scroll-dragging .c-scrollbar,.has-scroll-scrolling .c-scrollbar {
    opacity: 1
}

[data-scroll-direction=horizontal] .c-scrollbar {
    bottom: 0;
    height: 10px;
    top: auto;
    transform: scaleY(1);
    width: 100%
}

[data-scroll-direction=horizontal] .c-scrollbar:hover {
    transform: scaleY(1.3)
}

.c-scrollbar_thumb {
    background-color: #000;
    border-radius: 10px;
    cursor: -webkit-grab;
    cursor: grab;
    margin: 2px;
    opacity: .5;
    position: absolute;
    right: 0;
    top: 0;
    width: 7px
}

.has-scroll-dragging .c-scrollbar_thumb {
    cursor: -webkit-grabbing;
    cursor: grabbing
}

[data-scroll-direction=horizontal] .c-scrollbar_thumb {
    bottom: 0;
    right: auto
}