/*#region fonts:*/

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto/Roboto-Bold.ttf');
    font-style: normal;
    font-weight: 700;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto/Roboto-Medium.ttf');
    font-style: normal;
    font-weight: 500;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto/Roboto-Regular.ttf');
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto/Roboto-Italic.ttf');
    font-style: italic;
    font-weight: 400;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto/Roboto-Light.ttf');
    font-style: normal;
    font-weight: 300;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto/Roboto-LightItalic.ttf');
    font-style: italic;
    font-weight: 300;
}

@font-face {
    font-family: 'Comfortaa';
    src: url('../fonts/Comfortaa/static/Comfortaa-Bold.ttf');
    font-style: normal;
    font-weight: 700;
}

/*#endregion*/

/*#region root:*/
:root {
    --mainfont: 'Roboto', sans-serif;
    --titlefont: 'Comfortaa', cursive;
    --bodycolor: #000000;
    --blue: #0081C6;
    --dark-blue: #065077;
    --dark-blue-rgb: 6, 80, 119;
    --gray-bg: #F0F0F0;
}

.wrapper {
    --menu-top-height: 44px;
    --menu-bottom-height: 80px;
    /* Used in js */
    --scroll-menu-height: 80px;
}

/*#endregion*/

/*#region template*/
html {
    min-height: 100%;
    font-size: 16px;
}

body {
    font-family: var(--mainfont);
    font-style: normal;
    font-weight: 300;
    font-size: 1.125rem;
    line-height: 1.44;
    color: var(--bodycolor);
    word-break: break-word;
    word-wrap: break-word;
    overflow-wrap: break-word;
    transition: font-size 0.4s;
}

a {
    color: inherit;
    text-decoration: underline;
    transition: 0.4s;
}

a:hover,
a:focus {
    text-decoration: none;
}

p:not(:last-child) {
    margin-bottom: 1em;
}

strong,
b {
    font-weight: 700;
}

img {
    max-width: 100%;
    display: block;
}

::selection {
    background: #2693CE;
    color: #ffffff !important;
}

.wrapper {
    overflow: hidden;
}

.intro {
    font-size: 20px;
    line-height: 1.5;
}

.title-btn {
    display: grid;
    grid-template-columns: 1fr fit-content(300px);
    align-items: start;
    gap: 20px;
}

.title-btn h1,
.title-btn h2,
.title-btn h3,
.title-btn h4,
.title-btn h5,
.title-btn h6 {
    margin-bottom: 0;
}

.container {
    max-width: 1460px;
    margin-left: auto;
    margin-right: auto;
    padding-right: 20px;
    padding-left: 20px;
}

.--grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(1px, 100px));
    gap: 20px;
}

.--full-grid {
    display: grid;
    grid-template-columns: 1fr repeat(12, minmax(1px, 100px)) 1fr;
    gap: 20px;
}

.--full-grid .container {
    width: 100%;
    grid-column: 1 / -1;
}

.section-title {
    margin-bottom: 60px;
}

.--text-center {
    text-align: center;
}

.--text-right {
    text-align: right;
}

.--text-left {
    text-align: left;
}

.--flex-slider .slick-track {
    display: flex !important;
}

.--flex-slider .slick-track .slick-slide {
    height: inherit !important;
}

/*#endregion*/

/*#region title*/
h1,
.like-h1,
h2,
.like-h2,
h3,
.like-h3,
h4,
.like-h4,
h5,
.like-h5,
h6,
.like-h6 {
    font-family: var(--titlefont);
    font-style: normal;
    font-weight: 700;
    color: var(--dark-blue);
    margin-bottom: 1em;
}

h1,
.like-h1 {
    font-size: 54px;
    line-height: 1.2;
    margin-bottom: 30px;
    letter-spacing: -0.02em;
}

h2,
.like-h2 {
    font-size: 2.25rem;
    /*36*/
    line-height: 1;
    margin-bottom: 20px;
    letter-spacing: -0.02em;
}

h3,
.like-h3 {
    font-size: 1.75rem;
    /*28*/
    line-height: 1.333;
    margin-bottom: 15px;
}

h4,
.like-h4 {
    font-family: var(--mainfont);
    font-size: 1.5rem;
    /*24*/
    line-height: 1.333;
    margin-bottom: 15px;
}


h5,
.like-h5 {
    font-family: var(--mainfont);
    font-size: 1.1em;
    /*20*/
    line-height: 1.3;
    margin-bottom: 10px;
}

h6,
.like-h6 {
    font-family: var(--mainfont);
    font-size: inherit;
    line-height: 1.5;
    margin-bottom: 20px;
    color: var(--blue);
}

h1:last-child,
.like-h1:last-child,
h2:last-child,
.like-h2:last-child,
h3:last-child,
.like-h3:last-child,
h4:last-child,
.like-h4:last-child,
h5:last-child,
.like-h5:last-child,
h6:last-child,
.like-h6:last-child {
    margin-bottom: 0;
}

.white-color {
    color: #fff;
}

.white-color h1,
.white-color .like-h1,
.white-color h2,
.white-color .like-h2,
.white-color h3,
.white-color .like-h3,
.white-color h4,
.white-color .like-h4,
.white-color h5,
.white-color .like-h5,
.white-color h6,
.white-color .like-h6 {
    color: inherit;
}

.title-line {
    position: relative;
    padding-top: 20px;
}

