/* -+-----------------+--------------------------+---- */
/* +------------+------------+--------------+------+-- */
/* ----+--------------+------------*=@---------------- */
/* ---------------+---------------@@@@@-------+------- */
/* --------+----------------------*@@@%-----------+--- */
/* --+----------------+------------%%%%=-------------- */
/* ---------------------------=*%%::-+**=.**=--+------ */
/* ---------+----------------#@@@%-::::::::%%--------- */
/* ----+---------+-----------@@@@%==----::-%@%-------- */
/* -------------------------*@@@@#*+=-----=@@@-------- */
/* -+------+---------+------@@@-#%#+==---=--@@%----+-- */
/* -----+--------+---------@@@*-=%#*+=--==-*@@*------- */
/* -----------------------+@@=---##*==-===-@@%---+---- */
/* --+-----+- Ah shit, here we go again. -#@*--------- */
/* ----------------+------@@@----%%*++====+@--------+- */
/* ------+----------------@@@---%%#*+=++-+@=----+----- */

/* START */

@font-face {
    font-family: 'GT Flexa';
    src: url('../fonts/public/GT-Flexa-GX.woff2') format('woff2'),
        url('../fonts/public/GT-Flexa-GX.ttf') format('truetype');
}

@font-face {
    font-family: 'GT Flexa Mono';
    src: url('../fonts/public/GT-Flexa-Mono-GX.woff2') format('woff2'),
        url('../fonts/public/GT-Flexa-Mono-GX.ttf') format('truetype');
}

:root {
    /* variables */
    --black: #101010;
    --white: #fff;
    --grey-1: #808080;
    --grey-2: #E0E0E0;

    --green: #009900;
    --lilac: #CC99FF;

    --sans-font: "GT Flexa", sans-serif;
    --mono-font: "GT Flexa Mono", monospace;

    --theme-background: var(--white);
    --theme-background-accent: var(--green);

    --theme-text: var(--black);
    --theme-text-accent: var(--lilac);

    --theme-graphics-background: var(--lilac);
    --theme-graphics-background-accent: var(--green);
    --theme-graphics-text: var(--black);
    --theme-graphics-text-accent: var(--white);

    --theme-btn-background: var(--black);
    --theme-btn-background-hover: var(--grey-1);
    --theme-btn-background-accent: var(--white);
    --theme-btn-text: var(--grey-2);
    --theme-btn-text-accent: var(--white);
    --theme-btn-stroke: var(--grey-1);
    --theme-btn-stroke-accent: var(--black);

    /*
    --theme-btn-background: var(--black);
    --theme-btn-text: var(--grey-2);
    --theme-btn-stroke: var(--grey-1);
*/

    /*
    --theme-btn-secondary-background: var(--grey-2);
    --theme-btn-secondary-text: var(--black);
    --theme-btn-secondary-stroke: var(--grey-1);
*/

    --outer-padding: 1rem;

    --100vh: calc(var(--vh) * 100);
}

.bg-grain {
    opacity: 0.2;
}

::scrollbar {
    display: none;
}

::-webkit-scrollbar {
    width: 0px;
}

::-webkit-scrollbar-track {
    box-shadow: inset 0 0 0px transparent;
    border-radius: 0px;
}

::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 0px;
}

@media screen and (hover:hover){
    ::-webkit-scrollbar-thumb:hover {
        background: transparent;
    }
}

::selection {
    background-color: var(--theme-background-accent);
    color: var(--theme-background);
}

