/* Blog liste şablonu (/blog/, /blog/kategori/x/, /blog/etiket/x/) — v2 kurumsal çizgi, ortak.css üstüne */

/* ─── hero ─── */
.bl-hero{padding:48px 0 40px;background:linear-gradient(180deg,#fff 0%,var(--zemin-2) 100%);text-align:center}
.bl-iz{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;align-items:center;font-size:13.5px;color:var(--soluk-2);margin:0 0 22px;padding:0;list-style:none}
.bl-iz li{display:flex;align-items:center;gap:8px}
.bl-iz li + li::before{content:"/";color:#CFCBE0}
.bl-iz a:hover{color:var(--indigo)}
.bl-iz [aria-current]{color:var(--soluk)}
.bl-hero h1{font:800 clamp(34px,4.4vw,54px)/1.1 "Figtree";letter-spacing:-.03em;margin:0 auto 16px;max-width:17em}
.bl-hero p.giris{font-size:18px;color:var(--soluk);margin:0 auto 28px;max-width:36em}
.bl-hero p.giris b{color:var(--ink-2);font-weight:600}

/* arama */
.bl-arama{position:relative;max-width:560px;margin:0 auto 28px}
.bl-arama svg{position:absolute;left:18px;top:50%;width:20px;height:20px;transform:translateY(-50%);color:var(--soluk-2);pointer-events:none}
.bl-arama input{width:100%;height:54px;padding:0 48px 0 50px;font:500 16px/1 "Figtree";color:var(--ink);background:#fff;border:1px solid var(--cizgi);border-radius:12px;box-shadow:var(--golge);-webkit-appearance:none;appearance:none}
.bl-arama input::placeholder{color:var(--soluk-2)}
.bl-arama input:focus{outline:none;border-color:var(--indigo);box-shadow:0 0 0 3px rgba(79,57,232,.18),var(--golge)}
.bl-arama input::-webkit-search-cancel-button{display:none}
.bl-temizle{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:38px;height:38px;border:0;border-radius:9px;background:none;color:var(--soluk);cursor:pointer;display:grid;place-items:center}
.bl-temizle:hover{background:var(--zemin-2);color:var(--ink)}
.bl-temizle[hidden]{display:none}
.bl-temizle svg{position:static;transform:none;width:18px;height:18px;color:currentColor}

.gizli-etiket{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* kategori çipleri */
.bl-cipler{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;list-style:none;margin:0;padding:0}
.bl-cipler a{display:inline-flex;align-items:center;gap:7px;font-size:14.5px;font-weight:600;color:var(--ink-2);background:#fff;border:1px solid var(--cizgi);border-radius:999px;padding:9px 15px;transition:border-color .15s,color .15s,background .15s}
.bl-cipler a small{font-size:12.5px;font-weight:600;color:var(--soluk-2)}
.bl-cipler a:hover{border-color:#CFC6FB;color:var(--indigo)}
.bl-cipler a[aria-current="page"]{background:var(--ink);border-color:var(--ink);color:#fff}
.bl-cipler a[aria-current="page"] small{color:#B9B5D6}

/* ─── liste bölümü ─── */
.bl-liste{padding:24px 0 88px;background:var(--zemin-2)}
.bl-liste-bas{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.bl-liste-bas h2{font:700 21px/1.3 "Figtree";letter-spacing:-.01em;margin:0}
.bl-liste-bas p{margin:0;font-size:14.5px;color:var(--soluk)}
.bl-geri{display:inline-flex;align-items:center;gap:8px;color:var(--indigo);font-weight:600;font-size:15px}
.bl-geri::before{content:"←";transition:transform .15s}
.bl-geri:hover::before{transform:translateX(-4px)}

/* öne çıkan (en yeni) yazı */
.bl-one{position:relative;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:0;background:#fff;border:1px solid var(--cizgi);border-radius:18px;overflow:hidden;box-shadow:var(--golge);margin-bottom:40px;transition:box-shadow .2s,border-color .2s}
.bl-one:hover{box-shadow:var(--golge-buyuk);border-color:#D9D2FB}
.bl-one{align-items:center}
.bl-one .bl-kapak{margin:20px 0 20px 20px;border-radius:12px}
.bl-one .bl-kapak img{aspect-ratio:1200/630}
.bl-one .bl-govde{padding:32px 40px 32px 36px;justify-content:center}
.bl-one-etiket{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;font-size:13px;font-weight:600;color:var(--indigo-koyu);background:var(--indigo-acik);padding:6px 11px;border-radius:999px;margin-bottom:16px}
.bl-one-etiket i{width:7px;height:7px;border-radius:50%;background:var(--indigo)}
.bl-one h2{font:800 clamp(24px,2.5vw,32px)/1.18 "Figtree";letter-spacing:-.02em;margin:6px 0 14px}
.bl-one .bl-ozet{font-size:16px;-webkit-line-clamp:4;margin-bottom:20px}
.bl-one .bl-meta{margin-top:0;margin-bottom:22px}
.bl-one .link-ok{align-self:flex-start}

/* ızgara kartları */
.bl-izgara{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;list-style:none;margin:0;padding:0}
.bl-kart{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--cizgi);border-radius:16px;overflow:hidden;transition:box-shadow .2s,transform .2s,border-color .2s}
.bl-kart:hover{box-shadow:var(--golge);transform:translateY(-2px);border-color:#D9D2FB}
.bl-kart[hidden]{display:none}
.bl-kapak{display:block;background:var(--indigo-acik);overflow:hidden}
.bl-kapak img{width:100%;height:100%;aspect-ratio:1200/630;object-fit:cover;transition:transform .4s}
.bl-kart:hover .bl-kapak img,.bl-one:hover .bl-kapak img{transform:scale(1.025)}
.bl-govde{display:flex;flex-direction:column;flex:1;padding:20px 22px 22px}
.bl-kat{position:relative;z-index:2;align-self:flex-start;font-size:13px;font-weight:600;color:var(--indigo);margin-bottom:8px}
.bl-kat:hover{text-decoration:underline;text-underline-offset:3px}
.bl-kart h3{font-size:18px;line-height:1.32;font-weight:700;letter-spacing:-.01em;margin:0 0 10px}
.bl-kart h3 a::after,.bl-one h2 a::after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit}
.bl-kart h3 a:focus-visible,.bl-one h2 a:focus-visible{outline:none}
.bl-kart:has(h3 a:focus-visible),.bl-one:has(h2 a:focus-visible){outline:3px solid var(--indigo);outline-offset:3px}
.bl-ozet{margin:0 0 18px;font-size:15px;line-height:1.6;color:var(--soluk);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.bl-meta{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;font-size:13.5px;color:var(--soluk-2)}
.bl-meta span{display:inline-flex;align-items:center;gap:6px}
.bl-meta svg{width:15px;height:15px;flex:none}

/* arama sonucu durumları */
.bl-sonuc{margin:0 0 18px;font-size:14.5px;color:var(--soluk)}
.bl-sonuc:empty{display:none}
.bl-bos{text-align:center;background:#fff;border:1px dashed #D6D1EA;border-radius:16px;padding:48px 24px}
.bl-bos[hidden]{display:none}
.bl-bos b{display:block;font-size:18px;margin-bottom:6px}
.bl-bos p{margin:0 0 18px;color:var(--soluk)}

/* ─── konular (etiketler) ─── */
.bl-konular{padding:72px 0 88px;background:#fff}
.bl-konular .bolum-bas{margin-bottom:28px}
.bl-konular .bolum-bas h2{font:800 clamp(26px,3vw,34px)/1.15 "Figtree";letter-spacing:-.02em;margin:0 0 10px}
.bl-konular .bolum-bas p{margin:0 auto;max-width:36em;color:var(--soluk)}
.bl-etiketler{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;list-style:none;margin:0 auto;padding:0;max-width:960px}
.bl-etiketler a{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:500;color:var(--ink-2);background:var(--zemin-2);border:1px solid var(--cizgi);border-radius:8px;padding:7px 12px}
.bl-etiketler a small{font-size:12px;color:var(--soluk-2);font-weight:600}
.bl-etiketler a:hover{color:var(--indigo);border-color:#CFC6FB;background:#fff}
.bl-etiketler a[aria-current="page"]{background:var(--indigo);border-color:var(--indigo);color:#fff}
.bl-etiketler a[aria-current="page"] small{color:#DCD6FF}

@media (max-width:1060px){
  .bl-izgara{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bl-one{grid-template-columns:minmax(0,1fr)}
  .bl-one .bl-kapak{margin:16px 16px 0}
  .bl-one .bl-govde{padding:28px 28px 30px}
}
@media (max-width:640px){
  .bl-hero{padding:32px 0 28px}
  .bl-hero p.giris{font-size:16.5px}
  .bl-cipler a{font-size:14px;padding:8px 13px}
  .bl-liste{padding:16px 0 64px}
  .bl-izgara{grid-template-columns:minmax(0,1fr);gap:16px}
  .bl-one{margin-bottom:28px;border-radius:16px}
  .bl-one .bl-govde{padding:22px 20px 24px}
  .bl-one .bl-ozet{-webkit-line-clamp:5}
  .bl-govde{padding:18px 18px 20px}
  .bl-konular{padding:56px 0 64px}
}
@media (prefers-reduced-motion:reduce){
  .bl-kart:hover,.bl-kart:hover .bl-kapak img,.bl-one:hover .bl-kapak img{transform:none}
}