.portfolio-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem}.portfolio-item{overflow:hidden;display:flex;flex-direction:column;transition:transform .35s ease,box-shadow .35s ease;cursor:pointer;position:relative}.portfolio-item:hover{transform:translateY(-6px);box-shadow:0 20px 40px #0000001a}.portfolio-img{height:200px;position:relative;overflow:hidden;border-radius:24px 24px 0 0;background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center}.portfolio-img .portfolio-icon{font-size:3.5rem;color:#ffffffe6;text-shadow:0 4px 12px rgba(0,0,0,.15)}.portfolio-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#00000040;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s;border-radius:24px 24px 0 0}.portfolio-item:hover .portfolio-overlay{opacity:1}.portfolio-info{padding:1.5rem}.portfolio-info h3{margin-bottom:.3rem;font-size:1.25rem}.portfolio-service-badge{display:inline-block;padding:.25rem .75rem;border-radius:50px;font-size:.75rem;font-weight:600;color:var(--primary);background:#0066cc14;margin-bottom:.6rem}.tech-stack{font-size:.8rem;color:var(--text-muted);font-weight:500;margin-top:.5rem;margin-bottom:0}.project-modal-overlay{position:fixed;inset:0;z-index:10000;background:#00000080;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s ease;padding:2rem}.project-modal-overlay.active{opacity:1;visibility:visible}.project-modal{background:#fff;border-radius:24px;width:100%;max-width:600px;max-height:85vh;overflow-y:auto;position:relative;transform:translateY(30px) scale(.97);transition:transform .4s cubic-bezier(.16,1,.3,1);box-shadow:0 30px 80px #0003}.project-modal-overlay.active .project-modal{transform:translateY(0) scale(1)}.project-modal-close{position:absolute;top:1rem;right:1rem;width:36px;height:36px;border-radius:50%;border:none;background:#ffffffd9;color:#1d1d1f;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;transition:background .2s,transform .2s;box-shadow:0 2px 10px #0000001a;line-height:1}.project-modal-close:hover{background:#f0f0f0;transform:scale(1.1)}.project-modal-header{padding:6rem 2.5rem 2.5rem;border-radius:24px 24px 0 0;color:#fff;position:relative;overflow:hidden}.project-modal-header:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,#000000bf,#00000073,#0003);border-radius:24px 24px 0 0;z-index:0;pointer-events:none}.project-modal-service{display:inline-block;padding:.3rem .9rem;border-radius:50px;font-size:.8rem;font-weight:600;background:#fff3;margin-bottom:.75rem;position:relative;z-index:1}.project-modal-company{color:#fff;font-size:1.8rem;margin-bottom:0;position:relative;z-index:1;text-shadow:0 2px 8px rgba(0,0,0,.4)}.project-modal-body{padding:2rem}.project-modal-desc{font-size:1rem;line-height:1.7;color:var(--text-muted);margin-bottom:1.5rem}.project-modal-section{margin-bottom:1.5rem}.project-modal-section h4{font-size:1rem;font-weight:700;color:var(--text-main);display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.project-modal-section h4 i{font-size:1.2rem;color:var(--primary)}.project-modal-tags{display:flex;flex-wrap:wrap;gap:.5rem}.project-modal-tags span{padding:.3rem .8rem;border-radius:50px;font-size:.8rem;font-weight:500;background:var(--bg-secondary);color:var(--text-main)}.project-modal-features{list-style:none;padding:0;margin:0}.project-modal-features li{padding:.5rem 0 .5rem 1.5rem;position:relative;color:var(--text-muted);font-size:.95rem;border-bottom:1px solid rgba(0,0,0,.04)}.project-modal-features li:last-child{border-bottom:none}.project-modal-features li:before{content:"✓";position:absolute;left:0;color:#34c759;font-weight:700}.project-modal-link{margin-top:.5rem;gap:.5rem;width:100%}.project-modal-link i{font-size:1.1rem}.project-modal::-webkit-scrollbar{width:4px}.project-modal::-webkit-scrollbar-track{background:transparent}.project-modal::-webkit-scrollbar-thumb{background:#0000001f;border-radius:4px}@media(max-width:768px){.portfolio{padding:60px 0}.portfolio h2{font-size:1.8rem}.portfolio .lead-text{font-size:.95rem;margin-bottom:2rem!important}.portfolio-grid{grid-template-columns:1fr;gap:1.25rem}.portfolio-item{border-radius:18px}.portfolio-img{height:180px;border-radius:18px 18px 0 0}.portfolio-overlay{display:none}.portfolio-info{padding:1.2rem}.portfolio-info h3{font-size:1.15rem}.portfolio-service-badge{font-size:.7rem;padding:.2rem .6rem}.tech-stack{font-size:.75rem}.project-modal-overlay{padding:0;align-items:flex-end;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#0009}.project-modal{border-radius:20px 20px 0 0;max-height:90vh;max-width:100%;-webkit-overflow-scrolling:touch}.project-modal-close{top:.75rem;right:.75rem;width:40px;height:40px;font-size:1.6rem}.project-modal-header{padding:2.5rem 1.25rem 1.25rem;border-radius:20px 20px 0 0}.project-modal-company{font-size:1.3rem}.project-modal-service{font-size:.72rem}.project-modal-body{padding:1.25rem}.project-modal-desc{font-size:.9rem;line-height:1.6}.project-modal-tags span{font-size:.72rem;padding:.25rem .65rem}.project-modal-features li{font-size:.88rem;padding:.4rem 0 .4rem 1.3rem}.project-modal-link{padding:.85rem 1.5rem;font-size:.9rem}}@media(max-width:400px){.portfolio-grid{gap:1rem}.portfolio-img{height:150px}.portfolio-info{padding:1rem}.portfolio-info h3{font-size:1.05rem}.project-modal{max-height:92vh}.project-modal-header{padding:2rem 1rem 1rem}.project-modal-company{font-size:1.15rem}.project-modal-body{padding:1rem}}
