.contact-location {
    display: flex;

    gap: 20px;

    max-width: 1300px;

    margin: 20px auto 0;

    padding: 20px;

    padding-bottom: 60px;
}

.contact-card:hover {
    transform: translateY(-5px);
}

.contact-card h2 {
    margin-top: 0;
    color: #0f172a;
    font-size: 28px;
}

.contact-card h3 {
    color: #0f172a;
    margin-bottom: 20px;
}

.contact-card p {
    line-height: 1.8;
    color: #555;
    margin-bottom: 15px;
    font-size: 17px;
}

.contact-card i {
    color: #2563eb;
    width: 25px;
}

.contact-map {
    flex: 0 0 68%;
}

.contact-map iframe {
    width: 100%;

    height: 100%;

    min-height: 350px;

    border-radius: 12px;

    box-shadow: 0 5px 20px rgba(0, 0, 0, .08);
}


@media (max-width: 768px) {

    .contact-location {
        flex-direction: column;
    }
        .contact-card {
        padding: 30px;
    }
}