/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

main {
    display: block
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre {
    font-family: monospace, monospace;
    font-size: 1em
}

a {
    background-color: transparent
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted
}

b, strong {
    font-weight: bolder
}

code, kbd, samp {
    font-family: monospace, monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

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

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

img {
    border-style: none
}

button, input, optgroup, select, textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button, input {
    overflow: visible
}

button, select {
    text-transform: none
}

[type=button], [type=reset], [type=submit], button {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type=checkbox], [type=radio] {
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

summary {
    display: list-item
}

template {
    display: none
}

[hidden] {
    display: none
}

.page-content h2 {
    line-height: 26px;
    letter-spacing: 0.02em;
    color: #DCB428;
    margin: 0 0 46px;
    max-width: 850px;
    font-style: normal;
    font-weight: bold;
    font-size: 27px
}

@media screen and (max-width: 1024px) {
    .page-content h2 {
        margin-bottom: 26px
    }
}

.page-content h3 {
    font-weight: 600;
    font-size: 20px;
    line-height: 24px;
}

@media screen and (max-width: 1024px) {
    .page-content h3 {
        font-size: 20px;
        line-height: 24px
    }
}

@media screen and (max-width: 768px) {
    .page-content h3 {
        font-size: 20px;
        line-height: 24px
    }
}

@font-face {
    font-family: Gilroy;
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-ExtraBold.eot);
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-ExtraBold.eot?#iefix) format("embedded-opentype"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-ExtraBold.woff) format("woff"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-ExtraBold.ttf) format("truetype");
    font-weight: 800;
    font-display: swap;
    font-style: normal
}

@font-face {
    font-family: Gilroy;
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-LightItalic.eot);
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-LightItalic.eot?#iefix) format("embedded-opentype"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-LightItalic.woff) format("woff"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-LightItalic.ttf) format("truetype");
    font-weight: 300;
    font-display: swap;
    font-style: italic
}

@font-face {
    font-family: Gilroy;
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-BoldItalic.eot);
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-BoldItalic.eot?#iefix) format("embedded-opentype"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-BoldItalic.woff) format("woff"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-BoldItalic.ttf) format("truetype");
    font-weight: 700;
    font-display: swap;
    font-style: italic
}

@font-face {
    font-family: Gilroy;
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-SemiBold.eot);
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-SemiBold.eot?#iefix) format("embedded-opentype"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-SemiBold.woff) format("woff"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-SemiBold.ttf) format("truetype");
    font-weight: 600;
    font-display: swap;
    font-style: normal
}

@font-face {
    font-family: Gilroy;
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-UltraLightItalic.eot);
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-UltraLightItalic.eot?#iefix) format("embedded-opentype"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-UltraLightItalic.woff) format("woff"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-UltraLightItalic.ttf) format("truetype");
    font-weight: 200;
    font-display: swap;
    font-style: italic
}

@font-face {
    font-family: Gilroy;
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-SemiBoldItalic.eot);
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-SemiBoldItalic.eot?#iefix) format("embedded-opentype"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-SemiBoldItalic.woff) format("woff"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-SemiBoldItalic.ttf) format("truetype");
    font-weight: 600;
    font-display: swap;
    font-style: italic
}

@font-face {
    font-family: Gilroy;
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Light.eot);
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Light.eot?#iefix) format("embedded-opentype"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Light.woff) format("woff"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Light.ttf) format("truetype");
    font-weight: 300;
    font-display: swap;
    font-style: normal
}

@font-face {
    font-family: Gilroy;
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-MediumItalic.eot);
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-MediumItalic.eot?#iefix) format("embedded-opentype"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-MediumItalic.woff) format("woff"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-MediumItalic.ttf) format("truetype");
    font-weight: 500;
    font-display: swap;
    font-style: italic
}

@font-face {
    font-family: Gilroy;
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Regular.eot);
    src: local("https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy Regular"), local("https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Regular"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Regular.eot?#iefix) format("embedded-opentype"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Regular.woff) format("woff"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Regular.ttf) format("truetype");
    font-weight: 400;
    font-display: swap;
    font-style: normal
}

@font-face {
    font-family: Gilroy;
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Medium.eot);
    src: local("https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy Medium"), local("https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Medium"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Medium.eot?#iefix) format("embedded-opentype"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Medium.woff) format("woff"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Medium.ttf) format("truetype");
    font-weight: 500;
    font-display: swap;
    font-style: normal
}

@font-face {
    font-family: Gilroy;
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Bold.eot);
    src: local("https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy Bold"), local("https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Bold"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Bold.eot?#iefix) format("embedded-opentype"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Bold.woff) format("woff"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Bold.ttf) format("truetype");
    font-weight: 700;
    font-display: swap;
    font-style: normal
}

@font-face {
    font-family: Gilroy;
    src: url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Black.eot);
    src: local("https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy Black"), local("https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Black"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Black.eot?#iefix) format("embedded-opentype"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Black.woff) format("woff"), url(https://pg-branding.pl/wp-content/themes/pg/fonts/Gilroy-Black.ttf) format("truetype");
    font-weight: 900;
    font-display: swap;
    font-style: normal
}

[v-cloak] {
    display: none
}

html {
    --opacity: 0.75;
    padding-bottom: 365px;
    overflow-x: hidden
}

@media screen and (max-width: 1024px) {
    html {
        padding-bottom: 355px
    }
}

@media screen and (max-width: 768px) {
    html {
        padding-bottom: 520px
    }
}

#app {
    background: #fff
}

.main-bg {
    background: #fff;
    position: relative;
    z-index: 2
}

