@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in-up{opacity:0;animation:fadeInUp .5s ease forwards}.projects-page{max-width:1100px;margin:0 auto;padding:3rem 1.5rem}.projects-header{margin-bottom:2.5rem}.projects-header h1{font-size:2.25rem;font-weight:700;color:#1a1a2e;margin:0 0 .75rem}.projects-header p{font-size:1.05rem;color:#4b5563;max-width:600px;margin:0;line-height:1.6}.filter-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2rem;overflow-x:auto;padding-bottom:.25rem}.filter-tab{padding:.4rem 1rem;border-radius:9999px;border:1px solid rgba(0,0,0,.12);background:#fff;color:#4b5563;font-size:.875rem;font-weight:500;cursor:pointer;transition:background .15s,color .15s,border-color .15s;white-space:nowrap;user-select:none}.filter-tab:hover{border-color:#6741d9;color:#6741d9}.filter-tab.active{background:#6741d9;color:#fff;border-color:#6741d9}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}.project-card-wrapper.hidden{display:none}.project-card{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:12px;padding:1.5rem;display:flex;flex-direction:column;gap:.875rem;color:inherit;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.project-card:hover{transform:translateY(-2px);border-color:#6741d9;box-shadow:0 8px 24px #6741d91a}.project-card-category{font-family:monospace;font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:#6741d9}.project-card-title{font-size:1.05rem;font-weight:600;color:#1a1a2e;margin:0;line-height:1.4}.project-card-title a{color:inherit;text-decoration:none}.project-card-title a:hover{color:#6741d9}.project-card-description{font-size:.9rem;color:#4b5563;line-height:1.6;margin:0}.project-card-tech{display:flex;flex-wrap:wrap;gap:.4rem}.tech-tag{font-family:monospace;font-size:.72rem;padding:.2rem .6rem;border-radius:9999px;border:1px solid rgba(103,65,217,.3);color:#6741d9;background:#6741d90d;white-space:nowrap}.project-card-links{display:flex;flex-wrap:wrap;gap:.75rem;padding-top:.75rem;border-top:1px solid rgba(0,0,0,.06)}.project-card-links a{font-size:.8rem;color:#6741d9;text-decoration:none;font-weight:500}.project-card-links a:hover{text-decoration:underline}.project-layout{max-width:800px;margin:0 auto;padding:2rem 1.5rem 4rem}.project-back-link{display:inline-block;font-size:.875rem;color:#6741d9;text-decoration:none;margin-bottom:2rem;font-weight:500}.project-back-link:hover{text-decoration:underline}.project-layout-hero{margin-bottom:2.5rem;padding-bottom:2rem;border-bottom:1px solid rgba(0,0,0,.08)}.project-layout-hero .category-badge{font-family:monospace;font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:#6741d9;margin-bottom:.75rem}.project-layout-hero h1{font-size:2rem;font-weight:700;color:#1a1a2e;margin:0 0 .75rem;line-height:1.3}.project-layout-hero .project-date{font-size:.875rem;color:#9ca3af;margin-bottom:1rem}.project-layout-hero .tech-tags{display:flex;flex-wrap:wrap;gap:.4rem}.project-layout-body{color:#1a1a2e;line-height:1.75}.project-layout-body h2{font-size:1.35rem;font-weight:600;color:#1a1a2e;margin:2rem 0 .75rem}.project-layout-body h3{font-size:1.1rem;font-weight:600;color:#1a1a2e;margin:1.5rem 0 .5rem}.project-layout-body p{margin:0 0 1rem;color:#374151}.project-layout-body ul,.project-layout-body ol{margin:0 0 1rem 1.25rem;color:#374151}.project-layout-body li{margin-bottom:.4rem}.project-layout-body code{font-family:monospace;font-size:.875em;background:#f3f4f6;padding:.15em .4em;border-radius:4px;color:#6741d9}.project-layout-links{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid rgba(0,0,0,.08)}.project-layout-links h2{font-size:1rem;font-weight:600;color:#1a1a2e;margin:0 0 .75rem}.project-layout-links ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.75rem}.project-layout-links a{font-size:.875rem;color:#6741d9;text-decoration:none;font-weight:500;padding:.35rem .875rem;border:1px solid rgba(103,65,217,.3);border-radius:9999px;transition:background .15s,color .15s}.project-layout-links a:hover{background:#6741d9;color:#fff}