.title-line::before {
    position: absolute;
    content: '';
    width: 100px;
    height: 2px;
    left: 0;
    top: 0;
    background: var(--blue);
}

.--text-center .title-line::before,
.--text-center.title-line::before {
    left: 50%;
    transform: translateX(-50%);
}

/*#endregion*/

/*#region btn*/
.btn {
    font-family: var(--mainfont);
    font-style: normal;
    font-weight: 400;
    font-size: inherit;
    line-height: 1.5;
    text-align: center;
    padding: 10px 30px;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    text-decoration: none;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    transition: 0.4s;
    border-radius: 0;
}

.btn,
.btn.--btn-blue {
    color: #fff;
    background: var(--blue);
}

.--btn-white {
    color: var(--blue);
    background: #fff;
}

.btn:hover,
.btn.--btn-blue:hover {
    background: #fff;
    border-color: var(--blue);
    color: var(--blue);
}

.--btn-white:hover {
    background: var(--blue);
    border-color: #fff;
    color: #fff;
}

/*read-more*/
.read-more {
    position: relative;
    --color: var(--dark-blue);
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    text-decoration: none;
    color: var(--color);
}

.read-more::after {
    position: absolute;
    content: "";
    left: 50%;
    bottom: 0;
    width: 100%;
    height: 1px;
    border-bottom: 1px solid var(--color);
    transform: translateX(-50%);
    transition: 0.4s;
}

.read-more:hover::after {
    width: 0;
}

.close-btn {
    position: relative;
    width: 60px;
    height: 60px;
    position: absolute;
    right: 0;
    top: 0;
    border: none;
    outline: none;
    cursor: pointer;
    border-radius: 0;
    padding: 0;
    background-image: url('../images/close-btn.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 15px;
    transition: 0.4s;
    z-index: 5;
}

.close-btn:hover {
    background-size: 18px;
}

.btn-block {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 10px;
}

/*#endregion*/

/*#region form*/
form,
.form {
    --border-color: #C3C3C3;
    --focus-color: var(--blue);
    --border-radius: 0;
    --background-color: #fff;
    --placeholder-color: #525252;
    --check-width: 20px;
}

input[type="text"],
input[type="tel"],
input[type="email"],
textarea,
select {
    width: 100%;
    border: none;
    outline: none;
    box-shadow: none;
    border: 1px solid var(--border-color);
    font-family: var(--mainfont);
    font-weight: inherit;
    font-style: normal;
    font-size: 0.888em;
    padding: 10px 20px;
    height: 50px;
    color: var(--bodycolor);
    background-color: var(--background-color);
    display: block;
    border-radius: var(--border-radius);
    line-height: 1.5;
}

select {
    position: relative;
    background-image: url("../images/icon-select.svg");
    background-position: calc(100% - 20px) center;
    background-repeat: no-repeat;
    padding-right: 40px;
}

textarea {
    height: 150px;
    resize: vertical;
    padding-top: 15px;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--focus-color);
}

input::placeholder,
textarea::placeholder {
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: var(--placeholder-color);
}

label {
    display: block;
    font-size: 0.888em;
    margin-bottom: 5px;
}

label:last-child {
    margin-bottom: 0;
}

/* .label-absolute */
.label-absolute {
    position: relative;
}

.label-absolute label {
    position: absolute;
    top: -7px;
    left: 10px;
    display: block;
    font-size: 0.777em;
    color: var(--blue);
    line-height: 1;
    font-weight: 600;
    background: #fff;
    padding: 2px 3px;
    opacity: 0;
    transition: .2s;
}

.label-absolute input:focus+label,
.label-absolute textarea:focus+label,
.label-absolute input:not(:placeholder-shown)+label,
.label-absolute textarea:not(:placeholder-shown)+label {
    opacity: 1;
}

input:focus::placeholder,
textarea:focus::placeholder {
    color: transparent;
}

/* checkbox */
input[type="checkbox"] {
    display: none;
}

input[type="checkbox"]:required {
    display: block;
    height: var(--check-width);
    width: var(--check-width);
    margin-bottom: calc(var(--check-width) * -1);
    opacity: 0;
}

input[type="checkbox"]+label {
    position: relative;
    padding-left: 30px;
    font-size: 0.888em;
    line-height: 1.5;
    display: block;
    color: inherit;
    cursor: pointer;
}

input[type="checkbox"]+label::before {
    position: absolute;
    content: "";
    height: var(--check-width);
    width: var(--check-width);
    background-color: #fff;
    border: 1px solid #525252;
    top: 0;
    left: 0;
    cursor: pointer;
}

