/*
Theme Name: Realty
Author: the WeCanDevelopIT team
Description: Realty is a modern, easy-to-use, and highly customizable WordPress theme designed specifically for real estate professionals. Whether you run a real estate agency, work as an independent broker, or manage property listings, this theme provides all the necessary tools to create a professional and engaging website. Realty theme utilizes free site editor included in WordPress, have responsive and mobile optimized layout and major browser compatibility. Working with the theme does not require special skills and programming, the installation and configuration process is extremely simple and fast.
Requires at least: 6.7
Tested up to: 6.7
Requires PHP: 7.2
Version: 1.0
Text Domain: realty
Tags: one-column, custom-logo, full-site-editing, block-patterns, rtl-language-support, wide-blocks, block-styles, blog, portfolio, news
*/

/* COMMON */

* {
  font-family: "Montserrat";
  box-sizing: border-box;
}

body {
  background: #fff9f3;
}

/*
 * Progressive enhancement to reduce widows and orphans
 * https://github.com/WordPress/gutenberg/issues/55190
 */
h1,
h2,
h3,
h4,
h5,
h6,
blockquote,
caption,
figcaption,
p {
  text-wrap: pretty;
}

a {
  text-decoration: none;
}

.wp-block-group {
  margin-top: 0;
}

/* ---------------------------------------- */

/* Buttons styles */

.wp-element-button {
  font-size: 1rem;
  line-height: 1.5rem;
  transition: all 0.2s linear;
}

.wp-element-button:hover {
  background: #ffffff;
  color: #000;
}

.button-small-size a {
  padding: 8px 20px;
}

.button-medium-size a {
  padding: 12px 20px;
}

.button-large-size a {
  padding: 12px 24px;
}

.button-light a {
  background: #fff9f3;
  color: #000;
  border: 1px #000 solid;
}

.button-light a:hover {
  background: #000;
  color: #fff9f3;
}

.button-main a {
  width: 300px;
  margin-top: 16px;
}

.button-404 {
  margin-top: 30em !important;
}

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
.wp-block-navigation-item__content {
  position: relative;
  display: inline-block;
  text-decoration: none;
  overflow: hidden;
  text-decoration: none !important;
}

.wp-block-navigation-item__content::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background-color: #000;
  transition: width 0.3s ease-in-out, left 0.3s ease-in-out;
}

.wp-block-navigation-item__content:hover::after {
  width: 100%;
  left: 0;
}

.wp-block-navigation-item__content:hover::after:hover {
  transition: width 0.3s;
}

@media screen and (max-width: 600px) {
  #wpadminbar {
    position: fixed;
  }
}
/* ---------------------------------------- */

/* header styles */
.header-container {
  position: fixed;
  padding: 16px 24px;
  z-index: 100;
  width: 100%;
  background: rgba(255, 255, 255, 0.6);
  transition: transform 0.3s ease-out;
}

.header-container.hidden {
  transform: translateY(-200%);
}