* {
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

html,
body {
    position: relative;
    font-size: 10px;
    background-color: var(--theme-background);
    color: var(--theme-text);
    height: var(--100vh);
    min-height: var(--100vh);
    width: 100vw;
    overflow-y: hidden;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    scroll-behavior: smooth;
}

body {
    font-family: var(--sans-font);
    font-variation-settings: 'wght'300, 'wdth'115;
    font-feature-settings: 'liga', 'ss03', 'ss04';
    letter-spacing: .025em;
    line-height: 1;
}

@media screen and (max-width: 1920px) {
    html,
    body {
        font-size: calc(.6rem + (100vw - 1920px) / 400);
    }
}

@media screen and (max-width: 1760px) {
    html,
    body {
        font-size: calc(.55rem + (100vw - 1760px) / 400);
    }
}

@media screen and (max-width: 1440px) {
    html,
    body {
        font-size: calc(.525rem + (100vw - 1440px) / 400);
/*        font-size: calc(.9rem + (100vw - 1300px) / 400);*/
    }
}

@media screen and (max-width: 1280px) {
    html,
    body {
        font-size: calc(.5rem + (100vw - 1280px) / 400);
    }
}

@media screen and (max-width: 1080px) {
    html,
    body {
        font-size: calc(.4825rem + (100vw - 1080px) / 400);
    }
}

@media screen and (max-width: 900px) {
    :root{
        --outer-padding: .5rem;
    }
    
    html,
    body {
        font-size: calc(9px + (100vw - 900px) / 400);
    }
    
    html:has(.page.collection-columns),
    body.page.collection-columns{
        overflow-y: auto;
    }
}

@media screen and (max-width: 700px) {
    html,
    body {
        font-size: calc(8.5px + (100vw - 700px) / 400);
    }
}

@media screen and (max-width: 500px) {
    html,
    body {
        font-size: calc(7.5px + (100vw - 500px) / 400);
    }
}

@media screen and (max-width: 350px) {
    html,
    body {
        font-size: calc(6.5px + (100vw - 350px) / 400);
    }
}

/* TEXT SETUP */

.text,
.title,
.label {
    transition: all .25s cubic-bezier(0.33, 1, 0.68, 1);
    transition-property: font-size, letter-spacing, font-variation-settings, color, background-color;
    line-height: 1;
}

/* GENERAL */

.text {}

.text.large {
    font-variation-settings: 'wght'240, 'wdth'115;
    font-size: 3.6rem;
    line-height: 1.15;
}

.text.medium {
    font-variation-settings: 'wght'300, 'wdth'90;
    font-size: 2.4rem;
    line-height: 1.3;
}

.text.small {
    font-variation-settings: 'wght'500, 'wdth'100;
    font-size: 1.8rem;
    line-height: 1.2;
}

@media screen and (max-width: 900px){
    .text.medium {
        font-size: 2.1rem;
    }
}

/* TITLES */

.title {}

.title.large {
    font-variation-settings: 'wght'720, 'wdth'200;
    font-size: 7.2rem;

    line-height: 0.75;
    padding-top: .1em !important;
    letter-spacing: -.05em;
}

.title.medium {
    font-variation-settings: 'wght'600, 'wdth'60;
    font-size: 4.8rem;

    line-height: 0.75;
    padding-top: .1em !important;
    letter-spacing: -.01em;
}

.title.small {
    font-variation-settings: 'wght'600, 'wdth'60;
    font-size: 3.6rem;

    line-height: 0.75;
    padding-top: .1em !important;
    letter-spacing: -.01em;
}

.fit-title:has(.title) {
    --wdth: 155;
}

.title.tiny {
    font-variation-settings: 'wght'600, 'wdth'var(--wdth);
    font-size: 2.4rem;
    letter-spacing: -.06em;
    line-height: 0.75;
    padding: .2em 10px .1em;

    transition-property: font-size, font-variation-settings, letter-spacing, color;
}

@media screen and (max-width: 700px){
    .fit-title:has(.title) {
/*        --wdth: 120;*/
    }
    
    .title.tiny {
        font-size: 3.2rem;
    }
}

/* LABELS */

.label {}

.label.large {
    font-variation-settings: 'wght'700, 'wdth'75;
    font-size: 4.8rem;

    line-height: 0.75;
    padding-top: .1em !important;
    letter-spacing: -.035em;
}

.label.medium {
    font-variation-settings: 'wght'600, 'wdth'75;
    font-size: 3.6rem;

    line-height: 0.75;
    padding-top: .1em !important;
    letter-spacing: -.02em;
}

.label.small {
    font-family: var(--mono-font);
    letter-spacing: .05em;
    text-transform: uppercase;
    font-variation-settings: 'wght'240;
    font-size: 1.4rem;
    
    padding: .5rem .8rem .2rem;
}

.label.tiny {
    font-variation-settings: 'wght'240;
    font-size: 1.2rem;
    letter-spacing: .05em;
    text-transform: uppercase;
    line-height: 0.75;
    padding: .4em 1rem .2em;
    
    padding: .4rem .6rem .3rem .6rem;
}

/* BUTTONS */

.btn {
    display: flex;
    width: fit-content;
    height: fit-content;
    text-align: center;
    font-feature-settings: "case";
    background-color: var(--theme-btn-background);
    color: var(--theme-btn-text);
    border-bottom: solid 1px var(--theme-btn-stroke);
    user-select: none;
}

.btn.primary {
    --theme-btn-background: var(--black);
    --theme-btn-text: var(--grey-2);
    --theme-btn-stroke: var(--grey-1);
}

.btn.primary.label {
    --theme-btn-background: var(--green);
    --theme-btn-text: var(--white);
    --theme-btn-stroke: var(--black);
}

.btn.primary:not(.label) {
    text-transform: uppercase;
}

.nav-item .btn,
.section-label {
    white-space: nowrap;

}

.btn.secondary:not(.label) {
    text-transform: uppercase;
}

.btn.primary.title.tiny {
    --theme-btn-background: var(--lilac);
    --theme-btn-text: var(--black);
    --theme-btn-stroke: var(--grey-1);
}

.btn.primary.title.large {
    --theme-btn-background: var(--lilac);
    --theme-btn-text: var(--black);
    --theme-btn-stroke: var(--grey-1);
}

.btn.primary.title.medium {
    --theme-btn-background: var(--lilac);
    --theme-btn-text: var(--black);
    --theme-btn-stroke: var(--grey-1);
}


.btn.label.secondary {
    --theme-btn-background: var(--grey-2);
    --theme-btn-text: var(--black);
    --theme-btn-stroke: var(--grey-1);
}

.btn.large {
    padding: 0 1rem;
}

.btn.medium {
    padding: .2rem 1rem 0 1rem;
}

.btn.small {
/*    padding: 2px 10px 0 10px;*/
}

.btn.tiny {}

.btn.label {
    font-family: var(--mono-font);
}

.btn.section-label {
    font-family: var(--sans-font);
    padding: .3rem 4vw 0 1rem;
    border-top: solid 1px var(--theme-btn-stroke);
    border-bottom: none;
}

@media screen and (hover:hover){
    .btn.title.primary:not(.tiny):hover {
        font-variation-settings: 'wght'600, 'wdth'200;
        letter-spacing: -.06em;
    }
    
    .btn.label:has(a):hover {
        --theme-btn-background: var(--grey-1);
        --theme-btn-text: var(--black);
        --theme-btn-stroke: var(--black);
    }
    
    .btn.label.secondary:has(a):hover {
        --theme-btn-background: var(--grey-1);
        --theme-btn-text: var(--black);
        --theme-btn-stroke: var(--black);
    }
}

/* LOGO */

.logo-wrapper {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 1rem;
    padding: var(--outer-padding);
}

.logo .inner-wrapper svg {
    height: 4.5rem;
}

.logo .logo-lettering svg #slashes path {
    fill: transparent !important;
}

