/* base reset */
html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }

body {
  margin: 0;                    /* убираем дефолтный отступ */
  background: #F9F9F9;          /* твой фон */
  font-family: 'Cera Pro', Arial, sans-serif;
  font-size: 16px;              /* из фигмы */
}

img, svg, video, canvas {
  display: block;               /* убирает «белые щели» из-за baseline */
  max-width: 100%;
}

a { text-decoration: none; color: inherit; cursor: pointer;}
button { border: 0; background: none; font: inherit; cursor: pointer;}

/* === ЕДИНЫЙ :root === */
:root{
  /* базовые цвета/фон/текст */
  --ni-blue:#153983;
  --ni-bg:#F9F9F9;
  --ni-text:#153983;

  /* hero */
  --ni-muted:#6D86B6;
  --ni-green:#62B985;
  --ni-green-pressed:#4fa774;

  /* about + контейнер */
  --container-max: 1320px;
  --container-pad: 20px;
  --container-nudge: 0px;
  --ni-about-bg:#E9ECEF;
  --chip-text:#0F1F3A;
}

.ticker-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #153983;
  color: #F9F9F9;            
  z-index: 1001;
  height: 40px;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.ticker-container {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
}

.ticker-static {
  flex-shrink: 0;
  padding-left: 62px;   
  padding-right: 62px;  
  font-weight: 600;     
  font-size: 13px;      
  border-right: 1px solid rgba(249, 249, 249, 0.3); 
  height: 100%;
  display: flex;
  align-items: center;
}

.ticker-wrap {
  flex-grow: 1;
  overflow: hidden;
}

.ticker-move {
  display: flex;
  white-space: nowrap;
  animation: scroll-left 25s linear infinite;
}

.ticker-item {
  padding-left: 62px;  
  padding-right: 62px; 
  font-size: 13px;     
  font-weight: 400;    
  color: #F9F9F9;
}

@keyframes scroll-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* Если tick-header фиксированный */
.ni-header {
  position: sticky;
  top: 40px; /* подстрой под реальную высоту tick-header */
  z-index: 999;
  background: var(--ni-bg);
  border-bottom: 1px solid rgba(0,0,0,.04);
}

.ni-container{
  max-width: 1320px;
  margin: 0 auto;
  padding: 14px 20px;
  display: flex;
  align-items: center;
  gap: 20px;
}

.ni-header_wrap {
  max-width: none;
  padding-right: 55px;
}

.ni-logo img{
  display:block;
  height:64px;        /* подгоните при необходимости */
  width:auto;
}

.ni-nav{
  display:flex; 
  gap: 28px;
  margin-left: 52px;
  flex: 1 1 auto;     /* растягиваем меню */
  justify-content: space-evenly;
}




.ni-link{
  font-size:16px; 
  line-height:1;
  color: var(--ni-blue);
  text-decoration:none;
  padding: 16px 22px;
  transition: opacity .2s ease;
  border-radius: 999px;
  padding-inline: 24px;   /* чтобы актив выглядел «пилюлей» */
}

.ni-link:hover{ opacity:.75; }

.ni-link--active{
  background: var(--ni-blue);
  color: #fff;
}

.ni-actions{
  display:flex; 
  align-items:center; 
  gap: 22px;
  margin-left: 8px;
  flex: 0 0 auto;
}

.ni-icon{
  display:inline-flex; 
  align-items:center; 
  justify-content:center;
  width: 30px; height: 30px;
}

.ni-icon img{
  display:block;
  width: 100%; height: 100%;
  object-fit: contain;     /* под ваши PNG/SVG */
  /* Если нужны монохромные синие иконки — грузите уже тонированные */
}

/* hero */
.ni-hero{
  background: var(--ni-bg);
}

.ni-hero .ni-container{
  padding-top: 48px;            /* отступ от header */
  padding-bottom: 48px;
}

.ni-hero__wrap{
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 1fr; /* равные колонки */
  gap: 20px; /* оставляем чуть меньше зазор */
}

.ni-hero__text{ 
  color: var(--ni-blue);
}

.ni-hero__title {
  font-family: 'Unbounded', sans-serif;
  font-weight: 400; /* Regular */
  color: var(--ni-blue);
  margin: 0 0 20px;
  line-height: 1;
  letter-spacing: -0.03em;
  font-size: clamp(30px, 7vw, 74px); /* максимум 64px, как в фигме */
}

.ni-hero__subtitle{
  margin: 0 0 28px;
  color: var(--ni-muted);
  font-size: clamp(16px, 3vw, 27px);
  line-height: 1.4;
}

.ni-hero__actions {
  display: flex;
  flex-direction: column; /* теперь кнопки в колонку */
  gap: 18px;              /* расстояние между ними */
  align-items: flex-start; /* выравнивание по левому краю */
}

.ni-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 56px;
  padding: 4px 42px;
  border-radius: 999px;
  font-size: 21px;
  text-decoration: none;
  transition: transform .06s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease;
  will-change: transform;
}

.ni-btn:active{ transform: translateY(1px); }

.ni-btn--primary{
  background: var(--ni-green);
  color: #fff;
  box-shadow: 0 6px 18px rgba(98,185,133,.25);
}
.ni-btn--primary:hover{ background: var(--ni-green-pressed); }

.ni-btn--outline{
  background: transparent;
  color: var(--ni-blue);
  border: 2px solid var(--ni-blue);
}
.ni-btn--outline:hover{
  background: rgba(21,57,131,0.06);
  color: var(--ni-blue);
}


/* Auth buttons in header */
.ni-auth{
  display:flex;
  align-items:center;
  gap:12px;
}

.ni-btn--sm{
  height: 38px;
  padding: 16px 24px;
  font-size: 18px;
  line-height: 1;
  border-width: 1.5px; /* для outline-кнопки */
}

.ni-hero__media{
  position: relative;
  min-height: 280px;
}
.ni-hero__media img {
  max-width: 120%;        /* увеличиваем картинку */
  height: auto;
  display: block;
  object-fit: contain;
  transform: translateX(-6%); /* сдвигаем влево, чтобы наезжала на текст */
}

/* О нас */

/* === НАСТРОЙКИ КОНТЕЙНЕРА — подставь те же, что у hero/header === */

/* Каркас секции */
.ni-about{ overflow-x: clip; }
.ni-about__grid{
  display:grid;
  grid-template-columns: minmax(0,1.8fr) minmax(0,1fr); /* левая | правая */
  align-items: stretch;  /* одинаковая высота колонок */
  gap: 0;                /* без шва между колонками */
  min-height: 520px;
}
.ni-about__left{
  background: var(--ni-about-bg);
  min-width: 0;
}
.ni-about__right{
  position: relative;
  overflow: hidden;
  min-width: 0;
}
/* картинка всегда ровно по высоте правой колонки */
.ni-about__right img{
  position: absolute;
  inset: 0;              /* top/right/bottom/left: 0 */
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center right; /* при необходимости можно изменить фокус */
  display:block;
}

