/* Text and Image Section */
.text-image-section {
    padding: 4rem 0; /* Add vertical spacing */
    background-color: var(--white); /* White background */
  }
  
  .text-image-section .container {
    max-width: 1200px; /* Limit container width for better readability */
    margin: 0 auto; /* Center the container */
  }
  
  .text-image-section .section-title {
    font-family: var(--font-oleoscript);
    font-size: 2.5rem;
    color: var(--pigment-green);
    margin-bottom: 1.5rem;
  }
  
  .text-image-section .section-description {
    font-family: var(--font-dmsans);
    font-size: 1.1rem;
    color: var(--black);
    line-height: 1.8;
    margin-bottom: 2rem;
  }
  
  .text-image-section .btn-primary {
    font-family: var(--font-dmsans);
    font-size: 1rem;
    padding: 0.75rem 1.5rem;
    background-color: var(--yellow-green);
    border: none;
    color: var(--white);
    border-radius: 50px;
    transition: background-color 0.3s ease-in-out;
  }
  
  .text-image-section .btn-primary:hover {
    background-color: var(--pigment-green);
  }
  
  .text-image-section img {
    max-width: 100%;
    height: auto;
  }
  
  /* Responsive Design */
  @media (max-width: 768px) {
    
  
    .text-image-section .section-title {
      font-size: 2rem; /* Adjust heading size for mobile */
    }
  
    .text-image-section .section-description {
      font-size: 1rem; /* Adjust paragraph size for mobile */
    }
  }


 





/* Section Spacing */
.flavor-list-section,
.mocktails-section,
.non-aerated-section {
  padding: 4rem 0; /* Add vertical spacing */
  background-color: var(--white); /* White background */
}

/* Centered Heading */
.section-title {
  font-family: var(--font-oleoscript);
  font-size: 3rem;
  color: var(--pigment-green);
  margin-bottom: 2rem; /* Space between heading and list */
  text-align: center;
}

/* Flavor Capsules Container */
.flavor-list-container {
  max-width: 800px; /* Limit width for better readability */
  margin: 0 auto; /* Center the container */
}

/* Flavor Capsules */
.flavor-capsules {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* Responsive grid */
  gap: 1rem; /* Spacing between capsules */
  justify-content: center; /* Center the grid */
}

.flavor-capsule {
  display: inline-block;
  padding: 0.75rem 1.5rem; /* Padding for text */
  font-family: var(--font-dmsans);
  font-size: 1rem;
  color: var(--white); /* Text color */
  background-color: var(--yellow-green); /* Default capsule color */
  border-radius: 50px; /* Pill shape */
  text-align: center;
  text-decoration: none; /* Remove underline */
  transition: background-color 0.3s ease-in-out; /* Smooth hover effect */
}

.flavor-capsule:hover {
  background-color: var(--pigment-green); /* Hover color */
}

/* Responsive Design */
@media (max-width: 768px) {
  .section-title {
    font-size: 2rem; /* Adjust heading size for mobile */
  }

  .flavor-capsules {
    grid-template-columns: 1fr; /* Single column on mobile */
  }

  .flavor-capsule {
    font-size: 0.9rem; /* Adjust text size for mobile */
  }
}







/* Cleaning Solutions Section */
.cleaning-solutions-section {
  padding: 6rem 0; /* Increased padding for more vertical space */
  background-color: var(--white); /* White background */
}

/* Subheading */
.subheading {
  font-family: var(--font-oleoscript);
  font-size: 1.75rem;
  color: var(--pigment-green);
  margin-bottom: 1rem; /* Space between subheading and description */
}

/* Section Description */
.section-description {
  font-family: var(--font-dmsans);
  font-size: 1rem;
  color: var(--black);
  line-height: 1.8;
  margin-bottom: 1.5rem; /* Space below the description */
}

/* Responsive Design */
@media (max-width: 768px) {
  .cleaning-solutions-section {
    padding: 4rem 0; /* Adjust spacing for smaller screens */
  }

  .cleaning-solutions-section .subheading {
    font-size: 1.5rem; /* Adjust subheading size for mobile */
  }

  .cleaning-solutions-section .section-description {
    font-size: 0.9rem; /* Adjust paragraph size for mobile */
  }
}



/* Other Solutions Section */
.other-solutions-section {
  padding: 6rem 0; /* Vertical spacing */
  background-color: var(--white); /* White background */
}

/* Subheading */
.subheading {
  font-family: var(--font-oleoscript);
  font-size: 1.75rem;
  color: var(--pigment-green);
  margin-bottom: 1rem; /* Space between subheading and description */
}

/* Section Description */
.section-description {
  font-family: var(--font-dmsans);
  font-size: 1rem;
  color: var(--black);
  line-height: 1.8;
  margin-bottom: 1.5rem; /* Space below the description */
}

/* Reduce Image Size in Other Solutions Section */
.other-solutions-section img {
  max-width: 80%; /* Adjust width to 80% of its container */
  height: auto; /* Maintain aspect ratio */
  margin: 0 auto; /* Center the image horizontally */
}

.custom-gap {
  margin-top: 6rem; /* Adjust this value as needed */
}



/* Responsive Design */
@media (max-width: 768px) {
  .other-solutions-section .row.align-items-center > [class^="col-"] {
    order: 0 !important;
  }
  
  /* Optional: Add spacing between image and text */
  .other-solutions-section .text-center {
    margin-bottom: 2rem;
  }
  
  /* Ensure text alignment matches */
  .other-solutions-section .section-description {
    text-align: left !important;
  }
  .other-solutions-section .row {
    flex-direction: column; /* Stack content vertically on smaller screens */
  }

  .other-solutions-section .subheading {
    font-size: 1.5rem; /* Adjust subheading size for mobile */
  }

  .other-solutions-section .section-description {
    font-size: 0.9rem; /* Adjust paragraph size for mobile */
  }
}