.cpms-page{min-height:100vh;position:relative}.cpms-grid-bg{pointer-events:none;z-index:-1;background-color:#eff6ff;background-image:linear-gradient(#00000014 1px,#0000 1px),linear-gradient(90deg,#00000014 1px,#0000 1px);background-size:16px 16px;position:fixed;inset:0}.cpms-hero{text-align:center;padding:120px 0 60px}.cpms-hero-content{margin-bottom:40px}.cpms-badge{color:#fff;background:#3b82f6;border:3px solid #000;margin-bottom:20px;padding:8px 20px;font-size:1rem;font-weight:600;display:inline-block}.cpms-hero h1{color:#1e3a8a;text-shadow:4px 4px #0003;margin-bottom:16px;font-size:4rem}.cpms-subtitle{color:#64748b;max-width:600px;margin:0 auto;font-size:1.3rem;line-height:1.6}.cpms-mockup{background:#fff;border:4px solid #000;max-width:700px;margin:0 auto;box-shadow:8px 8px #000}.mockup-header{background:#f1f5f9;border-bottom:3px solid #000;gap:8px;padding:12px 16px;display:flex}.mockup-dot{border:2px solid #000;width:12px;height:12px}.mockup-dot.red{background:#ef4444}.mockup-dot.yellow{background:#f59e0b}.mockup-dot.green{background:#22c55e}.mockup-canvas{flex-direction:column;align-items:center;gap:12px;padding:32px;display:flex}.canvas-node{background:#f8fafc;border:3px solid #000;align-items:center;gap:12px;min-width:160px;padding:12px 24px;display:flex;box-shadow:3px 3px #000}.canvas-node.node-user{background:#dbeafe}.canvas-node.node-customer{background:#d1fae5}.canvas-node.node-project{background:#e9d5ff}.canvas-node.node-task{background:#fef3c7}.canvas-node.node-report{background:#fecaca}.canvas-node .node-icon{color:#1e3a8a;font-size:1.25rem}.canvas-node .node-label{font-size:1rem;font-weight:600}.canvas-node.small{min-width:auto;padding:10px 16px}.canvas-line{background:#000;width:3px;height:20px}.canvas-branches{gap:40px;margin-top:8px;display:flex}.branch{flex-direction:column;align-items:center;gap:8px;display:flex}.canvas-line-short{background:#000;width:3px;height:16px}.cpms-subnav{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:40px;display:flex}.subnav-item{background:#fff;border:3px solid #000;padding:10px 20px;font-weight:600;transition:all .1s;box-shadow:3px 3px #000}.subnav-item:hover{transform:translate(1px,1px);box-shadow:2px 2px #000}.subnav-item.active{color:#fff;background:#3b82f6}.cpms-features{background:#fff;padding:80px 0}.features-header{text-align:center;margin-bottom:48px}.features-header h2{margin-bottom:12px;font-size:2.5rem}.features-header p{color:#64748b;font-size:1.2rem}.features-grid{grid-template-columns:repeat(3,1fr);gap:24px;display:grid}.feature-card{text-align:center;background:#f8fafc;border:4px solid #000;padding:28px 24px;box-shadow:6px 6px #000}.feature-card .feature-icon{border:3px solid #000;justify-content:center;align-items:center;width:60px;height:60px;margin:0 auto 16px;font-size:2rem;display:flex}.feature-blue .feature-icon{color:#1d4ed8;background:#dbeafe}.feature-green .feature-icon{color:#059669;background:#d1fae5}.feature-purple .feature-icon{color:#7c3aed;background:#e9d5ff}.feature-orange .feature-icon{color:#ea580c;background:#fed7aa}.feature-teal .feature-icon{color:#0d9488;background:#ccfbf1}.feature-red .feature-icon{color:#dc2626;background:#fecaca}.feature-card h3{margin-bottom:8px;font-size:1.25rem}.feature-card p{color:#64748b;font-size:1rem;line-height:1.5}.cpms-workflow{background:#1e3a8a;border-top:4px solid #000;border-bottom:4px solid #000;padding:80px 0}.workflow-text{text-align:center}.workflow-text h2{color:#fff;margin-bottom:16px;font-size:2.5rem}.workflow-text>p{color:#fffc;max-width:600px;margin:0 auto 40px;font-size:1.2rem}.workflow-steps{flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;display:flex}.step{background:#ffffff1a;border:3px solid #ffffff4d;flex-direction:column;align-items:center;gap:8px;padding:20px 24px;display:flex}.step i{color:#60a5fa;font-size:1.5rem}.step span{color:#fff;font-weight:600}.step-arrow{color:#ffffff80;font-size:1.25rem}.cpms-integration{background:#fff;padding:80px 0}.integration-header{text-align:center;margin-bottom:48px}.integration-header h2{font-size:2.5rem}.integration-grid{grid-template-columns:repeat(2,1fr);gap:32px;max-width:800px;margin:0 auto;display:grid}.integration-card{text-align:center;background:#f8fafc;border:4px solid #000;padding:32px;box-shadow:6px 6px #000}.integration-icon{color:#3b82f6;margin-bottom:16px;font-size:2.5rem}.integration-card h3{margin-bottom:12px;font-size:1.5rem}.integration-card p{color:#64748b;line-height:1.6}.cpms-testimonial{background:#f1f5f9;padding:80px 0}.testimonial-card{text-align:center;background:#fff;border:4px solid #000;max-width:700px;margin:0 auto;padding:40px;box-shadow:8px 8px #000}.testimonial-card blockquote{color:#334155;margin-bottom:24px;font-size:1.3rem;line-height:1.7}.testimonial-author{justify-content:center;align-items:center;gap:16px;display:flex}.author-avatar{color:#1d4ed8;background:#dbeafe;border:3px solid #000;justify-content:center;align-items:center;width:50px;height:50px;font-size:1.25rem;display:flex}.author-info{text-align:left;flex-direction:column;display:flex}.author-name{color:#1e293b;font-weight:700}.author-role{color:#64748b;font-size:.9rem}.cpms-benefits{background:#fff;padding:80px 0}.benefits-grid{grid-template-columns:repeat(3,1fr);gap:32px;display:grid}.benefit-item{text-align:center;background:#f8fafc;border:4px solid #000;padding:28px 24px;box-shadow:6px 6px #000}.benefit-icon{color:#3b82f6;margin-bottom:16px;font-size:2rem}.benefit-item h3{margin-bottom:8px;font-size:1.25rem}.benefit-item p{color:#64748b;margin-bottom:16px;line-height:1.5}.benefit-link{color:#3b82f6;font-weight:600}.cpms-cta{text-align:center;background:linear-gradient(135deg,#3b82f6 0%,#1d4ed8 100%);border-top:4px solid #000;padding:100px 0}.cta-content h2{color:#fff;margin-bottom:32px;font-size:2.5rem}.cta-buttons{justify-content:center;gap:16px;display:flex}.btn-cta-primary{color:#1d4ed8;background:#fff;border:4px solid #000;padding:16px 40px;font-size:1.1rem;font-weight:700;box-shadow:4px 4px #000}.btn-cta-primary:hover{transform:translate(2px,2px);box-shadow:2px 2px #000}@media (max-width:1024px){.features-grid,.benefits-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.cpms-hero h1{font-size:3rem}.features-grid,.benefits-grid,.integration-grid{grid-template-columns:1fr}.workflow-steps{flex-direction:column}.step-arrow{transform:rotate(90deg)}}