@font-face {
    font-family: Poppins;
    font-display: swap;
    src: url(../fonts/Poppins-SemiBold.woff2) format("woff2");
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: Poppins;
    font-display: swap;
    src: url(../fonts/Poppins-Medium.woff2) format("woff2");
    font-weight: 500;
    font-style: normal
}

@font-face {
    font-family: Poppins;
    font-display: swap;
    src: url(../fonts/Poppins-Regular.woff2) format("woff2");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: Poppins;
    font-display: swap;
    src: url(../fonts/Poppins-Light.woff2) format("woff2");
    font-weight: 300;
    font-style: normal
}

:root {
    --font-family: Poppins,sans-serif;
    --primary: #e44c4f;
    --secondary: #292929;
    --white: #fff;
    --inverse: #4f4f4f;
    --light-color: #f5f5f5;
    --border-color: #d9d9d9;
    --border-button: #5a5a5a;
    --primary-hover: #ad3a3a;
    --secondary-hover: #595959
}

* {
    padding: 0;
    margin: 0;
    border: 0
}

*,*::after,*::before {
    box-sizing: border-box
}

*::after,*::before {
    display: inline-block
}

body,html {
    height: 100%;
    min-width: 320px
}

body {
    color: var(--secondary);
    line-height: 1;
    font-family: var(--font-family) !important;
    font-size: 1rem;
    -ms-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

button,input,textarea {
    font-family: var(--font-family) !important;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    background-color: rgba(0,0,0,0)
}

input,textarea {
    width: 100%
}

input[type=email],input[type=tel],input[type=text],textarea {
    -webkit-appearance: none;
    appearance: none
}

label {
    display: inline-block
}

button,option,select {
    cursor: pointer
}

a {
    display: inline-block;
    color: inherit;
    text-decoration: none
}

ul li {
    list-style: none
}

img {
    vertical-align: top
}

h1,h2,h3,h4,h5,h6 {
    font-weight: inherit;
    font-size: inherit
}

.lock body {
    overflow: hidden;
    touch-action: none;
    -ms-scroll-chaining: none;
    overscroll-behavior: none
}

.wrapper {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden
}

@supports(overflow: clip) {
    .wrapper {
        overflow:clip
    }
}

.wrapper>main {
    flex: 1 1 auto
}

.wrapper>* {
    min-width: 0
}

[class*=__container] {
    max-width: 81.5625rem;
    margin: 0 auto;
    padding: 0 .625rem
}

[class*="--gc"] {
    display: grid;
    min-width: 0;
    grid-template-columns: .625rem 1fr minmax(auto,80.3125rem) 1fr .625rem
}

[class*="--gc"]>* {
    min-width: 0;
    grid-column: 3/4
}

.button,.button-white {
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
    min-width: 15.625rem;
    min-height: 3.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    border-radius: 3.125rem;
    font-weight: 500;
    font-size: 1rem;
    text-transform: capitalize;
    text-align: center;
    color: var(--white);
    padding: 1.125rem 1.5rem;
    background-color: var(--primary);
    transition: background .3s,color .3s,border .3s
}

.button-white {
    background-color: var(--white);
    color: var(--inverse);
    border: 2px solid var(--border-button)
}

.title {
    font-weight: 500;
    line-height: 150%
}

body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    z-index: 30;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(15px);
    background: rgba(41,41,41,.3);
    transition: opacity .3s;
    opacity: 0;
    pointer-events: none
}

.menu-open body::before {
    opacity: 1
}

.menu__inner {
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
    margin-left: auto
}

.menu__list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .625rem 1.875rem
}

.menu__link {
    transition: color .3s
}

.menu__actions {
    display: none
}

.menu__address {
    text-align: center;
    line-height: 130%
}

.icon-menu {
    display: none
}

body::after {
    content: "";
    backdrop-filter: blur(15px);
    background: rgba(41,41,41,.3);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity .8s ease 0;
    pointer-events: none;
    z-index: 149
}

.popup-show body::after {
    opacity: 1
}

.popup {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    padding: 1.875rem .625rem;
    transition: visibility .8s ease 0;
    visibility: hidden;
    pointer-events: none
}

.popup_show {
    z-index: 150;
    visibility: visible;
    overflow: auto;
    pointer-events: auto
}

.popup_show .popup__content {
    visibility: visible;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.popup__wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 100%;
    flex: 1 1 auto;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center
}

