/**
 * contact.css — İletişim sayfası (page-iletisim.php).
 *
 * Form stilleri GLOBAL components.css'tedir (.contact-form / .form-*). Burada yalnız:
 * sayfa düzeni (bilgi | form), iletişim bilgi kartları ve harita.
 *
 * @package Atlas-Proses
 */

.contact { padding-block: clamp(var(--space-8), 4vw, var(--space-16)); }

.contact__grid {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    gap: clamp(var(--space-8), 4vw, var(--space-16));
    align-items: start;
}

/* ── İletişim bilgi kartları ── */
.contact-info {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    margin-top: var(--space-8);
}
.contact-info__item {
    display: flex;
    gap: var(--space-4);
    align-items: flex-start;
    padding: var(--space-5);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background-color: var(--color-background);
}
.contact-info__ic {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; flex: 0 0 auto;
    border-radius: var(--radius-full);
    background-color: var(--color-surface-2);
    color: var(--color-primary);
}
.contact-info__label {
    display: block;
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-text-muted);
    margin-bottom: var(--space-1);
}
.contact-info__value {
    display: block;
    color: var(--color-navy);
    font-weight: 600;
    line-height: var(--leading-normal);
}
a.contact-info__value:hover { color: var(--color-primary); }

.contact__actions { margin-top: var(--space-6); }
.contact__info .social-list { margin-top: var(--space-6); }

/* ── Form kartı — anasayfadaki .quote__card ile birebir aynı görünüm ── */
.quote__card {
    max-width: 550px;
    margin-inline: auto;
    padding: clamp(var(--space-5), 2.4vw, var(--space-8));
    background-color: #fff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-lg);
}
.quote__card-head { margin-bottom: var(--space-5); }
.quote__card-title { font-size: var(--text-xl); color: var(--color-navy); }
.quote__card-sub { margin-top: var(--space-1); color: var(--color-text-muted); font-size: var(--text-sm); }

/* Form içi — kompakt padding/font, büyük harf etiketler (anasayfayla aynı) */
.contact-form { gap: var(--space-4); }
.contact-form__row { gap: var(--space-4); }
.contact-form .form-input,
.contact-form .form-textarea,
.contact-form .form-select {
    padding: var(--space-2) var(--space-3);
    font-size: var(--text-sm);
}
.contact-form .form-textarea { min-height: 88px; }
.quote__card .form-label {
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: var(--text-xs);
    color: var(--color-text-muted);
}
.quote__card .form-label span[aria-hidden] { color: var(--color-danger); }
.contact-form__submit {
    width: 100%;
    border-radius: var(--radius-md);
    padding: var(--space-3) var(--space-6);
}
.contact-form__kvkk {
    display: flex; align-items: center; gap: var(--space-2);
    font-size: var(--text-xs); color: var(--color-text-muted);
}
.contact-form__kvkk .icon { flex: 0 0 auto; color: var(--color-primary); }

/* ── Harita ── */
.contact-map {
    margin-top: clamp(var(--space-10), 5vw, var(--space-16));
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    overflow: hidden;
    line-height: 0;
}
.contact-map iframe { display: block; width: 100%; }

/* ── Duyarlı ── */
@media (max-width: 900px) {
    .contact__grid { grid-template-columns: 1fr; }
}