input[type="checkbox"]:checked+label::before {
    background-image: url("../images/icon-checked.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 12px;
}

/* radio */
input[type="radio"] {
    display: none;
}

input[type="radio"]:required {
    display: block;
    height: var(--check-width);
    width: var(--check-width);
    margin-bottom: calc(var(--check-width) * -1);
    opacity: 0;
}

input[type="radio"]+label {
    position: relative;
    padding-left: 35px;
    font-size: inherit;
    line-height: 1.5;
    display: block;
    color: inherit;
    cursor: pointer;
}

input[type="radio"]+label::before {
    position: absolute;
    content: "";
    height: var(--check-width);
    width: var(--check-width);
    background-color: #fff;
    border: 3px solid #fff;
    box-shadow: 0 0 1px 1px var(--border-color);
    border-radius: 50%;
    top: 0;
    left: 0;
    cursor: pointer;
}

input[type="radio"]:checked+label::before {
    background-color: var(--bodycolor);
}

/*#endregion*/

/*#region form-block*/
.form-row {
    display: grid;
    grid-template-columns: repeat(6, minmax(1px, 1fr));
    gap: 20px;
}

.form-row .col-1 {
    grid-column: span 6;
}

.form-row .col-2 {
    grid-column: span 3;
}

.form-row .col-3 {
    grid-column: span 2;
}

.check-col {
    justify-self: start;
}

.submit-col {
    margin-top: 20px;
}

.errorlist {
    list-style: none;
    color: #DD0000;
    font-size: 12px;
}

.grecaptcha-badge {
    display: none;
}

.messages {
    list-style: none;
    position: fixed;
    left: 0;
    right: 50%;
    bottom: 0;
    width: 100%;
    max-width: 768px;
    z-index: 999999;
    margin-left: 0;
    margin-top: 0;
    margin-bottom: 0;
}

.messages li {
    padding: 20px 80px;
    color: #ffffff;
    position: relative;
}

.messages .debug {
    background-color: #000000;
}

.messages .info {
    background-color: #000000;
}

.messages .success {
    background-color: #0FBF00;
}

.messages .warning {
    background-color: #E59500;
}

.messages .error {
    background-color: #BF0F00;
}

.messages li::before {
    content: "";
    display: block;
    width: 60px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    background-size: 20px 20px;
    background-repeat: no-repeat;
    background-position: center center;
}

.messages .debug::before {
    background-image: url("../images/debug.svg");
}

.messages .info::before {
    background-image: url("../images/info-circle.svg");
}

.messages .success::before {
    background-image: url("../images/check-circle.svg");
}

.messages .warning::before {
    background-image: url("../images/exclamation-circle.svg");
}

.messages .error::before {
    background-image: url("../images/times-circle.svg");
}

.messages li::after {
    content: "";
    display: block;
    width: 60px;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    cursor: pointer;
    background-size: 20px 20px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url("../images/times.svg");
}
/*#endregion*/

/*#region hamburger*/
#hamburger {
    display: none;
}

#hamburger {
    position: relative;
    width: 40px;
    height: 40px;
    cursor: pointer;
    display: none;
    flex-shrink: 0;
}

#hamburger>span {
    display: block;
    height: 2px;
    background-color: var(--bodycolor);
    position: absolute;
    left: 0;
    -webkit-transition: transform ease 0.4s;
    -moz-transition: transform ease 0.4s;
    -o-transition: transform ease 0.4s;
    -ms-transition: transform ease 0.4s;
    transition: transform ease 0.4s;
}

#hamburger>span:nth-child(1) {
    width: 75%;
    top: calc(50% - 8px);
}

#hamburger>span:nth-child(2) {
    width: 60%;
    top: 50%;
}

#hamburger>span:nth-child(3) {
    width: 100%;
    top: calc(50% + 8px);
}

.menu-active #hamburger>span {
    width: 100%;
    top: 50%;
    left: 0;
}

.menu-active #hamburger>span:nth-child(1) {
    transform: translate(0, -50%) rotate(45deg);
}

.menu-active #hamburger>span:nth-child(2) {
    opacity: 0;
    transform: translate(0, -50%);
}

.menu-active #hamburger>span:nth-child(3) {
    transform: translate(0, -50%) rotate(-45deg);
}

/*#endregion*/

/*#region header-menu*/
#header-menu {
    --transition: 0.3s;
    background-color: #fff;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 5;
    transition: none;
    z-index: 555;
}

main {
    margin-top: calc(var(--menu-top-height) + var(--menu-bottom-height));
}

.scroll #header-menu {
    z-index: 555;
    transition: var(--transition);
}

.overlay {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    height: -webkit-fill-available;
    height: 100vh;
    background: rgba(0, 0, 0, 0.65);
}

#menu-overlay {
    display: none;
}

#header-menu .container {
    display: flex;
    gap: 20px;
}

#header-menu .logo {
    align-self: flex-end;
    align-self: center;
    width: 160px;
    height: 160px;
    transition: var(--transition);
    margin-bottom: -45px;
}

#header-menu .logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.header-nav {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

/*#region header-nav__top */
.header-nav__top {
    margin-left: auto;
    height: var(--menu-top-height);
    display: flex;
    align-items: center;
    font-size: 0.9375rem;
    font-weight: 400;
    transition: var(--transition);
}

.header-nav__opening-hours {
    position: relative;
    padding-left: 16px;
    display: flex;
}

.header-nav__opening-hours>div:not(:last-child)::after {
    content: "|";
    margin: 0 10px;
}

