/* ============ BF YAZILIM — vitrin ============ */
/* Renkler tema sisteminden (index.php <style>) gelir.
   Buradakiler yalnizca yedek (fallback) — tema yuklenmezse devreye girer. */
:root{
    --zemin:#0b0f17;
    --zemin2:#0f1522;
    --panel:#141c2c;
    --cizgi:#22304a;
    --metin:#e9edf5;
    --soluk:#94a1b8;
    --vurgu:#f0a532;
    --vurgu2:#ffcb6b;
    --vurgu-koyu:#1a1204;
    --vurgu-yazi:#1a1204;
    --yesil:#3ddc84;
    --radius:14px;
    --gecis:.25s cubic-bezier(.4,0,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{animation:none!important;transition:none!important}
}
body{
    margin:0;background:var(--zemin);color:var(--metin);overflow-x:hidden;
    font-family:'Inter','Inter-yedek',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-size:16px;line-height:1.6;
    -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:'Sora','Sora-yedek',-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.15;margin:0;overflow-wrap:break-word}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.kap{max-width:1140px;margin:0 auto;padding:0 22px}
/* grid/flex cocuklari icerikten genis olmasin — yatay tasmanin asil sebebi */
.hero-ic > *,.iletisim-ic > *,.hakkinda-ic > *,.kart,.kart-alt > *{min-width:0}

.eyebrow{
    font-family:'JetBrains Mono','Mono-yedek',ui-monospace,monospace;font-size:12px;letter-spacing:.22em;
    color:var(--vurgu);margin:0 0 14px;font-weight:600;
}

/* ---------- üst bar ---------- */
.ust{
    position:sticky;top:0;z-index:50;
    background:rgba(11,15,23,.82);backdrop-filter:blur(10px);
    border-bottom:1px solid var(--cizgi);
}
.ust-ic{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{font-family:'Sora','Sora-yedek',sans-serif;font-weight:800;font-size:20px;letter-spacing:-.02em}
.logo span{color:var(--vurgu);font-weight:600}
.menu{display:flex;gap:26px;align-items:center;font-size:14px;font-weight:500}
.menu a{color:var(--soluk);transition:color var(--gecis)}
.menu a:hover{color:var(--metin)}
.menu-cta{
    color:var(--vurgu)!important;border:1px solid var(--vurgu);
    padding:8px 16px;border-radius:8px;transition:all var(--gecis);
}
.menu-cta:hover{background:var(--vurgu);color:var(--vurgu-koyu)!important}
.menu-dugme{display:none;background:none;border:0;color:var(--metin);font-size:22px;cursor:pointer}

/* ---------- hero ---------- */
.hero{
    padding:96px 0 84px;
    background:
      radial-gradient(700px 340px at 85% 0%, rgba(240,165,50,.09), transparent 65%),
      var(--zemin);
    border-bottom:1px solid var(--cizgi);
}
.hero-ic{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(32px,4.6vw,52px);font-weight:800;letter-spacing:-.02em}
.hero-alt{color:var(--soluk);font-size:18px;margin:20px 0 30px;max-width:520px}
.hero-butonlar{display:flex;gap:14px;flex-wrap:wrap}

.btn{
    display:inline-block;padding:13px 26px;border-radius:10px;
    font-weight:600;font-size:15px;transition:all var(--gecis);border:1px solid transparent;
}
.btn-ana{background:var(--vurgu);color:var(--vurgu-yazi)}
.btn-ana:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(240,165,50,.28)}
.btn-cizgi{border-color:var(--cizgi);color:var(--metin)}
.btn-cizgi:hover{border-color:var(--vurgu);color:var(--vurgu)}
.btn-kucuk{padding:8px 16px;font-size:13px;background:var(--vurgu);color:var(--vurgu-yazi);border-radius:8px}
.btn-kucuk:hover{filter:brightness(1.08)}

/* imza: yayın kaydı */
.yayin-log{
    background:var(--zemin2);border:1px solid var(--cizgi);border-radius:var(--radius);
    overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.4);
    font-family:'JetBrains Mono','Mono-yedek',ui-monospace,monospace;
}
.yayin-baslik{
    display:flex;align-items:center;gap:8px;
    padding:12px 16px;border-bottom:1px solid var(--cizgi);
    font-size:12px;color:var(--soluk);letter-spacing:.08em;
}
.nokta{width:8px;height:8px;border-radius:50%;background:var(--yesil);
    box-shadow:0 0 8px var(--yesil);animation:nabiz 2s infinite}
