@charset "UTF-8";
:root {
  --ease-none: linear(0, 1);
  --ease-power1-in: linear(0, 0.0039, 0.0156, 0.0352, 0.0625, 0.0977, 0.1407, 0.1914, 0.2499, 0.3164, 0.3906 62.5%, 0.5625, 0.7656, 1);
  --ease-power1-out: linear(0, 0.2342, 0.4374, 0.6093 37.49%, 0.6835, 0.7499, 0.8086, 0.8593, 0.9023, 0.9375, 0.9648, 0.9844, 0.9961, 1);
  --ease-power1-in-out: linear(
  	0,
  	0.0027,
  	0.0106 7.29%,
  	0.0425,
  	0.0957,
  	0.1701 29.16%,
  	0.2477,
  	0.3401 41.23%,
  	0.5982 55.18%,
  	0.7044 61.56%,
  	0.7987,
  	0.875 75%,
  	0.9297,
  	0.9687,
  	0.9922,
  	1
  );
  --ease-power2-in: linear(
  	0,
  	0.0014 11.11%,
  	0.0071 19.24%,
  	0.0188 26.6%,
  	0.037 33.33%,
  	0.0634 39.87%,
  	0.0978 46.07%,
  	0.1407 52.02%,
  	0.1925 57.74%,
  	0.2559 63.49%,
  	0.3295 69.07%,
  	0.4135 74.5%,
  	0.5083 79.81%,
  	0.6141 85%,
  	0.7312 90.09%,
  	1
  );
  --ease-power2-out: linear(
  	0,
  	0.2688 9.91%,
  	0.3859 15%,
  	0.4917 20.19%,
  	0.5865 25.5%,
  	0.6705 30.93%,
  	0.7441 36.51%,
  	0.8075 42.26%,
  	0.8593 47.98%,
  	0.9022 53.93%,
  	0.9366 60.13%,
  	0.963 66.67%,
  	0.9812 73.4%,
  	0.9929 80.76%,
  	0.9986 88.89%,
  	1
  );
  --ease-power2-in-out: linear(
  	0,
  	0.0036 9.62%,
  	0.0185 16.66%,
  	0.0489 23.03%,
  	0.0962 28.86%,
  	0.1705 34.93%,
  	0.269 40.66%,
  	0.3867 45.89%,
  	0.5833 52.95%,
  	0.683 57.05%,
  	0.7829 62.14%,
  	0.8621 67.46%,
  	0.8991 70.68%,
  	0.9299 74.03%,
  	0.9545 77.52%,
  	0.9735 81.21%,
  	0.9865 85%,
  	0.9949 89.15%,
  	1
  );
  --ease-power3-in: linear(
  	0,
  	0.0039 25%,
  	0.0117 32.89%,
  	0.0248 39.68%,
  	0.0457 46.22%,
  	0.0743 52.21%,
  	0.1113 57.77%,
  	0.1575 63%,
  	0.218 68.33%,
  	0.2901 73.39%,
  	0.3745 78.23%,
  	0.4718 82.88%,
  	0.5827 87.37%,
  	0.7074 91.71%,
  	0.8462 95.91%,
  	1
  );
  --ease-power3-out: linear(
  	0,
  	0.1538 4.09%,
  	0.2926 8.29%,
  	0.4173 12.63%,
  	0.5282 17.12%,
  	0.6255 21.77%,
  	0.7099 26.61%,
  	0.782 31.67%,
  	0.8425 37%,
  	0.8887 42.23%,
  	0.9257 47.79%,
  	0.9543 53.78%,
  	0.9752 60.32%,
  	0.9883 67.11%,
  	0.9961 75%,
  	1
  );
  --ease-power3-in-out: linear(
  	0,
  	0.0029 13.8%,
  	0.0184 21.9%,
  	0.0339 25.51%,
  	0.0551 28.81%,
  	0.0827 31.88%,
  	0.1168 34.76%,
  	0.1962 39.57%,
  	0.3005 44.02%,
  	0.4084 47.53%,
  	0.6242 53.45%,
  	0.7493 57.93%,
  	0.8495 62.97%,
  	0.8888 65.67%,
  	0.9213 68.51%,
  	0.9629 73.9%,
  	0.9876 80.16%,
  	0.998 87.5%,
  	1
  );
  --ease-power4-in: linear(
  	0,
  	0.0024 29.91%,
  	0.008 38.03%,
  	0.0179 44.72%,
  	0.035 51.16%,
  	0.0595 56.88%,
  	0.0922 62.08%,
  	0.1338 66.88%,
  	0.1914 71.85%,
  	0.262 76.5%,
  	0.3461 80.88%,
  	0.4447 85.04%,
  	0.5587 89.01%,
  	0.689 92.82%,
  	0.8359 96.48%,
  	1
  );
  --ease-power4-out: linear(
  	0,
  	0.1641 3.52%,
  	0.311 7.18%,
  	0.4413 10.99%,
  	0.5553 14.96%,
  	0.6539 19.12%,
  	0.738 23.5%,
  	0.8086 28.15%,
  	0.8662 33.12%,
  	0.9078 37.92%,
  	0.9405 43.12%,
  	0.965 48.84%,
  	0.9821 55.28%,
  	0.992 61.97%,
  	0.9976 70.09%,
  	1
  );
  --ease-power4-in-out: linear(
  	0,
  	0.0012 14.95%,
  	0.0089 22.36%,
  	0.0297 28.43%,
  	0.0668 33.43%,
  	0.0979 36.08%,
  	0.1363 38.55%,
  	0.2373 43.07%,
  	0.3675 47.01%,
  	0.5984 52.15%,
  	0.7121 55.23%,
  	0.8192 59.21%,
  	0.898 63.62%,
  	0.9297 66.23%,
  	0.9546 69.06%,
  	0.9733 72.17%,
  	0.9864 75.67%,
  	0.9982 83.73%,
  	1
  );
  --ease-quad-in: linear(0, 0.0039, 0.0156, 0.0352, 0.0625, 0.0977, 0.1407, 0.1914, 0.2499, 0.3164, 0.3906 62.5%, 0.5625, 0.7656, 1);
  --ease-quad-out: linear(0, 0.2342, 0.4374, 0.6093 37.49%, 0.6835, 0.7499, 0.8086, 0.8593, 0.9023, 0.9375, 0.9648, 0.9844, 0.9961, 1);
  --ease-quad-in-out: linear(
  	0,
  	0.0027,
  	0.0106 7.29%,
  	0.0425,
  	0.0957,
  	0.1701 29.16%,
  	0.2477,
  	0.3401 41.23%,
  	0.5982 55.18%,
  	0.7044 61.56%,
  	0.7987,
  	0.875 75%,
  	0.9297,
  	0.9687,
  	0.9922,
  	1
  );
  --ease-expo-in: linear(
  	0,
  	0.0085 31.26%,
  	0.0167 40.94%,
  	0.0289 48.86%,
  	0.0471 55.92%,
  	0.0717 61.99%,
  	0.1038 67.32%,
  	0.1443 72.07%,
  	0.1989 76.7%,
  	0.2659 80.89%,
  	0.3465 84.71%,
  	0.4419 88.22%,
  	0.554 91.48%,
  	0.6835 94.51%,
  	0.8316 97.34%,
  	1
  );
  --ease-expo-out: linear(
  	0,
  	0.1684 2.66%,
  	0.3165 5.49%,
  	0.446 8.52%,
  	0.5581 11.78%,
  	0.6535 15.29%,
  	0.7341 19.11%,
  	0.8011 23.3%,
  	0.8557 27.93%,
  	0.8962 32.68%,
  	0.9283 38.01%,
  	0.9529 44.08%,
  	0.9711 51.14%,
  	0.9833 59.06%,
  	0.9915 68.74%,
  	1
  );
  --ease-expo-in-out: linear(
  	0,
  	0.0053 17.18%,
  	0.0195 26.59%,
  	0.0326 30.31%,
  	0.0506 33.48%,
  	0.0744 36.25%,
  	0.1046 38.71%,
  	0.1798 42.62%,
  	0.2846 45.93%,
  	0.3991 48.37%,
  	0.6358 52.29%,
  	0.765 55.45%,
  	0.8622 59.3%,
  	0.8986 61.51%,
  	0.9279 63.97%,
  	0.9481 66.34%,
  	0.9641 69.01%,
  	0.9856 75.57%,
  	0.9957 84.37%,
  	1
  );
  --ease-circ-in: linear(
  	-0,
  	0.0048 9.8%,
  	0.0192 19.5%,
  	0.043 29.02%,
  	0.0761 38.26%,
  	0.1181 47.13%,
  	0.1685 55.56%,
  	0.227 63.44%,
  	0.2929 70.71%,
  	0.3656 77.3%,
  	0.4445 83.15%,
  	0.5285 88.19%,
  	0.6173 92.39%,
  	0.7099 95.7%,
  	0.805 98.08%,
  	0.9021 99.52%,
  	1
  );
  --ease-circ-out: linear(
  	0,
  	0.0979 0.48%,
  	0.195 1.92%,
  	0.2901 4.3%,
  	0.3827 7.61%,
  	0.4715 11.81%,
  	0.5555 16.85%,
  	0.6344 22.7%,
  	0.7071 29.29%,
  	0.773 36.56%,
  	0.8315 44.44%,
  	0.8819 52.87%,
  	0.9239 61.74%,
  	0.957 70.98%,
  	0.9808 80.5%,
  	0.9952 90.2%,
  	1
  );
  --ease-circ-in-out: linear(
  	-0,
  	0.0033 5.75%,
  	0.0132 11.43%,
  	0.0296 16.95%,
  	0.0522 22.25%,
  	0.0808 27.25%,
  	0.1149 31.89%,
  	0.1542 36.11%,
  	0.1981 39.85%,
  	0.2779 44.79%,
  	0.3654 48.15%,
  	0.4422 49.66%,
  	0.5807 50.66%,
  	0.6769 53.24%,
  	0.7253 55.37%,
  	0.7714 58.01%,
  	0.8142 61.11%,
  	0.8536 64.65%,
  	0.9158 72.23%,
  	0.9619 80.87%,
  	0.9904 90.25%,
  	1
  );
  --ease-sine-in: linear(
  	0,
  	0.0035,
  	0.0141 10.7%,
  	0.0318 16.09%,
  	0.0566 21.51%,
  	0.0885 26.98%,
  	0.1278 32.53%,
  	0.2288 43.93%,
  	0.3563 55.48%,
  	0.5171 67.92%,
  	0.7139 81.53%,
  	1
  );
  --ease-sine-out: linear(
  	0,
  	0.2861 18.47%,
  	0.4829 32.08%,
  	0.6437 44.52%,
  	0.7712 56.07%,
  	0.8722 67.47%,
  	0.9115 73.02%,
  	0.9434 78.49%,
  	0.9682 83.91%,
  	0.9859 89.3%,
  	0.9965,
  	1
  );
  --ease-sine-in-out: linear(
  	0,
  	0.007 5.35%,
  	0.0282 10.75%,
  	0.0638 16.26%,
  	0.1144 21.96%,
  	0.1833 28.16%,
  	0.2717 34.9%,
  	0.6868 62.19%,
  	0.775 68.54%,
  	0.8457 74.3%,
  	0.9141 81.07%,
  	0.9621 87.52%,
  	0.9905 93.8%,
  	1
  );
  --ease-back-in: linear(
  	0,
  	-0.0029 4.31%,
  	-0.0119 9.02%,
  	-0.0837 31.27%,
  	-0.0954 36.64%,
  	-0.0998 41.45%,
  	-0.0951 47.03%,
  	-0.079 52.25%,
  	-0.051 57.19%,
  	-0.0108 61.92%,
  	0.0515 67.19%,
  	0.1312 72.27%,
  	0.2286 77.18%,
  	0.3445 81.96%,
  	0.4792 86.62%,
  	0.633 91.17%,
  	0.8066 95.63%,
  	1
  );
  --ease-back-out: linear(
  	0,
  	0.1934 4.37%,
  	0.367 8.83%,
  	0.5208 13.38%,
  	0.6555 18.04%,
  	0.7714 22.82%,
  	0.8688 27.73%,
  	0.9485 32.81%,
  	1.0108 38.08%,
  	1.051 42.81%,
  	1.079 47.75%,
  	1.0951 52.97%,
  	1.0998 58.55%,
  	1.0954 63.36%,
  	1.0837 68.73%,
  	1.0119 90.98%,
  	1.0029 95.69%,
  	1
  );
  --ease-back-in-out: linear(
  	0,
  	-0.0059 4.51%,
  	-0.0418 15.63%,
  	-0.0499 20.72%,
  	-0.0476 23.51%,
  	-0.0395 26.12%,
  	-0.0255 28.59%,
  	-0.0055 30.95%,
  	0.0281 33.76%,
  	0.0717 36.47%,
  	0.1901 41.63%,
  	0.344 46.32%,
  	0.6156 52.65%,
  	0.7495 56.35%,
  	0.8757 60.97%,
  	0.9663 65.85%,
  	1.0006 68.58%,
  	1.0256 71.43%,
  	1.0417 74.43%,
  	1.0493 77.65%,
  	1.0452 83.02%,
  	1.0077 94.8%,
  	1
  );
  --ease-elastic-in: linear(
  	0,
  	0.0019 13.34%,
  	-0.0056 27.76%,
  	-0.0012 31.86%,
  	0.0147 39.29%,
  	0.0161 42.46%,
  	0.0039 46.74%,
  	-0.0416 54.3%,
  	-0.046 57.29%,
  	-0.0357,
  	-0.0122 61.67%,
  	0.1176 69.29%,
  	0.1302 70.79%,
  	0.1306 72.16%,
  	0.1088 74.09%,
  	0.059 75.99%,
  	-0.0317 78.19%,
  	-0.3151 83.8%,
  	-0.3643 85.52%,
  	-0.3726,
  	-0.3705 87.06%,
  	-0.3463,
  	-0.2959 89.3%,
  	-0.1144 91.51%,
  	0.7822 97.9%,
  	1
  );
  --ease-elastic-out: linear(
  	0,
  	0.2178 2.1%,
  	1.1144 8.49%,
  	1.2959 10.7%,
  	1.3463 11.81%,
  	1.3705 12.94%,
  	1.3726,
  	1.3643 14.48%,
  	1.3151 16.2%,
  	1.0317 21.81%,
  	0.941 24.01%,
  	0.8912 25.91%,
  	0.8694 27.84%,
  	0.8698 29.21%,
  	0.8824 30.71%,
  	1.0122 38.33%,
  	1.0357,
  	1.046 42.71%,
  	1.0416 45.7%,
  	0.9961 53.26%,
  	0.9839 57.54%,
  	0.9853 60.71%,
  	1.0012 68.14%,
  	1.0056 72.24%,
  	0.9981 86.66%,
  	1
  );
  --ease-elastic-in-out: linear(
  	0,
  	-0.0028 13.88%,
  	0.0081 21.23%,
  	0.002 23.37%,
  	-0.0208 27.14%,
  	-0.023 28.64%,
  	-0.0178,
  	-0.0061 30.83%,
  	0.0588 34.64%,
  	0.0651 35.39%,
  	0.0653 36.07%,
  	0.0514,
  	0.0184 38.3%,
  	-0.1687 42.21%,
  	-0.1857 43.04%,
  	-0.181 43.8%,
  	-0.1297 44.93%,
  	-0.0201 46.08%,
  	1.0518 54.2%,
  	1.1471,
  	1.1853 56.48%,
  	1.1821 57.25%,
  	1.1573 58.11%,
  	0.9709 62%,
  	0.9458,
  	0.9347 63.92%,
  	0.9349 64.61%,
  	0.9412 65.36%,
  	1.0061 69.17%,
  	1.0178,
  	1.023 71.36%,
  	1.0208 72.86%,
  	0.998 76.63%,
  	0.9919 78.77%,
  	1.0028 86.12%,
  	1
  );
  --ease-bounce-in: linear(
  	0,
  	0.0117,
  	0.0156,
  	0.0117,
  	0,
  	0.0273,
  	0.0468,
  	0.0586,
  	0.0625,
  	0.0586,
  	0.0468,
  	0.0273,
  	0 27.27%,
  	0.1093,
  	0.1875 36.36%,
  	0.2148,
  	0.2343,
  	0.2461,
  	0.25,
  	0.2461,
  	0.2344,
  	0.2148 52.28%,
  	0.1875 54.55%,
  	0.1095,
  	0,
  	0.2341,
  	0.4375,
  	0.6092,
  	0.75,
  	0.8593,
  	0.9375 90.91%,
  	0.9648,
  	0.9843,
  	0.9961,
  	1
  );
  --ease-bounce-out: linear(
  	0,
  	0.0039,
  	0.0157,
  	0.0352,
  	0.0625 9.09%,
  	0.1407,
  	0.25,
  	0.3908,
  	0.5625,
  	0.7654,
  	1,
  	0.8907,
  	0.8125 45.45%,
  	0.7852,
  	0.7657,
  	0.7539,
  	0.75,
  	0.7539,
  	0.7657,
  	0.7852,
  	0.8125 63.64%,
  	0.8905,
  	1 72.73%,
  	0.9727,
  	0.9532,
  	0.9414,
  	0.9375,
  	0.9414,
  	0.9531,
  	0.9726,
  	1,
  	0.9883,
  	0.9844,
  	0.9883,
  	1
  );
  --ease-bounce-in-out: linear(
  	0,
  	0.0078,
  	0,
  	0.0235,
  	0.0313,
  	0.0235,
  	0.0001 13.63%,
  	0.0549 15.92%,
  	0.0938,
  	0.1172,
  	0.125,
  	0.1172,
  	0.0939 27.26%,
  	0.0554 29.51%,
  	0.0003 31.82%,
  	0.2192,
  	0.3751 40.91%,
  	0.4332,
  	0.4734 45.8%,
  	0.4947 48.12%,
  	0.5027 51.35%,
  	0.5153 53.19%,
  	0.5437,
  	0.5868 57.58%,
  	0.6579,
  	0.7504 62.87%,
  	0.9999 68.19%,
  	0.9453,
  	0.9061,
  	0.8828,
  	0.875,
  	0.8828,
  	0.9063,
  	0.9451 84.08%,
  	0.9999 86.37%,
  	0.9765,
  	0.9688,
  	0.9765,
  	1,
  	0.9922,
  	1
  );
}

