/*** ---------- Blog > Table of contents ---------- ***/
.wpb-inhoudsopgave { padding-bottom: 1.6rem; margin-bottom: 1.6rem; border-bottom: 1px solid var(--clr-border); 
    .wpb-inhoudsopgave__header { display: flex; align-items: center; gap: 1.6rem; margin-bottom: 1rem; 
        i { font-size: 2rem; transition: transform var(--ts-duration) ease; }
        &:hover { cursor: pointer; }
    }

    .wpb-article-index { max-height: 0px; opacity: 0; overflow: hidden; transition: max-height var(--ts-duration) ease, opacity var(--ts-duration) ease; 
        .wpb-icon-wrapper { --icon-clr: var(--clr-text); --size: 2rem; background-color: var(--clr-light); margin-top: .3rem; transition: background-color var(--ts-duration) ease; 
            i { font-size: 1.2rem; transition: background-color var(--ts-duration) ease; 
                &::before { font-size: 1rem; color: var(--icon-clr)!important; }
            }
        }
        .index { 
            a { display: flex; gap: 1.6rem; transition: color var(--ts-duration) ease; text-decoration: none!important; 
                &.index-h3 { font-size: var(--fs-small); padding-left: 4.8rem; }
                &:hover { color: var(--clr-primary); }
            }
            &:has(.index-h3) { margin-bottom: .4rem; }
            &:hover .wpb-icon-wrapper { --icon-clr: var(--clr-heading-primary); background-color: var(--clr-primary); }
        }
    }

    &.active {
        .wpb-article-index { max-height: 100rem; opacity: 1; }
        .wpb-inhoudsopgave__header i { transform: rotate(180deg); }
    }
}

/*** ---------- Blog > Content ---------- ***/
.wp-block-image img { border-radius: var(--radius); }