/* index.css */
* { margin:0; padding:0; box-sizing:border-box; font-family:'Poppins', sans-serif; }
body { background:#f9f9f9; color:#111; scroll-behavior:smooth; }

header { display:flex; justify-content:space-between; align-items:center; padding:20px 50px; background:#111; color:white; position:sticky; top:0; z-index:1000; }

/*------------HEADER LOGO-----------------*/
header .logo { 
  font-size:42px; 
  font-weight:1000; 
  font-family: 'Times New Roman', Times, serif;
  background-color: gray;
  
               
}

header nav ul { list-style:none; display:flex; gap:20px; }
header nav ul li a { color:white; text-decoration:none; font-weight:500; padding:5px 10px; }
header nav ul li a.active, header nav ul li a:hover { background:#2196F3; border-radius:5px; }

.hamburger { display:none; font-size:28px; cursor:pointer; }


/*-------------------- HERO -------------------*/
.hero {
   background: linear-gradient(green, blue , purple, black, gold);
   height:50vh; 
   display:flex;
   align-items:center; 
   justify-content:center; 
   text-align:center; 
   color:white;
   }

.hero h1 { font-size:48px; 
           margin-bottom:20px; 
           color: darkorange;
         }

         /*------------------HERO P ------------------*/
.hero p { font-size:20px; 
    margin-bottom:30px; 
    color: lch(81.68% 106.09 138.25);

    }

.btn { background:#2196F3; color:white; padding:12px 28px; border-radius:6px; text-decoration:none; font-weight:600; transition:0.3s; }
.btn:hover { background:#4CAF50; }




.services-preview, .featured-apps, .testimonials, .cta { padding:80px 50px; text-align:center; }
.services-preview h2, .featured-apps h2, .testimonials h2, .cta h2 { font-size:36px; margin-bottom:40px; }

.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:40px; }
.card { background:white; padding:30px; border-radius:10px; box-shadow:0 6px 15px rgba(0,0,0,0.1); transition:0.3s; }
.card:hover { transform:translateY(-10px); }
.card img { width:60px; margin-bottom:20px; }

.apps-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:40px; }
.app-card { background:white; padding:20px; border-radius:10px; box-shadow:0 6px 15px rgba(0,0,0,0.1); transition:0.3s; }
.app-card img { width:100%; border-radius:8px; margin-bottom:15px; }
.app-card:hover { transform:translateY(-10px); }

.testimonial-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:30px; }
.testimonial-card { background:#2196F3; color:white; padding:30px; border-radius:10px; box-shadow:0 6px 15px rgba(0,0,0,0.1); }

.cta { background:#111; color:white; }
cta.btn { 
  background:#4CAF50;
  cta.btn:hover { background:#5207dd; }
}

footer { background:#111; color:white; padding:50px; }
.footer-content { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:30px; margin-bottom:30px; }
.footer-column h3 { margin-bottom:15px; }
.footer-bottom { text-align:center; font-size:14px; opacity:0.7; }

.social-icons a img { width:24px; margin-right:10px; }

@media(max-width:768px){
  header nav ul { display:none; flex-direction:column; gap:15px; background:#111; position:absolute; right:0; top:70px; padding:20px; border-radius:10px; }
  .hamburger { display:block; color:white; }
}