/* ── Projects Page Styles ── */
.filter-bar { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:40px; }
.filter-btn { padding:8px 20px; border-radius:30px; font-size:0.83rem; font-weight:700; border:1.5px solid var(--border); background:transparent; color:var(--muted); cursor:none; font-family:inherit; transition:all 0.3s var(--ease); }
.filter-btn:hover,.filter-btn.active { background:var(--accent); color:#fff; border-color:var(--accent); }
.projects-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(330px,1fr)); gap:22px; }
.project-card { background:var(--card); border:1.5px solid var(--border); border-radius:20px; overflow:hidden; transition:all 0.45s var(--ease); position:relative; text-decoration:none; color:inherit; display:flex; flex-direction:column; cursor:none; }
.project-card:hover { transform:translateY(-8px) scale(1.01); box-shadow:0 24px 60px rgba(44,24,16,0.12); border-color:var(--accent); }
.project-card:hover .proj-arrow { opacity:1; transform:translate(0,0); }
.proj-thumb { height:180px; overflow:hidden; display:flex; align-items:center; justify-content:center; font-size:3.5rem; position:relative; }
.proj-thumb::after { content:''; position:absolute; inset:0; background:linear-gradient(to bottom,transparent 30%,var(--card)); }
.proj-body { padding:24px; flex:1; display:flex; flex-direction:column; }
.proj-tags { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:12px; }
.proj-tag { font-size:0.69rem; padding:4px 10px; border-radius:20px; background:rgba(212,83,74,0.08); color:var(--accent); border:1.5px solid rgba(212,83,74,0.2); font-weight:700; }
.proj-tag.green { background:rgba(92,158,84,0.08); color:var(--accent2); border-color:rgba(92,158,84,0.2); }
.proj-tag.orange { background:rgba(232,131,61,0.08); color:#C07020; border-color:rgba(232,131,61,0.2); }
.proj-title { font-size:1.08rem; font-weight:800; margin-bottom:6px; }
.proj-role { font-size:0.78rem; color:var(--accent); margin-bottom:10px; font-weight:700; }
.proj-desc { font-size:0.85rem; color:var(--muted); line-height:1.65; flex:1; margin-bottom:18px; font-weight:500; }
.proj-meta { display:flex; align-items:center; justify-content:space-between; padding-top:14px; border-top:1px solid var(--border); }
.proj-status { font-size:0.74rem; display:flex; align-items:center; gap:6px; color:var(--muted); font-weight:600; }
.proj-status-dot { width:6px; height:6px; border-radius:50%; }
.dot-done { background:var(--accent2); box-shadow:0 0 5px var(--accent2); }
.dot-wip  { background:#E8833D; box-shadow:0 0 5px #E8833D; animation:wip 2s infinite; }
@keyframes wip{0%,100%{opacity:1}50%{opacity:0.4}}
.proj-year { font-size:0.75rem; color:var(--muted); font-weight:600; }
.proj-arrow { position:absolute; top:18px; right:18px; font-size:0.88rem; color:var(--accent); z-index:3; opacity:0; transform:translate(-6px,6px); transition:all 0.3s var(--ease); background:rgba(255,251,247,0.9); width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; border:1.5px solid var(--border); }
.project-card.featured { grid-column:1/-1; display:grid; grid-template-columns:1fr 1.5fr; }
.project-card.featured .proj-thumb { height:100%; min-height:240px; }
.work-section { margin-top:80px; }
.work-section h2 { font-size:clamp(1.6rem,2.5vw,2.2rem); font-weight:900; letter-spacing:-1px; margin-bottom:30px; }
.work-card { background:var(--card); border:1.5px solid var(--border); border-radius:18px; padding:30px; margin-bottom:18px; transition:all 0.35s var(--ease); }
.work-card:hover { border-color:var(--accent); transform:translateX(5px); box-shadow:0 6px 20px rgba(212,83,74,0.1); }
.work-header { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:8px; flex-wrap:wrap; }
.work-company { font-size:1rem; font-weight:800; }
.work-period { font-size:0.78rem; color:var(--muted); text-align:right; white-space:nowrap; font-weight:600; }
.work-role { font-size:0.82rem; color:var(--accent); margin-bottom:16px; font-weight:700; }
.work-tech { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:16px; }
.work-tech-tag { font-size:0.7rem; padding:4px 12px; background:rgba(212,83,74,0.07); border:1.5px solid rgba(212,83,74,0.15); border-radius:20px; color:var(--accent); font-weight:700; }
.work-bullets { list-style:none; }
.work-bullets li { font-size:0.86rem; color:var(--muted); line-height:1.7; padding-left:18px; position:relative; margin-bottom:6px; font-weight:500; }
.work-bullets li::before { content:'→'; position:absolute; left:0; color:var(--accent); font-weight:700; }
@media(max-width:768px){ .project-card.featured{grid-column:auto;display:flex;flex-direction:column} .project-card.featured .proj-thumb{height:180px} }

/* ── Dark theme overrides ── */
[data-theme="dark"] .project-card:hover { box-shadow: 0 24px 60px rgba(0,0,0,0.4); }
[data-theme="dark"] .proj-arrow { background: rgba(22,22,30,0.9); }
[data-theme="dark"] .proj-tag { background: rgba(108,99,255,0.1); color: var(--accent); border-color: rgba(108,99,255,0.25); }
[data-theme="dark"] .proj-tag.green { background: rgba(0,217,160,0.1); border-color: rgba(0,217,160,0.25); }
[data-theme="dark"] .proj-tag.orange { background: rgba(232,131,61,0.1); color: #E8833D; border-color: rgba(232,131,61,0.25); }
[data-theme="dark"] .work-card:hover { box-shadow: 0 6px 20px rgba(108,99,255,0.12); }
[data-theme="dark"] .work-tech-tag { background: rgba(108,99,255,0.08); border-color: rgba(108,99,255,0.2); }
