:root {
    --dw: 1920;
    --multiplier: .3;
    --ease: .8s cubic-bezier(.84, 0, .16, 1);
    --smooth: cubic-bezier(.76, 0, .24, 1);
    --fast-ease: .6s cubic-bezier(.84, 0, .16, 1);
    --color-ease: .4s ease-out
}

@media screen and (max-width: 1024px) {
    :root {
        --dw: 820;
        --multiplier: .15
    }
}

@media screen and (max-widtha: 479px) {
    :root {
        --dw: 390
    }
}

.v-text {
    writing-mode: vertical-lr
}

.h1 {
    font-size: 9.8958333333vw;
    font-family: var(--font-title);
    letter-spacing: -.05em
}

.h2 {
    font-size: 6.5104166667vw;
    font-family: var(--font-title);
    letter-spacing: -.05em
}

._128 {
    font-size: 6.6666666667vw;
    font-family: var(--font-title);
    letter-spacing: -.05em
}

._90 {
    font-size: 4.6875vw;
    font-family: var(--font-title);
    letter-spacing: -.04em
}

._72 {
    font-size: 3.75vw;
    font-family: var(--font-title);
    letter-spacing: -.04em
}

._35 {
    font-size: 1.8229166667vw;
    font-family: var(--font-title);
    letter-spacing: -.03em
}

._32 {
    font-size: 1.6666666667vw
}

._24 {
    font-size: calc(24 * var(--spacing));
    line-height: 1.3
}

._20 {
    font-size: calc(20 * var(--spacing));
    line-height: 1.3
}

._17 {
    font-size: calc(17 * var(--spacing))
}

._15 {
    font-size: calc(15 * var(--spacing))
}

._12 {
    font-size: calc(12 * var(--spacing))
}

._10 {
    font-size: calc(10 * var(--spacing))
}

._9 {
    font-size: calc(9 * var(--spacing))
}

._7 {
    font-size: calc(7 * var(--spacing))
}

._6 {
    font-size: calc(6 * var(--spacing))
}

.f-mono {
    font-family: var(--font-mono)
}

@media screen and (max-width: 1024px) {
    .h1 {
        font-size:14.6341463415vw
    }

    .h2,.sm-h2 {
        font-size: 9.756097561vw
    }

    .sm_65 {
        font-size: calc(65 * var(--spacing))
    }

    .sm_38 {
        font-size: calc(38 * var(--spacing))
    }

    .sm_27 {
        font-size: calc(27 * var(--spacing))
    }

    .sm_25 {
        font-size: calc(25 * var(--spacing))
    }

    .sm_20 {
        font-size: calc(20 * var(--spacing))
    }

    .sm_18 {
        font-size: calc(18 * var(--spacing))
    }

    .sm_14 {
        font-size: calc(14 * var(--spacing))
    }

    .sm_10 {
        font-size: calc(10 * var(--spacing))
    }

    .sm_9 {
        font-size: calc(9 * var(--spacing))
    }

    .sm_8 {
        font-size: calc(8 * var(--spacing))
    }

    .sm-v-text {
        writing-mode: vertical-lr
    }
}

@media screen and (max-width: 479px) {
    .h1 {
        font-size:20vw
    }

    .h2,.sm-h2 {
        font-size: 11.7948717949vw
    }

    .sm_70 {
        font-size: 17.9487179487vw
    }

    .sm_42 {
        font-size: calc(42 * var(--spacing))
    }

    .sm_17 {
        font-size: calc(17 * var(--spacing))
    }

    .sm_7 {
        font-size: calc(7 * var(--spacing))
    }

    .sm_f-mono {
        font-family: var(--font-mono)
    }
}

.noise {
    background-repeat: repeat;
    background-size: calc(1000 * var(--spacing)) calc(589 * var(--spacing));
    animation: noiseAnimation 1s steps(2) infinite;
    will-change: transform;
    width: 200vw;
    height: 200vh
}

@media screen and (max-width: 479px) {
    .noise {
        background-size:calc(500 * var(--spacing)) calc(294.5 * var(--spacing));
        animation: noiseAnimation 2s steps(2) infinite
    }
}

body.high-noise:has([data-transition-page=about])>.noise {
    display: none
}

body.high-noise:has([data-transition-page=password]) .noise {
    z-index: 1
}

@keyframes noiseAnimation {
    0% {
        transform: translate(-50%,-50%) translate3d(0,9rem,0)
    }

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

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

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

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

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

    60% {
        transform: translate(-50%,-50%) translate3d(2rem,6rem,0)
    }

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

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

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

    to {
        transform: translate(-50%,-50%) translate3d(-7rem,0,0)
    }
}

* {
    box-sizing: border-box
}

body {
    font-family: var(--font-title);
    font-weight: 400;
    font-size: calc(16 * var(--spacing));
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    -o-font-smoothing: antialiased
}

a {
    cursor: pointer
}

main {
    visibility: hidden;
    overflow: clip
}

::selection,::-webkit-selection {
    background: var(--color-main);
    color: var(--color-black)
}

.loader_percentage:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translate(-50%);
    width: calc(100 * var(--spacing))
}

.loader_line {
    background-color: color-mix(in srgb,var(--color-black),transparent 80%);
    mask-image: linear-gradient(to right,black calc(var(--x, 0) - 20px),transparent calc(var(--x, 0) - 5px),transparent calc(var(--x, 0) + var(--textWidth, 0) + 5px),black calc(var(--x, 0) + var(--textWidth, 0) + 20px))
}

.loader_line:before {
    content: "";
    position: absolute;
    inset: 0;
    transform-origin: left;
    background: var(--color-black);
    transform: scaleX(var(--progress, 0))
}

@media (max-width: 768px) {
    .loader_line {
        mask-image:linear-gradient(to bottom,black calc(var(--y, 0) - 20px),transparent calc(var(--y, 0) - 5px),transparent calc(var(--y, 0) + var(--textHeight, 0) + 5px),black calc(var(--y, 0) + var(--textHeight, 0) + 20px))
    }

    .loader_line:before {
        transform-origin: bottom;
        transform: scaleY(var(--progress, 0))
    }
}

.loader_line-parent {
    clip-path: inset(-30px 0 -30px calc(100% * var(--progress, 0)))
}

@media (max-width: 768px) {
    .loader_line-parent {
        clip-path:inset(0 -30px calc(100% * var(--progress, 0)) -30px)
    }
}

body:has([data-transition-page=about],[data-transition-page=password]) .loader {
    color: var(--color-white)
}

body:has([data-transition-page=about],[data-transition-page=password]) .loader_line {
    background-color: color-mix(in srgb,var(--color-white),transparent 80%);
    mask-image: linear-gradient(to right,black calc(var(--x, 0) * 1px - 20px),transparent calc(var(--x, 0) * 1px - 5px),transparent calc(var(--x, 0) * 1px + var(--textWidth, 0) + 5px),black calc(var(--x, 0) * 1px + var(--textWidth, 0) + 20px))
}

body:has([data-transition-page=about],[data-transition-page=password]) .loader_line:before {
    background: var(--color-white)
}

@media (max-width: 768px) {
    body:has([data-transition-page=about],[data-transition-page=password]) .loader_line {
        mask-image:linear-gradient(to bottom,black calc(var(--y, 0) - 20px),transparent calc(var(--y, 0) - 5px),transparent calc(var(--y, 0) + var(--textHeight, 0) + 5px),black calc(var(--y, 0) + var(--textHeight, 0) + 20px))
    }
}

body:has([data-transition-page=about],[data-transition-page=password]) .loader_percentage:before {
    background: linear-gradient(to right,transparent 0%,var(--color-black) 30%,var(--color-black) 70%,transparent 100%)
}

.nav_cta {
    transition: transform .4s var(--smooth);
    transform: translateY(-240%)
}

@media screen and (max-width: 479px) {
    .nav_cta {
        transition:transform .4s var(--smooth),opacity .4s var(--smooth),visibility 0s linear .4s;
        opacity: 0;
        visibility: hidden;
        transform: translateY(10%)
    }
}

.nav_cta.active {
    transition: transform .4s var(--smooth),opacity .4s var(--smooth),visibility 0s linear 0s;
    transform: translateY(0);
    opacity: 1;
    visibility: visible
}

.nav_cta:before {
    content: "";
    width: calc(214 * var(--spacing));
    height: calc(87 * var(--spacing));
    position: absolute;
    right: calc(-26 * var(--spacing));
    bottom: calc(-16 * var(--spacing));
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: var(--bg)
}

@media screen and (max-width: 479px) {
    .nav_cta:before {
        background-image:none;
        background-color: var(--color-main);
        width: calc(100vw - var(--spacing) * 140);
        right: calc(-28 * var(--spacing));
        height: calc(100% + var(--spacing) * 14);
        top: calc(-6 * var(--spacing));
        clip-path: polygon(0 0,100% 0,100% 100%,calc(15 * var(--spacing)) 100%,0% calc(100% - 15 * var(--spacing)))
    }
}

.mob-close {
    clip-path: polygon(0 0,100% 0,100% 100%,calc(30 * var(--spacing)) 100%,0% calc(100% - 30 * var(--spacing)))
}

