.projects-section{background-color:var(--color-background-default)}.filter-buttons{justify-content:center;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-9);padding-bottom:var(--spacing-2);-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap;display:flex;overflow-x:auto}.filter-buttons::-webkit-scrollbar{display:none}.filter-btn{white-space:nowrap;padding:var(--spacing-2) var(--spacing-5);background-color:var(--color-secondary-500);border:var(--border-width-default) solid var(--color-border-default);border-radius:var(--radius-sm);color:var(--color-text-primary);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);flex-shrink:0}.filter-btn:hover{border-color:var(--color-primary-500);color:var(--color-primary-500)}.filter-btn.active{background-color:var(--color-primary-500);color:var(--text-white);border-color:var(--color-primary-500)}@media (max-width:767px){.filter-buttons{justify-content:flex-start}}.project-card{aspect-ratio:3/2;cursor:pointer;flex-direction:column;height:auto;padding:0;display:flex;position:relative;overflow:hidden}.skeleton-card{background:var(--color-secondary-500);position:relative;overflow:hidden}.project-skeleton-fill{border-radius:inherit;width:100%;height:100%}.projects-empty-message{text-align:center;padding:var(--spacing-8);color:var(--color-text-secondary)}.skeleton-box{background:linear-gradient(90deg,#ffffff08 25%,#ffffff14 37%,#ffffff08 63%) 0 0/400% 100%;animation:1.4s infinite skeleton-loading}@keyframes skeleton-loading{0%{background-position:100%}to{background-position:0}}.project-image-wrapper{width:100%;height:100%;position:relative;overflow:hidden}.project-img{object-fit:cover;width:100%;height:100%;transition:transform var(--transition-normal);display:block}.project-card:hover .project-img{transform:scale(1.05)}.project-overlay svg{width:24px;height:24px}.project-overlay{-webkit-backdrop-filter:blur(20px);width:100%;height:100%;padding:var(--spacing-6);opacity:0;visibility:hidden;transition:opacity var(--transition-normal), visibility var(--transition-normal);direction:ltr;background:#ffffff1a;position:absolute;inset:0}.project-card:hover .project-overlay{opacity:1;visibility:visible}.project-overlay-content{justify-content:space-between;align-items:flex-end;width:100%;height:100%;display:flex;position:relative}.project-overlay-action{align-items:flex-end;display:flex}.project-circle-btn{border-radius:var(--radius-full);background-color:var(--text-white);cursor:pointer;border:none;justify-content:center;align-items:center;width:48px;height:48px;display:flex;box-shadow:0 4px 12px #00000014}.project-overlay-info{text-align:right;align-items:flex-end;gap:var(--spacing-1);flex-direction:column;display:flex}.project-category{color:var(--color-text-primary);font-size:var(--font-size-xs);font-weight:var(--font-weight-regular);display:inline-block}.project-title{font-size:var(--font-size-md);font-weight:var(--font-weight-black);color:var(--color-text-primary);margin:0;line-height:1.3}.project-mobile-info{display:none}.projects-footer{text-align:center;margin-top:var(--spacing-10)}@media (max-width:767px){.project-card{height:auto;max-height:none}.project-image-wrapper{flex-shrink:0;height:220px}.project-overlay{display:none}.project-mobile-info{justify-content:space-between;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);background-color:var(--color-background-default);border-top:1px solid var(--color-border-default);display:flex}.project-mobile-text{gap:var(--spacing-1);flex-direction:column;min-width:0;display:flex}.project-mobile-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-text-primary);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.project-mobile-category{font-size:var(--font-size-xs);color:var(--color-text-muted);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.project-mobile-icon{border-radius:var(--radius-full);background-color:var(--color-secondary-500);width:32px;height:32px;color:var(--color-text-primary);flex-shrink:0;justify-content:center;align-items:center;display:flex}}.project-detail-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1200;padding:var(--spacing-6);background-color:#1119;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.project-detail-modal{background-color:var(--color-background-default);border-radius:var(--radius-sm);width:100%;max-width:640px;max-height:90vh;box-shadow:var(--shadow-xl);position:relative;overflow-y:auto}.project-detail-close{top:var(--spacing-4);left:var(--spacing-4);border-radius:var(--radius-full);border:var(--border-width-default) solid var(--color-border-default);width:36px;height:36px;font-size:var(--font-size-sm);cursor:pointer;z-index:2;background-color:#ffffffe6;line-height:1;position:absolute}.project-detail-image img{object-fit:cover;width:100%;max-height:320px;display:block}.project-detail-body{padding:var(--spacing-7)}.project-detail-category{background-color:var(--color-primary-500);color:var(--text-white);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);padding:var(--spacing-1) var(--spacing-3);border-radius:var(--radius-sm);margin-bottom:var(--spacing-3);display:inline-block}.project-detail-title{font-size:var(--font-size-md);font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin-bottom:var(--spacing-4)}.project-detail-desc{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-6);line-height:1.8}.project-detail-specs{gap:var(--spacing-3);border-top:1px solid var(--color-border-default);padding-top:var(--spacing-5);flex-direction:column;display:flex}.spec-row{font-size:var(--font-size-xs);color:var(--color-text-primary);justify-content:space-between;display:flex}.spec-row span:first-child{color:var(--color-text-muted)}