/*
 * SEO AÇILIŞ SAYFALARI (27 Eyl 2026). İlk kullanan: /yurtdisi-egitim-danismanligi
 * Tamamı .sa kapsamında, önek sa-. style.css'e dokunulmaz.
 *
 * Tasarım kuralları (sahip, kalıcı; tasarim-ilkeleri + belge-tasarim-dengesi):
 *   · ikon, emoji, degrade ve altın yok; hap rozet yok
 *   · hiyerarşi kutuyla değil boşluk, 1px çizgi ve yazı boyutuyla kurulur
 *   · Playfair yalnız h1 ve h2'de; sayılar Inter + tabular-nums
 *   · bölüm dolgusu 52px (mobil 38), köşe 8-10px, gölge yok
 *   · dikey ritim tek yerden: etiket kendi metnine 6-10px, bloklar arası 22px+
 */

.sa {
    --sa-lacivert: #0A1F3C;
    --sa-gece: #00284a;
    --sa-mavi: #005A9E;
    --sa-mavi-koyu: #004a84;
    --sa-vurgu: #0078D7;
    --sa-acik: #9fd2ff;
    --sa-metin: #4B5768;
    --sa-soluk: #5f7186;
    --sa-cizgi: #E5E9F0;
    --sa-zemin: #F6F8FB;
    --sa-yay: cubic-bezier(.34, 1.28, .48, 1);
    --sa-serif: 'Playfair Display', Georgia, serif;
    --sa-sans: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --sa-sayi: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    background: #fff;
    color: var(--sa-metin);
    font-family: var(--sa-sans);
    font-size: 16px;
    line-height: 1.7;
}

/* Kenar sıfırlaması DÜŞÜK özgüllükle yapılır: :where(.sa) p = (0,0,1), Bootstrap'in p
   kuralıyla aynı ağırlıkta ve ondan sonra yüklendiği için kazanır, ama her sınıf kuralına
   yenilir. ".sa p { margin:0 }" (0,1,1) yazılsaydı ".sa-tus-notu { margin-top:12px }"
   gibi sınıf kurallarını sessizce ezerdi (tasarim-ilkeleri, 4 Eyl 2026 dikey ritim dersi). */
:where(.sa) h1,
:where(.sa) h2,
:where(.sa) h3,
:where(.sa) p { margin: 0; }
.sa h1,
.sa h2 {
    font-family: var(--sa-serif);
    font-weight: 700;
    color: var(--sa-lacivert);
}
.sa h3 {
    font-family: var(--sa-sans);
    color: var(--sa-lacivert);
}
.sa a { text-underline-offset: 3px; }
.sa ::selection { background: #d6ebff; }

.sa-num {
    font-family: var(--sa-sayi);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.02em;
    font-weight: 700;
}

/* ── Tuşlar ─────────────────────────────────────────────────────────────── */
.sa-tus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 22px;
    border-radius: 8px;
    border: 1px solid transparent;
    background: var(--sa-mavi);
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    line-height: 1.2;
    text-decoration: none;
    transition: background-color .2s ease, border-color .2s ease, transform .3s var(--sa-yay);
}
.sa-tus:hover { background: var(--sa-mavi-koyu); color: #fff; }
.sa-tus:active { transform: scale(.97); }
.sa-tus:focus-visible,
.sa-bag:focus-visible,
.sa a:focus-visible {
    outline: 2px solid var(--sa-vurgu);
    outline-offset: 3px;
}
.sa-bag {
    color: var(--sa-mavi);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid rgba(0, 90, 158, .35);
    padding-bottom: 1px;
    transition: color .2s ease, border-color .2s ease;
}
.sa-bag:hover { color: var(--sa-vurgu); border-color: currentColor; }
.sa-ok { display: inline-block; transition: transform .3s var(--sa-yay); }
.sa-bag:hover .sa-ok,
.sa-git:hover .sa-ok { transform: translateX(3px); }

/* ── Giriş ──────────────────────────────────────────────────────────────── */
.sa-hero { padding: 36px 0 0; }
.sa-kirinti {
    display: flex;
    flex-wrap: wrap;
    gap: 0 8px;
    font-size: 13px;
    color: var(--sa-soluk);
    margin-bottom: 30px;
}
.sa-kirinti a { color: var(--sa-soluk); text-decoration: none; }
.sa-kirinti a:hover { color: var(--sa-mavi); text-decoration: underline; }
.sa-hero-izgara {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    gap: 28px 56px;
    align-items: end;
}
.sa-ust {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    font-weight: 600;
    color: var(--sa-mavi);
    letter-spacing: .02em;
    margin-bottom: 16px;
}
.sa-ust::before {
    content: "";
    width: 28px;
    height: 1px;
    background: currentColor;
}
.sa h1 {
    font-size: clamp(2.3rem, 4.8vw, 3.7rem);
    line-height: 1.06;
    letter-spacing: -.012em;
}
.sa-giris { font-size: 17px; line-height: 1.7; max-width: 540px; }
.sa-tuslar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 24px;
    margin-top: 24px;
}
.sa-tus-notu { margin-top: 12px; font-size: 13.5px; color: var(--sa-soluk); }
.sa-hero-gorsel { display: block; margin-top: 40px; }
.sa-hero-gorsel img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1600 / 556;
    object-fit: cover;
    border-radius: 10px;
    background: var(--sa-zemin);
}