.logo-parent svg g:not(:last-of-type) {
    fill: var(--lilac) !important;
}

.logo-parent svg g:last-of-type path {
    fill: var(--black) !important;
}

/* NAVIGATION */

header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 1rem;

    position: fixed;
    top: 0;
    left: 0;

    width: 100%;

    z-index: 9999;
}

nav {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0;
    z-index: 999;
}

nav .logo-wrapper {}

nav .list-menu {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-end;
}

nav .nav-menu {
    gap: 0 1rem;
}

nav .lang-menu {
    gap: 0 .5rem;
}

nav .lang-menu .active .btn{
    background-color: var(--grey-1);
    color: var(--grey-2);
}

nav .nav-menu .nav-item:nth-child(3n + 1) .btn {
    background-color: var(--black);
    color: var(--grey-2);
}

nav .nav-menu .nav-item:nth-child(3n + 2) .btn {
    background-color: var(--white);
    color: var(--black);
}

nav .nav-menu .nav-item:nth-child(3n + 3) .btn {
    background-color: var(--grey-2);
    color: var(--black);
}

nav .nav-menu .nav-item .btn {
    padding: .3rem 7vw 0 1rem;
}

nav .nav-toggle {
    display: none;
    margin-bottom: var(--outer-padding);
}

nav .nav-toggle a{
    display: inline-block;
}

nav .nav-toggle .btn {
    background-color: var(--lilac) !important;
    color: var(--black) !important;
}

.page#about nav .nav-toggle .btn {
    background-color: var(--black) !important;
    color: var(--lilac) !important;
}

nav .nav-toggle a::after {
    content: attr(data-open);
}

nav.active .nav-toggle a::after {
    content: attr(data-close);
}

@media screen and (hover:hover){
    nav .lang-menu .menu-item .btn:hover {
        background-color: var(--theme-btn-background-hover);
        color: var(--theme-btn-text);
    }
}

@media screen and (max-width: 900px){
    header:has(nav.active){
        background-color: rgba(255,255,255,.1);
        backdrop-filter: blur(20px);
        height: var(--100vh);
    }

    nav {
        padding-top: var(--outer-padding);
        width: auto;
    }

    nav .nav-toggle{
        display: flex;
        position: relative;
        z-index: 1002;
    }

    nav:not(.active) .list-menu .menu-item{
        display: none;
    }

    nav .list-menu {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    nav.active .nav-stack {
        position: fixed;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
        width: max-content;
        z-index: 1000;
    }

    nav.active .nav-menu.list-menu {
        
    }

    nav .list-menu .menu-item .title.small{
        font-size: 7.2rem;
    }

    nav .list-menu .menu-item .label.small{
        font-size: 2.1rem;
    }

    nav .nav-menu .nav-item .btn {
        padding: .3rem 1rem 0;
    }
    
    nav {
    padding-top: var(--outer-padding);
    width: auto;
}

    nav .nav-toggle{
        display: flex;
        position: relative;
        z-index: 1002;
    }

    nav:not(.active) .list-menu .menu-item{
        display: none;
    }

    nav .list-menu {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    nav.active {
        position: relative;
    }
}

/* BASE LAYOUT */

.outer-wrapper {}

main,
article{
    height: var(--100vh);
}

@media screen and (max-width: 900px){
    html:has(.page.collection-columns) main{
        height: auto;
    }

}

/* INDEX */

:root:has(#index) {
    background-color: var(--green);
}

#index {
    background-color: var(--lilac);
}

#index section:nth-child(2) .btn.primary {
    background-color: var(--theme-btn-text-accent);
    color: var(--theme-btn-background);
}

