:root {
    --pk-heading-font-family: "Spline Sans";
    --pk-heading-font-weight: 400;
    --pk-heading-line-height: 1.3;

    --pk-text-font-family: "Inter";
    --pk-text-font-weight: 400;
    --pk-text-line-height: 1.6;

    --text-desktop-font-size: 16px;
    --text-tablet-font-size: 16px;
    --text-mobile-font-size: 16px;

    /* header */
    --header-nav-fontsize: max(.875rem, calc(.875 * var(--su)));

    /*Base unit*/
    --scaling-h1-big: max(4rem, calc(6.5 * var(--su))); 
    --scaling-h1: max(3rem, calc(4 * var(--su))); 
    --scaling-h2: max(1.75rem, calc(2.25 * var(--su)));
    --scaling-h3: max(1.375rem, calc(1.75 * var(--su)));
    --scaling-h4: max(1.25rem, calc(1.5 * var(--su)));
    --scaling-h5: max(1.125rem, calc(1.25 * var(--su)));

    /* body */
    --body-m-regular: max(1rem, calc(1.125 * var(--su)));
    --body-s-medium: max(1rem, calc(1 * var(--su)));
    --body-s-medium-weight: 500;
    --body-s-regular: max(1rem, calc(1 * var(--su)));
    --body-xs-regular: max(.875rem, calc(.875 * var(--su)));

    /* other */
    --hero-secondary-title:  max(1.5rem, calc(2 * var(--su)));
    --incidental-label-fontsize: max(.75rem, calc(.75 * var(--su)));

}

/* CLA (site 3): Museo Sans, geladen in font-setup.php. Op :root zodat ook afgeleide variabelen (zoals --pk-button-font-family) meeschuiven. */
:root:has(body.site-3) {
    --pk-heading-font-family: "museo-sans", sans-serif;
    --pk-heading-font-weight: 500;
    --pk-text-font-family: "museo-sans", sans-serif;
    --pk-text-font-weight: 300;
}

body.site-3 :is(h1, h2, h3, h4, h5, h6) {
    letter-spacing: -.02em;
}

body {
    font-size: var(--body-s-regular);
}

body h1 {
    font-size: var(--scaling-h1);
}

body h2 {
    font-size: var(--scaling-h2);
}

body h3 {
    font-size: var(--scaling-h3);
}

body h4 {
    font-size: var(--scaling-h4);
}

body h5 {
    font-size: var(--scaling-h5);
}

body h6 {
    font-size: var(--scaling-h6);
}

body .secondary-title {
    font-size: var(--hero-secondary-title);
    line-height: 1.4;
}

body .nova-leadtext {
    font-size: max(1.125rem, calc(1.25 * var(--su)));
    font-weight: 500;
}

body .nova-quote {
	font-family: var(--pk-heading-font-family);
	font-size: var(--scaling-h3);
	font-weight: var(--pk-heading-font-weight);
	line-height: var(--pk-heading-line-height);
}

body .incidental-label, body .nova-eyebrow {
    text-transform: uppercase;
    font-size: var(--incidental-label-fontsize);
    font-family: 'Spline Sans Mono';
    line-height: 1;
}

body .nova-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: max(.25rem, calc(.25 * var(--su)));
}

body .nova-eyebrow::before {
    content: '';
	display: block;
	height: 1em;
	aspect-ratio: 1;
	flex-shrink: 0;
	background-color: var(--accent-100);
    --mask-url: var(--icon-dot);
	mask: var(--mask-url) center / contain no-repeat;
    transform: translate(0%, -.1em);
}

/* WYSIWYG SCALING */

body .pk-heading {
    margin-block: 0;
}

body p > a {
	text-decoration: underline;
	color: inherit;
}


/* WYSIWYG SCALING */

/* body .wysiwyg-gaps h1,
body .wysiwyg-gaps h2,
body .wysiwyg-gaps h3,
body .wysiwyg-gaps h4,
body .wysiwyg-gaps h5,
body .wysiwyg-gaps h6 {
	margin-top: max(3rem, calc(3 * var(--su)));
	margin-bottom: max(1rem, calc(1.5 * var(--su)));
} */

body .wysiwyg-gaps h1:first-child,
body .wysiwyg-gaps h2:first-child,
body .wysiwyg-gaps h3:first-child,
body .wysiwyg-gaps h4:first-child,
body .wysiwyg-gaps h5:first-child,
body .wysiwyg-gaps h6:first-child {
	margin-top: 0;
}

body .wysiwyg-gaps h1:last-child,
body .wysiwyg-gaps h2:last-child,
body .wysiwyg-gaps h3:last-child,
body .wysiwyg-gaps h4:last-child,
body .wysiwyg-gaps h5:last-child,
body .wysiwyg-gaps h6:last-child {
	margin-bottom: 0;
}

/* body .wysiwyg-gaps h1,
body .wysiwyg-gaps h2,
body .wysiwyg-gaps h3,
body .wysiwyg-gaps h4,
body .wysiwyg-gaps h5,
body .wysiwyg-gaps h6 {
    margin-top: max(1.5rem, calc(2.5 * var(--su)));
    margin-bottom: max(1rem, calc(1 * var(--su)));
} */

/* 32px in stand houden voor consistentie wanneer er geen tekst tussen heading en button staat */
body .wysiwyg-gaps h1:has(+ .pk-button-group),
body .wysiwyg-gaps h2:has(+ .pk-button-group),
body .wysiwyg-gaps h3:has(+ .pk-button-group),
body .wysiwyg-gaps h4:has(+ .pk-button-group),
body .wysiwyg-gaps h5:has(+ .pk-button-group),
body .wysiwyg-gaps h6:has(+ .pk-button-group) {
	margin-bottom: 0;
}

body .wysiwyg-gaps p {
	/* margin-top: max(1rem, calc(1 * var(--su))); */
	margin-bottom: max(1rem, calc(1 * var(--su)));
}

body .wysiwyg-gaps p:first-child {
	margin-top: 0;
}

.pk-page-content p:last-child {
  	margin-bottom: 0px !important;
}

body .wysiwyg-gaps ul {
	margin-block: max(1rem, calc(1 * var(--su)));
}

body .wysiwyg-gaps ul:last-child {
    margin-bottom: 0;
}

body .wysiwyg-gaps .pk-button-group,
body .wysiwyg-gaps > .pk-button {
	margin-top: max(1.5rem, calc(1.5 * var(--su)));
	margin-bottom: max(1rem, calc(1 * var(--su)));
}

body .wysiwyg-gaps .pk-button-group:last-child,
body .wysiwyg-gaps > .pk-button:last-child {
	margin-bottom: 0 !important;
}

body .detail-flex-gaps h1:first-child,
body .detail-flex-gaps h2:first-child,
body .detail-flex-gaps h3:first-child,
body .detail-flex-gaps h4:first-child,
body .detail-flex-gaps h5:first-child,
body .detail-flex-gaps h6:first-child {
	margin-top: 0;
}

body .detail-flex-gaps h1:last-child,
body .detail-flex-gaps h2:last-child,
body .detail-flex-gaps h3:last-child,
body .detail-flex-gaps h4:last-child,
body .detail-flex-gaps h5:last-child,
body .detail-flex-gaps h6:last-child {
	margin-bottom: 0;
}

body .detail-flex-gaps h1,
body .detail-flex-gaps h2,
body .detail-flex-gaps h3,
body .detail-flex-gaps h4,
body .detail-flex-gaps h5,
body .detail-flex-gaps h6 {
    margin-top: max(1.5rem, calc(1.5 * var(--su)));
    margin-bottom: max(.5rem, calc(.5 * var(--su)));
}