html:root,
[data-hsx*="light"],
html:root[data-hsx*="dark"] [data-hsx*="inverted"] {
--hsx-site-background: #ffffff;
--hsx-body-text-color: #080808;
--hsx-headings-color: #000000;
--hcl-on-brand: #ffffff;
--hcl-brand-1: #fafdfe;
--hcl-brand-2: #f2fafb;
--hcl-brand-3: #def7f9;
--hcl-brand-4: #caf1f6;
--hcl-brand-5: #b5e9f0;
--hcl-brand-6: #9ddde7;
--hcl-brand-7: #7dcedc;
--hcl-brand-8: #3db9cf;
--hcl-brand-9: #00a2c7;
--hcl-brand-10: #0797b9;
--hcl-brand-11: #107d98;
--hcl-brand-12: #0d3c48;
--hcl-brand-emphasis: #107d98;
--hcl-brand-1a: hsla(195, 95.2%, 41.2%, 0.020);
--hcl-brand-2a: hsla(185, 99.9%, 42.3%, 0.051);
--hcl-brand-3a: hsla(186, 97.8%, 42.2%, 0.095);
--hcl-brand-4a: hsla(186, 99.9%, 38.5%, 0.153);
--hcl-brand-5a: hsla(187, 99.3%, 36.6%, 0.232);
--hcl-brand-6a: hsla(188, 99.4%, 35.4%, 0.334);
--hcl-brand-7a: hsla(189, 99.6%, 35.0%, 0.483);
--hcl-brand-8a: hsla(189, 99.9%, 37.6%, 0.761);
--hcl-brand-9a: hsla(190, 100%, 37.8%, 0.980);
--hcl-brand-10a: hsla(191, 99.9%, 34.6%, 0.969);
--hcl-brand-11a: hsla(192, 100%, 27.6%, 0.953);
--hcl-brand-12a: hsla(192, 100%, 11.0%, 0.980);
--hcl-on-neutral: #ffffff;
--hcl-neutral-1: #fdfcfd;
--hcl-neutral-2: #faf9fb;
--hcl-neutral-3: #f2eff3;
--hcl-neutral-4: #eae7ec;
--hcl-neutral-5: #e3dfe6;
--hcl-neutral-6: #dbd8e0;
--hcl-neutral-7: #d0cdd7;
--hcl-neutral-8: #bcbac7;
--hcl-neutral-9: #000000;
--hcl-neutral-10: #1e1e1e;
--hcl-neutral-11: #65636d;
--hcl-neutral-12: #211f26;
--hcl-neutral-emphasis: #000000;
--hcl-neutral-1a: hsla(300, 89.3%, 18.3%, 0.012);
--hcl-neutral-2a: hsla(300, 78.1%, 9.0%, 0.028);
--hcl-neutral-3a: hsla(300, 99.5%, 7.7%, 0.051);
--hcl-neutral-4a: hsla(270, 90.5%, 6.1%, 0.071);
--hcl-neutral-5a: hsla(270, 83.0%, 5.2%, 0.091);
--hcl-neutral-6a: hsla(300, 93.5%, 3.7%, 0.114);
--hcl-neutral-7a: hsla(270, 82.6%, 3.3%, 0.142);
--hcl-neutral-8a: hsla(255, 95.2%, 3.7%, 0.220);
--hcl-neutral-9a: #000000;
--hcl-neutral-10a: #1e1e1e;
--hcl-neutral-11a: hsla(247, 97.9%, 3.2%, 0.569);
--hcl-neutral-12a: hsla(261, 98.7%, 3.0%, 0.918);
--hcl-on-turquoise: #fff;
--hcl-turquoise-1: #fafdfe;
--hcl-turquoise-2: #f2fafd;
--hcl-turquoise-3: #dff6fe;
--hcl-turquoise-4: #cceffc;
--hcl-turquoise-5: #b8e7f8;
--hcl-turquoise-6: #a1dbf0;
--hcl-turquoise-7: #82cce5;
--hcl-turquoise-8: #47b6d8;
--hcl-turquoise-9: #00a2c7;
--hcl-turquoise-10: #0195b7;
--hcl-turquoise-11: #007da0;
--hcl-turquoise-12: #0e3c49;
--hcl-turquoise-emphasis: #007da0;
--hcl-turquoise-1a: #0099cc05;
--hcl-turquoise-2a: #009dd80d;
--hcl-turquoise-3a: #00b8f820;
--hcl-turquoise-4a: #00aff033;
--hcl-turquoise-5a: #00a9e647;
--hcl-turquoise-6a: #009ed75e;
--hcl-turquoise-7a: #0097ca7d;
--hcl-turquoise-8a: #009ac9b8;
--hcl-turquoise-9a: #00a2c7;
--hcl-turquoise-10a: #0095b7fe;
--hcl-turquoise-11a: #007da0;
--hcl-turquoise-12a: #00313ef1;
--hcl-on-accent-geel: #262209;
--hcl-accent-geel-1: #fdfdfa;
--hcl-accent-geel-2: #fefceb;
--hcl-accent-geel-3: #fff9bf;
--hcl-accent-geel-4: #fef29f;
--hcl-accent-geel-5: #f8e981;
--hcl-accent-geel-6: #e9da7a;
--hcl-accent-geel-7: #d8cb75;
--hcl-accent-geel-8: #c4b54f;
--hcl-accent-geel-9: #ffe62b;
--hcl-accent-geel-10: #f2dd46;
--hcl-accent-geel-11: #897a00;
--hcl-accent-geel-12: #413d23;
--hcl-accent-geel-emphasis: #897a00;
--hcl-accent-geel-1a: #99990005;
--hcl-accent-geel-2a: #f3d90014;
--hcl-accent-geel-3a: #ffe80040;
--hcl-accent-geel-4a: #fddd0060;
--hcl-accent-geel-5a: #f1d3007e;
--hcl-accent-geel-6a: #d5b90085;
--hcl-accent-geel-7a: #b79f008a;
--hcl-accent-geel-8a: #aa9400b0;
--hcl-accent-geel-9a: #ffe100d4;
--hcl-accent-geel-10a: #edd000b9;
--hcl-accent-geel-11a: #897a00;
--hcl-accent-geel-12a: #231e00dc;
--hcl-on-licht-geel: #fff;
--hcl-licht-geel-1: #fefcfb;
--hcl-licht-geel-2: #fff5f0;
--hcl-licht-geel-3: #ffe9dd;
--hcl-licht-geel-4: #ffd7c3;
--hcl-licht-geel-5: #ffc9af;
--hcl-licht-geel-6: #ffb999;
--hcl-licht-geel-7: #ffa480;
--hcl-licht-geel-8: #f78b60;
--hcl-licht-geel-9: #ff6100;
--hcl-licht-geel-10: #f35200;
--hcl-licht-geel-11: #d94100;
--hcl-licht-geel-12: #5a2b18;
--hcl-licht-geel-emphasis: #d94100;
--hcl-licht-geel-1a: #c0400004;
--hcl-licht-geel-2a: #ff55000f;
--hcl-licht-geel-3a: #ff5a0022;
--hcl-licht-geel-4a: #ff55003c;
--hcl-licht-geel-5a: #ff530050;
--hcl-licht-geel-6a: #ff500066;
--hcl-licht-geel-7a: #ff49007f;
--hcl-licht-geel-8a: #f245009f;
--hcl-licht-geel-9a: #ff6100;
--hcl-licht-geel-10a: #f35200;
--hcl-licht-geel-11a: #d94100;
--hcl-licht-geel-12a: #491500e7;
--hcl-on-warm-koraal: #fff;
--hcl-warm-koraal-1: #fffcfc;
--hcl-warm-koraal-2: #fff8f7;
--hcl-warm-koraal-3: #feebe7;
--hcl-warm-koraal-4: #ffdcd3;
--hcl-warm-koraal-5: #ffcdc2;
--hcl-warm-koraal-6: #fdbdaf;
--hcl-warm-koraal-7: #f5a898;
--hcl-warm-koraal-8: #ec8e7b;
--hcl-warm-koraal-9: #e54d2e;
--hcl-warm-koraal-10: #dd4425;
--hcl-warm-koraal-11: #d13415;
--hcl-warm-koraal-12: #5c271f;
--hcl-warm-koraal-emphasis: #d13415;
--hcl-warm-koraal-1a: hsla(0, 100%, 51.0%, 0.012);
--hcl-warm-koraal-2a: hsla(8, 100%, 51.0%, 0.032);
--hcl-warm-koraal-3a: hsla(7, 100%, 50.2%, 0.067);
--hcl-warm-koraal-4a: hsla(8, 100%, 50.1%, 0.114);
--hcl-warm-koraal-5a: hsla(7, 99.5%, 47.9%, 0.173);
--hcl-warm-koraal-6a: hsla(9, 99.9%, 46.2%, 0.255);
--hcl-warm-koraal-7a: hsla(10, 99.8%, 43.6%, 0.365);
--hcl-warm-koraal-8a: hsla(10, 99.5%, 41.8%, 0.499);
--hcl-warm-koraal-9a: hsla(10, 99.9%, 43.8%, 0.820);
--hcl-warm-koraal-10a: hsla(10, 100%, 41.8%, 0.859);
--hcl-warm-koraal-11a: hsla(10, 99.9%, 38.8%, 0.922);
--hcl-warm-koraal-12a: hsla(10, 99.0%, 7.4%, 0.934);
--hcl-on-zachte-beige: #000000;
--hcl-zachte-beige-1: #fefef9;
--hcl-zachte-beige-2: #fefdef;
--hcl-zachte-beige-3: #fffcd7;
--hcl-zachte-beige-4: #fff8bd;
--hcl-zachte-beige-5: #fceda3;
--hcl-zachte-beige-6: #f5df87;
--hcl-zachte-beige-7: #e9ca64;
--hcl-zachte-beige-8: #e0b227;
--hcl-zachte-beige-9: #f4f1de;
--hcl-zachte-beige-10: #e2dfcc;
--hcl-zachte-beige-11: #7a5400;
--hcl-zachte-beige-12: #3e341b;
--hcl-zachte-beige-emphasis: #7a5400;
--hcl-zachte-beige-1a: hsla(60, 94.3%, 34.6%, 0.024);
--hcl-zachte-beige-2a: hsla(52, 100%, 50.4%, 0.091);
--hcl-zachte-beige-3a: hsla(55, 100%, 50.2%, 0.181);
--hcl-zachte-beige-4a: hsla(54, 100%, 50.1%, 0.267);
--hcl-zachte-beige-5a: hsla(52, 99.9%, 49.5%, 0.357);
--hcl-zachte-beige-6a: hsla(50, 100%, 47.4%, 0.451);
--hcl-zachte-beige-7a: hsla(47, 99.8%, 44.6%, 0.577);
--hcl-zachte-beige-8a: hsla(48, 100%, 46.0%, 0.980);
--hcl-zachte-beige-9a: hsla(53, 100%, 48.0%, 0.961);
--hcl-zachte-beige-10a: hsla(50, 100%, 48.4%, 0.980);
--hcl-zachte-beige-11a: hsla(42, 100%, 28.6%, 0.980);
--hcl-zachte-beige-12a: hsla(41, 98.9%, 8.0%, 0.942);
--hcl-on-koele-grijs: #000000;
--hcl-koele-grijs-1: #fbfdfe;
--hcl-koele-grijs-2: #f7f9fb;
--hcl-koele-grijs-3: #e6f2fa;
--hcl-koele-grijs-4: #d8ecf6;
--hcl-koele-grijs-5: #c9e2f1;
--hcl-koele-grijs-6: #bcd6e8;
--hcl-koele-grijs-7: #a9c8dd;
--hcl-koele-grijs-8: #8db5ce;
--hcl-koele-grijs-9: #a8abad;
--hcl-koele-grijs-10: #979a9c;
--hcl-koele-grijs-11: #397098;
--hcl-koele-grijs-12: #21344d;
--hcl-koele-grijs-emphasis: #397098;
--hcl-koele-grijs-1a: hsla(210, 100%, 51.0%, 0.016);
--hcl-koele-grijs-2a: hsla(210, 100%, 51.0%, 0.040);
--hcl-koele-grijs-3a: hsla(210, 100%, 50.3%, 0.071);
--hcl-koele-grijs-4a: hsla(210, 100%, 50.1%, 0.118);
--hcl-koele-grijs-5a: hsla(208, 99.1%, 47.1%, 0.189);
--hcl-koele-grijs-6a: hsla(209, 99.5%, 45.3%, 0.283);
--hcl-koele-grijs-7a: hsla(208, 99.9%, 43.8%, 0.412);
--hcl-koele-grijs-8a: hsla(206, 99.8%, 45.1%, 0.632);
--hcl-koele-grijs-9a: hsla(206, 100%, 50.0%, 0.980);
--hcl-koele-grijs-10a: hsla(208, 100%, 47.2%, 0.980);
--hcl-koele-grijs-11a: hsla(212, 100%, 43.0%, 0.980);
--hcl-koele-grijs-12a: hsla(213, 100%, 14.4%, 0.980);
}
:root:root[data-hsx*="dark"],
[data-hsx*="dark"],
[data-hsx*="invert"] {
--hsx-site-background: #121212;
--hsx-body-text-color: #adacac;
--hsx-headings-color: #fafafa;
--hcl-brand-1: #0b161a;
--hcl-brand-2: #101b20;
--hcl-brand-3: #082c36;
--hcl-brand-4: #003848;
--hcl-brand-5: #004558;
--hcl-brand-6: #045468;
--hcl-brand-7: #12677e;
--hcl-brand-8: #11809c;
--hcl-brand-9: #00a2c7;
--hcl-brand-10: #23afd0;
--hcl-brand-11: #4ccce6;
--hcl-brand-12: #b6ecf7;
--hcl-brand-emphasis: #4ccce6;
--hcl-neutral-1: #121113;
--hcl-neutral-2: #1a191b;
--hcl-neutral-3: #232225;
--hcl-neutral-4: #2b292d;
--hcl-neutral-5: #323035;
--hcl-neutral-6: #3c393f;
--hcl-neutral-7: #49474e;
--hcl-neutral-8: #625f69;
--hcl-neutral-9: #ffffff;
--hcl-neutral-10: #aeaeae;
--hcl-neutral-11: #b5b2bc;
--hcl-neutral-12: #eeeef0;
--hcl-neutral-emphasis: #ffffff;
--hcl-on-neutral: #000000;
--hcl-turquoise-emphasis: #55caee;
--hcl-turquoise-1: #091418;
--hcl-turquoise-2: #0f1b1f;
--hcl-turquoise-3: #072b36;
--hcl-turquoise-4: #003848;
--hcl-turquoise-5: #004558;
--hcl-turquoise-6: #045468;
--hcl-turquoise-7: #12677e;
--hcl-turquoise-8: #13809d;
--hcl-turquoise-9: #00a2c7;
--hcl-turquoise-10: #0096ba;
--hcl-turquoise-11: #55caee;
--hcl-turquoise-12: #b8eafc;
--hcl-turquoise-1a: #005bec07;
--hcl-turquoise-2a: #00b6ff0e;
--hcl-turquoise-3a: #00b6fe27;
--hcl-turquoise-4a: #00b7fc3b;
--hcl-turquoise-5a: #00bdfd4c;
--hcl-turquoise-6a: #00c7fe5d;
--hcl-turquoise-7a: #12cbfd75;
--hcl-turquoise-8a: #14cdff96;
--hcl-turquoise-9a: #00cfffc3;
--hcl-turquoise-10a: #00ccffb5;
--hcl-turquoise-11a: #5ad8ffed;
--hcl-turquoise-12a: #baedfffc;
--hcl-accent-geel-emphasis: #ffe62b;
--hcl-accent-geel-1: #13120c;
--hcl-accent-geel-2: #1a1910;
--hcl-accent-geel-3: #282409;
--hcl-accent-geel-4: #332d00;
--hcl-accent-geel-5: #3f3700;
--hcl-accent-geel-6: #4c440e;
--hcl-accent-geel-7: #5f5720;
--hcl-accent-geel-8: #796f2b;
--hcl-accent-geel-9: #ffe62b;
--hcl-accent-geel-10: #f1dd50;
--hcl-accent-geel-11: #f2dd51;
--hcl-accent-geel-12: #f4edb8;
--hcl-accent-geel-1a: #92120002;
--hcl-accent-geel-2a: #f5d90009;
--hcl-accent-geel-3a: #fcd20018;
--hcl-accent-geel-4a: #fcd20024;
--hcl-accent-geel-5a: #fcd20031;
--hcl-accent-geel-6a: #fcdc023f;
--hcl-accent-geel-7a: #ffe63e53;
--hcl-accent-geel-8a: #ffe84c6f;
--hcl-accent-geel-9a: #ffe62b;
--hcl-accent-geel-10a: #ffea54f0;
--hcl-accent-geel-11a: #fee854f2;
--hcl-accent-geel-12a: #fef7bff4;
--hcl-licht-geel-emphasis: #ff9b6f;
--hcl-licht-geel-1: #17100e;
--hcl-licht-geel-2: #201510;
--hcl-licht-geel-3: #371a0f;
--hcl-licht-geel-4: #4e1901;
--hcl-licht-geel-5: #5d2105;
--hcl-licht-geel-6: #6c2f16;
--hcl-licht-geel-7: #844023;
--hcl-licht-geel-8: #aa522d;
--hcl-licht-geel-9: #ff6100;
--hcl-licht-geel-10: #f15400;
--hcl-licht-geel-11: #ff9b6f;
--hcl-licht-geel-12: #ffdac9;
--hcl-licht-geel-1a: #e7000006;
--hcl-licht-geel-2a: #f2420010;
--hcl-licht-geel-3a: #fe450028;
--hcl-licht-geel-4a: #fe2e0041;
--hcl-licht-geel-5a: #ff420051;
--hcl-licht-geel-6a: #ff5f1d61;
--hcl-licht-geel-7a: #ff72367b;
--hcl-licht-geel-8a: #ff763ca4;
--hcl-licht-geel-9a: #ff6100;
--hcl-licht-geel-10a: #ff5800f0;
--hcl-licht-geel-11a: #ff9b6f;
--hcl-licht-geel-12a: #ffdac9;
--hcl-warm-koraal-emphasis: #ff977d;
--hcl-warm-koraal-1: #181111;
--hcl-warm-koraal-2: #1f1513;
--hcl-warm-koraal-3: #391714;
--hcl-warm-koraal-4: #4e1511;
--hcl-warm-koraal-5: #5e1c16;
--hcl-warm-koraal-6: #6e2920;
--hcl-warm-koraal-7: #853a2d;
--hcl-warm-koraal-8: #ac4d39;
--hcl-warm-koraal-9: #e54d2e;
--hcl-warm-koraal-10: #ec6142;
--hcl-warm-koraal-11: #ff977d;
--hcl-warm-koraal-12: #fbd3cb;
--hcl-warm-koraal-1a: hsla(0, 0%, 0%, 0);
--hcl-warm-koraal-2a: hsla(5, 100%, 49.6%, 0.058);
--hcl-warm-koraal-3a: hsla(6, 99.6%, 54.9%, 0.133);
--hcl-warm-koraal-4a: hsla(6, 99.2%, 55.4%, 0.191);
--hcl-warm-koraal-5a: hsla(6, 99.5%, 55.8%, 0.244);
--hcl-warm-koraal-6a: hsla(7, 99.7%, 55.9%, 0.319);
--hcl-warm-koraal-7a: hsla(8, 99.8%, 54.8%, 0.434);
--hcl-warm-koraal-8a: hsla(10, 99.8%, 53.5%, 0.598);
--hcl-warm-koraal-9a: hsla(10, 100%, 59.7%, 0.885);
--hcl-warm-koraal-10a: hsla(10, 100%, 63.6%, 0.916);
--hcl-warm-koraal-11a: hsla(10, 99.7%, 66.4%, 0.939);
--hcl-warm-koraal-12a: hsla(12, 100%, 97.1%, 0.980);
--hcl-zachte-beige-emphasis: #f4f1de;
--hcl-zachte-beige-1: #17150c;
--hcl-zachte-beige-2: #1c1a0e;
--hcl-zachte-beige-3: #2d2808;
--hcl-zachte-beige-4: #3a3200;
--hcl-zachte-beige-5: #473d00;
--hcl-zachte-beige-6: #615405;
--hcl-zachte-beige-7: #6e6218;
--hcl-zachte-beige-8: #857621;
--hcl-zachte-beige-9: #f4f1de;
--hcl-zachte-beige-10: #fffff0;
--hcl-zachte-beige-11: #ffe22e;
--hcl-zachte-beige-12: #fff5ba;
--hcl-zachte-beige-1a: hsla(0, 0%, 0%, 0);
--hcl-zachte-beige-2a: hsla(64.8, 100%, 49.02%, 0.031);
--hcl-zachte-beige-3a: hsla(60.71, 100%, 50%, 0.07);
--hcl-zachte-beige-4a: hsla(57.88, 100%, 50%, 0.105);
--hcl-zachte-beige-5a: hsla(57.88, 100%, 50%, 0.144);
--hcl-zachte-beige-6a: hsla(56.71, 100%, 50%, 0.192);
--hcl-zachte-beige-7a: hsla(55.76, 100%, 50%, 0.266);
--hcl-zachte-beige-8a: hsla(53.88, 100%, 50%, 0.366);
--hcl-zachte-beige-9a: hsla(51.97, 100%, 75.1%, 0.87);
--hcl-zachte-beige-10a: hsla(47.63, 100%, 80.98%, 0.948);
--hcl-zachte-beige-11a: hsla(51.67, 100%, 59.02%, 0.796);
--hcl-zachte-beige-12a: hsla(54, 100%, 96.08%, 0.98);
--hcl-koele-grijs-emphasis: #a8abad;
--hcl-koele-grijs-1: #0e1316;
--hcl-koele-grijs-2: #131b20;
--hcl-koele-grijs-3: #19252d;
--hcl-koele-grijs-4: #1e2e39;
--hcl-koele-grijs-5: #243947;
--hcl-koele-grijs-6: #2c4657;
--hcl-koele-grijs-7: #36566b;
--hcl-koele-grijs-8: #406b87;
--hcl-koele-grijs-9: #a8abad;
--hcl-koele-grijs-10: #b9bcbe;
--hcl-koele-grijs-11: #8ec6eb;
--hcl-koele-grijs-12: #cde7f9;
--hcl-koele-grijs-1a: hsla(0, 0%, 0%, 0);
--hcl-koele-grijs-2a: hsla(206.67, 87.97%, 73.92%, 0.027);
--hcl-koele-grijs-3a: hsla(197.44, 100%, 83.14%, 0.074);
--hcl-koele-grijs-4a: hsla(205.16, 95.88%, 80.98%, 0.114);
--hcl-koele-grijs-5a: hsla(205.05, 100%, 82.16%, 0.148);
--hcl-koele-grijs-6a: hsla(202, 97.83%, 81.96%, 0.192);
--hcl-koele-grijs-7a: hsla(203.02, 100%, 83.14%, 0.27);
--hcl-koele-grijs-8a: hsla(205.12, 100%, 83.14%, 0.396);
--hcl-koele-grijs-9a: hsla(205.26, 100%, 85.1%, 0.592);
--hcl-koele-grijs-10a: hsla(205.26, 100%, 85.1%, 0.657);
--hcl-koele-grijs-11a: hsla(204.51, 100%, 86.08%, 0.774);
--hcl-koele-grijs-12a: hsla(207, 100%, 96.08%, 0.974);
}
:root {
/*Theme Headspin*/
--hsx-page-width: 1200px;
--hsx-min-offset: 20px;
--hsx-page-gap: 20px;
/*Breakdance connector*/
--hsx-bleed-offset: max(calc(((100vw - (var(--bde-section-width))) / 2) + var(--bde-section-horizontal-padding)), calc(var(--bde-section-horizontal-padding) + 5px));
}
:root {
--hsx-page-display: grid;
}
@media (max-width: 1406px) {
body {
--hsx-page-display: flex;
}
}
::selection {
background-color: var(--hcl-neutral-12);
color: var(--hcl-neutral-1);
-webkit-text-fill-color: var(--hcl-neutral-1);
}
:root {
--headspin-theme-API: eyJ0aGVtZSI6ImxpZ2h0In0=;
}
[data-hsx*="overlay"] *:not(button, [class*=button]) {
color: white !important;
text-shadow: 1px 1px 0px black,
-1px -1px 0px black,
1px -1px 0px black,
-1px 1px 0px black,
1px 0px 0px black,
-1px 0px 0px black,
0px 1px 0px black,
0px -1px 0px black,
2px 2px 0px black,
-2px -2px 0px black,
2px -2px 0px black,
-2px 2px 0px black,
2px 0px 0px black,
-2px 0px 0px black,
0px 2px 0px black,
0px -2px 0px black;
}
:root {
--hsx-safe-overlay: rgba(0, 0, 0, .6)
}
h1,
h2,
h3,
h4,
h5,
h6,
p,
div {
line-height: calc(4px + 2ex)
}
[data-hsx-brand="neutral"] {
--hcl-brand-1: var(--hcl-neutral-1);
--hcl-brand-1a: var(--hcl-neutral-1a);
--hcl-brand-2: var(--hcl-neutral-2);
--hcl-brand-2a: var(--hcl-neutral-2a);
--hcl-brand-3: var(--hcl-neutral-3);
--hcl-brand-3a: var(--hcl-neutral-3a);
--hcl-brand-4: var(--hcl-neutral-4);
--hcl-brand-4a: var(--hcl-neutral-4a);
--hcl-brand-5: var(--hcl-neutral-5);
--hcl-brand-5a: var(--hcl-neutral-5a);
--hcl-brand-6: var(--hcl-neutral-6);
--hcl-brand-6a: var(--hcl-neutral-6a);
--hcl-brand-7: var(--hcl-neutral-7);
--hcl-brand-7a: var(--hcl-neutral-7a);
--hcl-brand-8: var(--hcl-neutral-8);
--hcl-brand-8a: var(--hcl-neutral-8a);
--hcl-brand-9: var(--hcl-neutral-9);
--hcl-brand-9a: var(--hcl-neutral-9a);
--hcl-brand-10: var(--hcl-neutral-10);
--hcl-brand-10a: var(--hcl-neutral-10a);
--hcl-brand-11: var(--hcl-neutral-11);
--hcl-brand-11a: var(--hcl-neutral-11a);
--hcl-brand-12: var(--hcl-neutral-12);
--hcl-brand-12a: var(--hcl-neutral-12a);
--hcl-on-brand: var(--hcl-on-neutral);
--hcl-brand-emphasis: var(--hcl-neutral-emphasis);
}
[data-hsx-brand="turquoise"] {
--hcl-brand-1: var(--hcl-turquoise-1);
--hcl-brand-1a: var(--hcl-turquoise-1a);
--hcl-brand-2: var(--hcl-turquoise-2);
--hcl-brand-2a: var(--hcl-turquoise-2a);
--hcl-brand-3: var(--hcl-turquoise-3);
--hcl-brand-3a: var(--hcl-turquoise-3a);
--hcl-brand-4: var(--hcl-turquoise-4);
--hcl-brand-4a: var(--hcl-turquoise-4a);
--hcl-brand-5: var(--hcl-turquoise-5);
--hcl-brand-5a: var(--hcl-turquoise-5a);
--hcl-brand-6: var(--hcl-turquoise-6);
--hcl-brand-6a: var(--hcl-turquoise-6a);
--hcl-brand-7: var(--hcl-turquoise-7);
--hcl-brand-7a: var(--hcl-turquoise-7a);
--hcl-brand-8: var(--hcl-turquoise-8);
--hcl-brand-8a: var(--hcl-turquoise-8a);
--hcl-brand-9: var(--hcl-turquoise-9);
--hcl-brand-9a: var(--hcl-turquoise-9a);
--hcl-brand-10: var(--hcl-turquoise-10);
--hcl-brand-10a: var(--hcl-turquoise-10a);
--hcl-brand-11: var(--hcl-turquoise-11);
--hcl-brand-11a: var(--hcl-turquoise-11a);
--hcl-brand-12: var(--hcl-turquoise-12);
--hcl-brand-12a: var(--hcl-turquoise-12a);
--hcl-on-brand: var(--hcl-on-turquoise);
--hcl-brand-emphasis: var(--hcl-turquoise-emphasis);
}
[data-hsx-brand="accent-geel"] {
--hcl-brand-1: var(--hcl-accent-geel-1);
--hcl-brand-1a: var(--hcl-accent-geel-1a);
--hcl-brand-2: var(--hcl-accent-geel-2);
--hcl-brand-2a: var(--hcl-accent-geel-2a);
--hcl-brand-3: var(--hcl-accent-geel-3);
--hcl-brand-3a: var(--hcl-accent-geel-3a);
--hcl-brand-4: var(--hcl-accent-geel-4);
--hcl-brand-4a: var(--hcl-accent-geel-4a);
--hcl-brand-5: var(--hcl-accent-geel-5);
--hcl-brand-5a: var(--hcl-accent-geel-5a);
--hcl-brand-6: var(--hcl-accent-geel-6);
--hcl-brand-6a: var(--hcl-accent-geel-6a);
--hcl-brand-7: var(--hcl-accent-geel-7);
--hcl-brand-7a: var(--hcl-accent-geel-7a);
--hcl-brand-8: var(--hcl-accent-geel-8);
--hcl-brand-8a: var(--hcl-accent-geel-8a);
--hcl-brand-9: var(--hcl-accent-geel-9);
--hcl-brand-9a: var(--hcl-accent-geel-9a);
--hcl-brand-10: var(--hcl-accent-geel-10);
--hcl-brand-10a: var(--hcl-accent-geel-10a);
--hcl-brand-11: var(--hcl-accent-geel-11);
--hcl-brand-11a: var(--hcl-accent-geel-11a);
--hcl-brand-12: var(--hcl-accent-geel-12);
--hcl-brand-12a: var(--hcl-accent-geel-12a);
--hcl-on-brand: var(--hcl-on-accent-geel);
--hcl-brand-emphasis: var(--hcl-accent-geel-emphasis);
}
[data-hsx-brand="licht-geel"] {
--hcl-brand-1: var(--hcl-licht-geel-1);
--hcl-brand-1a: var(--hcl-licht-geel-1a);
--hcl-brand-2: var(--hcl-licht-geel-2);
--hcl-brand-2a: var(--hcl-licht-geel-2a);
--hcl-brand-3: var(--hcl-licht-geel-3);
--hcl-brand-3a: var(--hcl-licht-geel-3a);
--hcl-brand-4: var(--hcl-licht-geel-4);
--hcl-brand-4a: var(--hcl-licht-geel-4a);
--hcl-brand-5: var(--hcl-licht-geel-5);
--hcl-brand-5a: var(--hcl-licht-geel-5a);
--hcl-brand-6: var(--hcl-licht-geel-6);
--hcl-brand-6a: var(--hcl-licht-geel-6a);
--hcl-brand-7: var(--hcl-licht-geel-7);
--hcl-brand-7a: var(--hcl-licht-geel-7a);
--hcl-brand-8: var(--hcl-licht-geel-8);
--hcl-brand-8a: var(--hcl-licht-geel-8a);
--hcl-brand-9: var(--hcl-licht-geel-9);
--hcl-brand-9a: var(--hcl-licht-geel-9a);
--hcl-brand-10: var(--hcl-licht-geel-10);
--hcl-brand-10a: var(--hcl-licht-geel-10a);
--hcl-brand-11: var(--hcl-licht-geel-11);
--hcl-brand-11a: var(--hcl-licht-geel-11a);
--hcl-brand-12: var(--hcl-licht-geel-12);
--hcl-brand-12a: var(--hcl-licht-geel-12a);
--hcl-on-brand: var(--hcl-on-licht-geel);
--hcl-brand-emphasis: var(--hcl-licht-geel-emphasis);
}
[data-hsx-brand="warm-koraal"] {
--hcl-brand-1: var(--hcl-warm-koraal-1);
--hcl-brand-1a: var(--hcl-warm-koraal-1a);
--hcl-brand-2: var(--hcl-warm-koraal-2);
--hcl-brand-2a: var(--hcl-warm-koraal-2a);
--hcl-brand-3: var(--hcl-warm-koraal-3);
--hcl-brand-3a: var(--hcl-warm-koraal-3a);
--hcl-brand-4: var(--hcl-warm-koraal-4);
--hcl-brand-4a: var(--hcl-warm-koraal-4a);
--hcl-brand-5: var(--hcl-warm-koraal-5);
--hcl-brand-5a: var(--hcl-warm-koraal-5a);
--hcl-brand-6: var(--hcl-warm-koraal-6);
--hcl-brand-6a: var(--hcl-warm-koraal-6a);
--hcl-brand-7: var(--hcl-warm-koraal-7);
--hcl-brand-7a: var(--hcl-warm-koraal-7a);
--hcl-brand-8: var(--hcl-warm-koraal-8);
--hcl-brand-8a: var(--hcl-warm-koraal-8a);
--hcl-brand-9: var(--hcl-warm-koraal-9);
--hcl-brand-9a: var(--hcl-warm-koraal-9a);
--hcl-brand-10: var(--hcl-warm-koraal-10);
--hcl-brand-10a: var(--hcl-warm-koraal-10a);
--hcl-brand-11: var(--hcl-warm-koraal-11);
--hcl-brand-11a: var(--hcl-warm-koraal-11a);
--hcl-brand-12: var(--hcl-warm-koraal-12);
--hcl-brand-12a: var(--hcl-warm-koraal-12a);
--hcl-on-brand: var(--hcl-on-warm-koraal);
--hcl-brand-emphasis: var(--hcl-warm-koraal-emphasis);
}
[data-hsx-brand="zachte-beige"] {
--hcl-brand-1: var(--hcl-zachte-beige-1);
--hcl-brand-1a: var(--hcl-zachte-beige-1a);
--hcl-brand-2: var(--hcl-zachte-beige-2);
--hcl-brand-2a: var(--hcl-zachte-beige-2a);
--hcl-brand-3: var(--hcl-zachte-beige-3);
--hcl-brand-3a: var(--hcl-zachte-beige-3a);
--hcl-brand-4: var(--hcl-zachte-beige-4);
--hcl-brand-4a: var(--hcl-zachte-beige-4a);
--hcl-brand-5: var(--hcl-zachte-beige-5);
--hcl-brand-5a: var(--hcl-zachte-beige-5a);
--hcl-brand-6: var(--hcl-zachte-beige-6);
--hcl-brand-6a: var(--hcl-zachte-beige-6a);
--hcl-brand-7: var(--hcl-zachte-beige-7);
--hcl-brand-7a: var(--hcl-zachte-beige-7a);
--hcl-brand-8: var(--hcl-zachte-beige-8);
--hcl-brand-8a: var(--hcl-zachte-beige-8a);
--hcl-brand-9: var(--hcl-zachte-beige-9);
--hcl-brand-9a: var(--hcl-zachte-beige-9a);
--hcl-brand-10: var(--hcl-zachte-beige-10);
--hcl-brand-10a: var(--hcl-zachte-beige-10a);
--hcl-brand-11: var(--hcl-zachte-beige-11);
--hcl-brand-11a: var(--hcl-zachte-beige-11a);
--hcl-brand-12: var(--hcl-zachte-beige-12);
--hcl-brand-12a: var(--hcl-zachte-beige-12a);
--hcl-on-brand: var(--hcl-on-zachte-beige);
--hcl-brand-emphasis: var(--hcl-zachte-beige-emphasis);
}
[data-hsx-brand="koele-grijs"] {
--hcl-brand-1: var(--hcl-koele-grijs-1);
--hcl-brand-1a: var(--hcl-koele-grijs-1a);
--hcl-brand-2: var(--hcl-koele-grijs-2);
--hcl-brand-2a: var(--hcl-koele-grijs-2a);
--hcl-brand-3: var(--hcl-koele-grijs-3);
--hcl-brand-3a: var(--hcl-koele-grijs-3a);
--hcl-brand-4: var(--hcl-koele-grijs-4);
--hcl-brand-4a: var(--hcl-koele-grijs-4a);
--hcl-brand-5: var(--hcl-koele-grijs-5);
--hcl-brand-5a: var(--hcl-koele-grijs-5a);
--hcl-brand-6: var(--hcl-koele-grijs-6);
--hcl-brand-6a: var(--hcl-koele-grijs-6a);
--hcl-brand-7: var(--hcl-koele-grijs-7);
--hcl-brand-7a: var(--hcl-koele-grijs-7a);
--hcl-brand-8: var(--hcl-koele-grijs-8);
--hcl-brand-8a: var(--hcl-koele-grijs-8a);
--hcl-brand-9: var(--hcl-koele-grijs-9);
--hcl-brand-9a: var(--hcl-koele-grijs-9a);
--hcl-brand-10: var(--hcl-koele-grijs-10);
--hcl-brand-10a: var(--hcl-koele-grijs-10a);
--hcl-brand-11: var(--hcl-koele-grijs-11);
--hcl-brand-11a: var(--hcl-koele-grijs-11a);
--hcl-brand-12: var(--hcl-koele-grijs-12);
--hcl-brand-12a: var(--hcl-koele-grijs-12a);
--hcl-on-brand: var(--hcl-on-koele-grijs);
--hcl-brand-emphasis: var(--hcl-koele-grijs-emphasis);
}
html:root {
/*Headspin System*/
--hrd-s: 6px;
--hrd-m: 8px;
--hrd-l: 12px;
--hrd-pill: 500px;
--hrd-atom: 6px;
}
html:root {
/*Headspin System*/
--hfs-h0: clamp(3.0625rem, 2.151rem + 3.044vw, 4.75rem);
--hfs-h1: clamp(2.4375rem, 1.830rem + 2.029vw, 3.5625rem);
--hfs-h2: clamp(1.9375rem, 1.532rem + 1.353vw, 2.6875rem);
--hfs-h3: clamp(1.5625rem, 1.326rem + 0.789vw, 2rem);
--hfs-h4: clamp(1.25rem, 1.115rem + 0.451vw, 1.5rem);
--hfs-h5: clamp(1rem, 0.932rem + 0.225vw, 1.125rem);
--hfs-h6: clamp(1rem, 0.932rem + 0.225vw, 1.125rem);
--hfs-text-l: clamp(1.25rem, 1.115rem + 0.451vw, 1.5rem);
--hfs-text-m: clamp(1rem, 0.932rem + 0.225vw, 1.125rem);
--hfs-text-s: clamp(0.875rem, 0.875rem + 0.000vw, 0.875rem);
--hsp-xxl: clamp(3.5625rem, 2.921rem + 2.142vw, 4.75rem);
--hsp-xl: clamp(2.6875rem, 2.215rem + 1.578vw, 3.5625rem);
--hsp-l: clamp(2rem, 1.629rem + 1.240vw, 2.6875rem);
--hsp-m: clamp(1.5rem, 1.230rem + 0.902vw, 2rem);
--hsp-s: clamp(1.125rem, 0.922rem + 0.676vw, 1.5rem);
--hsp-xs: clamp(0.8125rem, 0.644rem + 0.564vw, 1.125rem);
--hsp-xxs: clamp(0.625rem, 0.524rem + 0.338vw, 0.8125rem);
--hss-xxl: clamp(10.6875rem, 8.797rem + 6.313vw, 14.1875rem);
--hss-xl: clamp(8rem, 6.549rem + 4.848vw, 10.6875rem);
--hss-l: clamp(6rem, 4.920rem + 3.608vw, 8rem);
--hss-m: clamp(4.5rem, 3.690rem + 2.706vw, 6rem);
--hss-s: clamp(3.375rem, 2.767rem + 2.029vw, 4.5rem);
--hss-xs: clamp(2.5rem, 2.027rem + 1.578vw, 3.375rem);
--hss-xxs: clamp(1.875rem, 1.537rem + 1.127vw, 2.5rem);
}
@supports (font-size: 1cqi) {
html:root {
--hfs-h0: clamp(3.0625rem, 2.151rem + 3.044cqi, 4.75rem);
--hfs-h1: clamp(2.4375rem, 1.830rem + 2.029cqi, 3.5625rem);
--hfs-h2: clamp(1.9375rem, 1.532rem + 1.353cqi, 2.6875rem);
--hfs-h3: clamp(1.5625rem, 1.326rem + 0.789cqi, 2rem);
--hfs-h4: clamp(1.25rem, 1.115rem + 0.451cqi, 1.5rem);
--hfs-h5: clamp(1rem, 0.932rem + 0.225cqi, 1.125rem);
--hfs-h6: clamp(1rem, 0.932rem + 0.225cqi, 1.125rem);
--hfs-text-l: clamp(1.25rem, 1.115rem + 0.451cqi, 1.5rem);
--hfs-text-m: clamp(1rem, 0.932rem + 0.225cqi, 1.125rem);
--hfs-text-s: clamp(0.875rem, 0.875rem + 0.000cqi, 0.875rem);
--hsp-xxl: clamp(3.5625rem, 2.921rem + 2.142cqi, 4.75rem);
--hsp-xl: clamp(2.6875rem, 2.215rem + 1.578cqi, 3.5625rem);
--hsp-l: clamp(2rem, 1.629rem + 1.240cqi, 2.6875rem);
--hsp-m: clamp(1.5rem, 1.230rem + 0.902cqi, 2rem);
--hsp-s: clamp(1.125rem, 0.922rem + 0.676cqi, 1.5rem);
--hsp-xs: clamp(0.8125rem, 0.644rem + 0.564cqi, 1.125rem);
--hsp-xxs: clamp(0.625rem, 0.524rem + 0.338cqi, 0.8125rem);
--hss-xxl: clamp(10.6875rem, 8.797rem + 6.313cqi, 14.1875rem);
--hss-xl: clamp(8rem, 6.549rem + 4.848cqi, 10.6875rem);
--hss-l: clamp(6rem, 4.920rem + 3.608cqi, 8rem);
--hss-m: clamp(4.5rem, 3.690rem + 2.706cqi, 6rem);
--hss-s: clamp(3.375rem, 2.767rem + 2.029cqi, 4.5rem);
--hss-xs: clamp(2.5rem, 2.027rem + 1.578cqi, 3.375rem);
--hss-xxs: clamp(1.875rem, 1.537rem + 1.127cqi, 2.5rem);
}
}
html:root,
[data-hsx*="light"],
html:root[data-hsx*="dark"] [data-hsx*="inverted"] {
--bde-headings-color: var(--hcl-neutral-12);
--bde-body-text-color: var(--hcl-neutral-11);
--bde-background-color: var(--hcl-neutral-1);
--bde-brand-primary-color: var(--hcl-brand-9);
--bde-brand-primary-color-hover: var(--hcl-brand-10);
--bde-links-color: var(--hcl-brand-9);
--bde-links-color-hover: var(--hcl-brand-10);
}
:root:root[data-hsx*="dark"],
[data-hsx*="dark"],
html:root[data-hsx*="light"] [data-hsx*="invert"] {
--bde-headings-color: var(--hcl-neutral-12);
--bde-body-text-color: var(--hcl-neutral-11);
--bde-background-color: var(--hcl-neutral-1);
--bde-brand-primary-color: var(--hcl-brand-9);
--bde-brand-primary-color-hover: var(--hcl-brand-10);
--bde-links-color: var(--hcl-brand-9);
--bde-links-color-hover: var(--hcl-brand-10);
}
html:root {
--bde-h1-font-size: var(--hfs-h1);
--bde-h2-font-size: var(--hfs-h2);
--bde-h3-font-size: var(--hfs-h3);
--bde-h4-font-size: var(--hfs-h4);
--bde-h5-font-size: var(--hfs-h5);
--bde-h6-font-size: var(--hfs-h6);
--bde-body-font-size: var(--hfs-text-m);
}