.faq-block { margin-top: 8.75rem; }

.faq-item,
.faq-item__header { transition: all .2s; }

.faq-item {
    padding: 1.5rem 2rem;
    border-radius: 0.5rem;
}

.faq-item .ic-circle-plus svg { border-radius: 50%; }

.faq-item:not(:last-child) { margin-bottom: 0.75rem; }

.faq-item .ic-circle-minus { display: none; }
.faq-item .ic-circle-plus { display: block; }

.faq-item.is-open .ic-circle-minus { display: block; }
.faq-item.is-open .ic-circle-plus { display: none; }

.faq-item__header {
    padding-bottom: 0;
    cursor: pointer;
}

.faq-item__icon { flex-shrink: 0; }

.faq-item__title { line-height: 1.813rem; }

.faq-item__content {
    display: none;
    font-size: 1rem;
    line-height: 1.375rem;
    letter-spacing: 0;
}

.faq-item__link {
    display: inline-block;
    font-weight: 700;
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: var(--color-dark);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.faq-item__link:hover { text-decoration: underline; }

.faq-item.is-open {
    background: #fff;
    box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1);
}

.faq-item.is-open .faq-item__header { padding-bottom: 1rem; }

.faq-item.is-open .faq-item__title { font-weight: 500; }

@media ( hover: hover ) {
    .faq-item,
    .faq-item__header svg,
    .faq-item__header path { transition: all .2s; }

    .faq-item:has(.faq-item__header:hover) { background: #fff; }

    .faq-item:has(.faq-item__header:hover) .ic-circle-plus svg { background: var(--color-dark); }

    .faq-item:has(.faq-item__header:hover) .ic-circle-plus path:last-child { fill: #fff; }
}

@media ( max-width: 1099px ) {
    .faq-block { margin-top: 4rem; }

    .faq-block__title br { display: none; }

    .faq-item { padding: 1rem 1.5rem; }
    .faq-item:not(:last-child) { margin-bottom: 0.5rem; }

    .faq-item__icon .ic { --ic-h: 1.375rem; }

    .faq-item__title {
        font-size: 1rem;
        line-height: 1.375rem;
    }

    .faq-item__content {
        font-size: 0.875rem;
        line-height: 1.25rem;
    }

    .faq-item.is-open .faq-item__header { padding-bottom: 0.5rem; }

    .faq-item.is-open { padding-bottom: 1.5rem; }
}