@keyframes appearance {
    0% {
        opacity: 0;
        transform: translateY(-30%);
    }

    100% {
        opacity: 1;
        transform: translateY(0%);
    }
}


@keyframes rays-rotation {
    0% {
        scale: 1;
        rotate: -90deg;
    }

    50% {
        scale: 1.05;
        /*rotate: -95deg;*/
    }

    100% {
        scale: 1;
        rotate: -90deg;
    }
}

@keyframes appearance-rev-rotated {
    0% {
        opacity: 0;
        transform: translateY(30%) rotate(10deg);
    }

    100% {
        opacity: 1;
        transform: translateY(0%);
    }
}


@keyframes appearanceShadow {
    0% {
        box-shadow: 0px 0px 0px #eee8aa, inset 3px 3px 20px #84848425;
    }

    25% {
        box-shadow: 0px 0px 150px #eee8aa, inset 3px 3px 20px #84848425;
    }


    75% {
        box-shadow: 0px 0px 0px #121212, inset 3px 3px 20px #84848425;
    }

    100% {
        box-shadow: 0px 0px 50px #121212, inset 3px 3px 20px #84848425;
    }
}


.second-section {
    background: #121212;
    z-index: 100;
    position: relative;
    padding: 8vw;
    border-top-right-radius: 100px;
    border-top-left-radius: 100px;
    padding-bottom: 20vh;
    overflow: hidden;

    transform: scale(0.9);
}

.info-table {
    display: flex;
    flex-direction: column;

    background: #12121290;
    border-radius: 40px;
    width: max-content;
    font-size: 20px;
    outline: 2px solid #96969650;
    /*outline: 3px solid #fff5;*/
    min-width: 25ch;

    animation: 1s ease 0s 1 appearance;

    transition: all .2s ease;
}

.info-table-header   {
    padding-inline: 3ch;
    padding-block: 1.5ch;
    color: #E6A96C;
    text-align: center;
}

.info-table-data {
    display: flex;
    flex-direction: column;
    padding: 25px;
    outline: 2px solid #96969650;
    border-radius: 40px;
    color: rgb(256, 256, 256, .8);
    background: #121212;

    transition: all .2s ease;
}

.info-table-data a {
    text-decoration: none;
}

.info-table-data:hover {
    transform: rotate(-5deg);
}

.appearence-on-scroll {
    opacity: 0;
    filter: blur(5px);
    animation: none;
}

.appearence-on-scroll.from-down {
    opacity: 0;
    transform: translateY(50%);
    animation: none;
}

.gear.appearence-on-scroll {
    transition: all 1s ease;
}

.gear.e {
    top: 120vh;
    left: 57vw;
    rotate: 55deg;
}

.gear.e img {
    width: 10vw;
    scale: 1.5;
    animation: 1s ease-in-out .5s 1 forwards appearance-right;
}

.gear.f {
    top: 25vh;
    left: 80vw;
    rotate: -35deg;
}

.gear.f img {
    width: 10vw;
    scale: 1.5;
    animation: 1s ease-in-out .5s 1 forwards appearance-right;
}

.gear.g {
    top: 225vh;
    left: 80vw;
    rotate: 35deg;
    z-index: 1100;
}

.gear.g img {
    width: 10vw;
    scale: 1.5;
    animation: 1s ease-in-out .5s 1 forwards appearance-right;
}

.gear.h {
    top: 235vh;
    left: 20vw;
    rotate: -35deg;
}

.gear.h img {
    width: 10vw;
    scale: 1.5;
    animation: 1s ease-in-out .5s 1 forwards appearance-right;
}

.gear.i {
    top: 85vh;
    left: 30vw;
    rotate: 66deg;
}

.gear.i img {
    width: 10vw;
    scale: 1.5;
    animation: 1s ease-in-out .5s 1 forwards appearance-right;
}

.gear.k {
    top: 420vh;
    left: 80vw;
    rotate: 66deg;
    z-index: -1;
}

.gear.k img {
    width: 10vw;
    scale: 1.5;
    opacity: .5!important;
    animation: 1s ease-in-out .5s 1 forwards appearance-right;
}

.gear.m {
    top: 327vh;
    left: 30vw;
    rotate: -66deg;
}

.gear.m img {
    width: 10vw;
    scale: 2.5;
    opacity: .5!important;
    z-index: 2000;
    animation: 1s ease-in-out .5s 1 forwards appearance-right;
}

.gear.j {
    top: 520vh;
    left: 70vw;
    rotate: -33deg;
}

.gear.j img {
    width: 10vw;
    scale: 1.5;
    opacity: .5!important;
    z-index: 2000;
    animation: 1s ease-in-out .5s 1 forwards appearance-right;
}

.gear.l {
    top: 590vh;
    left: 30vw;
    rotate: 33deg;
    z-index: -1;
    scale: 1.55;
}

.gear.l img {
    width: 10vw;
    scale: 1.5;
    opacity: .5!important;
    z-index: 2000;
    animation: 1s ease-in-out .5s 1 forwards appearance-right;
}

