html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent
}

body {
    line-height: 1
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

nav ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: none
}

a {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent
}

ins {
    background-color: #ff9;
    color: var(--color-black);
    text-decoration: none
}

mark {
    background-color: #ff9;
    color: var(--color-black);
    font-style: italic;
    font-weight: bold
}

del {
    text-decoration: line-through
}

abbr[title],
dfn[title] {
    border-bottom: 1px dotted;
    cursor: help
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0
}

input,
select {
    vertical-align: middle
}

ul {
    list-style: none;
}

input:focus,
select:focus,
textarea:focus {
    outline: none;
}

body.fancybox-active {
    overflow: hidden
}

body.fancybox-iosfix {
    position: fixed;
    left: 0;
    right: 0
}

.fancybox-is-hidden {
    position: absolute;
    top: -9999px;
    left: -9999px;
    visibility: hidden
}

.fancybox-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99992;
    -webkit-tap-highlight-color: transparent;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif
}

.fancybox-bg,
.fancybox-inner,
.fancybox-outer,
.fancybox-stage {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.fancybox-outer {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch
}

.fancybox-bg {
    background: #1e1e1e;
    opacity: 0;
    transition-duration: inherit;
    transition-property: opacity;
    transition-timing-function: cubic-bezier(.47, 0, .74, .71)
}

.fancybox-is-open .fancybox-bg {
    opacity: .87;
    transition-timing-function: cubic-bezier(.22, .61, .36, 1)
}

.fancybox-caption-wrap,
.fancybox-infobar,
.fancybox-toolbar {
    position: absolute;
    direction: ltr;
    z-index: 99997;
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s, visibility 0s linear .25s;
    box-sizing: border-box
}

.fancybox-show-caption .fancybox-caption-wrap,
.fancybox-show-infobar .fancybox-infobar,
.fancybox-show-toolbar .fancybox-toolbar {
    opacity: 1;
    visibility: visible;
    transition: opacity .25s, visibility 0s
}

.fancybox-infobar {
    top: 0;
    left: 0;
    font-size: 13px;
    padding: 0 10px;
    height: 44px;
    min-width: 44px;
    line-height: 44px;
    color: #ccc;
    text-align: center;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-font-smoothing: subpixel-antialiased;
    mix-blend-mode: exclusion
}

.fancybox-toolbar {
    top: 0;
    right: 0;
    margin: 0;
    padding: 0
}

.fancybox-stage {
    overflow: hidden;
    direction: ltr;
    z-index: 99994;
    -webkit-transform: translateZ(0)
}

.fancybox-is-closing .fancybox-stage {
    overflow: visible
}

.fancybox-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: auto;
    outline: none;
    white-space: normal;
    box-sizing: border-box;
    text-align: center;
    z-index: 99994;
    -webkit-overflow-scrolling: touch;
    display: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform
}

.fancybox-slide:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    height: 100%;
    width: 0
}

.fancybox-is-sliding .fancybox-slide,
.fancybox-slide--current,
.fancybox-slide--next,
.fancybox-slide--previous {
    display: block
}

.fancybox-slide--image {
    overflow: visible
}

.fancybox-slide--image:before {
    display: none
}

.fancybox-slide--video .fancybox-content,
.fancybox-slide--video iframe {
    background: #000
}

.fancybox-slide--map .fancybox-content,
.fancybox-slide--map iframe {
    background: #e5e3df
}

.fancybox-slide--next {
    z-index: 99995
}

.fancybox-slide>* {
    display: inline-block;
    position: relative;
    padding: 24px;
    margin: 44px 0;
    border-width: 0;
    vertical-align: middle;
    text-align: left;
    background-color: #fff;
    overflow: auto;
    box-sizing: border-box
}

.fancybox-slide>base,
.fancybox-slide>link,
.fancybox-slide>meta,
.fancybox-slide>script,
.fancybox-slide>style,
.fancybox-slide>title {
    display: none
}

.fancybox-slide .fancybox-image-wrap {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
    border: 0;
    z-index: 99995;
    background: transparent;
    cursor: default;
    overflow: visible;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform
}

.fancybox-can-zoomOut .fancybox-image-wrap {
    cursor: zoom-out
}

.fancybox-can-zoomIn .fancybox-image-wrap {
    cursor: zoom-in
}

.fancybox-can-drag .fancybox-image-wrap {
    cursor: -webkit-grab;
    cursor: grab
}

.fancybox-is-dragging .fancybox-image-wrap {
    cursor: -webkit-grabbing;
    cursor: grabbing
}

.fancybox-image,
.fancybox-spaceball {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    max-width: none;
    max-height: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.fancybox-spaceball {
    z-index: 1
}

.fancybox-slide--iframe .fancybox-content {
    padding: 0;
    width: 80%;
    height: 80%;
    max-width: calc(100% - 100px);
    max-height: calc(100% - 88px);
    overflow: visible;
    background: #fff
}

.fancybox-iframe {
    display: block;
    padding: 0;
    border: 0;
    height: 100%
}

.fancybox-error,
.fancybox-iframe {
    margin: 0;
    width: 100%;
    background: #fff
}

.fancybox-error {
    padding: 40px;
    max-width: 380px;
    cursor: default
}

.fancybox-error p {
    margin: 0;
    padding: 0;
    color: #444;
    font-size: 16px;
    line-height: 20px
}

.fancybox-button {
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 10px;
    border: 0;
    border-radius: 0;
    background: rgba(30, 30, 30, .6);
    transition: color .3s ease;
    cursor: pointer;
    outline: none
}

.fancybox-button,
.fancybox-button:link,
.fancybox-button:visited {
    color: #ccc
}

.fancybox-button:focus,
.fancybox-button:hover {
    color: #fff
}

.fancybox-button[disabled] {
    color: #ccc;
    cursor: default;
    opacity: .6
}

.fancybox-button svg {
    display: block;
    position: relative;
    overflow: visible;
    shape-rendering: geometricPrecision
}

.fancybox-button svg path {
    fill: currentColor;
    stroke: currentColor;
    stroke-linejoin: round;
    stroke-width: 3
}

.fancybox-button--share svg path {
    stroke-width: 1
}

.fancybox-button--pause svg path:nth-child(1),
.fancybox-button--play svg path:nth-child(2) {
    display: none
}

.fancybox-button--zoom svg path {
    fill: transparent
}

.fancybox-navigation {
    display: none
}

.fancybox-show-nav .fancybox-navigation {
    display: block
}

.fancybox-navigation button {
    position: absolute;
    top: 50%;
    margin: -50px 0 0;
    z-index: 99997;
    background: transparent;
    width: 60px;
    height: 100px;
    padding: 17px
}

.fancybox-navigation button:before {
    content: "";
    position: absolute;
    top: 30px;
    right: 10px;
    width: 40px;
    height: 40px;
    background: rgba(30, 30, 30, .6)
}

.fancybox-navigation .fancybox-button--arrow_left {
    left: 0
}

.fancybox-navigation .fancybox-button--arrow_right {
    right: 0
}

.fancybox-close-small {
    position: absolute;
    top: 0;
    right: 0;
    width: 44px;
    height: 44px;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    z-index: 10;
    cursor: pointer
}

.fancybox-close-small:after {
    content: "×";
    position: absolute;
    top: 5px;
    right: 5px;
    width: 30px;
    height: 30px;
    font: 20px/30px Arial, Helvetica Neue, Helvetica, sans-serif;
    color: #888;
    font-weight: 300;
    text-align: center;
    border-radius: 50%;
    border-width: 0;
    background-color: transparent;
    transition: background-color .25s;
    box-sizing: border-box;
    z-index: 2
}

.fancybox-close-small:focus {
    outline: none
}

.fancybox-close-small:focus:after {
    outline: 1px dotted #888
}

.fancybox-close-small:hover:after {
    color: #555;
    background: #eee
}

.fancybox-slide--iframe .fancybox-close-small,
.fancybox-slide--image .fancybox-close-small {
    top: 0;
    right: -44px
}

.fancybox-slide--iframe .fancybox-close-small:after,
.fancybox-slide--image .fancybox-close-small:after {
    font-size: 35px;
    color: #aaa
}

.fancybox-slide--iframe .fancybox-close-small:hover:after,
.fancybox-slide--image .fancybox-close-small:hover:after {
    color: #fff;
    background: transparent
}

.fancybox-is-scaling .fancybox-close-small,
.fancybox-is-zoomable.fancybox-can-drag .fancybox-close-small {
    display: none
}

.fancybox-caption-wrap {
    bottom: 0;
    left: 0;
    right: 0;
    padding: 60px 2vw 0;
    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, .1) 20%, rgba(0, 0, 0, .2) 40%, rgba(0, 0, 0, .6) 80%, rgba(0, 0, 0, .8));
    pointer-events: none
}

.fancybox-caption {
    padding: 30px 0;
    border-top: 1px solid hsla(0, 0%, 100%, .4);
    font-size: 14px;
    color: #fff;
    line-height: 20px;
    -webkit-text-size-adjust: none
}

.fancybox-caption a,
.fancybox-caption button,
.fancybox-caption select {
    pointer-events: all;
    position: relative
}

.fancybox-caption a {
    color: #fff;
    text-decoration: underline
}

.fancybox-slide>.fancybox-loading {
    border: 6px solid hsla(0, 0%, 39%, .4);
    border-top: 6px solid hsla(0, 0%, 100%, .6);
    border-radius: 100%;
    height: 50px;
    width: 50px;
    -webkit-animation: a .8s infinite linear;
    animation: a .8s infinite linear;
    background: transparent;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -30px;
    margin-left: -30px;
    z-index: 99999
}

@-webkit-keyframes a {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@keyframes a {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

.fancybox-animated {
    transition-timing-function: cubic-bezier(0, 0, .25, 1)
}

.fancybox-fx-slide.fancybox-slide--previous {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    opacity: 0
}

.fancybox-fx-slide.fancybox-slide--next {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    opacity: 0
}

.fancybox-fx-slide.fancybox-slide--current {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1
}

.fancybox-fx-fade.fancybox-slide--next,
.fancybox-fx-fade.fancybox-slide--previous {
    opacity: 0;
    transition-timing-function: cubic-bezier(.19, 1, .22, 1)
}

.fancybox-fx-fade.fancybox-slide--current {
    opacity: 1
}

.fancybox-fx-zoom-in-out.fancybox-slide--previous {
    -webkit-transform: scale3d(1.5, 1.5, 1.5);
    transform: scale3d(1.5, 1.5, 1.5);
    opacity: 0
}

.fancybox-fx-zoom-in-out.fancybox-slide--next {
    -webkit-transform: scale3d(.5, .5, .5);
    transform: scale3d(.5, .5, .5);
    opacity: 0
}

.fancybox-fx-zoom-in-out.fancybox-slide--current {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    opacity: 1
}

.fancybox-fx-rotate.fancybox-slide--previous {
    -webkit-transform: rotate(-1turn);
    transform: rotate(-1turn);
    opacity: 0
}

.fancybox-fx-rotate.fancybox-slide--next {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
    opacity: 0
}

.fancybox-fx-rotate.fancybox-slide--current {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1
}

.fancybox-fx-circular.fancybox-slide--previous {
    -webkit-transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0);
    transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0);
    opacity: 0
}

.fancybox-fx-circular.fancybox-slide--next {
    -webkit-transform: scale3d(0, 0, 0) translate3d(100%, 0, 0);
    transform: scale3d(0, 0, 0) translate3d(100%, 0, 0);
    opacity: 0
}

.fancybox-fx-circular.fancybox-slide--current {
    -webkit-transform: scaleX(1) translateZ(0);
    transform: scaleX(1) translateZ(0);
    opacity: 1
}

.fancybox-fx-tube.fancybox-slide--previous {
    -webkit-transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg);
    transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg)
}

.fancybox-fx-tube.fancybox-slide--next {
    -webkit-transform: translate3d(100%, 0, 0) scale(.1) skew(10deg);
    transform: translate3d(100%, 0, 0) scale(.1) skew(10deg)
}

.fancybox-fx-tube.fancybox-slide--current {
    -webkit-transform: translateZ(0) scale(1);
    transform: translateZ(0) scale(1)
}

.fancybox-share {
    padding: 30px;
    border-radius: 3px;
    background: #f4f4f4;
    max-width: 90%
}

.fancybox-share h1 {
    color: #222;
    margin: 0 0 20px;
    font-size: 33px;
    font-weight: 700;
    text-align: center
}

.fancybox-share p {
    margin: 0;
    padding: 0;
    text-align: center
}

.fancybox-share p:first-of-type {
    margin-right: -10px
}

