/* Start:/local/templates/estelifecentre/js/components/drop.css?17483301422544*/
.drop {
    position: relative;
    z-index: 1;
    line-height: 1;
}
.drop .drop-icon {
    width: 12px;
    height: 12px;
    transform-origin: center;
    display: flex;
    justify-content: center;
    align-items: center;
    background: transparent url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9"></polyline></svg>') no-repeat center;
    background-size: 12px;
}
.drop .drop-trigger {
    cursor: pointer;
    margin-bottom: 0;
}

.drop .drop-inside{
    opacity: 0;
    visibility: hidden;
    position: absolute;
    box-sizing: border-box;
}

.drop .drop-container {
    top: calc(100% + 10px);
    left: 0;
    padding-top: 6px;
}
.drop .drop-container::before {
    content: "";
    position: absolute;
    left: 2em;
    top: 0;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #fff;
}
.drop .drop-content {
    min-width: 100%;
    background: #fff;
    padding: 5px 0 ;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.2);
    border-radius: 2px;
    box-sizing: border-box;
    max-height: 350px;
    overflow: auto;
    width: max-content;
    display: block;
}

.drop .drop-content .drop-item{
    display: block;
    margin-bottom: 5px;

}


.drop .drop-content .drop-item:last-child{
    margin-bottom: 0;
}

.drop .drop-submit {
    position: fixed;
    top: calc(100% + 50px);
    right: 10px;
    left: 10px;
    display: none;
    --padding: 12px;
    --font-size: 14px;
}
.drop .drop-item {
    display: flex;
    position: relative;
    cursor: pointer;
    padding: 10px 1rem;
    color: #000;
    text-decoration: none;
    line-height: 1em;
    width: 100%;
}
.drop .drop-item:hover {
    background: var(--color-smoke, whitesmoke);
}
.drop .drop-item.checkbox input,
.drop .drop-item.radio input {
    top: 50%;
    transform: translateY(-50%);
}
.drop.--open .drop-inside {
    opacity: 1;
    visibility: visible;
}
.drop.--open .drop-icon {
    transform: rotate(180deg);
}
.drop.-full .drop-submit {
    display: flex;
}
.drop.-full .drop-container {
    padding-bottom: 60px;
}
.drop.-full .drop-submit {
    display: flex;
}
.drop.-full .drop-container {
    padding-bottom: 60px;
}
/* End */


/* Start:/local/templates/estelifecentre/template_styles.css?1755182205186221*/
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainThin.woff2") format("woff2");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainUltraLight.woff2") format("woff2");
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainLight.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainRegular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainMedium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainBold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainExtraBold.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainBlack.woff2") format("woff2");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainThinItalic.woff2") format("woff2");
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainUltraLightItalic.woff2") format("woff2");
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainExtraBoldItalic.woff2") format("woff2");
    font-weight: 800;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainBlackItalic.woff2") format("woff2");
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainMediumItalic.woff2") format("woff2");
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainLightItalic.woff2") format("woff2");
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainRegularItalic.woff2") format("woff2");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "MainFont";
    src: url("/local/templates/estelifecentre/fonts/MainBoldItalic.woff2") format("woff2");
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}
:root {
    --font-family:  MainFont , system-ui;
    --font-line-height: 1.1em;
    --font-size: 16px;
    --font-root-size: 16;
    --color-black: #000;
    --color-white: #fff;
    --color-pink: #D90063;
    --color-font-black: #000;
    --color-font-white: #fff;
    --color-font-blue: #003F92;
    --color-font-dark-blue: #111842;
    --color-font-grey: #959BAB;
    --color-font-light-grey: #F6F6F9;
    --color-blue: #2C63AD;
    --color-dark-blue: #003F92;
    --color-light-blue: #E2EAF4;
    --color-dark-green: #489E9A;
    --container-max-width: 1300px;
    --container-padding: 10px;
    --border-radius: 5px;
    --animation: 300ms;
    --ui-icon-width: 24px;
    --ratio: 15;
}

*, *:before, *:after {
    box-sizing: border-box;
    -ms-flex: 0 1 auto;
}

pre {
    white-space: break-spaces;
}

html.--is-loading,
html.--is-loading *{
    cursor: wait!important;
}

body {
    line-height: var(--font-line-height);
    font-family: var(--font-family);
    font-size: var(--font-size);
    font-weight: normal;
    color: var(--color-font);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}



main.main{
    margin-bottom: 2rem;
}

.container {
    max-width: var(--container-max-width);
    width: 100%;
    margin: 0 auto;
    padding: 0 var(--container-padding);
    box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
}

p {
    line-height: 1.5em;
    margin-top: 0;
    margin-bottom: 1em;
    padding: 0;
    word-wrap: break-word;
}

b {
    font-weight: bold;
}

a,
a:visited {
    text-decoration: none;
    color: var(--color-font-black);
}

button, input, select, textarea {
    font-family: var(--font-family);
    font-weight: normal;
    color: var(--color-font);
}

button, select {
    cursor: pointer;
}

img {
    max-width: 100%;
    display: inline-flex;
}

ul {
    margin: 0;
    padding: 0;
}
ul li {
    list-style: none;
}

::-moz-selection {
    background: var(--color-black);
    color: var(--color-font-white);
}

::selection {
    background: var(--color-black);
    color: var(--color-font-white);
}

.mt1 {
    margin-top: 1rem;
}

.mb1 {
    margin-bottom: 1rem;
}

.pt1 {
    padding-top: 1rem;
}

.pb1 {
    padding-bottom: 1rem;
}

.gap1 {
    gap: 1rem;
}

.mt2 {
    margin-top: 2rem;
}

.mb2 {
    margin-bottom: 2rem;
}

.pt2 {
    padding-top: 2rem;
}

.pb2 {
    padding-bottom: 2rem;
}

.gap2 {
    gap: 2rem;
}

.mt3 {
    margin-top: 3rem;
}

.mb3 {
    margin-bottom: 3rem;
}

.pt3 {
    padding-top: 3rem;
}

.pb3 {
    padding-bottom: 3rem;
}

.gap3 {
    gap: 3rem;
}

.mt4 {
    margin-top: 4rem;
}

.mb4 {
    margin-bottom: 4rem;
}

.pt4 {
    padding-top: 4rem;
}

.pb4 {
    padding-bottom: 4rem;
}

.gap4 {
    gap: 4rem;
}

.mt5 {
    margin-top: 5rem;
}

.mb5 {
    margin-bottom: 5rem;
}

.pt5 {
    padding-top: 5rem;
}

.pb5 {
    padding-bottom: 5rem;
}

.gap5 {
    gap: 5rem;
}

.mt6 {
    margin-top: 6rem;
}

.mb6 {
    margin-bottom: 6rem;
}

.pt6 {
    padding-top: 6rem;
}

.pb6 {
    padding-bottom: 6rem;
}

.gap6 {
    gap: 6rem;
}

.w10 {
    width: 10%;
}

.h10 {
    height: 10%;
}

.w15 {
    width: 15%;
}

.h15 {
    height: 15%;
}

.w20 {
    width: 20%;
}

.h20 {
    height: 20%;
}

.w25 {
    width: 25%;
}

.h25 {
    height: 25%;
}

.w30 {
    width: 30%;
}

.h30 {
    height: 30%;
}

.w35 {
    width: 35%;
}

.h35 {
    height: 35%;
}

.w40 {
    width: 40%;
}

.h40 {
    height: 40%;
}

.w45 {
    width: 45%;
}

.h45 {
    height: 45%;
}

.w50 {
    width: 50%;
}

.h50 {
    height: 50%;
}

.w55 {
    width: 55%;
}

.h55 {
    height: 55%;
}

.w60 {
    width: 60%;
}

.h60 {
    height: 60%;
}

.w65 {
    width: 65%;
}

.h65 {
    height: 65%;
}

.w70 {
    width: 70%;
}

.h70 {
    height: 70%;
}

.w75 {
    width: 75%;
}

.h75 {
    height: 75%;
}

.w80 {
    width: 80%;
}

.h80 {
    height: 80%;
}

.w85 {
    width: 85%;
}

.h85 {
    height: 85%;
}

.w90 {
    width: 90%;
}

.h90 {
    height: 90%;
}

.w95 {
    width: 95%;
}

.h95 {
    height: 95%;
}

.w100 {
    width: 100%;
}

.h100 {
    height: 100%;
}

.--font-100 {
    font-weight: 100;
}

.--font-200 {
    font-weight: 200;
}

.--font-300 {
    font-weight: 300;
}

.--font-400 {
    font-weight: 400;
}

.--font-500 {
    font-weight: 500;
}

.--font-600 {
    font-weight: 600;
}

.--font-700 {
    font-weight: 700;
}

.--font-800 {
    font-weight: 800;
}

.--font-900 {
    font-weight: 900;
}