#index .intro-text {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(50% - 20rem);
    padding: var(--outer-padding);
}

#index .intro-text p {
    display: flex;
    background-color: var(--green);
}

#index main .section-features {
    background-color: var(--green);
}

#index main .section-shorts {
    background-color: var(--lilac);
}

.physics-section {
    position: relative;
    height: 100vh;
    width: 100%;
    overflow: hidden;
}

.physics-section .pre-comp {
    position: absolute;
    left: 0;
    bottom: 0;
}

.physics-section svg {
    width: 50vw;
    height: 100%;
}

.physics-canvas-wrap,
.physics-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.physics-canvas canvas {
    display: block;
    width: 100% !important;
    height: 100% !important;
}

.collection-columns:not(#index, #about) section:nth-child(2)::before {
    content: "";
    height: calc(100% - var(--outer-padding) * 2);
    width: 0;
    position: absolute;
    top: var(--outer-padding);
    left: 0;
    border-left: solid 1px var(--grey-2);
}

.collection-columns main section .section-labels {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 100;
}

.collection-columns main section:not(:has(.section-labels)) .section-label {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 100;
}

.collection-columns .post .meta-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.collection-columns .post .post-meta,
.collection-columns .post .post-tags,
.collection-columns .post .post-distr{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 .5rem;
}

@media screen and (max-width: 900px){
    .physics-section,
    .physics-section *{
        pointer-events: none;
    }
    
    .page#all-posts main section .section-label{
        position: relative;
        bottom: unset;
        left: unset;
        margin-left: calc( var(--outer-padding) * -1 );
        margin-bottom: var(--outer-padding);
    }
}

/* COLLECTION COLUMNS */

html:has(.collection-columns),
.collection-columns{
    background-color: var(--white);
}

.collection-columns main {
    display: flex;
    flex-direction: row;
}

@media screen and (max-width: 900px) {
    .collection-columns main {
        flex-direction: column;
    }
}

.collection-columns section {
    display: flex;
    flex-direction: column;
    padding: var(--outer-padding) var(--outer-padding) 0;
    position: relative;
    width: 100%;
    height: 100%;
}

.collection-columns section .filter-distr{
    display: flex;
    flex-direction: row;
    gap: 0 .5rem;
    
    position: absolute;
    top: 12rem;
    transform: translateY(calc(-50% - var(--outer-padding)));
}

.collection-columns section .scroll-wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: 2rem 1rem;
    padding-top: 12rem;
    padding-bottom: 8rem;
    overflow-y: scroll;
}

.collection-columns .grid-item {
    --columns: 4;
    width: calc( (100% - (var(--columns) - 1) * 1rem) / var(--columns) ) ;
}

#collection.collection-columns .grid-item{
    --columns: 2;
}


@media screen and (max-width: 1080px){
    .collection-columns .grid-item {
        --columns: 3;
    }
}

@media screen and (max-width: 900px){
    .collection-columns .grid-item {
        --columns: 2;
    }
    
    .collection-columns section .filter-distr{
        gap: 0 .5rem;
        transform: translateY(calc(-50% - 2rem));
    }
}

@media screen and (max-width: 700px){
    .collection-columns .grid-item {
        --columns: 1;
    }
}

@media screen and (max-width: 350px){
    .collection-columns .grid-item {
        --columns: 1;
    }
}

.collection-columns .grid-item.coming-soon{
    pointer-events: none;
}

.collection-columns .grid-item.coming-soon .btn:not(.coming-soon){
    color: var(--grey-2) !important;
    background-color: var(--black) !important;
}

.collection-columns .grid-item.coming-soon .btn.coming-soon{
    color: var(--black) !important;
    background-color: var(--lilac) !important;
}

.collection-columns .grid-item img {
    object-fit: cover;
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
    transition: all .25s cubic-bezier(0.33, 1, 0.68, 1);
    transition-property: filter, mix-blend-mode;
}

.collection-columns .grid-item.coming-soon img{
    filter: grayscale(1);
}

.collection-columns main {
    display: flex;
}

