.object-container {
  padding: 0px 15px;
}
.exterior-interior-container {
  margin-top: 87px;
  @media (max-width: 780px) {
    padding: 0;
  }
  @media (max-width: 580px) {
    font-size: 60px;
  }
  & .exterior-interior-title {
    border-bottom: 1px solid #d8d8d8;
    padding-bottom: 46px;
    @media (max-width: 780px) {
      padding-bottom: 24px;
      margin: 0px 15px;
    }

    & h2 {
      font-family: "Playfair-Display", sans-serif;
      font-size: 44px;
      font-weight: 400;
      max-width: 822px;
      margin: 0;
      @media (max-width: 780px) {
        font-size: 28px;
        max-width: 361px;
      }
    }
  }
  & .exterior-interior-container-inner {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    @media (max-width: 780px) {
      flex-direction: column;
      margin-top: 24px;
    }

    & .exterior-container {
      padding-top: 32px;
      padding-bottom: 32px;
      max-width: 692px;
      width: calc(50% - 20px);
      @media (max-width: 780px) {
        padding-top: 24px;
        padding-bottom: 24px;
        width: 100%;
        max-width: 100%;
      }

      & .swiper-container {
        position: relative;
        & .exterior-title {
          position: absolute;
          left: 12px;
          top: 12px;
          z-index: 1;
          background-color: #9a9a9a4d;
          border-radius: 4px;
          padding: 10px 14px;
          & p {
            font-family: "Playfair-Display", sans-serif;
            font-size: 24px;
            font-weight: 400;
            color: #ffffff;
            margin: 0;
          }
          @media (max-width: 780px) {
            display: none;
          }
        }
        & .navigation-buttons {
          display: flex;
          gap: 4px;
          position: absolute;
          right: 20px;
          bottom: 20px;
          z-index: 1;
          & button {
            background-color: transparent;
            padding: 0;
            border: none;
          }
          @media (max-width: 780px) {
            display: none;
          }
        }
        & .swiper-wrapper-exterior {
          & .slick-list {
            border-radius: 16px !important;
            @media (max-width: 780px) {
              border-radius: 0px !important;
            }

            & .slick-track {
              & .swiper-slide {
                height: 440px;
                border-radius: 16px;
                width: 100%;
                max-width: 692px;
                @media (max-width: 780px) {
                  max-width: 320px;
                  height: 430px;
                  width: 100%;
                  border-radius: 16px;
                  margin: 25px 0px;
                }

                & img {
                  width: 100%;
                  height: 100%;
                  background-size: cover;
                  object-fit: cover;
                  @media (max-width: 780px) {
                    border-radius: 16px;
                  }
                }
              }
              & .slick-current {
                @media (max-width: 780px) {
                  max-width: 320px;
                  height: 480px;
                  margin: 0px 16px;
                  width: 100%;
                  border-radius: 16px;
                }
                @media (max-width: 389px) {
                  max-width: 300px;
                }
              }
            }
          }
          & ul.slick-dots {
            position: absolute;
            bottom: -32px;
            & li {
              background-color: #d8d8d8;
              color: #d8d8d8;
              width: 12px;
              height: 5px;
              border-radius: 5px;
              transition: all 0.5s ease-in-out;
              & button {
                display: none;
              }
            }
            & li.slick-active {
              background-color: #566955;
              color: #566955;
              width: 48px;
              height: 5px;
              border-radius: 5px;
              content: none;
              list-style: none;
              transition: all 0.5s ease-in-out;
              & button {
                display: none;
              }
            }
          }
        }
      }
      & p {
        font-family: "Inter-Display", sans-serif;
        font-size: 16px;
        font-weight: 400;
        color: #4f4f4f;
        margin-top: 28px;
        margin-bottom: 0;
        @media (max-width: 780px) {
          padding: 0px 15px;
          text-align: center;
        }
      }
    }

    & .interior-container {
      padding-top: 32px;
      padding-bottom: 32px;
      max-width: 692px;
      width: calc(50% - 20px);
      @media (max-width: 780px) {
        padding-top: 24px;
        padding-bottom: 24px;
        width: 100%;
        max-width: 100%;
      }

      & .swiper-container {
        position: relative;
        & .interior-title {
          position: absolute;
          left: 12px;
          top: 12px;
          z-index: 1;
          background-color: #9a9a9a4d;
          border-radius: 4px;
          padding: 10px 14px;
          & p {
            font-family: "Playfair-Display", sans-serif;
            font-size: 24px;
            font-weight: 400;
            color: #ffffff;
            margin: 0;
          }
          @media (max-width: 780px) {
            display: none;
          }
        }
        & .navigation-buttons {
          display: flex;
          gap: 4px;
          position: absolute;
          right: 20px;
          bottom: 20px;
          z-index: 1;
          & button {
            background-color: transparent;
            padding: 0;
            border: none;
          }
          @media (max-width: 780px) {
            display: none;
          }
        }
        & .swiper-wrapper-interior {
          & .slick-list {
            border-radius: 16px !important;
            @media (max-width: 780px) {
              border-radius: 0px !important;
            }
            & .slick-track {
              & .swiper-slide {
                height: 440px;
                border-radius: 16px;
                width: 100%;
                max-width: 692px;
                @media (max-width: 780px) {
                  max-width: 320px;
                  height: 430px;
                  width: 100%;
                  border-radius: 16px;
                  margin: 25px 0px;
                }

                & img {
                  width: 100%;
                  height: 100%;
                  background-size: cover;
                  object-fit: cover;
                  @media (max-width: 780px) {
                    border-radius: 16px;
                  }
                }
              }
              & .slick-current {
                @media (max-width: 780px) {
                  max-width: 320px;
                  height: 480px;
                  margin: 0px 16px;
                  width: 100%;
                  border-radius: 16px;
                }
                @media (max-width: 389px) {
                  max-width: 300px;
                }
              }
            }
          }
          & ul.slick-dots {
            position: absolute;
            bottom: -32px;
            & li {
              background-color: #d8d8d8;
              color: #d8d8d8;
              width: 12px;
              height: 5px;
              border-radius: 5px;
              transition: all 0.5s ease-in-out;
              & button {
                display: none;
              }
            }
            & li.slick-active {
              background-color: #566955;
              color: #566955;
              width: 48px;
              height: 5px;
              border-radius: 5px;
              content: none;
              list-style: none;
              transition: all 0.5s ease-in-out;
              & button {
                display: none;
              }
            }
          }
        }
      }
      & p {
        font-family: "Inter-Display", sans-serif;
        font-size: 16px;
        font-weight: 400;
        color: #4f4f4f;
        margin-top: 28px;
        margin-bottom: 0;
        @media (max-width: 780px) {
          padding: 0px 15px;
          text-align: center;
        }
      }
    }

    .separator-line {
      margin: 0 20px;
      border-left: 1px solid #d8d8d8;
      display: block;
      @media (max-width: 780px) {
        border-top: 1px solid #d8d8d8;
      }
    }
  }
}
.technical-container {
  margin-top: 180px;
  @media (max-width: 780px) {
    margin-top: 120px;
  }
  & .technical-specifications-container {
    display: flex;
    flex-direction: column;
    gap: 48px;

    & .title-container {
      display: flex;
      justify-content: space-between;
      gap: 40px;
      width: 100%;

      & h3 {
        font-family: "Playfair-Display", sans-serif;
        font-size: 56px;
        font-weight: 400;
        margin: 0;
        @media (max-width: 850px) {
          font-size: 50px;
        }
        @media (max-width: 780px) {
          font-size: 36px;
        }
      }

      & a {
        max-width: 181px;
        width: 100%;
        @media (max-width: 780px) {
          display: none;
        }
      }
    }

    & .technical-specifications-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      justify-items: center;
      @media (max-width: 780px) {
        grid-template-columns: repeat(2, 1fr);
      }
      @media (max-width: 580px) {
        grid-template-columns: repeat(2, 1fr);
      }
      & .specifications-grid-item {
        text-align: center;
        width: 100%;
        padding: 56px 10px 56px 10px;
        border-top: 1px solid #d8d8d8;
        border-left: 1px solid #d8d8d8;
        @media (max-width: 580px) {
          padding: 32px 10px 32px 10px;
        }

        & img {
          margin: 0 auto;
        }

        & .specification {
          font-family: "Playfair-Display", sans-serif;
          font-size: 32px;
          font-weight: 500;
          margin-top: 40px;
          margin-bottom: 24px;
          font-feature-settings: "lnum";

          @media (max-width: 1327px) {
            font-size: 28px;
          }
          @media (max-width: 930px) {
            font-size: 23px;
          }
          @media (max-width: 580px) {
            font-size: 22px;
          }
        }

        & .value {
          font-family: "Inter-Display", sans-serif;
          font-size: 14px;
          margin: 0;
        }
      }

      & .specifications-grid-item:nth-child(1) {
        border-left: none;
        border-top: none;
      }

      & .specifications-grid-item:nth-child(2) {
        border-top: none;
        @media (max-width: 780px) {
          border-top: none;
        }
      }
      & .specifications-grid-item:nth-child(3) {
        border-top: none;
        @media (max-width: 780px) {
          border-top: 1px solid #d8d8d8;
          border-left: none;
        }
      }
      .specifications-grid-item:nth-child(4) {
        border-top: none;
        @media (max-width: 780px) {
          border-top: 1px solid #d8d8d8;
        }
      }

      & .specifications-grid-item:nth-child(5) {
        border-left: none;
      }
      & .specifications-grid-item:nth-child(7) {
        @media (max-width: 780px) {
          border-left: none;
        }
      }
    }
  }

  & .technical-specification-mobile-btn {
    display: none;
    @media (max-width: 780px) {
      display: block;
      margin-top: 40px;
      & a.green-right-arrow-btn {
        max-width: 100%;
      }
    }
  }
}