.noselect, .checkbox, .radio {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.nowrap {
    white-space: nowrap;
    text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
    overflow: hidden;
}

.noscroll {
    position: fixed;
    overflow: hidden;
    inset: 0px;
}

.clamp {
    --clamp:2;
    display: -webkit-box;
    -webkit-line-clamp: var(--clamp);
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.clamp.clamp-1 {
    --clamp:1;
}
.clamp.clamp-2 {
    --clamp:2;
}
.clamp.clamp-3 {
    --clamp:3;
}
.clamp.clamp-4 {
    --clamp:4;
}

.spinner {
    --size:2px;
    --speed:0.8s;
    --width:20px;
    --fill:var(--color);
    --background-color:transparent;
}
.spinner:before {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    width: var(--width);
    height: var(--width);
    margin-top: calc(var(--width) - var(--width) * 1.5);
    margin-left: calc(var(--width) - var(--width) * 1.5);
    border-radius: 50%;
    border: var(--size) solid var(--fill);
    border-top-color: var(--background-color);
    animation: spinner var(--speed) linear infinite;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

@keyframes spinner {
    to {
        transform: rotate(360deg);
    }
}
.close {
    --width:1em;
    --volume:2px;
    --color:#000;
    position: relative;
    display: inline-flex;
    width: var(--width);
    height: var(--width);
    cursor: pointer;
    overflow: hidden;
}
.close:before, .close:after {
    position: absolute;
    top: 0;
    left: 50%;
    content: "";
    height: var(--width);
    width: 0;
    border: solid var(--color);
    border-width: 0px var(--volume) 0 0;
    background-color: var(--color);
}
.close:before {
    transform: rotate(45deg);
}
.close:after {
    transform: rotate(-45deg);
}

[data-count] {
    --zero-backgound-color:#adadad;
    --count-backgound-color:var(--color-pink);
    --backgound-color:var(--count-backgound-color);
    position: relative;
}
[data-count]::after {
    position: absolute;
    content: attr(data-count);
    width: 14px;
    height: 14px;
    right: -7px;
    top: -5px;
    background-color: var(--backgound-color);
    font-size: 8px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 14px;
    color: #fff;
    border-radius: 50%;
    text-align: center;
}

[data-count="0"] {
    --backgound-color:var(--zero-backgound-color);
}

[data-text]::before {
    content: attr(data-text);
}

@media screen and (min-width: 375px) and (max-width: 425px) {
    [data-short] span {
        display: none;
    }
    [data-short]:before {
        content: attr(data-short);
    }
}

.scrollbar, body {
    --scrollbar-width: 10px;
    --scrollbar-track-width: 0px;
    --scrollbar-track-border-radius: 0px;
    --scrollbar-track-color: #e3e3e3;
    --scrollbar-scrollbar-thumb-color: #525252;
    --scrollbar-scrollbar-thumb-border-radius: 3px;
}
.scrollbar::-webkit-scrollbar, body::-webkit-scrollbar {
    width: var(--scrollbar-width);
}
.scrollbar::-webkit-scrollbar-track, body::-webkit-scrollbar-track {
    background: var(--scrollbar-track-color);
    border-radius: var(--scrollbar-track-border-radius);
    width: var(--scrollbar-track-width);
}
.scrollbar::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb {
    border-radius: var(--scrollbar-scrollbar-thumb-border-radius);
    background: var(--scrollbar-scrollbar-thumb-color);
}

.props-list {
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.props-list.--grid-2 {
    -moz-column-count: 2;
    column-count: 2;
    -moz-column-gap: 100px;
    column-gap: 100px;
}
.props-list__item {
    align-items: baseline;
    -moz-column-break-inside: avoid;
    break-inside: avoid;
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    page-break-inside: avoid;
    font-size: 16px;
    color: var(--color-font-dark-blue);
}
.props-list__title {
    align-items: baseline;
    display: flex;
    flex: 1;
    flex-grow: 0;
    white-space: nowrap;
    font-style: normal;
    font-weight: 400;
    color: #000000;
}
.props-list__sep {
    border-bottom: 1px dotted #4b545b;
    content: "";
    flex-grow: 1;
    margin: 0 6px 0 2px;
    opacity: 0.25;
}
.props-list__value {
    text-align: right;
    color: var(--color-font-grey);
}

a.btn, .btn {
    --color: var(--color-font-black);
    --background-color: #fff;
    --active-color: #fff;
    --active-border-color: var(--color-black);
    --active-background-color: transparent;
    --font-size: 16px;
    --font-color: var(--color);
    --font-weight: 500;
    --gap: 10px;
    --padding-tb: 8px;
    --padding-lr: 20px;
    --border-color: var(--color-black);
    --border-width: 1px;
    --border-radius: 8px;
    display: inline-flex;
    gap: var(--gap);
    align-items: center;
    align-content: space-between;
    justify-content: center;
    padding: var(--padding-tb) var(--padding-lr);
    position: relative;
    cursor: pointer;
    font-size: var(--font-size);
    font-weight: var(--font-weight);
    color: var(--font-color);
    background: var(--background-color);
    border: var(--border-width) solid var(--border-color);
    border-radius: var(--border-radius);
    outline: none;
    line-height: 1em;
    text-decoration: none;
}
a.btn .icon, .btn .icon {
    --ui-icon-width:1.1em;
    --fill:var(--color);
    fill: var(--color);
    margin: 0 calc(var(--margin-inner) / 2.5);
    box-sizing: border-box;
    transition: var(--transition);
    position: relative;
}
a.btn span, .btn span {
    color: var(--color);
    font-size: var(--font-size);
    line-height: 1em;
    text-decoration: none;
    position: relative;
}
a.btn:disabled, .btn:disabled {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn:disabled:not(.--is-loading):hover, .btn:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}

a.btn:disabled.--is-loading,
.btn:disabled.--is-loading,
a.btn:disabled.--is-loading:hover,
.btn:disabled.--is-loading:hover {
    filter: opacity(0.8);
}


a.btn:disabled.-wait, .btn:disabled.-wait {
    --color: #fff;
    --border-color: var(--color-main);
    --background-color: var(--color-main);
    --color: #fff;
    --border-color: var(--color-main) !important;
    --background-color: var(--color-main) !important;
}
a.btn:hover, .btn:hover {
    --color: var(--color-font-black);
    --border-color: var(--active-border-color);
    --background-color: #fff;
}
a.btn.--black, .btn.--black {
    --border-color: var(--color-black);
    --background-color: var(--color-black);
    --color: #fff;
}
a.btn.--black.--is-loading, .btn.--black.--is-loading {

}
a.btn.--black:not(.--is-loading):hover, .btn.--black:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--black:disabled:not(.--is-loading), .btn.--black:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--black:disabled:not(.--is-loading):hover, .btn.--black:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.--white, .btn.--white {
    --border-color: var(--color-white);
    --background-color: var(--color-white);
    --color: #fff;
}
a.btn.--white.--is-loading, .btn.--white.--is-loading {
    --color: #fff;
}
a.btn.--white:not(.--is-loading):hover, .btn.--white:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--white:disabled:not(.--is-loading), .btn.--white:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--white:disabled:not(.--is-loading):hover, .btn.--white:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.--pink, .btn.--pink {
    --border-color: var(--color-pink);
    --background-color: var(--color-pink);
    --color: #fff;
}
a.btn.--pink.--is-loading, .btn.--pink.--is-loading {
    --color: #fff;
}
a.btn.--pink:not(.--is-loading):hover, .btn.--pink:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--pink:disabled:not(.--is-loading), .btn.--pink:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--pink:disabled:not(.--is-loading):hover, .btn.--pink:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.--font-black, .btn.--font-black {
    --border-color: var(--color-font-black);
    --background-color: var(--color-font-black);
    --color: #fff;
}
a.btn.--font-black.--is-loading, .btn.--font-black.--is-loading {
    --color: #fff;
}
a.btn.--font-black:not(.--is-loading):hover, .btn.--font-black:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--font-black:disabled:not(.--is-loading), .btn.--font-black:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--font-black:disabled:not(.--is-loading):hover, .btn.--font-black:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.--font-white, .btn.--font-white {
    --border-color: var(--color-font-white);
    --background-color: var(--color-font-white);
    --color: #fff;
}
a.btn.--font-white.--is-loading, .btn.--font-white.--is-loading {
    --color: #fff;
}
a.btn.--font-white:not(.--is-loading):hover, .btn.--font-white:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--font-white:disabled:not(.--is-loading), .btn.--font-white:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--font-white:disabled:not(.--is-loading):hover, .btn.--font-white:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.--font-blue, .btn.--font-blue {
    --border-color: var(--color-font-blue);
    --background-color: var(--color-font-blue);
    --color: #fff;
}
a.btn.--font-blue.--is-loading, .btn.--font-blue.--is-loading {
    --color: #fff;
}
a.btn.--font-blue:not(.--is-loading):hover, .btn.--font-blue:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--font-blue:disabled:not(.--is-loading), .btn.--font-blue:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--font-blue:disabled:not(.--is-loading):hover, .btn.--font-blue:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.--font-dark-blue, .btn.--font-dark-blue {
    --border-color: var(--color-font-dark-blue);
    --background-color: var(--color-font-dark-blue);
    --color: #fff;
}
a.btn.--font-dark-blue.--is-loading, .btn.--font-dark-blue.--is-loading {
    --color: #fff;
}
a.btn.--font-dark-blue:not(.--is-loading):hover, .btn.--font-dark-blue:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--font-dark-blue:disabled:not(.--is-loading), .btn.--font-dark-blue:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--font-dark-blue:disabled:not(.--is-loading):hover, .btn.--font-dark-blue:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.--font-grey, .btn.--font-grey {
    --border-color: var(--color-font-grey);
    --background-color: var(--color-font-grey);
    --color: #fff;
}
a.btn.--font-grey.--is-loading, .btn.--font-grey.--is-loading {
    --color: #fff;
}
a.btn.--font-grey:not(.--is-loading):hover, .btn.--font-grey:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--font-grey:disabled:not(.--is-loading), .btn.--font-grey:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--font-grey:disabled:not(.--is-loading):hover, .btn.--font-grey:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.--font-light-grey, .btn.--font-light-grey {
    --border-color: var(--color-font-light-grey);
    --background-color: var(--color-font-light-grey);
    --color: #fff;
}
a.btn.--font-light-grey.--is-loading, .btn.--font-light-grey.--is-loading {
    --color: #fff;
}
a.btn.--font-light-grey:not(.--is-loading):hover, .btn.--font-light-grey:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--font-light-grey:disabled:not(.--is-loading), .btn.--font-light-grey:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--font-light-grey:disabled:not(.--is-loading):hover, .btn.--font-light-grey:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.--blue, .btn.--blue {
    --border-color: var(--color-blue);
    --background-color: var(--color-blue);
    --color: #fff;
}
a.btn.--blue.--is-loading, .btn.--blue.--is-loading {
    --color: #fff;
}
a.btn.--blue:not(.--is-loading):hover, .btn.--blue:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--blue:disabled:not(.--is-loading), .btn.--blue:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--blue:disabled:not(.--is-loading):hover, .btn.--blue:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.--dark-blue, .btn.--dark-blue {
    --border-color: var(--color-dark-blue);
    --background-color: var(--color-dark-blue);
    --color: #fff;
}
a.btn.--dark-blue.--is-loading, .btn.--dark-blue.--is-loading {
    --color: #fff;
}
a.btn.--dark-blue:not(.--is-loading):hover, .btn.--dark-blue:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--dark-blue:disabled:not(.--is-loading), .btn.--dark-blue:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--dark-blue:disabled:not(.--is-loading):hover, .btn.--dark-blue:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.--light-blue, .btn.--light-blue {
    --border-color: var(--color-light-blue);
    --background-color: var(--color-light-blue);
    --color: #fff;
}
a.btn.--light-blue.--is-loading, .btn.--light-blue.--is-loading {
    --color: #fff;
}
a.btn.--light-blue:not(.--is-loading):hover, .btn.--light-blue:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--light-blue:disabled:not(.--is-loading), .btn.--light-blue:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--light-blue:disabled:not(.--is-loading):hover, .btn.--light-blue:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.--dark-green, .btn.--dark-green {
    --border-color: var(--color-dark-green);
    --background-color: var(--color-dark-green);
    --color: #fff;
}
a.btn.--dark-green.--is-loading, .btn.--dark-green.--is-loading {
    --color: #fff;
}
a.btn.--dark-green:not(.--is-loading):hover, .btn.--dark-green:not(.--is-loading):hover {
    --border-color: var(--background-color);
}
a.btn.--dark-green:disabled:not(.--is-loading), .btn.--dark-green:disabled:not(.--is-loading) {
    cursor: default;
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
    --active-color: #aaaaaa;
    --active-border-color: #ededed;
    --active-background-color: #ededed;
}
a.btn.--dark-green:disabled:not(.--is-loading):hover, .btn.--dark-green:disabled:not(.--is-loading):hover {
    --color: #aaaaaa;
    --border-color: #ededed;
    --background-color: #ededed;
}
a.btn.-compact, .btn.-compact {
    --gap: 5px;
    --font-size: 14px;
    padding: 8px 12px;
}
a.btn.-compact .icon, .btn.-compact .icon {
    --ui-icon-width: 15px;
}
a.btn.-simple, .btn.-simple {
    padding: 0;
    background: transparent;
    border: none;
    font-weight: 400;
}
a.btn.-simple span, .btn.-simple span {
    text-decoration: underline;
}
a.btn.-simple:hover, .btn.-simple:hover {
    --color:var(--color-free-blue) ;
}
a.btn.-link, .btn.-link {
    --color: var(--color-font-black);
    --padding-tb: 0;
    --padding-lr: 0;
    --margin-inner: 0.5rem;
    --background-color: transparent;
    border: none;
    outline: none;
    text-decoration: none;
    font-weight: 400;
}
a.btn.-inside, .btn.-inside {
    --color: var(--border-color);
    background-color: #fff;
}
a.btn.--is-loading, .btn.--is-loading {
    --fill:var(--color);
    --size:1rem;
    position: relative;
    cursor: wait;
}
a.btn.--is-loading *, .btn.--is-loading * {
    opacity: 0;
}
a.btn.--is-loading span, .btn.--is-loading span {
    visibility: hidden;
}
a.btn.--is-loading:before, .btn.--is-loading:before {
    opacity: 1;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    border: 2px solid var(--fill);
    border-top-color: transparent;
    margin: -10px -10px;
    animation: rotating 600ms linear infinite;
    width: 20px;
    height: 20px;
    border-radius: 50%;
}
a.btn.--download .icon, .btn.--download .icon {
    --ui-icon-width: 16px;
    --fill: var(--color-blue);
}

@keyframes rotating {
    100% {
        transform: rotate(360deg);
    }
}
@keyframes hover {
    0% {
        transform: translateY(0%);
        opacity: 0;
    }
    50% {
        transform: translateY(50%);
        opacity: 1;
    }
    100% {
        transform: translateY(100%);
        opacity: 0;
    }
}
.icon,
svg.icon {
    --width:var(--ui-icon-width, 32px);
    --height:var(--width);
    --backgound-color:transparent;
    display: inline-flex;
    width: var(--width);
    height: var(--height);
    border: none;
    padding: 0;
    background: none;
}

.icon-btn-filled, .icon-btn.--filled {
    background: var(--ui-filled-color);
}

.icon-btn {
    --ui-box-size:30px;
    --ui-icon-width: 16px;
    --ui-border-color: transparent;
    --ui-filled-color: whitesmoke;
    background: #fff;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    width: var(--ui-box-size);
    height: var(--ui-box-size);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    border: 1px solid var(--ui-border-color);
}
.icon-btn:hover {
    background: whitesmoke;
}

.input {
    --border-color: #e3e3e3;
    --border-width:1px;
    --border-style:solid;
    --background-color: #fff;
    width: 100%;
    padding: 12px;
    border-radius: 8px;
    box-sizing: border-box;
    background: var(--background-color);
    outline: none;
    color: #333;
    font-weight: 500;
    font-size: 16px;
    border: var(--border-width) var(--border-style) var(--border-color);
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    height: 48px;
}
.input::-moz-placeholder {
    color: #a3a3a3;
    font-weight: 400;
}
.input::placeholder {
    color: #a3a3a3;
    font-weight: 400;
}
.input:disabled {
    cursor: default;
    --font-color: #c9c9c9!important;
    --border-color: #e7e7e7!important;
    --background-color: #f7f7f7!important;
}

.input.--is-error{
    --border-color: #f57171;
}

.input.--is-error::placeholder{
    --border-color: #f57171;
}

.input:not([readonly]):focus {
    --border-color: var(--color-blue);
}

textarea.input {
    resize: vertical;
    min-height: 120px;
}

select.input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23000000" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9"></polyline></svg>');
    background-repeat: no-repeat;
    background-position: calc(100% - 10px) 50%;
    background-size: 18px;
    padding-right: 30px;
}
select.input:invalid {
    color: gray;
}
select.input option[value=""][disabled] {
    display: none;
}
select.input option {
    color: black;
}

.checkbox, .radio {
    --color: #fff;
    --border-color: #B3B8C5;
    --background-color: var(--color-black);
    --active-color: #fff;
    --active-border-color: #003F92;
    --active-background-color: #003F92;
    --icon-size: 1.65em;
    display: grid;
    align-items: center;
    grid-template-columns: var(--icon-size) 1fr;
    cursor: pointer;
    line-height: 1em;
    position: relative;
    align-items: center;
    align-content: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: auto;
    font-size: 1em;
}
.checkbox:not(.disabled):hover input:not(:checked), .radio:not(.disabled):hover input:not(:checked) {
    border-color: var(--active-border-color);
}
.checkbox input, .radio input {
    margin: 0px;
    outline: none;
    display: block;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 7px;
    width: var(--icon-size);
    height: var(--icon-size);
    border: 1px solid var(--border-color);
    background: rgb(255, 255, 255);
    position: relative;
    top: 0px;
}
.checkbox input:checked, .radio input:checked {
    border: 2px solid var(--active-border-color);
    background: var(--active-background-color);
}
.checkbox input:checked::before,
.radio input:checked::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 12px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg  fill='var(--active-color, white)' stroke='1' viewBox='0 -46 417.81333 417'  xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m159.988281 318.582031c-3.988281 4.011719-9.429687 6.25-15.082031 6.25s-11.09375-2.238281-15.082031-6.25l-120.449219-120.46875c-12.5-12.5-12.5-32.769531 0-45.246093l15.082031-15.085938c12.503907-12.5 32.75-12.5 45.25 0l75.199219 75.203125 203.199219-203.203125c12.503906-12.5 32.769531-12.5 45.25 0l15.082031 15.085938c12.5 12.5 12.5 32.765624 0 45.246093zm0 0'/%3E%3C/svg%3E");
}

.radio input:checked::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    height: 55%;
    width: 55%;
    background: #003f92;
    border-radius: 50%;
    transform: translate(-50%, -54%);
}

.checkbox input:checked + span, .radio input:checked + span {
    opacity: 1;
}
.checkbox span, .radio span {
    --padding-left: 5px;
    padding-left: var(--padding-left);
    box-sizing: border-box;
    position: relative;
    top: 0;
    color: var(--background-color);
    opacity: 0.7;
}

.checkbox span small{
    opacity: 0.6;
}
.checkbox.disabled, .radio.disabled {
    --color:#000;
    cursor: default;
    opacity: 0.4;
}
.checkbox.disabled span, .radio.disabled span {
    color: var(--color);
}
.checkbox.disabled span *, .radio.disabled span * {
    color: var(--color) !important;
}
.checkbox.disabled input, .radio.disabled input {
    background-color: var(--color-whitesmoke) !important;
    cursor: default !important;
    border: 1px solid #000 !important;
}

.radio input {
    border-radius: 50%;
}
.radio input::before {

}
.radio input:checked {
    border-width: 4px;
    --border-color:var(--active-border-color);
    background: #fff;
}
.radio:hover input {
    border-width: 4px;
    --border-color:var(--active-border-color);
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    letter-spacing: -0.2px;
}

h1, .h1 {
    font-size: 36px;
    line-height: 1.1;
    margin-bottom: 30px;
    font-weight: 500;
    color: var(--color-font-dark-blue);
}


@media screen and (max-width: 770px) {
    h1, .h1 {
        font-size: 30px;
    }
}

@media screen and (max-width: 480px) {
    h1, .h1 {
        font-size: 26px;
    }
}

h2, .h2 {
    font-size: 55px;
    line-height: 1.2;
    margin-bottom: 1rem;
    font-weight: 500;
}
@media screen and (max-width: 1300px) {
    h2, .h2 {
        font-size: 42px;
    }
}
@media screen and (max-width: 1024px) {
    h2, .h2 {
        font-size: 32px;
    }
}

h3, .h3 {
    font-size: 20px;
    line-height: 1.2;
    margin-bottom: 1rem;
    font-weight: 500;
}

body {
    position: relative;
    background: var(--color-bg-white);
}
body.--is-processing {
    cursor: wait;
}

.bg-linear-gradient {
    background: #2b76dc;
    background: linear-gradient(75deg, #2b76dc 0%, #123360 100%);
}

.padding-block {
    padding: 50px 0;
}
@media screen and (max-width: 1024px) {
    .padding-block {
        padding: 30px 0;
    }
}
.padding-block .section {
    margin-bottom: 0;
}

.email {
    font-size: 14px;
    line-height: 1.2;
    color: var(--color-font-grey);
    white-space: nowrap;
}

.phone {
    font-size: 20px;
    line-height: 1.2;
    color: var(--color-font-black);
    font-weight: 500;
    white-space: nowrap;
}

.search {
    width: 100%;
    --padding-left: 50px;
    position: relative;
}
.search-container {
    position: relative;
}
.search-icon {
    position: absolute;
    top: 50%;
    left: calc(var(--padding-left) / 2);
    transform: translate(-50%, -50%);
    --ui-icon-width: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.search-icon.search-icon-clear-value{
    left: auto;
    right: 10px;
    --ui-icon-width: 10px;
}

.search .input {
    --background-color: #F2F4F7;
    border-radius: 8px;
    padding-left: var(--padding-left);
    font-size: 14px;
    border: 1px solid var(--background-color);
}
.search .input::-moz-placeholder {
    color: var(--color-font-dark-blue);
    font-weight: 400;
}
.search .input::placeholder {
    color: var(--color-font-dark-blue);
    font-weight: 400;
}
.search-content {
    position: absolute;
    top: calc(100% + 5px);
    left: calc(-50% + 16px);
    padding-top: 10px;
    width: 900px;
    z-index: 200;
    display: none;
}
@media screen and (max-width: 1300px) {
    .search-content {
        left: 0;
        width: 100%;
    }
}
.search-content:before {
    position: absolute;
    border-bottom: 10px solid #fff;
    border-left: 9px solid transparent;
    border-right: 9px solid transparent;
    content: "";
    left: 20%;
    top: 0;
    z-index: 200;
}
@media screen and (max-width: 1300px) {
    .search-content:before {
        left: 1rem;
    }
}
.search-content.opened {
    display: block;
}
.search-result {
    width: 100%;
    background-color: #fff;
    padding: 45px;
    box-shadow: 0 0 40px 0px rgba(0, 0, 0, 0.149);
    border-radius: 40px;
    position: relative;
    padding-right: 4rem;
}
@media screen and (max-width: 1300px) {
    .search-result {
        border-radius: 10px;
        padding: 20px 1rem;
    }
}
.search-result-close {
    position: absolute;
    top: 2rem;
    right: 2rem;
    display: flex;
    --ui-icon-width: 16px;
    --stroke-width: 2px;
    cursor: pointer;
}
@media screen and (max-width: 1300px) {
    .search-result-close {
        top: 1rem;
        right: 1rem;
        --ui-icon-width: 14px;
        --stroke-width: 1.5px;
    }
}
.search-result-block {

}
@media screen and (max-width: 1300px) {
    .search-result-block {
        margin-bottom: 0;
    }
}
.search-result-block-name {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    margin-bottom: 20px;
    color: var(--color-font-grey);
}
@media screen and (max-width: 1300px) {
    .search-result-block.search-result-block-hit {
        display: none;
    }
}
.search-result-block-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 15px;
}
.search-result-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    cursor: pointer;
}
.search-result-row:not(:last-child) {
    margin-bottom: 10px;
}
.search-result-row-icon {
    display: flex;
    --ui-icon-width: 1rem;
}
.search-result-row-value {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.search-result-btn {
    text-align: center;
}
@media screen and (max-width: 1300px) {
    .search-result-btn {
        display: none;
    }
}
.search-result-btn .btn {
    --font-size: 14px;
    --border-radius: 10px;
    --padding-tb: 12px;
    --padding-lr: 38px;
    --color: var(--color-font-dark-blue);
    --border-color: var(--color-font-dark-blue);
}

.search-result-block-results{

}

.search-result-block-results .search-result-row{

}

.search-result-block-results .search-result-row-value{
    font-size: 16px;
    font-weight: 500;
}

.search-result-block-results .search-result-row:hover .search-result-row-value{
    color: var(--color-pink);
}


.search-result-block-results .search-result-row-icon{
    display: none;
}

.breadcrumbs {
    margin-bottom: 20px;
}
.breadcrumbs-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    padding: 10px 0;
    max-width: 100%;
    overflow: auto;
    white-space: nowrap;
}
.breadcrumbs-item:not(:last-child):after {
    content: "/";
    margin-left: 10px;
}

.breadcrumbs-item a{
    display: inline-block;
}

.breadcrumbs-item a span {
    color: var(--color-font-black);
}
.breadcrumbs-item a:hover {
    text-decoration: underline;
}
.breadcrumbs-item.breadcrumbs-item-last span {
    color: var(--color-font-grey);
}
.header{
    position: relative;
    z-index: 50;
}
.header.header-shadow {
    box-shadow: 0 4px 50px 0 rgba(6, 6, 30, 0.1);
    margin-bottom: 2rem;
}
.header-line {
    background-color: var(--color-blue);
}
.header-line-wrapper {
    display: flex;
    align-items: center;
    gap: 1rem;
    width: 100%;
    max-width: 1900px;
    margin: 0 auto;
    padding: 8px 10px;
}
@media screen and (max-width: 480px) {
    .header-line-wrapper {
        align-items: flex-start;
    }
}
.header-line-block {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 27px;
}
.header-line-block-text {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 15px;
    font-weight: 400;
    color: var(--color-font-white);
    --ui-icon-width: 18px;
    --fill: var(--color-white);
}
@media screen and (max-width: 1024px) {
    .header-line-block-text {
        font-size: 13px;
        gap: 5px;
    }
}
.header-line-block-btns {
    display: flex;
    align-items: center;
    gap: 13px;
}
.header-line-block-btns .btn, .header-line-block-btns a.btn {
    border-bottom: 1px solid var(--color-dark-green);
    --border-radius: 0;
    --padding-tb: 6px;
    --font-size: 13px;
    --color: var(--color-font-white);
}
.header-line-icon {
    display: flex;
    align-items: center;
    margin-left: auto;
    padding: 5px;
    cursor: pointer;
    --ui-icon-width: 11px;
    --fill: var(--color-white);
}
.header-top {
    z-index: 11;
    padding: 10px 0;
    position: relative;
    border-bottom: 1px solid rgba(35, 60, 112, 0.10);
}
@media screen and (max-width: 1024px) {
    .header-top {
        display: none;
    }
}
.header-top-wrapper {
    display: flex;
    align-items: center;
    gap: 60px;
}
@media screen and (max-width: 1300px) {
    .header-top-wrapper {
        gap: 1rem;
    }
}
.header-top-profile {
    margin-left: auto;
}

.header-top-profile .login {
    text-decoration: underline;
    font-weight: 500;
}
.header-top-profile.unauthorized .email {
    display: none;
}
.header-nav-wrapper {
    display: flex;
    align-items: center;
    gap: 5px;
}
@media screen and (max-width: 1300px) {
    .header-nav-wrapper {
        gap: 0;
    }

}
.header-nav-item {
    padding: 8px;
    font-size: 15px;
    font-weight: 500;
}
.header-body {
    padding: 15px 0;
    position: relative;
    z-index: 10;
}
.header-body-wrapper {
    display: flex;
    align-items: center;
    gap: 90px;
}
@media screen and (max-width: 1300px) {
    .header-body-wrapper {
        gap: 62px;
    }
    .header-nav-item {
        padding: 8px 5px;
        font-size: 14px;
    }
    .header-top-profile a{
        font-size: 14px;
    }
}
@media screen and (max-width: 1024px) {
    .header-body-wrapper {
        gap: 2rem;
    }
}
@media screen and (max-width: 768px) {
    .header-body-wrapper {
        flex-wrap: wrap;
    }
}
.header-body-block {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 1rem;
}
@media screen and (max-width: 768px) {
    .header-body-block {
        order: 2;
        gap: 10px;
    }
}
.header-body-icons {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-left: auto;
}
.header-logo {
    width: 100%;
    max-width: 202px;
}
@media screen and (max-width: 1024px) {
    .header-logo {
        max-width: 143px;
    }
}
.header-logo img {
    display: block;
    width: 100%;
}
.header-catalog {
    position: relative;
    z-index: 50;
}
.header-catalog-btn {
    --border-radius: 8px;
    --font-size: 18px;
    --font-weight: 400;
    --padding-tb: 10px;
}
.header-catalog-btn .icon {
    width: 24px;
    height: 8px;
}
.header-catalog-btn .icon.icon-close {
    display: none;
}
.header-catalog-btn .span-close {
    display: none;
}
@media screen and (max-width: 1024px) {
    .header-catalog-btn {
        display: none;
    }
}
.header-catalog-btn-mobile {
    display: none;
    --padding-lr: 11px;
    --padding-tb: 17px;
}
.header-catalog-btn-mobile .icon {
    width: 24px;
    height: 8px;
}
@media screen and (max-width: 1024px) {
    .header-catalog-btn-mobile {
        display: flex;
    }
}
.header-catalog-btn.active .icon {
    display: none;
}
.header-catalog-btn.active .icon.icon-close {
    display: inline-flex;
    width: 20px;
    height: 12px;
}
.header-catalog-btn.active span {
    display: none;
}
.header-catalog-btn.active .span-close {
    display: block;
}
.header-catalog-box {
    padding-top: 10px;
    position: absolute;
    top: calc(100% + 5px);
    left: 0;
    transform: translateX(-30%);
    z-index: 10;
    display: none;
}
@media screen and (max-width: 1800px) {
    .header-catalog-box {
        transform: translateX(-25%);
    }
}
@media screen and (max-width: 1600px) {
    .header-catalog-box {
        transform: translateX(-20%);
    }
}
.header-catalog-box::before {
    position: absolute;
    border-bottom: 10px solid #fff;
    border-left: 9px solid transparent;
    border-right: 9px solid transparent;
    content: "";
    left: calc(30% + 22px);
    top: 0;
}
@media screen and (max-width: 1800px) {
    .header-catalog-box::before {
        left: calc(25% + 22px);
    }
}
@media screen and (max-width: 1600px) {
    .header-catalog-box::before {
        left: calc(20% + 22px);
    }
}
.header-catalog-box.opened {
    display: block;
}
.header-catalog-container {
    background-color: #fff;
    box-shadow: 0 0 40px 0px rgba(0, 0, 0, 0.149);
    padding: 3rem 10rem;
    border-radius: 20px;
    overflow: hidden;
}

.header-catalog-body-right .card-product{
    height: auto;
}

@media screen and (max-width: 1800px) {
    .header-catalog-container {
        padding: 2rem;
    }
}
.header-catalog-body {
    display: grid;
    grid-template-columns: 1fr 310px;
    gap: 160px;
    margin-bottom: 55px;
}
@media screen and (max-width: 1800px) {
    .header-catalog-body {
        grid-template-columns: 1fr 260px;
        gap: 60px;
    }
}
@media screen and (max-width: 1600px) {
    .header-catalog-body {
        margin-bottom: 2rem;
    }
}
@media screen and (max-width: 1300px) {
    .header-catalog-body {
        grid-template-columns: 1fr;
    }
}
@media screen and (max-width: 1300px) {
    .header-catalog-body-right {
        display: none;
    }
}
.header-catalog-list {
    -moz-column-count: 2;
    column-count: 2;
    gap: 170px;
}
@media screen and (max-width: 1600px) {
    .header-catalog-list {
        gap: 2rem;
    }
}
.header-catalog-sublist {
    padding-left: 26px;
    margin-bottom: 30px;
    margin-top: 30px;
}
@media screen and (max-width: 1600px) {
    .header-catalog-sublist {
        margin-bottom: 16px;
        margin-top: 16px;
    }
}
.header-catalog-link {
    font-size: 22px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 30px;
    white-space: nowrap;
}
@media screen and (max-width: 1600px) {
    .header-catalog-link {
        margin-bottom: 16px;
        font-size: 18px;
    }
}
.header-catalog-link a {
    color: var(--color-font-dark-blue);
}
.header-catalog-sublink {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.1;
    color: #5D606A;
    list-style-type: disc;
    margin-bottom: 10px;
}
.header-catalog-sublink:last-child {
    margin-bottom: 0;
}
.header-catalog-sublink a {
    color: #5D606A;
}
.header-catalog-footer {
    padding-top: 18px;
    border-top: 1px solid #E7EBF1;
    max-width: 380px;
}
.header-catalog-footer-text {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
    margin-bottom: 20px;
}
.header-catalog-footer-phone {
    white-space: nowrap;
}
.header-catalog-footer-phone a {
    font-size: 22px;
    line-height: 1;
    color: var(--color-font-black);
    font-weight: 500;
    position: relative;
}
.header-catalog-footer-phone a::after {
    --width: 5px;
    content: "";
    position: absolute;
    top: 0;
    right: -10px;
    width: var(--width);
    height: var(--width);
    background-color: #43BF75;
    border-radius: 50%;
}
.header-search {
    width: 100%;
    max-width: 390px;
}
@media screen and (max-width: 1300px) {
    .header-search {
        max-width: 100%;
    }
}
.header-phone {
    margin-left: auto;
    white-space: nowrap;
}
@media screen and (max-width: 1300px) {
    .header-phone {
        display: none;
    }
    .ui-menu-footer-phone .header-phone {
        display: block;
    }
}
.header-phone a {
    font-size: 22px;
    line-height: 1;
    color: var(--color-font-black);
    font-weight: 500;
    position: relative;
}
.header-phone a::after {
    --width: 5px;
    content: "";
    position: absolute;
    top: 0;
    right: -10px;
    width: var(--width);
    height: var(--width);
    background-color: #43BF75;
    border-radius: 50%;
}
.header-icon {
    padding: 5px;
}
.header-icon-item {
    display: flex;
    align-items: center;
    justify-content: center;
    --ui-icon-width: 22px;
}

.location {
    position: relative;
}

.location.drop {
    z-index: unset;
}

.location-header {
    display: flex;
    align-items: center;
}
.location-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    --ui-icon-width: 15px;
}
.location-btn {
    margin-left: 5px;
    font-size: 14px;
    line-height: 1.3;
    font-weight: 500;
    cursor: pointer;
    position: relative;
}
.location-btn::after {
    content: "";
    position: absolute;
    bottom: -3px;
    left: 0;
    display: block;
    width: 100%;
    height: 1px;
    background-color: #B7BCD5;
}
.location-text {
    margin-left: 7px;
    font-size: 14px;
    color: var(--color-font-grey);
    line-height: 1.3;
}
.location-container {
    display: none;
    position: absolute;
    top: calc(100% + 10px);
    left: -50%;
    padding-top: 10px;
    z-index: 10;
}
@media screen and (max-width: 1600px) {
    .location-container {
        left: 0;
    }
}
.location-container::before {
    position: absolute;
    border-bottom: 10px solid #fff;
    border-left: 9px solid transparent;
    border-right: 9px solid transparent;
    content: "";
    left: 10rem;
    top: 0;
}
@media screen and (max-width: 1600px) {
    .location-container::before {
        left: 3rem;
    }
}
.location-container.opened {
    display: block;
}
.location-content {
    background-color: #fff;
    border-radius: 40px;
    padding: 45px 60px 45px 55px;
    box-shadow: 0px 30px 80px 0px rgba(24, 17, 61, 0.1411764706);
    min-width: 570px;
}
@media screen and (max-width: 1600px) {
    .location-content {
        border-radius: 10px;
        padding: 2rem;
        padding-right: 60px;
        min-width: 500px;
    }
}
.location-content-close {
    position: absolute;
    top: 2rem;
    right: 2rem;
    cursor: pointer;
    --stroke-width: 1;
    --ui-icon-width: 24px;
}
@media screen and (max-width: 1600px) {
    .location-content-close {
        --ui-icon-width: 20px;
    }
}
.location-content-wrapper {
    margin-bottom: 42px;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
.location-content-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    cursor: pointer;
    --icon-size: 24px;
}
@media screen and (max-width: 1600px) {
    .location-content-row {
        --icon-size: 20px;
        gap: 1rem;
    }
}
.location-content-row-name {
    display: grid;
    grid-template-columns: var(--icon-size) 1fr;
    align-items: center;
    gap: 10px;
}
.location-content-row-name span {
    --padding-left: 0;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1600px) {
    .location-content-row-name span {
        font-size: 16px;
    }
}
.location-content-row-value-address {
    font-size: 13px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
    margin-bottom: 5px;
}
.location-content-row-value-phone {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-black);
}
.location-content-footer {
    padding-top: 18px;
    border-top: 1px solid #E7EBF1;
    max-width: 360px;
}
.location-content-footer-text {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
    margin-bottom: 22px;
}
.location-content-footer-phone {
    white-space: nowrap;
}
.location-content-footer-phone a {
    font-size: 22px;
    line-height: 1;
    color: var(--color-font-black);
    font-weight: 500;
    position: relative;
}
.location-content-footer-phone a::after {
    --width: 5px;
    content: "";
    position: absolute;
    top: 0;
    right: -10px;
    width: var(--width);
    height: var(--width);
    background-color: #43BF75;
    border-radius: 50%;
}

