.interactive-services-grid{gap:var(--space-lg);grid-template-columns:repeat(auto-fit,minmax(320px,1fr));display:grid;position:relative}.interactive-service-card{background:var(--bg-card);padding:var(--space-xl) var(--space-lg);transition:all var(--transition-fast);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));cursor:pointer;text-align:left;border:none;outline:none;width:100%;display:block;position:relative}.interactive-service-card:before{content:"";clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));background:linear-gradient(135deg, var(--border-subtle), transparent 50%);-webkit-mask-composite:xor;pointer-events:none;transition:all var(--transition-fast);padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.card-glitch-layer-1,.card-glitch-layer-2{background:var(--bg-card-hover);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));opacity:0;pointer-events:none;z-index:1;position:absolute;inset:0}.card-glitch-layer-1{border-left:2px solid var(--cyan);box-shadow:inset 20px 0 20px -20px var(--cyan)}.card-glitch-layer-2{border-right:2px solid var(--pink);box-shadow:inset -20px 0 20px -20px var(--pink)}.interactive-service-card-inner{z-index:2;pointer-events:none;position:relative}.interactive-service-card:hover{background:var(--bg-card-hover);transform:translateY(-2px)}.interactive-service-card:hover:before{background:linear-gradient(135deg, var(--border-glow), transparent 50%);box-shadow:0 8px 32px #00f0ff1a}.interactive-service-card-cyan:hover:before{background:linear-gradient(135deg, var(--cyan), transparent 50%)}.interactive-service-card-pink:hover:before{background:linear-gradient(135deg, var(--pink), transparent 50%)}.interactive-service-card-yellow:hover:before{background:linear-gradient(135deg, var(--yellow), transparent 50%)}.interactive-service-card:hover .card-glitch-layer-1,.interactive-service-card:active .card-glitch-layer-1{opacity:.5;animation:.4s cubic-bezier(.25,.46,.45,.94) infinite both glitch-1}.interactive-service-card:hover .card-glitch-layer-2,.interactive-service-card:active .card-glitch-layer-2{opacity:.5;animation:.4s cubic-bezier(.25,.46,.45,.94) infinite reverse both glitch-2}.interactive-service-card:active{transform:scale(.97)translateY(0)}.interactive-service-card:active:before{background:linear-gradient(135deg,#fff,#0000 50%)}.interactive-service-card:active .interactive-service-icon{color:#fff;text-shadow:0 0 10px #fff}.interactive-service-icon{margin-bottom:var(--space-md);transition:all var(--transition-fast);font-size:2.5rem;line-height:1}.interactive-service-card h3{margin-bottom:var(--space-sm);color:var(--text-primary);transition:color var(--transition-fast);font-size:1.25rem}.interactive-service-card:hover h3{color:#fff}.interactive-service-desc{color:var(--text-secondary);font-size:.9rem;line-height:1.6}.interactive-service-index{top:var(--space-md);right:var(--space-md);color:var(--text-muted);opacity:.4;transition:all var(--transition-fast);font-size:.7rem;position:absolute}.interactive-service-card:hover .interactive-service-index{color:var(--cyan);opacity:1}.service-modal-backdrop{-webkit-backdrop-filter:blur(8px);z-index:1000;padding:var(--space-md);opacity:0;background:#0009;justify-content:center;align-items:center;animation:.3s forwards modal-fade-in;display:flex;position:fixed;inset:0}.service-modal{clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,24px 100%,0 calc(100% - 24px));background:#0a0a0f;width:100%;max-width:600px;animation:.4s cubic-bezier(.16,1,.3,1) forwards modal-slide-up;position:relative;transform:translateY(20px)scale(.95);box-shadow:0 20px 60px #000c,0 0 40px #00f0ff1a}.service-modal:before{content:"";clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,24px 100%,0 calc(100% - 24px));background:linear-gradient(135deg, var(--cyan), transparent 50%, var(--pink));-webkit-mask-composite:xor;pointer-events:none;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.modal-header{padding:var(--space-lg) var(--space-xl) var(--space-md);background:linear-gradient(#00f0ff0d,#0000);border-bottom:1px solid #00f0ff1a;justify-content:space-between;align-items:center;display:flex}.modal-title-wrapper{align-items:center;gap:var(--space-sm);display:flex}.modal-icon{font-size:1.8rem}.modal-header h3{color:#fff;margin:0;font-size:1.5rem}.modal-close-btn{color:var(--text-muted);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;padding:.2rem .5rem;font-size:1.5rem;line-height:1}.modal-close-btn:hover{color:var(--pink);transform:scale(1.1)}.modal-body{padding:var(--space-lg) var(--space-xl)}.modal-desc-short{color:var(--text-primary);margin-bottom:var(--space-lg);font-size:1.05rem;line-height:1.6}.modal-details{padding:var(--space-md);border:1px solid #00f0ff1a;border-left:3px solid var(--cyan);background:#00f0ff05}.modal-label{color:var(--cyan);text-transform:uppercase;letter-spacing:.1em;margin-bottom:var(--space-sm);font-size:.75rem;display:block}.modal-details p{color:var(--text-secondary);font-size:.95rem;line-height:1.7}.modal-footer{padding:var(--space-md) var(--space-xl);background:#0003;border-top:1px solid #00f0ff1a;justify-content:flex-end;display:flex}@keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}@keyframes modal-slide-up{0%{opacity:0;transform:translateY(20px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}
