/* Animations */

.scroll-transition {
  opacity: 0; /* Initially transparent */
  transform: translateY(20px); /* Slightly moved down */
  transition: opacity 1s ease-out, transform 1s ease-out; /* Transition for opacity and transform */
  z-index: 0;
}

.scroll-transition.in-view {
  opacity: 1; /* Fully visible when in view */
  transform: translateY(0); /* Back to original position */
  z-index: 0;
}


/* Confirmation bar */

.confirmation-bar {
  background-color: #349c54; /* Green background */
  color: white; /* White text */
  text-align: center;
  padding: 20px;
  position: fixed; /* Fixed position at the top */
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100; /* Ensure it's on top of other content */
  box-shadow: 0 2px 5px rgba(0,0,0,0.2); /* Optional shadow for visual lift */
}


/* Buttons */

button {
  transition: background-color 0.3s, color 0.3s; /* Smooth transition for hover effects */
}

.default-button {
  color: white;
  border: none;
  cursor: pointer;
  font-weight: bold;
}

.default-button-background {
  background-color: #349c54;
}

.default-button-background:hover {
  background-color: #61c07d;
}

/* General */

.highlight {
  color: #278543;
  font-weight: 400;
}

.active {
  color: #93e5ac !important;
}

.active-button {
  background-color: white;
}

.small-header {
  font-size: 18px;
  color: #33834b;
  font-weight: bold;
}

.make-flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.make-grid {
  display: grid;
  justify-content: center;
}

footer {
  display: grid;
  grid-template-rows: auto auto;
  background-color: #252525;
  padding: 0 17.5%;
  box-sizing: border-box;
}

#footer-content {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  color: white;
  margin: 0 0 2em 0;
  min-width: 0; /* Prevents flex items from breaking padding */
}

#footer-logo-container {
  justify-content: start;
  gap: 2.5rem;
}

#footer-logo-container h2 {
  font-family: "Orienta", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.7rem;
  color: #2a9a4c;
}

.footer-list-container {
  padding-top: 3rem;
}

.footer-list-container ul {
  text-align: left;
  list-style: none;
  padding: 1rem 0;
}

.footer-list-container ul li {
  padding: 0.3rem 0;
}

.footer-list-container ul li a {
  text-decoration: none;
  font-size: 13px;
  color: #b9b9b9;
}

#footer-socials-container {
  padding: 3rem 3rem 3rem 0;
}

#copyright-container p {
  padding: 2rem 0;
  text-align: center;
  color: #b5b5b5;
  font-size: 13px;
}

#newsletter-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding-top: 1.5rem;
  gap: 1em;
}

#newsletter-container input {
  color: #979797;
  width: 11rem;
  height: 2.5rem;
  padding-left: 1.2rem;
  border-radius: 20px;
}

.slide-out {
  transform: translateX(-100%); /* Slide out to the left */
}

.slide-in {
  transform: translateX(0%); /* Slide in from the right */
}

.fade-out {
  opacity: 0 !important; /* Ensure this takes precedence during the fade-out */
}

.fade-in {
  opacity: 1;
}

@media (max-width: 1021px) {

  #footer-content {
    margin: 3em 0 0 0;
    flex-direction: column; /* Stacks elements */
    justify-content: center;
  }
}