/* The original site relied on the slidesjs jQuery plugin to reveal the slider
   after initialization; the React slider renders ready-made markup instead. */
.slides {
  display: block;
}
.slides picture.slide-hidden {
  display: none;
}
/* Обёртка <picture> тоже должна иметь размеры: у img стоит height:100%, а эти
   100% считаются от <picture>, а не от .office__image. Инлайновый <picture>
   высоты не даёт — Blink это прощает, WebKit нет, и в Safari миниатюра
   кадрировалась от собственного размера файла (сильный зум). На странице
   здания размеры picture заданы давно, в листинге про обёртку забыли. */
.slides picture { display: block; width: 100%; height: 100%; }
.slides img.image__content {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.slidesjs-previous.slidesjs-navigation,
.slidesjs-next.slidesjs-navigation {
  display: block;
}

/* State classes replacing the inline styles the legacy jQuery code toggled */
.ui.flowing.popup.popup-open {
  display: block;
}
@media only screen and (max-width: 768px) {
  .description__search.search-open {
    display: block;
  }
}

/* Mapbox canvas fills the map panel */
.map-canvas {
  width: 100%;
  height: 100%;
}

/* FormSubmit honeypot field */
.honey-field {
  display: none;
}

/* Justified copy in the SEO text block (was inline style="text-align:justify") */
.first-page-text-block__text h1,
.first-page-text-block__text h2,
.first-page-text-block__text h3,
.first-page-text-block__text h4,
.first-page-text-block__text h5,
.first-page-text-block__text p {
  text-align: justify;
}

/* ---- Building page (one_office) additions ---- */
.open-office__picture .slides picture,
.open-office__picture .slides img.slider-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.open-office__picture .slides picture.slide-hidden {
  display: none;
}
.picture__dots-wrapper {
  position: absolute;
  bottom: 17px;
  width: 100%;
  text-align: center;
  z-index: 1000;
}
.picture__dots .dots__image {
  display: inline-block;
  background: grey;
  border-radius: 50%;
  height: 9px;
  width: 9px;
  margin: 5px 7px;
  opacity: 0.75;
  cursor: pointer;
  font-size: 0;
}
.picture__dots .dots__image.active {
  background: #fff;
}
/* map block under the building info */
.building-page-map .description__map-wrapper {
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  width: 100%;
  height: 480px;
  min-height: 480px;
}
.building-page-map .description__map {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.building-page-map .search_buildings {
  top: 12px;
  left: 12px;
}

/* ---- Address / building autocomplete suggestions ---- */
.search_buildings__result {
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
  max-height: 320px;
  overflow-y: auto;
  text-align: left;
}
.search_buildings__result_item {
  padding: 9px 12px;
  cursor: pointer;
  border-bottom: 1px solid #eee;
}
.search_buildings__result_item:hover {
  background: #f5f5f5;
}
.search_buildings__result_item_title {
  display: block;
  font-weight: 700;
  color: #252729;
}
.search_buildings__result_item_address {
  display: block;
  font-size: 13px;
  color: #777;
}

/* intl-tel-input inside semantic ui input */
.feedback__item .ui.input .iti {
  width: 100%;
}

/* ---- Header tagline (replaces "Commission 0%") ---- */
.commission_info__text.header__tagline {
  display: inline-block;
  max-width: 620px;
  white-space: normal;
  font-size: 12px;
  line-height: 1.4;
  text-align: right;
}
@media only screen and (max-width: 768px) {
  .commission_info__text.header__tagline {
    display: none;
  }
}

/* ---- Office type filter popup ---- */
.office-type-popup {
  min-width: 265px;
}
.office-type-options {
  display: block;
  text-align: left;
}
.office-type-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 4px;
  cursor: pointer;
  font-size: 14px;
  color: #252729;
}
.office-type-option:hover {
  background: #f5f5f5;
}
.office-type-option input {
  accent-color: #f0b64c;
}

/* ---- Brand-gold agreement links ---- */
.feedback__agreement a,
.form__agreement_text a,
.contact-block__agreement-link a {
  color: #f0b64c;
}
.feedback__agreement a:hover,
.form__agreement_text a:hover,
.contact-block__agreement-link a:hover {
  color: #f5c96e;
}

/* ---- Homepage-style footer: contact block ---- */
.footer.footer-home {
  background: #fff;
  color: #313131;
  padding: 0;
}
.contact-block {
  background: #fff;
  padding: 56px 15px 40px;
  text-align: center;
  font-family: Roboto, Arial, Helvetica, sans-serif;
}
.contact-block .wrapper {
  max-width: 1200px;
  margin: 0 auto;
}
.contact-block h6 {
  font-size: 26px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: #313131;
  margin: 0 0 18px;
}
.contact-block__agreement {
  font-size: 14px;
  color: #555;
}
.contact-block__agreement-link {
  font-size: 14px;
  margin: 4px 0 26px;
}
.contact-block .feedback__form {
  display: flex;
  align-items: stretch;
  justify-content: center;
  max-width: 1060px;
  margin: 0 auto;
  border: 2px solid #f0b64c;
}
.contact-block .feedback__item {
  flex: 1 1 0;
  margin: 0;
  background: #f0b64c;
  border-right: 1px solid rgba(255, 255, 255, 0.55);
}
.contact-block .feedback__item.feedback__buttom {
  flex: 0 0 170px;
  background: #4a4a4a;
  border-right: none;
}
.contact-block .feedback__item .ui.input {
  width: 100%;
  height: 100%;
}
.contact-block .feedback__item input.item__content {
  width: 100%;
  height: 56px;
  border: none;
  border-radius: 0;
  background: transparent;
  color: #fff;
  font-size: 14px;
  letter-spacing: 0.5px;
  text-align: center;
  text-transform: uppercase;
}
.contact-block .feedback__item input.item__content::placeholder {
  color: rgba(255, 255, 255, 0.95);
  text-transform: uppercase;
}
.contact-block .feedback__buttom button.ui.black.button {
  width: 100%;
  height: 56px;
  margin: 0;
  border-radius: 0;
  background: #4a4a4a;
  color: #fff;
  font-size: 15px;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.contact-block .feedback__buttom button.ui.black.button:hover {
  background: #3a3a3a;
}
/* intl-tel-input inside the yellow bar */
.contact-block .feedback__item .iti {
  width: 100%;
  height: 56px;
  display: flex;
  align-items: center;
}
.contact-block .feedback__item .iti input.item__content {
  height: 56px;
  text-align: left;
  padding-left: 8px;
}
.contact-block .feedback__item .iti__selected-dial-code,
.contact-block .feedback__item .iti__selected-country {
  color: #fff;
}
.contact-block .feedback__item .iti__dropdown-content {
  color: #313131;
  text-align: left;
}
@media only screen and (max-width: 900px) {
  .contact-block .feedback__form {
    flex-direction: column;
    border: none;
  }
  .contact-block .feedback__item {
    border-right: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.55);
  }
  .contact-block .feedback__item.feedback__buttom {
    flex-basis: auto;
  }
}

/* ---- Homepage-style footer: popular cities ---- */
.footer-block {
  background: #fff;
  padding: 30px 20px 24px;
  font-family: Roboto, Arial, Helvetica, sans-serif;
  text-align: left;
}
.footer-block .grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px 26px;
  max-width: 1420px;
  margin: 0 auto;
}
.footer-block .country {
  color: #f0b64c;
  font-size: 17px;
  font-weight: 700;
  margin: 22px 0 12px;
}
.footer-block .card-city {
  display: inline-block;
  color: #5a5a5a;
  font-size: 13.5px;
  line-height: 1.95;
  text-decoration: none;
}
.footer-block .card-city:hover {
  color: #f0b64c;
}
.copyright-home {
  max-width: 1420px;
  margin: 34px auto 0;
  text-align: center;
  color: #f0b64c;
  font-size: 12.5px;
  line-height: 1.5;
}
@media only screen and (max-width: 1100px) {
  .footer-block .grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (max-width: 640px) {
  .footer-block .grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* phone field inside the dark building-page form keeps its height */
.form__inner .feedback__item .iti {
  width: 100%;
}
.form__inner .feedback__item .iti input.item__content {
  width: 100%;
}

/* show the suggestions dropdown when it has matches (original CSS hides it) */
.search_buildings__result.result-open {
  display: block;
}

/* ---- Search filters: equal-width grid so rows line up ---- */
.description__search .ui.form.flex-align {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
  align-items: stretch;
}
.description__search .ui.form.flex-align .filter__item {
  width: 100%;
  margin: 0;
  padding: 0;
}
.description__search .ui.form.flex-align .filter__item .ui.input,
.description__search .ui.form.flex-align .filter__item .ui.input > button {
  width: 100%;
}
.description__search .ui.form.flex-align .filter__buttom {
  grid-column: 1 / -1;
}
.description__search .ui.form.flex-align .filter__buttom .submit-search-form {
  width: 100%;
}
@media only screen and (max-width: 480px) {
  .description__search .ui.form.flex-align {
    grid-template-columns: 1fr;
  }
}

/* ---- CTA banner under the office list ---- */
.contact-block.search-banner {
  padding: 34px 0 10px;
  border-top: 1px solid #eee;
  margin-top: 10px;
}
.contact-block.search-banner h6 {
  font-size: 21px;
}
.contact-block.search-banner .feedback__form {
  max-width: 100%;
}
.contact-block.search-banner .feedback__item input.item__content {
  font-size: 12.5px;
}

/* ---- Business articles block ---- */
.news-block {
  background: #fff;
  padding: 48px 20px 20px;
  font-family: Roboto, Arial, Helvetica, sans-serif;
}
.news-block .wrapper {
  max-width: 1420px;
  margin: 0 auto;
}
.news-block h2 {
  text-align: center;
  font-size: 26px;
  color: #313131;
  margin: 0 0 28px;
}
.news-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}
.card-news {
  display: block;
  text-decoration: none;
  color: #313131;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
  overflow: hidden;
}
.card-news img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  display: block;
}
.card-news .news-wrap {
  padding: 12px 14px 16px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
}
.card-news:hover .news-wrap {
  color: #f0b64c;
}
@media only screen and (max-width: 1100px) {
  .news-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (max-width: 640px) {
  .news-grid {
    grid-template-columns: 1fr;
  }
}

/* ---- FAQ block ---- */
.faq-block {
  background: #fff;
  padding: 40px 20px 56px;
  font-family: Roboto, Arial, Helvetica, sans-serif;
}
.faq-block .wrapper {
  max-width: 900px;
  margin: 0 auto;
}
.faq-block h2 {
  text-align: center;
  font-size: 26px;
  color: #313131;
  margin: 0 0 26px;
}
.faq-item {
  border-bottom: 1px solid #e5e5e5;
}
.faq-item__question {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  background: none;
  border: none;
  padding: 16px 4px;
  font-size: 16.5px;
  font-weight: 700;
  color: #313131;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
}
.faq-item__question:hover {
  color: #f0b64c;
}
.faq-item__question .icon {
  transition: transform 0.2s ease;
}
.faq-item--open .faq-item__question .icon {
  transform: rotate(180deg);
}
.faq-item__answer {
  display: none;
  padding: 0 4px 18px;
  color: #555;
  font-size: 15px;
  line-height: 1.6;
}
.faq-item--open .faq-item__answer {
  display: block;
}

/* full-width sections must paint above the fixed map panel */
.news-block,
.faq-block,
.footer.footer-home {
  position: relative;
  z-index: 5;
}

/* ---- Round of design tweaks ---- */
/* header tagline: bigger, brand gold, vertically centered in the header */
.header .container {
  position: relative;
}
.header .header__menu {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  float: none;
  width: 44%;
  text-align: center;
}
.commission_info__text.header__tagline {
  color: #f0b64c;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  max-width: none;
  text-align: center;
  padding-left: 0;
}

/* CTA banner: full listing width, wider phone cell */
.contact-block.search-banner .wrapper {
  max-width: 100%;
}
.contact-block.search-banner .feedback__form {
  max-width: 100%;
  width: 100%;
}
.contact-block .feedback__item.feedback__phone {
  flex: 1.7 1 0;
}
.contact-block.search-banner .feedback__item.feedback__buttom {
  flex: 0 0 130px;
}

/* Business articles: 3 per row, bigger previews, same width as the text block */
.news-block .wrapper {
  width: 80%;
  max-width: 1024px;
}
.news-grid {
  grid-template-columns: repeat(3, 1fr);
}
.card-news img {
  height: 210px;
}
@media only screen and (max-width: 900px) {
  .news-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 640px) {
  .news-grid {
    grid-template-columns: 1fr;
  }
}

/* building page feedback form: gray texts -> white */
.form__inner .form__description,
.form__inner .header__title-address {
  color: #fff;
}

/* footer typography matches the listing cards (Roboto) */
.footer.footer-home,
.footer.footer-home h6,
.footer.footer-home input,
.footer.footer-home button,
.footer-block .country,
.footer-block .card-city,
.copyright-home {
  font-family: Roboto, Arial, Helvetica, sans-serif;
}

/* center the tagline precisely: drop the empty menu list stub */
.header .header__menu .menu__list {
  display: none;
}
/* banner form spans the whole listing column */
.search-banner .feedback__row,
.search-banner .feedback__row form {
  width: 100%;
}

/* stronger selector: building form description must be white */
#sticky-form .form__inner .form-contents .form__description,
.form__inner .form__section .form__description {
  color: #fff;
}

/* ---- Footer form: solid white text and placeholders ---- */
.contact-block .feedback__item input.item__content {
  color: #fff;
}
.contact-block .feedback__item input.item__content::placeholder {
  color: #fff;
  opacity: 1;
}
.contact-block .feedback__item input.item__content::-webkit-input-placeholder {
  color: #fff;
  opacity: 1;
}

/* cities and agreement text use the same font as the descriptive text blocks */
.footer-block .card-city,
.contact-block__agreement,
.contact-block__agreement-link {
  font-family: 'Avenir Next', Roboto, Arial, Helvetica, sans-serif;
}

/* ---- intl-tel-input: dropdown as wide as the whole phone cell ---- */
.feedback__item .iti {
  position: relative;
}
.feedback__item .iti .iti__dropdown-content {
  width: 100%;
  min-width: 240px;
}

/* dial code matches the placeholder color in the dark building form */
.form__inner .feedback__item .iti__selected-dial-code {
  color: #c4c3c3;
}

/* footer.css sets gray placeholders with higher specificity — force white
   text and placeholders inside the yellow forms */
.contact-block .feedback__form .feedback__item .ui.input input.item__content {
  color: #fff;
}
.contact-block .feedback__form .feedback__item .ui.input input.item__content::placeholder {
  color: #fff !important;
  opacity: 1;
}
.contact-block .feedback__form .feedback__item .ui.input input.item__content::-webkit-input-placeholder {
  color: #fff !important;
  opacity: 1;
}
.contact-block .feedback__item .iti__selected-dial-code {
  color: #fff;
}

/* typed text in the yellow forms stays on the orange field in white
   (Дарья 04.08.2026: поля не должны белеть при вводе) */
.contact-block .feedback__form .feedback__item .ui.input input.item__content {
  caret-color: #fff;
}
.contact-block .feedback__form .feedback__item .ui.input input.item__content:not(:placeholder-shown) {
  color: #fff;
}
.contact-block .feedback__form .feedback__item .ui.input input.item__content:-webkit-autofill,
.contact-block .feedback__form .feedback__item .ui.input input.item__content:-webkit-autofill:hover,
.contact-block .feedback__form .feedback__item .ui.input input.item__content:-webkit-autofill:focus {
  -webkit-text-fill-color: #fff;
  -webkit-box-shadow: 0 0 0 1000px #f0b64c inset;
  box-shadow: 0 0 0 1000px #f0b64c inset;
}

/* mobile: stacked yellow-form fields take the full width */
@media only screen and (max-width: 900px) {
  .contact-block .feedback__form .feedback__item,
  .contact-block .feedback__form .feedback__item.feedback__buttom {
    width: 100%;
    flex: 0 0 auto;
  }
}

/* ---- Branded "request sent" toast ---- */
.thankyou-toast {
  position: fixed;
  top: 78px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3000;
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: 92%;
  background: #303030;
  border: 2px solid #f0b64c;
  color: #fff;
  padding: 14px 22px;
  font-family: Roboto, Arial, Helvetica, sans-serif;
  font-size: 15px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35);
  cursor: pointer;
  animation: thankyou-in 0.35s ease;
}
.thankyou-toast__check {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #f0b64c;
  color: #303030;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
@keyframes thankyou-in {
  from {
    opacity: 0;
    transform: translate(-50%, -12px);
  }
  to {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}

/* FAQ uses the same font as the footer city links */
.faq-block,
.faq-block h2,
.faq-item__question,
.faq-item__answer {
  font-family: 'Avenir Next', Roboto, Arial, Helvetica, sans-serif;
}

/* articles block and footer region headings share the same font */
.news-block h2,
.card-news .news-wrap,
.footer-block .country {
  font-family: 'Avenir Next', Roboto, Arial, Helvetica, sans-serif;
}

/* mobile office accordion: content toggling without semantic.js */
.ui.accordion.office-list .content {
  display: none;
}
.ui.accordion.office-list .content.active {
  display: block;
  margin-bottom: 1rem;
}
.ui.accordion.office-list .title {
  cursor: pointer;
}
.ui.accordion.office-list .title .title__column {
  display: table-cell;
  vertical-align: middle;
}
/* detail table styling comes from one_office.css (original) */
.ui.accordion.office-list .card__table {
  width: 100%;
}

/* country search field: keep the caret clear of the magnifier icon */
.iti__search-input {
  padding-left: 34px !important;
}

/* expanded office row: gold background + white circle arrow (as on the
   original site) */
.open-office__content .open-office__info .ui.accordion.office-list .title.active {
  background: #f0b64c;
}
.open-office__content .open-office__info .ui.accordion.office-list .title.active .arrow-icon {
  background-color: #fff;
  border-color: #fff;
  color: #f0b64c;
}
.ui.accordion.office-list .content.active .card {
  background: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
  padding: 14px 18px;
}

/* ---- Article page (/news/{slug}/) ---- */
.article-page {
  background: #fff;
  padding: 40px 20px 30px;
  font-family: Roboto, Arial, Helvetica, sans-serif;
}
.article-page .wrapper {
  max-width: 1024px;
  width: 90%;
  margin: 0 auto;
  text-align: left;
}
.article-page .ui.breadcrumb {
  margin-bottom: 20px;
}
.article-page__body {
  width: 100% !important;
}
.article-page__body h1 {
  font-size: 30px;
  margin-bottom: 18px;
}
.article-page__body h2,
.article-page__body h3 {
  margin: 22px 0 10px;
}
.article-page__body p {
  margin: 0 0 12px;
  line-height: 1.65;
}
.article-page__body ul,
.article-page__body ol {
  margin: 0 0 12px 22px;
}
.article-page__body ul {
  list-style: disc outside;
}
.article-page__body ol {
  list-style: decimal outside;
}
.article-page__body li {
  margin-bottom: 6px;
  line-height: 1.6;
}
.article-page__banner {
  margin-top: 30px;
}
.news-grid .card-news img {
  height: 210px;
  width: 100%;
  object-fit: cover;
  display: block;
}

/* Подвал: районы и метро вместо синих ссылок городов */
.footer .card-city { color: #444; }
.footer .card-city:hover { color: #f0b64c; }
.footer .country { color: #121212; }

/* ===== Только оранжевый фокус/подсветка, синее убрано ===== */
:focus, :focus-visible { outline-color: #f0b64c !important; }
.ui.input.focus > input, .ui.input > input:focus,
input:focus, textarea:focus, select:focus,
.item__content:focus, .hub-hero__field:focus, .mms__search:focus {
  border-color: #f0b64c !important;
  box-shadow: 0 0 0 1px rgba(237,174,73,.35) !important;
  outline: none !important;
}
/* Синие ссылки крошек/секций → оранжевый */
.ui.breadcrumb a, .ui.breadcrumb a.section, a.section { color: #f0b64c !important; }
.ui.breadcrumb a:hover, a.section:hover { color: #f0b64c !important; }
/* Пагинация: текущая страница — оранжевая, не синяя */
.description__pagination_controls_current,
.pagination_controls_current { border-bottom-color: #f0b64c !important; color: #313131 !important; }
.description__pagination_controls_page:hover { color: #f0b64c !important; }
/* Semantic UI синие акценты → оранжевые */
.ui.button:focus, .ui.button:active { background-color: #f5c96e; }
.ui.input.focus > input, .ui.input > input:focus { border-color: #f0b64c !important; }

/* ---- Почта в подвале (перенесена из шапки, 22.07.2026) ---- */
.footer__contacts { text-align: center; padding: 18px 0 0; }
.footer__contacts-mail { color: #ffb020; font-size: 15px; font-weight: 600; text-decoration: none; }
.footer__contacts-mail:hover { color: #ffc94d; text-decoration: underline; }

/* ==== Hero-форма: единые кнопки «Площадь» и «Цена» с попапами (как в Пхукете) ==== */
.hub-hero__pop { position: relative; }
.hub-hero__field.hub-hero__pop { padding: 0; border: 0; background: transparent; min-height: 0; }
.hub-hero__popbtn {
  width: 100%; height: 44px; min-height: 44px;
  background: #fff; border: 2px solid #fff; border-radius: 4px;
  padding: 0 14px; font-size: 1rem; color: #757575;
  text-align: left; cursor: pointer;
  font-family: inherit; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.hub-hero__popbtn:hover { color: #555; }
.hub-hero__popup {
  /* попап ровно по ширине своей кнопки */
  position: absolute; z-index: 60; top: calc(100% + 8px); left: 0; right: 0;
  width: auto; min-width: 0; background: #fff; border-radius: 10px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.24); padding: 14px; text-align: left;
}
/* цене нужен простор под ползунок: не уже кнопки, но и не менее 320px */
.hub-hero__popup--wide { right: auto; width: 320px; min-width: 100%; }
@media (max-width: 768px) {
  .hub-hero__popup,
  .hub-hero__popup--wide { left: 0; right: 0; width: auto; min-width: 0; padding: 14px; }
  .hub-hero__popup .phk-price__num { min-width: 0; }
}

/* ==== Диапазон цены: двойной ползунок ==== */
.phk-price__inputs { display: flex; align-items: center; gap: 8px; }
.phk-price__num {
  flex: 1; min-width: 0; padding: 9px 10px; border: 1.5px solid #e4dcc9;
  border-radius: 8px; font-size: 14px; outline: none;
}
.phk-price__num:focus { border-color: #edae49; }
.phk-price__dash, .phk-price__unit { color: #999; font-size: 14px; white-space: nowrap; }
.phk-price__slider { position: relative; height: 26px; margin: 16px 2px 4px; }
.phk-price--compact .phk-price__slider { margin: 10px 2px 2px; }
.phk-price__slider::before {
  content: ''; position: absolute; left: 0; right: 0; top: 11px;
  height: 4px; background: #ece4d3; border-radius: 2px;
}
.phk-price__track { position: absolute; top: 11px; height: 4px; background: #edae49; border-radius: 2px; }
.phk-price__range {
  position: absolute; left: 0; width: 100%; top: 0; height: 26px;
  -webkit-appearance: none; appearance: none; background: none; pointer-events: none; margin: 0;
}
.phk-price__range::-webkit-slider-thumb {
  -webkit-appearance: none; pointer-events: auto;
  width: 20px; height: 20px; border-radius: 50%;
  background: #fff; border: 3px solid #edae49; cursor: pointer;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}
.phk-price__range::-moz-range-thumb {
  pointer-events: auto; width: 20px; height: 20px; border-radius: 50%;
  background: #fff; border: 3px solid #edae49; cursor: pointer;
}
.phk-price__legend { display: flex; justify-content: space-between; font-size: 13px; color: #8a8a8a; }
.price-popup .phk-price { margin-top: 6px; }

/* ==== Попапы фильтров листинга — ровно по ширине своей кнопки ==== */
.filter__item .ui.input { position: relative; }
.filter__item .ui.flowing.popup.square-popup,
.filter__item .ui.flowing.popup.people-popup,
.filter__item .ui.flowing.popup.office-type-popup {
  left: 0; right: 0; width: auto; min-width: 0; max-width: none;
}
/* попап цены — ровно по ширине своей кнопки */
.filter__item .ui.flowing.popup.price-popup {
  left: 0; right: 0; width: auto; min-width: 0; max-width: none;
}
.filter__item .ui.flowing.popup .popup-inputs { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.filter__item .ui.flowing.popup .popup-inputs__square,
.filter__item .ui.flowing.popup .popup-inputs__people,
.filter__item .ui.flowing.popup .popup-inputs__price { flex: 1 1 0; min-width: 0; }

/* ==== Поиск по названию/адресу в форме на главной ==== */
.hub-hero__field.hub-hero__query {
  position: relative; padding: 0; border: 0; background: transparent; min-height: 0;
}
.hub-hero__query-input {
  width: 100%; height: 44px; min-height: 44px;
  background: #fff; border: 2px solid #fff; border-radius: 4px;
  padding: 0 14px; font-size: 1rem; color: #757575; font-family: inherit; outline: none;
}
.hub-hero__query-input::placeholder { color: #757575; opacity: 1; }
.hub-hero__query-input:focus { border-color: #edae49; }
.hub-hero__suggest {
  /* шире поля, чтобы адрес не ломался на три строки; прижат к правому краю */
  position: absolute; z-index: 60; top: calc(100% + 6px); left: auto; right: 0;
  min-width: 320px;
  background: #fff; border-radius: 10px; box-shadow: 0 12px 34px rgba(0, 0, 0, 0.24);
  overflow: hidden; text-align: left; max-height: 320px; overflow-y: auto;
}
.hub-hero__suggest .query-suggest__item {
  display: block; padding: 10px 14px; color: #333; text-decoration: none;
  border-bottom: 1px solid #f1eee7;
}
.hub-hero__suggest .query-suggest__item:last-child { border-bottom: none; }
.hub-hero__suggest .query-suggest__item:hover { background: #fdf6e8; }
.hub-hero__suggest .query-suggest__name { display: block; font-weight: 700; font-size: 14px; }
.hub-hero__suggest .query-suggest__addr { display: block; font-size: 12px; color: #8a8a8a; }

/* попап площади: поля пошире + переключатель ft²/m² */
.hub-hero__popup--size { left: 0; right: auto; width: 280px; min-width: 100%; }
.hub-hero__popup--size .phk-price__num { padding: 10px 12px; font-size: 15px; }
.hub-hero__units { display: flex; gap: 6px; margin-top: 10px; }
.hub-hero__unit {
  flex: 1; padding: 7px 0; border: 1.5px solid #e4dcc9; background: #fff;
  border-radius: 8px; font-size: 14px; font-weight: 700; color: #777; cursor: pointer;
  font-family: inherit;
}
.hub-hero__unit--on { background: #edae49; border-color: #edae49; color: #fff; }


/* поле «Адрес или БЦ» — шире остальных, шрифт как у District/Metro */
.hub-hero__field.hub-hero__query { flex: 1.9 1 260px; max-width: 340px; }
.hub-hero__query-input {
  font-size: 1rem; /* как .hub-hero__field / .mms__btn */
  text-overflow: ellipsis;
}

/* ползунок цены в попапе листинга — отдельной строкой на всю ширину */
.price-popup__range { width: 100%; margin-top: 12px; }
.price-popup__range .phk-price__legend { margin-top: 2px; }

/* ползунок цены: убираем синюю рамку Semantic UI, фокус — фирменный оранжевый */
.phk-price__range,
.phk-price__range:focus,
.phk-price__range:active,
.price-popup__range input[type='range'],
.price-popup__range input[type='range']:focus {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: none !important;
  padding: 0 !important;
}
.phk-price__slider { border: none !important; box-shadow: none !important; }
.phk-price__range:focus::-webkit-slider-thumb { border-color: #edae49; box-shadow: 0 0 0 4px rgba(237, 174, 73, 0.25); }
.phk-price__range:focus::-moz-range-thumb { border-color: #edae49; box-shadow: 0 0 0 4px rgba(237, 174, 73, 0.25); }

/* попапы фильтров — точно по ширине кнопки (учитываем рамку и padding) */
.filter__item .ui.flowing.popup,
.search__item .ui.flowing.popup { box-sizing: border-box; }

/* ==== Попапы фильтров: все выровнены по своей кнопке, текст слева ==== */
.js-square-popup, .js-people-popup, .js-office-type-popup, .js-price-popup,
.square-popup, .people-popup, .office-type-popup, .price-popup {
  left: 0 !important;
  right: 0 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  box-sizing: border-box !important;
  text-align: left !important;
}
/* ==== Ползунок цены: видимая полоса и заметные бегунки ==== */
.phk-price__slider::before { background: #e3dcd0 !important; }
.phk-price__track { background: #edae49 !important; height: 5px !important; top: 10px !important; }
.phk-price__slider::before { height: 5px !important; top: 10px !important; }
.phk-price__range { background: transparent !important; -webkit-appearance: none !important; }
.phk-price__range::-webkit-slider-runnable-track { background: transparent; height: 26px; }
.phk-price__range::-moz-range-track { background: transparent; height: 26px; }
.phk-price__range::-webkit-slider-thumb {
  -webkit-appearance: none; pointer-events: auto;
  width: 22px; height: 22px; border-radius: 50%;
  background: #edae49 !important; border: 3px solid #fff !important;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.35) !important; cursor: pointer;
}
.phk-price__range::-moz-range-thumb {
  pointer-events: auto; width: 22px; height: 22px; border-radius: 50%;
  background: #edae49 !important; border: 3px solid #fff !important;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.35) !important; cursor: pointer;
}

/* ==== Попапы фильтров листинга — строго по ширине своей кнопки ====
   перекрываем offices.css (.filter__price .ui.input .price-popup {left:-2%!important})
   селектором большей специфичности */
.description__search .filter__item .ui.input .square-popup,
.description__search .filter__item .ui.input .people-popup,
.description__search .filter__item .ui.input .office-type-popup,
.description__search .filter__item .ui.input .price-popup,
.description__search .filter__item .ui.input .js-square-popup,
.description__search .filter__item .ui.input .js-people-popup,
.description__search .filter__item .ui.input .js-office-type-popup,
.description__search .filter__item .ui.input .js-price-popup {
  left: 0 !important;
  right: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin-left: 0 !important;
  transform: none !important;
  box-sizing: border-box !important;
}

/* заголовки в описании здания — жирные тегом (после удаления лишних <strong>).
   Текст заголовков обёрнут в <span><span>, и правило на span (400) перебивало
   наследуемый 700 — поэтому целимся и в сами заголовки, и во все их потомки. */
.building__description h1,
.building__description h2,
.building__description h3,
.building__description h4,
.building__description h5,
.building__description h6,
.building__description h1 *,
.building__description h2 *,
.building__description h3 *,
.building__description h4 *,
.building__description h5 *,
.building__description h6 * { font-weight: 700 !important; }

/* ==== Форма хаба: сетка, Find под Size+Price по их левому/правому краю ==== */
@media (min-width: 880px) {
  .hub-hero__form {
    display: grid !important;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
    align-items: start;
    justify-content: stretch;
  }
  .hub-hero__form > * { max-width: none !important; min-width: 0 !important; width: 100% !important; margin: 0 !important; }
  .hub-hero__form > *:nth-child(1) { grid-column: 1; }        /* District */
  .hub-hero__form > *:nth-child(2) { grid-column: 2; }        /* Metro */
  .hub-hero__form > *:nth-child(3) { grid-column: 3; }        /* Size */
  .hub-hero__form > *:nth-child(4) { grid-column: 4; }        /* Price */
  .hub-hero__form > .hub-hero__query { grid-column: 5 / 7; }  /* Адрес — на 2 колонки */
  .hub-hero__form > .hub-hero__find { grid-column: 3 / 5; grid-row: 2; } /* Find ровно под Size+Price */
}

/* ==== Ряд иконок-типов офисов на hero (LoopNet-style) ==== */
.hub-types {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 8px;
  margin: 0 auto 18px; max-width: 760px;
}
.hub-type {
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
  gap: 7px; width: 100px; padding: 12px 6px;
  border: 1.5px solid rgba(255, 255, 255, 0.55); border-radius: 10px;
  background: rgba(255, 255, 255, 0.1); color: #fff; font-family: inherit; cursor: pointer;
  text-align: center; transition: background 0.15s, border-color 0.15s, color 0.15s;
  -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
}
.hub-type:hover { background: rgba(255, 255, 255, 0.2); }
.hub-type--active { border-color: #edae49; background: rgba(237, 174, 73, 0.22); color: #edae49; }
.hub-type__icon { display: block; line-height: 0; }
.hub-type__icon svg { width: 30px; height: 30px; display: block; }
.hub-type__label { font-size: 12.5px; font-weight: 600; line-height: 1.2; }
@media (max-width: 768px) {
  .hub-types {
    flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start;
    -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 4px;
  }
  .hub-types::-webkit-scrollbar { display: none; }
  .hub-type { flex: 0 0 auto; width: 84px; padding: 10px 5px; }
  .hub-type__icon svg { width: 26px; height: 26px; }
  .hub-type__label { font-size: 11.5px; }
}

/* ==== SEO-текст под блоком «Metro stations» ==== */
.metro-seo { padding: 8px 0 24px; }
.metro-seo .wrapper { max-width: 1024px; margin: 0 auto; padding: 0 16px; }
/* размер как у основного seo-текста страницы [Дарья 02.08] */
.metro-seo__p { font-size: 14px; line-height: 1.65; color: #454545; margin: 0 0 12px; }
.metro-seo h2, .metro-seo h3 { font-size: 20px; }
.metro-seo__p strong { color: #222; }

/* ==== Popular searches: горизонтальный слайдер с оранжевым ползунком (как статьи) ==== */
.pop-searches__grid--slider {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 16px;
  padding-bottom: 14px;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: #f0b64c #ececec;
}
.pop-searches__grid--slider > .pop-searches__card {
  flex: 0 0 300px;
  max-width: 300px;
  scroll-snap-align: start;
}
.pop-searches__grid--slider::-webkit-scrollbar { height: 8px; }
.pop-searches__grid--slider::-webkit-scrollbar-track { background: #ececec; border-radius: 8px; }
.pop-searches__grid--slider::-webkit-scrollbar-thumb { background: #f0b64c; border-radius: 8px; }
.pop-searches__grid--slider::-webkit-scrollbar-thumb:hover { background: #f5c96e; }
@media (max-width: 640px) {
  .pop-searches__grid--slider > .pop-searches__card { flex-basis: 78vw; max-width: 78vw; }
}

/* Убрать синий шрифт ссылок во всех контентных блоках — фирменный оранжевый */
.news_article a,
.news_article__another_item_link,
.dk-seo a,
.dk-seo__anchor,
.districts-intro__name a,
.pop-searches__seo a,
.district-seo a,
.metro-seo a { color: #f0b64c !important; text-decoration: none; }
.news_article a:hover,
.news_article__another_item_link:hover,
.dk-seo a:hover,
.districts-intro__name a:hover,
.pop-searches__seo a:hover,
.district-seo a:hover { color: #f5c96e !important; text-decoration: underline; }


/* Office-type карточки: оранжевая подсветка при наведении (все города) [28.07.2026] */
.hub-type:hover { border-color: #f0b64c; background: rgba(240,182,76,0.20); color: #f0b64c; }

/* Ссылки в тексте описания здания — фирменный оранжевый, не синий (Дарья 28.07.2026) */
.building__description a { color: #f0b64c; }
.building__description a:hover { color: #f5c96e; }

/* Карточки «Другие статьи» с превью + hover заставки статьи (Дарья 28.07.2026) */
.news_article__another_items { display: flex; flex-direction: column; gap: 16px; }
.article-card { display: block; text-decoration: none; border-radius: 8px; overflow: hidden; background: #fff; box-shadow: 0 1px 6px rgba(0,0,0,.10); transition: box-shadow .15s, transform .15s; }
.article-card:hover { box-shadow: 0 6px 18px rgba(0,0,0,.16); transform: translateY(-2px); }
.article-card__img { width: 100%; height: 140px; object-fit: cover; display: block; }
.article-card__title { margin: 0; padding: 10px 12px 12px; font-size: 15px; line-height: 1.3; font-weight: 600; color: #252729; transition: color .15s; }
.article-card:hover .article-card__title { color: #f0b64c; }
.news_article__title:hover .news_article__title_text { color: #f0b64c; transition: color .15s; }

/* Перелинковка в тексте статьи — оранжевые ЖИРНЫЕ ссылки (Дарья 28.07.2026) */
.news_article__content a { color: #f0b64c; font-weight: 700; }
.news_article__content a:hover { color: #f5c96e; }

/* Голубые ссылки → наш оранжевый ТОЛЬКО в текстовых блоках: главная, листинг,
   районы (.district-page__seo), метро (.station-page__seo) [Дарья 28.07.2026].
   Карточки/офисы/карта/подвал НЕ затрагиваются. */
.first-page-text-block__text a, .home-seo-block__text a { color: #f0b64c; }
.first-page-text-block__text a:hover, .home-seo-block__text a:hover { color: #f5c96e; }

/* Форма под статьёй — по ширине текстовой колонки, сразу за текстом [Дарья 28.07.2026] */
.news_article__left_column .article-page__banner { margin-top: 28px; }
.news_article__left_column .article-page__banner .contact-block { padding: 24px 0 8px; text-align: left; }
.news_article__left_column .article-page__banner .contact-block .wrapper,
.news_article__left_column .article-page__banner .contact-block .feedback__form { max-width: 100%; }


/* Заставка статьи: по ширине контента (текст + «Другие статьи»), не во всю страницу,
   и выше — меньше обрезки фото. Десктоп. [Дарья 28.07.2026] */
@media (min-width: 900px) {
  .news_article__title { max-width: 1128px; margin: 0 auto; height: 460px; }
}

/* Подписи под фото в статье — обычный вес, не жирный [Дарья 28.07.2026] */
.article-photo figcaption, .article-photo figcaption a { font-weight: 400; }

/* Карточка статьи: заголовок — белый на оранжевой полосе [Дарья 28.07.2026] */
.article-card__title { background: #f0b64c; color: #fff !important; margin: 0; padding: 12px 14px; }
.article-card:hover .article-card__title { background: #f5c96e; color: #fff !important; }

/* Карточки «Другие статьи» — прижаты вправо, правый край вровень с заставкой [Дарья 28.07.2026] */
@media (min-width: 900px) {
  .news_article__right_column { margin-left: auto; margin-right: 0; }
}

/* Карточки «Ausgewählte Angebote» и «Beliebte Suchanfragen» — того же размера,
   что районы и метро: 300×210 в горизонтальном слайдере [Дарья 28.07.2026] */
@media (min-width: 900px) {
  .pop-searches__grid { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 12px; }
  .pop-searches__grid .pop-searches__card { flex: 0 0 300px; height: 210px; scroll-snap-align: start; }
  .pop-searches__grid::-webkit-scrollbar { height: 8px; }
  .pop-searches__grid::-webkit-scrollbar-track { background: #f0f0f0; border-radius: 4px; }
  .pop-searches__grid::-webkit-scrollbar-thumb { background: #f0b64c; border-radius: 4px; }
}


/* ---- Избранное: сердечко на карточке, счётчик в шапке, фильтр в листинге ---- */
.office__picture { position: relative; }
.rot-fav-btn {
  position: absolute; top: 10px; right: 12px; z-index: 3;
  width: 34px; height: 34px; border-radius: 50%; line-height: 1;
  background: #fff; border: 1.5px solid #e2e2e2; color: #ccc;
  font-size: 16px; cursor: pointer; transition: color .15s, border-color .15s, background .15s;
}
.rot-fav-btn:hover { color: #f0b64c; border-color: #f0b64c; }
.rot-fav-btn--on { color: #fff; background: #f0b64c; border-color: #f0b64c; }
.rot-fav-toggle {
  margin-left: 14px; padding: 4px 12px; border-radius: 16px; cursor: pointer;
  background: #fff; border: 1.5px solid #e2e2e2; color: #666; font-size: 13px;
}
.rot-fav-toggle:hover { border-color: #f0b64c; color: #f0b64c; }
.rot-fav-toggle--on { background: #f0b64c; border-color: #f0b64c; color: #fff; }
.rot-fav-link {
  display: inline-flex; align-items: center; gap: 5px; margin-right: 16px;
  color: #f0b64c; text-decoration: none; font-size: 18px; line-height: 1;
}
.rot-fav-link:hover { color: #f5c96e; }
.rot-fav-link__n {
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  background: #f0b64c; color: #fff; font-size: 11px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
}


/* ---- SEO-текст: один размер у всего текста, заголовки — фирменным оранжевым ---- */
/* Раньше на блок приходились два конкурирующих правила (15px и 14px), а вложенные
   em/strong/a/td под них не попадали вовсе — отсюда разнобой в размерах. */
.first-page-text-block__text,
.first-page-text-block__text p,
.first-page-text-block__text div,
.first-page-text-block__text li,
.first-page-text-block__text span,
.first-page-text-block__text a,
.first-page-text-block__text em,
.first-page-text-block__text i,
.first-page-text-block__text strong,
.first-page-text-block__text b,
.first-page-text-block__text td,
.first-page-text-block__text th {
    font-size: 14px !important;
    line-height: 1.65 !important;
}
/* внутри заголовков размер не трогаем — его задаёт сам заголовок */
.first-page-text-block__text :is(h1, h2, h3, h4, h5, h6) * {
    font-size: inherit !important;
    line-height: inherit !important;
}
.first-page-text-block__text :is(h1, h2, h3, h4, h5, h6),
.first-page-text-block__text :is(h1, h2, h3, h4, h5, h6) * {
    color: #f0b64c !important;
}

/* ---- Подпись рядом с сердечком в шапке ---- */
.rot-fav-link__label {
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .2px;
    white-space: nowrap;
}
@media only screen and (max-width: 700px) {
    .rot-fav-link__label { display: none; }
}


/* ---- Офисы на соседних улицах (перелинковка под первой формой) ---- */
.nearby-streets { margin: 28px 0 8px; }
.nearby-streets__title { font-size: 20px; margin: 0 0 14px; }
.nearby-streets__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 10px;
}
.nearby-streets__card {
    display: block;
    position: relative;
    padding: 12px 58px 12px 14px;
    border: 1px solid #e6e6e6;
    border-radius: 6px;
    background: #fff;
    text-decoration: none;
    transition: border-color .15s, box-shadow .15s;
}
.nearby-streets__card:hover {
    border-color: #f0b64c;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .06);
}
.nearby-streets__name {
    display: block;
    font-weight: 700;
    font-size: 15px;
    color: #303030;
    margin-bottom: 3px;
}
.nearby-streets__card:hover .nearby-streets__name { color: #f0b64c; }
.nearby-streets__meta { display: block; font-size: 13px; color: #777; line-height: 1.45; }
.nearby-streets__dist {
    position: absolute;
    top: 12px;
    right: 12px;
    font-size: 12px;
    color: #b0b0b0;
    white-space: nowrap;
}
@media only screen and (max-width: 480px) {
    .nearby-streets__grid { grid-template-columns: 1fr; }
}
/* ---- Фото карточек листинга: заполняют блок целиком и не искажаются ----
   В offices.css есть .office__image_not_found .image__content { object-fit: fill } —
   это буквально растягивает кадр под контейнер. Перебиваем на cover, чтобы пропорции
   сохранялись всегда. При обрезке по высоте показываем низ кадра: в интерьерных
   снимках там мебель, а не потолок (заметно на оригиналах MatchOffice 1463×900,
   которые попадают в широкий контейнер карточки). */
.description__list .description__office .office__image .image__content,
.description__list .description__office .office__image_not_found .image__content,
.slides img.image__content {
  width: 100%;
  height: 100%;
  object-fit: cover !important;
  object-position: center 62%;
  background: #eef0f2;
}
/* ---- Мобильная форма обратной связи: текст в полях и кнопке — по левому краю ----
   На узком экране поля во всю ширину, и центрированный плейсхолдер повисает
   в пустоте; слева читается как обычная форма. Перебиваем text-align: center
   из hub.css и базового правила .contact-block выше по файлу. */
@media only screen and (max-width: 768px) {
  .feedback .feedback__item input.item__content,
  .contact-block .feedback__item input.item__content,
  .feedback .feedback__phone .item__content,
  .feedback .feedback__phone input,
  .feedback__phone .iti,
  .feedback__phone .item__content {
    text-align: left !important;
    padding-left: 16px;
  }
  /* у телефона слева флаг и код — отступ даёт сам плагин */
  .feedback .feedback__phone .iti input.item__content,
  .contact-block .feedback__item .iti input.item__content {
    padding-left: 8px;
  }
  .feedback .feedback__buttom .ui.button,
  .contact-block .feedback__buttom .ui.button,
  .feedback .feedback__item button[type='submit'] {
    text-align: left !important;
    padding-left: 16px;
  }
}

/* ---- Шапка: сердечко всегда в одну строку с кнопкой языков [Дарья 01.08.2026] ----
   У .header__right не было своих стилей: логотип и язык — флоты, а сердечко
   строчное, и на узких экранах оно переносилось на вторую строку под шапкой.
   Флекс держит его между логотипом и языками на любой ширине. */
.header__right { float: right; display: flex; align-items: center; }
.header__right .header__language { float: none; width: auto; }
.header__right .rot-fav-link { margin-right: 12px; }
@media only screen and (max-width: 480px) {
    .header__right .rot-fav-link { margin-right: 8px; font-size: 17px; }
}

/* На мобильном hub.css раскладывал языки и сердечко в столбик
   (column-reverse) — сердечко оказывалось второй строкой под шапкой.
   Дарья: сердечко должно стоять между логотипом и кнопкой языков. */
@media only screen and (max-width: 760px) {
    .header__right { flex-direction: row; align-items: center; gap: 0; }
}

/* ---- Правовые ссылки в подвале + модалка Cookie Settings [Дарья 01.08.2026] ---- */
.rot-legal-links {
    text-align: center;
    padding: 16px 0 4px;
    border-top: 1px solid rgba(255,255,255,.08);
    margin-top: 18px;
}
.rot-legal-links a {
    color: #9a9a9a;
    font-size: 12.5px;
    margin: 0 11px;
    text-decoration: none;
    white-space: nowrap;
}
.rot-legal-links a:hover { color: #f0b64c; }
.rot-cookie-modal {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,.55);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.rot-cookie-modal[hidden] { display: none; }
.rot-cookie-modal__box {
    background: #fff;
    color: #303030;
    max-width: 430px;
    width: 100%;
    border-radius: 8px;
    padding: 22px 24px;
    font-size: 14px;
    line-height: 1.55;
    text-align: left;
}
.rot-cookie-modal__box h3 { margin: 0 0 10px; font-size: 18px; color: #303030; }
.rot-cookie-modal__row { display: flex; gap: 8px; align-items: flex-start; margin: 12px 0; cursor: pointer; }
.rot-cookie-modal__row input { margin-top: 3px; }
.rot-cookie-modal__hint { color: #888; font-size: 12.5px; }
.rot-cookie-modal__actions { text-align: right; margin-top: 14px; }
.rot-cookie-modal__actions button {
    border: none; border-radius: 4px; padding: 8px 18px; margin-left: 8px;
    font-size: 14px; cursor: pointer;
}
.rot-cookie-modal__save { background: #f0b64c; color: #fff; }
.rot-cookie-modal__save:hover { background: #f5c96e; }
.rot-cookie-modal__cancel { background: #eee; color: #555; }

/* Мобильная шапка: сердечко — в кружочке, счётчик пузырьком [Дарья 01.08.2026] */
@media only screen and (max-width: 700px) {
    .rot-fav-link {
        position: relative;
        width: 32px; height: 32px;
        border: 1.5px solid #f0b64c;
        border-radius: 50%;
        justify-content: center;
        gap: 0;
        margin-right: 10px;
        font-size: 15px;
    }
    .rot-fav-link__n {
        position: absolute;
        top: -6px; right: -8px;
        min-width: 16px; height: 16px;
        font-size: 10px;
    }
}

/* Панель выбора страны телефона (intl-tel-input v29, detached) — вид дропдауна */
.iti.iti--detached-country-selector .iti__country-selector {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 6px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
  overflow: auto;
}

/* ==========================================================================
   Волна мобильной конверсии [Дарья 03.08.2026]
   Повод — разбор Вебвизора (munich /tr/, iPhone, 4:37): человек пролистал
   4 страницы выдачи, не открыл ни одной карточки и ушёл без заявки.
   ========================================================================== */

/* 1. iOS Safari зумит страницу при фокусе в поле с font-size < 16px.
      Именно отсюда «уехавшая вбок» вёрстка после тапа в фильтр. */
@media only screen and (max-width: 991px) {
  input[type='text'],
  input[type='number'],
  input[type='email'],
  input[type='tel'],
  input[type='search'],
  input[type='url'],
  input[type='date'],
  select,
  textarea,
  .item__content,
  .promo-input,
  .popup-inputs__square,
  .popup-inputs__price,
  .filter__query-input,
  .hub-hero__field input,
  .iti input {
    font-size: 16px !important;
  }
}

/* 2. Поп-апы не вылезают за узкий экран, крестик всегда в зоне пальца.
      На зумленном iOS-вьюпорте кнопка закрытия уезжала за правый край. */
.promo-overlay {
  max-width: 100vw;
  overflow-y: auto;
  padding: 12px;
}
.promo-modal,
.cw-modal {
  max-width: min(520px, calc(100vw - 24px));
  max-height: calc(100vh - 24px);
  overflow-y: auto;
}
.promo-close {
  width: 44px;
  height: 44px;
  top: 2px;
  right: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  z-index: 2;
}

/* 3. H1 листинга — раньше страница открывалась пустым белым блоком. */
.listing-h1 {
  font-family: 'Avenir Next', Roboto, Arial, Helvetica, sans-serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.25;
  color: #222;
  margin: 16px 0 14px;
  text-align: left;
}
@media only screen and (max-width: 640px) {
  .listing-h1 {
    font-size: 21px;
    margin: 10px 0 12px;
  }
}

/* 4. Заявка прямо из карточки выдачи: рядом с «Подробнее» — жёлтая кнопка. */
.office__cta {
  display: flex;
  gap: 10px;
  align-items: stretch;
}
.office__cta > a {
  flex: 1;
  min-width: 0;
}
.office__request {
  flex: 1;
  min-width: 0;
  border: 2px solid #f0b64c;
  background-color: #f0b64c;
  color: #fff;
  font-family: Roboto, Arial, Helvetica, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 1.77px;
  text-align: center;
  padding: 8px;
  cursor: pointer;
  transition: background-color 0.15s;
}
.office__request:hover {
  background-color: #f5c96e;
  border-color: #f5c96e;
}
@media only screen and (max-width: 640px) {
  .office__cta {
    flex-direction: column;
    gap: 8px;
  }
  .office__request {
    min-height: 44px;
    letter-spacing: 1px;
  }
}

/* 5. Сортировка выдачи — вместо перелистывания сотен предложений вручную. */
.listing-sort {
  display: flex;
  align-items: center;
  gap: 8px;
  float: left; /* счётчик «Найдено N офисов» уже прижат вправо */
  font-family: Roboto, Arial, Helvetica, sans-serif;
  font-size: 14px;
  color: #666;
}
.listing-sort__label {
  white-space: nowrap;
}
.listing-sort__select {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  background: #fff;
  color: #303030;
  font-size: 14px;
  padding: 7px 10px;
  max-width: 100%;
}
@media only screen and (max-width: 640px) {
  .listing-sort {
    float: none;
    width: 100%;
    margin-top: 8px;
  }
  .listing-sort__select {
    flex: 1;
    min-width: 0;
    min-height: 40px;
  }
}


/* Статья: правый край сайдбара вровень с заставкой (Дарья 04.08.2026).
   Колонки — flex с gap 36px, но левая объявлена flex:1 1 68% и свободное место
   не добирала: сайдбар кончался на 36px левее заставки. Отдаём остаток тексту —
   выравниваются правые края, а текстовая колонка становится чуть шире. */
.news_article__columns .news_article__left_column { flex: 1 1 auto; min-width: 0; }

/* Заголовок «Другие статьи» — фирменным оранжевым */
.news_article__another_title { color: #f0b64c; }



/* [ui-std] переключатель периода */
.ui.input .ui.flowing.popup .popup-inputs .ui.buttons.period {
  width: 100% !important;
  margin-left: 0;
  margin-right: 0;
  display: flex;
  gap: 8px;
}
.ui.input .ui.flowing.popup .popup-inputs .ui.buttons.period .ui.button,
.ui.input .ui.flowing.popup .popup-inputs .ui.buttons.period .ui.button.month {
  flex: 1 1 0;
  width: auto;
  min-width: 0;
  background: #fff;
  color: #252729;
  border: 1.5px solid #f0b64c;
  border-radius: 8px;
  box-shadow: none;
  transition: background .15s, color .15s, box-shadow .15s;
}
.ui.input .ui.flowing.popup .popup-inputs .ui.buttons.period .ui.button:hover {
  background: rgba(240, 182, 76, 0.16);
  color: #252729;
  box-shadow: none;
}
.ui.input .ui.flowing.popup .popup-inputs .ui.buttons.period .ui.button.active,
.ui.input .ui.flowing.popup .popup-inputs .ui.buttons.period .ui.button.active:hover {
  background-color: #f0b64c;
  border-color: #f0b64c;
  color: #252729;
  box-shadow: 0 0 0 3px rgba(240, 182, 76, 0.28);
}

/* [ui-std] ширина попапов поисковой формы */
/* Попапы кнопок поиска были уже своих кнопок (Москва: 340px при кнопке 371px —
   ширина зашита числом). Приравниваем к кнопке; содержимое проверено, не
   переполняется. */
.ui.input .ui.flowing.popup {
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box;
}

/* [ui-std] ширина списка языков */
.header__language .menu {
  width: max-content !important;
  min-width: 100% !important;
  max-width: 260px !important;
}
.header__language .menu .item { white-space: nowrap !important; }
.header__language .default.text { font-size: 13px; }

/* [ui-std] кнопка очистки избранного */
.rot-fav-clear {
  margin-left: 8px; padding: 4px 12px; border-radius: 16px; cursor: pointer;
  background: #fff; border: 1.5px solid #e2e2e2; color: #666; font-size: 13px;
}
.rot-fav-clear:hover { border-color: #f0b64c; color: #f0b64c; }

/* [ui-std] ширина блока похожих предложений */
/* Карточки «похожих/подходящих предложений» — по ширине нижней формы обратной
   связи (960px), а не листинга: форма — самый широкий блок хвоста страницы,
   и карточки над ней смотрятся единой колонкой (Дарья 04.08.2026). */
@media (min-width: 1101px) {
  .related-offers .related-offers__list {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Языковой дропдаун: кнопка вмещает самое длинное название, список ровно
   по ширине кнопки, шрифт пунктов мельче (Дарья 04.08.2026) */
.header .container .header__language { width: auto; min-width: 126px; }
.header .container .header__language .ui.selection.dropdown {
  min-width: 126px !important;
  width: 100% !important;
}
.header .container .header__language .ui.selection.dropdown .menu {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
}
.header .container .header__language .ui.selection.dropdown .menu > .item {
  white-space: nowrap !important;
  font-size: 12px !important;
  padding: 9px 12px !important;
}

/* ==== ROT-MOBILE-20260804c: мобильные фиксы (Дарья 04.08.2026) ==== */
/* Страница не съезжает вбок */
html, body { overflow-x: hidden; }
@media only screen and (max-width: 768px) {
  /* Фото карточки не выползает под название и адрес (перенос фикса Москвы) */
  .description__office .office__image { height: 58vw; max-height: 300px; overflow: hidden; }
  .description__office .office__image .slides { height: 100% !important; min-height: 0 !important; max-height: none; }
  /* Рамка SEND была на контейнере и съезжала относительно кнопки (фикс апекса) */
  .feedback .feedback__item.feedback__buttom,
  .contact-block .feedback__item.feedback__buttom { outline: none !important; }
  .feedback .feedback__buttom .ui.button,
  .contact-block .feedback__buttom .ui.button { border: 1.5px solid #fff !important; border-radius: 2px; }
}
/* Правовые ссылки подвала переносятся, а не распирают строку */
.rot-legal-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 18px; }
.rot-legal-links a { margin: 0; }

/* ==== ROT-CSS-20260804d (Дарья 04.08.2026) ==== */
/* Safari: обёртка <picture> без размеров — миниатюра кадрируется от собственного
   размера файла (сильный зум неба/фрагмента). Фикс Москвы на всю сеть. */
.slides picture { display: block; width: 100%; height: 100%; }
.slides img.image__content { width: 100%; height: 100%; object-fit: cover; }
@media only screen and (max-width: 768px) {
  /* Рамка ОТПРАВИТЬ: тёмный фон контейнера торчал из-под кнопки */
  .feedback .feedback__item.feedback__buttom,
  .contact-block .feedback__item.feedback__buttom {
    background: transparent !important;
    outline: none !important;
  }
  /* Слово на кнопке — по центру */
  .feedback .feedback__buttom .ui.button,
  .contact-block .feedback__buttom .ui.button {
    text-align: center !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  /* Тайтл страницы не прячется за фиксированной шапкой (высота шапки плавает
     от размера шрифта на телефоне) */
  .description__content { padding-top: 44px; }
}

/* [btn-align] 05.08.2026: кнопка отправки вровень с оранжевыми полями.
   footer.css на мобильных вешает padding-left:5px на ВСЕ .feedback__item;
   у полей это внутри оранжевого фона и незаметно, у кнопки — видимый сдвиг. */
@media only screen and (max-width: 900px) {
  .contact-block .feedback__item.feedback__buttom,
  .contact-block .feedback__form .feedback__item.feedback__buttom,
  .feedback .feedback__row .feedback__item.feedback__buttom {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .contact-block .feedback__buttom .ui.button,
  .feedback .feedback__buttom .ui.button {
    width: 100% !important;
    margin: 0 !important;
  }
}

/* [anchor-offset] 05.08.2026: прилипшая шапка (~86px) накрывала заголовок блока,
   к которому прокручивались по якорю. Отодвигаем цели прокрутки. */
:root { --rot-header-h: 96px; }
.contact-block,
.search-banner,
section[id],
div[id],
h1[id], h2[id], h3[id] {
  scroll-margin-top: var(--rot-header-h);
}
@media only screen and (max-width: 900px) {
  :root { --rot-header-h: 100px; }
}

/* [mob-head] 05.08.2026: заголовок листинга уходил под прилипшую шапку
   (на мобильных она в две строки — 86px против 43px на десктопе). */
@media only screen and (max-width: 900px) {
  main { padding-top: 52px; }
}

/* [mob-head] кегль заголовков SEO-блока на мобильных + отмена выключки по ширине:
   H1 28px/justify давал 4 строки с рваными пробелами. */
@media only screen and (max-width: 600px) {
  .first-page-text-block__text h1 {
    font-size: 21px !important;
    line-height: 1.25 !important;
    text-align: left !important;
  }
  .first-page-text-block__text h2 {
    font-size: 17px !important;
    line-height: 1.3 !important;
    text-align: left !important;
  }
  .first-page-text-block__text h3 {
    font-size: 16px !important;
    text-align: left !important;
  }
}

/* [safari-card] 05.08.2026: в WebKit position:relative на display:table-cell не даёт
   containing block, поэтому абсолютный .slides цеплялся за внешний article и
   кадр резался мимо — в превью был виден только потолок. Переводим строку
   карточки на flex: в Blink геометрия не меняется (проверено), в WebKit
   появляется корректная точка отсчёта. Ниже 426px раскладка и так блочная. */
@media only screen and (min-width: 426px) {
  .description__list .description__office .office__image_content {
    display: flex;
    align-items: stretch;
  }
  .description__list .description__office .office__image {
    display: block;
    flex: 0 0 47%;
    width: 47%;
    position: relative;
  }
  .description__list .description__office .office__content {
    display: block;
    flex: 1 1 auto;
  }
}

/* [lead-popup] 05.08.2026: расширенный попап заявки — строка «бесплатно для
   арендатора», блок объекта, поля компании/команды/даты и сообщение. */
.promo-free {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin: 0 0 18px;
  font-size: 14px;
  color: #55595d;
}
.promo-free i {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #f0b64c;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-style: normal;
  font-size: 13px;
  flex: 0 0 22px;
}
.promo-object {
  background: #f7f7f6;
  border-left: 3px solid #f0b64c;
  border-radius: 6px;
  padding: 10px 12px;
  font-size: 13px;
  color: #55595d;
  margin: 0 0 16px;
  line-height: 1.45;
}
.promo-object b {
  color: #252729;
  font-weight: 600;
}
.promo-modal textarea.promo-input {
  min-height: 74px;
  resize: vertical;
  line-height: 1.45;
  font-family: inherit;
}
.promo-modal .promo-input:focus {
  outline: none;
  border-color: #f0b64c;
  box-shadow: 0 0 0 3px rgba(240, 182, 76, 0.18);
}
.promo-modal select.promo-input {
  appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' stroke='%23f0b64c' stroke-width='2' fill='none' stroke-linecap='round'/></svg>");
  background-repeat: no-repeat;
  background-position: right 13px center;
}
@media only screen and (max-width: 520px) {
  .promo-modal .promo-row {
    flex-direction: column;
    gap: 0;
  }
}

/* [card-minheight] 05.08.2026: карточки сервисных типов (виртуальный офис и т.п.)
   прячут строки площади/этажа/цены за фут и получались ниже соседей —
   ряд листинга рвался. Подтягиваем до высоты обычной карточки. */
@media only screen and (min-width: 426px) {
  .description__list .description__office .office__image_content {
    min-height: 287px;
  }
}

/* [polish-0508e] кнопка языков: была 126×44 из-за min-width:126px (правило 04.08),
   крупнее поля поиска. Ужимаем до содержимого, центр — по сердцу. */
@media only screen and (max-width: 600px) {
  .header .container .header__language {
    width: auto !important;
    min-width: 0 !important;
  }
  .header .container .header__language .ui.selection.dropdown {
    min-width: 0 !important;
    width: auto !important;
    min-height: 34px !important;
    padding: 8px 26px 8px 10px !important;
    font-size: 12px !important;
  }
  .header .container .header__language .ui.selection.dropdown > .text {
    font-size: 12px !important;
  }
}

/* [polish-0508e] главная: герой рассчитан уходить под полупрозрачную шапку, а отступ
   [mob-head] (нужный листингу) давал белый ремень. */
@media only screen and (max-width: 900px) {
  main:has(.hub-hero) { padding-top: 0 !important; }
}

/* [polish-0508e] iOS красил выбранные значения селектов попапа системным синим:
   color не был задан. */
.promo-modal select.promo-input,
.promo-modal .promo-input {
  color: #252729;
}

/* [popup-lock] 05.08.2026: скролл внутри попапа не передаётся странице */
.promo-overlay {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

/* [lang-center] 05.08.2026: надпись в кнопке языков по центру — поля были
   несимметричными (10px слева против 26px справа под стрелку). */
@media only screen and (max-width: 600px) {
  .header .container .header__language .ui.selection.dropdown {
    padding: 8px 22px !important;
    text-align: center !important;
  }
  .header .container .header__language .ui.selection.dropdown > .text,
  .header .container .header__language .ui.selection.dropdown > .default.text {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
  }
}

/* [lang-left] 06.08.2026: в Нью-Йорке текст в кнопке языков — по левому краю
   (Дарья). Отменяет общесетевую центровку [lang-center] от 05.08: она стоит
   выше в файле, поэтому при равной специфичности выигрывает этот блок. */
@media only screen and (max-width: 600px) {
  .header .container .header__language .ui.selection.dropdown {
    padding: 8px 26px 8px 12px !important;
    text-align: left !important;
  }
  .header .container .header__language .ui.selection.dropdown > .text,
  .header .container .header__language .ui.selection.dropdown > .default.text {
    text-align: left !important;
  }
}
.header .container .header__language .ui.selection.dropdown,
.header .container .header__language .ui.selection.dropdown > .text,
.header .container .header__language .ui.selection.dropdown > .default.text {
  text-align: left;
}

/* [popup-fix-x] 06.08.2026: попап «ездил» вбок. Оверлей имел overflow-x:auto, то есть
   был горизонтальным скролл-контейнером; переполнял его input[type=date] —
   на iOS у него собственная ширина под формат даты, которую width:100% не
   ограничивает, пока не снят системный вид. Убираем и прокрутку, и причину. */
.promo-overlay {
  overflow-x: hidden !important;
  overscroll-behavior: contain;
}
.promo-modal {
  max-width: min(460px, calc(100vw - 24px));
  box-sizing: border-box;
  overflow-x: hidden;
}
.promo-modal *,
.promo-modal *::before,
.promo-modal *::after {
  box-sizing: border-box;
}
/* флекс-элементы по умолчанию не сжимаются уже своего содержимого (min-width:auto) —
   без этого длинный пункт селекта раздвигает строку «компания + размер команды» */
.promo-modal .promo-row,
.promo-modal .promo-field,
.promo-modal .iti {
  min-width: 0;
  max-width: 100%;
}
.promo-modal .promo-input,
.promo-modal .iti,
.promo-modal .iti input {
  width: 100%;
  max-width: 100%;
}
.promo-modal input[type="date"].promo-input {
  -webkit-appearance: none;
  appearance: none;
  min-width: 0;
}
/* iOS показывает пустое поле даты как высокий пустой блок — выравниваем с остальными */
.promo-modal input[type="date"].promo-input::-webkit-date-and-time-value {
  text-align: left;
  min-height: 1.2em;
}

/* Окно поиска по карте (06.08.2026).
   На десктопе .description__map-wrapper — position:fixed; top:0, а поиск внутри него
   стоял top:8px, т.е. попадал ПОД фиксированную шапку (76px, z-index 9998) и был не виден.
   Опускаем его ниже шапки; на мобильных контейнер в потоке — там правило не нужно. */
@media only screen and (min-width: 1025px) {
  .description__wrapper .description__map-wrapper .search_buildings {
    top: 88px;
    left: 12px;
    right: auto;
  }
}


/* Кнопки «Подробнее»/«Получить предложение» прижаты к низу карточки (07.08.2026).
   У виртуальных офисов и бизнес-адресов меньше строк (нет площади/этажа/ставки),
   поэтому CTA всплывала вверх и ряд карточек выглядел рвано. */
.office__image_content .office__content { display: flex; flex-direction: column; }
.office__content > .office__cta { margin-top: auto; }

/* Три кнопки периода цены — по центру попапа, равные доли ширины */
.ui.buttons.period { display: flex; justify-content: center; gap: 8px; width: 100%; }
.ui.buttons.period > .button { flex: 1 1 0; min-width: 0; margin: 0; }

/* Отложенная отрисовка нижних секций (07.08.2026): браузер не считает раскладку
   для блоков вне экрана, пока до них не доскроллят. Снижает время до интерактива. */
.metro-seo, .districts-seo, .pop-searches, .news_articles, .faq-section, .footer-links {
  content-visibility: auto;
  contain-intrinsic-size: auto 600px;
}
