/*Стиль для топ блок и сайдбар*/
#top-block {
  display: flex;
  gap: 20px; /* расстояние между блоками */
  margin-bottom: 40px;
}

/* Левая колонка (контент) */
#top-block > div {
  flex: 0 0 75%; /* 3/4 ширины */
  max-width: 75%;
}

/* Правая колонка (сайдбар) */
#top-block > aside {
  flex: 0 0 25%; /* 1/4 ширины */
  max-width: 25%;
  border-left: 1px solid #ccc;
}
.sidebar {
  padding:0 20px;
}
.spectator-header-stripes {
  padding: 0 20px;
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  width: 100%; 
  gap: 2px;
}
.stripe {
  height: 2px;
  background-color: #c8102e;
}
.stripe.light {
  opacity: 0.3;
}
.stripe.lighter {
  opacity: 0.15;
}
.sidebar-title {
  padding: 0 20px;
    margin-top: 10px;
    font-family: "Bona Nova SC", serif;
    font-size: 18px;
    font-weight: 600;
    color: #c8102e;
}
.actual {
  padding-bottom: 10px;
  border-bottom: 1px solid #ccc;
}
/* Для адаптива */
@media (max-width: 900px) {
  #top-block {
    flex-direction: column;
  }
  #top-block > div,
  #top-block > aside {
    flex: 0 0 100%;
    max-width: 100%;
  }
   #top-block > aside {
    display: none;
  }
}




/*Cтили для блока политика и экономика*/

/*Заголовок блока*/
.section-title {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.section-title .line {
  flex: 1;
  height: 1px;
  background-color: #ccc;
  margin: 0 15px;
  max-width: 100%;
}
/*Заголовок блока конец*/


/*Внешний контейнер*/
#block-politics {
  display: flex;
  gap: 20px;       /* расстояние между элементами */
}

#block-politics > * {
  flex: 1;         /* чтобы элементы делили пространство поровну */
}
/*Внешний контейнер конец*/



/*Контейнер маленькой новости*/

#block-politics .news-small {
  display: flex;
  gap: 15px; /* промежуток между блоками */
  align-items: center;
}

/* первый элемент */
#block-politics .news-small > :first-child {
  flex: 2; /* занимает 2/3 */
}

/* второй элемент */
#block-politics .news-small > :last-child {
  flex: 1; /* занимает 1/3 */
  padding-top: 15px;
  padding-bottom: 15px;
}

/* картинки внутри */
.news-small img {
  width: 200px;
  height: 150px;
  object-fit: cover; /* чтобы не растягивались криво */
}
.news-small.with-grey-lines {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}
/*Контейнер маленькой новости конец*/

 /* Стили для планшета */
@media (max-width: 1024px) {


 
}
/* Стили для планшета конец*/

/* Стили для мобильного*/
@media (max-width: 500px) {
  .content-container.site-container {
    padding: 0!important;
    margin: 0!important;
  }
  #block-politics {
  flex-direction: column;
}
  /*Контейнер большой новости*/
  .news-big {
  display: flex;
  flex-direction: column;
}
/*Контейнер большой новости конец*/
  .news-small-mobile, .news-big, .news-grid-item   {
  padding:20px 20px;
  }
  .news-small-mobile, .news-grid-item {
  display: flex;
  gap: 12px;
  }
  .news-small-mobile a, .news-grid-item a {
    display: flex;
    gap: 12px;
    align-items: center;
    text-decoration: none;
    line-height: 19px;
  }
  .margin-top-10 {
    margin-top: 20px;
  }
  .padding-top-10 {
    padding-top: 10px;
  }
.news-small-mobile img, 
.news-grid-item img {
  flex: 0 0 100px;   /* фиксируем ширину */
  height: 80px; 
  object-fit: cover; 
  border-radius: 4px;
  display: block;    /* убираем inline-баги */
  max-width: 100px;  /* дополнительная страховка */
}
.news-small-mobile a, 
.news-grid-item a {
  display: flex;
  align-items: center; /* картинка по центру по вертикали */
  gap: 12px;
  text-decoration: none;
}


  .news-small-mobile, .news-grid-item  {
    border-top: 1px solid #ccc;
  }
  #block-politics {
    gap: 0;       /* расстояние между элементами */
  }
}
/* Стили для мобильного конец*/
/*Cтили для блока политика и экономика конец*/

