/* BLOK: faq */
.faq { position: relative; margin-top: 48px; margin-bottom: 48px; }
.faq__wrapper { display: flex; flex-direction: column; gap: 16px; }

.faq__item { display: flex; flex-direction: column; border-bottom: 1px solid #707173; }
.faq__row-top { display: grid; grid-template-columns: 1fr minmax(75px, max-content); gap: 16px; cursor: pointer; }

.faq__label-name { color: #000; transition: color .3s; }
.faq__item:hover .faq__label-name,
.faq__item--expanded .faq__label-name { color: #e2007e; }

.faq__label-btn { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.faq__icon { display: block; min-width: 12px; width: 12px; height: auto; transition: rotate .3s; }
.faq__item--expanded .faq__icon { rotate: 180deg; }

.faq__icon path { stroke: #000; transition: stroke .3s; }
.faq__item:hover .faq__icon path,
.faq__item--expanded .faq__icon path { stroke: #e2007e; }

.faq__btn-name { color: #000; transition: color .3s; }
.faq__item:hover .faq__btn-name,
.faq__item--expanded .faq__btn-name { color: #e2007e; }

.faq__row-bottom { display: none; }
.faq__item--expanded .faq__row-bottom { display: block; }

/* Kontrast */
.theme--contrast .faq__item:hover .faq__label-name,
.theme--contrast .faq__item--expanded .faq__label-name,
.theme--contrast .faq__item:hover .faq__btn-name,
.theme--contrast .faq__item--expanded .faq__btn-name { color: #ffe800 !important; }

.theme--contrast .faq__icon { background-color: transparent !important; }
.theme--contrast .faq__icon path { stroke: #fff !important; }
.theme--contrast .faq__item:hover .faq__icon path,
.theme--contrast .faq__item--expanded .faq__icon path { stroke: #ffe800 !important; }

@media all and (max-width: 992px) {
  .faq { margin-top: 24px; margin-bottom: 24px; }
}