/* ========== development-works.css ========== */

.dev-hero{padding:80px 60px 60px;position:relative;overflow:hidden;text-align:center;background:radial-gradient(circle at center,rgba(66,33,112,0.2) 0%,transparent 70%);border-bottom:1px solid rgba(244,60,118,0.15)}
.dev-hero-content{position:relative;z-index:2}
.dev-hero-title{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.dev-title-line{font-family:'JetBrains Mono',monospace;font-size:5rem;font-weight:800;text-transform:uppercase;letter-spacing:3px;color:#bb99dd;line-height:1.1}
.dev-title-accent{color:#f43c76;text-shadow:0 0 30px rgba(244,60,118,0.6)}
.dev-hero-subtitle{font-family:'JetBrains Mono',monospace;font-size:1.2rem;color:#9977aa;margin-bottom:40px;letter-spacing:1px}

.dev-filter-section{padding:40px 60px 20px}
.dev-filter-wrapper{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.dev-filter-btn{font-family:'JetBrains Mono',monospace;font-size:0.8rem;text-transform:uppercase;letter-spacing:2px;padding:10px 20px;background:rgba(12,7,28,0.6);border:1px solid rgba(244,60,118,0.2);color:#9977aa;cursor:pointer;transition:all 0.3s;clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%)}
.dev-filter-btn:hover,.dev-filter-btn.active{background:rgba(244,60,118,0.15);border-color:#f43c76;color:#fff;box-shadow:0 0 20px rgba(244,60,118,0.3)}

.dev-projects-section{padding:40px 60px 80px}
.dev-projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.dev-project-card{background:rgba(12,7,28,0.7);border:1px solid rgba(244,60,118,0.15);transition:all 0.4s;cursor:pointer;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);animation:cardFadeIn 0.5s ease forwards}
.dev-project-card:hover{transform:translateY(-8px);border-color:#f43c76;box-shadow:0 20px 50px rgba(244,60,118,0.3)}
.dev-project-card.hidden{display:none}
@keyframes cardFadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.dev-card-image{position:relative;overflow:hidden;height:250px}
.dev-card-image img{width:100%;height:100%;object-fit:cover;object-position:top center;filter:grayscale(20%) brightness(0.85);transition:all 0.5s}
.dev-project-card:hover .dev-card-image img{filter:grayscale(0%) brightness(1.05);transform:scale(1.05)}
.dev-card-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(66,33,112,0.85);display:flex;justify-content:center;align-items:center;opacity:0;transition:all 0.4s}
.dev-project-card:hover .dev-card-overlay{opacity:1}
.dev-card-link{font-family:'JetBrains Mono',monospace;font-size:0.85rem;color:#fff;text-transform:uppercase;letter-spacing:2px;padding:12px 24px;border:2px solid #f43c76;transition:all 0.3s}
.dev-card-link:hover{background:#f43c76;box-shadow:0 0 25px rgba(244,60,118,0.7)}
.dev-card-body{padding:20px}
.dev-card-badges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.dev-card-badge{font-family:'JetBrains Mono',monospace;font-size:0.6rem;text-transform:uppercase;letter-spacing:1.5px;padding:4px 10px;border:1px solid rgba(244,60,118,0.2);background:rgba(244,60,118,0.08);color:#f43c76;text-decoration:none;transition:all 0.3s;clip-path:polygon(4px 0,100% 0,calc(100% - 4px) 100%,0 100%)}
.dev-badge-category{background:rgba(244,60,118,0.12);border-color:rgba(244,60,118,0.3)}
.dev-badge-year{background:rgba(66,33,112,0.3);border-color:rgba(66,33,112,0.4);color:#bb99dd}
.dev-badge-tag{background:rgba(153,119,170,0.1);border-color:rgba(153,119,170,0.25);color:#9977aa;font-size:0.55rem;padding:3px 8px}
.dev-badge-link{background:rgba(16,185,129,0.1);border-color:rgba(16,185,129,0.25);color:#10b981}
.dev-badge-link:hover{background:rgba(16,185,129,0.2);box-shadow:0 0 12px rgba(16,185,129,0.3)}
.dev-card-title{font-family:'Orbitron',sans-serif;font-size:1.2rem;color:#fff;margin-bottom:8px;font-weight:600}
.dev-card-desc{font-family:'JetBrains Mono',monospace;font-size:0.75rem;color:#9977aa;line-height:1.5;margin-bottom:0}

.dev-load-more-wrapper{text-align:center;margin-top:40px}
.dev-load-more-btn{font-family:'JetBrains Mono',monospace;font-size:0.85rem;text-transform:uppercase;letter-spacing:2px;padding:14px 35px;background:transparent;border:1px solid rgba(244,60,118,0.4);color:#bb99dd;cursor:pointer;transition:all 0.3s;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%)}
.dev-load-more-btn:hover{background:rgba(244,60,118,0.15);border-color:#f43c76;color:#fff;box-shadow:0 0 30px rgba(244,60,118,0.4)}

.dev-cta-section{padding:60px;text-align:center;background:radial-gradient(circle at center,rgba(244,60,118,0.08) 0%,transparent 70%);border-top:1px solid rgba(244,60,118,0.12)}
.dev-cta-content{max-width:600px;margin:0 auto}
.dev-cta-title{font-family:'Orbitron',sans-serif;font-size:2rem;color:#fff;margin-bottom:15px;text-shadow:0 0 20px rgba(244,60,118,0.3)}
.dev-cta-text{font-family:'JetBrains Mono',monospace;font-size:0.9rem;color:#9977aa;margin-bottom:30px;line-height:1.6}

/* Модалка */
.dev-project-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.92);z-index:9999;display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:all 0.3s}
.dev-project-modal.active{opacity:1;visibility:visible}
.dev-modal-content{background:rgba(12,7,28,0.98);border:1px solid rgba(244,60,118,0.4);max-width:1100px;width:95%;max-height:90vh;overflow-y:auto;clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);position:relative;border-radius:28px;overflow:hidden}
.dev-modal-close{position:absolute;top:15px;right:20px;font-size:2.5rem;color:#9977aa;cursor:pointer;z-index:10;transition:0.3s;line-height:1}
.dev-modal-close:hover{color:#f43c76;transform:rotate(90deg)}
.dev-modal-body{padding:30px}
.dev-modal-title{font-family:'Orbitron',sans-serif;font-size:1.8rem;color:#fff;margin-bottom:12px}
.dev-modal-desc{font-family:'JetBrains Mono',monospace;font-size:0.85rem;color:#9977aa;line-height:1.7;margin-bottom:20px}

/* Превью iframe */
.dev-preview-tabs{display:flex;gap:0;padding:10px 20px;background:#0f172a}
.dev-preview-tab{font-family:'JetBrains Mono',monospace;font-size:0.7rem;text-transform:uppercase;letter-spacing:1px;padding:8px 16px;border:none;background:transparent;color:#64748b;cursor:pointer;transition:all 0.3s}
.dev-preview-tab.active{background:#1e293b;color:#f43c76}
.dev-preview-frame-wrapper{position:relative;width:100%;height:500px;overflow:hidden;background:#0f172a}
.dev-preview-frame{position:absolute;top:0;left:0;width:100%;height:100%;border:none;display:none}
.dev-preview-frame.active{display:block}
.dev-preview-frame.mobile{width:375px;left:50%;transform:translateX(-50%);border-left:1px solid #334155;border-right:1px solid #334155}

/* Форма в модалке */
.dev-order-btn{margin-top:10px}
.dev-inline-form{margin-top:20px;padding-top:20px;border-top:1px solid rgba(244,60,118,0.2)}
.dev-inline-form .form-group{margin-bottom:12px}
.dev-inline-form .form-group input{width:100%;padding:12px;background:rgba(10,5,25,0.8);border:1px solid rgba(244,60,118,0.3);color:#fff;font-family:'JetBrains Mono',monospace;outline:none}
.dev-inline-form .form-group input:focus{border-color:#f43c76}

@media(max-width:1100px){
.dev-hero{padding:60px 30px 40px}
.dev-title-line{font-size:3.5rem}
.dev-projects-grid{grid-template-columns:repeat(2,1fr)}
.dev-projects-section{padding:30px 30px 60px}
}
@media(max-width:768px){
.dev-hero{padding:40px 20px 30px}
.dev-title-line{font-size:2.5rem}
.dev-hero-subtitle{font-size:0.9rem}
.dev-filter-section{padding:25px 20px 10px}
.dev-filter-btn{font-size:0.7rem;padding:8px 14px}
.dev-projects-grid{grid-template-columns:1fr;gap:20px}
.dev-projects-section{padding:25px 20px 40px}
.dev-card-image{height:200px}
.dev-cta-section{padding:40px 20px}
.dev-cta-title{font-size:1.5rem}
.dev-modal-content{width:96%;max-height:92vh}
.dev-modal-body{padding:20px}
.dev-modal-title{font-size:1.3rem}
.dev-preview-frame-wrapper{height:300px}
.dev-preview-frame.mobile{width:100%;left:0;transform:none;border:none}
.dev-preview-tab{font-size:0.65rem;padding:6px 10px}
}
@media(max-width:400px){
.dev-title-line{font-size:2rem}
.dev-filter-btn{font-size:0.65rem;padding:6px 10px}
}