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

ul,
ol {
    padding: 0;
    list-style-type: none;
}

body,
h1,
h2,
h3,
h4,
p,
ul[class],
ol[class],
li,
figure,
figcaption,
blockquote,
dl,
dd {
    margin: 0;
}

a {
    text-decoration: none;
    color: inherit;
    -webkit-tap-highlight-color: transparent;
    transition: .3s;
}

:root {
    --gold-color: #D4A36A;
    --light-color: #F2EEE3;
    --brown-light-color: #A7906E;
    --brown-color: #71604D;
    --text-color: #C6C4CA;
    --dark-color: #54555C;
}

ul[class], ol[class] {
    padding: 0;
    list-style-type: none;
}

img {
    max-width: 100%;
}
* {
    padding: 0px;
    margin: 0px;
    border: 0px;
    -webkit-box-sizing: border-box;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background: transparent;
}
  
::-webkit-scrollbar-track {
    background: #A3BFCE;
    border-radius: 10px;
}
  
::-webkit-scrollbar-thumb {
    background-color: var(--text-color);
    border-radius: 10px;
    border: 3px solid #050c26; /* Оформление границ бегунка */
}

html {
    min-width: 320px;
    font-size: 1px;
    margin: 0;
    scroll-behavior: smooth;
}

body {
    font-family: "Montserrat", sans-serif;
    background: linear-gradient(180deg, #54555C 50%, #54555C 100%);
    color: var(--text-color);
    font-weight: 400;
    font-size: 14rem;
    line-height: 180%;
    position: relative;
    overflow-x: hidden;
    padding: 0 15px;
}

#page {
	overflow-x: hidden;
}

.btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 427rem;
    max-width: 100%;
    height: 54rem;
    font-weight: 600;
    font-size: 18rem;
    line-height: 1;
    color: var(--light-color);
    border: 2rem solid var(--gold-color);
    background: transparent;
    cursor: pointer;
    transition: .3s;
}

.btn:hover {
    background: var(--gold-color);
}

h1, h2, h3, h4, h5, h6, p {
    font-family: "Montserrat", sans-serif;
}

h2 {
    font-weight: 600;
    font-size: 70rem;
    line-height: 100%;
    margin: 0 0 30rem;
    color: var(--light-color);
}

.container {
    position: relative;
    width: 100%;
    max-width: 1270px;
    padding: 0 12rem;
    margin: 0 auto;
}

.row {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -12rem;
}

.playfair {
    font-family: "Playfair Display", serif;
}

.inter {
    font-family: "Inter", sans-serif;
}

/*============= header =============*/

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 20rem 0;
    background-color: var(--dark-color);
    z-index: 51;
}

header.scroll {
    border-bottom: 2rem solid var(--gold-color);
}

header .row {
    align-items: center;
}

.logo {
    width: 115rem;
    margin: 0 12rem;
}

.logo .site-description {
    max-width: 50rem;
    font-family: "Playfair Display", serif;
    font-weight: 400;
    font-style: italic;
    font-size: 10rem;
    line-height: 80%;
    color: var(--gold-color);
    margin: 0 0 3rem;
}

.logo .site-title {
    font-weight: 700;
    font-size: 20rem;
    line-height: 100%;  
    color: var(--light-color);
    text-transform: uppercase;
}

.burger-menu {
    display: none;
}

ul.menu {
    display: flex;
    gap: 30rem;
    margin: 0 auto 0 60rem;
}

ul.menu a {
    font-weight: 400;
    font-size: 16rem;
    line-height: 100%;
    color: var(--light-color);
}

.menu a:hover {
    color: var(--gold-color);
}

.header-phone {
    display: flex;
    align-items: center;
    gap: 13rem;
    margin: 0 12rem;
}

.header-phone .header-phone__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42rem;
    height: 42rem;
    border: 1rem solid rgba(255, 255, 255, .2);
    border-radius: 50%;
}

.header-phone .header-phone__icon img {
    width: 18rem;
}

.header-phone a {
    font-weight: 500;
    font-size: 18rem;
    line-height: 100%;
    color: var(--light-color);
}

