/*
Theme Name: Wux Blog Theme - Child
Template: wux-blogs
Description: A child theme for the Wux Blogs theme
Author: Wux B.V.
Author URI: https://wux.nl/
Version: 1.0.0
Text Domain: wux-blogs-child
*/


/* --- style.css */
:root{
	--clr-border: rgb(151, 96, 71, .2) !important; 
}	
h1, .h1 { --fs: clamp(3.2rem, 5vw, 7rem); }
h2, .h2 { --fs: clamp(3.0rem, 4vw, 4.0rem); }
.wpb-bg-clr--white	{ background-color: #ffff; --clr-heading: var(--clr-heading-main); --clr-text: var(--clr-text); }
:is(.wpb-bg-clr--primary, .wpb-bg-clr--dark) .wpb-text *:not(.btn, .btn *){ color: #fff; }
.wpb-bg-clr--white .wpb-card{ background-color: var(--clr-light); }

/* --- core.css */
.wpb-navigation { --p: 2rem 0; border-bottom: 2px solid var(--clr-border); position: relative; padding: var(--p); }
.wpb-bg-assets{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; pointer-events: none; }
section:has(.wpb-bg-assets) .container{ z-index: 2; }
.wpb-footer .wpb-footer__bottom { --p: 2rem; padding: var(--p) 0; background-color: var(--clr-light); }
.wpb-search-results { --gc: 1; --gap: 1.4rem; border-top: 2px solid var(--clr-border); }

/* --- form.css */
.wpb-card--contact-form form{ display: grid; gap: 2.4rem; }
.wpb-card--contact-form form label{ width: 100%; }
.wpb-card--contact-form form label :is(input, textarea, select){ width: 100%; }

@media (min-width: 992px){
    .wpb-card--contact-form form{ grid-template-columns: 1fr 1fr; }
    .wpb-card--contact-form form > *:is(:has([data-name="your-name"]), :has(textarea)){  grid-column: span 2; }
}

/* --- block.css */
.wpb-header.wpb-header--home .wpb-text{ max-width: 80rem; }
.wpb-header.wpb-header--home.wpb-var--slider{ --bp: 70%; overflow: hidden; background: linear-gradient(to bottom, var(--clr-primary), var(--clr-primary) var(--bp), var(--clr-background) var(--bp)); }
.wpb-header.wpb-header--home.wpb-var--slider{ --bp: 70%; overflow: hidden; background: linear-gradient(to bottom, var(--clr-light), var(--clr-light) var(--bp), #ffff var(--bp)); }
.wpb-header.wpb-header--home.wpb-var--slider h1{ color: var(--clr-primary); }
.wpb-header.wpb-header--home.wpb-var--slider .wpb-bg-assets i{ --clr: var(--clr-primary); --w: 60rem; --h: 60rem; position: absolute; top: -7rem; right: 5vw; opacity: .2; }