.socials {
    display: flex;
    align-items: center;
    gap: 20px;
}
.socials-item {
    display: flex;
    align-items: center;
    --ui-icon-width: 35px;
    cursor: pointer;
}

.footer {
    background-color: var(--color-light-blue);
    padding: 60px 0;
    background-image: url("/local/templates/estelifecentre/img/bg-footer.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
@media screen and (max-width: 1024px) {
    .footer {
        padding: 2rem 0;
    }
}
.footer-wrapper {
    display: grid;
    grid-template-columns: 1fr;
    gap: 60px;
}
@media screen and (max-width: 1024px) {
    .footer-wrapper {
        gap: 30px;
    }
}
.footer-body {
    display: flex;
    gap: 100px;
}
@media screen and (max-width: 1300px) {
    .footer-body {
        gap: 60px;
    }
}
@media screen and (max-width: 1024px) {
    .footer-body {
        gap: 2rem;
    }
}
@media screen and (max-width: 768px) {
    .footer-body {
        flex-wrap: wrap;
        gap: 25px;
    }
}
.footer-logo {
    width: 100%;
    max-width: 202px;
}
@media screen and (max-width: 1024px) {
    .footer-logo {
        max-width: 143px;
    }
}
.footer-logo img {
    display: block;
    width: 100%;
}
.footer-nav {
    display: flex;
    flex-direction: column;
    gap: 10px 52px;
    flex-wrap: wrap;
    max-height: 100px;
    min-width: 300px;
}
@media screen and (max-width: 768px) {
    .footer-nav {
        order: 3;
    }
}
@media screen and (max-width: 480px) {
    .footer-nav {
        min-width: 100%;
    }
}
.footer-nav-item {
    font-size: 15px;
    font-weight: 500;
    color: var(--color-font-dark-blue);
    line-height: 1.1;
}
.footer-socials-mobile {
    display: none;
}
@media screen and (max-width: 768px) {
    .footer-socials-mobile {
        display: flex;
        margin-left: auto;
    }
}
@media screen and (max-width: 480px) {
    .footer-socials-mobile .socials-item {
        --ui-icon-width: 30px;
    }
}
.footer-block {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    max-width: 570px;
}
.footer-block-text {
    display: flex;
    flex-direction: column;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}
@media screen and (max-width: 768px) {
    .footer-block .socials {
        display: none;
    }
}
.footer-addresses {
    display: flex;
    flex-wrap: wrap;
    gap: 47px 80px;
    justify-content: space-between
}
@media screen and (max-width: 1300px) {
    .footer-addresses {
        gap: 30px 50px;
    }
}
@media screen and (max-width: 1024px) {
    .footer-addresses {
        gap: 30px;
    }
}
@media screen and (max-width: 480px) {
    .footer-addresses {
        justify-content: space-between;
    }
}
.footer-addresses-item {
    flex: 0 1 180px;
}
@media screen and (max-width: 1300px) {
    .footer-addresses-item {
        flex: 0 1 210px;
    }
}
@media screen and (max-width: 1024px) {
    .footer-addresses-item {
        flex: 0 1 170px;
    }
}
.footer-addresses-item-name {
    font-size: 18px;
    font-weight: 500;
    color: var(--color-font-dark-blue);
    line-height: 1.1;
    margin-bottom: 20px;
}
@media screen and (max-width: 1024px) {
    .footer-addresses-item-name {
        font-size: 16px;
        margin-bottom: 1rem;
    }
}
.footer-addresses-item-value {
    font-size: 13px;
    font-weight: 500;
    color: var(--color-font-grey);
    line-height: 1.1;
    margin-bottom: 5px;
}
.footer-addresses-item-phone {
    color: var(--color-font-black);
    line-height: 1.1;
}
@media screen and (max-width: 1300px) {
    .footer-addresses-item-phone .phone {
        font-size: 16px;
    }
}

.main-block {
    background-image: url("/local/templates/estelifecentre/img/main-image.jpg");
    background-repeat: no-repeat;
    background-position: right;
    background-size: cover;
    height: 720px;
    border-bottom-left-radius: 80px;
    border-bottom-right-radius: 80px;
}
@media screen and (max-width: 1600px) {
    .main-block {
        height: 600px;
        border-bottom-left-radius: 40px;
        border-bottom-right-radius: 40px;
    }
}
@media screen and (max-width: 1300px) {
    .main-block {
        height: 500px;
        background-position: right 40% center;
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;
    }
}
@media screen and (max-width: 1024px) {
    .main-block {
        height: 400px;
    }
}
@media screen and (max-width: 768px) {
    .main-block {
        background-image: url("/local/templates/estelifecentre/img/main-image-mobile.jpg");
        background-position: right center;
    }
}
.main-block-wrapper {
    padding-top: 180px;
    max-width: 820px;
}
@media screen and (max-width: 1600px) {
    .main-block-wrapper {
        padding-top: 120px;
        max-width: 520px;
    }
}
@media screen and (max-width: 1300px) {
    .main-block-wrapper {
        padding-top: 85px;
    }
}
@media screen and (max-width: 1024px) {
    .main-block-wrapper {
        padding-top: 30px;
        max-width: 400px;
    }
}
.main-block-logo {
    width: 100%;
    max-width: 170px;
    margin-bottom: 43px;
}
@media screen and (max-width: 1024px) {
    .main-block-logo {
        max-width: 85px;
        margin-bottom: 20px;
    }
}
.main-block-logo img {
    display: block;
    width: 100%;
}
.main-block-title {
    text-transform: uppercase;
    font-size: 37px;
    margin-bottom: 43px;
    color: var(--color-font-light-grey);
}
@media screen and (max-width: 1600px) {
    .main-block-title {
        font-size: 28px;
    }
}
@media screen and (max-width: 1024px) {
    .main-block-title {
        font-size: 22px;
        margin-bottom: 78px;
    }
}
.main-block-title-badge {
    font-size: 11px;
    line-height: 1;
    background-color: transparent;
    color: #839FC8;
    border: 1px solid #839FC8;
    padding: 4px 10px;
    border-radius: 15px;
    position: relative;
    top: -7px;
    margin-left: 10px;
}
.main-block-btn .btn {
    --background-color: #fff;
    --border-color: #fff;
    --font-size: 16px;
    --border-radius: 10px;
    --padding-tb: 22px;
    --padding-lr: 42px;
}
@media screen and (max-width: 1600px) {
    .main-block-btn .btn {
        --padding-tb: 14px;
        --padding-lr: 32px;
    }
}

.main-intro {
    margin-top: -4rem;
    margin-bottom: 88px;
}
@media screen and (max-width: 1024px) {
    .main-intro {
        margin-top: -2rem;
        margin-bottom: 40px;
    }
}
.main-intro-wrapper {
    display: grid;
    grid-template-columns: repeat(3, 423px);
    gap: 5px;
    margin-bottom: 40px;
    max-width: 100%;
    overflow: auto;
}
@media screen and (max-width: 768px) {
    .main-intro-wrapper {
        grid-template-columns: repeat(3, 300px);
    }
}
.main-intro-item {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    background-color: #eeeeee;
    max-height: 250px;
}
@media screen and (max-width: 768px) {
    .main-intro-item {
        max-height: 175px;
    }
}
.main-intro-item-container {
    padding: 25px 30px;
    position: relative;
    z-index: 4;
    height: 100%;
}
@media screen and (max-width: 768px) {
    .main-intro-item-container {
        padding: 1rem 20px;
    }
}
.main-intro-item-content {
    width: 50%;
    position: relative;
    height: 100%;
    padding-bottom: 1rem;
}
.main-intro-item-image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}
.main-intro-item-image img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.main-intro-item-badge {
    display: inline-block;
    font-size: 11px;
    text-transform: uppercase;
    color: #003F92;
    padding: 8px 10px;
    border-radius: 20px;
    border: 1px solid #003F92;
    line-height: 1;
    margin-bottom: 15px;
    font-weight: 500;
}
@media screen and (max-width: 768px) {
    .main-intro-item-badge {
        font-size: 10px;
        padding: 5px 10px;
        margin-bottom: 10px;
    }
}
.main-intro-item-title {
    font-size: 25px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 768px) {
    .main-intro-item-title {
        font-size: 18px;
    }
}
.main-intro-item-text {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-top: 1rem;
}
@media screen and (max-width: 768px) {
    .main-intro-item-text {
        font-size: 12px;
    }
}
.main-intro-item.main-intro-item-reverse .main-intro-item-container {
    justify-content: flex-end;
}
.main-intro-item.main-intro-item-dark .main-intro-item-badge {
    color: #7B6EBC;
    border-color: #7B6EBC;
}
.main-intro-item.main-intro-item-dark .main-intro-item-title {
    color: #fff;
}
.main-intro-item.main-intro-item-dark .main-intro-item-text {
    color: #E7EBF1;
}
.main-intro-bottom {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
    gap: 1rem;
}
.main-intro-bottom-row {
    display: flex;
    gap: 13px;
}
.main-intro-bottom-row-icon {
    --ui-icon-width: 18px;
    display: flex;
}
.main-intro-bottom-row-text {
    font-size: 17px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}

.section {
    margin-bottom: 88px;
}
@media screen and (max-width: 1024px) {
    .section {
        margin-bottom: 40px;
    }
}
.section-title {
    position: relative;
    color: var(--color-font-dark-blue);
    margin-bottom: 50px;
}
@media screen and (max-width: 1024px) {
    .section-title {
        margin-bottom: 20px;
    }
}
@media screen and (max-width: 768px) {
    .section-title {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }
}
.section-title[data-title]::after {
    content: attr(data-title);
    font-size: 12px;
    line-height: 1;
    background-color: #F4F6FB;
    color: var(--color-font-grey);
    position: absolute;
    top: 10px;
    padding: 10px;
    border-radius: 15px;
    margin-left: 14px;
    max-width: -moz-max-content;
    max-width: max-content;
    max-height: -moz-max-content;
    max-height: max-content;
}
@media screen and (max-width: 1300px) {
    .section-title[data-title]::after {
        top: 0px;
    }
}
@media screen and (max-width: 768px) {
    .section-title[data-title]::after {
        position: static;
        margin-left: 0;
    }
}
.section.bg-linear-gradient .section-title {
    color: #fff;
}

.catalog-block {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(265px, 1fr));
    gap: 30px 5px;
}
@media screen and (max-width: 1024px) {
    .catalog-block {
        gap: 10px 5px;
    }
}
@media screen and (max-width: 480px) {
    .catalog-block {
        grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    }
}
.catalog-block-item {
    padding: 20px;
    border-radius: 10px;
    background-color: #F1F3F8;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 140px;
    position: relative;
}
@media screen and (max-width: 1024px) {
    .catalog-block-item {
        padding: 13px 15px;
        min-height: 100px;
    }
}
@media screen and (max-width: 1024px) {
    .catalog-block-item {
        min-height: 85px;
    }
}
.catalog-block-item-title {
    font-size: 18px;
    line-height: 1;
    font-weight: 500;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1024px) {
    .catalog-block-item-title {
        font-size: 16px;
    }
}
.catalog-block-item-link {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
    font-size: 13px;
    color: #B3B8C5;
}
.catalog-block-item-link .icon {
    --ui-icon-width: 16px;
    position: relative;
    top: 2px;
    --fill: #B3B8C5;
}
.catalog-block-item:hover {
    background-color: #8AAFE1;
}
.catalog-block-item:hover .catalog-block-item-title {
    color: #fff;
}
.catalog-block-item:hover .catalog-block-item-link {
    color: #fff;
}
.catalog-block-item:hover .catalog-block-item-link .icon {
    --fill: #fff;
}

.brends-block-wrapper {
    margin-bottom: 26px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 15px;
}
@media screen and (max-width: 1024px) {
    .brends-block-wrapper {
        gap: 12px;
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
        grid-auto-rows: 1fr;
    }
}
.brends-block-item {
    background-color: #fff;
    border-radius: 12px;
    border: 3px solid #F5F7FC;
    overflow: hidden;
    max-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
}
.brends-block-item img {
    display: block;
}
.brends-block-text {
    font-size: 13px;
    font-weight: 500;
    color: #A6B3C2;
    text-align: center;
}