@keyframes nabiz{50%{opacity:.4}}
.yayin-satirlar{padding:14px 16px;height:210px;min-height:210px;contain:strict;overflow:hidden;font-size:12.5px;line-height:2}
.yayin-satirlar div{color:var(--soluk);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.yayin-satirlar div b{color:var(--yesil);font-weight:600;margin-right:8px}
.yayin-satirlar div span{color:var(--vurgu)}
.yayin-satirlar div.yeni{animation:gir .4s ease}
@keyframes gir{from{opacity:0;transform:translateY(6px)}}

/* ---------- bölümler ---------- */
.bolum{padding:88px 0}
.bolum-koyu{background:var(--zemin2);border-block:1px solid var(--cizgi)}
.bolum-baslik{max-width:640px;margin-bottom:44px}
.bolum-baslik h2{font-size:clamp(26px,3.4vw,38px);font-weight:700;letter-spacing:-.01em}
.bolum-alt{color:var(--soluk);margin:14px 0 0}

/* ---------- vitrin ---------- */
.filtreler{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:30px}
.filtre{
    background:none;border:1px solid var(--cizgi);color:var(--soluk);
    padding:8px 18px;border-radius:999px;font-size:13px;font-weight:500;
    cursor:pointer;transition:all var(--gecis);font-family:inherit;
}
.filtre:hover{border-color:var(--vurgu);color:var(--metin)}
.filtre.aktif{background:var(--vurgu);border-color:var(--vurgu);color:var(--vurgu-yazi);font-weight:600}

.vitrin-izgara{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:24px}
.bos{color:var(--soluk)}
.kart{
    background:var(--panel);border:1px solid var(--cizgi);border-radius:var(--radius);
    overflow:hidden;transition:transform var(--gecis),border-color var(--gecis);
    display:flex;flex-direction:column;
}
.kart:hover{transform:translateY(-4px);border-color:#3a4d70}
.kart-gorsel{aspect-ratio:16/10;background:var(--zemin);overflow:hidden;display:block;contain:layout}
.kart-gorsel img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .5s ease}
.kart:hover .kart-gorsel img{transform:scale(1.04)}
.kart-gorsel-bos{
    width:100%;height:100%;display:grid;place-items:center;
    font-family:'JetBrains Mono','Mono-yedek',ui-monospace,monospace;color:var(--cizgi);font-size:20px;
}
.kart-icerik{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}
.etiket{
    align-self:flex-start;font-family:'JetBrains Mono','Mono-yedek',ui-monospace,monospace;font-size:11px;
    letter-spacing:.12em;text-transform:uppercase;color:var(--vurgu);
    border:1px solid rgba(240,165,50,.35);padding:3px 10px;border-radius:6px;
}
.kart h3{font-size:18px;font-weight:700}
.kart-icerik p{color:var(--soluk);font-size:14px;margin:0;flex:1}
.kart-alt{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px}
.slug{font-family:'JetBrains Mono','Mono-yedek',ui-monospace,monospace;font-size:11.5px;color:#5c6b85;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- hizmetler ---------- */
.hizmet-izgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:22px}
.hizmet{
    background:var(--panel);border:1px solid var(--cizgi);border-radius:var(--radius);
    padding:26px;transition:border-color var(--gecis);
}
.hizmet:hover{border-color:rgba(240,165,50,.45)}
.hizmet h3{font-size:17px;margin-bottom:10px;font-weight:700}
.hizmet p{color:var(--soluk);font-size:14px;margin:0}

/* ---------- hakkında ---------- */
.hakkinda-ic{display:grid;grid-template-columns:280px 1fr;gap:48px;align-items:start}
.hakkinda-ic h2{font-size:clamp(26px,3vw,34px)}
.hakkinda-metin{color:var(--soluk);font-size:17px;margin:0}

/* ---------- iletişim ---------- */
.iletisim-ic{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:start}
.iletisim-sol h2{font-size:clamp(24px,3vw,32px)}
.iletisim-liste{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:16px}
.iletisim-liste li{display:grid;gap:2px;font-size:15px}
.iletisim-liste span{font-family:'JetBrains Mono','Mono-yedek',ui-monospace,monospace;font-size:11px;letter-spacing:.15em;color:var(--soluk);text-transform:uppercase}

.form{display:grid;gap:16px;background:var(--panel);border:1px solid var(--cizgi);border-radius:var(--radius);padding:28px}
.form label{display:grid;gap:6px;font-size:13px;font-weight:500;color:var(--soluk)}
.form input,.form textarea{
    background:var(--zemin);border:1px solid var(--cizgi);border-radius:9px;
    color:var(--metin);padding:12px 14px;font-size:15px;font-family:inherit;
    transition:border-color var(--gecis);
}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--vurgu)}
.form-ikili{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.hp{position:absolute;left:-9999px;opacity:0}
.form-durum{margin:0;font-size:14px;min-height:20px}
.form-durum.ok{color:var(--yesil)}
.form-durum.hata{color:#ff6b81}

/* ---------- footer ---------- */
.alt{border-top:1px solid var(--cizgi);padding:26px 0}
.alt-ic{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--soluk)}
.alt-not{font-family:'JetBrains Mono','Mono-yedek',ui-monospace,monospace;font-size:11.5px}

/* ---------- odak ---------- */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
    outline:2px solid var(--vurgu);outline-offset:2px;
}