body, html {
    font-family: Gilroy, sans-serif;
    background: #fff;
    background: #DCB428
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100px, 0);
        transform: translate3d(0, 100px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

.accordion-enter-active, .accordion-leave-active {
    transition: opacity .5s;
}

.accordion-enter, .accordion-leave-to /* .fade-leave-active below version 2.1.8 */
{
    opacity: 0;
}

.animate {
    opacity: 0;
    animation-duration: .8s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.animate.fancy {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}

.hamburger {
    display: inline-block;
    cursor: pointer;
    transition-property: opacity, filter;
    transition-duration: .15s;
    transition-timing-function: linear;
    overflow: visible;
    color: #fff
}

.hamburger:hover {
    opacity: .7
}

.hamburger-box {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 24px
}

.hamburger-inner {
    position: absolute;
    width: 24px;
    height: 3px;
    transition-timing-function: ease;
    transition-duration: .15s;
    transition-property: transform;
    background-color: currentColor;
    transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger-inner:after, .hamburger-inner:before {
    position: absolute;
    width: 24px;
    height: 3px;
    transition-timing-function: ease;
    transition-duration: .15s;
    transition-property: transform;
    background-color: currentColor;
    display: block;
    content: "";
    transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.is-active .hamburger-inner {
    transform: rotateX(-180deg);
    background-color: transparent !important
}

.hamburger-inner:before {
    top: -7px
}

.is-active .hamburger-inner:before {
    transform: translate3d(0, 7px, 0) rotate(45deg)
}

.hamburger-inner:after {
    bottom: -7px
}

.is-active .hamburger-inner:after {
    transform: translate3d(0, -7px, 0) rotate(-45deg)
}

.container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 25px;
    box-sizing: border-box
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .container {
        padding: 0 42px
    }
}

.btn {
    border: none;
    margin: 0;
    overflow: visible;
    background: 0 0;
    color: inherit;
    font: inherit;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
    text-decoration: none;
    outline: 0;
    font-size: 15px;
    line-height: 18px;
    letter-spacing: .12em;
    text-transform: uppercase;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    padding: 11px 20px;
    max-width: 240px;
    width: 100%;
    text-align: center;
    transition: background-color ease-in-out .2s, color ease-in-out .2s;
    cursor: pointer;
    font-family: Gilroy, sans-serif;
    font-weight: 700;
    min-width: 240px
}

.btn::-moz-focus-inner {
    border: 0;
    padding: 0
}

.btn.arrow {
    color: #fff;
    position: relative;
    min-width: auto;
    max-width: 220px;
    text-align: left;
    padding: 11px 30px 11px 0;
    letter-spacing: .05em;
    opacity: .75
}

.btn.arrow:after {
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto 0;
    content: "";
    position: absolute;
    height: 15px;
    width: 26px;
    background: url(../img/arrow.svg) center center no-repeat;
    transition: all ease-in-out .3s;
    opacity: .5
}

.btn.arrow:hover:after {
    transform: translateY(10px);
    opacity: 1
}

.btn.blue-border {
    border: 2px solid #DCB428;
    color: #DCB428
}

.btn.blue-border:hover {
    color: #fff;
    background: #DCB428
}

.btn.white-border {
    border: 2px solid #fff;
    color: #fff
}

.btn.white-border:hover {
    color: #DCB428;
    background: #fff
}

.btn.blue {
    background: #DCB428;
    color: #fff;
    padding: 13px 20px
}

.btn.blue:hover {
    color: #fff;
    background-color: #000
}

.btn.white {
    background: rgba(255, 255, 255, .85);
    color: #DCB428;
    padding: 13px 20px
}

.btn.white:hover {
    color: #DCB428;
    background-color: #fff
}

.link-underline {
    position: relative;
    text-decoration: none;
    letter-spacing: .04em;
    text-transform: uppercase;
    font-size: 15px;
    line-height: 18px;
    font-weight: 800;
    padding-right: 25px
}

.link-underline:after {
    content: "";
    width: 11px;
    height: 20px;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    transition: opacity ease-in-out .2s;
    opacity: .25
}

.link-underline:hover:after {
    opacity: 1
}

.link-underline.blue {
    color: #DCB428
}

.link-underline.blue:after {
    background: url(../img/link-arrow-blue.svg) center center no-repeat
}

.link-underline.white {
    color: #fff
}

.link-underline.white:after {
    background: url(../img/link-arrow-white.svg) center center no-repeat
}

.link-underline.black {
    color: #000
}

.link-underline.black:after {
    background: url(../img/link-arrow-black.svg) center center no-repeat
}

.fade-enter-active, .fade-leave-active {
    transition: opacity .5s
}

.fade-enter, .fade-leave-to {
    opacity: 0
}

.center {
    text-align: center;
    padding: 65px 0
}

.projects-enter {
    transform: scale(.5) translateY(-80px);
    opacity: 0
}

.projects-leave-to {
    transform: translateY(30px);
    opacity: 0
}

.projects-leave-active {
    position: absolute;
    z-index: -1
}

.scroll-down {
    border: none;
    margin: 0;
    padding: 0;
    width: auto;
    overflow: visible;
    background: 0 0;
    color: inherit;
    font: inherit;
    line-height: normal;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
    text-align: inherit;
    outline: 0;
    right: 0;
    left: 0;
    bottom: 70px;
    margin: auto;
    z-index: 1;
    content: "";
    position: absolute;
    height: 40px;
    width: 30px;
    background: url(../img/arrow.svg) center center no-repeat;
    transition: transform ease-in-out .3s;
    cursor: pointer;
    font-size: 0;
    opacity: .5
}

.scroll-down::-moz-focus-inner {
    border: 0;
    padding: 0
}

.scroll-down:hover {
    transform: translateY(5px);
    opacity: 1
}

.cookie-popup {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: #000;
    min-height: 50px;
    box-sizing: border-box;
    padding: 10px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    z-index: 3
}

.cookie-popup .container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%
}

@media screen and (max-width: 768px) {
    .cookie-popup .container {
        flex-direction: column;
        align-items: flex-end
    }
}

.cookie-popup p {
    color: #fff;
    font-weight: 300;
    font-size: 14px;
    line-height: 16px;
    margin: 0
}

.cookie-popup .save-cookie {
    border: none;
    margin: 0;
    padding: 0;
    overflow: visible;
    background: 0 0;
    color: inherit;
    font: inherit;
    line-height: normal;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
    cursor: pointer;
    transition: opacity ease-in-out .2s;
    opacity: .5;
    color: #fff
}

.cookie-popup .save-cookie:hover {
    opacity: 1
}

.header {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 3;
    padding: 0 15px;
    transition: background-color ease-in-out .2s
}

.header.fixed {
    position: fixed;
    background: #fff
}

.header.fixed .header__logo svg path {
    fill: #DCB428
}

.header.fixed .hamburger {
    color: #DCB428
}

.header.fixed .hamburger.is-active {
    color: #fff
}

.header.fixed .white-border {
    border: 2px solid #DCB428;
    color: #DCB428
}

.header.fixed .white-border:hover {
    color: #fff;
    background: #DCB428
}

@media screen and (max-width: 768px) {
    .header {
        padding: 0 24px
    }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .header {
        padding: 0 42px
    }
}

.header .container {
    max-width: 100%;
    padding: 8px 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    align-content: center
}

@media screen and (max-width: 768px) {
    .header .container {
        padding: 8px 0
    }
}

.header__right {
    display: flex;
    flex-direction: row;
    align-items: center
}

.header__menu {
    cursor: pointer;
    border: none;
    margin: 0;
    padding: 0;
    width: auto;
    overflow: visible;
    background: 0 0;
    color: inherit;
    font: inherit;
    line-height: normal;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
    text-align: inherit;
    outline: 0;
    margin-left: 24px;
    margin-right: 33px;
    height: 20px;
    width: 24px;
    color: #fff;
    z-index: 2
}

.header__menu::-moz-focus-inner {
    border: 0;
    padding: 0
}

@media screen and (max-width: 768px) {
    .header__menu {
        margin-right: 0
    }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .header__menu {
        margin-right: 0
    }
}

.header .not-visible {
    opacity: 0
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .header__contact {
        display: none
    }
}

@media screen and (max-width: 768px) {
    .header__contact {
        display: none
    }
}

@media (hover: none) and (pointer: coarse) {
    .header__contact {
        display: none
    }
}

.header__logo {
    font-size: 0;
    line-height: 0
}
.header__logo svg {
    width: 100%;
    max-width: 74px;
    height: auto;
}

@media screen and (max-width: 1024px) {
    .header__logo {
        max-width: 74px
    }
}

@media screen and (max-width: 768px) {
    .header__logo {
        max-width: 74px
    }
}

.tns-outer {
    padding: 0 !important
}

.tns-outer [hidden] {
    display: none !important
}

.tns-outer [aria-controls], .tns-outer [data-action] {
    cursor: pointer
}

.tns-outer [data-action="start"] {
    display: none;
}

.tns-slider {
    -webkit-transition: all 0s;
    -moz-transition: all 0s;
    transition: all 0s
}

.tns-slider > .tns-item {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.tns-horizontal.tns-subpixel {
    white-space: nowrap
}

.tns-horizontal.tns-subpixel > .tns-item {
    display: inline-block;
    vertical-align: top;
    white-space: normal
}

.tns-horizontal.tns-no-subpixel:after {
    content: '';
    display: table;
    clear: both
}

.tns-horizontal.tns-no-subpixel > .tns-item {
    float: left
}

.tns-horizontal.tns-carousel.tns-no-subpixel > .tns-item {
    margin-right: -100%
}

.tns-no-calc {
    position: relative;
    left: 0
}

.tns-gallery {
    position: relative;
    left: 0;
    min-height: 1px
}

.tns-gallery > .tns-item {
    position: absolute;
    left: -100%;
    -webkit-transition: transform 0s, opacity 0s;
    -moz-transition: transform 0s, opacity 0s;
    transition: transform 0s, opacity 0s
}

.tns-gallery > .tns-slide-active {
    position: relative;
    left: auto !important
}

.tns-gallery > .tns-moving {
    -webkit-transition: all .25s;
    -moz-transition: all .25s;
    transition: all .25s
}

.tns-autowidth {
    display: inline-block
}

.tns-lazy-img {
    -webkit-transition: opacity .6s;
    -moz-transition: opacity .6s;
    transition: opacity .6s;
    opacity: .6
}

.tns-lazy-img.tns-complete {
    opacity: 1
}

.tns-ah {
    -webkit-transition: height 0s;
    -moz-transition: height 0s;
    transition: height 0s
}

.tns-ovh {
    overflow: hidden
}

.tns-visually-hidden {
    position: absolute;
    left: -10000em
}

.tns-transparent {
    opacity: 0;
    visibility: hidden
}

.tns-fadeIn {
    opacity: 1;
    z-index: 0
}

.tns-fadeOut, .tns-normal {
    opacity: 0;
    z-index: -1
}

.tns-vpfix {
    white-space: nowrap
}

.tns-vpfix > div, .tns-vpfix > li {
    display: inline-block
}

.tns-t-subp2 {
    margin: 0 auto;
    width: 310px;
    position: relative;
    height: 10px;
    overflow: hidden
}

.tns-t-ct {
    width: 2333.3333333%;
    width: -webkit-calc(100% * 70 / 3);
    width: -moz-calc(100% * 70 / 3);
    width: calc(100% * 70 / 3);
    position: absolute;
    right: 0
}

.tns-t-ct:after {
    content: '';
    display: table;
    clear: both
}

.tns-t-ct > div {
    width: 1.4285714%;
    width: -webkit-calc(100% / 70);
    width: -moz-calc(100% / 70);
    width: calc(100% / 70);
    height: 10px;
    float: left
}

.footer {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: #f6f6f6;
    z-index: 0;
    padding-top: 60px;
    opacity: 0
}

.footer.visible {
    opacity: 1
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .footer {
        padding-top: 45px
    }
}

@media screen and (max-width: 768px) {
    .footer {
        padding-top: 40px
    }
}

.footer__logo {
    font-size: 0;
    line-height: 0
}

.footer__logo img {
    width: 100%;
    max-width: 287px;
    height: auto;
}

@media screen and (max-width: 768px) {
    .footer__logo {
        display: none
    }
}

.footer__content {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 0;
    gap: 0 100px;
}

.footer__content-right {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 40px;
}

@media screen and (max-width: 1024px) {
    .footer__content-right {
        padding-right: 0
    }
}

@media screen and (max-width: 768px) {
    .footer__menu {
        display: none
    }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .footer__menu {
        display: none
    }
}

.footer__menu ul {
    margin: 0;
    padding: 0
}

.footer__menu ul li {
    list-style: none;
    margin-bottom: 8px;
}

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

.footer__menu ul a {
    color: #000;
    text-decoration: none;
    transition: color ease-in-out .2s;
    font-style: normal;
    font-weight: 100;
    font-size: 14px;
}

.footer .column-menu {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 24px;
}

.footer__menu ul a:hover {
    color: #DCB428
}

.footer__contact {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    font-weight: 100
}

@media screen and (max-width: 1024px) {
    .footer__contact {
        margin-right: 0
    }
}

.footer__contact h3 {
    margin-bottom: 25px
}

.footer__contact__wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    max-width: none;
    width: auto;
}

@media screen and (max-width: 768px) {
    .footer__contact__wrapper {
        flex-direction: column
    }
}

.footer__contact__item {
    max-width: 170px;
    margin-bottom: 18px
}

.footer .seo-text-footer {
    font-style: normal;
    font-weight: 100;
    font-size: 14px;
    line-height: 120%;
    letter-spacing: 0.005em;
    color: #000000;
    margin-top: 20px;
    max-width: 250px;
}

@media screen and (min-width: 1280px) {
    .footer .seo-text-footer {
        max-width: 360px;
    }
}

.footer__contact h4 {
    font-size: 12px;
    line-height: 14px;
    letter-spacing: .04em;
    color: #000;
    margin: 0 0 10px
}

.footer__contact p {
    margin: 0;
    font-size: 12px;
    line-height: 20px;
    letter-spacing: .02em;
    color: #000
}

.footer__contact ul {
    margin: 0 0 20px;
    padding: 0
}

.footer__contact ul li {
    list-style: none;
    margin-bottom: -4px
}

.footer__contact a {
    font-size: 14px;
    letter-spacing: .02em;
    color: #000;
    text-decoration: none;
    transition: color ease-in-out .2s
}

.footer__contact a:hover {
    color: #DCB428
}

.footer h3 {
    line-height: 26px;
    letter-spacing: .02em;
    margin: 0 0 21px;
    color: #000;
    font-style: normal;
    font-weight: 700;
    font-size: 24px
}

.footer__copy {
    font-size: 15px;
    color: #000;
    font-weight: 700;
    line-height: 1.1
}

@media screen and (max-width: 768px) {
    .footer__copy {
        order: 2;
        line-height: 15px;
        font-size: 15px
    }
}

.footer__copy span {
    font-weight: 100
}

@media screen and (max-width: 768px) {
    .footer__links {
        order: 1;
        margin-bottom: 45px
    }
}

.footer__text {
    padding: 30px 0 36px 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center
}

@media screen and (max-width: 768px) {
    .footer__text {
        flex-direction: column;
        align-items: flex-start;
        padding: 27px 0
    }
}

.footer__text__link {
    font-size: 0;
    line-height: 0;
    margin-left: 17px
}

.footer__text__link:first-child {
    margin-left: 0
}

.footer__text__link .icon {
    transition: fill ease-in-out .2s
}

.footer__text__link:hover .icon {
    fill: #DCB428
}

.menu {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(255, 255, 255, .9);
    height: 100vh;
    overflow: hidden;
    z-index: 1
}

@media screen and (max-width: 768px) {
    .menu {
        padding-left: 25px
    }
}

.menu-wrap {
    background: #DCB428;
    height: 100%;
    float: right;
    display: flex;
    flex-direction: column;
    min-width: 50%;
    max-width: 50%
}

@media screen and (max-width: 768px) {
    .menu-wrap {
        float: none;
        max-width: none
    }
}

@media only screen and (max-width: 768px) and (min-aspect-ratio: 13 / 9) {
    .menu-wrap {
        justify-content: center
    }
}

@media screen and (max-height: 520px) and (hover: hover) {
    .menu-wrap {
        justify-content: center
    }
}

.menu-list {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    padding: 0 115px
}

@media screen and (max-width: 1024px) {
    .menu-list {
        padding: 0 80px
    }
}

@media screen and (max-width: 768px) {
    .menu-list {
        padding: 0 40px
    }
}

@media only screen and (max-width: 768px) and (min-aspect-ratio: 13 / 9) {
    .menu-list {
        flex: initial;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-bottom: 60px
    }
}

@media screen and (max-height: 520px) and (hover: hover) {
    .menu-list {
        flex: initial;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-bottom: 60px;
        padding: 0 50px
    }
}

.menu-list li {
    list-style: none;
    margin-bottom: 6px
}

.menu-list li:last-child {
    margin-bottom: 0
}

.menu-list li.active {
    opacity: .6
}

@media screen and (max-width: 1024px) {
    .menu-list li {
        margin-bottom: 20px
    }
}

@media screen and (max-width: 768px) {
    .menu-list li {
        margin-bottom: 15px
    }
}

@media only screen and (max-width: 768px) and (min-aspect-ratio: 13 / 9) {
    .menu-list li {
        width: 48%
    }
}

@media screen and (max-height: 520px) {
    .menu-list li {
        width: 48%
    }
}

.menu-list a {
    font-size: 42px;
    line-height: 60px;
    letter-spacing: .02em;
    text-transform: uppercase;
    font-weight: 800;
    text-decoration: none;
    color: #fff;
    transition: opacity ease-in-out .3s
}

.menu-list a:hover {
    opacity: .6
}

@media screen and (max-width: 1024px) {
    .menu-list a {
        font-size: 32px;
        line-height: 29px;
        letter-spacing: .02em
    }
}

@media screen and (max-width: 768px) {
    .menu-list a {
        font-size: 20px;
        line-height: 29px;
        letter-spacing: .03em
    }
}

.menu-copy {
    padding: 0 115px 20px;
    font-size: 15px;
    line-height: 18px;
    color: #fff;
    font-weight: 600
}

.menu-copy span {
    font-weight: 400
}

@media screen and (max-width: 1024px) {
    .menu-copy {
        padding: 0 80px 60px
    }
}

@media screen and (max-width: 768px) {
    .menu-copy {
        padding: 0 10px 30px 40px
    }
}

@media screen and (max-height: 520px) and (hover: hover) {
    .menu-copy {
        padding-left: 50px;
        padding-right: 50px
    }
}

.home-screen {
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    width: 100%;
    position: relative;
    color: #DCB428
}

.home-screen .background {
    height: 100vh;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 0
}

@media screen and (max-width: 768px) {
    .home-screen .background {
        background-position: right -260px center !important;
        bottom: -69px
    }
}

@media only screen and (max-width: 768px) and (max-width: 768px) and (min-aspect-ratio: 13 / 9) {
    .home-screen .background {
        background-position: center center !important
    }
}

.home-screen .container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    position: relative;
    z-index: 1
}

.home-screen:before {
    content: "";
    display: block;
    background: currentColor;
    opacity: var(--opacity);
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    transition: opacity linear 0s;
    z-index: 1
}

.home-screen_arrow.btn {
    position: absolute;
    bottom: 70px;
    font-size: 0;
    width: 26px;
    left: 0;
    right: 0;
    margin: auto
}

@media screen and (max-width: 1024px) {
    .home-screen_arrow.btn {
        bottom: 35px;
        right: 42px
    }
}

@media screen and (max-width: 768px) {
    .home-screen_arrow.btn {
        bottom: 18px;
        display: none
    }
}

.home-screen__title {
    font-family: Gilroy, sans-serif;
    font-size: 60px;
    line-height: 100%;
    color: #fff;
    margin: 0 0 65px;
    font-weight: 800
}

.home-screen__title * {
    margin: 0
}

@media screen and (max-width: 1024px) {
    .home-screen__title {
        font-size: 36px;
        line-height: 38px;
        font-weight: 700
    }
}

@media screen and (max-width: 768px) {
    .home-screen__title {
        font-size: 30px;
        line-height: 38px;
        margin-bottom: 40px;
        min-height: 230px
    }
}

@media only screen and (max-width: 768px) and (max-width: 768px) and (min-aspect-ratio: 13 / 9) {
    .home-screen__title {
        min-height: 150px
    }
}

.home-screen__title.bottom {
    font-size: 72px;
    letter-spacing: .02em;
    margin: 0;
    position: absolute;
    bottom: 68px;
    font-style: normal;
    font-weight: 700;
    line-height: 56px
}

@media screen and (max-width: 1024px) {
    .home-screen__title.bottom {
        font-size: 54px;
        line-height: 56px;
        bottom: 40px
    }
}

@media screen and (max-width: 768px) {
    .home-screen__title.bottom {
        font-size: 39px;
        line-height: 39px;
        bottom: 22px;
        right: 25px;
        left: 25px
    }
}

.hp-files {
    position: relative;
    z-index: 2;
    background: #fff;
}

.hp-files .container {
    padding-top: 40px;
    padding-bottom: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-files .container {
        min-height: auto;
        padding-top: 90px;
        padding-bottom: 108px
    }
}

@media screen and (max-width: 768px) {
    .hp-files .container {
        min-height: auto;
        padding-top: 107px;
        padding-bottom: 97px
    }
}

.hp-files h2 {
    font-family: Gilroy, sans-serif;
    font-size: 36px;
    line-height: 36px;
    letter-spacing: .03em;
    font-feature-settings: 'ordn' on;
    color: #000;
    max-width: 1064px;
    font-weight: 700
}

@media screen and (max-width: 1024px) {
    .hp-files h2 {
        font-size: 33px;
        line-height: 35px;
    }
}

@media screen and (max-width: 768px) {
    .hp-files h2 {
        font-size: 30px;
        line-height: 30px;
    }
}

.hp-files .buttons {
    font-size: 0;
    line-height: 0;
    display: flex;
    flex-direction: row;
    align-items: center
}

.hp-files .buttons .btn:nth-child(2) {
    margin-left: 12px
}

.hp-files .buttons .link-underline:nth-child(2) {
    margin-left: 24px
}

@media screen and (max-width: 768px) {
    .hp-files .buttons .btn:nth-child(2) {
        margin-left: 0;
        margin-top: 10px
    }

    .hp-files .buttons .link-underline:nth-child(2) {
        margin-left: 0;
        margin-top: 10px
    }
}

@media screen and (max-width: 768px) {
    .hp-files .buttons {
        display: flex;
        flex-direction: column;
        gap: 40px;
        align-items: flex-start;
    }
}

.hp-projects {
    padding-top: 90px;
    background: #f6f6f6;
    padding-bottom: 90px;
    position: relative;
    z-index: 2
}

.hp-projects .text {
    background: 0 0;
    padding: 0
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-projects {
        padding-top: 70px;
        padding-bottom: 30px
    }
}

@media screen and (max-width: 768px) {
    .hp-projects {
        padding-top: 38px;
        padding-bottom: 29px
    }
}

.hp-projects .center {
    text-align: center;
    padding: 65px 0
}

.hp-projects .center a {
    font-weight: 800
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-projects .center {
        padding: 48px 0
    }
}

@media screen and (max-width: 768px) {
    .hp-projects .center {
        padding: 48px 0
    }
}
.custom-h2{display:block;}
.custom-h2, .hp-projects h2 {
    font-size: 42px;
    line-height: 36px;
    letter-spacing: .03em;
    font-feature-settings: 'ordn' on;
    margin-bottom: 37px;
    margin-top: 0;
    font-weight: 800
}
.hp-projects .title2 p {
    font-size: 42px;
    line-height: 36px;
    letter-spacing: .03em;
    font-feature-settings: 'ordn' on;
    margin-bottom: 37px;
    margin-top: 0;
    font-weight: 800
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .custom-h2, .hp-projects h2 {
        margin-bottom: 24px
    }
    .hp-projects .title2 p {
        margin-bottom: 24px
    }
}

@media screen and (max-width: 768px) {
    .custom-h2, .hp-projects h2 {
        font-size: 30px;
        line-height: 30px;
        margin-bottom: 23px
    }
    .hp-projects .title2 p {
        font-size: 30px;
        line-height: 30px;
        margin-bottom: 23px
    }
}

.hp-projects .text-pr {
    margin: 0 0 105px
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-projects .text-pr {
        margin-bottom: 57px
    }
}

@media screen and (max-width: 768px) {
    .hp-projects .text-pr {
        margin-bottom: 28px
    }
}

.hp-projects p {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .03em;
    max-width: 1065px;
    font-weight: 300
}

@media screen and (max-width: 768px) {
    .hp-projects p {
        font-size: 20px;
        line-height: 23px;
        margin-bottom: 28px
    }
}

.projects {
    padding: 0 16px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    overflow: hidden
}

@media screen and (max-width: 768px) {
    .projects {
        padding: 5px 6px
    }
}

.projects .item-description {
    position: absolute;
    left: 30px;
    right: 30px;
    bottom: 35px
}

.projects .item-description .work {
    display: block;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-style: normal;
    font-weight: 300;
    font-size: 15px;
    line-height: 17px;
    letter-spacing: .02em
}

.projects .item-description .name {
    display: block;
    font-style: normal;
    font-weight: 700;
    font-size: 30px;
    line-height: 26px;
    letter-spacing: .03em;
    text-transform: uppercase
}

.projects .item_link {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    color: #fff;
    text-decoration: none;
    background-color: rgba(254, 209, 46, .9);
    opacity: 0;
    transition: opacity ease-in-out .3s
}

.projects .item_link:after {
    content: "";
    display: block;
    position: absolute;
    right: 30px;
    top: 30px;
    background-image: url(../img/link_arrow.svg);
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    width: 32px
}

@media screen and (max-width: 768px) {
    .projects .item_link:after {
        top: 20px;
        right: 20px;
        height: 37px;
        width: 37px;
        background-size: contain
    }
}

.projects .item_link.green {
    background-color: rgba(0, 211, 196, .9)
}

.projects .item_link:hover {
    opacity: 1
}

.item {
    position: relative
}

.item.big {
    width: 50%
}

.item.big:after {
    content: "";
    display: block;
    padding-bottom: 80%
}

@media screen and (max-width: 1024px) {
    .item.big {
        width: 100%
    }
}

@media screen and (max-width: 768px) {
    .item.big {
        width: 100%
    }
}

.item.sm {
    width: 25%
}

.item.sm:nth-child(4), .item.sm:nth-child(5) {
    margin-top: -20%
}

@media screen and (max-width: 1024px) {
    .item.sm:nth-child(4), .item.sm:nth-child(5) {
        margin-top: 0
    }
}

@media screen and (max-width: 768px) {
    .item.sm:nth-child(4), .item.sm:nth-child(5) {
        margin-top: 0
    }
}

.item.sm:nth-child(1) .item-content, .item.sm:nth-child(4) .item-content {
    right: 6px
}

.item.sm:nth-child(2) .item-content, .item.sm:nth-child(5) .item-content {
    left: 6px
}

.item.sm:nth-child(4) .item-content, .item.sm:nth-child(5) .item-content {
    top: 6px
}

.item.sm:nth-child(1) .item-content, .item.sm:nth-child(2) .item-content {
    bottom: 6px
}

.item.sm:after {
    content: "";
    display: block;
    padding-bottom: 80%
}

@media screen and (max-width: 1024px) {
    .item.sm {
        width: 50%
    }
}

@media screen and (max-width: 768px) {
    .item.sm {
        width: 100%
    }

    .item.sm:nth-child(n) .item-content {
        left: 0;
        right: 0;
        top: 3px;
        bottom: 3px
    }
}

.item-content {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0
}

.big .item-content {
    left: 12px
}

@media screen and (max-width: 1024px) {
    .big .item-content {
        left: 0;
        top: 6px;
        bottom: 6px
    }
}

@media screen and (max-width: 768px) {
    .big .item-content {
        width: 100%
    }
}

.item-content img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center
}

.hp-services {
    background: #DCB428;
    padding-top: 90px;
    padding-bottom: 127px;
    position: relative;
    z-index: 2
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-services {
        padding-top: 70px;
        padding-bottom: 80px
    }
}

@media screen and (max-width: 768px) {
    .hp-services {
        padding-top: 38px;
        padding-bottom: 78px
    }
}

.hp-services h2 {
    font-size: 42px;
    line-height: 35px;
    letter-spacing: .02em;
    font-feature-settings: 'ordn' on;
    margin-bottom: 40px;
    margin-top: 0;
    color: #fff;
    font-style: normal;
    font-weight: 700;
    font-weight: 800
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-services h2 {
        margin-bottom: 22px
    }
}

@media screen and (max-width: 768px) {
    .hp-services h2 {
        font-size: 30px;
        line-height: 30px;
        margin-bottom: 40px
    }
}

.hp-services p {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    max-width: 1065px;
    margin: 0 0 105px;
    color: #fff;
    font-weight: 300
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-services p {
        margin-bottom: 42px
    }
}

@media screen and (max-width: 768px) {
    .hp-services p {
        font-size: 20px;
        line-height: 23px;
        margin-bottom: 50px
    }
}

.hp-services .center {
    margin-bottom: 105px
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-services .center {
        padding-top: 48px;
        margin-bottom: 11px
    }
}

@media screen and (max-width: 768px) {
    .hp-services .center {
        padding: 54px 0;
        margin-bottom: 53px
    }
}

.hp-services .services {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 0;
    background: 0 0
}

.hp-services .services__promo {
    font-size: 36px;
    line-height: 45px;
    letter-spacing: .02em;
    font-feature-settings: 'ordn' on;
    margin-bottom: 47px;
    font-style: normal;
    font-weight: 700
}

.hp-services .services__promo h2 {
    line-height: 45px
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-services .services__promo {
        font-size: 21px;
        line-height: 23px;
        letter-spacing: .03em;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 768px) {
    .hp-services .services__promo {
        font-size: 24px;
        line-height: 26px;
        letter-spacing: .02em;
        margin-bottom: 14px
    }
}

@media screen and (max-width: 768px) {
    .hp-services .services {
        overflow-x: auto
    }
}

.hp-services .services-item {
    width: calc(100% / 3 - 8px);
    border: 3px solid #fff;
    box-sizing: border-box
}

@media screen and (max-width: 768px) {
    .hp-services .services-item {
        width: 244px;
        min-width: 244px;
        max-width: 244px;
        margin-left: 12px;
        animation-delay: 0s !important
    }

    .hp-services .services-item + .animate {
        animation-name: fadeInUp
    }

    .hp-services .services-item:first-child {
        margin-left: 0
    }
}

.hp-services .services-item:after {
    content: "";
    display: block;
    padding-bottom: 100%
}

.hp-services .services-item__link {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    text-decoration: none;
    z-index: 1;
    color: #fff;
    transition: all ease-in-out .2s
}

.hp-services .services-item__link:hover {
    background: #fff;
    color: #DCB428
}

.hp-services .services-item__link:hover .services-item__icon {
    opacity: 0
}

.hp-services .services-item__link:hover .services-item__text {
    opacity: 1
}

.hp-services .services-item__text {
    color: #DCB428;
    font-size: 16px;
    line-height: 18px;
    display: block;
    letter-spacing: .02em;
    padding: 0 36px;
    opacity: 0;
    transition: opacity ease-in-out .2s;
    font-weight: 300
}

.hp-services .services-item__text p {
    font-size: inherit;
    color: currentColor;
    margin: 0
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-services .services-item__text {
        display: none
    }
}

@media screen and (max-width: 768px) {
    .hp-services .services-item__text {
        display: none
    }
}

.hp-services .services-item__name {
    display: block;
    padding: 36px 36px 0;
    font-size: 24px;
    line-height: 26px;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: currentColor;
    margin-bottom: 25px;
    font-style: normal;
    font-weight: 700
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-services .services-item__name {
        font-size: 18px;
        line-height: 20px;
        letter-spacing: .04em
    }
}

@media screen and (max-width: 768px) {
    .hp-services .services-item__name {
        font-size: 18px;
        line-height: 22px;
        letter-spacing: .04em;
        padding: 21px 21px 0
    }
}

.hp-services .services-item__icon {
    display: block;
    position: absolute;
    left: 36px;
    bottom: 36px;
    opacity: 1;
    transition: opacity ease-in-out .2s;
    line-height: 0
}

.hp-services .services-item__icon img {
    width: 100%;
    height: auto
}

@media screen and (max-width: 768px) {
    .hp-services .services-item__icon {
        left: 21px;
        bottom: 21px;
        max-width: 44px
    }
}

.hp-awwards {
    padding: 12px;
    position: relative;
    background: #fff;
    z-index: 2
}

.hp-awwards .hp-awards-wrap {
    background: #f6f6f6;
    padding: 85px 0 80px
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-awwards {
        padding-top: 70px
    }
}

@media screen and (max-width: 768px) {
    .hp-awwards {
        padding-top: 37px;
        padding-bottom: 0
    }
}

.hp-awwards h2 {
    font-size: 42px;
    line-height: 36px;
    letter-spacing: .02em;
    font-feature-settings: 'ordn' on;
    color: #000;
    margin: 0 0 75px;
    font-style: normal;
    font-weight: 800
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-awwards h2 {
        margin-bottom: 42px
    }
}

@media screen and (max-width: 768px) {
    .hp-awwards h2 {
        font-size: 30px;
        line-height: 30px;
        letter-spacing: .02em;
        margin-bottom: 10px
    }
}

.hp-awwards button {
    display: none
}

.hp-awwards .awards__list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between
}

