/* Haberler (site-haber.js): ana sayfada manşet + sekmeli yan kutu (tek koyu panel), haber kartları, haber sayfası, liste.
   Renkler logodan: koyu zemin, altın vurgu. Her haber görselinin sağ alt köşesinde Kayseri Turkiye logosu. */

.hb-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:16px}
.hb-hd h2{margin:0;font-size:clamp(24px,2.6vw,30px);letter-spacing:-.015em}

/* ---------- görsel katmanı (her yerde aynı) ---------- */
.hb-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hb-bos{background:linear-gradient(135deg,var(--k),#0E0F13)}
.hb-wm{position:absolute;right:14px;bottom:14px;z-index:3;border-radius:50%;box-shadow:0 1px 6px rgb(0 0 0 / .4);pointer-events:none}
.hb-temsili{position:absolute;right:12px;top:12px;z-index:3;padding:3px 8px;border-radius:6px;background:rgb(10 12 14 / .55);
  color:rgb(255 255 255 / .85);font-size:10.5px;font-weight:600;letter-spacing:.02em;backdrop-filter:blur(6px)}
.hb-rakam{position:absolute;left:14px;top:50px;z-index:3;display:grid;padding:8px 12px;border-radius:12px;background:rgb(10 12 14 / .62);
  color:#fff;font-size:12px;line-height:1.3;max-width:60%;backdrop-filter:blur(8px)}
.hb-rakam b{font-size:26px;line-height:1.05;font-weight:800;color:var(--gold)}

.hb-et{display:inline-flex;align-items:center;gap:5px;padding:4px 10px 4px 8px;border-radius:999px;font-size:11.5px;font-weight:700;
  background:var(--k);color:#fff;line-height:1.3;white-space:nowrap;box-shadow:0 2px 8px rgb(0 0 0 / .18)}
.hb-et .ic{width:13px;height:13px}
.hb-s-ust{position:absolute;left:14px;top:14px;z-index:3}

/* ---------- ana panel: manşet + sekmeli kutu ---------- */
.hb-panel{display:grid;grid-template-columns:minmax(0,1.72fr) minmax(0,1fr);border-radius:22px;overflow:hidden;background:#0E0F13;color:#fff;
  box-shadow:0 24px 50px -28px rgb(10 12 16 / .55)}
.hb-manset,.hb-yan,.hb-yan-kutu{min-width:0;display:flex;flex-direction:column}
.hb-yan{border-left:1px solid rgb(255 255 255 / .08)}
.hb-yan-kutu{flex:1}
.hb-sl{position:relative;isolation:isolate;overflow:hidden;background:#1B1F23}
.hb-manset .hb-sl{aspect-ratio:16/9}
.hb-yan .hb-sl{flex:1;min-height:240px}
.hb-s{position:absolute;inset:0;display:block;color:#fff;opacity:0;visibility:hidden;transition:opacity .4s ease,visibility 0s .4s}
.hb-s.on{opacity:1;visibility:visible;transition:opacity .4s ease}
.hb-s .hb-img{transition:transform .8s ease}
.hb-s:hover .hb-img{transform:scale(1.025)}
.hb-s::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to top,rgb(8 10 12 / .92) 0%,rgb(8 10 12 / .6) 32%,rgb(8 10 12 / 0) 62%),linear-gradient(to bottom,rgb(8 10 12 / .35),transparent 22%)}
.hb-s-y{position:absolute;inset:auto 0 0;z-index:2;display:grid;gap:8px;padding:0 64px 20px 24px}
.hb-s-y b{font-size:clamp(20px,2.1vw,27px);line-height:1.22;font-weight:780;letter-spacing:-.012em;text-wrap:balance;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hb-s-y small{font-size:12.5px;color:rgb(255 255 255 / .72)}
.hb-yan .hb-s-y{padding:0 56px 16px 18px}
.hb-yan .hb-s-y b{font-size:18px;line-height:1.28}
.hb-s:focus-visible{outline:3px solid var(--gold);outline-offset:-3px}

/* numara şeridi: görselin altına yapışık */
.hb-no{display:flex;align-items:center;gap:8px;height:52px;padding:0 10px 0 14px;background:#0E0F13;border-top:1px solid rgb(255 255 255 / .08)}
.hb-no-ic{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0}
.hb-no-ic::-webkit-scrollbar{display:none}
.hb-no-ic button{flex:none;min-width:30px;height:30px;padding:0 6px;border-radius:8px;border:0;background:transparent;
  color:rgb(255 255 255 / .62);font:700 13px/1 var(--f-body);cursor:pointer;transition:background .15s,color .15s}
.hb-no-ic button:hover{background:rgb(255 255 255 / .1);color:#fff}
.hb-no-ic button.on{background:var(--gold);color:#111315}
.hb-ileri{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid rgb(255 255 255 / .18);
  background:transparent;color:#fff;cursor:pointer}
.hb-ileri:hover{background:var(--gold);border-color:var(--gold);color:#111315}
.hb-ileri .ic{width:15px;height:15px}

/* sekmeler: kutunun üstüne yapışık */
.hb-sekme{display:flex;flex:none;height:52px;border-bottom:1px solid rgb(255 255 255 / .08);overflow-x:auto;scrollbar-width:none}
.hb-sekme::-webkit-scrollbar{display:none}
.hb-sekme button{flex:1 0 auto;position:relative;padding:0 16px;border:0;background:none;color:rgb(255 255 255 / .6);
  font:700 14px/1 var(--f-body);cursor:pointer}
.hb-sekme button:hover{color:#fff}
.hb-sekme button[aria-selected="true"]{color:#fff}
.hb-sekme button[aria-selected="true"]::after{content:"";position:absolute;left:16px;right:16px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--gold)}

@media (max-width:900px){
  .hb-panel{grid-template-columns:minmax(0,1fr)}
  .hb-yan{border-left:0;border-top:1px solid rgb(255 255 255 / .08)}
  .hb-yan .hb-sl{flex:none;aspect-ratio:16/10;min-height:0}
  .hb-manset .hb-sl{aspect-ratio:4/3}
  .hb-s-y{padding:0 70px 16px 16px}
  .hb-s-y b{font-size:19px}
}

/* ---------- haber kartları (ana sayfa altı, liste, diğer haberler) ---------- */
.hb-kartlar{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:22px 18px}
.hb-ana-kartlar{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:26px}
@media (max-width:1000px){.hb-ana-kartlar{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.hb-ana-kartlar{grid-template-columns:minmax(0,1fr)}}
.hb-kart{display:flex;flex-direction:column;gap:10px;color:var(--ink);min-width:0}
.hb-kart-g{position:relative;display:block;aspect-ratio:16/10;border-radius:16px;overflow:hidden;background:var(--surface-2);isolation:isolate}
.hb-kart-g .hb-img{transition:transform .6s ease}
.hb-kart:hover .hb-kart-g .hb-img{transform:scale(1.04)}
.hb-kart-g .hb-wm{right:9px;bottom:9px}
.hb-kart-g .hb-s-ust{left:10px;top:10px}
.hb-kart-g .hb-et{font-size:10.5px;padding:3px 8px 3px 6px}
.hb-kart-g .hb-et .ic{width:11px;height:11px}
.hb-kart-g .hb-temsili{right:8px;top:8px;font-size:9.5px}
.hb-kart-g .hb-rakam{top:auto;bottom:10px;left:10px;padding:6px 9px;font-size:11px}
.hb-kart-g .hb-rakam b{font-size:19px}
.hb-kart-y{display:grid;gap:6px}
.hb-kart-y b{font-size:16px;line-height:1.35;font-weight:700;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hb-kart:hover .hb-kart-y b{text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}
.hb-kart-y small{font-size:12.5px;color:var(--muted)}

.hb-sk{display:grid;grid-template-columns:1.72fr 1fr;gap:0;background:var(--surface-2)}
.hb-sk .sk{display:block;aspect-ratio:16/10;border-radius:0}
.hb-yuk{display:grid;gap:12px;padding-block:40px}
.hb-yuk .sk{display:block;height:28px;border-radius:8px}
.hb-yuk .sk-s{width:60%}

/* ---------- haber sayfası ---------- */
.hb-sayfa{max-width:860px;padding-block:28px 56px}
.hb-yol{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--muted);margin-bottom:18px}
.hb-yol a{color:var(--muted)}
.hb-yol a:hover{color:var(--ink)}
.hb-yol .ic{width:12px;height:12px}
.hb-bas{display:grid;gap:12px;justify-items:start}
.hb-bas h1{font-size:clamp(25px,3.4vw,34px);line-height:1.2;font-weight:800;letter-spacing:-.015em;text-wrap:balance;margin:0}
.hb-spot{font-size:18px;line-height:1.5;color:var(--muted);margin:0}
.hb-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;width:100%;font-size:13.5px;color:var(--muted);margin:4px 0 0;padding-bottom:16px;border-bottom:1px solid var(--line)}
.hb-meta b{color:var(--ink)}
.hb-meta .btn{margin-left:auto}
.hb-foto{margin:22px 0 0}
.hb-foto-g{position:relative;display:block;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:var(--surface-2)}
.hb-foto-g .hb-wm{right:16px;bottom:16px}
.hb-foto-g .hb-rakam{top:auto;bottom:16px;left:16px}
.hb-foto figcaption{font-size:12px;color:var(--muted);margin-top:6px}
.hb-govde{margin-top:22px;font-size:17px;line-height:1.7}
.hb-govde p{margin:0 0 1em}
.hb-govde h2{font-size:19px;margin:1.4em 0 .5em}
.hb-govde ul{margin:0 0 1em;padding-left:1.3em}
.hb-govde li{margin:.25em 0}
.hb-ekler{display:grid;gap:8px;margin:12px 0 20px;font-size:15px}
.hb-ekler h3{font-size:15px;margin:0}
.hb-ekler a{display:flex;align-items:center;gap:8px}
.hb-not{margin-top:22px;padding-top:14px;border-top:1px solid var(--line);color:var(--muted)}
.hb-ilgili{margin-top:40px}
.hb-ilgili h2{font-size:21px;margin:0}
.hb-ilgili .hb-ana-kartlar{margin-top:14px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:560px){.hb-ilgili .hb-ana-kartlar{grid-template-columns:minmax(0,1fr)}}

/* ---------- tüm haberler ---------- */
.hb-liste-sayfa{padding-block:28px 56px}
.hb-liste-sayfa h1{font-size:clamp(26px,3vw,32px);margin:0}
.hb-filtre{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 22px}
.hb-filtre a{padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:14px;font-weight:600}
.hb-filtre a.on{background:var(--ink);border-color:var(--ink);color:var(--surface)}

@media (prefers-reduced-motion:reduce){.hb-s,.hb-s.on,.hb-img{transition:none}}