.products-header {
    font-size: min(65px, 5vw);
    font-weight: bold;
    line-height: min(65px, 4.5vw);
    color: rgb(255, 255, 255, .5);
}

h2 {
    font-size: min(65px, 5vw);
    font-weight: bold;
    line-height: min(65px, 4.5vw);
    color: rgb(255, 255, 255, .5);
    letter-spacing: -2px;
}

.products {
    display: flex;
    list-style: none;
    gap: 50px;
    width: max-content;
    max-width: 92vw;

    padding: 0px;

    padding-block: 25px;

    margin-left: 28em;
    transition: all .5s ease-in-out;

    scrollbar-color: #969696 rgb(30, 30, 30);
    scrollbar-width: thin;
}

.product {
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 2px solid #96969650;
    border-radius: 40px;
    width: 17vw;
    min-width: max(17vw, 13em);
    padding: 25px;

    font-size: 25px;
    backdrop-filter: blur(5px);
    background: #12121250;
    overflow: hidden;
    height: 65vh;
    min-height: fit-content;

    box-shadow: inset 3px 3px 20px #84848425;
    transition: all .2s ease;
}

.old-product-price {
    text-decoration: line-through;
    font-family: 'Unbounded';
    color: rgb(255, 255, 255, .25);
    background: transparent;
    -webkit-background-clip: initial;
    -webkit-text-fill-color: initial;
    font-size: 20px;
}

