/**
 * https://davidhellmann.com/blog/development/sass-breakpoint-mixin
 */
.dark,
.darker,
.dark-blue,
.bg-gradient {
  --form-input-background: var(--color-on-background-alt-light);
  --form-input-label-color: var(--color-on-background-alt-flexible);
  background: var(--color-background-alt);
}
.dark *,
.darker *,
.dark-blue *,
.bg-gradient * {
  color: var(--color-on-background-alt);
}
.dark *.text-muted,
.darker *.text-muted,
.dark-blue *.text-muted,
.bg-gradient *.text-muted {
  color: var(--color-on-background-flexible);
}
.dark *.text-muted > *,
.darker *.text-muted > *,
.dark-blue *.text-muted > *,
.bg-gradient *.text-muted > * {
  color: var(--color-on-background-flexible);
}
.dark *.text-primary,
.darker *.text-primary,
.dark-blue *.text-primary,
.bg-gradient *.text-primary {
  color: var(--color-primary);
}
.dark svg polygon,
.darker svg polygon,
.dark-blue svg polygon,
.bg-gradient svg polygon {
  color: var(--color-on-background);
}
.dark a:hover,
.dark a:hover b,
.darker a:hover,
.darker a:hover b,
.dark-blue a:hover,
.dark-blue a:hover b,
.bg-gradient a:hover,
.bg-gradient a:hover b {
  color: var(--color-primary);
}
.dark .tagline,
.darker .tagline,
.dark-blue .tagline,
.bg-gradient .tagline {
  color: var(--color-background);
}
@media (min-width: 768px) {
  .dark .tagline,
  .darker .tagline,
  .dark-blue .tagline,
  .bg-gradient .tagline {
    color: var(--color-primary);
  }
}
.dark .tagline a,
.darker .tagline a,
.dark-blue .tagline a,
.bg-gradient .tagline a {
  color: inherit;
}
.dark .btn.btn-secondary,
.darker .btn.btn-secondary,
.dark-blue .btn.btn-secondary,
.bg-gradient .btn.btn-secondary {
  background: var(--color-on-background-alt);
  color: var(--color-background-alt);
}
.dark .btn.btn-secondary:hover,
.darker .btn.btn-secondary:hover,
.dark-blue .btn.btn-secondary:hover,
.bg-gradient .btn.btn-secondary:hover {
  color: var(--color-primary);
}
.dark .btn.btn-transparent,
.darker .btn.btn-transparent,
.dark-blue .btn.btn-transparent,
.bg-gradient .btn.btn-transparent {
  background: transparent;
}
.dark .btn.btn-transparent:hover,
.darker .btn.btn-transparent:hover,
.dark-blue .btn.btn-transparent:hover,
.bg-gradient .btn.btn-transparent:hover {
  background: #2b3e47;
}
.dark .btn.btn-transparent.btn-secondary,
.darker .btn.btn-transparent.btn-secondary,
.dark-blue .btn.btn-transparent.btn-secondary,
.bg-gradient .btn.btn-transparent.btn-secondary {
  color: var(--color-on-background-alt);
}
.dark .btn.btn-transparent.btn-secondary:hover,
.darker .btn.btn-transparent.btn-secondary:hover,
.dark-blue .btn.btn-transparent.btn-secondary:hover,
.bg-gradient .btn.btn-transparent.btn-secondary:hover {
  color: inherit;
}
.dark .btn.btn-icon img,
.darker .btn.btn-icon img,
.dark-blue .btn.btn-icon img,
.bg-gradient .btn.btn-icon img {
  filter: var(--filter-white);
}
.dark .btn.btn-outline.btn-secondary,
.darker .btn.btn-outline.btn-secondary,
.dark-blue .btn.btn-outline.btn-secondary,
.bg-gradient .btn.btn-outline.btn-secondary {
  color: var(--color-on-background-alt);
  background: transparent;
  border-color: var(--color-on-background-alt);
}
.dark .btn.btn-outline.btn-secondary:hover,
.darker .btn.btn-outline.btn-secondary:hover,
.dark-blue .btn.btn-outline.btn-secondary:hover,
.bg-gradient .btn.btn-outline.btn-secondary:hover {
  color: var(--color-primary);
  background: transparent;
  border-color: var(--color-primary);
}
.dark .btn.btn-outline.btn-secondary.btn-hover-opaque:hover,
.darker .btn.btn-outline.btn-secondary.btn-hover-opaque:hover,
.dark-blue .btn.btn-outline.btn-secondary.btn-hover-opaque:hover,
.bg-gradient .btn.btn-outline.btn-secondary.btn-hover-opaque:hover {
  background: var(--color-on-primary);
  color: var(--color-primary);
  border-color: var(--color-on-primary);
}
.dark .btn.swiper-button-next.btn-primary, .dark .btn.swiper-button-prev.btn-primary,
.darker .btn.swiper-button-next.btn-primary,
.darker .btn.swiper-button-prev.btn-primary,
.dark-blue .btn.swiper-button-next.btn-primary,
.dark-blue .btn.swiper-button-prev.btn-primary,
.bg-gradient .btn.swiper-button-next.btn-primary,
.bg-gradient .btn.swiper-button-prev.btn-primary {
  --swiper-navigation-color: var(--color-primary);
}
.dark .btn.swiper-button-next.btn-primary.btn-outline, .dark .btn.swiper-button-prev.btn-primary.btn-outline,
.darker .btn.swiper-button-next.btn-primary.btn-outline,
.darker .btn.swiper-button-prev.btn-primary.btn-outline,
.dark-blue .btn.swiper-button-next.btn-primary.btn-outline,
.dark-blue .btn.swiper-button-prev.btn-primary.btn-outline,
.bg-gradient .btn.swiper-button-next.btn-primary.btn-outline,
.bg-gradient .btn.swiper-button-prev.btn-primary.btn-outline {
  border-color: var(--swiper-navigation-color, var(--swiper-theme-color));
}
.dark .btn.swiper-button-next.btn-primary.btn-outline:hover, .dark .btn.swiper-button-prev.btn-primary.btn-outline:hover,
.darker .btn.swiper-button-next.btn-primary.btn-outline:hover,
.darker .btn.swiper-button-prev.btn-primary.btn-outline:hover,
.dark-blue .btn.swiper-button-next.btn-primary.btn-outline:hover,
.dark-blue .btn.swiper-button-prev.btn-primary.btn-outline:hover,
.bg-gradient .btn.swiper-button-next.btn-primary.btn-outline:hover,
.bg-gradient .btn.swiper-button-prev.btn-primary.btn-outline:hover {
  background: var(--swiper-navigation-color);
  color: inherit;
  border-color: var(--swiper-navigation-color);
}
.dark .btn.swiper-button-next.btn-secondary, .dark .btn.swiper-button-prev.btn-secondary,
.darker .btn.swiper-button-next.btn-secondary,
.darker .btn.swiper-button-prev.btn-secondary,
.dark-blue .btn.swiper-button-next.btn-secondary,
.dark-blue .btn.swiper-button-prev.btn-secondary,
.bg-gradient .btn.swiper-button-next.btn-secondary,
.bg-gradient .btn.swiper-button-prev.btn-secondary {
  --swiper-navigation-color: var(--color-on-background-alt);
}
.dark .btn.swiper-button-next.btn-secondary.btn-outline, .dark .btn.swiper-button-prev.btn-secondary.btn-outline,
.darker .btn.swiper-button-next.btn-secondary.btn-outline,
.darker .btn.swiper-button-prev.btn-secondary.btn-outline,
.dark-blue .btn.swiper-button-next.btn-secondary.btn-outline,
.dark-blue .btn.swiper-button-prev.btn-secondary.btn-outline,
.bg-gradient .btn.swiper-button-next.btn-secondary.btn-outline,
.bg-gradient .btn.swiper-button-prev.btn-secondary.btn-outline {
  border-color: var(--swiper-navigation-color, var(--swiper-theme-color));
}
.dark .btn.swiper-button-next.btn-secondary.btn-outline:hover, .dark .btn.swiper-button-prev.btn-secondary.btn-outline:hover,
.darker .btn.swiper-button-next.btn-secondary.btn-outline:hover,
.darker .btn.swiper-button-prev.btn-secondary.btn-outline:hover,
.dark-blue .btn.swiper-button-next.btn-secondary.btn-outline:hover,
.dark-blue .btn.swiper-button-prev.btn-secondary.btn-outline:hover,
.bg-gradient .btn.swiper-button-next.btn-secondary.btn-outline:hover,
.bg-gradient .btn.swiper-button-prev.btn-secondary.btn-outline:hover {
  color: var(--color-primary);
  border-color: var(--color-primary);
}
.dark .btn.swiper-button[class*=active], .dark .btn.swiper-pagination-button[class*=active],
.darker .btn.swiper-button[class*=active],
.darker .btn.swiper-pagination-button[class*=active],
.dark-blue .btn.swiper-button[class*=active],
.dark-blue .btn.swiper-pagination-button[class*=active],
.bg-gradient .btn.swiper-button[class*=active],
.bg-gradient .btn.swiper-pagination-button[class*=active] {
  color: var(--color-primary);
  border-color: var(--color-primary);
}

.darker {
  background: var(--color-background-alt-2);
}

.dark-blue {
  background: var(--color-background-alt-5);
}

.bg-gradient {
  background: var(--gradient-background);
}