/* =============================================================================
 * Yurt Dışı Eğitim Danışmanlığı sayfası
 *
 * Bu sayfanın kendi tasarım dili YOK — ana sayfadaki bölümlerin (`visa-sec`,
 * `headerBanner`) sınıflarını olduğu gibi kullanır. Buradaki kurallar yalnızca
 * iki şeyi ayarlar: sayfaya özel afiş görseli ve aynı bölümün arka arkaya iki
 * kez kullanılmasından doğan boşluk fazlası.
 * ========================================================================== */

/* Afiş görseli. Seçici iki sınıfı birlikte alıyor (0,3,0) — components.css'teki
 * `.headerBanner .headerBanner-inner` (0,2,0) kuralını dosya sırasından
 * bağımsız olarak ezsin. */
.headerBanner.headerBanner--yurtdisi .headerBanner-inner {
    background-image: linear-gradient(
            180deg,
            rgba(3, 20, 45, 0.6) 0%,
            rgba(3, 20, 45, 0.5) 40%,
            rgba(3, 20, 45, 0.8) 100%
        ),
        url('/uploads/photos/londra-big-ben-westminster-koprusu.webp');
    background-position: center 42%;
}

/* Sayfa üç farklı blok kalıbı kullanıyor (visa → plan → sss). Her biri
 * kendi 100px'lik alt/üst boşluğunu taşıdığı için araları gereğinden açık
 * kalıyordu; geçişler kısaltılıyor.
 *
 * NOT: burada bir ara `.yurtdisi-sec--second` ve `.yurtdisi-step-num`
 * kuralları vardı; ikinci `visa-sec` bloğu kaldırılıp yerine `plan-sec`
 * geldiği için ikisi de ölü kaldı ve silindi.
 * Kural bolumun KENDI sinifina bagli. `main > .plan-sec` gibi genel bir
 * secici yazilamaz: React stylesheet'i <head>'e taasiyip sayfalar arasi
 * gecislerde de yuklu tutabiliyor, o zaman ANA SAYFANIN plan bolumunun
 * boslugunu da degistirirdi. */
.plan-sec.yurtdisi-plan {
    padding-top: 40px;
}

/* --- Yol haritası kartlarının mobil kırpma noktası -------------------------
 *
 * `style.css` içinde `.plan-sec .plan-grid .plan-card:nth-child(1|3)` için
 * mobil kırpma kuralları var; onlar ANA SAYFA fotoğraflarına göre elle
 * ayarlanmış (birinde öğrencinin yüzü üst bantta, diğerinde öğretmen ayakta).
 * Seçici sayfa ayrımı yapmadığı için aynı kurallar bu sayfaya da uygulanıyor
 * ve buradaki fotoğraflar farklı olduğu için özneyi çerçeve dışına itiyordu
 * (01'de yüzler alt kenarın altında kalıyordu).
 *
 * Buradaki fotoğraflar dikey (1120x1400) ve kişiler görüntünün %34-44
 * yüksekliğinde; %38 hepsini kadrajda tutuyor. Özgüllük bilerek üsttekiyle
 * aynı (`:nth-child(n)`), dosya sonra yüklendiği için kazanır. */
@media (max-width: 768px) {
    .plan-sec .plan-grid .plan-card:nth-child(n) .plan-card-media img {
        object-position: center 38%;
    }
}