/* =========================================================
   REKLAM — Haftanın Vitrini kartı (her sayfada yüklü)
   REKLAM_20261105 · VITRIN_20261106 · VITRIN2_20261106
   ---------------------------------------------------------
   Yükleme: includes/layout.php, layout_start() içindeki ortak
   page_css listesi. Başvuru sayfasının düzeni ayrı dosyada
   (reklam_sayfa.css), yalnız /reklam'da yüklenir.
   HTML: includes/reklam.php → reklam_vitrin_html(),
         reklam_slayt_html(). Kaydırıcı: assets/js/reklam_vitrin.js

   - .rk- öneki tipografi üreticisinde atlanır (_punto_uret.php
     PUNTO_ATLA); mobil puntolar burada elle verildi.
   - Slayt: büyük sahne (ürün fotoğrafı ya da kitap kapağı, kendi
     bulanık hali zemin; hiçbir şey kırpılmaz) + sol üstte
     "Sponsorlu" (örtülü reklam yasağı: ilk bakışta görünmeli),
     altında ad (1 satır), alt satır (yazar/sponsor, 1 satır),
     metin (2 satır yeri HEP ayrılır), düğmeler. Her parçanın
     yüksekliği sabit: düğme her slaytta aynı yerde, kart kayarken
     zıplamaz, boşluk kalmaz.
   - Düğmeler hafif: gri zeminli küçük hap (sitenin Keşfet
     anahtarındaki gri), ikincisi yalnız yazı.
   - Slaytlar arası 24px: kayarken yapışmasın.
   - Basılan alan (dokunma hedefi) masaüstü 42px, mobil 44px; düğmeler
     görünüşte ince, alan görünmez ::before katmanıyla büyür. Kaydırma
     kabı taşanı kırpar: altına 5px iç boşluk, aynı kadar eksi dış boşluk.
   - .rk-vitrin--yan      masaüstü sağ sütun (.sidebar-box kabuğu)
   - .rk-vitrin--mobil    Keşfet, 1023px ve altı; 1024px ve üstünde
                          gizli (orada sağ sütun var, iki kez görünmesin)
   - .rk-vitrin--onizleme başvuru sayfasındaki önizleme
   GERİ ALMA: bu dosyayı ve layout_start'taki 'reklam.css'
   girdisini sil.
   ========================================================= */