.fancybox-share_button {
    display: inline-block;
    text-decoration: none;
    margin: 0 10px 10px 0;
    padding: 10px 20px;
    border: 0;
    border-radius: 3px;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .16);
    background: #fff;
    white-space: nowrap;
    font-size: 16px;
    line-height: 23px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    min-width: 140px;
    color: #707070;
    transition: all .2s
}

.fancybox-share_button:focus,
.fancybox-share_button:hover {
    text-decoration: none;
    color: #333;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .3)
}

.fancybox-share_button svg {
    margin-right: 5px;
    width: 20px;
    height: 20px;
    vertical-align: text-bottom
}

.fancybox-share input {
    box-sizing: border-box;
    width: 100%;
    margin: 5px 0 0;
    padding: 10px 15px;
    border: 1px solid #d7d7d7;
    border-radius: 3px;
    background: #ebebeb;
    color: #5d5b5b;
    font-size: 14px;
    outline: none
}

.fancybox-thumbs {
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 212px;
    margin: 0;
    padding: 2px 2px 4px;
    background: #fff;
    -webkit-tap-highlight-color: transparent;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    box-sizing: border-box;
    z-index: 99995
}

.fancybox-thumbs-x {
    overflow-y: hidden;
    overflow-x: auto
}

.fancybox-show-thumbs .fancybox-thumbs {
    display: block
}

.fancybox-show-thumbs .fancybox-inner {
    right: 212px
}

.fancybox-thumbs>ul {
    list-style: none;
    position: absolute;
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 0;
    white-space: nowrap
}

.fancybox-thumbs-x>ul {
    overflow: hidden
}

.fancybox-thumbs-y>ul::-webkit-scrollbar {
    width: 7px
}

.fancybox-thumbs-y>ul::-webkit-scrollbar-track {
    background: #fff;
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, .3)
}

.fancybox-thumbs-y>ul::-webkit-scrollbar-thumb {
    background: #2a2a2a;
    border-radius: 10px
}

.fancybox-thumbs>ul>li {
    float: left;
    overflow: hidden;
    padding: 0;
    margin: 2px;
    width: 100px;
    height: 75px;
    max-width: calc(50% - 4px);
    max-height: calc(100% - 8px);
    position: relative;
    cursor: pointer;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    box-sizing: border-box
}

li.fancybox-thumbs-loading {
    background: rgba(0, 0, 0, .1)
}

.fancybox-thumbs>ul>li>img {
    position: absolute;
    top: 0;
    left: 0;
    max-width: none;
    max-height: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.fancybox-thumbs>ul>li:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 4px solid #4ea7f9;
    z-index: 99991;
    opacity: 0;
    transition: all .2s cubic-bezier(.25, .46, .45, .94)
}

.fancybox-thumbs>ul>li.fancybox-thumbs-active:before {
    opacity: 1
}

@media (max-width:800px) {
    .fancybox-thumbs {
        width: 110px
    }

    .fancybox-show-thumbs .fancybox-inner {
        right: 110px
    }

    .fancybox-thumbs>ul>li {
        max-width: calc(100% - 10px)
    }
}

fancybox-is-open .fancybox-bg {
    opacity: 0.80;
}

.fancybox-bg {
    background: #000000;
}

html {
    overflow-x: hidden;
}



:root {
    --white: #ffffff;
    --yellow: #D9EE53;
    --black: #111111;
    --blaclSilver: #A0A0A0;
    --blackAuto: #CFCFCF;
}


body {
    font-family: "Outfit", sans-serif;
    background: var(--black);
    font-size: 16px;
    line-height: 140%;
    color: var(--white);
    min-width: 320px;
    font-weight: normal;
    overflow-x: hidden;
    position: relative;
    padding-top: 76px;
}

body.user__logged {
    padding-bottom: 70px
}


.container {
    max-width: 1640px;
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}



header {
    padding: 16px 0;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 300;
    border-bottom: 1px solid #292929;
    box-sizing: border-box;
    height: 76px;
    background: var(--black);
}

header .pull {
    display: none;
}

header .flex {
    align-items: center;
}

header .left {
    gap: 60px
}

header .right {
    gap: 30px
}

header#header__account .logo {
    position: absolute;
    top: calc(50% - 18px);
    left: calc(50% - 105px);
}

header nav ul {
    display: flex;
    align-items: center;
    justify-content: center;
}

header nav ul a {
    color: var(--white);
    font-weight: 600;
    padding: 10px 20px;
}

header nav ul li:hover>a,
header nav ul li.active a {
    color: var(--yellow);
}

header .data {
    gap: 10px
}

header .lang {
    position: relative;
    cursor: pointer;
}

header .lang .current {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 2px solid #414141;
    text-transform: uppercase;
    border-radius: 12px;
    box-sizing: border-box;
    transition: all 0.2s;
}

header .lang .current:hover {
    border-color: var(--white);
}

header .lang .current.open {
    background: var(--yellow);
    color: var(--black);
    border-color: var(--yellow);
}

header .lang ul {
    position: absolute;
    top: 100%;
    left: calc(50% - 72px);
    z-index: 20;
    background: var(--white);
    border-radius: 12px;
    min-width: 144px;
    margin-top: 20px;
    display: none;
}

header .lang ul:after {
    bottom: 100%;
    left: 50%;
    transition: all 0.2s;
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #ffffff;
    border-width: 8px;
    margin-left: -8px;
}

header .lang ul li:first-child a {
    border-radius: 12px 12px 0 0
}

header .lang ul li:last-child a {
    border-radius: 0 0 12px 12px
}

header .lang ul li a {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    color: var(--black);
    border-radius: 12px;
}

header .lang ul li a span {
    transition: all 0.2s;
    border-bottom: 1px solid transparent;
    line-height: normal;
}

header .lang ul li a:hover span {
    border-color: var(--black);
}

header .search {
    width: 576px;
    position: relative;
}

header .search input {
    width: 100%;
    height: 44px;
    color: var(--white);
    border-radius: 12px;
    background: #292929;
    padding: 0 50px 0 20px;
    font-size: 14px;
    border: none;
}

header .search .btn-search {
    position: absolute;
    right: 20px;
    top: calc(50% - 9px);
    width: 18px;
    height: 18px;
    background: url("../img/search.svg") 50% 50% no-repeat;
}

header .btn-yellow-tr:hover svg path {
    stroke: var(--black) !important;
}

header .user__login__data a {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 44px;
    height: 44px;
    box-sizing: border-box;
    border-radius: 12px;
}

header .user__login__data a:hover svg path {
    fill: var(--yellow);
}

header .user__login__data a span {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #FF4848;
}

header .user__login__data .profile {
    margin-left: 10px;
    position: relative;
    cursor: pointer;
}

header .user__login__data .profile img {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    object-fit: cover;
}

header .user__login__data .profile>a {
    background: #292929
}

header .user__login__data .profile>a:hover {
    background: rgba(255, 255, 255, 0.2);
}

header .user__login__data .profile>a.open {
    background: var(--yellow);
}

header .user__login__data .profile ul {
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 20;
    background: var(--white);
    border-radius: 12px;
    min-width: 160px;
    margin-top: 20px;
    display: none;
}

header .user__login__data .profile ul:after {
    bottom: 100%;
    right: 16px;
    transition: all 0.2s;
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #ffffff;
    border-width: 8px;
}

header .user__login__data .profile ul li:first-child a {
    border-radius: 12px 12px 0 0
}

header .user__login__data .profile ul li:last-child a {
    border-radius: 0 0 12px 12px
}

header .user__login__data .profile ul li a {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    color: var(--black);
    border-radius: 12px;
    width: auto;
    height: auto;
    position: static;
    box-sizing: border-box;
    background: transparent;
}

header .user__login__data .profile ul li a:hover {
    background: rgba(0, 0, 0, 0.06);
}

header .user__login__data .profile ul li button {
    display: block;
    width: 100%;
    text-align: left;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    color: var(--black);
    background: transparent;
    border: 0;
    cursor: pointer;
    border-radius: 12px;
    height: auto;
}

header .user__login__data .profile ul li button:hover {
    background: rgba(0, 0, 0, 0.06);
}

header#logged .search {
    width: 480px
}




.megamenu {
    position: absolute;
    top: 0;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    z-index: 299;
    width: 100%;
    display: none;
}

.megamenu .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.megamenu .back {
    display: none;
}

.megamenu .container {
    border-radius: 0 0 12px 12px;
    border: 1px solid #292929;
    padding: 76px 0 0;
    background: var(--black);
    position: relative;
    z-index: 2
}

.megamenu .navigation {
    box-sizing: border-box;
    width: 480px;
    padding: 40px 0;
    border-right: 1px solid #292929
}

.megamenu .navigation li a {
    display: block;
    position: relative;
    padding: 20px 104px 20px 60px;
    font-size: 18px;
    font-weight: 600;
    color: #CFCFCF;
}

.megamenu .navigation li a span {
    display: block;
    font-size: 14px;
    color: #585858;
    font-weight: normal;
}

.megamenu .navigation li a svg {
    position: absolute;
    top: 20px;
    right: 60px;
}

.megamenu .navigation li:hover>a,
.megamenu .navigation li a.active {
    color: var(--yellow);
}

.megamenu .navigation li:hover>a svg path,
.megamenu .navigation li a.active svg path {
    stroke: var(--yellow);
}

.megamenu .sub-menu-list {
    width: calc(100% - 480px);
    padding: 60px;
    box-sizing: border-box;
}

.megamenu .sub-menu {
    display: none;
}

.megamenu .sub-menu.sub-menu-3 {
    display: block1;
}

.megamenu .sub-menu-list .col {
    max-width: 320px
}

.megamenu .sub-menu-list .col .title {
    font-weight: 600;
    margin-bottom: 15px;
}

.megamenu .sub-menu-list .col ul.full li {
    margin-bottom: 15px;
}

.megamenu .sub-menu-list .col ul.full li a {
    font-size: 16px;
    color: var(--white);
    text-align: right;
}

.megamenu .sub-menu-list .col ul.full li a:hover {
    color: var(--yellow);
}

.megamenu .sub-menu-list .col ul {
    margin-bottom: 30px
}

.megamenu .sub-menu-list .col ul:last-child {
    margin-bottom: 0;
}

.megamenu .sub-menu-list .col li {
    margin-bottom: 5px
}

.megamenu .sub-menu-list .col li:last-child {
    margin-bottom: 0;
}

.megamenu .sub-menu-list .col a {
    color: #CFCFCF;
    display: block;
    font-size: 14px;
    line-height: 140%;
}

.megamenu .sub-menu-list .col a:hover {
    color: var(--yellow);
}

.megamenu .sub-menu .offers {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    max-width: calc(100% - 220px);
    width: 100%;
}

.megamenu .sub-menu .offers .item {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    background: #1B1B1B;
}

.megamenu .sub-menu .offers .item a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.megamenu .sub-menu .offers .item .title {
    padding: 16px 12px;
    line-height: 110%;
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    transition: all 0.2s;
}

.megamenu .sub-menu .offers .item:hover .title {
    color: var(--yellow);
}

.megamenu .sub-menu .offers .item img {
    width: 100%;
    height: 123px;
    object-fit: cover;
}

.megamenu .sub-menu .information,
.megamenu .sub-menu .advantages {
    width: 50%;
    box-sizing: border-box;
    position: relative;
}

.megamenu .sub-menu .information {
    padding-right: 60px;
}

.megamenu .sub-menu .information:after {
    position: absolute;
    top: -60px;
    right: 0;
    width: 1px;
    height: calc(100% + 120px);
    content: '';
    background: #292929
}

.megamenu .sub-menu .information .title {
    font-weight: 600;
    font-size: 24px;
    color: #E7E7E7;
    margin-bottom: 5px;
    line-height: 110%;
}

.megamenu .sub-menu .information .note {
    margin-bottom: 40px;
    font-size: 15px;
    color: #A0A0A0;
}

.megamenu .sub-menu .information .btn {
    height: 44px;
    font-size: 16px;
    padding: 0 22px;
}

.megamenu .sub-menu .advantages {
    padding-left: 60px;
}

.megamenu .sub-menu .advantages .item {
    position: relative;
    padding: 20px 30px 20px 80px;
    background: #1B1B1B;
    border-radius: 12px;
    margin-bottom: 10px
}

.megamenu .sub-menu .advantages .item:last-child {
    margin-bottom: 0;
}

.megamenu .sub-menu .advantages .item .icon {
    position: absolute;
    top: 20px;
    left: 20px;
}

.megamenu .sub-menu .advantages .item .title {
    margin-bottom: 5px;
    font-weight: 600;
}

.megamenu .sub-menu .advantages .item p {
    font-size: 14px;
    color: #CFCFCF;
}





#account__navigation {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 290;
    padding: 12px;
    background: #111111;
    border-top: 1px solid #292929;
    box-sizing: border-box;
}

#account__navigation ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#account__navigation ul li {
    width: 20%;
}