/* ---------- mobil ---------- */
@media (max-width:860px){
    .hero-ic,.iletisim-ic,.hakkinda-ic{grid-template-columns:1fr;gap:34px}
    .hero{padding:52px 0 48px}
    .hero h1{font-size:clamp(27px,7.6vw,38px)}
    .hero-alt{font-size:16px;margin:16px 0 24px}
    .hero-butonlar .btn{flex:1;text-align:center;padding:13px 14px}
    .yayin-satirlar{height:132px;font-size:11px;line-height:1.95;padding:12px 14px}
    .yayin-baslik{padding:10px 14px;font-size:11px}
    .menu{
        position:fixed;inset:64px 0 auto 0;background:var(--zemin2);
        flex-direction:column;padding:22px;border-bottom:1px solid var(--cizgi);
        display:none;
    }
    .menu.acik{display:flex}
    .menu-dugme{display:block}
    .form-ikili{grid-template-columns:1fr}
    .bolum{padding:56px 0}
    .kap{padding:0 18px}
    .form{padding:22px}
    .alt-ic{flex-direction:column;gap:6px}
}

/* ============ TEKNOLOJİ VİTRİNİ ============ */
.tek-izgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:22px}
.tek-grup{background:var(--panel);border:1px solid var(--cizgi);border-radius:var(--radius);padding:22px;transition:border-color var(--gecis)}
.tek-grup:hover{border-color:var(--vurgu)}
.tek-grup-ad{font-family:'JetBrains Mono','Mono-yedek',ui-monospace,monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--vurgu);margin:0 0 14px;font-weight:600}
.tek-rozetler{display:flex;flex-wrap:wrap;gap:8px}
.tek-rozet{
    font-size:13px;font-weight:500;color:var(--metin);
    background:var(--zemin);border:1px solid var(--cizgi);
    padding:6px 13px;border-radius:8px;transition:all var(--gecis);cursor:default;
}
.tek-rozet:hover{border-color:var(--vurgu);color:var(--vurgu);transform:translateY(-2px)}

/* iletişim notu */
.iletisim-not{color:var(--soluk);font-size:15px;margin:14px 0 0;max-width:420px}
.iletisim-not b{color:var(--vurgu)}

/* kart görsel bos - kod işareti */
.kart-gorsel-bos{
    width:100%;height:100%;display:grid;place-items:center;
    font-family:'JetBrains Mono','Mono-yedek',ui-monospace,monospace;color:var(--cizgi);font-size:34px;font-weight:600;
}