/* Выровнять контент левой панели по ЛЕВОМУ краю глобального контейнера */
.ni-about__inner{
  padding-top: 48px;
  padding-bottom: 36px;
  padding-right: var(--container-pad);
  padding-left: calc(
    (100vw - var(--container-max)) / 2 + var(--container-pad) + var(--container-nudge)
  );
  box-sizing: border-box;
}
@supports (width: 1svw){
  .ni-about__inner{
    padding-left: calc(
      (100svw - var(--container-max)) / 2 + var(--container-pad) + var(--container-nudge)
    );
  }
}

/* Типографика */
.ni-about__title{
  font-family: 'Unbounded', sans-serif;
  font-weight: 700;
  font-size: 56px;        /* под скрин; можно 48/64 */
  line-height: 1.1;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--ni-blue);
  margin: 0 0 26px;
}
.ni-about__lead{
  font-family: 'Cera Pro', Arial, sans-serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.45;
  color: #2E2E2E;
  margin: 0 0 28px;
}

/* Чипы — полностью авто */
.ni-about__chips{
  display: flex;
  flex-wrap: wrap;          /* перенос по строкам */
  gap: 16px 24px;           /* вертикальный / горизонтальный зазор */
  list-style: none;
  margin: 0 0 50px;
  padding: 0;
  align-items: flex-start;
  align-content: flex-start;
}
.ni-about__chips li{
  flex: 0 1 auto;           /* без фиксированных ширин */
  width: auto;
  max-width: 100%;
  background: #fff;
  border-radius: 999px;
  padding: 12px 22px;
  font: 400 24px/1 'Cera Pro', Arial, sans-serif;
  color: #0F1F3A;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;      /* не переносим текст внутри чипа */
  box-shadow: 0 2px 0 rgba(0,0,0,.04);
}
/* если нужен чип на всю строку — оставь это правило; иначе можно удалить */
.ni-about__chip--wide{ flex: 1 1 100%; }

/* Кнопки-стрелки */
.ni-about__nav{
  display:flex;
  gap:16px;
  justify-content:flex-end;
}
.ni-circle-btn {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    background: var(--ni-blue);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform .06s ease, opacity .2s ease;
}
.ni-circle-btn:hover{ opacity:.9; }
.ni-circle-btn:active{ transform: translateY(1px); }
.ni-circle-btn img{ width:22px; height:18px; display:block; }


/* ===== Forms (новый блок) — десктоп + адаптив 992 ===== */
.ni-forms{
  background: var(--ni-bg);
}

/* .ni-container по проекту — flex; здесь принудительно блочный поток */
.ni-forms__wrap{
  display: block;
  padding-top: 36px;
  padding-bottom: 36px;
}

.ni-forms__title{
  font-family: 'Unbounded', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: var(--ni-blue);
  margin: 0 0 30px;
  line-height: 1.1;
  font-size: 42px;
  padding-top: 80px;
}

/* Сетка 12 колонок (десктоп) */
.ni-forms__grid{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 16px;
}

/* Базовая карточка */
.ni-forms__card{
  position: relative;
  background: #E9ECEF;
  border-radius: 12px;
  overflow: hidden;
  min-height: 210px;
  display: grid;
  grid-template-columns: 1fr auto; /* текст | медиа */
  align-items: center;
  padding: 28px;
  text-decoration: none;
  transition: box-shadow .2s ease, transform .06s ease;
}
.ni-forms__card:hover{ box-shadow: 0 8px 24px rgba(0,0,0,.06); }
.ni-forms__card:active{ transform: translateY(1px); }

/* размеры (десктоп) */
.ni-forms__card--lg{ grid-column: span 6; min-height: 320px; }

