/* GENERAL START*/
* {
    box-sizing: border-box;
}

::-webkit-scrollbar {
    width: 0em;
    height: 0em;
}

::-webkit-scrollbar-button {
    width: 0em;
    height: 0em;
}

::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0);
}

/*thumb*/
::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0);
}

/*thumb hover*/
::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0);
}

/*thumb pressed*/
::-webkit-scrollbar-thumb:active {
    background: rgba(255, 255, 255, 1);
}

/* GENERAL END*/

::selection {
    color: #ffffff;
    background-color: #ff0000;
    -webkit-text-fill-color: #ffffff;
}

/* GRID START */
* {
    box-sizing: border-box;
}

.one-grid-column {
    width: 100%;
    height: 100vh;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.35s cubic-bezier(0.43, 0.195, 0.02, 1);
    overflow: hidden;
}

.one-grid-column.expand {
    transform: scaleX(1);
    transform-origin: left;
}

.one-grid-column.instant-expand {
    transform: scaleX(1);
    transform-origin: left;
    transition: none;
}

/* GRID END */

/* SHUFFLE START */
.shuffle {
    transition: transform 2s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/* SHUFFLE END */

/* PROJECT BADGE START */
.project-badge {
    position: absolute;
    bottom: 0;
    left: 0;
    transform: rotate(-90deg) translate(0, 100%);
    transform-origin: bottom left;
}

/* PROJECT BADGE END */



.truth,
.long-truth,
.text-big-logo,
.spacer-horizontal-rule-top,
.horizontal-rule,
.spacer-horizontal-rule-bot,
.vertical-rule {
    visibility: hidden;
    /* Полностью скрываем элементы до анимации */
}

.truth span,
.long-truth span,
.symbol-truth span {
    opacity: 0;
    display: inline;
    white-space: inherit;
}



.transition {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: none;
    z-index: 99999;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(256px);
    /* fucking iOS */
}


/* Контейнер для курсоров, не влияющий на скролл */
.cursor-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 9999;
}

.remote-cursor {
    position: absolute;
    transform: translate(-50%, -50%);
    transition: transform 0.1s linear;
}