:root {
    --nav-blur-display: block;
    --nav-blur-amount: 20px;
    --nav-blur-rotation: 13deg;
    --nav-blur-top: -100;
    --nav-blur-left: -390;
    --nav-blur-right: -80;
    --nav-blur-height: 260;
    --nav-blur-mask-angle: 270deg;
    --nav-blur-mask-cone: 90deg;
    --nav-blur-gradient: 75%;
    --nav-blur-load: 0;
    --nav-blur-outline: none;
    --nav-blur-bg: color-mix(in srgb, var(--color-white), transparent 80%);
    --nav-blur-mask: conic-gradient(from 270deg at 0% 50%, transparent 0deg, black 90deg, transparent 90deg), linear-gradient(to bottom, #000 40%, transparent 100%)
}

.nav_body:before {
    position: absolute;
    display: var(--nav-blur-display);
    top: calc(var(--nav-blur-top) * var(--spacing));
    left: calc(var(--nav-blur-left) * var(--spacing));
    right: calc(var(--nav-blur-right) * var(--spacing));
    height: calc(100% + var(--nav-blur-height) * var(--spacing));
    background: var(--nav-blur-bg);
    backdrop-filter: blur(calc(var(--nav-blur-amount) * var(--nav-blur-load)));
    -webkit-backdrop-filter: blur(calc(var(--nav-blur-amount) * var(--nav-blur-load)));
    transform: rotate(var(--nav-blur-rotation));
    pointer-events: none;
    border: var(--nav-blur-outline);
    mask: var(--nav-blur-mask)
}

.side-logo_parent,.side {
    transition: opacity .4s var(--smooth)
}

.nav,.sidebar {
    transition: color .6s var(--smooth)
}

.sign-main,.sign-secondary {
    transition: fill .6s var(--smooth)
}

body:is(.white-nav) .sidebar,body:is(.white-nav) .nav {
    color: var(--color-white)
}

body:is(.white-nav) .sign-main {
    fill: var(--color-white);
    transition: fill .4s var(--smooth)
}

body:is(.white-nav) .sign-secondary {
    fill: color-mix(in srgb,var(--color-white),transparent 30%)
}

body:is(.white-nav):has(.about-show-footer) .sidebar,body:is(.white-nav):has(.about-show-footer) .nav {
    color: var(--color-black)
}

body:is(.white-nav):has(.about-show-footer) .sign-main {
    fill: var(--color-main)
}

body:is(.white-nav):has(.about-show-footer) .sign-secondary {
    fill: var(--color-dark-main)
}

@media screen and (max-width: 1023px) {
    body:is(.white-nav) .side-logo_parent {
        color:var(--color-black)
    }
}

@media screen and (min-width: 1024px) {
    body:has(.hide-sidebar) .side-logo_parent,body:has(.hide-sidebar) .side {
        opacity:0!important;
        pointer-events: none
    }
}

@media screen and (max-width: 1023px) {
    .nav_weather,.nav-side {
        transition:opacity .4s var(--smooth)
    }

    body:not(.at-top) .side,body:not(.at-top) .nav_weather,body:not(.at-top) .nav-side {
        opacity: 0!important;
        pointer-events: none
    }
}

@media screen and (max-width: 479px) {
    .nav-mail .link-char {
        text-decoration:underline;
        text-underline-offset: .1em;
        text-decoration-thickness: 1px
    }
}

.dashed {
    background-image: linear-gradient(90deg,var(--color-black),var(--color-black) 75%,transparent 75%,transparent 100%);
    background-size: 4px 1px;
    background-repeat: repeat-x
}

.dashed.white {
    background-image: linear-gradient(90deg,var(--color-white),var(--color-white) 75%,transparent 75%,transparent 100%)
}

.section-title>div:not(:first-child) {
    margin-top: -.35em
}

.section-title:is(.h2)>div:not(:first-child) {
    margin-top: -.15em
}

.white-gradient {
    background: linear-gradient(to right,color-mix(in srgb,var(--color-white),transparent 10%) 30%,var(--color-white-50))
}

.white-gradient-light {
    background: linear-gradient(to right,var(--color-white),var(--color-white-50))
}

@media screen and (max-width: 479px) {
    .link ._32,.link ._32 .link-char {
        text-decoration-thickness:1px;
        text-underline-offset: 3px
    }
}

@media screen and (max-width: 1023px) {
    .side_logo-bg {
        content:"";
        position: absolute;
        left: calc(-15 * var(--spacing));
        top: calc(-18 * var(--spacing));
        width: calc(200 * var(--spacing));
        aspect-ratio: 150/44;
        background-image: var(--bg);
        background-size: contain;
        background-repeat: no-repeat;
        z-index: -1
    }
}

@media screen and (max-width: 479px) {
    .side_logo-bg {
        content:"";
        position: absolute;
        left: calc(-15 * var(--spacing));
        top: calc(-15 * var(--spacing));
        width: calc(160 * var(--spacing));
        aspect-ratio: 150/44;
        background-image: var(--bg);
        background-size: contain;
        background-repeat: no-repeat;
        z-index: 1
    }
}

.transition_row {
    background-color: color-mix(in srgb,var(--color-white),transparent 90%);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px)
}

.transition:before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: repeating-linear-gradient(90deg,rgba(255,255,255,.45) 0,rgba(255,255,255,.45) calc(var(--rib) * .1),rgba(0,0,0,.35) calc(var(--rib) * .1),rgba(0,0,0,.35) calc(var(--rib) * .52),rgba(255,255,255,.18) calc(var(--rib) * .52),rgba(255,255,255,.18) calc(var(--rib) * .72),rgba(0,0,0,.22) calc(var(--rib) * .72),rgba(0,0,0,.22) calc(var(--rib) * .92),rgba(255,255,255,.38) calc(var(--rib) * .92),rgba(255,255,255,.38) var(--rib));
    mix-blend-mode: soft-light
}

.transition:after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg,rgba(255,255,255,.22),transparent 30%,transparent 70%,rgba(0,0,0,.3)),radial-gradient(100% 100% at 50% 0%,rgba(255,255,255,.25),transparent 55%);
    opacity: .35
}

