/* blog.css – minimal additions */
/* ---------- HERO --------------- */
.blog-hero{
  padding:6rem 1rem 4.5rem;
  background:linear-gradient(135deg,var(--secondary),var(--primary-light));
  color:#fff;text-align:center;
  clip-path:polygon(0 0,100% 0,100% 92%,0 100%);
}
.blog-hero h1{font:900 2.6rem/1 'Heebo',sans-serif}
.blog-hero p{max-width:640px;margin:1rem auto 0;font-size:1.1rem}

@media(min-width:768px){.blog-hero h1{font-size:3rem}}

/* ---------- POSTS GRID ---------- */
.posts-grid{
  max-width:1100px;margin:4rem auto;padding:0 1rem;
  display:grid;gap:2.2rem;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.post-card{
  position:relative;overflow:hidden;border-radius:var(--radius);
  box-shadow:var(--shadow-sm);background:#fff;transition:.35s;
  opacity:0;transform:translateY(40px);
}
.post-card.show{opacity:1;transform:none}
.post-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.post-card img{width:100%;height:160px;object-fit:cover}
.post-card.featured img{height:200px}
.card-body{padding:1.2rem 1.3rem}
.card-body h2{font:700 1.05rem/1.4 'Heebo';color:#1e293b;margin:0 0 .6rem}
.card-body time{font-size:.85rem;color:var(--text-muted)}

.card-link{position:absolute;inset:0;z-index:2}

/* ---------- SINGLE POST ---------- */
.blog-post{max-width:820px;margin:4rem auto;padding:0 1rem;font-size:1.05rem;line-height:1.9}
.post-header{text-align:center;margin-bottom:2.5rem}
.post-header img{width:100%;border-radius:var(--radius);box-shadow:var(--shadow-sm);margin-top:1.4rem}
.post-meta{color:var(--text-muted);font-size:.9rem}
.post-content h2,.post-content h3{font-weight:800;margin:2.2rem 0 1rem;color:#1e293b}
.post-content ul{padding-inline-start:1.6rem;margin:.8rem 0}
.post-content blockquote{
  background:#f9fafb;border-inline-start:4px solid var(--primary);
  padding:1rem 1.4rem;font-style:italic;margin:1.6rem 0;border-radius:var(--radius)}
/* blog.css – v2 */
/* ---------- HERO --------------- */
.blog-hero{
  padding:6rem 1rem 4.5rem;
  background:linear-gradient(135deg,var(--secondary) 0%,var(--primary-light) 100%);
  color:#fff;text-align:center;
  clip-path:polygon(0 0,100% 0,100% 92%,0 100%);
}
.blog-hero .blog-filters{
  margin-top:2rem;display:flex;flex-direction:column;gap:.8rem;align-items:center
}
.blog-filters input{
  width:240px;max-width:90%;padding:.6rem 1rem;border-radius:var(--radius);
  border:1px solid #fff;background:rgba(255,255,255,.15);color:#fff;
}
.blog-filters input::placeholder{color:#f0f0f0}
.tags{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}
.tag{
  padding:.35rem .9rem;font-size:.85rem;border-radius:var(--radius);
  background:rgba(255,255,255,.18);border:1px solid transparent;color:#fff;
  cursor:pointer;transition:.25s
}
.tag.active,.tag:hover{background:#fff;color:var(--primary);}

/* ---------- POSTS GRID ---------- */
.posts-grid{max-width:1100px;margin:4rem auto;padding:0 1rem;display:grid;gap:2.2rem;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.post-card{position:relative;overflow:hidden;border-radius:var(--radius);
  box-shadow:var(--shadow-sm);background:#fff;transition:.35s;opacity:0;transform:translateY(40px);}
.post-card.show{opacity:1;transform:none}
.post-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.post-card picture{display:block}
.post-card img{width:100%;height:160px;object-fit:cover}
.post-card.featured img{height:200px}
.card-body{padding:1.2rem 1.3rem}
.card-body h2{font:700 1.05rem/1.4 'Heebo';color:#1e293b;margin:0 0 .6rem}
.card-body time{font-size:.85rem;color:var(--text-muted)}
.card-link{position:absolute;inset:0;z-index:2}

/* ---------- CTA ---------- */
.big-cta{display:flex;justify-content:center;margin:5rem 0}
.big-cta .btn{
  background:linear-gradient(135deg,var(--primary),var(--secondary));
  color:#fff;padding:1rem 2.2rem;border-radius:999px;font-weight:700;display:inline-flex;gap:.4rem;align-items:center;
  box-shadow:var(--shadow-lg);transition:.35s}
.big-cta .btn:hover{transform:translateY(-3px);box-shadow:var(--shadow-xl)}
/* כפתור תגית */
.tag {
  position: relative;
  padding: .35rem 1rem .35rem 1.8rem; /* מקום לבאדג׳ */
  font-size: .85rem; border-radius: var(--radius);
  background: rgba(255,255,255,.18);
  border: 1px solid transparent; color:#fff; cursor:pointer;
  transition: .25s;
}
.tag.active, .tag:hover { background:#fff; color:var(--primary); }
.tag .count {
  position:absolute; left:.5rem; top:50%; transform:translateY(-50%);
  font-size:.7rem; line-height:1; background:rgba(0,0,0,.25);
  padding:.1rem .35rem; border-radius:999px; color:#fff;
}
.tag.clear { padding:.35rem .6rem; font-size:1rem; }
/* blog.css – אחרי .posts-grid … */
.posts-grid{
  column-count:1;       /* Mobile */
  column-gap:2.2rem;
}
@media(min-width:560px){ .posts-grid{column-count:2;} }
@media(min-width:900px){ .posts-grid{column-count:3;} }

.post-card{
  break-inside:avoid;   /* הלב של Masonry */
  margin:0 0 2.2rem;
}
/* blog.css */
.card-body .meta{font-size:.8rem;color:var(--text-muted)}
:root{
  --bg:#ffffff; --text:#1e293b; --card:#fff;
}
:root.dark{
  --bg:#0f172a; --text:#e2e8f0; --card:#1e293b;
}
body{background:var(--bg); color:var(--text);}
.post-card{background:var(--card);}
.btn-outline{border:2px solid var(--primary);background:transparent;padding:.8rem 2rem;margin:1rem auto;display:block}
/* ========= Dark-Mode toggle button ========= */

:root.dark .theme-btn{
  background:rgba(255,255,255,.12);
  color:#f8fafc;               /* טקסט בהיר גם במצב כהה */
}
.theme-btn::after{
  content:'';
  position:absolute;inset:0;border-radius:inherit;
  box-shadow:0 0 8px rgba(0,0,0,.15) inset;
  pointer-events:none;
}


:root.dark .theme-btn{
  background:#334155;          /* רקע כהה במצב כהה */
  color:#f8fafc;               /* אייקון לבן */
}
/* === Theme Toggle – fixed floating button (גרסה סופית) === */
.theme-btn{
  position:fixed;
  top:1rem;
  inset-inline-end:1rem;     /* ימין ב-RTL, שמאל ב-LTR */
  z-index:100;

  width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;
  border:none;border-radius:50%;cursor:pointer;

  background:#ffffff;
  color:#1e293b;
  box-shadow:0 3px 8px rgba(0,0,0,.15);
  transition:transform .25s,background .25s;
}
.theme-btn:hover{transform:translateY(-2px);}

:root.dark .theme-btn{
  background:#334155;
  color:#f1f5f9;
}

.theme-btn .icon,
.theme-btn svg{pointer-events:none;font-size:1.2rem;}
/* === Card preview enhancements === */
.post-card{
  position:relative; overflow:hidden; border-radius:var(--radius);
  box-shadow:var(--shadow-sm); transition:.35s; background:#fff;
}
.post-card .thumb img{width:100%;height:180px;object-fit:cover;transition:transform .35s;}
.post-card:hover .thumb img{transform:scale(1.06);}

.card-body{padding:1.3rem 1.4rem;display:flex;flex-direction:column;gap:.6rem}
.card-body h2{font:700 1.05rem/1.4 'Heebo';margin:0;color:#1e293b}
.card-body .excerpt{font-size:.9rem;line-height:1.55;color:#475569;margin:0}
.card-body .meta{font-size:.75rem;color:var(--text-muted)}
.badge{
  align-self:flex-start;padding:.15rem .55rem;font-size:.75rem;
  background:var(--primary);color:#fff;border-radius:99px;font-weight:700;
}