/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Prevent font size inflation */
html {
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Remove default margin in favour of better control in authored CSS */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
  margin-block-end: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role=list],
ol[role=list] {
  list-style: none;
}

/* Set core body defaults */
body {
  min-height: 100vh;
  line-height: 1.5;
}

/* Set shorter line heights on headings and interactive elements */
h1,
h2,
h3,
h4,
button,
input,
label {
  line-height: 1.1;
}

/* Balance text wrapping on headings */
/* A elements that don't have a class get default styles */
a:not([class]) {
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
  color: currentColor;
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
  font: inherit;
}

/* Make sure textareas without a rows attribute are not tiny */
textarea:not([rows]) {
  min-height: 10em;
}

/* Anything that has been anchored to should have extra scroll margin */
:target {
  scroll-margin-block: 5ex;
}

/* reset all padding and margins */
html,
body,
p,
ol,
ul,
li,
dl,
dt,
dd,
blockquote,
figure,
fieldset,
legend,
textarea,
pre,
iframe,
hr,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
}

/* */
button,
input,
select {
  margin: 0;
}

/* reset all header sizes */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}

/* clears the ‘X’ from Internet Explorer */
input[type=search]::-ms-clear {
  display: none;
  width: 0;
  height: 0;
}

input[type=search]::-ms-reveal {
  display: none;
  width: 0;
  height: 0;
}

/* clears the ‘X’ from Chrome */
input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
  display: none;
}

:root {
  --color-blue: #5087b4;
  --color-navy: #325564;
  --color-green: #4b6928;
  --color-sage: #b4b49b;
  --color-yellow: #fabe50;
  --color-orange: #c3501e;
  --color-beige: #ecdeca;
  --color-beige-100: #efece6;
  --color-beige-300: #e3dcd2;
  --color-brown-900: #42342a;
  --color-green-100: #dbddd6;
  --color-green-200: #bbccc5;
  --color-green-900: #345550;
  --color-terracotta-100: #ecdfd6;
  --color-terracotta-700: #844941;
  --color-white: #ffffff;
  --color-black: #000000;
  --grid-columns: 12;
  --grid-gap: 0.5rem;
  --grid-gap-half: calc(var(--grid-gap) / 2);
  --grid-gap-neg: calc(var(--grid-gap) * -1);
}
@media (min-width: 768px) {
  :root {
    --grid-columns: 12;
    --grid-gap: 1.875rem;
  }
}
:root {
  --sp-100: 10px;
  --sp-200: 15px;
  --sp-250: 20px;
  --sp-300: 30px;
  --sp-400: 60px;
  --sp-450: 80px;
  --sp-475: 100px;
  --sp-500: 120px;
  --sp-600: 150px;
  --sp-800: 200px;
  --inset-shadow: inset 0 20px 20px -20px rgba(0, 0, 0, 0.25), inset 0 -20px 20px -20px rgba(0, 0, 0, 0.25);
  --drop-shadow: 0px 3px 20px rgba(0, 0, 0, 0.25);
  --nav-height: 4.375rem;
  --gap-flow: var(--sp-300);
  --gap-stack: var(--sp-450);
  --space-section: var(--sp-600);
  --cnt-max-width: 93.75rem;
  --cnt-margin: 1.25rem;
  --cnt-margin-ng: calc(var(--cnt-margin) * -1);
}
@media (min-width: 768px) {
  :root {
    --cnt-margin: 1.25rem;
  }
}
:root {
  --role-base: var(--color-beige-100);
  --role-alt: var(--color-beige-300);
  --role-deep: var(--color-brown-900);
  --role-ink: var(--color-brown-900);
  --role-accent: var(--color-brown-900);
  --role-accent-tint: var(--color-beige-300);
  --theme-bg: var(--role-base);
  --theme-bg-alt: var(--role-alt);
  --theme-text: var(--role-ink);
  --theme-accent: var(--role-accent);
  --theme-accent-tint: var(--role-accent-tint);
  --theme-btn-bg: var(--role-ink);
  --theme-btn-fg: var(--role-base);
}

[data-theme=brown] {
  --role-base: var(--color-beige-100);
  --role-alt: var(--color-beige-300);
  --role-deep: var(--color-brown-900);
  --role-ink: var(--color-brown-900);
  --role-accent: var(--color-brown-900);
  --role-accent-tint: var(--color-beige-300);
}

[data-theme=green] {
  --role-base: var(--color-beige-100);
  --role-alt: var(--color-green-100);
  --role-deep: var(--color-green-900);
  --role-ink: var(--color-brown-900);
  --role-accent: var(--color-green-900);
  --role-accent-tint: var(--color-green-200);
}

[data-theme=terracotta] {
  --role-base: var(--color-beige-100);
  --role-alt: var(--color-terracotta-100);
  --role-deep: var(--color-terracotta-700);
  --role-ink: var(--color-brown-900);
  --role-accent: var(--color-terracotta-700);
  --role-accent-tint: var(--color-terracotta-100);
}

[data-tone=base], [data-theme]:not([data-tone]) {
  --theme-bg: var(--role-base);
  --theme-bg-alt: var(--role-alt);
  --theme-text: var(--role-ink);
  --theme-accent: var(--role-accent);
  --theme-accent-tint: var(--role-accent-tint);
  --theme-btn-bg: var(--role-ink);
  --theme-btn-fg: var(--role-base);
}

[data-tone=alt] {
  --theme-bg: var(--role-alt);
  --theme-bg-alt: var(--role-base);
  --theme-text: var(--role-ink);
  --theme-accent: var(--role-accent);
  --theme-accent-tint: var(--role-base);
  --theme-btn-bg: var(--role-ink);
  --theme-btn-fg: var(--role-base);
}

[data-tone=deep] {
  --theme-bg: var(--role-deep);
  --theme-bg-alt: var(--role-alt);
  --theme-text: var(--role-base);
  --theme-accent: var(--role-base);
  --theme-accent-tint: var(--role-alt);
  --theme-btn-bg: var(--role-base);
  --theme-btn-fg: var(--role-deep);
}