.transition {
    --rib: 14px;
    --tint: rgba(255, 255, 255, .18);
    --progress: 0;
    --default-mask: linear-gradient(90deg, transparent 100%, #000 125%, #000 225%, transparent 250%, transparent 250%);
    --active-mask: linear-gradient(90deg, transparent 100%, #000 125%, #000 225%, transparent 250%, transparent 250%);
    --leave-mask: linear-gradient(90deg, transparent -25%, #000 0%, #000 100%, transparent 125%, transparent 125%);
    background: var(--tint);
    overflow: hidden;
    backdrop-filter: blur(16px) saturate(1.05) contrast(1.02);
    -webkit-backdrop-filter: blur(16px) saturate(1.05) contrast(1.02);
    mask: linear-gradient(90deg,transparent 100%,#000 125%,#000 225%,transparent 250%,transparent 250%)
}

.accordion_content {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .6s var(--smooth)
}

.accordion.active .accordion_content {
    grid-template-rows: 1fr
}

.accordion.active .accordion_icon {
    transform: rotate(135deg)
}

.accordion.active .accordion_icon-line:first-child {
    transform: rotate(45deg)
}

.accordion.active .accordion_icon-line:last-child {
    transform: rotate(-45deg)
}

.accordion .accordion_icon,.accordion .accordion_icon-line {
    transition: transform .6s var(--smooth)
}

.services_item {
    transform: translate3d(calc(var(--spacing) * 100 * (1 - var(--progress, 0))),0,0)
}

@media screen and (max-width: 1024px) {
    .services_item {
        transform:translate3d(calc(var(--spacing) * 75 * (1 - var(--progress, 0))),0,0)
    }
}

@media screen and (max-width: 479px) {
    .services_item {
        transform:translate3d(calc(var(--spacing) * 40 * (1 - var(--progress, 0))),0,0);
        will-change: transform
    }
}

.services_item.active .service_cta {
    transition: opacity .4s var(--smooth) .3s,transform .4s var(--smooth) .3s;
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0)
}

.services_list.fixed-height {
    height: var(--height);
    overflow: hidden
}

.service_cta {
    transition: opacity .4s var(--smooth),transform .4s var(--smooth);
    opacity: 0;
    transform: translateY(20%);
    pointer-events: none
}

.service_cta:before {
    content: "";
    width: calc(260 * var(--spacing));
    height: calc(100 * var(--spacing));
    position: absolute;
    right: calc(-36 * var(--spacing));
    bottom: calc(-23 * var(--spacing));
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: var(--bg);
    transform: rotateX(180deg)
}

@media screen and (max-width: 479px) {
    .service_cta:before {
        display:none
    }
}

.service_cta .service-mail .link-char {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px
}

.brands_rows {
    transform-style: preserve-3d;
    transform: rotateX(15deg) rotateY(-4deg) rotate(4deg);
    will-change: transform
}

.real {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .6s var(--smooth),visibility 0s linear .6s
}

.real.active {
    transition: opacity .8s var(--smooth),visibility 0s linear 0s;
    opacity: 1;
    visibility: visible;
    pointer-events: auto
}

.real:before {
    content: "";
    z-index: 2;
    position: absolute;
    top: calc(-200 * var(--spacing));
    left: calc(200 * var(--spacing));
    right: calc(-80 * var(--spacing));
    height: calc(120 * var(--spacing));
    background: transparent;
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    transform: rotate(13deg);
    pointer-events: none;
    mask: conic-gradient(from 270deg at 0% 50%,transparent 0deg,black 90deg,transparent 90deg),linear-gradient(to bottom,#000 75%,transparent 100%)
}

.real.mobile:has(.real_controls-icon.active) .real_bottom .real_bottom-contnet,.real.mobile:has(.real_controls-icon.active) .real_bottom:before {
    opacity: 0
}

.real.mobile:has(.real_controls-icon.active) .real_controls svg {
    opacity: 0
}

.real_close {
    transform: rotate(0);
    transition: transform .4s var(--smooth)
}

.real_close:hover {
    transform: rotate(180deg)
}

.real_bottom .real_bottom-contnet {
    opacity: 0;
    transition: opacity .4s var(--smooth)
}

.real_bottom:before {
    content: "";
    position: absolute;
    left: calc(-15 * var(--spacing));
    right: calc(-15 * var(--spacing));
    bottom: calc(-30 * var(--spacing));
    height: calc(100% + 150 * var(--spacing));
    background-color: transparent;
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    mask: conic-gradient(from 270deg at 0% 50%,transparent 0deg,black 90deg,transparent 90deg),linear-gradient(to top,#000 35%,transparent 100%);
    opacity: 0;
    transition: opacity .4s var(--smooth)
}

.real_bottom:hover .real_bottom-contnet,.real_bottom.active .real_bottom-contnet {
    opacity: 1
}

.real_bottom:hover:before,.real_bottom.active:before {
    opacity: 1
}

@media screen and (max-width: 1024px) {
    .real_bottom .real_bottom-contnet {
        opacity:1
    }

    .real_bottom:before {
        opacity: 1
    }
}

.real_input {
    background: transparent;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    z-index: 3;
    outline: none;
    box-shadow: none
}

.real_input::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 20px;
    height: 20px;
    background: transparent;
    border-radius: 50%;
    outline: none;
    box-shadow: none;
    transition: background .05s ease
}

.real_input::-moz-range-thumb {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 20px;
    height: 20px;
    background: transparent;
    outline: none;
    box-shadow: none;
    border-radius: 50%;
    transition: background .05s ease
}

.real_input::-ms-thumb {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 20px;
    height: 20px;
    background: transparent;
    outline: none;
    box-shadow: none;
    border-radius: 50%;
    transition: background .05s ease
}

.real_input:focus {
    outline: none
}

.real_progress {
    height: 1px;
    background-color: color-mix(in srgb,currentColor,transparent 70%);
    mask-image: linear-gradient(to right,black calc(var(--x) * 1px - 20px),transparent calc(var(--x) * 1px - 5px),transparent calc(var(--x) * 1px + var(--textWidth) + 5px),black calc(var(--x) * 1px + var(--textWidth) + 20px))
}

.real_progress:before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: currentColor;
    transform-origin: left;
    transform: scaleX(var(--progress, 0))
}

.real_current-time {
    transform: translate(calc(var(--x, 0px) * 1px),-50%)
}

.real_controls:hover {
    cursor: none
}

.real_controls-icon svg {
    transition: opacity .2s ease
}

.real_controls-icon svg:nth-child(2) {
    opacity: 0
}

.real_controls-icon.active svg:nth-child(1) {
    opacity: 0
}

.real_controls-icon.active svg:nth-child(2) {
    opacity: 1
}

.hero_line:last-child .hero_word:last-child .hero_char:nth-child(3),.hero_line:last-child .hero_word:last-child .hero_char:nth-child(4),.hero_line:last-child .hero_word:last-child .hero_char:nth-child(5),.hero_line:last-child .hero_word:last-child .hero_char:nth-child(6) {
    clip-path: inset(0 -10% calc(31% * var(--progress, 0)) -10%)
}

@media screen and (max-width: 1024px) {
    .hero_line:last-child {
        margin-top:-.3em;
        text-align: end!important
    }

    .hero_line:last-child .hero_word:last-child .hero_char:nth-child(2),.hero_line:last-child .hero_word:last-child .hero_char:nth-child(3),.hero_line:last-child .hero_word:last-child .hero_char:nth-child(4),.hero_line:last-child .hero_word:last-child .hero_char:nth-child(5),.hero_line:last-child .hero_word:last-child .hero_char:nth-child(6) {
        clip-path: inset(0 -10% calc(31% * var(--progress, 0)) -10%)
    }
}

.hero_title.is-1 h2>div:not(:first-child),.hero_title.is-2 h2>div:not(:first-child) {
    margin-top: -.22em
}

.hero_title.is-2 h2>div:last-child {
    margin-top: -.33em
}

.hero-blur {
    background: transparent;
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    transition: opacity .4s var(--smooth);
    mask: conic-gradient(from 270deg at 0% 50%,transparent 0deg,black 90deg,transparent 90deg),linear-gradient(to right,#000 0%,transparent 100%)
}

.hero-blur.is-right {
    mask: conic-gradient(from 270deg at 0% 50%,transparent 0deg,black 90deg,transparent 90deg),linear-gradient(to left,#000 0%,transparent 100%)
}

body:not(.at-top) .hero-blur {
    opacity: 0!important
}

.nerves_item-img {
    clip-path: polygon(0 0,100% 0,100% 100%,calc(44 * var(--spacing)) 100%,0% calc(100% - 44 * var(--spacing)))
}

@media screen and (max-width: 479px) {
    .nerves_item-img {
        clip-path:polygon(0 0,100% 0,100% 100%,calc(20 * var(--spacing)) 100%,0% calc(100% - 20 * var(--spacing)))
    }
}

.nerves_item {
    background-color: var(--color-white-50);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    position: relative
}

.nerves_item:before {
    content: "";
    z-index: 1;
    position: absolute;
    inset: 0;
    background-image: linear-gradient(to right,var(--color-white),var(--color-white-50))
}

:root {
    --sidebar-blur-display: block;
    --sidebar-blur-amount: 30px;
    --sidebar-blur-mask-angle: 270deg;
    --sidebar-blur-mask-cone: 90deg;
    --sidebar-blur-gradient-dir: right;
    --sidebar-blur-gradient: 40%;
    --sidebar-blur-outline: none;
    --sidebar-blur-mask: conic-gradient(from 270deg at 0% 50%, transparent 0deg, black 90deg, transparent 90deg), linear-gradient(to right, #000 40%, transparent 100%)
}

.about_bg-overlay {
    background: linear-gradient(250deg,transparent 20.32%,var(--color) 100%)
}

.about_bg-blur {
    background: transparent;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    mask: conic-gradient(from 270deg at 0% 50%,transparent 0deg,black 90deg,transparent 90deg),linear-gradient(to right,#000 30%,transparent 100%)
}

@media screen and (max-width: 479px) {
    .about_bg-overlay {
        background:linear-gradient(250deg,transparent 27.32%,var(--color) 100%);
        opacity: .6
    }

    .about_bg-blur {
        mask: conic-gradient(from 270deg at 0% 50%,transparent 0deg,black 90deg,transparent 90deg),linear-gradient(to right,#000 0%,transparent 70%)
    }

    footer .about_bg-overlay {
        background: #7b3737;
        opacity: .6
    }
}

footer .about_bg-blur {
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px)
}

section:nth-child(3) .about_bg-blur {
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px)
}

.about .about_content {
    transition-delay: 1s
}

.about .about_content.active {
    visibility: visible;
    transition-delay: 0s
}

.about .about_content.active .about_title {
    opacity: 1;
    transition-duration: .8s;
    transition-delay: .2s
}

.about .about_content.is-hero.active .about_title-line {
    opacity: 1;
    transition-delay: .2s
}

.about .about_content.is-story.active .about_title-char {
    opacity: 1;
    transition-delay: var(--random-delay);
    transition-duration: .8s
}

.about .about_content.is-story.active .about_wrapper {
    opacity: 1;
    transition-delay: .2s;
    transition-duration: .8s
}

.about .about_content.is-story.active.show-1 .grid-story:first-child .about_content-line {
    opacity: 1;
    transition-delay: calc(var(--delay) + .2s);
    transition-duration: .8s
}

.about .about_content.is-story.active.show-2 .grid-story:last-child .about_content-line {
    opacity: 1;
    transition-delay: calc(var(--delay) + .2s);
    transition-duration: .8s
}

.about .about_content.is-names.active .about_names-logo {
    opacity: 1;
    transition-duration: .8s;
    transition-delay: .4s
}

.about .about_content.is-names.active .about_names:nth-child(1) .about_name,.about .about_content.is-names.active .about_names:nth-child(1) .about_name-descr,.about .about_content.is-names.active .about_names:nth-child(1) .about_sign {
    opacity: 1;
    transition-duration: .8s
}

.about .about_content.is-names.active .about_names:nth-child(1) .about_name {
    transition-delay: .2s
}

.about .about_content.is-names.active .about_names:nth-child(1) .about_name-descr {
    transition-delay: .3s
}

.about .about_content.is-names.active .about_names:nth-child(1) .about_sign {
    transition-delay: .35s
}

.about .about_content.is-names.active .about_names:nth-child(3) .about_name,.about .about_content.is-names.active .about_names:nth-child(3) .about_name-descr,.about .about_content.is-names.active .about_names:nth-child(3) .about_sign {
    opacity: 1;
    transition-duration: .8s
}

.about .about_content.is-names.active .about_names:nth-child(3) .about_name {
    transition-delay: .4s
}

.about .about_content.is-names.active .about_names:nth-child(3) .about_name-descr {
    transition-delay: .5s
}

.about .about_content.is-names.active .about_names:nth-child(3) .about_sign {
    transition-delay: .55s
}

.about .about_content.is-mantids.active .about_wrapper {
    opacity: 1;
    transition-delay: .2s;
    transition-duration: .8s
}

.about .about_content.is-mantids.active.show-1 .about_title:nth-child(1) .about_title-char {
    opacity: 1;
    transition-delay: var(--random-delay);
    transition-duration: .8s
}

.about .about_content.is-mantids.active.show-1 .grid-mantids:first-child ._24 {
    opacity: 1;
    transition-delay: .2s;
    transition-duration: .8s
}

.about .about_content.is-mantids.active.show-1 .grid-mantids:first-child .about_content-line {
    opacity: 1;
    transition-delay: calc(var(--delay) + .2s);
    transition-duration: .8s
}

.about .about_content.is-mantids.active.show-2 .about_title:nth-child(2) .about_title-char {
    opacity: 1;
    transition-delay: var(--random-delay);
    transition-duration: .8s
}

.about .about_content.is-mantids.active.show-2 .grid-mantids:last-child ._24 {
    opacity: 1;
    transition-delay: .2s;
    transition-duration: .8s
}

.about .about_content.is-mantids.active.show-2 .grid-mantids:last-child .about_content-line {
    opacity: 1;
    transition-delay: calc(var(--delay) + .2s);
    transition-duration: .8s
}

body:has([data-transition-page=password]) .sidebar,body:has([data-transition-page=password]) nav {
    display: none
}

/*! tailwindcss v4.0.7 | MIT License | https://tailwindcss.com */
@layer theme {
    :root,:host {
        --font-sans: ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
        --font-serif: ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;
        --font-mono: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
        --color-red-50: oklch(.971 .013 17.38);
        --color-red-100: oklch(.936 .032 17.717);
        --color-red-200: oklch(.885 .062 18.334);
        --color-red-300: oklch(.808 .114 19.571);
        --color-red-400: oklch(.704 .191 22.216);
        --color-red-500: oklch(.637 .237 25.331);
        --color-red-600: oklch(.577 .245 27.325);
        --color-red-700: oklch(.505 .213 27.518);
        --color-red-800: oklch(.444 .177 26.899);
        --color-red-900: oklch(.396 .141 25.723);
        --color-red-950: oklch(.258 .092 26.042);
        --color-orange-50: oklch(.98 .016 73.684);
        --color-orange-100: oklch(.954 .038 75.164);
        --color-orange-200: oklch(.901 .076 70.697);
        --color-orange-300: oklch(.837 .128 66.29);
        --color-orange-400: oklch(.75 .183 55.934);
        --color-orange-500: oklch(.705 .213 47.604);
        --color-orange-600: oklch(.646 .222 41.116);
        --color-orange-700: oklch(.553 .195 38.402);
        --color-orange-800: oklch(.47 .157 37.304);
        --color-orange-900: oklch(.408 .123 38.172);
        --color-orange-950: oklch(.266 .079 36.259);
        --color-amber-50: oklch(.987 .022 95.277);
        --color-amber-100: oklch(.962 .059 95.617);
        --color-amber-200: oklch(.924 .12 95.746);
        --color-amber-300: oklch(.879 .169 91.605);
        --color-amber-400: oklch(.828 .189 84.429);
        --color-amber-500: oklch(.769 .188 70.08);
        --color-amber-600: oklch(.666 .179 58.318);
        --color-amber-700: oklch(.555 .163 48.998);
        --color-amber-800: oklch(.473 .137 46.201);
        --color-amber-900: oklch(.414 .112 45.904);
        --color-amber-950: oklch(.279 .077 45.635);
        --color-yellow-50: oklch(.987 .026 102.212);
        --color-yellow-100: oklch(.973 .071 103.193);
        --color-yellow-200: oklch(.945 .129 101.54);
        --color-yellow-300: oklch(.905 .182 98.111);
        --color-yellow-400: oklch(.852 .199 91.936);
        --color-yellow-500: oklch(.795 .184 86.047);
        --color-yellow-600: oklch(.681 .162 75.834);
        --color-yellow-700: oklch(.554 .135 66.442);
        --color-yellow-800: oklch(.476 .114 61.907);
        --color-yellow-900: oklch(.421 .095 57.708);
        --color-yellow-950: oklch(.286 .066 53.813);
        --color-lime-50: oklch(.986 .031 120.757);
        --color-lime-100: oklch(.967 .067 122.328);
        --color-lime-200: oklch(.938 .127 124.321);
        --color-lime-300: oklch(.897 .196 126.665);
        --color-lime-400: oklch(.841 .238 128.85);
        --color-lime-500: oklch(.768 .233 130.85);
        --color-lime-600: oklch(.648 .2 131.684);
        --color-lime-700: oklch(.532 .157 131.589);
        --color-lime-800: oklch(.453 .124 130.933);
        --color-lime-900: oklch(.405 .101 131.063);
        --color-lime-950: oklch(.274 .072 132.109);
        --color-green-50: oklch(.982 .018 155.826);
        --color-green-100: oklch(.962 .044 156.743);
        --color-green-200: oklch(.925 .084 155.995);
        --color-green-300: oklch(.871 .15 154.449);
        --color-green-400: oklch(.792 .209 151.711);
        --color-green-500: oklch(.723 .219 149.579);
        --color-green-600: oklch(.627 .194 149.214);
        --color-green-700: oklch(.527 .154 150.069);
        --color-green-800: oklch(.448 .119 151.328);
        --color-green-900: oklch(.393 .095 152.535);
        --color-green-950: oklch(.266 .065 152.934);
        --color-emerald-50: oklch(.979 .021 166.113);
        --color-emerald-100: oklch(.95 .052 163.051);
        --color-emerald-200: oklch(.905 .093 164.15);
        --color-emerald-300: oklch(.845 .143 164.978);
        --color-emerald-400: oklch(.765 .177 163.223);
        --color-emerald-500: oklch(.696 .17 162.48);
        --color-emerald-600: oklch(.596 .145 163.225);
        --color-emerald-700: oklch(.508 .118 165.612);
        --color-emerald-800: oklch(.432 .095 166.913);
        --color-emerald-900: oklch(.378 .077 168.94);
        --color-emerald-950: oklch(.262 .051 172.552);
        --color-teal-50: oklch(.984 .014 180.72);
        --color-teal-100: oklch(.953 .051 180.801);
        --color-teal-200: oklch(.91 .096 180.426);
        --color-teal-300: oklch(.855 .138 181.071);
        --color-teal-400: oklch(.777 .152 181.912);
        --color-teal-500: oklch(.704 .14 182.503);
        --color-teal-600: oklch(.6 .118 184.704);
        --color-teal-700: oklch(.511 .096 186.391);
        --color-teal-800: oklch(.437 .078 188.216);
        --color-teal-900: oklch(.386 .063 188.416);
        --color-teal-950: oklch(.277 .046 192.524);
        --color-cyan-50: oklch(.984 .019 200.873);
        --color-cyan-100: oklch(.956 .045 203.388);
        --color-cyan-200: oklch(.917 .08 205.041);
        --color-cyan-300: oklch(.865 .127 207.078);
        --color-cyan-400: oklch(.789 .154 211.53);
        --color-cyan-500: oklch(.715 .143 215.221);
        --color-cyan-600: oklch(.609 .126 221.723);
        --color-cyan-700: oklch(.52 .105 223.128);
        --color-cyan-800: oklch(.45 .085 224.283);
        --color-cyan-900: oklch(.398 .07 227.392);
        --color-cyan-950: oklch(.302 .056 229.695);
        --color-sky-50: oklch(.977 .013 236.62);
        --color-sky-100: oklch(.951 .026 236.824);
        --color-sky-200: oklch(.901 .058 230.902);
        --color-sky-300: oklch(.828 .111 230.318);
        --color-sky-400: oklch(.746 .16 232.661);
        --color-sky-500: oklch(.685 .169 237.323);
        --color-sky-600: oklch(.588 .158 241.966);
        --color-sky-700: oklch(.5 .134 242.749);
        --color-sky-800: oklch(.443 .11 240.79);
        --color-sky-900: oklch(.391 .09 240.876);
        --color-sky-950: oklch(.293 .066 243.157);
        --color-blue-50: oklch(.97 .014 254.604);
        --color-blue-100: oklch(.932 .032 255.585);
        --color-blue-200: oklch(.882 .059 254.128);
        --color-blue-300: oklch(.809 .105 251.813);
        --color-blue-400: oklch(.707 .165 254.624);
        --color-blue-500: oklch(.623 .214 259.815);
        --color-blue-600: oklch(.546 .245 262.881);
        --color-blue-700: oklch(.488 .243 264.376);
        --color-blue-800: oklch(.424 .199 265.638);
        --color-blue-900: oklch(.379 .146 265.522);
        --color-blue-950: oklch(.282 .091 267.935);
        --color-indigo-50: oklch(.962 .018 272.314);
        --color-indigo-100: oklch(.93 .034 272.788);
        --color-indigo-200: oklch(.87 .065 274.039);
        --color-indigo-300: oklch(.785 .115 274.713);
        --color-indigo-400: oklch(.673 .182 276.935);
        --color-indigo-500: oklch(.585 .233 277.117);
        --color-indigo-600: oklch(.511 .262 276.966);
        --color-indigo-700: oklch(.457 .24 277.023);
        --color-indigo-800: oklch(.398 .195 277.366);
        --color-indigo-900: oklch(.359 .144 278.697);
        --color-indigo-950: oklch(.257 .09 281.288);
        --color-violet-50: oklch(.969 .016 293.756);
        --color-violet-100: oklch(.943 .029 294.588);
        --color-violet-200: oklch(.894 .057 293.283);
        --color-violet-300: oklch(.811 .111 293.571);
        --color-violet-400: oklch(.702 .183 293.541);
        --color-violet-500: oklch(.606 .25 292.717);
        --color-violet-600: oklch(.541 .281 293.009);
        --color-violet-700: oklch(.491 .27 292.581);
        --color-violet-800: oklch(.432 .232 292.759);
        --color-violet-900: oklch(.38 .189 293.745);
        --color-violet-950: oklch(.283 .141 291.089);
        --color-purple-50: oklch(.977 .014 308.299);
        --color-purple-100: oklch(.946 .033 307.174);
        --color-purple-200: oklch(.902 .063 306.703);
        --color-purple-300: oklch(.827 .119 306.383);
        --color-purple-400: oklch(.714 .203 305.504);
        --color-purple-500: oklch(.627 .265 303.9);
        --color-purple-600: oklch(.558 .288 302.321);
        --color-purple-700: oklch(.496 .265 301.924);
        --color-purple-800: oklch(.438 .218 303.724);
        --color-purple-900: oklch(.381 .176 304.987);
        --color-purple-950: oklch(.291 .149 302.717);
        --color-fuchsia-50: oklch(.977 .017 320.058);
        --color-fuchsia-100: oklch(.952 .037 318.852);
        --color-fuchsia-200: oklch(.903 .076 319.62);
        --color-fuchsia-300: oklch(.833 .145 321.434);
        --color-fuchsia-400: oklch(.74 .238 322.16);
        --color-fuchsia-500: oklch(.667 .295 322.15);
        --color-fuchsia-600: oklch(.591 .293 322.896);
        --color-fuchsia-700: oklch(.518 .253 323.949);
        --color-fuchsia-800: oklch(.452 .211 324.591);
        --color-fuchsia-900: oklch(.401 .17 325.612);
        --color-fuchsia-950: oklch(.293 .136 325.661);
        --color-pink-50: oklch(.971 .014 343.198);
        --color-pink-100: oklch(.948 .028 342.258);
        --color-pink-200: oklch(.899 .061 343.231);
        --color-pink-300: oklch(.823 .12 346.018);
        --color-pink-400: oklch(.718 .202 349.761);
        --color-pink-500: oklch(.656 .241 354.308);
        --color-pink-600: oklch(.592 .249 .584);
        --color-pink-700: oklch(.525 .223 3.958);
        --color-pink-800: oklch(.459 .187 3.815);
        --color-pink-900: oklch(.408 .153 2.432);
        --color-pink-950: oklch(.284 .109 3.907);
        --color-rose-50: oklch(.969 .015 12.422);
        --color-rose-100: oklch(.941 .03 12.58);
        --color-rose-200: oklch(.892 .058 10.001);
        --color-rose-300: oklch(.81 .117 11.638);
        --color-rose-400: oklch(.712 .194 13.428);
        --color-rose-500: oklch(.645 .246 16.439);
        --color-rose-600: oklch(.586 .253 17.585);
        --color-rose-700: oklch(.514 .222 16.935);
        --color-rose-800: oklch(.455 .188 13.697);
        --color-rose-900: oklch(.41 .159 10.272);
        --color-rose-950: oklch(.271 .105 12.094);
        --color-slate-50: oklch(.984 .003 247.858);
        --color-slate-100: oklch(.968 .007 247.896);
        --color-slate-200: oklch(.929 .013 255.508);
        --color-slate-300: oklch(.869 .022 252.894);
        --color-slate-400: oklch(.704 .04 256.788);
        --color-slate-500: oklch(.554 .046 257.417);
        --color-slate-600: oklch(.446 .043 257.281);
        --color-slate-700: oklch(.372 .044 257.287);
        --color-slate-800: oklch(.279 .041 260.031);
        --color-slate-900: oklch(.208 .042 265.755);
        --color-slate-950: oklch(.129 .042 264.695);
        --color-gray-50: oklch(.985 .002 247.839);
        --color-gray-100: oklch(.967 .003 264.542);
        --color-gray-200: oklch(.928 .006 264.531);
        --color-gray-300: oklch(.872 .01 258.338);
        --color-gray-400: oklch(.707 .022 261.325);
        --color-gray-500: oklch(.551 .027 264.364);
        --color-gray-600: oklch(.446 .03 256.802);
        --color-gray-700: oklch(.373 .034 259.733);
        --color-gray-800: oklch(.278 .033 256.848);
        --color-gray-900: oklch(.21 .034 264.665);
        --color-gray-950: oklch(.13 .028 261.692);
        --color-zinc-50: oklch(.985 0 0);
        --color-zinc-100: oklch(.967 .001 286.375);
        --color-zinc-200: oklch(.92 .004 286.32);
        --color-zinc-300: oklch(.871 .006 286.286);
        --color-zinc-400: oklch(.705 .015 286.067);
        --color-zinc-500: oklch(.552 .016 285.938);
        --color-zinc-600: oklch(.442 .017 285.786);
        --color-zinc-700: oklch(.37 .013 285.805);
        --color-zinc-800: oklch(.274 .006 286.033);
        --color-zinc-900: oklch(.21 .006 285.885);
        --color-zinc-950: oklch(.141 .005 285.823);
        --color-neutral-50: oklch(.985 0 0);
        --color-neutral-100: oklch(.97 0 0);
        --color-neutral-200: oklch(.922 0 0);
        --color-neutral-300: oklch(.87 0 0);
        --color-neutral-400: oklch(.708 0 0);
        --color-neutral-500: oklch(.556 0 0);
        --color-neutral-600: oklch(.439 0 0);
        --color-neutral-700: oklch(.371 0 0);
        --color-neutral-800: oklch(.269 0 0);
        --color-neutral-900: oklch(.205 0 0);
        --color-neutral-950: oklch(.145 0 0);
        --color-stone-50: oklch(.985 .001 106.423);
        --color-stone-100: oklch(.97 .001 106.424);
        --color-stone-200: oklch(.923 .003 48.717);
        --color-stone-300: oklch(.869 .005 56.366);
        --color-stone-400: oklch(.709 .01 56.259);
        --color-stone-500: oklch(.553 .013 58.071);
        --color-stone-600: oklch(.444 .011 73.639);
        --color-stone-700: oklch(.374 .01 67.558);
        --color-stone-800: oklch(.268 .007 34.298);
        --color-stone-900: oklch(.216 .006 56.043);
        --color-stone-950: oklch(.147 .004 49.25);
        --color-black: #000;
        --color-white: #fff;
        --spacing: clamp(1*(1 - var(--multiplier))/16*1rem,1/var(--dw)*100vw,1*(1 + var(--multiplier))/16*1rem);
        --container-3xs: 16rem;
        --container-2xs: 18rem;
        --container-xs: 20rem;
        --container-sm: 24rem;
        --container-md: 28rem;
        --container-lg: 32rem;
        --container-xl: 36rem;
        --container-2xl: 42rem;
        --container-3xl: 48rem;
        --container-4xl: 56rem;
        --container-5xl: 64rem;
        --container-6xl: 72rem;
        --container-7xl: 80rem;
        --text-xs: .75rem;
        --text-xs--line-height: calc(1/.75);
        --text-sm: .875rem;
        --text-sm--line-height: calc(1.25/.875);
        --text-base: 1rem;
        --text-base--line-height: 1.5 ;
        --text-lg: 1.125rem;
        --text-lg--line-height: calc(1.75/1.125);
        --text-xl: 1.25rem;
        --text-xl--line-height: calc(1.75/1.25);
        --text-2xl: 1.5rem;
        --text-2xl--line-height: calc(2/1.5);
        --text-3xl: 1.875rem;
        --text-3xl--line-height: 1.2 ;
        --text-4xl: 2.25rem;
        --text-4xl--line-height: calc(2.5/2.25);
        --text-5xl: 3rem;
        --text-5xl--line-height: 1;
        --text-6xl: 3.75rem;
        --text-6xl--line-height: 1;
        --text-7xl: 4.5rem;
        --text-7xl--line-height: 1;
        --text-8xl: 6rem;
        --text-8xl--line-height: 1;
        --text-9xl: 8rem;
        --text-9xl--line-height: 1;
        --font-weight-thin: 100;
        --font-weight-extralight: 200;
        --font-weight-light: 300;
        --font-weight-normal: 400;
        --font-weight-medium: 500;
        --font-weight-semibold: 600;
        --font-weight-bold: 700;
        --font-weight-extrabold: 800;
        --font-weight-black: 900;
        --tracking-tighter: -.05em;
        --tracking-tight: -.025em;
        --tracking-normal: 0em;
        --tracking-wide: .025em;
        --tracking-wider: .05em;
        --tracking-widest: .1em;
        --shadow-2xs: 0 1px #0000000d;
        --shadow-xs: 0 1px 2px 0 #0000000d;
        --shadow-sm: 0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a;
        --shadow-md: 0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;
        --shadow-lg: 0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;
        --shadow-xl: 0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;
        --shadow-2xl: 0 25px 50px -12px #00000040;
        --inset-shadow-2xs: inset 0 1px #0000000d;
        --inset-shadow-xs: inset 0 1px 1px #0000000d;
        --inset-shadow-sm: inset 0 2px 4px #0000000d;
        --drop-shadow-xs: 0 1px 1px #0000000d;
        --drop-shadow-sm: 0 1px 2px #00000026;
        --drop-shadow-md: 0 3px 3px #0000001f;
        --drop-shadow-lg: 0 4px 4px #00000026;
        --drop-shadow-xl: 0 9px 7px #0000001a;
        --drop-shadow-2xl: 0 25px 25px #00000026;
        --ease-in: cubic-bezier(.4,0,1,1);
        --ease-out: cubic-bezier(0,0,.2,1);
        --ease-in-out: cubic-bezier(.4,0,.2,1);
        --animate-spin: spin 1s linear infinite;
        --animate-ping: ping 1s cubic-bezier(0,0,.2,1)infinite;
        --animate-pulse: pulse 2s cubic-bezier(.4,0,.6,1)infinite;
        --animate-bounce: bounce 1s infinite;
        --blur-xs: 4px;
        --blur-sm: 8px;
        --blur-md: 12px;
        --blur-lg: 16px;
        --blur-xl: 24px;
        --blur-2xl: 40px;
        --blur-3xl: 64px;
        --perspective-dramatic: 100px;
        --perspective-near: 300px;
        --perspective-normal: 500px;
        --perspective-midrange: 800px;
        --perspective-distant: 1200px;
        --aspect-video: 16/9;
        --default-transition-duration: .15s;
        --default-transition-timing-function: cubic-bezier(.4,0,.2,1);
        --default-font-family: var(--font-sans);
        --default-font-feature-settings: var(--font-sans--font-feature-settings);
        --default-font-variation-settings: var(--font-sans--font-variation-settings);
        --default-mono-font-family: var(--font-mono);
        --default-mono-font-feature-settings: var(--font-mono--font-feature-settings);
        --default-mono-font-variation-settings: var(--font-mono--font-variation-settings);
        --color-grey: #dedede;
        --color-dark-grey: #c5c5c5;
        --color-white-50: color-mix(in srgb,var(--color-white),transparent 50%);
        --color-main: #3dff17;
        --color-dark-main: #3ad61c;
        --cont: calc(var(--spacing)*32);
        --section: var(--section-spacing);
        --section-spacing: 100vh
    }
}

@layer base {
    *,:after,:before,::backdrop {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    ::file-selector-button {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    html,: host {
        -webkit-text-size-adjust:100%;
        tab-size: 4;
        line-height: 1.5;
        font-family: var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");
        font-feature-settings: var(--default-font-feature-settings,normal);
        font-variation-settings: var(--default-font-variation-settings,normal);
        -webkit-tap-highlight-color: transparent
    }

    body {
        line-height: inherit
    }

    hr {
        height: 0;
        color: inherit;
        border-top-width: 1px
    }

    abbr: where([title]) {
        -webkit-text-decoration:underline dotted;
        text-decoration: underline dotted
    }

    h1,h2,h3,h4,h5,h6 {
        font-size: inherit;
        font-weight: inherit
    }

    a {
        color: inherit;
        -webkit-text-decoration: inherit;
        text-decoration: inherit
    }

    b,strong {
        font-weight: bolder
    }

    code,kbd,samp,pre {
        font-family: var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);
        font-feature-settings: var(--default-mono-font-feature-settings,normal);
        font-variation-settings: var(--default-mono-font-variation-settings,normal);
        font-size: 1em
    }

    small {
        font-size: 80%
    }

    sub,sup {
        vertical-align: baseline;
        font-size: 75%;
        line-height: 0;
        position: relative
    }

    sub {
        bottom: -.25em
    }

    sup {
        top: -.5em
    }

    table {
        text-indent: 0;
        border-color: inherit;
        border-collapse: collapse
    }

    :-moz-focusring {
        outline: auto
    }

    progress {
        vertical-align: baseline
    }

    summary {
        display: list-item
    }

    ol,ul,menu {
        list-style: none
    }

    img,svg,video,canvas,audio,iframe,embed,object {
        vertical-align: middle;
        display: block
    }

    img,video {
        max-width: 100%;
        height: auto
    }

    button,input,select,optgroup,textarea {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: #0000;
        border-radius: 0
    }

    ::file-selector-button {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: #0000;
        border-radius: 0
    }

    :where(select: is([multiple],[size])) optgroup {
        font-weight:bolder
    }

    :where(select: is([multiple],[size])) optgroup option {
        padding-inline-start:20px
    }

    ::file-selector-button {
        margin-inline-end:4px}

    ::placeholder {
        opacity: 1;
        color: color-mix(in oklab,currentColor 50%,transparent)
    }

    textarea {
        resize: vertical
    }

    ::-webkit-search-decoration {
        -webkit-appearance: none
    }

    ::-webkit-date-and-time-value {
        min-height: 1lh;
        text-align: inherit
    }

    ::-webkit-datetime-edit {
        display: inline-flex
    }

    ::-webkit-datetime-edit-fields-wrapper {
        padding: 0
    }

    ::-webkit-datetime-edit {
        padding-block:0}

    ::-webkit-datetime-edit-year-field {
        padding-block:0}

    ::-webkit-datetime-edit-month-field {
        padding-block:0}

    ::-webkit-datetime-edit-day-field {
        padding-block:0}

    ::-webkit-datetime-edit-hour-field {
        padding-block:0}

    ::-webkit-datetime-edit-minute-field {
        padding-block:0}

    ::-webkit-datetime-edit-second-field {
        padding-block:0}

    ::-webkit-datetime-edit-millisecond-field {
        padding-block:0}

    ::-webkit-datetime-edit-meridiem-field {
        padding-block:0}

    :-moz-ui-invalid {
        box-shadow: none
    }

    button,input: where([type=button],[type=reset],[type=submit]) {
        appearance:button
    }

    ::file-selector-button {
        appearance: button
    }

    ::-webkit-inner-spin-button {
        height: auto
    }

    ::-webkit-outer-spin-button {
        height: auto
    }

    [hidden]: where(:not([hidden=until-found])) {
        display:none!important
    }
}

@layer components;@layer utilities {
    .pointer-events-none {
        pointer-events: none
    }

    .visible {
        visibility: visible
    }

    .\!absolute {
        position: absolute!important
    }

    .\!sticky {
        position: sticky!important
    }

    .absolute {
        position: absolute
    }

    .fixed {
        position: fixed
    }

    .relative {
        position: relative
    }

    .static {
        position: static
    }

    .sticky {
        position: sticky
    }

    .inset-0 {
        inset: calc(var(--spacing)*0)
    }

    .-top-30 {
        top: calc(var(--spacing)*-30)
    }

    .top-0 {
        top: calc(var(--spacing)*0)
    }

    .top-1\/2 {
        top: 50%
    }

    .top-1\/4 {
        top: 25%
    }

    .top-10 {
        top: calc(var(--spacing)*10)
    }

    .top-20 {
        top: calc(var(--spacing)*20)
    }

    .top-\[7\.577083vw\] {
        top: 7.57708vw
    }

    .top-\[calc\(100\%\+var\(--spacing\)\*30\)\] {
        top: calc(100% + var(--spacing)*30)
    }

    .top-full {
        top: 100%
    }

    .-right-28 {
        right: calc(var(--spacing)*-28)
    }

    .right-0 {
        right: calc(var(--spacing)*0)
    }

    .right-10 {
        right: calc(var(--spacing)*10)
    }

    .right-15 {
        right: calc(var(--spacing)*15)
    }

    .right-20 {
        right: calc(var(--spacing)*20)
    }

    .right-full {
        right: 100%
    }

    .-bottom-30 {
        bottom: calc(var(--spacing)*-30)
    }

    .bottom-0 {
        bottom: calc(var(--spacing)*0)
    }

    .bottom-1\/2 {
        bottom: 50%
    }

    .bottom-12 {
        bottom: calc(var(--spacing)*12)
    }

    .bottom-20 {
        bottom: calc(var(--spacing)*20)
    }

    .bottom-30 {
        bottom: calc(var(--spacing)*30)
    }

    .bottom-31 {
        bottom: calc(var(--spacing)*31)
    }

    .bottom-full {
        bottom: 100%
    }

    .-left-15 {
        left: calc(var(--spacing)*-15)
    }

    .-left-40 {
        left: calc(var(--spacing)*-40)
    }

    .left-0 {
        left: calc(var(--spacing)*0)
    }

    .left-1\/2 {
        left: 50%
    }

    .left-15 {
        left: calc(var(--spacing)*15)
    }

    .left-\[46\.379167vw\] {
        left: 46.3792vw
    }

    .left-\[70\%\] {
        left: 70%
    }

    .-z-1 {
        z-index: -1
    }

    .z-0 {
        z-index: 0
    }

    .z-1 {
        z-index: 1
    }

    .z-2 {
        z-index: 2
    }

    .z-9 {
        z-index: 9
    }

    .z-10 {
        z-index: 10
    }

    .z-12 {
        z-index: 12
    }

    .z-15 {
        z-index: 15
    }

    .col-span-2 {
        grid-column: span 2/span 2
    }

    .container {
        width: 100%
    }

    @media (width>=479px) {
        .container {
            max-width: 479px
        }
    }

    @media (width>=1023px) {
        .container {
            max-width: 1023px
        }
    }

    @media (width>=1024px) {
        .container {
            max-width: 1024px
        }
    }

    .-mx-100 {
        margin-inline:calc(var(--spacing)*-100)}

    .-mt-30 {
        margin-top: calc(var(--spacing)*-30)
    }

    .mt-12 {
        margin-top: calc(var(--spacing)*12)
    }

    .mt-20 {
        margin-top: calc(var(--spacing)*20)
    }

    .mt-30 {
        margin-top: calc(var(--spacing)*30)
    }

    .mt-120 {
        margin-top: calc(var(--spacing)*120)
    }

    .mt-150 {
        margin-top: calc(var(--spacing)*150)
    }

    .mt-\[40vh\] {
        margin-top: 40vh
    }

    .mr-75 {
        margin-right: calc(var(--spacing)*75)
    }

    .mr-160 {
        margin-right: calc(var(--spacing)*160)
    }

    .mr-\[calc\(52\/1920\*100vw\)\] {
        margin-right: 2.70833vw
    }

    .mr-\[calc\(340\/1920\*100vw\)\] {
        margin-right: 17.7083vw
    }

    .-mb-\[5\.2083333333vw\] {
        margin-bottom: -5.20833vw
    }

    .-mb-\[40vh\] {
        margin-bottom: -40vh
    }

    .mb-15 {
        margin-bottom: calc(var(--spacing)*15)
    }

    .mb-20 {
        margin-bottom: calc(var(--spacing)*20)
    }

    .mb-24 {
        margin-bottom: calc(var(--spacing)*24)
    }

    .mb-30 {
        margin-bottom: calc(var(--spacing)*30)
    }

    .mb-50 {
        margin-bottom: calc(var(--spacing)*50)
    }

    .mb-60 {
        margin-bottom: calc(var(--spacing)*60)
    }

    .mb-\[80vh\] {
        margin-bottom: 80vh
    }

    .ml-\[calc\(113\/1920\*100vw\)\] {
        margin-left: 5.88542vw
    }

    .ml-\[calc\(135\/1920\*100vw\)\] {
        margin-left: 7.03125vw
    }

    .ml-\[calc\(285\/1920\*100vw\)\] {
        margin-left: 14.8438vw
    }

    .ml-\[calc\(350\/1920\*100vw\)\] {
        margin-left: 18.2292vw
    }

    .ml-\[calc\(780\/1920\*100vw\)\] {
        margin-left: 40.625vw
    }

    .block {
        display: block
    }

    .contents {
        display: contents
    }

    .flex {
        display: flex
    }

    .grid {
        display: grid
    }

    .hidden {
        display: none
    }

    .inline {
        display: inline
    }

    .aspect-\[170\/96\] {
        aspect-ratio: 170/96
    }

    .aspect-\[792\/187\] {
        aspect-ratio: 792/187
    }

    .aspect-video {
        aspect-ratio: var(--aspect-video)
    }

    .h-2 {
        height: calc(var(--spacing)*2)
    }

    .h-5 {
        height: calc(var(--spacing)*5)
    }

    .h-8 {
        height: calc(var(--spacing)*8)
    }

    .h-12 {
        height: calc(var(--spacing)*12)
    }

    .h-13 {
        height: calc(var(--spacing)*13)
    }

    .h-14 {
        height: calc(var(--spacing)*14)
    }

    .h-15 {
        height: calc(var(--spacing)*15)
    }

    .h-16 {
        height: calc(var(--spacing)*16)
    }

    .h-21 {
        height: calc(var(--spacing)*21)
    }

    .h-25 {
        height: calc(var(--spacing)*25)
    }

    .h-28 {
        height: calc(var(--spacing)*28)
    }

    .h-30 {
        height: calc(var(--spacing)*30)
    }

    .h-37 {
        height: calc(var(--spacing)*37)
    }

    .h-52 {
        height: calc(var(--spacing)*52)
    }

    .h-68 {
        height: calc(var(--spacing)*68)
    }

    .h-\[1em\] {
        height: 1em
    }

    .h-\[400vh\] {
        height: 400vh
    }

    .h-\[550vh\] {
        height: 550vh
    }

    .h-\[calc\(100vh-100\*var\(--spacing\)\)\] {
        height: calc(100vh - 100*var(--spacing))
    }

    .h-dvh {
        height: 100dvh
    }

    .h-full {
        height: 100%
    }

    .h-lvh {
        height: 100lvh
    }

    .h-max {
        height: max-content
    }

    .h-px {
        height: 1px
    }

    .h-screen {
        height: 100vh
    }

    .min-h-160 {
        min-height: calc(var(--spacing)*160)
    }

    .min-h-screen {
        min-height: 100vh
    }

    .min-h-svh {
        min-height: 100svh
    }

    .w-2 {
        width: calc(var(--spacing)*2)
    }

    .w-12 {
        width: calc(var(--spacing)*12)
    }

    .w-13 {
        width: calc(var(--spacing)*13)
    }

    .w-14 {
        width: calc(var(--spacing)*14)
    }

    .w-15 {
        width: calc(var(--spacing)*15)
    }

    .w-16 {
        width: calc(var(--spacing)*16)
    }

    .w-21 {
        width: calc(var(--spacing)*21)
    }

    .w-25 {
        width: calc(var(--spacing)*25)
    }

    .w-28 {
        width: calc(var(--spacing)*28)
    }

    .w-38 {
        width: calc(var(--spacing)*38)
    }

    .w-40 {
        width: calc(var(--spacing)*40)
    }

    .w-60 {
        width: calc(var(--spacing)*60)
    }

    .w-68 {
        width: calc(var(--spacing)*68)
    }

    .w-160 {
        width: calc(var(--spacing)*160)
    }

    .w-170 {
        width: calc(var(--spacing)*170)
    }

    .w-200 {
        width: calc(var(--spacing)*200)
    }

    .w-\[10\.9375vw\] {
        width: 10.9375vw
    }

    .w-\[10ch\] {
        width: 10ch
    }

    .w-\[13ch\] {
        width: 13ch
    }

    .w-\[20vw\] {
        width: 20vw
    }

    .w-full {
        width: 100%
    }

    .w-max {
        width: max-content
    }

    .max-w-320 {
        max-width: calc(var(--spacing)*320)
    }

    .max-w-380 {
        max-width: calc(var(--spacing)*380)
    }

    .max-w-400 {
        max-width: calc(var(--spacing)*400)
    }

    .max-w-none {
        max-width: none
    }

    .flex-none {
        flex: none
    }

    .flex-grow,.grow {
        flex-grow: 1
    }

    .-translate-x-1\/2 {
        --tw-translate-x: -50% ;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .-translate-y-1\/2 {
        --tw-translate-y: -50% ;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .-translate-y-2 {
        --tw-translate-y: calc(var(--spacing)*-2);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .-translate-y-20 {
        --tw-translate-y: calc(var(--spacing)*-20);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .-translate-y-40 {
        --tw-translate-y: calc(var(--spacing)*-40);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .-translate-y-\[0\.5em\] {
        --tw-translate-y: -.5em ;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .translate-x-2 {
        --tw-translate-x: calc(var(--spacing)*2);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .translate-y-20 {
        --tw-translate-y: calc(var(--spacing)*20);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .rotate-90 {
        rotate: 90deg
    }

    .\!transform {
        transform: var(--tw-rotate-x)var(--tw-rotate-y)var(--tw-rotate-z)var(--tw-skew-x)var(--tw-skew-y)!important
    }

    .transform {
        transform: var(--tw-rotate-x)var(--tw-rotate-y)var(--tw-rotate-z)var(--tw-skew-x)var(--tw-skew-y)
    }

    .cursor-pointer {
        cursor: pointer
    }

    .resize {
        resize: both
    }

    .grid-cols-2 {
        grid-template-columns: repeat(2,minmax(0,1fr))
    }

    .grid-cols-3 {
        grid-template-columns: repeat(3,minmax(0,1fr))
    }

    .grid-cols-4 {
        grid-template-columns: repeat(4,minmax(0,1fr))
    }

    .grid-cols-6 {
        grid-template-columns: repeat(6,minmax(0,1fr))
    }

    .grid-rows-3 {
        grid-template-rows: repeat(3,minmax(0,1fr))
    }

    .flex-col {
        flex-direction: column
    }

    .flex-row {
        flex-direction: row
    }

    .items-center {
        align-items: center
    }

    .items-end {
        align-items: flex-end
    }

    .items-start {
        align-items: flex-start
    }

    .justify-between {
        justify-content: space-between
    }

    .justify-center {
        justify-content: center
    }

    .justify-end {
        justify-content: flex-end
    }

    .gap-2 {
        gap: calc(var(--spacing)*2)
    }

    .gap-3 {
        gap: calc(var(--spacing)*3)
    }

    .gap-4 {
        gap: calc(var(--spacing)*4)
    }

    .gap-10 {
        gap: calc(var(--spacing)*10)
    }

    .gap-11 {
        gap: calc(var(--spacing)*11)
    }

    .gap-12 {
        gap: calc(var(--spacing)*12)
    }

    .gap-14 {
        gap: calc(var(--spacing)*14)
    }

    .gap-15 {
        gap: calc(var(--spacing)*15)
    }

    .gap-16 {
        gap: calc(var(--spacing)*16)
    }

    .gap-18 {
        gap: calc(var(--spacing)*18)
    }

    .gap-20 {
        gap: calc(var(--spacing)*20)
    }

    .gap-21 {
        gap: calc(var(--spacing)*21)
    }

    .gap-30 {
        gap: calc(var(--spacing)*30)
    }

    .gap-33 {
        gap: calc(var(--spacing)*33)
    }

    .gap-40 {
        gap: calc(var(--spacing)*40)
    }

    .gap-50 {
        gap: calc(var(--spacing)*50)
    }

    .gap-55 {
        gap: calc(var(--spacing)*55)
    }

    .gap-60 {
        gap: calc(var(--spacing)*60)
    }

    .gap-68 {
        gap: calc(var(--spacing)*68)
    }

    .gap-75 {
        gap: calc(var(--spacing)*75)
    }

    .gap-148 {
        gap: calc(var(--spacing)*148)
    }

    .gap-300 {
        gap: calc(var(--spacing)*300)
    }

    .gap-\[0\.2em\] {
        gap: .2em
    }

    .gap-\[1ch\] {
        gap: 1ch
    }

    .gap-\[2ch\] {
        gap: 2ch
    }

    .self-center {
        align-self: center
    }

    .self-end {
        align-self: flex-end
    }

    .self-start {
        align-self: flex-start
    }

    .self-stretch {
        align-self: stretch
    }

    .justify-self-start {
        justify-self: flex-start
    }

    .overflow-clip {
        overflow: clip
    }

    .overflow-hidden {
        overflow: hidden
    }

    .rounded-40 {
        border-radius: calc(var(--spacing)*40)
    }

    .rounded-\[4px\] {
        border-radius: 4px
    }

    .rounded-\[6px\] {
        border-radius: 6px
    }

    .rounded-vw {
        border-radius: 100vw
    }

    .border {
        border-style: var(--tw-border-style);
        border-width: 1px
    }

    .bg-\[\#E7E7E7\] {
        background-color: #e7e7e7
    }

    .bg-black {
        background-color: var(--color-black)
    }

    .bg-current {
        background-color: currentColor
    }

    .bg-dark-grey {
        background-color: var(--color-dark-grey)
    }

    .bg-grey {
        background-color: var(--color-grey)
    }

    .bg-main {
        background-color: var(--color-main)
    }

    .bg-white {
        background-color: var(--color-white)
    }

    .object-contain {
        object-fit: contain
    }

    .object-cover {
        object-fit: cover
    }

    .object-\[top_right\] {
        object-position: top right
    }

    .px-5 {
        padding-inline:calc(var(--spacing)*5)}

    .px-12 {
        padding-inline: calc(var(--spacing)*12)
    }

    .px-20 {
        padding-inline:calc(var(--spacing)*20)}

    .px-100 {
        padding-inline: calc(var(--spacing)*100)
    }

    .px-\[0\.7291666667vw\] {
        padding-inline: .729167vw
    }

    .py-6 {
        padding-block:calc(var(--spacing)*6)}

    .py-13 {
        padding-block: calc(var(--spacing)*13)
    }

    .py-20 {
        padding-block:calc(var(--spacing)*20)}

    .py-50 {
        padding-block: calc(var(--spacing)*50)
    }

    .py-125 {
        padding-block:calc(var(--spacing)*125)}

    .py-\[0\.3125vw\] {
        padding-block: .3125vw
    }

    .py-section {
        padding-block:var(--section-spacing)}

    .pt-6 {
        padding-top: calc(var(--spacing)*6)
    }

    .pt-20 {
        padding-top: calc(var(--spacing)*20)
    }

    .pt-50 {
        padding-top: calc(var(--spacing)*50)
    }

    .pt-120 {
        padding-top: calc(var(--spacing)*120)
    }

    .pt-\[7\.1354166667vw\] {
        padding-top: 7.13542vw
    }

    .pt-\[50vh\] {
        padding-top: 50vh
    }

    .pt-section {
        padding-top: var(--section-spacing)
    }

    .pr-0 {
        padding-right: calc(var(--spacing)*0)
    }

    .pr-40 {
        padding-right: calc(var(--spacing)*40)
    }

    .pr-82 {
        padding-right: calc(var(--spacing)*82)
    }

    .pr-100 {
        padding-right: calc(var(--spacing)*100)
    }

    .pr-\[4\.1666666667vw\] {
        padding-right: 4.16667vw
    }

    .pr-\[13\.02083333333vw\] {
        padding-right: 13.0208vw
    }

    .pb-20 {
        padding-bottom: calc(var(--spacing)*20)
    }

    .pb-60 {
        padding-bottom: calc(var(--spacing)*60)
    }

    .pb-70 {
        padding-bottom: calc(var(--spacing)*70)
    }

    .pb-\[25vh\] {
        padding-bottom: 25vh
    }

    .pb-\[80vh\] {
        padding-bottom: 80vh
    }

    .pb-section {
        padding-bottom: var(--section-spacing)
    }

    .pl-0 {
        padding-left: calc(var(--spacing)*0)
    }

    .pl-13 {
        padding-left: calc(var(--spacing)*13)
    }

    .pl-44 {
        padding-left: calc(var(--spacing)*44)
    }

    .pl-\[20\.8333333333vw\] {
        padding-left: 20.8333vw
    }

    .text-center {
        text-align: center
    }

    .text-left {
        text-align: left
    }

    .text-right {
        text-align: right
    }

    .font-mono {
        font-family: var(--font-mono)
    }

    .leading-1 {
        --tw-leading: 1;
        line-height: 1
    }

    .leading-1\.2 {
        --tw-leading: 1.2;
        line-height: 1.2
    }

    .font-bold {
        --tw-font-weight: var(--font-weight-bold);
        font-weight: var(--font-weight-bold)
    }

    .font-medium {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

    .font-semibold {
        --tw-font-weight: var(--font-weight-semibold);
        font-weight: var(--font-weight-semibold)
    }

    .-tracking-\[0\.02em\] {
        --tw-tracking: -.02em ;
        letter-spacing: -.02em
    }

    .text-\[\#9C9C9C\] {
        color: #9c9c9c
    }

    .text-black {
        color: var(--color-black)
    }

    .text-current {
        color: currentColor
    }

    .text-white {
        color: var(--color-white)
    }

    .lowercase {
        text-transform: lowercase
    }

    .uppercase {
        text-transform: uppercase
    }

    .opacity-0 {
        opacity: 0
    }

    .filter {
        filter: var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)
    }

    .backdrop-blur-2xl {
        --tw-backdrop-blur: blur(var(--blur-2xl));
        -webkit-backdrop-filter: var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);
        backdrop-filter: var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)
    }

    .backdrop-blur-xl {
        --tw-backdrop-blur: blur(var(--blur-xl));
        -webkit-backdrop-filter: var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);
        backdrop-filter: var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)
    }

    .transition {
        transition-property: color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    .transition-all {
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    .transition-opacity {
        transition-property: opacity;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    .duration-300 {
        --tw-duration: .3s;
        transition-duration: .3s
    }

    .will-change-transform {
        will-change: transform
    }

    .outline-none {
        --tw-outline-style: none;
        outline-style: none
    }

    .perspective-normal {
        perspective: var(--perspective-normal)
    }

    .transform-3d {
        transform-style: preserve-3d
    }

    .placeholder\: text-\[\#E7E7E7\]::placeholder {
        color:#e7e7e7
    }

    @media (hover: hover) {
        .hover\:bg-main:hover {
            background-color:var(--color-main)
        }

        .hover\:text-black:hover {
            color: var(--color-black)
        }
    }

    .focus\: border-white\/30:focus {
        border-color:color-mix(in oklab,var(--color-white)30%,transparent)
    }

    .active\: bg-main:active {
        background-color:var(--color-main)
    }

    .active\: text-black:active {
        color:var(--color-black)
    }

    @media (width<=1023px) {
        .l\: absolute {
            position:absolute
        }

        .l\:fixed {
            position: fixed
        }

        .l\:relative {
            position: relative
        }

        .l\:top-0 {
            top: calc(var(--spacing)*0)
        }

        .l\:top-10 {
            top: calc(var(--spacing)*10)
        }

        .l\:top-\[22\.877083vw\] {
            top: 22.8771vw
        }

        .l\:right-15 {
            right: calc(var(--spacing)*15)
        }

        .l\:right-\[16vw\] {
            right: 16vw
        }

        .l\:bottom-100 {
            bottom: calc(var(--spacing)*100)
        }

        .l\:left-0 {
            left: calc(var(--spacing)*0)
        }

        .l\:left-10 {
            left: calc(var(--spacing)*10)
        }

        .l\:left-auto {
            left: auto
        }

        .l\:col-span-1 {
            grid-column: span 1/span 1
        }

        .l\:col-start-2 {
            grid-column-start: 2
        }

        .l\:col-end-2 {
            grid-column-end: 2
        }

        .l\:-mx-cont {
            margin-inline:calc(var(--cont)*-1)}

        .l\: mt-0 {
            margin-top:calc(var(--spacing)*0)
        }

        .l\:mr-0 {
            margin-right: calc(var(--spacing)*0)
        }

        .l\:mb-18 {
            margin-bottom: calc(var(--spacing)*18)
        }

        .l\:mb-20 {
            margin-bottom: calc(var(--spacing)*20)
        }

        .l\:mb-30 {
            margin-bottom: calc(var(--spacing)*30)
        }

        .l\:flex {
            display: flex
        }

        .l\:hidden {
            display: none
        }

        .l\:h-10 {
            height: calc(var(--spacing)*10)
        }

        .l\:h-20 {
            height: calc(var(--spacing)*20)
        }

        .l\:w-10 {
            width: calc(var(--spacing)*10)
        }

        .l\:w-20 {
            width: calc(var(--spacing)*20)
        }

        .l\:w-100 {
            width: calc(var(--spacing)*100)
        }

        .l\:w-\[22vw\] {
            width: 22vw
        }

        .l\:w-auto {
            width: auto
        }

        .l\:max-w-none {
            max-width: none
        }

        .l\:-translate-x-\[50\%\] {
            --tw-translate-x: -50% ;
            translate: var(--tw-translate-x)var(--tw-translate-y)
        }

        .l\:translate-x-\[50\%\] {
            --tw-translate-x: 50%;
            translate: var(--tw-translate-x)var(--tw-translate-y)
        }

        .l\:translate-y-0 {
            --tw-translate-y: calc(var(--spacing)*0);
            translate: var(--tw-translate-x)var(--tw-translate-y)
        }

        .l\:rotate-90 {
            rotate: 90deg
        }

        .l\:grid-cols-2 {
            grid-template-columns: repeat(2,minmax(0,1fr))
        }

        .l\:grid-cols-3 {
            grid-template-columns: repeat(3,minmax(0,1fr))
        }

        .l\:flex-col {
            flex-direction: column
        }

        .l\:flex-row {
            flex-direction: row
        }

        .l\:items-start {
            align-items: flex-start
        }

        .l\:justify-between {
            justify-content: space-between
        }

        .l\:justify-start {
            justify-content: flex-start
        }

        .l\:gap-10 {
            gap: calc(var(--spacing)*10)
        }

        .l\:gap-20 {
            gap: calc(var(--spacing)*20)
        }

        .l\:gap-30 {
            gap: calc(var(--spacing)*30)
        }

        .l\:gap-40 {
            gap: calc(var(--spacing)*40)
        }

        .l\:gap-100 {
            gap: calc(var(--spacing)*100)
        }

        .l\:px-cont {
            padding-inline:var(--cont)}

        .l\: py-25 {
            padding-block:calc(var(--spacing)*25)
        }

        .l\:py-44 {
            padding-block:calc(var(--spacing)*44)}

        .l\: pt-10 {
            padding-top:calc(var(--spacing)*10)
        }

        .l\:pt-60 {
            padding-top: calc(var(--spacing)*60)
        }

        .l\:pt-200 {
            padding-top: calc(var(--spacing)*200)
        }

        .l\:pr-10 {
            padding-right: calc(var(--spacing)*10)
        }

        .l\:pl-45 {
            padding-left: calc(var(--spacing)*45)
        }
    }

    @media (width<=479px) {
        .s\: invisible {
            visibility:hidden
        }

        .s\:absolute {
            position: absolute
        }

        .s\:relative {
            position: relative
        }

        .s\:top-10 {
            top: calc(var(--spacing)*10)
        }

        .s\:top-20 {
            top: calc(var(--spacing)*20)
        }

        .s\:top-37 {
            top: calc(var(--spacing)*37)
        }

        .s\:top-100 {
            top: calc(var(--spacing)*100)
        }

        .s\:top-\[30\.677083vw\] {
            top: 30.6771vw
        }

        .s\:right-0 {
            right: calc(var(--spacing)*0)
        }

        .s\:right-10 {
            right: calc(var(--spacing)*10)
        }

        .s\:right-28 {
            right: calc(var(--spacing)*28)
        }

        .s\:right-\[20\.5vw\] {
            right: 20.5vw
        }

        .s\:bottom-0 {
            bottom: calc(var(--spacing)*0)
        }

        .s\:bottom-9 {
            bottom: calc(var(--spacing)*9)
        }

        .s\:bottom-10 {
            bottom: calc(var(--spacing)*10)
        }

        .s\:bottom-auto {
            bottom: auto
        }

        .s\:-left-30 {
            left: calc(var(--spacing)*-30)
        }

        .s\:left-0 {
            left: calc(var(--spacing)*0)
        }

        .s\:z-2 {
            z-index: 2
        }

        .s\:z-6 {
            z-index: 6
        }

        .s\:-mx-cont {
            margin-inline:calc(var(--cont)*-1)}

        .s\: mt-50 {
            margin-top:calc(var(--spacing)*50)
        }

        .s\:mr-0 {
            margin-right: calc(var(--spacing)*0)
        }

        .s\:mr-\[calc\(82\/1920\*100vw\)\] {
            margin-right: 4.27083vw
        }

        .s\:-mb-\[5\.8583333333vw\] {
            margin-bottom: -5.85833vw
        }

        .s\:-mb-cont {
            margin-bottom: calc(var(--cont)*-1)
        }

        .s\:mb-20 {
            margin-bottom: calc(var(--spacing)*20)
        }

        .s\:mb-30 {
            margin-bottom: calc(var(--spacing)*30)
        }

        .s\:mb-60 {
            margin-bottom: calc(var(--spacing)*60)
        }

        .s\:ml-6 {
            margin-left: calc(var(--spacing)*6)
        }

        .s\:block {
            display: block
        }

        .s\:flex {
            display: flex
        }

        .s\:hidden {
            display: none
        }

        .s\:h-13 {
            height: calc(var(--spacing)*13)
        }

        .s\:h-18 {
            height: calc(var(--spacing)*18)
        }

        .s\:h-36 {
            height: calc(var(--spacing)*36)
        }

        .s\:h-\[250vh\] {
            height: 250vh
        }

        .s\:h-auto {
            height: auto
        }

        .s\:h-full {
            height: 100%
        }

        .s\:h-screen {
            height: 100vh
        }

        .s\:min-h-80 {
            min-height: calc(var(--spacing)*80)
        }

        .s\:w-13 {
            width: calc(var(--spacing)*13)
        }

        .s\:w-18 {
            width: calc(var(--spacing)*18)
        }

        .s\:w-36 {
            width: calc(var(--spacing)*36)
        }

        .s\:w-80 {
            width: calc(var(--spacing)*80)
        }

        .s\:w-120 {
            width: calc(var(--spacing)*120)
        }

        .s\:w-\[32vw\] {
            width: 32vw
        }

        .s\:w-\[calc\(100\%\+var\(--cont\)\*2\)\] {
            width: calc(100% + var(--cont)*2)
        }

        .s\:w-full {
            width: 100%
        }

        .s\:w-max {
            width: max-content
        }

        .s\:w-px {
            width: 1px
        }

        .s\:max-w-260 {
            max-width: calc(var(--spacing)*260)
        }

        .s\:max-w-320 {
            max-width: calc(var(--spacing)*320)
        }

        .s\:flex-none {
            flex: none
        }

        .s\:-translate-x-\[63\%\] {
            --tw-translate-x: -63% ;
            translate: var(--tw-translate-x)var(--tw-translate-y)
        }

        .s\:translate-x-\[68\%\] {
            --tw-translate-x: 68%;
            translate: var(--tw-translate-x)var(--tw-translate-y)
        }

        .s\:translate-y-0 {
            --tw-translate-y: calc(var(--spacing)*0);
            translate: var(--tw-translate-x)var(--tw-translate-y)
        }

        .s\:translate-y-1 {
            --tw-translate-y: calc(var(--spacing)*1);
            translate: var(--tw-translate-x)var(--tw-translate-y)
        }

        .s\:translate-y-2 {
            --tw-translate-y: calc(var(--spacing)*2);
            translate: var(--tw-translate-x)var(--tw-translate-y)
        }

        .s\:flex-col {
            flex-direction: column
        }

        .s\:flex-row {
            flex-direction: row
        }

        .s\:items-center {
            align-items: center
        }

        .s\:items-end {
            align-items: flex-end
        }

        .s\:justify-between {
            justify-content: space-between
        }

        .s\:gap-10 {
            gap: calc(var(--spacing)*10)
        }

        .s\:gap-20 {
            gap: calc(var(--spacing)*20)
        }

        .s\:gap-30 {
            gap: calc(var(--spacing)*30)
        }

        .s\:self-center {
            align-self: center
        }

        .s\:bg-main {
            background-color: var(--color-main)
        }

        .s\:object-\[75\%_50\%\] {
            object-position: 75% 50%
        }

        .s\:object-\[90\%_50\%\] {
            object-position: 90% 50%
        }

        .s\:px-20 {
            padding-inline:calc(var(--spacing)*20)}

        .s\: px-cont {
            padding-inline:var(--cont)
        }

        .s\:py-10 {
            padding-block:calc(var(--spacing)*10)}

        .s\: py-15 {
            padding-block:calc(var(--spacing)*15)
        }

        .s\:py-20 {
            padding-block:calc(var(--spacing)*20)}

        .s\: py-35 {
            padding-block:calc(var(--spacing)*35)
        }

        .s\:py-\[0\.8125vw\] {
            padding-block:.8125vw}

        .s\:pt-0 {
            padding-top: calc(var(--spacing)*0)
        }

        .s\:pt-7 {
            padding-top: calc(var(--spacing)*7)
        }

        .s\:pt-10 {
            padding-top: calc(var(--spacing)*10)
        }

        .s\:pt-100 {
            padding-top: calc(var(--spacing)*100)
        }

        .s\:pt-160 {
            padding-top: calc(var(--spacing)*160)
        }

        .s\:pt-\[45vh\] {
            padding-top: 45vh
        }

        .s\:pr-0 {
            padding-right: calc(var(--spacing)*0)
        }

        .s\:pr-8 {
            padding-right: calc(var(--spacing)*8)
        }

        .s\:\!pb-\[60vh\] {
            padding-bottom: 60vh!important
        }

        .s\:pb-0 {
            padding-bottom: calc(var(--spacing)*0)
        }

        .s\:pb-20 {
            padding-bottom: calc(var(--spacing)*20)
        }

        .s\:pb-30 {
            padding-bottom: calc(var(--spacing)*30)
        }

        .s\:pb-\[50vh\] {
            padding-bottom: 50vh
        }

        .s\:pb-cont {
            padding-bottom: var(--cont)
        }

        .s\:leading-1 {
            --tw-leading: 1;
            line-height: 1
        }

        .s\:text-black {
            color: var(--color-black)
        }

        .s\:uppercase {
            text-transform: uppercase
        }
    }
}

@media screen and (width<=1023px) {
    : root {
        --cont:calc(var(--spacing)*24);
        --section-spacing: 130vh
    }
}

@keyframes spin {
    to {
        transform: rotate(360deg)
    }
}

@keyframes ping {
    75%,to {
        opacity: 0;
        transform: scale(2)
    }
}

@keyframes pulse {
    50% {
        opacity: .5
    }
}

@keyframes bounce {
    0%,to {
        animation-timing-function: cubic-bezier(.8,0,1,1);
        transform: translateY(-25%)
    }

    50% {
        animation-timing-function: cubic-bezier(0,0,.2,1);
        transform: none
    }
}

@property --tw-translate-x {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-y {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-z {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-rotate-x {
    syntax: "*";
    inherits: false;
    initial-value: rotateX(0)
}

@property --tw-rotate-y {
    syntax: "*";
    inherits: false;
    initial-value: rotateY(0)
}

@property --tw-rotate-z {
    syntax: "*";
    inherits: false;
    initial-value: rotateZ(0)
}

@property --tw-skew-x {
    syntax: "*";
    inherits: false;
    initial-value: skewX(0)
}

@property --tw-skew-y {
    syntax: "*";
    inherits: false;
    initial-value: skewY(0)
}

@property --tw-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-leading {
    syntax: "*";
    inherits: false
}

@property --tw-font-weight {
    syntax: "*";
    inherits: false
}

@property --tw-tracking {
    syntax: "*";
    inherits: false
}

@property --tw-blur {
    syntax: "*";
    inherits: false
}

@property --tw-brightness {
    syntax: "*";
    inherits: false
}

@property --tw-contrast {
    syntax: "*";
    inherits: false
}

@property --tw-grayscale {
    syntax: "*";
    inherits: false
}

@property --tw-hue-rotate {
    syntax: "*";
    inherits: false
}

@property --tw-invert {
    syntax: "*";
    inherits: false
}

@property --tw-opacity {
    syntax: "*";
    inherits: false
}

@property --tw-saturate {
    syntax: "*";
    inherits: false
}

@property --tw-sepia {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-blur {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-brightness {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-contrast {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-grayscale {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-hue-rotate {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-invert {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-opacity {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-saturate {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-sepia {
    syntax: "*";
    inherits: false
}

@property --tw-duration {
    syntax: "*";
    inherits: false
}

.rule[data-astro-cid-sckkx6r4] {
    background-color: red;
    height: 1px;
    position: fixed;
    left: 0;
    right: 0;
    z-index: 1000;
    top: 50%;
    transform: translateY(-50%)
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in-up {
    opacity: 0; /* Start hidden */
    animation: fadeInUp 0.8s ease-out 0.3s forwards;
}