/* Start:/local/templates/.default/components/bitrix/breadcrumb/.default/style.css?1674656352202*/
.nav_breadcrumb .bx-breadcrumb {
  display: flex;
  flex-wrap: wrap;
}
.nav_breadcrumb .bx-breadcrumb > div {
  margin-right: 10px;
}
.nav_breadcrumb .bx-breadcrumb .arr-right {
  margin-right: 10px;
}

/* End */


/* Start:/local/templates/urdis/components/bitrix/catalog.section.list/gradostroitelstvo_sitebar/style.css?17876446871862*/
/* ============================================
   СТИЛИ ДЛЯ .grad-side-nav И ЕГО ВНУТРЕННИХ ЭЛЕМЕНТОВ
   ============================================ */

/* Основной контейнер сайдбара */
.grad-content-layout {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 48px;
  align-items: start;
  margin-top: 34px;
}

.grad-side-nav {
  position: sticky;
  top: 20px;
}

/* Заголовок внутри сайдбара */
.grad-side-nav > .page_header {
  height: auto;
  margin: 0 0 20px;
  font-size: 24px;
}

/* Список навигации */
.grad-side-nav ul {
  margin: 0;
  padding: 0;
  border-top: 1px solid #ddd;
  list-style: none;
}

/* Элементы списка */
.grad-side-nav li {
  border-bottom: 1px solid #ddd;
}

/* Ссылки внутри списка */
.grad-side-nav li a {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 9px;
  padding: 15px 4px;
  color: #404040;
  font-size: 14px;
  line-height: 1.25;
  text-decoration: none;
}

/* Номера (спан) внутри ссылок */
.grad-side-nav li a span {
  color: #76582f;
  font-size: 12px;
}

/* Ховер для ссылок и активный пункт */
.grad-side-nav li a:hover,
.grad-side-nav__active a {
  color: #76582f;
  font-family: "UniNeueBold", sans-serif;
}

/* ============================================
   АДАПТИВНЫЕ СТИЛИ
   ============================================ */

/* Планшеты (до 992px) */
@media (max-width: 992px) {
  .grad-side-nav {
    position: static; /* Убираем sticky на планшетах */
  }
  .grad-content-layout {
    grid-template-columns: 1fr;
  }
  
  .grad-side-nav nav,
  .grad-side-cta {
    display: none; /* Скрываем навигацию и CTA на планшетах */
  }
}
/* End */


/* Start:/local/templates/urdis/components/bitrix/news/gradostroitelstvo/bitrix/news.list/.default/style.css?17876425069333*/
/* ============================================
   grad-service-page — основные стили страницы
   ============================================ */

/* ----- Контейнер страницы ----- */
.grad-container {
  padding-top: 28px;
  padding-bottom: 80px;
}

/* ----- Заголовок страницы ----- */
.grad-service-page > .page_header {
  height: auto;
  margin: 0 0 22px;
  line-height: 1.12;
  max-width: 1000px;
  font-size: 42px;
}

/* ----- Класс-кикер (метка направления) ----- */
.grad-kicker {
  margin-bottom: 14px;
  color: #76582f;
  font-family: "UniNeueBold", sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
}

/* ----- Мета-информация ----- */
.grad-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
}

.grad-meta span {
  padding: 8px 12px;
  border-radius: 3px;
  background: #f2f2f2;
  color: #555;
  font-size: 14px;
}

/* ----- Медиа-блок (изображение) ----- */
.grad-media {
  --grad-media-position: 50% 50%;
  position: relative;
  margin: 34px 0 38px;
  overflow: hidden;
  border-radius: 5px;
  background: #304150;
}

.grad-media::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(90deg, rgba(27,39,48,.38), rgba(27,39,48,.04) 52%, rgba(180,132,75,.13));
  content: "";
  pointer-events: none;
}

.grad-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--grad-media-position);
  filter: saturate(.58) contrast(1.04) sepia(.08);
  transition: transform .45s ease, filter .45s ease;
}

.grad-media:hover img {
  transform: scale(1.015);
  filter: saturate(.72) contrast(1.04) sepia(.05);
}

