/* Login button */
.WaGadgetLoginButton .loginLink, .WaGadgetLoginForm .loginLink {
    background: #f86f1d !important;
    color: white !important;
}
/* Login button on hover */
.WaGadgetLoginButton .loginLink:hover, .WaGadgetLoginForm .loginLink:hover {
    background: #ec008c !important;
}
/* Logout button */
.WaGadgetLoginButton .authenticated .loginLink, .WaGadgetLoginForm .authenticated .loginLink {
    background: 0 !important;
    color: #534741 !important;
}
/* Logout button on hover */
.WaGadgetLoginButton .authenticated .loginLink:hover, .WaGadgetLoginButton .authenticated .loginLink.hover, .WaGadgetLoginForm .authenticated .loginLink:hover, .WaGadgetLoginForm .authenticated .loginLink.hover {
    background: #005952 !important;
    color: white !important;
}

.inline-columns {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* centers the whole row */
  gap: 20px; /* spacing between columns */
  text-align: center; /* centers text inside each column */
}

.inline-columns > div {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  width: 90%; /* three per row */
  padding: 25px;
  box-sizing: border-box;
  transition: transform 0.3s ease;
}

.inline-columns > div:hover {
  transform: translateY(-5px);
}

.membership-column{
  background: #dfdfdf
}


 .why-card {
    background-color: #f8a31d;
    border-radius: 16px;
    overflow: hidden;
    flex: 0 1 calc(33.33% - 30px);
    text-align: left;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    transition: transform 0.35s ease, box-shadow 0.35s ease;
  }

  .why-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 12px 25px rgba(0,0,0,0.18);
  }

  .why-card img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    transition: transform 0.4s ease;
  }

  .why-card:hover img {
    transform: scale(1.05);
  }