.register-block {
    padding: 2rem 0;
    position: relative;
    background: url(/local/templates/estelifecentre/img/bg-register.jpg) center/cover, no-repeat, linear-gradient(75deg, #2b76dc 0%, #123360 100%);
}
@media screen and (max-width: 850px) {
    .register-block {
        overflow: hidden;
    }
}
.register-block-wrapper {
    display: grid;
    grid-template-columns: 500px 1fr;
    gap: 120px;
    position: relative;
}
@media screen and (max-width: 1300px) {
    .register-block-wrapper {
        gap: 30px;
        grid-template-columns: 350px 1fr;
    }
}
@media screen and (max-width: 850px) {
    .register-block-wrapper {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}
.register-block-wrapper-right {
    display: grid;
    grid-template-columns: 280px 1fr;
}
@media screen and (max-width: 1024px) {
    .register-block-wrapper-right {
        grid-template-columns: 220px 1fr;
    }
}
.register-block-form {
    display: flex;
    align-items: center;
    position: relative;
    z-index: 2;
}
.register-block-image {
    position: absolute;
    right: 0;
    bottom: -32px;
    z-index: 1;
}
@media screen and (max-width: 1300px) {
    .register-block-image {
        max-width: 350px;
    }
}
@media screen and (max-width: 1024px) {
    .register-block-image {
        max-width: 300px;
    }
}
@media screen and (max-width: 850px) {
    .register-block-image {
        max-width: 250px;
        right: -30px;
    }
}
.register-block-image img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}
.register-block-badge {
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    padding: 8px 12px;
    color: #A3B2D0;
    border: 1px solid #A3B2D0;
    border-radius: 20px;
    margin-bottom: 15px;
}
@media screen and (max-width: 1024px) {
    .register-block-badge {
        padding: 5px 10px;
    }
}
.register-block-title {
    font-size: 30px;
    line-height: 1.2;
    font-weight: 500;
    margin-bottom: 43px;
    color: var(--color-font-white);
}
@media screen and (max-width: 1300px) {
    .register-block-title {
        font-size: 22px;
    }
}
@media screen and (max-width: 1024px) {
    .register-block-title {
        font-size: 20px;
        margin-bottom: 18px;
    }
}
.register-block-subtitle {
    font-size: 14px;
    font-weight: 400;
    color: var(--color-font-white);
}
@media screen and (max-width: 1024px) {
    .register-block-subtitle {
        font-size: 12px;
    }
}

.register-form {
    width: 100%;
}
.register-form-row {
    margin-bottom: 1rem;
}
.register-form-row small {
    font-size: 12px;
    font-weight: 500;
    color: var(--color-font-grey);
}
.register-form-btn .btn {
    --color: #fff;
    --background-color: #000;
    --font-size: 18px;
    --padding-tb: 11px;
}
@media screen and (max-width: 1024px) {
    .register-form-btn .btn {
        --font-size: 16px;
    }
}

.input-box {
    position: relative;
    --padding-left: 44px;
}
.input-box-icon {
    display: flex;
    align-items: center;
    position: absolute;
    top: 50%;
    left: calc(var(--padding-left) / 2);
    transform: translate(-50%, -50%);
    --ui-icon-width: 16px;
}
.input-box .input {
    --background-color: #fff;
    padding-left: var(--padding-left);
}

.main-about {
    position: relative;
    margin-top: 10rem;
}
@media screen and (max-width: 768px) {
    .main-about {
        margin-top: 3rem;
    }
}
.main-about-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.main-about-inner{
    position: relative;
    z-index: 10;
}

.main-about-overlay::before {
    content: "";
    background-image: url(/local/templates/estelifecentre/img/logo-image-grey.png);
    background-repeat: no-repeat;
    background-size: 100%;
    display: block;
    width: 930px;
    height: 980px;
    position: absolute;
    top: -148px;
    right: 100px;
    z-index: -1;
}
@media screen and (max-width: 1600px) {
    .main-about-overlay::before {
        width: 750px;
        height: 800px;
        right: 0;
    }
}
@media screen and (max-width: 1300px) {
    .main-about-overlay::before {
        width: 700px;
        height: 750px;
    }
}
@media screen and (max-width: 768px) {
    .main-about-overlay::before {
        top: -50px;
    }
}
@media screen and (max-width: 480px) {
    .main-about-overlay::before {
        width: 500px;
        height: 550px;
    }
}
.main-about-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
@media screen and (max-width: 1600px) {
    .main-about-wrapper {
        gap: 2rem;
    }
}
@media screen and (max-width: 768px) {
    .main-about-wrapper {
        display: flex;
        flex-direction: column-reverse;
    }
}
.main-about-title {
    display: flex;
    gap: 13px;
    align-items: center;
    font-size: 55px;
    line-height: 1.1;
    font-weight: 500;
    margin-bottom: 40px;
}
@media screen and (max-width: 1024px) {
    .main-about-title {
        font-size: 30px;
        margin-bottom: 25px;
    }
}
.main-about-title span:first-child {
    color: var(--color-font-blue);
}
.main-about-title span:last-child {
    color: var(--color-font-blue);
}
.main-about-icon {
    width: 48px;
    display: block;
}
@media screen and (max-width: 1024px) {
    .main-about-icon {
        width: 36px;
    }
}
.main-about-icon img {
    display: block;
    width: 100%;
}
.main-about-description {
    margin-bottom: 26px;
    font-size: 16px;
    font-weight: 500;
    color: #A6B3C2;
}
@media screen and (max-width: 1024px) {
    .main-about-description {
        font-size: 15px;
    }
}
.main-about-subtitle {
    font-size: 24px;
    font-weight: 500;
    color: var(--color-font-dark-blue);
    line-height: 1.2;
    margin-bottom: 26px;
}
@media screen and (max-width: 1024px) {
    .main-about-subtitle {
        font-size: 18px;
    }
}
.main-about-text {
    margin-bottom: 40px;
}
@media screen and (max-width: 1024px) {
    .main-about-text {
        margin-bottom: 30px;
    }
}
.main-about-text p {
    font-size: 18px;
    font-weight: 400;
    color: var(--color-font-dark-blue);
    line-height: 1.2;
    margin-bottom: 2rem;
}
@media screen and (max-width: 1024px) {
    .main-about-text p {
        font-size: 16px;
        margin-bottom: 1rem;
    }
}
.main-about-text p:last-child {
    margin-bottom: 0;
}
.main-about-btn {
    margin-bottom: 72px;
}
@media screen and (max-width: 1024px) {
    .main-about-btn {
        margin-bottom: 40px;
    }
}
.main-about-btn .btn {
    --font-size: 16px;
    --padding-tb: 11px;
    --padding-lr: 40px;
    --color: var(--color-font-dark-blue);
    --font-weight: 500;
}
.main-about-bottom {
    display: flex;
    align-items: center;
    gap: 27px;
    max-width: 450px;
}
@media screen and (max-width: 1024px) {
    .main-about-bottom {
        gap: 14px;
    }
}
.main-about-bottom-value {
    font-size: 80px;
    line-height: 1.1;
    color: var(--color-font-blue);
    font-weight: 200;
}
@media screen and (max-width: 1024px) {
    .main-about-bottom-value {
        font-size: 40px;
    }
}
.main-about-bottom-name {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.main-about-image {
    border-radius: 50%;
    overflow: hidden;
    width: 643px;
    aspect-ratio: 1;
    position: relative;
    right: -3rem;
    top: -3.5rem;
}
@media screen and (max-width: 1600px) {
    .main-about-image {
        width: 100%;
        right: 0;
    }
}
@media screen and (max-width: 768px) {
    .main-about-image {
        position: static;
        max-width: 550px;
        margin: 0 auto;
    }
}
.main-about-image img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}

.swiper-container {
    padding: 0 6rem;
    margin: 0 -6rem;
    overflow: hidden;
    position: relative;
}
@media screen and (max-width: 1600px) {
    .swiper-container {
        padding: 0;
        margin: 0;
    }
}
.swiper-container .swiper {
    position: static;
    --swiper-theme-color: #000;
    --swiper-pagination-bullet-horizontal-gap: 16px;
    --swiper-pagination-color: #003F92;
}

@media screen and (max-width: 480px) {
    .swiper-container .swiper {
        --swiper-pagination-bullet-horizontal-gap:5px;
    }
}

.swiper-container .swiper .swiper-button-prev,
.swiper-container .swiper .swiper-button-next {
    background: #ffffff;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    --swiper-navigation-size: 20px;
    --swiper-navigation-top-offset: 30%;
    --swiper-navigation-sides-offset: 16px;
    box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.1);
}
@media screen and (max-width: 1024px) {
    .swiper-container .swiper .swiper-button-prev,
    .swiper-container .swiper .swiper-button-next {
        display: none;
    }
}
.swiper-container .swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 32px;
    border-radius: 5px;
}

.news-block .swiper-container .swiper .swiper-wrapper {
    padding-bottom: 4rem;
}
@media screen and (max-width: 1600px) {
    .news-block .swiper-container .swiper .swiper-slide {
        max-width: 415px;
    }
}
@media screen and (max-width: 1024px) {
    .news-block .swiper-container .swiper .swiper-slide {
        max-width: 300px;
    }
}

@media screen and (max-width: 480px) {
    .news-block .swiper-container .swiper .swiper-slide {
        max-width: 220px;
    }
}

.events-block .swiper-container .swiper .swiper-wrapper {
    padding-bottom: 4rem;
}
@media screen and (max-width: 1300px) {
    .events-block .swiper-container .swiper .swiper-wrapper {
        padding-bottom: 3rem;
    }
}
.events-block .swiper-container .swiper .swiper-button-prev,
.events-block .swiper-container .swiper .swiper-button-next {
    --swiper-navigation-top-offset: 37%;
}
@media screen and (max-width: 1300px) {
    .events-block .swiper-container .swiper .swiper-slide {
        max-width: 415px;
    }
}
@media screen and (max-width: 1024px) {
    .events-block .swiper-container .swiper .swiper-slide {
        max-width: 350px;
    }
}

@media screen and (max-width: 480px) {
    .events-block .swiper-container .swiper .swiper-slide {
        max-width: 280px;
    }
}

.popular-block .swiper-container .swiper .swiper-wrapper {
    padding-bottom: 4rem;
}
.popular-block .swiper-container .swiper .swiper-button-prev,
.popular-block .swiper-container .swiper .swiper-button-next {
    --swiper-navigation-top-offset: 40%;
}
@media screen and (max-width: 1600px) {
    .popular-block .swiper-container .swiper .swiper-slide {
        max-width: 300px;
    }
}

@media screen and (max-width: 480px) {
    .popular-block .swiper-container .swiper .swiper-slide {
        max-width: 220px;
    }
}

.new-block .swiper-container .swiper .swiper-wrapper {
    padding-bottom: 4rem;
}
.new-block .swiper-container .swiper .swiper-button-prev,
.new-block .swiper-container .swiper .swiper-button-next {
    --swiper-navigation-top-offset: 40%;
}

@media screen and (max-width: 1600px) {
    .new-block .swiper-container .swiper .swiper-slide {
        max-width: 300px;
    }
}

@media screen and (max-width: 480px) {
    .new-block .swiper-container .swiper .swiper-slide {
        max-width: 220px;
    }
}

.viewed-block .swiper-container .swiper .swiper-button-next {
    --swiper-navigation-top-offset: 40%;
}
.viewed-block .swiper-container .swiper .swiper-wrapper {
    padding-bottom: 4rem;
}
.viewed-block .swiper-container .swiper .swiper-slide {
    height: 480px;
    max-width: 245px;
}

.include-block {
    position: relative;
    padding-top: 6rem;
}
@media screen and (max-width: 1024px) {
    .include-block {
        padding-top: 4rem;
    }
}
.include-block::before {
    content: "";
    position: absolute;
    top: 0;
    right: 3rem;
    width: 614px;
    height: 646px;
    background-image: url(/local/templates/estelifecentre/img/logo-image-grey.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: cover;
    z-index: -1;
}
@media screen and (max-width: 1300px) {
    .include-block::before {
        width: 500px;
        height: 532px;
    }
}
@media screen and (max-width: 1024px) {
    .include-block::before {
        width: 368px;
        height: 388px;
        right: 0;
    }
}
.include-block-title {
    margin-bottom: 1rem;
}
@media screen and (max-width: 1300px) {
    .include-block-title {
        margin-bottom: 1rem;
    }
}
.include-block-description {
    margin-bottom: 26px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.1;
    color: #A6B3C2;
}
.include-block-subtitle {
    margin-bottom: 26px;
    font-size: 22px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1024px) {
    .include-block-subtitle {
        font-size: 20px;
    }
}

.include-block-text,
.include-block-text p,
.include-block-text ul li,
.include-block-text ol li {
    line-height: 1.5em;
    font-size: 16px;
}

.include-block-text ul,
.include-block-text ol {
    margin-bottom: 1rem;
    padding-left: 2rem;
}

.include-block-text ul li,
.include-block-text ol li {
    list-style: disc;
}


.include-block-text p{

}

.include-block-text ul{

}
.include-block-text ul li{

}


.bg-linear-gradient .swiper {
    --swiper-pagination-color: #ffffff;
    --swiper-pagination-bullet-inactive-color: #5872AB;
    --swiper-pagination-bullet-inactive-opacity: 1;
}

.card-news {
    display: block;
}
.card-news-image {
    border-radius: 12px;
    overflow: hidden;
    max-height: 280px;
    height: 100%;
    margin-bottom: 24px;
}
@media screen and (max-width: 1024px) {
    .card-news-image {
        margin-bottom: 1rem;
    }
}
.card-news-image img {
    display: block;
    width: 100%;
    height: 100%;
    max-height: 100%;
    object-fit: cover;
}
.card-news-badge {
    display: inline-block;
    font-size: 13px;
    line-height: 1;
    font-weight: 500;
    color: #A6B3C2;
    padding: 6px 10px;
    border-radius: 15px;
    border: 1px solid #A6B3C2;
    margin-bottom: 15px;
}
@media screen and (max-width: 1024px) {
    .card-news-badge {
        margin-bottom: 10px;
        font-size: 12px;
    }
}
.card-news-title {
    font-size: 18px;
    font-weight: 500;
    color: var(--color-font-dark-blue);
    line-height: 1.1;
    margin-bottom: 15px;
}
@media screen and (max-width: 1024px) {
    .card-news-title {
        margin-bottom: 10px;
        font-size: 16px;
    }
}
.card-news-date {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}

.card-events {
    background-color: #F5F7FC;
    border-radius: 20px;
    overflow: hidden;
    padding: 26px 30px;
    display: block;
    position: relative;
    min-height: 270px;
}
@media screen and (max-width: 1024px) {
    .card-events {
        min-height: 220px;
    }
}
.card-events-badge {
    display: inline-block;
    font-size: 13px;
    line-height: 1;
    font-weight: 500;
    color: #A6B3C2;
    padding: 6px 10px;
    border-radius: 15px;
    border: 1px solid #A6B3C2;
}
@media screen and (max-width: 1024px) {
    .card-events-badge {
        font-size: 12px;
    }
}
.card-events-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px 30px;
    padding-top: 60px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
@media screen and (max-width: 1024px) {
    .card-events-content {
    
    }
}
.card-events-title {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1024px) {
    .card-events-title {
        font-size: 15px;
    }
}
.card-events-description {
    font-size: 13px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
    margin-bottom: 8px;
}
@media screen and (max-width: 1024px) {
    .card-events-description {
        font-size: 12px;
    }
}
.card-events-box {
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: space-between;
}
.card-events-price {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1024px) {
    .card-events-price {
        font-size: 16px;
    }
}
.card-events-btn {
    --background-color: var(--color-dark-blue);
    --border-color: var(--color-dark-blue);
    --color: #fff;
    --padding-lr: 8px;
    --padding-tb: 6px;
}
.card-events-btn:hover {
    --background-color: var(--color-dark-blue);
    --border-color: var(--color-dark-blue);
    --color: #fff;
}
.card-events-image {
    border-radius: 50%;
    overflow: hidden;
    position: absolute;
    bottom: 26px;
    right: 30px;
    width: 160px;
    aspect-ratio: 1;
}
@media screen and (max-width: 1024px) {
    .card-events-image {
        width: 110px;
    }
}
.card-events-image img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.card-product {
    display: block;
    border-radius: 12px;
    overflow: hidden;
    background-color: #F5F7FC;
    height: 100%;
    position: relative;
}
.card-product-wishlist {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 5;
    border-radius: 50%;
    background-color: #fff;
    box-shadow: 0 0 11px 1px rgba(0, 0, 0, 0.1215686275);
    padding: 10px;
    display: flex;
    cursor: pointer;
    --ui-icon-width: 18px;
    border: none;
}
.card-product-wishlist.in-wishlist {
    background-color: #D90063;
    --fill: #fff;
}
.card-product-emblem {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 5;
    --background-color: #ddd;
    --color: #fff;
    --width: 60px;
    --font-size: 16px;
}
.card-product-emblem span {
    background-color: var(--background-color);
    border-radius: 50%;
    color: var(--color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size);
    font-weight: 700;
    width: var(--width);
    aspect-ratio: 1;
}
.card-product-emblem.hit-emblem {
    --background-color: #ACD6F1;
    --color: #fff;
}
.card-product-emblem.new-emblem {
    --background-color: #76C7D5;
    --color: #fff;
}
.card-product-link {
    position: relative;
}
.card-product-image {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 3px solid #F5F7FC;
    /*min-height: 265px; */
    aspect-ratio: 1;
}
.card-product-image img, .card-product-image-no-image {
    display: block;
    width: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    max-width: 210px;
    aspect-ratio: 1;
}

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

    .card-product-emblem{
        --width:40px;
        --font-size:14px;
    }
    .card-product-image {
        padding: 10px;
    }
}

.card-product-image-no-image{
    display: flex;
    background: none;
    border-radius: 12px;
    justify-content: center;
    align-items: center;
    --ui-icon-width: 80px;
}

.card-product-badge {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 5px;
    --background-color: #ddd;
    --color: #fff;
    flex-wrap: wrap;
}
.card-product-badge-item {
    --color: #fff;
    --background-color:var(--color-font-blue);
    background-color: var(--background-color);
    color: var(--color);
    font-size: 12px;
    font-weight: 700;
    border-radius: 8px;
    width: auto;
    height: auto;
    padding: 5px 8px;
    line-height: 1.1;
}

.card-product-badge-item span{
    letter-spacing: 0.3;
}

.card-product-badge-item.badge-new {
    --background-color:var(--color-dark-green);
    --color: #fff;
}
.card-product-badge-item.badge-sale {
    --background-color: #D90063;
    --color: #fff;
}
.card-product-badge-item.badge-best-seller {
    --background-color: #8878D0;
    --color: #fff;
}
.card-product-content {
    padding: 1rem 1rem 20px 20px;
}

@media screen and (max-width: 380px){
    .card-product-content {
        padding: 14px;
    }
}


.card-product-content-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}
.card-product-content-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}