#account__navigation ul li a {
    position: relative;
    display: block;
    color: var(--white);
    font-size: 14px;
    font-weight: 500;
    text-align: center;
}

#account__navigation ul li span {
    position: absolute;
    top: -3px;
    right: calc(50% - 14px);
    width: 8px;
    height: 8px;
    background: #FF1D1D;
    border-radius: 50%;
}

#account__navigation ul li.active a,
#account__navigation ul li:hover a {
    color: var(--yellow);
}

#account__navigation ul li.active a path,
#account__navigation ul li:hover a path {
    fill: var(--yellow);
}

#account__navigation ul li a svg {
    display: block;
    margin: 0 auto 2px;
}





#promo {
    position: relative;
    overflow: hidden;
}

#promo .swiper-slide {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    min-height: 700px;
    box-sizing: border-box;
    padding: 80px 0;
    position: relative;
}

#promo .swiper-slide:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.45) 100%);
}

/* Zoom-in effect for promo background */
#promo .swiper-slide .promo-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    transform: scale(1);
    transition: transform 7s ease;
}

#promo .swiper-slide.swiper-slide-active .promo-bg {
    transform: scale(1.08);
}

#promo .text {
    max-width: 660px;
    position: relative;
    z-index: 2
}

/* Slide-in animation for promo texts */
#promo .swiper-slide .text {
    opacity: 0;
    transform: translateY(20px);
}

#promo .swiper-slide-active .text {
    animation: promoTextIn 700ms ease-out 300ms forwards;
}

@keyframes promoTextIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

#promo .title {
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 20px;
    line-height: 110%;
}

#promo p {
    font-size: 17px;
    font-weight: 500;
    margin-bottom: 30px;
    color: #E7E7E7;
    max-width: 570px
}

#promo .slider-sw .swiper-pagination {
    display: flex;
    height: auto;
    width: 12px;
    left: calc(100% - 150px);
    bottom: calc(50% - 45px) !important;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

#promo .slider-sw .swiper-pagination-bullet {
    opacity: 0.3;
    margin: 10px 0;
}

#promo .slider-sw .swiper-pagination-bullet.swiper-pagination-bullet-active {
    opacity: 1
}





#projects {}

.project__item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
}

.project__item .image img {
    width: 100%;
    height: 320px;
    object-fit: cover;
    transition: all 0.2s;
}

.project__item:hover .image img {
    transform: scale(1.08);
}

.project__item .image:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: linear-gradient(209.21deg, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0.55) 100%);
}

.project__item .title {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 24px;
    font-size: 24px;
    line-height: 110%;
    font-weight: 600;
}

.project__item .icon {
    position: absolute;
    top: 12px;
    right: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
}

.project__item a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 4;
}

.project__item--animated,
.project__item__all--animated {
    --project-card-stagger: 0;
    opacity: 0;
    transform: translate3d(0, 28px, 0) scale(0.97);
    animation: projectCardReveal 0.78s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: calc(var(--project-card-stagger) * 0.12s);
    will-change: transform, opacity;
}

@keyframes projectCardReveal {
    0% {
        opacity: 0;
        transform: translate3d(0, 32px, 0) scale(0.94);
    }

    45% {
        opacity: 1;
        transform: translate3d(0, -4px, 0) scale(1.015);
    }

    70% {
        opacity: 1;
        transform: translate3d(0, 2px, 0) scale(0.998);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {

    .project__item--animated,
    .project__item__all--animated {
        animation: none;
        opacity: 1;
        transform: none;
    }
}

.project__item__all {
    border-radius: 12px;
    overflow: hidden;
}

.project__item__all a {
    width: 100%;
    height: 100%;
    background: #1B1B1B;
    justify-content: center;
    align-items: center;
}

.project__item__all:hover a {
    background: #292929
}

.project__item__all a span {
    display: block;
    width: 100%;
}

.project__item__all a span span {
    width: 100%;
    font-size: 24px;
    font-weight: 600;
    text-align: center;
    display: block;
    width: 100%;
    color: var(--white);
}

.project__item__all a svg {
    margin: 0 auto 20px;
    display: block;
}





.project__item__n {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    transition: all 0.2s;
    background: #1B1B1B
}

.project__item__n .image {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    z-index: 1;
}

.project__item__n .image:after {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: linear-gradient(215.48deg, rgba(0, 0, 0, 0.3) 8.76%, rgba(0, 0, 0, 0) 38.83%);
    z-index: 2;
    pointer-events: none;
}

.grid-4 .project__item__n .image img {
    height: 400px;
}

.project__item__n .image img {
    width: 100%;
    height: 320px;
    object-fit: cover;
}

.grid-4 .project__item__n .image video {
    height: 400px;
}

.project__item__n .image video {
    width: 100%;
    height: 320px;
    object-fit: cover;
    display: block;
    background: #000;
}

.listing-card-gallery {
    position: relative;
    z-index: 4;
    pointer-events: none;
}

.listing-card-gallery .swiper {
    height: 100%;
    position: relative;
    z-index: 1;
    pointer-events: auto;
}

.listing-card-gallery .swiper-slide {
    height: 100%;
}

.listing-card-gallery .listing-card-video-wrapper {
    position: relative;
    height: 100%;
    z-index: 3;
    pointer-events: auto;
}

.listing-card-gallery .listing-card-video {
    height: 100%;
    width: 100%;
    display: block;
    object-fit: cover;
}

.listing-card-gallery .listing-card-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 62px;
    height: 62px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.7);
    background: rgba(17, 17, 17, 0.45);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: opacity 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
    pointer-events: auto;
}

.listing-card-gallery .listing-card-play svg {
    display: block;
}

.listing-card-gallery .listing-card-play:hover {
    transform: translate(-50%, -50%) scale(1.12);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.25);
}

.listing-card-gallery .listing-card-play.is-hidden {
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -50%) scale(0.9);
}

.listing-card-gallery .listing-card-play svg {
    display: block;
    transform: translateX(2px);
}

.listing-card-gallery .listing-card-pagination {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 14px;
    transform: none;
    z-index: 8;
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    pointer-events: auto;
    opacity: 1;
    width: 100%;
}

.listing-card-gallery .listing-card-pagination .swiper-pagination-bullet {
    width: 11px;
    height: 11px;
    margin: 0;
    background: rgba(255, 255, 255, 0.6);
    opacity: 0.9;
    transition: opacity 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
    border: 1px solid rgba(0, 0, 0, 0.25);
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.35);
}

.listing-card-gallery .listing-card-pagination .swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--yellow);
    border-color: var(--yellow);
    transform: scale(1.25);
}

.project__item__n .image .like {
    position: absolute;
    top: 16px;
    right: 16px;
    text-align: center;
    z-index: 9;
    font-size: 13px;
    font-weight: 600;
    text-shadow: 0px 2px 3px rgba(0, 0, 0, 0.25);
}

.project__item__n .image .like img {
    width: 24px;
    height: 24px;
}

.project__item__n .image .like.liked img {
    filter: hue-rotate(330deg) saturate(6) brightness(1.2);
}

.project__item__n .data {
    padding: 16px 12px;
}

.project__item__n .data .flex {
    align-items: center;
    font-size: 14px;
}

.project__item__n .data .title {
    margin-bottom: 10px;
    font-size: 16px;
    line-height: 110%;
    font-weight: 500;
}

.project__item__n .data .price {
    color: var(--yellow);
    font-weight: 600;
}

.project__item__n .data .price .city {
    color: var(--blaclSilver);
}

.project__item__n a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.project__item__n:hover {
    background: #292929
}

.project__item__n .status {
    position: relative;
    display: flex;
    justify-content: flex-start;
}

.project__item__n .status span {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    line-height: 28px;
    background: rgba(17, 204, 45, 0.2);
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    color: #11CC2D;
    margin-top: 15px
}

.project__item__n .status span.draft {
    color: #CFCFCF;
    background: #414141;
}

.project__item__n .status span.expired {
    color: #FF4848;
    background: rgba(255, 72, 72, 0.1);
}

.project__item__n .status span.pause {
    color: var(--yellow);
    background: rgba(217, 238, 83, 0.1);
}





.photographers__item {
    position: relative;
    box-sizing: border-box;
    border-radius: 12px;
    border: 1px solid #292929;
    padding: 16px;
    transition: all 0.2s;
}

.photographers__item:hover {
    background: #292929
}

.photographers__item .actions {
    position: relative;
}

.photographers__item .actions .btn {
    padding: 0;
    width: calc(50% - 5px);
    height: 44px;
    font-size: 16px;
}

.u__user {
    position: relative;
    padding-left: 82px;
    margin-bottom: 20px;
}

.u__user.u__medium {
    padding-left: 120px;
}

.u__user .u__image {
    position: absolute;
    top: 0;
    left: 0;
}

.u__user .u__image img {
    border-radius: 12px;
    width: 72px;
    height: 72px;
    object-fit: cover;
}

.u__user.u__medium .u__image img {
    width: 104px;
    height: 104px
}

.u__user .u__image span {
    position: absolute;
    bottom: -3px;
    right: -3px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 3px solid #111111;
    background: #555
}

.u__user .u__image span.online {
    background: #11CC2D
}

.u__user .u__status {
    margin-bottom: 8px;
}

.u__user .u__status i {
    font-style: normal;
    display: inline-block;
    padding: 4px 8px;
    border-radius: 12px;
    background: rgba(17, 204, 45, 0.15);
    color: #11CC2D;
    font-size: 13px;
    font-weight: 500;
    line-height: 100%;
}

.u__user .u__status i.grey {
    background: #1B1B1B;
    color: #CFCFCF
}

.u__user .u__info .name {
    position: relative;
    padding: 1px 0;
    display: inline-block;
}

.u__user .u__info .name.verified {
    padding-right: 21px;
    background: url("../img/ls_check.svg") 100% 50% no-repeat;
}

.u__user .u__info span {
    display: block;
    font-size: 14px;
    margin: 0px 0 6px;
    color: var(--blaclSilver);
}

.u__user .u__rating {
    justify-content: flex-start;
    align-items: center;
    font-size: 13px;
}

.u__user .u__rating span {
    width: 18px;
    height: 18px;
    background: url("../img/star.svg") 50% 50% no-repeat;
    margin: 0 1px 0 0;
}

.u__user .u__rating span.star50 {
    background: url("../img/star50.svg") 50% 50% no-repeat;
}

.u__user .u__rating .u__rating__reviews {
    align-items: center;
    gap: 4px;
    color: var(--blaclSilver);
    margin-left: 9px;
}

.u__user .u__info .u__rating .u__rating__reviews span {
    color: var(--yellow);
    font-weight: 600;
    font-size: 13px;
    margin: 0;
    width: auto;
    height: auto;
    background: transparent;
}

.u__text {
    font-size: 15px;
    margin-bottom: 20px;
    color: #E7E7E7;
}

.u__tags {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 20px;
}

.u__tags a,
.u__tags span {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 28px;
    box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid #414141;
    font-size: 12px;
    color: #CFCFCF;
    padding: 0 10px;
    font-weight: 500;
}

.u__tags a:hover {
    background: #fff;
    border-color: #fff;
    color: var(--black);
}

.u__city {
    font-size: 14px;
    margin-bottom: 20px;
    color: #A0A0A0;
}





.blog__item {
    position: relative;
    box-sizing: border-box;
}

.blog__item .image {
    width: 100%;
}

.blog__item img {
    width: 100%;
    height: 208px;
    border-radius: 12px;
    object-fit: cover;
}

.blog__item .data {
    padding: 20px 0 0;
}

.blog__item .info {
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    font-size: 14px;
    color: var(--blaclSilver);
    margin-bottom: 20px;
}

.blog__item .info .date {
    padding: 0 0 0 21px;
    background: url("../img/calendar.svg") 0 50% no-repeat;
}

.blog__item .info .time {
    padding: 0 0 0 21px;
    background: url("../img/time.svg") 0 50% no-repeat;
}

.blog__item .title {
    margin-bottom: 20px;
    font-size: 20px;
    line-height: 110%;
}

.blog__item .title a {
    color: #fff;
    font-weight: 600;
}

.blog__item .title a:hover {
    color: var(--yellow);
}

.blog__item .excerpt {
    color: var(--blaclSilver);
    margin-bottom: 20px;
}

@media (min-width: 1200px) {
    #page__blog .blog__item .image {
        width: 369px;
        max-width: 100%;
        margin: 0 auto;
    }

    #page__blog .blog__item img {
        width: 369px;
        height: 208px;
    }
}





.site__content {
    color: #CFCFCF;
    font-size: 16px;
    line-height: 140%;
}

.site__content h1,
.site__content h2,
.site__content h3,
.site__content h4,
.site__content h5,
.site__content h6 {
    margin-bottom: 30px;
    font-size: 28px;
    line-height: 110%;
    font-weight: 600;
    color: var(--white);
}