/* Main logo */
.header-container .wp-block-site-logo,
.main-logo img {
  max-width: 84px;
  max-height: 36px;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation
  .wp-block-navigation-submenu
  .wp-block-navigation-item:not(:last-child) {
  margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation
  .wp-block-navigation-item
  .wp-block-navigation-item__content {
  outline-offset: 4px;
  outline-style: none;
  font-weight: 600;
  font-size: 1rem;
}

.wp-block-navigation-item__content :focus {
  outline-style: none;
  outline: none;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation
  .wp-block-navigation-item
  ul.wp-block-navigation__submenu-container
  .wp-block-navigation-item__content {
  outline-offset: 0;
}

/* ---------------------------------------- */

/*
 * Change the position of the more block on the front, by making it a block level element.
 * https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
  display: block;
}

/* main styles */
main {
  margin-top: 0 !important;
  padding-top: 0;
}

.main-title {
  position: relative;
  padding-bottom: 100px;
}

.line-2::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #ffffff;
  margin-bottom: 40px;
}

/* reviews */

.reviews {
  gap: 24px !important;
}

.review-block {
  background: #ffffff;
  border-radius: 30px;
  padding: 24px;
}

.review-info {
  gap: 8px !important;
  align-items: center;
}

.review-info div:nth-child(2) {
  border-right: 1px #000 solid;
  padding-right: 8px;
  align-self: center;
}

.gap-24 {
  gap: 24px !important;
}
/* ---------------------------------------- */

/* features */

.wp-block-social-link,
.wp-social-link {
  background-color: transparent;
  color: black;
}

.features-container {
  display: flex;
  position: relative;
  overflow: hidden;
}

.features-container-right {
  justify-content: flex-end;
}

.features-image-container {
  text-align: center;
  opacity: 0;
  transform: translate(100%, 50%);
  transition: transform 0.6s ease-out, opacity 0.8s ease-out;
}

.features-content-box {
  position: absolute;
  right: 0;
  z-index: 10;
  max-width: 852px;
  padding: 24px;
  border-radius: 30px;
  background: #ffffff99;
  opacity: 0;
  transform: translate(-100%, -50%);
  transition: transform 0.6s ease-out, opacity 0.8s ease-out;
}

.features-container-right.show .features-image-container,
.features-container-left.show .features-image-container {
  opacity: 1;
  transform: translate(0, 0);
}

.features-container-right.show .features-content-box,
.features-container-left.show .features-content-box {
  opacity: 1;
  transform: translate(0, 0);
}

.features-container-right .features-content-box {
  transform: translate(-100%);
}

.features-container-left .features-content-box {
  transform: translate(100%);
}

.features-container-right .features-image-container {
  transform: translate(100%);
}

.features-container-left .features-image-container {
  transform: translate(-100%);
}

.features-container-right.show .features-image-container,
.features-container-left.show .features-image-container {
  opacity: 1;
  transform: translate(0, 0);
}

/* ---------------------------------------- */

/* features posts */

.featured-posts-main-container {
  margin-top: 0 !important;
}

.featured-posts-view-all-btn {
  text-align: center;
  margin-top: 50px;
}

.featured-post-container {
  display: flex;
  background-color: #fff9f3 !important;
  border-radius: 30px;
  padding: 0 !important;
  border: none;
}

.featured-post-image img {
  border-radius: 30px 30px 0 0;
  max-width: 100%;
}

.featured-post-details-container {
  margin-top: 0;
}

.featured-post-details-container {
  padding: 24px;
  text-align: left;
  background: white;
  min-height: 300px;
  display: flex;
  flex-direction: column;
  border-radius: 0 0 30px 30px;
}

.featured-post-category a {
  text-align: left;
  text-decoration: none;
  font-weight: 600;
}

.featured-post-title {
  text-align: left;
  font-weight: 700;
  min-height: 90px;
}

.featured-post-excerpt {
  font-size: 16px;
  flex-grow: 1;
}

.featured-post-author-logo img {
  width: 48px;
  height: 48px;
}

.featured-post-info-container {
  gap: 16px;
}

.featured-post-author-name {
  font-size: 14px;
  font-weight: 600;
}

.featured-post-date {
  margin-top: 0.25rem;
}

.heading-margin-bottom {
  margin-bottom: 144px;
}

.heading-date {
  color: white;
}

.wp-block-post-title {
  text-align: center;
}

/* ---------------------------------------- */

/* single-post */

.single-post-intro-container img {
  width: 48px;
  height: 48px;
}

.single-post-intro-container .wp-block-post-date {
  margin-top: 0.35rem;
  font-weight: 300;
}

.single-post-container .wp-post-image {
  border-radius: 30px;
}

.wp-post-image {
  min-height: 287px;
}

.wp-block-jetpack-sharing-buttons-first {
  justify-content: end;
  gap: 4px;
}

.wp-block-jetpack-sharing-buttons li a {
  background: none;
  box-shadow: none;
  /* padding-right: 4px !important; */
  padding: 0 !important;
}

.wp-block-jetpack-sharing-buttons li a:hover {
  box-shadow: none !important;
}

.wp-block-jetpack-sharing-buttons li a svg {
  transition: transform 0.2s ease;
}

.wp-block-jetpack-sharing-buttons li a svg:hover {
  transform: scale(1.1);
}

.single-post-container .entry-content {
  padding-left: 24px;
  padding-right: 24px;
  font-size: 1rem;
  margin-top: 2rem;
}

.single-post-content .wp-block-post-terms {
  margin-top: 72px;
}

.single-post-content .wp-block-post-terms a {
  padding: 4px 8px;
  background: #ffffff99;
  border-radius: 30px;
  font-weight: 400;
}

.single-post-container .wp-block-separator {
  color: #000;
  margin: 72px 0;
}

.single-post-container .post-author-logo img {
  width: 48px;
  height: 48px;
}

.single-post-container .post-author-name {
  font-weight: 700;
}

/* ---------------------------------------- */

/* subscribe */

.wp-block-jetpack-subscriptions__form-elements {
  gap: 16px;
}

#subscribe-email input {
  border-radius: 16px !important;
  border-end-end-radius: 16px !important;
  border-start-end-radius: 16px !important;
  background: none;
  border-color: #000;
  font-size: 16px;
}

.is-style-compact .is-not-subscriber p#subscribe-email input[type="email"] {
  border-end-end-radius: 16px !important;
  border-start-end-radius: 16px !important;
}

#subscribe-submit button {
  border-radius: 24px !important;
}

#subscribe-submit button:hover {
  background: #ffffff;
  color: #000;
}

/* ---------------------------------------- */

/* contact us */

.contact-us .form {
  background: #ffffff;
  border-radius: 30px;
  padding: 24px;
  color: #000 !important;
}

.contact-us .wp-block-cover__inner-container {
  max-width: 1340px;
  display: flex;
}

