/* Başak Teknik Servis — kurumsal tema (lacivert/mavi, açık zemin) */
:root{
    --bg:#f4f6f9; --ink:#152238; --muted:#5b6b80; --card:#ffffff;
    --line:#e1e6ee; --accent:#0f4c81; --accent-dark:#0b3861; --cta:#e8871e; --success:#16a34a;
    --sabit-ara-renk:#dc2626;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{font-family:system-ui,-apple-system,'Segoe UI',sans-serif; background:var(--bg); color:var(--ink); line-height:1.6;}
a{color:inherit;}
.container{max-width:1100px; margin:0 auto; padding:0 20px;}

header.site-header{background:var(--card); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10;}
.header-inner{display:flex; flex-direction:column; gap:8px; padding:14px 20px; max-width:1100px; margin:0 auto;}
.header-top-row{display:flex; align-items:center; justify-content:space-between; gap:10px;}
.logo{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink);}
.logo img{display:block; width:clamp(46px, 5.5vw, 66px); height:clamp(46px, 5.5vw, 66px); border-radius:11px; flex-shrink:0;}
.logo i{color:var(--accent);}
/* Tek parça, tek stil — tüm metin aynı kalınlık ve aynı büyüklükte.
   clamp(): dar ekranda küçülür, geniş ekranda 22px'te durur. Böylece
   "MENEMEN ALARKO CARRİER ÖZEL SERVİSİ" gibi uzun adlar da sığar. */
/* Masaüstünde belirgin şekilde büyük (kullanıcı kararı, 17.08.2026).
   clamp üst sınırı 27px -> 40px. En uzun ad "MENEMEN ALARKO CARRIER OZEL
   SERVISI" 40px'te ~770px yer kaplıyor; kap 1100px olduğu için sığıyor. */
.logo-yazi{font-weight:800; font-size:clamp(17px, 5vw, 40px); letter-spacing:.2px;
           color:var(--ink); line-height:1.15;}
/* MENÜ TEK SATIRDA (kullanıcı kararı, 17.08.2026)
   Önce `flex-wrap:wrap` vardı ve 6 öğe dar telefonda alt satıra düşüyordu.
   Artık sarma kapalı; öğeler yan yana kalıyor.
   ⚠ 6 öğe okunabilir puntoda 375px'lik bir ekrana tam sığmıyor — bu yüzden
   satır yatay kaydırılabilir. Kaydırma çubuğu gizli ama parmakla kaydırma
   çalışıyor; sağdaki soluk geçiş devamı olduğunu belli ediyor. */
header nav{
    display:flex; flex-wrap:nowrap; gap:clamp(12px, 3.4vw, 22px);
    overflow-x:auto; -webkit-overflow-scrolling:touch;
    scrollbar-width:none; -ms-overflow-style:none;
    /* Sağ kenarda içerik devam ediyorsa soluklaşarak bitsin */
    -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 24px), transparent);
            mask-image:linear-gradient(to right, #000 calc(100% - 24px), transparent);
}
header nav::-webkit-scrollbar{display:none;}
header nav a{white-space:nowrap; font-weight:600; font-size:clamp(12.5px, 3.4vw, 14px); text-decoration:none; color:var(--muted);}
header nav a:hover{color:var(--accent);}

/* .header-tel kaldırıldı — başlıktaki telefon butonu 17.08.2026 çıkarıldı */
    4%{transform:rotate(15deg);}
    6%{transform:rotate(-12deg);}
    8%{transform:rotate(9deg);}
    10%{transform:rotate(-5deg);}
    12%{transform:rotate(0);}
}

/* Mobilde logo ve telefonu küçült */
@media (max-width: 480px){
    .header-inner{padding:12px 14px;}
    .logo{font-size:14px;}
    .logo i{font-size:14px;}
}

.breadcrumb{font-size:13px; color:var(--muted); padding:14px 20px; max-width:1100px; margin:0 auto;}
.breadcrumb a{color:var(--muted); text-decoration:none;}
.breadcrumb a:hover{color:var(--accent);}