.site__content h3 {
    margin-bottom: 13px;
    font-size: 20px;
}

.site__content p {
    margin-bottom: 20px;
}

.site__content ul,
.site__content ol {
    margin-bottom: 20px;
}

.site__content ul {
    margin-bottom: 20px;
}

.site__content ul li {
    padding: 0 0 0 28px;
    position: relative;
    margin-bottom: 20px
}

.site__content ul li:last-child {
    margin: 0
}

.site__content ul li strong {
    display: block;
    color: var(--white);
}

.site__content ul li:after {
    position: absolute;
    top: 7px;
    left: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--yellow);
    content: ''
}

.site__content ol {
    counter-reset: item;
}

.site__content ol li {
    display: block;
    margin-bottom: 10px
}

.site__content ol li:before {
    content: counter(item) ". ";
    counter-increment: item;
    color: var(--yellow);
    font-weight: 600;
    margin-right: 10px
}

.site__content img {
    border-radius: 12px;
    margin-bottom: 20px;
    width: 100%;
    height: auto;
}

.site__content a {
    color: var(--yellow);
    border-bottom: 1px solid transparent;
}

.site__content a:hover {
    border-color: var(--yellow);
}

.site__content .gallery {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.site__content .gallery img {
    width: calc(50% - 5px);
}





#seo .site__content {
    height: 277px;
    overflow: hidden;
    position: relative;
    margin-bottom: 30px;
    transition: all 0.2s;
}

#seo .site__content.open {
    height: auto;
}

#seo .site__content.open:after {
    opacity: 0;
}

#seo .site__content:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 140px;
    content: '';
    background: linear-gradient(180deg, rgba(17, 17, 17, 0.1) 0%, #111111 100%);
    transition: all 0.2s;
}





#breadcrumbs {
    padding: 30px 0;
    font-size: 13px;
    font-weight: 500;
    color: #A1A1A1
}

#breadcrumbs a.btn {
    display: flex;
    height: 44px;
    font-size: 16px;
    padding: 0 16px;
}

#breadcrumbs a,
#breadcrumbs span {
    display: inline;
}

#breadcrumbs span.sep {
    display: inline-block;
    margin: 0 2px;
    width: 16px;
    height: 16px;
    background: url("../img/separator.svg") 50% 50% no-repeat;
    position: relative;
    top: 4px;
}

#breadcrumbs a {
    color: #CFCFCF;
}

#breadcrumbs .current {
    color: #585858;
}





#page__filters {
    padding: 0 0 40px;
    position: relative;
    z-index: 400;
}

#page__filters .flex {
    align-items: center;
    gap: 20px
}

#page__filters span {
    font-size: 15px;
    color: #A0A0A0;
}

#page__filters .providers__search {
    width: 240px;
    position: relative;
    margin-left: auto;
    margin-right: 10px;
}

#page__filters .providers__search form {
    display: flex;
    align-items: center;
    position: relative;
}

#page__filters .providers__search input {
    width: 100%;
    height: 44px;
    color: var(--white);
    border-radius: 12px;
    background: #292929;
    padding: 0 50px 0 20px;
    font-size: 14px;
    border: none;
}

#page__filters .providers__search .btn-search {
    position: absolute;
    right: 20px;
    top: calc(50% - 9px);
    width: 18px;
    height: 18px;
    background: url("../img/search.svg") 50% 50% no-repeat;
    border: none;
    cursor: pointer;
    padding: 0;
}





.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 30px 0 0;
}

.pagination.pagination__end {
    justify-content: flex-end;
}

.pagination a,
.pagination span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
}

.pagination a:hover,
.pagination span.current {
    background: var(--yellow);
    color: var(--black);
}





#new__projects__page {}

#new__projects__page .pagination {
    margin-top: 60px
}






#page__title {
    padding: 40px 0 0;
}

#page__title .sorting {
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: #A0A0A0;
}





.filters__data {
    position: fixed;
    display: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    box-sizing: border-box;
    z-index: 400;
    background: var(--black);
    padding: 30px 12px 60px;
    max-width: 800px;
}

.filters__data:after {
    position: absolute;
    top: 0;
    left: 800px;
    width: 100px;
    content: '';
    height: 100%;
    background: red;
}

.filters__data .f__title {
    margin-bottom: 40px;
    align-items: center;
}

.filters__data .title {
    font-size: 24px;
    font-weight: 600;
}

.btn.btn-close {
    width: 20px;
    height: 20px;
    background: url("../img/closeg.svg") 50% 50% no-repeat;
}

.btn.btn-close:hover {
    transform: rotate(90deg);
}

.filters__data select {
    width: 100%;
}

.filters__data .form__item .flex {
    align-items: center;
    gap: 0 !important
}

.filters__data .form__item .flex .input__price {
    width: calc(50% - 11px);
    text-align: right;
    position: relative;
    box-sizing: border-box;
}

.filters__data .form__item .flex .input__price input {
    padding-left: 42px;
    text-align: right;
}

.filters__data .form__item .flex .input__price i {
    position: absolute;
    top: calc(50% - 11px);
    left: 12px;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    color: #A0A0A0;
}

#page__filters .filters__data .form__item .flex span {
    display: block;
}

.filters__data .actions {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    max-width: 800px;
    padding: 12px;
    box-sizing: border-box;
    background: var(--black);
    gap: 0 !important
}

.filters__data .actions .btn {
    height: 44px;
    width: calc(50% - 5px);
    font-size: 16px;
    box-sizing: border-box;
}





#page__content {
    border-top: 1px solid #292929;
    border-bottom: 1px solid #292929;
}

#page__content .site__content ul li {
    padding: 0
}

#page__content .site__content ul li:after {
    display: none;
}

#page__content .container {
    border-left: 1px solid #292929;
    border-right: 1px solid #292929;
}

#page__content .sidebar {
    border-left: 1px solid #292929;
    box-sizing: border-box;
    width: 438px;
}

#page__content .sidebar.sidebar__profile {
    padding-top: 130px
}

#page__content .sidebar .box {
    padding: 40px 30px;
    border-bottom: 1px solid #292929;
}

#page__content .sidebar .box:last-child {
    border: none;
}

#page__content .sidebar .date {
    margin-bottom: 10px;
    font-size: 14px;
    color: #A0A0A0;
}

#page__content h1 {
    margin-bottom: 30px;
    font-size: 28px;
    font-weight: 600;
    line-height: 110%;
}

#page__content .sidebar .budget {
    margin-bottom: 30px;
}

#page__content .sidebar .budget span {
    color: #A0A0A0;
    display: block;
    margin-bottom: 2px;
}

#page__content .sidebar .budget p {
    color: var(--yellow);
    font-weight: 600;
    font-size: 24px;
    line-height: 110%;
}

#page__content .sidebar .actions {
    align-items: center;
}

#page__content .sidebar .actions .btn {
    width: calc(100% - 80px)
}

#page__content .sidebar .actions .likes {
    width: 70px;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

#page__content .sidebar .actions .likes.liked svg path {
    stroke: #D9EE53;
}

#page__content .sidebar .box__contacts {
    border-top: 1px solid #292929
}

#page__content .sidebar .contacts {}

#page__content .sidebar .contacts .title {
    margin-bottom: 10px;
    display: block;
    font-weight: 500;
    color: #A0A0A0;
}

#page__content .sidebar .contacts .title.flex {
    justify-content: space-between;
    align-items: center;
    display: flex;
}

#page__content .sidebar .notify p {
    padding: 0 0 0 30px;
    background: url("../img/note.svg") 0 0% no-repeat;
}

#page__content .sidebar .notify p strong {
    font-weight: 600;
}

a.edit__btn:hover svg path {
    stroke: var(--yellow);
}

a.edit__btn:hover svg rect {
    stroke: var(--yellow);
}

.more__edit {
    position: relative;
    padding: 0 96px 0 0;
}

.more__edit a.edit__btn {
    position: absolute;
    top: 0;
    right: 0;
}

#page__content .sidebar .contacts .row {
    align-items: center;
    font-weight: 500;
    margin-bottom: 6
}

#page__content .sidebar .contacts .row:last-child {
    margin-bottom: 0;
}

#page__content .sidebar .contacts .row a {
    display: block;
    padding: 6px 0 6px 30px;
    background: url("../img/phone.svg") 0 50% no-repeat;
    color: #fff;
}

#page__content .sidebar .contacts .row a.email {
    background: url("../img/email.svg") 0 50% no-repeat;
}

#page__content .sidebar .contacts .row span {
    transition: all 0.2s;
    color: var(--yellow);
    border-bottom: 1px solid transparent;
    cursor: pointer;
}

#page__content .sidebar .contacts .row span:hover {
    border-color: var(--yellow);
}

#page__content .sidebar .box__title {
    align-items: center;
    color: #E7E7E7;
    margin-bottom: 20px;
}

#page__content .sidebar .box__title span {
    font-size: 20px;
    font-weight: 600;
}

#page__content .sidebar .box__title a {
    color: #CFCFCF;
    font-size: 14px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

#page__content .sidebar .box__title a:hover {
    color: var(--yellow);
}

#page__content .sidebar iframe {
    width: 100%;
    height: 212px;
    object-fit: cover;
    border-radius: 12px;
    display: block;
}

#page__content .sidebar .location {
    margin-bottom: 20px;
    padding: 1px 0 1px 28px;
    background: url("../img/location.svg") 0 50% no-repeat;
    color: #A0A0A0
}

#page__content .sidebar .location.yellow {
    background: url("../img/locationy.svg") 0 50% no-repeat;
    color: var(--white);
    padding: 6px 0 6px 30px;
}

#page__content .sidebar .u__user {
    margin: 0
}

#page__content .sidebar .socials {
    justify-content: flex-start;
    gap: 10px
}

#page__content .sidebar .socials a {
    color: #CFCFCF;
    font-size: 14px;
    font-weight: 500;
    gap: 5px;
    padding: 0 12px;
    line-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #1B1B1B
}

#page__content .sidebar .socials a:hover {
    background: var(--yellow);
    color: var(--black);
}

#page__content .sidebar .socials a:hover svg path {
    fill: var(--black);
}

#page__content .sidebar .v__title {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    font-size: 20px;
    font-weight: 600;
    line-height: 110%;
    margin-bottom: 10px
}

#page__content .sidebar .verify li {
    padding: 6px 0 6px 50px;
    background: url("../img/ls_ok.svg") 12px 50% no-repeat;
    color: #CFCFCF;
}

#page__content .sidebar .verify li.no {
    background: url("../img/ls_no.svg") 12px 50% no-repeat;
}

#page__content .sidebar .verify p {
    padding: 30px 0;
    font-size: 14px;
    color: #CFCFCF;
}

#page__content .sidebar .box__edit a {
    height: 50px;
    margin-bottom: 10px;
    font-size: 18px;
}

#page__content .sidebar .box__edit a:last-child {
    margin-bottom: 0;
}

#page__content .slider-sw .swiper-pagination {
    display: none;
}

#page__content .content {
    width: calc(100% - 438px);
    box-sizing: border-box;
    padding: 40px 30px;
}

#page__content .content .back,
#page__content .content .publish {
    display: none;
}

#page__content .gallery {
    margin-bottom: 30px;
    border-radius: 12px;
    overflow: hidden;
}

#page__content .gallery img {
    width: 100%;
    height: 640px;
    border-radius: 12px;
    object-fit: cover;
}

#page__content .u__tags {
    margin-bottom: 30px;
}

#page__content .u__tags span {
    font-size: 14px;
    height: 32px;
}

#page__content .info {
    padding: 40px 0 0;
    border-top: 1px solid #292929;
    align-items: center;
    font-size: 14px;
    color: #A0A0A0;
}

#page__content .info a {
    color: #A0A0A0;
    display: flex;
    align-items: center;
    gap: 8px
}

#page__content .info a:hover {
    color: var(--yellow);
}

#page__content .info a:hover svg path {
    stroke: var(--yellow);
}

#page__content .profile__data {
    width: calc(100% - 438px);
    box-sizing: border-box;
    padding: 40px 30px;
    position: relative;
}

.profile__data .profile__info {
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
    flex-wrap: nowrap;
}

.profile__data .profile__info .u__user {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 0;
    margin: 0;
    margin-bottom: 20px;
    width: 100%;
    max-width: 640px;
}

.profile__data .profile__info .u__user .u__image {
    position: relative;
    flex: 0 0 120px;
    width: 120px;
    height: 120px;
}

.profile__data .profile__info .u__user .u__image img {
    width: 120px;
    height: 120px;
    border-radius: 12px;
    object-fit: cover;
}

.profile__data .profile__info .u__user .u__image span {
    width: 14px;
    height: 14px;
    border: 4px solid #111111;
    box-sizing: content-box;
    background: #555
}

