*{
  margin: 0%;
  text-decoration: none;
  overscroll-behavior: hidden;
 font-variant: small;
  font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;}

.gen {
  display: flex;
  gap: 850px;
  color: rgb(0, 255, 157);
   margin-top: 10px;
  
  
}
.gen a{
  text-decoration: none;
  color: rgb(0, 255, 157);
}
.sec {
  margin-left: 50px;    
   font-weight: 600;    /* percentage not needed unless intentional */
}



.sec2 {
  display: flex;
  justify-content: right; 
  margin-top: 10px;
  gap: 20px;
  text-decoration: none;
  font-weight: 640;
 
}
.secu{
  display: flex;
  gap: 10px;
  margin-top: 50px;
}
.ss { 
  margin-left: 380px;
 
  }
  .ss img{
    margin-top: 10px;
    margin-right: 50px;
  }

.ds { 
margin-top: 10px;
margin-left: 50px;

}
 .ds h1{
  color: rgb(0, 255, 157);

 }

.gg{
  font-weight: 500;
  
}
      .v{ 
    margin-top: 100px;
    display: flex;
    justify-content: center;
  
    }

 #reviews{
 display: grid;
grid-template-columns: 1fr 1fr 1fr;
  margin-left: 170px;
  margin-top: 10px;
 }
.ac{
  display: flex;
  justify-content: center;
  margin-top: 100px;
}
.cc{
  display: flex;
  justify-content: center;
  margin-top: 10px;
 font-style: normal;
 font-weight: 100;
}

.hi{
  display: flex;
  justify-content: center;
  background-color: grey;
  margin-top: 20px;
  padding-top: 20px;
  padding-bottom: 20px;
}
.hi h6{
margin-top: 3px;
}
#subscribe{
  display: flex;
  justify-content: center;
  margin-top: 20px;
  gap: 10px;
 
}

input{
padding:5px ;
margin-top: 3px;


}

 button[type="submit"]{
background-color: rgb(0, 255, 157);
border-radius: 5px;
text-decoration: none;
border: none;
padding:8px ;
}

@media (max-width: 768px) {
  .sec2 a {
    display: block;
    margin: 10px 0;
    text-align: center; /* Optional: centers links on small screens */
  }

  .gen {
    padding: 10px;
    box-sizing: border-box; /* Ensures padding doesn’t break layout */
  }

  h1 {
    font-size: 1.8rem;
    text-align: center; /* Optional: centers title */
    line-height: 1.3; /* Improves readability */
  }

  ul.gg li {
    font-size: 1rem;
    margin-bottom: 8px; /* Adds space between list items */
    line-height: 1.4;   /* Improves readability */
  }
}


/* ------------------------- */
/* Small Screens / Phones (max-width: 480px) */
@media (max-width: 480px) {
  h1 {
    font-size: 1.5rem;
  }

  .sec2 {
    text-align: center;
  }

  ul.gg li {
    font-size: 0.95rem;
    padding: 5px 0;
  }

  input[type="email"], button {
    width: 100%;
    margin-top: 10px;
  }
}
@media (min-width: 1600px) {
  body {
    font-size: 20px;
    line-height: 1.8;
  }

  h1, h2 {
    font-size: 2.5rem;
  }

  .sec2 a {
    font-size: 1.5rem;
    margin-right: 30px;
  }

  .gen, .sec, .sec2, .secu, .ds, .gg {
    padding: 40px;
  }

  ul.gg li {
    font-size: 1.3rem;
  }

  input[type="email"], button {
    font-size: 1.2rem;
    padding: 12px;
  }
}