/*
Theme Name: Whole Brain Leadership
Theme URI: https://wholebrainleadership.nl
Author: Whole Brain Leadership Academy
Description: Blokthema voor Whole Brain Leadership. Alle teksten en afbeeldingen zijn aan te passen in de WordPress-editor.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.0
License: GNU General Public License v2 or later
Text Domain: wbl
*/

/* Handgeschreven accent boven koppen */
.is-style-hand,
.ev-hand {
	font-family: var(--wp--preset--font-family--hand);
	font-size: clamp(1.6rem, 3vw, 2.1rem);
	line-height: 1.1;
	color: var(--wp--preset--color--terracotta);
	transform: rotate(-2deg);
	display: inline-block;
}

/* Kleine kapitalen-label */
.is-style-eyebrow {
	font-size: 0.8rem !important;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

/* Cursief accentwoord in koppen: <em> krijgt terracotta */
h1 em, h2 em, h3 em { font-style: normal; color: var(--wp--preset--color--gold); }
.has-ink-background-color h1 em,
.has-ink-background-color h2 em,
.has-dusk-gradient-background h1 em,
.has-dusk-gradient-background h2 em { color: var(--wp--preset--color--blush); }

/* Boogvormige foto — stoer en vrouwelijk tegelijk */
.is-style-arch img { border-radius: 0 0 0 120px !important; aspect-ratio: 4/5; object-fit: cover; }
.is-style-arch { position: relative; }
.is-style-arch::after {
	display:none;
	content: "";
	position: absolute; inset: auto -14px -14px auto;
	width: 46%; height: 46%;
	border: 2px solid var(--wp--preset--color--terracotta);
	border-radius: 0 0 24px 0;
	z-index: -1;
}

/* Kaarten */
.is-style-card {
	background: var(--wp--preset--color--white);
	border-radius: 24px;
	padding: clamp(1.5rem, 3vw, 2.25rem);
	box-shadow: 0 1px 0 rgba(18,38,75,.04), 0 18px 40px -24px rgba(18,38,75,.25);
	transition: transform .25s ease, box-shadow .25s ease;
	height: 100%;
}
.is-style-card:hover { transform: translateY(-4px); box-shadow: 0 1px 0 rgba(18,38,75,.04), 0 26px 50px -24px rgba(18,38,75,.35); }

/* Outline-knop */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	border: 2px solid currentColor;
	color: inherit;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--white);
}
.has-ink-background-color .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.has-dusk-gradient-background .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--white);
	border-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
}

/* Header */
.ev-header { position: sticky; top: 0; z-index: 50; backdrop-filter: saturate(1.4) blur(10px); background: rgba(255,255,255,.92) !important; border-bottom: 1px solid rgba(18,38,75,.08); }
.admin-bar .ev-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .ev-header { top: 46px; } }
.ev-header .wp-block-site-title a { text-decoration: none; color: var(--wp--preset--color--ink); }
.ev-header .wp-block-navigation a { text-decoration: none; }
.ev-header .wp-block-navigation a:hover { color: var(--wp--preset--color--terracotta); }

/* Grote decoratieve aanhalingstekens */
.ev-bigquote { position: relative; }
.ev-bigquote::before {
	content: "\201C";
	font-family: var(--wp--preset--font-family--display);
	font-size: 12rem; line-height: 1;
	position: absolute; top: -3.5rem; left: 50%; transform: translateX(-50%);
	color: var(--wp--preset--color--terracotta); opacity: .35;
	pointer-events: none;
}

/* Cijfers */
.ev-stat { font-family: var(--wp--preset--font-family--display); font-weight: 600; font-size: clamp(2.6rem, 6vw, 4rem); line-height: 1; letter-spacing: -0.03em; }

/* Post-kaarten in Inspiratie */
.ev-posts .wp-block-post { background: var(--wp--preset--color--white); border-radius: 24px; overflow: hidden; }
.ev-posts .wp-block-post-featured-image img { aspect-ratio: 4/3; object-fit: cover; border-radius: 0; }
.ev-posts .wp-block-post-title a { text-decoration: none; color: var(--wp--preset--color--ink); }
.ev-posts .wp-block-post-title a:hover { color: var(--wp--preset--color--terracotta); }

/* Footerlinks */
.ev-footer a { color: var(--wp--preset--color--blush); text-decoration: none; }
.ev-footer a:hover { color: var(--wp--preset--color--white); text-decoration: underline; }

/* Formulieren (Fluent Forms) in huisstijl */
.fluentform .ff-el-form-control { border-radius: 14px !important; border: 1.5px solid rgba(18,38,75,.18) !important; padding: .85rem 1rem !important; font-family: inherit; background: #fff; }
.fluentform .ff-el-form-control:focus { border-color: var(--wp--preset--color--terracotta) !important; box-shadow: 0 0 0 3px rgba(23,190,187,.15) !important; }
.fluentform .ff-btn-submit { background: var(--wp--preset--color--gold) !important; border-radius: 999px !important; padding: .95rem 2rem !important; font-weight: 700 !important; border: 0 !important; }
.fluentform .ff-btn-submit:hover { background: var(--wp--preset--color--ink) !important; }

@media (prefers-reduced-motion: reduce) { .is-style-card { transition: none; } .is-style-card:hover { transform: none; } }

/* Smalle schermen: cijfers en footer netjes houden */
.ev-stat { white-space: nowrap; }
.is-not-stacked-on-mobile .ev-stat { font-size: clamp(2rem, 4vw, 3.4rem); }
.is-not-stacked-on-mobile .has-small-font-size { font-size: .8rem !important; hyphens: auto; -webkit-hyphens: auto; }
.ev-footer .wp-block-columns { flex-wrap: wrap !important; }
.ev-footer .wp-block-column { min-width: 220px; }
.ev-footer a[href^="mailto"] { white-space: nowrap; }

/* WBL: teal-gradient knoppen en koraal accentlijn */
.wp-element-button, .wp-block-button__link { background-image: linear-gradient(270deg,#30C9C6,#00A3A0,#17BEBB); }
.wp-block-button.is-style-outline > .wp-block-button__link { background-image: none; }
.wp-element-button:hover, .wp-block-button__link:hover { background-image: none; }
.ev-review { font-family: var(--wp--preset--font-family--serif); }
.ev-marker { display:inline-block; width:56px; height:4px; border-radius:4px; background: var(--wp--preset--color--terracotta); }