.sold-objects-container {
  display: flex;
  align-items: center;
  gap: 62px;
  padding: 32px 0px;
  border-top: 1px solid #d8d8d8;
  border-bottom: 1px solid #d8d8d8;
  margin: 0px 15px 0px 15px;
  @media (max-width: 780px) {
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
  }
  & h3 {
    font-family: "Playfair-Display", sans-serif;
    font-size: 28px;
    font-weight: 400;
    color: #070707;
    max-width: 200px;
    width: 100%;
    margin: 0;
  }
  .loadbar-container {
    width: 100%;
    & .loadbar-background {
      width: 100%;
      background-color: #ebebeb;
      border-radius: 8px;
      overflow: hidden;
      height: 32px;

      & .loadbar-progress {
        width: 0;
        height: 32px;
        background-color: #566955;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: width 0.5s ease;
        & .loadbar-text {
          color: #ffffff;
          font-size: 16px;
        }
      }
    }
  }
}

.object-video-container {
  margin-top: 180px;
  & .video-title-container {
    display: flex;
    gap: 12px;
    justify-content: space-between;
    @media (max-width: 1300px) {
      flex-direction: column;
      align-items: flex-start;
      gap: 24px;
    }
    & h3 {
      font-family: "Playfair-Display", sans-serif;
      font-size: 44px;
      font-weight: 400;
      margin: 0;
      @media (max-width: 780px) {
        font-size: 32px;
      }
    }
    & p {
      font-family: "Inter-Display", sans-serif;
      font-size: 16px;
      font-weight: 400;
      color: #4f4f4f;
      align-items: center;
      margin: 0;
      max-width: 487px;
    }
  }
  & .video-container {
    margin-top: 48px;
    & .video-preview {
      width: 100%;
      border-radius: 16px;
      position: relative;
      & img {
        width: 100%;
        height: 640px;
        border-radius: 16px;
        object-fit: cover;
      }
      & .video-controls {
        position: absolute;
        right: 32px;
        top: 32px;
        & button.play-video-btn,
        button.fullscreen-video-btn {
          background-color: unset;
          padding: 0;
          border: none;
        }
      }
    }

    & video {
      border-radius: 16px;
      height: 640px;
      background-color: #333;
      width: 100%;
    }
  }
}