/*Cтили для блока мир*/
#block-world {
  background-color: #17b5cc;
}
#block-world .news-small.with-white-lines {
  border-right: 1px solid #fff;
  border-left: 1px solid #fff;
}
#block-world .news-big.descktop-only {
  display: flex;
  gap: 20px;
  align-items: center;
  border-bottom: 1px solid #fff;
  padding: 20px 0;
} 
#block-world .news-big> * {
  flex: 1;
}

/*маленькие новости*/
/* Контейнер маленьких новостей */
#block-world .news-small-wrapper.descktop-only {
  display: flex;
  /*gap: 10px;  расстояние между колонками */
}

#block-world .news-small.descktop-only {
  flex: 1;
  padding: 20px;
  position: relative; /* нужно для ::after */
}

#block-world .news-small.descktop-only:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 20px;      /* отступ сверху = (100% - 80%) / 2 */
  right: 0;
  width: 1px;
  height: 90%;   /* линия занимает 80% высоты блока */
  background-color: #fff;
}


/* Ссылка на миниатюру */
#block-world .news-small img {
  width: 100%;
  height: 200px;
  display: block;
  margin-bottom: 10px;
  object-fit: cover;
}

/* Контент под изображением */
#block-world .news-small div {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
/*маленькие новости конец*/


/*Заголовок блока*/
.world-bg{
    background-color:  #17b5cc;
  }
.section-title-world {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 20px;
}
.section-title-world .line {
  flex: 1;
  height: 1px;
  background-color: #fff;
  margin: 0 15px;
  max-width: 100%;
}

/*Заголовок блока конец*/

/*Общество и культура планшет*/
#block-culture .socal-culture {
  display: flex;
  gap: 0; /* убираем отступы */
  position: relative; /* чтобы псевдоэлементы позиционировались */
}

#block-culture .socal-culture > div {
  flex: 1; /* делим пополам */
  padding: 0 20px;
  position: relative; /* нужно для ::after */
}

#block-culture .socal-culture > div:first-child::after {
  content: "";
  position: absolute;
  top: 10%; /* чтобы линия начиналась не с самого верха */
  right: 0;
  width: 1px;
  height: 85%; /* высота линии */
  background-color: #ccc;
}
#block-culture .news-small-mobile {
  display: flex;
  align-items: flex-start; /* чтобы верхушки совпадали */
  gap: 10px; /* расстояние между картинкой и текстом */
  align-items: center;
}
#block-culture .news-small-mobile h4 a {
  display: -webkit-box;
  -webkit-line-clamp: 2;   /* сколько строк показывать */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: calc(1.4em * 2); /* высота = кол-во строк × line-height */
}
#block-culture .news-small-wrapper.tablet-only.desctop-only .news-small-mobile {
  align-items: center;
}
#block-culture .news-small-wrapper.tablet-only .news-small-mobile {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid #ccc;
}

#block-culture .news-small-mobile.tablet-only:last-child {
  border-bottom: none; /* у последнего убираем линию */
  margin-bottom: 0;
  padding-bottom: 0;
}


#block-culture .news-small-mobile a img {
  width: 80px !important;
  height: 80px !important;
  object-fit: cover; /* чтобы миниатюра обрезалась ровно */
  display: block;
}

#block-culture .news-small-mobile > div {
  flex: 1; /* текст занимает оставшееся место */
}
/* Контейнер для миниатюр */
#block-culture .news-small-wrapper.tablet-only.desctop-only .img-thumb-category {
  display: block;
  position: relative;
  overflow: hidden;  /* фиксированная высота под thumbnail */
}

/* Картинка внутри */
#block-culture .news-small-wrapper.tablet-only.desctop-only .img-thumb-category img {
  width: 100%;
  height: 100%;
  object-fit: cover;       /* обрезаем по контейнеру */
  transition: transform 0.6s ease;
}

/* Эффект лупы при наведении */
#block-culture .news-small-wrapper.tablet-only.desctop-only .img-thumb-category:hover img {
  transform: scale(1.1);   /* увеличивается внутри */
}

/*Блок культура и общество конец*/

