/* Start:/bitrix/templates/logimarket_template/components/bitrix/news/blog/style.css?17629483968861*/
/* ===== Табы и обёртка */
.blog-wrap{ margin-bottom:50px; }
.blog-tabs{
  display:flex; flex-direction:row; gap:12px;
  position:sticky; top:12px; margin-bottom:32px; 
}
.blog-tab{
  display:block; padding:10px 32px; border:1px solid #7D7E86; border-radius:4px;
  background:#f6f7fa; color:#141B38; text-decoration:none; font-weight:400; font-size:16px;text-align: center;
}
.blog-tab--active{ background:#45B5AA; color:#fff; }
.blog-tab--active:hover{ background:#45B5AA; color:#fff; }

/* ===== Сетка списка статей (страница /blog) */
.blog-list{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
@media(min-width:768px) and (max-width:1250px){
  .blog-list{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:767px){
  .blog-list{ grid-template-columns:1fr; }
  .blog-tabs{ flex-direction:column; }
}

/* ===== Карточка статьи (post-card) — используется и в related */
.post-card{ display:block; text-decoration:none; color:inherit; }
.post-card__thumb{ position:relative; border-radius:0; overflow:hidden; }
.post-card__thumb img,
.post-card__thumb--ph{ display:block; width:100%; height:260px; object-fit:cover; }
.post-card__thumb--ph{ background:#bbb; }

.post-card__badges{
  position:absolute; left:12px; top:12px;
  display:flex; gap:8px; flex-wrap:wrap;
}
.cat-badge{ padding:6px 10px; border-radius:12px; font-weight:700; font-size:10px; color:#fff; font-family:'NafteraWebBlackItalic'; }
.cat-badge--news{ background:#6D5CF5; }
.cat-badge--article{ background:#FF8A00; }
.cat-badge--default{ background:#111; }

.post-card__meta{ margin-top:10px; }
.date-chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:20px; background:#f2f3f6; font-size:14px; color:#1a1a1a;
}
.date-chip .dot{ width:8px; height:8px; border-radius:50%; background:#2DD28C; display:inline-block; }

.post-card__title{
  margin:12px 0 8px; font-weight:800; font-size:24px; line-height:1.2;
  font-family:'NafteraWebBlackItalic';
}
@media(max-width:768px){
  .post-card__thumb img,.post-card__thumb--ph{ height:200px; }
  .post-card__title{ font-size:18px; }
}

/* ===== Детальная */
.blog-detail{ max-width:900px; margin:0 auto; }
.blog-detail__title{ font-family:'NafteraWebBlackItalic'; font-size:36px; text-align:center;margin-bottom: 32px; }
.blog-detail-grid{ display:block; } /* без левой колонки */
.blog-detail-grid .date-chip{ margin:25px 0; }

.hero-img{ width:100%; height:400px; border-radius:0; background:#cfcfd4; overflow:hidden; margin:12px 0; }
.hero-img img{ width:100%; height:100%; max-height:400px; object-fit:cover; }
@media(max-width:767px){ .hero-img{ height:215px; } }

/* ===== Цитата */
.quote-box{
  background:#141B38; color:#fff; border-radius:0;
  margin:30px 0 0; padding:24px;
}
.quote-box__text{ color:#fff; }
.quote-box-wrapper::before{ content:none; } /* иконки-кавычки отключены */

/* ===== Related (Swiper) */
.related-block{ margin-bottom:50px;margin-top: 120px; }
.related-head{
  display:flex; align-items:center; justify-content:space-between; margin:26px 0 8px;
}
.related-title{ font-family:'NafteraWebBlackItalic'; }

.related-slider{ position:relative; margin-top:12px; }
.related-slider .swiper-wrapper{ align-items:stretch; }
.related-slider .swiper-slide{ height:auto; }

/* Превью внутри related поменьше */
.related-slider .post-card__thumb img,
.related-slider .post-card__thumb--ph{ height:180px; }
@media(max-width:980px){
  .related-slider .post-card__thumb img,
  .related-slider .post-card__thumb--ph{ height:160px; }
}
@media(max-width:640px){
  .related-slider .post-card__thumb img,
  .related-slider .post-card__thumb--ph{ height:150px; }
}

/* Кнопки-стрелки как на макете */
.related-nav{ display:flex; gap:10px; }
.related-btn{
  width:36px; height:36px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid #E6E8EF; background:#fff; color:#1F2937;
  cursor:pointer; padding:0; box-shadow:0 1px 2px rgba(0,0,0,.04);
  transition:background-color .15s ease, border-color .15s ease, transform .05s; position:relative;
}
.related-btn::before{
  content:""; width:18px; height:18px; background-repeat:no-repeat; background-position:center; background-size:contain;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M13 5l7 7-7 7'/%3E%3C/svg%3E");
}
.related-prev::before{ transform:scaleX(-1); }
.related-btn:hover{ background:#F6F7FA; }
.related-btn:active{ transform:translateY(.5px); }
.related-next{ background:#27304A; border-color:#27304A; color:#fff; }
.related-next:hover{ background:#232B44; }
.related-next::before{
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M13 5l7 7-7 7'/%3E%3C/svg%3E");
}
.related-btn.swiper-button-disabled{ opacity:.4; cursor:default; pointer-events:none; filter:grayscale(20%); }

/* ===== Типографика «Детального описания» */
.article-body{ font-size:16px; line-height:1.7; color:#0f172a; }
.article-body p{ margin:0 0 14px; }
.article-body h2{
  font-weight:400; font-size:24px; line-height:1.2; margin:22px 0; text-align:center;
  font-family:'NafteraWebBlackItalic'; color:#141B38;margin-bottom: 32px;
}
.article-body h3{ font-weight:800; font-size:22px; line-height:1.3; margin:18px 0 10px; }

/* 2 изображения рядом */
.article-body .img-2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:12px 0 16px; }
.article-body .img-2 img{ display:block; width:100%; height:auto; border-radius:0px; }
@media(max-width:765px){ .article-body .img-2{ grid-template-columns:1fr; } 
.blog-detail__title {
    font-size: 24px;
}
.article-body h2 {
    font-size: 18px;
}
}

/* Маркированные пункты */
.article-body ul.bullets{ list-style:none; margin:12px 0 16px; padding:0; }
.article-body ul.bullets li{ position:relative; padding-left:22px; margin:6px 0; }
.article-body ul.bullets li::before{
  content:""; position:absolute; left:0; top:.95em; transform:translateY(-50%);
  width:5px; height:5px; border-radius:50%; background:#000;
}

/* Нумерованные шаги с круглыми плашками */
.article-body ol.steps{ counter-reset:step; list-style:none; margin:14px 0 18px; padding:0; }
.article-body ol.steps li{
  counter-increment:step; display:grid; grid-template-columns:44px 1fr; gap:25px;
  align-items:center; margin:10px 0;
}
.article-body ol.steps li::before{
  content:counter(step); width:44px; height:44px; border-radius:50%;
  background:#45B5AA; color:#fff; display:flex; align-items:center; justify-content:center;
  font-family:'NafteraWebBlackItalic'; line-height:1;
}

/* Важная ремарка */
.article-body .note{ font-style:italic; margin-top:12px; }
.article-body .note--important{ color:#45B5AA; font-weight:400; font-family:'NafteraWebBlackItalic'; font-size:16px; }

/* ===== Пагинация (Bitrix) — только активная кнопка */
.bx-pagination .bx-pagination-container ul li.bx-active span{
  border-radius:10px; width:45px; height:45px; background:#adadad !important;
}
.blog-list .pager{
  grid-column: 1 / -1;     /* растягиваем на всю ширину сетки */
  margin-top: 24px;
  justify-self: center;    /* по желанию: центрировать сам пейджер */
}
.blog-list .bx-pagination{ /* если используешь битриксовую разметку */
  display:flex; justify-content:center;
}
/* Дотсы — по умолчанию скрыты (десктоп) */
.related-dots { display:none; margin-top:12px; text-align:center; }

/* Стрелки — видны на десктопе */
.related-nav { display:flex; gap:10px; }

/* Вид и активность точек */
.related-dots .swiper-pagination-bullet{
  width:8px;height:8px;border-radius:50%;
  background:#C5CBD8;opacity:.8;margin:0 4px;
}
.related-dots .swiper-pagination-bullet-active{
  background:#2CD5C4;opacity:1;
}

/* На мобилке показываем дотсы и убираем стрелки */
@media (max-width: 767px){
  .related-nav{ display:none; }
  .related-dots{ display:block; }
  .related-dots {
    bottom: 0!important;
  }
  .related-slider {
      position: relative;
      margin-top: 12px;
      padding-bottom: 50px;
  }
}
.bx-edit-mode .bx_incl_area,
.bx-edit-mode .bx-incl-area { display: contents; }
/* End */


/* Start:/bitrix/templates/logimarket_template/components/bitrix/system.pagenavigation/round/style.css?17629483962692*/
.bx-pagination {
	margin: 10px 0;
}
.bx-pagination .bx-pagination-container {
	text-align: center;
	position: relative;
}
.bx-pagination .bx-pagination-container ul {
	padding: 0;
	margin: 0;
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}
.bx-pagination .bx-pagination-container ul li {
	display: inline-block;
	margin: 0 4px;
}
.bx-pagination .bx-pagination-container ul li span{
	background: transparent;
	transition: all 0.1s ease;
	padding: 0 4px;
	height: 44px;
	min-width: 44px;
	line-height: 44px;
	color: #444;
	font-size: 18px;
	border-radius: 25px;
	vertical-align: middle;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	font-family: 'GeistBold';
	justify-content: center;
}

.bx-pagination .bx-pagination-container ul li span svg path {
	transition: fill 0.1s ease;
}

.bx-pagination .bx-pagination-container ul li a {
	text-decoration: none;
	display: block;
	border-radius: 16px;
	height: 44px;
	min-width: 44px;
	line-height: 44px;
	color: #141B38;
	vertical-align: middle;
}
.bx-pagination .bx-pagination-container ul li a:hover span{
	background: #2A3255;
	color: #fff;
}
.bx-pagination .bx-pagination-container ul li.bx-active span{
	background: #EFEFEF;
}
.bx-pagination .bx-pagination-container ul li.bx-pag-all a span,
.bx-pagination .bx-pagination-container ul li.bx-pag-prev a span,
.bx-pagination .bx-pagination-container ul li.bx-pag-next a span {
	background: #fff;
	color: #444;
}
.bx-pagination .bx-pagination-container ul li.bx-pag-all span,
.bx-pagination .bx-pagination-container ul li.bx-pag-prev span,
.bx-pagination .bx-pagination-container ul li.bx-pag-next span{
	color: #aab1b4;
	background: #fff;
}
.bx-pagination .bx-pagination-container ul li.bx-pag-all a:hover span,
.bx-pagination .bx-pagination-container ul li.bx-pag-prev a:hover span,
.bx-pagination .bx-pagination-container ul li.bx-pag-next a:hover span {
	background: #fff;
	border-color: #DADADA;
	color: #000;
}

.bx-pagination .bx-pagination-container ul li.bx-pag-next a:hover span,
.bx-pagination .bx-pagination-container ul li.bx-pag-prev a:hover span {
	background-color: #2A3255;
}

.bx-pagination .bx-pagination-container ul li.bx-pag-next a:hover span svg path,
.bx-pagination .bx-pagination-container ul li.bx-pag-prev a:hover span svg path{
	fill: #fff;
}

.bx-pagination .bx-pagination-container ul li.bx-pag-prev span,
.bx-pagination .bx-pagination-container ul li.bx-pag-next span {
	opacity: 0.3;
}

.bx-pagination .bx-pagination-container ul li.bx-pag-prev a span,
.bx-pagination .bx-pagination-container ul li.bx-pag-next a span {
	opacity: 1;
}
/* End */
/* /bitrix/templates/logimarket_template/components/bitrix/news/blog/style.css?17629483968861 */
/* /bitrix/templates/logimarket_template/components/bitrix/system.pagenavigation/round/style.css?17629483962692 */