@supports (display:grid) {
    .hp-awwards .awards__list {
        display: grid;
        grid-template-columns:repeat(4, 1fr);
        gap: 12px;
        justify-content: center
    }

    @media screen and (max-width: 768px) {
        .hp-awwards .awards__list {
            grid-template-columns:repeat(2, 1fr)
        }
    }
}

.hp-awwards .awards__item {
    width: calc(100% / 4 - 36 / 4);
    margin-bottom: 12px
}

@media screen and (max-width: 768px) {
    .hp-awwards .awards__item {
        width: calc(100% / 2 - 24 / 2)
    }
}

.hp-awwards .awards__item img {
    max-width: 100%;
    height: auto
}

@supports (display:grid) {
    .hp-awwards .awards__item {
        width: 100%;
        margin-bottom: 0
    }
}

.hp-awwards .white {
    color: #000
}

.hp-awwards .center {
    padding: 45px 0
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-awwards .center {
        padding: 15px 0
    }
}

@media screen and (max-width: 768px) {
    .hp-awwards .center {
        padding: 101px 0 73px
    }
}

.hp-photo {
    padding: 108px 0 84px;
    position: relative;
    z-index: 2;
    background: #fff
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-photo {
        padding-top: 70px
    }
}

@media screen and (max-width: 768px) {
    .hp-photo {
        padding-top: 80px
    }
}

.hp-photo h2 {
    font-size: 42px;
    line-height: 36px;
    letter-spacing: .02em;
    font-feature-settings: 'ordn' on;
    margin-bottom: 40px;
    margin-top: 0;
    font-style: normal;
    font-weight: 800
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-photo h2 {
        margin-bottom: 21px
    }
}

@media screen and (max-width: 768px) {
    .hp-photo h2 {
        font-size: 30px;
        line-height: 30px;
        margin-bottom: 25px
    }
}

.hp-photo p {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    max-width: 1065px;
    margin: 0 0 105px;
    font-weight: 300
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-photo p {
        margin-bottom: 40px
    }
}

@media screen and (max-width: 768px) {
    .hp-photo p {
        font-size: 20px;
        line-height: 23px;
        margin-bottom: 40px
    }
}

.hp-photo .center {
    padding: 55px 0
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-photo .center {
        padding: 35px 0
    }
}

@media screen and (max-width: 768px) {
    .hp-photo .center {
        padding: 45px 0 37px
    }
}

.hp-photo .photos {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 12px
}

@media screen and (max-width: 768px) {
    .hp-photo .photos {
        padding: 0 6px
    }
}

.hp-photo .photos__item {
    width: calc(100% / 4 - 12px);
    font-size: 0;
    line-height: 0;
    position: relative;
    margin-bottom: 12px
}

@media screen and (max-width: 1024px) {
    .hp-photo .photos__item {
        width: calc(100% / 3 - 12px)
    }

    .hp-photo .photos__item:nth-child(7) {
        display: none
    }

    .hp-photo .photos__item:nth-child(8) {
        display: none
    }
}

@media screen and (max-width: 768px) {
    .hp-photo .photos__item {
        width: calc(100% / 2 - 3px)
    }

    .hp-photo .photos__item:nth-child(5) {
        display: none
    }

    .hp-photo .photos__item:nth-child(6) {
        display: none
    }

    .hp-photo .photos__item:nth-child(7) {
        display: none
    }

    .hp-photo .photos__item:nth-child(8) {
        display: none
    }
}

.hp-photo .photos__item:after {
    content: "";
    display: block;
    padding-bottom: 100%
}

.hp-photo .photos__item img {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%
}

.hp-contact {
    background: #fff
}

.hp-contact > .container:first-child p {
    display: flex;
    align-items: center;
    font-feature-settings: 'ordn' on;
    margin: 0 0 95px;
    font-style: normal;
    font-weight: 700;
    font-size: 30px;
    line-height: 30px;
    letter-spacing: .02em
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-contact > .container:first-child p {
        font-size: 33px;
        line-height: 35px;
        letter-spacing: .02em;
        margin-bottom: 106px
    }

    .hp-contact > .container:first-child br {
        display: none
    }
}

@media screen and (max-width: 768px) {
    .hp-contact > .container:first-child p {
        font-size: 30px;
        line-height: 30px;
        letter-spacing: .02em;
        margin-bottom: 97px
    }

    .hp-contact > .container:first-child p br {
        display: none
    }
}

.hp-contact .contact {
    color: #fff
}

.hp-contact .contact h3 {
    font-feature-settings: 'ordn' on;
    margin: 0 0 15px;
    font-style: normal;
    font-weight: 700;
    font-size: 30px;
    line-height: 30px;
    letter-spacing: .02em
}

@media screen and (max-width: 768px) {
    .hp-contact .contact h3 {
        font-size: 30px;
        line-height: 30px;
        letter-spacing: .02em
    }
}

.hp-contact .contact p {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    margin: 0 0 55px;
    font-style: normal;
    font-weight: 300
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-contact .contact p {
        margin-bottom: 27px
    }
}

@media screen and (max-width: 768px) {
    .hp-contact .contact p {
        margin-bottom: 24px
    }
}
/*
    background-color: rgba(254, 209, 46, .9);
*/
.hp-contact .contact__wrap {
    background: linear-gradient(to right, #DCB428 50%, rgba(254, 209, 46, .9) 50%)
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-contact .contact__wrap {
        background: 0 0
    }
}

@media screen and (max-width: 768px) {
    .hp-contact .contact__wrap {
        background: 0 0
    }
}

.hp-contact .contact__wrap.single {
    background: #DCB428
}

.hp-contact .contact .container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-contact .contact .container {
        flex-direction: column;
        padding: 0
    }
}

@media screen and (max-width: 768px) {
    .hp-contact .contact .container {
        flex-direction: column;
        padding: 0
    }
}

.hp-contact .contact__item {
    box-sizing: border-box;
    width: 100%;
    max-width: 840px;
    padding-top: 75px;
    padding-bottom: 82px
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-contact .contact__item {
        width: 100%;
        padding: 68px 42px 100px
    }
}

@media screen and (max-width: 768px) {
    .hp-contact .contact__item {
        width: 100%;
        padding: 54px 24px 76px
    }
}

.hp-contact .contact__item:first-child {
    padding-right: 115px;
    max-width: 840px
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-contact .contact__item:first-child {
        background: #DCB428;
        order: 2;
        padding-left: 42px;
        padding-right: 42px
    }
}

@media screen and (max-width: 768px) {
    .hp-contact .contact__item:first-child {
        background: #DCB428;
        order: 2;
        padding-left: 24px;
        padding-right: 24px
    }
}

.hp-contact .contact__item:nth-child(2) {
    padding-left: 115px
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .hp-contact .contact__item:nth-child(2) {
        background: rgba(254, 209, 46, .75);
        order: 1;
        padding-left: 42px;
        padding-right: 42px
    }
}

@media screen and (max-width: 768px) {
    .hp-contact .contact__item:nth-child(2) {
        background: rgba(254, 209, 46, .75);
        order: 1;
        padding-left: 24px;
        padding-right: 24px
    }
}

.services {
    padding-top: 120px;
    padding-bottom: 155px;
    position: relative;
    z-index: 2;
    background: #fff
}

@media screen and (max-width: 1024px) {
    .services {
        padding-top: 110px;
        padding-bottom: 80px
    }
}

@media screen and (max-width: 768px) {
    .services {
        padding-top: 110px;
        padding-bottom: 95px
    }
}

.services h1 {
    font-size: 72px;
    line-height: 72px;
    margin: 0 0 45px;
    font-style: normal;
    font-weight: 700
}

@media screen and (max-width: 1024px) {
    .services h1 {
        font-size: 54px;
        line-height: 56px;
        letter-spacing: .02em;
        margin-bottom: 18px
    }
}

@media screen and (max-width: 768px) {
    .services h1 {
        font-size: 39px;
        line-height: 39px;
        letter-spacing: .02em
    }
}

.services__text {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    max-width: 1065px;
    margin: 0;
    font-style: normal;
    font-weight: 300
}

.services__list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
    margin-top: 70px
}

@media screen and (max-width: 1024px) {
    .services__list {
        margin-top: 96px
    }
}

@media screen and (max-width: 768px) {
    .services__list {
        flex-direction: column
    }
}

@supports (display:grid) {
    .services__list {
        display: grid;
        grid-template-columns:repeat(auto-fill, calc(100% / 3 - 12px));
        grid-column-gap: 12px;
        grid-row-gap: 100px;
        justify-content: center
    }

    @media screen and (max-width: 1024px) {
        .services__list {
            grid-row-gap: 70px;
            grid-template-columns:repeat(auto-fill, calc(100% / 2 - 12px))
        }
    }
    @media screen and (max-width: 768px) {
        .services__list {
            grid-row-gap: 85px;
            grid-template-columns:repeat(auto-fill, 100%)
        }
    }
}

.services__icon {
    font-size: 0;
    line-height: 0;
    margin-bottom: 30px
}

.services__icon img {
    max-width: 100%;
    height: auto
}

.services__name {
    line-height: 26px;
    letter-spacing: .02em;
    color: #DCB428;
    overflow: hidden;
    height: 52px;
    margin: 0 0 15px;
    font-style: normal;
    font-weight: 700;
    font-size: 27px
}

.services__description {
    font-size: 16px;
    line-height: 18px;
    letter-spacing: .02em;
    margin: 0;
    font-style: normal;
    font-weight: 300
}

.services__item {
    width: calc(100% / 3 - 12px);
    max-width: 370px;
    position: relative;
    padding-bottom: 55px;
    margin-top: 100px
}

.services__item:nth-child(1), .services__item:nth-child(2), .services__item:nth-child(3) {
    margin-top: 0
}

.services__item .link-underline {
    position: absolute;
    left: 0;
    bottom: 0
}

.services__item .link-underline:hover {
    cursor: pointer
}

@media screen and (max-width: 1024px) {
    .services__item {
        margin-top: 70px
    }
}

@media screen and (max-width: 768px) {
    .services__item {
        margin-top: 0;
        width: 100%;
        max-width: none;
        padding-bottom: 50px;
        margin-bottom: 85px
    }

    .services__item:last-child {
        margin-bottom: 0
    }
}

@supports (display:grid) {
    .services__item {
        width: 100%;
        margin-top: 0
    }

    @media screen and (max-width: 1024px) {
        .services__item {
            margin-top: 0
        }
    }
    @media screen and (max-width: 768px) {
        .services__item {
            margin-top: 0;
            width: 100%;
            max-width: none;
            padding-bottom: 50px;
            margin-bottom: 0
        }

        .services__item:last-child {
            margin-bottom: 0
        }
    }
}

.competencies {
    padding-top: 115px;
    background: #f6f6f6;
    position: relative;
    z-index: 2
}

@media screen and (max-width: 1024px) {
    .competencies {
        padding-top: 73px
    }
}

@media screen and (max-width: 768px) {
    .competencies {
        padding-top: 73px
    }
}

.competencies + .hp-contact {
    padding-top: 150px;
    background: #f6f6f6
}

@media screen and (max-width: 1024px) {
    .competencies + .hp-contact {
        padding-top: 10px
    }
}

.competencies h2 {
    letter-spacing: .02em;
    margin: 0 0 55px;
    font-weight: 700;
    font-style: normal;
    font-size: 36px;
    line-height: 36px;
    font-feature-settings: 'ordn' on
}

@media screen and (max-width: 1024px) {
    .competencies h2 {
        margin-bottom: 18px
    }
}

@media screen and (max-width: 768px) {
    .competencies h2 {
        font-size: 30px;
        line-height: 30px;
        margin-bottom: 24px;
        letter-spacing: .02em
    }
}

.competencies__text {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    max-width: 1065px;
    font-style: normal;
    font-weight: 300
}

.competencies .hp-contact {
    padding-top: 265px
}

.competencies__list {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: stretch;
    margin-top: 70px
}

.competencies__list:last-child {
    margin-bottom: 0
}

@media screen and (max-width: 768px) {
    .competencies__list {
        flex-direction: column
    }
}

@media screen and (max-width: 768px) {
    .competencies__list {
        margin-top: 75px
    }
}

@supports (display:grid) {
    .competencies__list {
        display: grid;
        grid-template-columns:repeat(auto-fill, calc(100% / 3 - 12px));
        grid-column-gap: 12px;
        grid-row-gap: 70px;
        justify-content: center
    }

    @media screen and (max-width: 1024px) {
        .competencies__list {
            grid-template-columns:repeat(auto-fill, calc(100% / 2 - 12px))
        }
    }
    @media screen and (max-width: 768px) {
        .competencies__list {
            grid-template-columns:repeat(auto-fill, 100%)
        }
    }
}

.competencies__item {
    margin-bottom: 115px;
    width: calc(100% / 3 - 12px);
    max-width: 310px;
    position: relative;
    padding-bottom: 40px
}

@media screen and (max-width: 1024px) {
    .competencies__item {
        padding-bottom: 60px;
        margin-bottom: 85px
    }
}

@media screen and (max-width: 768px) {
    .competencies__item {
        width: 100%;
        max-width: none;
        padding-bottom: 50px;
        margin-top: 0;
        margin-bottom: 60px
    }
}

.competencies__item .link-underline {
    position: absolute;
    left: 0;
    bottom: 10px
}

.competencies__item:nth-child(1), .competencies__item:nth-child(2), .competencies__item:nth-child(3) {
    margin-top: 85px
}

@media screen and (max-width: 1024px) {
    .competencies__item:nth-child(1), .competencies__item:nth-child(2), .competencies__item:nth-child(3) {
        margin-top: 75px
    }
}

@media screen and (max-width: 768px) {
    .competencies__item:nth-child(1), .competencies__item:nth-child(2), .competencies__item:nth-child(3) {
        margin-top: 0
    }
}

@supports (display:grid) {
    .competencies__item {
        width: 100%;
        margin-top: 0 !important;
        margin-bottom: 0 !important
    }

    @media screen and (max-width: 1024px) {
        .competencies__item {
            margin-top: 0
        }
    }
    @media screen and (max-width: 768px) {
        .competencies__item {
            margin-top: 0;
            width: 100%;
            max-width: none;
            margin-bottom: 0
        }

        .competencies__item:last-child {
            margin-bottom: 0
        }
    }
}

.competencies__name {
    letter-spacing: .02em;
    font-weight: 700;
    height: 55px;
    overflow: hidden;
    margin: 0 0 12px;
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 24px;
    display:block;
}

@media screen and (max-width: 768px) {
    .competencies__name {
        height: auto;
        margin-bottom: 18px
    }
}

.competencies__description {
    margin: 0;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: .02em;
    font-style: normal;
    font-weight: 300
}

.service-header {
    position: relative;
    background: #DCB428
}

.service-header .background {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    height: 100vh;
    z-index: 0
}

.small.service-header .background {
    height: 60vh;
}

@media screen and (max-width: 768px) {
    .service-header .background {
        bottom: -69px;
        display: none
    }

    .small.service-header .background {
        display: block;
        height: 100%;
    }
}

.service-header:before {
    content: "";
    display: block;
    background: currentColor;
    opacity: var(--opacity);
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 1;
    transition: opacity linear 0s
}