/* контент */
.ni-forms__content{
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
.ni-forms__heading{
  margin: 0 0 18px;
  font: 400 24px/1.35 'Cera Pro', Arial, sans-serif;
  color: #0F1F3A;
}

/* кнопка Подробнее у крупных */
.ni-forms__cta{
  height: 46px;
  padding-inline: 20px;
  border-width: 2px;
  color: #fff;
  background-color: var(--ni-blue);
}

/* Скрываем кнопку-стрелку на больших карточках на десктопе */
.ni-forms__card--lg .ni-forms__arrow {
  display: none;
}


/* медиа справа */
.ni-forms__media{
  width: 40%;
  justify-self: end;
}
.ni-forms__media img{
  width: 100%; height: auto; display: block; object-fit: contain;
}

/* Маленькие карточки — горизонтальные */
.ni-forms__card--md{
  grid-column: span 4;
  min-height: 220px;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 10px;
}
.ni-forms__card--md .ni-forms__media{
  flex: 0 0 120px; width: 120px; height: 120px;
}
.ni-forms__card--md .ni-forms__media img{
  width: 100%; height: 100%; object-fit: contain;
}
.ni-forms__card--md .ni-forms__content{
  flex: 1 1 auto; display: flex; align-items: center; justify-content: center;
}
.ni-forms__card--md .ni-forms__heading{ margin: 0; }
.ni-forms__card--md .ni-forms__arrow{
  margin-left: auto; position: static; flex: 0 0 48px;
  width: 48px; height: 48px; display: grid; place-items: center; flex-shrink: 0;
}
.ni-forms__card--md .ni-forms__arrow svg,
.ni-forms__card--md .ni-forms__arrow img{ width: 24px; height: 24px; display: block; }

/* Плейсхолдеры */
.ni-forms__placeholder{ background: #E9ECEF; }

/* Кнопка "Смотреть все" */
.ni-forms__more{
  margin-top: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 52px;
  padding: 0 28px;
  border-radius: 999px;
  background: var(--ni-blue);
  color: #fff;
  border: 1px solid var(--ni-blue);
}
.ni-forms__more:hover{
  color: var(--ni-blue);
  background: #fff;
}







/* ===== Bestsellers ===== */
.ni-best{
  background: var(--ni-bg);
  padding: 48px 0 32px;
}

/* локально возвращаем блочный поток внутри секции */
.ni-best .ni-container{
  display: block;
  align-items: initial;
  gap: 0;
}

.ni-best__head{ 
  margin-bottom: 22px; 
}
.ni-best__title{
  font-family: 'Unbounded', sans-serif;
  font-weight: 700;
  font-size: clamp(32px, 4vw, 56px);
  color: var(--ni-blue);
  margin: 0 0 8px;
}
.ni-best__lead{
  color: #4A4A4A;
  font: 400 24px/1.45 'Cera Pro', Arial, sans-serif;
  margin: 0;
}

/* сетка карточек */
.ni-best__grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
  margin-top: 26px;
}

/* карточка товара */
.ni-prod{
  display: flex;
  flex-direction: column;
  align-items: stretch;
  text-align: left;
}
.ni-prod__media{
  position: relative;
  aspect-ratio: 1 / 1;
  border-radius: 8px;
  overflow: hidden;
}
.ni-prod__media img{
  width: 100%; height: 100%;
  object-fit: contain;
  display: block;
}

/* бейдж «нет в наличии» */
.ni-badge{
  position: absolute;
  top: 10px; right: 10px;
  background: #E85563;
  color: #fff;
  border-radius: 999px;
  padding: 6px 12px;
  font: 600 13px/1 'Cera Pro', Arial, sans-serif;
}
.ni-prod--oos .ni-prod__media{ filter: grayscale(.15); }

/* рейтинг */
.ni-prod__rating{
  margin-top: 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #0F1F3A;
}
.ni-stars{ letter-spacing: 2px; font-size: 18px; color: #153983; }
.ni-rev{ color: #5b677a; font-size: 14px; }

/* текст */
.ni-prod__title{
  margin: 10px 0 6px;
  font: 600 22px/1.2 'Cera Pro', Arial, sans-serif;
  color: #0F1F3A;
}
.ni-prod__desc{
  margin: 0 0 14px;
  color: #3a3f47;
  font: 400 16px/1.4 'Cera Pro', Arial, sans-serif;
}

/* действия */
.ni-prod__actions{
  display: flex;
  align-items: center;
  gap: 12px;
}
.ni-prod__more{ height: 44px; padding-inline: 18px; font-size: 16px; }

/* зелёная кнопка корзины */
.ni-btn--cart{
  height: 44px;
  padding: 0 16px;
  border-radius: 999px;
  background: var(--ni-green);
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 0;
}
.ni-btn--cart:hover{ background: var(--ni-green-pressed); cursor: pointer; }
.ni-btn--cart:disabled{
  opacity: .5;
  cursor: not-allowed;
}

/* иконки внутри кнопки */
.ni-btn__plus img,
.ni-btn__cart img{
  display: block;
  width: 18px;
  height: 18px;
  object-fit: contain;
}

/* подвал секции */
.ni-best__foot{
  margin-top: 24px;
  display: flex;
  align-items: center;
  gap: 16px;
  justify-content: space-between;
}
.ni-best__note{
  margin: 0;
  color: #3a3f47;
  font: 400 14px/1.4 'Cera Pro', Arial, sans-serif;
  opacity: .9;
}
.ni-best__all{
  height: 48px;
  padding-inline: 22px;
  font-size: 18px;
  color: #fff;
  background: var(--ni-blue);
}
.ni-best__all:hover {
  color: var(--ni-blue); 
  background-color: #fff;
  border: 1px solid var(--ni-blue);
}



/* ===== Goals ===== */
.ni-goals { background: var(--ni-bg); }

/* верхняя часть с фоном и молекулой */
.ni-goals__hero{
  position: relative;
  background-color: var(--ni-blue);
  background-image: url("/images/bg/molecule-banner.png"); /* картинка молекулы */
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: cover;
  color: #fff;
  padding: 60px 0 120px;  /* место под заголовок + наезд */
  overflow: visible;
  z-index: 1;
}

.ni-goals__title{
  margin: 0;
  font-family: 'Unbounded', sans-serif;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  line-height: 1.1;
  font-size: clamp(28px, 4vw, 40px);
}

/* контейнер внутри секции — блочный */
.ni-goals .ni-container{ display: block; }

/* сетка карточек */
.ni-goals__grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: -80px;   /* карточки наезжают на фон */
  position: relative;
  z-index: 2;
}

/* карточка */
.ni-goal{ display: flex; flex-direction: column; gap: 10px; }

.ni-goal__media{
  display: block;
  border-radius: 10px;
  overflow: hidden;
  background: #E9ECEF;
  aspect-ratio: 16 / 8;   /* уменьшили высоту (более плоская карточка) */
}
.ni-goal__media img{
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}


/* подпись + кнопка */
.ni-goal__row{
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
}
.ni-goal__name{
  margin: 0;
  color: #0F1F3A;
  font: 600 20px/1.2 'Cera Pro', Arial, sans-serif;
}

/* круглая кнопка-стрелка */
.ni-goal__cta{
  width: 42px; height: 42px;
  border-radius: 999px;
  background: var(--ni-blue);
  display: inline-grid;
  place-items: center;
  transition: transform .06s ease, opacity .2s ease;
}
.ni-goal__cta:hover{ opacity:.9; }
.ni-goal__cta:active{ transform: translateY(1px); }
.ni-goal__cta img{
  width: 20px; height: 20px; display: block;
  filter: brightness(0) invert(1); /* белая стрелка */
}

/* подвал секции */
.ni-goals__foot{
  display: flex;
  justify-content: center;
  padding: 20px 0 40px;
}
.ni-goals__all{
  height: 48px;
  padding-inline: 22px;
  font-size: 18px;
  color: #fff;
  background: var(--ni-blue);
}
.ni-goals__all:hover {
  color: var(--ni-blue); 
  background-color: #fff;
  border: 1px solid var(--ni-blue);
}


/* ===== Therapeutic catalog (from scratch) ===== */
.ni-thera{
  background: var(--ni-about-bg);   /* серый фон на всю ширину */
  padding: 36px 0 44px;
}

/* локально контейнер делаем блочным (глобальный flex не трогаем) */
.ni-thera .ni-container{ display: block; }

/* большой заголовок */
.ni-thera__bigtitle{
  margin: 0 0 18px;
  font-family: 'Unbounded', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: var(--ni-blue);
  line-height: 1.05;
  font-size: clamp(22px, 5vw, 56px);
}

/* внутренняя панель без собственного фона (фон у секции) */
.ni-thera__panel{ padding: 6px 0 0; }

.ni-thera__title{
  margin: 0 0 10px;
  font: 700 20px/1.2 'Cera Pro', Arial, sans-serif;
  color: #0F1F3A;
}

/* поиск */
.ni-thera__search{ margin-bottom: 18px; }
.ni-thera__input{
  width: 100%;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.08);
  background: #fff;
  padding: 0 20px;
  font: 400 16px/1 'Cera Pro', Arial, sans-serif;
  outline: none;
  transition: box-shadow .2s ease, border-color .2s ease;
}
.ni-thera__input::placeholder{ color:#8A8F98; }
.ni-thera__input:focus{
  border-color: var(--ni-blue);
  box-shadow: 0 0 0 3px rgba(21,57,131,.12);
}

/* сетка 2 колонки */
.ni-thera__grid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px 22px; /* V / H */
  margin-top: 6px;
}

/* плитки */
.ni-tile{
  display: flex;
  align-items: center;
  min-height: 100px;
  padding: 20px 22px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 1px 0 rgba(0,0,0,.04);
  color: #0F1F3A;
  text-decoration: none;
  transition: transform .06s ease, box-shadow .2s ease, border-color .2s ease;
}
.ni-tile:hover{
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  border-color: rgba(0,0,0,.12);
}
.ni-tile:active{ transform: translateY(1px); }

.ni-tile span{
  font: 600 20px/1.25 'Cera Pro', Arial, sans-serif;
}

/* ===== Стили для результатов поиска молекул ===== */
.ni-thera__search-wrapper {
  position: relative; /* Необходимо для позиционирования результатов */
}
.ni-thera__results {
  display: none; /* Скрыто по умолчанию */
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  margin-top: 8px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.1);
  z-index: 10;
  max-height: 400px;
  overflow-y: auto;
}
.ni-thera__result-item {
  display: block;
  padding: 14px 18px;
  cursor: pointer;
  text-decoration: none;
  color: var(--ni-text);
  border-bottom: 1px solid #F1F5F9;
}
.ni-thera__result-item:last-child {
  border-bottom: none;
}
.ni-thera__result-item:hover {
  background: #F8FAFC;
}
.ni-thera__result-name {
  font-weight: 600;
  font-size: 16px;
  color: var(--ni-blue);
  display: block;
}
.ni-thera__result-path {
  font-size: 14px;
  color: var(--ni-muted);
  display: block;
  margin-top: 4px;
}
.ni-thera__no-results {
  padding: 16px;
  color: var(--ni-muted);
  text-align: center;
}




