/*
Theme Name: Qangaroo
Author: Kenrick Halff
Author URI: https://casualdevelopment.nl
Theme URI: https://casualdevelopment.nl/wp-themes
Tags: full-site-editing, editor-style, block-styles, block-patterns
Text Domain: qangaroo
Requires at least: 6.3
Requires PHP: 7.4
Tested up to: 6.3
Version: 1.0.0

License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* Styles intended only for the front.*/
html {
	scroll-behavior: smooth;
}

@media screen and (prefers-reduced-motion: reduce) {

	html {
		scroll-behavior: auto;
	}
}

body {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

h1, h1 a {
	font-size: var(--text-4xl);
}
h2, h2 a {
	font-size: var(--text-3xl);
}
h3, h3 a {
	font-size: var(--text-2xl);
}
h4, h4 a {
	font-size: var(--text-xl);
	font-weight: bold;
}


@media only screen and (min-width: 767px) {
  .wp-block-site-logo {
    display: block;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
}

.temporary-count-once {
  -webkit-animation-iteration-count: 1.5;
  animation-iteration-count: 1.5;
}

.home-title {
  font-size: clamp(32px, 7vw, 80px) !important;
  line-height: normal;
  text-align: center;
}

/*.home-hero-cta {

}*/

.readmore-table {
    max-height: 300px;
    overflow-y: hidden;
    position: relative;
    transition: max-height 1s ease-in-out;
}

.readmore-table:after {
    content: "";
    display: block;
    position: absolute;
    height: 30%;
    width: 100%;
    bottom: 0;
    box-shadow: 0 -52px 48px var(--wp--preset--color--base) inset;
    z-index: 1;
}
.readmore-table.show:after {
  display:none;
}

.readmore-table.show {
  max-height: 2000px;
}

.readmore-table .wp-block-buttons {
    position: absolute;
    bottom: 14px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}

.readmore-table.show .wp-block-buttons {
  display: none;
}

.wp-block-table tr:nth-child(odd) {
    background: gainsboro;
}

.gb-button {
    /*font-family: 'All Round Gothic';*/
    font-size: clamp(1.5rem, 2.5vw, 2rem) !important;
    text-align: center !important;
}

.wp-element-button, .button, .checkout-button {
	border-radius: 50px;	
}

.hover-animate-button:hover {
  --rot: 186deg;
  --grad1: 40%;
  animation: changeBg 3s infinite;
  background-image: linear-gradient(var(--rot), var(--wp--preset--color--custom-qa-primary-1, #ed7109) var(--grad1), var(--wp--preset--color--custom-qa-primary-2, #2f3846));
}

@keyframes changeBg {
    0%, 100% {--rot:186deg;--grad1:40%;}
    5%,  95% {--rot:168deg;--grad1:41%;}
    10%, 90% {--rot:150deg;--grad1:42%;}
    15%, 85% {--rot:132deg;--grad1:43%;}
    20%, 80% {--rot:150deg;--grad1:42%;}
    25%, 75% {--rot:168deg;--grad1:41%;}
    30%      {--rot:186deg;--grad1:40%;}
    35%, 95% {--rot:204deg;--grad1:39%;}
    40%, 90% {--rot:222deg;--grad1:38%;}
    45%, 85% {--rot:240deg;--grad1:37%;}
    50%, 80% {--rot:258deg;--grad1:36%;}
    55%, 75% {--rot:276deg;--grad1:35%;}
    60%      {--rot:294deg;--grad1:34%;}
}