.card-product-brend {
    font-size: 11px;
    font-weight: 500;
    line-height: 1;
    color: #A6B3C2;
    border: 1px solid #A6B3C2;
    border-radius: 20px;
    display: inline-block;
    padding: 6px 10px;
    text-transform: uppercase;
    height: -moz-max-content;
    height: max-content;
}
.card-product-rating {
    display: flex;
    align-items: center;
    gap: 3px;
}
.card-product-rating-icon {
    display: flex;
    --ui-icon-width: 18px;
}
.card-product-rating-value {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    color: var(--color-font-dark-blue);
}
.card-product-text {
    margin-bottom: 1rem;
}
.card-product-title {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.2;
    color: var(--color-font-dark-blue);
    margin-bottom: 10px;
    display: block;
    min-height: 36px;
}
.card-product-description {
    font-size: 13px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
    margin-bottom: 1rem;
}
.card-product-price-content {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.card-product-price-current {
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    color: var(--color-font-dark-blue);
}
.card-product-price-old {
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    color: var(--color-font-grey);
    text-decoration: line-through;
}
.card-product-price-icon {
    display: flex;
    --ui-icon-width: 20px;
    --fill: #003F92;
}
a.card-product-price-text,
.card-product-price-text {
    gap: 8px;
    display: flex;
    align-items: center;
}
a.card-product-price-text,
.card-product-price-text span {
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    color: #003F92;
}




a.card-product-btn,
a.btn.card-product-btn{
    --background-color: var(--color-dark-blue);
    --border-color: var(--color-dark-blue);
    --color: #fff;
    --padding-lr: 10px;
    --padding-tb: 6px;
    --border-radius: 12px;
}
a.card-product-btn .icon  ,
a.btn.card-product-btn .icon {
    --ui-icon-width: 20px;
}
.news-list{
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}

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

.shop-content .card-product-content .card-product-content-footer{

}

@media screen and (max-width: 480px){
    .card-product-content .card-product-content-footer .card-product-btn.btn{
        display: none;
    }
}

.news-list .news-item{
    display: block;
}

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


.shop-wrapper {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 2rem;
}
@media screen and (max-width: 768px) {
    .shop-wrapper {
        grid-template-columns: 1fr;
        gap: 0;
    }
}
@media screen and (max-width: 768px) {
    .shop-wrapper-left {
        visibility: hidden;
        height: 0;
    }
}
.shop-content-top {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}
.shop-content-btns {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.shop-content-btns-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    --ui-icon-width: 18px;
}
.shop-content-btns-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}
a.shop-content-btns-item {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
    cursor: pointer;
}
a.shop-content-btns-item.active {
    color: var(--color-font-dark-blue);
}
.shop-content-controls {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    width: 100%;
}
.shop-content-controls-item {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;

}
.shop-content-controls-item-icon {
    display: flex;
    --ui-icon-width: 18px;
}
.shop-content-controls-item-title {
    color: var(--color-font-dark-blue);
    font-weight: 500;
    line-height: 1.1;
    position: relative;
    top: 1px;
}
.shop-content-controls-item.shop-content-controls-filter {
    display: none;
    width: 100%;
    background: #fff;
    justify-content: center;
    align-items: center;
    padding: 10px;
    border-radius: 8px;
    border: 2px solid #f6f7fc;
}
@media screen and (max-width: 768px) {
    .shop-content-controls-item.shop-content-controls-filter {
        display: flex;
    }
}

.shop-content-controls-item .radio,
.shop-content-controls-item .checkbox{
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 300;
}

.shop-content-controls-item .radio input,
.shop-content-controls-item .checkbox input{
    margin: 0!important;
    position: relative;
    outline: none!important;
}

.shop-content-wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 15px;
    margin-bottom: 50px;
}
@media screen and (max-width: 480px){
    .shop-content-wrapper {
        grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    }
}
.shop-content-footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}
.shop-content-load-more .btn {
    --font-size: 14px;
    --padding-lr: 54px;
    --padding-tb: 12px;
    --border-radius: 10px;
}
@media screen and (max-width: 768px) {
    .shop-content-load-more .btn {
        --padding-lr: 34px;
        --padding-tb: 10px;
    }
}

.consult {
    padding: 50px 0;
    border-top: 1px solid rgba(35, 59, 111, 0.1019607843);
}
.consult-wrapper {
    display: grid;
    grid-template-columns: 1fr 510px;
    gap: 80px;
    align-items: center;
}
@media screen and (max-width: 1024px) {
    .consult-wrapper {
        grid-template-columns: 1fr 450px;
        gap: 2rem;
    }
}
@media screen and (max-width: 768px) {
    .consult-wrapper {
        grid-template-columns: 1fr;
    }
}
.consult-content-badge {
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-blue);
    border: 1px solid var(--color-font-blue);
    padding: 8px 10px;
    border-radius: 20px;
    margin-bottom: 15px;
}
@media screen and (max-width: 1024px) {
    .consult-content-badge {
        padding: 5px 10px;
    }
}
.consult-content-title {
    font-size: 30px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-black);
    margin-bottom: 26px;
}
@media screen and (max-width: 1300px) {
    .consult-content-title {
        font-size: 22px;
    }
}
@media screen and (max-width: 1024px) {
    .consult-content-title {
        font-size: 20px;
        margin-bottom: 18px;
    }
}
.consult-content-text {
    font-size: 14px;
    font-weight: 400;
    color: var(--color-font-grey);
}
@media screen and (max-width: 1024px) {
    .consult-content-text {
        font-size: 12px;
    }
}
.consult-form-wrapper {
    display: grid;
    grid-template-columns: 1fr 210px;
    gap: 20px;
}
@media screen and (max-width: 1024px) {
    .consult-form-wrapper {
        grid-template-columns: 1fr 180px;
    }
}
@media screen and (max-width: 768px) {
    .consult-form-wrapper {
        grid-template-columns: 1fr 1fr;
    }
}
@media screen and (max-width: 576px) {
    .consult-form-wrapper {
        grid-template-columns: 1fr;
    }
}
.consult-form-input .input {
    --background-color: #F2F4F7;
}
.consult-form-input small {
    font-size: 12px;
    color: var(--color-font-grey);
}
.consult-form-btn .btn {
    --color: #fff;
    --background-color: #000;
    --font-size: 18px;
    --padding-tb: 11px;
    height: 48px;
}
@media screen and (max-width: 1024px) {
    .consult-form-btn .btn {
        --font-size: 16px;
    }
}

.pagenation-navigation {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
}
.pagenation-navigation a,
.pagenation-navigation button,
.pagenation-navigation span {
    width: auto;
    max-width: 100%;
    border: none;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 0;
    color: #000;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    margin: 0 -5px;
    width: 40px;
    aspect-ratio: 1;
    --gap-btns: 40px;
    background: transparent;
}
.pagenation-navigation a:hover,
.pagenation-navigation button:hover,
.pagenation-navigation span:hover {
    background-color: #003F92;
    border-radius: 50%;
    color: #fff;
    --fill: #fff;
}
.pagenation-navigation a.pagenation-current,
.pagenation-navigation button.pagenation-current,
.pagenation-navigation span.pagenation-current {
    background-color: #003F92;
    border-radius: 50%;
    color: #fff;
}
.pagenation-navigation a.pagenation-previous,
.pagenation-navigation a.pagenation-next,
.pagenation-navigation button.pagenation-previous,
.pagenation-navigation button.pagenation-next,
.pagenation-navigation span.pagenation-previous,
.pagenation-navigation span.pagenation-next {
    border-radius: 10px;
    border: 1px solid #000;
    height: 30px;
    margin: 0;
}
.pagenation-navigation a.pagenation-previous .icon,
.pagenation-navigation a.pagenation-next .icon,
.pagenation-navigation button.pagenation-previous .icon,
.pagenation-navigation button.pagenation-next .icon,
.pagenation-navigation span.pagenation-previous .icon,
.pagenation-navigation span.pagenation-next .icon {
    width: 14px;
    height: 16px;
}
.pagenation-navigation a.pagenation-previous:hover,
.pagenation-navigation a.pagenation-next:hover,
.pagenation-navigation button.pagenation-previous:hover,
.pagenation-navigation button.pagenation-next:hover,
.pagenation-navigation span.pagenation-previous:hover,
.pagenation-navigation span.pagenation-next:hover {
    border-color: #003F92;
}
.pagenation-navigation a.pagenation-previous,
.pagenation-navigation button.pagenation-previous,
.pagenation-navigation span.pagenation-previous {
    margin-right: var(--gap-btns);
}
.pagenation-navigation a.pagenation-next,
.pagenation-navigation button.pagenation-next,
.pagenation-navigation span.pagenation-next {
    margin-left: var(--gap-btns);
}
@media screen and (max-width: 768px) {
    .pagenation-navigation a,
    .pagenation-navigation button,
    .pagenation-navigation span {
        --gap-btns: 0;
        width: 30px;
        font-size: 14px;
    }
}

.rightbar-menu {
    background-color: #F1F3F8;
    border-radius: 20px;
    padding: 20px;
    margin-bottom: 1rem;
}
.rightbar-menu-header {
    margin-bottom: 22px;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(35, 59, 111, 0.1019607843);
}

.rightbar-menu-header.rightbar-menu-header-short{
    margin-bottom: 0;
    border-bottom: none;
    padding-bottom: 0;
}

.rightbar-menu-btn.btn {
    --font-size: 14px;
    --color: var(--color-font-grey);
    --margin-inner: 0;
}
.rightbar-menu-btn.btn .icon {
    --fill: var(--color-font-grey);
}
.rightbar-menu-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
a.rightbar-menu-link {
    display: block;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    color: #2e366a;
    max-width: -moz-max-content;
    max-width: max-content;
    position: relative;
}
a.rightbar-menu-link[data-badge]::after {
    content: attr(data-badge);
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
    background-color: #76C7D5;
    font-size: 9px;
    font-weight: 700;
    padding: 5px;
    color: #fff;
    border-radius: 50%;
    position: absolute;
    right: -50%;
    top: 50%;
    transform: translate(50%, -50%);
}

a.rightbar-menu-link.--is-active{
    color: var(--color-font-dark-blue);
}

.rightbar-poster {
    border-radius: 20px;
    position: relative;
    min-height: 390px;
    overflow: hidden;
    margin-bottom: 1rem;
    display: block;
}
.rightbar-poster-image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}
.rightbar-poster-image img {
    display: block;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.rightbar-poster-container {
    display: flex;
    position: absolute;
    z-index: 4;
    height: 100%;
}
.rightbar-poster-content {
    padding: 20px 16px;
}
.rightbar-poster-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-blue);
    padding: 8px 10px;
    border-radius: 15px;
    border: 1px solid var(--color-font-blue);
    margin-bottom: 1rem;
}
.rightbar-poster-title {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 2rem;
}
.rightbar-poster-text {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}

form.filter{
    position: relative;
}

.filter-submit-popup.btn {
    position: absolute;
    z-index: 100;
    left: calc(100% + 20px);
    padding: 10px 1rem;
    transform: translateY(-75%);
}

.filter-submit-popup.btn:before {
    position: absolute;
    content: '';
    right: 100%;
    top: 50%;
    transform: translateY(-50%);
    border: 8px solid transparent;
    border-color: transparent var(--border-color) transparent transparent;
}

@media screen and (max-width: 768px) {
    .filter-submit-popup.btn{
        position: fixed;
        left: 1rem;
        right: 1rem;
        bottom: 0;
        top: auto !important;
        transform: none;
    }
    .filter-submit-popup.btn:before{
        display: none;
    }
    .filter-submit-btn{
        display: none;
    }

}



.rightbar-filter {
    border: 1px solid #A6B3C2;
    border-radius: 20px;
    /*overflow: hidden;*/
    padding: 29px 10px;
    margin-bottom: 15px;
}
@media screen and (max-width: 768px) {
    .rightbar-filter .filter {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        background-color: #fff;
        z-index: 100;
        padding: 2rem 1rem;
        max-height: 100vh;
        overflow: auto;
    }
}
.rightbar-filter .filter.opened {
    visibility: visible;
}
.rightbar-filter .filter-close {
    display: none;
}
@media screen and (max-width: 768px) {
    .rightbar-filter .filter-close {
        display: flex;
        position: absolute;
        top: 1rem;
        right: 1rem;
        --ui-icon-width: 14px;
        cursor: pointer;
    }
}
.rightbar-filter .filter-wrapper {
    display: flex;
    flex-direction: column;
}
.rightbar-filter .filter-box {
    margin-bottom: 27px;
}
.rightbar-filter .filter-box-name {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 1rem;
}

.rightbar-filter .filter-box-controls.--no-varibles:after {
    content: 'Подходящие варианты отсуствуют';
    color: #818592;
    font-size: 14px;
}

.rightbar-filter .filter-box-controls-item.--filtered {
    display: none;
}

.rightbar-filter .filter-box-controls-item .checkbox {
    --icon-size:20px;
}
.rightbar-filter .filter-box-controls-item .checkbox input {
    border-radius: 6px;
}



.rightbar-filter .filter-box-controls-item .checkbox input:checked + span {
    font-weight: 500;
    color: var(--color-font-blue);
    top: 0px;
}

.rightbar-filter .filter-box-controls-item .checkbox input:disabled {
    border-color: #B3B8C5;
}

.rightbar-filter .filter-box-controls-item .checkbox input:disabled + span{
    color: #B3B8C5;
}

.rightbar-filter .filter-box-controls-item .checkbox span {
    color: #818592;
    font-size: 14px;
    --padding-left: 5px;
}
.rightbar-filter .filter-box-controls-item:not(:last-child) {
    margin-bottom: 6px;
}
.rightbar-filter .filter-box-link {
    padding: 0 10px;
    padding-top: 1rem;
}
.rightbar-filter .filter-box-link .btn {
    --color: var(--color-font-grey);
    --font-size: 14px;
    text-decoration: underline;
}
.rightbar-filter .filter-search {
    position: relative;
    margin-bottom: 1rem;
}
.rightbar-filter .filter-search-icon {
    display: flex;
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    --ui-icon-width: 14px;
}
.rightbar-filter .filter-search .input {
    --background-color: #F2F4F7;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    padding: 10px;
    padding-left: 37px;
    height: auto;
}
.rightbar-filter .filter .filter-box-name,
.rightbar-filter .filter .filter-box-controls {
    padding: 0 10px;
}
.rightbar-filter .filter-btn .btn {
    --font-size: 14px;
    --padding-tb: 10px;
}

.rightbar-filter .filter .filter-box-controls{
    max-height: 180px;
    overflow: auto;
    --scrollbar-width: 8px;
    --scrollbar-track-color: #f1f1f1;
    --scrollbar-scrollbar-thumb-color: #c3c3c3;
    --scrollbar-scrollbar-thumb-border-radius: 0px;
}

.rightbar-filter .filter .filter-box-controls.-expanded{
    max-height: 350px;
}

.brends-wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 50px 15px;
    margin-bottom: 42px;
}
@media screen and (max-width: 1110px) {
    .brends-wrapper {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    }
}
@media screen and (max-width: 1024px) {
    .brends-wrapper {
        gap: 25px 15px;
    }
}
@media screen and (max-width: 768px) {
    .brends-wrapper {
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    }
}

@media screen and (max-width: 480px) {
    .brends-wrapper {
        grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    }
}

.brend-card-image {
    border: 4px solid #F5F7FC;
    border-radius: 18px;
    overflow: hidden;
    padding: 36px 46px;
    margin-bottom: 10px;
    position: relative;
    aspect-ratio: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}
@media screen and (max-width: 1024px) {
    .brend-card-image {
        padding: 20px;
    }
}
@media screen and (max-width: 480px) {
    .brend-card-image {
        padding: 1rem;
    }
}
.brend-card-image img {
    display: block;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    max-width: 220px;
    margin: 0 auto;
}
.brend-card-name {
    font-size: 13px;
    font-weight: 500;
    line-height: 1.1;
    color: #A6B3C2;
    text-align: center;
}
@media screen and (max-width: 768px) {
    .brend-card-name {
        font-size: 12px;
    }
}
.brend-card.brend-card-premium .brend-card-image {
    border-color: #E3DBEA;
}
.brend-card.brend-card-premium .brend-card-image::after {
    content: "premium";
    font-size: 11px;
    line-height: 1.1;
    text-transform: uppercase;
    background-color: #B8AFE1;
    color: var(--color-font-white);
    position: absolute;
    bottom: 16px;
    right: 20px;
    padding: 6px 10px;
    border-radius: 8px;
    max-width: -moz-max-content;
    max-width: max-content;
    max-height: -moz-max-content;
    max-height: max-content;
}
@media screen and (max-width: 768px) {
    .brend-card.brend-card-premium .brend-card-image::after {
        bottom: 10px;
        right: 10px;
    }
}

