/*
 * Cappo — İletişim sayfası (/contact-us/). Yalnız "Cappo İletişim" şablonunda yüklenir.
 * Değerler prototipten (cappo-iletisim.html); fontlar sitenin tokenları. Açık zemin + yapışkan header
 * kuralları base.css'te (body.cappo-acik). Form Contact Form 7 markup'ı (span.wpcf7-form-control-wrap,
 * .wpcf7-response-output, .wpcf7-not-valid-tip) — CF7'nin kendi stili de yüklü, burası üstüne yazar. !important yok.
 */

.cappo-iletisim { font-size: 17px; line-height: 1.7; }

/* ---------- Başlık ---------- */
.cappo-iletisim__bas {
	display: grid;
	gap: 24px;
	padding: clamp(52px, 8vw, 96px) 0 clamp(32px, 4vw, 52px);
}
.cappo-sayfa .cappo-iletisim__baslik {
	margin: 0;
	font-size: clamp(50px, 8vw, 96px);
	line-height: .94;
	letter-spacing: -.015em;
	color: var(--bazalt);
}
.cappo-iletisim__giris { max-width: 44ch; margin: 0; color: var(--is); }

/* ---------- Gövde: form + yan sütun ---------- */
.cappo-iletisim__govde {
	display: grid;
	gap: clamp(36px, 5vw, 72px);
	padding-bottom: clamp(52px, 7vw, 88px);
}

/* Form alanları */
.cappo-iletisim__form .wpcf7 form { margin: 0; }
.cappo-iletisim__form .cappo-alan { display: grid; gap: 7px; margin-bottom: 20px; }
.cappo-iletisim__form .cappo-alan label { font-size: .8rem; color: var(--is); }
.cappo-iletisim__form .wpcf7-form-control-wrap { display: block; position: relative; }
.cappo-iletisim__form .cappo-alan input,
.cappo-iletisim__form .cappo-alan select,
.cappo-iletisim__form .cappo-alan textarea {
	display: block;
	width: 100%;
	margin: 0;
	padding: 13px 15px;
	box-sizing: border-box;
	font: inherit;
	font-size: .97rem;
	line-height: 1.5;
	color: var(--bazalt);
	background: var(--kat-1);
	border: 1px solid var(--cizgi-acik);
	border-radius: 0;
	box-shadow: none;
	transition: border-color var(--sure-hover), background var(--sure-hover);
}
.cappo-iletisim__form .cappo-alan textarea { min-height: 150px; resize: vertical; }
.cappo-iletisim__form .cappo-alan input:focus,
.cappo-iletisim__form .cappo-alan select:focus,
.cappo-iletisim__form .cappo-alan textarea:focus { border-color: var(--bazalt); background: var(--kirec); outline: none; }
.cappo-iletisim__form .cappo-alan .wpcf7-not-valid { border-color: var(--kizil); }
.cappo-iletisim__form .wpcf7-not-valid-tip { display: block; margin-top: 6px; font-size: .8rem; color: var(--kizil); }
.cappo-iletisim__form .cappo-ikili { display: grid; gap: 0; }
.cappo-iletisim__form .cappo-kvkk { max-width: 52ch; margin: 0 0 24px; font-size: .8rem; color: var(--is); }
.cappo-iletisim__form .cappo-kvkk a { color: var(--bazalt); text-decoration: underline; text-underline-offset: 3px; }

/* Konu seçimi: tema select'i büyük harf + aralıklı yapıyor; alan metni normal */
.cappo-iletisim__form .cappo-alan select,
.cappo-iletisim__form .cappo-alan option { text-transform: none; letter-spacing: 0; }

