/* Overlay */
#mindmapOverlay{
    position: fixed;
    top:0; left:0;
    width:100%; height:100%;
    background: rgba(0,0,0,0.65);
    display:none;
    overflow-y:auto;
    padding:18px 22px;
    box-sizing:border-box;
    z-index: 999999;
}

/* Weißer Container */
.mindmapBox{
    background: var(--wp--preset--color--background, #fff);
    max-width:880px;
    margin:auto;
    padding:28px 40px;
    border-radius:4px;
    position:relative;
    text-align:center;
}

/* Close Button */
.closeBtn{
    position:absolute;
    top:12px; right:16px;
    font-size:22px;
    cursor:pointer;
}

/* Grid Layout */
.mindmap{
    display:grid;
    grid-template-columns:1fr 1fr;
    row-gap:24px; column-gap:55px;
    margin-top:14px;
}

/* Spalten */
.root{
    display:flex;
    flex-direction:column;
    gap:10px;
    align-items:center;
    border: 1px solid black;
    padding: 8px 0;
}

/* Kästen */
.node{
    background: #f1f1f1;
    padding:12px 14px;
    width:100%;
    max-width:250px;
    cursor:pointer;
    text-align:left;
    transition: background 0.25s, transform 0.25s;
}
.node:hover{
    background: var(--wp--preset--color--tertiary, #e8e8e8);
}

/* Kurztext */
.preview{
    font-size:13px;
    color: inherit;
    margin-top:4px;
    opacity:1;
    transition: opacity 0.25s ease;
}

/* Liste */
.node ul{
    max-height:0;
    opacity:0;
    overflow:hidden;
    margin-top:6px;
    padding-left:18px;
    transition: max-height 0.35s ease, opacity 0.25s ease;
}

/* Aktiv */
.node.active{
    background: #ffffff;
    max-width:310px;
    transform:scale(1.02);
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}
.node.active .preview{
    opacity:0;
}
.node.active ul{
    max-height:2220px;
    opacity:1;
}

/* Mobile */
@media (max-width:600px){
    .mindmap{
        grid-template-columns:1fr;
        row-gap:18px;
    }
    .node{
        max-width:420px;
    }
    .node.active{
        max-width:420px;
    }
}

.mindmapGrid {
display:grid;
grid-template-columns: repeat(2, 1fr);
column-gap:18px;
row-gap:14px;
}

@media (max-width:600px){
.mindmapGrid{
grid-template-columns:1fr;
}
}

.node ul{
display:none;
margin-top:8px;
}

.node.active ul{
display:block;
}

.node.active p{
display:none;
}

.node{
transition:all .25s ease;
}

.schmal {
    margin: 0;
    line-height: 1.4em;
}