.service-header > .container {
    position: relative;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.small.service-header > .container {
    height: 60vh;
    height: calc(var(--vh, 1vh) * 60);
}

.small .scroll-down {
    bottom: 40px;
}

.service-header__title {
    font-size: 100px;
    line-height: 80px;
    color: #fff;
    font-weight: 800;
    margin: 0;
    bottom: 62px
}

.small .service-header__title {
    font-size: 64px;
}

@media screen and (max-width: 1024px) {
    .service-header__title {
        font-size: 64px;
        line-height: 60px
    }

    .small .service-header__title {
        font-size: 40px;
    }
}

@media screen and (max-width: 768px) {
    .service-header__title {
        font-size: 36px;
        line-height: 30px
    }

    .small .service-header__title {
        font-size: 30px;
        line-height: 26px
    }
}

.services-item-page {
    padding-top: 107px;
    position: relative;
    z-index: 2;
    background: #fff
}

@media screen and (max-width: 1024px) {
    .services-item-page {
        padding-top: 80px
    }
}

@media screen and (max-width: 768px) {
    .services-item-page {
        padding-top: 40px
    }
}

.services-item-page h2 {
    line-height: 26px;
    letter-spacing: .02em;
    color: #DCB428;
    margin: 0 0 46px;
    max-width: 850px;
    font-style: normal;
    font-weight: 700;
    font-size: 27px
}

@media screen and (max-width: 1024px) {
    .services-item-page h2 {
        margin-bottom: 26px
    }
}

.services-item-page h3 {
    font-weight: 600;
    font-size: 20px;
    line-height: 24px;
}

@media screen and (max-width: 1024px) {
    .services-item-page h3 {
        font-size: 20px;
        line-height: 24px
    }
}

@media screen and (max-width: 768px) {
    .services-item-page h3 {
        font-size: 20px;
        line-height: 24px
    }
}

.services-item-page p {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    margin: 0 0 23px;
    max-width: 1065px;
    font-style: normal;
    font-weight: 300
}

.services-item-page li {
    font-size: 20px;
    margin-bottom: 10px;
    line-height: 23px;
    letter-spacing: .02em;

    max-width: 1065px;
    font-style: normal;
    font-weight: 300
}

.services-item-page p:last-child {
    margin-bottom: 0
}

.services-item-page__list {
    padding: 12px;
    padding-top: 100px;
    position: relative;
    z-index: 2;
    background: #fff
}

@media screen and (max-width: 1024px) {
    .services-item-page__list {
        padding-top: 60px
    }
}

@media screen and (max-width: 768px) {
    .services-item-page__list {
        padding: 60px 6px 0
    }
}

.services-item-page__list .step-title, .services-item-page__list h2, .services-item-page__list h3, .services-item-page__list h4, .services-item-page__list h5, .services-item-page__list h6 {
    font-size: 36px;
    line-height: 36px;
    letter-spacing: .02em;
    font-feature-settings: 'ordn' on;
    margin: 0 0 33px;
    font-style: normal;
    font-weight: 700;
    text-align: left
}

@media screen and (max-width: 1024px) {

    .services-item-page__list .step-title, .services-item-page__list h2, .services-item-page__list h3, .services-item-page__list h4, .services-item-page__list h5, .services-item-page__list h6 {
        font-size: 33px;
        line-height: 35px;
        letter-spacing: .02em;
        margin-bottom: 42px
    }
}

@media screen and (max-width: 768px) {

    .services-item-page__list .step-title, .services-item-page__list h2, .services-item-page__list h3, .services-item-page__list h4, .services-item-page__list h5, .services-item-page__list h6 {
        font-size: 30px;
        line-height: 30px;
        letter-spacing: .02em;
        margin-bottom: 15px
    }
}


.services-item-page__list .step-title span, .services-item-page__list h2 span, .services-item-page__list h3 span, .services-item-page__list h4 span, .services-item-page__list h5 span, .services-item-page__list h6 span {
    color: #DCB428
}

.services-item-page__list p {
    font-size: 18px;
    line-height: 21px;
    letter-spacing: .02em;
    font-style: normal;
    font-weight: 300;
    text-align: left
}

.services-item-page__row {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-bottom: 12px
}

.services-item-page__row:last-child {
    margin-bottom: 0
}

.services-item-page__row:nth-child(even) {
    background: rgba(246, 246, 246, .5)
}

.services-item-page__row:nth-child(even) .w50 {
    order: 2
}

.services-item-page__row:nth-child(even) .w50.text-service {
    padding-right: 115px;
    text-align: right;
    order: 1
}

.services-item-page__row:nth-child(even) .w50.text-service .services-item-page__text {
    display: inline-block
}

@media screen and (max-width: 1024px) {
    .services-item-page__row:nth-child(even) .w50.text-service {
        padding-right: 45px;
        padding-left: 31px
    }
}

@media screen and (max-width: 768px) {
    .services-item-page__row:nth-child(even) .w50.text-service {
        padding: 36px 18px 33px;
        order: 2
    }

    .services-item-page__row:nth-child(even) .w50.text-service .services-item-page__text {
        display: block
    }
}

.services-item-page__row:nth-child(odd) {
    background: #f6f6f6
}

.services-item-page__row:nth-child(odd) .w50:last-child {
    padding-left: 115px
}

.text-service {
    padding-top: 40px;
    padding-bottom: 40px
}

@media screen and (max-width: 1024px) {
    .services-item-page__row:nth-child(odd) .w50:last-child {
        padding-left: 45px;
        padding-right: 31px
    }
}

@media screen and (max-width: 768px) {
    .services-item-page__row:nth-child(odd) .w50:last-child {
        padding: 36px 18px 33px
    }
}

.services-item-page__row .w50 {
    width: 50%;
    font-size: 0;
    line-height: 0;
    box-sizing: border-box;
    overflow: hidden
}

@media screen and (max-width: 768px) {
    .services-item-page__row .w50 {
        width: 100%
    }
}

.services-item-page__row .w50 img {
    max-width: 100%;
    height: auto;
    object-position: center;
    object-fit: cover
}

@media screen and (max-width: 1024px) {
    .services-item-page__row .w50 img {
        min-height: 576px;
        width: auto;
        max-width: none
    }
}

@media screen and (max-width: 768px) {
    .services-item-page__row .w50 img {
        min-height: auto;
        width: 100%;
        height: auto
    }
}

@media screen and (max-width: 1024px) {
    .services-item-page__row {
        flex-direction: column
    }

    .services-item-page__row .w50 {
        width: 100%
    }

    .services-item-page__row .w50 img {
        min-height: auto;
        width: 100%;
        height: auto
    }

    .services-item-page__row:nth-child(even) .w50 {
        order: 1
    }
}

.services-item-page__text {
    max-width: 526px
}

@media screen and (max-width: 1024px) {
    .services-item-page__text {
        max-width: 100%
    }
}

.services-item-page__experience {
    padding-top: 110px;
    padding-bottom: 105px;
    position: relative;
    z-index: 1;
    background: #fff
}

.services-item-page__experience.sm {
    padding-top: 0;
    padding-bottom: 0
}

.services-item-page__experience.sm + .works-list {
    padding-top: 110px
}

@media screen and (max-width: 1024px) {
    .services-item-page__experience {
        padding-top: 70px;
        padding-bottom: 70px
    }

    .services-item-page__experience.sm + .works-list {
        padding-top: 70px
    }
}

.services-item-page__experience h2 {
    font-size: 36px;
    line-height: 36px;
    letter-spacing: .02em;
    font-feature-settings: 'ordn' on;
    margin: 0 0 28px;
    font-style: normal;
    font-weight: 700
}

.services-item-page__experience p {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    max-width: 1280px;
    margin: 0;
    font-style: normal;
    font-weight: 300
}

.works {
    padding-top: 128px;
    position: relative;
    z-index: 2;
    background: #fff
}

.works h1 {
    font-size: 72px;
    line-height: 56px;
    letter-spacing: .02em;
    margin: 0 0 55px;
    font-style: normal;
    font-weight: 700
}

@media screen and (max-width: 1024px) {
    .works h1 {
        font-size: 54px;
        line-height: 56px;
        margin-bottom: 50px
    }
}

.works p {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    margin: 0 0 60px;
    font-style: normal;
    font-weight: 300
}

@media screen and (max-width: 1024px) {
    .works p {
        margin-bottom: 55px
    }
}

@media screen and (max-width: 1024px) {
    .works {
        padding-top: 100px
    }
}

@media screen and (max-width: 768px) {
    .works {
        padding-bottom: 110px
    }
}

.works-list {
    position: relative;
    z-index: 2;
    background: #fff;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 107px;
    padding-bottom: 125px;
    overflow: hidden
}

@media screen and (max-width: 1024px) {
    .works-list {
        padding: 0 43px;
        padding-bottom: 50px
    }
}

@media screen and (max-width: 768px) {
    .works-list {
        padding: 0 25px;
        flex-direction: column;
        padding-bottom: 100px
    }
}

@supports (display:grid) {
    .works-list {
        display: grid;
        grid-template-columns:repeat(auto-fill, calc(100% / 3 - 8px));
        grid-column-gap: 8px;
        grid-row-gap: 50px;
        justify-content: center
    }

    @media screen and (max-width: 1024px) {
        .works-list {
            grid-column-gap: 6px;
            grid-template-columns:repeat(auto-fill, calc(100% / 2 - 6px));
            grid-row-gap: 35px
        }
    }
    @media screen and (max-width: 768px) {
        .works-list {
            grid-row-gap: 54px;
            grid-template-columns:repeat(1, 1fr);
            grid-column-gap: 0
        }
    }
    @media only screen and (max-width: 768px) and (max-width: 768px) and (min-aspect-ratio: 13 / 9) {
        .works-list {
            grid-template-columns:repeat(2, 1fr);
            grid-column-gap: 12px
        }
    }
}

.works-list__item {
    width: calc(100% / 3 - 8px);
    margin-bottom: 50px;
    transition: all 1s;
    max-width: 695px
}

@media screen and (max-width: 1024px) {
    .works-list__item {
        width: calc(100% / 2 - 6px);
        margin-bottom: 35px;
        max-width: 100%
    }
}

@media screen and (max-width: 768px) {
    .works-list__item {
        width: 100%;
        margin-bottom: 54px
    }
}

@supports (display:grid) {
    .works-list__item {
        margin-bottom: 0;
        width: 100%
    }
}

.works-list a {
    text-decoration: none
}

.works-list a:hover .works-list__name {
    color: #DCB428
}

.works-list a:hover .works-list__link:before {
    opacity: 1
}

.works-list a:hover .works-list__link:after {
    opacity: .9
}

.works-list__name {
    line-height: 26px;
    letter-spacing: .02em;
    margin: 0 0 20px;
    color: #000;
    font-style: normal;
    font-weight: 700;
    font-size: 27px;
    transition: color ease-in-out .2s;
    display:block;
}

@media screen and (max-width: 1024px) {
    .works-list__name {
        font-size: 21px;
        line-height: 23px;
        margin-bottom: 5px
    }
}

.works-list__tags {
    letter-spacing: .02em;
    font-style: normal;
    font-weight: 300;
    font-size: 15px;
    line-height: 17px;
    text-transform: uppercase;
    color: #000
}

@media screen and (max-width: 1024px) {
    .works-list__tags {
        font-size: 18px;
        line-height: 21px;
        text-transform: none
    }
}

.works-list img {
    width: 100%;
    max-width: 100%;
    height: auto
}

.works-list__link {
    font-size: 0;
    line-height: 0;
    color: #DCB428;
    position: relative;
    display: block;
    margin-bottom: 30px
}

@media screen and (max-width: 1024px) {
    .works-list__link {
        margin-bottom: 25px
    }
}

.works-list__link:after {
    z-index: 1;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background-color: currentColor;
    opacity: 0;
    transition: opacity ease-in-out .2s
}

.works-list__link:before {
    content: "";
    display: block;
    position: absolute;
    right: 30px;
    top: 30px;
    background-image: url(../img/link_arrow.svg);
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
    z-index: 2;
    transition: opacity ease-in-out .2s;
    opacity: 0
}

@media screen and (max-width: 768px) {
    .works-list__link:before {
        top: 20px;
        right: 20px;
        height: 37px;
        width: 37px;
        background-size: contain
    }
}

.works__category {
    padding-top: 70px;
    padding-bottom: 60px;
    position: relative;
    z-index: 2;
    background: #fff
}

@media screen and (max-width: 1024px) {
    .works__category {
        padding-top: 65px;
        padding-bottom: 35px
    }
}

.works__category .container {
    position: relative;
    padding: 0 50px
}

.works__category .tns-outer {
    margin: 0 30px
}

.works__category .slider-button {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 26px;
    width: 15px
}

.works__category .slider-button.prev {
    left: 25px
}

@media screen and (max-width: 1024px) {
    .works__category .slider-button.prev {
        left: 43px
    }
}

.works__category .slider-button.next {
    right: 25px
}

.works__category .slider-button svg path {
    fill: #000
}

.works__category .slider-button svg:hover path {
    fill: #DCB428
}

.works__category .slider-button[disabled] {
    cursor: auto;
    opacity: .25
}

.works__category .slider-button[disabled] svg path {
    fill: #000
}

.works__category .tns-horizontal.tns-subpixel > .tns-item {
    vertical-align: middle
}

.works__category button {
    border: none;
    margin: 0;
    padding: 0;
    width: auto;
    overflow: visible;
    background: 0 0;
    color: inherit;
    font: inherit;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
    text-align: inherit;
    outline: 0;
    cursor: pointer;
    font-size: 16px;
    transition: all ease-in-out .2s;
    min-height: 26px;
    font-style: normal;
    line-height: 19px;
    white-space: nowrap
}

.works__category button::-moz-focus-inner {
    border: 0;
    padding: 0
}

.works__category button:hover {
    color: #DCB428
}

.works__category button.active {
    font-size: 16px;
    color: #DCB428;
    font-style: normal;
    line-height: 19px
}

.works__category button:after {
    display: block;
    content: attr(title);
    height: 0;
    overflow: hidden;
    visibility: hidden;
    font-weight: 700
}

@media screen and (max-width: 768px) {
    .works__category {
        display: none
    }
}

.text {
    padding-top: 110px;
    padding-bottom: 95px;
    background: #fff
}

.text a {
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    color: #DCB428;
    text-decoration: none;
    transition: color ease-in-out .2s
}

.text a:visited {
    color: #DCB428
}

.text a:hover {
    color: #000
}

@media screen and (max-width: 1024px) {
    .text {
        padding-top: 75px
    }
}

@media screen and (max-width: 768px) {
    .text {
        padding-top: 82px;
        padding-bottom: 45px
    }
}

@media screen and (max-width: 768px) {
    .text .hidden-mobile {
        display: none
    }
}

.text.only-mobile {
    display: none;
    padding-top: 0
}

@media screen and (max-width: 768px) {
    .text.only-mobile {
        display: block
    }
}

.text.page-project {
    padding-top: 0;
    padding-bottom: 0;
    margin: 50px auto 35px
}

.text.page-project .container {
    display: block
}

@media screen and (max-width: 1024px) {
    .text.page-project {
        margin-top: 35px;
        margin-bottom: 10px;
        padding-top: 0;
        padding-bottom: 0
    }
}

@media screen and (max-width: 768px) {
    .text.page-project {
        margin-bottom: 10px
    }
}

.text .container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start
}

@media screen and (max-width: 1024px) {
    .text .container {
        flex-direction: column
    }
}

.text h2 {
    letter-spacing: .02em;
    margin: 0 0 35px;
    color: #DCB428;
    max-width: 850px;
    font-style: normal;
    font-weight: 600;
    font-size: 26px;
    line-height: 26px
}

@media screen and (max-width: 1024px) {
    .text h2 {
        margin-bottom: 25px
    }
}

@media screen and (max-width: 768px) {
    .text h2 {
        font-size: 26px;
        line-height: 26px;
        letter-spacing: .02em;
        margin-bottom: 36px
    }
}

.custom-h3, .text h3 {
    font-weight: 600;
    font-size: 20px;
    line-height: 24px
}

@media screen and (max-width: 1024px) {
    .custom-h3, .text h3 {
        font-size: 20px
    }
}

@media screen and (max-width: 768px) {
    .custom-h3, .text h3 {
        font-size: 20px
    }
}

.text h4 {
    font-size: 18px;
    line-height: 21px;
    font-style: normal;
    font-weight: 600;
    margin: 0 0 36px 0
}

.text p {
    font-size: 20px;
    line-height: 25px;
    letter-spacing: .02em;
    margin: 0 0 25px;
    max-width: 850px;
    font-style: normal;
    font-weight: 300
}

.text p + h2 {
    margin-top: 32px;
    margin-bottom: 45px
}

@media screen and (max-width: 768px) {
    .text p + h2 {
        margin-top: 75px;
        margin-bottom: 26px
    }
}

.text p + h3 {
    margin-top: 32px;
    margin-bottom: 45px
}

@media screen and (max-width: 768px) {
    .text p + h3 {
        margin-top: 75px;
        margin-bottom: 26px
    }
}

.text p + h4 {
    margin-top: 32px;
    margin-bottom: 46px
}

@media screen and (max-width: 768px) {
    .text p + h4 {
        margin-top: 75px;
        margin-bottom: 26px
    }
}

.text h3 {
    font-size: 20px;
    line-height: 24px;
    font-style: normal;
    font-weight: 700;
    margin: 0 0 35px 0
}

.text b, .text strong {
    font-weight: 800
}

.text ul {
    margin-top: 8px;
    padding-left: 25px;
    margin-bottom: 25px
}

.text ul + h2 {
    margin-top: 32px;
    margin-bottom: 45px
}

@media screen and (max-width: 768px) {
    .text ul + h2 {
        margin-top: 75px;
        margin-bottom: 26px
    }
}

.text ul + h3 {
    margin-top: 32px;
    margin-bottom: 45px
}

@media screen and (max-width: 768px) {
    .text ul + h3 {
        margin-top: 75px;
        margin-bottom: 26px
    }
}

.text ul + h4 {
    margin-top: 32px;
    margin-bottom: 46px
}

@media screen and (max-width: 768px) {
    .text ul + h4 {
        margin-top: 75px;
        margin-bottom: 26px
    }
}

.text ol {
    margin-top: 8px;
    padding-left: 15px
}

.text ol li {
    padding-left: 15px
}

.text li {
    padding-left: 5px;
    font-weight: 300;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: .02em;
    margin-bottom: 7px
}

.text-main-content, .text-top__content {
    max-width: 850px;
    padding-right: 40px
}

@media screen and (max-width: 768px) {
    .text-main-content, .text-top__content {
        margin-bottom: 40px
    }
}

@media screen and (max-width: 1024px) {
    .text-main-content, .text-top__content {
        padding-right: 0;
        max-width: none;
        margin-bottom: 15px
    }
}

.text-main-content h2, .text-top__content h2 {
    color: #000
}

.text-main-content figure {
    margin-bottom: 40px;
}

.text-top__description {
    width: 310px
}

.text-top__description .item {
    margin-bottom: 35px
}

.text-top__description h3 {
    margin-bottom: 6px
}

.text-top__description p {
    margin: 0
}

.blog_image {
    max-width: 1700px;
    margin: 50px auto 75px;
    padding: 0 12px
}

.blog_image figure {
    margin: 0
}

.blog_image figcaption {
    margin-top: 25px;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: .02em;
    color: rgba(0, 0, 0, .5)
}

@media screen and (max-width: 1024px) {
    .blog_image {
        margin-top: 10px;
        margin-bottom: 60px
    }
}

@media screen and (max-width: 768px) {
    .blog_image {
        padding: 0 6px;
        margin-bottom: 45px
    }
}

.blog_image img {
    max-width: 100%;
    height: auto
}

.blog_image__item {
    font-size: 0;
    line-height: 0;
    margin-bottom: 14px
}

@media screen and (max-width: 768px) {
    .blog_image__item {
        margin-bottom: 6px
    }
}