/* Gönder: CF7 6.x [submit] etiketini <button> basar; site butonu, bazalt dolgu (font ve kenar tekrar verilir) */
.cappo-sayfa .cappo-iletisim__form .cappo-btn {
	width: auto;
	margin: 0;
	padding: 15px 34px;
	font: inherit;
	font-size: .75rem;
	letter-spacing: .2em;
	text-transform: uppercase;
	line-height: 1.4;
	border: 1px solid var(--bazalt);
	border-radius: 0;
	background: var(--bazalt);
	color: var(--kirec);
	cursor: pointer;
	transition: background var(--sure-buton), color var(--sure-buton);
	-webkit-appearance: none;
	appearance: none;
}
.cappo-sayfa .cappo-iletisim__form .cappo-btn:hover { background: transparent; color: var(--bazalt); }
.cappo-iletisim__form .wpcf7-spinner { margin: 0 0 0 12px; }

/* Yanıt (prototip .onay): aynı yerde, sol kenarda durum rengi */
.cappo-iletisim__form .wpcf7-response-output {
	margin: 18px 0 0;
	padding: 14px 16px;
	font-size: .85rem;
	color: var(--kahve);
	background: var(--kat-1);
	border: 0;
	border-left: 2px solid var(--defne);
}
.cappo-iletisim__form .wpcf7 form.invalid .wpcf7-response-output,
.cappo-iletisim__form .wpcf7 form.failed .wpcf7-response-output,
.cappo-iletisim__form .wpcf7 form.aborted .wpcf7-response-output,
.cappo-iletisim__form .wpcf7 form.spam .wpcf7-response-output { border-left-color: var(--kizil); }
.cappo-iletisim__form .wpcf7 form.init .wpcf7-response-output { display: none; }

/* Yan sütun */
.cappo-sayfa .cappo-iletisim__yan h2 { margin: 0 0 16px; font-size: 1.375rem; line-height: 1.15; color: var(--bazalt); }
.cappo-iletisim__blok { padding-bottom: 22px; margin-bottom: 22px; border-bottom: 1px solid var(--cizgi-acik); }
.cappo-iletisim__blok:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: none; }
.cappo-iletisim__etiket { display: block; margin-bottom: 5px; font-size: .78rem; color: var(--is); }
.cappo-iletisim__yan p { margin: 0 0 6px; }
.cappo-iletisim__yan a {
	padding-bottom: 1px;
	border-bottom: 1px solid var(--cizgi-acik);
	transition: border-color var(--sure-hover);
}
.cappo-iletisim__yan a:hover { border-bottom-color: var(--bazalt); }
.cappo-iletisim__sosyal { display: flex; flex-wrap: wrap; gap: 14px; font-size: .88rem; }

/* ---------- Harita: gri tonlu, üstüne gelince / odaklanınca renklenir ---------- */
.cappo-iletisim__harita { border-top: 1px solid var(--cizgi-acik); }
.cappo-iletisim__harita iframe {
	display: block;
	width: 100%;
	height: clamp(300px, 42vw, 460px);
	border: 0;
	filter: grayscale(1) contrast(1.05);
	transition: filter .35s;
}
.cappo-iletisim__harita:hover iframe,
.cappo-iletisim__harita:focus-within iframe { filter: none; }

/* ---------- Masaüstü ---------- */
@media (min-width: 901px) {
	.cappo-iletisim__bas { grid-template-columns: minmax(0, 1fr) minmax(0, 44ch); align-items: end; gap: 64px; }
	.cappo-iletisim__govde { grid-template-columns: minmax(0, 1fr) minmax(0, 300px); }
}
@media (min-width: 560px) {
	.cappo-iletisim__form .cappo-ikili { grid-template-columns: 1fr 1fr; gap: 0 20px; }
}

/* ---------- Mobil ---------- */
@media (max-width: 900px) {
	.cappo-iletisim__bas { padding-top: 44px; }
	.cappo-sayfa .cappo-iletisim__form .cappo-btn { width: 100%; }
	/* İletişim bilgisi formdan önce: aramak isteyen kişi uzun formu geçmek zorunda kalmasın */
	.cappo-iletisim__yan { order: -1; }
}