.object-gallery-section {
  text-align: center;
  margin-top: 182px;
  @media (max-width: 780px) {
    margin-top: 120px;
  }

  & h3 {
    font-family: "Playfair-Display", sans-serif;
    font-size: 56px;
    font-weight: 400;
    color: #070707;
    padding: 0px 15px;
    @media (max-width: 780px) {
      font-size: 36px;
    }
  }
  & p {
    font-family: "Inter-Display", sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #4f4f4f;
    padding: 0px 15px;
  }
  & .object-gallery-slider {
    margin-top: 48px;
    position: relative;
    & .slider-item {
      margin: 48px 0px;
      transition: all 0.5s ease-in-out;
      max-width: 998px;
      height: 560px;
      border-radius: 16px;
      @media (max-width: 1145px) {
        max-width: 900px;
        height: 460px;
      }
      @media (max-width: 970px) {
        max-width: 740px;
        height: 400px;
      }
      & img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: all 0.5s ease-in-out;
        border-radius: 16px;
      }
    }
    & .slick-current {
      margin: 0px 40px;
      transition: all 0.5s ease-in-out;
      max-width: 1168px;
      height: 656px;
      width: 100%;
      border-radius: 16px;
      @media (max-width: 1299px) {
        max-width: 1000px;
        height: 600px;
      }
      @media (max-width: 1145px) {
        max-width: 850px;
        height: 550px;
      }
      @media (max-width: 970px) {
        max-width: 740px;
        height: 500px;
      }
      @media (max-width: 870px) {
        max-width: 700px;
        height: 480px;
      }
      @media (max-width: 820px) {
        max-width: 650px;
        height: 480px;
      }
      @media (max-width: 820px) {
        max-width: 650px;
        height: 480px;
      }
      @media (max-width: 710px) {
        max-width: 500px;
        margin: 0px 16px;
      }
      @media (max-width: 555px) {
        max-width: 320px;
      }
      & img {
        width: 100%;
        height: 100%;
        background-size: cover;
        object-fit: cover;
        transition: all 0.5s ease-in-out;
        border-radius: 16px;
      }
    }
    & ul.slick-dots {
      position: absolute;
      bottom: -32px;
      & li {
        background-color: #d8d8d8;
        color: #d8d8d8;
        width: 12px;
        height: 5px;
        border-radius: 5px;
        transition: all 0.5s ease-in-out;
        & button {
          display: none;
        }
      }
      & li.slick-active {
        background-color: #566955;
        color: #566955;
        width: 48px;
        height: 5px;
        border-radius: 5px;
        content: none;
        list-style: none;
        transition: all 0.5s ease-in-out;
        & button {
          display: none;
        }
      }
    }
  }
  & .gallery-buttons {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    background-color: unset;
    padding: 0;
    max-width: 1288px;
    display: flex;
    justify-content: space-between;
    width: 100%;
    @media (max-width: 1299px) {
      max-width: 1128px;
      height: 600px;
    }
    @media (max-width: 1145px) {
      max-width: 960px;
    }
    @media (max-width: 970px) {
      max-width: 850px;
    }
    @media (max-width: 870px) {
      max-width: 810px;
    }
    @media (max-width: 820px) {
      max-width: 760px;
    }
    @media (max-width: 780px) {
      display: none;
    }
  }
  & .object-slick-prev {
    background-color: unset;
    padding: 0;
  }
  & .object-slick-next {
    background-color: unset;
    padding: 0;
  }
}
#site-header {
  padding: 20px 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100;
  background-color: transparent;
}