.popup__content {
    visibility: hidden;
    -webkit-transform: scale(0);
    transform: scale(0);
    transition: -webkit-transform .3s ease 0;
    transition: transform .3s ease 0;
    transition: transform .3s ease 0,-webkit-transform .3s ease 0;
    background-color: var(--light-color);
    padding: 1.75rem 3rem 3rem 3rem;
    width: 100%;
    max-width: 56.25rem;
    border-radius: 1.25rem
}

.lock .popup__content {
    visibility: visible
}

#form-message .popup__content {
    max-width: 30.375rem
}

.popup__close {
    margin-left: auto;
    margin-right: -1.25rem;
    width: 1.625rem;
    height: 1.625rem;
    display: grid;
    place-content: center;
    margin-bottom: 1rem;
    transition: color .3s
}

.popup__body {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 1.875rem
}

.popup__title {
    text-align: center
}

.popup__img {
    max-width: 12.5rem;
    max-height: 12.5rem;
    overflow: hidden;
    border-radius: 50%
}

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

.popup__text {
    text-align: center;
    font-size: 1.5rem;
    line-height: 150%
}

.spollers {
    width: 100%;
    display: grid;
    align-content: start;
    gap: 1.5rem
}

.spollers__title {
    width: 100%;
    cursor: default;
    text-align: left;
    border-radius: 1.25rem;
    padding: 1.875rem;
    background-color: var(--light-color);
    font-weight: 500;
    font-size: 1.125rem;
    line-height: 150%;
    position: relative;
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .625rem;
    transition: background .3s
}

.spollers__title::-webkit-details-marker,.spollers__title::marker {
    display: none
}

.spollers__title::after {
    content: "";
    flex-shrink: 0;
    width: 2.5rem;
    height: 1.875rem;
    background-image: url(../img/icons/arrow-spoller.svg);
    background-size: 2.5rem 1.875rem;
    background-repeat: no-repeat;
    background-position: center;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s,-webkit-transform .3s
}

.spollers__title._spoller-active::after {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.spollers__body {
    display: grid;
    align-content: start;
    gap: .75rem;
    padding: 1.25rem;
    font-weight: 300;
    font-size: 1rem;
    line-height: 150%
}

.spollers__body ul {
    padding-left: 1.5625rem
}

.spollers__body ul li {
    list-style: disc
}

.spollers__body ol {
    padding-left: 1.5625rem
}

.spollers__body ol li {
    list-style: decimal
}

.header {
    position: fixed;
    top: 1.5625rem;
    left: 0;
    z-index: 100;
    width: 100%
}

.header__body {
    box-shadow: 0 0 30px 0 rgba(79,79,79,.05);
    border-radius: 3.125rem;
    padding: .625rem .625rem .625rem 2.25rem;
    display: flex;
    align-items: center;
    gap: 1.875rem;
    position: relative
}

.header__body::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(10px);
    background: rgba(255,255,255,.8);
    border: 1px solid rgba(217,217,217,.2);
    border-radius: 3.125rem;
    pointer-events: none
}

.header__logo {
    max-width: 5rem;
    position: relative
}

.header__logo img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.header__menu {
    position: relative
}

.header__btn {
    position: relative
}

.footer {
    background-color: var(--secondary);
    color: var(--light-color)
}

.footer__body {
    padding: 3rem 0 1.5rem 0;
    display: flex;
    justify-content: space-between;
    gap: 1.875rem
}

.footer__logo {
    max-width: 12.1875rem
}

.footer__logo img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.footer__content {
    max-width: 51.5rem;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1.875rem
}

.footer__column {
    max-width: 23.125rem;
    width: 100%
}

.footer__title {
    color: var(--inverse);
    font-weight: 500;
    font-size: 1.5rem;
    line-height: 150%;
    margin-bottom: .875rem
}

.footer__links {
    display: flex;
    flex-direction: column;
    gap: .625rem
}

.footer__link {
    font-size: 1.25rem;
    line-height: 150%;
    transition: color .3s
}

.footer__bottom {
    padding: 1.5rem 0;
    border-top: 1px solid rgba(245,245,245,.25)
}

.footer__copy {
    font-weight: 300;
    font-size: 1rem;
    line-height: 150%;
    text-align: center;
    color: var(--inverse)
}