.header-nav__opening-hours::before {
    content: "";
    position: absolute;
    left: 0;
    top: calc(50% - 4px);
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.header-nav__opening-hours.open::before {
    background: #00C644;
}

.header-nav__opening-hours.close::before {
    background: #D90011;
}

.header-nav__top .js-popup__open {
    display: block;
    text-decoration: underline;
    cursor: pointer;
}

.header-nav__top .js-popup__open:hover {
    text-decoration: none;
}

.header-nav__contact {
    display: flex;
}

.header-nav__contact>div {
    position: relative;
    padding-left: 25px;
    margin-left: 25px;
    display: flex;
    gap: 9px;
}

.header-nav__contact>div::before {
    content: "";
    position: absolute;
    left: 0;
    top: calc(50% - 12px);
    width: 1px;
    height: 24px;
    border-left: 1px solid #707070;
}

.header-nav__contact a {
    text-decoration: none;
}

.header-nav__contact a:hover {
    text-decoration: underline;
}

.header-nav__top-btn {
    height: 100%;
    min-height: 100%;
    display: flex;
    gap: 10px;
    padding: 5px 15px;
    margin-left: 25px;
}

/*#endregion*/

/*#region header-nav__bottom */
.header-nav__bottom {
    display: flex;
    align-items: center;
    height: var(--menu-bottom-height);
    transition: var(--transition);
}

.main-menu {
    margin-left: auto;
    display: flex;
    gap: 40px;
}

.main-menu a {
    display: block;
    position: relative;
    font-size: 1.125rem;
    font-weight: 400;
    text-decoration: none;
    padding: 5px 0;
}

.main-menu a::before {
    position: absolute;
    content: '';
    width: 0;
    height: 3px;
    left: 50%;
    bottom: 0;
    border-bottom: 3px solid var(--blue);
    transform: translateX(-50%);
    transition: 0.4s;
}

.main-menu a.active::before,
.main-menu .active a::before,
.main-menu a:hover::before {
    width: 100%;
}

/*#endregion*/

@media (max-width: 1400px) {
    .header-nav__opening-hours>div {
        display: none;
    }

    .header-nav__opening-hours {
        padding-left: 0;
    }

    .header-nav__opening-hours::before {
        display: none;
    }

    .header-nav__contact>div {
        padding-left: 15px;
        margin-left: 15px;
    }

    .header-nav__top-btn {
        gap: 5px;
        padding: 5px 10px;
        margin-left: 15px;
    }
}

@media (min-width: 1025px) {
    .scroll #header-menu .logo {
        height: 95px;
        width: 95px;
        margin-top: 5px;
        margin-bottom: -20px;
    }

    .scroll .header-nav__top {
        margin-top: calc(-1 * var(--menu-top-height));
    }

    .scroll.scroll-up .header-nav__top {
        margin-top: 0;
    }

    .scroll .header-nav__bottom {
        height: var(--scroll-menu-height);
    }
}

@media (max-width: 1024px) {
    .wrapper {
        --menu-height: 90px;
        --scroll-menu-height: var(--menu-height);
    }

    main {
        margin-top: var(--menu-height);
    }

    #header-menu .logo {
        height: 110px;
        width: 110px;
        margin-bottom: -30px;
    }

    #header-menu .container {
        align-items: center;
        height: var(--menu-height);
    }

    #hamburger {
        display: block;
        z-index: 20;
        margin-left: auto;
    }

    .menu-active #hamburger>span {
        background: #fff;
    }

    .header-nav {
        position: fixed;
        left: -330px;
        top: 0;
        bottom: 0;
        width: 330px;
        overflow: auto;
        background: #fff;
        padding: 50px 20px 100px 20px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        transition: 0.4s;
        z-index: 10;
    }

    .menu-active .header-nav {
        left: 0;
    }

    #menu-overlay {
        z-index: 5;
    }

    .menu-active #menu-overlay {
        display: block;
    }

    .header-nav__bottom {
        height: auto;
    }

    .main-menu {
        flex-direction: column;
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 15px;
    }

    .header-nav__top {
        order: 2;
        height: auto;
        flex-direction: column;
        gap: 20px;
        margin-left: 0;
        margin-top: 50px;
        width: 100%;
        align-items: flex-start;
        font-size: 1rem;
    }

    .header-nav__opening-hours {
        flex-direction: column;
        gap: 5px;
        padding-left: 20px;
    }

    .header-nav__opening-hours::before {
        display: block;
        top: 0.5em;
    }

    .header-nav__opening-hours>div:not(:last-child)::after {
        display: none;
    }

    .header-nav__opening-hours>div {
        display: block;
    }


    .header-nav__contact {
        flex-direction: column;
        gap: 10px;
    }

    .header-nav__contact>div {
        padding-left: 0;
        margin-left: 0;
    }

    .header-nav__contact>div::before {
        display: none;
    }

    .header-nav__top-btn {
        height: auto;
        min-height: 50px;
        padding: 5px 20px;
        margin-left: 0;
    }
}

@media (max-width: 600px) {
    .wrapper {
        --menu-height: 70px;
    }

    #header-menu .logo {
        width: 85px;
        height: 85px;
        margin-bottom: -20px;
    }
}

@media (max-width: 425px) {
    .header-nav {
        left: -100%;
        width: 100%;
    }

    .menu-active #hamburger>span {
        background: var(--bodycolor);
    }
}

/*#endregion*/

/*#region showcase*/
.showcase {
    position: relative;
    margin-bottom: 120px;
}

.showcase__inner {
    overflow: hidden;
}

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

.showcase__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.showcase__content {
    position: relative;
    z-index: 2;
    height: 70vh;
    max-height: 720px;
    max-width: 770px;
    padding: 50px 50px 50px 0;
    display: flex;
    align-items: center;
}

.showcase__content>* {
    position: relative;
    z-index: 2;
}

