.contact {
    padding: 54px 0 62px;
}

.contact-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    align-items: start;
}

.contact-card {
    background:
        radial-gradient(130% 110% at 0% 0%, rgba(34, 211, 238, 0.1), transparent),
        linear-gradient(170deg, rgba(13, 26, 45, 0.92), rgba(10, 19, 33, 0.96));
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    box-shadow: var(--shadow);
    height: fit-content;
}

.contact-card h3 {
    margin: 0 0 0.5rem;
}

.contact-details {
    display: grid;
    gap: 0.75rem;
}

.contact-details li {
    display: flex;
    gap: 0.6rem;
    color: var(--muted);
}

.contact-details strong {
    width: 120px;
    color: var(--text);
}

.social {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.social a {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.9rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: rgba(16, 32, 55, 0.9);
    transition: var(--transition);
}

.social a:hover {
    border-color: rgba(34, 211, 238, 0.45);
    background: rgba(34, 211, 238, 0.12);
}

.form-grid {
    display: grid;
    gap: 0.75rem;
}

.form-grid label {
    display: block;
    margin-bottom: 0.3rem;
    color: var(--text);
    font-weight: 600;
}

.form-grid input,
.form-grid textarea {
    width: 100%;
    padding: 0.85rem 0.95rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border);
    background: rgba(11, 25, 43, 0.92);
    color: var(--text);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.form-grid textarea {
    min-height: 140px;
    resize: vertical;
}

.form-grid input:focus,
.form-grid textarea:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(34, 211, 238, 0.16);
    background: rgba(13, 31, 52, 0.96);
}

.form-feedback {
    padding: 0.75rem 0.9rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border);
    color: var(--text);
    background: rgba(255, 255, 255, 0.02);
}

.form-feedback.success {
    border-color: var(--success);
}

.form-feedback.error {
    border-color: var(--danger);
}

.form-grid button[disabled] {
    opacity: 0.7;
    cursor: wait;
    transform: none;
    box-shadow: none;
}