.blog_image .double-image {
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

.blog_image .double-image img {
    max-width: calc(100% / 2 - 7px)
}

@media screen and (max-width: 768px) {
    .blog_image .double-image img {
        max-width: 100%;
        margin-bottom: 6px
    }

    .blog_image .double-image img:last-child {
        margin-bottom: 0
    }
}

@media screen and (max-width: 768px) {
    .blog_image .double-image {
        flex-direction: column
    }
}

.blog_image .four-image {
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

.blog_image .four-image img {
    max-width: calc(100% / 4 - 11px)
}

@media screen and (max-width: 768px) {
    .blog_image .four-image img {
        max-width: calc(50% - 3px);
        margin-bottom: 6px
    }
}

@media screen and (max-width: 768px) {
    .blog_image .four-image {
        flex-direction: row;
        flex-wrap: wrap
    }
}

.text-images {
    padding: 0 12px 125px;
    background: #fff
}

.text-images .images-wrap {
    max-width: 1700px;
    margin: 0 auto
}

@media screen and (max-width: 768px) {
    .text-images {
        padding: 5px 6px 90px
    }
}

.text-images img {
    max-width: 100%;
    height: auto
}

.text-images__item {
    font-size: 0;
    line-height: 0;
    margin-bottom: 14px
}

.text-images__item:last-child {
    margin-bottom: 0
}

@media screen and (max-width: 768px) {
    .text-images__item {
        margin-bottom: 6px
    }
}

.text-images .double-image {
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

.text-images .double-image img {
    max-width: calc(100% / 2 - 7px)
}

@media screen and (max-width: 768px) {
    .text-images .double-image img {
        max-width: 100%;
        margin-bottom: 6px
    }

    .text-images .double-image img:last-child {
        margin-bottom: 0
    }
}

.text-images .double-image picture {
    max-width: calc(50% - 7px);
    width: 100%
}

.text-images .double-image picture img {
    width: 100%;
    max-width: none
}

@media screen and (max-width: 768px) {
    .text-images .double-image picture {
        max-width: 100%;
        margin-bottom: 6px
    }

    .text-images .double-image picture:last-child {
        margin-bottom: 0
    }
}

@media screen and (max-width: 768px) {
    .text-images .double-image {
        flex-direction: column
    }
}

.text-images .four-image {
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

.text-images .four-image img {
    max-width: calc(100% / 4 - 11px)
}

@media screen and (max-width: 768px) {
    .text-images .four-image img {
        max-width: calc(50% - 3px);
        margin-bottom: 6px
    }
}

.text-images .four-image picture {
    width: 100%;
    max-width: calc(100% / 4 - 11px)
}

@media screen and (max-width: 768px) {
    .text-images .four-image picture {
        max-width: calc(50% - 3px);
        margin-bottom: 6px
    }
}

.text-images .four-image picture img {
    width: 100%;
    max-width: none
}

@media screen and (max-width: 768px) {
    .text-images .four-image {
        flex-direction: row;
        flex-wrap: wrap
    }
}

.offices {
    position: relative;
    z-index: 2;
    background: #fff
}

.offices-wrap {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 1700px;
    margin: 0 auto 0;
    padding: 0 0 145px;
    box-sizing: border-box
}

@media screen and (max-width: 768px) {
    .offices-wrap {
        flex-direction: column;
        padding: 0 0 70px
    }
}

.offices .w50 {
    width: calc(50% - 6px)
}

@media screen and (max-width: 768px) {
    .offices .w50 {
        width: 100%;
        margin-top: 125px;
        margin-bottom: 0
    }

    .offices .w50:first-child {
        margin-top: 0
    }
}

.offices__image {
    font-size: 0;
    line-height: 0;
    margin-bottom: 40px;
    position: relative
}

.offices__image img {
    width: 100%;
    height: auto
}

.offices .label {
    font-weight: 300;
    font-size: 15px;
    line-height: 17px;
    letter-spacing: .04em
}

.offices__link {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    color: #DCB428
}

.offices__link:after {
    z-index: 1;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background-color: #DCB428;
    opacity: 0;
    transition: opacity ease-in-out .2s
}

.offices__link:before {
    content: "";
    display: block;
    position: absolute;
    right: 30px;
    top: 30px;
    background-image: url(../img/link_arrow.svg);
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
    z-index: 2;
    transition: opacity ease-in-out .2s;
    opacity: 0
}

@media screen and (max-width: 768px) {
    .offices__link:before {
        top: 20px;
        right: 20px;
        height: 37px;
        width: 37px;
        background-size: contain
    }
}

.offices__link span {
    font-size: 18px;
    line-height: 21px;
    text-align: right;
    letter-spacing: .02em;
    position: absolute;
    right: 36px;
    bottom: 26px;
    color: #fff;
    z-index: 2;
    opacity: 0
}

.offices__link:hover:before {
    opacity: 1
}

.offices__link:hover:after {
    opacity: .9
}

.offices__link:hover span {
    opacity: 1
}

.offices__title {
    line-height: 26px;
    letter-spacing: .02em;
    font-weight: 700;
    margin-bottom: 50px;
    font-style: normal;
    font-size: 27px
}

.offices__address {
    font-size: 24px;
    line-height: 28px;
    margin-bottom: 25px;
    font-style: normal;
    font-weight: 300
}

.offices__address p {
    margin-top: 0
}

.offices__phones {
    display: flex;
    flex-direction: column;
    margin-bottom: 25px
}

.offices a {
    font-size: 24px;
    line-height: 28px;
    color: #000;
    text-decoration: none;
    font-style: normal;
    font-weight: 300
}

.offices a:hover {
    text-decoration: underline
}

.offices-header {
    padding-top: 128px;
    padding-bottom: 95px;
    position: relative;
    z-index: 2;
    background: #fff
}

@media screen and (max-width: 768px) {
    .offices-header {
        padding-top: 110px;
        padding-bottom: 60px
    }
}

.offices-header h1 {
    font-size: 72px;
    line-height: 56px;
    letter-spacing: .02em;
    margin: 0 0 55px;
    font-weight: 700;
    font-style: normal
}

@media screen and (max-width: 768px) {
    .offices-header h1 {
        font-size: 39px;
        line-height: 39px;
        letter-spacing: .02em;
        margin-bottom: 20px
    }
}

.offices-header p {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    margin-bottom: 0;
    font-style: normal;
    font-weight: 300
}

.team-header {
    padding-top: 128px;
    padding-bottom: 130px
}

@media screen and (max-width: 1024px) {
    .team-header {
        padding-top: 115px;
        padding-bottom: 90px
    }
}

@media screen and (max-width: 768px) {
    .team-header {
        padding-top: 110px;
        padding-bottom: 60px
    }
}

.team-header h1 {
    font-size: 72px;
    letter-spacing: .02em;
    margin: 0 0 55px;
    font-weight: 700;
    font-style: normal
}

@media screen and (max-width: 1024px) {
    .team-header h1 {
        font-size: 54px;
        line-height: 56px;
        margin-bottom: 20px
    }
}

@media screen and (max-width: 768px) {
    .team-header h1 {
        font-size: 39px;
        line-height: 39px;
        letter-spacing: .02em;
        margin-bottom: 20px
    }
}

.team-header p {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    margin: 0;
    font-style: normal;
    font-weight: 300
}

.team-header .image-wrap {
    font-size: 0;
    line-height: 0;
    max-width: 1700px;
    margin: 95px auto 0
}

.team-header .image-wrap img {
    max-width: 100%
}

@media screen and (max-width: 1024px) {
    .team-header .image-wrap {
    }
}

@media screen and (max-width: 768px) {
    .team-header .image-wrap {
        margin-top: 60px;
    }
}

.team-base {
    position: relative;
    z-index: 2;
    background: #fff
}

.team-base h2 {
    font-size: 36px;
    line-height: 40px;
    color: #DCB428;
    margin-top: 0;
    font-style: normal;
    font-weight: 700
}

@media screen and (max-width: 1024px) {
    .team-base h2 {
        font-size: 33px;
        line-height: 35px;
        margin-bottom: 22px
    }
}

@media screen and (max-width: 768px) {
    .team-base h2 {
        font-size: 30px;
        line-height: 30px;
        letter-spacing: .02em
    }
}

.team-base p {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    font-style: normal;
    font-weight: 300;
    margin-bottom: 0
}

.team-head {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    max-width: 1700px;
    padding: 70px 24px 145px;
    box-sizing: border-box;
    margin: 0 auto 0;
    position: relative;
    z-index: 2;
    background: #fff
}

@media screen and (max-width: 1024px) {
    .team-head {
        padding: 45px 10px 90px
    }
}

@media screen and (max-width: 768px) {
    .team-head {
        flex-direction: column;
        padding: 40px 24px 50px
    }
}

.team-head .w50 {
    width: calc(50% - 6px)
}

@media screen and (max-width: 768px) {
    .team-head .w50 {
        width: 100%;
        margin-bottom: 5px
    }

    .team-head .w50:last-child {
        margin-bottom: 0
    }
}

.team-head__item {
    position: relative
}

.team-head__item:hover .team-head__description {
    opacity: 1
}

.team-head__photo {
    font-size: 0;
    line-height: 0
}

.team-head__photo img {
    width: 100%;
    height: auto
}

.team-head__description {
    transition: opacity ease-in-out .2s;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(254, 209, 46, .9);
    opacity: 0
}

.team-head__icon {
    position: absolute;
    right: 36px;
    top: 36px
}

.team-head__icon img {
    max-width: 100%;
    height: auto
}

@media screen and (max-width: 768px) {
    .team-head__icon {
        right: 16px;
        top: 20px;
        width: 58px
    }
}

.team-head__text {
    position: absolute;
    left: 36px;
    bottom: 30px
}

@media screen and (max-width: 1024px) {
    .team-head__text {
        left: 15px;
        right: 15px;
        bottom: 25px
    }
}

@media screen and (max-width: 768px) {
    .team-head__text {
        bottom: 15px;
        left: 18px;
        right: 18px
    }
}

.team-head__name {
    color: #fff;
    font-weight: 700;
    margin-bottom: 5px;
    font-style: normal;
    font-size: 27px;
    line-height: 26px;
    letter-spacing: .02em;
    text-transform: capitalize
}

@media screen and (max-width: 1024px) {
    .team-head__name {
        font-size: 24px;
        line-height: 26px;
        letter-spacing: .02em
    }
}

.team-head__position {
    letter-spacing: .02em;
    color: #fff;
    font-weight: 300;
    font-size: 15px;
    line-height: 17px;
    text-transform: uppercase
}

@media screen and (max-width: 1024px) {
    .team-head__position {
        font-size: 16px;
        line-height: 18px;
        letter-spacing: .02em
    }
}

.team-list {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    max-width: 1700px;
    padding: 70px 24px 110px;
    flex-wrap: wrap;
    box-sizing: border-box;
    margin: 0 auto 0;
    position: relative;
    z-index: 2;
    background: #fff
}

@media screen and (max-width: 1024px) {
    .team-list {
        padding: 40px 10px 110px
    }
}

@media screen and (max-width: 768px) {
    .team-list {
        flex-direction: column;
        padding: 40px 24px 95px
    }
}

@supports (display:grid) {
    .team-list {
        display: grid;
        grid-template-columns:repeat(4, 1fr);
        gap: 13px;
        justify-content: center
    }

    @media screen and (max-width: 1024px) {
        .team-list {
            grid-template-columns:repeat(3, 1fr)
        }
    }
    @media screen and (max-width: 768px) {
        .team-list {
            grid-template-columns:repeat(2, 1fr)
        }
    }
}

.team-list__item {
    width: calc((100% / 4) - (39px / 3));
    margin-bottom: 16px;
    position: relative
}

@media screen and (max-width: 1024px) {
    .team-list__item {
        width: calc(100% / 3 - 26 / 3)
    }
}

@media screen and (max-width: 768px) {
    .team-list__item {
        width: 100%;
        margin-bottom: 5px
    }
}

.team-list__item.hover .team-list__description, .team-list__item:hover .team-list__description {
    opacity: 1
}

@supports (display:grid) {
    .team-list__item {
        width: 100%;
        margin-bottom: 0
    }
}

.team-list__photo {
    font-size: 0;
    line-height: 0
}

.team-list__photo img {
    max-width: 100%;
    height: auto
}

.team-list__description {
    transition: opacity ease-in-out .2s;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(254, 209, 46, .9);

    opacity: 0
}

.team-list__icon {
    position: absolute;
    right: 36px;
    top: 36px
}

.team-list__icon img {
    max-width: 100%;
    height: auto
}

@media screen and (max-width: 1024px) {
    .team-list__icon {
        max-width: 42px;
        top: 20px;
        right: 20px
    }
}

@media screen and (max-width: 768px) {
    .team-list__icon {
        max-width: 40px;
        right: 18px;
        top: 18px
    }
}

.team-list__text {
    position: absolute;
    left: 36px;
    bottom: 30px;
    color: #fff
}

@media screen and (max-width: 1024px) {
    .team-list__text {
        left: 20px;
        right: 20px
    }
}

@media screen and (max-width: 768px) {
    .team-list__text {
        bottom: 15px
    }
}

.team-list__name {
    margin-bottom: 5px;
    font-weight: 700;
    font-style: normal;
    font-size: 27px;
    line-height: 26px;
    letter-spacing: .02em;
    text-transform: capitalize
}

@media screen and (max-width: 1024px) {
    .team-list__name {
        font-size: 24px;
        line-height: 26px;
        letter-spacing: .02em
    }
}

.team-list__position {
    font-style: normal;
    font-weight: 300;
    font-size: 15px;
    line-height: 17px;
    letter-spacing: .02em;
    text-transform: uppercase
}

@media screen and (max-width: 1024px) {
    .team-list__position {
        font-size: 16px;
        line-height: 18px;
        letter-spacing: .02em
    }
}

.blog {
    padding-top: 128px;
    background: #fff;
    padding-bottom: 20px;
    position: relative;
    z-index: 2
}

@media screen and (max-width: 1024px) {
    .blog {
        padding-top: 110px
    }
}

@media screen and (max-width: 768px) {
    .blog {
        padding-top: 110px
    }
}

.blog h1 {
    font-size: 72px;
    line-height: 56px;
    letter-spacing: .02em;
    margin: 0 0 55px;
    font-style: normal;
    font-weight: 700
}

@media screen and (max-width: 1024px) {
    .blog h1 {
        font-size: 54px;
        line-height: 56px;
        letter-spacing: .02em;
        margin-bottom: 20px
    }
}

@media screen and (max-width: 768px) {
    .blog h1 {
        font-size: 39px;
        line-height: 39px;
        letter-spacing: .02em
    }
}

.blog p {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    margin: 0;
    font-style: normal;
    font-weight: 300
}

.blog-posts {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 95px 24px 125px;
    max-width: 1700px;
    margin: 0 auto 0;
    position: relative;
    z-index: 1;
    background: #fff
}

@media screen and (max-width: 768px) {
    .blog-posts {
        flex-direction: column;
        padding-top: 60px;
        padding-bottom: 50px
    }
}

@supports (display:grid) {
    .blog-posts {
        display: grid;
        grid-template-columns:repeat(auto-fill, calc(100% / 4 - 10px));
        grid-column-gap: 10px;
        grid-row-gap: 70px;
        justify-content: center
    }

    @media screen and (max-width: 1024px) {
        .blog-posts {
            grid-column-gap: 7px;
            grid-template-columns:repeat(auto-fill, calc(100% / 3 - 7px));
            grid-row-gap: 80px
        }
    }
    @media screen and (max-width: 768px) {
        .blog-posts {
            grid-row-gap: 40px;
            grid-template-columns:repeat(auto-fill, 100%);
            grid-column-gap: 0
        }
    }
}

.blog-posts__item {
    margin-bottom: 70px;
    width: calc(100% / 4 - 10px)
}

@supports (display:grid) {
    .blog-posts__item {
        margin-bottom: 0;
        width: 100%
    }
}

.blog-posts__image {
    width: 100%;
    height: auto
}

.blog-posts a {
    text-decoration: none
}

.blog-posts a:hover .blog-posts__link:before {
    opacity: .9
}

.blog-posts a:hover .blog-posts__link:after {
    opacity: 1
}

.blog-posts a:hover .blog-posts__title {
    color: #DCB428
}

.blog-posts__link {
    font-size: 0;
    line-height: 0;
    display: block;
    margin-bottom: 30px;
    position: relative;
    color: #DCB428
}

@media screen and (max-width: 1024px) {
    .blog-posts__link {
        margin-bottom: 25px
    }
}

.blog-posts__link:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: currentColor;
    opacity: 0;
    transition: all ease-in-out .2s
}

.blog-posts__link:after {
    content: "";
    display: block;
    position: absolute;
    right: 30px;
    top: 30px;
    background-image: url(../img/link_arrow.svg);
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
    opacity: 0;
    transition: all ease-in-out .2s
}

@media screen and (max-width: 768px) {
    .blog-posts__link:after {
        top: 20px;
        right: 20px;
        height: 37px;
        width: 37px;
        background-size: contain
    }
}
.blog-posts__link img{
    max-width:100%;
    height: auto;
}
.blog-posts__title {
    line-height: 26px;
    letter-spacing: .02em;
    margin: 0 0 15px;
    font-style: normal;
    font-weight: 700;
    font-size: 27px;
    color: #000
}

@media screen and (max-width: 1024px) {
    .blog-posts__title {
        font-size: 21px;
        line-height: 23px;
        letter-spacing: .03em
    }
}

.blog-posts__author {
    font-size: 18px;
    line-height: 21px;
    letter-spacing: .02em;
    font-weight: 100
}

.blog-posts__author span {
    margin-right: 15px
}

@media screen and (max-width: 1024px) {
    .blog-posts__author {
        display: flex;
        flex-direction: column;
        font-size: 16px;
        line-height: 18px;
        letter-spacing: .02em
    }
}

.awards {
    padding-top: 128px;
    padding-bottom: 235px;
    position: relative;
    z-index: 2
}

@media screen and (max-width: 1024px) {
    .awards {
        padding-top: 110px;
        padding-bottom: 130px
    }
}

@media screen and (max-width: 768px) {
    .awards {
        padding-top: 110px;
        padding-bottom: 50px
    }
}

.awards h1 {
    font-size: 72px;
    line-height: 56px;
    letter-spacing: .02em;
    margin: 0 0 60px;
    font-style: normal;
    font-weight: 700
}

@media screen and (max-width: 1024px) {
    .awards h1 {
        font-size: 54px;
        line-height: 56px;
        letter-spacing: .02em;
        margin-bottom: 20px
    }
}

@media screen and (max-width: 768px) {
    .awards h1 {
        font-size: 39px;
        line-height: 39px;
        letter-spacing: .02em
    }
}

.awards p {
    font-size: 20px;
    line-height: 23px;
    letter-spacing: .02em;
    margin: 0 0 20px
}

.awards-list {
    padding-bottom: 100px;
    background: #fff;
    position: relative;
    z-index: 2
}

@media screen and (max-width: 1024px) {
    .awards-list {
        padding-top: 50px
    }
}

.awards-list .row__items {
    border-bottom: 3px solid #c4c4c4;
    flex: 1 1 auto;
    padding-bottom: 45px
}

.awards-list .row__year {
    width: 100%;
    max-width: 215px;
    margin-top: 35px
}

@media screen and (max-width: 1024px) {
    .awards-list .row__year {
        max-width: 100px;
        margin-top: 0
    }
}

.awards-list .row__year span {
    font-style: normal;
    font-weight: 900;
    font-size: 72px;
    line-height: 56px;
    letter-spacing: .03em;
    color: #DCB428;
    border-bottom: 12px solid #DCB428
}

@media screen and (max-width: 1024px) {
    .awards-list .row__year span {
        font-size: 54px;
        line-height: 56px;
        letter-spacing: .02em
    }
}

@media screen and (max-width: 768px) {
    .awards-list .row__year span {
        font-size: 39px;
        margin-top: 0;
        line-height: 39px
    }
}

.awards-list .row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 120px
}

@media screen and (max-width: 768px) {
    .awards-list .row {
        flex-direction: column
    }

    .awards-list .row__year {
        margin-bottom: 70px
    }
}

.awards-list .row:first-child {
    margin-top: 0
}

.awards-list .row:last-child .row__items {
    border-bottom: none
}

.awards-list .name {
    font-style: normal;
    font-weight: 700;
    font-size: 36px;
    line-height: 36px;
    letter-spacing: .02em;
    font-feature-settings: 'ordn' on;
    max-width: 375px;
    width: 100%;
    padding-right: 20px;
    box-sizing: border-box
}

@media screen and (max-width: 1024px) {
    .awards-list .name {
        margin-bottom: 10px;
        font-size: 24px
    }
}

.awards-list .project {
    max-width: 610px;
    width: 100%
}

.awards-list .link {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 26px;
    opacity: .25
}

.awards-list .link:hover {
    opacity: 1
}

.awards-list .project_name {
    font-style: normal;
    font-weight: 700;
    font-size: 27px;
    line-height: 26px;
    letter-spacing: .02em;
    margin-bottom: 5px
}

@media screen and (max-width: 1024px) {
    .awards-list .project_name {
        font-size: 20px
    }
}

.awards-list .project_title {
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    line-height: 21px;
    letter-spacing: .02em
}

@media screen and (max-width: 1024px) {
    .awards-list .project_title {
        font-size: 16px
    }
}

.awards-list .awards-list-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    position: relative;
    max-width: 1065px;
    padding-right: 30px;
    box-sizing: border-box;
    border-top: 1px solid #f0f0f0;
    min-height: 120px
}

.awards-list .awards-list-item:first-child {
    border-top-color: transparent
}

.awards-list .awards-list-item:first-child {
    margin-top: 0
}

@media screen and (max-width: 768px) {
    .awards-list .awards-list-item {
        flex-direction: column;
        padding: 25px 0;
        align-items: flex-start
    }
}

.contacts {
    padding-top: 130px
}

@media screen and (max-width: 1024px) {
    .contacts {
        padding-top: 100px
    }
}

@media screen and (max-width: 768px) {
    .contacts {
        padding-top: 110px
    }
}

.contacts h1 {
    font-size: 72px;
    line-height: 56px;
    letter-spacing: .02em;
    color: #DCB428;
    font-style: normal;
    font-weight: 700;
    margin: 0 0 26px
}

@media screen and (max-width: 1024px) {
    .contacts h1 {
        font-size: 54px;
        line-height: 56px;
        letter-spacing: .02em;
        margin-bottom: 12px
    }
}

@media screen and (max-width: 768px) {
    .contacts h1 {
        font-size: 39px;
        line-height: 39px;
        margin-bottom: 25px;
        letter-spacing: .02em
    }
}

.contacts p {
    letter-spacing: .02em;
    margin: 0;
    font-style: normal;
    font-weight: 700;
    font-size: 27px;
    line-height: 21px
}

@media screen and (max-width: 1024px) {
    .contacts p {
        font-size: 21px;
        line-height: 23px;
        letter-spacing: .03em
    }
}

@media screen and (max-width: 768px) {
    .contacts p {
        font-size: 21px;
        line-height: 23px;
        letter-spacing: .03em
    }
}

.contacts p a {
    color: currentColor
}

.contacts p a:hover {
    text-decoration: none
}

.contacts-form {
    max-width: 1064px;
    margin: 75px auto 0
}

@media screen and (max-width: 1024px) {
    .contacts-form {
        margin-top: 95px;
        max-width: 780px
    }
}

@media screen and (max-width: 768px) {
    .contacts-form {
        margin-top: 15px
    }
}

.contacts-form form {
    display: flex;
    flex-direction: column
}

.contacts-form label {
    display: none
}

.contacts-form .drop-list-wrap {
    display: flex;
    flex-direction: column;
    padding: 20px 0
}

.contacts-form .form-button-select {
    border: none;
    margin: 0;
    padding: 0;
    width: auto;
    overflow: visible;
    background: 0 0;
    color: inherit;
    font: inherit;
    line-height: normal;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
    text-align: inherit;
    outline: 0;
    font-size: 21px;
    line-height: 26px;
    margin-bottom: 40px;
    font-weight: 500;
    cursor: pointer
}

.contacts-form .form-button-select::-moz-focus-inner {
    border: 0;
    padding: 0
}

.contacts-form .form-row {
    width: 100%;
    position: relative;
    border-bottom: 2px solid #DCB428;
    margin-bottom: 28px
}

.contacts-form .form-row.text-big {
    margin-top: 68px
}

.contacts-form .form-row .arrow {
    background: url(../img/arrow-dropdown.svg) center center no-repeat;
    position: absolute;
    right: 0;
    top: 25px;
    width: 21px;
    height: 11px
}

.contacts-form .form-row .arrow.open {
    transform: rotate(180deg)
}

.contacts-form .form-row.error {
    border-bottom-color: red;
    opacity: 1
}

.contacts-form .form-row:last-child {
    border-bottom: none;
    margin-bottom: 0;
    margin-top: 42px
}

.contacts-form .form-row label {
    position: absolute;
    left: 0;
    right: 0;
    top: 25px;
    margin: auto;
    font-size: 21px;
    font-weight: 500;
    transition: all ease-in-out .2s
}

.contacts-form .form-row input, .contacts-form .form-row textarea {
    width: 100%;
    background: 0 0;
    border: none;
    padding: 13px 0;
    font-size: 21px;
    font-weight: 500;
    box-sizing: border-box;
    resize: none
}

.contacts-form .form-row input::placeholder, .contacts-form .form-row textarea::placeholder {
    color: #000;
    transition: color ease-in-out .2s
}

.contacts-form .form-row input:focus::placeholder, .contacts-form .form-row textarea:focus::placeholder {
    color: rgba(0, 0, 0, .5)
}

.contacts-form .form-row input[readonly], .contacts-form .form-row textarea[readonly] {
    color: #000
}

.contacts-form .form-row input[readonly]::placeholder, .contacts-form .form-row textarea[readonly]::placeholder {
    color: #000
}

.contacts-form .form-row input[readonly].open::placeholder, .contacts-form .form-row textarea[readonly].open::placeholder {
    color: rgba(0, 0, 0, .5)
}

.contacts-form .form-row input:focus, .contacts-form .form-row textarea:focus {
    outline: 0
}

.contacts-form .form-row input:focus + label, .contacts-form .form-row textarea:focus + label {
    font-size: 14px;
    top: 5px
}

.contacts-form .form-row input.not-empty + label, .contacts-form .form-row textarea.not-empty + label {
    font-size: 14px;
    top: 5px
}

.contacts-form .form-row input.error, .contacts-form .form-row textarea.error {
    color: red
}

.contacts-form .form-row input.error::placeholder, .contacts-form .form-row textarea.error::placeholder {
    color: red
}

.contacts-form .form-row textarea {
    min-height: 52px
}

.contacts-form .attached_file {
    font-style: normal;
    font-weight: 500;
    font-size: 21px;
    line-height: 26px;
    position: relative;
    padding-right: 20px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 250px
}

.contacts-form .attached_file button {
    border: none;
    margin: 0;
    padding: 0;
    width: auto;
    overflow: visible;
    background: 0 0;
    color: inherit;
    font: inherit;
    line-height: normal;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
    text-align: inherit;
    outline: 0;
    background: url(../img/attach.svg) center center no-repeat;
    height: 18px;
    width: 18px;
    font-size: 0;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    transform: rotate(45deg)
}

.contacts-form .attached_file button::-moz-focus-inner {
    border: 0;
    padding: 0
}

.contacts-form .file-wrapper {
    margin-bottom: 57px
}

.contacts-form .file-wrapper #file {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    opacity: 0
}