/*Блок мнение*/
/* Контейнеры */
#block-experts .news-small-wrapper.descktop-only .news-small-mobile {
  display: flex;
  gap: 15px;
}

#block-experts .news-small-wrapper.descktop-only .news-small-mobile > div {
  flex: 1 1 33.333%;
  box-sizing: border-box;
}

/* Дата */
.day-of-the-week {
  font-family: "Bona Nova", serif;
  font-size: 25px;
}

/* Текст с ограничением */
#block-experts .news-small-wrapper.descktop-only .article-category, #block-politics .news-big .article-category {
  position: relative;
  overflow: hidden;
  max-height: 4.5em; /* 3 строки */
}

#block-experts .news-small-wrapper.descktop-only .article-category p, #block-politics .news-big .article-category p {
  font-size: 15px;
  line-height: 1.5em;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

#block-experts .news-small-wrapper.descktop-only .article-category::after, #block-politics .news-big .article-category::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1.5em;
  background: linear-gradient(to top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
  pointer-events: none;
}

/* Изображения */
#block-experts .news-small-wrapper.descktop-only .large-img-category {
  position: relative;
  overflow: hidden;       /* чтобы обрезалось по контейнеру */
  height: 250px;          /* фиксированная высота (подбери под макет) */
}

#block-experts .news-small-wrapper.descktop-only .large-img-category img {
  width: 100%;
  height: 100%;
  object-fit: cover;      /* картинка заполняет контейнер */
  transition: transform 0.6s ease; /* плавный эффект */
}

#block-experts .news-small-wrapper.descktop-only .large-img-category:hover img {
  transform: scale(1.1); /* эффект «лупы» */
}


/* Стили для мобильного*/
@media (max-width: 500px) {
  .news-small-mobile  {
  display: flex;
  gap: 12px;
  }
  .world-bg{
    background-color:  #17b5cc;
  }
  .news-small-mobile a {
    display: flex;
    gap: 12px;
    align-items: center;
    text-decoration: none;
    line-height: 19px;
  }
  .margin-top-10 {
    margin-top: 20px;
  }
  .padding-top-10 {
    padding-top: 10px;
  }
  .news-small-mobile img {
    flex-shrink: 0; 
    width: 100px; 
    height: 80px; 
    object-fit: cover; 
    border-radius: 4px;
  }
  .news-small-mobile {
    border-top: 1px solid #ccc;
  }
  #block-world {
    padding-bottom: 20px;
  }
  #block-experts .news-small-mobile {
    border: 0;
  }
  #block-experts  .news-grid-item {
    border: none !important;
  }
}

/*блок культура моб*/
/* Мобильные стили для блока culture, унификация с другими блоками */
@media (max-width: 500px) {
  #block-culture {
    padding: 0;
  }

  /* Контейнер мини-новостей */
  #block-culture .news-small-wrapper,
  #block-culture .news-small-wrapper.tablet-only,
  #block-culture .news-small-wrapper.tablet-only.desctop-only {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0;
    padding: 0;
  }

  /* Мини-новости */
  #block-culture .news-small-mobile {
    display: flex;
    flex-direction: row;
    gap: 12px;
    align-items: center; /* выравнивание как в других блоках */
    padding: 20px 20px;
    border-top: 1px solid #ccc;
    margin-top: 0;
    margin-bottom: 0;
  }

  /* Ссылка внутри блока */
  #block-culture .news-small-mobile a {
    display: flex;
    gap: 12px;
    align-items: center;
    text-decoration: none;
    line-height: 19px;
  }

  /* Картинка мини-новости */
#block-culture .news-small-mobile a img {
  width: 100px !important;  /* как в других блоках */
  height: 80px !important;  /* как в других блоках */
  object-fit: cover;
  border-radius: 4px;
}


  /* Контент под картинкой */
  #block-culture .news-small-mobile > div {
    flex: 1; /* текст занимает оставшееся место */
  }

  /* Заголовки с обрезкой */
  #block-culture .news-small-mobile h4 a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: calc(1.4em * 2);
    color: #000; /* как в других блоках */
  }

  /* Последний элемент без border */
  #block-culture .news-small-mobile:last-child {
    border-bottom: 0;
    margin-bottom: 0;
  }
}

/* Стили для мобильного конец*/
