.projects-section{background-color:#081b29;padding:100px 10%}.projects-container{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:30px;max-width:1200px;margin:0 auto;display:grid}.project-card{opacity:0;background:#00abf00d;border:1px solid #00abf033;border-radius:15px;padding:30px;transition:transform .3s,box-shadow .3s;animation:.6s forwards cardSlideIn;position:relative;transform:translateY(30px)}@keyframes cardSlideIn{to{opacity:1;transform:translateY(0)}}.project-card:first-child{animation-delay:.1s}.project-card:nth-child(2){animation-delay:.2s}.project-card:nth-child(3){animation-delay:.3s}.project-card:nth-child(4){animation-delay:.4s}.project-card:nth-child(5){animation-delay:.5s}.project-card:nth-child(6){animation-delay:.6s}.project-card:hover{transform:translateY(-10px);box-shadow:0 10px 30px #00abf04d}.project-header{justify-content:space-between;align-items:flex-start;gap:15px;margin-bottom:15px;display:flex}.project-title{color:#00abf0;flex:1;margin-bottom:0;font-size:24px}.project-favicon{background:#fff;border:1px solid #00abf033;border-radius:8px;flex-shrink:0;width:32px;height:32px;padding:4px;transition:transform .3s,box-shadow .3s;box-shadow:0 4px 10px #00abf033}.project-favicon:hover{transform:scale(1.1);box-shadow:0 6px 15px #00abf066}.project-description{color:#8892b0;margin-bottom:20px;font-size:16px;line-height:1.6}.tech-stack h4{color:#ededed;margin-bottom:10px;font-size:18px}.tech-list{flex-wrap:wrap;gap:10px;margin-bottom:20px;padding:0;list-style:none;display:flex}.tech-item{color:#00abf0;background:#00abf01a;border:1px solid #00abf04d;border-radius:20px;padding:5px 15px;font-size:14px}.project-link{color:#00abf0;align-items:center;gap:8px;font-weight:600;text-decoration:none;transition:all .3s;display:inline-flex}.project-link:hover{gap:12px}.link-icon{font-size:20px}@media (max-width:768px){.projects-section{padding:80px 5%}.projects-container{grid-template-columns:1fr}.project-card{padding:25px}.project-title{font-size:22px}.project-description{font-size:15px}}@media (max-width:480px){.project-card{padding:20px}.tech-list{gap:8px}.tech-item{padding:4px 12px;font-size:13px}}@media (max-width:1024px) and (min-width:769px){.projects-section{padding:90px 7%}.projects-container{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}}