@media screen and (hover:hover){
    .collection-columns .grid-item:hover .btn {
        --theme-btn-background: var(--black);
        --theme-btn-text: var(--grey-2);
        --theme-btn-stroke: var(--grey-1);

        transition: all .25s cubic-bezier(0.33, 1, 0.68, 1);
        transition-property: font-size, letter-spacing, font-variation-settings, color, background-color;
    }

    .collection-columns .grid-item:hover img {
        filter: grayscale(1) contrast(1.25) brightness(1.5);
    }
}

@media screen and (max-width: 900px){
    .collection-posts section {
        width: 100%;
    }
    
    .collection-posts section:first-child {
        padding-bottom: var(--outer-padding);
    }
    
    .collection-posts section:last-child {
        padding-top: 2rem;
    }
    
    .collection-posts section:first-child .scroll-wrapper{
        padding-bottom: var(--outer-padding);
    }
}

/* Column States */
#collection section {
    width: 50%;
    display: flex;
    width: 50%;
    transition: width 0.5s ease, opacity 0.5s ease, transform 0.5s ease;
}

#collection section .scroll-wrapper {
    transition: opacity 0.25s ease, transform 0.25s ease;
}

#collection.is-features-active .section-features {
    width: 100%;
}

#collection.is-features-active .section-shorts {
    width: 33%;
}

#collection.is-features-active .section-shorts .btn.section-label:hover{
    font-variation-settings: 'wght' 600, 'wdth' 120;
}

#collection.is-shorts-active .section-features {
    width: 33%;
}

#collection.is-shorts-active .section-features .btn.section-label:hover{
    font-variation-settings: 'wght' 600, 'wdth' 120;
}

#collection.is-shorts-active .section-shorts {
    width: 100%;
}

#collection.is-features-active .section-shorts card,
#collection.is-shorts-active .section-features card {
    width: 100%;
}

#collection.is-features-active .section-features card,
#collection.is-shorts-active .section-shorts card {
    width: calc(50% - .5rem);
    transition: width 0.25s ease;
}

/* FILM POST */

.post#film article{
    display: flex;
    flex-wrap: nowrap;
    position: relative;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.post#film article::-webkit-scrollbar {
    display: none;
}

.post#film section{
    flex-shrink: 0;
    
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;

    position: relative;
    width: 100vw;
    height: var(--100vh);

    padding: var(--outer-padding);

    padding-top: calc(12rem + var(--outer-padding));
}

.post#film .hero-banner .post-thumbnail {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.post#film .hero-banner .post-thumbnail img,
.post#film .hero-banner .post-thumbnail video,
.post#film .hero-banner .post-thumbnail iframe {
    display: block;
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.post#film .hero-banner .post-thumbnail iframe{
    pointer-events: none;
}

.post-thumbnail.has-vimeo .poster-fallback,
.post-thumbnail.has-vimeo .vimeo-embed {
    position: absolute;
    inset: 0;d
}

.post-thumbnail.has-vimeo .poster-fallback {
    z-index: 1;
}

.post-thumbnail.has-vimeo .vimeo-embed {
    z-index: 2;
    opacity: 0;
    transition: opacity 0.25s ease;
}

.post-thumbnail.has-vimeo.is-ready .vimeo-embed {
    opacity: 1;
}

.post-thumbnail.has-vimeo .vimeo-embed {
    position: absolute;
    top: 50%;
    left: 50%;
    
    width: 100vw !important;
    height: var(--100vh) !important;

    min-width: 100%;
    min-height: 100%;

    transform: translate(-50%, -50%);
    
    background-color: #000;
}

.teaser-hover {
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;

    opacity: 0;
    transform: translate(10%, 5%);
    transition: opacity 0.2s ease;

    z-index: 150;
}

@media screen and (hover:hover){
    .post-thumbnail a:hover .teaser-hover {
        opacity: 1;
    }
}

/* POST THUMBNAIL META */

.post#film .hero-banner .meta-wrapper {
    --inner-padding: calc( var(--outer-padding) * 2 * 20 ); 
    
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc(100% - var(--inner-padding));
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    
    z-index: 150;
}

.post#film .meta-wrapper .post-meta,
.post#film .meta-wrapper .post-tags,
.post#film .meta-wrapper .post-distr{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 0 .5rem;
}

.post#film .section-info{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12rem;
    min-height: 0;
}

.post#film .info-wrapper{
    display: flex;
    flex-direction: column;
    gap: 2rem;
    
    position: relative;
}

.post#film .synopsys-wrapper{
    width: 100%;
    padding-right: 20rem;
}

.post#film .section-info .meta-wrapper{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    column-gap: .5rem;
}

.post#film .section-info .gallery-wrapper{
    position: relative;
    height: 100%;
    min-height: 0;
    width: calc(100vw - var(--outer-padding) * 2);
}

