.Header__button {
  display: inline-block;
  background-color: #7e7fff;
  color: #ffffff;
  padding: 10px 16px;
  border-radius: 6px;
  text-decoration: none;
  font-weight: bold;
  margin-right: 10px;  /* this adds spacing between buttons */
  transition: background-color 0.3s ease;
}
.Header__button:hover {
  background-color: #4b4cff;
}
.custom-button {
  display: inline-block;
  background-color: #7e7fff;
  color: #ffffff;
  padding: 12px 20px;
  margin: 8px;
  border-radius: 6px;
  text-decoration: none;
  font-weight: bold;
  transition: background-color 0.3s ease;
}
.custom-button:hover {
  background-color: #4b4cff;
}
.custom-three-boxes {
  display: flex;
  justify-content: space-around;
  gap: 20px;
  margin: 20px auto;
  flex-wrap: wrap;
}
.custom-box {
  flex: 1 1 30%;
  background-color: #f5f5f5;
  border-radius: 10px;
  padding: 20px;
  text-align: center;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
.custom-box h3 {
  margin-top: 0;
  font-size: 1.4em;
  color: #292ab7;
}
.custom-box p {
  margin: 12px 0;
  color: #333333;
}
.custom-box-button {
  display: inline-block;
  background-color: #7e7fff;
  color: #ffffff;
  padding: 10px 18px;
  border-radius: 6px;
  text-decoration: none;
  font-weight: bold;
  transition: background-color 0.3s ease;
}
.custom-box-button:hover {
  background-color: #4b4cff;
}
.site-footer {
  width: 100%;
  max-width: 100%;
  display: block;

  box-sizing: border-box;

  text-align: center;
  padding: 20px;
  background-color: #7e7;
  color: #ffffff;
  font-size: 14px;
}

.site-footer .footer-link {
  color: #7e7fff;
  text-decoration: none;
  font-weight: bold;
}

.site-footer .footer-link:hover {
  text-decoration: underline;
}

:root {
  --color-HexGray20: #333 !important;
  --color-HexGray35: #555 !important;
  --color-HexGray40: #666 !important;
  --color-HexGray50: #777 !important;
  --color-HexGray55: #888 !important;
  --color-HexGray60: #999 !important;
  --color-HexGray80: #ccc !important;
  --color-HexGray90: #ddd !important;
  --color-brand: #fff !important;
  --color-brand1: #000 !important;
  --color-greyShade1: #e0e0e0 !important;
  --color-greyShade2: #e6e5e5 !important;
  --color-greyShade3: #e6e6e6 !important;
  --color-greyShade5: #e8ebed !important;
  --color-greyShade6: #e9e9e9 !important;
  --color-greyShade7: #ececec !important;
  --color-greyShade8: #efefef !important;
  --color-greyShade9: #f1f1f1 !important;
  --color-greyShade10: #f2f2f2 !important;
  --color-greyShade11: #f3f3f3 !important;
  --color-greyShade13: #f5f5f5 !important;
  --color-greyShade14: #f6f6f6 !important;
  --color-greyShade15: #f9f9f9 !important;
  --color-yellowTint2: #ed8b00 !important;
  --color-yellowTint5: #f0ad4e !important;
  --color-yellowTint6: #ffb60f !important;
  --color-greenTint4: #339433 !important;
  --color-greenTint6: #3bc46a !important;
  --color-paleGreen: #00b2a9 !important;
  --color-royalBlue1: #4b4cff !important;
  --color-royalBlue2: #7e7fff !important;
  --color-royalBlue4: #aeaeff !important;
  --color-royalBlue5: #32364b !important;
  --color-blueTint1: #043e61 !important;
  --color-blueTint7: #aeaeff !important;
  --color-blueTint10: #aeaeff !important;
  --color-indigo: #963cbd !important;
  --color-danger: #f35969 !important;
  --color-danger4: #d9534f !important;
  --color-color1: gray !important;
  --color-color4: #717171 !important;
  --color-color5: #757575 !important;
  --color-color8: #3e413e !important;
  --color-color9: #bdbdbd !important;
  --color-color12: #c7c7c7 !important;
  --color-color13: #d2d2d2 !important;
  --color-color14: #dadada !important;
  --color-color16: #afafaf !important;
  --color-color18: #3a3c4c !important;
  --color-color19: #8f919d !important;
  --color-color20: #fff5f4 !important;
  --color-red1: #e24b4b !important;
  --color-red2: #f04a4a !important;
  --color-lightGrey: #d4dadf !important;
  --color-hoverblue1: #7e7fff !important;
  --color-lightGrey22: #f3f5f7 !important;
  --color-darkred1: red !important;
  --color-lightblue12: #aeaeff !important;
  --color-topicP: #f95656 !important;
  --color-fb: #1877f2 !important;
  --color-twit: #1da1f2 !important;
  --color-linkedin: #2867b2 !important;
  --color-best: #7e7fff !important;
  --color-discussion: #7e7fff !important;
  --color-question: #7e7fff !important;
  --color-problem: #43437e !important;
  --color-idea: #7e7fff !important;
  --color-announcement: #7e7fff !important;
  --color-like: #339433 !important;
  --color-dislike: #d9534f !important;
  --color-statsPrimary: #7e7fff !important;
  --color-statsSecondary: #7e7fff !important;
  --color-heather: #b8c4d1 !important;
  --color-blueBayoux: #475f7b !important;
  --color-raven: #727e8c !important;
  --color-pumice: #c5cdc7 !important;
}


.Header__homeNavbarFixed .Header__searchSubCont {
background-color: #EBEBFF !important; }
}

.Icon__icon {
  color: #000000 !important;
  fill: #000000 !important;
}

.Icon__icon:hover {
  color: #7e7fff !important;
  fill: #7e7fff !important;
}

.SearchBox__searchicon:hover {
    box-shadow: 0 .4375rem 1.875rem rgba(0,0,0,0.20);
    color: #7e7fff
}

.SearchBox__searchicon{
    box-shadow: 0 .4375rem 1.875rem rgba(0,0,0,0.20);
    color: #000
}

.Footer__footer {
  padding: .0rem 0;}

.footer-layered {
  background: #0a0a0a;
  font-family: 'Segoe UI', sans-serif;
  font-size: 13px;
  color: #ccc;
  text-align: center;
  padding: 10px 20px 25px 20px;
  border-top: 2px solid #7e7fff;
}

.footer-layer {
  margin: 8px 0;
}

.footer-layer a {
  color: #7e7fff;
  text-decoration: none;
}

.footer-layer a:hover {
  text-decoration: underline;
  color: #fffe7e;
}

.footer-platforms span {
  margin: 0 10px;
  display: inline-block;
  font-weight: 500;
}

.footer-socials a {
  text-decoration: none;
  outline: none;
  border: none;
  display: inline-block;
  line-height: 0; /* Prevents inline spacing artifacts */
}

.footer-socials a img {
  display: block; /* Avoids inline gaps around icons */
  width: 24px;
  height: 24px;
  margin: 4px;
  filter: brightness(0) invert(1);
  transition: transform 0.2s ease, opacity 0.2s ease;
  opacity: 0.8;
  border: none;       /* Ensures no border artifact */
  box-shadow: none;   /* Prevents faint glow/dash on focus */
}

.footer-socials a img:hover {
  transform: scale(1.1);
  opacity: 1;
}

.footer-meta {
  font-size: 12px;
  color: #888;
}

@media screen and (max-width: 600px) {
  .footer-platforms span {
    display: block;
    margin: 5px 0;
  }

  .footer-socials {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
}