{"id":548,"date":"2025-08-23T10:41:52","date_gmt":"2025-08-23T10:41:52","guid":{"rendered":"https:\/\/steganostech.com\/?post_type=portfolio&p=548"},"modified":"2025-08-24T18:46:57","modified_gmt":"2025-08-24T18:46:57","slug":"managed-soc-services","status":"publish","type":"portfolio","link":"https:\/\/steganostech.com\/index.php\/portfolio\/managed-soc-services\/","title":{"rendered":"Managed SOC Services"},"content":{"rendered":"\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\n\n\n \n \n Elite SOC Services - Advanced Cyber Defense Operations<\/title>\n\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/three.js\/r128\/three.min.js\"><\/script>\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n\n <style>\n :root {\n --header-height: 0px; \/* updated by JS when header is visible *\/\n }\n\n * { margin: 0; padding: 0; box-sizing: border-box; }\n\n html, body {\n height: 100%;\n font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\n background: #000;\n color: #fff;\n \/* keep snap-scroll behavior: scrolling occurs inside .scroll-container *\/\n overflow: hidden;\n }\n\n \/* Scroll container height will be adjusted by CSS var *\/\n .scroll-container {\n height: calc(100vh - var(--header-height));\n overflow-y: auto;\n scroll-snap-type: y mandatory;\n scroll-behavior: smooth;\n }\n\n .section {\n height: calc(100vh - var(--header-height));\n width: 100%;\n scroll-snap-align: start;\n display: flex;\n position: relative;\n overflow: hidden;\n }\n .technologies-section {\n min-height: 100vh;\n padding: 80px 20px;\n background: linear-gradient(135deg, rgba(0, 40, 60, 0.9) 0%, rgba(60, 0, 40, 0.9) 100%);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n }\n\n .tech-slider-container {\n width: 100%;\n max-width: 1400px;\n margin: 0 auto;\n position: relative;\n overflow-x: clip;\n overflow-y: visible;\n padding: 30px 0;\n }\n\n .tech-slider-track {\n display: flex;\n height: 100%;\n transition: transform 0.5s ease-in-out;\n }\n\n .tech-card {\n flex: 0 0 auto;\n width: 300px;\n margin: 0 20px;\n background: rgba(255, 255, 255, 0.05);\n border: 1px solid rgba(255, 255, 255, 0.1);\n border-radius: 20px;\n padding: 2rem;\n display: flex;\n flex-direction: column;\n align-items: center;\n transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);\n position: relative;\n overflow: hidden;\n backdrop-filter: blur(3px);\n cursor: pointer;\n }\n\n .tech-card:hover {\n transform: translateY(-20px) rotateY(5deg);\n box-shadow: 0 40px 80px rgba(0, 255, 255, 0.2);\n border-color: rgba(0, 255, 255, 0.5);\n }\n\n .tech-icon {\n width: 100px;\n height: 100px;\n background: linear-gradient(45deg, #ff006e, #8338ec);\n border-radius: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 2.8rem;\n margin-bottom: 1.5rem;\n box-shadow: 0 20px 40px rgba(255, 0, 110, 0.3);\n transition: transform 0.3s ease;\n }\n\n .tech-card:hover .tech-icon {\n transform: scale(1.1) rotate(5deg);\n }\n\n .tech-card h3 {\n font-size: 1.5rem;\n margin-bottom: 1rem;\n color: #00ffff;\n text-align: center;\n }\n\n .tech-card p {\n color: rgba(255, 255, 255, 0.8);\n line-height: 1.6;\n text-align: center;\n font-size: 1rem;\n margin-bottom: 1.5rem;\n }\n\n .tech-features {\n width: 100%;\n margin-top: auto;\n }\n\n .tech-feature {\n display: flex;\n align-items: center;\n margin-bottom: 0.8rem;\n font-size: 0.9rem;\n }\n\n .tech-feature i {\n color: #00ffff;\n margin-right: 10px;\n font-size: 0.8rem;\n }\n\n .tech-category {\n position: absolute;\n top: 20px;\n right: 20px;\n background: rgba(0, 255, 255, 0.1);\n color: #00ffff;\n padding: 5px 12px;\n border-radius: 20px;\n font-size: 0.8rem;\n font-weight: 600;\n }\n\n .slider-controls {\n display: flex;\n justify-content: center;\n position: relative;\n gap: 15px;\n margin-bottom: -20px;\n }\n\n .slider-control {\n width: 50px;\n height: 50px;\n border-radius: 50%;\n background: rgba(255, 255, 255, 0.1);\n border: 1px solid rgba(255, 255, 255, 0.2);\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.3s ease;\n }\n\n .slider-control:hover {\n background: rgba(0, 255, 255, 0.2);\n transform: scale(1.1);\n }\n\n .slider-control i {\n font-size: 1.2rem;\n color: #00ffff;\n }\n\n \/* three.js canvas sits behind content; top\/height updated by JS too *\/\n #three-canvas {\n position: fixed;\n top: 0; \/* dynamically updated by JS when header visible *\/\n left: 0;\n width: 100%;\n height: 100%;\n z-index: -1; \/* behind everything *\/\n pointer-events: none;\n }\n\n \/* keep header styles untouched here \u2014 script will only toggle visibility\/display (not position) *\/\n .elementor-location-header,\n .elementor-sticky--effects,\n .elementor-header,\n .site-header,\n header {\n \/* no forced positioning here (we are intentionally NOT fixing header) *\/\n z-index: auto;\n }\n\n \/* ------------------ Original CSS (kept intact) ------------------ *\/\n .content-layer { position: relative; z-index: 2; width: 100%; height: 100%; display:flex; align-items:center; }\n\n .hero { background: linear-gradient(135deg, rgba(0,20,40,0.15) 0%, rgba(20,0,40,0.15) 100%); backdrop-filter: blur(2px); }\n\n .hero-content { display:flex; align-items:center; width:100%; max-width:1600px; margin:0 auto; padding:0 50px; }\n .hero-left { flex:1; padding-right:50px; animation: slideInLeft 1.2s ease-out; }\n @keyframes slideInLeft { from{opacity:0;transform:translateX(-100px)} to{opacity:1;transform:translateX(0)} }\n .hero-right { flex:1; display:flex; align-items:center; justify-content:center; animation: slideInRight 1.2s ease-out; }\n @keyframes slideInRight { from{opacity:0;transform:translateX(100px)} to{opacity:1;transform:translateX(0)} }\n\n .soc-dashboard { width:550px; height:450px; background:rgba(0,20,40,0.8); border:2px solid #00ffff; border-radius:15px; backdrop-filter: blur(20px); position:relative; overflow:hidden; box-shadow:0 0 50px rgba(0,255,255,0.3); transform-style:preserve-3d; transition: transform 0.5s ease, box-shadow 0.5s ease; }\n .soc-dashboard:hover { transform: translateY(-5px) rotateY(3deg); box-shadow:0 0 70px rgba(0,255,255,0.5); }\n\n .dashboard-header { background:linear-gradient(90deg,#ff006e,#8338ec); padding:15px; font-weight:bold; text-align:center; font-size:1.1rem; position:relative; overflow:hidden; }\n .dashboard-header::after { content:''; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg,transparent, rgba(255,255,255,0.3), transparent); animation: headerShine 3s infinite; }\n @keyframes headerShine { 0%{left:-100%} 20%{left:100%} 100%{left:100%} }\n\n .threat-monitor { padding:20px; height: calc(100% - 60px); display:flex; flex-direction:column; gap:15px; }\n .threat-alert { background: rgba(255,0,0,0.1); border-left:4px solid #ff0040; padding:10px 15px; border-radius:5px; font-size:.9rem; animation: alertPulse 2s infinite; transition: all .3s ease; transform-origin:left center; }\n .threat-alert:hover { transform: scale(1.02); box-shadow:0 5px 15px rgba(255,0,0,0.2); }\n .threat-alert.medium { background: rgba(255,165,0,0.1); border-left-color:#ffa500; }\n .threat-alert.low { background: rgba(0,255,0,0.1); border-left-color:#00ff00; }\n @keyframes alertPulse { 0%,100%{opacity:1} 50%{opacity:.7} }\n\n .network-graph { position:absolute; bottom:20px; right:20px; width:180px; height:100px; background:rgba(0,255,255,0.1); border-radius:10px; display:flex; align-items:center; justify-content:center; overflow:hidden; border:1px solid rgba(0,255,255,0.3); }\n .graph-lines { width:100%; height:100%; background:repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(0,255,255,0.3) 10px, rgba(0,255,255,0.3) 11px); animation:graphMove 3s linear infinite; }\n @keyframes graphMove { 0%{transform:translateX(-20px)} 100%{transform:translateX(20px)} }\n\n .activity-indicator { position:absolute; top:15px; right:15px; display:flex; gap:5px; }\n .activity-dot { width:8px; height:8px; border-radius:50%; background:#00ff00; animation: blink 1.4s infinite both; }\n .activity-dot:nth-child(2){ animation-delay:.2s } .activity-dot:nth-child(3){ animation-delay:.4s }\n @keyframes blink { 0%,80%,100%{opacity:.2} 40%{opacity:1} }\n\n .hero h1 { font-size:3.8rem; font-weight:800; margin-bottom:1.5rem; background:linear-gradient(45deg,#00ffff,#ff00ff,#ffff00); background-size:300% 300%; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; animation:gradientShift 3s ease-in-out infinite; line-height:1.1; }\n @keyframes gradientShift { 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }\n .cyber-term { color:#00ffff; font-weight:600; text-shadow:0 0 10px rgba(0,255,255,0.5); }\n .hero-subtitle { font-size:1.4rem; color:#b0b0b0; margin-bottom:2.5rem; line-height:1.6; }\n .cta-button { display:inline-block; background:linear-gradient(45deg,#ff006e,#8338ec,#3a86ff); color:#fff; padding:18px 40px; text-decoration:none; border-radius:50px; font-weight:700; font-size:1.1rem; transition:all .4s cubic-bezier(.175,.885,.32,1.275); position:relative; overflow:hidden; box-shadow:0 20px 40px rgba(255,0,110,0.3); text-transform:uppercase; letter-spacing:1px; margin-right:20px; margin-bottom:15px; }\n .cta-button::before { content:''; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent); transition:left .6s; }\n .cta-button:hover::before { left:100% }\n .cta-button:hover { transform: translateY(-5px) scale(1.05); box-shadow:0 30px 60px rgba(255,0,110,0.15); }\n .cta-button.secondary { background:transparent; border:2px solid #00ffff; color:#00ffff; }\n .cta-button.secondary:hover { background:#00ffff; color:#000; }\n\n .threat-intelligence { background: linear-gradient(135deg, rgba(20,0,40,0.15) 0%, rgba(0,40,20,0.9) 100%); backdrop-filter: blur(10px); align-items:center; justify-content:center; flex-direction:column; text-align:center; padding:50px; }\n .incident-response { background: linear-gradient(135deg, rgba(40,0,20,0.15) 0%, rgba(20,20,0,0.9) 100%); backdrop-filter: blur(10px); align-items:center; justify-content:center; flex-direction:column; text-align:center; padding:50px; }\n .services-overview { background: linear-gradient(135deg, rgba(0,40,40,0.15) 0%, rgba(40,0,0,0.9) 100%); backdrop-filter: blur(10px); align-items:center; justify-content:center; flex-direction:column; text-align:center; padding:50px; }\n .statistics-section { background: linear-gradient(135deg, rgba(40,0,40,0.15) 0%, rgba(0,20,60,0.9) 100%); backdrop-filter: blur(10px); align-items:center; justify-content:center; flex-direction:column; text-align:center; padding:50px; }\n .benefits-section { background: linear-gradient(135deg, rgba(60,0,40,0.15) 0%, rgba(0,40,60,0.9) 100%); backdrop-filter: blur(10px); align-items:center; justify-content:center; flex-direction:column; text-align:center; padding:50px; }\n .contact-section { background: linear-gradient(135deg, rgba(0,60,40,0.15) 0%, rgba(60,0,20,0.9) 100%); backdrop-filter: blur(10px); align-items:center; justify-content:center; flex-direction:column; text-align:center; padding:50px; }\n\n .section-title { font-size:3.2rem; font-weight:700; margin-bottom:2rem; background:linear-gradient(135deg,#00ffff 0%,#ff00ff 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }\n .section-content { max-width:1200px; margin:0 auto; width:100%; }\n .section-description { font-size:1.4rem; color:#b0b0b0; margin-bottom:3rem; line-height:1.8; }\n\n .services-slider-container { width:100%; max-width:1300px; margin:0 auto; overflow-x:clip; position:relative; padding:20px 0; }\n .services-track { display:flex; width:max-content; animation:slide 40s linear infinite; will-change: transform; }\n .services-track:hover { animation-play-state: paused; overflow: vi}\n @keyframes slide { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }\n .service-slide { flex:0 0 auto; width:350px; margin:0 15px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:20px; padding:2rem; text-align:center; transition: all .4s cubic-bezier(.175,.885,.32,1.275); position:relative; overflow:hidden; backdrop-filter: blur(20px); box-sizing:border-box; }\n .service-slide:hover { transform: translateY(-20px) rotateY(5deg); box-shadow: 0 40px 80px rgba(0,255,255,0.2); border-color: rgba(0,255,255,0.5); }\n .service-icon { width:90px; height:90px; background:linear-gradient(45deg,#ff006e,#8338ec); border-radius:20px; margin:0 auto 1.5rem; display:flex; align-items:center; justify-content:center; font-size:2.5rem; box-shadow:0 20px 40px rgba(255,0,110,0.3); transition: transform .3s ease; }\n .service-slide:hover .service-icon { transform: scale(1.1) rotate(5deg); }\n .service-slide h3 { font-size:1.5rem; margin-bottom:1.2rem; color:#00ffff; }\n .service-slide p { color: rgba(255,255,255,0.8); line-height:1.7; font-size:1.05rem; }\n\n .benefits-slider-container { width:100%; max-width:1300px; margin:0 auto; overflow-x:clip; overflow-y: visible; position:relative; padding:20px 0; }\n .benefits-track { display:flex; width:max-content; animation:slideBenefits 40s linear infinite; will-change: transform; }\n .benefits-track:hover { animation-play-state: paused; }\n @keyframes slideBenefits { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }\n .benefit-slide { flex:0 0 auto; width:350px; margin:0 15px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:20px; padding:2rem; text-align:center; transition: all .4s cubic-bezier(.175,.885,.32,1.275); position:relative; overflow:hidden; backdrop-filter: blur(20px); box-sizing:border-box; }\n .benefit-slide:hover { transform: translateY(-20px) rotateY(5deg); box-shadow:0 40px 80px rgba(0,255,255,0.2); border-color: rgba(0,255,255,0.5); }\n .benefit-icon { width:90px; height:90px; background: linear-gradient(45deg,#ff006e,#8338ec); border-radius:20px; margin:0 auto 1.5rem; display:flex; align-items:center; justify-content:center; font-size:2.5rem; box-shadow:0 20px 40px rgba(255,0,110,0.3); transition: transform .3s ease; }\n .benefit-slide:hover .benefit-icon { transform: scale(1.1) rotate(5deg); }\n .benefit-slide h3 { font-size:1.5rem; margin-bottom:1.2rem; color:#00ffff; }\n .benefit-slide p { color: rgba(255,255,255,0.8); line-height:1.7; font-size:1.05rem; }\n\n .benefits-grid { display:flex; justify-content:center; gap:2.5rem; max-width:1300px; width:100%; padding:0 20px; box-sizing:border-box; flex-wrap:wrap; }\n .benefit-card { flex:1; min-width:350px; max-width:380px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:20px; padding:2.5rem; text-align:center; transition: all .4s cubic-bezier(.175,.885,.32,1.275); position:relative; overflow:hidden; backdrop-filter: blur(20px); box-sizing:border-box; }\n .benefit-card:hover { transform: translateY(-20px) rotateY(5deg); box-shadow:0 40px 80px rgba(0,255,255,0.2); border-color: rgba(0,255,255,0.5); }\n .benefit-card-icon { width:90px; height:90px; background:linear-gradient(45deg,#ff006e,#8338ec); border-radius:20px; margin:0 auto 1.5rem; display:flex; align-items:center; justify-content:center; font-size:2.5rem; box-shadow:0 20px 40px rgba(255,0,110,0.3); transition: transform .3s ease; }\n .benefit-card:hover .benefit-card-icon { transform: scale(1.1) rotate(5deg); }\n .benefit-card h3 { font-size:1.5rem; margin-bottom:1.2rem; color:#00ffff; }\n .benefit-card p { color: rgba(255,255,255,0.8); line-height:1.7; font-size:1.05rem; }\n\n .stats-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap:2rem; max-width:1200px; width:100%; margin:2rem 0; }\n .stat-card { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:15px; padding:2rem; text-align:center; transition: all .3s ease; backdrop-filter: blur(20px); }\n .stat-card:hover { transform: translateY(-10px); box-shadow:0 20px 40px rgba(0,255,255,0.2); border-color: rgba(0,255,255,0.5); }\n .stat-number { font-size:3.5rem; font-weight:800; margin-bottom:.5rem; background:linear-gradient(135deg,#00ffff 0%, #ff00ff 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }\n .stat-label { font-size:1.2rem; color:#b0b0b0; }\n\n .contact-content { max-width:800px; margin:0 auto; }\n .contact-buttons { display:flex; justify-content:center; gap:2rem; margin-top:3rem; flex-wrap:wrap; }\n .contact-button { display:inline-flex; align-items:center; background:linear-gradient(45deg,#ff006e,#8338ec); color:#fff; padding:18px 35px; text-decoration:none; border-radius:50px; font-weight:700; font-size:1.1rem; transition:all .3s ease; box-shadow:0 20px 40px rgba(255,0,110,0.3); }\n .contact-button i { margin-right:10px; font-size:1.3rem; }\n .contact-button:hover { transform: translateY(-5px); box-shadow:0 30px 60px rgba(255,0,110,0.15); }\n .contact-info { margin-top:3rem; display:flex; justify-content:center; gap:3rem; flex-wrap:wrap; }\n .contact-method { display:flex; align-items:center; gap:10px; }\n .contact-method i { font-size:1.5rem; color:#00ffff; }\n\n .scroll-indicator { position: fixed; bottom:30px; left:50%; transform: translateX(-50%); z-index:10; color:#00ffff; text-align:center; animation:bounce 2s infinite; }\n @keyframes bounce { 0%,20%,50%,80%,100%{ transform: translateX(-50%) translateY(0);} 40%{ transform: translateX(-50%) translateY(-10px);} 60%{ transform: translateX(-50%) translateY(-5px);} }\n .scroll-text { font-size:.9rem; margin-bottom:10px; text-transform:uppercase; letter-spacing:1px; }\n .scroll-arrow { font-size:1.5rem; }\n\n .nav-dots { position: fixed; right:30px; top:50%; transform: translateY(-50%); z-index:10; display:flex; flex-direction:column; gap:15px; }\n .nav-dot { width:12px; height:12px; border-radius:50%; background: rgba(255,255,255,0.3); cursor:pointer; transition: all .3s ease; border:2px solid transparent; }\n .nav-dot.active { background:#00ffff; box-shadow:0 0 20px rgba(0,255,255,0.8); transform:scale(1.2); }\n\n @media (max-width:1200px) { .hero-content{ max-width:1100px } .services-slider-container, .benefits-slider-container { max-width:1000px } .service-slide, .benefit-slide { width:320px } .benefit-card { min-width:300px } }\n @media (max-width:1024px) { .hero-content { flex-direction:column; text-align:center; padding:20px; max-width:900px } .hero-left { padding-right:0; margin-bottom:40px } .soc-dashboard { width:100%; max-width:500px; height:380px } .hero h1{ font-size:3.2rem } .section-title{ font-size:2.8rem } .service-slide, .benefit-slide{ width:300px } .benefits-grid{ gap:2rem } .benefit-card{ min-width:280px } .stats-grid{ grid-template-columns:repeat(2,1fr) } }\n @media (max-width:768px) { .hero h1{ font-size:2.5rem } .hero-subtitle{ font-size:1.2rem } .section-title{ font-size:2.3rem } .section-description{ font-size:1.2rem } .service-slide, .benefit-slide{ width:280px; padding:1.5rem } .benefit-card{ min-width:100%; padding:2rem } .stats-grid{ grid-template-columns:1fr; gap:1.5rem } .cta-button{ padding:16px 35px; font-size:1rem; margin-right:10px } .contact-buttons{ flex-direction:column; align-items:center } .contact-info{ flex-direction:column; gap:1.5rem } .nav-dots{ right:15px } .section{ padding:30px 20px } .stat-card{ padding:1.5rem } .stat-number{ font-size:2.8rem } }\n @media (max-width:480px) { .hero h1{ font-size:2.2rem } .hero-subtitle{ font-size:1.1rem } .cta-button{ display:block; margin-right:0; margin-bottom:15px; width:100% } .hero-content{ padding:15px } .soc-dashboard{ height:350px } .threat-alert{ font-size:.85rem; padding:8px 12px } .section-title{ font-size:2rem } .section-description{ font-size:1.1rem } .service-slide, .benefit-slide{ width:260px; margin:0 10px } .service-slide h3, .benefit-slide h3{ font-size:1.3rem } .service-slide p, .benefit-slide p{ font-size:1rem } .benefit-card h3{ font-size:1.3rem } .benefit-card p{ font-size:1rem } .stat-number{ font-size:2.5rem } .stat-label{ font-size:1.1rem } .contact-button{ width:100%; justify-content:center } }\n <\/style>\n<\/head>\n<body>\n <!-- Navigation Dots -->\n <div class=\"nav-dots\">\n <div class=\"nav-dot active\" data-section=\"0\"><\/div>\n <div class=\"nav-dot\" data-section=\"1\"><\/div>\n <div class=\"nav-dot\" data-section=\"2\"><\/div>\n <div class=\"nav-dot\" data-section=\"3\"><\/div>\n <div class=\"nav-dot\" data-section=\"4\"><\/div>\n <div class=\"nav-dot\" data-section=\"5\"><\/div>\n <div class=\"nav-dot\" data-section=\"6\"><\/div>\n <div class=\"nav-dot\" data-section=\"7\"><\/div>\n <\/div>\n\n <!-- 3D Canvas Background -->\n <canvas id=\"three-canvas\"><\/canvas>\n\n <!-- Full Screen Scroll Container -->\n <div class=\"scroll-container\">\n <!-- Hero Section -->\n <section class=\"section hero\">\n <div class=\"content-layer\">\n <div class=\"hero-content\">\n <div class=\"hero-left\">\n <h1>Elite <span class=\"cyber-term\">SOC<\/span><br>Operations Center<\/h1>\n <p class=\"hero-subtitle\">\n Advanced <span class=\"cyber-term\">SIEM<\/span> integration with <span class=\"cyber-term\">AI-powered threat hunting<\/span>,\n real-time <span class=\"cyber-term\">MITRE ATT&CK<\/span> framework analysis, and <span class=\"cyber-term\">zero-day<\/span>\n vulnerability response. Our <span class=\"cyber-term\">Tier 1-3<\/span> analysts provide 24\/7\n <span class=\"cyber-term\">incident response<\/span> and <span class=\"cyber-term\">forensic analysis<\/span>.\n <\/p>\n <a href=\"#threat-intel\" class=\"cta-button\">Get in Touch<\/a>\n <a href=\"#features\" class=\"cta-button secondary\">View Capabilities<\/a>\n <\/div>\n <div class=\"hero-right\">\n <div class=\"soc-dashboard\">\n <div class=\"dashboard-header\">\ud83d\udee1\ufe0f SOC Command Center - STEGANOS<\/div>\n <div class=\"activity-indicator\">\n <div class=\"activity-dot\"><\/div>\n <div class=\"activity-dot\"><\/div>\n <div class=\"activity-dot\"><\/div>\n <\/div>\n <div class=\"threat-monitor\">\n <div class=\"threat-alert\"><strong>CRITICAL:<\/strong> APT29 IOCs detected - Lateral movement blocked<\/div>\n <div class=\"threat-alert medium\"><strong>MEDIUM:<\/strong> Phishing campaign identified - 47 emails quarantined<\/div>\n <div class=\"threat-alert low\"><strong>LOW:<\/strong> Vulnerability scan completed - 0 critical findings<\/div>\n <div class=\"threat-alert\"><strong>ALERT:<\/strong> DDoS mitigation active - Traffic normalized<\/div>\n <div class=\"network-graph\"><div class=\"graph-lines\"><\/div><\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"scroll-indicator\">\n <div class=\"scroll-text\">Scroll Down<\/div>\n <div class=\"scroll-arrow\">\u2193<\/div>\n <\/div>\n <\/section>\n\n <!-- Threat Intelligence -->\n <section class=\"section threat-intelligence\" id=\"threat-intel\">\n <div class=\"content-layer\">\n <div class=\"section-content\">\n <h2 class=\"section-title\">Threat Intelligence & Hunting<\/h2>\n <p class=\"section-description\">\n Our <span class=\"cyber-term\">CTI<\/span> team leverages advanced <span class=\"cyber-term\">OSINT<\/span> and proprietary <span class=\"cyber-term\">threat feeds<\/span> to identify <span class=\"cyber-term\">TTPs<\/span> used by <span class=\"cyber-term\">APT groups<\/span>. We conduct proactive <span class=\"cyber-term\">threat hunting<\/span> using <span class=\"cyber-term\">behavioral analytics<\/span> and <span class=\"cyber-term\">machine learning<\/span> to detect <span class=\"cyber-term\">Advanced Persistent Threats<\/span> before they cause damage.\n <\/p>\n <div class=\"benefits-grid\">\n <div class=\"benefit-card\"><div class=\"benefit-card-icon\">\ud83c\udfaf<\/div><h3>Advanced Persistent Threat Detection<\/h3><p>AI-powered detection of sophisticated APT campaigns using behavioral analysis, anomaly detection, and threat correlation across your entire attack surface.<\/p><\/div>\n <div class=\"benefit-card\"><div class=\"benefit-card-icon\">\ud83d\udd0d<\/div><h3>Proactive Threat Hunting<\/h3><p>Hypothesis-driven hunting operations using MITRE ATT&CK framework, custom IOCs, and advanced query languages like KQL and SPL for threat discovery.<\/p><\/div>\n <div class=\"benefit-card\"><div class=\"benefit-card-icon\">\ud83d\udce1<\/div><h3>Threat Intelligence Fusion<\/h3><p>Integration of commercial feeds, government sources, and dark web intelligence to provide contextual threat analysis and actionable intelligence.<\/p><\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Incident Response -->\n <section class=\"section incident-response\">\n <div class=\"content-layer\">\n <div class=\"section-content\">\n <h2 class=\"section-title\">Incident Response & Forensics<\/h2>\n <p class=\"section-description\">When security incidents occur, our <span class=\"cyber-term\">CSIRT<\/span> team follows <span class=\"cyber-term\">NIST<\/span> framework for rapid <span class=\"cyber-term\">containment<\/span>, <span class=\"cyber-term\">eradication<\/span>, and <span class=\"cyber-term\">recovery<\/span>. We perform <span class=\"cyber-term\">digital forensics<\/span>, <span class=\"cyber-term\">malware analysis<\/span>, and <span class=\"cyber-term\">root cause analysis<\/span> to prevent future breaches.<\/p>\n <div class=\"benefits-grid\">\n <div class=\"benefit-card\"><div class=\"benefit-card-icon\">\u26a1<\/div><h3>Rapid Incident Response<\/h3><p>15-minute MTTR with automated playbooks, SOAR integration, and immediate threat containment using EDR quarantine and network segmentation.<\/p><\/div>\n <div class=\"benefit-card\"><div class=\"benefit-card-icon\">\ud83d\udd2c<\/div><h3>Digital Forensics & Malware Analysis<\/h3><p>Deep-dive forensic investigation using memory dumps, disk imaging, network packet analysis, and sandbox malware detonation for attribution.<\/p><\/div>\n <div class=\"benefit-card\"><div class=\"benefit-card-icon\">\ud83d\udccb<\/div><h3>Compliance & Reporting<\/h3><p>Comprehensive incident documentation for regulatory compliance (SOX, HIPAA, PCI-DSS) with chain of custody and legal admissibility standards.<\/p><\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Services -->\n <section class=\"section services-overview\">\n <div class=\"content-layer\">\n <div class=\"section-content\">\n <h2 class=\"section-title\">SOC Service Portfolio<\/h2>\n <p class=\"section-description\">Comprehensive <span class=\"cyber-term\">managed security services<\/span> covering the entire <span class=\"cyber-term\">cyber kill chain<\/span>. From <span class=\"cyber-term\">perimeter defense<\/span> to <span class=\"cyber-term\">endpoint protection<\/span>, our services ensure complete <span class=\"cyber-term\">defense in depth<\/span> strategy implementation.<\/p>\n <div class=\"services-slider-container\">\n <div class=\"services-track\">\n <div class=\"service-slide\"><div class=\"service-icon\">\ud83d\udee1\ufe0f<\/div><h3>SIEM\/SOAR Integration<\/h3><p>Advanced Security Information Event Management with automated response capabilities, custom correlation rules, and integration with 200+ security tools.<\/p><\/div>\n <div class=\"service-slide\"><div class=\"service-icon\">\ud83d\udcca<\/div><h3>Vulnerability Management<\/h3><p>Continuous vulnerability assessment, penetration testing, red team exercises, and automated patch management with zero-day response capabilities.<\/p><\/div>\n <div class=\"service-slide\"><div class=\"service-icon\">\ud83d\udd10<\/div><h3>Identity & Access Management<\/h3><p>Zero-trust architecture implementation, privileged access management, behavioral analytics, and identity governance with MFA enforcement.<\/p><\/div>\n <div class=\"service-slide\"><div class=\"service-icon\">\u2601\ufe0f<\/div><h3>Cloud Security Posture<\/h3><p>Multi-cloud security monitoring, CSPM implementation, container security, serverless protection, and cloud-native SIEM deployment.<\/p><\/div>\n <div class=\"service-slide\"><div class=\"service-icon\">\ud83c\udf10<\/div><h3>Network Security Monitoring<\/h3><p>Deep packet inspection, network behavior analysis, DNS monitoring, SSL\/TLS decryption, and advanced persistent threat detection.<\/p><\/div>\n <div class=\"service-slide\"><div class=\"service-icon\">\ud83d\udcf1<\/div><h3>Endpoint Detection & Response<\/h3><p>Next-gen antivirus, behavioral monitoring, memory protection, application whitelisting, and automated threat remediation across all endpoints.<\/p><\/div>\n <!-- duplicates for seamless loop -->\n <div class=\"service-slide\"><div class=\"service-icon\">\ud83d\udee1\ufe0f<\/div><h3>SIEM\/SOAR Integration<\/h3><p>Advanced Security Information Event Management with automated response capabilities, custom correlation rules, and integration with 200+ security tools.<\/p><\/div>\n <div class=\"service-slide\"><div class=\"service-icon\">\ud83d\udcca<\/div><h3>Vulnerability Management<\/h3><p>Continuous vulnerability assessment, penetration testing, red team exercises, and automated patch management with zero-day response capabilities.<\/p><\/div>\n <div class=\"service-slide\"><div class=\"service-icon\">\ud83d\udd10<\/div><h3>Identity & Access Management<\/h3><p>Zero-trust architecture implementation, privileged access management, behavioral analytics, and identity governance with MFA enforcement.<\/p><\/div>\n <div class=\"service-slide\"><div class=\"service-icon\">\u2601\ufe0f<\/div><h3>Cloud Security Posture<\/h3><p>Multi-cloud security monitoring, CSPM implementation, container security, serverless protection, and cloud-native SIEM deployment.<\/p><\/div>\n <div class=\"service-slide\"><div class=\"service-icon\">\ud83c\udf10<\/div><h3>Network Security Monitoring<\/h3><p>Deep packet inspection, network behavior analysis, DNS monitoring, SSL\/TLS decryption, and advanced persistent threat detection.<\/p><\/div>\n <div class=\"service-slide\"><div class=\"service-icon\">\ud83d\udcf1<\/div><h3>Endpoint Detection & Response<\/h3><p>Next-gen antivirus, behavioral monitoring, memory protection, application whitelisting, and automated threat remediation across all endpoints.<\/p><\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Statistics -->\n <section class=\"section statistics-section\">\n <div class=\"content-layer\">\n <div class=\"section-content\">\n <h2 class=\"section-title\">Our Impact & Results<\/h2>\n <p class=\"section-description\">With years of expertise in cybersecurity, we've helped organizations of all sizes strengthen their security posture and defend against evolving threats. Our numbers speak for themselves.<\/p>\n\n <div class=\"stats-grid\">\n <!-- <div class=\"stat-card\"><div class=\"stat-number\" id=\"clientCount\">0<\/div><div class=\"stat-label\">Enterprise Clients Protected<\/div><\/div> -->\n <div class=\"stat-card\"><div class=\"stat-number\" id=\"threatCount\">0<\/div><div class=\"stat-label\">Threats Neutralized<\/div><\/div>\n <div class=\"stat-card\"><div class=\"stat-number\" id=\"incidentCount\">0%<\/div><div class=\"stat-label\">Incident Resolution Rate<\/div><\/div>\n <div class=\"stat-card\"><div class=\"stat-number\" id=\"responseCount\">0min<\/div><div class=\"stat-label\">Average Response Time<\/div><\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <section class=\"section technologies-section\">\n <h2 class=\"section-title\">Our Technology Expertise<\/h2>\n <p class=\"section-subtitle\">We are experienced with the industry's leading SOC technologies and platforms, enabling us to provide comprehensive security operations and threat management.<\/p>\n \n <div class=\"tech-slider-container\">\n <div class=\"tech-slider-track\">\n <!-- SIEM Technologies -->\n <div class=\"tech-card\" data-url=\"https:\/\/www.splunk.com\">\n <div class=\"tech-category\">SIEM<\/div>\n <div class=\"tech-icon\">\ud83d\udcca<\/div>\n <h3>Splunk Enterprise<\/h3>\n <p>Advanced security analytics and real-time monitoring platform<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Real-time monitoring<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Advanced analytics<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Machine learning<\/div>\n <\/div>\n <\/div>\n \n <div class=\"tech-card\" data-url=\"https:\/\/www.ibm.com\/products\/qradar-siem\">\n <div class=\"tech-category\">SIEM<\/div>\n <div class=\"tech-icon\">\ud83d\udd0d<\/div>\n <h3>IBM QRadar<\/h3>\n <p>AI-powered threat detection and response platform<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Threat intelligence<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> User behavior analytics<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Incident forensics<\/div>\n <\/div>\n <\/div>\n \n <div class=\"tech-card\" data-url=\"https:\/\/www.elastic.co\/what-is\/elk-stack\">\n <div class=\"tech-category\">SIEM<\/div>\n <div class=\"tech-icon\">\u26a1<\/div>\n <h3>Elastic Stack<\/h3>\n <p>Open source analytics & visualization platform<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Elasticsearch database<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Logstash processing<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Kibana visualization<\/div>\n <\/div>\n <\/div>\n \n <div class=\"tech-card\" data-url=\"https:\/\/www.microfocus.com\/en-us\/products\/arcsight-esm\/overview\">\n <div class=\"tech-category\">SIEM<\/div>\n <div class=\"tech-icon\">\ud83d\udcc8<\/div>\n <h3>ArcSight ESM<\/h3>\n <p>Enterprise security management for big data security analytics<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Log management<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Correlation rules<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Compliance reporting<\/div>\n <\/div>\n <\/div>\n \n <!-- SOAR Technologies -->\n <div class=\"tech-card\" data-url=\"https:\/\/www.ibm.com\/products\/resilient\">\n <div class=\"tech-category\">SOAR<\/div>\n <div class=\"tech-icon\">\u26a1<\/div>\n <h3>IBM Resilient<\/h3>\n <p>Security orchestration, automation and response platform<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Incident response<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Workflow automation<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Playbook development<\/div>\n <\/div>\n <\/div>\n \n <div class=\"tech-card\" data-url=\"https:\/\/www.splunk.com\/en_us\/products\/phantom.html\">\n <div class=\"tech-category\">SOAR<\/div>\n <div class=\"tech-icon\">\ud83e\udd16<\/div>\n <h3>Splunk Phantom<\/h3>\n <p>Security automation and orchestration for SOC efficiency<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Automation playbooks<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Case management<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Integration ecosystem<\/div>\n <\/div>\n <\/div>\n \n <!-- EDR Technologies -->\n <div class=\"tech-card\" data-url=\"https:\/\/www.crowdstrike.com\">\n <div class=\"tech-category\">EDR<\/div>\n <div class=\"tech-icon\">\ud83d\udda5\ufe0f<\/div>\n <h3>CrowdStrike Falcon<\/h3>\n <p>Next-gen endpoint protection with threat intelligence<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Threat hunting<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Behavioral analysis<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Real-time response<\/div>\n <\/div>\n <\/div>\n \n <div class=\"tech-card\" data-url=\"https:\/\/www.vmware.com\/products\/carbon-black.html\">\n <div class=\"tech-category\">EDR<\/div>\n <div class=\"tech-icon\">\ud83d\udcbb<\/div>\n <h3>Carbon Black<\/h3>\n <p>Endpoint security platform for advanced threat detection<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Device control<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Memory protection<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Application control<\/div>\n <\/div>\n <\/div>\n \n <!-- Network Security -->\n <div class=\"tech-card\" data-url=\"https:\/\/www.darktrace.com\">\n <div class=\"tech-category\">NETWORK<\/div>\n <div class=\"tech-icon\">\ud83c\udf10<\/div>\n <h3>Darktrace<\/h3>\n <p>AI-powered network detection and response system<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Autonomous response<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Cyber AI analyst<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Threat visualization<\/div>\n <\/div>\n <\/div>\n \n <div class=\"tech-card\" data-url=\"https:\/\/www.trellix.com\/products\/network-security\/\">\n <div class=\"tech-category\">NETWORK<\/div>\n <div class=\"tech-icon\">\ud83d\udee1\ufe0f<\/div>\n <h3>FireEye NX<\/h3>\n <p>Network security and threat protection platform<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Malware protection<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Exploit prevention<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Multi-vector protection<\/div>\n <\/div>\n <\/div>\n \n <!-- Cloud Security -->\n <div class=\"tech-card\" data-url=\"https:\/\/azure.microsoft.com\/en-us\/services\/azure-sentinel\/\">\n <div class=\"tech-category\">CLOUD<\/div>\n <div class=\"tech-icon\">\u2601\ufe0f<\/div>\n <h3>Microsoft Sentinel<\/h3>\n <p>Cloud-native SIEM with intelligent security analytics<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Cloud-scale analytics<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> AI-powered detection<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Built-in connectors<\/div>\n <\/div>\n <\/div>\n \n <div class=\"tech-card\" data-url=\"https:\/\/www.paloaltonetworks.com\/prisma\/cloud\">\n <div class=\"tech-category\">CLOUD<\/div>\n <div class=\"tech-icon\">\ud83d\udce1<\/div>\n <h3>Palo Alto Prisma<\/h3>\n <p>Cloud security suite for secure access service edge<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Cloud security posture<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Data loss prevention<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Secure web gateway<\/div>\n <\/div>\n <\/div>\n \n <!-- Threat Intelligence -->\n <div class=\"tech-card\" data-url=\"https:\/\/www.recordedfuture.com\">\n <div class=\"tech-category\">THREAT INTEL<\/div>\n <div class=\"tech-icon\">\ud83d\udcf0<\/div>\n <h3>Recorded Future<\/h3>\n <p>Real-time threat intelligence platform<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Real-time intelligence<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Risk analysis<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Vulnerability management<\/div>\n <\/div>\n <\/div>\n \n <div class=\"tech-card\" data-url=\"https:\/\/www.anomali.com\">\n <div class=\"tech-category\">THREAT INTEL<\/div>\n <div class=\"tech-icon\">\ud83d\udd0e<\/div>\n <h3>Anomali<\/h3>\n <p>Threat intelligence and security analytics platform<\/p>\n <div class=\"tech-features\">\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Threat detection<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Intelligence management<\/div>\n <div class=\"tech-feature\"><i class=\"fas fa-check-circle\"><\/i> Investigation workflows<\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"slider-controls\">\n <div class=\"slider-control\" id=\"prev-tech\">\n <i class=\"fas fa-chevron-left\"><\/i>\n <\/div>\n <div class=\"slider-control\" id=\"next-tech\">\n <i class=\"fas fa-chevron-right\"><\/i>\n <\/div>\n <\/div>\n <\/section>\n <!-- Benefits -->\n <section class=\"section benefits-section\">\n <div class=\"content-layer\">\n <div class=\"section-content\">\n <h2 class=\"section-title\">What You Get With Our SOC<\/h2>\n <p class=\"section-description\">Our comprehensive Managed SOC service provides enterprise-grade security capabilities without the overhead of building and maintaining your own security operations center.<\/p>\n\n <div class=\"benefits-slider-container\">\n <div class=\"benefits-track\">\n <div class=\"benefit-slide\"><div class=\"benefit-icon\">\ud83d\udc51<\/div><h3>Expert Security Team<\/h3><p>Access to Tier 1-3 cybersecurity experts with advanced certifications and real-world threat intelligence experience.<\/p><\/div>\n <div class=\"benefit-slide\"><div class=\"benefit-icon\">\ud83d\udca1<\/div><h3>Advanced Technology<\/h3><p>Cutting-edge SIEM, SOAR, threat intelligence platforms, and custom tools without the capital investment.<\/p><\/div>\n <div class=\"benefit-slide\"><div class=\"benefit-icon\">\ud83d\udcc8<\/div><h3>Continuous Improvement<\/h3><p>Regular threat hunting, playbook refinement, and process optimization based on the latest threat intelligence.<\/p><\/div>\n <div class=\"benefit-slide\"><div class=\"benefit-icon\">\ud83c\udf0d<\/div><h3>Global Threat Intelligence<\/h3><p>Access to proprietary threat feeds, dark web monitoring, and intelligence sharing partnerships.<\/p><\/div>\n <div class=\"benefit-slide\"><div class=\"benefit-icon\">\u2696\ufe0f<\/div><h3>Compliance Ready<\/h3><p>Built-in compliance reporting for PCI DSS, HIPAA, GDPR, ISO 27001, and other regulatory frameworks.<\/p><\/div>\n <div class=\"benefit-slide\"><div class=\"benefit-icon\">\ud83d\udd04<\/div><h3>24\/7\/365 Coverage<\/h3><p>Round-the-clock monitoring with follow-the-sun staffing model ensuring no alert goes unanswered.<\/p><\/div>\n\n <!-- duplicates for seamless loop -->\n <div class=\"benefit-slide\"><div class=\"benefit-icon\">\ud83d\udc51<\/div><h3>Expert Security Team<\/h3><p>Access to Tier 1-3 cybersecurity experts with advanced certifications and real-world threat intelligence experience.<\/p><\/div>\n <div class=\"benefit-slide\"><div class=\"benefit-icon\">\ud83d\udca1<\/div><h3>Advanced Technology<\/h3><p>Cutting-edge SIEM, SOAR, threat intelligence platforms, and custom tools without the capital investment.<\/p><\/div>\n <div class=\"benefit-slide\"><div class=\"benefit-icon\">\ud83d\udcc8<\/div><h3>Continuous Improvement<\/h3><p>Regular threat hunting, playbook refinement, and process optimization based on the latest threat intelligence.<\/p><\/div>\n <div class=\"benefit-slide\"><div class=\"benefit-icon\">\ud83c\udf0d<\/div><h3>Global Threat Intelligence<\/h3><p>Access to proprietary threat feeds, dark web monitoring, and intelligence sharing partnerships.<\/p><\/div>\n <div class=\"benefit-slide\"><div class=\"benefit-icon\">\u2696\ufe0f<\/div><h3>Compliance Ready<\/h3><p>Built-in compliance reporting for PCI DSS, HIPAA, GDPR, ISO 27001, and other regulatory frameworks.<\/p><\/div>\n <div class=\"benefit-slide\"><div class=\"benefit-icon\">\ud83d\udd04<\/div><h3>24\/7\/365 Coverage<\/h3><p>Round-the-clock monitoring with follow-the-sun staffing model ensuring no alert goes unanswered.<\/p><\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Contact -->\n <section class=\"section contact-section\">\n <div class=\"content-layer\">\n <div class=\"section-content\">\n <h2 class=\"section-title\">Ready to Secure Your Organization?<\/h2>\n <p class=\"section-description\">Get in touch with our cybersecurity experts today for a personalized consultation. Discover how our managed SOC services can protect your business from evolving threats.<\/p>\n\n <div class=\"contact-content\">\n <div class=\"contact-buttons\">\n <!-- <a href=\"#\" class=\"contact-button\"><i class=\"fas fa-calendar-alt\"><\/i> Schedule a Demo<\/a> -->\n <a href=\"#\" class=\"contact-button secondary\"><i class=\"fas fa-file-alt\"><\/i> Get a Quote<\/a>\n <a href=\"#\" class=\"contact-button\"><i class=\"fas fa-headset\"><\/i> Contact Sales<\/a>\n <\/div>\n\n <div class=\"contact-info\">\n <div class=\"contact-method\"><i class=\"fas fa-phone\"><\/i><span>+92 336 5410874<\/span><\/div>\n <div class=\"contact-method\"><i class=\"fas fa-envelope\"><\/i><span>info@steganostech.com<\/span><\/div>\n <div class=\"contact-method\"><i class=\"fas fa-clock\"><\/i><span>24\/7 Support Available<\/span><\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/div>\n\n <script>\n \/***** Three.js scene (kept from original file) *****\/\n const scene = new THREE.Scene();\n const camera = new THREE.PerspectiveCamera(75, window.innerWidth \/ window.innerHeight, 0.1, 1000);\n const renderer = new THREE.WebGLRenderer({\n canvas: document.getElementById('three-canvas'),\n alpha: true,\n antialias: true\n });\n\n \/\/ initial renderer size (actual size will be updated by header logic)\n renderer.setSize(window.innerWidth, window.innerHeight);\n renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));\n\n const particleCount = 2000;\n const particles = new THREE.BufferGeometry();\n const positions = new Float32Array(particleCount * 3);\n const colors = new Float32Array(particleCount * 3);\n const sizes = new Float32Array(particleCount);\n\n const hexGeometry = new THREE.CylinderGeometry(1,1,0.2,6);\n const lineMaterial = new THREE.LineBasicMaterial({ color: 0x00ffff, transparent: true, opacity: 0.3 });\n\n for (let i = 0; i < particleCount * 3; i += 3) {\n positions[i] = (Math.random() - 0.5) * 200;\n positions[i+1] = (Math.random() - 0.5) * 200;\n positions[i+2] = (Math.random() - 0.5) * 200;\n\n const colorChoice = Math.random();\n if (colorChoice < 0.33) { colors[i]=0; colors[i+1]=1; colors[i+2]=1; }\n else if (colorChoice < 0.66) { colors[i]=1; colors[i+1]=0; colors[i+2]=1; }\n else { colors[i]=0; colors[i+1]=1; colors[i+2]=0; }\n\n sizes[i\/3] = Math.random() * 2 + 0.5;\n }\n\n particles.setAttribute('position', new THREE.BufferAttribute(positions, 3));\n particles.setAttribute('color', new THREE.BufferAttribute(colors, 3));\n particles.setAttribute('size', new THREE.BufferAttribute(sizes, 1));\n\n const particleMaterial = new THREE.PointsMaterial({ size:0.8, vertexColors:true, transparent:true, opacity:0.7, sizeAttenuation:true });\n const particleSystem = new THREE.Points(particles, particleMaterial);\n scene.add(particleSystem);\n\n const networkNodes = [];\n const connections = [];\n for (let i=0;i<15;i++){\n const hexMaterial = new THREE.MeshPhongMaterial({ color: new THREE.Color().setHSL(Math.random()*0.3 + 0.5, 0.8, 0.6), transparent:true, opacity:0.7 });\n const hex = new THREE.Mesh(hexGeometry, hexMaterial);\n hex.position.set((Math.random()-0.5)*100, (Math.random()-0.5)*100, (Math.random()-0.5)*100);\n hex.rotation.set(Math.random()*Math.PI, Math.random()*Math.PI, Math.random()*Math.PI);\n scene.add(hex);\n networkNodes.push(hex);\n\n const hexWireframe = new THREE.Mesh(hexGeometry, new THREE.MeshBasicMaterial({ color:0x00ffff, wireframe:true, transparent:true, opacity:0.5 }));\n hex.add(hexWireframe);\n }\n\n for (let i=0;i<20;i++){\n const node1 = networkNodes[Math.floor(Math.random()*networkNodes.length)];\n const node2 = networkNodes[Math.floor(Math.random()*networkNodes.length)];\n if (node1 !== node2){\n const pts = []; pts.push(new THREE.Vector3().copy(node1.position)); pts.push(new THREE.Vector3().copy(node2.position));\n const geometry = new THREE.BufferGeometry().setFromPoints(pts);\n const line = new THREE.Line(geometry, lineMaterial); scene.add(line); connections.push(line);\n }\n }\n\n const dataPackets = [];\n for (let i=0;i<10;i++){\n const packetGeometry = new THREE.SphereGeometry(0.5,8,8);\n const packetMaterial = new THREE.MeshBasicMaterial({ color:0x00ff00, transparent:true, opacity:0.8 });\n const packet = new THREE.Mesh(packetGeometry, packetMaterial);\n scene.add(packet);\n const node1 = networkNodes[Math.floor(Math.random()*networkNodes.length)];\n const node2 = networkNodes[Math.floor(Math.random()*networkNodes.length)];\n dataPackets.push({ mesh:packet, start: node1.position.clone(), end: node2.position.clone(), progress: Math.random(), speed: Math.random()*0.005 + 0.002 });\n }\n\n const ambientLight = new THREE.AmbientLight(0x404040, 0.5); scene.add(ambientLight);\n const directionalLight = new THREE.DirectionalLight(0x00ffff, 0.8); directionalLight.position.set(20,20,10); scene.add(directionalLight);\n const pointLight1 = new THREE.PointLight(0xff00ff, 0.8, 100); pointLight1.position.set(-20,-20,-20); scene.add(pointLight1);\n const pointLight2 = new THREE.PointLight(0x00ff00, 0.6, 80); pointLight2.position.set(30,-30,20); scene.add(pointLight2);\n camera.position.z = 50;\n\n let mouseX = 0, mouseY = 0;\n document.addEventListener('mousemove', (e) => { mouseX = (e.clientX \/ window.innerWidth) * 2 - 1; mouseY = -(e.clientY \/ window.innerHeight) * 2 + 1; });\n\n \/***** Header detection + show-only-at-top behavior (no fixed positioning) *****\/\n let headerEl = null;\n let originalHeaderDisplay = null;\n\n function findHeaderElement() {\n const selectors = ['.elementor-location-header', '.elementor-header', '.site-header', 'header', '.elementor-top', '.header'];\n for (const s of selectors) {\n const el = document.querySelector(s);\n if (el) return el;\n }\n return null;\n }\n\n function setCanvasAndScrollForHeaderHeight(headerHeightPx) {\n \/\/ Update CSS var so CSS-managed heights adjust automatically\n document.documentElement.style.setProperty('--header-height', headerHeightPx + 'px');\n\n \/\/ Update canvas top\/height directly to avoid flicker on some browsers\n const canvas = document.getElementById('three-canvas');\n if (canvas) {\n canvas.style.top = headerHeightPx + 'px';\n canvas.style.height = (window.innerHeight - headerHeightPx) + 'px';\n }\n\n \/\/ adjust renderer size \/ camera aspect\n const canvasHeight = Math.max(window.innerHeight - headerHeightPx, 0);\n renderer.setSize(window.innerWidth, canvasHeight);\n camera.aspect = window.innerWidth \/ (canvasHeight || 1);\n camera.updateProjectionMatrix();\n\n \/\/ adjust scroll-container and sections heights as inline style (fallback)\n const sc = document.querySelector('.scroll-container');\n if (sc) sc.style.height = (window.innerHeight - headerHeightPx) + 'px';\n const secs = document.querySelectorAll('.section');\n secs.forEach(s => s.style.height = (window.innerHeight - headerHeightPx) + 'px');\n }\n\n function showHeaderAndAdjust() {\n if (!headerEl) return;\n headerEl.style.display = originalHeaderDisplay || '';\n \/\/ compute height\n const h = Math.ceil(headerEl.getBoundingClientRect().height) || 0;\n setCanvasAndScrollForHeaderHeight(h);\n }\n\n function hideHeaderAndAdjust() {\n if (!headerEl) return;\n \/\/ hide header (do not change its position property)\n headerEl.style.display = 'none';\n \/\/ reset canvas to occupy full viewport\n document.documentElement.style.setProperty('--header-height', '0px');\n const canvas = document.getElementById('three-canvas');\n if (canvas) {\n canvas.style.top = '0px';\n canvas.style.height = window.innerHeight + 'px';\n }\n renderer.setSize(window.innerWidth, window.innerHeight);\n camera.aspect = window.innerWidth \/ (window.innerHeight || 1);\n camera.updateProjectionMatrix();\n const sc = document.querySelector('.scroll-container');\n if (sc) sc.style.height = window.innerHeight + 'px';\n const secs = document.querySelectorAll('.section');\n secs.forEach(s => s.style.height = window.innerHeight + 'px');\n }\n\n function initHeaderBehavior() {\n headerEl = findHeaderElement();\n if (headerEl) {\n \/\/ store original display so we can restore it\n originalHeaderDisplay = getComputedStyle(headerEl).display || '';\n \/\/ Initially show header (we assume user is at top on load)\n showHeaderAndAdjust();\n\n \/\/ Observe header size changes (if header content changes)\n const mo = new MutationObserver(() => {\n \/\/ only recalc when header is visible\n if (headerEl && headerEl.style.display !== 'none') {\n const h = Math.ceil(headerEl.getBoundingClientRect().height) || 0;\n setCanvasAndScrollForHeaderHeight(h);\n }\n });\n mo.observe(headerEl, { attributes: true, subtree: true, childList: true });\n } else {\n \/\/ no header found: ensure full-canvas and full scroll-container\n hideHeaderAndAdjust();\n }\n }\n\n \/***** Animation loop *****\/\n function animate() {\n requestAnimationFrame(animate);\n\n particleSystem.rotation.y += 0.001;\n particleSystem.rotation.x += 0.0005;\n\n networkNodes.forEach((node, idx) => {\n node.rotation.x += 0.005 * (idx % 3 + 1);\n node.rotation.y += 0.007 * (idx % 2 + 1);\n node.rotation.z += 0.003 * (idx % 4 + 1);\n node.position.y += Math.sin(Date.now() * 0.001 + idx) * 0.02;\n });\n\n dataPackets.forEach(packet => {\n packet.progress += packet.speed;\n if (packet.progress > 1) {\n packet.progress = 0;\n const n1 = networkNodes[Math.floor(Math.random()*networkNodes.length)];\n const n2 = networkNodes[Math.floor(Math.random()*networkNodes.length)];\n packet.start.copy(n1.position);\n packet.end.copy(n2.position);\n }\n const pos = new THREE.Vector3().lerpVectors(packet.start, packet.end, packet.progress);\n packet.mesh.position.copy(pos);\n packet.mesh.scale.setScalar(1 + Math.sin(Date.now() * 0.005) * 0.2);\n });\n\n camera.position.x += (mouseX * 15 - camera.position.x) * 0.05;\n camera.position.y += (mouseY * 15 - camera.position.y) * 0.05;\n camera.lookAt(scene.position);\n\n \/\/ parallax based on scroll inside scroll-container\n const sc = document.querySelector('.scroll-container');\n if (sc) {\n const scrollPercent = sc.scrollTop \/ (sc.scrollHeight - sc.clientHeight || 1);\n camera.position.z = 50 + scrollPercent * 30;\n camera.rotation.z = scrollPercent * 0.3;\n }\n\n renderer.render(scene, camera);\n }\n\n \/***** Counters & viewport helper (kept) *****\/\n function animateCounter(element, finalValue, suffix = '', isPercentage = false) {\n let startTime = null;\n const duration = 2000;\n const startValue = 0;\n function updateCounter(ts) {\n if (!startTime) startTime = ts;\n const progress = Math.min((ts - startTime) \/ duration, 1);\n const easeOutQuart = 1 - Math.pow(1 - progress, 4);\n let currentValue = Math.floor(easeOutQuart * (finalValue - startValue) + startValue);\n if (isPercentage) { element.textContent = currentValue.toFixed(1) + '%'; }\n else if (suffix === 'min') { element.textContent = currentValue + suffix; }\n else { element.textContent = currentValue.toLocaleString() + suffix; }\n if (progress < 1) requestAnimationFrame(updateCounter);\n }\n requestAnimationFrame(updateCounter);\n }\n\n function isInViewport(element) {\n if (!element) return false;\n const rect = element.getBoundingClientRect();\n return rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && rect.right <= (window.innerWidth || document.documentElement.clientWidth);\n }\n\n let countersAnimated = false;\n function checkCounters() {\n const statsSection = document.querySelector('.statistics-section');\n if (isInViewport(statsSection) && !countersAnimated) {\n animateCounter(document.getElementById('clientCount'), 20, '+');\n animateCounter(document.getElementById('threatCount'), 15000, '+');\n animateCounter(document.getElementById('incidentCount'), 98.7, '', true);\n animateCounter(document.getElementById('responseCount'), 15, 'min');\n countersAnimated = true;\n }\n }\n\n \/***** Full page snap-scroll logic (kept and adjusted to use scroll-container) *****\/\n const sections = document.querySelectorAll('.section');\n const navDots = document.querySelectorAll('.nav-dot');\n let currentSection = 0;\n let isScrolling = false;\n let scrollTimeout;\n\n function updateNavDots(activeIndex) {\n navDots.forEach((d,i) => d.classList.toggle('active', i===activeIndex));\n }\n\n \n function scrollToSection(index) {\n if (index >= 0 && index < sections.length) {\n isScrolling = true;\n const targetSection = sections[index];\n targetSection.scrollIntoView({ behavior: 'smooth' });\n currentSection = index;\n updateNavDots(currentSection);\n \n clearTimeout(scrollTimeout);\n scrollTimeout = setTimeout(() => {\n isScrolling = false;\n }, 800);\n }\n \n \/\/ Statistics section is at index 4\n if (index === 4 && !countersAnimated) {\n setTimeout(() => {\n animateCounter(document.getElementById('clientCount'), 250, '+');\n animateCounter(document.getElementById('threatCount'), 15000, '+');\n animateCounter(document.getElementById('incidentCount'), 98.7, '', true);\n animateCounter(document.getElementById('responseCount'), 15, 'min');\n countersAnimated = true;\n }, 500);\n }\n}\n\n navDots.forEach((dot, idx) => dot.addEventListener('click', () => scrollToSection(idx)));\n\n const scrollContainer = document.querySelector('.scroll-container');\n if (scrollContainer) {\n scrollContainer.addEventListener('wheel', (e) => {\n if (isScrolling) return;\n e.preventDefault();\n isScrolling = true;\n if (e.deltaY > 0) {\n if (currentSection < sections.length - 1) { currentSection++; scrollToSection(currentSection); } else { isScrolling=false; }\n } else {\n if (currentSection > 0) { currentSection--; scrollToSection(currentSection); } else { isScrolling=false; }\n }\n }, { passive: false });\n\n \/\/ touch\n let touchStartY = 0, touchEndY = 0;\n scrollContainer.addEventListener('touchstart', (e) => { touchStartY = e.changedTouches[0].screenY; });\n scrollContainer.addEventListener('touchend', (e) => { touchEndY = e.changedTouches[0].screenY; handleSwipe(); });\n\n function handleSwipe() {\n if (isScrolling) return;\n const swipeThreshold = 50;\n const swipe = touchEndY - touchStartY;\n if (Math.abs(swipe) > swipeThreshold) {\n if (swipe < 0) { if (currentSection < sections.length - 1) { currentSection++; scrollToSection(currentSection); } }\n else { if (currentSection > 0) { currentSection--; scrollToSection(currentSection); } }\n }\n }\n\n \/\/ On manual scroll inside container, update currentSection and header visibility\n scrollContainer.addEventListener('scroll', () => {\n \/\/ determine nearest section by scrollTop\n const top = scrollContainer.scrollTop;\n let nearestIndex = 0;\n let nearestDiff = Infinity;\n sections.forEach((sec, idx) => {\n const diff = Math.abs(sec.offsetTop - top);\n if (diff < nearestDiff) { nearestDiff = diff; nearestIndex = idx; }\n });\n currentSection = nearestIndex;\n updateNavDots(currentSection);\n\n \/\/ show header only when at top (section 0)\n if (currentSection === 0) { showHeaderAndAdjust(); }\n else { hideHeaderAndAdjust(); }\n\n \/\/ counters check\n checkCounters();\n });\n }\n\n \/\/ keyboard nav\n document.addEventListener('keydown', (e) => {\n if (e.key === 'ArrowDown' || e.key === 'PageDown') { e.preventDefault(); if (currentSection < sections.length - 1) { currentSection++; scrollToSection(currentSection); } }\n else if (e.key === 'ArrowUp' || e.key === 'PageUp') { e.preventDefault(); if (currentSection > 0) { currentSection--; scrollToSection(currentSection); } }\n });\n\n \/\/ animated threats (kept)\n function animateThreats() {\n const alerts = document.querySelectorAll('.threat-alert');\n alerts.forEach((alert, index) => {\n setTimeout(() => {\n alert.style.opacity = '0.7';\n setTimeout(() => {\n alert.style.opacity = '1';\n if (Math.random() < 0.2) {\n const threatLevels = ['', 'medium', 'low'];\n const randomLevel = threatLevels[Math.floor(Math.random()*threatLevels.length)];\n alert.className = `threat-alert ${randomLevel}`;\n }\n if (Math.random() < 0.3) {\n const threats = [\n 'CRITICAL: Zero-day exploit detected - Containment initiated',\n 'HIGH: Ransomware signature match - Systems quarantined',\n 'MEDIUM: Suspicious PowerShell activity - Investigation ongoing',\n 'LOW: Baseline deviation detected - Monitoring enhanced',\n 'ALERT: C2 communication blocked - IOCs updated',\n 'CRITICAL: Privilege escalation attempt - Access revoked'\n ];\n const randomThreat = threats[Math.floor(Math.random()*threats.length)];\n alert.innerHTML = `<strong>${randomThreat.split(':')[0]}:<\/strong> ${randomThreat.split(':')[1]}`;\n }\n }, 200);\n }, index * 2000 + Math.random() * 3000);\n });\n }\n setInterval(animateThreats, 8000);\n animateThreats();\n\n \/\/ initialize everything after load\n window.addEventListener('load', () => {\n \/\/ allow a short delay for header markup to render if Elementor injects it\n setTimeout(() => {\n initHeaderBehavior();\n\n \/\/ on load, we assume user is at top -> ensure header visible\n if (headerEl) showHeaderAndAdjust();\n else hideHeaderAndAdjust();\n\n \/\/ start three animation\n animate();\n\n \/\/ initial counters check when loaded\n checkCounters();\n }, 70);\n });\n\n \/\/ handle window resize\n let resizeTimer;\n window.addEventListener('resize', () => {\n clearTimeout(resizeTimer);\n resizeTimer = setTimeout(() => {\n \/\/ If header visible, re-calc its height; otherwise ensure canvas full height\n if (headerEl && headerEl.style.display !== 'none') {\n const h = Math.ceil(headerEl.getBoundingClientRect().height) || 0;\n setCanvasAndScrollForHeaderHeight(h);\n } else {\n \/\/ header hidden: full size\n renderer.setSize(window.innerWidth, window.innerHeight);\n camera.aspect = window.innerWidth \/ (window.innerHeight || 1);\n camera.updateProjectionMatrix();\n document.documentElement.style.setProperty('--header-height', '0px');\n const sc = document.querySelector('.scroll-container'); if (sc) sc.style.height = window.innerHeight + 'px';\n const secs = document.querySelectorAll('.section'); secs.forEach(s => s.style.height = window.innerHeight + 'px');\n const canvas = document.getElementById('three-canvas'); if (canvas) { canvas.style.top = '0px'; canvas.style.height = window.innerHeight + 'px'; }\n }\n }, 120);\n });\n \/\/ Technology slider functionality\n const techTrack = document.querySelector('.tech-slider-track');\n const techCards = document.querySelectorAll('.tech-card');\n const prevButton = document.getElementById('prev-tech');\n const nextButton = document.getElementById('next-tech');\n \n \/\/ Set initial position and variables\n let position = 0;\n const cardWidth = 340; \/\/ 300px width + 20px margin on each side\n const totalCards = techCards.length;\n const visibleCards = Math.floor(techTrack.parentElement.offsetWidth \/ cardWidth);\n let autoScrollInterval;\n \n \/\/ Clone cards for seamless looping\n techCards.forEach(card => {\n const clone = card.cloneNode(true);\n techTrack.appendChild(clone);\n });\n \n \/\/ Update slider position with smooth transition\n function updateSliderPosition() {\n techTrack.style.transition = 'transform 0.5s ease-in-out';\n techTrack.style.transform = `translateX(${position}px)`;\n }\n \n \/\/ Next button functionality\n function nextSlide() {\n position -= cardWidth * 3; \/\/ Move 3 cards at a time\n \n \/\/ If we've scrolled past the original set of cards, reset to beginning\n if (Math.abs(position) >= cardWidth * totalCards) {\n \/\/ Disable transition for the reset\n techTrack.style.transition = 'none';\n position = 0;\n techTrack.style.transform = `translateX(${position}px)`;\n \n \/\/ Force reflow\n void techTrack.offsetWidth;\n \n \/\/ Re-enable transition\n techTrack.style.transition = 'transform 0.5s ease-in-out';\n }\n \n updateSliderPosition();\n }\n \n \/\/ Previous button functionality\n function prevSlide() {\n position += cardWidth * 3; \/\/ Move 3 cards at a time\n \n \/\/ If we've scrolled past the beginning, reset to end\n if (position > 0) {\n \/\/ Disable transition for the reset\n techTrack.style.transition = 'none';\n position = -cardWidth * (totalCards - 3);\n techTrack.style.transform = `translateX(${position}px)`;\n \n \/\/ Force reflow\n void techTrack.offsetWidth;\n \n \/\/ Re-enable transition\n techTrack.style.transition = 'transform 0.5s ease-in-out';\n }\n \n updateSliderPosition();\n }\n \n \/\/ Set up event listeners\n nextButton.addEventListener('click', nextSlide);\n prevButton.addEventListener('click', prevSlide);\n \n \/\/ Click to redirect to official website\n document.querySelectorAll('.tech-card').forEach(card => {\n card.addEventListener('click', (e) => {\n \/\/ Don't redirect if clicking on a child element that has its own click handler\n if (e.target.tagName !== 'A' && e.target.tagName !== 'I') {\n const url = card.getAttribute('data-url');\n if (url) {\n window.open(url, '_blank');\n }\n }\n });\n });\n \n \/\/ Auto-scroll functionality\n function startAutoScroll() {\n autoScrollInterval = setInterval(() => {\n nextSlide();\n }, 4000);\n }\n \n \/\/ Pause auto-scroll on hover\n techTrack.addEventListener('mouseenter', () => {\n clearInterval(autoScrollInterval);\n });\n \n techTrack.addEventListener('mouseleave', () => {\n startAutoScroll();\n });\n \n \/\/ Initialize slider position and auto-scroll\n updateSliderPosition();\n startAutoScroll();\n \n \/\/ Handle window resize\n window.addEventListener('resize', () => {\n \/\/ Recalculate visible cards\n const newVisibleCards = Math.floor(techTrack.parentElement.offsetWidth \/ cardWidth);\n \n \/\/ Reset position if needed\n if (Math.abs(position) >= cardWidth * totalCards) {\n position = 0;\n updateSliderPosition();\n }\n });\n <\/script>\n<\/body>\n<\/html>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Elite SOC Services – Advanced Cyber Defense Operations Elite SOCOperations Center Advanced SIEM integration with AI-powered threat hunting, real-time MITRE ATT&CK framework analysis, and zero-day vulnerability response. Our Tier 1-3 analysts provide 24\/7 incident response and forensic analysis. Get in Touch View Capabilities \ud83d\udee1\ufe0f SOC Command Center – STEGANOS CRITICAL: APT29 IOCs detected – Lateral […]<\/p>\n","protected":false},"featured_media":137,"menu_order":0,"template":"","meta":[],"portfolio-cat":[21],"portfolio-tag":[5],"portfolio-filter":[6],"_links":{"self":[{"href":"https:\/\/steganostech.com\/index.php\/wp-json\/wp\/v2\/portfolio\/548"}],"collection":[{"href":"https:\/\/steganostech.com\/index.php\/wp-json\/wp\/v2\/portfolio"}],"about":[{"href":"https:\/\/steganostech.com\/index.php\/wp-json\/wp\/v2\/types\/portfolio"}],"version-history":[{"count":68,"href":"https:\/\/steganostech.com\/index.php\/wp-json\/wp\/v2\/portfolio\/548\/revisions"}],"predecessor-version":[{"id":626,"href":"https:\/\/steganostech.com\/index.php\/wp-json\/wp\/v2\/portfolio\/548\/revisions\/626"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/steganostech.com\/index.php\/wp-json\/wp\/v2\/media\/137"}],"wp:attachment":[{"href":"https:\/\/steganostech.com\/index.php\/wp-json\/wp\/v2\/media?parent=548"}],"wp:term":[{"taxonomy":"portfolio-cat","embeddable":true,"href":"https:\/\/steganostech.com\/index.php\/wp-json\/wp\/v2\/portfolio-cat?post=548"},{"taxonomy":"portfolio-tag","embeddable":true,"href":"https:\/\/steganostech.com\/index.php\/wp-json\/wp\/v2\/portfolio-tag?post=548"},{"taxonomy":"portfolio-filter","embeddable":true,"href":"https:\/\/steganostech.com\/index.php\/wp-json\/wp\/v2\/portfolio-filter?post=548"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}