.profile__data .profile__info .u__user .u__image span.online {
    background: #11CC2D
}

.profile__data .profile__info .u__user .u__info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.profile__data .profile__info .u__user .u__status {
    margin: 0;
}

.profile__data .profile__info .u__user .u__status i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    padding: 4px 8px;
    border-radius: 12px;
    background: rgba(17, 204, 45, 0.15);
    color: #11CC2D;
}

.profile__data .profile__info .u__user .u__status i.grey {
    background: #1B1B1B;
    color: #CFCFCF;
}

.profile__data .profile__info .u__user .u__info .name {
    padding: 0;
    background: none;
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 28px;
    font-weight: 600;
    line-height: 110%;
    color: #FFFFFF;
}

.profile__data .profile__info .u__user .u__info .name.verified:after {
    content: '';
    width: 16px;
    height: 16px;
    background: url("../img/ls_check.svg") 50% 50% no-repeat;
}

.profile__data .profile__info .u__user .u__info span {
    font-size: 16px;
    line-height: 140%;
    color: #A0A0A0;
    margin: 0;
}

.profile__data .profile__info .u__user .u__rating {
    justify-content: flex-start;
    gap: 0;
    font-size: 16px;
    line-height: 140%;
}

.profile__data .profile__info .u__user .u__rating>span {
    width: 20px;
    height: 20px;
    margin: 0;
}

.profile__data .profile__info .u__user .u__rating .u__rating__reviews {
    margin-left: 10px;
    gap: 6px;
    flex-wrap: nowrap;
    align-items: center;
    color: #A0A0A0;
}

.profile__data .profile__info .u__user .u__rating .u__rating__reviews span {
    color: #D9EE53;
    font-size: 16px;
    font-weight: 600;
    margin: 0;
}

.profile__data .profile__info .more {
    margin-left: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 12px;
    width: 100%;
    max-width: 420px;
    text-align: right;
}

.profile__data .profile__info .price {
    text-align: inherit;
    width: 100%;
}

.profile__data .profile__info .price span {
    display: block;
    font-size: 14px;
    color: #A0A0A0;
    margin-bottom: 4px;
}

.profile__data .profile__info .price strong {
    display: block;
    color: var(--yellow);
    font-size: 26px;
    font-weight: 600;
    line-height: 110%;
}

.profile__data .profile__info .message {
    width: 378px;
    position: absolute;
    top: 40px;
    right: -408px;
}

.profile__data .profile__info .message .btn {
    min-width: 200px;
}

.profile__data .profile__info .more__edit {
    padding: 0;
}

.profile__data .profile__info .more__edit a.edit__btn {
    position: static;
    align-self: flex-end;
}

.profile__data .skills {
    position: relative;
    padding-right: 50px
}

.profile__data .skills a.edit__btn {
    position: absolute;
    top: 0;
    right: 0;
}

.profile__data .skills {
    margin-bottom: 30px;
}

.profile__data .skills .title {
    margin-bottom: 10px;
    color: #CFCFCF;
}

.profile__data .site__content {
    margin-bottom: 40px;
}

.post__box {
    padding: 40px 30px;
    border-top: 1px solid #292929;
    width: calc(100% + 60px);
    margin-left: -30px;
    box-sizing: border-box;
}

.post__box .grid-4 .project__item__n .image img {
    height: 278px
}

.post__box .grid-4 .project__item__n .image .like img {
    width: auto;
    height: auto;
}

.post__box .loadmore {
    padding: 40px 0 0;
    display: flex;
    justify-content: flex-end;
}

.post__box .tab {
    display: none;
}

.post__box .tab.tab1 {
    display: block;
}





.item__user__create {
    text-align: center;
    padding: 50px 25px;
    border-radius: 12px;
    background: #1B1B1B;
}

.item__user__create .title {
    margin-bottom: 10px;
    font-size: 20px;
    font-weight: 600;
    color: #CFCFCF;
}

.item__user__create p {
    font-size: 14px;
    margin-bottom: 10px;
    color: #A0A0A0;
}

.item__user__create a {
    color: var(--yellow);
    font-weight: 600;
    border-bottom: 1px solid transparent;
}

.item__user__create a:hover {
    border-color: var(--yellow);
}




.u__reviews {
    position: relative;
}

.u__reviews .u__item {
    padding: 25px;
    border-radius: 12px;
    background: #1B1B1B;
    margin-bottom: 10px
}

.u__reviews .u__item:last-child {
    margin-bottom: 0;
}

.u__reviews .u__item .title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 15px;
    line-height: 110%;
}

.u__reviews .u__item .u__info {
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    line-height: 140%;
    font-size: 14px;
    margin-bottom: 20px;
}

.u__reviews .u__item .u__info .u__text {
    color: var(--yellow);
    margin: 0
}

.u__reviews .u__item .u__info .u__date {
    color: #A0A0A0;
    position: relative;
    padding-left: 10px;
}

.u__reviews .u__item .u__info .u__date:after {
    position: absolute;
    top: 10%;
    left: 0;
    width: 2px;
    height: 80%;
    content: '';
    background: #A0A0A0;
}

.u__reviews .u__item .u__rev {
    margin-bottom: 20px;
    color: #CFCFCF;
}

.u__reviews .u__item .u__rev__name {
    font-weight: 500;
}

.u__reviews .u__item .rating {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 1px;
}

.u__reviews .u__item .rating span {
    width: 18px;
    height: 18px;
    background: url("../img/star.svg") 50% 50% no-repeat;
}





.projects__list__item {
    align-items: center;
    margin-bottom: 10px;
    padding: 30px;
    border-radius: 12px;
    border: 1px solid #292929;
}

.projects__list__item .u__location {
    margin-bottom: 20px;
}

.projects__list__item .col {
    width: 100%;
}

.projects__list__item .col:nth-child(1) {
    max-width: 400px;
}

.projects__list__item .col:nth-child(2) {
    max-width: 656px;
}

.projects__list__item .col:nth-child(2) .project__item__n .image img {
    height: 212px;
}

.projects__list__item .col:nth-child(2) .project__item__n .image .like img {
    width: auto;
    height: auto;
}

.projects__list__item .col:nth-child(2) .project__item__n .data {
    padding: 14px 10px
}

.projects__list__item .col:nth-child(2) .project__item__n .data .title {
    font-size: 14px;
}

.projects__list__item .col:nth-child(3) {
    max-width: 280px;
    text-align: center;
}

.projects__list__item .col .btn,
.projects__list__item .btns .btn {
    margin-bottom: 10px;
    font-size: 18px;
    height: 50px;
}

.projects__list__item .col .price__item {
    margin-bottom: 30px;
    font-size: 14px;
    color: #A0A0A0;
}

.projects__list__item .col .price__item strong {
    display: block;
    font-size: 26px;
    font-weight: 600;
    line-height: 110%;
    color: var(--yellow);
}

.projects__list__item .text {
    color: #E7E7E7;
    font-size: 15px;
    margin-bottom: 20px
}

.projects__list__item .u__tags span {
    height: 32px;
    font-size: 14px;
}

.projects__list__item .btns {
    display: none;
}










.u__location {
    padding: 1px 0 1px 28px;
    background: url("../img/location.svg") 0 50% no-repeat;
    font-size: 16px;
    font-weight: normal;
    color: #A0A0A0;
}





#page__article {
    padding: 40px 0;
}

#page__article .container {
    position: relative;
}

#page__article .container__min {
    max-width: 1080px
}

#page__article .back {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4;
    display: inline-block;
    width: auto
}

#page__article .articles__info {
    padding: 30px 0 0;
    margin: 30px 0 0;
    border-top: 1px solid #292929;
}

#page__article .articles__info .label {
    font-size: 14px;
    margin-bottom: 10px;
    color: #A0A0A0;
}

#page__article .articles__info .u__tags a {
    font-size: 14px;
    height: 32px;
}

#page__article .top {
    margin-bottom: 20px
}

#page__article .top img {
    margin-bottom: 50px;
    width: 100%;
    border-radius: 12px;
}

#page__article .top .flex {
    justify-content: flex-start;
    gap: 10px;
}

#page__article .top .flex div {
    padding: 0 0 0 22px;
    font-size: 14px;
    color: #A0A0A0;
}

#page__article .top div.date {
    background: url("../img/calendar.svg") 0 50% no-repeat;
}

#page__article .top div.time {
    background: url("../img/time.svg") 0 50% no-repeat;
}

#page__article .u__tags {
    margin: 0
}





.u__share .flex {
    justify-content: flex-start;
    gap: 10px;
}

.u__share a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #292929;
}

.u__share a:hover {
    background: var(--yellow);
}

.u__share a:hover svg path {
    fill: var(--black);
}





#page__contacts {
    padding: 60px 0 0;
}

#page__contacts .text {
    max-width: 600px;
    width: 100%;
}

#page__contacts .text p {
    margin-bottom: 30px;
    font-size: 16px;
    color: #CFCFCF;
}

#page__contacts .block__title {
    border-bottom: 1px solid #292929;
    margin-bottom: 30px;
    padding-bottom: 30px;
}

#page__contacts .ct.flex {
    justify-content: flex-start;
}

#page__contacts .ct.flex> :first-child {
    width: 33%;
}

#page__contacts .ct.flex> :nth-child(2) {
    width: 20%;
}

#page__contacts .ct.flex> :last-child {
    width: 47%;
}

#page__contacts ul li span {
    color: #A0A0A0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 5px;
    padding: 6px 0;
}

#page__contacts a {
    color: #A0A0A0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 5px;
    padding: 6px 0;
}

#page__contacts a:hover {
    color: var(--yellow);
}

#page__contacts a:hover svg path {
    fill: var(--yellow);
}

#page__contacts .form {
    max-width: 740px;
    width: 100%;
}

#page__contacts ::placeholder {
    color: #585858 !important;
}





#page__careers {
    position: relative;
}

#page__careers .main {
    position: relative;
    margin-bottom: 80px;
}

#page__careers .image {
    position: relative;
}

#page__careers .image img {
    width: 100%;
    height: 700px;
    object-fit: cover;
    border-radius: 12px;
}

#page__careers .image:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.45) 100%);
    content: ''
}

#page__careers .data {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    box-sizing: border-box;
    padding: 0 0 80px 60px;
}

#page__careers .data h1 {
    max-width: 560px;
    font-weight: 700;
    font-size: 48px;
    line-height: 110%;
}

#page__careers .text {
    font-size: 20px;
    line-height: 140%;
}

#page__careers .text p {
    margin-bottom: 10px;
}

#page__careers .text p:last-child {
    margin: 0
}





#why {}

#why .item {
    padding: 30px;
    border-radius: 12px;
    background: #1B1B1B;
}

#why .item .icon {
    margin-bottom: 20px
}

#why .item .title {
    margin-bottom: 5px;
    font-size: 18px;
    font-weight: 600;
}

#why .item p {
    color: #CFCFCF
}





#positions {}

#positions .item {
    padding: 30px;
    border-radius: 12px;
    transition: all 0.2s;
    border: 1px solid #292929
}

#positions .item:hover {
    background: #292929
}

#positions .item .title {
    margin-bottom: 10px;
    font-size: 24px;
    font-weight: 600;
}

#positions .item .info {
    justify-content: flex-start;
    gap: 20px;
    color: #A0A0A0;
    margin-bottom: 20px
}

#positions .item .info span {
    color: var(--white);
    font-weight: 500;
}

#positions .item .text {
    margin-bottom: 30px;
    color: #A0A0A0
}

#positions .item .btn {
    font-size: 16px;
    height: 44px;
}





#subscribe {}

#subscribe .data {
    align-items: center;
    padding: 40px 40px 40px 80px;
    border-radius: 12px;
    background: #1B1B1B
}

#subscribe .image {
    width: 746px;
}

#subscribe .image img {
    width: 100%;
    height: 420px;
    object-fit: cover;
    border-radius: 12px;
}

#subscribe .text {
    width: 480px
}

#subscribe .title {
    font-size: 48px;
    font-weight: 700;
    line-height: 110%;
    margin-bottom: 20px
}

#subscribe .note {
    font-size: 17px;
    font-weight: 500;
    color: #CFCFCF;
    margin-bottom: 40px;
}

#subscribe .form__subscribe {
    position: relative;
}

#subscribe .form__subscribe input {
    width: 100%;
    padding: 0 133px 0 18px;
    height: 60px;
    font-size: 16px;
    font-weight: 500;
    border-radius: 12px;
    background: #292929;
    border: none;
    color: #fff;
}

#subscribe .form__subscribe .btn {
    position: absolute;
    height: 44px;
    font-size: 16px;
    right: 5px;
    top: calc(50% - 22px)
}





#page__account {
    padding: 140px 0 80px;
}

#page__account .bt__note {
    text-align: center;
    margin: -30px 0 40px;
    color: #CFCFCF;
}