.brend-detail {
    border: 4px solid #F5F7FC;
    border-radius: 18px;
    overflow: hidden;
    padding: 22px 32px;
    margin-bottom: 40px;
}
@media screen and (max-width: 1024px) {
    .brend-detail {
        padding: 1rem;
    }
}
.brend-detail-wrapper {
    display: grid;
    grid-template-columns: 250px 1fr;
    gap: 2rem;
}
@media screen and (max-width: 1300px) {
    .brend-detail-wrapper {
        grid-template-columns: 180px 1fr;
    }
}
@media screen and (max-width: 1024px) {
    .brend-detail-wrapper {
        grid-template-columns: 140px 1fr;
        gap: 1rem;
    }
}
@media screen and (max-width: 768px) {
    .brend-detail-wrapper {
        grid-template-columns: 1fr;
    }
}
.brend-detail-logo-image {
    max-width: 218px;
    margin: 0 auto;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
@media screen and (max-width: 768px) {
    .brend-detail-logo-image {
        max-width: 190px;
    }
}
.brend-detail-logo-image img {
    display: block;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.brend-detail-logo-name {
    text-align: center;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.1;
    color: #A6B3C2;
}
@media screen and (max-width: 1024px) {
    .brend-detail-logo-name {
        font-size: 12px;
    }
}
.brend-detail-body {
    align-content: center;
    padding-left: 47px;
    border-left: 2px solid #E7EBF1;
}
@media screen and (max-width: 1024px) {
    .brend-detail-body {
        padding-left: 2rem;
    }
}
@media screen and (max-width: 768px) {
    .brend-detail-body {
        border-left: none;
        padding-left: 0;
        padding-top: 1rem;
        border-top: 2px solid #E7EBF1;
    }
}
.brend-detail-title {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.1;
    margin-bottom: 20px;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1024px) {
    .brend-detail-title {
        font-size: 18px;
        margin-bottom: 1rem;
    }
}
.brend-detail-text {

}
@media screen and (max-width: 1024px) {
    .brend-detail-text {
    
    }
}
.brend-detail-text p {
    font-size: 16px;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.brend-detail-text p:last-child {
    margin-bottom: 0;
}
.brend-detail-btn .btn {
    --font-size: 13px;
    --color: var(--color-font-grey);
    text-decoration: underline;
}

.product-detail .h1 {
    font-size: 33px;
}
.product-detail-wrapper {
    display: grid;
    grid-template-columns: 620px 1fr;
    gap: 2rem;
    margin-bottom: 50px;
}
@media screen and (max-width: 1300px) {
    .product-detail-wrapper {
        grid-template-columns: 500px 1fr;
    }
}
@media screen and (max-width: 1024px) {
    .product-detail-wrapper {
        grid-template-columns: 45% 1fr;
    }
}
@media screen and (max-width: 768px) {
    .product-detail-wrapper {
        display: block;
    }
}
.product-detail-images {
    padding: 26px;
    border-radius: 18px;
    border: 4px solid #F5F7FC;
    height: 550px;
}
@media screen and (max-width: 1300px) {
    .product-detail-images {
        height: 400px;
    }
}
@media screen and (max-width: 768px) {
    .product-detail-images {
        margin-bottom: 1rem;
    }
}
.product-detail-images-swiper.swiper {
    --swiper-navigation-top-offset: 45%;
    --swiper-navigation-color: #000;
}
.product-detail-images-swiper.swiper .swiper-button-prev,
.product-detail-images-swiper.swiper .swiper-button-next {
    background: #ffffff;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    --swiper-navigation-size: 20px;
    box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.1);
}
.product-detail-images-swiper.swiper .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}
.product-detail-top {
    border-bottom: 1px solid rgba(35, 59, 111, 0.1019607843);
    padding-bottom: 1rem;
    margin-bottom: 20px;
}
.product-detail-top-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.product-detail-top-row-cell {
    display: flex;
    align-items: center;
    gap: 10px;
}
.product-detail-brend-name {
    font-size: 12px;
    color: #A6B3C2;
    display: inline-block;
    border: 1px solid #A6B3C2;
    border-radius: 20px;
    padding: 8px 10px;
    line-height: 1;
}
.product-detail-brend-image {
    width: 115px;
}
.product-detail-brend-image img {
    display: block;
    width: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}
.product-detail-category {
    font-size: 13px;
    font-weight: 500;
    color: var(--color-font-grey);
    line-height: 1.1;
}
.product-detail-rating {
    display: flex;
    align-items: center;
    gap: 3px;
}
.product-detail-rating-icon {
    display: flex;
    --ui-icon-width: 24px;
}
.product-detail-rating-value {
    font-size: 17px;
    font-weight: 500;
    line-height: 1.4;
    color: var(--color-font-dark-blue);
}
.product-detail-rating-text {
    margin-left: 10px;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.product-detail-props {
    margin-bottom: 26px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    line-height: 1;
    color: var(--color-font-dark-blue);
    font-size: 16px;
}
@media screen and (max-width: 1024px) {
    .product-detail-props {
        font-size: 14px;
    }
}
.product-detail-props-row {
    display: flex;
    gap: 8px;
}
.product-detail-props-name {
    font-weight: 500;
}
.product-detail-props-value {
    font-weight: 400;
}
.product-detail-available {
    font-size: 16px;
    font-weight: 500;
    color: var(--color-font-dark-blue);
    line-height: 1.1;
    margin-bottom: 2rem;
}
.product-detail-available span {
    display: flex;
    align-items: center;
    gap: 7px;
    --icon-color: #5CCF84;
}
.product-detail-available span:before {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--icon-color);
    position: relative;
    top: -1px;
}
.product-detail-available .not-available {
    display: none;
    --icon-color: #F8348E;
}
.product-detail-available.product-detail-not-available {
    color: #D90063;
}
.product-detail-available.product-detail-not-available span {
    display: none;
}
.product-detail-available.product-detail-not-available .not-available {
    display: flex;
}
.product-detail-price {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 20px;
}
.product-detail-price-icon {
    display: flex;
    --ui-icon-width: 38px;
}
@media screen and (max-width: 1300px) {
    .product-detail-price-icon {
        --ui-icon-width: 30px;
    }
}
.product-detail-price-value {
    display: flex;
    gap: 1rem;
}
.product-detail-price-current {
    font-size: 40px;
    font-weight: 500;
    line-height: 1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1300px) {
    .product-detail-price-current {
        font-size: 30px;
    }
}
.product-detail-price-old {
    font-size: 24px;
    font-weight: 500;
    line-height: 1;
    color: var(--color-font-grey);
    text-decoration: line-through;
}
@media screen and (max-width: 1300px) {
    .product-detail-price-old {
        font-size: 18px;
    }
}
.product-detail-price-text {
    font-size: 28px;
    line-height: 1.2;
    color: var(--color-font-blue);
}
@media screen and (max-width: 1300px) {
    .product-detail-price-text {
        font-size: 22px;
    }
}
.product-detail-price-text a {
    font-weight: 500;
    color: var(--color-font-blue);
    text-decoration: underline;
}
/*.product-detail-price.hidden .product-detail-price-value {
    display: none;
}
.product-detail-price.hidden .product-detail-price-text {
    display: block;
}*/
.product-detail-controls {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 22px;
}
.product-detail-controls .btn {
    --padding-tb: 18px;
    --padding-lr: 26px;
    --border-radius: 18px;
    --font-size: 18px;
}
@media screen and (max-width: 1300px) {
    .product-detail-controls .btn {
        --padding-tb: 14px;
        --font-size: 16px;
    }
}
.product-detail-controls .btn .icon {
    --ui-icon-width: 22px;
}
.product-detail-controls-wishlist.btn {
    --border-color: #D2D6E4;
    --padding-lr: 18px;
}
@media screen and (max-width: 1300px) {
    .product-detail-controls-wishlist.btn {
        --padding-lr: 14px;
    }
}
.product-detail-controls-wishlist:hover {
    --border-color: var(--color-dark-blue);
    --background-color: var(--color-dark-blue);
}
.product-detail-controls-wishlist:hover .icon {
    --fill: #fff;
}
.product-detail-controls-wishlist.in-wishlist {
    --border-color: #D90063;
    --background-color: #D90063;
}
.product-detail-controls-wishlist.in-wishlist .icon {
    --fill: #fff;
}
.product-detail-delivery {
    border-radius: 20px;
    overflow: hidden;
    background-color: #F2F4F7;
    padding: 20px 24px;
}
@media screen and (max-width: 480px) {
    .product-detail-delivery {
        padding: 1rem;
    }
}
.product-detail-delivery-header {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.product-detail-delivery-header span {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.product-detail-delivery-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid rgba(35, 59, 111, 0.1019607843);
}
.product-detail-delivery-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    font-size: 14px;
    line-height: 1.1;
    font-weight: 500;
    color: var(--color-font-grey);
}
.product-detail-delivery-row-name {
    display: flex;
    align-items: center;
    gap: 5px;
    --ui-icon-width: 20px;
}
.product-detail-delivery-row-value {
    display: flex;
    align-items: center;
    gap: 5px;
}
.product-detail-delivery-row-value span:first-child {
    color: var(--color-font-dark-blue);
}
.product-detail-description {
    margin-bottom: 100px;
}
@media screen and (max-width: 1300px) {
    .product-detail-description {
        margin-bottom: 60px;
    }
}
@media screen and (max-width: 1024px) {
    .product-detail-description {
        margin-bottom: 40px;
    }
}
.product-detail-description-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
}
@media screen and (max-width: 1300px) {
    .product-detail-description-wrapper {
        gap: 2rem;
    }
}
@media screen and (max-width: 768px) {
    .product-detail-description-wrapper {
        grid-template-columns: 1fr;
        gap: 0;
    }
}
.product-detail-description-block {
    margin-bottom: 40px;
}
@media screen and (max-width: 1024px) {
    .product-detail-description-block {
        margin-bottom: 2rem;
    }
}
.product-detail-description-block-title {
    font-size: 22px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 1rem;
}
@media screen and (max-width: 1024px) {
    .product-detail-description-block-title {
        font-size: 20px;
        margin-bottom: 10px;
    }
}
.product-detail-description-block-content,
.product-detail-description-block-content *,
.product-detail-description-block-content p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.2;
    color: var(--color-font-dark-blue);
}
.product-detail-description-block-content p:last-child {
    margin-bottom: 0;
}

.product-detail-description-block-content ul{
    padding-left: 20px;
}

.product-detail-description-block-content ul li{
    list-style: disc;
}

.product-detail-poster {
    padding-top: 1rem;
    position: relative;
}
@media screen and (max-width: 1024px) {
    .product-detail-poster {
        overflow: hidden;
    }
}
@media screen and (max-width: 480px) {
    .product-detail-poster {
        padding-top: 0;
    }
}
.product-detail-poster-badge {
    margin-bottom: 1rem;
    display: inline-block;
    color: #6C93C7;
    border: 1px solid #6C93C7;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    border-radius: 20px;
    padding: 6px 10px;
}
.product-detail-poster-container {
    background: url("/local/templates/estelifecentre/img/product-detail-poster-bg.jpg") center/cover, no-repeat;
    border-radius: 20px;
    padding: 26px 40px;
}
@media screen and (max-width: 1024px) {
    .product-detail-poster-container {
        padding: 1rem;
    }
}
.product-detail-poster-content {
    max-width: 60%;
}
@media screen and (max-width: 480px) {
    .product-detail-poster-content {
        max-width: 70%;
    }
}
.product-detail-poster-title {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-black);
    margin-bottom: 27px;
}
@media screen and (max-width: 1024px) {
    .product-detail-poster-title {
        font-size: 18px;
    }
}
.product-detail-poster-btn .btn {
    --border-radius: 12px;
    --font-size: 15px;
    --padding-lr: 2rem;
    --padding-tb: 10px;
}
@media screen and (max-width: 1024px) {
    .product-detail-poster-btn .btn {
        --font-size: 14px;
    }
}
.product-detail-poster-image {
    max-width: 260px;
    position: absolute;
    bottom: 0;
    right: 0;
}
@media screen and (max-width: 1024px) {
    .product-detail-poster-image {
        max-width: 200px;
        right: -25px;
    }
}
@media screen and (max-width: 480px) {
    .product-detail-poster-image {
        max-width: 170px;
    }
}
.product-detail-poster-image img {
    display: block;
    width: 100%;
}

.quantity-input {
    --arrow-size: 48px;
    --height: 58px;
    align-items: center;
    border: 1px solid #959BAB;
    border-radius: 18px;
    box-sizing: border-box;
    display: grid;
    font-size: 18px;
    grid-template-columns: repeat(3, var(--arrow-size));
    justify-content: center;
}
@media screen and (max-width: 1300px) {
    .quantity-input {
        --height: 52px;
    }
}
.quantity-input * {
    height: var(--height);
}
.quantity-input__btn {
    align-items: center;
    background: transparent;
    border: none;
    display: inline-flex;
    justify-content: center;
}
.quantity-input__btn .icon {
    --ui-icon-width: 24px;
}
.quantity-input__value {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    text-align: center;
}

.basket-wrapper {
    display: grid;
    grid-template-columns: 1fr 510px;
    gap: 40px;
}
@media screen and (max-width: 1300px) {
    .basket-wrapper {
        grid-template-columns: 1fr 400px;
        gap: 2rem;
    }
}
@media screen and (max-width: 1024px) {
    .basket-wrapper {
        grid-template-columns: 1fr;
    }
}

.basket-list-buttons{
    display: flex;
    gap: 10px;
    margin-bottom: 1rem;
}

.basket-list {
    margin-bottom: 40px;
}
.basket-item {
    margin-bottom: 1rem;
    position: relative;
    padding: 1rem 22px;
    padding-right: 70px;
    border-radius: 12px;
    border: 3px solid #F5F7FC;
    overflow: hidden;
}
@media screen and (max-width: 1300px) {
    .basket-item {
        padding-right: 40px;
    }
}
.basket-item:last-child {
    margin-bottom: 0;
}
.basket-item-wrapper {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 50px;
    align-items: center;
}
@media screen and (max-width: 1300px) {
    .basket-item-wrapper {
        grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
        gap: 2rem;
    }
}
@media screen and (max-width: 768px) {
    .basket-item-wrapper {
        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
        gap: 1rem;
    }
}
@media screen and (max-width: 480px) {
    .basket-item-wrapper {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    }
}
.basket-item-wrapper-left {
    gap: 1rem;
    display: grid;
    align-items: center;
    grid-template-columns: 92px 1fr;
}
@media screen and (max-width: 768px) {
    .basket-item-wrapper-left {
        grid-template-columns: 80px 1fr;
    }
}

.basket-item-info{
    display: flex;
    gap: 10px;
    font-size: 12px;
    align-content: center;
}

.basket-item-wrapper-left .basket-item-image{
    aspect-ratio: 1;
}

