.blog-filter{margin-bottom:2.5rem}.filter-sections{flex-direction:column;gap:1.25rem;display:flex}.filter-section{flex-direction:column;gap:.5rem;display:flex}.filter-label{font-family:var(--font-heading,"Space Grotesk", sans-serif);letter-spacing:.12em;text-transform:uppercase;color:var(--color-text-dim,#b8a88a);font-size:.7rem;font-weight:700}.filter-pills{flex-wrap:wrap;gap:.5rem;display:flex}.filter-pill{border:1px solid var(--color-border,#2d3038);font-size:.8rem;font-weight:600;font-family:var(--font-body,"DM Sans", sans-serif);letter-spacing:.04em;color:var(--color-text-dim,#b8a88a);cursor:pointer;background:#ffffff0a;border-radius:.5rem;outline:none;align-items:center;padding:.35rem .875rem;text-decoration:none;transition:all .2s cubic-bezier(.4,0,.2,1);display:inline-flex}.filter-pill:hover{color:var(--color-accent-blue,#f1c40f);background:#f1c40f1f;border-color:#f1c40f66}.filter-pill.active{color:var(--color-accent-blue,#f1c40f);background:#f1c40f33;border-color:#f1c40f80}.filter-pill-count{background:var(--color-bg-count,#0000000f);border-radius:9999px;justify-content:center;align-items:center;min-width:1.25rem;margin-left:.4rem;padding:.1rem .4rem;font-size:.7rem;font-weight:600;line-height:1;display:inline-flex}.filter-pill.active .filter-pill-count{color:var(--color-accent-blue,#f1c40f)}.filter-pill:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.no-results{text-align:center;color:var(--color-text-dim);grid-column:1/-1;padding:3rem 1rem;font-size:1.05rem}.no-results a{color:var(--color-accent-purple);text-decoration:none}.no-results a:hover{text-decoration:underline}.projects-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem;display:grid}.project-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:1.25rem;flex-direction:column;height:100%;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.project-card:hover{border-color:var(--color-border-hover);transform:translateY(-6px);box-shadow:0 20px 60px -15px #0009}.project-card.featured{background:linear-gradient(180deg, #f59e0b0f 0%, var(--color-bg-card) 40%);border-color:#f59e0b59;box-shadow:0 0 60px -20px #f59e0b4d}.project-card.featured:after{content:"";background:linear-gradient(135deg, var(--amber,#f59e0b) 0%, var(--cyan,#06b6d4) 100%);-webkit-mask-composite:xor;pointer-events:none;opacity:.6;z-index:1;border-radius:1.25rem;padding:1.5px;transition:opacity .4s;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-composite:exclude;mask-mode:match-source,match-source}.project-card.featured:hover:after{opacity:1}.project-card.featured:hover{box-shadow:0 25px 70px -15px #f59e0b33, 0 0 80px var(--amber-glow,#f59e0b4d);border-color:#f59e0b80;transform:translateY(-8px)}.project-card-content{flex-direction:column;flex:1;gap:.5rem;padding:1.25rem;display:flex;position:relative}.featured-badge{z-index:5;background:linear-gradient(135deg, var(--amber,#f59e0b) 0%, var(--cyan,#06b6d4) 100%);color:#000;text-transform:uppercase;letter-spacing:.12em;pointer-events:none;border-radius:999px;padding:.375rem .875rem;font-size:.625rem;font-weight:800;position:absolute;top:.75rem;left:.75rem;box-shadow:0 4px 20px #f59e0b66}.active-badge{z-index:5;color:#000;text-transform:uppercase;letter-spacing:.12em;pointer-events:none;background:linear-gradient(135deg,#10b981 0%,#34d399 100%);border-radius:999px;padding:.375rem .875rem;font-size:.625rem;font-weight:800;position:absolute;top:.75rem;right:.75rem;box-shadow:0 4px 20px #10b98166}.archived-badge{z-index:5;color:#000;text-transform:uppercase;letter-spacing:.12em;pointer-events:none;background:linear-gradient(135deg,#6b7280 0%,#9ca3af 100%);border-radius:999px;padding:.375rem .875rem;font-size:.625rem;font-weight:800;position:absolute;top:.75rem;right:.75rem;box-shadow:0 4px 20px #6b728066}.project-image{aspect-ratio:16/9;background:#111;border-radius:0;width:100%;position:relative;overflow:hidden}.project-image img{object-fit:cover;width:100%;height:100%;transition:transform .6s cubic-bezier(.4,0,.2,1)}.project-card:hover .project-image img{transform:scale(1.08)}.project-image:after{content:"";opacity:0;pointer-events:none;background:linear-gradient(#0000 0%,#0000001a 50%,#0009 100%);transition:opacity .3s;position:absolute;inset:0}.project-card:hover .project-image:after{opacity:1}.project-title{letter-spacing:-.01em;color:var(--color-text);margin:0;font-size:1.125rem;font-weight:700;transition:color .2s}.project-card:hover .project-title{color:var(--color-primary)}.project-card.featured .project-title{background:linear-gradient(135deg,#d97706 0%,#0891b2 100%);-webkit-text-fill-color:transparent;background-clip:text}.project-description{color:var(--color-text-dim);margin:0;font-size:.875rem;line-height:1.5}.project-categories,.project-tags{flex-wrap:wrap;gap:.375rem;display:flex}.category,.tag{text-transform:uppercase;letter-spacing:.05em;background:var(--color-bg-count);color:var(--color-text-muted);border:1px solid var(--color-border);border-radius:.25rem;padding:.25rem .625rem;font-size:.6875rem;font-weight:600;transition:all .2s}.category:hover,.tag:hover{color:var(--color-primary);background:#3b82f61f;border-color:#3b82f666}.project-links{border-top:1px solid var(--color-border);flex-wrap:wrap;align-items:center;gap:1rem;margin-top:auto;padding-top:.75rem;display:flex}.project-link{color:var(--color-text-muted);align-items:center;gap:.5rem;font-size:.8125rem;font-weight:600;text-decoration:none;transition:color .2s;display:inline-flex}.project-link:hover{color:var(--color-primary)}.project-license{margin-left:auto}.license-badge{color:var(--color-text-muted);background:#10b9811a;border:1px solid #10b9814d;border-radius:.25rem;padding:.25rem .625rem;font-size:.75rem;font-weight:600;transition:all .2s}.license-badge:hover{color:#10b981;background:#10b98126;border-color:#10b98180}@media (width<=768px){.project-card:hover,.project-card.featured:hover{transform:none}}