.act-product-price {
    background: var(--accent-text-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.product-price-glow.a {
    background: radial-gradient(circle, #e0a66b20 0%, transparent 50%);
    transform: translateY(-49%) translateX(10%);
}

.product-price-glow.b {
    background: radial-gradient(circle, #e0a66b24 0%, transparent 50%);
    transform: translate(-50%, -179%);
}

.product img {
    transition: all .2s ease;
}

.product:hover img {
    filter: none!important;
    transform: scale(1.05);
}

.card-shadow {
    opacity: 0;
}

.product:hover .card-shadow {
    opacity: .5;
}

.product:hover {
    /*transform: rotate(1deg);*/
}

.product-arrow {
    font-family: "Unbounded";
    transition: all .2s ease;
}

.product:hover .product-arrow {
    margin-left: 15px;
}

.product-header {
    font-size: 35px;
    font-family: 'Unbounded';
    margin: 0px;
    margin-bottom: 25px;
    background: var(--accent-text-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    width: max-content;
    text-shadow: 1px 1px 40px #e6a96c50;
    letter-spacing: -2px;
}

.product-desc {
    max-width: max-content;
    text-align: center;
    line-height: 1;
    opacity: .5;
    margin-bottom: 25px;
    font-size: 20px;
}

.product-order {
    display: flex;
    background: radial-gradient(circle, rgba(230, 169, 108, 1) 0%, rgba(189, 129, 74, 1) 100%);

    padding: 15px;
    font-size: 25px;
    border-radius: 50px;
    border: 0px;
    width: stretch;
    margin-top: 15px;
    font-weight: bold;

    color: #121212;
    text-transform: uppercase;
    font-weight: 700;
    box-shadow: 1px 1px 40px #e2a56950;

    font-family: 'Unbounded';
    cursor: pointer;

    align-items: center;
    justify-content: space-between;
    padding-left: 1ch;

    transition: all .2s ease;
}

.product .order-btn-arrow {
    background: #121212;
    color: #c58950;
    aspect-ratio: 1 / 1;
    width: auto;
    height: auto;
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 48px;
    grid-row: 1;
    grid-column: 1;
    transition: all .5s ease, margin 1s ease;
}

.product-order:hover {
    /*font-size: 22.5px;*/
    /*padding: 17.5px;*/
    padding-inline: 15px;
    background: #121212;

    padding-left: 2ch;

    /*background: linear-gradient(90deg,rgba(230, 169, 108, .5) -120%, rgba(255, 255, 255, .05) 50%, rgba(230, 169, 108, .5) 220%);*/
    box-shadow: none;
    color: #E6A96C;
    outline: 2px solid #96969650;
    box-shadow: inset 3px 3px 20px #84848425;
}

.product-order:hover .order-btn-arrow {
    rotate: 45deg;
}

.slider-btn {
    border-radius: 50%;
    width: 5ch;
    aspect-ratio: 1/1;
    border: 2px solid #969696;
    background: transparent;
    color: #969696;
    font-weight: bold;
    font-size: 52px;
    margin-bottom: 25px;
    cursor: pointer;
}

.slider-btn:hover {
    border: 2px solid #E6A96C;
    color: #E6A96C;
}

.h-beam.a {
    width: 100vw;
    position: absolute;
    left: -16px;
    top: 0px;
    z-index: -1;
    border-top-right-radius: 100px;
}

.h-beam.b {
    width: 100vw;
    position: absolute;
    left: -16px;
    top: 25em;
    transform: rotate(-5deg);
    opacity: .25;
    z-index: -1;
}

.products-slider {
    /*animation: 1s ease 0s 1 forwards appearance-rev;*/
    transition: opacity 1s ease;

    top: 20vh;
    z-index: 10;
    position: sticky;
}

#aboutH {
    background: var(--accent-text-color);
    height: 72px;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 1px 1px 40px #e6a96c50;
}

.about-h {
    width: fit-content;
    font-size: 65px;
    color: rgb(255, 255, 255, .75);

    margin-block: 0px;

    transition: all .5s ease;
}

.about-dates {
    -webkit-background-clip: initial;
    -webkit-text-fill-color: initial;
    text-shadow: none;
    opacity: .5;
    padding-left: 1ch;
}

.about-facts {
    list-style: none;
    font-size: 25px;
    color: rgb(255, 255, 255, .75);
    gap: 15px;
    display: flex;
    flex-direction: column;
    grid-row: 2;
    padding-left: 0px;
    max-width: 36ch;
}

#adresses {
    max-width: calc(5 * var(--w-col));
}

.about-facts li {
    transition: all 1.5s 0s ease;
}


.about .about-facts li:nth-child(1) {
    transition: all 1s 0s ease;
}

.about .about-facts li:nth-child(2) {
    transition: all 1s .25s ease;
}

.about .about-facts li:nth-child(3) {
    transition: all 1s .5s ease;
}

.about .about-facts li:nth-child(4) {
    transition: all 1s .75s ease;
}

/*.about-facts li:nth-child(5) {*/
/*    transition: all 1s 1s ease;*/
/*}*/

/*.about-facts li:nth-child(6) {*/
/*    transition: all 1s 1.25s ease;*/
/*}*/

.small-link {
    background: rgb(255, 255, 255, .1);
    color: rgb(255, 255, 255, .75);
    text-decoration: none;
    border-radius: 15px;
    font-size: 15px;
    padding: 5px;
    padding-inline: 15px;
}

.small-link:hover {
    background: rgb(255, 255, 255, .25);
}

.about {
    margin-top: 25vh;
    display: grid;
    gap: 10vh;
    grid-template-rows: 4em 14em 15em;
    grid-template-columns: 25em auto;
}

.about-img {
    /*filter: grayscale(1);*/
    bottom: 38vh;
    width: auto;
    left: 1vw;
    top: 250vh;
    opacity: .75;
    margin-bottom: 10px;

    transition: all 1s .5s ease;
}

.about-img:nth-last-child(1) {
    margin-bottom: 0px;
}

.galery-header-text {
    background: #121212;
    min-height: 25px;
    min-width: 100px;
    display: flex;
    margin-inline: auto;
    /* margin-top: 10px; */
    border-radius: 50px;
    padding: 5px;
    justify-content: center;
    align-items: center;
    width: fit-content;
    font-size: 25px;
    padding-inline: 20px;
    color: rgb(255, 255, 255, .75);
}

.about-galery.appearence-on-scroll {
    transform: translateY(50%) translateX(-50%) rotate(-20deg);
}

.about-galery.appearence-on-scroll .about-img {
    opacity: .1!important;
}

.about-galery {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: scroll;
    /*scrollbar-width: thin;*/
    grid-row-end: -1;
    max-height: 100vh;
    gap: 0px!important;
    rotate: -5deg;

    border-radius: 50px;
    outline: 10px solid #121212;
    background: #121212;

    /*box-shadow: 0px 0px 80px #ffffff50;*/

    transition: transform 2s .5s ease-in-out, opacity 2s 1s ease;
}

.about-galery::-webkit-scrollbar {
    background-color: #121212;
    display: none;
}

.about-galery::-webkit-scrollbar-thumb  {
    background-color: #55555550;
}

.about-galery img {
    pointer-events: all!important;
}

.about-galery img:hover {
    filter: none!important;
}

.about-img.appearence-on-scroll {
    transform: translateX(-50%) rotate(-15deg);
    opacity: 0;
}

.contacts {
    margin-inline: auto;
    position: relative;
    height: auto;
    width: calc(var(--w-col) * 8);
    display: grid;
    grid-template-columns: 1fr;
    border-radius: 50px;
    margin-top: 40vh;
    margin-bottom: 40vh;
    transition: all 1s ease;
}

.contacts .footer-glow-wrapper img {
    width: 100vw;
}

#submitOrderButton {
    height: 90px;
}

.contacts-h {
    width: -webkit-fill-available;
    color: rgb(255, 255, 255, .5);
    margin: 0px;
    background: #22222250;
    border-radius: 25px;
    margin-right: 1vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#orderH {
    padding: 2vw;
}

.contacts-h span {
}

.about-links {
    grid: revert;
    grid-row: 3;
    padding-left: 0px;
    display: flex;
    gap: 5px;
    justify-content: flex-end;
}

.about-links.appearence-on-scroll {
    transition: all 1s ease;
}

.circle-link {
    box-shadow: inset 3px 3px 20px #84848425;
    border: 2px solid #96969650;

    color: #969696;
    padding: 1vw;
    border-radius: 50%;
    aspect-ratio: 1 / 1;
    min-width: 15ch;
    display: flex;
    align-items: center;
    justify-content: center;

    flex-direction: column;

    text-decoration: none;
    text-align: center;
    gap: 5px;

    background: #121212;

    font-size: 15px;
    height: max-content;
    width: 10vw;
    cursor: pointer;

    transition: transform 1s ease, rotate .2s ease, scale .2s ease, opacity .2s ease;
}

.circle-link:hover {
    rotate: 22.5deg;
    scale: .9;
    color: #e6a96c;
    outline: 2px solid #e6a96c;
}

.circle-link img {
    width: 2ch;
    padding-left: 1ch;
    filter: grayscale(1);
    display: block;
}

.circle-link:hover img {
    filter: none;
}

.contact-content {
    display: flex;
    flex-direction: row;
    background: #12121290;
    justify-content: space-between;
    min-width: 45em;
    overflow: hidden;
    border-radius: 50px;
    padding: 1vw;
}

.contact-type-switch {
    padding: 5px;
    border-radius: 25px;
    background: rgb(255, 255, 255, .05);
    height: fit-content;
    width: -webkit-fill-available;
    max-width: none;
}

.contect-type-switch-btn {
    background: rgb(255, 255, 255, 0);
    border: 0px;
    padding: 5px;
    padding-right: 29px;
    padding-inline: 15px;
    HEIGHT: 80PX;
    border-radius: 20px;
    color: rgb(255, 255, 255, .75);
    cursor: pointer;
    font-family: 'Helvetica';
    font-size: 16px;
    transition: all .2s ease;
    display: flex;
    justify-content: space-between;
    align-content: center;
    width: -webkit-fill-available;
    align-items: flex-start;
}

.contact-content form {
    display: flex;
    flex-direction: column;
    margin-bottom: 0px;
    width: max-content;
    padding: 19px;
    border-radius: 30px;
    font-size: 20px;
    margin-inline: auto;

    /*background: #12121290;*/
    /**/
    transition: all 1s ease;
}

.contect-type-switch-btn span {
    pointer-events: none;
}

.contect-type-switch-btn:hover {
    background: rgb(255, 255, 255, .1);
}

.contect-type-switch-btn.active {
    box-shadow: inset 0px 0px 90px #dda166, inset 0px 0px 90px #dda166;
    color: #121212;
}

.contect-type-switch-btn img {
    opacity: 0;
    transform: translateY(-50%) translateX(-50%);
    transition: all .2s ease;
}

.contect-type-switch-btn:hover img {
    opacity: .5;
    transform: none;
}

.contect-type-switch-btn.active img {
    filter: invert(1);
    opacity: 1;
    transform: none;
}

.contact-content input {
    font-size: 20px;
    background: transparent;
    border: none;
    border-bottom: 2px solid rgb(255, 255, 255, .5);
    color: #E6A96C;
    width: -webkit-fill-available;

    background: rgb(255, 255, 255, .05);
    padding: 10px;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
}

.contact-content input:nth-child(1), .contact-content input:nth-child(2) {
    border-bottom: 2px solid #E6A96C;
    box-shadow: inset 0px -7px 20px #E6A96C20;
}

#promoGlow {
    animation: 1.1s linear 0s 1 transparentAnim, 4s ease-in-out 1s 1 appearance-opacity;
}

.contact-content input:focus-visible {
    outline: none;
}

.contacts-image {
    z-index: -1;
    filter: brightness(0.5);
    width: -webkit-fill-available;
    bottom: -32%;
    transform: translateY(0px);
    left: 0px;
    top: 0px;
    height: 100%;
    opacity: 1;
    width: auto;
    animation: none;
}

.contacts-image-wrapper {
    width: 50vw;
    height: 50vh;
    display: flex;
    justify-content: center;
    overflow: hidden;
    filter: grayscale(1) brightness(0.5);
    border-radius: 50px;
    width: auto;
    transition: all 1s ease;
}

.contacts-image-wrapper:hover {
    filter: none;
}

.contacts-field-set {
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: 1ch;
    column-gap: 1ch;
    /*flex-wrap: wrap;*/
    max-width: 32vw;
    margin-top: 2ch;
}

.contacts-disclaimer {
    max-width: 40ch;
    padding-top: 2ch;
    opacity: .5;
    font-size: 20px;
}

.h-colorized {
    background: var(--accent-text-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 1px 1px 40px #e6a96c50;

    width: fit-content;
    margin-left: auto;
    transition: all .2s .5s ease;
}

.comment-h {
    color: rgb(255, 255, 255, .5);
    margin: 0px;
    width: 100%;
    text-align: center;
    display: block;
    transition: all 2s ease;
}

.comment-h.h-colorized {
    background: var(--accent-text-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 1px 1px 40px #e6a96c50;
}

.adresses {
    display: flex;
    flex-direction: column;
    gap: 5px;

    margin-top: 10vh;
    color: rgb(255, 255, 255, .5);
    font-size: 25px;
    align-items: flex-end;
    transition: all 1s ease;
}

.adresses {

}

footer {
    display: flex;
    flex-direction: column;
    background: #202020;
    color: rgb(255, 255, 255, .5);
    position: relative;
    z-index: 1000;
    overflow: hidden;
    padding: 50px;
    padding-inline: var(--w-col);
    height: 60vh;
    border-radius: 25px;
    margin-inline: auto;
    width: 69vw;
    filter: none!important;
    margin-top: 30vh;
    /*box-shadow: 0px 0px 280px #ffffff20;*/
    max-width: -webkit-fill-available;
    transition: all 1s 1s ease;
}

footer.appearence-on-scroll {
    box-shadow: none;
}

.footer-img {
    width: 60vw;
    opacity: 1;
    z-index: 10;
    filter: brightness(0.75);
    transition: all 1s ease;
}

.footer-big-text {
    font-family: 'Unbounded', sans-serif;
    font-weight: 900;
    color: #e6a96c;
    font-size: 8.6vw;
    margin-block: auto;
    text-align: center;
    letter-spacing: -7px;
    line-height: .85;
    mix-blend-mode: difference;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: radial-gradient(circle, rgba(230, 169, 108, 1) 0%, rgb(143 98 55) 100%);
    text-shadow: none;
    background: url(/static/img/example5.webp);
    background: url(/static/img/bg.png);
    background-position: right;
    filter: brightness(2);
}

.footer-glow-wrapper {
    height: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 0px;
}

.cookie-agr {
    background: rgb(20, 20, 20, .9);
    padding: 15px;
    display: flex;
    gap: 15px;
    border-radius: 25px;
    opacity: 0;
    align-items: center;

    border: 2px solid #96969650;
    box-shadow: inset 3px 3px 20px #84848425;

    animation: 1s ease 1s 1 forwards appearance-rev;
    transition: all .2s ease;
}

.cookie-agr-wrapper {
    height: 0px;
    position: sticky;
    top: 50vh;
    display: flex;
    align-items: center;
    z-index: 10000;
    justify-content: flex-end;
    padding-inline: var(--w-col);
}

.cookie-btn {
    cursor: pointer;
    background: #004aa9;
    color: #e6a96c;
    border: none;
    border-radius: 15px;
    aspect-ratio: 1 / 1;
    width: 60px;
    height: 60px;

    transition: all .2s ease;
}

.cookie-btn:hover {
    border-radius: 50%;
    transform: scale(1.1) rotate(45deg);
}

.cookie-agr.hidden {
    transform: translateX(100%)!important;
    opacity: 0!important;
}

.contacts-link-list {
    display: flex;
    gap: 5px;
    left: 0px;
    flex-wrap: wrap;
    top: 96px;
    margin-top: 10vh;
    max-width: 25vw;
    margin-right: auto;
    transition: all 1s ease;
    height: min-content;
}

.contacts-glow img {
    position: relative;
    top: -32vh;
    width: 68vw;
    z-index: -1;
    opacity: .3;
}

.doc-wrapper {
    height: 0px;
    position: fixed;
    z-index: 1000;
    top: 26vh;
}

.doc {
    /*height: 67vh;*/
    border-radius: 50px;
    margin-inline: var(--w-col);
    background: rgb(18, 18, 18, .75);
    box-shadow: inset 5px 5px 30px #c9c9c950, 0px 0px 200px #121212, 0px 0px 200px #121212;
    overflow-y: auto;
    backdrop-filter: blur(25px);

    pointer-events: all;

    transition: transform 1s ease, visibility 0s 0s ease, max-height 1.5s ease;
}

.product-switch {
    cursor: pointer;
    min-width: 0px;
    flex-direction: column;
    border-radius: 30px;
    height: calc(calc(83vh - 7.5vh) - 2vw);
    z-index: -1;
    border-radius: 40px;
    max-width: 43ch;
    border: 2px solid #96969650;
    background: rgb(18, 18, 18, .75);
    margin: 0px;
    width: fit-content;
    gap: 0px;
    margin-top: 15vh;
    /* box-shadow: 0px 0px 150px #ffffff, inset 3px 3px 20px #84848425; */
    overflow-y: scroll;
    animation: .6s linear 0s 1 transparentAnim, 1.5s ease .5s 1 appearance-rev-rotated;
}

.product-switch::-webkit-scrollbar {
    display: none;
}

.product-switch:hover {
    rotate: 2.5deg;
}

.promo-glow {
    height: 0px;
    z-index: 1;
    width: 13ch;
    margin-inline: auto;
    align-items: flex-start;
    justify-content: center;
    pointer-events: none;
}

.close-promo-btn {
    background: transparent;
    border: none;
    color: #eee8aa;
    display: flex;
    justify-content: space-between;
    width: -webkit-fill-available;
    font-size: 20px;
    cursor: pointer;
}

.close-promo-btn:hover {
    text-decoration: underline;
}

.product-price-glow, #productSwitchGlow1, #productSwitchGlow2 {
    background: radial-gradient(circle, #eee8aa50 0%, transparent 50%);
    pointer-events: none;
    width: 27vw;
    height: 15vw;
    max-width: none;
    border-radius: 50%;
}

#productSwitchGlow2 {
    transform: translate(-72%, -195%);
}

#productSwitchGlow1 {
    transform: translateY(-38%);
}

#promoWrapper {
    height: 0px;
    margin-left: auto;
    z-index: 100;
    padding-inline: var(--w-col);
    overflow: visible;
    position: sticky;
    display: flex;
    justify-content: flex-end;
    width: -webkit-fill-available;
    top: 18.7vh;
}