.header-phone a:hover {
    color: var(--gold-color);
}

/*============= primary =============*/

.primary {
    position: relative;
    padding: 190rem 0 125rem;
}

.primary .primary-bg {
    position: absolute;
    top: -87rem;
    right: -418rem;
    width: 1018rem;
    height: 972rem;
    border-radius: 50%;
    overflow: hidden;
    z-index: 5;
}

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

.primary .container {
    z-index: 6;
}

.primary .row {
    flex-direction: column;
}

.primary .title {
    margin: 0 12rem 160rem;
    max-width: 650rem;
}

.primary .title p {
    max-width: 350rem;
    font-family: "Playfair Display", serif;
    font-weight: 400;
    font-style: italic;
    font-size: 80rem;
    line-height: 80%;
    margin: 0 0 10rem;
    color: var(--gold-color);
}

.primary .title p.small {
    max-width: 100%;
    font-size: 36rem;
    text-align: right;
    padding: 0 30rem 0 0;
}

.primary .title h1 {
    font-weight: 700;
    font-size: 110rem;
    line-height: 100%;
    color: var(--light-color);
}

.primary .primay-list {
    display: flex;
    flex-wrap: wrap;
    max-width: 700rem;
    margin: 0 12rem;
}

.primary .primay-list .primary-list__text {
    max-width: 595rem;
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 20rem;
    line-height: 180%;
    margin: 0 0 25rem;
}

.primary .primay-list .primay-list__item + .primay-list__item {
    margin-left: 55rem;
}

.primary .primay-list .primay-list__item .item-title {
    display: flex;
    align-items: flex-start;
}

.primary .primay-list .primay-list__item .item-title .number {
    position: relative;
    top: 12rem;
    font-family: "Playfair Display", serif;
    font-weight: 400;
    font-style: italic;
    font-size: 60rem;
    line-height: .1;
    color: var(--gold-color);
    
}

.primary .primay-list .primay-list__item .item-title .slash {
    font-family: "Playfair Display", serif;
    font-weight: 400;
    font-style: italic;
    font-size: 60rem;
    line-height: 1;
    margin: 0 16rem;
    opacity: .2;
}

.primary .primay-list .primay-list__item .item-title .text {
    position: relative;
    top: 24rem;
    font-weight: 600;
    font-size: 18rem;
    line-height: 1;
}

.primary .primay-list .primay-list__item .item-info {
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 14rem;
    line-height: 150%;
}

/*============= about =============*/

.about {
    padding: 100rem 0 90rem;
	overflow-x: hidden;
}

.about .about-title {
    width: calc(100% - 24rem);
    margin: 0 12rem 30rem;
}

.about .about-title h2 {
    font-weight: 600;
    font-size: 70rem;
    line-height: 100%;
    color: var(--light-color);
    margin: 0 0 5rem;
}

.about .about-title p {
    font-weight: 600;
    font-size: 70rem;
    line-height: 100%;
}

.about .about-info {
    display: flex;
    width: calc(100% - 24rem);
    margin: 0 12rem;
}

.about .about-info .floor span, .about .about-info .apartment span {
    display: block;
}

.about .about-info .floor .title, .about .about-info .apartment .title {
    font-family: "Playfair Display", serif;
    font-weight: 400;
    font-style: italic;
    font-size: 80rem;
    line-height: 80%;
    color: var(--gold-color);
}

.about .about-info .apartment .title {
    text-align: right;
}

.about .about-info .floor .number, .about .about-info .apartment .number  {
    font-weight: 700;
    font-size: 500rem;
    line-height: 83%;
    color: var(--light-color);
}

.about .about-info .slash {
    font-family: "Playfair Display", serif;
    font-weight: 400;
    font-size: 500rem;
    line-height: 100%;
    color: var(--gold-color);
}

.about .entrance {
    font-family: "Playfair Display", serif;
    width: calc(100% - 24rem);
    margin: 0 12rem 90rem;
    font-weight: 400;
    font-style: italic;
    font-size: 230rem;
    line-height: 80%;
}

