/*
 * HRCompass ortak sayfa düzeni (04.11.2026).
 * Üst menü, reklam bandı ve menüdeki ana liste sayfaları (İK Çözümleri, Etkinlikler, Blog, Soru-Cevap,
 * Anket, Araçlar, İK Sözlüğü, ayrıntı sayfaları) aynı kapsayıcıyı ve aynı ölçüleri kullanır.
 * Tailwind derlemesine bağlı değil; base.html'den ?v= sürüm parametresiyle yüklenir.
 *
 * Ölçüler
 *   Kapsayıcı (.sd-kap):  en çok 1520px (içerik 1456px) · yan boşluk 16px (telefon) / 24px (≥640) / 32px (≥1024)
 *                         (base.html gövdesi zoom: 0.9 ile çizildiği için ekranda ~1370px / 1310px görünür)
 *   Başlık bloğu (.sd-baslik): köşe 2.5rem (telefonda 2rem), iç boşluk 28/40px, sponsorluysa ≥1024'te en az 272px;
 *                             iki yanda 192px sponsor kolonu
 *   Üç kolon (.sd-uc):     ≥1024: 260px | esnek  ·  ≥1280: 260px | esnek | 300px  · aralık 24px
 *   İki kolon (.sd-iki):   ≥1024: 260px | esnek · aralık 24px
 *   Kart (.sd-kart):       köşe 1.5rem, iç boşluk 24px, ince kenar + hafif gölge
 */

.sd-kap {
    width: 100%;
    max-width: 1520px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
}
@media (min-width: 640px) { .sd-kap { padding-left: 24px; padding-right: 24px; } }
@media (min-width: 1024px) { .sd-kap { padding-left: 32px; padding-right: 32px; } }
/* İç içe kapsayıcı yan boşluğu iki kez saymasın */
.sd-kap .sd-kap { padding-left: 0; padding-right: 0; max-width: none; }

/* Reklam bandı: kapsayıcı genişliğinde, üstte ve altta aynı boşluk */
.sd-bant { margin-top: 16px; }
.sd-bant:empty { display: none; }
.sd-bant .reklam-bandi { margin: 0; }