/* İçindekiler */
.toc{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:18px 22px; margin:0 auto 10px; max-width:1100px;}
.toc h2{font-size:14px; font-weight:800; margin-bottom:10px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em;}
.toc ul{list-style:none; display:flex; flex-wrap:wrap; gap:8px 18px;}
.toc a{font-size:13.5px; font-weight:600; color:var(--accent); text-decoration:none;}
.toc a:hover{text-decoration:underline;}

h1{text-transform:uppercase;}

.hero{background:linear-gradient(135deg, var(--accent), var(--accent-dark)); color:#fff; padding:60px 20px; text-align:center; position:relative;}
.hero h1{font-size:clamp(26px,5vw,40px); font-weight:800; margin-bottom:14px;}
.hero p{font-size:16px; opacity:.92; max-width:640px; margin:0 auto 28px;}
.hero-actions{display:flex; gap:12px; justify-content:center; flex-wrap:wrap;}

/* 7/24 Teknik Destek Hattı — mavi hero kutusunun tam sol üst köşesi */
.hero-top-left-rozet{
    position:absolute; top:16px; left:16px;
    display:inline-flex; align-items:center; gap:7px;
    background:rgba(255,255,255,.14); color:#fff; text-decoration:none;
    padding:6px 13px; border-radius:20px; font-size:12px; font-weight:700;
    border:1px solid rgba(255,255,255,.25);
    transition:background .15s;
}
.hero-top-left-rozet:hover{background:rgba(255,255,255,.24);}

/* Müşteri Hizmetleri etiketi — arama butonunun üstünde */
.hero-buton-grubu{display:flex; flex-direction:column; align-items:center; gap:6px;}
.musteri-hizmetleri-etiket{
    display:inline-flex; align-items:center; gap:6px;
    color:#fff; opacity:.85; text-decoration:none;
    font-size:12px; font-weight:700;
}
.musteri-hizmetleri-etiket:hover{opacity:1;}
.btn{display:inline-flex; align-items:center; gap:8px; padding:14px 26px; border-radius:10px; font-weight:700; font-size:15px; text-decoration:none; border:none; cursor:pointer;}
.btn-light{background:#fff; color:var(--accent-dark);}
.btn-cta{background:var(--cta); color:#fff;}
.btn-outline{background:rgba(255,255,255,.12); color:#fff; border:1.5px solid rgba(255,255,255,.5);}

section{padding:56px 20px;}
.section-title{text-align:center; margin-bottom:36px;}
.section-title h2{font-size:26px; font-weight:800;}
.section-title p{color:var(--muted); margin-top:8px; font-size:15px;}

.services-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px;}
.service-card{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:26px 22px; box-shadow:0 2px 8px rgba(15,35,60,.05);}
.service-card .icon{width:48px; height:48px; border-radius:10px; background:rgba(15,76,129,.08); color:var(--accent); display:flex; align-items:center; justify-content:center; font-size:20px; margin-bottom:14px;}
.service-card h3{font-size:16px; font-weight:700; margin-bottom:6px;}
.service-card p{font-size:13.5px; color:var(--muted);}

/* Detaylı hizmet listesi (marka sayfası) */
.hizmet-list{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:10px;}
.hizmet-list li{list-style:none; background:var(--card); border:1px solid var(--line); border-radius:10px; padding:12px 14px; font-size:14px; font-weight:600; display:flex; align-items:center; gap:10px;}
.hizmet-list li i{color:var(--accent);}

/* Marka ızgarası */
.brand-category{margin-bottom:38px;}
.brand-category h3{font-size:17px; font-weight:800; margin-bottom:14px; color:var(--ink); display:flex; align-items:center; gap:8px;}
.brand-category h3 i{color:var(--accent);}
.brand-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:10px;}
.brand-pill{background:var(--card); border:1px solid var(--line); border-radius:10px; padding:12px 14px; font-size:13.5px; font-weight:600; text-decoration:none; color:var(--ink); transition:border-color .15s, transform .15s;}
.brand-pill:hover{border-color:var(--accent); transform:translateY(-2px); color:var(--accent);}

/* Marka detay sayfası */
.brand-hero-tag{display:inline-block; background:rgba(255,255,255,.15); padding:5px 14px; border-radius:20px; font-size:12.5px; font-weight:700; margin-bottom:14px;}

/* Arızalar ve çözümleri */
.fault-cards{display:grid; gap:14px;}
.fault-card{background:var(--card); border:1px solid var(--line); border-left:4px solid var(--accent); border-radius:10px; padding:18px 20px;}
.fault-card .fault-title{font-weight:700; font-size:15px; margin-bottom:6px; display:flex; gap:8px; align-items:flex-start;}
.fault-card .fault-title i{color:#dc2626; margin-top:2px;}
.fault-card .fault-solution{font-size:14px; color:var(--muted); display:flex; gap:8px; align-items:flex-start;}
.fault-card .fault-solution i{color:var(--success); margin-top:3px;}

/* Dikkat edilmesi gerekenler listesi */
.fault-list{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:24px 26px; max-width:780px; margin:0 auto;}
.fault-list ul{list-style:none;}
.fault-list li{padding:9px 0; border-bottom:1px dashed var(--line); font-size:14.5px; color:var(--ink); display:flex; gap:10px; align-items:flex-start;}
.fault-list li:last-child{border-bottom:none;}
.fault-list li i{color:var(--cta); margin-top:3px;}

/* Çalışma prensipleri */
.principle-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:18px;}
.principle-card{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:22px; text-align:center;}
.principle-card .icon{width:44px; height:44px; margin:0 auto 12px; border-radius:10px; background:rgba(15,76,129,.08); color:var(--accent); display:flex; align-items:center; justify-content:center; font-size:18px;}
.principle-card h3{font-size:15px; font-weight:700; margin-bottom:6px;}
.principle-card p{font-size:13px; color:var(--muted);}

/* Servis süreci (adımlar) */
.step-list{counter-reset:step; display:flex; flex-direction:column; gap:16px; max-width:680px; margin:0 auto;}
.step-item{display:flex; gap:16px; align-items:flex-start;}
.step-num{counter-increment:step; flex-shrink:0; width:34px; height:34px; border-radius:50%; background:var(--accent); color:#fff; font-weight:800; font-size:14px; display:flex; align-items:center; justify-content:center;}
.step-num::before{content:counter(step);}
.step-body h3{font-size:15px; font-weight:700; margin-bottom:3px;}
.step-body p{font-size:13.5px; color:var(--muted);}

/* Hakkımızda */
.about-box{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:28px 26px; max-width:780px; margin:0 auto; font-size:15px; color:var(--ink);}

/* SSS */
.faq-list{max-width:780px; margin:0 auto; display:flex; flex-direction:column; gap:10px;}
.faq-item{background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px 20px;}
.faq-item .q{font-weight:700; font-size:14.5px; display:flex; gap:8px; align-items:flex-start; margin-bottom:6px;}
.faq-item .q i{color:var(--accent); margin-top:2px;}
.faq-item .a{font-size:14px; color:var(--muted); padding-left:22px;}

.other-brands{margin-top:40px;}
.other-brands h3{font-size:16px; font-weight:800; margin-bottom:14px;}

.hizmet-bilgi-kutusu{background:var(--card); border:1px solid var(--line); border-radius:14px; overflow:hidden; max-width:640px; margin:0 auto;}
.hizmet-bilgi-satir{display:flex; justify-content:space-between; gap:16px; padding:14px 20px; border-bottom:1px solid var(--line); font-size:14px;}
.hizmet-bilgi-satir:last-child{border-bottom:none;}
.hizmet-bilgi-etiket{color:var(--muted); font-weight:600; display:flex; align-items:center; gap:8px;}
.hizmet-bilgi-etiket i{color:var(--accent); width:16px; text-align:center;}
.hizmet-bilgi-deger{font-weight:700; color:var(--ink); text-align:right;}
.hizmet-bilgi-deger a{color:var(--accent); text-decoration:none;}

.contact{background:var(--card); border-top:1px solid var(--line);}
.contact-box{background:var(--bg); border:1px dashed var(--line); border-radius:16px; padding:34px 26px; text-align:center; max-width:560px; margin:0 auto;}
.contact-box h3{font-size:19px; font-weight:800; margin-bottom:10px;}
.contact-box p{color:var(--muted); font-size:14px; margin-bottom:22px;}
.contact-actions{display:flex; gap:12px; justify-content:center; flex-wrap:wrap;}

footer.site-footer{text-align:center; padding:26px 20px 90px; color:var(--muted); font-size:13px;}
footer.site-footer a{color:var(--muted);}

/* Sabit "Hemen Ara" butonu — dikkat çekici, sayfa girişinde animasyonlu */
.sabit-ara-wrap{
    position:fixed; right:18px; bottom:18px; z-index:1200;
    display:flex; align-items:center; gap:10px;
    animation: sabitAraGiris .6s cubic-bezier(.34,1.56,.64,1) .4s both;
}
.sabit-ara-buton{
    position:relative; width:60px; height:60px; border-radius:50%;
    background:var(--sabit-ara-renk); color:#fff; display:flex; align-items:center; justify-content:center;
    font-size:24px; text-decoration:none; box-shadow:0 6px 18px rgba(220,38,38,.5);
    animation: sabitAraNabiz 2.2s ease-in-out infinite;
}
.sabit-ara-buton i{position:relative; z-index:1;}
.sabit-ara-ping{
    position:absolute; inset:0; border-radius:50%; background:var(--sabit-ara-renk);
    animation: sabitAraPing 1.8s cubic-bezier(0,0,.2,1) infinite;
}
.sabit-ara-baloncuk{
    position:relative; display:inline-block;
    background:var(--ink); color:#fff; padding:13px 18px; border-radius:14px;
    font-size:16px; font-weight:800; line-height:1.3; white-space:nowrap;
    letter-spacing:.3px;
    border:2px solid var(--sabit-ara-renk);
    box-shadow:0 6px 20px rgba(0,0,0,.28), 0 0 0 4px rgba(220,38,38,.14);
    text-decoration:none; cursor:pointer;
    animation: sabitAraSallan 3.5s ease-in-out infinite 1.5s;
}
.sabit-ara-baloncuk:hover{background:#0a1626;}
.sabit-ara-baloncuk .sabit-ara-alt{
    display:block; margin-top:2px;
    font-size:.9em; font-weight:700; letter-spacing:0;
    color:#ffd9d9;
}
.sabit-ara-baloncuk::after{
    content:''; position:absolute; right:-16px; top:50%; transform:translateY(-50%);
    border:8px solid transparent; border-left-color:var(--sabit-ara-renk);
}

@keyframes sabitAraGiris{
    0%{transform:translateY(40px) scale(.7); opacity:0;}
    100%{transform:translateY(0) scale(1); opacity:1;}
}
@keyframes sabitAraNabiz{
    0%,100%{transform:scale(1);}
    50%{transform:scale(1.08);}
}
@keyframes sabitAraPing{
    0%{transform:scale(1); opacity:.55;}
    100%{transform:scale(1.9); opacity:0;}
}
@keyframes sabitAraSallan{
    0%,80%,100%{transform:translateX(0) rotate(0);}
    82%{transform:translateX(-3px) rotate(-2deg);}
    85%{transform:translateX(3px) rotate(2deg);}
    88%{transform:translateX(-3px) rotate(-2deg);}
    91%{transform:translateX(2px) rotate(1deg);}
    94%{transform:translateX(0) rotate(0);}
}

@media (max-width: 480px){
    .sabit-ara-wrap{right:14px; bottom:14px; gap:8px;}
    .sabit-ara-buton{width:56px; height:56px; font-size:22px;}
    /* Mobilde de belirgin dursun, ama ekranı kaplamasın */
    .sabit-ara-baloncuk{font-size:14px; padding:11px 14px; border-radius:12px;}
    .sabit-ara-baloncuk::after{right:-14px; border-width:7px;}
}

/* ---- Ana sayfa "İşlerimizden" galerisi ---- */
.galeri-grid{
    display:grid; gap:18px;
    grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
}
.galeri-kart{
    background:var(--card); border:1px solid var(--line); border-radius:12px;
    overflow:hidden; display:flex; flex-direction:column;
}
.galeri-kart a{display:block; line-height:0;}
.galeri-kart img{
    width:100%; height:auto; aspect-ratio:4/3; object-fit:cover;
    display:block; background:var(--bg);
    transition:transform .25s ease;
}
.galeri-kart a:hover img{transform:scale(1.04);}
.galeri-kart figcaption{padding:12px 14px; display:flex; flex-direction:column; gap:2px;}
.galeri-kart figcaption strong{font-size:14px; font-weight:800; color:var(--ink);}
.galeri-kart figcaption span{font-size:13px; color:var(--muted); line-height:1.45;}

@media (max-width: 480px){
    .galeri-grid{grid-template-columns:1fr 1fr; gap:12px;}
    .galeri-kart figcaption{padding:10px;}
    .galeri-kart figcaption strong{font-size:13px;}
    .galeri-kart figcaption span{font-size:12px;}
}

/* ==========================================================================
   BU PROJEYE ÖZEL EKLER
   Yukarısı izmir-teknik.com.tr'den alınan ortak tasarımdır (17.08.2026).
   Aşağısı yalnızca bu projede gereken parçalardır — üst blok değiştirilirse
   burası korunmalıdır.
   ========================================================================== */

/* Durum sayfaları: 404 ve "hazırlanıyor" */
.orta{min-height:60vh; display:flex; align-items:center; justify-content:center;
      text-align:center; padding:40px 20px;}
.orta h1{font-size:24px; margin-bottom:12px;}
.orta p{color:var(--muted); margin-bottom:18px;}

/* Cihaz/arıza kartlarındaki başlık linki */
.principle-card h3 a{color:inherit; text-decoration:none;}
.principle-card h3 a:hover{color:var(--accent); text-decoration:underline;}

/* ============================================================
   DERİN İÇERİK BLOKLARI — ilçe ana sayfası (#bilgi)
   veri şeridi → neden oluyor / ne yapılıyor
   ============================================================ */
.bilgi-blok{
    border:1px solid var(--line); border-radius:14px;
    padding:22px; margin-bottom:20px; background:var(--bg);
}
.bilgi-blok h3{
    font-size:20px; line-height:1.35; margin:0 0 10px;
}
.bilgi-blok h3 i{ color:var(--accent); margin-right:9px; }
.bilgi-ozet{
    color:var(--muted); max-width:78ch; margin:0 0 16px; font-size:15px;
}

/* Ölçülebilir dayanak şeridi */
.bilgi-veri{
    display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
    gap:10px; margin-bottom:20px;
}
.bilgi-veri-oge{
    background:var(--card); border:1px solid var(--line);
    border-radius:10px; padding:11px 13px;
    display:flex; flex-direction:column; gap:3px;
}
.bilgi-veri-ad{
    font-size:11.5px; text-transform:uppercase; letter-spacing:.4px;
    color:var(--muted); line-height:1.3;
}
.bilgi-veri-oge strong{ font-size:15px; color:var(--accent); line-height:1.3; }
.bilgi-veri-kaynak{ font-size:11.5px; color:var(--muted); opacity:.85; }

/* Neden / ne yapılıyor — iki sütun */
.bilgi-ikili{
    display:grid; grid-template-columns:1fr 1fr; gap:22px;
}
.bilgi-ikili h4{
    font-size:14px; text-transform:uppercase; letter-spacing:.5px;
    margin:0 0 12px; padding-bottom:8px; border-bottom:1px solid var(--line);
}
.bilgi-ikili h4 i{ margin-right:7px; color:var(--accent); }
.bilgi-madde{ margin-bottom:14px; }
.bilgi-madde strong{ display:block; font-size:14px; margin-bottom:3px; }
.bilgi-madde p{ margin:0; font-size:13.5px; color:var(--muted); line-height:1.65; }

.bilgi-link{ margin:16px 0 0; padding-top:14px; border-top:1px solid var(--line); font-size:13.5px; }
.bilgi-link a{ color:var(--accent); font-weight:600; }
.bilgi-link i{ font-size:11px; margin-left:3px; }

.bilgi-kaynak-not{
    font-size:12.5px; color:var(--muted); margin:4px 0 0; line-height:1.7;
}
.bilgi-kaynak-not i{ margin-right:5px; }

@media (max-width:760px){
    .bilgi-ikili{ grid-template-columns:1fr; gap:18px; }
    .bilgi-blok{ padding:17px; }
    .bilgi-blok h3{ font-size:17.5px; }
    .bilgi-veri{ grid-template-columns:1fr 1fr; gap:8px; }
}

/* Başlıktaki işletme adı — dar ekranda logo küçülür, yazı kırılmaz */
@media (max-width:420px){
}

/* ============================================================
   İÇİNDEKİLER — marka hub'ı ve blog yazıları
   Bölümler §26 gereği koşullu açıldığı için liste PHP'de üretilir;
   burada yalnızca görünüm var.
   ============================================================ */
.icindekiler{
    border:1px solid var(--line); border-left:3px solid var(--accent);
    border-radius:12px; padding:16px 20px; background:var(--card);
}
.icindekiler-baslik{
    margin:0 0 10px; font-size:13px; font-weight:800;
    text-transform:uppercase; letter-spacing:1px;
}
.icindekiler-baslik i{color:var(--accent); margin-right:7px;}
.icindekiler ol{margin:0; padding-left:20px; display:grid; gap:6px;}
.icindekiler li{font-size:14.5px;}
.icindekiler a{color:var(--ink); text-decoration:none;}
.icindekiler a:hover{color:var(--accent); text-decoration:underline;}

/* ============================================================
   BLOG — kart ve yazı gövdesi
   ============================================================ */
.yazi-kart{
    display:flex; flex-direction:column; gap:8px;
    border:1px solid var(--line); border-radius:12px; padding:16px 18px;
    background:var(--bg); text-decoration:none; color:var(--ink);
    transition:border-color .15s, transform .15s;
}
.yazi-kart:hover{border-color:var(--accent); transform:translateY(-2px);}
.yazi-kart strong{font-size:15.5px; line-height:1.35;}
.yazi-kart span{font-size:13.5px; color:var(--muted); line-height:1.6;}
.yazi-kart em{font-size:12px; color:var(--muted); font-style:normal; letter-spacing:.3px;}

.yazi-govde{max-width:72ch;}
.yazi-govde h2{
    font-size:21px; line-height:1.35; margin:26px 0 10px;
    padding-top:14px; border-top:1px solid var(--line);
}
.yazi-govde p{margin:0 0 13px; font-size:15.5px; line-height:1.75; color:var(--ink);}
.yazi-govde ul{margin:0 0 15px; padding-left:22px;}
.yazi-govde li{margin-bottom:8px; font-size:15px; line-height:1.7; color:var(--muted);}
.yazi-not{
    background:var(--card); border-left:3px solid var(--accent);
    border-radius:0 8px 8px 0; padding:11px 15px !important;
    font-size:14px !important; color:var(--muted) !important;
}
.yazi-not i{color:var(--accent); margin-right:7px;}

@media (max-width:760px){
    .yazi-govde h2{font-size:18.5px;}
    .yazi-govde p{font-size:15px;}
    .icindekiler{padding:14px 16px;}
}

/* ============================================================
   BLOG IZGARASI — marka ana sayfası (#blog)
   İlk yazı "öne çıkan": geniş ekranda iki sütun kaplar ve görsel
   yanda durur. Kalanlar üç sütunlu ızgarada.
   ============================================================ */
.blog-izgara{
    display:grid; gap:16px;
    grid-template-columns:repeat(auto-fit, minmax(258px, 1fr));
}
.blog-kart{
    display:flex; flex-direction:column;
    background:var(--bg); border:1px solid var(--line); border-radius:14px;
    overflow:hidden; text-decoration:none; color:var(--ink);
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.blog-kart:hover{
    transform:translateY(-3px);
    border-color:var(--accent);
    box-shadow:0 10px 26px rgba(15,76,129,.13);
}

.blog-kart-gorsel{position:relative; overflow:hidden; background:var(--line);}
/* ⚠ picture de blok olmalı — inline kalırsa altında satır boşluğu bırakıyor */
.blog-kart-gorsel picture{display:block; line-height:0;}
.blog-kart-gorsel img{
    display:block; width:100%; height:148px; object-fit:cover;
    transition:transform .35s ease;
}
.blog-kart:hover .blog-kart-gorsel img{transform:scale(1.05);}

/* Kategori rozeti — görselin üstünde */
.blog-etiket{
    position:absolute; left:12px; top:12px;
    background:var(--accent); color:#fff;
    font-size:11.5px; font-weight:800; letter-spacing:.7px;
    text-transform:uppercase; padding:5px 11px; border-radius:999px;
}

.blog-kart-govde{
    display:flex; flex-direction:column; gap:8px;
    padding:15px 17px 16px; flex:1;
}
.blog-kart-govde h3{font-size:16px; line-height:1.4; margin:0;}
.blog-kart-govde p{margin:0; font-size:13.5px; line-height:1.65; color:var(--muted); flex:1;}

.blog-kart-alt{
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    padding-top:11px; margin-top:2px; border-top:1px solid var(--line);
    font-size:12.5px; color:var(--muted);
}
.blog-kart-alt i{margin-right:5px;}
.blog-oku{color:var(--accent); font-weight:700; white-space:nowrap;}
.blog-oku i{margin:0 0 0 4px; transition:transform .18s ease;}
.blog-kart:hover .blog-oku i{transform:translateX(4px);}

/* Öne çıkan yazı */
@media (min-width:900px){
    .blog-izgara{grid-template-columns:repeat(3, 1fr);}
    .blog-kart--one{
        grid-column:span 2; flex-direction:row;
    }
    .blog-kart--one .blog-kart-gorsel{width:46%; flex-shrink:0;}
    .blog-kart--one .blog-kart-gorsel img{height:100%; min-height:198px;}
    .blog-kart--one .blog-kart-govde{padding:22px 24px; justify-content:center;}
    .blog-kart--one .blog-kart-govde h3{font-size:20px;}
    .blog-kart--one .blog-kart-govde p{font-size:14.5px;}
}

/* Tümünü gör düğmesi */
.blog-tumu{
    display:inline-flex; align-items:center; gap:8px;
    padding:11px 22px; border-radius:999px;
    border:1.5px solid var(--accent); color:var(--accent);
    font-weight:700; font-size:14px; text-decoration:none;
    transition:background .16s ease, color .16s ease;
}
.blog-tumu:hover{background:var(--accent); color:#fff;}
.blog-tumu i{transition:transform .18s ease;}
.blog-tumu:hover i{transform:translateX(4px);}

@media (max-width:520px){
    .blog-kart-gorsel img{height:140px;}
}