/* ── Bölüm iskeleti ─────────────────────────────────────────────────────── */
.sa-bolum { padding: 52px 0; }
.sa-hero + .sa-bolum { margin-top: 52px; }
.sa-zeminli { background: var(--sa-zemin); }
.sa-bas { max-width: 740px; margin-bottom: 28px; }
.sa h2 { font-size: clamp(1.6rem, 2.7vw, 2.15rem); line-height: 1.2; }
.sa-bas p { margin-top: 10px; }
.sa-alt-baslik {
    font-size: 19px;
    font-weight: 700;
    margin: 44px 0 16px;
}

/* ── Süreç: tek çerçeveli ızgara ────────────────────────────────────────── */
.sa-adimlar {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid var(--sa-cizgi);
    border-left: 1px solid var(--sa-cizgi);
    background: #fff;
}
.sa-adim {
    border-right: 1px solid var(--sa-cizgi);
    border-bottom: 1px solid var(--sa-cizgi);
    padding: 22px 22px 24px;
}
.sa-adim-no { display: block; font-size: 14px; color: var(--sa-vurgu); }
.sa-adim h3 { font-size: 17px; font-weight: 600; line-height: 1.35; margin-top: 10px; }
.sa-adim p { font-size: 15px; line-height: 1.65; margin-top: 8px; }

/* ── Paketler ───────────────────────────────────────────────────────────── */
.sa-paketler {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border: 1px solid var(--sa-cizgi);
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}
.sa-paket { padding: 22px 22px 24px; }
.sa-paket + .sa-paket { border-left: 1px solid var(--sa-cizgi); }
.sa-paket-hedef { display: block; font-size: 13px; font-weight: 600; color: var(--sa-mavi); }
.sa-paket h3 { font-size: 18px; font-weight: 700; line-height: 1.3; margin-top: 6px; }
.sa-paket p { font-size: 15px; margin-top: 8px; }
.sa-paket ul { list-style: none; margin: 14px 0 0; padding: 0; }
.sa-paket li { position: relative; padding-left: 16px; font-size: 14.5px; line-height: 1.6; }
.sa-paket li + li { margin-top: 6px; }
.sa-paket li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .62em;
    width: 6px;
    height: 6px;
    background: var(--sa-vurgu);
}
.sa-paket-alt {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px 24px;
    margin-top: 16px;
    font-size: 14px;
    color: var(--sa-soluk);
}