.about .exploitation {
    width: calc(50% - 24rem);
    margin: 0 12rem 70rem;
}

.about .exploitation p {
    max-width: 520rem;
    font-family: "Montserrat", sans-serif;
    font-weight: 400;
    font-size: 45rem;
    line-height: 1;
    color: var(--light-color);
}

.about .about-advantages {
    width: calc(50% - 24rem);
    display: flex;
    flex-wrap: wrap;
    gap: 24rem;
    margin: 0 12rem 70rem;
}

.about .about-advantages p {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(50% - 12rem);
    height: 50rem;
    font-weight: 600;
    font-size: 18rem;
    color: var(--light-color);
    border: 2px solid rgba(255, 255, 255, 0.1);
}

.about-single {
    width: calc((100% - 72rem) / 3);
    margin: 0 12rem 24rem;
}

.about-single h4 {
    font-weight: 600;
    font-size: 32rem;
    line-height: 100%;
    margin: 0 0 20rem;
}

.about-single p {
    font-weight: 400;
    font-size: 14rem;
    line-height: 180%;
    margin: 0;
}

.about-swiper {
    width: calc(100% - 24rem);
    margin: 75rem auto 0;
    overflow: unset;
}

.about-swiper .swiper-slide {
    position: relative;
    height: 64vh;
    border-radius: 20rem;
    overflow: hidden;
    margin: 3vh 0;
    opacity: .3;
}

.about-swiper .swiper-slide.swiper-slide-active {
    height: 70vh;
    margin: 0;
    opacity: 1;
}

.about-swiper .swiper-slide img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.about .swiper-navigation__about {
    position: relative;
    display: flex;
    justify-items: flex-start;
    gap: 7rem;
    margin: 0;
}

.about .swiper-navigation__about div {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52rem;
    height: 52rem;
    border: 2rem solid var(--gold-color);
    right: auto;
    bottom: auto;
    left: auto;
    top: auto;
    margin-top: 0;
    transition: .3s;
}

.about .swiper-navigation__about div:hover {
    background-color: var(--gold-color);
}

.about .swiper-navigation__about div:after {
    display: none;
}

.about .swiper-navigation__about div img {
    width: 9rem;
}

.about .swiper-navigation__about div.swiper-button-prev img {
    transform: rotate(180deg);
}

/*============= location =============*/

.location {
    padding: 100rem 0 20rem;
}

.location .row {
    align-items: center;
}

.location .content {
    position: relative;
    background-color: var(--dark-color);
    width: 560rem;
    margin: 0 12rem;
    z-index: 50;
}

.location .content:after {

}

.location .description {
    max-width: 380rem;
    margin: 0 0 80rem;
}

.location .tags {
	/*
    display: flex;
	*/
	display: none;
    flex-wrap: wrap;
    gap: 20rem;
    max-width: 400rem;
    margin: 0 0 50rem;
}

.location .tags .tag-single {
    display: flex;
    align-items: center;
    gap: 10rem;
    min-width: 170rem;
}

.location .tags .tag-single .tag-single__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54rem;
    height: 54rem;
    background-color: rgba(255, 255, 255, .1);
    border-radius: 50%;
}

.location .tags .tag-single .tag-single__icon img {
    width: 20rem;
}

.location .tags .tag-single p {
    font-weight: 600;
    font-size: 18rem;
    line-height: 1;
    color: var(--light-color);
}

.location .about-single {
    width: 100%;
    max-width: 380rem;
    margin: 0;
}

.location .map {
    position: relative;
	/*
    width: calc(100% - 596rem);
    max-width: 500rem;
    aspect-ratio: 1 / 1;
	*/
	width: calc(100% - 24rem);
    margin: 0 12rem;
    border-radius: 10rem;
    overflow: hidden;
}

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

/*============= apartments =============*/

.apartments {
    padding: 100rem 0 20rem;
}

.apartments .apartments-content {
    width: 376rem;
    margin: 0 80rem 0 12rem;
}

