/* =========================================================
   FOOTER NAVIGATION — CAPSULE MENU (FINAL, VERTICAL)
   
   /front/blocks/footer/navigation/navigation.css
   ========================================================= */



.footer-nav{
  position:relative;
}

/* CAPS */
.footer-nav__caps{
  display:flex;
  flex-wrap:wrap;
gap:var(--space-2);

margin-bottom:var(--space-2);
  /* 🔑 ДОБАВЛЯЕМ ВОЗДУХ СПРАВА */
  padding-right:8px;
}



.footer-nav__pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  width:140px;
  height:32px;

 padding:0 12px;
  border-radius:999px;
border:1px solid rgba(255,255,255,0.14);

  font-size:0.85rem;
  font-weight:600;
  line-height:1;

  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;

  cursor:pointer;

background: var(--pill-bg, var(--footer-input-bg));
color: var(--pill-fg, var(--footer-fg));
}



/* CHILDREN — скрыты */
.footer-nav__children{
height:0;
overflow:hidden;

margin-top:0;

padding:  0  var(--space-4);
  background:var(--footer-bg);
/*
  border:1px solid var(--footer-border);
  border-radius:var(--radius-md);
*/

  /* 🔑 КЛЮЧЕВОЕ */
  width:max-content;
  min-width:100%;

  box-sizing:border-box;
  
  opacity:0;
pointer-events:none;
}

.footer-nav__children.is-active{
  opacity:1;

  pointer-events:auto;

  padding-top:var(--space-3);
  padding-bottom:var(--space-3);
}

/* LINKS */
.footer-nav__link{
  display:block;
  margin-bottom:6px;

  white-space:nowrap;
  color:var(--footer-fg);
  text-decoration:none;
  font-size:0.9rem;
}

.footer-nav__link:last-child{
  margin-bottom:0;
}

.footer-nav__link:hover{
  text-decoration:underline;
}

/* =========================================================
   MOBILE — CAPS В КОЛОНКУ
   ========================================================= */
@media (max-width:768px){

  .footer-nav__caps{
    flex-direction:column;   /* 🔑 вертикально */
    align-items:flex-start;  /* 🔑 по левому краю */
  }

  .footer-nav__pill{
    width:100%;              /* 🔑 растягиваем */
    max-width:260px;         /* 🔑 чтобы не было уродства */
    justify-content:flex-start; /* текст влево */
    padding-left:12px;       /* 🔑 отступ текста */
  }

}





