:root {
	/* Boutique */
	--color-boutique-bg: #40262A;
	--color-boutique-text: #FFF0E5;
	--color-boutique-accent: #E64C98;
	--font-boutique-serif: 'Sangbleu Sunrise', Georgia, serif;
	--font-boutique-display: 'Degular Display', Georgia, serif;

	/* Budget */
	--color-budget-bg: #FFFFFF;
	--color-budget-accent: #FF6900;
	--font-budget-sans: 'FaktPro', Arial, sans-serif;

	/* Fluid type scale: bereikt zijn minimum bij het mobiele breakpoint (900px) en
	   zijn maximum pas bij 1920px, zodat schermen daartussenin (bv. kleine laptops
	   op ~1272px) merkbaar kleiner schalen i.p.v. al bijna op volle grootte te zitten. */
	/* Titel: 40px Sangbleu (boutique), 45px Fakt Pro (budget) - Fakt Pro oogt kleiner dan
	   Sangbleu op dezelfde px-waarde, zelfde soort verhouding als bij de knoppen. */
	--size-title-landing-boutique: clamp(1.25rem, 0.147rem + 1.961vw, 2.5rem);    /* 40px op groot scherm */
	--size-title-landing-budget: clamp(1.40625rem, 0.165rem + 2.206vw, 2.8125rem); /* 45px op groot scherm */
	--size-price: clamp(2.25rem, 0.375rem + 3.333vw, 4.375rem);          /* 70px op groot scherm */
	--size-body: clamp(1.05rem, 0.763rem + 0.51vw, 1.375rem);            /* 22px op groot scherm */
	--size-button-boutique: clamp(1.1rem, 0.802rem + 0.529vw, 1.4375rem); /* 23px op groot scherm */
	--size-button-budget: clamp(1rem, 0.779rem + 0.392vw, 1.25rem);       /* 20px op groot scherm */
	--size-label: clamp(1.2rem, 0.604rem + 1.059vw, 1.875rem);            /* 30px op groot scherm, from/per night */

	/* Fluid spacing, zelfde 900-1920px schaal, voor de belangrijkste vaste ruimtes
	   op de landingspagina die eerder niet meeschaalden. */
	--space-section-top: clamp(3rem, -0.529rem + 6.275vw, 7rem);     /* .split-half padding-top */
	--space-section-bottom: clamp(1.5rem, 0.176rem + 2.353vw, 3rem); /* .split-half padding-bottom */
	--space-block: clamp(1.25rem, 0.147rem + 1.961vw, 2.5rem);       /* titel- en room-marge onder */
	--size-room-image: clamp(8.75rem, 5.441rem + 5.882vw, 12.5rem);  /* 140px - 200px kamerfoto */

	/* Zodat de onderkant van beide titels altijd naast elkaar staat: vaste (merk-onafhankelijke,
	   dus in rem/vw i.p.v. em) hoogte-reservering voor het titelblok, gebaseerd op de langste
	   van de twee huidige teksten (boutique, 5 regels op 40px/640px-kolom = 230px op groot
	   scherm; budget komt bij 45px/640px uit op 3 regels = 135px en wordt dus onderin
	   uitgelijnd binnen deze 230px). Zie .split-half__title in landing.css. */
	--title-block-height: clamp(7.1875rem, 0.846rem + 11.275vw, 14.375rem);
}