.apartments .apartments-list {
    margin: 0 0 55px;
}

.apartments .apartments-list button {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    width: 100%;
    height: 46px;
    font-weight: 600;
    font-size: 18rem;
    line-height: 1;
    color: var(--light-color);
    border: 2rem solid rgba(255, 255, 255, .1);
    cursor: pointer;
    transition: .3s;
}

.apartments .apartments-list button + button {
    margin-top: 16rem;
}

.apartments .apartments-list a {
	width: 100%;
    background-color: var(--gold-color);
    margin-top: 30rem;
}

.apartments .apartments-list a:hover {
    background-color: transparent;
}

.apartments .apartments-list button.current {
    border: 2rem solid var(--gold-color);
}

.apartments .slider-change p {
    font-weight: 600;
    font-size: 32rem;
    line-height: 100%;
    color: var(--light-color);
    margin: 0 0 35rem;
}

.apartments .slider-change .swiper-navigation__apartments {
    position: relative;
    display: none;
    justify-items: flex-start;
    gap: 7rem;
}

.apartments .slider-change .swiper-navigation__apartments.current {
    display: flex;
}

.apartments .slider-change .swiper-navigation__apartments div {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52rem;
    height: 52rem;
    border: 2rem solid var(--gold-color);
    right: auto;
    bottom: auto;
    left: auto;
    top: auto;
    margin-top: 0;
    transition: .3s;
}

.apartments .slider-change .swiper-navigation__apartments div:hover {
    background-color: var(--gold-color);
}

.apartments .slider-change .swiper-navigation__apartments div:after {
    display: none;
}

.apartments .slider-change .swiper-navigation__apartments div img {
    width: 9rem;
}

.apartments .slider-change .swiper-navigation__apartments div.swiper-button-prev img {
    transform: rotate(180deg);
}

.apartments .apartments-sliders {
    width: calc(100% - 480rem);
    margin: 0 12rem 0 0;
}

.apartments .apartments-sliders .apartment-slider {
    display: none;
    /*
    overflow: visible;
    */
}

.apartments .apartments-sliders .apartment-slider.current {
    display: flex;
}

.apartments .apartments-sliders .apartment-slider .swiper-slide {
    background-color: #F8F6F2;
    width: 380rem;
    aspect-ratio: 0.64406779661 / 1;
    padding: 20rem;
    border-radius: 10rem;
    backdrop-filter: blur(84px)
}

.apartments .apartments-sliders .apartment-slider .swiper-slide .square {
    display: flex;
    gap: 5rem;
    margin: 0 0 20rem;
}

.apartments .apartments-sliders .apartment-slider .swiper-slide .square p {
    position: relative;
    font-family: "Playfair Display", serif;
    font-weight: 400;
    font-style: italic;
    font-size: 50rem;
    line-height: 100%;
    color: var(--dark-color);
}

.apartments .apartments-sliders .apartment-slider .swiper-slide .square p span {
    position: relative;
    top: -18rem;
    font-size: 28rem;
}

.apartments .apartments-sliders .apartment-slider .swiper-slide .rooms {
    font-weight: 600;
    font-size: 24rem;
    line-height: 100%;
    color: var(--gold-color);
    margin: 0 0 10rem;
}

.apartments .apartments-sliders .apartment-slider .swiper-slide .description {
    color: var(--dark-color);
}

.apartments .apartments-sliders .apartment-slider .swiper-slide img {
    display: block;
    height: 330rem;
    max-width: 100%;
    margin: 0 auto;
}

/*============= plan =============*/

.plan {
    padding: 100rem 0 20rem;
}

.plan .title {
    width: calc(100% - 24rem);
    margin: 0 12rem;
}

.plan-swiper {
    width: calc(100% - 24rem);
    margin: 0 12rem;
}

.plan-swiper .swiper-wrapper {
    height: auto;
}

.plan-swiper .swiper-slide {
    border-radius: 30rem;
    overflow: hidden;
}

.plan .swiper-navigation__plan {
    position: relative;
    display: flex;
    justify-items: flex-start;
    gap: 7rem;
    margin: 30rem 0 0;
}