/* ── Ülke tablosu ───────────────────────────────────────────────────────── */
.sa-tablo-kap {
    border: 1px solid var(--sa-cizgi);
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}
.sa-tablo { width: 100%; border-collapse: collapse; margin: 0; }
.sa-tablo thead th {
    text-align: left;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--sa-soluk);
    background: var(--sa-zemin);
    padding: 12px 16px;
    border-bottom: 1px solid var(--sa-cizgi);
    line-height: 1.35;
    vertical-align: bottom;
}
.sa-tablo thead th small { display: block; font-size: 11.5px; font-weight: 500; }
.sa-tablo tbody th,
.sa-tablo td {
    text-align: left;
    font-weight: inherit;
    padding: 14px 16px;
    border-bottom: 1px solid var(--sa-cizgi);
    vertical-align: middle;
}
.sa-tablo tbody tr:last-child th,
.sa-tablo tbody tr:last-child td { border-bottom: 0; }
.sa-tablo tbody tr { transition: background-color .2s ease; }
@media (hover: hover) {
    .sa-tablo tbody tr:hover { background: #f9fbfe; }
    .sa-tablo tbody tr:hover .sa-kucuk img { transform: scale(1.05); }
}
.sa-ulke { display: flex; align-items: center; gap: 14px; }
.sa-kucuk {
    flex: 0 0 auto;
    display: block;
    width: 84px;
    height: 56px;
    border-radius: 6px;
    overflow: hidden;
    background: var(--sa-zemin);
}
.sa-kucuk img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s var(--sa-yay);
}
.sa-ulke-ad {
    font-weight: 600;
    font-size: 16px;
    color: var(--sa-lacivert);
    text-decoration: none;
}
.sa-ulke-ad:hover { color: var(--sa-vurgu); text-decoration: underline; }
.sa-deger { font-size: 15.5px; color: var(--sa-lacivert); white-space: nowrap; }
.sa-sure { font-size: 15px; color: var(--sa-lacivert); }
.sa-not {
    display: block;
    max-width: 250px;
    margin-top: 3px;
    font-size: 12.5px;
    line-height: 1.45;
    color: var(--sa-soluk);
}
.sa-uni { color: var(--sa-mavi); text-decoration: none; }
.sa-uni .sa-num { font-size: 15.5px; }
.sa-uni:hover { color: var(--sa-vurgu); text-decoration: underline; }
.sa-git {
    color: var(--sa-mavi);
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    white-space: nowrap;
}
.sa-git:hover { color: var(--sa-vurgu); }
.sa-tablo .sa-td-git { text-align: right; }
.sa-bos { font-size: 13px; color: var(--sa-soluk); }
.sa-gizli {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ── Bölüm bağlantıları ─────────────────────────────────────────────────── */
.sa-bolumler {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 36px;
}
.sa-bolum-grup { padding: 14px 0 16px; border-top: 1px solid var(--sa-cizgi); }
.sa-bolum-grup h3 { font-size: 15px; font-weight: 700; line-height: 1.4; }
.sa-bolum-grup ul {
    list-style: none;
    margin: 6px 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 2px 16px;
}
.sa-bolum-grup a { color: var(--sa-mavi); font-size: 14.5px; text-decoration: none; }
.sa-bolum-grup a:hover { color: var(--sa-vurgu); text-decoration: underline; }

/* ── Sık sorulan sorular ────────────────────────────────────────────────── */
.sa-sss-izgara {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
    gap: 24px 56px;
    align-items: start;
}
.sa-sss-bas { position: sticky; top: 96px; }
.sa-sss-bas p { margin-top: 10px; font-size: 15px; }
.sa-sss { border-top: 1px solid var(--sa-cizgi); }
.sa-sss details { border-bottom: 1px solid var(--sa-cizgi); }
.sa-sss summary {
    position: relative;
    display: block;
    list-style: none;
    cursor: pointer;
    padding: 18px 44px 18px 0;
    font-weight: 600;
    font-size: 16.5px;
    line-height: 1.45;
    color: var(--sa-lacivert);
}
.sa-sss summary::-webkit-details-marker { display: none; }
.sa-sss summary::before,
.sa-sss summary::after {
    content: "";
    position: absolute;
    right: 8px;
    top: 50%;
    width: 14px;
    height: 2px;
    margin-top: -1px;
    background: var(--sa-mavi);
    transition: transform .35s var(--sa-yay);
}
.sa-sss summary::after { transform: rotate(90deg); }
.sa-sss details[open] summary::after { transform: rotate(0deg); }
.sa-sss summary:hover { color: var(--sa-mavi); }
.sa-sss summary:focus-visible { outline: 2px solid var(--sa-vurgu); outline-offset: 4px; border-radius: 4px; }
.sa-sss-yanit { padding: 0 44px 20px 0; font-size: 15.5px; }

/* ── Kapanış ────────────────────────────────────────────────────────────── */
.sa-kapanis { background: var(--sa-gece); color: #c9dcee; padding: 56px 0; }
.sa-kapanis h2 { color: #fff; }
.sa-kapanis-izgara {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
    gap: 32px 56px;
    align-items: center;
}
.sa-kapanis-metin { margin-top: 12px; max-width: 560px; }
.sa-kapanis .sa-tuslar { margin-top: 0; }
.sa-tus-beyaz { background: #fff; color: #00345f; }
.sa-tus-beyaz:hover { background: #e6f1fc; color: #00345f; }
.sa-tus-cizgi { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .55); }
.sa-tus-cizgi:hover { background: rgba(255, 255, 255, .08); color: #fff; border-color: #fff; }
.sa-kimiz {
    margin-top: 22px;
    padding-left: 14px;
    border-left: 2px solid var(--sa-acik);
    font-size: 14.5px;
    line-height: 1.65;
    color: #b9cfe4;
}
.sa-kimiz a { color: #fff; font-weight: 600; text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, .4); }
.sa-kimiz a:hover { border-color: #fff; }
.sa-iletisim { margin-top: 18px; font-size: 14px; color: #b9cfe4; }
.sa-iletisim a { color: #fff; text-decoration: none; }
.sa-iletisim a:hover { text-decoration: underline; }
.sa-iletisim .sa-ayrac { margin: 0 8px; color: rgba(255, 255, 255, .35); }

/* ── Kırılımlar ─────────────────────────────────────────────────────────── */
@media (max-width: 991.98px) {
    .sa-hero-izgara { grid-template-columns: minmax(0, 1fr); align-items: start; }
    .sa-adimlar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sa-paketler { grid-template-columns: minmax(0, 1fr); }
    .sa-paket + .sa-paket { border-left: 0; border-top: 1px solid var(--sa-cizgi); }
    .sa-bolumler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sa-sss-izgara { grid-template-columns: minmax(0, 1fr); }
    .sa-sss-bas { position: static; }
    .sa-kapanis-izgara { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 767.98px) {
    /* Tablo satırı karta döner: ülke başlığı üstte, dört değer 2x2 ızgarada. */
    .sa-tablo thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
    .sa-tablo,
    .sa-tablo tbody { display: block; width: 100%; }
    .sa-tablo tbody tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 12px 16px;
        padding: 16px;
        border-bottom: 1px solid var(--sa-cizgi);
    }
    .sa-tablo tbody tr:last-child { border-bottom: 0; }
    .sa-tablo tbody th,
    .sa-tablo td { display: block; padding: 0; border: 0; }
    .sa-tablo .sa-td-ulke,
    .sa-tablo .sa-td-git { grid-column: 1 / -1; }
    .sa-tablo .sa-td-git { text-align: left; }
    .sa-tablo td[data-etiket]::before {
        content: attr(data-etiket);
        display: block;
        margin-bottom: 2px;
        font-size: 12px;
        font-weight: 600;
        color: var(--sa-soluk);
    }
    .sa-kucuk { width: 72px; height: 48px; }
    .sa-not { max-width: none; }
    .sa-deger { white-space: normal; }
}

@media (max-width: 575.98px) {
    .sa-hero { padding-top: 24px; }
    .sa-kirinti { margin-bottom: 22px; }
    .sa-hero-gorsel { margin-top: 28px; }
    .sa-hero-gorsel img { aspect-ratio: 16 / 10; border-radius: 8px; }
    .sa-hero + .sa-bolum { margin-top: 38px; }
    .sa-bolum { padding: 38px 0; }
    .sa-kapanis { padding: 40px 0; }
    .sa-tuslar .sa-tus { width: 100%; }
    .sa-adimlar { grid-template-columns: minmax(0, 1fr); }
    .sa-adim { padding: 18px 16px 20px; }
    .sa-paket { padding: 18px 16px 20px; }
    .sa-bolumler { grid-template-columns: minmax(0, 1fr); }
    .sa-sss summary { font-size: 16px; padding-right: 36px; }
    .sa-sss-yanit { padding-right: 0; }
    .sa-alt-baslik { margin-top: 36px; }
}

@media (prefers-reduced-motion: reduce) {
    .sa *,
    .sa *::before,
    .sa *::after { transition: none !important; }
}