.use-promo-btn {
    background: #eee8aa;
    border-radius: 100px;
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 30px;
    font-family: 'Unbounded', sans-serif;
    font-weight: 700;
    color: #121212;
    text-transform: uppercase;
    border: none;
    width: 100%;
    cursor: pointer;
    justify-content: center;
    padding: 5px;
    box-shadow: inset 3px 3px 20px #84848425;
    border: 2px solid #96969650;
    justify-content: space-between;


    transition: all .2s ease;
}

.use-promo-btn:hover {
    background: #121212;
    color: #eee8aa;
}

.promo-title {
    width: -webkit-fill-available;
    text-align: center;
    background: #121212;
    padding: 20px;
    border-radius: 25px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    text-align: left;

    font-family: 'Unbounded', sans-serif;
    color: #eee8aa;

    box-shadow: inset 3px 3px 20px #84848425;
    border: 2px solid #96969650;
    border-bottom: none;
}

.promo-header {
    margin: 0px;
    line-height: 30px;
    font-size: 30px;
    color: #eee8aa;
    text-shadow: 1px 1px 40px #e6a96c50;
    font-family: 'Unbounded';
    margin-bottom: 10px;
}

.promo-desc {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    overflow: visible;
    justify-content: flex-end;
    width: -webkit-fill-available;
}

