/* Kaynak: Site Footer.dc.html */
body { margin:0; background:#fff; -webkit-font-smoothing:antialiased; }

/* =========================================================================
   KRITIK CSS KORUMA — 27.08.2026, ölçülerek bulundu.
   QUIC.cloud kritik CSS üretirken gerçek sayfayı değil bir ara sayfayı
   çekip onun kurallarını <style id="litespeed-ccss"> içine gömüyordu:
       body{display:flex;flex-direction:column;height:100vh;min-height:100vh}
   CSS async yüklendiği için bu kuralı sonradan hiçbir stylesheet ezmiyor.
   Sonuç: body ekran boyuna kilitleniyor; header ve footer birer flex öğesi
   (sarmalayıcı display:contents) ve footer satır içi overflow:hidden taşıdığı
   için otomatik asgari boyutu 0 oluyor -> footer sıfıra eziliyor.
   Ölçüm: 22 sayfanın 3'ünde footer yüksekliği 0 (1440px ve 390px).
   Zehirli kural sayfalara dönüşümlü geldiğinden tek sayfa düzeltmesi yetmez.
   Yükseklik satır içi değil kritik CSS'ten geldiği için !important zorunlu.
   height:auto -> sütun-flex konteyner içeriğe göre büyür, hiçbir öğe ezilmez.
   ========================================================================= */
html body { height: auto !important; }
.fes-app .fes-ftr, .fes-app .fes-hdr__bar { flex: 0 0 auto !important; }
.fes-app a { color:#174A91; text-decoration:none; }
.fes-app a:hover { color:#092D5B; }
.fes-app [data-qrail] { pointer-events:none; }
.fes-app [data-qrail] a { box-sizing:border-box; height:52px; padding:0 20px 0 17px; justify-content:center; pointer-events:auto; }
.fes-app [data-qrail] [data-qlabel] { margin-left:10px; white-space:nowrap; }
@keyframes fmShine { 0% { transform:translateX(-140%) skewX(-18deg); } 55%,100% { transform:translateX(320%) skewX(-18deg); } }
@keyframes fmPulse { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-3px); } }
/* --- Claude Design style-hover/focus/active dönüşümleri --- */
.fes-app [data-fh="36ba2303"]:hover { box-shadow:0 22px 46px rgba(6,29,61,.38), inset 0 1px 0 rgba(255,255,255,.65); filter:saturate(1.12); color:#fff; }
.fes-app [data-fh="6e097841"]:hover { box-shadow:0 22px 46px rgba(6,29,61,.38), inset 0 1px 0 rgba(255,255,255,.6); filter:saturate(1.12); color:#fff; }
.fes-app [data-fh="2768aa5b"]:hover { background:#C4342D; color:#fff; transform:translateY(-2px); }
.fes-app [data-fh="4a99a983"]:hover { color:#fff; }
.fes-app [data-fh="9080c123"]:hover { background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.32); color:#fff; }

/* =========================================================================
   RESPONSIVE — tasarımda @media yok. Masaüstü (>=1024px) DEĞİŞMEZ.
   Tasarımdan gelen inline style stylesheet'i yendiği için inline yazılmış
   her özelliğin ezilmesinde `!important` zorunlu (nedeni satır içinde).
   ========================================================================= */

/* --- <=1023px: 4 sütun -> 2 sütun, marka bloğu tam genişlik ------------- */
@media (max-width: 1023.98px) {
	.fes-app .fes-ftr__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important; /* inline 1.6fr + 3x1fr */
		gap: 34px 28px !important;                                   /* inline gap:clamp() */
		padding: 48px 0 40px !important;                             /* inline padding */
	}
	.fes-app .fes-ftr__brandcol { grid-column: 1 / -1; }
	.fes-app .fes-ftr__wrap { padding: 0 24px !important; }          /* inline padding:0 40px */
	.fes-app .fes-ftr__strip { padding: 28px 24px !important; gap: 24px !important; }
	/* Sabit iletişim rayı (116px + 22px alt boşluk) yasal satırın üstüne binmesin. */
	.fes-app .fes-ftr { padding-bottom: calc(150px + env(safe-area-inset-bottom)); }
}

/* --- <=767px: tek sütun + sabit iletişim rayı için güvenli boşluk ------- */
@media (max-width: 767.98px) {
	.fes-app .fes-ftr__grid { grid-template-columns: minmax(0, 1fr) !important; gap: 30px !important; padding: 40px 0 32px !important; }
	.fes-app .fes-ftr__wrap { padding: 0 20px !important; }
	.fes-app .fes-ftr__strip { padding: 24px 20px !important; gap: 20px !important; }
	.fes-app .fes-ftr__trust { gap: 18px !important; }               /* inline gap:clamp() */
	/* Dikey ayraçlar tek sütunda anlamsız — yalnız bu iki span aria-hidden. */
	.fes-app .fes-ftr__trust > [aria-hidden="true"] { display: none !important; }
	.fes-app .fes-ftr__legal { padding: 20px 0 26px !important; gap: 14px !important; }
	.fes-app .fes-ftr__brandcol p { max-width: none !important; }    /* inline max-width:340px */

	/* Sabit hızlı iletişim rayı (2 x 52px + 10px ara + 12px alt) yasal satırı kapatmasın. */
	.fes-app .fes-ftr { padding-bottom: calc(126px + env(safe-area-inset-bottom)); }

	/* Ray ikon-only'ye düşer: dokunma hedefi 52x52, etiket gizli (aria-label kalır). */
	.fes-app [data-qrail] { right: 12px !important; bottom: calc(12px + env(safe-area-inset-bottom)) !important; gap: 10px !important; }
	.fes-app [data-qrail] a { width: 52px; padding: 0; }
	/* Telefon etiketinde inline `display:flex` var — !important şart. */
	.fes-app [data-qrail] [data-qlabel] { display: none !important; }
}

/* ---------------------------------------------------------------------------
   Sabit hızlı iletişim rayı — dar/orta ekranlarda daralt.
   Gerekçe (ölçüldü, measure.mjs "sabit öğe altında kalan tıklanabilirler"):
   1280–1440 px arasında etiketli ray, eğitim detay sayfasının kenar
   çubuğundaki "WhatsApp'tan Sor" ve "Telefonla Danış" düğmelerini örtüyordu —
   yani AYNI eylemin iki kopyası çakışıyor ve biri tıklanamıyordu.
   ≥1600 px'te tasarımın etiketli hâli aynen korunur.
   `!important` zorunlu: ölçüler tasarımdan gelen inline style'da.
   --------------------------------------------------------------------------- */
@media (max-width: 1279.98px) and (min-width: 768px) {
	.fes-app [data-qrail] [data-qlabel] {
		position: absolute !important;
		width: 1px; height: 1px;
		margin: -1px; padding: 0;
		overflow: hidden; clip-path: inset(50%);
		white-space: nowrap;
	}

	/* Etiket gizlenince yuvarlak düğmeye dön. */
	.fes-app [data-qrail] > a {
		width: 56px !important;
		min-width: 0 !important;
		padding: 0 !important;
		justify-content: center !important;
		border-radius: 50% !important;
	}

	.fes-app [data-qrail] > a > span[aria-hidden="true"] { border-radius: 50% !important; }

	/* Odaklanınca/hover'da etiket geri gelsin — bilgi kaybı olmasın. */
	.fes-app [data-qrail] > a:is(:hover, :focus-visible) {
		width: auto !important;
		padding: 0 20px 0 16px !important;
		border-radius: 28px !important;
		gap: 10px !important;
	}

	.fes-app [data-qrail] > a:is(:hover, :focus-visible) [data-qlabel] {
		position: relative !important;
		width: auto; height: auto;
		margin: 0; overflow: visible;
		clip-path: none;
	}

	.fes-app [data-qrail] > a:is(:hover, :focus-visible) > span[aria-hidden="true"] { border-radius: 28px !important; }
}

/* ---------------------------------------------------------------------------
   GÜVEN ŞERİDİ (E-Devlet / Ömür Boyu / PayTR) — mobilde tam genişlik.

   Tasarımda tek satır: üç güven öğesi solda, "Eğitimleri İncele" CTA'sı sağda,
   `justify-content:space-between`. 390px'te bu düzen bozuluyordu (ölçüldü ve
   ekran görüntüsüyle doğrulandı): öğeler sola sıkışıyor, sağ taraf boş
   kalıyor ve `white-space:nowrap` olan alt açıklamalar ("Tüm programlarda
   sertifika kaydı") kesiliyordu.

   Mobilde şerit dikey akışa alınır, açıklamalar sarmalayabilir, dikey
   ayırıcı çizgiler gizlenir ve CTA tam genişlik olur.
   --------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
	.fes-app .fes-ftr__strip {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 22px !important;
		padding: 28px 20px !important;
	}

	.fes-app .fes-ftr__trust {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 18px !important;
	}

	/* Dikey ayırıcı çizgiler tek kolonda anlamsız. */
	.fes-app .fes-ftr__trust > span[aria-hidden="true"] { display: none !important; }

	/* Alt açıklamalar kesilmesin. */
	.fes-app .fes-ftr__trust strong,
	.fes-app .fes-ftr__trust span { white-space: normal !important; }

	/* Şeridin CTA'sı tam genişlik. */
	.fes-app .fes-ftr__strip > a { width: 100%; justify-content: center; }
}