
:root{--blue:#1675d1;--navy:#24527d;--ink:#304b66;--muted:#71869a;--bg:#f5faff;--line:#e5ebf3}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Arial,Helvetica,sans-serif;color:var(--ink);line-height:1.65}.container{max-width:1180px}
.topbar{background:#eaf5ff;color:#526b83;font-size:13px;padding:7px 0}.topbar a{color:#fff}.navbar{background:#fff!important;box-shadow:0 2px 18px #08234a18;padding:16px 0;transition:.25s}.navbar.scrolled{padding:10px 0}.navbar-brand{font-weight:800;color:var(--navy)!important;font-size:23px}.brand-icon{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:5px;background:var(--blue);color:#fff;font-weight:900;margin-right:10px}.nav-link{font-size:14px;font-weight:600;color:#31445f!important;margin:0 5px}.nav-link:hover,.nav-link.active{color:var(--blue)!important}.quote-btn{background:var(--blue);color:#fff!important;padding:11px 19px!important;border-radius:3px}
.hero{min-height:610px;background:linear-gradient(105deg,#eaf6ff,#f8fcff 55%,#dff1ff);color:#fff;position:relative;overflow:hidden}.hero:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 35%,#50c8ff33,transparent 25%)}.hero-content{position:relative;z-index:2;padding:140px 0 100px}.hero h1{font-size:58px;line-height:1.08;font-weight:700;max-width:720px}.hero p{font-size:19px;color:#f4f9ff;max-width:650px}.eyebrow{font-size:13px;text-transform:uppercase;letter-spacing:2px;font-weight:700;color:#70c8ff}.btn-main{background:#fff;color:var(--blue);border:0;border-radius:3px;padding:14px 24px;font-weight:700}.btn-blue{background:var(--blue);color:#fff;border:0;border-radius:3px;padding:13px 23px;font-weight:700}.btn-blue:hover{background:#084f9f;color:#fff}
.hero-art{height:430px;position:relative}.screen{position:absolute;right:0;top:35px;width:480px;height:315px;background:#ffffff12;border:1px solid #ffffff38;transform:skewY(-3deg);box-shadow:0 35px 70px #0005}.screen:before{content:"";position:absolute;left:25px;right:25px;top:30px;height:10px;background:#ffffff40;box-shadow:0 34px 0 #ffffff25,0 68px 0 #ffffff18,0 102px 0 #ffffff12}.globe{position:absolute;width:260px;height:260px;border:1px solid #ffffff50;border-radius:50%;right:75px;bottom:0;box-shadow:0 0 60px #19bfff1c}.globe:before{content:"";position:absolute;inset:25px;border:1px solid #ffffff30;border-radius:50%}
.section{padding:90px 0}.section-light{background:var(--bg)}.section-title{font-size:40px;line-height:1.15;font-weight:700;color:var(--navy)}.lead-muted{font-size:17px;color:var(--muted)}.center{text-align:center}.service-card{height:100%;padding:34px 28px;border:1px solid var(--line);background:#fff;transition:.3s}.service-card:hover{transform:translateY(-5px);box-shadow:0 18px 45px #08234a14}.service-icon{font-size:35px;color:var(--blue);margin-bottom:18px}.service-card h3{font-size:20px;color:var(--navy)}.service-card p{font-size:14px;color:var(--muted)}.service-card a{font-size:13px;color:var(--blue);font-weight:700;text-decoration:none}
.split-image{min-height:410px;background:linear-gradient(135deg,#dff1ff,#eef8ff);position:relative}.split-image:before{content:"";position:absolute;width:300px;height:300px;border:1px solid #ffffff45;border-radius:50%;left:20%;top:12%;box-shadow:0 0 0 45px #ffffff0b,0 0 0 90px #ffffff07}.split-label{position:absolute;left:45px;bottom:40px;color:#fff;font-size:27px;font-weight:700}.industry-card{background:#fff;padding:25px;border:1px solid var(--line);height:100%;display:flex;align-items:center;gap:15px}.industry-card i{font-size:28px;color:var(--blue)}
.process{position:relative}.process:before{content:"";position:absolute;left:10%;right:10%;top:32px;height:1px;background:#d9e4f2}.process-step{text-align:center;position:relative}.process-num{margin:auto;width:64px;height:64px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font-weight:800;border:7px solid #e9f3ff;position:relative;z-index:2}.process-step h4{font-size:18px;margin-top:20px}.process-step p{font-size:13px;color:var(--muted)}
.counter{background:#fff;border-top:4px solid var(--blue);padding:28px;text-align:center}.counter strong{display:block;font-size:38px;color:var(--navy)}.counter span{color:var(--muted);font-size:13px}.cta{background:linear-gradient(90deg,#eaf6ff,#dcefff);color:#fff;padding:65px 0}.cta h2{font-size:38px}.cta p{color:#d9eaff}
.page-hero{background:linear-gradient(105deg,#eaf6ff,#ffffff);color:#fff;padding:145px 0 75px}.page-hero h1{font-size:52px}.page-hero p{color:#526b83;font-size:18px;max-width:720px}.tag{display:inline-block;background:#edf5ff;color:var(--blue);font-size:11px;font-weight:700;padding:5px 9px;border-radius:2px}.project{border:1px solid var(--line);background:#fff;height:100%;overflow:hidden}.project-img{height:190px;background:linear-gradient(135deg,#e8f5ff,#d8edff);color:#fff;display:grid;place-items:center;font-size:24px;font-weight:700}.project-body{padding:25px}.project-body p{color:var(--muted);font-size:14px}.form-box{background:#fff;border:1px solid var(--line);padding:35px;box-shadow:0 12px 35px #08234a0b}.form-control,.form-select{border-radius:2px;padding:12px;border-color:#d9e2ee}
.footer{background:#edf7ff;color:#607b93;padding:65px 0 20px}.footer h5{color:#fff;font-size:16px}.footer a{color:#607b93;text-decoration:none;font-size:13px}.footer a:hover{color:#fff}.footer-brand{color:#fff;font-size:24px;font-weight:800}.footer-bottom{border-top:1px solid #ffffff17;margin-top:45px;padding-top:20px;font-size:12px}.reveal{opacity:0;transform:translateY(18px);transition:.6s}.reveal.visible{opacity:1;transform:none}.backtop{position:fixed;right:20px;bottom:20px;width:44px;height:44px;border:0;background:var(--blue);color:#fff;display:none;z-index:100}.backtop.show{display:block}
@media(max-width:991px){.hero h1{font-size:44px}.hero-art{display:none}.navbar .navbar-collapse{padding:15px 0}.process:before{display:none}}@media(max-width:575px){.section{padding:65px 0}.section-title{font-size:32px}.hero h1{font-size:37px}.page-hero h1{font-size:38px}}

/* =========================================================
   MUTEX TECHNOLOGY — LIGHT CORPORATE DESIGN SYSTEM
   ========================================================= */
body{background:#fff}
.topbar{background:#f4f9fd;color:#607b93;border-bottom:1px solid #e5eef7}
.topbar a{color:#1675d1;text-decoration:none}
.navbar{background:rgba(255,255,255,.98)!important;border-bottom:1px solid #edf2f7}
.navbar-brand{color:#24527d!important}
.brand-icon{background:#1675d1;box-shadow:0 8px 20px #1675d11c}
.nav-link{color:#526b83!important}
.nav-link:hover,.nav-link.active{color:#1675d1!important}
.quote-btn{color:#fff!important;background:#1675d1!important}
.hero{background:#f5faff!important;color:#24527d!important}
.hero:after{background:radial-gradient(circle at 78% 28%,#b9e3ff66,transparent 32%)!important}
.hero h1{color:#24527d!important}
.hero p{color:#607b93!important}
.hero .eyebrow{color:#1675d1!important}
.hero .btn-main{background:#1675d1;color:#fff}
.hero .btn-outline-light{border-color:#1675d1!important;color:#1675d1!important}
.hero .btn-outline-light:hover{background:#1675d1!important;color:#fff!important}
.screen{background:#fff!important;border-color:#d8eaf7!important;box-shadow:0 30px 70px #1675d118!important}
.screen:before{background:#d8eaf7!important;box-shadow:0 34px 0 #e6f2fa,0 68px 0 #edf6fb,0 102px 0 #f2f8fc!important}
.globe{border-color:#a9d5f2!important;box-shadow:0 0 60px #76c4f51f!important}
.globe:before{border-color:#c7e3f4!important}
.section-light{background:#f7fbff!important}
.section-title{color:#24527d!important}
.service-card{border-color:#e1ecf5!important;box-shadow:0 5px 20px #24527d08}
.service-card:hover{box-shadow:0 18px 45px #1675d114;border-color:#b9d9f1}
.service-icon{color:#1675d1!important}
.industry-card{border-color:#e1ecf5!important}
.split-image{background:linear-gradient(135deg,#dff1ff,#f5fbff)!important;border:1px solid #d8ebf7}
.split-label{color:#24527d!important}
.page-hero{background:#f5faff!important;color:#24527d!important;border-bottom:1px solid #e5f0f7}
.page-hero h1{color:#24527d!important}
.page-hero p{color:#607b93!important}
.page-hero .eyebrow{color:#1675d1!important}
.cta{background:#f1f8fe!important;color:#24527d!important;border-top:1px solid #dceef9;border-bottom:1px solid #dceef9}
.cta h2{color:#24527d!important}
.cta p{color:#607b93!important}
.footer{background:#f6faff!important;color:#607b93!important;border-top:1px solid #e2edf5}
.footer h5,.footer-brand{color:#24527d!important}
.footer a{color:#607b93!important}
.footer a:hover{color:#1675d1!important}
.footer-bottom{border-top-color:#dce9f2!important}
.counter{border-top:0;border:1px solid #e0edf6;box-shadow:0 8px 30px #24527d08}
.counter strong{color:#1675d1}
.tech-logo-card{height:125px;border:1px solid #e0ecf5;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border-radius:4px;transition:.25s}
.tech-logo-card:hover{transform:translateY(-4px);border-color:#aad5f1;box-shadow:0 15px 35px #1675d112}
.tech-logo{font-size:38px;color:#1675d1;line-height:1}
.tech-name{font-size:13px;font-weight:700;color:#46637d}
.tech-category{font-size:11px;color:#8a9bad}
.tech-menu{position:static}
.tech-mega{position:absolute;left:50%;transform:translateX(-50%);top:100%;width:min(1000px,94vw);background:#fff;border:1px solid #e2edf5;box-shadow:0 22px 55px #24527d18;padding:25px;display:none;z-index:1000}
.tech-menu:hover .tech-mega,.tech-menu:focus-within .tech-mega{display:block}
.tech-mega h6{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:#1675d1;margin-bottom:12px}
.tech-mega a{display:block;padding:7px 8px;color:#536d84;text-decoration:none;border-radius:3px;font-size:13px}
.tech-mega a:hover{background:#f1f8fe;color:#1675d1}
@media(max-width:991px){.tech-mega{position:static;transform:none;width:100%;box-shadow:none;border:0;padding:10px}.tech-menu:hover .tech-mega{display:none}.tech-menu.open .tech-mega{display:block}}

/* FINAL MENU FIX */
.navbar{z-index:2000!important;overflow:visible!important}
.navbar .container,.navbar .navbar-collapse,.navbar .navbar-nav{overflow:visible!important}
.topbar a{color:#1675d1!important}
.hero p{color:#607b93!important}.hero{color:#24527d!important}.hero .eyebrow{color:#1675d1!important}
.tech-menu{position:relative!important}
.tech-mega{display:none;visibility:hidden;opacity:0;pointer-events:none;position:absolute!important;top:calc(100% + 8px)!important;left:50%!important;transform:translateX(-50%)!important;min-width:900px!important;max-height:70vh;overflow:auto;z-index:99999!important;background:#fff!important}
.tech-menu:hover>.tech-mega,.tech-menu:focus-within>.tech-mega,.tech-menu.open>.tech-mega{display:block!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important}
.tech-menu>a{cursor:pointer}
@media(max-width:991px){
 .tech-mega{position:relative!important;top:auto!important;left:auto!important;transform:none!important;min-width:0!important;width:100%!important;max-height:none!important;margin-top:4px;padding:12px!important;box-shadow:none!important}
 .tech-menu:hover>.tech-mega{display:none!important;visibility:hidden!important;opacity:0!important}
 .tech-menu.open>.tech-mega,.tech-menu:focus-within>.tech-mega{display:block!important;visibility:visible!important;opacity:1!important}
 .tech-mega .col-md-4,.tech-mega .col-lg-3{width:100%!important}
}