.rk-vitrin { color: #111214; }
.rk-vitrin [hidden] { display: none !important; }

/* ---- Üst satır: başlık + "Reklam ver" ---- */
.rk-vitrin-ust {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin: 0 0 10px;
}
.rk-vitrin-baslik { margin: 0; }
.rk-vitrin-ver {
    position: relative;
    flex: none;
    color: #656d7a;
    font-size: 12.5px;
    font-weight: 500;
    text-decoration: none;
}
.rk-vitrin-ver:hover { color: #111214; text-decoration: underline; text-underline-offset: 2px; }
.rk-vitrin-ver::before { content: ""; position: absolute; inset: -17px -8px -10px; }   /* 15 + 27 = 42; alta 10: sahneye (11px) taşmasın */

/* ---- Kaydırma kabı ---- */
.rk-vitrin-pist {
    display: flex;
    gap: 24px;
    padding-bottom: 5px;
    margin-bottom: -5px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}
.rk-vitrin-pist::-webkit-scrollbar { display: none; }
.rk-vitrin-pist.is-tek { overflow: hidden; }
.rk-slayt {
    display: flex;
    flex: 0 0 100%;
    flex-direction: column;
    min-width: 0;
    scroll-snap-align: start;
    scroll-snap-stop: always;
}

/* ---- Sahne: büyük görsel, kırpılmaz ---- */
.rk-sahne {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    aspect-ratio: 3 / 2;
    overflow: hidden;
    border-radius: 12px;
    background: #eef0f3;
    color: #8a94a3;
    text-decoration: none;
    isolation: isolate;
}
.rk-sahne-zemin {
    position: absolute;
    inset: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .55;
    filter: blur(16px) saturate(1.3);
    transform: scale(1.3);
}
.rk-sahne-gorsel { display: block; width: 100%; height: 100%; object-fit: contain; }
.rk-sahne.is-kitap .rk-sahne-gorsel {
    width: auto;
    height: 86%;
    aspect-ratio: 2 / 3;
    object-fit: cover;
    border-radius: 3px;
    box-shadow: 0 12px 24px -8px rgba(0, 0, 0, .45), 0 0 0 1px rgba(0, 0, 0, .06);
}
.rk-sahne svg { width: 32px; height: 32px; }
.rk-sahne-etiket {
    position: absolute;
    top: 8px;
    left: 8px;
    padding: 3px 9px;
    border-radius: 9999px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .12);
    color: #111214;
    font-size: 11.5px;
    font-weight: 650;
    line-height: 1.35;
}

/* ---- Yazılar: her slaytta aynı yükseklik ---- */
.rk-slayt-ad {
    display: block;
    margin-top: 10px;
    overflow: hidden;
    color: inherit;
    font-size: 15.5px;
    font-weight: 750;
    line-height: 1.3;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-decoration: none;
}
.rk-slayt-ad:hover { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.rk-slayt-alt {
    display: block;
    margin: 1px 0 0;
    overflow: hidden;
    color: #656d7a;
    font-size: 13px;
    line-height: 1.35;
    white-space: nowrap;
    text-overflow: ellipsis;
}
/* "yazar · sponsor": ayırıcı yalnız görünen iki parça arasında */
.rk-slayt-alt > :not([hidden]) ~ :not([hidden])::before { content: "·"; margin: 0 5px; }
.rk-slayt-metin {
    display: -webkit-box;
    min-height: 2.8em;                 /* 2 satırın yeri hep ayrılır */
    margin: 7px 0 0;
    overflow: hidden;
    color: #3d4450;
    font-size: 13.5px;
    line-height: 1.4;
    overflow-wrap: anywhere;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* ---- Düğmeler: hafif ---- */
.rk-slayt-dugmeler { display: flex; align-items: center; gap: 16px; margin-top: 12px; }
.rk-cta {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 32px;
    padding: 0 14px;
    border-radius: 9999px;
    background: rgba(127, 134, 148, .13);
    color: #111214;
    font-size: 13px;
    font-weight: 650;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none;
    transition: background-color .15s;
}
.rk-cta:hover { background: rgba(127, 134, 148, .22); color: #111214; text-decoration: none; }
.rk-cta svg { width: 12px; height: 12px; flex: none; }
.rk-cta-yazi {
    position: relative;
    display: inline-flex;
    align-items: center;
    height: 32px;
    color: #656d7a;
    font-size: 13px;
    font-weight: 650;
    white-space: nowrap;
    text-decoration: none;
}
/* Basılan alan 42px: üste 7, alta 3 (alttaki noktalara taşmasın) */
.rk-cta::before,
.rk-cta-yazi::before { content: ""; position: absolute; inset: -7px 0 -3px; }
.rk-cta-yazi::before { left: -6px; right: -6px; }
.rk-cta-yazi:hover { color: #111214; text-decoration: underline; text-underline-offset: 2px; }
.rk-cta:focus-visible,
.rk-cta-yazi:focus-visible,
.rk-slayt-ad:focus-visible,
.rk-vitrin-ver:focus-visible { outline: 2px solid #1d9bf0; outline-offset: 2px; border-radius: 6px; }
.rk-cta:focus-visible { border-radius: 9999px; }

/* ---- Boş vitrin: "burada senin reklamın olabilir" ----
   Sahnede 36×24 piksellik iki desen (paletli PNG, ~400 bayt) büyütülüp
   keskin basılır; ikincisi yavaşça belirip kaybolur, desen "yaşar". */
.rk-bos { display: flex; flex-direction: column; color: inherit; text-decoration: none; }
.rk-bos:hover { color: inherit; text-decoration: none; }
.rk-bos .rk-slayt-ad { white-space: normal; }
.rk-bos:hover .rk-slayt-ad { text-decoration: underline; text-underline-offset: 2px; }
.rk-bos:hover .rk-cta { background: rgba(127, 134, 148, .22); }
.rk-bos:focus-visible { outline: 2px solid #1d9bf0; outline-offset: 4px; border-radius: 12px; }
.rk-sahne--bos { background: #121316; }
.rk-piksel {
    position: absolute;
    inset: 0;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYBAMAAABglkJ9AAAAElBMVEUAAADo6u66vsWIjZZcYWo6PkZC52fjAAAAAXRSTlMAQObYZgAAAAlwSFlzAAAOxAAADsQBlSsOGwAAARJJREFUGNMlUEFyxCAME7a5s5AHOEn3ziY8wE22d2ba/7+lhmUGBrAsWUIHcHY/7YShU/S3AQ1BFHaLYKx5MtV5r0Tz2RX7sYwbUMkp/EO5BgTHjI7ohR19dLNzrpMZ3LDlQrWF9BUOHHTDJMrurOsrLbIk3C5UC4O+s9YU7I1aI8Yn0bFDg7FyUkKf6oXWFY2RzYZEh+r5KKwFLHHO7IMkHBvnwsdEOBNOUucMWaDoMkxqOCk/7tWuHSl9xkV66RV2gaXfmYXbEN9YUE8Sh/yZuw1vYl5GS3NFEuFWFXnXtHgaOgo6E+RkriuTWhFbDz5KRcGTPllvjqWtAc8fR3h6FMm8NGwNI6PT4o1+T9JrNv0D6CkiFG9VBbkAAAAASUVORK5CYII=") center / cover no-repeat;
    image-rendering: pixelated;
}
.rk-piksel--2 {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYBAMAAABglkJ9AAAAElBMVEUAAADo6u66vsWIjZZcYWo6PkZC52fjAAAAAXRSTlMAQObYZgAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAR9JREFUGNMdUUt2gzAMHEv23iQ5gPh0L0y7VwLdp21y/6t0zOOBJVnSfAAUuewQZAB6AA0lGErBdtbw9eyHCb7ZYMokJD/5Nd2gURmpIbiozyHfAw/264+BXZ9cufuRc8x3wGe+fLA1DJhcgZedhWye4gLlaE0wgvm1IWmMNnsqYqUzzYr7yuULRqj2wUiXQSYxqQukRnSKjeswYWjXfPhb8IFMhEezIVmcMXCE5ahah1g0qXYVvJLb5LeltctGHpST5So+r5Wc/BaP6AojUbUvRNipbaUfRcbm67SmKY+0pcvRhNcrZZlR6lJ7RYJulFniOvkbR+eA8D/Nkhy/hfDS3es+8m/4thMBVgwF8oWTjeItzvwcZZNBXlEe8Kf8A9j+Jk6t4mPUAAAAAElFTkSuQmCC");
    opacity: 0;
    animation: rk-piksel 7s ease-in-out infinite;
}
@keyframes rk-piksel { 0%, 100% { opacity: 0; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .rk-piksel--2 { animation: none; } }
.rk-sahne--bos .rk-sahne-etiket { background: rgba(255, 255, 255, .14); box-shadow: none; color: #eceef1; backdrop-filter: blur(4px); }

/* ---- Noktalar: görünen 6px, basılan alan 34×42 (masaüstü), 44×44 (mobil).
   Masaüstünde genişlik 34: aralık açılmasın. ---- */
.rk-vitrin-noktalar { display: flex; justify-content: center; margin: 3px 0 -13px; }
.rk-vitrin-nokta {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 42px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}
.rk-vitrin-nokta span {
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: #c4cad3;
    transition: width .2s, background-color .2s;
}
.rk-vitrin-nokta[aria-current="true"] span { width: 18px; background: #111214; }
.rk-vitrin-nokta:focus-visible { outline: 2px solid #1d9bf0; outline-offset: -4px; border-radius: 9999px; }

/* ---- Koyu tema ---- */
html.dark .rk-vitrin { color: #f1f3f7; }
html.dark .rk-vitrin-ver,
html.dark .rk-slayt-alt,
html.dark .rk-cta-yazi { color: #9aa3ae; }
html.dark .rk-vitrin-ver:hover,
html.dark .rk-cta-yazi:hover { color: #f1f3f7; }
html.dark .rk-slayt-metin { color: #c3c9d1; }
html.dark .rk-sahne { background: rgba(255, 255, 255, .11); color: #9aa3ae; }
html.dark .rk-sahne-zemin { opacity: .45; }
html.dark .rk-cta { background: rgba(255, 255, 255, .1); color: #f1f3f7; }
html.dark .rk-cta:hover { background: rgba(255, 255, 255, .16); color: #f1f3f7; }
html.dark .rk-vitrin-nokta span { background: rgba(255, 255, 255, .28); }
html.dark .rk-vitrin-nokta[aria-current="true"] span { background: #eff3f4; }

/* ---- Önizleme (başvuru sayfası): masaüstünde sağ sütun kartının ölçüsü ---- */
.rk-vitrin--onizleme {
    box-sizing: border-box;
    width: 288px;
    max-width: 100%;
    padding: 11px 12px 12px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
}
.rk-vitrin--onizleme .rk-vitrin-baslik { font-size: 19px; font-weight: 800; line-height: 1.25; }
html.dark .rk-vitrin--onizleme { background: #0b0b0b; box-shadow: none; }

/* ---- Mobil: Keşfet ---- */
.rk-vitrin--mobil { display: none; }
@media (max-width: 1023px) {
    html:root body main .rk-vitrin--mobil {
        display: block;
        margin-top: 6px !important;   /* deneme_panel: .page-tabs + * { margin-top: 0 !important } */
    }
    .rk-vitrin--mobil {
        box-sizing: border-box;
        padding: 14px 14px 6px;
        border-radius: 18px;
        background: #fff;
    }
    .rk-vitrin--mobil .rk-vitrin-baslik { font-size: 18px; font-weight: 850; line-height: 1.25; }
    html.dark .rk-vitrin--mobil { background: #0b0b0b; }
    .rk-vitrin--mobil .rk-vitrin-pist.is-tek { padding-bottom: 10px; margin-bottom: 0; }
    .rk-vitrin--mobil .rk-sahne { aspect-ratio: 16 / 9; }      /* telefonda kart çok uzamasın */
}
@media (max-width: 767px) {
    .rk-vitrin--onizleme { width: 100%; padding: 14px; }
    .rk-vitrin--onizleme .rk-vitrin-baslik { font-size: 18px; font-weight: 850; }
    .rk-vitrin--onizleme .rk-sahne { aspect-ratio: 16 / 9; }
    .rk-vitrin--mobil .rk-slayt-ad,
    .rk-vitrin--onizleme .rk-slayt-ad { font-size: 17px; }
    .rk-vitrin--mobil .rk-slayt-alt,
    .rk-vitrin--onizleme .rk-slayt-alt { font-size: 14px; }
    .rk-vitrin--mobil .rk-slayt-metin,
    .rk-vitrin--onizleme .rk-slayt-metin { font-size: 15px; }
    .rk-vitrin--mobil .rk-cta,
    .rk-vitrin--onizleme .rk-cta { height: 38px; padding: 0 16px; font-size: 14px; }
    .rk-vitrin--mobil .rk-cta-yazi,
    .rk-vitrin--onizleme .rk-cta-yazi { height: 38px; font-size: 14px; }
    .rk-vitrin--mobil .rk-cta::before,
    .rk-vitrin--mobil .rk-cta-yazi::before { top: -6px; bottom: 0; }      /* 38 + 6 = 44 */
    .rk-vitrin--mobil .rk-sahne-etiket,
    .rk-vitrin--onizleme .rk-sahne-etiket { font-size: 12px; }
    .rk-vitrin--mobil .rk-vitrin-ver { font-size: 13.5px; }
    .rk-vitrin--mobil .rk-vitrin-ver::before { top: -18px; }              /* 16 + 28 = 44 */
    .rk-vitrin--mobil .rk-vitrin-nokta { width: 44px; height: 44px; }
    .rk-vitrin--mobil .rk-vitrin-noktalar { margin: 0 0 -4px; }
}
/* END_VITRIN_20261106 */