/* ============================================================================
   Mesleki Eğitim Merkezi — İLETİŞİM
   Kaynak tasarım: dc-mem/"Iletisim.dc.html"

   PORT KURALI (ana sayfa portuyla aynı)
   - Statik görsel/yerleşim stilleri şablonda INLINE durur.
   - Bu dosya YALNIZCA responsive / hover / durum / JS'e bağlı olanı taşır.
   - İSTİSNA: hover'ı olan yüzeylerin kenarlık/zemini de BURADA durur. Inline
     `border:1px solid #DCE8F0` shorthand'i, stylesheet'teki `:hover
     {border-color:…}` kuralını (inline > author) yener; o yüzden hover'lı
     kartlar tamamen CSS'tedir.

   ÖZGÜLLÜK NOTU (hello-elementor + Elementor Kit bu dosyadan SONRA yüklenir)
   - Kart/bağlantı kuralları `.mem-app` önekiyle (0,2,0)+ yazılır.
   - `a{color:#c36}` ve `a:hover{color:#336}` reset'i core/base.css §7.1
     nötrler; buradaki renkler onun ÜSTÜNE (0,2,0) yazar.
   ========================================================================== */


/* === 1. İLETİŞİM KANALI KARTI ============================================
   Tasarım: beyaz zemin, 1px #DCE8F0, 18px yarıçap, 22px iç boşluk;
   style-hover="border-color:rgba(1,158,227,.38)".
   ========================================================================== */
.mem-app .mem-contact-card {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 22px;
	background: var(--mem-surface);
	border: 1px solid var(--mem-border);
	border-radius: 18px;
	color: var(--mem-text);
	text-decoration: none;
	transition: border-color var(--mem-dur-base) var(--mem-ease),
	            box-shadow var(--mem-dur-base) var(--mem-ease);
}
.mem-app a.mem-contact-card:hover,
.mem-app a.mem-contact-card:focus-visible {
	border-color: rgba(1, 158, 227, .38);
	box-shadow: var(--mem-shadow-card);
	color: var(--mem-text);
	text-decoration: none;
}

/* İkon kutusu — tasarımda 48×48 / 14px yarıçap / açık mavi zemin. */
.mem-app .mem-contact-card__icon {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 14px;
	background: var(--mem-tint);
}
/* WhatsApp kartında mint zemin (tasarımdaki #EFF8F5). */
.mem-app .mem-contact-card__icon--wa { background: var(--mem-success-bg); }


/* === 2. KVKK BİLDİRİM BAĞLANTISI ========================================= */
.mem-app .mem-contact-legal {
	font-weight: 700;
	color: var(--mem-blue);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.mem-app .mem-contact-legal:hover,
.mem-app .mem-contact-legal:focus { color: var(--mem-blue-dark); }


/* === 3. YOL GÖSTERGESİ ===================================================
   Yalnız görsel; schema Rank Math'a aittir.
   ========================================================================== */
.mem-app .mem-contact-crumbs a { color: var(--mem-blue); }
.mem-app .mem-contact-crumbs a:hover,
.mem-app .mem-contact-crumbs a:focus { color: var(--mem-blue-dark); text-decoration: underline; }


/* === 4. HARİTA (yalnız maps_embed ayarı doluysa basılır) =================
   Boş durumda hiç kutu çizilmez — bu blok da hiç render edilmez.
   ========================================================================== */
.mem-app .mem-contact-map {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	min-height: 280px;
	overflow: hidden;
	border: 1px solid var(--mem-border);
	border-radius: 20px;
	background: var(--mem-tint);
}
.mem-app .mem-contact-map iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}
@media (min-width: 1024px) {
	.mem-app .mem-contact-map { aspect-ratio: 21 / 9; }
}


/* === 5. IZGARA/KOLON TAŞMA KORUMASI ======================================
   Flex öğesi `min-width:auto` ile içeriğinin (form alanı, uzun e-posta)
   min-content'ini aşabilir → dar ekranda sağa taşar.
   ========================================================================== */
.mem-app .mem-contact-col { min-width: 0; }
.mem-app .mem-contact-col img { max-width: 100%; }


/* === 6. FORM KABI ========================================================
   Alan görünümü core/lead-form.css'ten gelir; burada yalnız kabın
   Elementor Pro varyantındaki dikey ritmi düzeltiliyor.
   ========================================================================== */
.mem-app .mem-contact .mem-elform .elementor-field-group { margin-bottom: 14px; }
.mem-app .mem-contact .mem-elform .elementor-button { width: 100%; }


/* === 7. HAREKET AZALTMA ================================================== */
@media (prefers-reduced-motion: reduce) {
	.mem-app .mem-contact-card { transition: none; }
}