.plan .swiper-navigation__plan div {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52rem;
    height: 52rem;
    border: 2rem solid var(--gold-color);
    right: auto;
    bottom: auto;
    left: auto;
    top: auto;
    margin-top: 0;
    transition: .3s;
}

.plan .swiper-navigation__plan div:hover {
    background-color: var(--gold-color);
}

.plan .swiper-navigation__plan div:after {
    display: none;
}

.plan .swiper-navigation__plan div img {
    width: 9rem;
}

.plan .swiper-navigation__plan div.swiper-button-prev img {
    transform: rotate(180deg);
}

.plan-swiper .swiper-slide p {
    position: relative;
    top: -20rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--gold-color);
    color: var(--light-color);
    font-size: 24rem;;
    font-weight: 700;
    width: 100%;
    height: 50rem;
    border-radius: 0 0 30rem 30rem;
}

/*============= hod =============*/

.hod {
    padding: 100rem 0 20rem;
}

.hod .title {
    width: calc(100% - 24rem);
    margin: 0 12rem;
}

.hod-swiper {
    width: calc(100% - 24rem);
    margin: 0 12rem;
}

.hod-swiper .swiper-wrapper {
    height: auto;
}

.hod-swiper .swiper-slide__image {
    display: block;
    position: relative;
    width: 100%;
    aspect-ratio: 1.26086956522 / 1;
    margin: 0 0 15rem;
    border-radius: 20rem;
    overflow: hidden;
}

.hod-swiper .swiper-slide__image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.hod-swiper .date .month {
    font-family: "Playfair Display", serif;
    font-weight: 400;
    font-style: italic;
    font-size: 48rem;
    line-height: 100%;
    color: var(--gold-color);
}

.hod-swiper .date .year {
    font-weight: 600;
    font-size: 48rem;
    line-height: 100%;
}

.hod .swiper-navigation__hod {
    position: relative;
    display: flex;
    justify-items: flex-start;
    gap: 7rem;
    margin: 30rem 0 0;
}

.hod .swiper-navigation__hod div {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52rem;
    height: 52rem;
    border: 2rem solid var(--gold-color);
    right: auto;
    bottom: auto;
    left: auto;
    top: auto;
    margin-top: 0;
    transition: .3s;
}

.hod .swiper-navigation__hod div:hover {
    background-color: var(--gold-color);
}

.hod .swiper-navigation__hod div:after {
    display: none;
}

.hod .swiper-navigation__hod div img {
    width: 9rem;
}

.hod .swiper-navigation__hod div.swiper-button-next img {
    transform: rotate(180deg);
}

/*============= variants =============*/

.variants {
    padding: 75rem 0 20rem;
}

.variants .title {
    width: calc(100% - 24rem);
    margin: 0 12rem;
}

.variants-list {
    display: flex;
    flex-wrap: wrap;
    gap: 20rem 9rem;
    width: calc(100% - 470rem);
    margin: 0 12rem;
}

.variants-list .variants-list__item {
    font-weight: 600;
    font-size: 18rem;
    line-height: 1;
    padding: 18rem 30rem;
    border: 2rem solid rgba(255, 255, 255, .2);
    color: var(--light-color);
}

.variants .variants-order {
    width: 422rem;
    margin: 0 12rem;
}

.variants .variants-order p {
    font-weight: 400;
    font-size: 18rem;
    line-height: 160%;
    margin: 24rem 0 0;
    color: var(--light-color);
}

/*============= contacts =============*/

.contacts {
    padding: 70rem 0 0;
}

.contacts .title {
    width: calc(100% - 24rem);
    margin: 0 12rem;
}

.contacts .column {
    width: calc(50% - 24rem);
    margin: 0 12rem 25rem;
}

.contacts .column .column-title {
    display: flex;
    align-items: center;
    gap: 20rem;
    margin: 0 0 20rem;
}

.contacts .column .column-title .title-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42rem;
    height: 42rem;
    border: 1rem solid rgba(255, 255, 255, .1);
    border-radius: 50%;
}

