.project-page-section{color:var(--text-secondary);background-color:var(--background);min-height:calc(100vh - 200px);padding:40px 7rem;transition:color .3s,background-color .3s;overflow:visible}.project-page-section-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1.5rem;margin:0 0 1.5rem;display:flex}.project-page-section-header-inner{flex:1;min-width:250px}.project-page-section-header h2{color:var(--primary);margin:0;font-size:2rem;font-weight:500;transition:color .3s}.project-page-section-header h2 span{color:var(--text);transition:color .3s}.project-page-description-text{color:var(--text-secondary);margin:0 0 .5rem;font-size:1rem;transition:color .3s}.project-page-header-actions{align-items:center;gap:1rem;display:flex}.export-json-btn{background:linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);color:var(--button-text);cursor:pointer;white-space:nowrap;border:none;border-radius:8px;align-items:center;gap:.5rem;padding:10px 20px;font-size:.95rem;font-weight:500;transition:all .3s;display:flex}.export-json-btn:hover{box-shadow:0 4px 12px rgba(var(--primary-rgb), .3);transform:translateY(-2px)}.export-json-btn .export-icon{font-size:1.2rem}.project-comparison-row{justify-content:flex-start;margin-bottom:1.5rem;display:flex}.projects-category-filter{flex-wrap:wrap;gap:10px;margin-bottom:2rem;display:flex}.projects-category-filter .category-btn{border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;background:0 0;padding:8px 20px;font-size:.95rem;transition:color .3s,border-color .3s,background-color .3s;position:relative;overflow:hidden}.projects-category-filter .category-btn:hover{border-color:var(--border-hover);color:var(--text)}.projects-category-filter .category-btn.active{color:var(--button-text);border-color:#0000}.projects-category-filter .category-active-bg{background:linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);z-index:-1;position:absolute;inset:0}.projects-category-filter .category-text{z-index:1;position:relative}.project-page-complete-outer{margin-bottom:3rem}.project-page-complete-main h2{color:var(--primary);margin:0;font-size:2rem;font-weight:500;transition:color .3s}.project-page-complete-main h2 span{color:var(--text);transition:color .3s}.project-page-project-grid{grid-template-columns:repeat(4,1fr);gap:20px;margin-top:1.5rem;display:grid}.no-projects-message{text-align:center;color:var(--text-secondary);background-color:var(--background-card);border:1px solid var(--border);border-radius:4px;width:100%;margin-top:2rem;padding:2rem;font-size:1.2rem;transition:color .3s,background-color .3s,border-color .3s}.animate-from-top,.animate-from-left,.animate-from-right,.animate-from-bottom{opacity:0;transition:all .5s ease-out;transform:translateY(-30px)}.animate-from-left{transform:translate(-100px)}.animate-from-right{transform:translate(100px)}.animate-from-bottom{transform:translateY(30px)}.animate-visible{opacity:1;transform:translate(0)translateY(0)}@media (max-width:1400px){.project-page-project-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:1200px){.project-page-section{padding:40px 4rem}}@media (max-width:992px){.project-page-section{padding:40px 2rem}.project-page-project-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.project-page-section{padding:20px 1rem}.project-page-section-header{flex-direction:column;gap:1rem}.project-page-section-header h2{font-size:1.75rem}.projects-category-filter{gap:8px}.projects-category-filter .category-btn{padding:6px 14px;font-size:.85rem}.project-comparison-row{justify-content:stretch}.comparison-trigger-btn{flex:1}.project-page-project-grid{grid-template-columns:1fr}.project-page-header-actions{flex-wrap:wrap}}@media (max-width:480px){.project-page-section-header h2{font-size:1.5rem}}.modal-content::-webkit-scrollbar{width:12px}.modal-content::-webkit-scrollbar-track{background:var(--background)}.modal-content::-webkit-scrollbar-thumb{background-color:var(--text);border:3px solid var(--background);border-radius:6px}.modal-content::-webkit-scrollbar-thumb:hover{background-color:var(--text)}.modal-content{scrollbar-width:thin;scrollbar-color:var(--text) var(--background)}.category-modal-content{width:90%;max-width:400px}.category-list{flex-direction:column;gap:10px;display:flex}.category-item{background-color:var(--background-hover);color:var(--text);cursor:pointer;padding:10px;transition:all .3s,background-color .3s}.category-item:hover{background-color:var(--primary)}.category-item.active{background-color:var(--primary);color:var(--text)}.video-expand-button{border:2px solid var(--primary-hover);width:100%;color:var(--text);cursor:pointer;text-align:center;background:0 0;justify-content:center;align-items:center;margin-top:20px;padding:10px 20px;font-size:1rem;transition:background-color .3s,border-color .3s,color .3s;display:flex}.video-expand-button svg{margin-right:8px}.video-expand-button:hover{background-color:var(--background-hover)}.project-modal-title{margin:.5rem 0}.modal-tech-stack{color:var(--text-secondary);border-bottom:1px solid var(--border);background-color:var(--primary-light);padding:8px 12px;font-size:.9rem;transition:color .3s,border-color .3s,background-color .3s}.project-modal-description{color:var(--text-muted);margin:10px 0;font-size:1rem;transition:color .3s}.category-selection-modal{margin:10px 0}.keyboard-focused .project-card{outline:2px solid var(--primary);outline-offset:4px;box-shadow:0 0 20px rgba(var(--primary-rgb), .3)}.keyboard-nav-hint{color:var(--text-secondary);opacity:.7;justify-content:center;align-items:center;gap:.5rem;margin-top:2rem;padding:1rem;font-size:.85rem;transition:opacity .3s;display:flex}.keyboard-nav-hint:hover{opacity:1}.hint-key{background:var(--surface);border:1px solid var(--border);min-width:1.5rem;height:1.5rem;color:var(--text);border-radius:4px;justify-content:center;align-items:center;padding:0 .4rem;font-family:monospace;font-size:.75rem;font-weight:600;display:inline-flex}.hint-text{margin:0 .25rem}@media (max-width:768px){.keyboard-nav-hint{display:none}}