.about-highlighted {
    background: var(--accent-text-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 500;
    margin-inline: .5ch;
    text-shadow: 1px 1px 40px #e6a96c50;
}

.promo-desc-text {
    color: #eee8aa;
    background: transparent;
    padding: 5px;
    border-radius: 15px;
    border: 0px;
    font-size: 20px;
    margin-left: auto;
    justify-content: space-between;
    display: flex;
    width: -webkit-fill-available;
}

#productSwitchGlow1, #productSwitchGlow2 {
    transition: all .5s ease;
}

.product-switch:hover #productSwitchGlow1 {
    transform: translate(-5%, -36%)!important;
}

.product-switch:hover #productSwitchGlow2 {
    transform: translateY(-180%) translateX(-70%)!important;
}

.doc-header {
    margin: 0px;
    margin-bottom: 2vw;
    font-size: 35px;
    line-height: 1;
    position: sticky;
    top: 2vw;
    color: #fff9;
    opacity: 1 !important;
    border-radius: 25px;
    padding: 1ch;
    background: rgb(18, 18, 18);
    box-shadow: inset 5px 5px 30px #c9c9c910;
    overflow-y: auto;
    backdrop-filter: blur(25px);

    z-index: 10;

    display: flex;
    align-items: center;
    justify-content: space-between;

    overflow: hidden;
}