.post#film .section-info .gallery-shell{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-end;
    gap: var(--outer-padding);

    height: 100%;
    min-height: 0;
    width: 100%;

    overflow-x: scroll;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.post#film .section-info .gallery-shell::-webkit-scrollbar{
    display: none;
}

.post#film .section-info .gallery{
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    flex-shrink: 0;
    gap: var(--outer-padding);
    position: relative;
}

.post#film .section-info .gallery,
.post#film .section-info .gallery-item{
    height: 100%;
}

.post#film .section-info .poster-gallery .gallery-item{
    display: flex;
    flex-direction: row;
    gap: var(--outer-padding);
}

.post#film .section-info .poster-gallery .label{
    position: absolute;
    left: calc(100% + var(--outer-padding));
    width: max-content;
}

.post#film .section-info .gallery-shell img{
    height: 100%;
    width: auto;
    object-fit: contain;
}

.post#film .section-info .gallery-shell .stills-gallery{
    padding-top: calc(1.4rem + .5rem + .2rem + var(--outer-padding));
}

.post#film .section-info .gallery-shell .stills-gallery img{
    height: 100%;
    width: auto;
    object-fit: cover;
/*    aspect-ratio: 3 / 2;*/
}

.post#film .section-info .gallery-nav{
    position: absolute;
    top: 0;
    right: 0;

    display: flex;
    flex-direction: row;
    gap: 1rem;

    pointer-events: none;
    z-index: 10;
}

.post#film .section-info .gallery-arrow{
    pointer-events: auto;
}

.post#film .section-info .gallery-arrow[disabled]{
    opacity: .34;
    cursor: default;
    pointer-events: none;
}

@media screen and (max-width: 900px){
    .post#film .hero-banner .meta-wrapper{
        --inner-padding: calc( var(--outer-padding) * 2 ); 
    }
}

/* FILM EXTRAS */

.post#film .extra-panel{
    position: fixed;
    left: 50vw;
    bottom: 0;
    transform: translate(-50%, 100%);
    z-index: 40;

    width: calc(100vw - (var(--outer-padding) * 2));
    height: calc(var(--100vh) - 46vh - var(--outer-padding));

    padding: var(--outer-padding);
    padding-bottom: 8rem;
    margin-bottom: var(--outer-padding);

    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4rem;

    overflow-y: auto;
    background-color: var(--theme-btn-background);
    color: var(--theme-btn-text);
    border-top: 1px solid var(--theme-btn-stroke);

    transition: transform 0.45s ease;
    will-change: transform;
    
    z-index: 30;
}

.post#film .extra-panel.is-open{
    transform: translate(-50%, 0);
}

.post#film .extra-panel .column-wrapper{
    display: flex;
    flex-direction: column;
    gap: 4rem;
    width: 100%;
    
    position: sticky;
    top: 0;
}

.post#film .extra-panel .column-wrapper .inner-wrapper {
    display: flex;
    flex-direction: row;
    gap: .5rem;
}

.post#film .extra-panel .list-heading{
    background-color: var(--lilac);
    color: var(--black);
}

.post#film .extra-panel .list-wrapper{
    display: flex;
    flex-direction: column;
    gap: .5rem;
    width: 100%;
}

.post#film .extra-panel .list-wrapper p{
    display: none;
}

.post#film .extra-panel .list-wrapper ul{
    display: flex;
    flex-direction: row;
    gap: .5rem;
    flex-wrap: wrap;
}

.post#film .extra-panel .list-wrapper ul li {
    font-family: var(--mono-font);
    letter-spacing: .05em;
    text-transform: uppercase;
    font-variation-settings: 'wght' 240;
    font-size: 1.4rem;
    
    display: flex;
    align-items: baseline;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: flex-start;
    gap: .5rem;
    
    width: fit-content;
}

.post#film .extra-panel .list-wrapper ul li * {
    user-select: none;
}

.post#film .extra-panel .list-wrapper ul li:not(:has(strong, em, span, u, a) ){
    color: var(--black);
    background-color: var(--grey-2);
    padding: .5rem .8rem .3rem .8rem;
    border-bottom: solid 1px var(--theme-btn-stroke);
    
    width: fit-content;
}

.post#film .extra-panel .list-wrapper ul li strong {
    color: var(--grey-2);
    background-color: var(--grey-1);
    padding: .5rem .8rem .3rem .8rem;
    border-bottom: solid 1px var(--theme-btn-stroke);
    
    width: fit-content;
}

.post#film .extra-panel .list-wrapper ul li em {
    color: var(--white);
    background-color: var(--green);
    padding: .5rem .8rem .3rem .8rem;
    border-bottom: solid 1px var(--theme-btn-stroke);
    
    width: fit-content;
}

