body{
  font-family:'Poppins', sans-serif;
  /* padding-top:80px; */
  color:#1f2937;
}

/* HERO */
.hero{
  background: url(printerr.png);
  color:#fff;
  padding:100px 0;
  background-size: cover;
  background-position: center;
  background-color: #08089a;
}
.hero h1{
  font-size:44px;
  font-weight:600;
}
.hero h2{
  font-size:22px;
  font-weight:400;
  margin-bottom:20px;
}
.hero p{
  font-size:16px;
  line-height:1.8;
}
.hero-list li{
  margin-bottom:8px;
}

/* FORM */
.form-box{
  background:#fff;
  color:#111827;
  padding:35px;
  border-radius:16px;
  box-shadow:0 25px 55px rgba(0,0,0,0.25);
}

/* SECTIONS */
.section{
  padding:90px 0;
}
.section-title{
  font-size:34px;
  font-weight:600;
}
.section-desc{
  max-width:750px;
  margin:0 auto;
  color:#4b5563;
}

/* CARDS */
.info-card{
  background:#fff;
  padding:30px;
  border-radius:16px;
  text-align:center;
  box-shadow:0 12px 30px rgba(0,0,0,0.05);
  height:100%;
}
.info-card i{
  font-size:34px;
  color:#1d4ed8;
  margin-bottom:15px;
}

/* LIST */
.device-list li{
  list-style:none;
  margin-bottom:12px;
}
.device-list i{
  color:#1d4ed8;
  margin-right:8px;
}

/* PROCESS */
.process-box{
  background:#eef2ff;
  padding:30px;
  border-radius:16px;
  text-align:center;
}
.process-box span{
  font-size:26px;
  font-weight:700;
  color:#1d4ed8;
}

/* FOOTER */
.footer{
  background:#0f172a;
  color:#cbd5e1;
  padding:40px 0;
  font-size:14px;
}

/* ANIMATIONS */
.animate-fade{
  animation:fadeIn 1s ease-in-out;
}
.animate-up{
  animation:slideUp 0.8s ease-in-out;
}
.animate-scale{
  animation:scaleIn 0.8s ease-in-out;
}

@keyframes fadeIn{
  from{opacity:0; transform:translateY(20px);}
  to{opacity:1; transform:translateY(0);}
}
@keyframes slideUp{
  from{opacity:0; transform:translateY(30px);}
  to{opacity:1; transform:translateY(0);}
}
@keyframes scaleIn{
  from{opacity:0; transform:scale(0.9);}
  to{opacity:1; transform:scale(1);}
}
/* SECTION COMMON */
.section-title{
  font-size:34px;
  font-weight:600;
}
.section-subtitle{
  max-width:780px;
  margin:15px auto 0;
  color:#5b6472;
  font-size:16px;
}

/* DEVICES SECTION */
.devices-section{
  padding:100px 0;
  background:#ffffff;
}
.device-box{
  background:#f9fbff;
  padding:35px;
  border-radius:18px;
  height:100%;
  box-shadow:0 15px 35px rgba(0,0,0,0.06);
  transition:all 0.3s ease;
}
.device-box:hover{
  transform:translateY(-6px);
}
.device-box i{
  font-size:36px;
  color:#2563eb;
  margin-bottom:15px;
}
.device-box h4{
  font-weight:600;
}
.device-box ul{
  padding-left:18px;
  margin-top:15px;
}
.device-box ul li{
  margin-bottom:6px;
}

/* PROCESS SECTION */
.process-section{
  padding:100px 0;
  background:#f2f5ff;
}
.process-card{
  background:#ffffff;
  padding:35px 25px;
  border-radius:18px;
  text-align:center;
  height:100%;
  box-shadow:0 15px 35px rgba(0,0,0,0.05);
}
.step-number{
  display:inline-block;
  background:#2563eb;
  color:#fff;
  font-weight:600;
  width:48px;
  height:48px;
  line-height:48px;
  border-radius:50%;
  margin-bottom:15px;
}
.process-card h5{
  font-weight:600;
  margin-bottom:10px;
}
/* BRAND MARQUEE */
.brand-marquee{
  overflow:hidden;
  position:relative;
  background:#ffffff;
  border-radius:16px;
  padding: 0px 30px;
}

.brand-track{
  display:flex;
  width:calc(250px * 12);
  animation:scrollBrands 30s linear infinite;
}

.brand-marquee:hover .brand-track{
  animation-play-state:paused;
}

.brand-item{
  width: 225px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 10px 30px;
}

.brand-item img{
  max-width:160px;
  max-height:80px;
  object-fit:contain;
  /* filter:grayscale(100%); */
  opacity:0.85;
  transition:all 0.3s ease;
}

.brand-item img:hover{
  filter:grayscale(0%);
  opacity:1;
  transform:scale(1.05);
}

/* ANIMATION */
@keyframes scrollBrands{
  0%{
    transform:translateX(0);
  }
  100%{
    transform:translateX(-50%);
  }
}

/* RESPONSIVE */
@media(max-width:768px){
  .brand-item{
    width:180px;
  }
  .brand-item img{
    max-width:120px;
  }
}

.navhead {
    padding: 16px 0px;
}

.navhead  .navbar-nav li a {
    color: #000;
    padding: 10px 8px !important;
}
.navhead  .navbar-nav li{}
.btnn {
    background: #106df6;
    color: #fff !important;
    font-weight: 600;
}
.btnn:hover{}
.navbar-brand  img{width:220px;}