.contacts-form .file-wrapper span {
    font-size: 21px;
    line-height: 26px;
    font-weight: 500;
    padding-left: 35px;
    padding-top: 6px;
    padding-bottom: 6px;
    display: block;
    position: relative
}

.contacts-form .file-wrapper span:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    background: url(../img/attach.svg) center center no-repeat;
    height: 18px;
    width: 18px;
    margin: auto
}

.slide-enter-active {
    -moz-transition-duration: .3s;
    -webkit-transition-duration: .3s;
    -o-transition-duration: .3s;
    transition-duration: .3s;
    -moz-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in
}

.slide-leave-active {
    -moz-transition-duration: .3s;
    -webkit-transition-duration: .3s;
    -o-transition-duration: .3s;
    transition-duration: .3s;
    -moz-transition-timing-function: cubic-bezier(0, 1, .5, 1);
    -webkit-transition-timing-function: cubic-bezier(0, 1, .5, 1);
    -o-transition-timing-function: cubic-bezier(0, 1, .5, 1);
    transition-timing-function: cubic-bezier(0, 1, .5, 1)
}

.slide-enter-to, .slide-leave {
    max-height: 100px;
    overflow: hidden
}

.slide-enter, .slide-leave-to {
    overflow: hidden;
    max-height: 0
}

.contact-form-note {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    max-width: 1064px;
    padding: 0 25px;
    margin-top: 10px;
    margin-bottom: 35px
}

.contact-form-note .note-label {
    position: relative;
    box-sizing: border-box;
    min-width: 430px;
    width: 100%;
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    line-height: 21px
}

.contact-form-note .note-helper {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 28px;
    width: 28px;
    display: block;
    background: url(../img/help.svg) center center no-repeat;
    cursor: pointer
}

.contact-form-note .note-helper.hover + .note-message {
    opacity: 1
}

.contact-form-note .note-message-content {
    position: relative;
    padding-left: 50px
}

.contact-form-note .note-message {
    opacity: 0;
    transition: opacity ease-in-out .2s;
    background: #f6f6f6;
    padding: 15px 20px;
    box-sizing: border-box;
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 18px;
    display: flex;
    align-items: center;
    letter-spacing: .02em
}

@media screen and (max-width: 1024px) {
    .contact-form-note {
        display: block;
        margin-top: 55px
    }

    .contact-form-note .note-message-content {
        padding-left: 0
    }

    .contact-form-note .note-label {
        width: auto;
        min-width: auto;
        display: inline-block;
        position: relative;
        padding-right: 50px
    }

    .contact-form-note .note-label:after {
        content: "";
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        height: 28px;
        width: 28px;
        display: block;
        background: url(../img/help.svg) center center no-repeat
    }

    .contact-form-note .note-helper {
        display: none
    }

    .contact-form-note .note-message {
        opacity: 1;
        background: #fff;
        padding-left: 0
    }
}

.fade-enter-active, .fade-leave-active {
    transition: opacity .5s
}

.fade-enter, .fade-leave-to {
    opacity: 0
}

.dir-wr {
    position: relative;
    z-index: 2;
    background: #fff;
    padding: 0 12px
}

@media screen and (max-width: 768px) {
    .dir-wr {
        padding: 0
    }
}

.dir-word {
    background: #f6f6f6;
    padding: 0 24px;
    margin-bottom: 5px
}

.dir-word .container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 45px 0;
    align-items: flex-start
}

@media screen and (max-width: 768px) {
    .dir-word .container {
        flex-direction: column;
        padding: 25px 0
    }
}

.dir-word .photo {
    max-width: 310px;
    min-width: 310px;
    font-size: 0
}

@media screen and (max-width: 1024px) {
    .dir-word .photo {
        min-width: 226px;
        max-width: 226px
    }
}

@media screen and (max-width: 768px) {
    .dir-word .photo {
        max-width: none
    }
}

.dir-word .photo img {
    max-width: 100%;
    height: auto
}

.dir-word .dir-note {
    font-size: 27px;
    line-height: 32px;
    font-style: italic;
    padding-left: 60px;
    padding-top: 40px;
    margin-bottom: 65px;
    font-weight: 600;
    display: flex;
    align-items: center
}

@media screen and (max-width: 1024px) {
    .dir-word .dir-note {
        font-size: 21px;
        line-height: 25px;
        padding-left: 50px;
        padding-top: 30px;
        margin-bottom: 65px
    }
}

@media screen and (max-width: 768px) {
    .dir-word .dir-note {
        font-size: 18px;
        line-height: 21px;
        padding-left: 0;
        margin-bottom: 35px;
        padding-top: 45px
    }
}

.dir-word .author {
    text-align: right;
    font-size: 21px;
    line-height: 24px;
    font-style: normal;
    font-weight: 300
}

@media screen and (max-width: 1024px) {
    .dir-word .author {
        font-size: 18px;
        line-height: 21px
    }
}

.dir-word .author b {
    font-size: 27px;
    line-height: 33px;
    font-style: normal;
    font-weight: 700
}

@media screen and (max-width: 1024px) {
    .dir-word .author b {
        font-size: 21px;
        line-height: 25px
    }
}

.contact-success {
    width: 100%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    display: flex;
    flex-direction: column
}

@media screen and (max-width: 768px) {
    .contact-success {
        padding-top: 125px
    }
}

.contact-success .stretch {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.contact-success .success-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    max-height: 400px;
    height: 100%
}

.contact-success .container {
    width: 100%
}

.contact-success h1 {
    font-style: normal;
    font-weight: 700;
    font-size: 72px;
    line-height: 56px;
    color: #DCB428;
    margin: 0 0 40px;
    letter-spacing: .02em
}

@media screen and (max-width: 1024px) {
    .contact-success h1 {
        font-size: 54px;
        line-height: 56px
    }
}

@media screen and (max-width: 768px) {
    .contact-success h1 {
        font-size: 39px;
        line-height: 39px
    }
}

@media screen and (max-width: 768px) {
    .contact-success .link-underline {
        display: none
    }
}

.contact-success p {
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 26px;
    margin: 0 0 50px
}

@media screen and (max-width: 1024px) {
    .contact-success p {
        font-size: 21px;
        line-height: 23px
    }
}

@media screen and (max-width: 768px) {
    .contact-success p {
        font-size: 21px;
        line-height: 23px;
        letter-spacing: .03em;
        margin-bottom: 0
    }
}

.contact-success .soc-network p {
    margin-bottom: 20px
}

@media screen and (max-width: 768px) {
    .contact-success .soc-network p {
        margin-bottom: 25px
    }
}

.contact-success .footer__links {
    margin-bottom: 0
}

.page-nav {
    background: #c4c4c4
}

.page-nav .container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 40px 107px;
    max-width: 100%
}

@media screen and (max-width: 1024px) {
    .page-nav .container {
        padding-left: 43px;
        padding-right: 43px
    }
}

@media screen and (max-width: 768px) {
    .page-nav .container {
        padding: 27px 20px
    }
}

.page-nav a {
    display: inline-block;
    color: #000;
    text-decoration: none;
    transition: color ease-in-out .2s;
    position: relative;
    max-width: 250px;
    white-space: nowrap
}

.page-nav a.arrow_link {
    padding: 0 50px
}

.page-nav a .arrow_p {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto
}

.page-nav a .arrow_p.left {
    left: 0
}

.page-nav a .arrow_p.right {
    right: 0
}

.page-nav a path, .page-nav a rect {
    fill: currentColor
}

.page-nav a:hover {
    color: #DCB428
}

.page-nav a span {
    display: block;
    font-style: normal;
    font-weight: 600;
    font-size: 12px;
    line-height: 14px;
    letter-spacing: .04em
}

@media screen and (max-width: 768px) {
    .page-nav a span {
        display: none
    }
}

.page-nav a b {
    display: block;
    font-style: normal;
    font-weight: 700;
    font-size: 18px;
    line-height: 22px;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis
}

@media screen and (max-width: 768px) {
    .page-nav a b {
        display: none
    }
}

.project-home {
    position: relative
}

.project-home:before {
    content: "";
    display: block;
    background: currentColor;
    opacity: var(--opacity);
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    transition: opacity linear 0s;
    z-index: 1
}

.project-home .background {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    height: 100vh;
    z-index: 0
}

@media screen and (max-width: 768px) {
    .project-home .background {
        bottom: -69px
    }
}

.project-home > .container {
    position: relative;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.project-home__title {
    font-size: 100px;
    line-height: 80px;
    color: #fff;
    font-weight: 800;
    margin: 0;
    bottom: 62px
}

@media screen and (max-width: 1024px) {
    .project-home__title {
        font-size: 64px;
        line-height: 60px
    }
}

@media screen and (max-width: 768px) {
    .project-home__title {
        font-size: 36px;
        line-height: 30px
    }
}

.header-subtitle {
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 26px;
    letter-spacing: .02em;
    color: #fff;
    margin-top: 32px;
    margin-bottom: 0
}

@media screen and (max-width: 768px) {
    .header-subtitle {
        font-weight: 600;
        font-size: 20px;
        line-height: 26px;
        letter-spacing: .02em
    }
}

.post-header {
    width: 100%;
    position: relative;
    color: #DCB428;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100)
}

.post-header .background {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 0
}

@media screen and (max-width: 768px) {
    .post-header .background {
        bottom: -69px
    }
}

.post-header .container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    position: relative;
    z-index: 1
}

.post-header:before {
    content: "";
    display: block;
    background: currentColor;
    opacity: var(--opacity);
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    transition: opacity linear 0s;
    z-index: 1
}

.post-header__title {
    font-family: Gilroy, sans-serif;
    font-size: 60px;
    line-height: 100%;
    color: #fff;
    margin: 0 0 65px;
    font-weight: 800
}

.post-header__title * {
    margin: 0
}

.post-header__title.bottom {
    font-size: 72px;
    letter-spacing: .02em;
    margin: 0;
    font-style: normal;
    font-weight: 700;
    line-height: 56px
}

@media screen and (max-width: 1024px) {
    .post-header__title.bottom {
        font-size: 54px;
        line-height: 56px
    }
}

@media screen and (max-width: 768px) {
    .post-header__title.bottom {
        font-size: 39px;
        line-height: 39px
    }
}

.page-404 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: url(../img/page404.png) center center no-repeat;
    background-size: cover;
    align-items: center;
    color: #fff;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    position: relative
}

.page-404:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 0;
    background: #000;
    opacity: .75
}

.page-404 h1 {
    font-style: normal;
    font-weight: 800;
    font-size: 120px;
    text-align: center;
    letter-spacing: .02em;
    margin: 0 0 12px;
    position: relative;
    z-index: 1
}

.page-404 p {
    font-weight: 600;
    font-size: 26px;
    text-align: center;
    letter-spacing: .02em;
    text-transform: uppercase;
    margin: 0 0 55px;
    position: relative;
    z-index: 1
}

.page-404 a {
    position: relative;
    z-index: 1
}

.services__item {
    position: relative
}

.services__item a {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: block;
    z-index: 2;
}

.services__item:hover .link-underline:after {
    opacity: 1;
    cursor: pointer
}

.menu-copy .footer__links {
    margin-bottom: 40px
}

.menu-copy .footer__text__link path {
    fill: #fff;
    transition: opacity ease-in-out .2s
}

.menu-copy .footer__text__link:hover path {
    opacity: .8
}

.header__contact {
    font-size: 0;
    line-height: 0;
    transition: ease-in-out .2s opacity
}

.header__contact:hover {
    opacity: .7
}

.header__lang a, .header__lang button {
    border: none;
    margin: 0;
    overflow: visible;
    background: 0 0;
    color: inherit;
    font: inherit;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
    text-decoration: none;
    outline: 0;
    font-size: 15px;
    line-height: 18px;
    letter-spacing: .06em;
    text-transform: uppercase;
    box-sizing: border-box;
    display: block;
    width: 100%;
    vertical-align: top;
    text-align: right;
    transition: color ease-in-out .2s;
    cursor: pointer;
    font-family: Gilroy, sans-serif;
    font-weight: 700;
    white-space: nowrap;
    color: rgba(255, 255, 255, .5)
}

.header__lang {
    padding-right: 28px;
    position: relative;
    margin-right: 16px
}

.header__lang a:hover {
    color: #fff
}

.header__lang a:first-child {
    color: #fff
}

.header__lang .lang_toggle {
    position: absolute;
    right: 0;
    top: -6px;
    width: 22px;
    padding: 0
}

.header__lang .lang_toggle svg {
    transition: transform ease-in-out .2s;
    transform-origin: center
}