.hero {
    position: relative;
    z-index: 3;
    padding: 12.8125rem 0 7.75rem 0;
    min-height: 100svh;
    color: var(--white);
    background-image: url(../img/hero-bg.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 6.25rem
}

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

.hero__container {
    display: flex;
    flex-direction: column
}

.hero__conditions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1.875rem
}

.hero__conditions:not(:last-child) {
    margin-bottom: 3rem
}

.hero__item {
    border-radius: 3.125rem;
    padding: .625rem .9375rem .625rem .625rem;
    backdrop-filter: blur(8px);
    background: rgba(79,79,79,.3);
    display: flex;
    align-items: center;
    gap: .75rem;
    color: var(--light-color);
    font-size: 1.25rem;
    line-height: 150%
}

.hero__item-info {
    border-radius: 3.125rem;
    padding: .6875rem .8125rem;
    background-color: var(--light-color);
    color: var(--inverse);
    font-weight: 600;
    font-size: 1.5rem
}

.hero__title {
    font-weight: 500;
    line-height: 150%;
    text-align: center;
    text-shadow: 0 0 20px 0 rgba(41,41,41,.2)
}

.hero__title:not(:last-child) {
    margin-bottom: 4.1875rem
}

.hero__bottom {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1.875rem
}

.hero__review {
    max-width: 25rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: .625rem;
    line-height: 150%
}

.hero__review-head {
    display: flex;
    align-items: center;
    gap: 1.25rem
}