.form__login {
    margin: 0 auto;
    max-width: 520px
}

.form__login .bt {
    text-align: center;
    color: var(--white);
    margin-bottom: 40px;
}

.login__socials {
    align-items: center;
}

.login__socials .btn {
    width: calc(50% - 5px) !important;
    box-sizing: border-box;
}

.form .center {
    text-align: center;
    padding: 40px 0 0;
    color: #CFCFCF;
}

.form .center a {
    color: var(--white);
    text-decoration: underline;
}

.form .center a:hover {
    color: var(--yellow);
}

.forgot {
    color: var(--white);
    font-size: 14px;
    font-weight: 500;
    text-decoration: underline;
}

.forgot:hover {
    text-decoration: none;
    color: var(--yellow);
}

.login__or {
    text-align: center;
    position: relative;
    margin: 40px 0;
    color: #A0A0A0
}

.login__or:after {
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0;
    top: 60%;
    content: '';
    background: #A0A0A0
}

.login__or span {
    position: relative;
    padding: 0 15px;
    background: var(--black);
    z-index: 2
}





.box__post {
    margin-bottom: 50px
}

.box__post .bt__note {
    margin-bottom: 20px;
}

.box__post__title {
    font-size: 20px;
    font-weight: 600;
    line-height: 110%;
    margin-bottom: 30px
}

.box__post__title.nm {
    margin-bottom: 10px
}

.images__uploads {
    margin-bottom: 20px;
}

.images__uploads .item {
    box-sizing: border-box;
    height: 180px;
    border-radius: 12px;
    border: 2px dashed #414141;
    padding: 10px;
}

.images__uploads .item img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: 12px;
}

.images__uploads.video__uploads .item {
    height: 640px;
    position: relative;
}

.images__uploads.video__uploads .item a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../img/play.svg") 50% 50% no-repeat;
    z-index: 3
}

.images__uploads.video__uploads .item:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: rgba(0, 0, 0, 0.3);
    transition: all 0.2s;
}

.images__uploads.video__uploads .item:hover:after {
    background: rgba(0, 0, 0, 0.4);
}





.posts__filters {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
}

.posts__filters .btn {
    height: 40px;
    font-size: 16px;
    padding: 0 16px
}






#page__notification {
    padding: 60px 0 0;
}

#page__notification .container {
    max-width: 1360px
}

#page__notification .item {
    align-items: flex-start;
    justify-content: flex-start;
    padding: 25px 60px 25px 25px;
    position: relative;
    gap: 20px;
    margin-bottom: 5px;
    transition: all 0.2s;
    border-radius: 12px;
    border: 1px solid transparent;
}

#page__notification .item.no__read,
#page__notification .item:hover {
    background: #1B1B1B;
    border-color: #292929;
}

#page__notification .item .btn {
    position: absolute;
    top: calc(50% - 12px);
    right: 25px;
}

#page__notification .item .btn:hover {
    transform: rotate(90deg);
}

#page__notification .item .btn:hover svg path {
    stroke: #FF4848
}

#page__notification .item .text p {
    margin-bottom: 5px;
    font-size: 15px;
    line-height: 150%;
}

#page__notification .item .text a,
#page__notification .item .text strong {
    color: var(--yellow);
    border-bottom: 1px solid transparent;
    font-weight: 600;
}

#page__notification .item .text a:hover {
    border-color: var(--yellow);
}

#page__notification .item .text .date {
    color: #8A8A92;
    font-size: 14px;
}

#page__notification .loadmore {
    padding-top: 60px;
    justify-content: center;
}





#page__user__setting {
    margin-bottom: -60px
}

#page__user__setting .page__data {
    border-left: 1px solid #292929;
    border-right: 1px solid #292929;
}

#page__user__setting .page__data .navigation {
    width: 400px;
    box-sizing: border-box;
    border-right: 1px solid #292929;
    padding: 40px 30px;
}

#page__user__setting .page__data .navigation .nav__title {
    width: 100%;
    margin: 30px 0 40px;
    font-size: 28px;
    line-height: 110%;
    font-weight: 600;
    color: #E7E7E7;
}

#page__user__setting .page__data .navigation nav li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 20px 0;
    color: #A0A0A0;
    font-size: 18px;
    font-weight: 500;
}

#page__user__setting .page__data .navigation nav li a svg {
    opacity: 0;
}

#page__user__setting .page__data .navigation nav li a:hover svg,
#page__user__setting .page__data .navigation nav li a.active svg {
    opacity: 1
}

#page__user__setting .page__data .navigation nav li a:hover,
#page__user__setting .page__data .navigation nav li a.active {
    color: var(--yellow);
}

#page__user__setting .setting__data {
    width: calc(100% - 400px)
}

#page__user__setting .setting__data .box__settings {
    padding: 60px;
    border-bottom: 1px solid #292929
}

#page__user__setting .setting__data .box__settings .btn {
    height: 44px;
    font-size: 16px;
}

#page__user__setting .setting__data .box__settings:last-child {
    border-bottom: none;
}

#page__user__setting .title__settings {
    align-items: center;
    margin-bottom: 30px;
    font-size: 24px;
    font-weight: 600;
    color: #E7E7E7;
    line-height: 110%;
}

/* Contacts edit layout adjustments: align avatar and form tighter */
#page__user__setting .settings__contacts__edit .data {
    align-items: flex-start;
    gap: 20px;
}

#page__user__setting .settings__contacts__edit .user__photo {
    margin-right: 20px;
}

#page__user__setting .settings__contacts__edit .user__data {
    width: calc(100% - 280px);
}

#page__user__setting .title__settings .note {
    width: 100%;
    margin-top: 5px;
    font-size: 15px;
    color: #A0A0A0;
}

#page__user__setting .pass__update {
    align-items: center;
    gap: 10px;
}

#page__user__setting .form__login .form__item.full {
    width: 100%;
}

#page__user__setting .form__login .form__item.full input {
    width: 100%;
}

#page__user__setting .pass__update .btn {
    height: 44px;
    font-size: 16px;
}

#page__user__setting .settings__contacts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    font-size: 15px;
    line-height: normal;
}

#page__user__setting .settings__contacts span {
    color: #A0A0A0;
    display: block;
    margin-bottom: 2px;
}

#page__user__setting .settings__contacts p {
    margin-bottom: 5px;
    font-weight: 500;
}

#page__user__setting .settings__contacts .verify {
    color: var(--yellow);
    font-size: 14px;
    font-weight: 600;
}

#page__user__setting .settings__contacts .close__account {
    color: #A0A0A0;
    font-weight: 500;
}

#page__user__setting .settings__contacts .close__account:hover {
    color: #FF4848;
}

#page__user__setting .list__swiper {
    display: none;
}


#page__user__setting .list__posts {
    position: relative;
    padding: 40px 0 0;
}

#page__user__setting .list__posts .item {
    align-items: center;
    padding: 20px;
    border-bottom: 1px solid #292929
}

#page__user__setting .list__posts .item .data {
    width: calc(100% - 450px);
    gap: 20px;
    align-items: center;
}

#page__user__setting .list__posts .item .data img {
    object-fit: cover;
    width: 60px;
    height: 60px;
    border-radius: 8px;
}

#page__user__setting .list__posts .item .data .title {
    width: calc(100% - 80px);
    font-weight: 500;
}

#page__user__setting .list__posts .item .flex {
    align-items: center;
}

#page__user__setting .list__posts .item .info {
    width: 210px;
    margin-right: 40px;
}

#page__user__setting .list__posts .item .price {
    font-size: 15px;
    color: #A0A0A0;
}

#page__user__setting .list__posts .item .acts {
    gap: 10px
}

#page__user__setting .list__posts .item .acts .btn {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid #292929;
    background: #1B1B1B
}

#page__user__setting .list__posts .item .acts .btn:hover {
    background: var(--yellow);
    border-color: var(--yellow);
}

#page__user__setting .list__posts .item .acts .btn:hover svg path {
    stroke: var(--black);
}


.list__posts__billing {
    padding-left: 60px !important;
    padding-right: 60px !important;
}


.p_status span {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    line-height: 28px;
    background: rgba(17, 204, 45, 0.2);
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    color: #11CC2D;
}

.p_status span.draft {
    color: #CFCFCF;
    background: #414141;
}

.p_status span.expired {
    color: #FF4848;
    background: rgba(255, 72, 72, 0.1);
}

.p_status span.pause {
    color: var(--yellow);
    background: rgba(217, 238, 83, 0.1);
}




.actions__send {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    flex-wrap: wrap;
    padding: 15px 0 0;
}

.actions__send .btn {
    height: 44px;
    font-size: 16px;
    width: auto !important;
    min-width: 160px;
}
























































footer {
    position: relative;
    border-top: 1px solid #292929;
    margin: 60px 0 10px;
    padding: 80px 0 0;
}

footer .bottom {
    padding: 25px 0;
    border-top: 1px solid #292929;
    margin-top: 80px
}

footer .bottom .flex {
    align-items: center;
    color: var(--blaclSilver);
    font-size: 13px;
}

footer .bottom ul {
    gap: 20px;
}

footer .bottom a {
    color: var(--blaclSilver);
}

footer .bottom a:hover {
    color: var(--yellow);
}

footer .title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 15px;
    color: var(--white);
}

footer .subscribe {
    width: 100%;
    max-width: 460px
}

footer .subscribe .title {
    margin-bottom: 5px;
}

footer .subscribe .note {
    font-size: 14px;
    color: var(--blaclSilver);
    margin-bottom: 20px;
}

footer .subscribe form {
    position: relative;
}

footer .subscribe form input {
    width: 100%;
    padding: 0 133px 0 18px;
    height: 60px;
    font-size: 16px;
    font-weight: 500;
    border-radius: 12px;
    background: #292929;
    border: none;
    color: #fff;
}

footer .subscribe form .btn {
    position: absolute;
    height: 44px;
    font-size: 16px;
    right: 5px;
    top: calc(50% - 22px)
}

footer .data {
    gap: 40px;
    width: calc(100% - 500px)
}

footer .data {
    font-size: 14px;
    line-height: 140%;
}

footer .data .box {
    margin-bottom: 30px;
}

footer .data .box:last-child {
    margin-bottom: 0;
}

footer .data ul li {
    margin-bottom: 8px;
}

footer .data ul li:last-child {
    margin-bottom: 0
}

footer .data ul li a {
    color: var(--blaclSilver);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 5px
}

footer .data ul li a:hover {
    color: var(--yellow);
}

footer .data ul li a:hover svg path {
    fill: var(--yellow);
}

footer .data .title a {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 18px;
    color: var(--white);
}

footer .col {
    width: 100%;
    max-width: 240px
}


















.slider-products .swiper {
    padding: 0 1px
}

.slider-sw,
.list__swiper {
    position: relative;
}

.slider-sw .swiper-button-prev,
.slider-sw .swiper-button-next {
    width: 40px;
    opacity: 1 !important;
    height: 40px;
    top: 50%;
    transition: all 0.15s ease-out;
}

.slider-sw .swiper-button-prev svg,
.slider-sw .swiper-button-next svg {
    width: auto;
    height: auto;
}

.slider-sw .swiper-button-prev:hover svg rect,
.slider-sw .swiper-button-next:hover svg rect {
    fill: var(--yellow);
}

.slider-sw .swiper-button-prev:after,
.slider-sw .swiper-button-next:after {
    display: none;
}




.slider-sw .swiper-pagination {
    bottom: 20px !important;
}

.slider-sw .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    opacity: 1;
    background: #fff;
    border-radius: 50% !important;
    opacity: 0.3
}

.slider-sw .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--yellow);
    opacity: 1
}


.slider-sw .swiper-button-next {
    right: 30px;
}

.slider-sw .swiper-button-prev {
    left: 30px;
    transform: rotate(180deg);
}







.box__modal {
    display: none;
    font-family: "Outfit", sans-serif !important;
    width: 1020px;
    max-width: 100%;
    padding: 40px 60px;
    box-sizing: border-box;
    background: var(--black);
    border: 1px solid #414141;
    border-radius: 12px;
}

#post__created {
    max-width: 520px;
    text-align: center;
}

#post__created .image__ok {
    margin-bottom: 15px
}

#post__created .image__ok img {
    margin: 0 auto;
}

#post__created .modal__title {
    margin-bottom: 15px
}

#post__created p {
    margin-bottom: 40px;
    font-size: 15px;
    color: #A0A0A0;
}

#post__created .btn {
    width: calc(50% - 5px);
    height: 50px;
    font-size: 18px;
}


#post__created_success {
    max-width: 520px;
    text-align: center;
}

#post__created_success .image__ok {
    margin-bottom: 15px
}

#post__created_success .image__ok img {
    margin: 0 auto;
}

