/* =====================================================
   KIDS AM DÖNBERG E.V.
   SPENDEN
   ===================================================== */


/* =====================================================
   SPENDENPLATTFORM
   ===================================================== */

.donation-platform {
    margin-top: 28px;
}


/* Logos */

.donation-platform-logos {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 18px;

    margin-bottom: 22px;
}

.donation-logo {
    display: block;

    width: auto;
    max-width: 100%;
    height: auto;

    object-fit: contain;
}

.donation-logo-wirwunder {
    max-height: 52px;
}

.donation-logo-betterplace {
    max-height: 42px;
}


/* Zusatztext */

.donation-platform-via {
    color: --text-muted;

    font-size: 0.8rem;
}

.donation-platform > p {
    margin: 0 0 24px;

    line-height: 1.65;
}


/* Text-hervorhebung */
.donation-easy-partial {
    max-width: 760px;

    margin: 10px auto 20px;
    padding: 24px;

    background-color: var(--background-beige);

    border-radius: 24px;
}

.donation-info{
    margin: 50px 0 0;
}


/* =====================================================
   SPENDENBELEG
   ===================================================== */

.donation-receipt-content {
    max-width: 900px;

    margin-inline: auto;
}

.donation-receipt-content > h2 {
    margin: 0 0 18px;

    color: var(--blue);

    font-size: 1.8rem;
    line-height: 1.15;
}

.donation-receipt-content > p:not(.section-kicker) {
    max-width: 700px;

    margin: 0 0 28px;

    line-height: 1.65;
}


/* Spendenbeleg-Karten */

.donation-receipt-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.donation-receipt-card {
    padding: 22px;

    background-color: var(--white);

    border-radius: 20px;
}

.donation-receipt-card h3 {
    margin: 0 0 12px;

    color: var(--blue);

    font-size: 1.15rem;
}

.donation-receipt-card p {
    margin: 0;

    line-height: 1.6;
}


/* =====================================================
   TABLET
   ===================================================== */

@media (min-width: 768px) {

    .donation-receipt-content > h2 {
        font-size: 2.1rem;
    }

    .donation-receipt-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .donation-receipt-card {
        padding: 26px;
    }

}