body{
   /*  background: url('images/imported/nutritionbg.jpg') lightgray -43.018px -283.998px / 113.311% 118.462% no-repeat;
background-blend-mode: multiply;
max-width:440px;
*/
   background-blend-mode: multiply;
}
.page-overlay{
    background: linear-gradient(0deg, #004806 0.15%, #028a2d 9.43%);
    opacity:0.5; 
    width:100%;
    height:100%;
}
.nutrition-image {
  width: 251px;
  border-radius: 26px 26px 0 26px;
  margin-bottom: 20px;
}
.page-container {
    max-width: 1728px;
    margin: 0 auto;
    width: 100%;
   /*background: linear-gradient(0deg, #004806 0.15%, #028a2d 9.43%); */
   background: linear-gradient(
                    to bottom right, 
                    rgba(0, 72, 6, 0.8), 
                    rgba(2, 138, 45, 0.8)
                ), 
                url('images/imported/nutritionbg.jpg') no-repeat;
   color: #fff;
   background-size:cover;
    font-family: "Kinetika", sans-serif;
    position: relative;
    
}

.main-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
}

.header-logo {
    width: 149px;
    height: 109px;
}
.subscription-form {
  border: 1px solid #00e43a;
  border-radius: 10px;
  padding: 20px;
  width: 100%;
  opacity: 0.86;
  text-align: center;
  background-color: #fff;
}

.form-label {
  font-family: "Kinetika", sans-serif;
  font-size: 25px;
  color: #006414;
  display: block;
}

.background-gradient {
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, #004806 0.15%, #028a2d 99.43%);
  z-index: -1;
}

.phone-input {
  width: 625px;
  height: 65px;
  border-radius: 10px;
  border: 1px solid #9a9a9a;
  font-family: "Kinetika", sans-serif;
  font-size: 25px;
  color: #000;
  text-align: center;
  margin-top: 20px;
  background-color: #fefefe;
}

.subscribe-button {
  width: 266px;
  height: 74px;
  border-radius: 10px;
  border: none;
  background: linear-gradient(90deg, #004806 0%, #028a2d 100%);
  font-family: "Grained", sans-serif;
  font-size: 35px;
  color: #fff;
  margin-top: 20px;
  cursor: pointer;
}
.main-nav {
    display: flex;
    gap: 20px;
}

.nav-link {
    font-size: 25px;
    cursor: pointer;
    color: #fff;
    text-decoration: none;
}

.main-content {
    text-align: center;
    padding: 30px 20px;
}

.hero-title {
    font-family: "Grained", sans-serif;
    font-size: 90px;
    margin-bottom: 20px;
}

.hero-description {
    font-size: 25px;
    line-height: 1.5;
    margin-bottom: 40px;
}

.features-section {
    display: flex;
    justify-content: center;
    gap: 40px;
    margin-bottom: 40px;
}

.feature-item {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.feature-icon {
    width: 50px;
    height: 50px;
    margin-bottom: 10px;
}

.feature-label {
    font-size: 22px;
    font-weight: bold;
}

.pricing-title {
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 20px;
}

.pricing-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}

.pricing-plan {
    width: 320px;
    height: 72px;
    background: linear-gradient(90deg, #06640e 0%, #003004 100%);
    border-radius: 5px;
    border: 0.4px solid #fff;
    font-family: "Grained", sans-serif;
    font-size: 25px;
    color: #fff;
    cursor: pointer;
}

.main-footer {
    padding: 40px 20px;
    text-align: center;
}

.contact-info {
    font-size: 27px;
    margin-bottom: 20px;
}

.footer-credit {
    font-size: 20px;
}

@media (max-width: 991px) {
    .page-container {
        max-width: 991px;
    }

    .nav-link {
        font-size: 20px;
    }

    .hero-title {
        font-size: 90px;
    }

    .hero-description {
        font-size: 20px;
    }

    .feature-label {
        font-size: 18px;
    }

    .pricing-plan {
        width: 280px;
        height: 60px;
        font-size: 20px;
    }

    .contact-info {
        font-size: 22px;
    }

    .footer-credit {
        font-size: 18px;
    }
}

@media (max-width: 640px) {
    .page-container {
        max-width: 640px;
    }

    .main-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .main-nav {
        display: none;
    }

    .hero-title {
        font-size: 70px;
    }

    .hero-description {
        font-size: 18px;
    }

    .features-section {
        flex-direction: column;
    }

    .feature-label {
        font-size: 16px;
    }

    .pricing-plan {
        width: 100%;
        max-width: 300px;
        height: 50px;
        font-size: 18px;
    }

    .contact-info {
        font-size: 20px;
    }

    .footer-credit {
        font-size: 16px;
    }
}