.faq{
  display:grid;
  gap:14px;
}

.faq__item{
  background:#fff;
  border:1px solid var(--line);
  border-radius:24px;
  padding:0;
  box-shadow:var(--shadow2);
  overflow:hidden;
  transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.faq__item:hover{
  border-color:rgba(23,116,212,.18);
  box-shadow:0 14px 34px rgba(11,18,32,.08);
}

.faq__item summary{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  cursor:pointer;
  font-weight:900;
  list-style:none;
  padding:22px 24px;
}

.faq__item summary::-webkit-details-marker{
  display:none;
}

.faq__question{
  display:block;
  font-size:clamp(18px, 1.25vw, 24px);
  line-height:1.28;
  color:#08213f;
}

.faq__icon{
  position:relative;
  flex:0 0 28px;
  width:28px;
  height:28px;
  border-radius:50%;
}

.faq__icon::before,
.faq__icon::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:16px;
  height:2px;
  border-radius:999px;
  background:#0d2f57;
  transform:translate(-50%, -50%);
  transition:transform .28s ease, opacity .22s ease, background .22s ease;
}

.faq__icon::after{
  transform:translate(-50%, -50%) rotate(90deg);
}

.faq__item[open] .faq__icon::before{
  transform:translate(-50%, -50%) rotate(45deg);
}

.faq__item[open] .faq__icon::after{
  transform:translate(-50%, -50%) rotate(-45deg);
}

.faq__body{
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows .32s ease;
}

.faq__body::before{
  content:"";
}

.faq__item[open] .faq__body{
  grid-template-rows:1fr;
}

.faq__body > *{
  min-height:0;
}

.faq__body{
  margin-top:0;
}

.faq__body{
  color:var(--muted);
  font-weight:500;
}

.faq__body{
  padding:0 24px;
}

.faq__body::after{
  content:"";
  display:block;
  height:22px;
}

.faq__item[open] .faq__body{
  padding-bottom:0;
}

.faq__body{
  overflow:hidden;
}

.faq__body{
  font-size:15px;
  line-height:1.65;
}

.section__head h2{
  text-align:center;
  margin:0 auto;
  max-width:980px;
  font-size:clamp(32px, 2.6vw, 54px);
  line-height:1.08;
  font-weight:800;
  letter-spacing:-0.02em;
  color:#0d2f57;
}

/* РџРљ Рё РїР»Р°РЅС€РµС‚ */
@media (min-width: 641px){
  .faq{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:18px;
    align-items:start;
  }

  .faq__item summary{
    min-height:98px;
    padding:28px 28px;
  }

  .faq__body{
    padding:0 28px;
  }

  .faq__body::after{
    height:26px;
  }
}

/* РўРѕР»СЊРєРѕ РјРѕР±РёР»Р° - РЅРµ С‚СЂРѕРіР°РµРј layout, РѕСЃС‚Р°РІР»СЏРµРј РѕРґРЅСѓ РєРѕР»РѕРЅРєСѓ */
@media (max-width: 640px){
  .faq{
    grid-template-columns:1fr;
    gap:12px;
  }

  .faq__item{
    border-radius:18px;
  }

  .faq__item summary{
    padding:18px 18px;
    gap:14px;
  }

  .faq__question{
    font-size:16px;
  }

  .faq__body{
    padding:0 18px;
    font-size:14px;
    line-height:1.55;
  }

  .faq__body::after{
    height:18px;
  }

  .faq__icon{
    flex:0 0 24px;
    width:24px;
    height:24px;
  }

  .faq__icon::before,
  .faq__icon::after{
    width:14px;
  }
}