#post__created_success .modal__title {
    margin-bottom: 15px;
    margin-left: auto;
    margin-right: auto;
}

#post__created_success p {
    margin-bottom: 40px;
    font-size: 15px;
    color: #A0A0A0;
}

#post__created_success .btn {
    width: calc(50% - 5px);
    height: 50px;
    font-size: 18px;
}

/* Report Success Modal */
#report__success {
    max-width: 420px;
    text-align: center;
}

#report__success .image__ok {
    margin-bottom: 20px;
}

#report__success .image__ok img {
    margin: 0 auto;
    width: 80px;
    height: 80px;
}

#report__success .modal__title {
    margin-bottom: 15px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

#report__success p {
    margin-bottom: 30px;
    font-size: 15px;
    color: #A0A0A0;
    line-height: 1.5;
}

#report__success .actions {
    justify-content: center;
}

#report__success .btn {
    min-width: 150px;
    height: 50px;
    font-size: 16px;
}

#modal__payment {
    max-width: 560px;
    text-align: center;
}

#modal__payment .modal__title {
    margin-bottom: 15px
}

#modal__payment p {
    margin-bottom: 40px;
    font-size: 15px;
    color: #A0A0A0;
}

#modal__payment .btn {
    width: calc(50% - 5px);
    height: 50px;
    font-size: 18px;
}

#modal__payment .actions {
    padding-top: 30px;
}



#remove__post {
    max-width: 560px;
    text-align: center;
}

#remove__post .modal__title {
    margin-bottom: 15px
}

#remove__post p {
    margin-bottom: 40px;
    font-size: 15px;
    color: #A0A0A0;
}

#remove__post .btn {
    width: calc(50% - 5px);
    height: 50px;
    font-size: 18px;
}

#modal__confirm_pause {
    max-width: 560px;
    text-align: center;
}

#modal__confirm_pause .modal__title {
    margin-bottom: 15px
}

#modal__confirm_pause p {
    margin-bottom: 40px;
    font-size: 15px;
    color: #A0A0A0;
}

#modal__confirm_pause .btn {
    width: calc(50% - 5px);
    height: 50px;
    font-size: 18px;
}

#modal__confirm_delete {
    max-width: 560px;
    text-align: center;
}

#modal__confirm_delete .modal__title {
    margin-bottom: 15px
}

#modal__confirm_delete p {
    margin-bottom: 40px;
    font-size: 15px;
    color: #A0A0A0;
}

#modal__confirm_delete .btn {
    width: calc(50% - 5px);
    height: 50px;
    font-size: 18px;
}

#modal__confirm_close_account {
    max-width: 560px;
    text-align: center;
}

#modal__confirm_close_account .modal__title {
    margin-bottom: 15px
}

#modal__confirm_close_account p {
    margin-bottom: 40px;
    font-size: 15px;
    color: #A0A0A0;
}

#modal__confirm_close_account .btn {
    width: calc(50% - 5px);
    height: 50px;
    font-size: 18px;
}



#add__billing {
    max-width: 820px;
}



.fancybox-close-small {
    background: url("../img/closeg.svg") 50% 50% no-repeat;
    top: 24px;
    right: 24px;
    opacity: 1;
    background-size: 100%;
    width: 24px;
    height: 24px;
    transition: all 0.15s;
}

.fancybox-close-small:hover {
    transform: rotate(90deg);
}

.fancybox-close-small:after {
    display: none;
}

.modal__title {
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 30px;
    line-height: 110%;
    max-width: 85%;
}


.box__modal .user__data {
    width: calc(100% - 240px)
}

.box__modal .form .modal__actions {
    justify-content: flex-end !important;
    gap: 10px;
    padding: 30px 0 0;
}

.box__modal .modal__actions .btn {
    width: auto;
}

.box__modal .modal__actions .btn-close {}

.box__modal .form__login {
    max-width: 100%;
}

.box__modal .form__login .u__tags {
    margin-top: 8px
}

.box__modal .form.form__login textarea.full__height {
    height: 320px
}


.compensate-for-scrollbar {
    margin-right: 0 !important
}




#payment__invoice {
    padding-bottom: 20px;
    max-width: 680px
}

#payment__invoice .download {
    margin-top: -12px;
}

.invoice__status {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-bottom: 1px solid #292929;
    margin-top: -15px
}

.invoice__status .date {
    font-size: 15px;
    color: #A0A0A0;
}

.invoice__box {
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-bottom: 1px solid #292929;
}

.invoice__box .row {
    margin-bottom: 20px;
}

.invoice__box .row:last-child {
    margin-bottom: 0
}

.invoice__box .row span {
    color: #A0A0A0;
    font-size: 15px;
}

.invoice__box .row p {
    font-weight: 500;
}

.invoice__total {
    border-radius: 12px 12px 0 0;
    border: 1px solid #292929;
    border-bottom: none;
    padding: 12px 24px;
    box-sizing: border-box;
}

.invoice__total .row {
    align-items: center;
    padding: 12px 0;
}

.invoice__total .row p {
    color: #A0A0A0
}

.invoice__total .row.total {
    border-top: 1px solid #292929;
    padding: 24px 0;
    margin-top: 12px;
}




section {
    position: relative;
    z-index: 2
}



.section {
    padding: 120px 0 0;
}

/* .section__small{padding: 0 0 30px; border-bottom: 1px solid #292929} */
.section__small__top {
    padding: 60px 0 0;
}


.flex {
    display: flex !important;
    justify-content: space-between;
    flex-wrap: wrap;
}




.grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 10px;
}

.grid.grid-2 {
    grid-template-columns: repeat(2, 1fr);
}

.mobile-only-nav-item {
    display: none;
}

.grid.grid-3 {
    grid-template-columns: repeat(3, 1fr);
}

.grid.grid-4 {
    grid-template-columns: repeat(4, 1fr);
}

.grid.grid-5 {
    grid-template-columns: repeat(5, 1fr);
}

.grid.grid-6 {
    grid-template-columns: repeat(6, 1fr);
}


.bt {
    font-size: 36px;
    line-height: 110%;
    font-weight: 700;
    line-height: 110%;
}

.bt.bt__small {
    margin-bottom: 20px;
    font-size: 24px;
    line-height: 110%;
    font-weight: 600;
}

.bt.bt__page {
    margin-bottom: 50px;
    color: #E7E7E7;
    font-weight: 600;
    font-size: 28px;
    line-height: 110%;
    text-align: left;
}

.bt__note {
    margin-top: 15px;
    color: var(--blaclSilver);
    font-weight: normal;
    font-size: 16px;
    line-height: 140%;
}

.block__title {
    margin-bottom: 40px;
    align-items: center;
}

.block__title .left {
    max-width: 70%;
}

.block__title .bt {
    font-size: 48px;
    font-weight: 700;
}

.block__title .bt__note {
    font-size: 17px;
    color: #CFCFCF;
}


.box__modal {
    display: none;
}



::placeholder {
    color: var(--blaclSilver) !important;
}


section {
    box-sizing: border-box;
    position: relative;
}



.form {
    position: relative;
}

.form label {
    display: block;
}

.form input[type="text"],
.form input[type="email"],
.form input[type="tel"],
.form input[type="password"],
.form textarea {
    width: 100%;
    padding: 0 20px;
    line-height: 54px;
    background: #1B1B1B;
    border: none;
    color: var(--white);
    font-size: 16px;
    font-weight: normal;
}

.form .flex {
    justify-content: space-between !important;
}

.form .flex .form__item {
    width: calc(50% - 5px)
}

.form .flex.flex-3 .form__item {
    width: calc(100%/3 - 5px)
}

.form .flex select {
    min-width: 0;
    width: 100%;
}

.form select {
    width: 100%;
    height: 54px;
    background-color: #1B1B1B !important
}

.form .btn {
    width: 100%;
}

/* In contact/password edit sections, keep action buttons side by side, not full width */
.settings__contacts__edit .modal__actions .btn,
.form .actions__send .btn {
    width: auto !important;
}

.box__form {
    margin-bottom: 40px;
}

.box__form__title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px;
}

.box__form__title.bft__small {
    margin-bottom: 10px;
    font-size: 16px;
}

.form .form__note {
    margin-top: 8px;
    font-size: 12px;
    color: #A0A0A0;
    line-height: 140%;
}

.box__form .u__tags {
    margin-top: 8px;
}

.box__form .u__tags a,
.box__form .u__tags span {
    height: 32px;
    gap: 5px
}

/* Skills suggestions dropdown (register profile) */
#skills_field {
    position: relative;
}

#skills_suggest {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 50;
    margin-top: 6px;
    background: #1B1B1B;
    border: 1px solid #292929;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

#skills_suggest .dropdown__item {
    padding: 10px 14px;
    color: #E7E7E7;
    font-size: 14px;
    line-height: 140%;
    cursor: pointer;
    border-bottom: 1px solid #1F1F1F;
    transition: background 0.15s, color 0.15s;
}

#skills_suggest .dropdown__item:last-child {
    border-bottom: none;
}

#skills_suggest .dropdown__item:hover {
    background: #292929;
    color: var(--white);
}

/* Keep input and tags spacing tight under helper note */
#skills_field .form__note {
    margin-top: 8px;
}

#skills_field #skills_tags {
    margin-top: 8px;
}

.box__post .u__tags {
    margin-top: 8px;
}

.box__post .u__tags a,
.box__post .u__tags span {
    height: 32px;
    gap: 5px
}

.u__tags a:hover svg path,
.u__tags span:hover svg path {
    stroke: var(--black);
}

select {
    background: #292929 url("../img/arrdg.svg") calc(100% - 16px) 50% no-repeat;
    padding: 0 42px 0 16px;
    border-radius: 12px;
    height: 48px;
    border: none;
    color: #E7E7E7;
    font-weight: normal;
    font-size: 16px;
    min-width: 240px;
    position: relative;
    box-sizing: border-box;
}

select:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 10px;
    height: 10px;
    background: red;
    content: ''
}

.form input[type="email"]:focus {}

.form textarea {
    border-radius: 6px;
    height: 98px;
    resize: none;
    line-height: normal;
    padding-top: 16px
}

.form .btn-login-send {
    margin-top: 20px;
}

.form.form__login.form__login__max {
    max-width: 100%;
}

.form.form__login input,
.form.form__login select {
    height: 54px;
}

.form.form__login textarea {
    height: 186px
}

.form.form__login textarea.full__height {
    height: 940px
}

.form input.i__social {
    padding-left: 46px
}

.form input.i__social.i__facebook {
    background: #1B1B1B url("../img/facebook.svg") 16px 50% no-repeat;
}

.form input.i__social.i__instagram {
    background: #1B1B1B url("../img/instagram.svg") 16px 50% no-repeat;
}

.form input.i__social.i__tiktok {
    background: #1B1B1B url("../img/tiktok.svg") 16px 50% no-repeat;
}

.form input.i__social.i__website {
    background: #1B1B1B url("../img/website.svg") 16px 50% no-repeat;
}

.input__filters {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0 38px 0 46px;
    border-radius: 12px;
    background: #292929 url("../img/filters.svg") 12px 50% no-repeat;
    height: 48px;
    color: #E7E7E7;
    font-size: 16px;
    font-weight: normal;
    cursor: pointer;
}

.input__filters:after {
    width: 16px;
    height: 16px;
    right: 12px;
    top: calc(50% - 8px);
    position: absolute;
    content: '';
    background: url("../img/arrdg.svg") 50% 50% no-repeat;
    transition: all 0.2s;
}

.input__filters.open:after {
    transform: rotate(180deg);
}


.form__item {
    width: 100%;
    margin-bottom: 15px
}

.form__item .label {
    margin-bottom: 8px;
    font-size: 13px;
    color: #A0A0A0;
}

.form__item input {
    width: 100%;
    height: 48px;
    border-radius: 12px;
    color: #E7E7E7;
    background: #292929;
    border: none;
    padding: 0 12px;
    font-weight: 600;
    font-size: 16px;
}


.form .flex__items .input__price {
    width: calc(50% - 5px);
    position: relative;
}

.form .flex__items .input__price span {
    position: absolute;
    top: 0;
    left: 12px;
    height: 100%;
    line-height: 54px;
    color: #A0A0A0
}

.form .flex__items .input__price input {
    text-align: right;
    font-weight: 600;
}


label.file {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    justify-content: space-between;
    border: 1px solid rgba(0, 16, 26, 0.3);
    padding: 0 20px;
    font-size: 16px;
    height: 62px;
    border-radius: 10px;
    max-width: 190px;
    font-size: 16px;
}

label.file:hover {
    background: rgba(0, 16, 26, 0.3);
    cursor: pointer;
}




input[type="checkbox"],
input[type="radio"] {
    display: none;
}


label.checkbox {
    display: block;
    position: relative;
    cursor: pointer;
    margin: 30px 0
}

