/* compiled by scssphp 1.6.0 on Fri, 27 Mar 2026 13:08:13 +0000 (0.3385s) */

:root {
  --button__transition: 0.2s ease-in-out;
  --button__border-width: 0.125rem;
  --button__border-style: solid;
  --button__border-color: var(--color-border);
  --button__border-radius: 2rem;
  --button__line-height: 1.5;
  --button__padding-block: 0.875rem;
  --button__padding-inline: 2rem;
  --button__font-family: var(--font-family--body);
  --button__font-size: 1rem;
  --button__font-weight: var(--font-weight--regular);
  --button__box-shadow: none;
  --button__gap: 0.75rem;
  --button__background--primary: var(--color-1);
  --button__border-color--primary: var(--button__border-color);
  --button__color--primary: var(--color-white);
  --button__background--primary--hover: var(--color-white);
  --button__border-color--primary--hover: var(--color-white);
  --button__color--primary--hover: var(--color-grey-1);
  --button__background--secondary: var(--color-white);
  --button__border-color--secondary: var(--color-white);
  --button__color--secondary: var(--color-grey-1);
  --button__background--secondary--hover: transparent;
  --button__border-color--secondary--hover: var(--button__border-color);
  --button__color--secondary--hover: var(--color-white);
}
.button {
  transition: 0.2s ease-in-out;
  overflow: clip;
  position: relative;
  width: 100%;
}
@media (min-width: 36rem) {
  .button {
    width: auto;
  }
}
.button__group {
  --button-group__vertical-alignment: flex-start;
  --button-group__horizontal-alignment: flex-start;
  flex-wrap: wrap;
  width: 100%;
}
@media (min-width: 36rem) {
  .button__group {
    width: auto;
  }
}
.button__title {
  white-space: nowrap;
  z-index: 3;
  transition: 0.2s ease-in-out;
}
.button svg {
  position: relative;
  z-index: 3;
  transition: 0.2s ease-in-out;
}
.button.--primary {
  position: relative;
  border: 0 none;
  background: linear-gradient(294.72deg, #27482e 15.76%, #5c9387 84.24%);
  color: var(--color-white);
}
.button.--primary::before, .button.--primary::after {
  content: '';
  position: absolute;
  border-radius: 2rem;
  transition: 0.2s ease-in-out;
}
.button.--primary::before {
  left: 0.125rem;
  top: 0.125rem;
  z-index: -1;
  width: calc(100% - 0.25rem);
  height: calc(100% - 0.25rem);
  background: linear-gradient(294.72deg, #0b1e0f 15.76%, #457067 84.24%);
}
.button.--primary::after {
  left: 0;
  bottom: 0;
  z-index: 0;
  width: 100%;
  height: 0;
  background: var(--color-white);
}
.button.--primary:hover, .button.--primary:focus-visible {
  background: none;
  color: var(--color-grey-1);
}
.button.--primary:hover::after, .button.--primary:focus-visible::after {
  height: 100%;
}
.navigation .button.--primary::after {
  background: var(--color-grey-1);
  left: 0.125rem;
  bottom: 0.125rem;
  width: calc(100% - 0.25rem);
  height: 0;
  opacity: 0;
}
.navigation .button.--primary:hover, .navigation .button.--primary:focus-visible {
  background: var(--color-border);
  color: var(--color-white);
}
.navigation .button.--primary:hover::after, .navigation .button.--primary:focus-visible::after {
  opacity: 1;
  height: calc(100% - 0.25rem);
}
.button.--secondary {
  border: 0 none;
}
.button.--secondary::after {
  content: '';
  position: absolute;
  border-radius: 2rem;
  transition: 0.2s ease-in-out;
  left: 0;
  bottom: 0;
  z-index: 0;
  width: 100%;
  height: 0;
  background: var(--color-grey-1);
  border: solid 0 var(--color-border);
}
.button.--secondary:hover::after, .button.--secondary:focus-visible::after {
  height: 100%;
  border-width: 0.125rem;
}
.button.--bordered {
  transition: var(--button__transition);
  border: var(--button__border-style) var(--button__border-width) var(--button__border-color);
  padding: var(--button__padding-block) var(--button__padding-inline);
  border-radius: var(--button__border-radius);
  background-color: transparent;
  color: var(--color-white);
  font-family: var(--button__font-family);
  font-size: var(--button__font-size);
  line-height: var(--button__line-height);
  font-weight: var(--button__font-weight);
}
.button.--bordered svg, .button.--bordered svg path {
  fill: var(--color-white);
}
.button.--bordered::after {
  content: '';
  position: absolute;
  border-radius: 2rem;
  transition: 0.2s ease-in-out;
  left: 0;
  bottom: 0;
  z-index: 0;
  width: 100%;
  height: 0;
  background: var(--color-white);
}
.button.--bordered:hover, .button.--bordered:focus-visible {
  background: none;
  border-color: var(--color-white);
  color: var(--color-grey-1);
}
.button.--bordered:hover svg, .button.--bordered:hover svg path, .button.--bordered:focus-visible svg, .button.--bordered:focus-visible svg path {
  fill: var(--color-grey-1);
}
.button.--bordered:hover::after, .button.--bordered:focus-visible::after {
  height: 100%;
}
.button.--icon-only, .button.--play {
  min-width: 3.75rem;
  width: 3.75rem;
  height: 3.75rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.25rem;
  font-family: var(--button__font-family);
  font-size: var(--button__font-size);
  line-height: var(--button__line-height);
  font-weight: var(--button__font-weight);
}
.button.--icon-only svg, .button.--play svg {
  inline-size: 1.25rem;
  block-size: 1.25rem;
}
.button.--icon-only::before, .button.--icon-only::after, .button.--play::before, .button.--play::after {
  border-radius: 50%;
}
.button.--read-more {
  border: 0 none;
  padding: 0;
  border-radius: 0;
  background-color: transparent;
  color: var(--color-white);
  font-family: var(--button__font-family);
  font-size: var(--button__font-size);
  line-height: var(--button__line-height);
  font-weight: var(--button__font-weight);
  display: flex;
  align-items: center;
  gap: 1rem;
  min-width: 12.5rem;
  justify-content: flex-start;
}
.button.--read-more::before, .button.--read-more::after {
  display: none;
}
.button.--read-more .button__icon {
  width: 2.8125rem;
  height: 2.8125rem;
  border-radius: 50%;
  background: linear-gradient(294.72deg, #27482e 15.76%, #5c9387 84.24%);
  order: -1;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: 0.2s ease-in-out;
  overflow: hidden;
}
.button.--read-more .button__icon::before {
  content: '';
  position: absolute;
  left: 0.125rem;
  top: 0.125rem;
  z-index: 0;
  width: calc(100% - 0.25rem);
  height: calc(100% - 0.25rem);
  background: linear-gradient(294.72deg, #0b1e0f 15.76%, #457067 84.24%);
  border-radius: 50%;
  transition: 0.2s ease-in-out;
}
.button.--read-more .button__icon::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  transition: 0.2s ease-in-out;
  left: 0;
  bottom: 0;
  z-index: 1;
  width: 100%;
  height: 0;
  background: var(--color-white);
}
.button.--read-more .button__icon svg {
  inline-size: 1rem;
  block-size: 1rem;
  margin-block-start: 0.25rem;
  position: relative;
  z-index: 3;
}
.button.--read-more .button__title {
  position: relative;
  transition: 0.2s ease-in-out;
}
.button.--read-more .button__title.--close {
  position: absolute;
  left: 3.8125rem;
  top: 50%;
  z-index: 1;
  transform: translateY(-50%);
  opacity: 0;
  visibility: hidden;
}
.button.--read-more:hover, .button.--read-more:focus-visible {
  background-color: transparent;
  border-color: transparent;
  color: var(--color-white);
}
.button.--read-more:hover .button__icon, .button.--read-more:focus-visible .button__icon {
  background: none;
  color: var(--color-grey-1);
}
.button.--read-more:hover .button__icon::after, .button.--read-more:focus-visible .button__icon::after {
  height: 100%;
}
.button.--read-more[aria-expanded='true'] .button__title.--open {
  opacity: 0;
  visibility: hidden;
}
.button.--read-more[aria-expanded='true'] .button__title.--close {
  opacity: 1;
  visibility: visible;
}
/*# sourceMappingURL=data:application/json,%7B%22version%22%3A3%2C%22sources%22%3A%5B%22home%2Fvaibs%2Fdomains%2Fvaibs.com%2Fpublic_html%2Fwp-content%2Fthemes%2Fvaibs%2Fsass%2Fcomponents%2Fbuttons.scss%22%5D%2C%22names%22%3A%5B%5D%2C%22mappings%22%3A%22AAwDA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAiCA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAMC%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAIA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAMC%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAKD%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAMA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAMA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAMC%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAQA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAASA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAASA%3BAAAA%3BAAAA%3BAAAA%3BAAKC%3BAAAA%3BAAAA%3BAAMA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAASA%3BAAAA%3BAAAA%3BAAAA%3BAAKC%3BAAAA%3BAAAA%3BAAAA%3BAAQH%3BAAAA%3BAAAA%3BAAGC%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAgBC%3BAAAA%3BAAAA%3BAAAA%3BAAOF%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAYC%3BAAAA%3BAAAA%3BAAKA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAaA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAMC%3BAAAA%3BAAAA%3BAAKA%3BAAAA%3BAAAA%3BAAMF%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAeC%3BAAAA%3BAAAA%3BAAAA%3BAAKA%3BAAAA%3BAAAA%3BAAMD%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAgBC%3BAAAA%3BAAAA%3BAAMC%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAaC%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAaA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAaA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAASD%3BAAAA%3BAAAA%3BAAAA%3BAAIC%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAYF%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAMC%3BAAAA%3BAAAA%3BAAAA%3BAAIC%3BAAAA%3BAAAA%3BAAQA%3BAAAA%3BAAAA%3BAAAA%3BAAKA%3BAAAA%3BAAAA%3BAAAA%22%7D */