/*
 * COLORS
 *
 --wp--preset--color--bg
 --wp--preset--color--header
 --wp--preset--color--card
 --wp--preset--color--text
 --wp--preset--color--accent
 --wp--preset--color--dark-bg
 --wp--preset--color--dark-header
 --wp--preset--color--dark-card
 --wp--preset--color--dark-text
 */
:root {
  --b-title: #000;
}

@mixin dark-colors {
  --wp--preset--color--bg: var(--wp--preset--color--dark-bg);
  --wp--preset--color--header: var(--wp--preset--color--dark-header);
  --wp--preset--color--card: var(--wp--preset--color--dark-card);
  --wp--preset--color--text: var(--wp--preset--color--dark-text);
  --b-title: #fff;
  --b-text: rgba(255, 255, 255, 0.7);
}

@media (prefers-color-scheme: dark) {
  body:not(.s-light) {
    @include dark-colors;
  }
}

body.s-dark {
  @include dark-colors;
}

body {
  background-color: var(--wp--preset--color--bg);
  color: var(--wp--preset--color--text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
h1,
h2,
h3 {
  a {
    color: var(--b-title);
    &:hover {
      color: var(--wp--preset--color--accent);
    }
  }
}

// ANIMATION
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(16px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

// ROOT
.wp-site-blocks {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  > footer {
    margin-top: auto;
  }
}

// SCROLL FX
.site-loop .wp-block-columns,
.entry-image > img,
.entry-content > *,
.s-fx {
  transform: translateY(90px);
  opacity: 0;
  transition: 1s;
  &.-show {
    transform: translateY(0);
    opacity: 1;
  }
}