/* ===== NEWS ===== */
.section-news{
  --card-gap: 24px;
  --card-w: calc((100% - 2 * var(--card-gap)) / 3); /* ровно 3 карточки */
  padding: 48px 0;
  position: relative;
}

/* фон секции */
.section-news::before{
  content:"";
  position:absolute; inset:0;
  background: var(--news-bg) center/cover no-repeat;
  pointer-events:none;
}
.section-news > .container{ position: relative; z-index: 1; }

/* Заголовок секции */
.section-news .heading-accent{
  margin-bottom: var(--gap-xxl);
}

/* Вьюпорт: без правого паддинга, чтобы не было 3.1 карточки */
.news__viewport[data-slider]{
  position: relative;
  overflow-x: hidden;
  overflow-y: hidden;
  padding-inline: 0;   /* было: 0 + padding-right */
  padding-bottom: 0;   /* можно убрать запас под тень; см. ниже альтернативу */
}
/* на всякий случай — убрать возможную маску */
.news__viewport[data-slider]::after{ content:none !important; }

.news__track[data-slider-track]{
  display: flex;
  gap: var(--card-gap);
  transition: transform .35s ease;
  will-change: transform;
  align-items: stretch;
}
.news__track [data-slider-slide]{
  flex: 0 0 var(--card-w);
  width: var(--card-w);
  display: flex;
}

.news-card{
  width: 100%;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  display: flex;
  height: 100%;
}
.news-card__body{
  display:flex; flex-direction:column;
  padding: 20px 20px 18px;
  gap: 14px; color:#13223a;
}

/* Заголовок карточки */
.news-card__title{
  margin: 0;
  font-size: 30px;
  line-height: 1.2;
  font-weight: 700;
}
.news-card__text{ font-size: 14px; line-height: 1.6; color:#3b536e; }

/* Кнопка "Подробнее" (Regular, выше) */
.news-card__body .btn{
  margin-top:auto;
  height:56px;
  padding:0 28px;
  font-weight:400;          /* Regular */
  gap:12px;
}
.news-card__body .btn .btn__ico{
  width:36px; height:36px;
  flex:0 0 36px;
  border-radius:999px;
  display:grid; place-items:center;
  border:1px solid currentColor;
  margin-left:8px;
}
.news-card__body .btn .btn__ico::before{ content:none; } /* стрелка берётся из HTML */

/* Навигация блока */
.section-news .news-nav{
  display:flex; align-items:center; justify-content:space-between;
  margin-top:20px; gap:16px;
}

/* Dots (gap 40px) */
.section-news .hero__dots{
  position:static; display:flex; align-items:center; gap:40px;
}
.section-news .hero__dots button{
  all:unset; width:8px; height:8px; border-radius:50%;
  background: var(--accent); cursor:pointer; opacity:.9;
  transition: transform .15s, background-color .15s, border-color .15s;
}
.section-news .hero__dots button:hover{ transform:scale(1.1); opacity:1; }
.section-news .hero__dots button[aria-selected="true"]{
  background:transparent; border:6px solid var(--accent); width:10px; height:10px;
}

/* Десктопные точки - показываем только на >1024px */
.section-news .hero__dots--desktop{
  display: flex;
}

/* Мобильные точки - скрыты по умолчанию */
.section-news .hero__dots--mobile{
  display: none;
}

@media (min-width: 1025px){
  .section-news .hero__dots--mobile{
    display: none !important;
  }
}

@media (max-width: 1024px){
  .section-news .hero__dots--desktop{
    display: none !important;
  }
  .section-news .hero__dots--mobile{
    display: flex !important;
  }
}

/* Стрелки (как было) */
.section-news .hero__arrows{ position:relative; display:flex; gap:12px; z-index:3; bottom:10px; }

.section-news .navmol{
  position:relative; width:112px; height:59px;
  padding:0; border:0; background:transparent; cursor:pointer;
}
.section-news .navmol--prev{
  background: no-repeat center/contain url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' width='112' height='59' viewBox='0 0 112 59'>\
  <path fill-rule='evenodd' clip-rule='evenodd' d='M112 29.5C112 45.7924 99.1425 59 83.2821 59C71.5331 59 61.432 51.7524 56.9845 41.3721L56.7729 41.295C52.2539 39.6474 47.2156 40.3847 43.3499 43.2596L38.6428 46.7601C34.5385 50.6933 29.0301 53.1 22.9744 53.1C10.286 53.1 0 42.5339 0 29.5C0 16.4661 10.286 5.9 22.9744 5.9C30.0448 5.9 36.3693 9.18094 40.5837 14.3416L41.3686 15.0238C45.6646 18.7579 51.5616 19.8453 56.8156 18.0302C61.1722 7.43534 71.3818 0 83.2821 0C99.1425 0 112 13.2076 112 29.5Z' fill='white'/>\
  <path d='M27.8 30H16.7M16.7 30L22.26 35.7M16.7 30L22.26 24.3' stroke='%232A5273' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/>\
</svg>");
}
.section-news .navchip{
  position:absolute; width:60px; height:60px; right:-3px; bottom:-9px;
  padding:0; border:0; background:transparent; cursor:pointer; z-index:4;
  background: no-repeat center/contain url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'>\
  <circle cx='30' cy='30' r='30' fill='%232A5273'/>\
  <g transform='translate(30,30) scale(1.3) translate(-30,-30)'>\
    <path d='M26 30H37M37 30L31.5 24.3M37 30L31.5 35.7' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/>\
  </g>\
</svg>");
}

/* Скрываем мобильные стрелки на десктопе по умолчанию */
.section-news .news-nav > .navmol,
.section-news .news-nav > .navchip{
  display: none;
}

/* NEWS: ≤1024 — мобильная навигация как в testimonials */
@media (max-width:1024px){
  /* Скрываем десктопную навигацию */
  .section-news .hero__dots--desktop,
  .section-news .hero__arrows{
    display: none;
  }

  /* Показываем мобильные стрелки */
  .section-news .news-nav > .navmol,
  .section-news .news-nav > .navchip{
    display: inline-flex;
  }

  /* Мобильная навигация - всё в одну линию */
  .section-news .news-nav{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 16px;
    gap: 20px; /* одинаковый зазор между всеми элементами */
    height: 30px;
  }

  /* Мобильные точки */
  .section-news .hero__dots--mobile{
    display: flex;
    gap: 20px;
    align-items: center;
    height: 30px;
    flex-shrink: 0;
  }

  .section-news .hero__dots--mobile button{
    all: unset;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--accent);
    cursor: pointer;
    opacity: .9;
    transition: transform .15s ease, background-color .15s ease;
  }

  .section-news .hero__dots--mobile button:hover{
    transform: scale(1.1);
    opacity: 1;
  }

  .section-news .hero__dots--mobile button[aria-selected="true"],
  .section-news .hero__dots--mobile button[aria-current="true"]{
    background: var(--accent);
    border: 0;
    width: 8px;
    height: 8px;
  }

  /* Мобильные стрелки - такой же размер как контейнер */
  .section-news .navmol,
  .section-news .navchip{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    cursor: pointer;
    flex-shrink: 0;
    background: no-repeat center/contain url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' width='19' height='22' viewBox='0 0 19 22' fill='none'>\
<path d='M17.0861 9.27815C18.3961 10.0523 18.3961 11.9477 17.0861 12.7219L3.5205 20.7379C1.83168 21.7358 -0.134923 19.959 0.687114 18.1779L3.61318 11.8381C3.85862 11.3063 3.85862 10.6937 3.61318 10.1619L0.687116 3.82208C-0.13492 2.041 1.83167 0.264169 3.52049 1.26211L17.0861 9.27815Z' fill='%23446A81'/></svg>");
    border: none;
    padding: 0;
    margin: 0;
    transition: opacity 0.2s ease;
    /* Переопределяем глобальные правила из globals.css */
    transform: none !important;
    transform-origin: center center;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    top: auto !important;
  }

  .section-news .navmol:hover,
  .section-news .navchip:hover{
    opacity: 0.7;
  }

  /* Левая стрелка - повернута влево */
  .section-news .navmol{
    transform: rotate(180deg) !important;
  }
}