/* ---------- Sayfa başlık bloğu ---------- */
.sd-baslik {
    --sd-vurgu: #ea580c;
    --sd-vurgu-koyu: #c2410c;
    position: relative;
    overflow: hidden;
    margin: 24px 0 32px;
    padding: 28px 16px;
    border-radius: 2rem;
    background: rgba(248, 250, 252, .6);
    border: 1px solid #f1f5f9;
    box-shadow: 0 20px 25px -5px rgba(15, 23, 42, .08), 0 8px 10px -6px rgba(15, 23, 42, .06);
}
.sd-baslik[data-renk="yesil"] { --sd-vurgu: #059669; --sd-vurgu-koyu: #047857; }
.sd-baslik[data-renk="turuncu"] { --sd-vurgu: #ea580c; --sd-vurgu-koyu: #c2410c; }
.sd-baslik[data-renk="mavi"] { --sd-vurgu: #2563eb; --sd-vurgu-koyu: #1d4ed8; }
.sd-baslik[data-renk="lacivert"] { --sd-vurgu: #1c4680; --sd-vurgu-koyu: #0f2b52; }
html.dark .sd-baslik { background: rgba(15, 23, 42, .5); border-color: #1e293b; box-shadow: none; }
@media (min-width: 768px) { .sd-baslik { padding: 40px 32px; border-radius: 2.5rem; } }

.sd-baslik__izgara { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: center; }
@media (min-width: 1024px) {
    .sd-baslik { display: flex; align-items: center; }
    /* Sponsorlu başlık blokları aynı yükseklikte başlar (sponsor kutusu + üst/alt boşluk) */
    .sd-baslik:has(.sd-baslik__izgara--sponsorlu) { min-height: 272px; }
    .sd-baslik__izgara { width: 100%; }
    .sd-baslik__izgara--sponsorlu { grid-template-columns: 192px minmax(0, 1fr) 192px; }
}
.sd-baslik__sponsor { display: none; width: 192px; }
@media (min-width: 1024px) { .sd-baslik__sponsor { display: block; } }
.sd-baslik__orta { min-width: 0; text-align: center; }
.sd-baslik__orta > :last-child, .sd-baslik__orta > :last-child > :last-child { margin-bottom: 0; }
.sd-baslik__ust { margin-bottom: 12px; font-size: 12px; font-weight: 700; color: #64748b; }
.sd-baslik__ust a:hover { color: var(--sd-vurgu-koyu); }
.sd-baslik h1, .sd-baslik__h1 {
    margin: 0 0 8px;
    font-size: 1.875rem;
    line-height: 1.15;
    font-weight: 900;
    letter-spacing: -.025em;
    color: #0f172a;
}
@media (min-width: 768px) { .sd-baslik h1, .sd-baslik__h1 { font-size: 3rem; line-height: 1.1; } }
html.dark .sd-baslik h1, html.dark .sd-baslik__h1 { color: #fff; }
.sd-baslik__vurgu { color: var(--sd-vurgu); }
.sd-baslik__aciklama {
    max-width: 42rem;
    margin: 0 auto 20px;
    font-size: 1rem;
    line-height: 1.6;
    font-weight: 500;
    color: #64748b;
}
html.dark .sd-baslik__aciklama { color: #94a3b8; }

/* Arama kutusu: tüm başlık bloklarında aynı yükseklik (56px) ve genişlik (en çok 42rem) */
.sd-ara {
    position: relative;
    display: flex;
    align-items: center;
    max-width: 42rem;
    height: 56px;
    margin: 0 auto;
    padding: 6px;
    border-radius: 9999px;
    background: #fff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 10px 15px -3px rgba(15, 23, 42, .08);
    box-sizing: border-box;
}
.sd-ara:focus-within { box-shadow: 0 0 0 4px color-mix(in srgb, var(--sd-vurgu) 18%, transparent); border-color: var(--sd-vurgu); }
html.dark .sd-ara { background: #1e293b; border-color: #334155; }
.sd-ara > i { flex: none; padding-left: 16px; color: #94a3b8; }
.sd-ara input {
    flex: 1; min-width: 0; height: 100%;
    padding: 0 12px; border: 0; outline: none; background: transparent;
    font-size: 1rem; font-weight: 600; color: #1e293b; text-overflow: ellipsis;
}
.sd-ara input::placeholder { color: #94a3b8; }
html.dark .sd-ara input { color: #fff; }
.sd-ara button {
    flex: none; height: 100%;
    padding: 0 28px; border: 0; border-radius: 9999px; cursor: pointer;
    background: var(--sd-vurgu); color: #fff;
    font-size: 14px; font-weight: 900; letter-spacing: .02em;
    transition: background-color .15s;
}
.sd-ara button:hover { background: var(--sd-vurgu-koyu); }
@media (max-width: 479px) { .sd-ara button { padding: 0 18px; } .sd-ara > i { padding-left: 12px; } }

/* Hızlı süzgeçler / düğmeler satırı */
.sd-baslik__ek { margin-top: 16px; }
.sd-cipler { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.sd-cip {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 16px; border-radius: 9999px;
    font-size: 12px; font-weight: 900; line-height: 1.25;
    background: #fff; border: 1px solid #e2e8f0; color: #475569;
    white-space: nowrap; transition: border-color .15s, color .15s, background-color .15s;
}
.sd-cip:hover { border-color: var(--sd-vurgu); color: var(--sd-vurgu-koyu); }
.sd-cip.secili, .sd-cip[aria-pressed="true"] { background: var(--sd-vurgu); border-color: var(--sd-vurgu); color: #fff; }
.sd-cip--koyu { background: #0f172a; border-color: #0f172a; color: #fff; }
.sd-cip--koyu:hover { background: #000; color: #fff; }
html.dark .sd-cip { background: #1e293b; border-color: #334155; color: #cbd5e1; }
html.dark .sd-cip.secili { background: var(--sd-vurgu); border-color: var(--sd-vurgu); color: #fff; }
/* Telefonda kısayollar tek satırda yatay kayar (sayfa yatay kaymaz) */
@media (max-width: 639px) {
    .sd-cipler--kayan { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; margin: 0 -16px; padding: 0 16px 4px; scrollbar-width: none; }
    .sd-cipler--kayan::-webkit-scrollbar { display: none; }
}

/* ---------- Kolonlar ---------- */
.sd-uc, .sd-iki { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
@media (min-width: 1024px) {
    .sd-iki { grid-template-columns: 260px minmax(0, 1fr); }
    .sd-uc { grid-template-columns: 260px minmax(0, 1fr); }
    .sd-uc > .sd-sol { grid-row: span 2; }
}
@media (min-width: 1280px) {
    .sd-uc { grid-template-columns: 260px minmax(0, 1fr) 300px; }
    .sd-uc > .sd-sol { grid-row: auto; }
}
.sd-sol, .sd-orta, .sd-sag { min-width: 0; }
.sd-sol > * + *, .sd-sag > * + * { margin-top: 24px; }

/* ---------- Kart ---------- */
.sd-kart {
    background: #fff;
    border: 1px solid #f1f5f9;
    border-radius: 1.5rem;
    padding: 24px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
}
html.dark .sd-kart { background: #0f172a; border-color: #1e293b; }

/* ---------- Yan liste (En Çok Ziyaret Edilenler / En Yeni) ---------- */
.sd-yan-liste { --sd-yl: #f97316; --sd-yl-zemin: #fff7ed; --sd-yl-kenar: #ffedd5; }
.sd-yan-liste[data-renk="yesil"] { --sd-yl: #059669; --sd-yl-zemin: #ecfdf5; --sd-yl-kenar: #d1fae5; }
.sd-yan-liste[data-renk="mavi"] { --sd-yl: #2563eb; --sd-yl-zemin: #eff6ff; --sd-yl-kenar: #dbeafe; }
.sd-yan-liste__baslik { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: 16px; line-height: 1.3; font-weight: 900; color: #0f172a; }
.sd-yan-liste__baslik i { color: var(--sd-yl); font-size: 14px; }
html.dark .sd-yan-liste__baslik { color: #fff; }
.sd-yan-liste ol { list-style: none; margin: 0 -8px; padding: 0; }
.sd-yan-liste__oge {
    display: flex; align-items: flex-start; gap: 12px;
    padding: 8px; border-radius: 12px;
    font-size: 13px; line-height: 20px; font-weight: 700; color: #475569;
    transition: background-color .15s, color .15s;
}
.sd-yan-liste__oge:hover { background: var(--sd-yl-zemin); color: var(--sd-yl); }
html.dark .sd-yan-liste__oge { color: #cbd5e1; }
html.dark .sd-yan-liste__oge:hover { background: rgba(255, 255, 255, .05); }
.sd-yan-liste__no {
    flex: none; width: 24px; height: 24px; margin-top: -2px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 8px; border: 1px solid var(--sd-yl-kenar);
    background: var(--sd-yl-zemin); color: var(--sd-yl);
    font-size: 12px; font-weight: 900;
}
.sd-yan-liste__oge:hover .sd-yan-liste__no { background: var(--sd-yl); color: #fff; }
.sd-yan-liste__ad { min-width: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sd-yan-liste__alt { display: block; font-size: 12px; line-height: 16px; font-weight: 600; color: #64748b; }

/* ---------- Etkinlik listesi: orta kolon en az 640px ise iki sütun ---------- */
.sd-etk-liste { container-type: inline-size; }
.sd-etk-izgara { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.sd-etk-izgara > h3 { grid-column: 1 / -1; }
@container (min-width: 640px) {
    .sd-etk-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    .sd-etk-izgara .sd-etk-kart { flex-wrap: wrap; align-content: flex-start; }
    .sd-etk-izgara .sd-etk-kart__gorsel { display: block; order: -1; width: 100%; aspect-ratio: 2 / 1; }
    .sd-etk-izgara .sd-etk-kart__govde { flex: 1 1 0; }
}

/* ---------- Sponsor kutusu (includes/sponsor_kutusu.html): görsel kutuyu kenardan kenara kaplar ----------
   Kenarı tek renk logoda kalan şerit logonun kenar rengiyle boyanır; yalnız şeffaf zeminli logoda küçük iç boşluk. */
.sponsor-kutusu .sponsor-kutusu__logo--seffaf { padding: 6%; }
.sponsor-kutusu__etiket { z-index: 2; line-height: 1.4; }

/* Üst menü logosu: %110 büyütme sol kenardan yapılır; logo içerik kapsayıcısının sol kenarıyla hizalı kalır */
.sd-logo { transform-origin: left center; }

/* Koyu tema ince ayarları */
html.dark .sd-ara input { background: transparent !important; border: 0 !important; box-shadow: none !important; }
html.dark .sd-yan-liste__no { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .12); }
html.dark .sd-cip--koyu { background: #f8fafc; border-color: #f8fafc; color: #0f172a; }

/* ---------- Rozetler (04.11.2026): koyu yeşil / koyu turuncu, beyaz yazı ≥4.5:1 ---------- */
.sd-rozet-dogru { background: #047857 !important; color: #fff !important; box-shadow: none; }
.sd-rozet-turuncu { background: #c2410c !important; color: #fff !important; }
.sd-yazi-turuncu { color: #c2410c !important; }
/* Eski şablonlardaki beyaz yazılı açık yeşil / turuncu rozet ve etiketler (DOĞRULANDI, kategori etiketi) tek yerden koyulaşır:
   #10b981 / #f97316 üstünde beyaz 2.5–2.8:1 → #047857 / #c2410c üstünde ≥4.5:1. Turuncu küçük büyük harf etiket yazısı da koyu turuncu. */
.bg-emerald-500.text-white, .text-white.bg-emerald-500 { background-color: #047857 !important; }
.bg-orange-500.text-white, .text-white.bg-orange-500 { background-color: #c2410c !important; }
.text-orange-500.uppercase, .uppercase .text-orange-500, .text-orange-600.uppercase { color: #c2410c !important; }
html.dark .text-orange-500.uppercase, html.dark .text-orange-600.uppercase { color: #fb923c !important; }

/* ---------- İK Çözümleri firma kartı (fl-): telefonda yatay kompakt kart (04.11.2026) ----------
   Masaüstü (≥768px) düzeni değişmez. Telefonda: solda 64px logo, sağda ad, alan, doğrulandı rozeti, en çok 2 etiket,
   altta tek satır "Profili incele"; açıklama, konum, puan ve "Demo var" çipleri profil sayfasında. Bir ekrana 4–5 firma. */
.fl-dogru-mobil { display: none; }
@media (max-width: 767px) {
    .fl-kart { display: grid !important; grid-template-columns: 64px minmax(0, 1fr); column-gap: 12px; align-items: start;
               padding: 12px !important; border-radius: 1.25rem !important; border-color: #e2e8f0 !important; }
    .fl-kart:hover { transform: none; }
    .fl-kart .fl-logo { grid-row: 1; grid-column: 1; width: 64px; height: 64px; margin: 0 !important; border-radius: 14px; border: 1px solid #f1f5f9; }
    .fl-kart .fl-logo > div { width: 100%; height: 100%; }
    .fl-kart .fl-paket { top: 4px !important; left: 4px !important; }
    .fl-kart .fl-paket > div { width: 24px !important; height: 24px !important; }
    .fl-kart .fl-dogru-masa, .fl-kart .fl-mobil-gizle { display: none !important; }
    .fl-kart .fl-karsilastir { top: 10px !important; right: 10px !important; width: 32px; height: 32px; }
    .fl-kart .fl-detay { grid-row: 1; grid-column: 2; text-align: left; min-width: 0; padding-right: 36px; }
    .fl-kart .fl-ad { font-size: 16px !important; line-height: 1.3 !important; margin: 0 0 2px !important; padding: 0 !important; }
    .fl-kart .fl-alan { margin: 0 0 6px !important; font-size: 12px !important; }
    .fl-kart .fl-etiketler { justify-content: flex-start !important; margin: 0 0 8px !important; flex-wrap: nowrap; overflow: hidden; }
    .fl-kart .fl-etiketler > span { white-space: nowrap; flex: none; padding: 2px 8px !important; }
    .fl-kart .fl-etiketler > span:nth-child(n+3) { overflow: hidden; text-overflow: ellipsis; flex: 0 1 auto; min-width: 0; }
    .fl-kart .fl-dogru-mobil { display: inline-flex; }
    .fl-kart .fl-eylem { margin-right: -36px; }
    .fl-kart .fl-eylem .kaydet-dugme { width: 36px; height: 36px; border-radius: 12px; }
    .fl-kart .fl-incele { min-height: 40px; padding: 8px 12px !important; border-radius: 12px !important; box-shadow: none !important; white-space: nowrap; }
    .fl-izgara { gap: 10px !important; }
}
html.dark .fl-kart .fl-logo { border-color: #1e293b; }

/* Kayan firma şeridi (ana sayfa, blog/haber altı): telefonda kartlar orantılı küçülür (3 kart görünür, logo 88px) */
@media (max-width: 639px) {
    .fk [data-iz] > li { width: 31% !important; }
    .fk .fk-logo { height: 88px !important; padding: 8px !important; }
    .fk .fk-kart b { font-size: 12px; }
    .fk .fk-kart > span + span { padding: 8px 6px !important; }
}
html.dark .fk .fk-logo { background: #1e293b !important; }

/* ---------- En küçük yazı 12px (04.11.2026) ----------
   Gövde zoom: 0.9 ile çizildiği için 12px ekranda ~11px görünür; bunun altı okunmuyor. Şablonlardaki eski
   text-[7px] … text-[11px] sınıfları tek yerden 12px'e çekilir (rozet, etiket, filtre başlığı, sayaç). */
.text-\[7px\], .text-\[8px\], .text-\[9px\], .text-\[10px\], .text-\[10\.5px\], .text-\[11px\] { font-size: 12px !important; }
/* Büyük harf + geniş aralıklı küçük etiketler 12px'te taşmasın diye harf aralığı biraz daraltılır */
.text-\[8px\].tracking-widest, .text-\[9px\].tracking-widest, .text-\[10px\].tracking-widest,
.text-\[8px\].tracking-\[0\.2em\], .text-\[9px\].tracking-\[0\.2em\], .text-\[10px\].tracking-\[0\.2em\],
.text-\[10px\].tracking-\[0\.3em\], .text-\[9px\].tracking-\[0\.3em\] { letter-spacing: .06em !important; }

/* Boş reklam bandı (kendi reklamımız sayfada zaten bir kez gösterildi): yer kaplamasın */
.sd-bant:not(:has(a, img)), .reklam-bandi:not(:has(a, img)) { display: none; }

/* ---------- Bant reklam telefonda (04.11.2026) ----------
   Geniş bant görseli (1200×150, 728×90, 970×…) telefonda okunmaz. Reklamın "Telefon görseli" (640×200) varsa <picture>
   ile o çıkar; yoksa o reklam telefonda gizlenir; banttaki tüm reklamlar gizliyse bant hiç yer kaplamaz.
   Kendi varsayılan bant görselimiz (reklam_yeri.html, görselli) de telefonda gizlenir. */
@media (max-width: 639px) {
    .reklam-masaustu-yalniz { display: none !important; }
    .reklam-bandi:not(:has(.ad-rotator-item:not(.reklam-masaustu-yalniz), .reklam-yeri:not(.reklam-yeri--gorsel))),
    .sd-bant:not(:has(.ad-rotator-item:not(.reklam-masaustu-yalniz), .reklam-yeri:not(.reklam-yeri--gorsel))) { display: none; }
    .reklam-yeri--bant-gorsel { display: none !important; }
}

/* ---------- Koyu tema ince ayarları (04.11.2026) ---------- */
/* Ana sayfa turuncu karşılama alanı: genel koyu tema kuralları (nav, input, .bg-white) burada uygulanmaz */
html.dark .as-hero nav { background-color: transparent !important; border-color: transparent !important; }
html.dark .as-hero form.bg-white { background-color: #fff !important; }
html.dark .as-hero form input { background-color: transparent !important; color: #0f172a !important; border-color: transparent !important; }
html.dark .as-hero form input::placeholder { color: #64748b !important; }
html.dark .as-hero .hero-sekme[aria-selected="true"] { background: #fff; color: #c2410c; }
/* Kategori ikon kutuları (eksik açık renkler) */
html.dark .bg-violet-50, html.dark .bg-violet-100 { background-color: #4c1d9533 !important; }
html.dark .bg-cyan-50, html.dark .bg-teal-50, html.dark .bg-lime-50, html.dark .bg-pink-50, html.dark .bg-fuchsia-50 { background-color: rgba(255, 255, 255, .06) !important; }
/* Logo kutuları: koyu kartta beyaz kare yerine koyu zemin, logo köşeleri yumuşak */
html.dark .fk .fk-logo img, html.dark .card-image-container img { border-radius: 10px; }
html.dark .card-image-container { background: #1e293b !important; }

/* ---------- Erişilebilirlik (04.11.2026) ---------- */
/* "İçeriğe geç": klavyeyle ilk Tab'da görünür, menüyü atlayıp ana içeriğe götürür */
.sd-icerige-gec { position: absolute; left: 12px; top: -100px; z-index: 10000; padding: 12px 18px; border-radius: 12px;
    background: #0f172a; color: #fff !important; font-weight: 800; font-size: 15px; text-decoration: none; box-shadow: 0 10px 30px rgba(0,0,0,.25); }
.sd-icerige-gec:focus { top: 12px; outline: 3px solid #f59e0b; outline-offset: 2px; }
main#icerik:focus { outline: none; }
/* Odak çizgisi: yalnız klavyeyle gezinirken, açık ve koyu zeminde görünen 3px çizgi */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 3px solid #c2410c !important; outline-offset: 2px !important; }
html.dark :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline-color: #fb923c !important; }
.alt-bilgi :where(a, button, input, summary):focus-visible, .as-hero :where(a, button, input):focus-visible { outline-color: #fff !important; }

/* Alt bilgi öncesi kayan sponsor şeridi: logosu olan sponsor yoksa hiç yer kaplamasın; içerik ile alt bilgi arası 48px */
.sd-sponsor-serit:not(:has(img)) { display: none; }
main#icerik > .sd-kap { padding-bottom: 48px; }

/* =====================================================================================================================
   TASARIM SİSTEMİ — ortak bileşenler (2. aşama, 04.11.2026)
   Renkler panelden gelir (base.html :root): --button-color = birincil eylem (düğmeler), --primary = marka (lacivert,
   bağlantı ve ikincil düğme). Bölüm renkleri (etkinlik yeşili, blog turuncusu, sözlük laciverti) yalnız başlık vurgusu
   ve etiketlerde kalır; hiçbir düğme bölüm rengi kullanmaz.
   Sınıflar
     Düğme:   .sd-btn (birincil, dolu) · .sd-btn--ikincil (çerçeveli) · .sd-btn--metin · .sd-btn--kucuk / --buyuk / --tam
              devre dışı: disabled ya da aria-disabled="true" · yükleniyor: aria-busy="true" ya da .sd-btn--yukleniyor
     Form:    .sd-alan > label + input/select/textarea + .sd-alan__yardim + .sd-alan__hata  (hata: .sd-alan--hata)
              onay kutusu satırı: .sd-onay > input[type=checkbox|radio] + metin
     Rozet:   .sd-rozet (nötr) · --basari · --uyari · --bilgi · --hata · --eylem   (en az 12px, ≥4.5:1)
     Boş:     .sd-bos (ikon + başlık + açıklama + eylem) — includes/bos_durum.html
     Başlık:  .sd-h1 sayfa başlığı 48px (≥768) / 32px · .sd-h2 ayrıntı başlığı 36 / 28px · .sd-h3 bölüm 24 / 20px
   ===================================================================================================================== */
:root {
    --sd-eylem: var(--button-color, #c2410c);
    --sd-eylem-koyu: color-mix(in srgb, var(--sd-eylem) 84%, #000);
    --sd-eylem-yazi: #fff;
    --sd-marka: var(--primary, #1c4680);
    --sd-yazi: #0f172a;
    --sd-yazi-2: #475569;
    --sd-yazi-3: #64748b;
    --sd-yuzey: #fff;
    --sd-yuzey-2: #f8fafc;
    --sd-kenar: #e2e8f0;
    --sd-kenar-guclu: #cbd5e1;
    --sd-hata: #b91c1c;
    --sd-baslik-font: 'Outfit', 'Plus Jakarta Sans', system-ui, sans-serif;
    --sd-govde-font: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
html.dark {
    --sd-marka-koyu-tema: color-mix(in srgb, var(--sd-marka) 45%, #fff);
    --sd-yazi: #f8fafc;
    --sd-yazi-2: #cbd5e1;
    --sd-yazi-3: #94a3b8;
    --sd-yuzey: #1e293b;
    --sd-yuzey-2: #0f172a;
    --sd-kenar: #334155;
    --sd-kenar-guclu: #475569;
    --sd-hata: #fca5a5;
}

/* ---------- Düğmeler ---------- */
.sd-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 44px; padding: 10px 20px; box-sizing: border-box;
    border: 1.5px solid var(--sd-eylem); border-radius: 12px;
    background: var(--sd-eylem); color: var(--sd-eylem-yazi) !important;
    font-family: inherit; font-size: 15px; font-weight: 700; line-height: 1.2; letter-spacing: 0; text-transform: none;
    text-align: center; text-decoration: none !important; white-space: nowrap; cursor: pointer;
    transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s;
    -webkit-tap-highlight-color: transparent;
}
.sd-btn:hover { background: var(--sd-eylem-koyu); border-color: var(--sd-eylem-koyu); color: var(--sd-eylem-yazi); }
.sd-btn:active { transform: translateY(1px); }
.sd-btn i, .sd-btn svg { flex: none; }
.sd-btn--ikincil {
    background: transparent; color: var(--sd-marka) !important; border-color: color-mix(in srgb, var(--sd-marka) 55%, transparent);
}
.sd-btn--ikincil:hover { background: color-mix(in srgb, var(--sd-marka) 8%, transparent); border-color: var(--sd-marka); color: var(--sd-marka); }
.sd-btn--metin {
    min-height: 36px; padding: 6px 4px; border-color: transparent; background: transparent; color: var(--sd-marka) !important;
}
.sd-btn--metin:hover { background: transparent; border-color: transparent; text-decoration: underline !important; text-underline-offset: 3px; }
.sd-btn--kucuk { min-height: 36px; padding: 6px 14px; border-radius: 10px; font-size: 13px; gap: 6px; }
.sd-btn--buyuk { min-height: 52px; padding: 12px 28px; border-radius: 14px; font-size: 16px; }
.sd-btn--tam { display: flex; width: 100%; }
.sd-btn--metin.sd-btn--kucuk { padding: 4px 2px; }
/* Koyu zemin üstünde (karşılama alanı, alt bilgi) beyaz çerçeveli ikincil */
.sd-btn--acik.sd-btn--ikincil { color: #fff !important; border-color: rgba(255, 255, 255, .7); }
.sd-btn--acik.sd-btn--ikincil:hover { background: rgba(255, 255, 255, .12); border-color: #fff; }
/* Renkli zemin üstünde (turuncu kutu): beyaz dolu düğme, yazı eylem renginde */
.sd-btn--beyaz { background: #fff; border-color: #fff; color: var(--sd-eylem-koyu) !important; }
.sd-btn--beyaz:hover { background: #fff7ed; border-color: #fff7ed; color: var(--sd-eylem-koyu); }
html.dark .sd-btn--beyaz { background: #fff !important; color: #9a3412 !important; }
/* Ana sayfa karşılama araması: telefonda 44px kare simge düğme */
@media (max-width: 639px) { .sd-btn--simge-tel { width: 44px; padding: 0; } }
/* Devre dışı */
.sd-btn:disabled, .sd-btn[aria-disabled="true"], .sd-btn.is-disabled {
    opacity: .5; cursor: not-allowed; pointer-events: none; transform: none;
}
/* Yükleniyor: metin yerinde kalır, solda dönen halka */
.sd-btn[aria-busy="true"], .sd-btn--yukleniyor { position: relative; cursor: progress; pointer-events: none; }
.sd-btn[aria-busy="true"]::before, .sd-btn--yukleniyor::before {
    content: ""; width: 16px; height: 16px; flex: none; box-sizing: border-box;
    border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%;
    animation: sd-don .7s linear infinite;
}
@keyframes sd-don { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .sd-btn[aria-busy="true"]::before, .sd-btn--yukleniyor::before { animation-duration: 2s; } }
/* Odak çizgisi (genel :focus-visible kuralıyla aynı; dolu düğmede zeminden ayrışsın diye 3px boşluk) */
.sd-btn:focus-visible { outline: 3px solid var(--sd-marka) !important; outline-offset: 3px !important; }
html.dark .sd-btn:focus-visible { outline-color: #fb923c !important; }
/* Koyu tema: ikincil/metin düğmeler açık yazı; dolu düğme beyaz yazıyla kalır (genel html.dark kurallarından etkilenmez) */
html.dark .sd-btn { color: var(--sd-eylem-yazi) !important; }
html.dark .sd-btn--ikincil { color: #e2e8f0 !important; border-color: #64748b !important; background: transparent !important; }
html.dark .sd-btn--ikincil:hover { background: rgba(255, 255, 255, .06) !important; border-color: #cbd5e1 !important; }
html.dark .sd-btn--metin { color: #93c5fd !important; border-color: transparent !important; background: transparent !important; }
/* Düğme grubu: aralıklı, telefonda alt alta kırılır */
.sd-btn-grup { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }

/* Sayfa başlık bloğundaki "Ara" düğmesi bölüm rengini değil birincil eylem rengini kullanır */
.sd-ara button { background: var(--sd-eylem); }
.sd-ara button:hover { background: var(--sd-eylem-koyu); }

/* ---------- Form alanı ---------- */
.sd-alan { display: flex; flex-direction: column; gap: 6px; margin: 0 0 16px; min-width: 0; }
.sd-alan > label, .sd-alan__etiket {
    margin: 0; font-size: 14px; line-height: 1.4; font-weight: 700; color: #334155;
    text-transform: none; letter-spacing: 0;
}
.sd-alan .sd-zorunlu, .sd-alan__zorunlu { color: var(--sd-hata); margin-left: 2px; }
.sd-alan input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=file]):not([type=range]):not([type=color]),
.sd-alan select, .sd-alan textarea {
    display: block; width: 100%; min-height: 44px; box-sizing: border-box; margin: 0;
    padding: 10px 14px; border: 1px solid var(--sd-kenar-guclu); border-radius: 12px;
    background-color: var(--sd-yuzey); color: var(--sd-yazi);
    font-family: inherit; font-size: 15px; font-weight: 500; line-height: 1.4;
    box-shadow: none; outline: none; transition: border-color .15s, box-shadow .15s;
}
.sd-alan textarea { min-height: 120px; resize: vertical; }
.sd-alan select {
    appearance: none; -webkit-appearance: none; padding-right: 40px; cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2364748b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 14px center; background-size: 12px 8px;
}
.sd-alan select[multiple] { background-image: none; padding-right: 14px; min-height: 120px; }
.sd-alan input::placeholder, .sd-alan textarea::placeholder { color: #94a3b8; opacity: 1; }
.sd-alan input:not([type=checkbox]):not([type=radio]):focus, .sd-alan select:focus, .sd-alan textarea:focus {
    border-color: var(--sd-marka); box-shadow: 0 0 0 3px color-mix(in srgb, var(--sd-marka) 20%, transparent);
}
.sd-alan input[type=file] { font-size: 14px; color: var(--sd-yazi-2); }
.sd-alan input:disabled, .sd-alan select:disabled, .sd-alan textarea:disabled { opacity: .6; cursor: not-allowed; }
.sd-alan__yardim { margin: 0; font-size: 13px; line-height: 1.45; font-weight: 500; color: var(--sd-yazi-3); }
.sd-alan__hata, .sd-alan .errorlist { margin: 0; padding: 0; list-style: none; font-size: 13px; line-height: 1.45; font-weight: 600; color: var(--sd-hata); }
.sd-alan--hata input:not([type=checkbox]):not([type=radio]), .sd-alan--hata select, .sd-alan--hata textarea,
.sd-alan:has(.sd-alan__hata) input:not([type=checkbox]):not([type=radio]), .sd-alan:has(.sd-alan__hata) select, .sd-alan:has(.sd-alan__hata) textarea,
.sd-alan [aria-invalid="true"] { border-color: #dc2626 !important; }
/* İki sütun ızgara (telefonda tek sütun) */
.sd-alanlar { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 16px; }
@media (min-width: 640px) { .sd-alanlar--iki { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sd-alanlar .sd-alan--genis { grid-column: 1 / -1; } }
/* Onay kutusu / seçenek satırı */
.sd-onay { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 12px; font-size: 14px; line-height: 1.5; font-weight: 500; color: var(--sd-yazi-2); cursor: pointer; }
.sd-onay input[type=checkbox], .sd-onay input[type=radio], .sd-alan input[type=checkbox], .sd-alan input[type=radio] {
    flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--sd-eylem); cursor: pointer;
}
.sd-onay a { color: var(--sd-marka); text-decoration: underline; text-underline-offset: 2px; }
/* Koyu tema: genel html.dark input kuralları (#0f172a zemin) ile uyumlu; etiket açık gri */
html.dark .sd-alan > label, html.dark .sd-alan__etiket { color: #e2e8f0 !important; }
html.dark .sd-alan select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; }
html.dark .sd-onay { color: #cbd5e1 !important; }
html.dark .sd-onay a { color: #93c5fd; }

/* ---------- Rozet / etiket ---------- */
.sd-rozet {
    display: inline-flex; align-items: center; gap: 4px; max-width: 100%;
    padding: 3px 10px; border-radius: 9999px; border: 1px solid transparent;
    background: #f1f5f9; color: #334155;
    font-size: 12px; line-height: 1.4; font-weight: 700; letter-spacing: .01em; text-transform: none; white-space: nowrap;
    vertical-align: middle;
}
.sd-rozet--basari { background: #ecfdf5; color: #047857; border-color: #a7f3d0; }
.sd-rozet--uyari  { background: #fffbeb; color: #92400e; border-color: #fde68a; }
.sd-rozet--bilgi  { background: #eff6ff; color: #1d4ed8; border-color: #bfdbfe; }
.sd-rozet--hata   { background: #fef2f2; color: #b91c1c; border-color: #fecaca; }
.sd-rozet--notr   { background: #f1f5f9; color: #334155; border-color: #e2e8f0; }
.sd-rozet--eylem  { background: var(--sd-eylem); color: #fff; }
.sd-rozet--dolu.sd-rozet--basari { background: #047857; color: #fff; border-color: #047857; }
.sd-rozet--buyuk { padding: 5px 12px; font-size: 13px; }
html.dark .sd-rozet, html.dark .sd-rozet--notr { background: rgba(255, 255, 255, .08) !important; color: #e2e8f0 !important; border-color: rgba(255, 255, 255, .12); }
html.dark .sd-rozet--basari { background: rgba(16, 185, 129, .15) !important; color: #6ee7b7 !important; border-color: rgba(16, 185, 129, .3); }
html.dark .sd-rozet--uyari  { background: rgba(245, 158, 11, .15) !important; color: #fcd34d !important; border-color: rgba(245, 158, 11, .3); }
html.dark .sd-rozet--bilgi  { background: rgba(59, 130, 246, .15) !important; color: #93c5fd !important; border-color: rgba(59, 130, 246, .3); }
html.dark .sd-rozet--hata   { background: rgba(239, 68, 68, .15) !important; color: #fca5a5 !important; border-color: rgba(239, 68, 68, .3); }
html.dark .sd-rozet--eylem, html.dark .sd-rozet--dolu.sd-rozet--basari { color: #fff !important; }
html.dark .sd-rozet--eylem { background: var(--sd-eylem) !important; }
html.dark .sd-rozet--dolu.sd-rozet--basari { background: #047857 !important; }

/* ---------- Boş durum ---------- */
.sd-bos {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    padding: 40px 24px; border: 1px dashed var(--sd-kenar-guclu); border-radius: 1.5rem; background: var(--sd-yuzey);
}
.sd-bos__ikon {
    display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; margin-bottom: 16px;
    border-radius: 16px; background: #f1f5f9; color: #64748b; font-size: 22px;
}
.sd-bos__baslik { margin: 0 0 6px; font-family: var(--sd-baslik-font); font-size: 18px; line-height: 1.35; font-weight: 800; color: var(--sd-yazi); }
.sd-bos__aciklama { max-width: 36rem; margin: 0; font-size: 14px; line-height: 1.6; font-weight: 500; color: var(--sd-yazi-3); }
.sd-bos__eylem { margin-top: 20px; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.sd-bos--kucuk { padding: 24px 16px; }
.sd-bos--kucuk .sd-bos__ikon { width: 44px; height: 44px; font-size: 18px; margin-bottom: 12px; }
html.dark .sd-bos { background: rgba(15, 23, 42, .5); border-color: #334155; }
html.dark .sd-bos__ikon { background: rgba(255, 255, 255, .06); color: #94a3b8; }

/* ---------- Başlık ölçeği ----------
   .sd-h1: liste/menü sayfası başlığı (h1) · .sd-h2: ayrıntı sayfası başlığı (yazı, firma, etkinlik; yine tek h1)
   .sd-h3: sayfa içi bölüm başlığı (h2). Ekran ölçüsü base.html zoom: 0.9 ile ~%90'dır. */
.sd-h1, .sd-h2, .sd-h3 { font-family: var(--sd-baslik-font); color: var(--sd-yazi); letter-spacing: -.02em; margin: 0; }
.sd-h1 { font-size: 32px; line-height: 1.15; font-weight: 900; }
.sd-h2 { font-size: 28px; line-height: 1.2; font-weight: 800; }
.sd-h3 { font-size: 20px; line-height: 1.3; font-weight: 800; letter-spacing: -.01em; }
@media (min-width: 768px) {
    .sd-h1 { font-size: 48px; line-height: 1.1; }
    .sd-h2 { font-size: 36px; line-height: 1.15; }
    .sd-h3 { font-size: 24px; }
}
html.dark .sd-h1, html.dark .sd-h2, html.dark .sd-h3 { color: #f8fafc; }
/* Konum satırı (Soru-Cevap formları): genel html.dark nav kuralı zemin vermesin */
html.dark nav.sd-baslik__ust, html.dark .sd-baslik__ust nav { background: transparent !important; border: 0 !important; }

/* ---------- Soru-Cevap: forum tarzı liste (forum/home, forum/category; 04.11.2026 kullanıcı kararıyla kart ızgarası yerine) ----------
   Grup şeridi koyu marka tonunda (beyaz yazı ≥4.5:1), her alan / soru bir satır; en küçük yazı 12px. */
.sf-blok { background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; overflow: hidden; }
.sf-serit { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 20px;
            background: color-mix(in srgb, var(--sd-marka) 70%, #0f172a); color: #fff; }
.sf-serit h2 { margin: 0; font-size: 16px; line-height: 1.3; font-weight: 800; color: #fff; }
.sf-serit a { color: #fff; font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.sf-sayfalar { display: flex; gap: 4px; align-items: center; }
.sf-sayfalar a, .sf-sayfalar span { min-width: 32px; height: 32px; display: inline-grid; place-items: center; border-radius: 8px; font-size: 13px; font-weight: 700; text-decoration: none !important; }
.sf-sayfalar a:hover { background: rgba(255, 255, 255, .15); }
.sf-sayfalar span[aria-current] { background: #fff; color: #0f172a; }
.sf-sutunlar { display: none; }
.sf-satir { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 16px 20px; border-top: 1px solid #f1f5f9; }
.sf-sutunlar + .sf-satir, .sf-serit + .sf-satir { border-top: 0; }
.sf-satir:hover { background: #f8fafc; }
@media (min-width: 768px) {
    .sf-sutunlar { display: grid; gap: 16px; padding: 8px 20px; background: #f1f5f9; border-bottom: 1px solid #e2e8f0; font-size: 12px; font-weight: 700; color: #475569; }
    .sf-sutunlar--alan, .sf-satir--alan { grid-template-columns: minmax(0, 7fr) minmax(0, 2fr) minmax(0, 3fr); }
    .sf-sutunlar--konu, .sf-satir--konu { grid-template-columns: minmax(0, 7fr) 110px minmax(0, 3fr) 70px; }
    .sf-sutunlar > span:not(:first-child) { text-align: center; }
    .sf-sutunlar > span:nth-child(3) { text-align: right; }
    .sf-satir { gap: 16px; align-items: center; }
    .sf-sayilar, .sf-sayi { justify-content: center; text-align: center; }
    .sf-son { text-align: right; align-items: flex-end; }
    .sf-etiket-tel { display: none; }
}
.sf-ana { display: flex; align-items: flex-start; gap: 12px; min-width: 0; }
.sf-simge { flex: none; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; font-size: 18px;
            background: color-mix(in srgb, var(--sd-marka) 10%, #fff); color: var(--sd-marka); }
.sf-simge--kucuk { width: 36px; height: 36px; font-size: 15px; border-radius: 10px; }
.sf-ad { display: inline; font-size: 16px; line-height: 1.35; font-weight: 800; color: #0f172a; }
.sf-ad:hover { color: var(--sd-marka); text-decoration: underline; text-underline-offset: 3px; }
.sf-aciklama { margin: 2px 0 0; font-size: 13px; line-height: 1.5; color: #475569; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sf-alt { margin: 4px 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; font-size: 13px; color: #64748b; }
.sf-alt > span:first-child:not(.sd-rozet) { font-weight: 700; color: #475569; }
.sf-alt a { color: var(--sd-marka); font-weight: 600; }
.sf-alt a:hover { text-decoration: underline; }
.sf-sayilar { display: flex; gap: 16px; font-size: 13px; color: #64748b; }
.sf-sayilar b, .sf-sayi b { font-size: 16px; font-weight: 800; color: #0f172a; }
.sf-sayi { font-size: 14px; font-weight: 600; color: #334155; }
.sf-son { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.sf-son__baslik { font-size: 13px; font-weight: 700; color: #0f172a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.sf-son__baslik:hover { color: var(--sd-marka); text-decoration: underline; }
.sf-son__alt { font-size: 12px; color: #64748b; }
.sf-son__alt a { color: #334155; font-weight: 600; }
@media (max-width: 767px) {
    /* Telefonda soru satırı: başlık + soran, altında tek satırda yanıt · görüntüleme · son yanıt */
    .sf-satir--konu { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
    .sf-satir--konu .sf-ana { flex-basis: 100%; }
    .sf-satir--konu .sf-sayi { font-size: 13px; }
    .sf-satir--konu .sf-sayi:last-child { order: 1; margin-left: 48px; }
    .sf-satir--konu .sf-sayi:nth-child(2) { order: 2; }
    .sf-satir--konu .sf-son { order: 3; flex-basis: 100%; padding-left: 48px; flex-direction: row; flex-wrap: wrap; gap: 0 6px; }
    .sf-satir--konu .sf-son::before { content: "Son yanıt"; font-size: 12px; color: #64748b; }
    .sf-satir--alan .sf-sayilar, .sf-satir--alan .sf-son { padding-left: 56px; }
}
html.dark .sf-blok { background: #1e293b; border-color: #334155; }
html.dark .sf-sutunlar { background: #0f172a; border-color: #334155; color: #cbd5e1; }
html.dark .sf-satir { border-color: #334155; }
html.dark .sf-satir:hover { background: rgba(255, 255, 255, .03); }
html.dark .sf-ad, html.dark .sf-son__baslik, html.dark .sf-sayilar b, html.dark .sf-sayi b { color: #f8fafc; }
html.dark .sf-aciklama, html.dark .sf-sayi, html.dark .sf-alt > span:first-child { color: #cbd5e1; }
html.dark .sf-simge { background: rgba(255, 255, 255, .06); color: #93c5fd; }
html.dark .sf-alt a { color: #93c5fd; }
html.dark .sf-son__alt a { color: #e2e8f0; }

/* ---------- Kurumsal sayfalar (Hakkımızda, İletişim, yasal metinler, SSS): ortak başlık + tek beyaz içerik kartı ---------- */
.sd-kurumsal { padding: 24px; }
@media (min-width: 768px) { .sd-kurumsal { padding: 40px 48px; } }
.sd-iletisim { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; max-width: 1200px; margin: 0 auto; }
@media (min-width: 1024px) { .sd-iletisim { grid-template-columns: minmax(0, 1fr) 340px; } .sd-iletisim__yan { position: sticky; top: 120px; } }
html.dark .sd-kurumsal .static-page-content, html.dark .sd-kurumsal .static-page-content p, html.dark .sd-kurumsal .static-page-content li { color: #cbd5e1; }
html.dark .sd-iletisim__yan a.font-bold, html.dark .sd-iletisim__yan .text-slate-900 { color: #f8fafc !important; }

/* Tehlikeli işlem (sil) için çerçeveli düğme */
.sd-btn--tehlike { color: #be123c !important; border-color: #fecdd3; }
.sd-btn--tehlike:hover { background: #fff1f2; border-color: #be123c; }
html.dark .sd-btn--tehlike { color: #fda4af !important; border-color: #9f1239 !important; }
/* hidden özniteliği her zaman gizler (sd-btn display kuralına karşı) */
.sd-btn[hidden], .sd-alan[hidden], .sd-bos[hidden] { display: none !important; }

/* ---------- Ana sayfa güven bandı (karşılama alanının altında; sayılar veritabanından, 1 saat önbellek) ---------- */
.sd-guven ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 12px; margin: -12px 0 0; padding: 0; list-style: none; }
.sd-guven a { display: inline-flex; align-items: baseline; gap: 6px; padding: 8px 16px; border-radius: 9999px; background: #fff; border: 1px solid #e2e8f0;
              font-size: 14px; font-weight: 600; color: #475569; transition: border-color .15s, color .15s; }
.sd-guven a:hover { border-color: var(--sd-marka); color: var(--sd-marka); }
.sd-guven b { font-family: var(--sd-baslik-font); font-size: 18px; font-weight: 900; color: #0f172a; font-variant-numeric: tabular-nums; }
html.dark .sd-guven a { background: #1e293b; border-color: #334155; color: #cbd5e1; }
html.dark .sd-guven b { color: #f8fafc; }
html.dark .sd-btn--acik.sd-btn--ikincil { color: #fff !important; border-color: rgba(255, 255, 255, .7) !important; }

/* Kayan firma şeridi: akarken iki kenarda yumuşak solma (ilk 3 sn ilk kart soldan hizalı durur) */
.fk.fk--akiyor [data-iz] { -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 32px, #000 calc(100% - 32px), transparent 100%);
                           mask-image: linear-gradient(90deg, transparent 0, #000 32px, #000 calc(100% - 32px), transparent 100%); }

/* ---------- "Doğrulandı" rozeti + "Nasıl doğrulanır?" açıklaması (includes/dogrulandi.html) ---------- */
.sd-dogru { position: relative; display: inline-flex; vertical-align: middle; }
.sd-dogru__rozet { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 9999px; background: #047857; color: #fff !important;
                   font-size: 12px; line-height: 1.3; font-weight: 800; text-decoration: none !important; white-space: nowrap; }
.sd-dogru__rozet:hover { background: #065f46; }
.sd-dogru__rozet--simge { width: 26px; height: 26px; padding: 0; justify-content: center; border: 2px solid #fff; box-shadow: 0 2px 6px rgba(15,23,42,.18); }
.sd-dogru__rozet--acik { background: rgba(255,255,255,.95); color: #047857 !important; border: 1px solid #a7f3d0; box-shadow: 0 6px 16px -8px rgba(15,23,42,.35); }
.sd-dogru__rozet--acik:hover { background: #ecfdf5; }
.sd-dogru__ipucu { position: absolute; z-index: 60; top: calc(100% + 8px); left: 50%; transform: translateX(-50%); width: 260px; padding: 10px 12px; border-radius: 12px;
                   background: #0f172a; color: #e2e8f0; font-size: 13px; line-height: 1.45; font-weight: 500; text-align: left; text-transform: none; letter-spacing: 0;
                   box-shadow: 0 12px 28px -10px rgba(15,23,42,.5); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .15s, visibility .15s; }
.sd-dogru__ipucu b { display: block; color: #fff; font-weight: 800; margin-bottom: 2px; }
.sd-dogru:hover .sd-dogru__ipucu, .sd-dogru:focus-within .sd-dogru__ipucu { opacity: 1; visibility: visible; }
.sd-dogru--sag .sd-dogru__ipucu { left: auto; right: 0; transform: none; }
.sd-dogru--sol .sd-dogru__ipucu { left: 0; transform: none; }
html.dark .sd-dogru__ipucu { background: #f8fafc; color: #334155; } html.dark .sd-dogru__ipucu b { color: #0f172a; }
.sd-dogru.fl-dogru-mobil { display: none; }
@media (max-width: 767px) { .fl-kart .sd-dogru.fl-dogru-mobil { display: inline-flex; } }