.showcase__content::before {
    position: absolute;
    content: '';
    width: 100vw;
    height: 1200px;
    right: 0;
    top: calc(50% - 600px);
    border-radius: 0 600px 600px 0;
    background: rgba(var(--dark-blue-rgb), 0.7);
    z-index: 1;
}

.showcase__scroll {
    position: absolute;
    width: 50px;
    height: 50px;
    left: calc(50% - 25px);
    bottom: -25px;
    background-color: var(--blue);
    background-image: url('../images/showcase__scroll.svg');
    background-position: center 55%;
    background-repeat: no-repeat;
    border-radius: 50%;
    z-index: 2;
    animation: showcase__scroll 2000ms ease 0s infinite normal;
    transform-origin: center;
}

@keyframes showcase__scroll {
    0% {
        transform: translateY(0);
    }

    25% {
        transform: translateY(10%);
    }

    50% {
        transform: translateY(0);
    }

    75% {
        transform: translateY(15%);
    }
}

@media (max-width: 600px) {
    .showcase__content {
        padding: 50px 0;
    }

    .showcase__content::before {
        display: none;
    }

    .showcase__img::before {
        position: absolute;
        content: '';
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        background: rgba(var(--dark-blue-rgb), 0.7);
        z-index: 1;
    }
}

/*#endregion*/

/*#region about*/
.about {
    margin-top: 80px;
    overflow: hidden;
}

.about__content {
    grid-column: 2 / 8;
    margin-bottom: 80px;
}

.about__header {
    margin-bottom: 30px;
}

.about__content .btn {
    margin-top: 60px;
}

.about__img {
    position: relative;
    grid-column: 9 / -1;
    align-self: self-end;
    max-width: 935px;
}

.about__img .img {
    position: relative;
    width: 866px;
    height: 866px;
    max-width: 55vw;
    max-height: 55vw;
    margin-left: 5%;
    margin-bottom: -10%;
}

.about__img img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover;
    border-radius: 50%;
    z-index: 1;
}

.blue-icon {
    position: absolute;
    z-index: 2;
    transform-origin: center;
    background-color: var(--blue);
    border-radius: 50%;
    overflow: hidden;
}

.blue-icon.icon-1 {
    width: 189px;
    height: 189px;
    max-width: 15vw;
    max-height: 15vw;
}

.about__icon.icon-1 {
    left: 12%;
    top: 0;
}

.blue-icon.icon-2 {
    width: 146px;
    height: 146px;
    max-width: 12.5vw;
    max-height: 12.5vw;
}

.about__icon.icon-2 {
    left: -3%;
    top: 35%;
}

.blue-icon.icon-3 {
    width: 118px;
    height: 118px;
    max-width: 10vw;
    max-height: 10vw;
}

.about__icon.icon-3 {
    left: 4%;
    top: 70%;
}

@media (max-width: 1200px) {
    .about__img {
        grid-column: 8 / -1;
        margin-left: 15px;
    }
}

@media (max-width: 1000px) {
    .about.--full-grid {
        row-gap: 30px;
    }

    .about__img {
        grid-column: 2 / -1;
        margin-left: 15px;
        justify-self: self-end;
    }

    .about__content {
        grid-column: 2 / -2;
        margin-bottom: 0;
    }

    .about__img .img {
        max-width: 90vw;
        max-height: 90vw;
    }

    .blue-icon.icon-1 {
        max-width: 20vw;
        max-height: 20vw;
    }

    .blue-icon.icon-2 {
        max-width: 17.5vw;
        max-height: 17.5vw;
    }

    .blue-icon.icon-3 {
        max-width: 15vw;
        max-height: 15vw;
    }

    .about__icon.icon-1 {
        left: 8%;
        top: 8%;
    }

    .about__icon.icon-2 {
        left: -5%;
        top: 35%;
    }

    .about__icon.icon-3 {
        left: 0%;
        top: 65%;
    }
}

/*#endregion*/

/*#region permission*/
.permission {
    padding: 100px 0 120px 0;
    background: var(--gray-bg);
}

.permission__inner {
    display: grid;
    grid-template-columns: 5fr 7fr;
}

.permission__content {
    background: #fff;
    padding: 60px;
}

.permission__img {
    position: relative;
}

.permission__img img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.permission__cta {
    position: relative;
    background: var(--blue);
    padding: 60px;
    overflow: hidden;
}

.permission__cta>* {
    position: relative;
    z-index: 2;
}

.permission__cta::after {
    position: absolute;
    content: '';
    width: 316px;
    height: 316px;
    right: 0;
    bottom: 0;
    opacity: 0.15;
    background: url('../images/permission__cta-img.png');
    background-size: contain;
    background-position: right bottom;
    background-repeat: no-repeat;
    transform: translate(36px, 9px);
    z-index: 1;
}

.permission__cta-footer {
    margin-top: 60px;
}

.permission__cta-footer .btn {
    margin-top: 30px;
}

@media (max-width: 1200px) {

    .permission__content,
    .permission__cta {
        padding: 50px 40px;
    }
}