.header__lang .lang_toggle path {
    transition: fill-opacity ease-in-out .2s
}

.header__lang .lang_toggle:hover path {
    fill-opacity: 1
}

.header__lang a:nth-child(2) {
    position: absolute;
    right: 100%;
    top: 0;
    padding-right: 6px;
    visibility: hidden;
    transition: ease-in-out all .2s
}

.header__lang.open a:nth-child(2) {
    visibility: visible
}

.header__lang.open .lang_toggle svg {
    transform: rotate(90deg) translateX(3px)
}

.header__lang.open .lang_toggle path {
    fill-opacity: 1
}

.header.fixed .header__contact path {
    fill: #DCB428
}

.header.fixed .header__lang path {
    fill: #d6b003
}

.header.fixed .header__lang a {
    color: rgba(254, 209, 46, .5)
}

.header.fixed .header__lang a:hover {
    color: #DCB428
}

.header.fixed .header__lang a:first-child {
    color: #DCB428
}

@media screen and (max-width: 1024px) and (min-width: 768px) {
    .header__lang {
        margin-right: 0
    }
}

@media screen and (max-width: 768px) {
    .header__lang {
        margin-right: 0
    }

    .header__menu {
        margin-left: 18px
    }
}

.seo-drop-down {
    position: relative;
    z-index: 1;
    background: #fff
}

.seo-drop-down .hidden {
    display: none
}

.slide-enter-active {
    -moz-transition-duration: .3s;
    -webkit-transition-duration: .3s;
    -o-transition-duration: .3s;
    transition-duration: .3s;
    -moz-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in
}

.slide-leave-active {
    -moz-transition-duration: .3s;
    -webkit-transition-duration: .3s;
    -o-transition-duration: .3s;
    transition-duration: .3s;
    -moz-transition-timing-function: cubic-bezier(0, 1, .5, 1);
    -webkit-transition-timing-function: cubic-bezier(0, 1, .5, 1);
    -o-transition-timing-function: cubic-bezier(0, 1, .5, 1);
    transition-timing-function: cubic-bezier(0, 1, .5, 1)
}

.slide-enter-to, .slide-leave {
    max-height: 1000px;
    overflow: hidden
}

.slide-enter, .slide-leave-to {
    overflow: hidden;
    max-height: 0
}

.seo-drop-down .text {
    padding-bottom: 0
}

.seo-drop-down .text * {
    max-width: 1065px
}

.btn.btn-drop-down {
    padding: 0;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 21px;
    text-align: left;
    color: #DCB428;
    text-transform: inherit;
    letter-spacing: 0
}

.btn .rotate {
    transform: rotate(180deg)
}

.page-content {
    position: relative;
    z-index: 2;
    background: #fff
}

.bread-crumbs {
    position: absolute;
    left: 0;
    right: 0;
    top: 85px;
    z-index: 3;
    font-size: 14px;
    line-height: 14px;
    letter-spacing: .02em
}

@media screen and (max-width: 768px) {
    .bread-crumbs {
        top: 75px;
        font-size: 12px;
        line-height: 12px;
        letter-spacing: .02em
    }
}

@media screen and (max-width: 1024px) {
    .bread-crumbs {
        top: 75px
    }
}

.bread-crumbs a {
    color: #000;
    opacity: .5;
    text-decoration: none;
    transition: opacity ease-in-out .2s
}

.bread-crumbs a:hover {
    opacity: 1
}

.bread-crumbs .kb_sep {
    color: #000;
    opacity: .15
}

.bread-crumbs .kb_title {
    color: #000
}

.bread-crumbs.second {
    color: #fff
}

.bread-crumbs.second a {
    color: #fff;
    opacity: .75;
    text-decoration: none;
    transition: opacity ease-in-out .2s
}

.bread-crumbs.second a:hover {
    opacity: 1
}

.bread-crumbs.second .kb_sep {
    color: #fff;
    opacity: .35
}

.bread-crumbs.second .kb_title {
    color: #fff
}

.projects.revert {
    margin-top: 12px;
    justify-content: flex-end
}

.revert .big .item-content {
    left: 0;
    right: 0
}

.revert .item.sm:nth-child(2) .item-content {
    left: 12px;
    bottom: 6px;
    right: 6px
}

.revert .item.sm:nth-child(4) .item-content {
    top: 6px;
    right: 6px;
    left: 12px
}

.revert .item.sm:nth-child(3) .item-content {
    left: 6px;
    bottom: 6px;
    right: 0
}

.revert .item.sm:nth-child(5) .item-content {
    top: 6px;
    right: 0;
    left: 6px
}

@media screen and (max-width: 1024px) {
    .revert .big {
        margin-bottom: 6px
    }

    .revert .big .item-content {
        left: 0;
        top: 0
    }

    .revert .item.sm:nth-child(2) .item-content {
        left: 0
    }

    .revert .item.sm:nth-child(4) .item-content {
        left: 0
    }
}

@media screen and (max-width: 768px) {
    .projects.revert {
        margin-top: 0
    }

    .revert .big {
        margin-bottom: 0
    }

    .revert .item.sm .item-content {
        left: 0 !important;
        right: 0 !important;
        top: 0 !important;
        bottom: 6px !important
    }
}

.last-project {
    position: absolute;
    right: 70px;
    bottom: 40px;
    width: 200px;
    z-index: 2;
    max-height: 110px;
    transition: opacity ease-in-out .2s
}

.last-project:hover {
    opacity: .5
}

.last-project img {
    width: 100%;
    height: auto
}

@media screen and (max-width: 768px) {
    .last-project {
        width: 240px;
        max-height: 88px;
        right: auto;
        left: 24px;
        overflow: hidden;
        bottom: 20px
    }
}

.hp-contact + .works-list {
    padding-top: 100px;
    padding-bottom: 100px
}

@media screen and (max-width: 768px) {
    .hp-contact + .works-list {
        padding-top: 50px;
        padding-bottom: 50px
    }
}

.random-services {
    padding-top: 30px;
    padding-bottom: 100px
}

@media screen and (max-width: 768px) {
    .random-services {
        padding-top: 0;
        padding-bottom: 50px
    }
}

.video {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    background-color: #000
}

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

.video__media {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none
}

.video__button {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    display: none;
    padding: 0;
    width: 68px;
    height: 48px;
    border: none;
    background-color: transparent;
    transform: translate(-50%, -50%);
    cursor: pointer
}

.video__button-shape {
    fill: #212121;
    fill-opacity: .8
}

.video__button-icon {
    fill: #fff
}

.video__button:focus {
    outline: 0
}

.video:hover .video__button-shape, .video__button:focus .video__button-shape {
    fill: red;
    fill-opacity: 1
}

.video--enabled {
    cursor: pointer
}

.video--enabled .video__button {
    display: block
}

.blog-posts + .hp-contact, .random-services + .hp-contact, .works-list + .hp-contact {
    background: #f6f6f6;
    padding-top: 100px
}

.preloader {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    text-align: center;
    z-index: 999999;
    background: #0027DA;
    transition: opacity ease-in-out .3s;
}

.preloader img {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
}

.hp-feedback {
    position: relative;
    z-index: 2;
    background: #fff
}

.hp-feedback h2 {
    font-size: 42px;
    line-height: 36px;
    letter-spacing: .02em;
    font-feature-settings: "ordn" on;
    margin-bottom: 40px;
    margin-top: 0;
    font-style: normal;
    font-weight: 800
}

.hp-feedback__slides {
    display: flex;
    flex-direction: row
}

.hp-feedback__slides .hp-feedback__logo {
    max-width: 280px;
    height: auto;
    margin-bottom: 15px
}

.hp-feedback__slides .hp-feedback__logo img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center
}

.hp-feedback__slides .hp-feedback__text p {
    font-weight: 300;
    font-size: 20px;
    line-height: 23px;
    text-align: center;
    letter-spacing: .02em
}

.hp-feedback__slides .hp-feedback__text p:first-child {
    margin-top: 0
}

.hp-feedback__slides .hp-feedback__text p:last-child {
    margin-bottom: 0
}

.hp-feedback__slides .hp-feedback__name {
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    letter-spacing: .04em;
    margin-bottom: 8px
}

.hp-feedback__slides .hp-feedback__post {
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 15px;
    text-align: center;
    letter-spacing: .04em
}

.hp-feedback__slide .hp-feedback__text {
    flex: 1 1 auto;
    margin-bottom: 75px;
    padding-left: 100px;
    padding-right: 100px
}

.hp-feedback__slides .hp-feedback__slide {
    display: flex !important;
    flex-direction: column;
    align-items: center
}

.hp-feedback .slider-button {
    border: none;
    margin: 0;
    padding: 0;
    width: auto;
    overflow: visible;
    background: 0 0;
    color: inherit;
    font: inherit;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
    text-align: inherit;
    outline: 0;
    cursor: pointer;
    font-size: 16px;
    transition: all ease-in-out .2s;
    min-height: 26px;
    font-style: normal;
    line-height: 19px;
    white-space: nowrap;
    text-decoration: none
}

.hp-feedback button::-moz-focus-inner {
    border: 0;
    padding: 0
}

.hp-feedback .slider-button {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 26px;
    width: 15px;
    transform: translateY(65px);
    opacity: .25;
    transition: opacity ease-in-out .2s;
    z-index: 1
}

.hp-feedback .slider-button:hover {
    opacity: 1
}

.hp-feedback .slider-button.prev {
    left: 25px
}

.hp-feedback .slider-button.next {
    right: 25px
}

.hp-feedback .slider-button svg path {
    fill: #000
}

.hp-feedback .slider-button svg:hover path {
    fill: #000;
    opacity: 1
}

.hp-feedback .slider-button[disabled] {
    cursor: auto;
    opacity: .25
}

.hp-feedback .slider-button[disabled] svg path {
    fill: #000
}

.hp-feedback .container {
    position: relative
}

.hp-feedback-wrap {
    background: #f6f6f6
}

.hp-feedback .tns-nav {
    position: absolute;
    left: 25px;
    right: 25px;
    bottom: -85px;
    background: rgba(208, 208, 208, .25);
    display: flex;
    flex-wrap: nowrap
}

.hp-feedback .tns-nav:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: 0 0
}

.hp-feedback .tns-nav button {
    flex: 1 1 auto;
    border: none;
    height: 10px
}

.hp-feedback .tns-nav button.tns-nav-active {
    background: #000
}

.hp-feedback {
    padding-bottom: 100px
}

.hp-feedback-wrap {
    padding: 100px 0
}

@media screen and (max-width: 768px) {
    .hp-feedback {
        padding-top: 65px;
        padding-bottom: 50px
    }

    .hp-feedback .slider-button {
        display: none
    }

    .hp-feedback h2 {
        font-style: normal;
        font-weight: 700;
        font-size: 30px;
        line-height: 30px;
        letter-spacing: .02em;
        margin-bottom: 40px
    }

    .hp-feedback__slides .hp-feedback__text p {
        font-style: normal;
        font-weight: 300;
        font-size: 20px;
        line-height: 23px;
        text-align: center;
        letter-spacing: .02em
    }

    .hp-feedback__slides .hp-feedback__name {
        font-style: normal;
        font-weight: 700;
        font-size: 20px;
        line-height: 24px;
        text-align: center;
        letter-spacing: .04em
    }

    .hp-feedback__slides .hp-feedback__post {
        font-style: normal;
        font-weight: 400;
        font-size: 13px;
        line-height: 15px;
        text-align: center;
        letter-spacing: .04em
    }

    .hp-feedback__slide .hp-feedback__text {
        margin-bottom: 40px;
        padding-left: 0;
        padding-right: 0
    }

    .hp-feedback .tns-nav {
        left: 0;
        right: 0
    }
}

.video {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    background-color: #000
}