.post#film .extra-panel .list-wrapper ul li span {
    padding: .5rem .8rem .3rem .8rem;
    border-bottom: solid 1px var(--theme-btn-stroke);
    
    width: fit-content
}

.post#film .extra-panel .list-wrapper.cast ul{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.post#film .extra-panel .inner-wrapper:has(.list-wrapper.highlights){
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.post#film .extra-panel .list-wrapper.highlights{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 3rem 6rem;
    padding-top: 1rem;
    padding-left: 4rem;
}

.post#film .extra-panel .list-wrapper.highlights .laurel {
    display: flex;
    align-items: center;
    width: auto;
}

.post#film .extra-panel .list-wrapper.highlights .laurel img {
    --ratio-scaler: 1.2;
    max-height: calc(9rem * var(--ratio-scaler));
    max-width: calc(16rem * var(--ratio-scaler));
    object-fit: contain;
}

.post#film .post-menu .menu-item .btn.is-active{
    background-color: var(--grey-1) !important;
    color: var(--grey-2) !important;
    border-color: var(--grey-2);
}

/* FILM POST MENU */

.post#film .post-menu {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);

    display: flex;
    flex-direction: row;
    gap: 0 1rem;
    
    z-index: 50;
}

.post#film .post-menu .menu-item .btn {
    padding: .3rem 4vw 0 1rem;
    border-top: solid 1px var(--theme-btn-stroke);
    border-bottom: 0;
}

.post#film .post-menu .menu-item:nth-child(odd) .btn {
    background-color: var(--grey-2);
    color: var(--black);
}

.post#film .post-menu .menu-item:nth-child(even) .btn {
    background-color: var(--black);
    color: var(--grey-2);
}

/* ABOUT PAGE */

.page#about {
    background-color: var(--lilac);
}

.page#about .logo-parent svg g:not(:last-of-type) {
    fill: var(--black) !important;
}

.page#about .logo-parent svg g:last-of-type path {
    fill: var(--lilac) !important;
}

.page#about .section-about{
    background-color: var(--theme-text-accent);
    color: var(--theme-text);
}

.page#about .section-about .about-wrapper{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    flex-shrink: 0;
    gap: 1rem;
    position: relative;
    width: 100%;
    height: var(--100vh);
    padding: 4rem 2rem;
    padding-top: calc(14rem + var(--outer-padding));
}

.page#about .section-about .about-wrapper p.ql-indent-1{
    padding-left: 10%;
}

.page#about .section-highlights {
    background-color: var(--theme-background-accent);
}

@media screen and (min-width: 1920px){
    .page#about .section-about .about-wrapper{
        font-size: calc( 1.4rem + .6vw);
    }
}

@media screen and (max-width: 900px){
    .page#about .section-about .about-wrapper{
        justify-content: flex-start;
        padding-bottom: 8rem;
        padding-left: var(--outer-padding);
        padding-right: var(--outer-padding);
        height: auto;
    }
    
    .page#about .section-highlights{
        height: calc( var(--100vh) - 8rem );
    }
    
    .page#about .section-highlights canvas{
        transform: rotate(180deg);
        pointer-events: none !important;
    }
}

/* CONATACTS PAGE */

.page#contacts {
    background-color: var(--lilac);
}

.page#contacts .section-contacts{
    background-color: var(--theme-background-accent);
    color: var(--theme-text);
    
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
    align-self: center;
    justify-content: flex-end;
    gap: 4rem;
    
    position: relative;
    padding-top: calc(12rem + var(--outer-padding));
    height: 100%;
    width: 100vw;
}

.page#contacts .section-contacts .list-wrapper{
    text-align: center;
    
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-end;
    align-content: center;
    justify-content: center;
    align-self: center;
    gap: 8rem 4rem;
    
    position: relative;
    height: 100%;
    width: 100%;
}

.page#contacts .list-wrapper ul{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    align-content: center;
    gap: 0;
}

.page#contacts .list-wrapper ul li {
    font-family: var(--mono-font);
    letter-spacing: .05em;
    text-transform: uppercase;
    font-variation-settings: 'wght' 240;
    font-size: 1.4rem;
    
    display: flex;
    align-items: baseline;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    gap: .5rem;
    
    width: fit-content;
}

.page#contacts .list-wrapper p{
    display: none;
}

.page#contacts .list-wrapper ul li *{
    color: var(--theme-graphics-text);
    background-color: var(--theme-graphics-background);
    padding: .5rem .8rem .3rem .8rem;
    border-bottom: solid 1px var(--theme-btn-stroke);
    width: fit-content;
    user-select: none;
}