.doc-close-btn {
    width: 150px;
    height: 100px;
    border-radius: 100px!important;
    font-weight: 700;
    font-size: 17px;
    font-family: 'Helvetica';
}

.doc-close-btn:hover {
    background: #004aa950;
    transform: scale(1.1)!important;
}

.doc::-webkit-scrollbar {
  display: none;
}

.doc-content {
    font-size: 20px;
    padding: 2vw;
}

.doc-content p {
    padding-left: 2vw;
    opacity: .75;
}

.doc-content p:hover {
    opacity: 1;
}

.site-dev-btn {
    z-index: 100;
    background: rgb(191 240 91);
    border-radius: 100px;
    color: #232323;
    padding: 15px;
    cursor: pointer;
    border: none;
    font-size: 16px;
    text-decoration: none!important;
    font-weight: 700;
    display: flex;
    font-family: 'Unbounded', sans-serif;
    width: 21ch;
    height: 50px;
    text-align: center;
    transition: all .2s ease;
    align-items: center;
    justify-content: space-between;
}

.site-dev-btn span {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.site-dev-btn:hover {
    background: #121212;
    background: radial-gradient(#121212 25%, #BDEF5910 100%);
    transform: scale(1.1);
    /*text-shadow: 0px 0px 20px rgb(191 240 91);*/
    color: rgb(191 240 91);
}

.footer-info-row {
    margin-bottom: 5px;
    display: flex;
    justify-content: space-between;
    gap: 5px;
    align-items: flex-end;
    z-index: 10;
    /*mix-blend-mode: plus-lighter;*/
}

.rays.a {
    position: absolute;
    top: -4%;
    z-index: -1;
    height: 238vh;
    rotate: 180deg;
    left: 25vw;
}

.galery-header {
    height: 0px;
    position: sticky;
    top: 10px;
    z-index: 10;
}

#aboutGlow img {
    position: relative;
    top: -50vh;
    left: -50%;
    height: 200vh;
    z-index: -1;
    opacity: .5;
    rotate: -90deg;

    animation: 2s ease-in-out 0s infinite rays-rotation;
}

.site-dev-btn {
    text-decoration: none!important;
}

#footerBg {
    left: 30vw !important;
    filter: blur(10px) grayscale(1) brightness(0.5)!important;
}