label.checkbox a {
    color: var(--yellow);
    border-bottom: 1px solid transparent;
}

label.checkbox a:hover {
    border-color: var(--yellow);
}

label.checkbox span {
    position: relative;
    padding: 1px 0 1px 30px;
    display: block;
    font-size: 16px;
    line-height: 140%;
    color: #CFCFCF;
    font-weight: normal;
}

label.checkbox span:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    box-sizing: border-box;
    content: '';
    background: url("../img/checkc.svg") 50% 50% no-repeat;
}

label.checkbox input:checked+span:after {
    background: url("../img/checkch.svg") 50% 50% no-repeat;
    background-size: 100%
}


label.radio {
    display: block;
    position: relative;
    padding: 20px 50px 20px 20px;
    background: #1B1B1B;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s;
    margin-bottom: 10px
}

label.radio span:after {
    position: absolute;
    width: 24px;
    height: 24px;
    background: url("../img/check.svg") 50% 50% no-repeat;
    top: calc(50% - 12px);
    right: 20px;
    content: ''
}

label.radio span {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

label.radio input:checked+span:after {
    background: url("../img/checkh.svg") 50% 50% no-repeat;
    background-size: 100%
}

label.radio .data {
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    font-weight: 500;
}



label.radio__full {
    position: relative;
    display: block;
    padding: 30px;
    cursor: pointer;
    transition: all 0.2s;
    margin-bottom: 10px;
    border-radius: 8px;
    background: #1B1B1B;
    font-size: 18px;
    font-weight: 500;
}

label.radio__full img {
    margin-bottom: 20px
}

label.radio__full span:after {
    position: absolute;
    width: 24px;
    height: 24px;
    background: url("../img/check.svg") 50% 50% no-repeat;
    top: 30px;
    right: 30px;
    content: ''
}

/*label.radio__full span:after{position: absolute; width: 24px; height: 24px; background: url("../img/checkh.svg") 50% 50% no-repeat; top: 30px; right: 30px; content: ''; z-index: 3; display: none;}*/
label.radio__full input:checked+span:after {
    display: block;
    background: url("../img/checkh.svg") 50% 50% no-repeat;
    background-size: 100%;
}

::placeholder {
    color: #959EAD;
}



.user__photo {
    text-align: center;
    margin-bottom: 40px;
    cursor: pointer;
}

.user__photo.uploaded .image {
    padding: 10px;
}

.user__photo .image {
    width: 180px;
    height: 180px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    border: 2px dashed #414141;
    box-sizing: border-box;
}

.user__photo.uploaded .image img {
    width: 160px;
    height: 160px;
    object-fit: cover;
    border-radius: 12px;
}

.user__photo span {
    color: #A0A0A0;
    font-size: 14px;
    font-weight: normal;
}

.user__photo.large__photo .image {
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
    display: block;
    padding-top: 50px
}

.user__photo.large__photo .image span {
    width: 100%;
    display: block;
}


button {
    background: transparent;
}



.clearfix {
    clear: both;
}

.center {
    display: inline-block;
    width: 100%;
    text-align: center;
}


a,
svg,
svg path,
rect {
    text-decoration: none;
    transition: all 0.15s ease-out;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    cursor: pointer;
}

a:hover {
    transition: all 0.15s ease-out;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

a:focus {
    outline: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

img {
    display: block;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    max-width: 100%;
    height: auto;
    transition: all 0.15s ease-out;
}

div {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}



.btn,
.btn:after {
    font-family: "Outfit", sans-serif;
    gap: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    text-align: center;
    cursor: pointer;
    padding: 0;
    border: none;
    transition: all 0.2s ease-out;
    box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    outline: none;
}

.btn:hover {
    transition: all 0.2s ease-out;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}








.btn-yellow-tr {
    height: 44px;
    border: 2px solid var(--yellow);
    color: var(--yellow);
    padding: 0 22px;
    line-height: 100%;
    font-size: 16px;
    font-weight: 600;
    border-radius: 12px;
}

.btn-yellow-tr:hover {
    background: var(--yellow);
    color: var(--black);
}


.btn-yellow {
    height: 50px;
    border: 2px solid var(--yellow);
    color: var(--black) !important;
    background: var(--yellow);
    padding: 0 28px;
    line-height: 1;
    font-size: 18px;
    font-weight: 600;
    border-radius: 12px;
}

.btn-yellow:hover {
    background: transparent;
    color: var(--white) !important;
}

.btn-yellow:hover svg path {
    stroke: var(--white);
}



.btn-grey-tr {
    height: 44px;
    border: 2px solid #292929;
    color: #CFCFCF;
    padding: 0 22px;
    line-height: 100%;
    font-size: 16px;
    font-weight: 600;
    border-radius: 12px;
}

.btn-grey-tr:hover {
    background: var(--yellow);
    color: var(--black);
    border-color: var(--yellow);
}

.btn-grey-tr:hover svg path {
    stroke: var(--black);
}


.btn-grey {
    height: 44px;
    border: 2px solid #292929;
    background: #292929;
    gap: 5px;
    color: #CFCFCF;
    padding: 0 16px;
    line-height: 100%;
    font-size: 16px;
    font-weight: 600;
    border-radius: 12px;
}

.btn-grey:hover {
    background: transparent;
}




.btn-readall {
    color: #CFCFCF;
    line-height: 36px;
    font-size: 16px;
    font-weight: 700;
    justify-content: flex-start;
}

.btn-readall:hover {
    color: var(--yellow);
}


.btn-back {
    gap: 5px;
    color: var(--white);
    height: 40px;
    border-radius: 12px;
    padding: 0 16px;
    background: #292929
}

.btn-back:hover {
    background: var(--yellow);
    color: var(--black);
}

.btn-back:hover svg path {
    stroke: var(--black);
}



.btn-login {
    height: 48px;
    padding: 0;
    border: 2px solid #292929;
    border-radius: 8px;
    gap: 5px;
    font-size: 15px;
    font-weight: 600;
    color: var(--white);
}

.btn-login:hover {
    background: #292929
}

.btn-login span {
    display: none;
}



.btn-add-items {
    margin-top: 8px
}



.btn-close-m {
    height: 52px;
    padding: 0 52px;
    color: var(--yellow);
    font-size: 18px;
    font-weight: 600;
}

.btn-close-m:hover {
    color: var(--white);
}



input,
textarea,
select,
button {
    -webkit-appearance: none;
    box-sizing: border-box;
    font-family: "Outfit", sans-serif;
}

.modal__actions.flex {
    justify-content: flex-start !important;
    gap: 20px;
}

.project__item .icon img {
    width: 24px;
    height: 24px;
}

.project__item__n .city {
    color: #A0A0A0;
}

#seo {
    border-top: 1px solid #292929;
    margin: 60px 0 10px;
    padding: 80px 0 0;
}

/* Consistent border to prevent text shift */
input,
textarea {
    border: 1px solid transparent !important;
}

/* Global hover border for inputs and textareas */
input:hover,
textarea:hover {
    border-color: #585858 !important;
}

.user__photo svg {
    display: inline-block;
    margin-bottom: 5px;
}

.btn-back {
    border: 1px solid #414141;
    font-size: 14px;
    background: initial;
}

.btn-back:hover {
    border: 1px solid var(--yellow);
    color: var(--yellow);
    background: initial;
}

.btn-back:hover svg path {
    stroke: var(--yellow);
}

/* Image preview hover effects for listing forms */
.images__uploads .item {
    position: relative;
}

.images__uploads .item::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0);
    transition: background 0.2s ease;
    pointer-events: none;
    border-radius: 12px;
}

.images__uploads .item:hover::after {
    background: rgba(0, 0, 0, 0.5);
}

/* Don't show dark overlay on items marked for removal */
.images__uploads .item.marked-for-removal::after {
    background: rgba(0, 0, 0, 0) !important;
}

.images__uploads .item .delete-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #ffffff;
    border: none;
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    z-index: 10;
}

.images__uploads .item:hover .delete-btn {
    display: flex;
}

/* Keep delete button visible on marked items */
.images__uploads .item.marked-for-removal .delete-btn {
    display: flex;
}

.images__uploads .item .delete-btn:hover {
    background: #FF4848;
}

.images__uploads .item .delete-btn svg path {
    stroke: #111111;
    transition: stroke 0.2s ease;
}

.images__uploads .item .delete-btn:hover svg path {
    stroke: #ffffff;
}

/* Password toggle wrapper */
.password-toggle-wrapper {
    position: relative;
    display: block;
    width: 100%;
}

.password-toggle-wrapper .password-input {
    padding-right: 50px !important;
}

.password-toggle-btn {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #d9ee53;
    transition: all 0.2s ease;
    outline: none;
    z-index: 10;
}

.password-toggle-btn:hover {
    color: #c5d749;
    transform: translateY(-50%) scale(1.1);
}

.password-toggle-btn:active {
    transform: translateY(-50%) scale(0.95);
}

.password-toggle-btn svg {
    display: block;
    width: 20px;
    height: 20px;
    pointer-events: none;
}

.password-eye-icon,
.password-eye-slash-icon {
    transition: opacity 0.2s ease;
}

/* Form validation error styles */
.text-danger {
    color: #ff4444 !important;
    font-size: 14px;
    margin-top: 6px;
    display: block;
}

/* Input error border styling */
input.is-invalid,
textarea.is-invalid,
select.is-invalid {
    border-color: #ff4444 !important;
    outline-color: #ff4444 !important;
}

input.is-invalid:hover,
textarea.is-invalid:hover,
select.is-invalid:hover {
    border-color: #ff6666 !important;
    outline-color: #ff6666 !important;
}

/* Checkbox error styling */
.checkbox-error span:after {
    outline: 2px solid #ff4444 !important;
    outline-offset: 2px;
    border-radius: 4px;
}


@media (max-width: 767px) {
    .tmp_mb_h {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .tmp_mb_s {
        display: block !important;
    }
}

@media (min-width: 768px) {
    .tmp_mb_s {
        display: none !important;
    }
}

.ql-align-justify {
    text-align: justify;
}

/* Webbuilding.lv link, should not change color on hover */
.wb-link:hover {
    color: inherit !important;
}

textarea.full__height {
    height: 300px !important;
}

/* Multi-Select Dropdown Component */
.multi-select-dropdown {
    position: relative;
    width: 100%;
}

.multi-select-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 48px;
    padding: 0 16px;
    background: #232323;
    border: 1px solid #3a3a3a;
    border-radius: 8px;
    color: #fff;
    font-size: 14px;
    cursor: pointer;
    box-sizing: border-box;
    transition: border-color 0.2s;
}

.multi-select-trigger:hover {
    border-color: #555;
}

.multi-select-trigger.open {
    border-color: var(--yellow);
}

.multi-select-trigger .trigger-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}

.multi-select-trigger .trigger-arrow {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #aaa;
    margin-left: 10px;
    transition: transform 0.2s;
}

.multi-select-trigger.open .trigger-arrow {
    transform: rotate(180deg);
}

.multi-select-menu {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    width: 100%;
    max-height: 240px;
    overflow-y: auto;
    background: #232323;
    border: 1px solid #3a3a3a;
    border-radius: 8px;
    z-index: 100;
    display: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.multi-select-menu.open {
    display: block;
}

.multi-select-item {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    cursor: pointer;
    transition: background 0.15s;
}

.multi-select-item:hover {
    background: #2a2a2a;
}

.multi-select-item input[type="checkbox"] {
    display: none;
}

.multi-select-item .checkbox-box {
    width: 18px;
    height: 18px;
    border: 2px solid #555;
    border-radius: 4px;
    margin-right: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: border-color 0.15s, background 0.15s;
}

.multi-select-item:hover .checkbox-box {
    border-color: #888;
}

.multi-select-item input[type="checkbox"]:checked+.checkbox-box {
    background: var(--yellow);
    border-color: var(--yellow);
}

.multi-select-item input[type="checkbox"]:checked+.checkbox-box:after {
    content: '';
    width: 5px;
    height: 9px;
    border: solid #111;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    margin-bottom: 2px;
}

.multi-select-item .item-label {
    color: #ddd;
    font-size: 14px;
    line-height: 1.3;
}

/* Multi-select tags below dropdown */
.multi-select-tags {
    margin-top: 10px;
}

.multi-select-tags a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.multi-select-tags a svg {
    flex-shrink: 0;
}

header {
    z-index: 401;
}

/* Scroll to Top Button */
#scrollTopBtn {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    background: #D9EE53;
    color: #000;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

#scrollTopBtn.show {
    opacity: 1;
    visibility: visible;
    bottom: 40px;
}

@media (hover: hover) {
    #scrollTopBtn:hover {
        transform: translateY(-5px);
        background: #fff;
    }
}

#scrollTopBtn svg path {
    stroke: #000;
}