.page#contacts .hero-heading{
    font-variation-settings: 'wght' 700, 'wdth' 28;
    font-size: 25vw;
    letter-spacing: -0.025em;
    line-height: 0.625;
    padding: 0.115em 0.055em 0.015em 0.025em;
    border-top: solid 1px var(--theme-btn-stroke);
    border-bottom: none;
    position: relative;
    height: fit-content;
    white-space: nowrap;
}

.page#contacts .list-wrapper ul {
    flex: 0 0 calc(100% / 4);
}

.page#contacts .list-wrapper ul:nth-of-type(n+4) {
    flex: 0 0 calc(100% / 4);
}

@media screen and (hover:hover){
    .page#contacts .list-wrapper ul li a:hover{
        color: var(--theme-btn-text);
        background-color: var(--theme-btn-background);
    }
}

@media screen and (max-width: 900px) {
    .page#contacts .list-wrapper ul {
        flex: 0 0 calc(100% / 1);
    }
    
    .page#contacts .list-wrapper ul:nth-of-type(n+4){
        flex: 0 0 calc(100% / 2.5);
    }
}

@media screen and (max-width: 700px){
    .page#contacts .section-contacts{
        gap: 2rem;
    }
    
    .page#contacts .section-contacts .list-wrapper{
        align-content: space-around;
        gap: 4rem;
    }
    
    .page#contacts .list-wrapper ul:nth-of-type(n+4){
        flex: 0 0 calc(100% / 1);
    }
}


@media screen and (max-width: 500px){
    .page#contacts .section-contacts .list-wrapper{
        gap: 2rem;
    }
}

@media screen and (max-width: 375px){
    .page#contacts .section-contacts .list-wrapper{
        gap: 1.5rem;
    }
}

/* MAINTENANCE */

#maintenance .logoWrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    
    position: fixed;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#maintenance .logo {
    text-transform: uppercase;
    text-align: center;
    --theme-btn-background: var(--lilac);
    --theme-btn-text: var(--black);
}

#maintenance .message {
    text-align: center;
}

/* COOKIE BANNER */

#cookie-banner {
    display: none;
    flex-direction: row;
    align-items: flex-end;
    justify-content: center;
    gap: 0px .5rem;
    
    padding: .5rem 1rem;
    width: max-content;

    position: fixed;
    right: var(--outer-padding);
    bottom: var(--outer-padding);
    
    font-feature-settings: 'case';

    z-index: 9999;
}

#cookie-banner .button-array {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0px .5rem;
}

@media screen and (max-width: 900px) {
    #cookie-banner {
        flex-direction: column;
    }
}

/* BG NOISE */

.bg-grain::before {
    content: "";
    top: -10rem;
    left: -10rem;
    width: calc(100% + 20rem);
    height: calc(100% + 20rem);
    z-index: 9999;
    position: fixed;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAACXBIWXMAABWIAAAViAHE10CgAAAE7mlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNy4yLWMwMDAgNzkuMWI2NWE3OWI0LCAyMDIyLzA2LzEzLTIyOjAxOjAxICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0RXZ0PSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VFdmVudCMiIHhtbG5zOnBob3Rvc2hvcD0iaHR0cDovL25zLmFkb2JlLmNvbS9waG90b3Nob3AvMS4wLyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjMuNSAoTWFjaW50b3NoKSIgeG1wOkNyZWF0ZURhdGU9IjIwMjItMDgtMzFUMTI6Mjk6MTIrMDE6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMjItMDgtMzFUMTI6NDgrMDE6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDIyLTA4LTMxVDEyOjQ4KzAxOjAwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4Zjg5ZjkxYS03MTFmLTRhMjQtOWNjMS1lZmQzMDUxYzU5M2EiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OGY4OWY5MWEtNzExZi00YTI0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');
    pointer-events: none;
    --speed: 1.5s;
    -webkit-animation: noise var(--speed) steps(2) infinite;
    animation: noise var(--speed) steps(2) infinite;
}

@-webkit-keyframes noise {
    to {
        transform: translate3d(-7rem, 0, 0);
    }
}

@keyframes noise {
    0% {
        transform: translate3d(0, 9rem, 0);
    }

    10% {
        transform: translate3d(-1rem, -4rem, 0);
    }

    20% {
        transform: translate3d(-8rem, 2rem, 0);
    }

    30% {
        transform: translate3d(9rem, -9rem, 0);
    }

    40% {
        transform: translate3d(-2rem, 7rem, 0);
    }

    50% {
        transform: translate3d(-9rem, -4rem, 0);
    }

    60% {
        transform: translate3d(2rem, 6rem, 0);
    }

    70% {
        transform: translate3d(7rem, -8rem, 0);
    }

    80% {
        transform: translate3d(-9rem, 1rem, 0);
    }

    90% {
        transform: translate3d(6rem, -5rem, 0);
    }

    to {
        transform: translate3d(-7rem, 0, 0);
    }
}