body{
  font-family:'Poppins',sans-serif;
  color:white;
  overflow-x:hidden;
  background:#050B18;
}

/* NAVBAR */
.navbar{
  background:rgba(5,11,24,0.8);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(0,231,241,0.2);
}
.navbar-brand{
  color:#00E7F1;
  font-weight:700;
  font-size:22px;
}
.nav-link{
  color:white !important;
  margin-left:20px;
}

/* HERO */
.hero{
  min-height:100vh;
  display:flex;
  align-items:center;
  text-align:center;
  background: linear-gradient(135deg, #0c1f3f, #050B18);
  position:relative;
  overflow:hidden;
}
.hero h1{
  font-size:70px;
  font-weight:700;
  background:linear-gradient(90deg,#00E7F1,#4dfaff);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}
.hero p{
  max-width:600px;
  margin:auto;
  opacity:0.85;
}
.btn-cyan{
  background:#00E7F1;
  color:#050B18;
  border:none;
  font-weight:600;
  box-shadow:0 0 15px #00E7F1;
  transition:0.3s;
}
.btn-cyan:hover{
  box-shadow:0 0 30px #00E7F1;
}

/* SECTION */
.section{
  padding:120px 0;
  position:relative;
  overflow:hidden;
}

/* Smooth wave background sections */
.about-section{
  background:linear-gradient(120deg, #0a0a0a, #111111);
}
.about-section::before{
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:120px;
  background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 1440 120" xmlns="http://www.w3.org/2000/svg"><path fill="%2300E7F1" fill-opacity="0.05" d="M0,120L1440,0L1440,120L0,120Z"></path></svg>') repeat-x;
}
.team-section{
  background:#1A0000; /* dark red */
}
.team-section::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:120px;
  background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 1440 120" xmlns="http://www.w3.org/2000/svg"><path fill="%23FF0000" fill-opacity="0.05" d="M0,0L1440,120L1440,0L0,0Z"></path></svg>') repeat-x;
}

/* CARDS */
.card-tech{
  background:rgba(255,255,255,0.03);
  border-radius:16px;
  padding:30px;
  transition:0.4s;
  backdrop-filter:blur(8px);
  border:none;
}
.card-tech:hover{
  transform:translateY(-10px);
  box-shadow:0 0 25px rgba(0,231,241,0.3);
}
.icon-tech{
  font-size:40px;
  color:#00E7F1;
  margin-bottom:15px;
}

/* WORKFLOW SECTION */
.workflow-section {
  background:#050B18;
}

.workflow-card {
  position: relative;
  padding-top: 50px; /* space for the number circle */
  transition: transform 0.4s, box-shadow 0.4s;
}

.workflow-card i {
  font-size:50px;
  color:#00E7F1;
  margin-bottom:15px;
}

/* Number circle using data-step */
.workflow-card::before {
  content: attr(data-step);
  position: absolute;
  top: -20px;
  left: 50%;
  transform: translateX(-50%);
  background:#00E7F1;
  color:#050B18;
  width:40px;
  height:40px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:18px;
  box-shadow:0 0 10px rgba(0,231,241,0.5);
}

.workflow-card:hover {
  transform: translateY(-10px);
  box-shadow:0 0 25px rgba(0,231,241,0.3);
}

/* STATS */
.stat h2{
  color:#00E7F1;
  font-size:50px;
  font-weight:700;
}

/* TEAM */
.team{
  background:rgba(0,0,0,0.2);
  border-radius:20px;
  padding:20px;
  margin-bottom:30px;
  transition:0.3s;
}
.team:hover{
  transform:translateY(-5px);
  box-shadow:0 0 20px #FF4D4D;
}
.team img{
  width:120px;
  border-radius:50%;
  border:2px solid #FF4D4D;
  margin-bottom:15px;
}
.footer{
  background:#0b0f1a;
  color: #fff;
  border-top:1px solid rgba(255,255,255,0.08);
}

.footer h4{
  letter-spacing:1px;
}

.social-icon{
  color:#00E7F1;
  font-size:20px;
  margin:0 10px;
  transition:0.3s;
}

.social-icon:hover{
  color:#fff;
  transform:translateY(-3px);
}