/* =============================================================
   SIFIR HEADER — ortadan hizalı logo · çizgi arama · ince ikonlar
   Monokrom mürekkep (#101317) + kâğıt (#FBFAF7) + asit yeşili (#C6F24E)
   ============================================================= */
.sfh{
  --s-bg:#FBFAF7; --s-fg:#101317; --s-mut:#6F7570; --s-line:#E5E4DC;
  --s-ac:#C6F24E; --s-h:84px; --s-logo-h:44px;
  position:relative; z-index:90; background:var(--s-bg); color:var(--s-fg);
  border-bottom:1px solid var(--s-line);
  font-family:"Outfit","Instrument Sans",system-ui,sans-serif;
}
.sfh.is-sticky{position:sticky; top:0}

/* üst ince şerit */
.sfh-strip{background:var(--s-fg); color:#F4F5F0}
.sfh-strip-in{max-width:1360px; margin:0 auto; padding:0 24px; min-height:30px; display:flex; align-items:center;
  justify-content:center; gap:9px; position:relative; font-size:11.5px; letter-spacing:.02em}
.sfh-dot{width:5px; height:5px; border-radius:50%; background:var(--s-ac); flex:0 0 auto}
.sfh-strip-link{position:absolute; right:24px; color:rgba(244,245,240,.7); text-decoration:none; font-size:11.5px}
.sfh-strip-link:hover{color:var(--s-ac)}

/* ana satır: solda arama · ortada logo · sağda ikonlar */
.sfh-main{height:var(--s-h)}
.sfh-in{max-width:1360px; margin:0 auto; padding:0 24px; height:100%; display:grid;
  grid-template-columns:1fr auto 1fr; align-items:center; gap:18px}
.sfh-left{display:flex; align-items:center; min-width:0}
.sfh-right{display:flex; align-items:center; justify-content:flex-end; gap:8px}

/* çizgi arama — pill değil */
.sfh-search{display:flex; align-items:center; gap:8px; width:min(300px,100%); height:34px;
  border-bottom:1px solid #CFCEC5; transition:border-color .2s}
.sfh-search:focus-within{border-color:var(--s-fg)}
.sfh-search-i{width:15px; height:15px; color:#8C938C; display:block; flex:0 0 auto}
.sfh-search-i svg{width:15px; height:15px; display:block}
.sfh-search input{flex:1; min-width:0; border:0; outline:0; background:transparent; font:400 13px/1 "Outfit",sans-serif; color:var(--s-fg)}
.sfh-search input::placeholder{color:#8C938C}

/* logo — ortada */
.sfh-brand{display:block; line-height:0; text-align:center; text-decoration:none; color:inherit}
.sfh-brand img{height:var(--s-logo-h,44px) !important; max-height:var(--s-logo-h,44px) !important; width:auto !important; max-width:190px; object-fit:contain; display:inline-block}
.sfh-brand b{font:800 22px/1 "Outfit",sans-serif; letter-spacing:-.03em; text-transform:uppercase}

/* ikonlar: ince kare çerçeve */
.sfh-ic{position:relative; width:38px; height:38px; display:grid; place-items:center; border:1px solid var(--s-line);
  border-radius:8px; background:transparent; color:var(--s-fg); text-decoration:none; transition:background .18s,border-color .18s,color .18s}
.sfh-ic svg{width:17px; height:17px}
.sfh-ic:hover{background:var(--s-fg); color:var(--s-ac); border-color:var(--s-fg)}
.sfh-ic i{position:absolute; top:-5px; right:-5px; min-width:15px; height:15px; padding:0 4px; border-radius:99px;
  background:var(--s-ac); color:var(--s-fg); font:700 9.5px/15px "Outfit",sans-serif; font-style:normal; text-align:center}
.sfh-menu{display:inline-flex; align-items:center; gap:7px; height:38px; padding:0 14px; border-radius:8px;
  border:1px solid var(--s-fg); background:var(--s-fg); color:#F4F5F0; cursor:pointer;
  font:600 12px/1 "Outfit",sans-serif; letter-spacing:.02em; transition:background .2s,color .2s}
.sfh-menu svg{width:15px; height:15px}
.sfh-menu:hover{background:var(--s-ac); color:var(--s-fg); border-color:var(--s-ac)}
.sfh-burger{display:none; width:38px; height:38px; border:1px solid var(--s-line); border-radius:8px; background:transparent;
  padding:11px 10px; flex-direction:column; justify-content:space-between; cursor:pointer}
.sfh-burger span{display:block; height:1.5px; background:var(--s-fg)}

/* orta menü satırı */
.sfh-nav{border-top:1px solid var(--s-line)}
.sfh-nav-in{max-width:1360px; margin:0 auto; padding:0 24px; min-height:42px; display:flex; align-items:center;
  justify-content:center; gap:12px; flex-wrap:wrap}
.sfh-nav a{font:500 11.5px/1 "Outfit",sans-serif; letter-spacing:.13em; text-transform:uppercase; color:#3E443F;
  text-decoration:none; padding:6px 2px; position:relative; transition:color .18s}
.sfh-nav a::after{content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--s-fg);
  transform:scaleX(0); transform-origin:center; transition:transform .22s}
.sfh-nav a:hover{color:var(--s-fg)}
.sfh-nav a:hover::after,.sfh-nav a.on::after{transform:scaleX(1)}
.sfh-sep{color:#C4C7BF; font-size:12px}

/* kategori paneli */
.sfh-panel{position:absolute; left:0; right:0; top:100%; background:var(--s-bg); border-top:1px solid var(--s-line);
  border-bottom:1px solid var(--s-line)}
.sfh-panel[hidden]{display:none}
.sfh-panel-in{max-width:1360px; margin:0 auto; padding:10px 24px 18px; display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 28px}
.sfh-panel-in a{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 2px;
  border-bottom:1px solid var(--s-line); text-decoration:none; color:var(--s-fg); transition:padding .18s}
.sfh-panel-in a:hover{padding-left:6px}
.sfh-panel-t{font:500 14px/1.3 "Outfit",sans-serif}
.sfh-panel-a{color:#9AA098; font-size:13px}
.sfh-panel-in a:hover .sfh-panel-a{color:var(--s-fg)}
.sfh-empty{margin:12px 0; color:var(--s-mut); font-size:13px}

@media (max-width:1000px){ .sfh-in{grid-template-columns:auto 1fr auto} .sfh-search{width:180px} .sfh-menu span{display:none} }
@media (max-width:760px){
  .sfh{--s-h:auto}
  .sfh-strip-in{justify-content:flex-start; padding:0 14px; font-size:11px}
  .sfh-strip-link{display:none}
  .sfh-main{padding:10px 0}
  .sfh-in{grid-template-columns:1fr auto; gap:10px; padding:0 14px; align-items:center}
  .sfh-left{display:none}
  .sfh-brand{grid-column:1; text-align:left}
  .sfh-brand img{height:34px !important; max-height:34px !important}
  .sfh-right{grid-column:2}
  .sfh-menu{display:none}
  .sfh-burger{display:flex}
  .sfh-nav{border-top:1px solid var(--s-line); overflow-x:auto; scrollbar-width:none}
  .sfh-nav::-webkit-scrollbar{display:none}
  .sfh-nav-in{justify-content:flex-start; flex-wrap:nowrap; width:max-content; min-height:38px; padding:0 14px}
  .sfh-nav a{font-size:10.5px}
  .sfh-panel-in{grid-template-columns:1fr; padding:8px 14px 14px}
}
@media (prefers-reduced-motion:reduce){ .sfh *{transition:none !important} }