.basket-item-wrapper-right {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
@media screen and (max-width: 1300px) {
    .basket-item-wrapper-right {
        justify-content: center;
        gap: 2rem;
    }
}
.basket-item-image img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}
.basket-item-content {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.basket-item-name {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 480px) {
    .basket-item-name {
        font-size: 14px;
    }
}
.basket-item-article {
    font-size: 12px;
    font-weight: 500;
    color: var(--color-font-grey);
}
.basket-item-price {
    display: flex;
    gap: 10px;
}
.basket-item-price-current {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.basket-item-price-old {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
    text-decoration: line-through;
}
.basket-item-counter .quantity-input {
    --arrow-size: 40px;
    --height: 38px;
    border-radius: 14px;
    font-size: 15px;
}
.basket-item-counter .quantity-input__btn .icon {
    --ui-icon-width: 18px;
}
@media screen and (max-width: 480px) {
    .basket-item-counter .quantity-input {
        --arrow-size: 34px;
        --height: 34px;
    }
}
.basket-item-total {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 768px) {
    .basket-item-total {
        font-size: 16px;
    }
}
.basket-item-remove {
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    --ui-icon-width: 16px;
    cursor: pointer;
}
.basket-checkout {
    border-radius: 20px;
    background-color: #F2F4F7;
    overflow: hidden;
    padding: 2rem;
}
@media screen and (max-width: 1024px) {
    .basket-checkout {
        padding: 20px;
    }
}
.basket-checkout-title {
    font-size: 24px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 26px;
}
@media screen and (max-width: 1024px) {
    .basket-checkout-title {
        font-size: 20px;
        margin-bottom: 1rem;
    }
}
.basket-checkout-header {
    padding-bottom: 29px;
    margin-bottom: 19px;
    border-bottom: 1px solid #D8DEE8;
}
@media screen and (max-width: 1024px) {
    .basket-checkout-header {
        margin-bottom: 1rem;
        padding-bottom: 1rem;
    }
}
.basket-checkout-header-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 10px;
}
.basket-checkout-header-row:last-child {
    margin-bottom: 0;
}
.basket-checkout-header-row-name, .basket-checkout-header-row-value {
    font-size: 14px;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.basket-checkout-header-row-value {
    font-weight: 700;
}
.basket-checkout-description {
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    color: #808490;
    margin-bottom: 21px;
    padding-bottom: 2rem;
    border-bottom: 1px solid #D8DEE8;
}
@media screen and (max-width: 1024px) {
    .basket-checkout-description {
        margin-bottom: 1rem;
        padding-bottom: 1rem;
    }
}
.basket-checkout-description ul {
    padding-left: 16px;
}
.basket-checkout-description ul li {
    list-style-type: disc;
}
.basket-checkout-description ul li:not(:last-child) {
    margin-bottom: 8px;
}
.basket-checkout-total {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
    margin-bottom: 47px;
}
@media screen and (max-width: 1024px) {
    .basket-checkout-total {
        margin-bottom: 2rem;
        flex-wrap: wrap;
    }
}
.basket-checkout-total-text {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.basket-checkout-total-price {
    font-size: 40px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1300px) {
    .basket-checkout-total-price {
        font-size: 32px;
    }
}
@media screen and (max-width: 1024px) {
    .basket-checkout-total-price {
        font-size: 24px;
    }
}
.basket-checkout-btn .btn {
    --font-size: 18px;
    --padding-tb: 15px;
    --border-radius: 12px;
}
@media screen and (max-width: 1024px) {
    .basket-checkout-btn .btn {
        --padding-tb: 12px;
    }
}
.basket-checkout-promo {
    display: grid;
    grid-template-columns: 1fr 150px;
    gap: 10px;
    margin-bottom: 26px;
    --height: 45px;
}
@media screen and (max-width: 1300px) {
    .basket-checkout-promo {
        grid-template-columns: 1fr;
    }
}
@media screen and (max-width: 1024px) {
    .basket-checkout-promo {
        display: flex;
        flex-wrap: wrap;
        --height: 40px;
    }
}
.basket-checkout-promo-input .input {
    height: var(--height);
}
.basket-checkout-promo-input small {
    font-size: 12px;
    color: var(--color-font-grey);
    display: block;
    line-height: 1.1;
}
@media screen and (max-width: 1024px) {
    .basket-checkout-promo-input {
        flex: 1 1 auto;
    }
}
.basket-checkout-promo-btn .btn {
    height: var(--height);
}
@media screen and (max-width: 1024px) {
    .basket-checkout-promo-btn {
        flex: 1 1 200px;
    }
}
.basket-delivery {
    margin-bottom: 40px;
}
.basket-delivery-title {
    font-size: 30px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 29px;
}
@media screen and (max-width: 1024px) {
    .basket-delivery-title {
        font-size: 24px;
        margin-bottom: 1rem;
    }
}
.basket-delivery-item {
    --icon-size: 30px;
    grid-template-columns: 1fr var(--icon-size);
    gap: 10px;
    padding: 18px 2rem;
    border-radius: 12px;
    border: 2px solid #E8EAF0;
}
@media screen and (max-width: 1024px) {
    .basket-delivery-item {
        --icon-size: 24px;
        padding: 1rem;
    }
}
.basket-delivery-item:not(:last-child) {
    margin-bottom: 15px;
}
.basket-delivery-item:hover, .basket-delivery-item.is-active {
    border-color: var(--color-dark-blue);
}
.basket-delivery-item-content {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.basket-delivery-item-name {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.basket-delivery-item-description {
    font-size: 13px;
    font-weight: 400;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.basket-delivery-item-price {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.1;
    color: #2862AF;
    margin-top: 10px;
}
.basket-addresses-title {
    font-size: 30px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 29px;
}
@media screen and (max-width: 1024px) {
    .basket-addresses-title {
        font-size: 24px;
        margin-bottom: 1rem;
    }
}
.basket-addresses-container {
    border-radius: 20px;
    background-color: #F2F4F7;
    padding: 2rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}
@media screen and (max-width: 1024px) {
    .basket-addresses-container {
        padding: 20px;
    }
}


.radio basket-delivery-item input[type='radio'] {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.1;
    color: #2862AF;
}

.basket-addresses-input {
    flex: 1 1 auto;
}
.basket-addresses-input small {
    font-size: 12px;
    font-weight: 500;
    color: var(--color-font-grey);
}
.basket-addresses-input.basket-addresses-input-name {
    flex: 1 1 200px;
}
.basket-addresses-input.basket-addresses-input-address {
    flex: 1 1 auto;
}

.events-header {
    margin-bottom: 26px;
}
.events-header-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}
.events-filter {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 2rem;
}
@media screen and (max-width: 768px) {
    .events-filter {
        gap: 1rem;
    }
}
.events-filter-block {
    display: flex;
    gap: 12px;
}
.events-filter-block-wrapper {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}
.events-filter-block-icon {
    display: flex;
    --ui-icon-width: 18px;
}
a.events-filter-block-btn {
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    color: var(--color-font-grey);
    cursor: pointer;
}
a.events-filter-block-btn.active {
    color: var(--color-font-dark-blue);
}
.events-controls-item {
    font-size: 13px;
}
.events-poster {
    min-height: 170px;
    border-radius: 20px;
    overflow: hidden;
    background: url("/local/templates/estelifecentre/img/events-poster.jpg") left/cover, no-repeat;
    margin-bottom: 1rem;
}
@media screen and (max-width: 1024px) {
    .events-poster {
        background-image: url("/local/templates/estelifecentre/img/events-poster-bg-adaptive.jpg");
    }
}
.events-poster-wrapper {
    display: grid;
    grid-template-columns: 1fr 220px;
    align-items: center;
    gap: 2rem;
    padding: 42px 55px;
    padding-left: 300px;
}
@media screen and (max-width: 1300px) {
    .events-poster-wrapper {
        grid-template-columns: 1fr 200px;
    }
}
@media screen and (max-width: 1024px) {
    .events-poster-wrapper {
        padding-left: 0;
        padding: 42px 55px;
    }
}
@media screen and (max-width: 768px) {
    .events-poster-wrapper {
        padding: 2rem;
        grid-template-columns: 1fr;
    }
}
.events-poster-container {
    max-width: 615px;
    width: 100%;
    display: flex;
    gap: 20px;
}
@media screen and (max-width: 480px) {
    .events-poster-container {
        flex-direction: column;
        gap: 1rem;
    }
}
.events-poster-badge span {
    font-size: 13px;
    font-weight: 500;
    display: inline-block;
    color: #788FB8;
    border: 1px solid #788FB8;
    border-radius: 20px;
    padding: 5px 10px;
    text-transform: uppercase;
}
@media screen and (max-width: 1300px) {
    .events-poster-badge span {
        font-size: 11px;
    }
}
.events-poster-content-title {
    font-size: 25px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-white);
    margin-bottom: 20px;
}
@media screen and (max-width: 1300px) {
    .events-poster-content-title {
        font-size: 20px;
    }
}
.events-poster-content-subtitle {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.1;
    color: #E7EBF1;
}
.events-poster-btn .btn {
    --border-radius: 12px;
    --font-size: 18px;
    --color: var(--color-font-blue);
    --border-color: #fff;
    --padding-tb: 16px;
}
@media screen and (max-width: 1300px) {
    .events-poster-btn .btn {
        --font-size: 16px;
        --padding-tb: 12px;
    }
}
.events-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}
.events-item {
    padding: 20px 2rem;
    border-radius: 20px;
    overflow: hidden;
    background-color: #F5F7FC;
    display: grid;
    grid-template-columns: 1fr 200px;
    gap: 3rem;
    cursor: pointer;
}
.events-item:hover {
    background-color: #E7ECF9;
}
.events-item:hover .events-item-btn {
    background-color: #6064B4;
}
@media screen and (max-width: 1110px) {
    .events-item {
        gap: 2rem;
    }
}
@media screen and (max-width: 1024px) {
    .events-item {
        padding: 20px;
    }
}
@media screen and (max-width: 650px) {
    .events-item {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}
.events-item-left {
    display: grid;
    grid-template-columns: 265px 1fr;
    align-items: center;
    gap: 1rem;
}
@media screen and (max-width: 1024px) {
    .events-item-left {
        grid-template-columns: 1fr;
    }
}
.events-item-right {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    padding-left: 2rem;
    border-left: 1px solid #D6DAE5;
}
@media screen and (max-width: 650px) {
    .events-item-right {
        display: none;
        padding-left: 0;
        border-left: none;
        padding-top: 1rem;
        border-top: 1px solid #D6DAE5;
    }
}
.events-item-date {
    font-size: 14px;
    line-height: 1;
    display: flex;
    max-width: -moz-max-content;
    max-width: max-content;
    max-height: -moz-max-content;
    max-height: max-content;
    gap: 10px;
    display: grid;
}

.events-item-date-item {
    display: flex;
    gap: 10px;
    align-items: center;
}

.events-item-date-date{
    font-weight: 500;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding: 0;
    width: 140px;

}
.events-item-date-date div{
    color: #fff;
    padding: 8px 15px;
    width: max-content;
    text-align: center;
    border-radius: 16px;
    background: var(--color-dark-blue);
}

.events-item-date-location{
    display: flex;
    flex-wrap: wrap;
}

.events-item-date-location span:not(:last-child):after{
    content: ',';
    margin-right: 5px;
}

@media screen and (max-width: 1024px) {
    .events-item-date {
        font-size: 12px;
        font-weight: 500;
        padding: 6px 10px;
        width: 100%;
        max-width: unset;
        padding: 0;
    }
    .events-item-date-item{
        display: grid;
        grid-template-columns: 1fr 100px;
        align-items: flex-start;
    }
    .events-item-date-location{
        justify-content: flex-end;
    }
    .events-item-date-date{
        width: auto;
        font-size: 12px;
    }
    .events-item-date-date div{
        padding: 6px 10px;
    }
}
.events-item-body {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    align-items: center;
}
@media screen and (max-width: 1110px) {
    .events-item-body {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}
.events-item-image {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 50%;
    overflow: hidden;
}
.events-item-image img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.events-item-content {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.events-item-title {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1110px) {
    .events-item-title {
        font-size: 18px;
    }
}
.events-item-subtitle {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.events-item-price {
    font-size: 24px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1110px) {
    .events-item-price {
        font-size: 20px;
    }
}
.events-item-btn {
    display: inline-flex;
    border-radius: 12px;
    background-color: var(--color-dark-blue);
    padding: 10px 15px;
}
.events-item-btn .icon {
    --ui-icon-width: 16px;
    --fill: #fff;
}

.vacancies-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(450px, 1fr));
    gap: 1rem;
}
@media screen and (max-width: 1024px) {
    .vacancies-list {
        grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    }
}
@media screen and (max-width: 480px) {
    .vacancies-list {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    }
}
.vacancies-item {
    background-color: #F5F7FC;
    background: url("/local/templates/estelifecentre/img/vacancies-bg.png") center/cover, no-repeat;
    border-radius: 20px;
    overflow: hidden;
}
.vacancies-item-container {
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 2rem;
}
@media screen and (max-width: 1024px) {
    .vacancies-item-container {
        gap: 1rem;
        padding: 20px;
    }
}
.vacancies-item-header {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.vacancies-item-title {
    font-size: 24px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1024px) {
    .vacancies-item-title {
        font-size: 20px;
    }
}
.vacancies-item-subtitle {
    display: inline-flex;
    max-width: -moz-max-content;
    max-width: max-content;
    max-height: -moz-max-content;
    max-height: max-content;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    color: var(--color-font-blue);
    background-color: #E6EBF8;
    padding: 8px 12px;
    border-radius: 20px;
}
@media screen and (max-width: 1024px) {
    .vacancies-item-subtitle {
        font-size: 14px;
    }
}
.vacancies-item-props {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.vacancies-item-props-row {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 16px;
    color: var(--color-font-dark-blue);
    line-height: 1;
}
@media screen and (max-width: 1024px) {
    .vacancies-item-props-row {
        font-size: 14px;
    }
}
.vacancies-item-props-row-name {
    font-weight: 700;
}
.vacancies-item-btn .btn {
    --padding-tb: 12px;
    --padding-lr: 32px;
    --border-radius: 12px;
    --font-size: 16px;
}
@media screen and (max-width: 1024px) {
    .vacancies-item-btn .btn {
        --font-size: 14px;
        --padding-tb: 10px;
        --padding-lr: 32px;
    }
}

.about-page .main-about {
    margin-top: 0;
    margin-bottom: 80px;
}
.about-page .main-about-overlay::before {
    top: -70px;
}
.about-page .main-about-image {
    top: 0;
}
.about-page .main-about-bottom {
    margin-bottom: 3rem;
}
@media screen and (max-width: 1024px) {
    .about-page .main-about-bottom {
        margin-bottom: 1rem;
    }
}

.advantages {
    margin-bottom: 2rem;
}
.advantages-wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 1rem;
}
@media screen and (max-width: 480px){
    .advantages-wrapper {
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    }
}
.advantages-item {
    background-color: #F1F5FD;
    border-radius: 20px;
    overflow: hidden;
    padding: 26px;
    position: relative;
    max-height: -moz-max-content;
    max-height: max-content;
}
.advantages-item-icon {
    position: absolute;
    top: 20px;
    right: 26px;
    display: flex;
    --ui-icon-width: 40px;
}
@media screen and (max-width: 1024px) {
    .advantages-item-icon {
        --ui-icon-width: 30px;
    }
}
.advantages-item-header {
    margin-bottom: 2rem;
}
@media screen and (max-width: 1024px) {
    .advantages-item-header {
        margin-bottom: 1rem;
    }
}
.advantages-item-badge {
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    color: #8192A9;
    border: 1px solid #8192A9;
    border-radius: 20px;
    padding: 5px 10px;
    max-width: -moz-max-content;
    max-width: max-content;
    max-height: -moz-max-content;
    max-height: max-content;
    margin-bottom: 1rem;
}
.advantages-item-title {
    font-size: 24px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-blue);
}
@media screen and (max-width: 1024px) {
    .advantages-item-title {
        font-size: 20px;
    }
}
.advantages-item-text {
    font-size: 18px;
    font-weight: 400;
}
@media screen and (max-width: 1024px) {
    .advantages-item-text {
        font-size: 16px;
    }
}
.advantages-item-text p {
    line-height: 1.2;
    color: var(--color-font-dark-blue);
}

.suppliers-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}
@media screen and (max-width: 1024px) {
    .suppliers-wrapper {
        grid-template-columns: 1fr;
    }
}
.suppliers-description {
    margin-bottom: 26px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.1;
    color: #A6B3C2;
}
.suppliers-subtitle {
    margin-bottom: 26px;
    font-size: 24px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1024px) {
    .suppliers-subtitle {
        font-size: 20px;
    }
}
.suppliers-block {
    border-radius: 20px;
    background-color: #F2F4F7;
    overflow: hidden;
    padding: 2rem;
}
@media screen and (max-width: 480px) {
    .suppliers-block {
        padding: 20px;
    }
}
.suppliers-block-title {
    font-size: 30px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 2rem;
}
@media screen and (max-width: 1300px) {
    .suppliers-block-title {
        font-size: 24px;
        margin-bottom: 1rem;
    }
}
.suppliers-form .form-row {
    margin-bottom: 28px;
}
@media screen and (max-width: 1300px) {
    .suppliers-form .form-row {
        margin-bottom: 1rem;
    }
}
.suppliers-form .form-row.form-row-double {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 28px 10px;
}
@media screen and (max-width: 1300px) {
    .suppliers-form .form-row.form-row-double {
        gap: 1rem 10px;
    }
}
@media screen and (max-width: 1024px) {
    .suppliers-form .form-row.form-row-double {
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    }
}
@media screen and (max-width: 480px) {
    .suppliers-form .form-row.form-row-double {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    }
}
.suppliers-form .form-row-input small {
    font-size: 12px;
    font-weight: 500;
    color: var(--color-font-grey);
}
.suppliers-form .form-row .btn {
    --font-size: 18px;
    --border-radius: 12px;
    --padding-tb: 12px;
    --padding-lr: 64px;
}
@media screen and (max-width: 480px) {
    .suppliers-form .form-row .btn {
        width: 100%;
        --padding-lr: 12px;
    }
}
.suppliers-form .form-row .checkbox {
    font-size: 14px;
    line-height: 1.1;
}
.suppliers-form .form-row .checkbox:not(:last-child) {
    margin-bottom: 1rem;
}
.suppliers-form .form-description {
    background-color: #DDE9F5;
    border-radius: 8px;
    overflow: hidden;
    display: grid;
    grid-template-columns: 24px 1fr;
    gap: 1rem;
    align-items: center;
    padding: 1rem 2rem;
}
@media screen and (max-width: 480px) {
    .suppliers-form .form-description {
        padding: 20px;
    }
}
.suppliers-form .form-description-icon {
    display: flex;
    --ui-icon-width: 24px;
}
.suppliers-form .form-description-content {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.suppliers-form .form-description-content-text {
    font-size: 17px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 480px) {
    .suppliers-form .form-description-content-text {
        font-size: 14px;
    }
}
.suppliers-form .form-description-content-manager {
    font-size: 15px;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}
@media screen and (max-width: 480px) {
    .suppliers-form .form-description-content-manager {
        font-size: 14px;
    }
}
.suppliers-form .form-description-content-manager-phone {
    font-weight: 700;
}

.login-page-wrapper {
    display: grid;
    grid-template-columns: 1fr 510px;
    gap: 2rem;
    position: relative;
    margin-bottom: 40px;
    padding-top: 2rem;
}
@media screen and (max-width: 1300px) {
    .login-page-wrapper {
        grid-template-columns: 1fr 400px;
        gap: 1rem;
    }
}
@media screen and (max-width: 850px) {
    .login-page-wrapper {
        grid-template-columns: 1fr;
    }
}
.login-page-emblem {
    position: absolute;
    top: -66px;
    right: -60px;
    width: 100%;
    max-width: 240px;
    z-index: -1;
}
@media screen and (max-width: 1600px) {
    .login-page-emblem {
        right: 0;
    }
}
.login-page-emblem img {
    display: block;
    width: 100%;
}
.login-page .form .input {
    padding-top: 14px;
    padding-bottom: 14px;
}
.login-page-success-wrapper {
    display: grid;
    grid-template-columns: 1fr;
    max-width: 500px;
    margin: 0 auto;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    background-color: #D9ECEB;
    border-radius: 8px;
    overflow: hidden;
    padding: 2rem 4rem;
}
@media screen and (max-width: 1300px) {
    .login-page-success-wrapper {
        padding: 2rem 3rem;
    }
}
@media screen and (max-width: 768px) {
    .login-page-success-wrapper {
        grid-template-columns: 1fr;
        gap: 1rem;
        padding: 20px;
        justify-items: center;
    }
}
.login-page-success-title {
    display: grid;
    grid-template-columns: 30px 1fr;
    align-items: center;
    gap: 1rem;
}
@media screen and (max-width: 1300px) {
    .login-page-success-title {
        grid-template-columns: 25px 1fr;
        gap: 10px;
    }
}
.login-page-success-title span {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.1;
    color: #2C8C87;
}
@media screen and (max-width: 1300px) {
    .login-page-success-title span {
        font-size: 18px;
    }
}
.login-page-success-icon img {
    display: block;
    width: 100%;
}
.login-page-success-text {
    font-size: 15px;
    font-weight: 400;
    line-height: 1.2;
    color: var(--color-font-dark-blue);
    max-width: 580px;
}
@media screen and (max-width: 768px) {
    .login-page-success-text {
        text-align: center;
    }
}

.registaration {
    background-color: #F2F4F7;
    border-radius: 20px;
    overflow: hidden;
    padding: 40px 2rem;
    position: relative;
}

.registaration.--is-loading{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    cursor: wait;
}

.registaration.--is-loading:before{
    position: absolute;
    content: '';
    background: rgb(255 255 255 / 62%);
    inset: 0;
    z-index: 100;
}

.registaration.--is-loading:after{
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    margin: -1.5rem -1.5rem;
    border: 3px solid var(--color-dark-blue);
    border-top-color: transparent;
    animation: rotating 800ms linear infinite;
    z-index: 101;

}

@media screen and (max-width: 768px) {
    .registaration {
        padding: 20px;
    }
}
.registaration-title {
    margin-bottom: 2rem;
    font-size: 30px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 1300px) {
    .registaration-title {
        margin-bottom: 1rem;
        font-size: 22px;
    }
}

.registaration-text{
    margin-bottom: 1rem;
    display: block;
    font-size: 14px;
}

.registaration-text ul li{
    list-style: decimal;
}

.registaration-text ul{
    padding-left: 1rem;
    font-weight: 500;
}

.registaration-assepts{
    display: block;
    margin-bottom: 1rem;
    font-size: 14px;
    background: #fff;
    padding: 1rem;
    border-radius: 10px;
    border: 1px solid #ddd;
}

.registaration-assepts-title{
    display: block;
    margin-bottom: 1rem;
    font-size: 15px;
    font-weight: 400;
}

.registaration-assepts-item{
    display: block;
    margin-bottom: 10px;
}

.registaration-assepts-item-a{

}


.registaration-assepts .checkbox{
    margin-bottom: 5px;
    --icon-size: 20px;
}

.registaration-assepts .checkbox input{
    border-radius: 5px;
}
.registaration-assepts .checkbox span{
    color: #212e52;
}

.registaration-assepts .checkbox span a{
    text-decoration: underline;
    display: block;
}



.registaration-inputs {
    gap: 28px 10px;
    margin-bottom: 28px;
    display: flex;
    flex-wrap: wrap;
}
@media screen and (max-width: 1300px) {
    .registaration-inputs {
        gap: 10px;
    }
}
.registaration-inputs-item {
    flex: 1 1 220px;
}
.registaration-inputs-item:last-child {
    max-width: 100%;
    flex: 1 1 auto;
}
.registaration-inputs-item small {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
    display: block;
    margin-top: 5px;
    padding-left: 5px;
}
.registaration-inputs-item select.input {
    line-height: 1.1;
}
.registaration-files {
    margin-bottom: 1rem;
    padding: 1rem;
    border: 1px solid #ddd;
    border-radius: 8px;
    background: #ffffff0d;
}
.registaration-files-title {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 10px;
}

.registaration-files-types{
    display: block;
    margin-bottom: 1rem;
}

.registaration-files-types small {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
    display: block;
    margin-top: 5px;
    padding-left: 5px;
}


.registaration-files-btn {
    width: 100%;
    min-height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 1rem;
    border: 1px dashed #959BAB;
    border-radius: 8px;
    cursor: pointer;
}
.registaration-files-btn:hover:not(.--is-error){
    border: 1px dashed var(--color-dark-blue);
    background: rgb(255 255 255 / 54%);
}


.registaration-files-btn.--is-error{
    border: 1px dashed #f57171;
}

.registaration-files-btn span {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.registaration-files-btn .icon {
    --ui-icon-width: 14px;
}

.registaration-files-list{
    display: block;
    margin-bottom: 1rem;
}
.registaration-files-item{
    display: grid;
    grid-template-columns: 1fr 100px 20px;
    padding: 10px 1rem;
    border-bottom: 1px solid #ddd;
    font-size: 14px;
    gap: 10px;
    background-color: #DDE9F5;
    border-radius: 10px;
    margin-bottom: 5px;
    justify-content: center;
    align-items: center;
}

.registaration-files-item:last-child{
    border-bottom: none;
}

.registaration-files-item-name{
    font-weight: 500;
}

.registaration-files-item-format{
    color: #7a7a7a;
}

.registaration-files-item-close{
    text-align: center;
}

.registaration-btn {
    margin-bottom: 0;
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
}

.registaration-btn .btn {
    --font-size:18px;
    --border-radius: 12px;
    --padding-tb: 14px;
}
.registaration-footer {
    display: flex;
    justify-content: center;
}
.registaration-footer .checkbox {
    font-size: 14px;
}

.registaration-footer-inputs{
    display: flex;
    gap: 10px;
}

.registaration-inputs-item-captcha-image{
    padding: 0;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.input-has-btn{
    position: relative;
}

.input-has-btn input{
 padding-right: 2.5rem;
}


.input-has-btn button{
    position: absolute;
    right: 8px;
    top: 8px;
    border-radius: 0;
    aspect-ratio: 1;
    padding: 8px !important;
    border: none;
    background: transparent;
}

.login-block {
    background-color: #EEF3FA;
    border-radius: 20px;
    overflow: hidden;
    padding: 40px 2rem;
}
@media screen and (max-width: 768px) {
    .login-block {
        padding: 20px;
    }
}
.login-block-title {
    font-size: 30px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 2rem;
    display: flex;
    align-items: center;
    gap: 8px;
}
@media screen and (max-width: 1300px) {
    .login-block-title {
        margin-bottom: 1rem;
        font-size: 22px;
    }
}
.login-block-title .icon {
    --ui-icon-width: 24px;
}
@media screen and (max-width: 1300px) {
    .login-block-title .icon {
        --ui-icon-width: 20px;
    }
}
.login-block-form .form-row {
    margin-bottom: 20px;
}
.login-block-form .form-row-input small {
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    color: var(--color-font-grey);
}
.login-block-form .form-btn .btn {
    --font-size:18px;
    --border-radius: 12px;
    --padding-tb: 14px;
}

.input-password {
    position: relative;
}
.input-password-icon {
    display: flex;
    align-items: center;
    gap: 5px;
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translateY(-50%);
    font-size: 13px;
    color: var(--color-font-grey);
    cursor: pointer;
    --ui-icon-width: 15px;
    --fill: var(--color-font-grey);
    /* background: red; */
    padding: 10px;
}
.input-password .input {
    padding-right: 130px;
}

.profile-wrapper {
    display: grid;
    grid-template-columns: 290px 1fr;
    gap: 2rem;
}

.profile-wrapper.--is-loading{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    cursor: wait;
}

.profile-wrapper.--is-loading:before{
    position: absolute;
    content: '';
    background: rgb(255 255 255 / 62%);
    inset: 0;
    z-index: 100;
}

.profile-wrapper.--is-loading:after{
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    margin: -1.5rem -1.5rem;
    border: 3px solid var(--color-dark-blue);
    border-top-color: transparent;
    animation: rotating 800ms linear infinite;
    z-index: 101;

}


@media screen and (max-width: 1300px) {
    .profile-wrapper {
        grid-template-columns: 270px 1fr;
        gap: 1rem;
    }
}
@media screen and (max-width: 1024px) {
    .profile-wrapper {
        grid-template-columns: 1fr;
    }
}
.profile-rightbar {
    background-color: #F2F4F7;
    width: 100%;
    border-radius: 20px;
    padding: 2rem;
}
@media screen and (max-width: 1300px) {
    .profile-rightbar {
        padding: 30px 20px;
    }
}
.profile-rightbar-header {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #D8DEE8;
}
.profile-rightbar-header-row {
    display: flex;
    align-items: center;
    gap: 14px;
}
.profile-rightbar-header-row:not(:last-child) {
    margin-bottom: 12px;
}
.profile-rightbar-header-row-name {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.profile-rightbar-title {
    font-size: 22px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 23px;
}
.profile-rightbar-menu {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.profile-rightbar-menu-item {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    max-width: -moz-max-content;
    max-width: max-content;
    background: transparent;
    border: none;
    padding: 0;
}
.profile-rightbar-menu-item[data-count]::after {
    width: 18px;
    height: 18px;
    right: -25px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
}

.profile-rightbar-menu-item:not(.profile-wishlist)::after{
    display: none;
}

.profile-rightbar-menu-item.active {
    font-weight: 500;
}
.profile-rightbar-menu-item.logout {
    color: var(--color-font-black);
    font-weight: 500;
    position: relative;
}
.profile-rightbar-menu-item.logout::before {
    content: "";
    position: absolute;
    bottom: -5px;
    left: 0;
    height: 1px;
    width: 100%;
    background-color: #B7BCD5;
}

@media screen and (max-width: 480px) {
    .profile-rightbar-title{
        margin-bottom: 1rem;
    }
    .profile-rightbar-header{
        padding-bottom: 1rem;
        margin-bottom: 1rem;
    }
    .profile-rightbar-menu {
        white-space: nowrap;
        overflow: auto;
        overflow-y: unset;
        width: calc(100vw - 3.1rem);
        display: flex;
        gap: 8px;
        display: inline-block;
        padding-bottom: 5px;
    }
    .profile-rightbar-menu .profile-rightbar-menu-item{
        margin-right: 8px;
        border: 1px solid #b9b9b9;
        padding: 5px 8px;
        border-radius: 5px;
    }
    .profile-rightbar-menu .profile-rightbar-menu-item.active{
        border: 1px solid #2a348e;
        background: #2a348e;
        color: #fff;
    }
}

.profile-status {
    font-size: 12px;
    font-weight: 700;
    line-height: 1.1;
    max-width: -moz-max-content;
    max-width: max-content;
    max-height: -moz-max-content;
    max-height: max-content;
    padding: 4px 8px;
    border-radius: 8px;
    background-color: var(--background-color);
    color: var(--color);
}
.profile-status.profile-status-active {
    --background-color: #6DB786;
    --color: #fff;
}
.profile-status.profile-status-blocked {
    --background-color: #D90063;
    --color: #fff;
}
.profile-block {
    border-radius: 20px;
    overflow: hidden;
    background-color: #F2F4F7;
    padding: 40px 2rem;
}
.profile-block:not(:last-child) {
    margin-bottom: 20px;
}
@media screen and (max-width: 1024px) {
    .profile-block {
        padding: 25px;
    }
}
.profile-block-title {
    font-size: 30px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 2rem;
}
@media screen and (max-width: 1024px) {
    .profile-block-title {
        font-size: 24px;
        margin-bottom: 1rem;
    }
}
.profile-form-wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 28px 10px;
    margin-bottom: 30px;
}
@media screen and (max-width: 1024px) {
    .profile-form-wrapper {
        gap: 1rem;
    }
}
.profile-form-item.profile-form-item-simple {
    margin-bottom: 28px;
}
@media screen and (max-width: 1024px) {
    .profile-form-item.profile-form-item-simple {
        margin-bottom: 1rem;
    }
}
.profile-form-item small {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.profile-form-item small a {
    text-decoration: underline;
    color: var(--color-font-dark-blue);
    font-weight: 700;
}

.profile-form-footer{
    display: flex;
}

.profile-form-footer .btn {
    --font-size: 18px;
    --padding-tb: 12px;
    --padding-lr: 50px;
    --border-radius: 12px;
}
@media screen and (max-width: 480px) {
    .profile-form-footer .btn {
        width: 100%;
        --padding-lr: 12px;
    }
}
.profile-form-description {
    display: grid;
    grid-template-columns: 24px 1fr;
    align-items: flex-start;
    gap: 1.5rem;
    background-color: #DDE9F5;
    border-radius: 8px;
    padding: 1.5rem;
}
.profile-form-description-icon {
    --ui-icon-width: 25px;
}
.profile-form-description-content {
    display: flex;
    flex-direction: column;
}
.profile-form-description-title {
    font-size: 17px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 10px;
}
.profile-form-description-manager {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
    font-size: 15px;
    font-weight: 400;
    color: var(--color-font-dark-blue);
}
.profile-form-description-manager-phone {
    font-weight: 700;
}

.profile-form-description-address{
    margin-top: 3px;
    color: #595c6c;
    font-size: 14px;
}

.profile-waiting-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(225px, 1fr));
    gap: 15px;
}
@media screen and (max-width: 1024px) {
    .profile-waiting-list {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    }
}
.profile-feedback-success {
    padding-top: 2rem;
}
.profile-feedback-success-container {
    border-radius: 8px;
    background-color: #DDE9F5;
    position: relative;
    padding: 25px 50px;
    padding-left: 150px;
}
@media screen and (max-width: 480px) {
    .profile-feedback-success-container {
        padding: 1rem;
        padding-left: 115px;
    }
}
.profile-feedback-success-image {
    position: absolute;
    top: -2rem;
    left: 2rem;
    max-width: 132px;
}
@media screen and (max-width: 480px) {
    .profile-feedback-success-image {
        top: 0rem;
        left: 1rem;
        max-width: 95px;
    }
}
.profile-feedback-success-image img {
    display: block;
    width: 100%;
}
.profile-feedback-success-text {
    font-size: 15px;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    max-width: 550px;
}
.profile-wishlist-wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(225px, 1fr));
    gap: 15px;
}
@media screen and (max-width: 1024px) {
    .profile-wishlist-wrapper {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    }
}
.profile-orders-wrapper {
    display: grid;
    grid-template-columns: 1fr;
    gap: 15px;
    margin-bottom: 55px;
}
@media screen and (max-width: 1024px) {
    .profile-orders-wrapper {
        margin-bottom: 40px;
    }
}
.profile-orders-item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    border: 3px solid #F5F7FC;
    padding: 20px 30px;
    padding-right: 115px;
    cursor: pointer;
}
@media screen and (max-width: 768px) {
    .profile-orders-item {
        padding: 1rem 20px;
        padding-right: 70px;
    }
}
.profile-orders-item:hover {
    border-color: #2862AF;
}
.profile-orders-item:hover .btn {
    --background-color: #2862AF;
    --border-color: #2862AF;
    --color: #fff;
}
.profile-orders-item-wrapper {
    display: grid;
    grid-template-columns: 250px 1fr;
    gap: 2rem;
}
@media screen and (max-width: 768px) {
    .profile-orders-item-wrapper {
        grid-template-columns: 1fr;
    }
}
.profile-orders-item-wrapper-right {
    display: flex;
    align-items: center;
    gap: 1rem;
}
@media screen and (max-width: 768px) {
    .profile-orders-item-wrapper-right {
        display: none;
    }
}
.profile-orders-item-content {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.profile-orders-item-content-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: flex-end;
}
.profile-orders-item-content-row:last-child {
    align-items: center;
}
.profile-orders-item-title {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.profile-orders-item-date {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.profile-orders-item-status {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    max-width: -moz-max-content;
    max-width: max-content;
    max-height: -moz-max-content;
    max-height: max-content;
    padding: 4px 8px;
    border-radius: 8px;
    background-color: var(--background-color);
    color: var(--color);
    letter-spacing: 0.3;
}
.profile-orders-item-status.status-waiting {
    --background-color: #FF5151;
    --color: #fff;
}
.profile-orders-item-status.status-done {
    --background-color: #6DB786;
    --color: #fff;
}
.profile-orders-item-status.status-cancelled {
    --background-color: #FFEFEF;
    --color: #D43B3B;
}
.profile-orders-item-price {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.profile-orders-item-count {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.profile-orders-item-images {
    display: flex;
    align-items: center;
    gap: 10px;
}
.profile-orders-item-images-elem {
    height: 67px;
    width: 67px;
    aspect-ratio: 1;
    width: 100%;
}
.profile-orders-item-images-elem img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.profile-orders-item-info {
    display: flex;
    flex-direction: column;
}
.profile-orders-item-info span {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.profile-orders-item-btn {
    position: absolute;
    top: 50%;
    right: 30px;
    transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
    .profile-orders-item-btn {
        right: 20px;
    }
}
.profile-orders-item-btn .btn {
    --border-radius: 10px;
    --background-color: #fff;
    --border-color: #000;
    --color: #000;
    --padding-tb: 8px;
    --padding-lr: 8px;
}
.profile-orders-item-btn .btn .icon {
    --ui-icon-width: 22px;
}
@media screen and (max-width: 768px) {
    .profile-orders-item-btn .btn .icon {
        --ui-icon-width: 16px;
    }
}

.order-detail {
    border-radius: 12px;
    overflow: hidden;
    border: 3px solid #F5F7FC;
    padding: 24px 30px;
}
@media screen and (max-width: 1024px) {
    .order-detail {
        padding: 16px 20px;
    }
}
.order-detail-header {
    margin-bottom: 28px;
}
.order-detail-header-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
}
@media screen and (max-width: 768px) {
    .order-detail-header-wrapper {
        grid-template-columns: 1fr 170px;
    }
}
@media screen and (max-width: 480px) {
    .order-detail-header-wrapper {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}
.order-detail-content {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.order-detail-content-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: flex-end;
}
.order-detail-title {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.order-detail-date {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.order-detail-status {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    max-width: -moz-max-content;
    max-width: max-content;
    max-height: -moz-max-content;
    max-height: max-content;
    padding: 4px 8px;
    border-radius: 8px;
    background-color: var(--background-color);
    color: var(--color);
    letter-spacing: 0.3;
}
.order-detail-status.status-waiting {
    --background-color: #FF5151;
    --color: #fff;
}
.order-detail-status.status-done {
    --background-color: #6DB786;
    --color: #fff;
}
.order-detail-status.status-cancelled {
    --background-color: #FFEFEF;
    --color: #D43B3B;
}
.order-detail-price {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.order-detail-count {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.order-detail-delivery {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}
.order-detail-controls {
    display: flex;
    align-items: center;
    gap: 30px;
    justify-content: flex-end;
}
@media screen and (max-width: 768px) {
    .order-detail-controls {
        flex-direction: column-reverse;
        gap: 1rem;
    }
}
.order-detail-controls-item.order-btn-cancel .btn.-link {
    text-decoration: underline;
    --font-size: 14px;
    --color: var(--color-font-grey);
}
.order-detail-controls-item.order-btn-repeat .btn {
    --font-size: 18px;
    --border-radius: 12px;
    --padding-tb: 12px;
    --padding-lr: 32px;
}
@media screen and (max-width: 1300px) {
    .order-detail-controls-item.order-btn-repeat .btn {
        --font-size: 14px;
        --padding-tb: 10px;
        --padding-lr: 20px;
    }
}
.order-detail-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 15px;
}
.order-detail-element {
    border-radius: 12px;
    overflow: hidden;
    border: 3px solid #F5F7FC;
    padding: 10px 40px 10px 20px;
    display: grid;
    grid-template-columns: 1fr 200px;
    gap: 1rem;
}
@media screen and (max-width: 1300px) {
    .order-detail-element {
        grid-template-columns: 1fr 170px;
    }
}
@media screen and (max-width: 1024px) {
    .order-detail-element {
        padding: 10px 20px;
    }
}
@media screen and (max-width: 768px) {
    .order-detail-element {
        grid-template-columns: 1fr;
    }
}
.order-detail-element-left {
    display: grid;
    grid-template-columns: 90px 1fr;
    gap: 1rem;
}
@media screen and (max-width: 1024px) {
    .order-detail-element-left {
        grid-template-columns: 70px 1fr;
    }
}
.order-detail-element-right {
    display: flex;
    align-items: center;
    gap: 18px;
    justify-content: flex-end;
}
.order-detail-element-content {
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: center;
}

.order-detail-element-image{
    width: 100%;
    aspect-ratio: 1;
}

.order-detail-element-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.order-detail-element-title {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.order-detail-element-article {
    font-size: 12px;
    font-weight: 500;
    color: var(--color-font-grey);
}
.order-detail-element-price {
    display: flex;
    gap: 10px;
}
.order-detail-element-price-current {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
.order-detail-element-price-old {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
    text-decoration: line-through;
}
.order-detail-element-count {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-black);
    max-width: -moz-max-content;
    max-width: max-content;
    max-height: -moz-max-content;
    max-height: max-content;
    padding: 10px 20px;
    background-color: #F2F4F7;
    border-radius: 14px;
}
.order-detail-element-total {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}

.order-detail-element-details{
    display: flex;
    gap: 10px;
    font-size: 12px;
}

.overlay {
    background: #000;
    cursor: pointer;
    display: block;
    height: 100%;
    left: 0;
    opacity: 0.6;
    position: fixed;
    top: 0;
    width: 100%;
    transition: all 200ms linear;
    z-index: 100;
    visibility: hidden;
    opacity: 0;
}
.overlay.show {
    visibility: visible;
    opacity: 0.6;
}

.ui-menu {
    background-color: #fff;
    height: 100%;
    left: 0;
    max-width: 350px;
    overflow-y: auto;
    padding: 0rem;
    position: fixed;
    top: 0;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    display: block;
    transform: translateX(-100%);
    transition: all 0.1s linear;
    z-index: 200;
}
@media screen and (max-width: 480px) {
    .ui-menu {
        max-width: 100%;
    }
}
.ui-menu.opened {
    opacity: 1;
    visibility: visible;
    transform: none;
}
.ui-menu-container {
    padding: 20px 30px;
}
.ui-menu-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid rgba(35, 60, 112, 0.1019607843);
}
.ui-menu-logo {
    max-width: 143px;
}
.ui-menu-logo img {
    display: block;
    width: 100%;
}
.ui-menu-close {
    --ui-icon-width: 24px;
    --stroke-width: 1px;
    cursor: pointer;
}
.ui-menu-location {
    margin-bottom: 20px;
}
.ui-menu-category {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid rgba(35, 60, 112, 0.1019607843);
}
.ui-menu-category-link {
    display: block;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue) !important;
    max-width: -moz-max-content;
    max-width: max-content;
    position: relative;
}
.ui-menu-category-link[data-badge]::after {
    content: attr(data-badge);
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
    background-color: #76C7D5;
    font-size: 9px;
    font-weight: 700;
    padding: 5px;
    color: #fff;
    border-radius: 50%;
    position: absolute;
    right: -50%;
    top: 50%;
    transform: translate(50%, -50%);
}
.ui-menu-nav {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid rgba(35, 60, 112, 0.1019607843);
}
.ui-menu-nav-link {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.1;
}
.ui-menu-footer-text {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
    margin-bottom: 20px;
}
.contacts-wrapper {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}
.contacts-item {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    border: 1px solid #ddd;
    border-radius: 10px;
    overflow: hidden;
    padding: 2rem;
}
@media screen and (max-width: 1024px) {
    .contacts-item {
        grid-template-columns: 300px 1fr;
    }
}
@media screen and (max-width: 768px) {
    .contacts-item {
        grid-template-columns: 1fr;
        padding: 20px 1rem;
    }
}
.contacts-item-title {
    font-size: 24px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 2rem;
}
@media screen and (max-width: 768px) {
    .contacts-item-title {
        font-size: 20px;
        margin-bottom: 1rem;
    }
}
.contacts-item-props {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.contacts-item-props:not(:last-child) {
    margin-bottom: 1rem;
}
.contacts-item-props-name {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-grey);
}
@media screen and (max-width: 768px) {
    .contacts-item-props-name {
        font-size: 14px;
    }
}
.contacts-item-props-value {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
}
@media screen and (max-width: 768px) {
    .contacts-item-props-value {
        font-size: 16px;
    }
}
.contacts-item-map {
    width: 100%;
    height: 300px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #ddd;
    background: rgba(255, 255, 255, 0.38824);
    box-shadow: 0px 8px 25px rgba(10, 14, 31, 0.15);
    background: #F3F6F9 url("/local/templates/estelifecentre/img/preloader.svg") no-repeat center;
    background-size: 3rem;
}

.swiper-container{
    height: max-content;
}

.delivery-item{
    padding-top: 2rem;
    margin-bottom: 2rem;
    border-top: 1px solid #ddd;
    display: grid;
    grid-template-columns: 40% 1fr;
    gap: 1rem;
}

.delivery-item:last-child{
    margin-bottom: 0;
}

.delivery-item-content{
    color: #828282;
}

.delivery-item-content p:last-child{
    margin-bottom: 0;
}

.delivery-item-content ul{
    padding-left: 20px;
}

.delivery-item-content ul li {
    list-style-type: disc;
    line-height: 1.3;
}

.delivery-item-content ul li:not(:last-child){
    margin-bottom: 10px;
}

@media screen and (max-width: 768px) {
    .delivery-item{
        padding-top: 1rem;
        margin-bottom: 1rem;
        grid-template-columns: 1fr;
        gap: 0rem;
    }
}

.auth-form-container{
    max-width: 500px;
    margin: 100px auto;
}

.plug{
    position: relative;
}
.plug-overlay{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.plug-overlay::before {
    content: "";
    background-image: url(/local/templates/estelifecentre/img/logo-image-grey.png);
    background-repeat: no-repeat;
    background-size: 100%;
    display: block;
    width: 930px;
    height: 980px;
    position: absolute;
    top: -148px;
    right: 100px;
    z-index: -1;
}

.plug-inner{
    position: relative;
    z-index: 10;
}

.news-detail .news-date-time{
    display: inline-block;
    padding: 5px 10px;
    line-height: 1;
    border: 1px solid #000;
    border-radius: 5px;
    font-size: 14px;
    color: #000;
    margin-bottom: 1rem;
}

.news-detail .news-detail-wrapper{
    display: inline-block;
}

.news-detail .news-detail-content{
    font-size: 18px;
    line-height: 1.2;
}

.news-detail .news-detail-content p {
    line-height: 1.2;
}

.news-detail .news-detail-content ul{
    margin-top: 1rem;
    margin-bottom: 1rem;
    padding-left: 22px;
}

.news-detail .news-detail-content ul li{
    list-style-type: disc;

}

.news-detail .news-detail-image{
    float: right;
    margin: 0 0 1rem 1rem;
    display: flex;
    max-width: 500px;
    border-radius: 10px;
    overflow: hidden;
}

.news-detail .news-detail-image img {
    display: block;
    width: 100%;
    height: 100%;
    max-height: 100%;
}
.feedback-popup .popup-content{
    background-color: #F2F4F7;
}

.feedback-popup .title{
    font-size: 30px;
    font-weight: 500;
    line-height: 1.1;
    color: var(--color-font-dark-blue);
    margin-bottom: 2rem;
}

.feedback-popup .text{

}

.feedback-popup .form-row{
    margin-bottom: 1rem;
}

.feedback-popup .form-row .checkbox {
    font-size: 14px;
    line-height: 1.1;
}
.feedback-popup .form-row .checkbox:not(:last-child) {
    margin-bottom: 1rem;
}


@media screen and (max-width: 480px) {
    .popup-content {
        padding: 2rem;
    }
}


.text-block,
.text-block *,
.text-block p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.2;
    color: var(--color-font-dark-blue);
}
.text-block p:last-child {
    margin-bottom: 0;
}
.text-block ol,
.text-block ul{
    padding-left: 20px;
    margin-bottom: 1rem;
}

.text-block .h3,
.text-block h3{
    font-size: 20px;
    line-height: 1.2;
    margin-bottom: 1rem;
    font-weight: 500;
}


.text-block ul li{
    list-style: disc;
}
.text-block ol li,
.text-block ul li{
    margin-bottom: 10px;
}







.card-product-content-available {
    font-size: 14px;
    font-weight: 400;
    color: var(--color-font-dark-blue);
    line-height: 1.1;
    margin-bottom: 10px;
}
.card-product-content-available span {
    display: flex;
    align-items: center;
    gap: 7px;
    --icon-color: #5CCF84;
}
.card-product-content-available span:before {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--icon-color);
    position: relative;
    top: -1px;
}
.card-product-content-available.not-available span{
    --icon-color: #F8348E;
}

/* End */
/* /local/templates/estelifecentre/js/components/drop.css?17483301422544 */
/* /local/templates/estelifecentre/template_styles.css?1755182205186221 */