/* ===== People (testimonials) ===== */
.ni-people{
  background: var(--ni-about-bg);
  padding: 36px 0 44px;
}

/* Сетка: слева галерея, справа текст */
.ni-people .ni-container{
  display: grid;
  grid-template-columns: 1.1fr 1fr;   /* галерея пошире */
  gap: 32px;
  align-items: stretch;
}

/* Галерея 3×2 */
.ni-people__gallery{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 5px;
}
.ni-people__ph{
  margin: 0;
  border-radius: 10px;
  overflow: hidden;
  background: #EFF2F5;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.05);
  aspect-ratio: 3 / 4;   /* высокие фото */
}
.ni-people__ph img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Контент справа */
.ni-people__content{
  display: flex;
  flex-direction: column;
}
.ni-people__title{
  margin: 0 0 16px;
  font-family: 'Unbounded', sans-serif;
  font-weight: 700;
  color: var(--ni-blue);
  font-size: clamp(28px, 4.5vw, 48px);
  letter-spacing: .01em;
  line-height: 1.1;
}
.ni-people__quote{
  margin: 0 0 18px;
  color: #0F1F3A;
  font: 500 18px/1.55 'Cera Pro', Arial, sans-serif;
}
.ni-people__author{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #2C3A4E;
  font: 500 16px/1.3 'Cera Pro', Arial, sans-serif;
  margin-bottom: 22px;
}
.ni-people__badge{
  width: 22px;
  height: 22px;
  display: block;
}

/* Кнопка синяя */
.ni-people__more{
  margin-top: auto;
  align-self: flex-start;
  height: 48px;
  padding: 0 22px;
  font-size: 18px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--ni-blue);
  color: #fff;
  border: 1px solid var(--ni-blue);
  border-radius: 999px;
}
.ni-people__more:hover{
  color: var(--ni-blue);
  background: #fff;
}
.ni-people__more img{
  width: 18px;
  height: 18px;
  display: block;
  filter: brightness(0) invert(1);
}
.ni-people__more:hover img{ filter: none; }






/* ===== Knowledge Base ===== */
.ni-kb{ background: var(--ni-bg); padding: 28px 0 44px; }
.ni-kb .ni-container{ display: block; }

/* заголовок */
.ni-kb__title{
  margin: 0 0 22px;
  font-family: 'Unbounded', sans-serif;
  font-weight: 700;
  color: var(--ni-blue);
  font-size: clamp(32px, 5vw, 56px);
  letter-spacing: .01em;
}

/* FAQ — цвета и линии как в референсе */
.ni-kb__faq{ margin-bottom: 22px; }
.ni-faq{
  border-bottom: 2px solid #D9E0EA;      /* светлая линия */
  padding: 14px 0;
}
.ni-faq:first-child{ border-top: 2px solid #D9E0EA; }

.ni-faq__q{
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 16px;
  cursor: pointer;
}
.ni-faq__q > span{
  color:#0F1F3A;
  font: 700 20px/1.25 'Cera Pro', Arial, sans-serif;
}

/* кнопка (+/−) справа: белый фон, голубая рамка, светлый плюс */
.ni-faq__toggle{
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--ni-blue);
  position: relative;
  cursor: pointer;
  padding: 0;
}
.ni-faq__toggle::before,
.ni-faq__toggle::after{
  content:""; position:absolute; background: #fff; /* светло-синий знак */
  left:50%; top:50%; transform:translate(-50%,-50%);
  border-radius: 1px;
}
.ni-faq__toggle::before{ width: 14px; height: 2px; } /* − */
.ni-faq__toggle::after{ width: 2px; height: 14px; }  /* | для + */
.ni-faq--open .ni-faq__toggle::after{ display:none; }

.ni-faq__a{
  margin: 10px 0 0;
  color:#2E3A4B;
  font: 400 16px/1.5 'Cera Pro', Arial, sans-serif;
}

/* Карточки под FAQ */
.ni-kb__cards{
  display:grid;
  grid-template-columns: repeat(3,1fr);
  gap: 24px;
  margin: 18px 0 16px;
}
.ni-kbcard{ display:flex; flex-direction:column; gap:10px; }
.ni-kbcard__media{
  border-radius: 10px; overflow:hidden;
  background:#E9ECEF; aspect-ratio:16/9;
}
.ni-kbcard__name{
  margin:0; color:#0F1F3A;
  font:600 20px/1.2 'Cera Pro', Arial, sans-serif;
}
.ni-kbcard__row{ display:grid; grid-template-columns:1fr auto; align-items:center; gap:12px; }
.ni-kbcard__cta{
  width:42px; height:42px; border-radius:999px;
  background: var(--ni-blue); display:inline-grid; place-items:center;
}
.ni-kbcard__cta img{ width:20px; height:20px; filter:brightness(0) invert(1); }

