/* ===============================
    Kontaktbereich als Call-to-Action

    Hebt den Kontaktbereich optisch
    stärker hervor
   =============================== */

.contact-section {

    /* grüner Hintergrund statt weißem Standardbereich */
    background-color: var(--primary-color);

    border-radius: 8px;

    padding: 10px 0;

    box-shadow: 0 10px 28px rgba(42, 153, 81, 0.18);
}


.contact-section .green-column {

    /* helle Säulen im Kontaktbereich */
    background-color: rgba(255, 255, 255, 0.55);
}


.contact-section .info-content h2,
.contact-section .info-content p {

    /* helle Schrift auf grünem Hintergrund */
    color: white;
}


.cta-button {

    /* Link als gut sichtbarer Button */
    display: inline-block;

    margin-top: 10px;

    padding: 14px 24px;

    background-color: white;

    color: var(--primary-color);

    border-radius: 8px;

    text-decoration: none;

    font-weight: 700;

    border: 2px solid white;

    transition:
        background-color 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease;
}


.cta-button:hover {

    /* dezenter Button-Hover */
    background-color: transparent;

    color: white;

    transform: translateY(-3px);
}