.video__button, .video__link, .video__media {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.video__button, .video__media {
    border: 0
}

.video__button {
    top: 50%;
    left: 50%;
    z-index: 1;
    display: none;
    padding: 0;
    width: 68px;
    height: 48px;
    background-color: transparent;
    transform: translate(-50%, -50%);
    cursor: pointer
}

.video__button-shape {
    fill: #212121;
    fill-opacity: .8
}

.video__button-icon {
    fill: #fff
}

.video__button:focus {
    outline: 0
}

.video:hover .video__button-shape, .video__button:focus .video__button-shape {
    fill: red;
    fill-opacity: 1
}

.video--enabled {
    cursor: pointer
}

.video--enabled .video__button {
    display: block
}

figure {
    margin: 0;
}

.bg-container {
    padding: 80px 0 100px;
    margin-bottom: 14px;
}

.bg-container p {
    line-height: 25px;
    margin: 0 0 25px;
    max-width: 850px;
    font-size: 20px;
}

.text .format, .bg-container .format {
    font-style: normal;
    font-weight: 300;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

@media screen and (max-width: 768px) {
    .bg-container {
        padding: 40px 0 50px;
        margin-bottom: 5px;
    }

    .text .format, .bg-container .format {
        font-size: 24px;
    }
}

.prj-pg h2, .prj-pg a {
    color: currentColor;
}

.one-image video {
    width: 100%;
    height: auto;
}

.blog_image .one-image img {
    width: 100%;
}

.text .text-main-content {
    width: 100%;
}

.text .text-main-content img {
    width: 100%;
}

.works__category a, .works__category button {
    border: 0;
    margin: 0;
    padding: 0;
    width: auto;
    overflow: visible;
    background: 0 0;
    color: inherit;
    font: inherit;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
    text-align: inherit;
    outline: 0;
    cursor: pointer;
    font-size: 16px;
    transition: all ease-in-out .2s;
    min-height: 26px;
    font-style: normal;
    line-height: 19px;
    white-space: nowrap;
    text-decoration: none
}

.works__category a.active, .works__category button.active {
    font-size: 16px;
    color: #DCB428;
    font-style: normal;
    line-height: 19px
}

.works__category a:after, .works__category button:after {
    display: block;
    content: attr(title);
    height: 0;
    overflow: hidden;
    visibility: hidden;
    font-weight: 700
}

.services__item:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 0;
    background: #0027DA;
    left: -5px;
    top: -5px;
    right: -5px;
    bottom: -25px;
    opacity: 0;
    transition: all ease-in-out .2s;
}

.services__item:hover:before {
    opacity: 1;
}

.services__item:hover .services__icon img {
    background: #fff;
}

.services__item:hover .services__name, .services__item:hover .services__icon, .services__item:hover p {
    color: #fff;
    position: relative;
    z-index: 1;
}

.services__item:hover .services__name, .services__item:hover .link-underline.blue, .services__item:hover p {
    color: #fff;
}

.services__item:hover .link-underline.blue:after {
    background: url('../img/link-arrow-white.svg') center center no-repeat;
    color: #fff;
}

.new-text:not(:first-child) {
    padding-top: 0;
}

.image-service {
    padding: 40px 0 20px;
}

@media screen and (max-width: 1024px) {
    .footer__content {
        display: grid;
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .footer__content-right {
        width: 100%;
        justify-content: space-between;
    }

    .footer__menu {
        display: block;
    }
}

@media screen and (max-width: 768px) {

    .footer__content {
        flex-direction: column;
    }

    .footer__logo {
        display: block;
    }

    .footer__menu {
        display: block;
    }

    .footer__content-right {
        flex-direction: column;
    }

    .footer .column-menu {
        grid-template-columns: 1fr;
    }
}

html {
    padding-bottom: 0 !important;
}

.footer {
    position: relative;
}

.new-menu .menu-overlay {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(255, 255, 255, .9);
    height: 100vh;
    overflow: hidden;
    z-index: 1;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

.new-menu .menu-container {
    width: 50%;
    display: flex;
    flex-direction: column;
    background: #DCB428;
}

.new-menu .menu-header {
    height: 84px;
    min-height: 84px;
}

.new-menu .menu-footer {
    height: 84px;
    background: #FFFFFF;
    padding-left: 115px;
    padding-right: 36px;
}

.new-menu .menu-footer .footer__text {
    max-width: 400px;
}

.new-menu .menu-footer .footer__copy span {
    color: #323232;
}

.new-menu .menu-content {
    overflow: auto;
    padding: 0 36px 0 115px;
    margin: 16px 0;
    height: 100%;
}

.new-menu .menu-content svg {
    display: none;
}

.new-menu .menu-content .menu-item-has-children > svg {
    display: inline-block;
    vertical-align: middle;
    transform: translateY(-3px);
    margin-left: 10px;
    transition: all ease-in-out .2s;
    cursor: pointer;
}

.new-menu .menu-dropdown {
    margin: 0;
    padding: 0;
}

.new-menu .menu-dropdown li {
    list-style: none;
}

.new-menu .menu-dropdown > li:not(:first-child) {
    margin-top: 20px;
}

.new-menu .menu-dropdown li > a {
    font-weight: 700;
    font-size: 30px;
    line-height: 100%;
    letter-spacing: 0.005em;
    color: #FFFFFF;
    text-decoration: none;
}

.new-menu .sub-menu {
    max-height: 0;
    overflow: hidden;
    transition: max-height ease-in-out .4s;
}

.new-menu .menu-item:not(.menu-item-has-children) {
    transition: opacity ease-in-out .2s;
}

.new-menu .menu-item:not(.menu-item-has-children):hover {
    opacity: .6;
}

.new-menu .menu-content .open-subnav.menu-item-has-children > svg {
    transform: rotate(180deg) translateY(3px);
}

.new-menu .open-subnav .sub-menu {
    max-height: 1000px;
}

.new-menu .sub-menu {
    padding-left: 0;
}

.new-menu .sub-menu li {
    margin-top: 12px;
}

.new-menu .menu-dropdown .sub-menu li > a {
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.005em;
    color: #FFFFFF;
}

.new-menu .sub-menu:hover li {
    opacity: .6;
    transition: opacity ease-in-out .2s;
}

.new-menu .sub-menu:hover li:hover {
    opacity: 1;
}

html.modal-open {
    overflow: hidden;
}

@media screen and (max-width: 980px) {
    .new-menu .menu-content {
        padding: 0 24px 0 24px;
        margin: 100px 0;
        margin-right:47px;
    }

    .new-menu .menu-container {
        width: calc(100% - 20px);
    }

    .new-menu .menu-dropdown li > a {
        font-weight: 700;
        font-size: 24px;
        line-height: 100%;
    }

    .new-menu .menu-footer {
        height: auto;
        padding-left: 24px;
        padding-right: 24px;
    }

}

@media screen and (max-width: 768px) {
    .new-menu .menu-footer .footer__links {
        margin-bottom: 24px;
    }

    .new-menu .menu-header {
        min-height: 50px;
    }

    .new-menu .menu-content {
        padding: 0 24px 0 24px;
        margin: 25px 0;
    }

}

.hp-services .services.services-slider {
    display: block;
}

.services-slider .services-item {
    position: relative;
    width: 100%;
    border: none;
    background: #fff;
    max-width: 100%;
}

.services-slider .services-item .services-item__link {
    padding: 40px 24px;
}

.services-slider .services-item p {
    line-height: 16px;
}


.services-slider .services-item .services-item__name {
    color: #DCB428;
    padding: 0;
    margin-bottom: 40px;
    min-height: 64px;
}

.services-slider .services-item .services-item__text {
    display: block;
    opacity: 1;
    font-size: 14px;
    line-height: 18px;
    padding: 0 0 25px;
}

.services-slider .services-item .fake-link {
    position: absolute;
    font-weight: 600;
    font-size: 16px;
    line-height: 100%;
    opacity: 0;
    letter-spacing: 0.005em;
    color: #DCB428;
    transition: opacity ease-in-out .2s;
    padding: 10px 24px 40px;
    left: 0;
    bottom: 0;
    background: #fff;
}

.services-slider .services-item:hover .fake-link {
    opacity: 1;
}


.services-slider .slider-button {
    border: none;
    margin: 0;
    padding: 0;
    width: auto;
    overflow: visible;
    background: 0 0;
    color: inherit;
    font: inherit;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
    text-align: inherit;
    outline: 0;
    cursor: pointer;
    font-size: 16px;
    transition: all ease-in-out .2s;
    min-height: 26px;
    font-style: normal;
    line-height: 19px;
    white-space: nowrap;
    text-decoration: none
}

.services-slider button::-moz-focus-inner {
    border: 0;
    padding: 0
}

.services-slider .slider-button {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 26px;
    width: 15px;
    opacity: .25;
    transition: opacity ease-in-out .2s;
    z-index: 1
}

.services-slider .slider-button:hover {
    opacity: 1
}

.services-slider .slider-button.prev {
    left: -60px
}

.services-slider .slider-button.next {
    right: -60px
}

.services-slider .slider-button svg path {
    fill: #fff
}

.services-slider .slider-button svg:hover path {
    fill: #fff;
    opacity: 1
}

.services-slider .slider-button[disabled] {
    cursor: auto;
    opacity: .25
}

.services-slider .slider-button[disabled] svg path {
    fill: #fff
}

@media screen and (max-width: 1110px) {
    .services-slider .services-item .services-item__name {
        margin-bottom: 16px;
    }
}

@media screen and (max-width: 980px) {
    .services-slider .services-item .services-item__link {
        padding: 20px;
    }

    .services-slider .services-item .fake-link {
        opacity: 1;
        padding: 20px;
    }

    .services-slider .services-item .services-item__name {
        font-size: 16px;
        min-height: 40px;
    }
}

.services-slider .tns-outer {
    display: flex;
    flex-direction: column;
}

.services-slider .tns-nav {
    left: 0;
    right: 0;
    margin-top: 25px;
    background: rgba(217, 217, 217, 0.2);
    display: flex;
    flex-wrap: nowrap;
    order: 3;
}

.services-slider .tns-nav:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: 0 0
}

.services-slider .tns-nav button {
    flex: 1 1 auto;
    border: none;
    height: 10px;
    background: transparent;
}

.services-slider .tns-nav button.tns-nav-active {
    background: #FFFFFF
}


.person-page {
    padding-top: 128px;
    z-index: 2;
    background: #fff;
    padding-bottom: 60px;
}

.person-page *:last-child {
    margin-bottom: 0;
}

.person-page picture {
    font-size: 0;
    line-height: 0;
    margin: 60px 0;
    display: block;
}

.person-page img {
    max-width: 100%;
    height: auto;
}

.person-page__row {
    display: grid;
    grid-template-columns: 30% 70%;
}

.person-page__row:not(:last-child) {
    margin-bottom: 60px;
}

.person-page h1 {
    font-weight: 700;
    font-size: 72px;
    line-height: 100%;
    letter-spacing: 0.005em;
    color: #DCB428;
    margin: 0 0 40px;
}

.person-page h2 {
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0.005em;
    color: #DCB428;
    margin-bottom: 20px;
}

.person-page p {
    font-weight: 300;
    font-size: 16px;
    line-height: 130%;
}

.person-page .bigger p {
    font-style: normal;
    font-weight: 300;
    font-size: 24px;
    line-height: 130%;
    letter-spacing: 0.004em;
}

.person-page__row:first-child {
    margin-bottom: 40px;
}

.person-page h2:first-child,
.person-page p:first-child {
    margin-top: 0;
}

.person-page .bigger:not(:last-child) {
    margin-bottom: 24px;
}

@media screen and (max-width: 980px) {
    .person-page h1 {
        font-size: 39px;
    }

    .person-page__row {
        grid-template-columns: 1fr;
    }

    .person-page .column {
        margin-bottom: 20px;
    }

    .person-page .bigger p {
        font-size: 20px;
    }

    .person-page__row:not(:last-child) {
        margin-bottom: 40px;
    }

}

@media screen and (max-width: 1024px) {
    .person-page {
        padding-top: 110px;
    }
}

@media screen and (max-width: 768px) {
    .person-page {
        padding-top: 110px;
    }
}

.team-list-new {
    display: grid;
    grid-template-columns:  repeat(auto-fill, minmax(300px, 340px));
    gap: 40px 20px;
    margin-bottom: 110px;
    margin-top: 40px;
}

.team-list-new img {
    max-width: 100%;
    height: auto;
}

.team-list-new__photo {
    font-size: 0;
    line-height: 0;
    margin-bottom: 20px;
}

.team-list-new__name {
    font-weight: 700;
    font-size: 26px;
    line-height: 100%;
    letter-spacing: 0.005em;
    color: #DCB428;
    margin-bottom: 10px;
}

.team-list-new__link a {
    text-decoration: none;
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 100%;
    letter-spacing: 0.005em;
    color: #000000;
    transition: color ease-in-out .2s;

}

.team-list-new__link svg {
    transform: translateY(2px);
}

.team-list-new__link path {
    transition: fill ease-in-out .2s;
}

.team-list-new__link a:hover {
    color: #DCB428;

}

.team-list-new__link a:hover path {
    fill: #DCB428;
}

.team-list-new__position {
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 130%;
    letter-spacing: 0.004em;
    color: #000000;
    margin-bottom: 20px;
}

@media screen and (max-width: 980px ) {
    .team-list-new__name {
        font-size: 24px
    }
}

/*additional main nav*/
.header.new-header {
    position: absolute;
}

.header.new-header:not(.fixed) .container {
    display: grid;
    grid-template-columns: 300px 1fr 300px;
}


.header.new-header.fixed {
    position: fixed;
}

.additional-nav ul {
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    gap: 40px;
    justify-content: center;
}

.additional-nav li {
    list-style: none;
}

.additional-nav a {
    color: #fff;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.005em;
    text-decoration: none;
}

.additional-nav a:hover {
    text-decoration: underline;
}

/*header phone*/
.header__phone {
    margin-right: 40px
}

.header__phone a {
    color: #fff;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.005em;
    text-decoration: none;
}

.header__phone a:hover {
    text-decoration: underline;
}

.header__phone a + a {
    display: none;
}

.header.new-header .hamburger {
    display: none;
}

.header.new-header.fixed .hamburger {
    display: block;
}

.header.new-header.fixed .header__phone,
.header.new-header.fixed .additional-nav {
    display: none;
}

@media screen and (max-width: 1350px) {
    .header.new-header:not(.fixed) .container {
        display: grid;
        grid-template-columns:auto 1fr 300px;
    }
}

@media screen and (max-width: 1120px) {

    .header.new-header .header__phone,
    .header.new-header .additional-nav {
        display: none;
    }

    .header.new-header .hamburger {
        display: block;
    }

    .header.new-header:not(.fixed) .container {
        display: flex;
    }
}

.btn.black {
    color: #fff;
    background: #232323;
}

.btn.black:hover {
    background: #DCB428;
}

#custom-slider-mp button[data-action="stop"] {
    display: none;
}

#custom-slider-mp {
    position: relative;
    z-index: 2;
}

#custom-slider-mp > .tns-item {
    transition-timing-function: ease-in-out;
    transition-duration: .5s !important;
    animation-duration: .5s !important;
}

#custom-slider-mp .slide-content {
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    overflow: hidden;
}

#custom-slider-mp img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: all ease-in-out 10s;
    transition-delay: .6s;
}

#custom-slider-mp .container {
    position: absolute;
    bottom: 60px;
    left: 0;
    right: 0;
    margin: 0 auto;
}

#custom-slider-mp .description {
    transition: all ease-in-out 1.6s;
    transition-delay: .8s;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    letter-spacing: 0.005em;
    color: #fff;
    max-width: 820px;
    max-height: 0;
    overflow: hidden;
}

#custom-slider-mp .btn {
    transform: translateY(40px);
    transition: all ease-in-out .5s;
    transition-delay: .5s;
}

#custom-slider-mp .btt {
    overflow: hidden;
    height: 40px;
}


#custom-slider-mp .one-image {
    overflow: hidden
}


#custom-slider-mp .slide.tns-slide-active img {
    transform: scale(1.1);
}

#custom-slider-mp .slide.tns-slide-active .description {
    max-height: 500px;
}

#custom-slider-mp .slide.tns-slide-active .btn {
    transform: translateY(0);
}

#custom-slider-mp .one-image {
    line-height: 0;
}

#custom-slider-mp .slider-button {
    border: none;
    padding: 0;
    overflow: visible;
    background: 0 0;
    color: inherit;
    font: inherit;
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    -webkit-appearance: none;
    text-align: inherit;
    outline: 0;
    cursor: pointer;
    font-size: 16px;
    transition: all ease-in-out .2s;
    min-height: 26px;
    font-style: normal;
    line-height: 19px;
    white-space: nowrap;
    text-decoration: none;
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    height: 42px;
    width: 42px;
    margin: auto;
}

#custom-slider-mp .slider-button svg {
    width: 100%;
    height: 100%
}

#custom-slider-mp .slider-button circle {
    opacity: 0;
    transition: opacity ease-in-out .2s;
}

#custom-slider-mp .slider-button:hover circle {
    opacity: 1;
}

#custom-slider-mp .slider-button.next {
    right: 20px
}

#custom-slider-mp .slider-button.prev {
    left: 20px
}

#custom-slider-mp .btn-wrap {
    height: 40px;
    margin-top: 20px;
}

#custom-slider-mp .tns-nav {
    position: absolute;
    box-sizing: border-box;
    z-index: 1;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    left: 0;
    right: 70px;
    bottom: 60px;
    gap: 8px;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 25px;
}

#custom-slider-mp .tns-nav button {
    height: 8px;
    width: 8px;
    border: none;
    background: #fff;
    font-size: 0;
    line-height: 0;
    display: block;
    border-radius: 8px;
    padding: 0;
    transition: background-color ease-in-out .2s;
}

#custom-slider-mp .tns-nav button:not(.tns-nav-active) {
    background: rgba(217, 217, 217, 0.2);
}

#custom-slider-mp .last-project {
    bottom: 88px;
}

@media screen and (max-width: 1120px) {
    .hp-files .container {
        padding-top: 45px;
        padding-bottom: 45px;
    }

    #custom-slider-mp .one-image {
        max-height: 65vh;
    }

    #custom-slider-mp .slide-content {
        background: #f6f6f6;
        height: auto;
        min-height: auto;
        display: grid;
        grid-template-rows: 65vh auto;
    }

    #custom-slider-mp img {
        transition-delay: inherit;
    }

    #custom-slider-mp .container {
        position: relative;
        bottom: 0;
        padding-bottom: 40px;
    }

    #custom-slider-mp .btn {
        transform: translateY(0);
    }

    #custom-slider-mp .description {
        max-height: none;
        transition: none;
        color: #232323;
        font-size: 16px;
        max-width: none;
        padding-top: 40px;
    }

    #custom-slider-mp .slider-button {
        height: 32px;
        width: 32px
    }

    #custom-slider-mp .slider-button.next {
        right: 0;
        top: 33vh;
        margin: 0;
    }

    #custom-slider-mp .slider-button.prev {
        left: 0;
        top: 33vh;
        margin: 0;
    }

    #custom-slider-mp .tns-nav {
        top: 65vh;
        bottom: auto;
        justify-content: center;
        right: 0;
        margin-top: -30px;
    }

    #custom-slider-mp .ls {
        position: absolute;
        top: 60vh;
        bottom: auto;
        background: transparent;
        height: auto;
        padding: 0;
        left: 0;
        right: 0;
    }

    #custom-slider-mp .last-project {
        bottom: 0;
        /* top: 65vh; */
        margin: 0 auto;
        left: 0;
        right: 0;
    }

}

.full-width .one-image img {
    width: 100%;
}
.tns-outer [aria-controls], .tns-outer [data-action]{display:none;}
@media screen and (min-width: 768px) and (max-width: 1024px) {
    .footer__logo {
    }

    .footer .seo-text-footer {
        max-width: 420px;
    }
}
@media screen and (max-width: 768px) {

    .footer .seo-text-footer {
        max-width: 420px;
    }
}


/*---------------------------------------------SEO----------------------------------------*/



.js-button-up.button-up {
    position: fixed;
    z-index: 1000;
    background: #DCB428;
    width: 50px;
    height: 40px;
    border-radius: 6px;
    bottom: 35px;
    right: 10px;
    cursor: pointer;
    opacity: 0;
    transition: all .2s linear 0s;
}

.js-button-up.button-up.active{
    opacity: 1;
}

.js-button-up .icon {
    -webkit-transition: opacity .3s linear 0s;
    transition: all .2s linear 0s;
    max-width: 50%;
    position: absolute;
    margin: auto;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    background: transparent;
    display: flex;
}

.js-button-up .icon svg {
    fill: #fff;
}

.js-button-up.button-up:hover {
    background: #006ac4;
}
.soderzhanie {
    padding: 20px;
    border-radius: 10px;
    background: #f9f9f9;
    margin-bottom: 20px;
    border: 1px solid #DCB428;
    max-width: 100%;
}
.soderzhanie a{
    color: #DCB428 !important;
    text-decoration: none;
    transition: .4s;
}
.soderzhanie a:hover{
    color: #000 !important;
}
.soderzhanie ul{
    margin-bottom: 0px;
}
.sod-header{
    margin-bottom: 10px !important;
}
.soderzhanie.hidden{
    display: none !important;
}
.text-top__description .h3{
    margin-bottom: 6px;
    font-size: 20px;
    line-height: 24px;
    font-weight: 700;
}
#anchor-content .h2{
    letter-spacing: .02em;
    margin: 0 0 35px;
    font-size: 26px;
    line-height: 26px;
}
.footer .h3{
    line-height: 26px;
    letter-spacing: .02em;
    margin: 0 0 21px;
    font-style: normal;
    font-size: 27px;
    font-weight: bold;
}

.footer__contact .h4 {
    font-size: 12px;
    line-height: 14px;
    letter-spacing: .04em;
    color: #000;
    margin: 0 0 10px;
    font-weight: bold;
}
.footer__contact .h4:not(:first-child), .new-menu .menu-dropdown>li:not(:first-child) {
    margin-top: 20px;
}
.hp-contact .contact .h3 {
    font-feature-settings: "ordn" on;
    margin: 0 0 15px;
    font-style: normal;
    font-weight: 700;
    font-size: 30px;
    line-height: 30px;
    letter-spacing: .02em;
}
.main-page.text{
    padding-top: 0;
    padding-bottom: 100px;
}

.main-page.text h4 {
    font-size: 18px;
    line-height: 21px;
    margin: 0 0 36px
}

.main-page.text li,.main-page.text p {
    font-weight: 300;
    letter-spacing: .02em;
    line-height: 25px;
    margin: 0 0 25px
}
.main-page.text h3,.main-page.text p {
    font-size: 20px;
    font-style: normal
}

.main-page.text p+h2 {
    margin-top: 45px;
    margin-bottom: 45px
}

.main-page.text p+h3,.main-page.text p+h4,.main-page.text ul+h2,.main-page.text ul+h3,.main-page.text ul+h4 {
    margin-top: 32px;
    margin-bottom: 45px
}

.main-page.text p+h4,.main-page.text ul+h4 {
    margin-bottom: 46px
}

.main-page.text h3 {
    line-height: 24px;
    font-weight: 700;
    margin: 0 0 35px
}

.main-page.text ul {
    padding-left: 25px;
    margin-bottom: 25px
}

.main-page.text ol,.main-page.text ul {
    margin-top: 8px
}
.main-page.text li {
    padding-left: 5px;
    font-size: 20px;
    line-height: 22px;
    margin-bottom: 7px
}

.main-page.text li::marker {
    color: #DCB428
}

.blog_image .one-image img, .contact-success .container, .full-width .one-image img, .gm-scrollbar.-vertical .thumb, .text .text-main-content, .text .text-main-content img, .works-list img {
    width: 100%
}
.page-content table{
    border: 1px solid #eee;
    width: 100%;
    margin-bottom: 20px;
    border-collapse: collapse;
}
.page-content table th {
    font-weight: bold;
    padding: 5px;
    background: #efefef;
    border: 1px solid #dddddd;
}
.page-content table td{
    padding: 5px 10px;
    border: 1px solid #eee;
    text-align: left;
}
.page-content table tr:nth-child(odd){
    background: #fff;
}
.page-content table tr:nth-child(even){
    background: #f6f6f6;
}
.text-main-content img{max-width:100%;height: auto}

.accordion {
    max-width: 1065px
}

.accordion:not(:last-child) {
    margin-bottom: 25px
}

.accordion .accordion__header {
    padding-bottom: 20px;
    position: relative
}

.accordion .accordion__header:after {
    content: "";
    background: url(../img/arrow-dropdown.svg) center center no-repeat;
    width: 21px;
    height: 11px;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    opacity: .25;
    margin: auto;
    transition: opacity .2s ease-in-out
}

#custom-slider-mp .slider-button:hover circle,
.accordion .accordion__header:hover:after,
.new-menu .sub-menu:hover li:hover,
.works-list-wr .works-list a:hover .works-list__name {
    opacity: 1
}

.accordion .accordion__header.active:after {
    opacity: 1;
    transform: rotate(180deg)
}

.accordion .accordion__content {
    max-height: 0;
    transition: max-height .5s ease-in-out;
    overflow: hidden
}

.accordion .accordion__content>div {
    padding-bottom: 20px
}

.faq{
    margin-bottom: 50px;
}

.faq .title *,
.line_block .head * {
    font-size: 36px;
    letter-spacing: .02em;
    color: #000;
    line-height: 36px;
    font-feature-settings: 'ordn' on;
    font-style: normal;
    font-weight: 700
}

.accordion .accordion__content.active,
.new-menu .open-subnav .sub-menu {
    max-height: 1000px
}
.accordion .accordion__content {padding: 0}
.accordion .accordion__header * {
    margin: 0;
    font-style: normal;
    font-weight: 700;
    font-size: 27px;
    line-height: 36px;
    letter-spacing: -.24px;
    color: #07071c;
    cursor: pointer
}

.accordion .accordion__header.active+.accordion__content {
    max-height: 5000px
}

.services-custom {
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding-top: 80px;
}
.services-custom figure:last-child{margin-bottom:0;}
.services-custom h2:empty{display: none;}
.services-custom .container {width: 100%;}
.services-custom .services-item-page{padding: 0;}
.services-custom .services-item-page__experience{padding: 0;}
.services-custom .competencies{padding-bottom: 80px;}
.services-custom .works-list{padding-top:0; padding-bottom:0;}