.container{width:90%;margin:auto;text-align:center}.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px;padding:100px 0}.project-item{position:relative;overflow:hidden;border-radius:8px}.project-img{position:relative;overflow:hidden}.project-img img{width:100%;display:block;border-radius:8px;transition:transform .3s}.project-item:hover img{transform:scale(1.1)}.project-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom,transparent 0%,rgb(0 0 0 / .6) 81%);color:#fff;align-content:end;opacity:0;transition:opacity .3s;padding:10px;cursor:pointer}.project-item:hover .project-overlay{opacity:1}.project-title{text-decoration:none;color:#fff;font-size:24px;font-weight:700;transition:all .3s}.project-title:hover{text-decoration:underline;color:#fff}.project-title{text-align:left}.project-category{font-size:18px;font-style:italic;margin-top:5px;transition:all .3s;text-align:left;width:100%;color:#fff}.project-category:hover a,.project-category a{color:#fff}.project-category:hover{text-decoration:underline}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgb(0 0 0 / .9);justify-content:center;align-items:center;z-index:9999;padding:30px}.modal-content{position:relative;width:100%;max-width:1200px;background:#fff;color:#000;padding:20px;border-radius:10px;height:100%}.close-btn{position:absolute;top:-10px;right:-10px;font-size:20px;color:#fff;cursor:pointer;background-color:red;width:max-content;height:20px;padding:15px 10px;line-height:1px;border-radius:100px;text-align:center}.project-overlay .title{color:#fff;font-size:24px}.project-title:hover{color:#ffff!important}.project-img img{height:350px;object-fit:cover}#modalBody .project-category a{color:#000}#modalIframe{width:100%;height:100%}.project-filters{margin-bottom:30px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:60px}.filter-btn{padding:8px 16px;background:#eee;text-decoration:none;border-radius:4px;color:#333;transition:.3s}.project-filters .filter-btn.active,.project-filters .filter-btn:hover{background:#333;color:#fff}@media (max-width:768px){.projects-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:600px){.projects-grid{grid-template-columns:repeat(1,1fr)}}