.hero__review-head img {
    display: block;
    max-width: 5rem;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.hero__review-rating {
    display: flex;
    align-items: center;
    gap: .3125rem
}

.hero__review-rating ul {
    display: flex;
    align-items: center;
    gap: .125rem
}

.hero__review-rating img {
    max-width: 1.25rem
}

.hero__review-user {
    display: flex;
    align-items: center;
    gap: .625rem
}

.hero__review-user img {
    border-radius: 50%;
    max-width: 3.625rem;
    max-height: 3.625rem;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.hero__review-body {
    display: flex;
    flex-direction: column;
    gap: .25rem
}

.hero__review-name {
    font-size: 1rem
}

.hero__review-date {
    font-weight: 300;
    font-size: .8125rem;
    color: var(--light-color)
}

.hero__btns {
    margin-top: auto;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1.875rem
}

.about {
    margin-bottom: 6.25rem
}

.about__body {
    display: grid;
    align-items: center;
    grid-template-columns: auto 1fr;
    grid-template-rows: repeat(3,auto);
    gap: 1.5rem 3rem
}

.about__img {
    align-self: stretch;
    max-width: 25.75rem;
    width: 100%;
    grid-row: 1/-1;
    display: grid;
    align-content: start
}

.about__img img {
    border-radius: 1.25rem;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.about__text {
    font-size: 1.125rem;
    line-height: 150%;
    display: grid;
    align-content: start;
    gap: .875rem
}

.features {
    margin-bottom: 6.25rem
}

.features__body {
    border-radius: 1.25rem;
    padding: 3rem 1.25rem;
    background-color: var(--light-color)
}

.features__title {
    text-align: center;
    margin-bottom: 3rem
}

.features__items {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 3rem
}

.features__item {
    max-width: 20.5rem;
    min-width: 18.5rem;
    display: flex;
    align-items: center;
    gap: .625rem;
    padding: .625rem .9375rem .625rem .625rem;
    border-radius: 3.125rem;
    background-color: var(--white);
    box-shadow: 0 0 30px 0 rgba(79,79,79,.05)
}

.features__item-icon {
    max-width: 3.625rem;
    min-width: 3.625rem;
    border-radius: 50%;
    background-color: var(--secondary);
    padding: .9375rem;
    display: flex;
    align-items: center;
    justify-content: center
}

.features__item-icon img {
    max-height: 1.75rem;
    width: auto;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.features__item-text {
    font-size: 1.125rem;
    line-height: 150%
}

.info {
    margin-bottom: 6.25rem
}

.info__body {
    display: grid;
    grid-template-areas: "image title" "image review";
    grid-template-rows: auto 1fr;
    gap: 1.5rem 3rem
}

.info__body:not(:last-child) {
    margin-bottom: 3rem
}

.info__img {
    grid-area: image;
    max-width: 25.75rem;
    width: 100%;
    overflow: hidden;
    border-radius: 1.25rem
}

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

.info__title {
    grid-area: title
}

.info__review {
    grid-area: review;
    border-radius: 1.25rem;
    padding: 1.875rem;
    background-color: var(--light-color);
    display: flex;
    flex-direction: column;
    gap: 1rem
}

.info__review-rating {
    display: flex;
    align-items: center;
    gap: .125rem
}

.info__review-rating img {
    max-width: 2.25rem;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.info__review-text {
    flex: 1 1 auto;
    font-size: 1.25rem;
    line-height: 150%
}

.info__review-author {
    text-align: right;
    display: flex;
    flex-direction: column;
    gap: .25rem
}

.info__review-name {
    font-weight: 500;
    font-size: 1.5rem
}

.info__review-descr {
    font-size: 1.125rem;
    color: var(--inverse)
}

.info__btn {
    margin: 0 auto
}

.info__btn:not(:last-child) {
    margin-bottom: 3rem
}

.info__items {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 3rem
}

.info__item {
    min-width: 13rem;
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: .375rem
}

.info__item-img img {
    max-height: 3.125rem;
    width: auto;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.info__item-name {
    font-weight: 500;
    font-size: 1.25rem;
    line-height: 150%;
    text-align: center;
    text-transform: capitalize
}

.info__item-rating {
    display: flex;
    align-items: center;
    gap: .3125rem;
    font-weight: 500;
    font-size: 1.25rem
}

.info__item-stars {
    display: flex;
    align-items: center;
    gap: .125rem
}

.info__item-stars img {
    display: block;
    max-width: 1.25rem;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.prices {
    margin-bottom: 6.25rem
}

.prices__title {
    text-align: center;
    margin-bottom: 3rem
}

.prices__body {
    display: flex;
    flex-wrap: wrap;
    gap: 1.875rem 3rem
}

.prices__item {
    flex: 1 1 auto;
    width: calc(50% - 3rem);
    min-width: 20rem
}

.price-card {
    border: 1px solid var(--border-color);
    box-shadow: 0 10px 30px 0 rgba(79,79,79,.03);
    background-color: var(--white);
    border-radius: 1.25rem;
    padding: 1.875rem;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: border .3s,box-shadow .3s
}

.price-card__head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: .875rem;
    min-height: 2.1875rem
}

.price-card__badge {
    flex-shrink: 0;
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
    border-radius: 3.125rem;
    padding: .375rem .875rem;
    background-color: var(--primary);
    display: grid;
    align-items: center;
    grid-template-columns: 1.25rem 1fr;
    gap: .375rem;
    min-height: 2.1875rem;
    color: var(--white);
    font-weight: 500;
    font-size: .9375rem;
    line-height: 150%;
    text-transform: capitalize
}

.price-card__badge img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.price-card__title {
    font-weight: 500;
    font-size: 1.5rem;
    line-height: 150%;
    margin-bottom: 1.5rem
}

.price-card__title::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.price-card__body {
    flex: 1 1 auto;
    margin-bottom: 1.5rem;
    color: var(--inverse);
    font-size: 1.125rem
}

.price-card__subtitle {
    line-height: 150%;
    margin-bottom: .75rem
}

.price-card__list {
    display: grid;
    align-content: start;
    gap: .75rem
}

.price-card__item {
    line-height: 150%;
    display: flex;
    align-items: center;
    gap: .625rem
}

.price-card__item::before {
    content: "";
    flex-shrink: 0;
    width: 1.4375rem;
    height: 1.4375rem;
    background-image: url(../img/icons/check.svg);
    background-position: center;
    background-size: 1.4375rem;
    background-repeat: no-repeat
}

.price-card__price {
    text-align: right;
    color: var(--inverse)
}

.consultation {
    margin-bottom: 6.25rem
}

.consultation__body {
    border-radius: 1.25rem;
    padding: 3rem;
    background-color: var(--light-color);
    display: grid;
    align-items: start;
    grid-template-columns: repeat(auto-fit,minmax(17.5rem,1fr));
    gap: 3rem
}

.consultation__info {
    padding: 0 2.125rem;
    display: grid;
    grid-template-areas: "image"
}

.consultation__img {
    grid-area: image;
    display: grid;
    border-radius: 1.25rem;
    overflow: hidden
}

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

.consultation__info-items {
    grid-area: image;
    position: relative;
    z-index: 3;
    padding: 6.875rem 0 3.125rem 0;
    margin: 0 -2.125rem;
    display: grid;
    align-content: end;
    gap: 1rem
}

.consultation__badge {
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
    margin-right: auto;
    box-shadow: 0 0 30px 0 rgba(79,79,79,.05);
    background-color: var(--white);
    border-radius: 3.125rem;
    padding: .625rem;
    display: flex;
    align-items: center;
    gap: .625rem;
    font-size: 1.125rem;
    line-height: 150%
}

.consultation__badge:nth-child(even) {
    margin-left: auto;
    margin-right: 0
}

.consultation__badge-info {
    padding: .6875rem .8125rem;
    font-weight: 600;
    font-size: 1.5rem;
    line-height: 150%;
    border-radius: 3.125rem;
    background-color: var(--secondary);
    color: var(--white)
}

.consultation__title {
    text-align: center;
    margin-bottom: 1.5rem
}

.form {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem
}

.form__block {
    flex: 1 1 auto;
    width: calc(50% - 1.5rem);
    min-width: 13.75rem
}

.form__label {
    font-size: 1rem;
    line-height: 150%;
    margin-bottom: .0625rem
}

.form__label span {
    color: #dc3232
}

.form__input {
    border: 2px solid var(--border-color);
    border-radius: .875rem;
    padding: .75rem;
    height: 3.75rem;
    background-color: var(--white)
}

.form__input._form-error {
    border-color: var(--primary)
}

.form__bottom {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: .625rem
}

.form__error {
    margin-top: .1875rem;
    font-size: 1rem;
    line-height: 150%;
    color: var(--primary)
}

.reviews {
    margin-bottom: 6.25rem
}

.reviews__title {
    text-align: center;
    margin-bottom: 3rem
}

.reviews__text {
    text-align: center;
    font-size: 1.125rem;
    line-height: 150%;
    margin-bottom: 1.5rem
}

.faq {
    margin-bottom: 6.25rem
}

.faq__body {
    display: flex;
    gap: 3rem
}

.faq__title {
    max-width: 24.25rem
}

.contacts {
    margin-bottom: 6.25rem
}

.contacts__body {
    display: grid;
    align-items: start;
    grid-template-columns: repeat(auto-fit,minmax(17.5rem,1fr));
    gap: 3rem
}

.contacts__map {
    border: 1px solid transparent;
    border-radius: 1.25rem;
    overflow: hidden;
    transition: border .3s
}

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

.contacts__content {
    border-radius: 1.25rem;
    padding: 3rem;
    background-color: var(--light-color)
}

.contacts__title {
    text-align: center;
    margin-bottom: 1.5rem
}

@media(min-width: 47.99875em) {
    .header__menu {
        flex:1 1 auto
    }
}

@media(min-width: 81.5625em) {
    .title {
        font-size:2.5rem
    }

    .hero__title {
        font-size: 4rem
    }
}

@media(max-width: 61.9988em) {
    .menu__list {
        gap:.625rem 1.25rem
    }

    .header {
        top: .625rem
    }

    .header__body {
        padding: .875rem 1.25rem;
        gap: 0.25rem;
    }

    .header__btn {
        min-width: 0;
        min-height: 2.5rem;
        padding: .5rem 1.5rem
    }

    .footer__column {
        max-width: -webkit-fit-content;
        max-width: -moz-fit-content;
        max-width: fit-content
    }

    .about__body {
        gap: 1.875rem
    }

    .features__items {
        gap: 1.25rem
    }

    .info__body {
        gap: 1.25rem
    }

    .prices__body {
        gap: 1.25rem
    }

    .consultation__body {
        padding: 1.875rem 1.25rem;
        gap: 1.875rem
    }

    .consultation__info {
        padding: 0
    }

    .consultation__info-items {
        gap: .625rem;
        padding: 10.625rem .625rem .625rem .625rem;
        margin: 0
    }

    .consultation__badge:nth-child(even) {
        margin-left: 0;
        margin-right: auto
    }

    .faq__body {
        gap: 1.875rem
    }

    .contacts__body {
        gap: 1.875rem
    }

    .contacts__content {
        padding: 1.875rem 1.25rem
    }
}

@media(max-width: 47.99875em) {
    .menu__body {
        isolation:isolate;
        position: fixed;
        width: 100%;
        height: 100%;
        min-height: 100svh;
        left: -100%;
        top: 0;
        z-index: -1;
        overflow: auto;
        padding: 6.25rem .625rem 3.125rem .625rem;
        transition: left .3s
    }

    .menu-open .menu__body {
        left: 0
    }

    .menu-open .menu__body::before {
        left: 0
    }

    .menu__inner {
        margin-left: 0;
        max-width: 100%;
        backdrop-filter: blur(10px);
        box-shadow: 0 0 30px 0 rgba(79,79,79,.05);
        background: rgba(255,255,255,.8);
        border: 1px solid rgba(217,217,217,.2);
        border-radius: 1.25rem;
        padding: 1.875rem
    }

    .menu__list {
        flex-direction: column;
        gap: 1.25rem
    }

    .menu__list:not(:last-child) {
        margin-bottom: 3rem
    }

    .menu__actions {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1.25rem
    }

    .icon-menu {
        display: block;
        position: relative;
        width: 1.625rem;
        height: 1.625rem
    }

    .icon-menu span,.icon-menu::after,.icon-menu::before {
        content: "";
        transition: all .3s ease 0;
        right: 0;
        position: absolute;
        width: 100%;
        height: .125rem;
        border-radius: .125rem;
        background-color: var(--secondary)
    }

    .icon-menu::before {
        top: .3125rem
    }

    .icon-menu::after {
        bottom: .3125rem
    }

    .icon-menu span {
        top: calc(50% - .0625rem)
    }

    .menu-open .icon-menu span {
        width: 0
    }

    .menu-open .icon-menu::before {
        top: calc(50% - .0625rem);
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }

    .menu-open .icon-menu::after {
        bottom: calc(50% - .0625rem);
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg)
    }

    .popup__text {
        font-size: 1.125rem
    }

    .spollers__title {
        padding: 1.25rem
    }

    .spollers__body {
        padding: .625rem 1.25rem
    }

    .header__logo {
        margin-right: auto
    }

    .header__menu {
        order: 1
    }

    .footer__body {
        flex-direction: column;
        align-items: center;
        justify-content: stretch;
        padding: 3.125rem 0 1.875rem 0
    }

    .footer__content {
        flex-direction: column;
        justify-content: stretch
    }

    .footer__column {
        max-width: none
    }

    .footer__title {
        text-align: center
    }

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

    .footer__bottom {
        padding: 1.875rem 0
    }

    .hero {
        padding: 8rem 0 4.625rem 0;
        margin-bottom: 4.375rem
    }

    .hero__conditions:not(:last-child) {
        margin-bottom: 1.875rem
    }

    .hero__title {
        text-align: left;
        order: -1
    }

    .hero__title:not(:last-child) {
        margin-bottom: 1.875rem
    }

    .hero__btns {
        width: 100%;
        justify-content: center
    }

    .about {
        margin-bottom: 4.375rem
    }

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

    .features {
        margin-bottom: 4.375rem
    }

    .features__title {
        margin-bottom: 1.875rem
    }

    .features__item {
        width: 100%
    }

    .info {
        margin-bottom: 4.375rem
    }

    .info__body {
        grid-template-areas: none;
        grid-template-rows: auto;
        gap: 1.875rem
    }

    .info__body:not(:last-child) {
        margin-bottom: 1.875rem
    }

    .info__img {
        max-width: none;
        order: 1;
        grid-area: auto
    }

    .info__title {
        text-align: center;
        order: -1;
        grid-area: auto
    }

    .info__review {
        grid-area: auto
    }

    .info__btn:not(:last-child) {
        margin-bottom: 4.375rem
    }

    .prices {
        margin-bottom: 4.375rem
    }

    .prices__title {
        margin-bottom: 1.875rem
    }

    .price-card {
        padding: 1.875rem 1.25rem
    }

    .price-card__title {
        font-size: 1.25rem;
        margin-bottom: 1rem
    }

    .price-card__body {
        font-size: 1rem;
        margin-bottom: 1rem
    }

    .consultation {
        margin-bottom: 4.375rem
    }

    .consultation__badge-info {
        font-size: 1.25rem
    }

    .consultation__title {
        margin-bottom: 1.875rem
    }

    .reviews {
        margin-bottom: 4.375rem
    }

    .reviews__title {
        margin-bottom: 1.875rem
    }

    .reviews__text {
        margin-bottom: 1.875rem
    }

    .faq {
        margin-bottom: 4.375rem
    }

    .faq__body {
        flex-direction: column
    }

    .faq__title {
        max-width: none;
        text-align: center
    }

    .contacts {
        margin-bottom: 4.375rem
    }

    .contacts__title {
        margin-bottom: 1.875rem
    }
}

@media(max-width: 47.99875em)and (any-hover:none) {
    .icon-menu {
        cursor:default
    }
}

@media(max-width: 40.62375em) {
    .hero__conditions {
        gap:.625rem;
        flex-direction: column;
        align-items: stretch;
        max-width: -webkit-fit-content;
        max-width: -moz-fit-content;
        max-width: fit-content;
        margin-left: auto
    }

    .hero__item {
        font-size: 1rem;
        padding: .75rem
    }

    .hero__item-info {
        font-size: 1.25rem
    }

    .hero__btns {
        gap: .625rem
    }

    .about__body {
        display: flex;
        flex-direction: column
    }

    .about__img {
        max-width: none;
        order: 2
    }

    .about__title {
        order: 0;
        text-align: center
    }

    .about__text {
        order: 1
    }

    .about__btn {
        order: 3;
        margin: 0 auto
    }

    .features__body {
        padding: 1.875rem 1.25rem
    }

    .features__items {
        flex-direction: column;
        align-items: stretch;
        gap: .625rem
    }

    .features__item {
        max-width: none;
        min-width: 0
    }

    .features__item-text br {
        display: none
    }

    .consultation__content {
        order: -1
    }

    .contacts__body {
        grid-template-columns: 1fr
    }

    .contacts__content {
        order: -1
    }
}

@media(max-width: 29.99875em) {
    .title {
        font-size:1.5rem
    }

    .popup__content {
        padding: 1.5rem 1.875rem 1.875rem 1.875rem
    }

    .popup__close {
        margin-right: -.375rem;
        margin-bottom: .625rem
    }

    .popup__img {
        max-width: 10.625rem;
        max-height: 10.625rem
    }

    .spollers__title {
        font-size: 1rem
    }

    .footer__title {
        font-size: 1.25rem;
        margin-bottom: .625rem
    }

    .footer__link {
        font-size: 1rem
    }

    .hero__title {
        font-size: 2rem
    }

    .features__item-text {
        font-size: 1rem
    }

    .info__img img {
        aspect-ratio: 355/300
    }

    .info__review {
        padding: 1.875rem 1.25rem
    }

    .info__review-text {
        font-size: 1rem
    }

    .info__review-name {
        font-size: 1.125rem
    }

    .info__review-descr {
        font-size: 1rem
    }

    .info__items {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 3rem 1.25rem
    }

    .info__item {
        min-width: 0
    }

    .prices__body {
        gap: .625rem
    }

    .prices__item {
        min-width: 18.125rem
    }

    .price-card__head {
        margin-bottom: .625rem;
        min-height: 0
    }

    .price-card__subtitle {
        margin-bottom: .625rem
    }

    .price-card__list {
        gap: .625rem
    }

    .price-card__item::before {
        background-size: 1.1875rem
    }

    .consultation__body {
        grid-template-columns: 1fr
    }

    .consultation__badge {
        font-size: 1rem
    }

    .form {
        gap: .625rem
    }

    .form__bottom {
        padding-top: 1.25rem
    }

    .reviews__text {
        font-size: 1rem
    }
}

@media(max-width: 22.49875em) {
    .header__body {
        padding:.875rem .625rem
    }

    .features__body {
        padding: 1.25rem .625rem
    }
}

@media(min-width: 29.99875em)and (max-width:81.5625em) {
    .title {
        font-size:clamp(1.5rem,.9182201644rem+1.9393469249vw,2.5rem)
    }

    .hero__title {
        font-size: clamp(2rem,.8364403287rem+3.8786938498vw,4rem)
    }
}

@media(any-hover: hover) {
    .button-white:hover,.button:hover {
        background-color:var(--primary-hover)
    }

    .button-white:hover {
        background-color: var(--secondary-hover);
        border-color: var(--secondary-hover);
        color: var(--white)
    }

    .menu__link:hover {
        color: var(--primary)
    }

    .popup__close:hover {
        color: var(--primary)
    }

    .spollers__title:hover {
        background-color: var(--border-color)
    }

    .footer__link:hover {
        color: var(--primary)
    }

    .price-card:hover {
        border-color: var(--primary);
        box-shadow: none
    }

    .contacts__map:hover {
        border-color: var(--primary)
    }
}