.shortcode_userpage-wrapper {    
    h1 {
        text-align: center;
        margin-bottom: calc(clamp(20px, 3vw, 50px) / 2);
    }
    h2 {
        margin-bottom: 5px
    }
    .product-description {
        margin-top: 20px;
    }
    .textimage {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        column-gap: clamp(20px, 3vw, 60px);
        row-gap: 20px;
        margin: 0 auto clamp(20px, 3vw, 50px) auto;
        max-width: var(--maxWidth, 1250px);
        width: var(--baseWidth, 92%);
        position: relative;
        z-index: 1;

        &:nth-of-type(even) {
            flex-direction: row-reverse;
        }

        > * {
            flex-basis: 400px;
            flex-grow: 1;
        }
        .details {
            li {
                list-style-type: none; 

                &:before {
                    content: '';
                    mask-repeat: no-repeat;
                    mask-size: contain;
                    width: 20px;
                    height: 20px;
                    display: inline-block;
                    background-color: var(--mainColor, #5E8837);
                    transform: translateY(20%);
                    margin-right: 10px;
                }  
            }
            .area {
                &:before {
                    mask-image: url('data:image/svg+xml, <svg width="800px" height="800px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M30.531 29.469l-28.001-27.999c-0.136-0.136-0.323-0.22-0.531-0.22-0.414 0-0.75 0.336-0.75 0.75 0 0 0 0 0 0.001v-0 28c0 0.414 0.336 0.75 0.75 0.75h28c0.415-0 0.751-0.336 0.751-0.751 0-0.207-0.084-0.395-0.22-0.53v0zM2.75 29.25v-25.439l4.197 4.197-1.485 1.531c-0.135 0.136-0.218 0.323-0.218 0.529 0 0.414 0.336 0.75 0.75 0.75 0.214 0 0.407-0.090 0.544-0.234l0-0 1.47-1.515 3.931 3.931-1.47 1.47c-0.14 0.136-0.227 0.327-0.227 0.538 0 0.414 0.336 0.75 0.75 0.75 0.211 0 0.401-0.087 0.537-0.227l1.47-1.47 3.939 3.939-1.47 1.469c-0.135 0.136-0.218 0.323-0.218 0.529 0 0.415 0.336 0.751 0.751 0.751 0.206 0 0.393-0.083 0.528-0.218l1.471-1.47 3.938 3.938-1.47 1.47c-0.136 0.136-0.22 0.324-0.22 0.531 0 0.415 0.336 0.751 0.751 0.751 0.207 0 0.395-0.084 0.531-0.22l1.47-1.47 5.188 5.188zM6.53 16.47c-0.136-0.136-0.323-0.22-0.531-0.22-0.414 0-0.75 0.336-0.75 0.75 0 0 0 0 0 0.001v-0 9c0 0.414 0.336 0.75 0.75 0.75h9c0 0 0 0 0 0 0.414 0 0.75-0.336 0.75-0.75 0-0.207-0.084-0.395-0.22-0.531v0zM6.75 25.25v-6.439l6.439 6.439z"></path></svg>');
                }
            }
            .co2 {
                &:before {
                    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-cloud" viewBox="0 0 16 16"><path d="M4.406 3.342A5.53 5.53 0 0 1 8 2c2.69 0 4.923 2 5.166 4.579C14.758 6.804 16 8.137 16 9.773 16 11.569 14.502 13 12.687 13H3.781C1.708 13 0 11.366 0 9.318c0-1.763 1.266-3.223 2.942-3.593.143-.863.698-1.723 1.464-2.383m.653.757c-.757.653-1.153 1.44-1.153 2.056v.448l-.445.049C2.064 6.805 1 7.952 1 9.318 1 10.785 2.23 12 3.781 12h8.906C13.98 12 15 10.988 15 9.773c0-1.216-1.02-2.228-2.313-2.228h-.5v-.5C12.188 4.825 10.328 3 8 3a4.53 4.53 0 0 0-2.941 1.1z"/></svg>');
                }
            }
            .coordinates {
                &:before {
                    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-geo" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M8 1a3 3 0 1 0 0 6 3 3 0 0 0 0-6M4 4a4 4 0 1 1 4.5 3.969V13.5a.5.5 0 0 1-1 0V7.97A4 4 0 0 1 4 3.999zm2.493 8.574a.5.5 0 0 1-.411.575c-.712.118-1.28.295-1.655.493a1.3 1.3 0 0 0-.37.265.3.3 0 0 0-.057.09V14l.002.008.016.033a.6.6 0 0 0 .145.15c.165.13.435.27.813.395.751.25 1.82.414 3.024.414s2.273-.163 3.024-.414c.378-.126.648-.265.813-.395a.6.6 0 0 0 .146-.15l.015-.033L12 14v-.004a.3.3 0 0 0-.057-.09 1.3 1.3 0 0 0-.37-.264c-.376-.198-.943-.375-1.655-.493a.5.5 0 1 1 .164-.986c.77.127 1.452.328 1.957.594C12.5 13 13 13.4 13 14c0 .426-.26.752-.544.977-.29.228-.68.413-1.116.558-.878.293-2.059.465-3.34.465s-2.462-.172-3.34-.465c-.436-.145-.826-.33-1.116-.558C3.26 14.752 3 14.426 3 14c0-.599.5-1 .961-1.243.505-.266 1.187-.467 1.957-.594a.5.5 0 0 1 .575.411"/></svg>');
                }
            }
            .date {
                &:before {
                    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-calendar" viewBox="0 0 16 16"><path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5M1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4z"/></svg>');
                }
            }
        }
        .button {
            margin-top: 20px
        }

        .image {
            max-width: 625px;
            aspect-ratio: 1 / 1;
            
            img {
                border: 2px solid var(--mainColor);
                max-width: 100%
            }
        }
    }
    .switchcontent {
        display: flex;
        flex-direction: column-reverse;
    }
    .cards {
        display: flex;
        justify-content: center;
        gap: 20px; 
        margin-bottom: clamp(20px, 3vw, 40px);
        padding: 20px;
        font-weight: 600;
        position: relative;
        color: #fff;

        /* &:before {
            content: '';
            display: block;
            position: absolute;
            top: 0;
            height: 200%;
            z-index: 0;
            width: 100%;
            background-color: rgb(194, 203, 186);
        } */
        .card {
            /* width: 200px; */
            background: #fff;
            /* aspect-ratio: 1 / 1; */
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            padding: 20px;
            box-sizing: border-box;
            text-align: center;
            border-radius: 15px;
            position: relative;
            background-color: var(--mainColor, #79a83b);
            font-size: 18px;
        }
        .highlight {
            font-size: clamp(30px, 3vw, 40px);
            line-height: 1.4;
        }
    }
}

/* Jahreszeitenbilder-Galerie auf der persönlichen Spendenseite */
.season-gallery {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    margin: 100px auto;
    width: var(--baseWidth, 92%);
    max-width: var(--maxWidth, 1250px);
}

.season-gallery__item {
    flex: 1 1 150px;
    max-width: 500px;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}

.season-gallery__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.season-gallery__heading {
    margin: 100px auto clamp(20px, 3vw, 40px);
    width: var(--baseWidth, 92%);
    max-width: var(--maxWidth, 1250px);
    text-align: center;
}

/* Folgt eine Überschrift direkt vor der Galerie, deren oberen Abstand entfernen */
.season-gallery__heading + .season-gallery {
    margin-top: 0;
}