/*
Theme Name: Boven Webdesign Child Theme
Theme URI: 
Author: Daan Boven
Author URI: 
Description: A child theme for the Twenty Twenty-Five theme tailor-made for Boven Webdesign.
Requires at least: 6.9
Tested up to: 6.9
Requires PHP: 5.7
Version: 0.1.0 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: twentytwentyfive
Text Domain: boven-webdesign-child-theme
Tags: 
*/

strong {
    font-weight: 600;
}

.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content,
.wp-block-navigation .current-menu-ancestor > .wp-block-navigation__submenu-icon,
.wp-block-navigation .current-menu-ancestor > .wp-block-navigation-item__content {
    color: var(--wp--preset--color--accent-1);
    font-weight: 600;
}

.rolodex-wrapper{
  position: relative;
  height: 100px;
  perspective: 500px;
  overflow: hidden;
}

.rolodex-wrapper .rolodex-slide{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  backface-visibility: hidden;
  transform-style: preserve-3d;
}

a.tile-clickable {
    display: block;
    text-decoration: none;
    overflow: hidden;
    height: 100%;
}

a.tile-clickable .tile-content {
    transform: translateY(0);
    transition: transform 0.2s ease;
    display: flex;
    flex-flow: column;
    height: 100%;
}

a.tile-clickable:hover .tile-content {
    transform: translateY(-8px);
}

a.tile-clickable .tile-content .tile-text {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

a.tile-clickable .tile-content .tile-text .tile-description {
    flex: 1 1 auto;
}

a.tile-clickable .tile-content .tile-text h3 {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

a.tile-clickable .tile-content .tile-text p {
    margin-bottom: auto;
}

a.tile-transition-bg {
    -webkit-transition: background-color 150ms linear;
    -ms-transition: background-color 150ms linear;
    transition: background-color 150ms linear;
}

.wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column.home-first-column {
    box-sizing: border-box;
    flex-basis: calc(50% + var(--wp--preset--spacing--50)) !important;
}

.wp-block-cb-carousel-v2 .cb-pagination.swiper-pagination-horizontal {
    position: static;
    justify-content: end;
    font-family: var(--wp--preset--font-family--fira-code);
    font-size: 1.2rem;
    letter-spacing: 3px;
    width: unset;
    min-height: var(--wp--preset--spacing--40);
    padding-right: calc(3 * var(--wp--preset--spacing--40));
    padding-top: var(--wp--preset--spacing--40);
    padding-bottom: var(--wp--preset--spacing--40);
}

.wp-block-cb-carousel-v2 .cb-button-next, .wp-block-cb-carousel-v2 .cb-button-prev {
    border: 1px solid var(--wp--preset--color--accent-1);
    color: var(--wp--preset--color--accent-1);
    width: 3rem;
    height: 3rem;
}

.wp-block-cb-carousel-v2 .cb-button-next:not(.swiper-button-disabled):hover,
.wp-block-cb-carousel-v2 .cb-button-prev:not(.swiper-button-disabled):hover {
    background-color: var(--wp--preset--color--accent-1);
    color: var(--wp--preset--color--base);
}

.wp-block-cb-carousel-v2 .cb-button-prev, .wp-block-cb-carousel-v2.cb-rtl .cb-button-next {
    right: calc(5 * var(--wp--preset--spacing--40));
    top: calc(100% - 2 * var(--wp--preset--spacing--40));
    left: unset;
}

.wp-block-cb-carousel-v2 .cb-button-next, .wp-block-cb-carousel-v2.cb-rtl .cb-button-prev {
    right: var(--wp--preset--spacing--40);
    top: calc(100% - 2 * var(--wp--preset--spacing--40));
}

.wp-block-cb-carousel-v2 .cb-button-next:after, .wp-block-cb-carousel-v2 .cb-button-prev:after {
    font-size: 1.15rem;
}

.wp-block-cb-carousel-v2 .swiper-button-next.swiper-button-disabled,
.wp-block-cb-carousel-v2 .swiper-button-prev.swiper-button-disabled {
    color: var(--wp--preset--color--accent-4);
    border-color: var(--wp--preset--color--accent-4);
    opacity: .5;
    cursor: not-allowed;
    pointer-events: auto;
}

.wp-block-cb-carousel-v2[data-cb-pagination=true] .swiper-horizontal {
    margin-bottom: 0;
}

.underline-hover, .wp-block-navigation-item__content {
    position: relative;
    display: inline-block;
    text-decoration: none;
}

.underline-hover::after, .wp-block-navigation-item__content::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 100%;
    height: 2px;
    background: var(--wp--preset--color--accent-1);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.underline-hover:hover::after, .wp-block-navigation-item__content:hover::after {
    transform: scaleX(1);
}

:root {
  --plyr-color-main: var(--wp--preset--color--accent-1);
  --plyr-video-controls-background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
  --plyr-captions-background: rgba(0, 0, 0, 0.6);
}

.plyr.plyr--stopped .plyr__controls {
    display: none;
}

ul.sticky-toc {
    position: sticky;
    top: var(--wp--preset--spacing--50);
    list-style-type: none;
    padding-inline-start: 0;
}

ul.sticky-toc li {
    margin-top: 0;
}

ul.sticky-toc li a {
    text-decoration: none;
    border-inline-start: .25rem solid var(--wp--preset--color--accent-5);
    outline-color: var(--wp--preset--color--accent-1);
    outline-offset: -2px;
    display: inline-block;
    padding: .875rem;
}

ul.sticky-toc li a.active {
    border-inline-start-color: var(--wp--preset--color--accent-1);
    color: var(--wp--preset--color--contrast);
}

ul.sticky-toc li a.active {
    font-weight: 400;
}

.sticky-contact {
    position: sticky;
    top: var(--wp--preset--spacing--50);
}

html {
    scroll-behavior: smooth;
}

.wp-block-cover.picture-daan {
    min-height: unset;
    height: 440px;
    max-height: 35vh;
}

.has-modal-open .wp-block-navigation__responsive-close {
    max-width: calc(100% - 2 * var(--wp--preset--spacing--50));
}

@media (max-width: 768px) {
    body {
        --wp--style--root--padding-left: 0;
        --wp--style--root--padding-right: 0;
    }

    .flex-basis-100-mobile.wp-block-column > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
        max-width: 100%;
    }

    .flex-order-up-mobile {
        order: -1;
    }
}