/* капсула */
.ni-kb__subs{
  display: flex;
  align-items: center;
  gap: 20px;
  background: var(--ni-blue);
  border-radius: 28px;           /* большие скругления */
  padding: 16px 22px;            /* «толстая» синяя окантовка вокруг инпута */
  margin-bottom: 80px ;
}

/* левый текст-кнопка (визуально как надпись) */
.ni-kb__subs-btn{
  background: transparent;
  border: 0;
  color: #fff;
  cursor: pointer;
  height: 52px;
  padding: 0 6px;
  border-radius: 999px;
  font: 600 22px/1.2 'Cera Pro', Arial, sans-serif;
}

/* белый инпут справа */
.ni-kb__subs-input{
  margin-left: auto;             /* прижимаем к правому краю */
  flex: 0 1 520px;               /* ширина инпута (ужмётся при нехватке места) */
  min-width: 360px;
  height: 52px;
  border: 0;
  border-radius: 999px;
  background: #fff;
  padding: 0 20px;
  color: var(--ni-blue);
  font: 400 18px/1 'Cera Pro', Arial, sans-serif;
  box-shadow: 0 0 0 3px #fff;    /* белый «ободок» как на референсе */
  caret-color: var(--ni-blue);
}
.ni-kb__subs-input::placeholder{ color: var(--ni-blue); opacity: .9; }



/* ===== Footer ===== */
.ni-footer{
  background: var(--ni-blue);
  padding: 44px 0;
  color: #fff;
}
.ni-footer__grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
  align-items: flex-start;
}
.ni-footer__col{ display: flex; flex-direction: column; gap: 10px; }

.ni-footer__title{
  margin: 0 0 8px;
  font: 600 18px/1.3 'Cera Pro', Arial, sans-serif;
  color: #fff;
}
.ni-footer__list{
  list-style: none;
  margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 6px;
}
.ni-footer__list li{ font: 400 16px/1.5 'Cera Pro', Arial, sans-serif; }
.ni-footer__list a{
  color: #fff;
  text-decoration: none;
}
.ni-footer__list a:hover{ text-decoration: underline; }




/* === НОВЫЕ СТИЛИ ДЛЯ ПОПАП-КАТАЛОГА (Редизайн по скриншоту) === */

/* --- Оверлей --- */
.co-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: none;
  align-items: center;
  justify-content: center;
}
.co-overlay[aria-hidden="false"] {
  display: flex;
}

/* --- Фон (Backdrop) --- */
.co-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 31, 58, 0.6);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.co-overlay[aria-hidden="false"] .co-backdrop {
  opacity: 1;
}

/* --- Оболочка для панелей --- */
.co-shell {
  display: flex;
  gap: 24px;
  position: relative;
  z-index: 1001;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  transform: scale(0.95) translateY(10px);
  opacity: 0;
}
.co-overlay[aria-hidden="false"] .co-shell {
    opacity: 1;
    transform: scale(1) translateY(0);
}
.co-shell.is-shifted {
  transform: translateX(-372px); /* Сдвигается вся оболочка */
}

