
/* =====================================================================
 EGZERSİZ KÜTÜPHANESİ — DadaFit liste/filtre sayfası
 Chrome (token+topbar+header+drawer+bottom-nav+footer+modal+JS) hub'dan
 BİREBİR taşındı (dadafit-hub-v1.html). DadaFit recolor: --fit → #009d4f.
 Sayfa içeriği "SAYFA CSS" altına eklendi. Mega menü/chrome KİLİTLİ.
 ===================================================================== */

/* =====================================================================
 SAYFA CSS — EGZERSİZ KÜTÜPHANESİ
 ===================================================================== */
:root{
  --fit:var(--marka);          /* DadaFit aksanı (Pantone 7482 C) */
  --fit-deep:var(--marka-koyu);     /* hover / gradient ucu */
  --fit-tint:var(--marka-yikama-2);     /* yumuşak yeşil yıkama */
  --fit-line:var(--marka-cizgi);     /* yeşil-nötr hairline */
  --fit-bright:var(--marka-parlak);   /* koyu zeminde okunur aksan metni */
  --fit-dark:#211E16;     /* vurgu/hero zemini */
}
.sec-fit .eyebrow{color:var(--fit-deep)}
.sec-fit .eyebrow::before{background:var(--fit)}

/* ---- ÜST PANEL: koyu band + breadcrumb + başlık + arama (signature carry-over) ---- */
.lib-top{
  position:relative;overflow:hidden;margin-top:112px;
  /* hub df-hero-media deseni: desatüre görsel + koyu gradient overlay (metin solda okunur, görsel sağda belirir) */
  background:
    radial-gradient(820px 360px at 84% 14%,color-mix(in srgb, var(--marka) 20%, transparent),transparent 62%),
    linear-gradient(90deg,rgba(33,30,22,.94) 0%,rgba(29,26,20,.82) 46%,rgba(27,25,19,.74) 100%),
    linear-gradient(180deg,rgba(33,30,22,0) 58%,rgba(24,22,16,.62) 100%),
    url('https://images.unsplash.com/photo-1534438327276-14e5300c3a48?w=1680&q=80&auto=format&fit=crop&exp=7&gam=6&sat=-16') center 26%/cover no-repeat,
    #1b1913;
  padding:40px 0 38px;
}
.lib-top .wrap{position:relative;z-index:2}
.lib-crumb{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;color:rgba(255,255,255,.6);margin-bottom:18px}
.lib-crumb a{color:rgba(255,255,255,.6);transition:color .2s var(--ease)}
.lib-crumb a:hover{color:#fff}
.lib-crumb i{font-size:9px;color:rgba(255,255,255,.34)}
.lib-crumb .cur{color:var(--fit-bright)}
.lib-top .eyebrow{color:var(--fit-bright)}
.lib-top .eyebrow::before{background:var(--fit-bright)}
.lib-top h1{color:#fff;font-size:39px;letter-spacing:-.02em;margin:14px 0 10px;max-width:680px}
.lib-top .lib-sub{color:rgba(255,255,255,.78);font-size:15.5px;font-weight:500;max-width:560px;line-height:1.55}
/* arama input — cam panel */
.lib-stats{display:flex;align-items:center;gap:26px;margin-top:24px;flex-wrap:wrap}
.lib-stat{display:flex;align-items:baseline;gap:8px}
.lib-stat b{font-size:20px;font-weight:800;color:#fff;letter-spacing:-.01em}
.lib-stat span{font-size:12.5px;font-weight:600;color:rgba(255,255,255,.62)}

/* ---- FİLTRE RAYI (sticky) — df-fchip dili ---- */
/* ===================================================================
 HAREKET REHBERİ HUB — kategori kart grid (Fit yeşil)
 Anatomi: beslenme-rehberi (reh-grid + hub-card + soon + note) →
 Fit token'larına yeniden kuruldu (mint literal YOK, sızmaz).
 =================================================================== */
.hr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.hub-media{position:relative;height:170px;background-size:cover;background-position:center}
.hub-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(33,30,22,0) 50%,rgba(20,18,12,.55))}
.hub-tags{position:absolute;bottom:12px;left:12px;z-index:2;display:flex;gap:6px;flex-wrap:wrap}
.hub-tag{display:inline-flex;align-items:center;gap:5px;background:rgba(20,18,12,.72);color:#fff;font-size:11px;font-weight:700;padding:6px 10px;border-radius:var(--radius-sm);backdrop-filter:blur(4px)}
.hub-tag i{color:var(--fit-bright)}
.soon-badge{position:absolute;top:12px;right:12px;z-index:2;font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--slate);background:rgba(255,255,255,.92);padding:5px 11px;border-radius:var(--radius-sm)}
.hub-body{padding:20px;display:flex;flex-direction:column;flex:1}
.hub-body h4{font-size:16.5px;margin-bottom:8px;letter-spacing:-.01em}
a.hub-card:hover .hub-body h4{color:var(--fit-deep)}
.hub-body p{font-size:13.5px;color:var(--muted);font-weight:500;line-height:1.55}
.hub-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);font-weight:500}
.hub-foot .go{display:inline-flex;align-items:center;gap:7px;color:var(--fit-deep);font-weight:700}
.hub-foot .go i{transition:.2s var(--ease)}
a.hub-card:hover .hub-foot .go i{transform:translateX(3px)}
/* "Yakında" pasif kart — grayscale, hover-lift yok */
.hub-soon{cursor:default}
.hub-soon .hub-media{filter:grayscale(1) contrast(.96) brightness(1.02)}
.hub-soon .hub-media::after{background:linear-gradient(180deg,rgba(33,30,22,.16) 38%,rgba(20,18,12,.62))}
.hub-soon .hub-body h4{color:var(--muted)}
.hub-soon .hub-foot,.hub-soon .hub-foot .go{color:#b7b1a8}
/* disclaimer notu (Fit yeşil) */
.hr-note{display:flex;gap:14px;align-items:flex-start;background:var(--fit-tint);border:1px solid var(--fit-line);border-radius:var(--radius-lg);padding:20px 22px;margin-top:34px}
.hr-note>i{color:var(--fit-deep);font-size:18px;margin-top:2px;flex:none}
.hr-note p{font-size:14px;color:var(--slate-2);font-weight:500;line-height:1.6;margin:0}
.hr-note p a{color:var(--fit-deep);font-weight:700;text-decoration:underline;text-underline-offset:2px}
@media (max-width:1024px){.hr-grid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.hr-grid{grid-template-columns:1fr}}

/* ===================== SAYFA RESPONSIVE ===================== */
@media (max-width:1024px){
  .lib-top{margin-top:112px}
  .lib-filters{top:112px}
  .lib-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lib-top h1{font-size:33px}
  .fgroup .lbl{min-width:88px}
}
@media (max-width:760px){
  .lib-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .lib-top{margin-top:62px;padding:30px 0 30px}
  .lib-top h1{font-size:27px}
  .lib-top .lib-sub{font-size:14px}
  .lib-search{max-width:none}
  .lib-stats{gap:18px;margin-top:20px}
  .lib-stat b{font-size:18px}
  .lib-body{padding:var(--sec-pad-sm) 0 var(--sec-pad)}
  /* sticky filtre bar mobilde tek satır yatay kaydır */
  .lib-filters{top:62px;padding:14px 14px 12px}
  .fgroup{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:5px}
  .fgroup::-webkit-scrollbar{display:none}
  .fgroup .lbl{position:sticky;left:0;background:rgba(255,255,255,.96);min-width:auto;padding-right:6px;z-index:1}
  .df-fchip{flex:none;white-space:nowrap}
  .fclear{flex:none}
  .lib-bar{margin-bottom:18px}
  .lib-sort{width:100%;justify-content:space-between}
  .sort-seg button{padding:8px 12px;font-size:12.5px}
  .lib-grid{grid-template-columns:1fr 1fr;gap:14px}
  .ex-media{height:148px}
  .ex-body{padding:13px 14px 15px}
  .ex-body h3{font-size:15px}
}
@media (max-width:400px){
  .lib-grid{grid-template-columns:1fr}
  .ex-media{height:200px}
}

/* ============ KABUK: topbar social + acct-pro + gw imza (hub parite) ============ */