.contact-us label,
::placeholder {
  font-weight: 400 !important;
  font-size: 1rem !important;
}

.contact-us .wp-block-button {
  text-align: center;
  justify-content: center;
  align-self: center;
}

.contact-us .wp-block-jetpack-contact-form input,
textarea {
  border-radius: 16px;
  background: none;
  border-color: #000;
  font-size: 16px;
}

/* ---------------------------------------- */

/* footer */

.footer-rights {
  margin-top: 20px;
}

.footer-rights nav ul li a {
  font-size: 14px !important;
  font-weight: 400 !important;
}

.wp-block-social-links {
  align-items: center !important;
}

.aa {
  border: 1px red solid;
}
/* ---------------------------------------- */

/* animations */

/* animations for title*/

.main-title {
  position: relative;  
  overflow: hidden; /* Скрываем текст за пределами блока */
}

.line {
  display: block;
  font-family: inherit;
  opacity: 0; /* Изначально скрываем текст */
  transform: translateY(0); /* Подготовка для анимации */
  animation-fill-mode: forwards; /* Сохраняем конечное состояние анимации */
}

.line-1 {
  animation: slideUp 0.5s ease-out 0.3s forwards; /* Анимация для первой строки */
  padding-bottom: 0;
}

.line-2 {
  animation: slideDown 0.5s ease-out 0.7s forwards; /* Анимация для второй строки */
}

@keyframes slideUp {
  0% {
    opacity: 0;
    transform: translateY(70%);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideDown {
  0% {
    opacity: 0;
    transform: translateY(-70%);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Scroll animation */

.animate-on-scroll {
  position: relative;
  transform: translateY(70px);
  transition: transform 0.3s ease-out;
  transition-delay: 0.2s;
  /* transition-delay: 0.3s;
  transition-duration: 0.7s;
  transition-timing-function: ease-out;
  transition-property: transform, opacity; */
}

.hidden-before-animation {
  opacity: 0;
  transition-property: opacity, transform;
}

.animate-delay-2.show {
  transition-delay: 0.4s;
}

.animate-delay-3.show {
  transition-delay: 0.6s;
}

.hidden-before-animation.bottom-position,
.hidden-before-animation.top-position {
  opacity: 0;
}

.animate-on-scroll.bottom-position {
  transform: translateY(-70px);
}

.animate-on-scroll.top-position {
  transform: translateY(70px);
}

.animate-on-scroll.show {
  transform: translateY(0);
  opacity: 1;
  transition-duration: 0.7s;
}

/* Scroll animation */

.animate-slide-in {
  transform: translateX(-100%); /* Начальное положение — слева за экраном */
  opacity: 0; /* Прозрачность */
  transition: transform 0.7s ease-out, opacity 0.8s ease-out; /* Плавный переход */
}

.animate-slide-in.visible {
  transform: translateX(0); /* Возвращаем в исходное положение */
  opacity: 1; /* Делаем видимым */
}

/* ---------------------------------------- */

/* for tablet */

@media (max-width: 782px) {
  .features-content-box {
    position: relative;
  }
  .features-container-left {
    flex-direction: column-reverse;
  }
  .wp-block-column div,
  .wp-block-column,
  .wp-block-column ul {
    text-align: center;
    justify-content: center;
  }

  .review-info div:nth-child(2) {
    border-right: none;
  }
}

/* ---------------------------------------- */

.has-modal-open .wp-block-navigation__responsive-dialog {
  padding: 50px;
}

.wp-block-navigation__responsive-container-close {
  right: 40px;
  top: 40px;
}

.featured-post-image-container{
  min-height: 287px;
  background-image: url("assets/images/post_featured_empty.png");
  background-size: cover;
  border-radius: 30px 30px 0 0;
}

.footer-container {
  background-color: #FFE9D2;  
}

.contact-info-group {
  margin-bottom: 2.5em;
}

.contact-info-group figure img {
  max-width: inherit;
}

:where(.wp-site-blocks) > * {
  margin-block-start: 0;
  margin-block-end: 0;
}

.wp-block-post-content-is-layout-constrained img {
    width: 100%;
}

.blog-heading-category, .heading-author-name {
    color: #ffffff;
}

:root :where(.wp-block-social-links .wp-social-link a) {
  padding: 0;
}

@media (max-width: 920px) {
  .wp-block-navigation__responsive-container-open {
    display: block !important;
  }

  /*.wp-block-navigation__responsive-container {
    display: none !important;
  }*/

   .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
    display: none !important;
   }
}

@media (min-width: 919px) {
  .wp-block-navigation__responsive-container-open {
    display: none !important;
  }

  .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
    background-color:inherit;
    display:block;
    position:relative;
    width:100%;
    z-index:auto
  }
  .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) .wp-block-navigation__responsive-container-close {
    display:none
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container.wp-block-navigation__submenu-container.wp-block-navigation__submenu-container {
    left:0
  }
}