/* --- Панели (общие стили) --- */
.co-left, .co-right {
  height: 80vh;
  max-height: 700px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* --- Левая панель (Список) --- */
.co-left {
  width: 680px;
  max-width: 90vw;
  position: relative; /* Для кнопки закрытия */
}

/* --- Правая панель (Детали) --- */
.co-right {
  width: 720px;
  max-width: 95vw;
  opacity: 0;
  transform: translateX(20px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  display: none;
  position: relative; /* Для кнопки закрытия */
}
.co-right.is-open {
  display: flex;
  opacity: 1;
  transform: translateX(0);
}

/* --- Кнопки закрытия --- */
.co-close {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 36px;
  height: 36px;
  background: #f0f2f5;
  border-radius: 50%;
  border: 0;
  font-size: 20px;
  color: #555;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: background .2s, color .2s;
  z-index: 10;
}
.co-close:hover { background: #e4e6eb; color: #111; }

/* --- Левая панель - Содержимое --- */
.co-left-head { padding: 30px 30px 15px; border-bottom: 1px solid #eee;}
.co-left-title {
  font-family: 'Unbounded', sans-serif;
  font-size: 24px;
  font-weight: 600;
  color: var(--ni-blue);
  margin: 0 0 8px;
  padding-right: 40px;
}
.co-left-sub { font-size: 15px; color: #555; line-height: 1.5; margin: 0 0 20px; }
.co-search { position: relative; }
.co-search input {
  width: 100%;
  height: 44px;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 0 15px;
  font-size: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23888' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: calc(100% - 15px) center;
}
.co-left-scroll { flex: 1; overflow-y: auto; padding: 10px 30px 30px; }
.co-left-scroll h4 { font-size: 18px; font-weight: 600; color: var(--ni-blue); margin: 20px 0 12px; border-bottom: 1px solid #eee; padding-bottom: 8px; }
.co-left-scroll h4:first-of-type { margin-top: 0; }
.co-left-scroll .bubble-container { display: flex; flex-wrap: wrap; gap: 12px; }
.co-left-scroll .bubble {
  background: #f0f2f5;
  color: #333;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 15px;
  cursor: pointer;
  transition: background .2s, color .2s, transform .1s;
  border: none;
  line-height: 1.2;
}
.co-left-scroll .bubble:hover { background: var(--ni-blue); color: #fff; }
.co-left-scroll .bubble:active { transform: scale(0.97); }

/* --- Правая панель - Содержимое (новый дизайн) --- */
.co-right-inner {
  flex: 1;
  overflow-y: auto;
  padding: 30px;
  color: #444;
  font-size: 15px;
  line-height: 1.6;
}

/* Заголовок молекулы */
.co-right-inner .molecule-header {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 20px;
}
.co-right-inner .molecule-header h5 {
    font-family: 'Unbounded', sans-serif;
    font-size: 24px;
    font-weight: 600;
    color: var(--ni-blue);
    margin: 0;
    line-height: 1.2;
}
.co-right-inner .molecule-header .formula-icon {
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%236c757d' class='bi bi-infinity' viewBox='0 0 16 16'%3E%3Cpath d='M1.246 9.006C.593 8.356 0 7.989 0 7.798c0-.189.593-.556 1.246-1.206.657-.655 1.8-1.546 3.497-2.277C6.677 3.52 8.711 3 10.334 3c1.94 0 2.923.903 3.488 1.487.564.584 1.13 1.496 1.13 2.998 0 1.502-.566 2.414-1.13 2.998-.565.584-1.548 1.487-3.488 1.487-1.623 0-3.657-.52-5.591-1.315-1.697-.731-2.84-1.622-3.497-2.277ZM10.334 14c-1.996 0-4.062-.544-6.002-1.378L.857 1.839C.367 2.51-.012 3.123-.012 3.805c0 .68.375 1.29.873 1.954l4.316 5.564a9.61 9.61 0 0 0 4.855 2.016 9.61 9.61 0 0 0 2.443-.27C12.87 13.57 14 12.003 14 7.798c0-4.206-1.13-5.773-2.684-6.425-1.554-.652-3.872-.79-5.966-.196L.857 1.839Zm-.002-11.966c-1.272 0-2.91.432-4.666 1.265L1.871 13.23c.49.664.87 1.277.87 1.956 0 .68-.375 1.29-.873 1.954l4.316 5.564a9.61 9.61 0 0 0 4.855 2.016 9.61 9.61 0 0 0 2.443-.27C12.87 13.57 14 12.003 14 7.798c0-4.206-1.13-5.773-2.684-6.425-1.554-.652-3.872-.79-5.966-.196L.857 1.839ZM10.334 3c1.94 0 2.923.903 3.488 1.487.564.584 1.13 1.496 1.13 2.998 0 1.502-.566 2.414-1.13 2.998-.565.584-1.548 1.487-3.488 1.487-1.623 0-3.657-.52-5.591-1.315-1.697-.731-2.84-1.622-3.497-2.277C.593 8.356 0 7.989 0 7.798c0-.189.593-.556 1.246-1.206C1.903 5.937 3.046 5.046 4.743 4.315 6.677 3.52 8.711 3 10.334 3Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 16px 16px;
    filter: invert(30%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(80%) contrast(90%); /* Темнее */
    opacity: 0.7;
}

/* Блоки правой панели */
.co-right-inner .detail-block {
    margin-bottom: 25px;
}
.co-right-inner .detail-block h5 {
    font-size: 16px;
    font-weight: 600;
    color: var(--ni-blue);
    margin: 0 0 10px;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 6px;
}
.co-right-inner .detail-block h6 {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin: 15px 0 8px;
}
.co-right-inner .detail-block p {
    margin: 0 0 8px;
    color: #555;
}
.co-right-inner .detail-block ul {
    list-style: none;
    padding-left: 0;
    margin: 0;
}
.co-right-inner .detail-block ul li {
    font-size: 15px;
    color: #444;
    line-height: 1.6;
    margin-bottom: 6px;
    padding-left: 20px;
    position: relative;
}
.co-right-inner .detail-block ul li::before {
    content: '•';
    color: var(--ni-blue);
    position: absolute;
    left: 0;
    top: 0;
    font-size: 1.1em;
    line-height: 1;
}

/* Изображение формулы */
.co-right-inner .formula-image-wrapper {
    text-align: center;
    margin: 20px 0 30px;
    background: #f9f9f9;
    border-radius: 8px;
    padding: 20px;
    box-shadow: inset 0 0 10px rgba(0,0,0,0.05);
}
.co-right-inner .formula-image-wrapper img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
    border-radius: 4px;
}

/* Категории */
.co-right-inner .detail-categories .category-bubble {
    display: inline-block;
    background: #e0f2f7; /* Светло-голубой */
    color: var(--ni-blue);
    padding: 6px 12px;
    border-radius: 16px;
    font-size: 14px;
    margin: 0 8px 8px 0;
    white-space: nowrap;
}

/* Сертификации */
.co-right-inner .detail-certifications {
    margin-top: 20px;
}
.co-right-inner .detail-certifications .cert-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.co-right-inner .detail-certifications .cert-item {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f0f2f5; /* Светлый фон */
    border-radius: 20px;
    padding: 6px 15px;
    font-size: 14px;
    color: #555;
    border: 1px solid #e0e0e0;
}
.co-right-inner .detail-certifications .cert-item svg {
    width: 20px;
    height: 20px;
    fill: var(--ni-blue);
    flex-shrink: 0;
}

/* Преимущества в виде капсул */
.co-right-inner .detail-advantages-bubbles .advantage-bubble {
    display: inline-block;
    background: #e6f7ea; /* Светло-зеленый */
    color: #388e3c; /* Темно-зеленый */
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 15px;
    margin: 0 10px 10px 0;
    font-weight: 500;
    border: 1px solid #c8e6c9;
    white-space: nowrap;
}

/* Стили для ссылок в исследованиях */
.co-right-inner .detail-block ul li a {
    color: var(--ni-blue);
    text-decoration: underline;
}
.co-right-inner .detail-block ul li a:hover {
    text-decoration: none;
}
.co-right-inner .detail-block ul li p { /* Для summary в исследованиях */
    font-size: 14px;
    color: #666;
    margin-top: 5px;
    line-height: 1.5;
    padding-left: 0; /* Убрать отступ от маркера */
}





/* контейнер модалки: скрыт по умолчанию */
.ni-modal{
  position:fixed; inset:0; z-index:999;
  display:none;                 /* <-- скрыто */
  padding:6vh 16px;
}

/* когда открыта — центрируем через flex */
.ni-modal.is-open{
  display:flex;                 /* <-- показываем */
  align-items:center;           /* по вертикали   */
  justify-content:center;       /* по горизонтали */
}

.ni-modal__overlay{
  position:fixed;               /* перекрывает весь вьюпорт */
  inset:0; 
  background:rgba(15,31,58,.42); 
  backdrop-filter: blur(2px);
}

.ni-modal__dialog{
  position:relative; width:min(560px, 92vw); 
  margin:0;                     /* без внешних отступов — центр через flex */
  max-height:88vh;              /* чтобы не вылезал за экран */
  overflow:auto;                /* прокрутка внутри */
  background:#fff;
  border-radius:16px; box-shadow:0 20px 60px rgba(15,31,58,.25);
  padding:20px 20px 18px; color:var(--ni-text, #0F1F3A);
}

.ni-modal__close{
  position:absolute; right:10px; top:8px; width:36px; height:36px; border-radius:999px;
  border:1px solid #E2E8F0; background:#fff; font-size:22px; line-height:1; cursor:pointer;
}
.ni-modal__title{
  font-family: var(--ni-head, "Unbounded", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif);
  font-weight:800; color:#153983; font-size:24px; margin:4px 0 12px;
}

/* === Форма в модалке === */
.ni-form{ display:grid; gap:12px; }
.ni-field{ display:grid; gap:6px; }
.ni-label{ color:#64748B; font-size:14px; }
.ni-input{
  width:100%; height:46px; border:1px solid #D6DAE1; background:#FFF; outline:none;
  border-radius:12px; padding:10px 12px; font-size:16px; color:#0F1F3A;
}
.ni-input:focus{ border-color:#153983; box-shadow:0 0 0 3px rgba(21,57,131,.12); }
.ni-textarea{ height:auto; resize:vertical; min-height:90px; }

.ni-check{ display:flex; align-items:flex-start; gap:10px; font-size:14px; color:#0F1F3A; }
.ni-check input{ margin-top:3px; }

.ni-btn--full{ width:100%; border-radius:999px; height:50px; font-weight:800; }
.ni-form__msg{ min-height:20px; font-size:14px; color:#153983; margin-top:4px; }
.ni-form__msg.is-error{ color:#b91c1c; }







/* === МОБИЛЬНОЕ МЕНЮ (СТИЛИ) === */
.ni-burger {
  display: none; /* Скрыт по умолчанию на десктопе */
}
.ni-mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 1010; /* Выше чем ticker и header */
  visibility: hidden;
  display: flex; /* Для выравнивания панели */
  justify-content: flex-end; /* Панель прижата к правому краю */
}
.ni-mobile-menu.is-open {
  visibility: visible;
}

.ni-mobile-menu__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 31, 58, 0.5);
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  cursor: pointer;
}
.ni-mobile-menu.is-open .ni-mobile-menu__backdrop {
  opacity: 1;
}

.ni-mobile-menu__panel {
  width: min(320px, 85vw);
  height: 100%;
  background: #fff;
  display: flex;
  flex-direction: column;
  padding: 16px;
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: -5px 0 25px rgba(0,0,0,0.15);
}
.ni-mobile-menu.is-open .ni-mobile-menu__panel {
  transform: translateX(0);
}

.ni-mobile-menu__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 8px 16px;
  border-bottom: 1px solid #e9ecef;
}
.ni-mobile-menu__title {
  font-weight: 700;
  font-size: 18px;
  color: var(--ni-blue);
}
.ni-mobile-menu__head-actions {
  display: flex;
  align-items: center;
  gap: 16px;
}
.ni-mobile-menu__icon-btn {
  display: block;
  width: 24px;
  height: 24px;
}
.ni-mobile-menu__icon-btn img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.ni-mobile-menu__close {
  font-size: 28px;
  line-height: 1;
  color: var(--ni-muted);
  padding: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ni-mobile-menu__nav {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-grow: 1;
}
.ni-mobile-menu__link {
  font-size: 18px;
  font-weight: 500;
  padding: 10px;
  border-radius: 8px;
  color: var(--ni-text);
  text-decoration: none;
}
.ni-mobile-menu__link.is-active {
  background-color: #153983;
  color: #fff;
  font-weight: 700;
}
.ni-mobile-menu__actions {
  display: flex;
  gap: 12px;
  padding: 16px 8px;
  border-top: 1px solid #e9ecef;
}
.ni-mobile-menu__actions .ni-btn {
  flex-grow: 1;
  justify-content: center;
}
.ni-mobile-menu__socials {
  display: flex;
  justify-content: center;
  gap: 24px;
  padding-top: 16px;
}
.ni-mobile-menu__social-link {
  width: 48px;
  height: 48px;
}
.ni-mobile-menu__social-link img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Переопределяем стили для мобильных устройств в существующем медиа-запросе */
@media (max-width: 992px) {
  /* Скрываем десктопную навигацию и кнопки */
  .ni-nav,
  .ni-actions .ni-auth,
  .ni-actions > .ni-icon {
    display: none;
  }
  /* Показываем кнопку-бургер */
  .ni-burger {
    display: flex;
  }
}










/* АДАПТИВЫ ДЛЯ ГЛАВНОЕ */




/* === Бургер-меню (для мобильных) === */
.ni-burger {
  display: none; /* Скрыт по умолчанию */
  flex-direction: column;
  justify-content: space-around;
  width: 30px;
  height: 24px;
  padding: 0;
  cursor: pointer;
}
.ni-burger__line {
  display: block;
  width: 100%;
  height: 3px;
  background: var(--ni-blue);
  border-radius: 3px;
}
/* === Стили для "прилипшей" шапки === */
.ni-header.is-stuck .ni-header_wrap {
  padding-top: 45px;
}
/* === Адаптация секции Forms === */
.ni-forms__toggle {
  display: none; /* Скрыта на десктопе */
  width: 100%;
  max-width: 320px;
  margin: 24px auto 0;
  height: 48px;
  font-size: 18px;
}

.ni-thera__more {
  display: none;
}

@media (max-width: 992px) {
  .ticker-static {
    padding-left: 20px;
    padding-right: 20px;
  }
  .ticker-item {
    padding-left: 20px;
    padding-right: 20px;
  }


  
  .ni-header_wrap {
    justify-content: space-between;
    padding-right: 20px;
  }

  /* 3. Скрываем навигацию и лишние кнопки, показываем бургер */
  .ni-nav,
  .ni-actions .ni-btn--primary,
  .ni-actions .ni-icon {
    display: none;
  }
  .ni-burger {
    display: flex;
  }
  .ni-actions .ni-btn--outline {
    margin-right: 12px;
  }
  .ni-hero__wrap {
      grid-template-columns: 1fr;
      gap: 24px;
      text-align: center;
  }
  .ni-hero__text {
      order: 1; /* Текст сверху */
  }
  .ni-hero__media {
      order: 2; /* Картинка снизу */
  }
  .ni-hero__actions {
      align-items: center;
      justify-content: center; /* Центрируем кнопки в контейнере */
      display: flex;           /* Включаем flex для выравнивания */
      gap: 16px;               /* Отступ между кнопками */
  }

  /* --- ВОТ ИСПРАВЛЕНИЕ --- */
  /* Задаем жесткую ширину для всех кнопок внутри .ni-hero__actions */
  .ni-hero__actions > * {
      width: 400px;  /* <-- Вы можете поменять это значение */
      box-sizing: border-box; /* Чтобы padding не влиял на итоговую ширину */
  }

  .ni-hero__media img {
      transform: none;
      max-width: 50%;
      margin-inline: auto;
  }
    .ni-hero__media img {
      transform: none;
      max-width: 50%;
      margin-inline: auto;
    }


    /* ABOUT */
    .ni-about__grid {
      display: flex;
      flex-direction: column;
    }

    .ni-about__inner {
      padding: 25px;
    }

    /* FORMS */
    .ni-forms__grid {
      grid-template-columns: 1fr 1fr; /* 2 колонки для основы */
      gap: 16px;
    }
    
    /* Скрываем лишние элементы по умолчанию, когда свернуто */
    .ni-forms__grid.is-collapsed > a:nth-child(n+5) {
      display: none;
    }
    .ni-forms__title {
      font-size: 34px;
    }

    /* Общие стили для карточек */
    .ni-forms__card {
      min-height: auto;
    }
    .ni-forms__card .ni-forms__heading {
      font-size: 20px;
      margin: 0;
    }
    .ni-forms__card .ni-forms__cta {
      display: none; /* Скрываем текстовую кнопку на всех мобильных */
    }

    /* Большие карточки (вертикальные) */
    .ni-forms__card--lg {
      grid-column: span 1;
      display: flex;
      flex-direction: column;
      padding: 16px;
      gap: 12px;
      align-items: stretch;
      justify-content: space-between;
    }
    .ni-forms__card--lg .ni-forms__content {
      text-align: left;
    }
    .ni-forms__card--lg .ni-forms__media {
      max-width: 160px;
      flex: 1 1 auto;
      margin: 0 auto;
      align-self: center;
    }
    .ni-forms__card--lg .ni-forms__arrow {
      display: inline-flex;
      order: 2;
      margin-top: auto;
      align-self: flex-end;
      flex-shrink: 0; /* <-- Вот это исправление. Запрещает кнопке сжиматься. */
    }

    /* Маленькие карточки и плейсхолдеры (горизонтальные) */
    .ni-forms__card--md,
    .ni-forms__placeholder {
      grid-column: span 2; /* Занимают всю ширину */
      display: flex;
      align-items: center;
      padding: 12px 16px;
      gap: 16px;
    }
    
    .ni-forms__card--md .ni-forms__media {
      flex-shrink: 0; /* Изображение не сжимается */
      width: 140px;
      height: 140px;
    }
    .ni-forms__card--md .ni-forms__content {
      flex-grow: 1; /* Название занимает доступное место */
      text-align: left;
    }
    .ni-forms__card--md .ni-forms__arrow {
      display: inline-flex;
      margin-left: auto; /* Прижимает стрелку к правому краю */
    }
    
    /* Кнопка "Смотреть все" */
    .ni-forms__toggle {
      display: flex;
      margin: 24px auto 0;
      background: var(--ni-blue);
      color: #fff;
      border: 1px solid var(--ni-blue);
    }
    
    .ni-forms__toggle:hover {
        color: var(--ni-blue);
        background-color: #fff;
    }



    /* best sellers */

    /* BESTSELLERS ADAPTIVE */
    .ni-best__grid {
      grid-template-columns: repeat(2, 1fr); /* Сетка 2 колонки */
      gap: 20px;
    }
    .ni-best__grid > .ni-prod:nth-child(n+3) {
      display: none; /* Скрываем 3-й и 4-й элементы на экранах < 992px */
    }
    .ni-prod__title {
      font-size: 20px; /* Уменьшаем шрифт заголовка */
    }
    .ni-best__lead {
      font-size: 20px;
    }
    .ni-prod__desc {
      font-size: 15px; /* Уменьшаем шрифт описания */
    }
    /* действия */
    .ni-prod__actions{
      margin-top: auto; /* <-- ДОБАВИТЬ ЭТУ СТРОКУ */
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .ni-btn--cart {
      height: 48px; /* Увеличиваем кнопку */
      padding: 0 18px;
    }
    .ni-btn__plus img,
    .ni-btn__cart img {
      width: 20px; /* Увеличиваем иконки */
      height: 20px;
    }


    /* GOALS ADAPTIVE */
    .ni-goals__grid {
      grid-template-columns: repeat(2, 1fr); /* Сетка 2 колонки */
    }
}


@media (max-width: 768px) {

  .ni-hero__title {
    text-align: left;
  }
  .ni-hero__subtitle {
    text-align: left;
  }
  .ni-hero__actions > * {
    width: 350px;
  }
  .ni-hero__actions {
    justify-content: left;
    align-items: flex-start; 
  }

  .ni-hero__media img {
    max-width: 80%;
  }
  .ni-about__title {
    font-size: 36px;
  }
  .ni-about__lead {
    font-size: 18px;
  }
  .ni-about__chips li {
    font: 400 18px / 1 'Cera Pro', Arial, sans-serif;
  }

  .ni-forms__title {
    font-size: 28px;
  }
  
  /* ===== Адаптив для каталога терапий ===== */
  .ni-thera__grid {
    grid-template-columns: 1fr; /* Одна колонка на мобильных */
  }

  .ni-thera__grid.is-collapsed > .ni-tile:nth-child(n+6) {
    display: none; /* Скрываем все плитки, начиная с 6-й */
  }

  .ni-thera__more {
    display: none; /* Кнопка "Показать/Скрыть" будет показана JS */
    width: 100%;
    margin: 20px auto 0;
    justify-content: center;
    background: var(--ni-blue);
    color: #fff;
    border: 1px solid var(--ni-blue);
  }

  .ni-thera__more:hover {
    background: #fff;
    color: var(--ni-blue);
  }

  .ni-thera--mobile-collapsible .ni-thera__more {
    display: flex; /* Показываем кнопку, если есть JS-обработчик */
  }
  /* ======================================== */
  .ni-kb__cards {
    display: flex;
    flex-direction: column;
  }
  .ni-kb__subs {
    flex-wrap: wrap;
  }
  .ni-kb__subs-input {
    margin-left: 0;
    flex: none;
    min-width: auto;
  }
  .ni-footer__grid {
    display: flex;
    flex-direction: column;
  }
}

@media (max-width: 468px) {
  .ni-best__grid {
    display: flex;
    flex-direction: column;
  }
  .ni-hero__actions > * {
    width: 300px;
  }
  .ni-about__chips li {
    text-wrap: wrap;
  }
  .ni-forms__title {
    font-size: 22px;
    padding-top: 20px;
  }
      .ni-forms__card .ni-forms__heading {
        font-size: 16px;
      }
  .ni-forms__card--md, .ni-forms__placeholder {
    flex-direction: column;
  }
  .ni-best__lead {
    font-size: 16px;
  }
  .ni-best__all {
    height: auto;

  }
  .ni-best__note {
    max-width: 150px;
  }
  .ni-goals__grid {
    display: flex;
    flex-direction: column;
  }

}


/* Скрытие лишних категорий на главной */
.ni-goals__grid.is-collapsed .ni-goal:nth-child(n+7) {
  display: none;
}

.footer-column-legal {
  display: flex;
  flex-direction: column;
  
}
/* --- Стили для юридической информации в футере --- */
.footer-legal-info {
  font-size: 14px;
  color: #8CA2C1; /* Такой же цвет, как у ссылок на политику */
  line-height: 1.6;
}

/* Стили для счетчика в корзине */
.ni-icon, .ni-mobile-menu__icon-btn {
    position: relative;
}

.cart-count-badge {
    position: absolute;
    top: -5px;
    right: -8px;
    background-color: #ef4444; /* Красный цвет */
    color: white;
    font-size: 11px;
    font-weight: 600;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    border: 2px solid #fff; /* Белая обводка для контраста */
}