.faqs {
	margin: 0 auto;
	transform: translateZ(0);
}

.faqs label span,
.faqs label p,
.faqs label h2,
.faqs label h3,
.faqs label h4,
.faqs label h5,
.faqs label h6 {
	margin: initial; 
	padding: 0.7rem 0;
	line-height: 1.34;
	display: block;
	text-transform: none;
	margin-top: 0px;
	padding-right: 30px;
	  font-family: "Montserrat";
    font-size: 0.98rem;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: #363636; 
}


.faqs input[type="checkbox"] {
	position: absolute;
	opacity: 0;
}

.faq-container .faqs label{
  cursor:pointer;
  display:block;
  position:relative;
  padding:0.2rem 0 0.2rem 0rem;
  font-weight:600;
  margin-top:0rem;  
    
}

.faqs label:hover {

	cursor: pointer;
}

/* оставляем секцию без внутренних отступов */
.faq-container .faqs section{
  overflow:hidden;
  max-height:0;
  transition:max-height .45s ease;
  margin-bottom:0.25rem;      /* внешний воздух до след. вопроса */
  border-bottom:1px solid #363636;
  font-family: "Montserrat";
    font-size: .95rem;
    line-height: 1.5;
    color: #363636;
    padding-right:0rem;
}

/* а вот внутренний отступ кладём на контентный <div> */
.faq-container .faqs section > div{
  padding:0 0 1rem 0;       /* < здесь появляется нижний воздух */
}





/* --- базовый заголовок FAQ ------------------------------- */
.faq-container .faqs label{
  cursor:pointer;
  display:block;
  position:relative;
  padding:0rem 0rem 0rem 0;   /* справа оставляем место под иконку */
  font-weight:600;
  margin:0;
}

/* --- СЕРЫЙ КРУГ (::before) ------------------------------- */
.faq-container .faqs label::before{
  content:'';
  position:absolute;
  right:0;                       /* прилипает к правому краю блока */
  top:50%;
  transform:translateY(-50%);
  width:36px; height:36px;
  border-radius:50%;
  background:transparent;
  transition:background .25s ease;
  pointer-events:none;           /* клики проходят на label */
}

/* --- ПЛЮС (::after)  ------------------------------------- */
.faq-container .faqs label::after{
  content:'';
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%) rotate(0deg);
  width:36px; height:36px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36' stroke='%23000' stroke-width='2' fill='none' stroke-linecap='round'%3E%3Cline x1='18' y1='8' x2='18' y2='28'/%3E%3Cline x1='8' y1='18' x2='28' y2='18'/%3E%3C/svg%3E") center/30px 30px no-repeat;
  transition:transform .25s ease;
  pointer-events:none;
}

/* --- ХОВЕР: подсвечиваем круг ---------------------------- */
.faq-container .faqs label:hover::before{
  background:rgba(0,0,0,.06);   /* мягкий серый */
}

/* --- ОТКРЫТЫЙ пункт (класс .open ставит JS) ------------- */
.faq-container .faqs label.open::before{
  background:rgba(0,0,0,.12);   /* круг чуть темнее */
}
.faq-container .faqs label.open::after{
  transform:translateY(-50%) rotate(45deg);   /* плюс > крест */
}