.grad-media > span {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  width: 34%;
  height: 4px;
  background: #ffc478;
}

/* ----- Медиа-блок на странице услуги ----- */
.grad-media--service {
  height: clamp(250px, 28vw, 370px);
  margin-top: 26px;
}

/* ----- Сетка ценности услуги (2 колонки) ----- */
.grad-value-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 54px;
  border: 1px solid #ddd;
  border-radius: 5px;
  overflow: hidden;
}

.grad-value-grid section {
  padding: 28px 30px;
}

.grad-value-grid section + section {
  border-left: 1px solid #ddd;
  background: #f7f7f7;
}

.grad-value-grid b {
  display: block;
  margin-bottom: 12px;
  color: #76582f;
  font-size: 14px;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.grad-value-grid p {
  margin: 0;
  color: #484848;
  font-size: 17px;
  line-height: 1.55;
}

/* ----- Заголовок блока с деталями ----- */
.grad-process-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 18px;
}

.grad-process-heading h2 {
  margin: 0;
  font-size: 29px;
}

.grad-process-heading span {
  color: #777;
  font-size: 13px;
}

/* ----- Список деталей (аккордеон) ----- */
.grad-details {
  border-top: 1px solid #ccc;
}

.grad-detail {
  border-bottom: 1px solid #ccc;
}

.grad-detail[id] {
  scroll-margin-top: 24px;
}

.grad-detail:target {
  box-shadow: inset 3px 0 #ffc478;
}

/* ----- Заголовок детали (summary) ----- */
.grad-detail summary {
  display: grid;
  grid-template-columns: 48px 1fr 28px;
  gap: 12px;
  align-items: center;
  padding: 22px 6px;
  cursor: pointer;
  list-style: none;
}

.grad-detail summary::-webkit-details-marker {
  display: none;
}

.grad-detail summary::-moz-list-bullet {
  list-style-type: none;
}

.grad-detail summary::marker {
  content: "";
}

.grad-detail summary::before {
  display: none;
  content: none;
}

.grad-detail summary > span {
  color: #76582f;
  font-size: 13px;
}

.grad-detail summary strong {
  font-size: 18px;
  line-height: 1.3;
}

/* ----- Иконка-стрелка (плюс/минус) ----- */
.grad-detail summary i {
  position: relative;
  width: 22px;
  height: 22px;
}

.grad-detail summary i::before,
.grad-detail summary i::after {
  position: absolute;
  top: 10px;
  left: 2px;
  width: 18px;
  height: 1px;
  background: #a27d4b;
  content: "";
}

.grad-detail summary i::after {
  transform: rotate(90deg);
  transition: transform .2s ease;
}

.grad-detail[open] summary i::after {
  transform: rotate(0);
}

.grad-detail[open] summary {
  color: #76582f;
}

/* ----- Тело детали (контент) ----- */
.grad-detail__body {
  padding: 0 46px 34px 66px;
  color: #454545;
}

.grad-detail__intro {
  margin-top: 0;
  font-size: 17px;
  line-height: 1.6;
}

/* ----- Медиа внутри детали ----- */
.grad-detail__media {
  --grad-detail-position: 50% 50%;
  position: relative;
  height: clamp(210px, 25vw, 320px);
  margin: 24px 0 30px;
  overflow: hidden;
  border-radius: 4px;
  background: #304150;
}

.grad-detail__media::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(31,45,56,.28), transparent 55%, rgba(184,137,79,.10));
  content: "";
  pointer-events: none;
}

.grad-detail__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--grad-detail-position);
  filter: saturate(.55) contrast(1.04) sepia(.07);
  transition: transform .45s ease, filter .45s ease;
}

.grad-detail__media:hover img {
  transform: scale(1.015);
  filter: saturate(.70) contrast(1.04) sepia(.04);
}

.grad-detail__media > span {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: 0;
  width: 28%;
  height: 3px;
  background: #ffc478;
}

/* ----- Заголовки внутри тела ----- */
.grad-detail__body h3 {
  margin: 28px 0 12px;
  font-size: 18px;
}

.grad-detail__body ul {
  padding-left: 22px;
  line-height: 1.55;
}

