:root{
  --bg:#08111f;--bg2:#0d1b2f;--card:#101f36;--text:#eef5ff;--muted:#a7b5c8;--brand:#39d6ff;--brand2:#7c5cff;--accent:#21e6a7;--border:rgba(255,255,255,.12);--shadow:0 20px 60px rgba(0,0,0,.35)
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at top left,rgba(57,214,255,.18),transparent 32%),linear-gradient(135deg,var(--bg),#050912 70%);color:var(--text);line-height:1.6;min-height:100vh}
a{color:inherit;text-decoration:none}.container{width:min(1180px,92%);margin:auto}.nav{position:sticky;top:0;z-index:20;background:rgba(8,17,31,.82);backdrop-filter:blur(18px);border-bottom:1px solid var(--border)}.nav-inner{height:78px;display:flex;align-items:center;justify-content:space-between}.logo{font-size:28px;font-weight:900;letter-spacing:.5px}.logo span{color:var(--brand)}.menu{display:flex;gap:18px;align-items:center}.menu a{font-weight:700;color:var(--muted);font-size:14px}.menu a:hover,.menu a.active{color:var(--brand)}.hamb{display:none;background:none;border:0;color:white;font-size:28px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 22px;border-radius:999px;background:linear-gradient(135deg,var(--brand),var(--brand2));font-weight:800;color:white;box-shadow:0 12px 35px rgba(57,214,255,.24);border:0;cursor:pointer}.btn.alt{background:rgba(255,255,255,.08);border:1px solid var(--border);box-shadow:none}.hero{padding:90px 0 70px}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}.badge{display:inline-flex;padding:8px 14px;border:1px solid var(--border);border-radius:999px;color:var(--accent);background:rgba(33,230,167,.08);font-weight:800;margin-bottom:20px}.hero h1,.page-title h1{font-size:clamp(42px,6vw,76px);line-height:1.03;margin-bottom:22px}.gradient{background:linear-gradient(135deg,var(--brand),var(--accent));-webkit-background-clip:text;color:transparent}.lead{font-size:20px;color:var(--muted);max-width:780px}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}.mockup{background:linear-gradient(160deg,rgba(57,214,255,.18),rgba(124,92,255,.14));border:1px solid var(--border);border-radius:34px;padding:24px;box-shadow:var(--shadow)}.screen{background:#07101d;border-radius:24px;border:1px solid var(--border);overflow:hidden}.bar{height:46px;background:rgba(255,255,255,.08);display:flex;align-items:center;padding:0 18px;gap:8px}.dot{width:12px;height:12px;border-radius:50%;background:var(--brand)}.screen-content{padding:28px}.code-line{height:13px;background:rgba(255,255,255,.12);border-radius:20px;margin:14px 0}.code-line:nth-child(2n){width:76%}.code-line:nth-child(3n){width:55%;background:rgba(57,214,255,.25)}section,.page{padding:75px 0}.page-title{padding:70px 0 35px;text-align:center}.section-head{text-align:center;margin-bottom:42px}.section-head h2{font-size:clamp(30px,4vw,48px);margin-bottom:12px}.section-head p{color:var(--muted);max-width:720px;margin:auto}.grid{display:grid;gap:22px}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}.card{background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));border:1px solid var(--border);border-radius:26px;padding:26px;box-shadow:0 8px 30px rgba(0,0,0,.18);transition:.25s}.card:hover{transform:translateY(-7px);border-color:rgba(57,214,255,.45)}.icon{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,var(--brand),var(--brand2));font-size:25px;margin-bottom:18px}.card h3{font-size:22px;margin-bottom:10px}.card p,.muted{color:var(--muted)}.trusted{display:flex;gap:18px;flex-wrap:wrap;justify-content:center}.trusted span{padding:16px 26px;border:1px solid var(--border);border-radius:18px;background:rgba(255,255,255,.05);font-weight:900;color:#dce9ff}.tech{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}.tech span{padding:14px 20px;border-radius:16px;background:rgba(57,214,255,.08);border:1px solid rgba(57,214,255,.25);font-weight:800}.timeline{max-width:900px;margin:auto}.step{display:grid;grid-template-columns:80px 1fr;gap:18px;margin-bottom:20px}.num{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),var(--brand));font-weight:900;font-size:22px}.portfolio-img{height:170px;border-radius:20px;background:linear-gradient(135deg,rgba(57,214,255,.22),rgba(124,92,255,.25));margin-bottom:18px;display:grid;place-items:center;font-size:42px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.stat{text-align:center}.stat strong{font-size:46px;color:var(--brand)}.faq-item{border:1px solid var(--border);border-radius:20px;margin-bottom:14px;background:rgba(255,255,255,.05);overflow:hidden}.faq-q{padding:20px;font-weight:900;cursor:pointer;display:flex;justify-content:space-between}.faq-a{display:none;padding:0 20px 20px;color:var(--muted)}.faq-item.open .faq-a{display:block}.cta{background:linear-gradient(135deg,rgba(57,214,255,.18),rgba(124,92,255,.18));border:1px solid var(--border);border-radius:34px;padding:48px;text-align:center}.form{max-width:760px;margin:auto;display:grid;gap:16px}.form input,.form textarea{width:100%;padding:16px 18px;border-radius:16px;border:1px solid var(--border);background:rgba(255,255,255,.06);color:white;outline:none}.form textarea{min-height:140px}.footer{border-top:1px solid var(--border);padding:35px 0;color:var(--muted);background:rgba(0,0,0,.15)}.footer-inner{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.footer a{color:var(--muted);margin-left:15px}.footer a:hover{color:var(--brand)}@media(max-width:900px){.hero-grid,.grid-3,.grid-4,.stats{grid-template-columns:1fr}.menu{position:fixed;inset:78px 0 auto 0;background:#08111f;display:none;flex-direction:column;padding:24px}.menu.show{display:flex}.hamb{display:block}.hero{text-align:center}.lead{margin:auto}.actions{justify-content:center}.step{grid-template-columns:1fr;text-align:center}.num{margin:auto}.footer-inner{justify-content:center;text-align:center}}


/* Professional logo, navbar and premium UI upgrades */
:root{--orange:#ff6a00;--glass:rgba(255,255,255,.075)}
.nav{box-shadow:0 10px 40px rgba(0,0,0,.22)}
.brand-logo{display:flex;align-items:center;gap:10px;font-size:25px;font-weight:950;letter-spacing:.3px;min-width:max-content}
.brand-logo img{width:52px;height:52px;object-fit:contain;filter:drop-shadow(0 8px 18px rgba(57,214,255,.18))}
.brand-logo span{color:#fff;line-height:1}.brand-logo b{color:var(--orange)}
.menu{gap:14px}.menu a{position:relative;white-space:nowrap}.menu a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:-9px;height:2px;border-radius:5px;background:linear-gradient(90deg,var(--brand),var(--orange));transform:scaleX(0);transform-origin:left;transition:.25s}.menu a:hover::after,.menu a.active::after{transform:scaleX(1)}
.btn{background:linear-gradient(135deg,var(--orange),#ff9d00 50%,var(--brand));box-shadow:0 15px 40px rgba(255,106,0,.24);transition:.25s}.btn:hover{transform:translateY(-2px);box-shadow:0 18px 46px rgba(255,106,0,.34)}
.badge{border-color:rgba(255,106,0,.3);color:#ffd4ad;background:rgba(255,106,0,.1)}
.gradient{background:linear-gradient(135deg,#fff,var(--brand) 45%,var(--orange));-webkit-background-clip:text;color:transparent}
.card{position:relative;overflow:hidden}.card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right,rgba(255,106,0,.13),transparent 35%),radial-gradient(circle at bottom left,rgba(57,214,255,.12),transparent 35%);pointer-events:none}.card>*{position:relative}.card:hover{border-color:rgba(255,106,0,.5);box-shadow:0 22px 55px rgba(0,0,0,.26)}
.icon{background:linear-gradient(135deg,var(--orange),var(--brand));box-shadow:0 14px 35px rgba(255,106,0,.18)}
.hero-logo-wrap{position:absolute;right:7%;top:110px;opacity:.08;pointer-events:none}.hero-logo{width:min(390px,38vw);filter:drop-shadow(0 25px 45px rgba(255,106,0,.25))}.hero{position:relative;overflow:hidden}
.mockup{backdrop-filter:blur(12px);background:linear-gradient(160deg,rgba(255,106,0,.16),rgba(57,214,255,.13));border-color:rgba(255,255,255,.16)}
.screen{box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}
.dot:nth-child(1){background:var(--orange)}.dot:nth-child(2){background:#ffcf33}.dot:nth-child(3){background:var(--brand)}
.page-title{position:relative;overflow:hidden}.page-title:before{content:"";position:absolute;inset:-30% 0 auto 0;height:360px;background:radial-gradient(circle,rgba(255,106,0,.18),transparent 62%);pointer-events:none}
.trusted span,.tech span{transition:.25s}.trusted span:hover,.tech span:hover{transform:translateY(-4px);border-color:rgba(255,106,0,.45)}
.footer-brand{display:flex;align-items:center;gap:13px}.footer-brand img{width:46px;height:46px;object-fit:contain}.footer{background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.33))}
@media(max-width:1100px){.menu{gap:10px}.menu a{font-size:12.5px}.brand-logo img{width:46px;height:46px}.brand-logo{font-size:22px}}
@media(max-width:900px){.brand-logo img{width:48px;height:48px}.hero-logo-wrap{right:-70px;top:120px}.hero-logo{width:320px}.footer-brand{justify-content:center;flex-direction:column}.menu a:not(.btn)::after{bottom:-4px}}

/* Top Contact Bar Section */
.topbar{background:#050912;border-bottom:1px solid var(--border);font-size:13px;color:var(--muted)}
.topbar-inner{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}.topbar-left{display:flex;gap:18px;flex-wrap:wrap}.topbar a{color:#fff}.topbar a:hover{color:var(--orange)}
.nav{top:0}.quote-btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 19px;border-radius:999px;background:linear-gradient(135deg,#ff6a00,#ffb000);color:#06101d!important;font-weight:950!important;box-shadow:0 14px 32px rgba(255,106,0,.28);border:1px solid rgba(255,255,255,.18)}.quote-btn:hover{transform:translateY(-2px);box-shadow:0 20px 44px rgba(255,106,0,.38)}
.dropdown{position:relative}.dropbtn{background:transparent;border:0;color:var(--muted);font-weight:800;font-size:14px;cursor:pointer;padding:8px 0}.dropbtn:hover{color:var(--brand)}.dropdown-menu{position:absolute;top:38px;left:0;min-width:225px;background:rgba(8,17,31,.98);border:1px solid var(--border);border-radius:18px;padding:10px;box-shadow:0 22px 55px rgba(0,0,0,.35);display:none}.dropdown:hover .dropdown-menu,.dropdown.open .dropdown-menu{display:grid;gap:4px}.dropdown-menu a{padding:10px 12px;border-radius:12px;display:block}.dropdown-menu a:hover,.dropdown-menu a.active{background:rgba(255,106,0,.12);color:#fff!important}.dropdown-menu a::after,.quote-btn::after{display:none!important}
/* Carousel Section */
.carousel-section{padding-top:30px}.carousel{position:relative;border:1px solid var(--border);border-radius:34px;overflow:hidden;background:linear-gradient(135deg,rgba(255,106,0,.12),rgba(57,214,255,.12));box-shadow:var(--shadow)}.carousel-track{position:relative;min-height:330px}.carousel-slide{position:absolute;inset:0;opacity:0;transform:scale(.98);transition:.45s;background:radial-gradient(circle at 80% 20%,rgba(255,106,0,.28),transparent 28%),radial-gradient(circle at 15% 80%,rgba(57,214,255,.22),transparent 30%);display:grid;place-items:center;text-align:center;padding:55px 80px}.carousel-slide.active{opacity:1;transform:scale(1);z-index:1}.carousel-slide span{display:inline-grid;place-items:center;width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--orange),var(--brand));font-weight:950;margin-bottom:18px}.carousel-slide h3{font-size:clamp(30px,4vw,52px);line-height:1.1;margin-bottom:12px}.carousel-slide p{color:var(--muted);font-size:19px;max-width:680px;margin:auto auto 22px}.carousel-slide a{font-weight:900;color:#fff}.carousel-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:46px;height:46px;border-radius:50%;border:1px solid var(--border);background:rgba(255,255,255,.1);color:#fff;font-size:34px;cursor:pointer}.carousel-btn:hover{background:rgba(255,106,0,.28)}.carousel-btn.prev{left:18px}.carousel-btn.next{right:18px}.carousel-dots{position:absolute;left:0;right:0;bottom:18px;z-index:4;display:flex;justify-content:center;gap:8px}.carousel-dots button{width:10px;height:10px;border:0;border-radius:50%;background:rgba(255,255,255,.35);cursor:pointer}.carousel-dots button.active{width:28px;border-radius:999px;background:var(--orange)}
/* Team Section */
.team-card{text-align:center}.avatar{width:92px;height:92px;border-radius:50%;display:grid;place-items:center;margin:0 auto 18px;background:linear-gradient(135deg,var(--orange),var(--brand));font-weight:950;font-size:27px;color:#07101d;box-shadow:0 16px 38px rgba(255,106,0,.23)}.role{color:var(--orange)!important;font-weight:900;margin-bottom:10px}.designer{margin-top:4px;color:#fff}.designer strong{color:var(--orange)}.footer-links{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.footer-links a{margin-left:0}
@media(max-width:900px){.topbar-inner{justify-content:center;text-align:center}.topbar-left{justify-content:center}.menu{inset:116px 0 auto 0;align-items:stretch}.dropdown-menu{position:static;display:none;margin-top:6px;box-shadow:none}.dropdown.open .dropdown-menu{display:grid}.dropbtn{width:100%;text-align:center}.quote-btn{width:100%}.carousel-slide{padding:45px 55px}.carousel-btn{width:40px;height:40px}.carousel-track{min-height:380px}}
@media(max-width:560px){.topbar-right{display:none}.carousel-slide{padding:40px 42px}.carousel-track{min-height:430px}}


/* =====================================================
   Light Professional Theme Update
   ===================================================== */
:root{
  --bg:#f4fbff;--bg2:#eef8ff;--card:#ffffff;--text:#062033;--muted:#5d7184;--brand:#0aa6c9;--brand2:#0b6bdc;--accent:#ff7a00;--border:rgba(10,55,85,.14);--shadow:0 18px 50px rgba(10,55,85,.13);--soft:#f7fcff;
}
body{background:linear-gradient(135deg,#f5fcff 0%,#ffffff 45%,#fff7ef 100%);color:var(--text)}
body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 15% 10%,rgba(10,166,201,.12),transparent 30%),radial-gradient(circle at 90% 0%,rgba(255,122,0,.11),transparent 28%);pointer-events:none;z-index:-1}
.topbar{background:#eefdff;color:#38566a;border-bottom:1px solid rgba(10,166,201,.15)}
.topbar a{color:#075985;font-weight:800}.topbar a:hover{color:var(--accent)}
.nav{background:rgba(255,255,255,.92);border-bottom:1px solid rgba(10,55,85,.10);box-shadow:0 8px 32px rgba(10,55,85,.09);backdrop-filter:blur(18px)}
.brand-logo span{color:#0f172a}.brand-logo b{color:var(--accent)}
.menu a,.dropbtn{color:#294a60}.menu a:hover,.menu a.active,.dropbtn:hover{color:#0b6bdc}
.menu a:not(.btn)::after{background:linear-gradient(90deg,var(--brand),var(--accent))}
.dropdown-menu{background:#fff;border:1px solid rgba(10,55,85,.12);box-shadow:0 22px 55px rgba(10,55,85,.14)}
.dropdown-menu a:hover,.dropdown-menu a.active{background:#fff4ea;color:#0f172a!important}
.quote-btn,.btn{background:linear-gradient(135deg,#0b6bdc,#08b8d8);color:#fff!important;box-shadow:0 14px 32px rgba(11,107,220,.25)}
.quote-btn:hover,.btn:hover{box-shadow:0 20px 44px rgba(11,107,220,.35)}
.btn.alt{background:#fff;color:#0b6bdc!important;border:1px solid rgba(11,107,220,.18)}
.hero{padding:70px 0 65px}.hero h1,.page-title h1{color:#092338}.lead,.section-head p,.card p,.muted,.faq-a,.carousel-slide p{color:var(--muted)}
.badge{border-color:rgba(10,166,201,.23);color:#087b98;background:#e9fbff}.gradient{background:linear-gradient(135deg,#062033,#0aa6c9 48%,#ff7a00);-webkit-background-clip:text;color:transparent}
.card,.soft-card{background:#fff;border:1px solid rgba(10,55,85,.12);box-shadow:0 14px 38px rgba(10,55,85,.10)}
.card:before{background:radial-gradient(circle at top right,rgba(255,122,0,.07),transparent 35%),radial-gradient(circle at bottom left,rgba(10,166,201,.08),transparent 35%)}
.card:hover{border-color:rgba(10,166,201,.35);box-shadow:0 24px 60px rgba(10,55,85,.15)}
.icon,.num{background:linear-gradient(135deg,#0aa6c9,#0b6bdc);color:#fff}.role{color:#0b6bdc!important}.designer{color:#0f172a}.designer strong{color:#ff7a00}
.mockup{background:linear-gradient(160deg,#fff,#eefdff);border-color:rgba(10,55,85,.12);box-shadow:var(--shadow)}.screen{background:#ffffff}.bar{background:#edf7ff}.screen-content h3{color:#092338}.code-line{background:#d9eaf5}.code-line:nth-child(3n){background:#bdeeff}
.carousel-section{padding:28px 0 35px}.carousel{background:linear-gradient(135deg,#eafbff,#fff5e9);border-color:rgba(10,55,85,.12);box-shadow:0 18px 48px rgba(10,55,85,.12)}.carousel-track{min-height:365px}.carousel-slide{background:radial-gradient(circle at 80% 20%,rgba(255,122,0,.18),transparent 28%),radial-gradient(circle at 15% 80%,rgba(10,166,201,.18),transparent 30%)}.carousel-slide span{background:linear-gradient(135deg,#ff7a00,#0aa6c9);color:#fff}.carousel-slide h3{color:#092338}.carousel-slide a{color:#0b6bdc}.carousel-btn{background:#fff;color:#0b6bdc;border-color:rgba(10,55,85,.13);box-shadow:0 10px 25px rgba(10,55,85,.12)}.carousel-btn:hover{background:#eafbff}.carousel-dots button{background:#b4c7d6}.carousel-dots button.active{background:#0b6bdc}
.trusted span,.tech span{background:#fff;border-color:rgba(10,55,85,.12);color:#092338}.tech span{background:#eefbff}.faq-item{background:#fff;border-color:rgba(10,55,85,.12)}.form input,.form textarea{background:#fff;color:#092338;border:1px solid rgba(10,55,85,.18)}.form input:focus,.form textarea:focus{border-color:#0aa6c9;box-shadow:0 0 0 4px rgba(10,166,201,.10)}
.footer{background:#ecf8f5;color:#426071;border-top:1px solid rgba(10,55,85,.10)}.footer a{color:#426071}.footer a:hover{color:#0b6bdc}
/* Team Image Section */
.team-section .team-card{padding:18px 18px 26px}.team-photo{width:100%;height:245px;object-fit:cover;border-radius:22px;margin-bottom:20px;background:#f5fbff;box-shadow:0 12px 32px rgba(10,55,85,.10)}.avatar{display:none}
/* Contact Page With Google Map */
.contact-heading{margin-bottom:46px}.small-title{display:inline-flex;align-items:center;gap:10px;text-transform:uppercase;font-weight:900;color:#0aa6c9;letter-spacing:.7px;margin-bottom:10px}.small-title:before,.small-title:after{content:"";width:48px;height:3px;background:linear-gradient(90deg,#0aa6c9,#ff7a00);border-radius:10px}.contact-heading h2{font-size:clamp(34px,4vw,54px);color:#092338}.contact-grid{display:grid;grid-template-columns:1fr 1.08fr 1fr;gap:28px;align-items:stretch}.contact-info h3{font-size:24px;margin-bottom:10px}.contact-info>p{margin-bottom:24px}.contact-item{display:grid;grid-template-columns:54px 1fr;gap:16px;margin-top:18px;align-items:center}.contact-item span{width:54px;height:54px;border-radius:14px;background:linear-gradient(135deg,#0aa6c9,#0b6bdc);color:#fff;display:grid;place-items:center;font-size:22px}.contact-item h4{font-size:20px;color:#0b6bdc}.map-box{min-height:420px;border-radius:26px;overflow:hidden;box-shadow:0 14px 38px rgba(10,55,85,.12);border:1px solid rgba(10,55,85,.12);background:#fff}.map-box iframe{width:100%;height:100%;border:0;display:block}.contact-form{padding:24px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.contact-form .btn{width:100%;border-radius:16px;padding:16px 20px}
@media(max-width:1050px){.contact-grid{grid-template-columns:1fr}.map-box{height:380px}.team-photo{height:280px}}
@media(max-width:900px){.hamb{color:#092338}.menu{background:#fff;box-shadow:0 20px 45px rgba(10,55,85,.15)}.carousel-section{padding-top:20px}.carousel-track{min-height:420px}.hero{text-align:center}.mockup{max-width:520px;margin:auto}}
@media(max-width:560px){.form-row{grid-template-columns:1fr}.map-box{height:340px}.team-photo{height:230px}.carousel-track{min-height:455px}.carousel-slide{padding:40px 38px}.nav-inner{height:72px}.brand-logo img{width:44px;height:44px}.brand-logo{font-size:21px}}