/* ============ BLOG ============ */
.kap-dar{max-width:760px}
.yazi-kap{padding:56px 0 80px}
.ekmek{font-family:'JetBrains Mono','Mono-yedek',ui-monospace,monospace;font-size:12px;color:var(--soluk);margin-bottom:20px}
.ekmek a{color:var(--soluk)}.ekmek a:hover{color:var(--vurgu)}
.yazi-baslik{font-size:clamp(28px,4vw,42px);font-weight:800;letter-spacing:-.02em;margin-bottom:12px}
.yazi-tarih{font-family:'JetBrains Mono','Mono-yedek',ui-monospace,monospace;font-size:13px;color:var(--soluk);margin:0 0 26px}
.yazi-gorsel{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--radius);border:1px solid var(--cizgi);margin-bottom:30px}
.yazi-icerik{font-size:17px;line-height:1.8;color:var(--metin)}
.yazi-icerik h2{font-size:24px;font-weight:700;margin:36px 0 14px}
.yazi-icerik h3{font-size:19px;font-weight:600;margin:28px 0 12px}
.yazi-icerik p{margin:0 0 18px;color:var(--soluk)}
.yazi-icerik ul,.yazi-icerik ol{margin:0 0 18px;padding-left:24px;color:var(--soluk)}
.yazi-icerik li{margin-bottom:8px}
.yazi-icerik strong{color:var(--metin)}
.yazi-icerik a{color:var(--vurgu);text-decoration:underline}
.yazi-icerik img{max-width:100%;border-radius:10px;margin:20px 0}
.diger-yazilar{margin-top:50px;padding-top:30px;border-top:1px solid var(--cizgi)}
.diger-yazilar h2{font-size:18px;margin:0 0 14px}
.diger-yazilar ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.diger-yazilar a{color:var(--soluk);font-weight:500}
.diger-yazilar a:hover{color:var(--vurgu)}
.yazi-cta{margin-top:44px;padding:28px;background:var(--panel);border:1px solid var(--cizgi);border-radius:var(--radius);text-align:center}
.yazi-cta p{margin:0 0 16px;font-size:17px;font-weight:500}

.blog-izgara{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:24px}
.blog-kart{background:var(--panel);border:1px solid var(--cizgi);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:transform var(--gecis),border-color var(--gecis)}
.blog-kart:hover{transform:translateY(-4px);border-color:var(--vurgu)}
.blog-kart-gorsel{aspect-ratio:16/9;overflow:hidden;background:var(--zemin);display:block;contain:layout}
.blog-kart-gorsel img{width:100%;height:100%;object-fit:cover}
.blog-kart-icerik{padding:20px;display:flex;flex-direction:column;gap:8px}
.blog-kart-tarih{font-family:'JetBrains Mono','Mono-yedek',ui-monospace,monospace;font-size:11px;color:var(--vurgu)}
.blog-kart-baslik{font-family:'Sora','Sora-yedek',sans-serif;font-size:18px;font-weight:700;color:var(--metin);line-height:1.3}
.blog-kart-ozet{font-size:14px;color:var(--soluk);line-height:1.5}

/* ana sayfa son yazilar — kucuk, sade */
.son-yazilar{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.son-yazi-link{display:inline-flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--cizgi);border-radius:999px;padding:8px 16px;font-size:13px;color:var(--soluk);transition:all var(--gecis)}
.son-yazi-link:hover{border-color:var(--vurgu);color:var(--vurgu)}
.son-yazi-link::before{content:'✍';font-size:12px}

/* ============ SSS ============ */
.sss-liste{display:grid;gap:12px;max-width:820px}
.sss-oge{background:var(--panel);border:1px solid var(--cizgi);border-radius:var(--radius);overflow:hidden;transition:border-color var(--gecis)}
.sss-oge[open]{border-color:var(--vurgu)}
.sss-oge summary{
    padding:18px 22px;cursor:pointer;font-family:'Sora',sans-serif;font-weight:600;
    font-size:16px;color:var(--metin);list-style:none;display:flex;justify-content:space-between;gap:14px;align-items:center;
}
.sss-oge summary::-webkit-details-marker{display:none}
.sss-oge summary::after{content:'+';color:var(--vurgu);font-size:22px;font-weight:400;line-height:1;flex-shrink:0}
.sss-oge[open] summary::after{content:'−'}
.sss-oge summary:hover{color:var(--vurgu)}
.sss-cevap{padding:0 22px 20px;color:var(--soluk);font-size:15px;line-height:1.75}

/* teknoloji rozetine aciklama (title) imleci */
.tek-rozet[title]{cursor:help}

/* ============ SOSYAL HESAPLAR ============ */
.sosyal{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.sosyal-link{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    width:38px;height:38px;border-radius:10px;
    border:1px solid var(--cizgi);color:var(--soluk);
    transition:all var(--gecis);flex-shrink:0;
}
.sosyal-link:hover{border-color:var(--vurgu);color:var(--vurgu);transform:translateY(-2px)}
.sosyal-link svg{display:block}
.sosyal-etiketli{margin-top:26px}
.sosyal-etiketli .sosyal-link{width:auto;height:auto;padding:9px 15px;font-size:13px;font-weight:500}
.sosyal-etiketli .sosyal-link span{display:inline}
.alt-ic .sosyal{order:2}
@media (max-width:860px){
    .alt-ic .sosyal{order:-1;margin-bottom:6px}
}