/* =============================================================================
   BLOG — assets/css/blog.css  ·  v1 (13.10.2026)
   inc/blog.php (liste) + inc/blog-detay.php (yazi). Sadece bu iki sayfada
   yuklenir (index.php). theme.css token'larini ve hm-sayfa.css butonlarini
   (hm-sf__btn) kullanir. Onek: hb- ("blog").
   MOBIL ONCELIKLI: taban kurallar telefon icin; genislik arttikca
   min-width sorgulariyla zenginlesir (576 / 768 / 1080 / 1280).
   ========================================================================== */

.hb{background:#fff;--hb-link:#B93C0F;}  /* turuncunun AA kontrastli koyusu (beyazda 5,6:1) */
.hb .container{padding-left:var(--s2);padding-right:var(--s2);}

/* breadcrumb: <ol><li> yapisi icin ayirici */
.hb .hm-crumb li{display:inline-flex;align-items:center;min-width:0;color:var(--c-slate);font-weight:600;}
.hb .hm-crumb li + li::before{
    content:'';display:inline-block;width:5px;height:5px;margin:0 8px 0 3px;
    border-top:1.5px solid #C4CBD2;border-right:1.5px solid #C4CBD2;transform:rotate(45deg);
}
.hb .hm-crumb li[aria-current]{min-width:0;flex:1 1 0;}
.hb .hm-crumb li[aria-current] span{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* --- ortak parcalar -------------------------------------------------------- */
.hb-etiket{
    display:inline-flex;align-items:center;
    padding:4px 10px;border-radius:var(--r-pill);
    background:#FFF1EC;color:var(--hb-link)!important;
    font-size:12px;font-weight:700;letter-spacing:.01em;line-height:1.4;
    text-decoration:none;
}
a.hb-etiket:hover{background:#FFE3D8;}
.hb-meta{
    display:flex;flex-wrap:wrap;align-items:center;gap:6px;
    margin:0;color:var(--c-muted);font-size:13px;font-weight:500;line-height:1.5;
}

/* =============================================================================
   LISTE
   ========================================================================== */
.hb-liste{padding-top:var(--s3);padding-bottom:var(--s6);}
.hb-liste__bas{max-width:720px;margin-bottom:var(--s3);}
.hb-liste__h1{margin:0 0 var(--s1);font-size:28px;line-height:1.2;font-weight:800;letter-spacing:-.01em;}
.hb-liste__lead{margin:0;color:var(--c-muted);font-size:15px;line-height:1.6;}

/* konu cipleri — mobilde yatay kaydirilir, satir kirmaz */
.hb-cipler{
    display:flex;gap:var(--s1);
    margin:0 calc(var(--s2) * -1) var(--s3);padding:0 var(--s2) 4px;
    overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.hb-cipler::-webkit-scrollbar{display:none;}
.hb-cip{
    flex:0 0 auto;min-height:40px;padding:8px 16px;
    border:1px solid var(--c-border);border-radius:var(--r-pill);background:#fff;
    color:var(--c-slate);font:600 14px/1.2 var(--font);cursor:pointer;
    transition:border-color .15s, background .15s, color .15s;
}
.hb-cip:hover{border-color:var(--c-orange);color:var(--c-orange);}
.hb-cip:focus-visible{outline:2px solid var(--c-orange);outline-offset:2px;}
.hb-cip.is-secili{background:var(--c-slate);border-color:var(--c-slate);color:#fff;}

/* kart izgarasi */
.hb-grid{display:grid;grid-template-columns:1fr;gap:var(--s3);}
.hb-kart{min-width:0;}
.hb-kart[hidden]{display:none;}
.hb-kart__link{
    display:flex;flex-direction:column;height:100%;
    border:1px solid var(--c-border);border-radius:var(--r-lg);background:#fff;
    overflow:hidden;text-decoration:none;color:inherit;
    transition:border-color .18s, box-shadow .18s, transform .18s;
}
.hb-kart__link:hover{border-color:#D6DBE1;box-shadow:0 8px 24px rgba(37,61,78,.08);transform:translateY(-2px);}
.hb-kart__link:focus-visible{outline:2px solid var(--c-orange);outline-offset:3px;}
.hb-kart__gorsel{position:relative;aspect-ratio:16/9;background:var(--c-bg);overflow:hidden;}
.hb-kart__gorsel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s;}
.hb-kart__link:hover .hb-kart__gorsel img{transform:scale(1.03);}
.hb-kart__bos{
    position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg,#FFF1EC 0%,#F6F7F9 100%);
    color:var(--c-orange);font-size:44px;font-weight:800;
}
.hb-kart__govde{display:flex;flex-direction:column;gap:var(--s1);flex:1;padding:var(--s2);}
.hb-kart__govde .hb-etiket{align-self:flex-start;}
.hb-kart__h{
    margin:0;font-size:17px;line-height:1.35;font-weight:700;color:var(--c-slate);
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.hb-kart__link:hover .hb-kart__h{color:var(--c-orange);}
.hb-kart__ozet{
    margin:0;color:var(--c-muted);font-size:14px;line-height:1.55;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.hb-kart__govde .hb-meta{margin-top:auto;padding-top:4px;}
.hb-kart__oku{
    display:inline-flex;align-items:center;gap:6px;margin-top:var(--s1);
    color:var(--hb-link);font-weight:700;font-size:14px;
}
.hb-kart__oku svg,.hb-urunler__tum svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}

.hb-sonuc-yok{margin:var(--s3) 0 0;color:var(--c-muted);text-align:center;}
.hb-bos{text-align:center;}
.hb-bos__form{display:flex;flex-direction:column;gap:var(--s1);max-width:420px;margin:var(--s2) auto 0;}

/* =============================================================================
   YAZI
   ========================================================================== */
.hb-yazi{padding-top:var(--s3);}
.hb-yazi__bas{max-width:760px;}
.hb-yazi__bas .hb-etiket{margin-bottom:var(--s2);}
.hb-yazi__h1{
    margin:0 0 var(--s2);
    font-size:28px;line-height:1.2;font-weight:800;letter-spacing:-.015em;color:var(--c-slate);
    overflow-wrap:anywhere;
}
.hb-yazi__ozet{margin:0 0 var(--s2);color:#4B5866;font-size:17px;line-height:1.6;}
.hb-yazi__kapak{
    margin:var(--s3) calc(var(--s2) * -1) 0;
    background:var(--c-bg);overflow:hidden;
}
.hb-yazi__kapak img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;}

.hb-yazi__duzen{display:block;margin-top:var(--s3);}
.hb-yazi__ana{min-width:0;}
.hb-yazi__yan{display:none;}

/* icindekiler — mobil: acilir kutu */
.hb-toc{border:1px solid var(--c-border);border-radius:var(--r-md);background:var(--c-bg);}
.hb-toc--mobil{margin-bottom:var(--s3);}
.hb-toc--mobil summary{
    display:flex;align-items:center;justify-content:space-between;gap:var(--s1);
    min-height:48px;padding:12px var(--s2);
    font-weight:700;color:var(--c-slate);cursor:pointer;list-style:none;
}
.hb-toc--mobil summary::-webkit-details-marker{display:none;}
.hb-toc--mobil summary span{color:var(--c-muted);font-weight:500;font-size:13px;}
.hb-toc--mobil summary::after{
    content:'';width:8px;height:8px;margin-left:auto;
    border-right:2px solid var(--c-slate);border-bottom:2px solid var(--c-slate);
    transform:rotate(45deg) translateY(-2px);transition:transform .2s;
}
.hb-toc--mobil[open] summary::after{transform:rotate(-135deg) translateY(-2px);}
.hb-toc ol{margin:0;padding:0 var(--s2) var(--s2) 34px;}
.hb-toc li{margin:0 0 6px;padding-left:2px;color:var(--c-muted);font-size:14px;line-height:1.45;}
.hb-toc a{color:var(--c-slate);text-decoration:none;}
.hb-toc a:hover{color:var(--c-orange);text-decoration:underline;}

/* --- yazi govdesi (admin editorunden gelen HTML) --- */
.hb-prose{
    color:#33424F;font-size:16.5px;line-height:1.75;
    overflow-wrap:break-word;
}
.hb-prose > *:first-child{margin-top:0;}
.hb-prose p{margin:0 0 1.1em;}
.hb-prose h2{
    margin:1.9em 0 .6em;scroll-margin-top:96px;
    font-size:22px;line-height:1.3;font-weight:800;letter-spacing:-.01em;color:var(--c-slate);
}
.hb-prose h3{margin:1.5em 0 .5em;scroll-margin-top:96px;font-size:18px;line-height:1.35;font-weight:700;color:var(--c-slate);}
.hb-prose h4{margin:1.3em 0 .4em;font-size:16.5px;font-weight:700;color:var(--c-slate);}
.hb-prose a{color:var(--hb-link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;font-weight:600;}
.hb-prose a:hover{color:var(--c-orange);}
.hb-prose strong,.hb-prose b{color:var(--c-slate);font-weight:700;}
.hb-prose ul,.hb-prose ol{margin:0 0 1.1em;padding-left:1.3em;}
.hb-prose li{margin-bottom:.45em;padding-left:.2em;}
.hb-prose li::marker{color:var(--c-orange);font-weight:700;}
.hb-prose img{max-width:100%;height:auto;border-radius:var(--r-md);margin:.4em 0 1.2em;}
.hb-prose figure{margin:0 0 1.2em;}
.hb-prose figcaption{color:var(--c-muted);font-size:13px;margin-top:-.6em;}
.hb-prose blockquote{
    margin:1.4em 0;padding:var(--s2) var(--s2) var(--s2) 20px;
    border-left:4px solid var(--c-orange);border-radius:0 var(--r-md) var(--r-md) 0;
    background:#FFF7F3;color:var(--c-slate);font-weight:500;
}
.hb-prose blockquote p:last-child{margin-bottom:0;}
.hb-prose hr{border:0;border-top:1px solid var(--c-border);margin:2em 0;}
.hb-tablo{margin:0 0 1.3em;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--c-border);border-radius:var(--r-md);}
.hb-prose table{width:100%;min-width:520px;border-collapse:collapse;font-size:14.5px;line-height:1.5;}
.hb-prose th,.hb-prose td{padding:10px 12px;border-bottom:1px solid var(--c-border);text-align:left;vertical-align:top;}
.hb-prose th{background:var(--c-bg);color:var(--c-slate);font-weight:700;}
.hb-prose tr:last-child td{border-bottom:0;}
.hb-prose iframe{max-width:100%;}

/* --- yazi ici teklif kutusu --- */
.hb-ara-cta{
    display:grid;grid-template-columns:auto 1fr;gap:12px var(--s2);align-items:center;
    margin:2em 0;padding:var(--s2);
    border:1px solid #FBD5C6;border-radius:var(--r-lg);background:#FFF7F3;
}
.hb-ara-cta > svg{width:36px;height:36px;padding:8px;border-radius:50%;background:#fff;fill:none;stroke:var(--c-orange);stroke-width:1.8;stroke-linecap:round;}
.hb-ara-cta strong{display:block;color:var(--c-slate);font-size:15.5px;line-height:1.35;}
.hb-ara-cta span{display:block;color:var(--c-muted);font-size:14px;line-height:1.5;}
.hb-ara-cta .hm-sf__btn{grid-column:1 / -1;justify-self:stretch;}

/* --- urun bloklari (yazi ici + yazi sonu) --- */
.hb-urunler{margin:2.2em 0;}
.hb-urunler__bas{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s2);margin-bottom:var(--s2);}
.hb-urunler__ust{margin:0 0 4px;color:var(--hb-link);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;}
.hb-urunler__h{margin:0;font-size:20px;line-height:1.3;font-weight:800;color:var(--c-slate);letter-spacing:-.01em;}
.hb-urunler__alt{margin:4px 0 0;color:var(--c-muted);font-size:14px;}
.hb-urunler__tum{
    display:inline-flex;align-items:center;gap:4px;flex:0 0 auto;
    color:var(--hb-link);font-weight:700;font-size:14px;text-decoration:none;white-space:nowrap;
}
.hb-urunler__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.hb-urunler__grid > .hm-pc{margin-bottom:0;}
.hb-urunler__grid .hm-pc__chip:nth-child(n+3){display:none;}
/* yazi ici blok, telefonda: yana kayan serit (yaziyi uzatmaz, kaydirilabildigi gorunur) */
@media (max-width:767px){
    .hb-urunler--serit .hb-urunler__grid{
        grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:46%;
        overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
        margin:0 calc(var(--s2) * -1);padding:0 var(--s2) 6px;scroll-padding:0 var(--s2);
        scrollbar-width:none;
    }
    .hb-urunler--serit .hb-urunler__grid::-webkit-scrollbar{display:none;}
    .hb-urunler--serit .hm-pc{scroll-snap-align:start;}
}

/* --- alt teklif bandi --- */
.hb-cta{
    display:flex;flex-direction:column;gap:var(--s2);
    margin:var(--s5) 0;padding:var(--s3) var(--s2);
    border-radius:var(--r-lg);background:var(--c-slate);color:#fff;
}
.hb-cta h2{margin:0 0 6px;color:#fff;font-size:20px;line-height:1.3;font-weight:800;}
.hb-cta p{margin:0;color:#C9D3DC;font-size:15px;line-height:1.55;}
.hb-cta .hm-sf__btnler .hm-sf__btn{flex:1 1 180px;}
.hb-cta .hm-sf__btn--ikincil{background:transparent;border-color:rgba(255,255,255,.35);color:#fff!important;}
.hb-cta .hm-sf__btn--ikincil:hover{border-color:#fff;color:#fff!important;background:rgba(255,255,255,.08);}

/* --- ilgili yazilar --- */
.hb-ilgili{margin:0 0 var(--s6);}
.hb-ilgili__h{margin:0 0 var(--s2);font-size:20px;font-weight:800;color:var(--c-slate);}
.hb-ilgili .hb-kart__h{font-size:16px;}

/* --- yan sutun --- */
.hb-yan-cta{
    padding:var(--s3);border:1px solid var(--c-border);border-radius:var(--r-lg);background:#fff;
}
.hb-yan-cta__h{margin:0 0 6px;color:var(--c-slate);font-size:17px;font-weight:800;}
.hb-yan-cta p{margin:0 0 var(--s2);color:var(--c-muted);font-size:14px;line-height:1.55;}
.hb-yan-cta .hm-sf__btn + .hm-sf__btn{margin-top:var(--s1);}

/* =============================================================================
   GENISLEYEN EKRANLAR
   ========================================================================== */
@media (min-width:576px){
    .hb-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
    .hb-ara-cta{grid-template-columns:auto 1fr auto;}
    .hb-ara-cta .hm-sf__btn{grid-column:auto;}
    .hb-yazi__kapak{margin-left:0;margin-right:0;border-radius:var(--r-lg);}
}

@media (min-width:768px){
    .hb .container{padding-left:var(--s3);padding-right:var(--s3);}
    .hb-liste{padding-top:var(--s5);}
    .hb-liste__h1{font-size:36px;}
    .hb-liste__lead{font-size:17px;}
    .hb-cipler{flex-wrap:wrap;overflow:visible;margin-left:0;margin-right:0;padding:0;}
    .hb-kart--one{grid-column:1 / -1;}
    .hb-kart--one .hb-kart__link{flex-direction:row;}
    .hb-kart--one .hb-kart__gorsel{flex:0 0 55%;aspect-ratio:auto;min-height:300px;}
    .hb-kart--one .hb-kart__govde{padding:var(--s4);justify-content:center;}
    .hb-kart--one .hb-kart__h{font-size:26px;line-height:1.25;}
    .hb-kart--one .hb-kart__ozet{font-size:15.5px;-webkit-line-clamp:4;}
    .hb-kart--one .hb-meta{margin-top:var(--s1);}

    .hb-yazi{padding-top:var(--s5);}
    .hb-yazi__h1{font-size:40px;}
    .hb-yazi__ozet{font-size:19px;}
    .hb-prose{font-size:17.5px;}
    .hb-prose h2{font-size:27px;}
    .hb-prose h3{font-size:20px;}
    .hb-urunler__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2);}
    .hb-cta{flex-direction:row;align-items:center;justify-content:space-between;padding:var(--s4);}
    .hb-cta__metin{max-width:560px;}
    .hb-cta .hm-sf__btnler{flex:0 0 auto;}
    .hb-cta .hm-sf__btnler .hm-sf__btn{flex:0 0 auto;}
}

@media (min-width:1080px){
    .hb-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
    .hb-yazi__duzen{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--s7);align-items:start;}
    .hb-yazi__ana{max-width:740px;}
    .hb-yazi__yan{display:flex;flex-direction:column;gap:var(--s3);position:sticky;top:96px;}
    .hb-toc--mobil{display:none;}
    .hb-toc--yan{padding:var(--s2) 0 var(--s1);background:#fff;}
    .hb-toc__h{margin:0 0 var(--s1);padding:0 var(--s2);color:var(--c-slate);font-weight:800;font-size:14px;letter-spacing:.04em;text-transform:uppercase;}
    .hb-toc--yan ol{max-height:52vh;overflow-y:auto;padding-right:var(--s2);}
    .hb-toc--yan a.is-aktif{color:var(--hb-link);font-weight:700;}
    .hb-yazi__kapak img{aspect-ratio:21/9;}
    /* yazi ici urun blogu ana sutunda 3'lu; yazi sonu tam genislikte 4'lu */
    .hb > .container > .hb-urunler .hb-urunler__grid{grid-template-columns:repeat(4,minmax(0,1fr));}
}

@media (prefers-reduced-motion:reduce){
    .hb-kart__link,.hb-kart__gorsel img,.hb-toc--mobil summary::after{transition:none;}
    .hb-kart__link:hover{transform:none;}
    .hb-kart__link:hover .hb-kart__gorsel img{transform:none;}
}