@media (max-width: 1000px) {
    .permission__inner {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .permission__content,
    .permission__cta {
        padding: 60px;
    }

    .permission__img {
        height: 400px;
    }
}

@media (max-width: 600px) {

    .permission__content,
    .permission__cta {
        padding: 50px 20px;
    }

    .permission__img {
        height: 300px;
    }
}

/*#endregion*/

/*#region services*/
.services {
    padding: 80px 0 120px 0;
    background: var(--dark-blue);
}

.services__header {
    margin-bottom: 50px;
}

.services__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.services__item {
    background: #fff;
    padding: 40px;
}

@media (max-width: 768px) {
    .services__list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .services__item {
        background: #fff;
        padding: 40px 20px;
    }
}

/*#endregion*/

/*#region prices*/
.prices {
    overflow: hidden;
}

.prices .--grid {
    grid-auto-flow: dense;
    row-gap: 50px;
}

.prices__top {
    margin-bottom: 50px;
}

.prices__top-img {
    grid-column: 7 / -1;
    align-self: self-start;
    margin-top: -20%;
}

.prices__top-img img {
    width: 882px;
    height: 882px;
    object-fit: cover;
    border-radius: 50%;
    max-width: 60vw;
    max-height: 60vw;
}

.prices__top-content {
    grid-column: 1 / 6;
    margin-top: 120px;
}

.prices__bottom {
    margin-bottom: 50px;
}

.prices__bottom-img {
    position: relative;
    grid-column: 1 / 7;
    margin-right: 70px;
    align-self: self-start;
    z-index: 2;
}

.prices__bottom-img .img {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
}

.prices__bottom-img .img img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.prices__bottom-icon.icon-1 {
    top: 35%;
    left: -15%;
}

.prices__bottom-icon.icon-3 {
    top: 70%;
    left: 0;
}

.prices__bottom-content {
    position: relative;
    grid-column: 7 / -1;
    align-self: center;
    padding: 60px 45px 60px 0;
    margin: 50px 0;
}

.prices__bottom-content .btn {
    margin-top: 40px;
}

.prices__bottom-content>* {
    position: relative;
    z-index: 2;
}

.prices__bottom-content::before {
    position: absolute;
    content: '';
    width: 150%;
    height: 100%;
    right: 0;
    top: 0;
    background: var(--gray-bg);
    z-index: 1;
}

@media (max-width: 1600px) {
    .prices__bottom-img {
        margin-left: 30px;
        margin-right: 20px;
    }
}

@media (max-width: 1200px) {
    .prices__top-img {
        margin-top: 50px;
    }

    .prices__top-content {
        grid-column: 1 / 7;
        margin-right: 20px;
    }

    .prices__bottom-icon.icon-1 {
        top: 30%;
        left: -10%;
    }

    .prices__bottom-icon.icon-3 {
        top: 70%;
        left: 5%;
    }
}

@media (max-width: 1000px) {

    .prices__top-img,
    .prices__top-content,
    .prices__bottom-img,
    .prices__bottom-content {
        grid-column: 1 / -1;
    }

    .prices__top-content,
    .prices__bottom-content {
        margin: 0;
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
    }

    .prices__bottom {
        margin-bottom: 100px;
    }

    .prices__top-img {
        margin-top: -20%;
        justify-self: center;
    }

    .prices__top-img img {
        max-width: 90vw;
        max-height: 90vw;
    }

    .prices__bottom-img {
        margin-left: 70px;
        margin-right: 0;
    }

    .prices__bottom-content::before {
        display: none;
    }

    .prices__bottom-content {
        padding: 0;
    }
}

@media (max-width: 600px) {
    .prices__bottom-img {
        margin-left: 30px;
        margin-right: 0;
    }
}

/*#endregion*/

/*#region news*/
.news {
    padding: 100px 0;
    background: var(--gray-bg);
}

.news__header {
    margin-bottom: 50px;
}

.news-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 60px 20px;
}

.news__list {
    align-items: start;
}

.news__list+.btn {
    margin: 40px auto 0 auto;
}

.news-card {
    text-decoration: none;
}

.news-card__img {
    position: relative;
    margin-bottom: 16px;
}

.news-card__img .img {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 61.5%;
    overflow: hidden;
}

.news-card__img img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover;
    z-index: 1;
}

.news-card__date {
    position: absolute;
    right: 20px;
    top: 100%;
    color: #fff;
    background: var(--blue);
    padding: 7px 20px 5px 20px;
    border-radius: 20px;
    z-index: 2;
    transform: translateY(calc(-50% + 8px));
}

.news-card__content {
    background: #fff;
    padding: 30px;
}

.news-card__img img,
.news-card__content,
.news-card__date {
    transition: 0.4s;
}

.news-card:hover .news-card__img img {
    transform: scale(1.1);
}

.news-card:hover .news-card__content {
    background: var(--blue);
    color: #fff;
}

.news-card:hover .news-card__content h4 {
    color: inherit;
}

.news-card:hover .news-card__date {
    background: var(--dark-blue);
}

.news-card:hover .read-more {
    --color: #fff
}

@media (max-width: 1024px) {
    .news-list {
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    }
}

/*#endregion*/

/*#region faq*/
.faq {
    margin: 100px 0 120px 0;
}

.faq__inner {
    max-width: 940px;
    margin-left: auto;
    margin-right: auto;
}

.faq__header {
    margin-bottom: 50px;
}

.js-acc {
    --transition: all 0.3s ease-in-out;
}

.js-acc__head {
    cursor: pointer;
}

.js-acc__body {
    transition: var(--transition);
    opacity: 0;
    height: auto;
    max-height: 0;
    overflow: hidden;
}

.open .js-acc__body {
    opacity: 1;
    max-height: 10000px;
}