/* NEWS: 1280..1024 — активная точка всегда ЗАЛИВКОЙ */
@media (max-width:1280px) and (min-width:1024px){
  .section-news .hero__dots button {
    background: var(--accent);      /* все точки заливка */
    border: 0;
    width: 8px; height: 8px;
  }
  .section-news .hero__dots button[aria-selected="true"],
  .section-news .hero__dots button.is-active {
    opacity: 1;                     /* только активная яркая */
  }
}

/* ещё компактнее на планшете */
@media (max-width:768px){
  .section-news .navmol,
  .section-news .navchip{ 
    width: 24px; 
    height: 24px; 
  }
  .news__viewport[data-slider]{ padding-right: 0; padding-bottom: 20px; }
  .news__track [data-slider-slide]{ 
    flex-basis: calc(100% - var(--card-gap)); 
    width: calc(100% - var(--card-gap)); 
  }
}
@media (max-width:425px){
  .section-news{
    --card-gap: 20px;
    --card-w: calc((100% - var(--card-gap)) / 1); /* 1 карточка */
    padding: 32px 0;
  }
  
  .news__viewport[data-slider]{
    padding-left: 0;
    padding-right: 0;
  }
  
  .news__track [data-slider-slide]{ 
    flex-basis: 100%; 
    width: 100%; 
  }
  
  .news-card__body{
    padding: 16px 16px 14px;
    gap: 12px;
  }
  
  .news-card__title{
    font-size: 24px;
    line-height: 1.3;
  }
  
  .news-card__text{ 
    font-size: 13px; 
    line-height: 1.5; 
  }
  
  .news-card__body .btn{
    height: 48px;
    padding: 0 20px;
    font-size: 14px;
  }
}

/* Дополнительные стили для средних мобильных устройств */
@media (max-width:640px) and (min-width:426px){
  .section-news{
    padding: 40px 0;
  }
  
  .news__viewport[data-slider]{
    padding-left: 0;
    padding-right: 0;
  }
  
  .news__track [data-slider-slide]{ 
    flex-basis: 100%; 
    width: 100%; 
  }
  
  .news-card__body{
    padding: 18px 18px 16px;
    gap: 13px;
  }
  
  .news-card__title{
    font-size: 26px;
    line-height: 1.25;
  }
  
  .news-card__text{ 
    font-size: 13px; 
    line-height: 1.5; 
  }
  
  .news-card__body .btn{
    height: 52px;
    padding: 0 24px;
    font-size: 14px;
  }
}