.kontakt-section { padding: 80px 0; background: var(--color-white); }

.kontakt-section__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 60px;
    align-items: start;
}

.kontakt-section__intro {
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.kontakt-section__text {
    font-size: 16px; line-height: 26px;
    color: var(--color-black);
    max-width: 480px; /* buendig mit rechtem Rand der grauen Kontakt-Karte (Meeting 08.07.) */
}
.kontakt-section__text p { margin: 0 0 16px; }
.kontakt-section__text p:last-child { margin-bottom: 0; }

.kontakt-card {
    background: var(--color-grey-light-1);
    border-radius: var(--radius-md);
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 480px;
    box-sizing: border-box;
    word-break: break-word;
    overflow-wrap: break-word;
}
.kontakt-card__photo {
    width: 220px;
    aspect-ratio: 1 / 1;
    align-self: center;
    overflow: hidden;
    border-radius: var(--radius-md);
    background: var(--color-grey-light-2);
}
.kontakt-card__photo img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
}
.kontakt-card__body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    text-align: center;
    min-width: 0;
    word-break: break-word;
}
.kontakt-card__title {
    font-size: 24px; line-height: 32px; font-weight: 700;
    color: var(--color-black);
    margin: 0 0 4px;
    word-break: break-word; overflow-wrap: break-word;
}
.kontakt-card__body p { font-size: 15px; line-height: 24px; color: var(--color-black); margin: 0; word-break: break-word; overflow-wrap: break-word; }
.kontakt-card__line { display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; min-width: 0; word-break: break-word; overflow-wrap: break-word; }
.kontakt-card__line span { color: var(--color-black); }
.kontakt-card__line a { color: var(--color-blue); text-decoration: underline; }
.kontakt-card__cta { align-self: center; margin-top: 16px; }

.kontakt-section__form .hubspot-placeholder__box {
    text-align: left;
    padding: 48px 40px;
    min-width: 0;
    word-break: break-word;
    overflow-wrap: break-word;
}
.kontakt-section__form .hubspot-placeholder__title {
    font-size: 32px; line-height: 40px;
    margin: 0 0 16px;
    text-align: left;
}
.kontakt-section__form .hubspot-placeholder__lead {
    text-align: left;
    margin: 0 0 32px;
}
.kontakt-section__form .hubspot-placeholder__note {
    text-align: left;
}

@media (max-width: 991px) {
    .kontakt-section { padding: 56px 0; }
    .kontakt-section__grid { grid-template-columns: 1fr; gap: 40px; }
    .kontakt-card { max-width: none; }
    .kontakt-section__text { max-width: none; }
}

@media (max-width: 767px) {
    .kontakt-section { padding: 32px 0 48px; }
    .kontakt-card { padding: 0; background: var(--color-white); }
    .kontakt-card__photo { width: 100%; aspect-ratio: 4 / 3; }
    .kontakt-card__body { text-align: left; }
    .kontakt-card__line { justify-content: flex-start; }
    .kontakt-card__cta { align-self: stretch; }
    .kontakt-card__title { font-size: 22px; line-height: 30px; }
    .kontakt-section__form .hubspot-placeholder__box { padding: 32px 24px; }
    .kontakt-section__form .hubspot-placeholder__title { font-size: 26px; line-height: 34px; }
}