.acc__head i::before,
.acc__head i::after {
    position: absolute;
    content: "";
    background-color: var(--dark-blue);
    width: 2px;
    height: 10px;
    right: 20px;
    top: calc(50% - 5px);
    transition: var(--transition);
}

.acc__head i::before {
    transform: translate(-3px, 0) rotate(-45deg);
}

.acc__head i::after {
    transform: translate(3px, 0) rotate(45deg);
}

.open .acc__head i::before {
    transform: translate(3px, 0) rotate(-45deg);
}

.open .acc__head i::after {
    transform: translate(-3px, 0) rotate(45deg);
}

.acc__row {
    border-top: 1px solid var(--blue);
}

.acc__row:last-child {
    border-bottom: 1px solid var(--blue);
}

.acc__head {
    position: relative;
    font-weight: 500;
    padding: 30px 20px;
    padding-right: 50px;
    cursor: pointer;
    transition: var(--transition);
    color: var(--dark-blue);
}

.acc__head>* {
    margin-bottom: 0;
}

.acc__head:hover {
    color: var(--blue);
}

.acc__body {
    padding: 0 20px;
}

.open .acc__body {
    padding-bottom: 60px;
}

/*#endregion*/

/*#region contact*/
.contact {
    background: var(--dark-blue);
    padding-top: 100px;
}

.contact__inner {
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 20px;
}

.contact__header {
    grid-column: 1 / -1;
    margin-bottom: 60px;
}

.contact__left {
    justify-self: start;
    display: grid;
    gap: 35px;
    margin-bottom: 50px;
}

.contact__row {
    display: grid;
    grid-template-columns: 50px auto;
    gap: 25px;
}

.contact__row-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--blue);
    display: flex;
    align-items: center;
    justify-content: center;
}

.contact__row-content {
    max-width: 385px;
}

.contact__row-content h6 {
    font-size: 0.777777em;
    font-weight: 400;
    margin-bottom: 5px;
}

.contact__row-content a {
    text-decoration: none;
}

.contact__row-content a:hover {
    text-decoration: underline;
}

.contact__row-content .js-popup__open {
    text-decoration: underline;
    cursor: pointer;
}

.contact__row-content .js-popup__open:hover {
    text-decoration: none;
}

.contact__form {
    background: #fff;
    padding: 45px 40px 40px 40px;
    align-self: self-end;
    margin-bottom: -70px;
    position: relative;
    z-index: 2;
}

.contact__map {
    height: 425px;
    z-index: 1;
}

@media (max-width: 768px) {
    .contact__inner {
        grid-template-columns: 1fr;
        margin-bottom: 50px;
    }

    .contact__form {
        margin-bottom: 0;
    }
}

@media (max-width: 600px) {
    .contact__form {
        padding: 40px 20px;
    }
}

/*#endregion*/

/*#region footer*/
#footer-page {
    background: var(--blue);
    color: #fff;
    font-size: 0.777em;
    font-weight: 400;
    padding: 15px 0;
}

.footer-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
}

.footer-row ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}

.footer-row ul li:not(:last-child)::after {
    content: '|';
    margin: 0 10px;
}

.codelines a {
    text-decoration: none;
}

.codelines a:hover {
    text-decoration: underline;
}

/*#endregion*/

/*#region news-overview*/
.news-overview {
    padding: 125px 0 80px 0;
    background: var(--gray-bg);
}

.news-overview__header {
    margin-bottom: 70px;
}

/*#endregion*/

/*#region pagination*/
.pagination {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
    list-style: none;
    margin-top: 80px;
}

.pagination li a,
.pagination li span {
    width: 35px;
    height: 35px;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1;
    background: #fff;
    color: #000;
    text-decoration: none;
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.pagination li a[aria-label="Previous Page"],
.pagination li.prev a,
.pagination li a[aria-label="Next Page"],
.pagination li.next a {
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pagination li.active a,
.pagination li a[aria-current="true"],
.pagination li a:hover {
    background: var(--blue);
    color: #fff;
}

/*#endregion*/

/*#region news-item*/
.news-item {
    margin-bottom: 120px;
}

.news-item .container {
    max-width: 980px;
}

.news-item__header {
    position: relative;
    margin-bottom: 100px;
}

.news-item__header>.container {
    position: relative;
    height: 405px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-self: flex-start;
}

.news-item__header img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover;
}

.news-item__date {
    display: flex;
    align-items: center;
    justify-content: center;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    min-height: 40px;
    background: var(--blue);
    color: #fff;
    border-radius: 20px;
    padding: 5px 20px;
    line-height: 1;
    transform: translateY(50%);
}

.news-item__footer {
    padding-top: 40px;
    margin-top: 90px;
    border-top: 1px solid var(--blue);
    display: flex;
    color: var(--dark-blue);
    gap: 30px;
}

.news-item__prev,
.news-item__next {
    flex: 1;
    text-decoration: none;
    font-weight: 700;
}

.news-item__prev:hover,
.news-item__next:hover {
    color: var(--blue);
}

.news-item__next {
    text-align: right;
}

.news-item__prev span,
.news-item__next span {
    display: block;
    position: relative;
    font-size: 0.888em;
    text-decoration: underline;
    margin-bottom: 10px;
    font-weight: 500;
}

.news-item__prev:hover span,
.news-item__next:hover span {
    text-decoration: none;
}

.news-item__prev span {
    padding-left: 25px;
}

.news-item__next span {
    padding-right: 25px;
}

.news-item__prev span::before,
.news-item__next span::before {
    position: absolute;
    content: '';
    width: 16px;
    height: 100%;
    top: 0;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    transition: 0.4s;
}

.news-item__prev span::before {
    left: 0;
    background-image: url('../images/news-item__prev.svg');
}

.news-item__next span::before {
    right: 0;
    background-image: url('../images/news-item__next.svg');
}

.news-item__prev:hover span::before {
    left: -10px;
}

.news-item__next:hover span::before {
    right: -10px;
}

@media (max-width: 768px) {
    .news-item__footer .title {
        display: none;
    }
}

/*#endregion*/

/*#region --content/article-body */
.--content>*:first-child {
    margin-top: 0 !important;
}

.--content>*:last-child {
    margin-bottom: 0 !important;
}

.--content ul,
.--content ol {
    list-style: none;
    margin-top: 20px;
    margin-bottom: 20px;
    display: grid;
    gap: 10px;
}

.--content ul:last-child,
.--content ol:last-child {
    margin-bottom: 0;
}

.--content ul:first-child,
.--content ol:first-child {
    margin-top: 0;
}

.--content ul li {
    position: relative;
    padding-left: 20px;
}

.--content ul li::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0.6em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--blue);
}

