/* ===== RESET ===== */
    * { margin:0; padding:0; box-sizing:border-box; font-family:"Poppins",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial; }
    html,body { height:100%; scroll-behavior:smooth; }
    body { background:#050505; color:#f5f5f5; overflow-x:hidden; -webkit-font-smoothing:antialiased; }

    /* === Navbar === */
    nav {
      position: fixed; top: 0; left: 0;
      width: 100%; padding: 18px 25px;
      display: flex; justify-content: space-between; align-items: center;
      background: rgba(0,0,0,0.35);
      backdrop-filter: blur(10px);
      z-index: 1000;
    }
    /* === LOGO IMAGE === */
.logo {
  display: flex;
  align-items: center;
  position: relative;
}

.logo img {
  height: 55px;
  width: auto;
  transition: all 0.4s ease;
  filter: drop-shadow(0 0 5px rgba(0,255,255,0.3));
}

/* Hover glow effect */
.logo img:hover {
  filter: drop-shadow(0 0 15px rgba(0,255,255,0.9))
          drop-shadow(0 0 30px rgba(0,255,255,0.6));
  transform: scale(1.05);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .logo img {
    height: 45px;
  }
}
@media (max-width: 480px) {
  .logo img {
    height: 38px;
  }
}
    .menu-toggle { display:none; flex-direction:column; cursor:pointer; }
    .menu-toggle span { background:#fff; height:3px; width:25px; margin:4px 0; border-radius:5px; }
    nav ul { display:flex; list-style:none; gap:35px; transition:max-height 0.4s ease; }
    nav ul li a {
      color:#fff; text-decoration:none; font-weight:500; position:relative;
    }
    nav ul li a::after {
      content:""; position:absolute; left:0; bottom:-4px;
      width:0%; height:2px; background:#00ffd5; transition:0.3s;
    }
    nav ul li a:hover::after { width:100%; }

    /* === Mobile nav === */
    @media(max-width:768px){
      .menu-toggle{display:flex;}
      nav ul{
        position:absolute; top:70px; left:0; width:100%;
        background:rgba(0,0,0,0.9);
        flex-direction:column; align-items:center;
        max-height:0; overflow:hidden;
      }
      nav ul.active{max-height:260px; padding:15px 0;}
    }

    /* ===== HERO ===== */
    .hero {
      position:relative; height:100vh; display:flex;
      flex-direction:column; align-items:center; justify-content:center;
      text-align:center; overflow:hidden;
      background:radial-gradient(circle at 20% 10%,rgba(0,255,213,0.02)0%,transparent 10%), radial-gradient(circle at 85% 80%,rgba(80,100,255,0.02)0%,transparent 15%);
    }
    .gradient-layer {
      position:absolute; inset:0; z-index:-4;
      background:linear-gradient(120deg,rgba(0,26,31,1),rgba(0,0,0,1)40%,rgba(2,17,29,1));
      background-size:300% 300%; animation:gradientShift 18s ease-in-out infinite;
      opacity:.95; mix-blend-mode:screen; filter:contrast(1.05) saturate(1.1);
    }
    @keyframes gradientShift {
      0%{background-position:0% 50%}50%{background-position:50% 100%}100%{background-position:100% 50%}
    }
    .wave {
      position:absolute; width:140%; height:140%; left:-20%; top:-35%;
      border-radius:50%; filter:blur(120px) saturate(1.2);
      pointer-events:none; z-index:-3; opacity:0.9; transform-origin:center;
    }
    .wave.w1{background:radial-gradient(circle at 30% 30%,rgba(0,255,213,0.22),transparent 45%);animation:waveRotate 26s linear infinite;mix-blend-mode:screen;}
    .wave.w2{background:radial-gradient(circle at 70% 70%,rgba(0,140,255,0.18),transparent 45%);animation:waveRotate 34s linear infinite reverse;}
    .wave.w3{background:radial-gradient(circle at 50% 50%,rgba(155,0,255,0.16),transparent 45%);animation:waveRotate 40s linear infinite;}
    @keyframes waveRotate{
      0%{transform:scale(1)rotate(0deg);}50%{transform:scale(1.12)rotate(180deg);}100%{transform:scale(1)rotate(360deg);}
    }

    .particles{position:absolute;inset:0;z-index:-2;pointer-events:none;overflow:hidden;}
    .particle{position:absolute;bottom:-6vh;border-radius:50%;opacity:0;box-shadow:0 0 6px rgba(0,255,255,0.12);mix-blend-mode:screen;}

    .glow-dot{position:absolute;width:8px;height:8px;border-radius:50%;background:rgba(0,255,213,0.12);filter:blur(6px);z-index:-1;}

    .hero h1 {
      font-size:3.4rem; color:#00ffd5; letter-spacing:3px; text-transform:uppercase;
      text-shadow:0 0 25px rgba(0,255,213,0.12),0 0 45px rgba(0,255,213,0.06);
      margin-bottom:12px; animation:floatTitle 3s ease-in-out infinite alternate;
    }
    @keyframes floatTitle {from{transform:translateY(0)}to{transform:translateY(-10px)}}
    .hero p {max-width:720px;font-size:1.05rem;margin-top:6px;color:#d8d8d8;animation:fadeIn 1.6s ease both;}
    @keyframes fadeIn {from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}

    /* Responsive hero text */
    @media(max-width:768px){.hero h1{font-size:2.2rem;padding:0 20px;} .hero p{font-size:0.95rem;padding:0 25px;}}

    /* ===== SOLUTIONS ===== */
    .solutions-section{padding:100px 70px;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,0.6)100%);}
    .solutions-section h2{text-align:center;font-size:2.6rem;color:#00ffd5;text-transform:uppercase;margin-bottom:48px;}
    .solutions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px;}
    .solution{
      position:relative;overflow:hidden;border-radius:18px;
      background:linear-gradient(180deg,rgba(255,255,255,0.03),rgba(255,255,255,0.02));
      border:1px solid rgba(255,255,255,0.06);padding:34px 20px;text-align:center;
      transition:transform .36s ease, box-shadow .36s ease;
    }
    .solution .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.45),rgba(0,0,0,0.35));border-radius:18px;z-index:0;}
    .solution *:not(.overlay){position:relative;z-index:1;}
    .solution i{font-size:2.6rem;color:#00ffd5;margin-bottom:18px;}
    .solution:hover{transform:translateY(-8px);box-shadow:0 12px 40px rgba(0,0,0,0.6);}
    .solution h3{color:#00ffd5;margin-bottom:10px;font-size:1.25rem;}
    .solution p{color:#cfcfcf;font-size:0.95rem;line-height:1.45;margin-bottom:18px;}
    .solution a{
      display:inline-block;background:linear-gradient(90deg,#5227FF,#00FFFF);
      border-radius:999px;padding:10px 26px;font-weight:600;color:#fff;text-decoration:none;
      box-shadow:0 6px 18px rgba(0,255,255,0.06);transition:transform .28s ease,box-shadow .28s ease;
    }
    .solution a:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,255,255,0.16);}
    @media(max-width:768px){.solutions-section{padding:60px 30px;} .solutions-section h2{font-size:2rem;margin-bottom:30px;}}

    /* CTA */
    .cta{text-align:center;padding:80px 20px;background:linear-gradient(0deg,rgba(0,0,0,0.6),rgba(0,0,0,0.4));}
    .cta h2{font-size:2.2rem;color:#00ffd5;margin-bottom:12px;}
    .cta p{color:#bbb;max-width:640px;margin:0 auto 18px;}
    .cta button{background:#00ffd5;color:#000;border:none;padding:12px 28px;font-weight:700;border-radius:26px;cursor:pointer;}
    .cta button:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(0,255,213,0.12);}
    @media(max-width:768px){.cta h2{font-size:1.8rem;} .cta p{font-size:0.95rem;}}

    /* FOOTER */
    footer{
      background:rgba(0,0,0,0.7);backdrop-filter:blur(10px);
      padding:50px 70px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;color:#fff;
    }
    .footer-left,.footer-middle,.footer-right{flex:1;min-width:250px;margin:20px;}
    .footer-right{text-align:right;}
    .company-name{font-size:28px;font-weight:bold;color:#00ff99;animation:floatText 3s ease-in-out infinite alternate;}
    @keyframes floatText{0%{transform:translateY(0)}100%{transform:translateY(-10px)}}
    .footer-middle h3,.footer-left h3{margin-bottom:10px;color:#00ff99;}
    .footer-middle ul{list-style:none;padding:0;}
    .footer-middle li{margin:6px 0;}
    .footer-middle li::before{content:"• ";color:#00ff99;}
    .footer-left p{margin-bottom:15px;line-height:1.5;}
    .social-icons a{margin-right:15px;}
    .social-icons img{width:25px;height:25px;vertical-align:middle;}
    #copy{text-align:center;margin-top:50px;color:#aaa;font-size:0.9rem;width:100%;}
    @media(max-width:768px){
      footer{flex-direction:column;align-items:center;padding:30px 20px;text-align:center;}
      .footer-left,.footer-middle,.footer-right{width:90%;margin:15px 0;text-align:center;}
      .company-name{font-size:22px;}
    }

    /* Cursor glow */
    #cursor-glow{position:fixed;width:44px;height:44px;border-radius:50%;pointer-events:none;z-index:9999;
      background:radial-gradient(circle,rgba(0,255,213,0.35)0%,rgba(0,255,213,0.12)50%,transparent 70%);
      filter:blur(6px);transform:translate(-9999px,-9999px);transition:transform .06s linear;mix-blend-mode:screen;
    }

    /* WhatsApp float */
    .whatsapp-float{position:fixed;bottom:20px;right:20px;z-index:999;}
    .whatsapp-float img{width:44px;height:44px;filter:drop-shadow(0 6px 12px rgba(0,0,0,0.6));}