.product-price {
    background: rgb(255, 255, 255, .05);
    box-shadow: none;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    font-size: 25px;
    padding: 15px;
    font-size: 25px;
    border-radius: 20px;
    border: 0px;
    width: stretch;
    margin-top: 25px;
    font-weight: bold;
    text-transform: uppercase;
    font-family: 'Unbounded';
    transition: all .2s ease;
}

@media (aspect-ratio < 1/1) {
    .rays.a {
        top: 0%;
        height: 121vh;
        left: -48vw;
    }

    .product-switch {
        max-width: 90vw;
        rotate: 0deg!important;
        max-height: 70vh;
        box-shadow: 0px 0px 40px #121212, 0px 0px 80px #121212, 0px 0px 120px #121212;
    }

    .galery-header {
        height: 0px;
        position: sticky;
        top: 10px;
        left: 1px;
        z-index: 10;
    }

    #aboutGlow img {
        position: relative;
        top: 0px;
        left: -92%;
        height: 82vh;
        z-index: -1;
        opacity: .5;
        rotate: -90deg;
    }

    .product-price-glow.a {
        background: radial-gradient(circle, #e0a66b20 0%, transparent 50%);
        transform: translateY(-84%) translateX(20%);
        width: 60vw;
        height: 19vh;
    }

    .contacts-field-set {
        grid-template-columns: 1fr;
    }

    #orderH {
        padding: 5vw;
    }

    #footerLegal {
        min-height: max-content;
        text-align: left !important;
    }

    .product-price-glow.b {
        background: radial-gradient(circle, #e0a66b24 0%, transparent 50%);
        transform: translate(-48%, -144%);
        width: 60vw;
        height: 19vh;
    }

    .promo-desc {
        max-width: none;
    }

    .about-facts li {
        font-size: 20px;
    }

    #staticLegacyInfo {
        font-size: 3.1vw;
        padding-bottom: 5vh!important;
    }

    .product-switch {
        padding-bottom: 2ch;
        height: 68vh;
    }

    .use-promo-btn {
        font-size: 20px;
    }

    .act-product-price {
        font-size: 20px;
    }

    .contacts {
        box-shadow: none;
        margin-top: 20vh;
        width: auto;
    }

    .card-shadow {
        width: 55vw!important;
    }

    #productSwitchGlow2 {
        transform: translate(-74%, -143%);
        width: 90vw;
        height: 90vw;
    }

    #productSwitchGlow1 {
        transform: translateY(-45%);
        width: 90vw;
        height: 90vw;
    }

    .footer-info-row {
        mix-blend-mode: normal;
        align-items: flex-start;
        text-align: left;
        display: grid;
        grid-template-columns: 50% 50%;
        background: #12121290;
        padding: 5px;
        border-radius: 10px;
    }

    .footer-info-row:nth-last-child(1) {
        grid-template-columns: 1fr;
        background: transparent;
        justify-items: center;
        background: #12121290;
        padding: 5px;
        border-radius: 32px;
    }

    .contacts-link-list {
        max-width: fit-content;
    }

    .cookie-agr-wrapper {
        top: 20vh;
    }

    .contact-type-switch {
        border-radius: 20px;
        background: transparent;
    }

    .footer-img {
        opacity: 1;
        height: 49vh;
        width: auto;
        position: relative;
        right: 5vw;
        rotate: -14deg;
        top: 20vh;
        z-index: 1;
    }

    .footer-big-text {
        mix-blend-mode: normal;
        font-size: 11.9vw;
        letter-spacing: -3px;
        filter: none;
        background: radial-gradient(circle, rgba(230, 169, 108, 1) 0%, rgb(143 98 55) 100%);
        margin-top: 5vh;
    }

    .footer-glow-wrapper img {
        top: 4vh !important;
        height: 75vh;
        width: auto !important;
        opacity: .5 !important;
    }

    footer {
        margin-bottom: 10vh;
        padding-inline: 25px;
        font-size: 12px;
        height: 50vh;
        max-width: 100vw;
        left: calc(-1 * var(--w-col));
        padding: 20px;
        border-radius: 0px;
        margin-top: 5vh;
        width: 90.5vw;
        position: relative !important;
    }

    .doc {
        max-width: 83.3vw;
        border-radius: 25px;
    }

    .doc-wrapper {
        top: 19vh;
    }

    .doc-content p {
        font-size: 17px;
    }

    .doc-close-btn {
        width: -webkit-fill-available;
        height: min-content;
        aspect-ratio: auto;
        padding-block: 1ch;
    }

    .doc-header {
        flex-direction: column;
        font-size: 16px;
        line-height: normal;
        text-align: center;
        gap: 3vh;
        padding-block: 1vh;
    }

    .legacy-static-info-wrapper {
        top: 100vh!important;
    }

    .adresses h2 {
        text-align: start;
    }

    .adresses span {
        font-size: 20px;
    }

    .about {
        grid-template-columns: 1fr;
    }

    .second-section {
        margin-top: 100px;
        padding-top: 100px;
        border-top-right-radius: 40px;
        border-top-left-radius: 40px;
    }

    #adresses {
        max-width: fit-content;
    }

    .circle-link {
        min-width: 20vw;
        text-align: center;
        padding: 3ch;
    }

    .contact-type-switch div {
        display: flex;
        flex-wrap: wrap;
        gap: 5px;
    }

    .about {
        gap: 5vh;
        margin-top: 10vh;
    }

    .about-h {
        font-size: 35px;
        line-height: 1;
        padding-inline: 0px;
        margin: 0px;
        margin-top: 5vw;
    }

    .about-facts {
        font-size: 16px;
    }

    .short-link {
        height: fit-content;
    }

    .comment-h:nth-child(2) {
        text-align: left;
    }

    .comment-h:nth-child(3) {
        text-align: right;
    }


    .about-img {
        /* left: 0px; */
        /* top: 90.5rem; */

        z-index: 1;
        filter: none;
    }

    .about-img:nth-child(1) {
        padding-left: var(--w-col);
    }

    .info-table {
        font-size: 15px;
        margin-left: 0px!important;
    }

    .info-table.colorized {
        margin-left: auto!important;
        margin-top: 2em!important;
    }

    .h-beam {
        width: 250vw!important;
    }

    .products-header {
        margin-top: 10vh;
        margin-bottom: 5vh;
        font-size: 6.7vw;
        line-height: 1;
    }

    .products {
        gap: 30px;
        padding-top: 0px;
        margin-top: 0px;

        overflow-x: scroll;
        width: 100vw;
        margin-left: 0px !important;
        position: relative;
        left: calc(-1 * var(--w-col));
        padding-left: calc(2 * var(--w-col));

        max-width: none;
    }

    .products li:nth-child(5) {
        margin-right: 33vw;
    }

    .products-slider {
        display: none
    }

   .slider-btn {
       font-size: 20px;
   }

   .product-header {
        font-size: 22.5px;
        width: max-content;
   }

    .product-desc {
        font-size: 16px;
    }

    .product {
        padding: 15px;
        border-radius: 25px;
        min-width: 50vw;
        height: 50vh;
    }

    .product img {
        max-height: 25vh!important;
    }

    .product-order {
        margin-top: 10px;
        font-size: 15px;
    }

    .contacts {
        grid-template-columns: 1fr;
        height: max-content;
        border-radius: 25px;
        box-shadow: none;
        margin-bottom: 10vh;
    }

    .contect-type-switch-btn {
        font-size: 15px;
        background: rgb(255, 255, 255, .1);
        width: fit-content;
        height: 50px;
        border-radius: 15px;
    }

    .contact-content input {
        margin-top: 0px;
        font-size: 20px;
        max-width: -webkit-fill-available;
        width: -webkit-fill-available;
        flex-direction: column;
    }

    .contact-content {
        padding-right: 5vw;
        padding-inline: 20px;
        min-width: -webkit-fill-available;
        border-radius: 25px;
        flex-direction: column;
        padding-bottom: 5vw;
    }

    #submitOrderButton span:nth-child(1) {
        margin-left: 1ch;
    }

    .contacts-image-wrapper {
        width: auto;
        height: 25vh;
        filter: grayscale(100%);
        border-radius: 25px;
    }

    .contacts-field-set  {
        flex-direction: column;
        width: -webkit-fill-available;
        max-width: -webkit-fill-available;
    }

    .contacts-disclaimer {
        max-width: none;
        font-size: 15px;
    }

    .contacts form {
        margin-top: 2ch;
        width: auto;
        padding: 0px;
        background: transparent;
        border: none;
        box-shadow: none;
    }

    .contacts-glow img {
        width: 240vw;
        left: -75vw;
        top: -22vh;
    }

    .about-links {
        padding-left: 8.66vw;
        margin-left: auto;
    }

    .info-table-data, .info-table {
        border-radius: 25px;
    }

    .site-dev-btn {
        font-size: 15px;
        width: -webkit-fill-available;
        padding: 10px;
        height: 35px;
    }

    .about-dates {
        display: block;
        padding-left: calc(1 * var(--w-col));
    }

    .about {
        grid-template-rows: auto auto auto auto;
    }

    .about-galery {
        flex-direction: column;
        grid-row: 4;
        overflow-y: scroll;
        overflow-x: scroll;
        position: relative;
        width: 19em;
        height: 37em;
        max-width: 84vw;
        border-radius: 35px;
        background: #121212;
        margin-inline: auto;
        rotate: -5deg;
        margin-top: 10vh;
        /*box-shadow: 0px 0px 80px #ffffff50;*/
    }

    .galery-header-text {
        font-size: 20px;
        padding-inline: 10px;
    }

    .product span {
        font-size: 13px;
    }

    #productModels {
        font-size: 13px!important;
    }

    .act-product-price {
        font-size: 20px!important;
    }

    .product-order {
        padding: 10px;
        font-size: 16px!important;
    }

    .product .order-btn-arrow {
        height: 30px !important;
        width: 30px !important;
    }
}