/*
Theme Name: Gesamenluk
Theme URI: https://gesamenluk.nl
Author: Thomas Jacobs
Author URI: https://overmorrow.nl
Description: Custom WordPress theme voor Gesamenluk, met TailwindCSS en Gutenberg block patterns.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gesamenluk
Tags: custom-menu, custom-logo, block-patterns, tailwind
*/

.parallax-1, .parallax-2 {
  will-change: transform;
}

.parallax-element {
  will-change: transform;
}

.logo {
  animation: gentleRotate 8s ease-in-out infinite;
}

@keyframes gentleRotate {
  0% {
    transform: rotate(30deg);
  }
  33% {
    transform: rotate(80deg);
  }
  66% {
    transform: rotate(-10deg);
  }
  85% {
    transform: rotate(10deg);
  }
  100% {
    transform: rotate(30deg);
  }
}

@keyframes slideUp {
  0% {
    transform: translateY(100px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes slideUpFast {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes slideUpSlow {
  0% {
    transform: translateY(120px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

/* Modulaire animatie classes */
.animate-slide-up {
  opacity: 0;
  animation: slideUp 0.8s ease-out forwards;
}

.animate-slide-up-fast {
  opacity: 0;
  animation: slideUpFast 0.5s ease-out forwards;
}

.animate-slide-up-slow {
  opacity: 0;
  animation: slideUpSlow 1.2s ease-out forwards;
}

p.has-medium-font-size {
  font-weight: 500;
  line-height: 150%;
  font-size: 24px !important;
}

blockquote {
  border: 0 !important;
  padding: 0 80px !important;
}

blockquote p {
  font-size: 24px !important;
  font-weight: 100 !important;
  font-style: normal !important;
  line-height: 150%;
  color: #936acb !important;
}

.prose figure figcaption.wp-element-caption {
  font-size: 14px !important;
}

/* Custom underline voor dropdown menu items - 1px lager */
.dropdown-menu-link {
  position: relative;
  display: inline-block;
}

.dropdown-menu-link:hover {
  text-decoration: none;
}

.dropdown-menu-link:hover::after {
  content: '';
  position: absolute;
  left: 0.5rem;
  right: 0.5rem;
  bottom: 2px;
  height: 1px;
  background-color: #68707c;
}