.--content ol {
    counter-reset: item;
}

.--content ol li {
    position: relative;
    padding-left: 30px;
}

.--content ol li::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    counter-increment: item;
    content: counter(item) ".";
    color: var(--blue);
}

.--content h1,
.--content h2,
.--content h3,
.--content h4,
.--content h5,
.--content h6 {
    margin-top: 40px;
}

.--content h2 {
    font-size: 2rem;
    margin-bottom: 30px;
}

/*#endregion*/

/*#region popup*/
.popup {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    height: -webkit-fill-available;
    height: 100vh;
    overflow: auto;
    padding: 20px;
    z-index: 700;
}

.popup__inner {
    margin: auto;
    background: #fff;
    width: 100%;
    max-width: 1060px;
    padding: 90px 50px 60px 50px;
    position: relative;
    z-index: 2;
}

.popup__content {
    max-width: 820px;
    margin-left: auto;
    margin-right: auto;
}

.opening-hours__header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 30px;
}

.opening-hours__header-right {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
}

.opening-hours__header-right>div {
    position: relative;
    padding-left: 22px;
}

.opening-hours__header-right>div::before {
    position: absolute;
    content: '';
    width: 12px;
    height: 12px;
    left: 0;
    top: calc(50% - 6px);
    border-radius: 50%;
}

.opening-hours__header-right>div.open::before {
    background: var(--blue);
}

.opening-hours__header-right>div.close::before {
    background: #E6E6E6;
}

.opening-hours__list {
    display: grid;
    gap: 20px;
}

.opening-hours__row {
    display: grid;
    grid-template-columns: 220px auto;
}

.opening-hours__time {
    margin-bottom: 25px;
    display: grid;
    grid-template-columns: repeat(48, 1fr);
    border-radius: 50px;
    background: #E6E6E6;
}

.opening-hours__interval {
    position: relative;
    height: 20px;
    background: var(--blue);
    border-radius: 50px;
}

.opening-hours__interval.interval-1 {
    grid-column: 1 / 17;
}

.opening-hours__interval.interval-2 {
    grid-column: 36 / 49;
}

.opening-hours__interval.interval-3 {
    grid-column: 1 / 49;
}

.opening-hours__interval span {
    display: block;
    position: absolute;
    top: calc(100% + 5px);
    font-size: 0.875rem;
    line-height: 1;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

.opening-hours__interval span:first-child {
    left: 0;
    transform: translateX(-40%);
}

.opening-hours__interval span:last-child {
    right: 0;
    transform: translateX(40%);
}

.opening-hours__desc {
    margin-top: 35px;
}

@media (max-width: 600px) {
    .popup {
        padding: 0;
    }

    .popup__inner {
        padding: 60px 20px 40px 20px;
        height: 100%;
        overflow: auto;
    }

    .popup__close {
        width: 40px;
        height: 40px;
        background-color: #fff;
        position: fixed;
    }

    .opening-hours__row {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .opening-hours__time {
        margin-left: 20px;
        margin-right: 20px;
    }
}

/*#endregion*/

/*#region animation*/
.show {
    display: block;
}

.hide,
[hidden] {
    display: none !important;
}

.fade {
    animation-name: fade;
    animation-duration: .4s;
}

@keyframes fade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/*#endregion*/

/*#region media*/
@media (min-width: 1025px) {
    .hide-desktop {
        display: none;
    }
}

@media (max-width: 1024px) {
    .hide-mobile {
        display: none;
    }
}

@media (max-width: 600px) {

    h1,
    .like-h1 {
        font-size: 2.25rem;
        /* 36 */
    }

    h2,
    .like-h2 {
        font-size: 1.875rem;
        line-height: 1.4;
        /*30*/
    }

    h3,
    .like-h3 {
        font-size: 1.625rem;
        /*26*/
    }

}

@media (max-width: 425px) {
    .container {
        padding-left: 15px;
        padding-right: 15px;
    }

    .--grid,
    .--full-grid {
        column-gap: 15px;
    }

    .pagination {
        gap: 5px;
    }
}

/*#endregion*/