@font-face {
  font-family: Figtree;
  src: url('/wp-content/themes/hetblauwekompas/dist/assets/fonts/figtree-latin-400-normal.woff2') format('woff2'), ,;
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Figtree;
  src: url('/wp-content/themes/hetblauwekompas/dist/assets/fonts/figtree-latin-500-normal.woff2') format('woff2'), ,;
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Figtree;
  src: url('/wp-content/themes/hetblauwekompas/dist/assets/fonts/figtree-latin-600-normal.woff2') format('woff2'), ,;
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Figtree;
  src: url('/wp-content/themes/hetblauwekompas/dist/assets/fonts/figtree-latin-700-normal.woff2') format('woff2'), ,;
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: NotoSerif;
  src: url('/wp-content/themes/hetblauwekompas/dist/assets/fonts/noto-serif-latin-500-normal.woff2') format('woff2'), ,;
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: OldBook;
  src: url('/wp-content/themes/hetblauwekompas/dist/assets/fonts/oldbook-itc-std.woff2') format('woff2'), ,;
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
html {
  --font-heading: 'Figtree', sans-serif;
  --font: 'Figtree', sans-serif;
  --font-serif: 'NotoSerif', serif;
  --font-oldbook: 'OldBook', serif;
  font-family: var(--font);
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}

body {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}

.container {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
}

.grid {
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  column-gap: var(--grid-gap);
}

.page-components {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  gap: var(--gap-stack, 5rem);
}

.components {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  row-gap: 2.1875rem;
}
@media (min-width: 1280px) {
  .components {
    row-gap: 12.5rem;
  }
}

body {
  background-color: var(--theme-bg, var(--color-white));
  color: var(--theme-text, var(--color-black));
}
body main {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}
body .main {
  flex: 1;
  z-index: 2;
  background-color: var(--theme-bg, var(--color-white));
  /* Rectangle 66 */
}
body .footer {
  z-index: 1;
  flex-shrink: 0;
}
body a {
  text-underline-offset: 0.12em;
}

.page-section {
  position: relative;
}

[data-tone],
[data-theme] {
  background-color: var(--theme-bg);
  color: var(--theme-text);
}

.page-section[data-tone] {
  --layer-pad: 4.6875rem;
  padding-top: calc(var(--layer-pad) + var(--wave-h, 0px));
  padding-bottom: var(--layer-pad);
}
@media (min-width: 1280px) {
  .page-section[data-tone] {
    --layer-pad: 9.375rem;
  }
}

[data-layer] {
  min-height: 100lvh;
}

.accordion .accordion__body {
  position: relative;
  overflow: hidden;
}
.accordion .accordion__row:not(.is-active) .accordion__body {
  max-height: 0;
}
.accordion .accordion__body {
  transition: max-height 0.2s ease-out;
}
@media (hover: hover) {
  .accordion .accordion__header {
    transition: color 0.2s ease-out;
  }
}

.activities-list__inner {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: var(--grid-gap);
}

.activity-list__item {
  flex-shrink: 0;
  width: calc(1 * (100% - 3 * var(--grid-gap)) / 4 + 0 * var(--grid-gap));
}

@media (max-width: 767px) {
  .activities-list__slider {
    margin-left: var(--cnt-margin-ng);
    margin-right: var(--cnt-margin-ng);
    padding-left: var(--cnt-margin);
    padding-right: var(--cnt-margin);
  }
  .activity-list__item {
    width: calc(7 * (100% - 11 * var(--grid-gap)) / 12 + 6 * var(--grid-gap));
  }
}
.activities-list__footer {
  display: none;
  flex-direction: row;
  justify-content: flex-end;
  gap: 0.25rem;
  margin-top: 1.25rem;
}

@media (hover: hover) and (pointer: fine) {
  .activities-list.is-scrollable .activities-list__footer {
    display: flex;
  }
}
.activities-list__arrow {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0.625rem;
  color: currentColor;
}
.activities-list__arrow svg.icon {
  display: block;
  aspect-ratio: 1/1;
  width: 1.875rem;
  color: currentColor;
}
.activities-list__arrow.is-disabled {
  opacity: 0.3;
  pointer-events: none;
}
@media (min-width: 1280px) {
  .activities-list__arrow svg.icon {
    width: 2.75rem;
  }
}

.activities-list__arrow--prev {
  transform: rotate(180deg);
}

.activity-card__date {
  display: block;
  padding-bottom: 0.625rem;
}

.activity-card__excerpt {
  margin-top: 0.625rem;
}

.activity-card__content {
  padding-top: 1.25rem;
}

.activity-card__footer {
  margin-top: 1.25rem;
}

@media (min-width: 1280px) {
  .activity-card__content {
    padding-top: 1.875rem;
  }
  .activity-card__footer {
    margin-top: 1.875rem;
  }
}
.archive-list__inner {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  gap: 0.625rem;
}

.archive-row {
  -webkit-tap-highlight-color: transparent;
}

.archive-row__body {
  position: relative;
  background-color: var(--theme-bg);
  color: var(--theme-text);
  height: 6.25rem;
  overflow: hidden;
}
.archive-row__body:after {
  content: "";
  position: absolute;
  inset: 0;
  /* Rectangle 35 */
}

.archive-row.is-expandable {
  cursor: pointer;
}
.archive-row.is-expandable:not(.is-expanded) .archive-row__body {
  transition: height 0.35s var(--ease-power2-out);
}
.archive-row.is-expandable:not(.is-expanded) .archive-row__body:hover {
  height: 7.8125rem;
}

.archive-row.is-expanded .archive-row__body {
  height: auto;
}

.archive-row__header {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
}

.archive-row__body__inner {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  padding-block: 1.875rem;
}
@media (min-width: 1280px) {
  .archive-row__body__inner {
    padding-block: 3.75rem;
  }
}

.archive-row__content {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  column-gap: var(--grid-gap);
  row-gap: 1.25rem;
}
.archive-row__content .archive-row__content__image {
  width: calc(8 * (100% - 11 * var(--grid-gap)) / 12 + 7 * var(--grid-gap));
  grid-column: 1/-1;
}
.archive-row__content .archive-row__content__text {
  grid-column: 1/-1;
  max-width: 55ch;
}
@media (min-width: 576px) {
  .archive-row__content .archive-row__content__image {
    grid-column: span 4;
    width: auto;
  }
}
@media (min-width: 992px) {
  .archive-row__content .archive-row__content__image {
    grid-column: span 4;
  }
  .archive-row__content .archive-row__content__text {
    grid-column: span 6;
  }
  .archive-row__content .archive-row__link {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
  }
}

.archive-row__content__text__title {
  margin-bottom: 1lh;
}

.archive-row__header {
  padding-block: 0.625rem;
}
@media (min-width: 992px) {
  .archive-row__header {
    padding-block: 2.5rem;
  }
}

@media (max-width: 767px) {
  .archive-row__title {
    font-weight: 600;
  }
}

.archive-row__body[data-theme] .arrow-pill {
  --pill-color: var(--theme-text);
  --icon-color: var(--theme-bg);
}

.article-card {
  --padding: 1.25rem;
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: clip;
  border-radius: 0.25rem;
  background-color: var(--color-white, #fff);
}

.article-card__body {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding: var(--padding);
}

.article-card__label {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
  margin-bottom: 0.75em;
}

.article-card__title {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: 2.25rem;
  line-height: 1.12;
}

.article-card__more {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  margin-top: auto;
  padding-top: 2rem;
  -webkit-text-decoration: underline;
  text-decoration: underline;
}

.article-card--no-image .article-card__title {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: 3rem;
  line-height: 1.08;
}

.article-card__link {
  position: absolute;
  inset: 0;
  overflow: clip;
  text-indent: -9999px;
}

.article-header {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  margin-top: calc(var(--nav-height, 0px) + 5rem);
}
@media (min-width: 992px) {
  .article-header {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
}
.article-header::after {
  grid-column: 1/-1;
}

@media (min-width: 992px) {
  .article-header__inner {
    grid-column: 3/span 7;
  }
}

.article-header__label {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
  margin-bottom: 1em;
}

.article-header__title {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: 5.25rem;
  line-height: 0.95;
}

.article-header__intro {
  font-weight: 600;
  font-size: 1.875rem;
  line-height: 1.45;
  margin-top: 2.5rem;
}

.article-header__related {
  margin-top: 2rem;
}

.article-header__related__label {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
  margin-bottom: 0.5em;
}

.article-header__related__list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  list-style: none;
  padding: 0;
}

.article-header__chip {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  display: inline-block;
  padding: 0.5em 1em;
  border: 1px solid currentColor;
  border-radius: 0.25rem;
  -webkit-text-decoration: none;
  text-decoration: none;
}

.article-header__media {
  grid-column: 1/-1;
  margin-top: 3.5rem;
  overflow: clip;
  border-radius: 0.5rem;
}

.articles-grid {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  gap: var(--grid-gap);
}
@media (min-width: 768px) {
  .articles-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
}
@media (min-width: 992px) {
  .articles-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
}

.button:focus {
  outline: 0;
}
.button {
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: currentColor;
  --btn-fg: var(--theme-btn-fg);
  --btn-bg: var(--theme-btn-bg);
  --btn-hover-fg: var(--color-dark);
  --btn-hover-bg: transparent;
  --btn-border: transparent;
  --btn-hover-border: var(--color-dark);
  background-color: var(--btn-bg);
  color: var(--btn-fg);
  border: 1px solid var(--btn-border);
  border-radius: 999px;
  padding-inline: 1rem;
  padding-block: 0.5625rem;
  padding-bottom: 0.625rem;
  position: relative;
  margin: 0;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: wrap;
  font-size: 0.875rem;
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}
@media (min-width: 1280px) {
  .button {
    padding-inline: 1.0625rem;
    padding-block: 0.5625rem;
    padding-bottom: 0.6875rem;
  }
}
@media (hover: hover) {
  .button {
    transition-timing-function: ease;
    transition-duration: 250ms;
    transition-property: background-color;
  }
  .button:hover {
    color: var(--btn-hover-fg);
    background-color: var(--btn-hover-bg);
    border-color: var(--btn-hover-border);
  }
}

.button[data-color=grey] {
  --btn-bg: #757576;
  --btn-fg: #bababa;
  --btn-hover-bg: white;
  --btn-hover-fg: #757576;
}

.button[data-color=outline] {
  --btn-bg: transparent;
  --btn-fg: var(--theme-text, var(--color-black));
  --btn-border: currentColor;
  --btn-hover-bg: var(--theme-text, var(--color-black));
  --btn-hover-fg: var(--theme-bg, var(--color-white));
  --btn-hover-border: var(--theme-text, var(--color-black));
}

.button--large {
  padding: 0.75rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  font-size: 0.75rem;
}
@media (min-width: 768px) {
  .button--large {
    padding: 1.375rem;
    padding-left: 1.75rem;
    padding-right: 1.75rem;
    font-size: 0.875rem;
  }
}

.text-button:focus {
  outline: 0;
}
.text-button {
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: currentColor;
  -webkit-text-decoration: none;
  text-decoration: none;
}

.button--icon {
  display: inline-flex;
  gap: 0.1875rem;
}
.button--icon:after {
  content: "";
  display: inline-block;
  text-align: center;
  position: relative;
  background-color: currentColor;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  width: 1rem;
  -webkit-mask-image: url("/wp-content/themes/hetblauwekompas/dist/assets/icons/icon-arrow.svg");
          mask-image: url("/wp-content/themes/hetblauwekompas/dist/assets/icons/icon-arrow.svg");
  aspect-ratio: 1/1;
  flex-shrink: 0;
}
.button--icon {
  padding-block: 8px;
  padding-right: 8px;
}
@media (min-width: 992px) {
  .button--icon {
    gap: 0.5rem;
    padding-inline: 17px;
    padding-right: 10px;
    padding-block: 6px;
  }
  .button--icon:after {
    width: 1.75rem;
  }
}

.button--opaque {
  position: relative;
  backdrop-filter: blur(5px);
  background-color: rgba(115, 115, 115, 0.6); /* 99 = ~60% opacity */
  color: white;
}
.button--opaque span {
  position: relative;
}
@media (hover: hover) {
  .button--opaque:hover {
    --btn-fg: white;
    background-color: rgba(115, 115, 115, 0.8); /* CC = ~80% opacity */
  }
}

.text-button:focus {
  outline: 0;
}
.text-button {
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: currentColor;
  color: currentColor;
}

.circle-button:focus {
  outline: 0;
}
.circle-button {
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: currentColor;
  color: var(--color-black);
  top: 0;
  z-index: 1;
  width: 3.25rem;
  height: 3.25rem;
  background-color: var(--color-yellow);
  border-radius: 100%;
  pointer-events: all;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 250ms ease-in-out, color 250ms ease-in-out;
}
.circle-button:after {
  content: "";
  width: 1.375rem;
  height: 1.375rem;
  transition: transform 250ms ease-in-out;
  display: block;
  background-color: currentColor;
  -webkit-mask-size: cover;
          mask-size: cover;
}
@media (hover: hover) {
  .circle-button:hover {
    background-color: var(--color-black);
    color: white;
  }
}

.expand-button {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 5px;
  --line-width: 2px;
}
.expand-button figure {
  position: relative;
  aspect-ratio: 1/1;
  width: 0.8em;
  margin-top: 3px;
  /* the two lines */
}
.expand-button figure:before, .expand-button figure:after {
  content: "";
  position: absolute;
  inset: 50%;
  translate: -50% -50%;
  background: currentColor;
}
.expand-button figure {
  /* horizontal bar */
}
.expand-button figure:before {
  width: 70%;
  height: var(--line-width);
}
.expand-button figure {
  /* vertical bar */
}
.expand-button figure:after {
  width: var(--line-width);
  height: 70%;
}
@media (min-width: 992px) {
  .expand-button {
    --line-width: 3px;
  }
}

.expand-button.is-toggled figure:after {
  transform: rotate(90deg);
}

.card {
  --padding: 1.5rem;
  position: relative;
  display: flex;
  flex-direction: column;
  border: 1px solid currentColor;
  border-radius: 0.5rem;
}

.card__body {
  flex-grow: 1;
  padding: var(--padding);
}

.card__title {
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.15;
}

.card__text {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  margin-top: 0.75em;
}

.card__link {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem var(--padding);
  border-top: 1px solid currentColor;
  -webkit-text-decoration: none;
  text-decoration: none;
}
.card__link::after {
  content: "";
  position: absolute;
  inset: 0;
}

.card__link__icon {
  flex-shrink: 0;
  width: 1em;
  height: 1em;
}

.cards-grid {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  gap: var(--grid-gap);
}
@media (min-width: 768px) {
  .cards-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
}
@media (min-width: 992px) {
  .cards-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
}

.compass-card {
  --padding: 1.25rem;
  position: relative;
  display: flex;
  flex-direction: column;
  border: 1px solid currentColor;
  border-radius: 0.25rem;
}

.compass-card__body {
  flex-grow: 1;
  padding: var(--padding);
}

.compass-card__icon {
  width: 4.3125rem;
  height: 4.3125rem;
  margin: -0.625rem 0 1.125rem -0.625rem;
}
.compass-card__icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

.compass-card__title {
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.15;
}

.compass-card__description {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
  margin-top: 0.5em;
}

.compass-card__footer {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
  padding: 0.75rem var(--padding);
  border-top: 1px solid currentColor;
}

.compass-card--current {
  border-color: var(--theme-accent);
  background-color: var(--theme-bg-alt);
  color: var(--theme-accent);
}

.compass-card__link {
  position: absolute;
  inset: 0;
  overflow: clip;
  text-indent: -9999px;
}

.compass-grid {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  gap: var(--grid-gap);
}
@media (min-width: 768px) {
  .compass-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
}
@media (min-width: 992px) {
  .compass-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
}

.compass-header {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  gap: 2.5rem;
  margin-top: calc(var(--nav-height, 0px) + 5rem);
}
@media (min-width: 992px) {
  .compass-header {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }
}
.compass-header {
  padding-bottom: var(--next-wave-h, 0px);
}
.compass-header::after {
  content: none;
}

.compass-header__meta {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.compass-header__position {
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.4;
}

.compass-header__icon {
  width: 3.5rem;
  height: 3.5rem;
  margin: -0.5rem;
}
.compass-header__icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

.compass-header__title {
  font-weight: 700;
  font-size: 4rem;
  line-height: 0.92;
}

.compass-header__intro {
  font-weight: 600;
  font-size: 1.875rem;
  line-height: 1.45;
  margin-top: 2rem;
}

.compass-header__media {
  overflow: clip;
  border-radius: 0.25rem;
}
@media (min-width: 992px) {
  .compass-header__media {
    align-self: stretch;
    margin-top: 3.5rem;
    margin-bottom: calc(var(--next-wave-h, 0px) * -1);
  }
  .compass-header__media .media-module,
  .compass-header__media picture,
  .compass-header__media img {
    display: block;
    height: 100%;
  }
  .compass-header__media .media-module.has-aspect img {
    height: 100%;
    aspect-ratio: auto;
  }
}

.contact-person__inner {
  display: flex;
  flex-direction: column-reverse;
  gap: 1.875rem;
}

.contact-person__image {
  width: calc(3 * (100% - 5 * var(--grid-gap)) / 6 + 2 * var(--grid-gap));
}

.contact-person__content {
  display: flex;
  flex-direction: column;
  gap: 1.875rem;
}

.contact-person__name {
  font-weight: 600;
}

.contact-person__email {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.contact-person__email a {
  -webkit-text-decoration: underline;
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 0.12em;
}
@media (hover: hover) {
  .contact-person__email a:hover {
    -webkit-text-decoration: none;
    text-decoration: none;
  }
}

@media (min-width: 768px) {
  .contact-person__inner {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
  .contact-person__image {
    width: 100%;
  }
  .contact-person__content {
    grid-column: span 3;
    max-width: 48ch;
    display: flex;
    justify-content: space-between;
    padding-left: 1.25rem;
    border-left: 1px solid currentColor;
  }
}
.events-list .events-list__preview {
  display: none;
}
@media (min-width: 992px) {
  .events-list {
    display: grid;
    grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
  .events-list .events-list__preview {
    display: block;
    grid-column: 1/span 3;
  }
  .events-list .events-list__items {
    grid-column: 5/-1;
  }
}

.events-list__empty {
  border-top: 1px solid currentColor;
  margin: 0;
  padding-block: 1.0625rem;
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}

.events-list__item {
  border-top: 1px solid currentColor;
}
.events-list__item:last-child {
  border-bottom: 1px solid currentColor;
}

.event-preview {
  position: relative;
}
.event-preview figure {
  border-radius: 1.375rem;
  overflow: hidden;
}
.event-preview .event-preview__active {
  position: absolute;
  inset: 0;
  opacity: 0;
}
.event-preview .event-preview__active figure,
.event-preview .event-preview__active img {
  width: 100%;
  height: 100%;
}
.event-preview .event-preview__active img {
  object-fit: cover;
}

.event-row {
  position: relative;
  --btn-size: 1.25rem;
}
@media (min-width: 768px) {
  .event-row {
    --btn-size: 1.875rem;
  }
}
@media (min-width: 992px) {
  .event-row {
    --btn-size: 2.5rem;
  }
}
.event-row__details {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  align-items: center;
  gap: 0.625rem;
  margin-top: 1.25rem;
}
@media (min-width: 768px) {
  .event-row__details {
    gap: 0.625rem;
    margin-top: 0rem;
  }
}
@media (min-width: 992px) {
  .event-row__details {
    gap: 1.5625rem;
  }
}

.event-row__body {
  overflow: hidden;
  transition: max-height 0.35s var(--ease-power2-out);
}
.event-row__body p {
  max-width: 45ch;
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}

.event-row__body__inner {
  opacity: 0;
  transition: opacity 0.2s var(--ease-power2-out);
  padding-bottom: 1.25rem;
}

.event-row:not(.is-expanded) .event-row__body {
  max-height: 0;
}

@media (min-width: 992px) {
  .event-row__body__cover {
    display: none;
  }
}
.event-row__toggle {
  display: block;
  width: var(--btn-size);
  aspect-ratio: 1/1;
  position: absolute;
  right: 0;
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
}
.event-row__toggle figure {
  width: 100%;
  aspect-ratio: 1/1;
  background-color: currentColor;
  -webkit-mask-image: url("/wp-content/themes/hetblauwekompas/dist/assets/icons/icon-arrow.svg");
          mask-image: url("/wp-content/themes/hetblauwekompas/dist/assets/icons/icon-arrow.svg");
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  transform: rotate(90deg);
  transition: transform 0.35s var(--ease-power2-out);
}
@media (min-width: 768px) {
  .event-row__toggle {
    top: 1.0625rem;
  }
}

.event-row.is-expanded .event-row__toggle figure {
  transform: rotate(-90deg);
}

.event-row.is-expanded .event-row__body__inner {
  opacity: 1;
}

.event-row.is-disabled .event-row__header {
  cursor: default;
}
.event-row.is-disabled .event-row__toggle {
  display: none;
}

.event-row__title {
  margin-top: 0.15em;
}
.event-row__header {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.event-row__header:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 0.25rem;
}
.event-row__header {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
.event-row__header .event-row__header__time {
  grid-column: span 2;
}
.event-row__header .event-row__header__title {
  grid-column: 2/span 2;
}
.event-row__header > * {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}
.event-row__header__date {
  text-transform: lowercase;
}
@media (min-width: 768px) {
  .event-row__header {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
  .event-row__header .event-row__header__date {
    grid-column: span 2;
  }
  .event-row__header .event-row__header__title {
    grid-column: 3/span 4;
    grid-row: 1;
  }
  .event-row__header .event-row__header__time {
    grid-column: 8/span 1;
  }
}

@media (min-width: 768px) {
  .event-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
  .event-row .event-row__title {
    font-weight: bold;
  }
  .event-row .event-row__header,
  .event-row .event-row__body {
    grid-column: 1/span 4;
  }
  .event-row .event-row__body {
    padding-left: calc(1 * (100% - 3 * var(--grid-gap)) / 4 + 1 * var(--grid-gap));
  }
  .event-row .event-row__details {
    grid-column: 3;
    grid-row: 1/span 3;
    place-self: end;
    flex-direction: row;
    justify-content: flex-start;
  }
}
.event-tags {
  position: relative;
  display: flex;
  flex-direction: row;
  list-style: none;
  padding: 0;
  gap: 0.625rem;
  z-index: 1;
  margin: 0;
}
@media (min-width: 992px) {
  .event-tags {
    gap: 1.5625rem;
  }
}

.event-tag {
  --size: var(--btn-size);
  display: flex;
  align-items: center;
  height: var(--size);
  background-color: var(--theme-bg);
  color: var(--theme-text);
  overflow: hidden;
  padding-inline: 0.625rem;
  font-weight: 400;
  border-radius: 1.375rem;
  line-height: 0;
  white-space: nowrap;
  margin: 0px;
  text-transform: lowercase;
  font-size: 0.625rem;
  padding-top: 0.0625rem;
}
@media (min-width: 768px) {
  .event-tag {
    font-size: 0.75rem;
  }
}
@media (min-width: 992px) {
  .event-tag {
    padding-inline: 1.25rem;
    font-size: 1rem;
  }
}
@media (min-width: 1280px) {
  .event-tag {
    font-size: 1.125rem;
  }
}
.event-tag span {
  margin-bottom: 2px;
  -webkit-user-select: none;
          user-select: none;
}
.program-tags.is-expanded .program-tag span {
  opacity: 1;
}
.program-tags.is-expanded .program-tag {
  max-width: 500px;
}

.arrow-pill {
  --icon-width: var(--btn-size);
  --pill-color: var(--color-green-200);
  --icon-color: var(--color-blue-200);
  --btn-size: 1.25rem;
}
@media (min-width: 768px) {
  .arrow-pill {
    --btn-size: 1.875rem;
  }
}
@media (min-width: 992px) {
  .arrow-pill {
    --btn-size: 2.5rem;
  }
}
.arrow-pill {
  position: relative;
  display: flex;
  align-items: center;
  height: var(--btn-size);
  border-radius: 1.375rem;
  width: 4rem;
  border: 1px solid transparent;
  flex-shrink: 0;
  background-color: var(--pill-color);
}
@media (min-width: 992px) {
  .arrow-pill {
    width: 8.125rem;
  }
}
.arrow-pill figure {
  position: absolute;
  aspect-ratio: 1/1;
  right: 0;
  width: var(--icon-width);
  background-color: var(--icon-color);
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  width: var(--icon-width);
  -webkit-mask-image: url("/wp-content/themes/hetblauwekompas/dist/assets/icons/icon-arrow.svg");
          mask-image: url("/wp-content/themes/hetblauwekompas/dist/assets/icons/icon-arrow.svg");
  aspect-ratio: 1/1;
}
.arrow-pill span {
  display: block;
  text-indent: -9999px;
  overflow: hidden;
}
@media (hover: hover) {
  .arrow-pill {
    transition: background-color 0.2s ease, border 0.2s ease;
  }
  .arrow-pill figure {
    transition: background-color 0.2s ease;
  }
  .arrow-pill:hover {
    background-color: transparent;
    border: 1px solid var(--pill-color);
  }
  .arrow-pill:hover figure {
    background-color: var(--pill-color);
  }
}

.eyes-test {
  width: 300px;
  height: 300px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  pointer-events: none;
  left: 0;
  top: 0;
  z-index: 1000;
  overflow: visible;
}

.footer {
  margin-top: var(--space-section, 7.5rem);
}
.footer ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.footer a {
  color: currentColor;
  -webkit-text-decoration: none;
  text-decoration: none;
}

.footer__inner {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  column-gap: var(--grid-gap);
  row-gap: 3.5rem;
  padding-block: 5rem 2.5rem;
}
.footer__inner > * {
  grid-column: 1/-1;
}
@media (min-width: 992px) {
  .footer__inner {
    row-gap: 10rem;
  }
}

.footer__title {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}

.footer__menu {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}
.footer__menu li + li {
  margin-top: 0.3em;
}

.footer__cta:empty {
  display: none;
}

.footer__logo {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}

.footer__legal {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}
.footer__legal li + li {
  margin-top: 0.5em;
}

.footer__copyright {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}

@media (min-width: 992px) {
  .footer__logo {
    grid-row: 1;
    grid-column: 1/span 3;
  }
  .footer__sitemap {
    grid-row: 1;
    grid-column: 4/span 4;
  }
  .footer__cta {
    grid-row: 1;
    grid-column: 8/-1;
  }
  .footer__copyright {
    grid-row: 2;
    grid-column: 1/span 3;
  }
  .footer__legal {
    grid-row: 2;
    grid-column: 4/-1;
    display: flex;
    justify-content: flex-end;
    gap: 1.75rem;
  }
  .footer__legal li + li {
    margin-top: 0;
  }
}
.layout-section {
  margin-top: 4.6875rem;
  overflow: clip;
}
@media (min-width: 1280px) {
  .layout-section {
    margin-top: 12.5rem;
  }
}

.page-section:first-child .layout-section,
.page-body > .layout-section:first-child {
  margin-top: 0 !important;
}

.layout-section__header {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
}

.layout-section__divider {
  height: 1px;
  background-color: currentColor;
}

.layout-section__header__title {
  padding-bottom: 0.3125rem;
}
@media (min-width: 768px) {
  .layout-section__header__title {
    padding-bottom: 0.625rem;
  }
}

.layout-section__intro {
  padding-top: 0.5rem;
  max-width: 40ch;
}
@media (min-width: 768px) {
  .layout-section__intro {
    padding-top: 1.125rem;
  }
}
@media (min-width: 1280px) {
  .layout-section__intro {
    padding-top: 1.5625rem;
  }
}

.layout-section__content {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  margin-top: 1.25rem;
}
@media (min-width: 992px) {
  .layout-section__content {
    margin-top: 2.1875rem;
  }
}
@media (min-width: 1280px) {
  .layout-section__content {
    margin-top: 3.125rem;
  }
}

.layout-section--activities .layout-section__content {
  margin-top: 0.625rem;
}
@media (min-width: 992px) {
  .layout-section--activities .layout-section__content {
    margin-top: 2.1875rem;
  }
}
@media (min-width: 1280px) {
  .layout-section--activities .layout-section__content {
    margin-top: 3.125rem;
  }
}

.layout-section--archive-list .layout-section__content {
  margin: 0;
}

.layout-heading {
  border-bottom: 1px solid currentColor;
  padding-bottom: 0.3125rem;
}
@media (min-width: 768px) {
  .layout-heading {
    padding-bottom: 0.625rem;
  }
}

.layout-section--agenda .layout-section__divider {
  display: none;
}
.layout-section--agenda .layout-section__content {
  margin-top: 0;
}

.main-nav {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  background: none;
  color: var(--theme-text);
  transition: color 0.3s ease;
}

.main-nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  min-height: var(--nav-height);
  padding: 1.25rem var(--cnt-margin);
}

.main-nav__logo {
  flex-shrink: 0;
  font-weight: 700;
  -webkit-text-decoration: none;
  text-decoration: none;
  color: inherit;
}

.main-nav__menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem 2rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.main-nav__link {
  font-weight: 600;
  -webkit-text-decoration: none;
  text-decoration: none;
  color: inherit;
}
.main-nav__link:hover, .current-menu-item > .main-nav__link, .current-page-ancestor > .main-nav__link {
  -webkit-text-decoration: underline;
  text-decoration: underline;
  text-underline-offset: 0.25em;
}

.main-nav__item--cta {
  margin-left: 0.5rem;
}

.main-nav__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.625rem 1rem;
  border-radius: 0.5rem;
  border: 1px solid currentColor;
  font-weight: 600;
  -webkit-text-decoration: none;
  text-decoration: none;
  color: inherit;
}
.main-nav__cta::after {
  content: "→";
}

.media-block {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  column-gap: var(--grid-gap);
}

.media-block__inner {
  grid-column: 1/-1;
  overflow: clip;
  border-radius: 0.5rem;
}

@media (min-width: 768px) {
  .media-block--medium .media-block__inner {
    grid-column: 2/-2;
  }
  .media-block--small .media-block__inner {
    grid-column: 3/-3;
  }
}
.media-module img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.media-module.has-aspect img {
  height: auto;
  width: 100%;
  aspect-ratio: var(--aspect-ratio);
}
.media-module.has-caption .figcaption {
  position: relative;
}

.overview-section {
  padding-block: 4.6875rem;
}
@media (min-width: 1280px) {
  .overview-section {
    padding-block: 7.5rem;
  }
}

.page-section > .overview-section {
  padding-block: 0;
}
.page-section > .overview-section + .overview-section {
  padding-top: 4.6875rem;
}
@media (min-width: 1280px) {
  .page-section > .overview-section + .overview-section {
    padding-top: 7.5rem;
  }
}

.overview-section__header {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
}

.overview-section__intro {
  max-width: 43.75rem;
}

.overview-section__title {
  font-weight: 700;
  font-size: 3rem;
  line-height: 1;
}

.overview-section__text {
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.45;
  margin-top: 1rem;
}

.overview-section__more {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  -webkit-text-decoration: underline;
  text-decoration: underline;
}

.overview-section__content {
  margin-top: 2.5rem;
}

.overview-section--stories {
  background-color: var(--color-beige);
}

@media (min-width: 1280px) {
  .overview-section--compass .compass-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
}

.page-hero {
  position: relative;
  height: 100svh;
  display: flex;
  overflow: hidden;
}
.page-hero:after {
  content: "";
  position: absolute;
  inset: 0;
  /* Rectangle 35 */
}

.page-hero__footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
}
.page-hero__footer button {
  position: relative;
  width: 3.125rem;
  aspect-ratio: 1/1;
}
.page-hero__footer button:focus {
  outline: 0;
}
.page-hero__footer button {
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: currentColor;
  display: flex;
  justify-content: center;
  align-items: center;
}
.page-hero__footer button figure {
  width: 1.875rem;
  aspect-ratio: 1/1;
}
@media (min-width: 768px) {
  .page-hero__footer button figure {
    width: 2.75rem;
  }
}
@media (min-width: 1280px) {
  .page-hero__footer button figure {
    width: 3.25rem;
  }
}
@media (min-width: 1920px) {
  .page-hero__footer button {
    width: 2.7vw;
  }
  .page-hero__footer button figure {
    width: 2.7vw;
  }
}

.page-hero--media .page-hero__inner,
.page-hero--media .page-hero__media {
  position: relative;
  display: flex;
  flex: 1;
}
.page-hero--media figure,
.page-hero--media picture {
  position: absolute;
  inset: 0;
}
.page-hero--media img {
  object-fit: cover;
}

.page-hero--text .page-hero__inner {
  position: relative;
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  padding: 2.5rem;
  padding-top: calc(2.5rem + var(--nav-height));
}
.page-hero--text .page-hero__text__title {
  max-width: 20ch;
}

.page-hero--logo .page-hero__inner {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-hero__logo {
  position: absolute;
  display: block;
  width: 90%;
}
@media (orientation: landscape) {
  .page-hero__logo {
    aspect-ratio: 1561/874;
    width: 80%;
  }
}
@media (orientation: portrait) {
  .page-hero__logo {
    aspect-ratio: 1/1;
  }
}

.page-intro {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  padding-top: 6.25rem;
  margin-bottom: 6.25rem;
}

.page-intro__label {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
}

.page-intro__title__heading {
  font-weight: 700;
  font-size: 4rem;
  line-height: 0.92;
  max-width: 25ch;
}

.page-intro__text {
  font-weight: 600;
  font-size: 1.875rem;
  line-height: 1.45;
  max-width: 40ch;
}

.page-logos {
  overflow: clip;
  background-color: var(--theme-bg-alt);
  padding-block: 1.25rem;
}
@media (min-width: 1280px) {
  .page-logos {
    padding-block: 3.125rem;
  }
}

.page-logos__wrapper {
  --gap: var(--grid-gap);
  display: flex;
  white-space: nowrap;
  flex-direction: row;
  filter: grayscale(100%) hue-rotate(320deg);
  mix-blend-mode: multiply;
}

.page-logos__inner {
  display: flex;
  white-space: nowrap;
  gap: var(--gap);
  flex: 0 0 auto;
  width: auto;
  padding-right: var(--gap);
}

.page-logos__item {
  position: relative;
  flex: 0 0 auto;
  opacity: 0.7;
}
.page-logos__item a {
  position: absolute;
  inset: 0;
}
.page-logos__item img {
  display: block;
  height: 20vw;
}
@media (hover: hover) {
  .page-logos__item:has(a):hover {
    opacity: 0.7;
  }
}

@media (min-width: 576px) {
  .page-logos__item img {
    height: 9vw;
  }
}
@media (min-width: 992px) {
  .page-logos__item img {
    height: 8vw;
  }
}
@media (min-width: 1280px) {
  .page-logos__item img {
    height: 5.5vw;
  }
}
/**
 *  Utility classes
 */
.product-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  row-gap: var(--grid-gap);
}
@media (min-width: 1280px) {
  .product-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
}

.product-card {
  position: relative;
  display: flex;
  flex-direction: column;
  -webkit-tap-highlight-color: transparent;
}

.product-card--standard,
.product-card--portrait .product-card__image {
  background-color: var(--raster-bg, #f7f7f6);
  background-image: radial-gradient(circle at center, var(--raster-dot-color, #ebebea) 0 var(--raster-dot-size, 0.03125rem), transparent calc(var(--raster-dot-size, 0.03125rem) + 0.5px) 100%);
  background-size: var(--raster-dot-gap, 0.25rem) var(--raster-dot-gap, 0.25rem);
  border-radius: var(--raster-radius, 0.625rem);
}

.product-card__image {
  --product-image-inset: 1.25rem;
  --product-image-height: 13.75rem;
  --product-image-fit-height: calc(var(--product-image-height) - var(--product-image-inset) * 2);
  height: var(--product-image-height);
  width: 100%;
  flex: none;
  min-height: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: var(--product-image-inset);
  perspective: 87.5rem;
  perspective-origin: 50% 40%;
}
@media (min-width: 992px) {
  .product-card__image {
    --product-image-inset: 1.875rem;
    --product-image-height: 18.75rem;
  }
}
.product-card__image .media-module {
  --cover-ratio: var(--aspect-ratio, 3/4);
  width: min(100%, var(--product-image-fit-height) * (var(--cover-ratio)));
  height: auto;
  aspect-ratio: var(--cover-ratio);
  --book-depth: 1rem;
  --book-turn: -2deg;
  --book-tilt: 0deg;
  --book-open: -24deg;
  --book-pages: #ffffff;
  --book-pages-edge: #ffffff;
  position: relative;
  transform-style: preserve-3d;
  transform: rotateX(var(--book-tilt)) rotateY(var(--book-turn));
  transition: transform 0.2s var(--ease-power2-out);
}
.product-card__image .media-module:before {
  content: "";
  position: absolute;
  inset: 1.5% 1% 1.5% 0;
  background-color: var(--book-pages);
  background-image: repeating-linear-gradient(to right, var(--book-pages) 0 2px, var(--book-pages-edge) 2px 3px);
  transform: translateZ(calc(var(--book-depth) * -1));
  box-shadow: 0 0.625rem 1.5rem rgba(0, 0, 0, 0.25);
}
.product-card__image .media-module:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: var(--book-depth);
  background-color: rgba(0, 0, 0, 0.45);
  transform-origin: left center;
  transform: rotateY(90deg);
}
.product-card__image .media-module picture {
  display: block;
  position: absolute;
  inset: 0;
  transform-origin: left center;
  transform: rotateY(0deg);
  transition: transform 0.2s var(--ease-power2-out);
  backface-visibility: hidden;
}
.product-card__image .media-module img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
}

.product-card:hover .media-module {
  transform: rotateX(var(--book-tilt)) rotateY(calc(var(--book-turn) - 2deg));
}
.product-card:hover .media-module picture {
  transform: rotateY(var(--book-open));
}

@media (prefers-reduced-motion: reduce) {
  .product-card .media-module,
  .product-card .media-module picture {
    transition: none;
  }
}
.product-card__link {
  -webkit-text-decoration: none;
  text-decoration: none;
  color: currentColor;
}
.product-card__link:after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}

.product-card__link {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}

.product-card__price {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}

.product-card__author {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  font-weight: 500;
}

.product-card__order {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0.625rem;
}

.product-card__cart {
  margin-top: auto;
}
.product-card__cart.is-loading {
  opacity: 0.6;
  pointer-events: none;
}
.product-card__cart {
  position: relative;
  z-index: 2;
  align-self: flex-start;
}
@media (max-width: 991px) {
  .product-card__cart {
    --cart-circle-size: 2.25rem;
    --cart-plus-line: 1.5px;
    --cart-plus-length: 0.875rem;
    width: var(--cart-circle-size);
    height: var(--cart-circle-size);
    padding: 0;
    margin-top: 0;
    align-self: center;
    justify-content: center;
    flex: none;
  }
  .product-card__cart .product-card__cart-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
  .product-card__cart:before, .product-card__cart:after {
    content: "";
    position: absolute;
    inset: 50%;
    translate: -50% -50%;
    background-color: currentColor;
  }
  .product-card__cart:before {
    width: var(--cart-plus-length);
    height: var(--cart-plus-line);
  }
  .product-card__cart:after {
    width: var(--cart-plus-line);
    height: var(--cart-plus-length);
  }
}

@media (min-width: 992px) {
  .product-card--standard {
    padding-inline: 3.75rem;
    padding-block: 2.5rem;
  }
}

.product-card--portrait {
  container-type: inline-size;
  --card-panel-ratio: 335 / 416;
  --card-gap: 1.25rem;
  gap: var(--card-gap);
}
@media (min-width: 992px) {
  .product-card--portrait {
    --card-gap: 1.875rem;
  }
}
.product-card--portrait .product-card__image {
  --product-image-height: calc(100cqw / (var(--card-panel-ratio)));
}

.programs-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  gap: var(--grid-gap);
}
@media (min-width: 992px) {
  .programs-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
}

.program-card {
  --padding: 1.125rem;
  position: relative;
  background-color: var(--color-blue-600);
  color: var(--color-green-200);
  padding: var(--padding);
  aspect-ratio: 312/390;
  padding-top: 0.75rem;
}
.program-card a {
  overflow: clip;
  position: absolute;
  inset: 0;
  text-indent: -9999px;
}

.program-card__label {
  margin-bottom: 0.4em;
}
@media (min-width: 992px) {
  .program-card__label {
    margin-bottom: 1em;
  }
}

.program-card__icon {
  position: absolute;
  right: var(--padding);
  bottom: 0.625rem;
  width: 1.5625rem;
}
.program-card__icon svg {
  width: 100%;
  height: auto;
}

@media (min-width: 768px) {
  .program-card {
    --padding: 1.375rem;
    padding: var(--padding);
  }
  .program-card__icon {
    width: 1.875rem;
    bottom: 1.5625rem;
  }
}
@media (min-width: 1280px) {
  .program-card {
    --padding: 2rem;
  }
  .program-card__icon {
    width: 2.5rem;
    bottom: 1.5625rem;
  }
}
.richtext .is-paragraph-title {
  font-weight: 600;
  margin-top: 1.7em;
  line-height: 1.4;
}
.richtext .is-paragraph-title:first-child {
  margin-top: 0;
}
.richtext p.intro {
  font-weight: 600;
  font-size: 1.875rem;
  line-height: 1.45;
}
.richtext a {
  text-underline-offset: 0.3em;
  text-decoration-thickness: 1px;
}
.richtext ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.richtext ul li {
  position: relative;
  margin: 0;
  padding-inline-start: 1.5em;
}
.richtext ul li::before {
  content: "•";
  position: absolute;
  left: 0.5em;
  top: 0;
}
.richtext ul {
  margin-bottom: 1.2em;
}
.richtext p + ul {
  margin-top: 1.2em;
}
.richtext p {
  margin-bottom: 1.2em;
}
.richtext p:last-child {
  margin-bottom: 0;
}
.richtext p.is-paragraph-intro {
  margin-bottom: 1.3em;
}
.richtext a:not(.button) {
  text-decoration-line: underline;
}
@media (hover: hover) {
  .richtext a:not(.button):hover {
    -webkit-text-decoration: none;
    text-decoration: none;
  }
}
.richtext a.button {
  margin-top: 0.5em;
}
.richtext p.small {
  color: var(--color-black);
}
@media (min-width: 768px) {
  .richtext p.small {
    font-size: 0.875rem;
  }
}

.text-media {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  gap: 2rem;
  align-items: center;
}
@media (min-width: 768px) {
  .text-media {
    grid-template-columns: 1fr 1fr;
    gap: 3.5rem;
  }
}

@media (min-width: 768px) {
  .text-media--reverse .text-media__media {
    order: 2;
  }
}
.text-media__media {
  overflow: clip;
  border-radius: 0.5rem;
}

.text-media__title {
  font-weight: 700;
  font-size: 3rem;
  line-height: 1;
}

.text-media__text {
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.45;
  margin-top: 1.5rem;
}

.text-media__action {
  margin-top: 1.5rem;
}

.text-more .expandable-element__wrapper {
  max-height: 0;
  overflow: hidden;
}
.text-more .expandable-element__content {
  padding-top: 1.2em;
}

.text-more__toggle {
  margin-top: 2.5rem;
}

.visual-timeline {
  container-type: inline-size;
}

.visual-timeline__row {
  --tl-col-w: calc((100cqw - 11 * var(--grid-gap)) / 12);
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  align-items: end;
  margin-block-start: calc(var(--dgap, 1) * var(--tl-col-w) - var(--rise, 0px));
}

.visual-timeline__cell {
  --c1: var(--dc1);
  --c2: var(--dc2);
  --lift: var(--dlift, 0);
  grid-column: var(--c1)/var(--c2);
  margin-block-end: calc(var(--lift) * var(--tl-col-w) * 0.5);
}

.visual-timeline__media {
  position: relative;
  aspect-ratio: 5/4;
  border-radius: 0.625rem;
  overflow: hidden;
  background-color: grey;
}
.visual-timeline__media .media-module {
  margin: 0;
  width: 100%;
  height: 100%;
}
.visual-timeline__media picture {
  display: block;
  width: 100%;
  height: 100%;
}
.visual-timeline__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.visual-timeline__cell--medium .visual-timeline__media {
  aspect-ratio: 4/3;
}

.visual-timeline__cell--large .visual-timeline__media {
  aspect-ratio: 1.3;
}

.visual-timeline__year {
  position: absolute;
  inset-inline: 1.25rem;
  bottom: 1rem;
  display: block;
  text-align: right;
  font-weight: 700;
  font-size: 1.125rem;
  line-height: 1.45;
}

.visual-timeline__caption {
  margin-block-start: 0.75rem;
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}

.visual-timeline__cell:nth-child(2) .visual-timeline__year,
.visual-timeline__cell:nth-child(2) .visual-timeline__caption {
  text-align: left;
}

@media (max-width: 767px) {
  .visual-timeline__row {
    margin-block-start: var(--gap-stack);
    row-gap: var(--gap-stack);
  }
  .visual-timeline__cell {
    --c1: 1;
    --c2: 9;
    --lift: 0;
  }
  .visual-timeline__cell--medium {
    --c2: 11;
  }
  .visual-timeline__cell--large {
    --c2: 13;
  }
  .visual-timeline__cell--stack-right {
    --c1: 5;
    --c2: 13;
  }
  .visual-timeline__cell--stack-right.visual-timeline__cell--medium {
    --c1: 3;
  }
  .visual-timeline__cell--stack-right.visual-timeline__cell--large {
    --c1: 1;
  }
}
[data-wave]:not([data-wave=none]) {
  --wave-h: calc(var(--wave-ratio, 0.07) * 100vw);
  position: relative;
  margin-top: calc(var(--wave-h) * -1);
  --wave-mask:
  	var(--wave) top / 100% var(--wave-h) no-repeat,
  	linear-gradient(#000 0 0) 0 calc(var(--wave-h) - 1px) / 100% 100% no-repeat;
  -webkit-mask: var(--wave-mask);
  mask: var(--wave-mask);
}

:where(:has(+ [data-wave]:not([data-wave=none])), :has(+ * > [data-wave]:not([data-wave=none]):first-child)) {
  --next-wave-h: calc(var(--next-wave-ratio, 0) * 100vw);
}
:where(:has(+ [data-wave]:not([data-wave=none])), :has(+ * > [data-wave]:not([data-wave=none]):first-child))::after {
  content: "";
  display: block;
  height: var(--next-wave-h);
}

.component--accordion .accordion {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.component--accordion .accordion__row {
  --accordion-pad-block: 0.875rem;
  --accordion-pad-inline: 1.25rem;
  background-color: var(--theme-bg-alt);
  border: 1px solid currentColor;
  border-radius: 0.625rem;
}
.component--accordion .accordion__heading {
  margin: 0;
}
.component--accordion .accordion__header:focus {
  outline: 0;
}
.component--accordion .accordion__header {
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: currentColor;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  padding: var(--accordion-pad-block) var(--accordion-pad-inline);
  color: inherit;
  text-align: left;
  border-radius: inherit;
}
.component--accordion .accordion__header:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 0.1875rem;
}
.component--accordion .accordion__title {
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.45;
  text-wrap: pretty;
}
.component--accordion .accordion__toggle {
  --toggle-size: 2rem;
  position: relative;
  flex-shrink: 0;
  width: var(--toggle-size);
  aspect-ratio: 1;
  border: 1px solid currentColor;
  border-radius: 50%;
  transition: transform 0.2s ease-out;
}
.component--accordion .accordion__toggle::before, .component--accordion .accordion__toggle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 50%;
  height: 1px;
  background-color: currentColor;
  translate: -50% -50%;
}
.component--accordion .accordion__toggle::after {
  rotate: 90deg;
}
.component--accordion .accordion__row.is-active .accordion__toggle {
  transform: rotate(45deg);
}
.component--accordion .accordion__body-inner {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  max-width: 65ch;
  padding: 0 var(--accordion-pad-inline) calc(var(--accordion-pad-block) * 2);
}
@media (min-width: 992px) {
  .component--accordion .accordion {
    gap: 1.5rem;
  }
  .component--accordion .accordion__row {
    --accordion-pad-block: 1.125rem;
    --accordion-pad-inline: 2.25rem;
  }
  .component--accordion .accordion__toggle {
    --toggle-size: 3rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  .component--accordion .accordion__body,
  .component--accordion .accordion__toggle {
    transition: none;
  }
}

.component--anchor {
  position: absolute;
  width: 0;
  height: 0;
}

.anchor-nav {
  --anchor-nav-top: 1.25rem;
  position: sticky;
  top: var(--anchor-nav-top);
  z-index: 5;
  pointer-events: none;
  transition: transform 0.3s ease-in-out;
}
.anchor-nav.sticky-header--hidden {
  transform: translateY(calc(-100% - var(--anchor-nav-top)));
}

.anchor-nav__list {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  list-style: none;
  padding-block: 0;
  margin-block: 0;
}
.anchor-nav__list > li {
  pointer-events: auto;
}

.header-panels {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  column-gap: var(--grid-gap);
  align-items: stretch;
  --panel-bg: var(--color-beige);
  --panel-pad: 1.875rem;
  --panel-radius: 1.25rem;
}

.header-panels__panel {
  grid-row: 1;
  min-width: 0;
  z-index: 1;
  aspect-ratio: 788/831;
}
.header-panels__panel.is-front {
  z-index: 2;
}

.header-panels__panel--start {
  grid-column: 1/span 7;
}

.header-panels__panel--end {
  grid-column: 6/span 7;
  --panel-bg: var(--color-sage);
}

.header-panel__inner {
  position: relative;
  height: 100%;
}

.header-panel__surface {
  position: absolute;
  inset: 0;
  background-color: var(--panel-bg);
  border-radius: var(--panel-radius);
  overflow: hidden;
  will-change: transform, filter;
}

.header-panel__background {
  width: 100%;
  height: 100%;
  /* Rectangle 39 */
}
.header-panel__background:after {
  content: "";
  position: absolute;
  inset: 0;
  height: 50%;
  background: linear-gradient(180deg, #333333 -8.39%, rgba(50, 50, 50, 0) 100%);
  mix-blend-mode: multiply;
}
.header-panel__background figure,
.header-panel__background picture,
.header-panel__background img {
  width: 100%;
  height: 100%;
}
.header-panel__background img {
  object-fit: cover;
}

.header-panel__content {
  position: relative;
  height: 100%;
  padding: var(--panel-pad);
}

.header-panel__title {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}

.header-panel__toggle:focus {
  outline: 0;
}
.header-panel__toggle {
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: currentColor;
  position: absolute;
  inset: 0;
  border-radius: var(--panel-radius);
}
.header-panel__toggle:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 0.125rem;
}
.header-panel__toggle[disabled] {
  pointer-events: none;
}

.header-panel.has-background {
  color: white;
}

@media (max-width: 767px) {
  .header-panels {
    --panel-pad: 1.25rem;
  }
  .header-panels__panel--start {
    grid-column: 1/span 11;
  }
  .header-panels__panel--end {
    grid-column: 2/span 11;
  }
}
.home-header .berg-char {
  position: relative;
  aspect-ratio: 1000/889;
  position: absolute;
  bottom: -8%;
}
.home-header .berg-char svg {
  position: absolute;
  top: 45%;
  left: 35.2%;
  width: 32%;
  height: auto;
  overflow: visible;
  will-change: transform, opacity;
}

.component--layer-stack .layer-stack {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  margin-block: 0;
  padding: 0;
  list-style: none;
  border: 1px solid var(--theme-text);
  border-radius: 0.625rem;
  overflow: hidden;
}
.component--layer-stack .layer-stack__item {
  --layer-pad-block: 1.5rem;
  --layer-pad-inline: 1.25rem;
}
.component--layer-stack .layer-stack__item + .component--layer-stack .layer-stack__item {
  border-top: 1px solid var(--theme-text);
}
.component--layer-stack .layer-stack__header {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: var(--layer-pad-block) var(--layer-pad-inline);
}
.component--layer-stack .layer-stack__number {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: 3rem;
  line-height: 1.08;
  flex-shrink: 0;
  min-width: 1ch;
}
.component--layer-stack .layer-stack__heading {
  flex: 1;
}
.component--layer-stack .layer-stack__label {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
  margin-bottom: 0.3em;
}
.component--layer-stack .layer-stack__title {
  font-weight: 700;
  font-size: 1.25rem;
  line-height: 1.45;
  line-height: 1.15;
  text-wrap: pretty;
}
.component--layer-stack .layer-stack__text {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  max-width: 60ch;
}
.component--layer-stack .layer-stack.is-accordion .layer-stack__header {
  cursor: pointer;
}
.component--layer-stack .layer-stack.is-accordion .layer-stack__header:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: -0.25rem;
}
.component--layer-stack .layer-stack.is-accordion .layer-stack__body {
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}
.component--layer-stack .layer-stack.is-accordion .layer-stack__text {
  padding: 0 var(--layer-pad-inline) calc(var(--layer-pad-block) * 1.5);
}
.component--layer-stack .layer-stack__toggle {
  position: relative;
  flex-shrink: 0;
  width: 2rem;
  aspect-ratio: 1;
  border: 1px solid currentColor;
  border-radius: 50%;
  transition: transform 0.2s ease-out;
}
.component--layer-stack .layer-stack__toggle::before, .component--layer-stack .layer-stack__toggle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 50%;
  height: 1px;
  background-color: currentColor;
  translate: -50% -50%;
}
.component--layer-stack .layer-stack__toggle::after {
  rotate: 90deg;
}
.component--layer-stack .layer-stack__item.is-active .layer-stack__toggle {
  transform: rotate(45deg);
}
@media (min-width: 992px) {
  .component--layer-stack .layer-stack__item {
    --layer-pad-block: 3.125rem;
    --layer-pad-inline: 3.75rem;
    display: grid;
    grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
    column-gap: var(--grid-gap);
    align-items: start;
    padding: var(--layer-pad-block) var(--layer-pad-inline);
  }
  .component--layer-stack .layer-stack__header {
    align-items: flex-start;
    gap: 3.75rem;
    padding: 0;
  }
  .component--layer-stack .layer-stack__number {
    font-family: var(--font-serif);
    font-weight: 500;
    font-size: 5.25rem;
    line-height: 0.95;
    min-width: 3rem;
  }
  .component--layer-stack .layer-stack__title {
    font-weight: 700;
    font-size: 1.875rem;
    line-height: 1.45;
    line-height: 1.1;
  }
  .component--layer-stack .layer-stack__toggle {
    display: none;
  }
  .component--layer-stack .layer-stack__text {
    padding-top: 1.6em;
  }
}
@media (prefers-reduced-motion: reduce) {
  .component--layer-stack .layer-stack__body,
  .component--layer-stack .layer-stack__toggle {
    transition: none;
  }
}

.newsletter {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  container-type: inline-size;
  margin-block: var(--space-section);
  --nl-s: min(14cqi, 6rem);
  --nl-rest: 1.761;
  --nl-head: 1.15;
}

.newsletter__panel {
  position: relative;
  isolation: isolate;
  display: grid;
  justify-items: center;
  text-align: center;
  padding: 10cqi 6cqi 12cqi;
  background-color: var(--color-yellow);
  border-radius: 2.5rem;
}

.newsletter__title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: var(--nl-s);
  line-height: 1;
  letter-spacing: 0;
  white-space: nowrap;
  color: var(--color-black);
}

.newsletter__line {
  display: block;
}
.newsletter__line:last-child {
  margin-top: calc(var(--nl-s) * var(--nl-head));
}

.newsletter__eyes {
  position: relative;
  display: inline-block;
  height: 1em;
  color: transparent;
}

.newsletter__eyes-svg,
.newsletter__char {
  position: absolute;
  max-width: none;
  height: auto;
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
}

.newsletter__eyes-svg {
  z-index: 2;
  top: 0.3315em;
  left: 0.1444em;
  width: 1.1636em;
  overflow: visible;
}

.newsletter__char {
  top: -1.1237em;
  left: -1.1355em;
  width: 3.636em;
}

.newsletter__char--body {
  z-index: -1;
}

.newsletter__char--hands {
  z-index: 2;
}

.newsletter__text {
  order: 1;
  margin-top: 1.875rem;
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  font-weight: 500;
}

.newsletter__form {
  position: relative;
  z-index: 1;
  display: flex;
  width: 100%;
  height: max(2.75rem, var(--nl-s) * 0.48);
  margin-top: calc(var(--nl-s) * (var(--nl-rest) - 1));
  background-color: var(--color-white);
  border-radius: 999px;
}
.newsletter__form:focus-within {
  outline: 2px solid var(--color-black);
  outline-offset: 0.125rem;
}

.newsletter__input {
  flex: 1;
  min-width: 0;
  padding-inline: 1.2em;
  border: 0;
  background: none;
  border-radius: inherit;
  font: inherit;
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  color: var(--color-black);
}
.newsletter__input:focus {
  outline: 0;
}
.newsletter__input::-webkit-input-placeholder {
  color: currentColor;
  opacity: 0.35;
}
.newsletter__input:-moz-placeholder {
  color: currentColor;
  opacity: 0.35;
}
.newsletter__input::-moz-placeholder {
  color: currentColor;
  opacity: 0.35;
}
.newsletter__input:-ms-input-placeholder {
  color: currentColor;
  opacity: 0.35;
}

.newsletter__submit:focus {
  outline: 0;
}
.newsletter__submit {
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: currentColor;
  padding-inline: 1.1em;
  background-color: var(--color-black);
  color: var(--color-white);
  border-radius: inherit;
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: max(1rem, var(--nl-s) * 0.24);
}

@media (min-width: 992px) {
  .newsletter {
    --nl-s: 4.8cqi;
  }
  .newsletter__panel {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: var(--grid-gap);
    justify-items: start;
    text-align: start;
    padding-block: calc(var(--nl-s) * 0.9) calc(var(--nl-s) * 1.4);
  }
  .newsletter__panel > * {
    grid-column: 3/span 8;
  }
  .newsletter__line {
    display: inline;
  }
  .newsletter__line:last-child {
    margin-top: 0;
  }
  .newsletter__text {
    order: 0;
    display: flex;
    align-items: center;
    height: calc(var(--nl-s) * (var(--nl-rest) - 1));
    max-width: calc(var(--nl-s) * 5.2);
    margin: 0;
    font-size: max(0.9375rem, var(--nl-s) * 0.24);
    line-height: 1.2;
  }
  .newsletter__form {
    margin-top: 0;
  }
}
.page-break-visual {
  position: relative;
  overflow: clip;
}

.page-break-visual__inner {
  aspect-ratio: 1440/325;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (orientation: portrait) {
  .page-break-visual__inner {
    aspect-ratio: 376/197;
  }
}

.page-break-visual__content {
  position: absolute;
  margin: 0;
  width: 100%;
}
.page-break-visual__content canvas {
  display: block;
  width: 100%;
  height: auto;
}

.page-break {
  --page-break-pad: 3.75rem;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: calc(100lvh + var(--wave-h, 0px) + var(--next-wave-h, 0px));
  background-color: var(--color-brown-900, #000);
}
@media (min-width: 1280px) {
  .page-break {
    --page-break-pad: 7.5rem;
  }
}
.page-break::after {
  flex-shrink: 0;
}

.page-break__media {
  position: absolute;
  inset: 0;
}
.page-break__media .media-module,
.page-break__media picture,
.page-break__media img {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
}
.page-break__media img {
  object-fit: cover;
}

.page-break__content {
  position: relative;
  padding-top: calc(var(--wave-h, 0px) + var(--page-break-pad));
  padding-bottom: var(--page-break-pad);
  --theme-accent: var(--color-white);
  color: var(--color-white);
}

.placeholder {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  place-content: center;
  gap: 0.25rem;
  min-height: 15rem;
  padding: 1.5rem;
  border: 1px dashed currentColor;
  border-radius: 0.625rem;
  text-align: center;
}

.placeholder__name {
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.45;
}

.placeholder__note {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
  opacity: 0.6;
}

.section-header {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  margin-bottom: -0.625rem;
}
@media (min-width: 992px) {
  .section-header {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
}
@media (min-width: 1280px) {
  .section-header {
    margin-bottom: -6.875rem;
  }
}

.section-header__title {
  font-weight: 700;
  font-size: 3rem;
  line-height: 1;
  margin-bottom: 0.4em;
}

.section-header__intro {
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.45;
}

@media (min-width: 992px) {
  .section-header__title,
  .section-header__intro {
    grid-column: 1/span 7;
  }
}
.statistics-highlight__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--grid-gap);
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
}

.statistics-highlight__slider {
  border-bottom: 1px solid currentColor;
}

.statistics-highlight__slider {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
}

.statistics-slider {
  overflow: clip;
}

.statistics-slider__inner {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

.stat-slider-card {
  --highlight-color: var(--theme-bg-alt);
}
.stat-slider-card:focus {
  outline: 0;
}
.stat-slider-card {
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: currentColor;
  position: relative;
  flex: 0 0 50%;
  min-width: 0;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  cursor: pointer;
  text-align: left;
  background: none;
  border: 0;
  display: flex;
}
.stat-slider-card:before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--highlight-color);
  opacity: 0;
  z-index: 0;
}
.stat-slider-card .stat-slider-card__inner {
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
  padding-inline: 0.75rem;
  gap: 1.875rem;
  justify-content: space-between;
}
.stat-slider-card .stat-slider-card__inner:after {
  content: "";
  width: 1px;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: currentColor;
  z-index: 2;
}
.stat-slider-card .stat-slider-card__heading {
  margin-top: -0.2em;
}
.stat-slider-card .stat-slider-card__value {
  position: relative;
  font-size: 1.625rem;
  font-weight: 700;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.stat-slider-card .stat-slider-card__value figure {
  display: block;
  aspect-ratio: 1/1;
  background-color: currentColor;
  width: 1.875rem;
  transition: transform 250ms ease-in-out;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-image: url("/wp-content/themes/hetblauwekompas/dist/assets/icons/icon-arrow.svg");
          mask-image: url("/wp-content/themes/hetblauwekompas/dist/assets/icons/icon-arrow.svg");
  transform: rotate(90deg);
  aspect-ratio: 1/1;
  opacity: 0.3;
}
@media (min-width: 1280px) {
  .stat-slider-card .stat-slider-card__value {
    font-size: 3rem;
  }
  .stat-slider-card .stat-slider-card__value figure {
    width: 2.8125rem;
  }
}
.stat-slider-card.is-active .statistics-slider__indicator {
  transform: rotate(180deg);
}
@media (min-width: 768px) {
  .stat-slider-card {
    flex-basis: 25%;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }
}
@media (min-width: 1280px) {
  .stat-slider-card {
    padding-top: 1.125rem;
    padding-bottom: 1.125rem;
  }
}
@media (min-width: 1536px) {
  .stat-slider-card {
    padding-top: 2.125rem;
    padding-bottom: 2.125rem;
  }
}

.statistics-slider__item.is-active:before {
  opacity: 0.5;
}
.statistics-slider__item.is-active .stat-slider-card__value figure {
  transform: rotate(-90deg);
  opacity: 1;
}

.statistics-slider__item:first-child .stat-slider-card__inner {
  padding-left: 0;
}

.statistics-highlight__footer {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 0.25rem;
}
@media (min-width: 1280px) {
  .statistics-highlight__footer {
    padding-top: 0.625rem;
  }
}

.statistics-highlight__arrow {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0.625rem;
  color: currentColor;
  margin-left: -0.75rem;
  margin-right: -0.75rem;
}
.statistics-highlight__arrow svg.icon {
  flex: 1;
  display: block;
  aspect-ratio: 1/1;
  width: 1.875rem;
  color: currentColor;
}
.statistics-highlight__arrow.is-disabled {
  opacity: 0.3;
  pointer-events: none;
}
@media (min-width: 1280px) {
  .statistics-highlight__arrow {
    margin-left: -1.125rem;
    margin-right: -1.125rem;
  }
  .statistics-highlight__arrow svg.icon {
    width: 2.75rem;
  }
}

.statistics-highlight__arrow--prev {
  transform: rotate(180deg);
}

.statistics-foldout {
  height: 0;
  overflow: hidden;
  background-color: var(--theme-bg-alt);
}
.statistics-foldout.is-open {
  height: auto;
}

.statistics-foldout__inner {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
}

.statistics-foldout__media {
  width: calc(2 * (100% - 2 * var(--grid-gap)) / 3 + 1 * var(--grid-gap));
  flex-shrink: 0;
}
.statistics-foldout__media figure,
.statistics-foldout__media picture,
.statistics-foldout__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (min-width: 576px) {
  .statistics-foldout__media {
    width: calc(1 * (100% - 2 * var(--grid-gap)) / 3 + 0 * var(--grid-gap));
  }
}

.statistics-foldout__body {
  width: 100%;
  max-width: 65ch;
}
@media (min-width: 576px) {
  .statistics-foldout__body {
    width: calc(2 * (100% - 2 * var(--grid-gap)) / 3 + 1 * var(--grid-gap));
  }
}

.statistics-foldout__item {
  display: none;
}
.statistics-foldout__item.is-active {
  display: flex;
}
@media (max-width: 575px) {
  .statistics-foldout__item.is-active {
    grid-template-columns: 1fr;
  }
}

.statistics-foldout__item {
  padding-block: 1.875rem;
  flex-direction: column;
  gap: 1rem;
}
@media (min-width: 576px) {
  .statistics-foldout__item {
    flex-direction: row;
    padding-block: 2.8125rem;
  }
}
@media (min-width: 992px) {
  .statistics-foldout__item {
    padding-block: 5rem;
  }
}

.component--streamer .streamer {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  margin-block: 0;
}
.component--streamer .streamer__text {
  font-family: var(--font-oldbook);
  font-weight: 500;
  font-size: 3.125rem;
  line-height: 1;
  color: var(--theme-accent);
  margin: 0;
}
.component--streamer .streamer__caption {
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.45;
  color: var(--theme-accent);
  opacity: 0.7;
  margin-top: 1lh;
}
@media (min-width: 992px) {
  .component--streamer .streamer {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
  .component--streamer .streamer__text,
  .component--streamer .streamer__caption {
    grid-column: 2/span 7;
  }
}

.streamer--quote .streamer__text p {
  position: relative;
  margin: 0;
}
.streamer--quote .streamer__text p::before {
  content: "“";
  position: absolute;
  right: 100%;
}
.streamer--quote .streamer__text p::after {
  content: "”";
}

.component--text-frame .text-frame {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
}
.component--text-frame .text-frame__box {
  background-color: var(--theme-accent);
  color: var(--theme-accent-tint);
  border-radius: 0.625rem;
  padding: 2.5rem var(--grid-gap);
}
.component--text-frame .text-frame__title {
  font-weight: 600;
  font-size: 1.875rem;
  line-height: 1.45;
  margin-bottom: 1em;
}
.component--text-frame .text-frame__text {
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.45;
}
@media (min-width: 992px) {
  .component--text-frame .text-frame {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
  .component--text-frame .text-frame__box {
    --frame-bleed: 4rem;
    grid-column: 3/-3;
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    column-gap: var(--grid-gap);
    margin-inline: calc(var(--frame-bleed) * -1);
    padding: 4.375rem var(--frame-bleed) 6.25rem;
  }
  .component--text-frame .text-frame__content {
    grid-column: 1/span 7;
  }
}

.text-frame__text.richtext p.intro {
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.45;
  font-weight: 600;
}

.component--text-images .text-images {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
}
.component--text-images .text-images__title {
  font-weight: 700;
  font-size: 3rem;
  line-height: 1;
  margin-bottom: 1em;
  color: red;
}
@media (min-width: 992px) {
  .component--text-images .text-images {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
  .component--text-images .text-images__title,
  .component--text-images .text-images__body {
    grid-column: 7/-1;
  }
  .component--text-images .text-images__title {
    grid-row: 1;
  }
  .component--text-images .text-images__body {
    grid-row: 2;
  }
  .component--text-images .text-images__images {
    grid-row: 2;
    grid-column: 2/span 4;
  }
  .component--text-images .text-images--reverse .text-images__title,
  .component--text-images .text-images--reverse .text-images__body {
    grid-column: 1/span 6;
  }
  .component--text-images .text-images--reverse .text-images__images {
    grid-column: 8/-2;
  }
}

.text-streamer {
  position: relative;
  overflow: clip;
  background-color: var(--theme-bg-alt);
}

.text-streamer__inner {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  column-gap: var(--grid-gap);
}
.text-streamer__inner .text-streamer__content {
  grid-column: 2/-2;
  max-width: min(65ch, 62.5rem);
}
@media (min-width: 992px) {
  .text-streamer__inner .text-streamer__content {
    grid-column: 3/-3;
  }
}

.text-streamer__content {
  padding-block: 3.125rem;
}
@media (min-width: 992px) {
  .text-streamer__content {
    padding-block: 6.25rem;
  }
}

.text-streamer__title {
  margin-bottom: 1lh;
}

.component--text .text {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.45;
}
.component--text .text__label {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
  margin-bottom: 0.6em;
}
.component--text .text__title {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  margin-bottom: 1em;
}
@media (min-width: 992px) {
  .component--text .text {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
  .component--text .text__label,
  .component--text .text__title,
  .component--text .text-more {
    grid-column: 3/span 7;
  }
}

.component--video-embed {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  column-gap: var(--grid-gap);
}
.component--video-embed .video-embed {
  grid-column: 1/-1;
}
@media (min-width: 768px) {
  .component--video-embed .video-embed {
    grid-column: 2/-2;
  }
}

.video-embed .video-embed__frame {
  position: relative;
  border-radius: 0.5rem;
  overflow: clip;
}
.video-embed .video-embed__embed {
  aspect-ratio: var(--aspect-ratio);
  position: relative;
  width: 100%;
  overflow: hidden;
}
.video-embed .video-embed__embed iframe {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.video-embed .video-embed__cover {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.video-embed .video-embed__cover figure,
.video-embed .video-embed__cover picture,
.video-embed .video-embed__cover img {
  width: 100%;
  height: 100%;
}
.video-embed .video-embed__cover img {
  object-fit: cover;
}
.video-embed .video-embed__play:focus {
  outline: 0;
}
.video-embed .video-embed__play {
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: currentColor;
  position: absolute;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 6.25rem;
  aspect-ratio: 1/1;
  overflow: hidden;
  text-indent: -9999px;
  cursor: pointer;
  color: #fff;
  border-radius: 9999px;
  background-color: rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(4px);
}
.video-embed .video-embed__play::after {
  content: "";
  position: absolute;
  width: 50%;
  height: 50%;
  background-color: currentColor;
  -webkit-mask-image: url("/wp-content/themes/hetblauwekompas/dist/assets/icons/icon-play.svg");
          mask-image: url("/wp-content/themes/hetblauwekompas/dist/assets/icons/icon-play.svg");
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
}
.video-embed .video-embed__play:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}
.video-embed .video-embed__caption {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
  margin-top: 0.75rem;
}

.about-timeline {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
}

.about-team {
  margin-top: 200px;
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
}
.about-team .about-team__intro__title {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}
.team-grid {
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  column-gap: var(--grid-gap);
  row-gap: 48px;
  --team-stagger: 0rem;
}

.team-grid__item {
  min-width: 0;
  grid-column: 1/-1;
  transform: translateY(var(--team-offset, 0px));
}

.team-grid__item:nth-child(odd) {
  grid-column: 1/span 6;
}

.team-grid__item:nth-child(even) {
  grid-column: 7/span 6;
}

/* tablet rhythm — two columns, first one dropped */
@media (min-width: 768px) {
  .team-grid__item:nth-child(odd) {
    grid-column: 1/span 6;
    --team-offset: var(--team-stagger);
  }
  .team-grid__item:nth-child(even) {
    grid-column: 7/span 6;
    --team-offset: 0px;
  }
}
/* desktop rhythm — three columns, middle one lifted */
@media (min-width: 992px) {
  .team-grid__item:nth-child(3n+1) {
    grid-column: 1/span 3;
    --team-offset: 0px;
  }
  .team-grid__item:nth-child(3n+3) {
    grid-column: 10/span 3;
    --team-offset: 0px;
  }
  .team-grid__item:nth-child(3n+2),
  .team-grid__item:last-child:nth-child(3n+1) {
    grid-column: 5/span 4;
    justify-self: center;
    width: calc(3 * (100% - 3 * var(--grid-gap)) / 4 + 2 * var(--grid-gap));
    --team-offset: calc(var(--team-stagger) * -1);
  }
}
.team-member__image {
  aspect-ratio: 335/419;
  border-radius: 0.5rem;
  overflow: clip;
}
.team-member__image figure,
.team-member__image picture,
.team-member__image img {
  width: 100%;
  height: 100%;
}
.team-member__image img {
  object-fit: cover;
}

.contact-sections {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gap);
  row-gap: 3rem;
  margin-block: 4.6875rem;
}
@media (min-width: 992px) {
  .contact-sections {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: var(--grid-gap);
    row-gap: 4.6875rem;
    margin-block: 6.25rem 9.375rem;
  }
}

@media (min-width: 992px) {
  .contact-section {
    grid-column: 1/span 5;
  }
  .contact-section:nth-child(even) {
    grid-column: 7/span 5;
  }
}

.contact-section__label {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
  margin-bottom: 0.6em;
}

.contact-section__text {
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.45;
}

@media (min-width: 992px) {
  .page-template-template-events .page-intro {
    display: grid;
    grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
    column-gap: var(--grid-gap);
  }
  .page-template-template-events .page-intro .page-intro__inner {
    grid-column: 5/-1;
  }
}
.page-template-template-events .page-body {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
}

.home-header {
  margin-top: calc(var(--nav-height, 0px) + 5rem);
}

.home-header__content {
  width: min(100% - var(--cnt-margin) * 2, var(--cnt-max-width));
  margin-inline: auto;
  max-width: 50rem;
  text-align: center;
}

.home-header__title {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
}

.home-header__text {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.45;
  margin-top: 1.5rem;
}

.home-header__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 2rem;
}

.home-header__media {
  margin-top: 3.75rem;
  aspect-ratio: 4/5;
  overflow: clip;
}
@media (min-width: 768px) {
  .home-header__media {
    aspect-ratio: 16/9;
  }
}
.home-header__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page-template-default .page-body {
  margin-top: 4.6875rem;
}
@media (min-width: 992px) {
  .page-template-default .page-body {
    margin-top: 6.25rem;
  }
}
.page-template-default .page-body > .component:first-child {
  margin-bottom: 4.6875rem;
}
@media (min-width: 1280px) {
  .page-template-default .page-body > .component:first-child {
    margin-bottom: 12.5rem;
  }
}

.flow > * + * {
  margin-top: var(--flow, var(--gap-flow)) !important;
}

.stack > * + * {
  margin-top: var(--stack, var(--gap-stack)) !important;
}

.u-col-1 {
  grid-column: span 1 !important;
}

.u-col-start-1 {
  grid-column-start: 1 !important;
}

.u-col-2 {
  grid-column: span 2 !important;
}

.u-col-start-2 {
  grid-column-start: 2 !important;
}

.u-col-3 {
  grid-column: span 3 !important;
}

.u-col-start-3 {
  grid-column-start: 3 !important;
}

.u-col-4 {
  grid-column: span 4 !important;
}

.u-col-start-4 {
  grid-column-start: 4 !important;
}

.u-col-5 {
  grid-column: span 5 !important;
}

.u-col-start-5 {
  grid-column-start: 5 !important;
}

.u-col-6 {
  grid-column: span 6 !important;
}

.u-col-start-6 {
  grid-column-start: 6 !important;
}

.u-col-7 {
  grid-column: span 7 !important;
}

.u-col-start-7 {
  grid-column-start: 7 !important;
}

.u-col-8 {
  grid-column: span 8 !important;
}

.u-col-start-8 {
  grid-column-start: 8 !important;
}

.u-col-9 {
  grid-column: span 9 !important;
}

.u-col-start-9 {
  grid-column-start: 9 !important;
}

.u-col-10 {
  grid-column: span 10 !important;
}

.u-col-start-10 {
  grid-column-start: 10 !important;
}

.u-col-11 {
  grid-column: span 11 !important;
}

.u-col-start-11 {
  grid-column-start: 11 !important;
}

.u-col-12 {
  grid-column: span 12 !important;
}

.u-col-start-12 {
  grid-column-start: 12 !important;
}

.u-aspect {
  aspect-ratio: var(--aspect-ratio, 1) !important;
}

.u-ma-100 {
  margin: var(--sp-100) !important;
}

.u-ma-200 {
  margin: var(--sp-200) !important;
}

.u-ma-250 {
  margin: var(--sp-250) !important;
}

.u-ma-300 {
  margin: var(--sp-300) !important;
}

.u-ma-400 {
  margin: var(--sp-400) !important;
}

.u-ma-450 {
  margin: var(--sp-450) !important;
}

.u-ma-475 {
  margin: var(--sp-475) !important;
}

.u-ma-500 {
  margin: var(--sp-500) !important;
}

.u-ma-600 {
  margin: var(--sp-600) !important;
}

.u-ma-800 {
  margin: var(--sp-800) !important;
}

.u-mt-100 {
  margin-top: var(--sp-100) !important;
}

.u-mt-200 {
  margin-top: var(--sp-200) !important;
}

.u-mt-250 {
  margin-top: var(--sp-250) !important;
}

.u-mt-300 {
  margin-top: var(--sp-300) !important;
}

.u-mt-400 {
  margin-top: var(--sp-400) !important;
}

.u-mt-450 {
  margin-top: var(--sp-450) !important;
}

.u-mt-475 {
  margin-top: var(--sp-475) !important;
}

.u-mt-500 {
  margin-top: var(--sp-500) !important;
}

.u-mt-600 {
  margin-top: var(--sp-600) !important;
}

.u-mt-800 {
  margin-top: var(--sp-800) !important;
}

.u-mr-100 {
  margin-right: var(--sp-100) !important;
}

.u-mr-200 {
  margin-right: var(--sp-200) !important;
}

.u-mr-250 {
  margin-right: var(--sp-250) !important;
}

.u-mr-300 {
  margin-right: var(--sp-300) !important;
}

.u-mr-400 {
  margin-right: var(--sp-400) !important;
}

.u-mr-450 {
  margin-right: var(--sp-450) !important;
}

.u-mr-475 {
  margin-right: var(--sp-475) !important;
}

.u-mr-500 {
  margin-right: var(--sp-500) !important;
}

.u-mr-600 {
  margin-right: var(--sp-600) !important;
}

.u-mr-800 {
  margin-right: var(--sp-800) !important;
}

.u-mb-100 {
  margin-bottom: var(--sp-100) !important;
}

.u-mb-200 {
  margin-bottom: var(--sp-200) !important;
}

.u-mb-250 {
  margin-bottom: var(--sp-250) !important;
}

.u-mb-300 {
  margin-bottom: var(--sp-300) !important;
}

.u-mb-400 {
  margin-bottom: var(--sp-400) !important;
}

.u-mb-450 {
  margin-bottom: var(--sp-450) !important;
}

.u-mb-475 {
  margin-bottom: var(--sp-475) !important;
}

.u-mb-500 {
  margin-bottom: var(--sp-500) !important;
}

.u-mb-600 {
  margin-bottom: var(--sp-600) !important;
}

.u-mb-800 {
  margin-bottom: var(--sp-800) !important;
}

.u-ml-100 {
  margin-left: var(--sp-100) !important;
}

.u-ml-200 {
  margin-left: var(--sp-200) !important;
}

.u-ml-250 {
  margin-left: var(--sp-250) !important;
}

.u-ml-300 {
  margin-left: var(--sp-300) !important;
}

.u-ml-400 {
  margin-left: var(--sp-400) !important;
}

.u-ml-450 {
  margin-left: var(--sp-450) !important;
}

.u-ml-475 {
  margin-left: var(--sp-475) !important;
}

.u-ml-500 {
  margin-left: var(--sp-500) !important;
}

.u-ml-600 {
  margin-left: var(--sp-600) !important;
}

.u-ml-800 {
  margin-left: var(--sp-800) !important;
}

.u-mx-100 {
  margin-left: var(--sp-100) !important;
  margin-right: var(--sp-100) !important;
}

.u-mx-200 {
  margin-left: var(--sp-200) !important;
  margin-right: var(--sp-200) !important;
}

.u-mx-250 {
  margin-left: var(--sp-250) !important;
  margin-right: var(--sp-250) !important;
}

.u-mx-300 {
  margin-left: var(--sp-300) !important;
  margin-right: var(--sp-300) !important;
}

.u-mx-400 {
  margin-left: var(--sp-400) !important;
  margin-right: var(--sp-400) !important;
}

.u-mx-450 {
  margin-left: var(--sp-450) !important;
  margin-right: var(--sp-450) !important;
}

.u-mx-475 {
  margin-left: var(--sp-475) !important;
  margin-right: var(--sp-475) !important;
}

.u-mx-500 {
  margin-left: var(--sp-500) !important;
  margin-right: var(--sp-500) !important;
}

.u-mx-600 {
  margin-left: var(--sp-600) !important;
  margin-right: var(--sp-600) !important;
}

.u-mx-800 {
  margin-left: var(--sp-800) !important;
  margin-right: var(--sp-800) !important;
}

.u-my-100 {
  margin-top: var(--sp-100) !important;
  margin-bottom: var(--sp-100) !important;
}

.u-my-200 {
  margin-top: var(--sp-200) !important;
  margin-bottom: var(--sp-200) !important;
}

.u-my-250 {
  margin-top: var(--sp-250) !important;
  margin-bottom: var(--sp-250) !important;
}

.u-my-300 {
  margin-top: var(--sp-300) !important;
  margin-bottom: var(--sp-300) !important;
}

.u-my-400 {
  margin-top: var(--sp-400) !important;
  margin-bottom: var(--sp-400) !important;
}

.u-my-450 {
  margin-top: var(--sp-450) !important;
  margin-bottom: var(--sp-450) !important;
}

.u-my-475 {
  margin-top: var(--sp-475) !important;
  margin-bottom: var(--sp-475) !important;
}

.u-my-500 {
  margin-top: var(--sp-500) !important;
  margin-bottom: var(--sp-500) !important;
}

.u-my-600 {
  margin-top: var(--sp-600) !important;
  margin-bottom: var(--sp-600) !important;
}

.u-my-800 {
  margin-top: var(--sp-800) !important;
  margin-bottom: var(--sp-800) !important;
}

.u-pa-100 {
  padding: var(--sp-100) !important;
}

.u-pa-200 {
  padding: var(--sp-200) !important;
}

.u-pa-250 {
  padding: var(--sp-250) !important;
}

.u-pa-300 {
  padding: var(--sp-300) !important;
}

.u-pa-400 {
  padding: var(--sp-400) !important;
}

.u-pa-450 {
  padding: var(--sp-450) !important;
}

.u-pa-475 {
  padding: var(--sp-475) !important;
}

.u-pa-500 {
  padding: var(--sp-500) !important;
}

.u-pa-600 {
  padding: var(--sp-600) !important;
}

.u-pa-800 {
  padding: var(--sp-800) !important;
}

.u-pt-100 {
  padding-top: var(--sp-100) !important;
}

.u-pt-200 {
  padding-top: var(--sp-200) !important;
}

.u-pt-250 {
  padding-top: var(--sp-250) !important;
}

.u-pt-300 {
  padding-top: var(--sp-300) !important;
}

.u-pt-400 {
  padding-top: var(--sp-400) !important;
}

.u-pt-450 {
  padding-top: var(--sp-450) !important;
}

.u-pt-475 {
  padding-top: var(--sp-475) !important;
}

.u-pt-500 {
  padding-top: var(--sp-500) !important;
}

.u-pt-600 {
  padding-top: var(--sp-600) !important;
}

.u-pt-800 {
  padding-top: var(--sp-800) !important;
}

.u-pr-100 {
  padding-right: var(--sp-100) !important;
}

.u-pr-200 {
  padding-right: var(--sp-200) !important;
}

.u-pr-250 {
  padding-right: var(--sp-250) !important;
}

.u-pr-300 {
  padding-right: var(--sp-300) !important;
}

.u-pr-400 {
  padding-right: var(--sp-400) !important;
}

.u-pr-450 {
  padding-right: var(--sp-450) !important;
}

.u-pr-475 {
  padding-right: var(--sp-475) !important;
}

.u-pr-500 {
  padding-right: var(--sp-500) !important;
}

.u-pr-600 {
  padding-right: var(--sp-600) !important;
}

.u-pr-800 {
  padding-right: var(--sp-800) !important;
}

.u-pb-100 {
  padding-bottom: var(--sp-100) !important;
}

.u-pb-200 {
  padding-bottom: var(--sp-200) !important;
}

.u-pb-250 {
  padding-bottom: var(--sp-250) !important;
}

.u-pb-300 {
  padding-bottom: var(--sp-300) !important;
}

.u-pb-400 {
  padding-bottom: var(--sp-400) !important;
}

.u-pb-450 {
  padding-bottom: var(--sp-450) !important;
}

.u-pb-475 {
  padding-bottom: var(--sp-475) !important;
}

.u-pb-500 {
  padding-bottom: var(--sp-500) !important;
}

.u-pb-600 {
  padding-bottom: var(--sp-600) !important;
}

.u-pb-800 {
  padding-bottom: var(--sp-800) !important;
}

.u-pl-100 {
  padding-left: var(--sp-100) !important;
}

.u-pl-200 {
  padding-left: var(--sp-200) !important;
}

.u-pl-250 {
  padding-left: var(--sp-250) !important;
}

.u-pl-300 {
  padding-left: var(--sp-300) !important;
}

.u-pl-400 {
  padding-left: var(--sp-400) !important;
}

.u-pl-450 {
  padding-left: var(--sp-450) !important;
}

.u-pl-475 {
  padding-left: var(--sp-475) !important;
}

.u-pl-500 {
  padding-left: var(--sp-500) !important;
}

.u-pl-600 {
  padding-left: var(--sp-600) !important;
}

.u-pl-800 {
  padding-left: var(--sp-800) !important;
}

.u-px-100 {
  padding-left: var(--sp-100) !important;
  padding-right: var(--sp-100) !important;
}

.u-px-200 {
  padding-left: var(--sp-200) !important;
  padding-right: var(--sp-200) !important;
}

.u-px-250 {
  padding-left: var(--sp-250) !important;
  padding-right: var(--sp-250) !important;
}

.u-px-300 {
  padding-left: var(--sp-300) !important;
  padding-right: var(--sp-300) !important;
}

.u-px-400 {
  padding-left: var(--sp-400) !important;
  padding-right: var(--sp-400) !important;
}

.u-px-450 {
  padding-left: var(--sp-450) !important;
  padding-right: var(--sp-450) !important;
}

.u-px-475 {
  padding-left: var(--sp-475) !important;
  padding-right: var(--sp-475) !important;
}

.u-px-500 {
  padding-left: var(--sp-500) !important;
  padding-right: var(--sp-500) !important;
}

.u-px-600 {
  padding-left: var(--sp-600) !important;
  padding-right: var(--sp-600) !important;
}

.u-px-800 {
  padding-left: var(--sp-800) !important;
  padding-right: var(--sp-800) !important;
}

.u-py-100 {
  padding-top: var(--sp-100) !important;
  padding-bottom: var(--sp-100) !important;
}

.u-py-200 {
  padding-top: var(--sp-200) !important;
  padding-bottom: var(--sp-200) !important;
}

.u-py-250 {
  padding-top: var(--sp-250) !important;
  padding-bottom: var(--sp-250) !important;
}

.u-py-300 {
  padding-top: var(--sp-300) !important;
  padding-bottom: var(--sp-300) !important;
}

.u-py-400 {
  padding-top: var(--sp-400) !important;
  padding-bottom: var(--sp-400) !important;
}

.u-py-450 {
  padding-top: var(--sp-450) !important;
  padding-bottom: var(--sp-450) !important;
}

.u-py-475 {
  padding-top: var(--sp-475) !important;
  padding-bottom: var(--sp-475) !important;
}

.u-py-500 {
  padding-top: var(--sp-500) !important;
  padding-bottom: var(--sp-500) !important;
}

.u-py-600 {
  padding-top: var(--sp-600) !important;
  padding-bottom: var(--sp-600) !important;
}

.u-py-800 {
  padding-top: var(--sp-800) !important;
  padding-bottom: var(--sp-800) !important;
}

.u-text-left {
  text-align: left !important;
}

.u-text-center {
  text-align: center !important;
}

.u-text-right {
  text-align: right !important;
}

.u-uppercase {
  text-transform: uppercase !important;
}

.u-lowercase {
  text-transform: lowercase !important;
}

.u-capitalize {
  text-transform: capitalize !important;
}

.u-nowrap {
  white-space: nowrap !important;
}

.u-balance {
  text-wrap: balance;
}

.u-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.u-hidden {
  display: none !important;
}

.u-visually-hidden,
.u-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.u-no-pointer {
  pointer-events: none !important;
}

.u-no-select {
  -webkit-user-select: none !important;
          user-select: none !important;
}

.embla__viewport {
  overflow: hidden;
}

.embla__container {
  display: flex;
  touch-action: pan-y pinch-zoom;
}

.embla__slide {
  min-width: 0;
}