
.dina-explanation-table__container{
    display: block;
    position: relative;

}
.dina-explanation-table__container h2,
.dina-explanation-table__container h3,
.dina-explanation-table__container p{
    padding: 0; margin: 0;
}

.dina-explanation-table__container h2{
    color: var(--dina-dark-green-100);
    font-size: 1.5em;
    margin-bottom: var(--dina-spacing-12);
}

.dina-explanation-table__container h3,
.dina-insurance .dina-explanation-table__container h3{
    font-size: 1.2em;
    text-transform: none;
    margin-bottom: var(--dina-spacing-4);
}

.dina-explanation-table__header-row,
.dina-explanation-table__row{
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    flex-flow: column wrap;
    gap: var(--dina-spacing-4);
    flex-flow: row wrap;
    margin-bottom: var(--dina-spacing-4);  
}


.dina-explanation-table__header-cell,
.dina-explanation-table__cell{
    flex-grow: 4;
    padding: var(--dina-spacing-12) var(--dina-spacing-16);
}

.dina-explanation-table__header-cell{
    text-align: center;
}
.dina-explanation-table__cell{
    border: solid 2px var(--dina-light-green-100);
}

.dina-explanation-table__header-cell.dina-explanation-table--description{
    text-align: left;
}

.dina-explanation-table__header-cell.dina-explanation-table--description,
.dina-explanation-table__cell.dina-explanation-table--title{
    max-width: calc(100% - 16.2em);
}

.dina-explanation-table__cell.dina-explanation-table--title{
    background-color: var(--dina-light-green-100);
    position: relative;
    padding-right: var(--dina-spacing-72); 
}
.dina-explanation-table__cell.dina-explanation-table--title h3,
.dina-explanation-table__cell.dina-explanation-table--title p{
    color: var(--dina-greyscale-white-100);
} 

.dina-explanation-table__cell.dina-explanation-table--title button{
    border: none;
    border-radius: 50%;
    background-color: var(--dina-light-green-90);
    background-image: var(--dina-icon);
    font-size: 0;
    width: 2.8rem;
    height: 2.8rem;
    position: absolute;
    top: 1rem;
    right: 0.9rem;
    cursor: pointer;
}


.dina-explanation-table__cell.dina-explanation-table--title button[aria-expanded="true"]{
    transform: rotate(180deg)
}


.dina-explanation-table__header-cell.dina-explanation-table--header,
.dina-explanation-table__cell.dina-explanation-table--applies-to {
    min-width: var(--dina-spacing-80);
    max-width: var(--dina-spacing-80);
    background-image: var(--dina-icon);
}

.dina-explanation-table__cell.dina-explanation-table--applies-to p{
    font-size: 0;
}

.dina-explanation-table__cell.dina-explanation-table--explanation {
    width: 100%;
    border: none;
    display: none;
}


@media screen and (max-width: 900px) {
    .dina-explanation-table__header-cell.dina-explanation-table--description,
    .dina-explanation-table__cell.dina-explanation-table--title{
        max-width: calc(100% - 9.2em);
        padding-right: var(--dina-spacing-48);
    }
    .dina-explanation-table__header-cell.dina-explanation-table--header,
    .dina-explanation-table__cell.dina-explanation-table--applies-to {
        min-width: var(--dina-spacing-40);
        max-width: var(--dina-spacing-40);
    }

    .dina-explanation-table__header-cell,
    .dina-explanation-table__cell{
        flex-grow: 4;
        padding: var(--dina-spacing-8) var(--dina-spacing-12);
    }

    .dina-explanation-table__cell.dina-explanation-table--title button{
        width: 2rem;
        height: 2rem;
    }

}

@media screen and (max-width: 799px) {
    .dina-explanation-table__header-cell.dina-explanation-table--description,
    .dina-explanation-table__cell.dina-explanation-table--title{
        max-width: calc(100% - 8.5em);
    }

}

.dina-explanation-table__container.dina-explanation-table__product-layout .dina-explanation-table__header-cell.dina-explanation-table--description, 
.dina-explanation-table__container.dina-explanation-table__product-layout .dina-explanation-table__cell.dina-explanation-table--title {
    max-width: 65%;
}

.dina-explanation-table__container.dina-explanation-table__product-layout .dina-explanation-table__header-cell.dina-explanation-table--header, 
.dina-explanation-table__container.dina-explanation-table__product-layout .dina-explanation-table__cell.dina-explanation-table--applies-to {
    min-width: var(--dina-spacing-80);
    max-width: 33%;
}


.dina-explanation-table__container.dina-explanation-table__product-layout .dina-icon--small {
    background-size: 1.3rem;
    background-image: var(--dina-icon);
}

.dina-explanation-table__container.dina-explanation-table__product-layout .dina-explanation-table__header-cell, .dina-explanation-table__cell{
    padding: var(--dina-spacing-24) var(--dina-spacing-16);
}