.grad-detail__body li {
  margin-bottom: 8px;
}

/* ----- Сетка результатов (риски / результат) ----- */
.grad-detail__outcomes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 26px;
}

.grad-detail__outcomes > div {
  padding: 22px;
  border-left: 3px solid #ffc478;
  background: #f5f5f5;
}

.grad-detail__outcomes b {
  color: #76582f;
}

.grad-detail__outcomes p {
  margin: 10px 0 0;
  line-height: 1.5;
}

/* ----- Контактная полоса внизу ----- */
.grad-contact-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  margin-top: 54px;
  padding: 34px;
  border-radius: 5px;
  background: #304150;
  color: #fff;
}

.grad-contact-strip span {
  color: #ffc478;
  font-size: 14px;
}

.grad-contact-strip h2 {
  max-width: 700px;
  margin: 8px 0 0;
  font-size: 24px;
}

.grad-contact-strip .btn {
  flex: 0 0 auto;
  color: #000;
}

/* ----- Боковая навигация (aside) ----- */
.grad-side-nav {
  position: sticky;
  top: 20px;
}

.grad-side-nav > .page_header {
  height: auto;
  margin: 0 0 20px;
  font-size: 24px;
}

.grad-side-nav ul {
  margin: 0;
  padding: 0;
  border-top: 1px solid #ddd;
  list-style: none;
}

.grad-side-nav li {
  border-bottom: 1px solid #ddd;
}

.grad-side-nav li a {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 9px;
  padding: 15px 4px;
  color: #404040;
  font-size: 14px;
  line-height: 1.25;
  text-decoration: none;
}

.grad-side-nav li a span {
  color: #76582f;
  font-size: 12px;
}

.grad-side-nav li a:hover,
.grad-side-nav__active a {
  color: #76582f;
  font-family: "UniNeueBold", sans-serif;
}

.grad-side-cta {
  width: 100%;
  margin-top: 24px;
  box-sizing: border-box;
  text-align: center;
}

/* ----- Кнопка (общая) ----- */
.btn {
  /* стили кнопки (добавьте при необходимости) */
}

.btn.shine.accent {
  /* стили акцентной кнопки */
}


/* ============================================
   АДАПТИВНЫЕ СТИЛИ
   ============================================ */

/* ----- Планшеты (max-width: 992px) ----- */
@media (max-width: 992px) {
  .grad-container {
    padding-top: 22px;
  }

  .grad-service-page > .page_header {
    font-size: 34px;
  }

  .grad-media--service {
    height: 300px;
  }

  .grad-value-grid {
    grid-template-columns: 1fr;
  }

  .grad-value-grid section + section {
    border-top: 1px solid #ddd;
    border-left: 0;
  }

  .grad-detail__outcomes {
    grid-template-columns: 1fr;
  }

  .grad-side-nav {
    position: static;
  }

  .grad-side-nav nav,
  .grad-side-cta {
    display: none;
  }
}

/* ----- Мобильные (max-width: 620px) ----- */
@media (max-width: 620px) {
  .grad-media {
    margin: 26px 0 30px;
  }

  .grad-media--service {
    height: 235px;
  }

  .grad-process-heading {
    display: block;
  }

  .grad-process-heading span {
    display: block;
    margin-top: 8px;
  }

  .grad-detail summary {
    grid-template-columns: 34px 1fr 22px;
    padding: 18px 2px;
  }

  .grad-detail summary strong {
    font-size: 16px;
  }

  .grad-detail__body {
    padding: 0 0 26px 34px;
  }

  .grad-detail__media {
    height: 210px;
    margin: 20px 0 24px;
  }

  .grad-contact-strip {
    display: block;
  }

  .grad-contact-strip .btn {
    display: inline-block;
    margin-top: 22px;
  }
}
/* End */
/* /local/templates/.default/components/bitrix/breadcrumb/.default/style.css?1674656352202 */
/* /local/templates/urdis/components/bitrix/catalog.section.list/gradostroitelstvo_sitebar/style.css?17876446871862 */
/* /local/templates/urdis/components/bitrix/news/gradostroitelstvo/bitrix/news.list/.default/style.css?17876425069333 */