.contacts .column .column-title .title-icon img {
    width: 16rem;
}

.contacts .column .column-title a {
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: var(--light-color);
}

.contacts .column .column-title a:hover {
    color: var(--gold-color);
}

.contacts .column p {
    max-width: 260rem;
}

/*============= information =============*/

.information {
    padding: 10rem 0 0;
}

.information .title {
    width: calc(100% - 24rem);
    margin: 0 12rem;
}

.information .column {
    width: calc(50% - 24rem);
    margin: 0 12rem 25rem;
}

.information .column .information-title {
    font-family: "Inter", sans-serif;
    font-weight: 500;
    font-size: 18rem;
    line-height: 180%;
    color: var(--light-color);
    margin: 0 0 30rem;
}

.information .column .information-text {
    font-size: 16rem;
}

.information .column a {
    font-weight: 600;
    font-size: 18rem;
    line-height: 180%;
    color: var(--light-color);
}

.information .column a:hover {
    color: var(--gold-color);
}

/*============= footer =============*/

footer {
    padding: 50rem 0;
}

footer .container {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

footer .row {
    align-items: center;
}

/*============= popup =============*/

.overlay {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #274E7366;
    transform: translateX(-1000%);
    transition: .3s;
    z-index: 50;
}

.popup-order {
    background: #E8EDF1;
    position: fixed;
    left: calc(50% - 200rem);
    top: calc(50% - 168rem);
    width: 400rem;
    max-width: 100%;
    border-radius: 8rem;
    transform: translateY(-1000%);
    transition: .3s;
    opacity: 0;
    z-index: 51;
}

.overlay.open, .popup-order.open, .access.open, .error.open {
    opacity: 1;
    transform: translateY(0);
}

.order-form {
    background: var(--dark-color);
    padding: 30rem;
}

.order-form .order-form__title {
    font-weight: 400;
    font-size: 14rem;
    line-height: 120%;
    color: var(--light-color);
    margin: 0 0 30rem;
    text-align: center;
}

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

.order-form form input {
    background-color: var(--light-color);
    width: 100%;
    padding: 6rem 25rem 7rem;
    font-weight: 400;
    font-size: 14rem;
    line-height: 120%;
    letter-spacing: -1.1rem;
    color: #757575;
    outline: none;
}

.order-form form input.email {
    width: 100%;
    max-width: 820rem;
}

.order-form form button {
    height: 40rem;
    background: transparent;
}

.order-form form .policy {
    font-weight: 400;
    font-size: 14rem;
    line-height: 120%;
    color: var(--light-color);
}

.order-form form .policy a {
    text-decoration: underline;
}

.order-form form .policy a:hover {
    color: var(--gold-color);
}

body.page {
    padding: 100rem 0 0rem;
	margin: 0;
}

body.page h2 {
	color: #fff;
}

body.page h3 {
	position: relative;
    width: 100%;
    font-weight: 700;
    font-size: 28rem;
    line-height: 1;
    letter-spacing: 0%;
    text-align: left;
    color: #fff;
    margin: 0 auto 20rem;
}

body.page section.page p {
	position: relative;
    width: 100%;
    font-weight: 400;
    font-size: 18rem;
    line-height: 1.3;
    letter-spacing: 0%;
    text-align: left;
    color: #fff;
    margin: 0 auto 15rem;
}

body.page section.page p + h3 {
	margin-top: 30rem;
}

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

    html {
        font-size: .8px;
    }

}

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

    h2 {
        font-size: 50rem !important;
    }

    .primary .primary-bg {
        width: 920rem;
    }

    .about .about-info .floor .number, .about .about-info .apartment .number {
        font-size: 340rem;
    }

    .about-swiper .swiper-slide {
        height: 40vh;
    }

    .about-swiper .swiper-slide.swiper-slide-active {
        height: 46vh;
    }

}

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

    header ul.menu {
        position: absolute;
        background-color: var(--dark-color);
        flex-direction: column;
        left: 0;
        top: 65rem;
        gap: 10rem;
        padding: 20rem;
        transform: translateX(-1000%);
        transition: .3s;
    }

    header ul.menu.open {
        transform: translateX(0%);
    }

    .burger-menu {
        position: relative;
        display: block;
        margin: 0 12rem;
        width: 60rem;
        height: 30rem;
        cursor: pointer;
        transition: .3s;
    }

    .burger-menu span:nth-child(1) {
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        width: 60rem;
        height: 3rem;
        background-color: var(--gold-color);
        transition: .3s;
    }

    .burger-menu span:nth-child(2) {
        position: absolute;
        top: 27rem;
        left: 0;
        display: block;
        width: 60rem;
        height: 3rem;
        background-color: var(--gold-color);
        transition: .3s;
    }

    .burger-menu.open span:nth-child(1) {
        top: 16rem;
        transform: rotate(45deg);
    }

    .burger-menu.open span:nth-child(2) {
        top: 16rem;
        transform: rotate(-45deg);
    }

    .header-phone {
        margin: 0 12rem 0 auto;
    }

    .primary {
        padding: 190rem 0 25rem;
    }

    .primary .title {
        margin: 0 12rem 30rem;
    }

    .primary .title p, .primary .title h1, .primary .title p.small {
        max-width: calc(100% - 24rem);
        text-align: center;
        padding: 0;
    }

    .primary .title p.small {
        font-size: 20rem;
    }

    .about .about-info .slash {
        font-size: 300rem;
    }

    .primary .primary-bg {
        position: relative;
        width: calc(100% - 24rem);
        top: 0;
        right: 0;
        margin: 50rem 12rem 0;
        border-radius: 20rem;
    }

    .about .entrance {
        font-size: 90rem;
    }

    .about .exploitation, .about .about-advantages {
        width: calc(100% - 24rem);
        margin: 0 12rem 50rem;
    }

    .about .exploitation p {
        max-width: 100%;
    }

    .about-single {
        width: calc(50% - 24rem);
    }

    .variants-list, .variants .variants-order {
        width: calc(100% - 24rem);
    }

    .variants .variants-order {
        margin-top: 40rem;
    }

}

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

    .about .about-title p {
        font-size: 36rem;
    }

    .about .about-info .floor .title, .about .about-info .apartment .title {
        font-size: 36rem;
        line-height: 1;
        margin: 0 0 15rem;
    }

    .about .about-info .floor .number, .about .about-info .apartment .number, .about .about-info .slash {
        font-size: 120rem;
    }

    .about .entrance {
        font-size: 70rem;
    }

    .location .content {
        width: calc(100% - 24rem);
        margin: 0 12rem 30rem;
    }

    .location .map {
        width: calc(100% - 24rem);
        max-width: 100%;
        margin: 0 12rem;
    }

    .apartments .apartments-content {
        width: calc(100% - 24rem);
        margin: 0 12rem 30rem;
    }

    .apartments .apartments-sliders {
        width: calc(100% - 24rem);
        margin: 0 12rem;
    }

    .contacts .column, .information .column {
        width: calc(100% - 24rem);
    }

    footer .row {
        flex-direction: column;
    }

    footer ul.menu {
        flex-direction: column;
        margin: 30rem auto;
    }

    footer ul.menu li {
        text-align: center;
    }

}

@media screen and (max-width: 576px) {
   
    h2 {
        font-size: 36rem !important;
    }

    .primary .title p {
        font-size: 30rem;
        line-height: 100%;
    }

    .primary .title h1 {
        font-size: 46rem;
    }

    .primay-list__item {
        width: 300rem;
        margin: 0 auto 20rem;
    }

    .primary .primay-list .primay-list__item + .primay-list__item {
        margin-left: auto;
    }

    .primary .primary-bg {
        height: 300rem;
    }

    .about .about-advantages p {
        width: 100%;
    }

    .about-single {
        width: calc(100% - 24rem);
    }

    .about .exploitation p {
        font-size: 24rem;
    }

}

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

    html {
        font-size: .7px;
    }

}

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

    html {
        font-size: .6px;
    }

}