.accordion-header {
    border-bottom: 1px solid var(--color-secondary-20);
    background-color: var(--color-white);
}
.accordion-button {
    background: none;
    border: none;
    width: 100%;
    padding: 0;
    cursor: pointer;
    color: var(--color-secondary);
}
.accordion-header header,
.accordion-body {
    padding: 0 1rem;
}
.accordion-header h1 {
    font-size: var(--font-size-24);
}
.accordion-header h2 {
    font-size: var(--font-size-20);
}
.accordion-header h3 {
    font-size: var(--font-size-18);
}
.accordion-header header * {
    font-weight: normal;
    text-transform: uppercase;
    margin: 1rem 0;
    text-align: left;
    position: relative;
    padding-right: 2rem;
}

.accordion-item.active .accordion-header {
    position: sticky;
    z-index: 5;
}

.accordion-collapse {
    position: relative;
    height: 0;
    overflow: hidden;
    transition: all 0.2s ease-in-out; /* Set to timeout duration */
    z-index: 1;
    background-color: var(--color-white);
}

.accordion-button:hover *,
.active > .accordion-header * {
    color: var(--color-primary-1);
}
.accordion-button header *::after {
    position: absolute;
    right: 1rem;
    top: calc(50% - 0.35rem);
    rotate: 90deg;
    transition: rotate 0.2s ease-in-out; /* Set to timeout duration */
}
.accordion-header.sticky-header header *::after {
    display: none;
}
.accordion-button:focus {
    outline-color: var(--color-primary-1);
}
.active > .accordion-header header *::after {
    rotate: 270deg;
    background-color: var(--color-primary-1);
}
.frame.frame-type-accordion {
    margin-bottom: 0;
}