.v4-header{position:fixed;inset:0 0 auto;z-index:1000;background:rgba(7,15,29,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.08)}.v4-nav{height:78px;display:flex;align-items:center;justify-content:space-between}.v4-logo{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none}.v4-logo img{width:54px;height:54px;object-fit:contain;border-radius:12px;background:#fff}.v4-logo span{display:grid}.v4-logo b{font-size:16px;letter-spacing:.06em}.v4-logo small{font-size:9px;opacity:.55;letter-spacing:.08em}.projects-v4{padding:110px 0;background:#f4f7fb}.projects-v4 .section-head{margin-bottom:34px}.portfolio-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.portfolio-card{background:#fff;border:1px solid #e4eaf1;border-radius:26px;overflow:hidden;box-shadow:0 12px 35px rgba(16,38,70,.06);transition:.3s}.portfolio-card:hover{transform:translateY(-6px);box-shadow:0 22px 55px rgba(16,38,70,.12)}.portfolio-preview{height:285px;background:linear-gradient(135deg,#071426,#12335d);padding:22px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.portfolio-preview:after{content:"";position:absolute;width:250px;height:250px;border-radius:50%;background:#087ef3;filter:blur(80px);opacity:.28;right:-60px;bottom:-90px}.mini-browser{width:92%;height:88%;background:#fff;border-radius:13px;box-shadow:0 20px 50px rgba(0,0,0,.3);overflow:hidden;position:relative;z-index:1}.mini-top{height:30px;background:#eef2f6;display:flex;align-items:center;gap:5px;padding:0 10px}.mini-top i{width:7px;height:7px;border-radius:50%;background:#aab5c2}.mini-screen{height:calc(100% - 30px);display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,#fff,#edf5ff);color:#0b5db8}.mini-screen i{font-size:42px}.mini-screen b{margin-top:12px;color:#122033;font-size:20px}.mini-screen small{margin-top:5px;color:#75869a}.portfolio-content{padding:26px}.portfolio-meta{display:flex;align-items:center;justify-content:space-between;color:#087ef3;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.portfolio-content h3{font-size:25px;margin:11px 0 8px;color:#101d2e}.portfolio-content p{color:#657387;line-height:1.7;margin:0 0 20px}.portfolio-links{display:flex;gap:12px;align-items:center}.portfolio-links a{text-decoration:none;font-weight:800;font-size:13px}.case-link{color:#0b6fd7}.live-link{color:#627083}.project-page{background:#07111f;color:#fff;min-height:100vh}.back-link{color:#fff;text-decoration:none;font-weight:700}.project-hero{padding-top:150px;min-height:720px;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.project-type{color:#45a5ff;font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase}.project-hero h1{font-size:clamp(44px,6vw,78px);line-height:1;margin:18px 0 24px}.project-hero p{font-size:18px;line-height:1.8;color:#aebed1}.feature-chips{display:flex;flex-wrap:wrap;gap:9px;margin:25px 0}.feature-chips span{border:1px solid rgba(255,255,255,.13);padding:9px 12px;border-radius:99px;color:#d9e6f5;font-size:12px}.feature-chips i{color:#46aaff;margin-right:6px}.project-actions{display:flex;gap:12px;margin-top:30px}.browser-mock{background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 35px 100px rgba(0,0,0,.35);transform:perspective(900px) rotateY(-4deg)}.browser-top{height:44px;background:#e9eef4;color:#718094;display:flex;align-items:center;gap:7px;padding:0 13px}.browser-top i{width:9px;height:9px;background:#a7b3c0;border-radius:50%}.browser-top span{margin-left:10px;font-size:11px}.mock-body{height:410px;background:linear-gradient(145deg,#fff,#e9f4ff);color:#0877df;display:flex;flex-direction:column;align-items:center;justify-content:center}.mock-body i{font-size:72px}.mock-body strong{font-size:30px;color:#132238;margin-top:18px}.mock-body small{color:#6e8093;margin-top:8px}.project-info{padding:100px 0 130px;border-top:1px solid rgba(255,255,255,.08)}.project-info span{color:#4baaff;font-size:12px;font-weight:800;letter-spacing:.12em}.project-info h2{font-size:48px;margin:20px 0}.project-info p{max-width:760px;color:#aebed1;line-height:1.8;font-size:17px}@media(max-width:900px){.portfolio-grid,.project-hero{grid-template-columns:1fr}.portfolio-preview{height:220px}.project-hero{padding-top:120px;gap:35px}.browser-mock{transform:none}.mock-body{height:300px}.v4-logo small{display:none}}
