@charset "UTF-8";
/**
 * BASE SIZE
 * All calculations are based on this. It’s recommended that
 * you keep it at 1rem because that is the root font size. You
 * can set it to whatever you like and whatever unit you like.
 */
/**
 * SIZE SCALE
 * This is a Major Third scale that powers all the utilities that
 * it is relevant for (font-size, margin, padding). All items are
 * calcuated off the base size, so change that and cascade across
 * your whole project.
 */
/**
 * COLORS
 * Colors are shared between backgrounds and text by default. 
 * You can also use them to power borders, fills or shadows, for example.
 */
/**
 * CORE CONFIG
 * This powers everything from utility class generation to breakpoints
 * to enabling/disabling pre-built components/utilities.
 */
:root {
  --color-black: #000000;
  --color-white: #ffffff;
  --color-red-core: #fd4353;
  --color-red: #cf3a4e;
  --color-pink: #ed9798;
  --color-beige: #faf8e9;
  --color-beige-dark: #e3dcba;
  --color-grey-dark: #54585e;
  --color-grey-mid: #808285;
  --color-grey-light: #dddee0;
  --color-ren-grey-standard: #313132;
  --color-ren-grey-alternate: #3c3c3d;
  --font-base: proxima-nova, Arial, sans-serif;
  --font-serif: expo-serif-pro, Georgia, serif;
  --size-100: 0.4rem;
  --size-200: 0.6rem;
  --size-300: 0.8rem;
  --size-400: 1rem;
  --size-500: 1.33rem;
  --size-600: 1.77rem;
  --size-700: 2.4rem;
  --size-800: 3.1rem;
  --size-900: 4.1rem;
  --size-rel-100: 0.4em;
  --size-rel-200: 0.6em;
  --size-rel-300: 0.8em;
  --size-rel-400: 1em;
  --size-rel-500: 1.33em;
  --size-rel-600: 1.77em;
  --size-rel-700: 2.4em;
  --size-rel-800: 3.1em;
  --size-rel-900: 4.1em;
  --weight-light: 300;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-bold: 700;
  --width-full: 100%;
  --width-half: 50%;
  --width-quarter: 25%;
  --width-third: 33.33%;
  --width-card-small: 10em;
  --width-card: 15em;
  --width-card-wide: 20em;
  --width-card-carousel: 40em;
  --width-aside: 25em;
  --width-aside-narrow: 18em;
  --width-content: 80ch;
  --width-accent-border: 3px;
  --width-mid: 60em;
  --width-max: 90em;
  --box-shadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
  --box-shadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
  --transition-default: 0.2s ease;
  --transition-long: 0.7s ease;
  --line-height-400: 1.2;
  --line-height-300: 1;
  --line-height-500: 1.5;
  --z-index-100: 100;
  --z-index-200: 200;
  --z-index-300: 300;
  --z-index-400: 400;
  --z-index-500: 500;
  --z-index-600: 600;
  --z-index-700: 700;
  --z-index-800: 800;
  --z-index-900: 900;
}

:root {
  --color-text: #000000;
  --color-text-light-lrg: #808285;
  --color-bg: #ffffff;
  --color-border: #808285;
  --color-tint: rgba(128, 130, 133, 0.2);
  --color-accent: #cf3a4e;
  --color-card-bg: #faf8e9;
  --color-card-border: #e3dcba;
  --color-card-text: #000000;
  --color-card-accent: #cf3a4e;
  --color-callout-bg: #cf3a4e;
  --color-callout-text: #ffffff;
  --color-dropshadow-base: rgba(255, 255, 255, 0.05);
  --color-dropshadow-main-default: rgba(221, 222, 224, 0.15);
  --color-dropshadow-main-drop: rgba(49, 49, 50, 0.08);
  --color-boxshadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
  --color-boxshadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
}

[data-theme=default] {
  --color-text: #000000;
  --color-text-light-lrg: #808285;
  --color-bg: #ffffff;
  --color-border: #808285;
  --color-tint: rgba(128, 130, 133, 0.2);
  --color-accent: #cf3a4e;
  --color-card-bg: #faf8e9;
  --color-card-border: #e3dcba;
  --color-card-text: #000000;
  --color-card-accent: #cf3a4e;
  --color-callout-bg: #cf3a4e;
  --color-callout-text: #ffffff;
  --color-dropshadow-base: rgba(255, 255, 255, 0.05);
  --color-dropshadow-main-default: rgba(221, 222, 224, 0.15);
  --color-dropshadow-main-drop: rgba(49, 49, 50, 0.08);
  --color-boxshadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
  --color-boxshadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
}

[data-mode=light], [data-mode=light][data-theme=default], [data-mode=light] [data-theme=default] {
  --color-text: #000000;
  --color-text-light-lrg: #808285;
  --color-bg: #ffffff;
  --color-border: #808285;
  --color-tint: rgba(128, 130, 133, 0.2);
  --color-accent: #cf3a4e;
  --color-card-bg: #faf8e9;
  --color-card-border: #e3dcba;
  --color-card-text: #000000;
  --color-card-accent: #cf3a4e;
  --color-callout-bg: #cf3a4e;
  --color-callout-text: #ffffff;
  --color-dropshadow-base: rgba(255, 255, 255, 0.05);
  --color-dropshadow-main-default: rgba(221, 222, 224, 0.15);
  --color-dropshadow-main-drop: rgba(49, 49, 50, 0.08);
  --color-boxshadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
  --color-boxshadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
}

[data-theme=alternative], [data-mode=light][data-theme=alternative], [data-mode=light] [data-theme=alternative] {
  --color-text: #000000;
  --color-text-light-lrg: #808285;
  --color-bg: #faf8e9;
  --color-border: #808285;
  --color-tint: rgba(128, 130, 133, 0.2);
  --color-accent: #cf3a4e;
  --color-card-bg: #ffffff;
  --color-card-border: #e3dcba;
  --color-card-text: #000000;
  --color-card-accent: #cf3a4e;
  --color-callout-bg: #cf3a4e;
  --color-callout-text: #ffffff;
  --color-dropshadow-base: rgba(255, 255, 255, 0.05);
  --color-dropshadow-main-default: rgba(221, 222, 224, 0.15);
  --color-dropshadow-main-drop: rgba(49, 49, 50, 0.08);
  --color-boxshadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
  --color-boxshadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
}

[data-theme=grey], [data-mode=light][data-theme=grey], [data-mode=light] [data-theme=grey] {
  --color-text: #ffffff;
  --color-text-light-lrg: #dddee0;
  --color-bg: #313132;
  --color-border: #808285;
  --color-tint: rgba(221, 222, 224, 0.2);
  --color-accent: #ed9798;
  --color-card-bg: #3c3c3d;
  --color-card-border: #54585e;
  --color-card-text: #ffffff;
  --color-card-accent: #ed9798;
  --color-callout-bg: #ed9798;
  --color-callout-text: #313132;
  --color-dropshadow-base: rgba(49, 49, 50, 0.01);
  --color-dropshadow-main-default: rgba(128, 130, 133, 0.15);
  --color-dropshadow-main-drop: rgba(255, 255, 255, 0.08);
  --color-boxshadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
  --color-boxshadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-text: #ffffff;
    --color-text-light-lrg: #dddee0;
    --color-bg: #313132;
    --color-border: #808285;
    --color-tint: rgba(221, 222, 224, 0.2);
    --color-accent: #ed9798;
    --color-card-bg: #3c3c3d;
    --color-card-border: #54585e;
    --color-card-text: #ffffff;
    --color-card-accent: #ed9798;
    --color-callout-bg: #ed9798;
    --color-callout-text: #313132;
    --color-dropshadow-base: rgba(49, 49, 50, 0.01);
    --color-dropshadow-main-default: rgba(128, 130, 133, 0.15);
    --color-dropshadow-main-drop: rgba(255, 255, 255, 0.08);
    --color-boxshadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
    --color-boxshadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
  }
}
@media (prefers-color-scheme: dark) {
  [data-theme=default] {
    --color-text: #ffffff;
    --color-text-light-lrg: #dddee0;
    --color-bg: #313132;
    --color-border: #808285;
    --color-tint: rgba(221, 222, 224, 0.2);
    --color-accent: #ed9798;
    --color-card-bg: #3c3c3d;
    --color-card-border: #54585e;
    --color-card-text: #ffffff;
    --color-card-accent: #ed9798;
    --color-callout-bg: #ed9798;
    --color-callout-text: #313132;
    --color-dropshadow-base: rgba(49, 49, 50, 0.01);
    --color-dropshadow-main-default: rgba(128, 130, 133, 0.15);
    --color-dropshadow-main-drop: rgba(255, 255, 255, 0.08);
    --color-boxshadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
    --color-boxshadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
  }
}
[data-mode=dark], [data-theme=grey], [data-mode=dark][data-theme=default], [data-mode=dark] [data-theme=default] {
  --color-text: #ffffff;
  --color-text-light-lrg: #dddee0;
  --color-bg: #313132;
  --color-border: #808285;
  --color-tint: rgba(221, 222, 224, 0.2);
  --color-accent: #ed9798;
  --color-card-bg: #3c3c3d;
  --color-card-border: #54585e;
  --color-card-text: #ffffff;
  --color-card-accent: #ed9798;
  --color-callout-bg: #ed9798;
  --color-callout-text: #313132;
  --color-dropshadow-base: rgba(49, 49, 50, 0.01);
  --color-dropshadow-main-default: rgba(128, 130, 133, 0.15);
  --color-dropshadow-main-drop: rgba(255, 255, 255, 0.08);
  --color-boxshadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
  --color-boxshadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
}

@media (prefers-color-scheme: dark) {
  [data-theme=alternative] {
    --color-text: #ffffff;
    --color-text-light-lrg: #dddee0;
    --color-bg: #3c3c3d;
    --color-border: #808285;
    --color-tint: rgba(128, 130, 133, 0.2);
    --color-accent: #ed9798;
    --color-card-bg: #313132;
    --color-card-border: #54585e;
    --color-card-text: #ffffff;
    --color-card-accent: #ed9798;
    --color-callout-bg: #ed9798;
    --color-callout-text: #313132;
    --color-dropshadow-base: rgba(49, 49, 50, 0.01);
    --color-dropshadow-main-default: rgba(128, 130, 133, 0.15);
    --color-dropshadow-main-drop: rgba(255, 255, 255, 0.08);
    --color-boxshadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
    --color-boxshadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
  }
}
[data-mode=dark] [data-theme=alternative], [data-mode=dark][data-theme=alternative] {
  --color-text: #ffffff;
  --color-text-light-lrg: #dddee0;
  --color-bg: #3c3c3d;
  --color-border: #808285;
  --color-tint: rgba(128, 130, 133, 0.2);
  --color-accent: #ed9798;
  --color-card-bg: #313132;
  --color-card-border: #54585e;
  --color-card-text: #ffffff;
  --color-card-accent: #ed9798;
  --color-callout-bg: #ed9798;
  --color-callout-text: #313132;
  --color-dropshadow-base: rgba(49, 49, 50, 0.01);
  --color-dropshadow-main-default: rgba(128, 130, 133, 0.15);
  --color-dropshadow-main-drop: rgba(255, 255, 255, 0.08);
  --color-boxshadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
  --color-boxshadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
}

@media (prefers-color-scheme: dark) {
  [data-theme=grey] {
    --color-text: #ffffff;
    --color-text-light-lrg: #dddee0;
    --color-bg: #313132;
    --color-border: #808285;
    --color-tint: rgba(221, 222, 224, 0.2);
    --color-accent: #ed9798;
    --color-card-bg: #3c3c3d;
    --color-card-border: #54585e;
    --color-card-text: #ffffff;
    --color-card-accent: #ed9798;
    --color-callout-bg: #ed9798;
    --color-callout-text: #313132;
    --color-dropshadow-base: rgba(49, 49, 50, 0.01);
    --color-dropshadow-main-default: rgba(128, 130, 133, 0.15);
    --color-dropshadow-main-drop: rgba(255, 255, 255, 0.08);
    --color-boxshadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
    --color-boxshadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
  }
}
[data-mode=dark] [data-theme=grey], [data-mode=dark][data-theme=grey] {
  --color-text: #ffffff;
  --color-text-light-lrg: #dddee0;
  --color-bg: #313132;
  --color-border: #808285;
  --color-tint: rgba(221, 222, 224, 0.2);
  --color-accent: #ed9798;
  --color-card-bg: #3c3c3d;
  --color-card-border: #54585e;
  --color-card-text: #ffffff;
  --color-card-accent: #ed9798;
  --color-callout-bg: #ed9798;
  --color-callout-text: #313132;
  --color-dropshadow-base: rgba(49, 49, 50, 0.01);
  --color-dropshadow-main-default: rgba(128, 130, 133, 0.15);
  --color-dropshadow-main-drop: rgba(255, 255, 255, 0.08);
  --color-boxshadow-default: 0 0.375rem 0.75rem var(--color-dropshadow-main-default), -0.125rem -0.125rem 0.25rem var(--color-dropshadow-base);
  --color-boxshadow-drop: 0.125rem 0.125rem 0.25rem var(--color-dropshadow-main-drop), -0.25rem -0.25rem 0.5rem var(--color-dropshadow-base);
}

/* GORKO: auto-generated utility classes start */
.bg-black {
  background: var(--color-black);
}

.bg-white {
  background: var(--color-white);
}

.bg-red-core {
  background: var(--color-red-core);
}

.bg-red {
  background: var(--color-red);
}

.bg-pink {
  background: var(--color-pink);
}

.bg-beige {
  background: var(--color-beige);
}

.bg-beige-dark {
  background: var(--color-beige-dark);
}

.bg-grey-dark {
  background: var(--color-grey-dark);
}

.bg-grey-mid {
  background: var(--color-grey-mid);
}

.bg-grey-light {
  background: var(--color-grey-light);
}

.bg-ren-grey-standard {
  background: var(--color-ren-grey-standard);
}

.bg-ren-grey-alternate {
  background: var(--color-ren-grey-alternate);
}

.color-black {
  color: var(--color-black);
}

.color-white {
  color: var(--color-white);
}

.color-red-core {
  color: var(--color-red-core);
}

.color-red {
  color: var(--color-red);
}

.color-pink {
  color: var(--color-pink);
}

.color-beige {
  color: var(--color-beige);
}

.color-beige-dark {
  color: var(--color-beige-dark);
}

.color-grey-dark {
  color: var(--color-grey-dark);
}

.color-grey-mid {
  color: var(--color-grey-mid);
}

.color-grey-light {
  color: var(--color-grey-light);
}

.color-ren-grey-standard {
  color: var(--color-ren-grey-standard);
}

.color-ren-grey-alternate {
  color: var(--color-ren-grey-alternate);
}

.font-base {
  font-family: var(--font-base);
}

.font-serif {
  font-family: var(--font-serif);
}

.text-100 {
  font-size: var(--size-100);
}

.text-200 {
  font-size: var(--size-200);
}

.text-300 {
  font-size: var(--size-300);
}

.text-400 {
  font-size: var(--size-400);
}

.text-500 {
  font-size: var(--size-500);
}

.text-600 {
  font-size: var(--size-600);
}

.text-700 {
  font-size: var(--size-700);
}

.text-800 {
  font-size: var(--size-800);
}

.text-900 {
  font-size: var(--size-900);
}

.weight-light {
  font-weight: var(--weight-light);
}

.weight-regular {
  font-weight: var(--weight-regular);
}

.weight-medium {
  font-weight: var(--weight-medium);
}

.weight-bold {
  font-weight: var(--weight-bold);
}

.box-shadow-default {
  box-shadow: var(--box-shadow-default);
}

.box-shadow-drop {
  box-shadow: var(--box-shadow-drop);
}

.line-height-400 {
  line-height: var(--line-height-400);
}

.line-height-300 {
  line-height: var(--line-height-300);
}

.line-height-500 {
  line-height: var(--line-height-500);
}

.z-index-100 {
  z-index: var(--z-index-100);
}

.z-index-200 {
  z-index: var(--z-index-200);
}

.z-index-300 {
  z-index: var(--z-index-300);
}

.z-index-400 {
  z-index: var(--z-index-400);
}

.z-index-500 {
  z-index: var(--z-index-500);
}

.z-index-600 {
  z-index: var(--z-index-600);
}

.z-index-700 {
  z-index: var(--z-index-700);
}

.z-index-800 {
  z-index: var(--z-index-800);
}

.z-index-900 {
  z-index: var(--z-index-900);
}

.width-full {
  width: var(--width-full);
}

.width-half {
  width: var(--width-half);
}

.width-quarter {
  width: var(--width-quarter);
}

.width-third {
  width: var(--width-third);
}

.width-card-small {
  width: var(--width-card-small);
}

.width-card {
  width: var(--width-card);
}

.width-card-wide {
  width: var(--width-card-wide);
}

.width-card-carousel {
  width: var(--width-card-carousel);
}

.width-aside {
  width: var(--width-aside);
}

.width-aside-narrow {
  width: var(--width-aside-narrow);
}

.width-content {
  width: var(--width-content);
}

.width-accent-border {
  width: var(--width-accent-border);
}

.width-mid {
  width: var(--width-mid);
}

.width-max {
  width: var(--width-max);
}

@media (min-width: 36em) {
  .sm\:text-100 {
    font-size: var(--size-100);
  }
  .sm\:text-200 {
    font-size: var(--size-200);
  }
  .sm\:text-300 {
    font-size: var(--size-300);
  }
  .sm\:text-400 {
    font-size: var(--size-400);
  }
  .sm\:text-500 {
    font-size: var(--size-500);
  }
  .sm\:text-600 {
    font-size: var(--size-600);
  }
  .sm\:text-700 {
    font-size: var(--size-700);
  }
  .sm\:text-800 {
    font-size: var(--size-800);
  }
  .sm\:text-900 {
    font-size: var(--size-900);
  }
  .sm\:width-full {
    width: var(--width-full);
  }
  .sm\:width-half {
    width: var(--width-half);
  }
  .sm\:width-quarter {
    width: var(--width-quarter);
  }
  .sm\:width-third {
    width: var(--width-third);
  }
  .sm\:width-card-small {
    width: var(--width-card-small);
  }
  .sm\:width-card {
    width: var(--width-card);
  }
  .sm\:width-card-wide {
    width: var(--width-card-wide);
  }
  .sm\:width-card-carousel {
    width: var(--width-card-carousel);
  }
  .sm\:width-aside {
    width: var(--width-aside);
  }
  .sm\:width-aside-narrow {
    width: var(--width-aside-narrow);
  }
  .sm\:width-content {
    width: var(--width-content);
  }
  .sm\:width-accent-border {
    width: var(--width-accent-border);
  }
  .sm\:width-mid {
    width: var(--width-mid);
  }
  .sm\:width-max {
    width: var(--width-max);
  }
}
@media (min-width: 48em) {
  .md\:text-100 {
    font-size: var(--size-100);
  }
  .md\:text-200 {
    font-size: var(--size-200);
  }
  .md\:text-300 {
    font-size: var(--size-300);
  }
  .md\:text-400 {
    font-size: var(--size-400);
  }
  .md\:text-500 {
    font-size: var(--size-500);
  }
  .md\:text-600 {
    font-size: var(--size-600);
  }
  .md\:text-700 {
    font-size: var(--size-700);
  }
  .md\:text-800 {
    font-size: var(--size-800);
  }
  .md\:text-900 {
    font-size: var(--size-900);
  }
  .md\:width-full {
    width: var(--width-full);
  }
  .md\:width-half {
    width: var(--width-half);
  }
  .md\:width-quarter {
    width: var(--width-quarter);
  }
  .md\:width-third {
    width: var(--width-third);
  }
  .md\:width-card-small {
    width: var(--width-card-small);
  }
  .md\:width-card {
    width: var(--width-card);
  }
  .md\:width-card-wide {
    width: var(--width-card-wide);
  }
  .md\:width-card-carousel {
    width: var(--width-card-carousel);
  }
  .md\:width-aside {
    width: var(--width-aside);
  }
  .md\:width-aside-narrow {
    width: var(--width-aside-narrow);
  }
  .md\:width-content {
    width: var(--width-content);
  }
  .md\:width-accent-border {
    width: var(--width-accent-border);
  }
  .md\:width-mid {
    width: var(--width-mid);
  }
  .md\:width-max {
    width: var(--width-max);
  }
}
@media (min-width: 62em) {
  .lg\:text-100 {
    font-size: var(--size-100);
  }
  .lg\:text-200 {
    font-size: var(--size-200);
  }
  .lg\:text-300 {
    font-size: var(--size-300);
  }
  .lg\:text-400 {
    font-size: var(--size-400);
  }
  .lg\:text-500 {
    font-size: var(--size-500);
  }
  .lg\:text-600 {
    font-size: var(--size-600);
  }
  .lg\:text-700 {
    font-size: var(--size-700);
  }
  .lg\:text-800 {
    font-size: var(--size-800);
  }
  .lg\:text-900 {
    font-size: var(--size-900);
  }
  .lg\:width-full {
    width: var(--width-full);
  }
  .lg\:width-half {
    width: var(--width-half);
  }
  .lg\:width-quarter {
    width: var(--width-quarter);
  }
  .lg\:width-third {
    width: var(--width-third);
  }
  .lg\:width-card-small {
    width: var(--width-card-small);
  }
  .lg\:width-card {
    width: var(--width-card);
  }
  .lg\:width-card-wide {
    width: var(--width-card-wide);
  }
  .lg\:width-card-carousel {
    width: var(--width-card-carousel);
  }
  .lg\:width-aside {
    width: var(--width-aside);
  }
  .lg\:width-aside-narrow {
    width: var(--width-aside-narrow);
  }
  .lg\:width-content {
    width: var(--width-content);
  }
  .lg\:width-accent-border {
    width: var(--width-accent-border);
  }
  .lg\:width-mid {
    width: var(--width-mid);
  }
  .lg\:width-max {
    width: var(--width-max);
  }
}
@media (min-width: 75em) {
  .xl\:text-100 {
    font-size: var(--size-100);
  }
  .xl\:text-200 {
    font-size: var(--size-200);
  }
  .xl\:text-300 {
    font-size: var(--size-300);
  }
  .xl\:text-400 {
    font-size: var(--size-400);
  }
  .xl\:text-500 {
    font-size: var(--size-500);
  }
  .xl\:text-600 {
    font-size: var(--size-600);
  }
  .xl\:text-700 {
    font-size: var(--size-700);
  }
  .xl\:text-800 {
    font-size: var(--size-800);
  }
  .xl\:text-900 {
    font-size: var(--size-900);
  }
  .xl\:width-full {
    width: var(--width-full);
  }
  .xl\:width-half {
    width: var(--width-half);
  }
  .xl\:width-quarter {
    width: var(--width-quarter);
  }
  .xl\:width-third {
    width: var(--width-third);
  }
  .xl\:width-card-small {
    width: var(--width-card-small);
  }
  .xl\:width-card {
    width: var(--width-card);
  }
  .xl\:width-card-wide {
    width: var(--width-card-wide);
  }
  .xl\:width-card-carousel {
    width: var(--width-card-carousel);
  }
  .xl\:width-aside {
    width: var(--width-aside);
  }
  .xl\:width-aside-narrow {
    width: var(--width-aside-narrow);
  }
  .xl\:width-content {
    width: var(--width-content);
  }
  .xl\:width-accent-border {
    width: var(--width-accent-border);
  }
  .xl\:width-mid {
    width: var(--width-mid);
  }
  .xl\:width-max {
    width: var(--width-max);
  }
}
/* GORKO: auto-generated utility classes end */
/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Remove default padding */
ul[class],
ol[class] {
  padding: 0;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
ul[class],
ol[class],
figure,
blockquote,
dl,
dd {
  margin: 0;
}

/* Set core root defaults */
html {
  scroll-behavior: smooth;
}

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

/* Remove list styles on ul, ol elements with a class attribute */
ul[class],
ol[class] {
  list-style: none;
}

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

/* 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;
}

/* Blur images when they have no alt attribute */
img:not([alt]) {
  filter: blur(10px);
}

/* Remove all animations and transitions for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
.visually-hidden:not(:focus):not(:active) {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
.visually-hidden:not(:focus):not(:active) + * {
  margin-top: 0;
}

:root,
[data-theme],
[data-mode] {
  --color-focus-outline: var(--color-accent);
}

*:focus-visible {
  outline: 1px solid var(--color-focus-outline);
}

.animate-fade {
  transition: opacity var(--transition-default);
}
.animate-fade:hover {
  opacity: 0;
}

.animate-move {
  transition: all var(--transition-long);
}
.animate-move:hover {
  opacity: 0;
}

/*------------------------------------*\
    $MIXINS
\*------------------------------------*/
.content > * + *, .content > * + ul[class], .content > * + ol[class] {
  margin-top: var(--flow-spacing, 1em);
}
.content iframe[src^="https://www.youtube.com"] {
  aspect-ratio: 16/9;
  width: 100%;
  height: auto;
}
.content a {
  overflow-wrap: break-word;
}

.content[data-justify=left] {
  text-align: left;
}

html[dir="ltr"] .content[data-justify=left] {
  text-align: left;
}

html[dir="rtl"] .content[data-justify=left] {
  text-align: left;
}

.content[data-justify=center] {
  text-align: center;
}

html[dir="ltr"] .content[data-justify=center] {
  text-align: center;
}

html[dir="rtl"] .content[data-justify=center] {
  text-align: center;
}
.content[data-justify=center] > * {
  margin-left: auto;
  margin-right: auto;
}

:root {
  --flow-spacing: 1em;
  --flow-spacing-horizontal: calc(2 * var(--flow-spacing));
}

.flow > * + *, .flow > * + ul[class], .flow > * + ol[class] {
  margin-top: var(--flow-spacing, 1em);
}

.flow-large > * + *, .flow-large > * + ul[class], .flow-large > * + ol[class] {
  margin-top: var(--flow-spacing-horizontal, 1em);
}

script + * {
  --flow-spacing: 0;
}
script + * > * {
  --flow-spacing: 1em;
}

fieldset {
  border: 0px none;
  padding: 0;
  border-left: 1px solid var(--color-accent);
  padding-left: var(--size-400);
  min-width: 0;
}

html[dir="ltr"] fieldset {
  border-left: 1px solid var(--color-accent);
  padding-left: var(--size-400);
}

html[dir="rtl"] fieldset {
  border-right: 1px solid var(--color-accent);
  padding-right: var(--size-400);
}
fieldset > * + *, fieldset > * + ul[class], fieldset > * + ol[class] {
  margin-top: var(--flow-spacing, 1em);
}
fieldset legend {
  font-family: var(--font-serif);
  font-size: var(--size-400);
}
fieldset:has(legend) {
  padding-top: var(--size-200);
}

.field-container > * + *, .field-container > * + ul[class], .field-container > * + ol[class] {
  margin-top: var(--flow-spacing, 1em);
}

label {
  --flow-spacing: var(--size-200);
  font-family: var(--font-serif);
  text-wrap: balance;
}
label > * + *, label > * + ul[class], label > * + ol[class] {
  margin-top: var(--flow-spacing, 1em);
}
label:has(input) {
  cursor: pointer;
}
label:has(input[type=checkbox]), label:has(input[type=radio]) {
  font-family: var(--font-base);
}

input,
textarea,
select {
  font-family: var(--font-base);
  font-size: var(--size-400);
  padding: var(--size-200) var(--size-400);
  border-radius: var(--size-500);
  background-color: var(--color-bg);
  border: 1px solid var(--color-border);
  display: block;
  width: 100%;
  max-width: var(--width-content);
  accent-color: var(--color-accent);
  caret-color: var(--color-accent);
  color: var(--color-text);
  outline-offset: 2px;
  outline-width: 2px;
  min-height: 100%;
}
input::placeholder,
textarea::placeholder,
select::placeholder {
  color: var(--color-border);
}

form label:has(input[type=checkbox], input[type=radio]) {
  display: inline-flex;
  gap: var(--size-rel-100);
  align-items: flex-start;
  padding-left: var(--size-200);
  padding-right: var(--size-200);
}

input[type=radio],
input[type=checkbox] {
  width: auto;
  display: inline-block;
  transition: var(--transition-default) background, var(--transition-default) color, var(--transition-default) border-color;
  -webkit-appearance: none;
          appearance: none;
  border-radius: 0.2em;
  padding: 0;
  width: 1em;
  height: 1em;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin: 0;
  flex-shrink: 0;
}
input[type=radio]:checked,
input[type=checkbox]:checked {
  background-color: var(--color-accent);
  border-color: var(--color-accent);
}
form ul:has(input[type=radio],
input[type=checkbox]) {
  --flow-spacing: 0;
  margin-bottom: 0;
}
form ul:has(input[type=radio],
input[type=checkbox]) li {
  padding-left: 0;
  padding-right: 0;
  padding-top: 0;
  padding-bottom: 0;
}
form ul:has(input[type=radio],
input[type=checkbox]) li + li {
  border-top: 1px solid var(--color-border);
  margin-top: 0;
}
form ul label:has(input[type=radio],
input[type=checkbox]) {
  padding-top: var(--size-100);
  padding-bottom: var(--size-100);
  transition: var(--transition-default) background-color, var(--transition-default) color;
  display: flex;
}
form ul label:has(input[type=radio],
input[type=checkbox]) input {
  margin-top: 0.1em;
}
form ul label:has(input[type=radio],
input[type=checkbox]):hover {
  background-color: var(--color-tint);
}
form ul label:has(input[type=radio],
input[type=checkbox]):has(input:checked) {
  background-color: var(--color-accent);
  color: var(--color-bg);
}
form ul label:has(input[type=radio],
input[type=checkbox]):has(input:checked) input {
  outline-color: var(--color-bg);
  border-color: var(--color-bg);
}

input[type=checkbox]:checked:checked {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3C!--! Font Awesome Pro 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc. --%3E%3Cpath d='M443.3 100.7c6.2 6.2 6.2 16.4 0 22.6l-272 272c-6.2 6.2-16.4 6.2-22.6 0l-144-144c-6.2-6.2-6.2-16.4 0-22.6s16.4-6.2 22.6 0L160 361.4 420.7 100.7c6.2-6.2 16.4-6.2 22.6 0z' fill='%23fff'/%3E%3C/svg%3E");
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3C!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--%3E%3Cpath d='M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z' fill='%23fff'/%3E%3C/svg%3E");
}
@media (prefers-color-scheme: dark) {
  input[type=checkbox]:checked:checked {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3C!--! Font Awesome Pro 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc. --%3E%3Cpath d='M443.3 100.7c6.2 6.2 6.2 16.4 0 22.6l-272 272c-6.2 6.2-16.4 6.2-22.6 0l-144-144c-6.2-6.2-6.2-16.4 0-22.6s16.4-6.2 22.6 0L160 361.4 420.7 100.7c6.2-6.2 16.4-6.2 22.6 0z'  fill='%23313132' /%3E%3C/svg%3E");
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3C!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--%3E%3Cpath d='M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z' fill='%23313132'/%3E%3C/svg%3E");
  }
}
[data-mode=dark] input[type=checkbox]:checked:checked {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3C!--! Font Awesome Pro 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc. --%3E%3Cpath d='M443.3 100.7c6.2 6.2 6.2 16.4 0 22.6l-272 272c-6.2 6.2-16.4 6.2-22.6 0l-144-144c-6.2-6.2-6.2-16.4 0-22.6s16.4-6.2 22.6 0L160 361.4 420.7 100.7c6.2-6.2 16.4-6.2 22.6 0z'  fill='%23313132' /%3E%3C/svg%3E");
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3C!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--%3E%3Cpath d='M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z' fill='%23313132'/%3E%3C/svg%3E");
}

input[type=radio] {
  border-radius: 50%;
}
input[type=radio]:checked {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 500'%3E%3Ccircle r='150' cx='250' cy='250' fill='%23fff' /%3E%3C/svg%3E");
}
@media (prefers-color-scheme: dark) {
  input[type=radio]:checked {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 500'%3E%3Ccircle r='150' cx='250' cy='250' fill='%23313132' /%3E%3C/svg%3E");
  }
}
[data-mode=dark] input[type=radio]:checked {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 500'%3E%3Ccircle r='150' cx='250' cy='250' fill='%23313132' /%3E%3C/svg%3E");
}

input[type=color] {
  padding: 0;
  border: 0;
}

input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  height: 1em;
  width: 1em;
  border-radius: 50em;
  background: url(../images/custom-icons/times-circle.svg) no-repeat 50% 50%;
  background-size: contain;
  opacity: 0;
  pointer-events: none;
}
@media (prefers-color-scheme: dark) {
  input[type=search]::-webkit-search-cancel-button {
    filter: invert(1);
  }
}
[data-mode=dark] input[type=search]::-webkit-search-cancel-button {
  filter: invert(1);
}

input[type=search]:focus::-webkit-search-cancel-button {
  opacity: 0.7;
  pointer-events: all;
}

select {
  -webkit-appearance: none;
          appearance: none;
  background-image: url(../images/svg/caret-down.svg);
  background-repeat: no-repeat;
  background-size: 1em auto;
  background-position: center right 1em;
}

select:focus {
  background-image: url(../images/svg/caret-select.svg);
}
@media (prefers-color-scheme: dark) {
  select:focus {
    background-image: url(../images/svg/caret-select-dark.svg);
  }
}
[data-mode=dark] select:focus {
  background-image: url(../images/svg/caret-select-dark.svg);
}

/*------------------------------------*\
    $GLOBAL CLASSES
\*------------------------------------*/
/* Headings */
/*Further Reading: http:/csswizardry.com/2012/02/pragmatic-practical-font-sizing-in-css/ */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: var(--font-serif);
  text-wrap: balance;
  line-height: var(--line-height-400);
  font-weight: var(--weight-medium);
}

h1,
.h1 {
  font-size: var(--size-700);
  font-weight: var(--weight-light);
}
[data-heading-variable] h1,
[data-heading-variable] .h1 {
  font-size: clamp(var(--size-700), 5vw, var(--size-900));
}

h2,
.h2 {
  font-size: var(--size-600);
  font-weight: var(--weight-light);
}
[data-heading-variable] h2,
[data-heading-variable] .h2 {
  font-size: clamp(var(--size-600), 4vw, var(--size-800));
}

h3,
.h3 {
  font-size: var(--size-500);
}
[data-heading-variable] h3,
[data-heading-variable] .h3 {
  font-size: clamp(var(--size-500), 3vw, var(--size-700));
}

h4,
.h4 {
  font-size: var(--size-400);
}
[data-heading-variable] h4,
[data-heading-variable] .h4 {
  font-size: clamp(var(--size-400), 2.66vw, var(--size-600));
}

h5,
.h5 {
  font-size: var(--size-300);
  margin: 0;
}
[data-heading-variable] h5,
[data-heading-variable] .h5 {
  font-size: clamp(var(--size-300), 2.33vw, var(--size-500));
}

h6,
.h6 {
  font-size: var(--size-200);
  margin: 0;
}
[data-heading-variable] h6,
[data-heading-variable] .h6 {
  font-size: clamp(var(--size-200), 2vw, var(--size-400));
}

.spacer:before {
  content: " ";
}

/* Links */
a {
  color: var(--color-accent);
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
  text-underline-offset: 0.2em;
  text-decoration-thickness: 0.1em;
  transition: var(--transition-default) color;
}
a[href]:hover {
  color: inherit;
}
a[href]:visited, a[href].a-visited {
  text-decoration-style: dotted;
}
a[href]:not([class]) active {
  transform: scale(98%);
}

a.link-inherit {
  color: inherit;
  text-decoration: inherit;
  transition: inherit;
}
a.link-inherit:hover {
  color: inherit;
}

ol:not([class]),
ul:not([class]),
dl:not([class]) {
  max-width: var(--width-content);
}
ol:not([class]) ol,
ol:not([class]) ul,
ol:not([class]) dl,
ul:not([class]) ol,
ul:not([class]) ul,
ul:not([class]) dl,
dl:not([class]) ol,
dl:not([class]) ul,
dl:not([class]) dl {
  padding-top: var(--size-300);
}
ol:not([class]) li,
ul:not([class]) li,
dl:not([class]) li {
  --flow-spacing: var(--size-300);
  padding-left: var(--size-200);
}
html[dir="ltr"] ol:not([class]) li,
html[dir="ltr"] ul:not([class]) li,
html[dir="ltr"] dl:not([class]) li {
  padding-left: var(--size-200);
}
html[dir="rtl"] ol:not([class]) li,
html[dir="rtl"] ul:not([class]) li,
html[dir="rtl"] dl:not([class]) li {
  padding-right: var(--size-200);
}
ol:not([class]) li::marker,
ul:not([class]) li::marker,
dl:not([class]) li::marker {
  color: var(--color-accent);
}
ol:not([class]) dt,
ul:not([class]) dt,
dl:not([class]) dt {
  --flow-spacing: 1em;
  font-family: var(--font-serif);
  font-size: var(--size-500);
}
ol:not([class]) > * + *, ol:not([class]) > * + ul[class], ol:not([class]) > * + ol[class],
ul:not([class]) > * + *,
ul:not([class]) > * + ul[class],
ul:not([class]) > * + ol[class],
dl:not([class]) > * + *,
dl:not([class]) > * + ul[class],
dl:not([class]) > * + ol[class] {
  margin-top: var(--flow-spacing, 1em);
}
ol[role=list]:not([class]), ol[role=group]:not([class]),
ul[role=list]:not([class]),
ul[role=group]:not([class]),
dl[role=list]:not([class]),
dl[role=group]:not([class]) {
  list-style: none;
  padding-left: 0;
  padding-right: 0;
  margin-left: 0;
  margin-right: 0;
}

:root {
  --csstools-color-scheme--light: initial;
  color-scheme: light dark;
}

@media (prefers-color-scheme: dark){

:root {
  --csstools-color-scheme--light:  ;
}
}

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

#main {
  position: relative;
  z-index: var(--z-index-400);
}

/*------------------------------------*\
    $MEDIA ELEMENTS
\*------------------------------------*/
/* Flexible Media */
img,
video,
object {
  max-width: 100%;
  height: auto;
}

iframe {
  max-width: 100%;
}

figure {
  padding: var(--size-300);
  border-radius: var(--size-200);
  background-color: var(--color-tint);
}
figure img {
  width: 100%;
  height: auto;
  border-radius: var(--size-100);
}
figure video,
figure iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  border-radius: var(--size-100);
}
figure > * {
  --flow-spacing: var(--size-100);
}
figure > * + *, figure > * + ul[class], figure > * + ol[class] {
  margin-top: var(--flow-spacing, 1em);
}

figcaption {
  font-style: italic;
}

* {
  scrollbar-color: var(--color-card-accent) var(--color-card-bg);
  scroll-behavior: smooth;
}

/*------------------------------------*\
    $Table
\*------------------------------------*/
table {
  border-collapse: collapse;
  border-spacing: 0;
  border: 1px solid var(--color-border);
  width: 100%;
}

th {
  text-align: left;
  border: 1px solid var(--color-border);
  padding: var(--size-100);
}

html[dir="ltr"] th {
  text-align: left;
}

html[dir="rtl"] th {
  text-align: left;
}

td {
  border: 1px solid var(--color-border);
  padding: var(--size-100);
}

html {
  -webkit-text-size-adjust: 100%;
}

/* Text-Related Elements */
body {
  font-family: var(--font-base);
  font-size: var(--size-400);
  line-height: var(--line-height-400);
}

p {
  max-width: var(--width-content);
}

/* Blockquote */
blockquote {
  font-size: var(--size-500);
  border-left: var(--width-accent-border) solid var(--color-accent);
  padding: var(--size-200) var(--size-500);
}
html[dir="ltr"] blockquote {
  border-left: var(--width-accent-border) solid var(--color-accent);
}
html[dir="rtl"] blockquote {
  border-right: var(--width-accent-border) solid var(--color-accent);
}
blockquote > * + *, blockquote > * + ul[class], blockquote > * + ol[class] {
  margin-top: var(--flow-spacing, 1em);
}
blockquote cite {
  font-size: var(--size-400);
  font-family: var(--font-base);
  font-style: normal;
  display: block;
}

/* Horizontal Rule */
hr {
  border: 1px solid var(--color-border);
  border-bottom: 0px none;
}

abbr {
  border-bottom: 1px dotted var(--color-border);
  cursor: help;
}

.hide-sm {
  display: none;
}
@media (min-width: 36em) {
  .hide-sm {
    display: block;
  }
}

@media (min-width: 36em) {
  .hide-md {
    display: none;
  }
}
@media (min-width: 48em) {
  .hide-md {
    display: block;
  }
}

@media (min-width: 48em) {
  .hide-lg {
    display: none;
  }
}
@media (min-width: 62em) {
  .hide-lg {
    display: block;
  }
}

@media (min-width: 62em) {
  .hide-vlg {
    display: none;
  }
}

img.alignright {
  float: right;
  margin: 0 0 1em 1em;
}

html[dir="ltr"] img.alignright {
  float: right;
}

html[dir="rtl"] img.alignright {
  float: right;
}

img.alignleft {
  float: left;
  margin: 0 1em 1em 0;
}

html[dir="ltr"] img.alignleft {
  float: left;
}

html[dir="rtl"] img.alignleft {
  float: left;
}

img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

a img.alignright {
  float: right;
  margin: 0 0 1em 1em;
}

html[dir="ltr"] a img.alignright {
  float: right;
}

html[dir="rtl"] a img.alignright {
  float: right;
}

a img.alignleft {
  float: left;
  margin: 0 1em 1em 0;
}

html[dir="ltr"] a img.alignleft {
  float: left;
}

html[dir="rtl"] a img.alignleft {
  float: left;
}

a img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

figure.wp-caption {
  max-width: 100%;
}

.logo {
  --logo-red: var(--color-accent);
  --logo-black: var(--color-text);
  --logo-11p-green: #27ad7a;
  --logo-strapline-length: 1;
  display: block;
  width: 30ch;
  max-width: 100%;
  -webkit-text-decoration: none;
  text-decoration: none;
  --logo-red: var(--color-accent);
  --logo-11p-green: #27ad7a;
}
[data-mode=light] .logo {
  --logo-red: var(--color-accent);
  --logo-11p-green: #27ad7a;
}
@media (prefers-color-scheme: dark) {
  .logo {
    --logo-red: var(--color-text);
    --logo-11p-green: var(--color-text);
  }
}
[data-mode=dark] .logo {
  --logo-red: var(--color-text);
  --logo-11p-green: var(--color-text);
}
[data-theme=white] .logo {
  --logo-red: var(--color-white);
  --logo-11p-green: var(--color-white);
  --logo-black: var(--color-white);
}
[data-theme=grey] .logo {
  --logo-red: var(--color-text);
  --logo-11p-green: var(--color-text);
}
.logo:has(.logo__strapline) {
  container-name: logo;
  container-type: inline-size;
}

.logo .svg-logo-red {
  fill: var(--logo-red);
}

.logo .svg-logo-black {
  fill: var(--logo-black);
}

.logo .svg-logo-11p-green {
  fill: var(--logo-11p-green);
}

.logo__strapline {
  font-size: 6.6666666667cqw;
  padding: var(--size-100);
  background-color: var(--color-card-bg);
  color: var(--color-text);
  text-align: center;
  display: block;
}

html[dir="ltr"] .logo__strapline {
  text-align: center;
}

html[dir="rtl"] .logo__strapline {
  text-align: center;
}

.button,
button:not([class]),
input[type=button]:not([class]) {
  /* Configuration */
  --button-padding: var(--size-rel-300) var(--size-rel-400);
  --button-gap: var(--size-rel-100);
  --button-bg: var(--color-accent);
  --button-color: var(--color-bg);
  --button-icon-color: currentColor;
  --button-border-width: 0.125em;
  --button-border-style: solid;
  --button-border-color: var(--button-bg);
  --button-border-radius: var(--size-rel-500);
  --button-box-shadow: none;
  --button-font-weight: var(--weight-bold);
  --button-font-size: 1rem;
  --button-hover-bg: var(--color-bg);
  --button-hover-color: var(--color-accent);
  --button-hover-border-color: var(--button-border-color);
  --button-hover-box-shadow: var(--color-boxshadow-drop);
  --button-disabled-opacity: 0.7;
  /* Layout and spacing */
  display: inline-flex;
  align-items: center;
  gap: var(--button-gap);
  padding: var(--button-padding);
  margin: 0;
  /* Colours */
  background: var(--button-bg);
  color: var(--button-color);
  /* Stroke and radius */
  border-width: var(--button-border-width);
  border-style: var(--button-border-style);
  border-color: var(--button-border-color);
  border-radius: var(--button-border-radius);
  /* Box shadow */
  box-shadow: var(--button-box-shadow);
  /* Typography */
  -webkit-text-decoration: none;
  text-decoration: none;
  font-weight: var(--button-font-weight, 700);
  font-size: var(--button-font-size, 1em);
  font-family: var(--font-base);
  line-height: 1.1;
  /* Interactive */
  transition: background var(--transition-default), color var(--transition-default), border var(--transition-default), box-shadow var(--transition-default), gap var(--transition-default), padding var(--transition-default);
}
.button:is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled):hover:not([data-hover=false]), .button:is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled).button--hover:not([data-hover=false]), a[href]:not(:disabled, .button--disabled):hover .button:not([data-hover=false]), a[href]:not(:disabled, .button--disabled) .button.button--hover:not([data-hover=false]), button:not(:disabled, .button--disabled):hover .button:not([data-hover=false]), button:not(:disabled, .button--disabled) .button.button--hover:not([data-hover=false]), summary:not(:disabled, .button--disabled):hover .button:not([data-hover=false]), summary:not(:disabled, .button--disabled) .button.button--hover:not([data-hover=false]),
button:not([class]):is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled):hover:not([data-hover=false]),
button:not([class]):is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled).button--hover:not([data-hover=false]),
a[href]:not(:disabled, .button--disabled):hover button:not([class]):not([data-hover=false]),
a[href]:not(:disabled, .button--disabled) button:not([class]).button--hover:not([data-hover=false]),
button:not(:disabled, .button--disabled):hover button:not([class]):not([data-hover=false]),
button:not(:disabled, .button--disabled) button:not([class]).button--hover:not([data-hover=false]),
summary:not(:disabled, .button--disabled):hover button:not([class]):not([data-hover=false]),
summary:not(:disabled, .button--disabled) button:not([class]).button--hover:not([data-hover=false]),
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled):hover:not([data-hover=false]),
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled).button--hover:not([data-hover=false]),
a[href]:not(:disabled, .button--disabled):hover input[type=button]:not([class]):not([data-hover=false]),
a[href]:not(:disabled, .button--disabled) input[type=button]:not([class]).button--hover:not([data-hover=false]),
button:not(:disabled, .button--disabled):hover input[type=button]:not([class]):not([data-hover=false]),
button:not(:disabled, .button--disabled) input[type=button]:not([class]).button--hover:not([data-hover=false]),
summary:not(:disabled, .button--disabled):hover input[type=button]:not([class]):not([data-hover=false]),
summary:not(:disabled, .button--disabled) input[type=button]:not([class]).button--hover:not([data-hover=false]) {
  background: var(--button-hover-bg);
  color: var(--button-hover-color);
  box-shadow: var(--button-hover-box-shadow);
  border-color: var(--button-hover-border-color);
  cursor: pointer;
}
.button:is(a[href], button, summary, input[type=button]):focus-visible, .button:is(a[href], button, summary, input[type=button]).button--focus-visible, a[href]:focus-visible .button, a[href] .button.button--focus-visible, button:focus-visible .button, button .button.button--focus-visible, summary:focus-visible .button, summary .button.button--focus-visible,
button:not([class]):is(a[href], button, summary, input[type=button]):focus-visible,
button:not([class]):is(a[href], button, summary, input[type=button]).button--focus-visible,
a[href]:focus-visible button:not([class]),
a[href] button:not([class]).button--focus-visible,
button:focus-visible button:not([class]),
button button:not([class]).button--focus-visible,
summary:focus-visible button:not([class]),
summary button:not([class]).button--focus-visible,
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]):focus-visible,
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]).button--focus-visible,
a[href]:focus-visible input[type=button]:not([class]),
a[href] input[type=button]:not([class]).button--focus-visible,
button:focus-visible input[type=button]:not([class]),
button input[type=button]:not([class]).button--focus-visible,
summary:focus-visible input[type=button]:not([class]),
summary input[type=button]:not([class]).button--focus-visible {
  outline-offset: 2px;
  outline-width: 2px;
}
.button:is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled):active:not(:has(.button__text)), .button:is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled).button--active:not(:has(.button__text)), a[href]:not(:disabled, .button--disabled):active .button:not(:has(.button__text)), a[href]:not(:disabled, .button--disabled) .button.button--active:not(:has(.button__text)), button:not(:disabled, .button--disabled):active .button:not(:has(.button__text)), button:not(:disabled, .button--disabled) .button.button--active:not(:has(.button__text)), summary:not(:disabled, .button--disabled):active .button:not(:has(.button__text)), summary:not(:disabled, .button--disabled) .button.button--active:not(:has(.button__text)),
button:not([class]):is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled):active:not(:has(.button__text)),
button:not([class]):is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled).button--active:not(:has(.button__text)),
a[href]:not(:disabled, .button--disabled):active button:not([class]):not(:has(.button__text)),
a[href]:not(:disabled, .button--disabled) button:not([class]).button--active:not(:has(.button__text)),
button:not(:disabled, .button--disabled):active button:not([class]):not(:has(.button__text)),
button:not(:disabled, .button--disabled) button:not([class]).button--active:not(:has(.button__text)),
summary:not(:disabled, .button--disabled):active button:not([class]):not(:has(.button__text)),
summary:not(:disabled, .button--disabled) button:not([class]).button--active:not(:has(.button__text)),
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled):active:not(:has(.button__text)),
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled).button--active:not(:has(.button__text)),
a[href]:not(:disabled, .button--disabled):active input[type=button]:not([class]):not(:has(.button__text)),
a[href]:not(:disabled, .button--disabled) input[type=button]:not([class]).button--active:not(:has(.button__text)),
button:not(:disabled, .button--disabled):active input[type=button]:not([class]):not(:has(.button__text)),
button:not(:disabled, .button--disabled) input[type=button]:not([class]).button--active:not(:has(.button__text)),
summary:not(:disabled, .button--disabled):active input[type=button]:not([class]):not(:has(.button__text)),
summary:not(:disabled, .button--disabled) input[type=button]:not([class]).button--active:not(:has(.button__text)) {
  transform: scale(98%);
}
.button:is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled):active:has(.button__text) .button__text, .button:is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled).button--active:has(.button__text) .button__text, a[href]:not(:disabled, .button--disabled):active .button:has(.button__text) .button__text, a[href]:not(:disabled, .button--disabled) .button.button--active:has(.button__text) .button__text, button:not(:disabled, .button--disabled):active .button:has(.button__text) .button__text, button:not(:disabled, .button--disabled) .button.button--active:has(.button__text) .button__text, summary:not(:disabled, .button--disabled):active .button:has(.button__text) .button__text, summary:not(:disabled, .button--disabled) .button.button--active:has(.button__text) .button__text,
button:not([class]):is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled):active:has(.button__text) .button__text,
button:not([class]):is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled).button--active:has(.button__text) .button__text,
a[href]:not(:disabled, .button--disabled):active button:not([class]):has(.button__text) .button__text,
a[href]:not(:disabled, .button--disabled) button:not([class]).button--active:has(.button__text) .button__text,
button:not(:disabled, .button--disabled):active button:not([class]):has(.button__text) .button__text,
button:not(:disabled, .button--disabled) button:not([class]).button--active:has(.button__text) .button__text,
summary:not(:disabled, .button--disabled):active button:not([class]):has(.button__text) .button__text,
summary:not(:disabled, .button--disabled) button:not([class]).button--active:has(.button__text) .button__text,
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled):active:has(.button__text) .button__text,
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled).button--active:has(.button__text) .button__text,
a[href]:not(:disabled, .button--disabled):active input[type=button]:not([class]):has(.button__text) .button__text,
a[href]:not(:disabled, .button--disabled) input[type=button]:not([class]).button--active:has(.button__text) .button__text,
button:not(:disabled, .button--disabled):active input[type=button]:not([class]):has(.button__text) .button__text,
button:not(:disabled, .button--disabled) input[type=button]:not([class]).button--active:has(.button__text) .button__text,
summary:not(:disabled, .button--disabled):active input[type=button]:not([class]):has(.button__text) .button__text,
summary:not(:disabled, .button--disabled) input[type=button]:not([class]).button--active:has(.button__text) .button__text {
  transform: scale(98%);
}
.button:is(a[href], button, summary, input[type=button]):visited, .button:is(a[href], button, summary, input[type=button]).button--visited, a[href]:visited .button, a[href] .button.button--visited, button:visited .button, button .button.button--visited, summary:visited .button, summary .button.button--visited,
button:not([class]):is(a[href], button, summary, input[type=button]):visited,
button:not([class]):is(a[href], button, summary, input[type=button]).button--visited,
a[href]:visited button:not([class]),
a[href] button:not([class]).button--visited,
button:visited button:not([class]),
button button:not([class]).button--visited,
summary:visited button:not([class]),
summary button:not([class]).button--visited,
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]):visited,
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]).button--visited,
a[href]:visited input[type=button]:not([class]),
a[href] input[type=button]:not([class]).button--visited,
button:visited input[type=button]:not([class]),
button input[type=button]:not([class]).button--visited,
summary:visited input[type=button]:not([class]),
summary input[type=button]:not([class]).button--visited {
  -webkit-text-decoration: underline;
  text-decoration: underline;
  text-decoration-style: dotted;
}
.button:is(a[href], button, summary, input[type=button]):disabled, .button:is(a[href], button, summary, input[type=button]).button--disabled, a[href]:disabled .button, a[href] .button.button--disabled, button:disabled .button, button .button.button--disabled, summary:disabled .button, summary .button.button--disabled,
button:not([class]):is(a[href], button, summary, input[type=button]):disabled,
button:not([class]):is(a[href], button, summary, input[type=button]).button--disabled,
a[href]:disabled button:not([class]),
a[href] button:not([class]).button--disabled,
button:disabled button:not([class]),
button button:not([class]).button--disabled,
summary:disabled button:not([class]),
summary button:not([class]).button--disabled,
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]):disabled,
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]).button--disabled,
a[href]:disabled input[type=button]:not([class]),
a[href] input[type=button]:not([class]).button--disabled,
button:disabled input[type=button]:not([class]),
button input[type=button]:not([class]).button--disabled,
summary:disabled input[type=button]:not([class]),
summary input[type=button]:not([class]).button--disabled {
  pointer-events: none;
  opacity: var(--button-disabled-opacity);
}
.button:is(a[href], button, summary, input[type=button]):is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary), .button:is(a[href], button, summary, input[type=button]).button--expanded, a[href]:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button, a[href] .button.button--expanded, button:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button, button .button.button--expanded, summary:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button, summary .button.button--expanded,
button:not([class]):is(a[href], button, summary, input[type=button]):is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary),
button:not([class]):is(a[href], button, summary, input[type=button]).button--expanded,
a[href]:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) button:not([class]),
a[href] button:not([class]).button--expanded,
button:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) button:not([class]),
button button:not([class]).button--expanded,
summary:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) button:not([class]),
summary button:not([class]).button--expanded,
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]):is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary),
input[type=button]:not([class]):is(a[href], button, summary, input[type=button]).button--expanded,
a[href]:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) input[type=button]:not([class]),
a[href] input[type=button]:not([class]).button--expanded,
button:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) input[type=button]:not([class]),
button input[type=button]:not([class]).button--expanded,
summary:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) input[type=button]:not([class]),
summary input[type=button]:not([class]).button--expanded {
  --button-border-color: var(--color-accent);
}
.button[hidden],
button:not([class])[hidden],
input[type=button]:not([class])[hidden] {
  display: none;
}

.button__icon {
  color: var(--button-icon-color);
  align-self: center;
}
.button__icon > *, .button__icon > .faicon {
  display: block;
}

.button__text {
  transform-origin: 0% 50%;
  transition: var(--transition-default) transform;
}
.button__text strong {
  display: block;
}

/* Variants */
.button[data-button-variant=primary]:is(a[href], button, summary, input[type=button]):is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary), .button[data-button-variant=primary]:is(a[href], button, summary, input[type=button]).button--expanded, a[href]:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=primary], a[href] .button[data-button-variant=primary].button--expanded, button:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=primary], button .button[data-button-variant=primary].button--expanded, summary:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=primary], summary .button[data-button-variant=primary].button--expanded {
  --button-bg: var(--color-card-bg);
  --button-color: var(--color-card-accent);
}

.button[data-button-variant=secondary] {
  --button-bg: transparent;
  --button-border-color: currentColor;
  --button-color: var(--color-text);
  --button-disabled-opacity: 0.5;
}

.button[data-button-variant=tertiary] {
  --button-bg: transparent;
  --button-border-color: currentColor;
  --button-color: var(--color-accent);
  --button-padding: 0.5em 0em;
  --button-border-radius: 0;
  --button-font-weight: var(--weight-regular);
  --button-hover-bg: transparent;
  --button-hover-box-shadow: none;
  --button-hover-color: var(--color-text);
  --button-disabled-opacity: 0.5;
  border-left-style: none;
  border-right-style: none;
  border-top: none;
}
.button[data-button-variant=tertiary]:is(a[href], button, summary, input[type=button]):visited, .button[data-button-variant=tertiary]:is(a[href], button, summary, input[type=button]).button--visited, a[href]:visited .button[data-button-variant=tertiary], a[href] .button[data-button-variant=tertiary].button--visited, button:visited .button[data-button-variant=tertiary], button .button[data-button-variant=tertiary].button--visited, summary:visited .button[data-button-variant=tertiary], summary .button[data-button-variant=tertiary].button--visited {
  --button-border-style: dotted;
  -webkit-text-decoration: none;
  text-decoration: none;
}
.button[data-button-variant=tertiary]:is(a[href], button, summary, input[type=button]):is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary), .button[data-button-variant=tertiary]:is(a[href], button, summary, input[type=button]).button--expanded, a[href]:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=tertiary], a[href] .button[data-button-variant=tertiary].button--expanded, button:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=tertiary], button .button[data-button-variant=tertiary].button--expanded, summary:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=tertiary], summary .button[data-button-variant=tertiary].button--expanded {
  --button-border-color: var(--color-text-light-lrg);
}

.button[data-button-variant=tag],
.button[data-button-variant=tag-secondary] {
  --button-padding: 0.35em 0.6em;
  --button-font-weight: var(--weight-regular);
  --button-font-size: var(--size-300);
}

.button[data-button-variant=tag]:is(a[href], button, summary, input[type=button]):is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary), .button[data-button-variant=tag]:is(a[href], button, summary, input[type=button]).button--expanded, a[href]:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=tag], a[href] .button[data-button-variant=tag].button--expanded, button:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=tag], button .button[data-button-variant=tag].button--expanded, summary:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=tag], summary .button[data-button-variant=tag].button--expanded {
  --button-bg: var(--color-card-bg);
  --button-color: var(--color-accent);
}

.button[data-button-variant=tag-secondary] {
  --button-bg: transparent;
  --button-border-color: currentColor;
  --button-color: var(--color-text);
  --button-disabled-opacity: 0.5;
}

.button[data-button-variant=type] {
  --button-border-radius: var(--size-200);
  --button-bg: var(--color-card-bg);
  --button-border-color: var(--color-border);
  --button-color: var(--color-card-text);
}

.button[data-button-variant=icon] {
  --button-bg: var(--color-bg);
  --button-color: var(--color-text);
  --button-hover-bg: var(--color-accent);
  --button-hover-color: var(--color-bg);
  --button-hover-box-shadow: none;
  --button-border-width: 0;
  --button-padding: 0;
  --button-border-radius: 50%;
  width: 1.7em;
  height: 1.7em;
  justify-content: center;
}

.button[data-button-variant=nav] {
  --button-bg: transparent;
  --button-border-style: solid;
  --button-border-width: 0;
  --button-border-color: transparent;
  --button-color: currentColor;
  --button-icon-color: var(--color-accent);
  --button-padding: 0.5em 0.5em;
  --button-border-radius: 0;
  --button-font-weight: var(--weight-regular);
  --button-font-size: 1em;
  --button-hover-bg: transparent;
  --button-hover-box-shadow: none;
  --button-hover-color: var(--color-accent);
  --button-disabled-opacity: 0.5;
  border-bottom-width: 1px;
}

.button[data-button-variant=tab] {
  --button-bg: var(--color-tint);
  --button-color: var(--color-text);
  --button-border-radius: 0;
  --button-hover-bg: var(--color-card-bg);
  --button-hover-color: var(--color-card-text);
  --button-hover-box-shadow: none;
  --button-hover-border-color: currentColor;
  --button-disabled-opacity: 0.5;
  --button-border-width: 0;
  position: relative;
  text-align: left;
  text-wrap: balance;
}

html[dir="ltr"] .button[data-button-variant=tab] {
  text-align: left;
}

html[dir="rtl"] .button[data-button-variant=tab] {
  text-align: left;
}
.button[data-button-variant=tab]:is(a[href], button, summary, input[type=button]):focus-visible, .button[data-button-variant=tab]:is(a[href], button, summary, input[type=button]).button--focus-visible, a[href]:focus-visible .button[data-button-variant=tab], a[href] .button[data-button-variant=tab].button--focus-visible, button:focus-visible .button[data-button-variant=tab], button .button[data-button-variant=tab].button--focus-visible, summary:focus-visible .button[data-button-variant=tab], summary .button[data-button-variant=tab].button--focus-visible {
  outline-offset: -2px;
}
.button[data-button-variant=tab] .button__text {
  border-left: 2px solid transparent;
  padding-right: var(--size-rel-200);
  transition: border-color var(--transition-default), padding var(--transition-default);
}
html[dir="ltr"] .button[data-button-variant=tab] .button__text {
  padding-right: var(--size-rel-200);
}
html[dir="rtl"] .button[data-button-variant=tab] .button__text {
  padding-left: var(--size-rel-200);
}
.button[data-button-variant=tab] strong,
.button[data-button-variant=tab] b {
  font-family: var(--font-serif);
  font-weight: var(--weight-medium);
  display: block;
  font-size: var(--size-500);
  margin-bottom: 0.3em;
}
.button[data-button-variant=tab] strong + br,
.button[data-button-variant=tab] b + br {
  display: none;
}
.button[data-button-variant=tab]:has(strong, b) {
  --button-font-weight: var(--weight-regular);
}
[data-tab-display=horizontal] .button[data-button-variant=tab] {
  border-top-left-radius: var(--size-200);
  border-top-right-radius: var(--size-200);
}
[data-tab-display=vertical] .button[data-button-variant=tab] {
  border-radius: 0;
  border-bottom-left-radius: var(--size-200);
  border-top-left-radius: var(--size-200);
}
[data-tab-display=mobile] .button[data-button-variant=tab] {
  padding: 0.5em;
}
.button[data-button-variant=tab]:is(a[href], button, summary, input[type=button]):is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary), .button[data-button-variant=tab]:is(a[href], button, summary, input[type=button]).button--expanded, a[href]:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=tab], a[href] .button[data-button-variant=tab].button--expanded, button:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=tab], button .button[data-button-variant=tab].button--expanded, summary:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=tab], summary .button[data-button-variant=tab].button--expanded {
  --button-color: var(--color-card-accent);
  --button-bg: var(--color-card-bg);
}
.button[data-button-variant=tab]:is(a[href], button, summary, input[type=button]):is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button__text, .button[data-button-variant=tab]:is(a[href], button, summary, input[type=button]).button--expanded .button__text, a[href]:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=tab] .button__text, a[href] .button[data-button-variant=tab].button--expanded .button__text, button:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=tab] .button__text, button .button[data-button-variant=tab].button--expanded .button__text, summary:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=tab] .button__text, summary .button[data-button-variant=tab].button--expanded .button__text {
  border-color: var(--color-card-accent);
  padding-right: 0;
  padding-left: var(--size-rel-200);
}
html[dir="ltr"] .button[data-button-variant=tab]:is(a[href],
html[dir="ltr"] button,
html[dir="ltr"] summary,
html[dir="ltr"] input[type=button]):is([aria-expanded=true],
html[dir="ltr"] [aria-selected=true],
html[dir="ltr"] [aria-current=page],
html[dir="ltr"] [aria-current=true],
html[dir="ltr"] details[open] > summary) .button__text,
html[dir="ltr"] .button[data-button-variant=tab]:is(a[href],
html[dir="ltr"] button,
html[dir="ltr"] summary,
html[dir="ltr"] input[type=button]).button--expanded .button__text,
html[dir="ltr"] a[href]:is([aria-expanded=true],
html[dir="ltr"] [aria-selected=true],
html[dir="ltr"] [aria-current=page],
html[dir="ltr"] [aria-current=true],
html[dir="ltr"] details[open] > summary) .button[data-button-variant=tab] .button__text,
html[dir="ltr"] a[href] .button[data-button-variant=tab].button--expanded .button__text,
html[dir="ltr"] button:is([aria-expanded=true],
html[dir="ltr"] [aria-selected=true],
html[dir="ltr"] [aria-current=page],
html[dir="ltr"] [aria-current=true],
html[dir="ltr"] details[open] > summary) .button[data-button-variant=tab] .button__text,
html[dir="ltr"] button .button[data-button-variant=tab].button--expanded .button__text,
html[dir="ltr"] summary:is([aria-expanded=true],
html[dir="ltr"] [aria-selected=true],
html[dir="ltr"] [aria-current=page],
html[dir="ltr"] [aria-current=true],
html[dir="ltr"] details[open] > summary) .button[data-button-variant=tab] .button__text,
html[dir="ltr"] summary .button[data-button-variant=tab].button--expanded .button__text {
  padding-right: 0;
  padding-left: var(--size-rel-200);
}
html[dir="rtl"] .button[data-button-variant=tab]:is(a[href],
html[dir="rtl"] button,
html[dir="rtl"] summary,
html[dir="rtl"] input[type=button]):is([aria-expanded=true],
html[dir="rtl"] [aria-selected=true],
html[dir="rtl"] [aria-current=page],
html[dir="rtl"] [aria-current=true],
html[dir="rtl"] details[open] > summary) .button__text,
html[dir="rtl"] .button[data-button-variant=tab]:is(a[href],
html[dir="rtl"] button,
html[dir="rtl"] summary,
html[dir="rtl"] input[type=button]).button--expanded .button__text,
html[dir="rtl"] a[href]:is([aria-expanded=true],
html[dir="rtl"] [aria-selected=true],
html[dir="rtl"] [aria-current=page],
html[dir="rtl"] [aria-current=true],
html[dir="rtl"] details[open] > summary) .button[data-button-variant=tab] .button__text,
html[dir="rtl"] a[href] .button[data-button-variant=tab].button--expanded .button__text,
html[dir="rtl"] button:is([aria-expanded=true],
html[dir="rtl"] [aria-selected=true],
html[dir="rtl"] [aria-current=page],
html[dir="rtl"] [aria-current=true],
html[dir="rtl"] details[open] > summary) .button[data-button-variant=tab] .button__text,
html[dir="rtl"] button .button[data-button-variant=tab].button--expanded .button__text,
html[dir="rtl"] summary:is([aria-expanded=true],
html[dir="rtl"] [aria-selected=true],
html[dir="rtl"] [aria-current=page],
html[dir="rtl"] [aria-current=true],
html[dir="rtl"] details[open] > summary) .button[data-button-variant=tab] .button__text,
html[dir="rtl"] summary .button[data-button-variant=tab].button--expanded .button__text {
  padding-left: 0;
  padding-right: var(--size-rel-200);
}

.button[data-button-variant=dot] {
  --button-padding: 0;
  --button-border-radius: 50%;
  --button-border-width: 1px;
  --button-font-weight: var(--weight-regular);
  --button-color: var(--color-accent);
  --button-bg: var(--color-bg);
  --button-border-color: var(--color-text-light-lrg);
  --button-hover-border-color: var(--color-accent);
  position: relative;
  width: 1em;
  height: 1em;
  justify-content: center;
  align-items: center;
}
.button[data-button-variant=dot] .button__icon {
  font-size: var(--size-rel-200);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.button[data-button-variant=dot] .button__text:not(.visually-hidden) {
  position: absolute;
  top: calc(100% + var(--size-rel-100));
  left: 50%;
  transform: translateX(-50%);
  max-width: 15ch;
  width: max-content;
  background-color: var(--color-accent);
  color: var(--color-bg);
  opacity: 0;
  pointer-events: none;
  text-align: center;
  transition: opacity var(--transition-default);
  padding: var(--size-rel-200);
  border-radius: var(--size-rel-200);
  word-break: break-word;
  font-size: var(--size-rel-300);
}
html[dir="ltr"] .button[data-button-variant=dot] .button__text:not(.visually-hidden) {
  text-align: center;
}
html[dir="rtl"] .button[data-button-variant=dot] .button__text:not(.visually-hidden) {
  text-align: center;
}
.button[data-button-variant=dot]:is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled):hover .button__text, .button[data-button-variant=dot]:is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled).button--hover .button__text, a[href]:not(:disabled, .button--disabled):hover .button[data-button-variant=dot] .button__text, a[href]:not(:disabled, .button--disabled) .button[data-button-variant=dot].button--hover .button__text, button:not(:disabled, .button--disabled):hover .button[data-button-variant=dot] .button__text, button:not(:disabled, .button--disabled) .button[data-button-variant=dot].button--hover .button__text, summary:not(:disabled, .button--disabled):hover .button[data-button-variant=dot] .button__text, summary:not(:disabled, .button--disabled) .button[data-button-variant=dot].button--hover .button__text {
  opacity: 1;
}
.button[data-button-variant=dot]:is(a[href], button, summary, input[type=button]):focus-visible .button__text, .button[data-button-variant=dot]:is(a[href], button, summary, input[type=button]).button--focus-visible .button__text, a[href]:focus-visible .button[data-button-variant=dot] .button__text, a[href] .button[data-button-variant=dot].button--focus-visible .button__text, button:focus-visible .button[data-button-variant=dot] .button__text, button .button[data-button-variant=dot].button--focus-visible .button__text, summary:focus-visible .button[data-button-variant=dot] .button__text, summary .button[data-button-variant=dot].button--focus-visible .button__text {
  opacity: 1;
}
.button[data-button-variant=dot]:is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled):active .button__text, .button[data-button-variant=dot]:is(a[href], button, summary, input[type=button]):not(:disabled, .button--disabled).button--active .button__text, a[href]:not(:disabled, .button--disabled):active .button[data-button-variant=dot] .button__text, a[href]:not(:disabled, .button--disabled) .button[data-button-variant=dot].button--active .button__text, button:not(:disabled, .button--disabled):active .button[data-button-variant=dot] .button__text, button:not(:disabled, .button--disabled) .button[data-button-variant=dot].button--active .button__text, summary:not(:disabled, .button--disabled):active .button[data-button-variant=dot] .button__text, summary:not(:disabled, .button--disabled) .button[data-button-variant=dot].button--active .button__text {
  transform: translateX(-50%) scale(98%);
}
.button[data-button-variant=dot]:is(a[href], button, summary, input[type=button]):is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary), .button[data-button-variant=dot]:is(a[href], button, summary, input[type=button]).button--expanded, a[href]:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=dot], a[href] .button[data-button-variant=dot].button--expanded, button:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=dot], button .button[data-button-variant=dot].button--expanded, summary:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button[data-button-variant=dot], summary .button[data-button-variant=dot].button--expanded {
  --button-color: var(--color-bg);
  --button-bg: var(--color-accent);
  --button-border-color: var(--color-accent);
  --button-hover-border-color: var(--color-accent);
}

/* Specific chevron-down icon with aria-expanded="true" */
.button .fa-chevron-down {
  transition: transform var(--transition-default);
}

.button .product-icon,
.button .theme-icon {
  font-size: var(--size-rel-500);
}

.button:is(a[href], button, summary, input[type=button]):is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .fa-chevron-down, .button:is(a[href], button, summary, input[type=button]).button--expanded .fa-chevron-down, a[href]:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button .fa-chevron-down, a[href] .button.button--expanded .fa-chevron-down, button:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button .fa-chevron-down, button .button.button--expanded .fa-chevron-down, summary:is([aria-expanded=true], [aria-selected=true], [aria-current=page], [aria-current=true], details[open] > summary) .button .fa-chevron-down, summary .button.button--expanded .fa-chevron-down {
  transform: rotate(180deg);
}

.form-single-input {
  display: flex;
  border: 1px solid var(--color-border);
  border-radius: var(--size-500);
  align-items: stretch;
  transition: border-color var(--transition-default);
}
.form-single-input:focus-within {
  border-color: var(--color-accent);
}
.form-single-input .field-container {
  display: contents;
}
.form-single-input label {
  --flow-spacing: 0;
  display: flex;
  align-items: stretch;
  width: 100%;
}
.form-single-input input {
  border: 0px none;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  width: 100%;
  border-right: 1px solid var(--color-border);
  max-width: initial;
}
html[dir="ltr"] .form-single-input input {
  border-right: 1px solid var(--color-border);
}
html[dir="rtl"] .form-single-input input {
  border-left: 1px solid var(--color-border);
}
.form-single-input .button[data-button-variant=icon] {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  flex-grow: 0;
  height: auto;
  padding-left: var(--size-400);
  padding-right: var(--size-500);
}
.form-single-input input,
.form-single-input button {
  outline-offset: -1px !important;
  outline-width: 2px;
}

.multi-range {
  position: relative;
  display: block;
  max-width: var(--width-content);
}

.multi-range[data-ready] .multi-range__inputs {
  position: relative;
  height: var(--size-400);
}
.multi-range[data-ready] .multi-range__inputs:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--color-border);
  top: 50%;
  left: 0;
}
.multi-range[data-ready] .multi-range__inputs label:not(:focus):not(:active) {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
.multi-range[data-ready] .multi-range__inputs label:not(:focus):not(:active) + * {
  margin-top: 0;
}
.multi-range[data-ready] .multi-range__inputs input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  pointer-events: all;
  width: var(--size-rel-400);
  height: var(--size-rel-400);
  background-color: var(--color-accent);
  border-radius: 50%;
  cursor: pointer;
}
.multi-range[data-ready] .multi-range__inputs input[type=range]::-moz-range-thumb {
  -webkit-appearance: none;
  pointer-events: all;
  width: var(--size-rel-400);
  height: var(--size-rel-400);
  background-color: var(--color-accent);
  border-radius: 50%;
  box-shadow: var(--color-boxshadow-drop);
  cursor: pointer;
}
.multi-range[data-ready] .multi-range__inputs input[type=range]::-webkit-slider-thumb:active {
  box-shadow: var(--color-boxshadow-drop);
}
.multi-range[data-ready] .multi-range__inputs input[type=range] {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  -webkit-appearance: none;
  appearance: none;
  height: var(--size-rel-400);
  margin: 0;
  padding: 0;
  border: 0px none;
  background-color: transparent;
  pointer-events: none;
}

.multi-range[data-ready] .multi-range__inputs__bar {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 100%;
  height: var(--size-rel-100);
  background-color: var(--color-accent);
  pointer-events: none;
  border-radius: var(--size-rel-100);
}

.multi-range__values {
  display: none;
}

.multi-range[data-ready] .multi-range__values {
  display: flex;
  justify-content: space-between;
  font-size: var(--size-rel-300);
}

.select-group {
  position: relative;
  z-index: var(--z-index-400);
  display: block;
  max-width: var(--width-content);
}
*:has(> .select-group) {
  position: relative;
  z-index: var(--z-index-400);
}
.select-group:has([aria-expanded=true]), *:has(> .select-group [aria-expanded=true]) {
  z-index: var(--z-index-500);
}

.select-group__button[data-button-variant=secondary] {
  --button-border-color: var(--color-border);
  --button-border-width: 1px;
  --button-font-weight: var(--weight-regular);
  --button-gap: 0.7em;
  --button-bg: var(--color-bg);
  position: relative;
  display: flex;
  justify-content: space-between;
  z-index: var(--z-index-400);
  text-align: left;
  width: 100%;
  transition: border var(--transition-default), border-radius var(--transition-default);
}

html[dir="ltr"] .select-group__button[data-button-variant=secondary] {
  text-align: left;
}

html[dir="rtl"] .select-group__button[data-button-variant=secondary] {
  text-align: left;
}
.select-group__button[data-button-variant=secondary] .button__text {
  min-width: 0;
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.select-group__button[data-button-variant=secondary] .button__text em {
  font-size: var(--size-300);
  color: var(--color-accent);
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.select-group__button[data-button-variant=secondary] .faicon {
  transition: var(--transition-default) transform;
}
.select-group__button[data-button-variant=secondary][aria-expanded=true] {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.select-group__list {
  position: relative;
  z-index: var(--z-index-300);
  --width-content: 100%;
  border: 1px solid var(--color-border);
  border-top: 0px none;
  border-radius: 0 0 var(--size-100) var(--size-100);
}
.select-group__list fieldset {
  padding: 0;
  margin-left: 0;
  margin-right: 0;
  border: 0px none;
}
@media (min-width: 62em) {
  .select-group__list {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background-color: var(--color-bg);
    max-height: 10em;
    overflow: auto;
  }
}

.custom-icon {
  --custom-icon-color: currentColor;
  --custom-icon-size: 1em;
  --custom-icon-bg: var(--color-card-bg);
  --custom-icon-accent: var(--color-accent);
  height: var(--custom-icon-size);
  font-size: var(--custom-icon-size);
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
}
.custom-icon svg {
  height: 100%;
  width: auto;
}
.custom-icon path,
.custom-icon polygon,
.custom-icon circle,
.custom-icon rectangle {
  transition: var(--transition-default) fill;
  fill: var(--custom-icon-color);
}
.custom-icon path.bg,
.custom-icon polygon.bg,
.custom-icon circle.bg,
.custom-icon rectangle.bg {
  fill: var(--custom-icon-bg);
}
.custom-icon path.accent,
.custom-icon polygon.accent,
.custom-icon circle.accent,
.custom-icon rectangle.accent {
  fill: var(--custom-icon-accent);
}

.faicon {
  --faicon-secondary-color: var(--color-card-bg);
  --fa-border-width: 0.5px;
  --fa-secondary-color: var(--faicon-secondary-color);
  --fa-secondary-opacity: 1;
}
.card:not([data-card-type=bullet]:not(:hover, :focus)) .faicon {
  --faicon-secondary-color: var(--color-bg);
}

.faicon[data-size=product] {
  font-size: var(--size-rel-200);
}

@property --icon-circle-rotation {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}
@property --icon-circle-scale {
  syntax: "<number>";
  inherits: false;
  initial-value: 1;
}
.icon-circle {
  --icon-circle-rotation: 0deg;
  --icon-circle-scale: 0.5;
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--size-400);
  font-size: 3cqmin;
  z-index: var(--z-index-700);
  margin: auto;
  container-type: normal;
  container-name: iconCircle;
}

.icon-circle__inner {
  position: relative;
  transform: scale(var(--icon-circle-scale)) rotate(var(--icon-circle-rotation));
  animation: 6s icon-circle-rotate infinite, 10s icon-circle-scale infinite;
  transform-origin: 50% 50%;
  height: calc(90% - 4rem);
  width: calc(90% - 4rem);
  border: 0.2em solid currentColor;
  border-radius: 50%;
}

.icon-circle__item {
  position: absolute;
  transform: translateX(-50%) translateY(-50%) rotate(calc(-1 * var(--icon-circle-rotation, 0deg)));
  animation: 5s icon-circle-pulse infinite;
  background-color: var(--color-accent);
  color: var(--color-bg);
  border-radius: 50%;
  width: 1.5em;
  height: 1.5em;
  display: flex;
  align-items: center;
  justify-content: center;
}

.icon-circle__item:nth-child(1) {
  top: 97.5528258148%;
  left: 65.4508497187%;
  animation-delay: 1s;
}

.icon-circle__item:nth-child(2) {
  top: 79.3892626146%;
  left: 9.5491502813%;
  animation-delay: 2s;
}

.icon-circle__item:nth-child(3) {
  top: 20.6107373854%;
  left: 9.5491502813%;
  animation-delay: 3s;
}

.icon-circle__item:nth-child(4) {
  top: 2.4471741852%;
  left: 65.4508497187%;
  animation-delay: 4s;
}

.icon-circle__item:nth-child(5) {
  top: 50%;
  left: 100%;
  animation-delay: 5s;
}

@keyframes icon-circle-rotate {
  0% {
    --icon-circle-rotation: 0deg;
  }
  50% {
    --icon-circle-rotation: 360deg;
  }
  100% {
    --icon-circle-rotation: 360deg;
  }
}
@keyframes icon-circle-scale {
  0% {
    --icon-circle-scale: 0.01;
  }
  10% {
    --icon-circle-scale: 1;
  }
  80% {
    --icon-circle-scale: 1;
  }
  90%, 100% {
    --icon-circle-scale: 0.01;
  }
}
@keyframes icon-circle-pulse {
  0% {
    font-size: 1em;
  }
  15% {
    font-size: 1.3em;
  }
  30% {
    font-size: 1em;
  }
  100% {
    font-size: 1em;
  }
}
.learningloop-icon {
  --learningloop-icon-color: currentColor;
  --learningloop-icon-size: var(--size-800);
  height: var(--learningloop-icon-size);
  font-size: var(--learningloop-icon-size);
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
}
.learningloop-icon svg {
  height: 100%;
  width: auto;
}

.learningloop-icon path {
  fill: var(--color-text);
}

.learningloop-icon circle {
  fill: transparent;
}

.learningloop-icon--item1 circle:nth-of-type(1),
.learningloop-icon--item2 circle:nth-of-type(2),
.learningloop-icon--item3 circle:nth-of-type(3) {
  fill: var(--color-accent);
}

.learningloop-icon[data-icon-size=full] {
  height: auto;
  width: 100%;
}

.marker-icon {
  --icon-color: var(--color-bg);
  --icon-bg: var(--color-accent);
  position: relative;
  display: inline-block;
  text-align: center;
  font-style: normal;
  font-family: var(--font-serif);
  font-weight: var(--weight-medium);
  font-size: var(--size-rel-300);
  padding: var(--size-rel-100);
  border-radius: var(--size-rel-100);
  background-color: var(--icon-bg);
  color: var(--icon-color);
  min-width: 2em;
  vertical-align: middle;
  transition: color var(--transition-default), background-color var(--transition-default);
  top: calc(-1 * var(--size-rel-100) / 4);
  border: 2px solid var(--color-bg);
}

html[dir="ltr"] .marker-icon {
  text-align: center;
}

html[dir="rtl"] .marker-icon {
  text-align: center;
}

.marker-icon::after {
  content: "";
  position: absolute;
  left: 50%;
  top: calc(100% - 1px);
  transform: translate(-50%, 0);
  width: 0;
  height: 0;
  border-left: var(--size-rel-100) solid transparent;
  border-right: var(--size-rel-100) solid transparent;
  border-top: var(--size-rel-100) solid var(--icon-bg);
  transition: border-color var(--transition-default);
}

.number-icon {
  position: relative;
  display: inline-block;
  text-align: center;
  font-style: normal;
  font-family: var(--font-serif);
  font-weight: var(--weight-bold);
  padding: var(--size-rel-100);
}

html[dir="ltr"] .number-icon {
  text-align: center;
}

html[dir="rtl"] .number-icon {
  text-align: center;
}

.product-icon {
  --product-icon-red: var(--color-accent);
  --product-icon-white: #fff;
  --product-icon-fill: var(--color-text);
  position: relative;
  display: inline-flex;
  width: 1em;
  height: 1em;
  transition: background var(--transition-default), border-radius var(--transition-default);
  overflow: hidden;
  will-change: transform;
}
a:not(.button):hover .product-icon .product-icon__icon {
  transform: scale(1.1);
}

.product-icon__icon {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform var(--transition-default);
  will-change: transform;
}
.product-icon__icon svg * {
  transition: fill var(--transition-default);
  fill: var(--product-icon-fill);
}

.product-icon-bg {
  display: none;
}

.product-icon-fill-red {
  --product-icon-fill: var(--product-icon-red);
}

.product-icon-fill-white {
  --product-icon-fill: var(--product-icon-white);
}

.product-icon[data-size=large] {
  font-size: var(--size-900);
}

.theme-icon {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  color: var(--color-text);
  width: 1em;
  height: 1em;
  transition: background var(--transition-default), border-radius var(--transition-default);
  overflow: hidden;
}
a:hover .theme-icon .theme-icon__icon {
  transform: scale(1.1);
}

.theme-icon__icon {
  font-size: 0.7em;
  display: block;
  line-height: 1;
  transition: var(--transition-default) transform;
  will-change: transform;
}

.theme-icon[data-size=large] {
  font-size: var(--size-900);
}

.trust-icon {
  /*[data-theme="alternative"] & {
    --trust-icon-grey: var(--color-white);
  }*/
  position: relative;
  display: block;
  --trust-icon-black: var(--color-grey-dark);
  --trust-icon-grey: var(--color-grey-light);
}
[data-mode=light] .trust-icon {
  --trust-icon-black: var(--color-grey-dark);
  --trust-icon-grey: var(--color-grey-light);
}
@media (prefers-color-scheme: dark) {
  .trust-icon {
    --trust-icon-black: var(--color-grey-light);
    --trust-icon-grey: var(--color-grey-dark);
  }
}
[data-mode=dark] .trust-icon {
  --trust-icon-black: var(--color-grey-light);
  --trust-icon-grey: var(--color-grey-dark);
}

.trust-icon-fill-black {
  fill: var(--trust-icon-black);
}

.trust-icon-fill-grey {
  fill: var(--trust-icon-black);
  opacity: 0.2;
}

.trust-icon__icon {
  position: relative;
}
.trust-icon__icon svg {
  display: block;
}

.trust-icon__stat {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.trust-icon__stat__circle {
  position: relative;
  width: 4em;
  height: 4em;
  flex-grow: 0;
  flex-shrink: 0;
  font-style: normal;
  font-weight: var(--weight-bold);
  background-color: var(--color-accent);
  border: 0.1em solid currentColor;
  border-radius: 50%;
  color: var(--color-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--size-600);
}

.img-border {
  position: relative;
  display: block;
  width: 100vw;
  max-width: calc(100% - 2 * var(--size-400));
  aspect-ratio: 1;
  aspect-ratio: 4/3;
  margin: var(--size-400);
}
.img-border:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.img-border img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.img-border--laptop {
  aspect-ratio: 1669/951;
}
.img-border--laptop:after {
  background-image: url(../images/image-borders/laptop-border.webp);
}
.img-border--laptop img {
  top: 5.5730809674%;
  left: 11.6836428999%;
  width: 76.8327142001%;
  height: 84.4%;
}

.img-border--tablet {
  aspect-ratio: 1358/1017;
}
.img-border--tablet:after {
  background-image: url(../images/image-borders/tablet-border.webp);
}
.img-border--tablet img {
  top: 6.784660767%;
  left: 7.7319587629%;
  width: 86.2860824742%;
  height: 85.6%;
}

.img-strip {
  position: relative;
  aspect-ratio: 16/9;
  width: 100%;
  overflow: hidden;
}
.img-strip img {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  max-width: initial;
  object-fit: cover;
  object-position: 50% 50%;
  animation: img-strip-movement 120s linear infinite;
}
@media (min-width: 62em) {
  .img-strip {
    aspect-ratio: 16/5;
  }
}

@keyframes img-strip-movement {
  0% {
    transform: none;
  }
  25% {
    transform: scale(1.1) translateX(-5%) translateY(-2%);
  }
  50% {
    transform: none;
  }
  75% {
    transform: scale(1.3) translateX(5%) translateY(2%);
  }
  100% {
    transform: none;
  }
}
:root {
  --learning-loop-speed: 14s;
}

learning-loop-visual {
  position: relative;
  display: block;
  pointer-events: none;
  container-type: inline-size;
  container-name: learningloop;
  margin-left: auto;
  margin-right: auto;
  max-width: 75%;
}
learning-loop-visual path {
  position: relative;
  fill: var(--color-accent);
}
learning-loop-visual svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
learning-loop-visual[data-animate] svg {
  animation: learning-loop-path-zindex var(--learning-loop-speed) infinite linear;
}
learning-loop-visual svg:nth-child(1) {
  position: relative;
  height: auto;
}
learning-loop-visual svg:nth-child(2) {
  animation-delay: calc(var(--learning-loop-speed) / 3);
}
learning-loop-visual svg:nth-child(3) {
  animation-delay: calc(var(--learning-loop-speed) / 3 * 2);
}
learning-loop-visual svg:nth-child(4) {
  z-index: var(--z-index-400);
}
learning-loop-visual circle {
  position: relative;
  fill: var(--color-text);
  display: none;
  offset-rotate: 0deg;
  offset-path: path("M299.99,247.31c2.86-53.46-.09-112.88-19.68-154.79C235.71-2.89,130.1,46.53,130.1,46.53c0,0-106.35,47.83-61,144.84h0c20.05,42.9,64.23,83.58,107.29,115.63l108.62,77.25c45.3,29.74,99.16,57.71,145.96,61.75,104.88,9.06,114.9-107.17,114.9-107.17,0,0,11.78-116.07-94.86-125.28-47.15-4.07-104.46,13.87-153.72,35.16h0l-121.19,55.53c-48.39,24.38-99.52,57.07-126.42,95.61-60.28,86.36,35.3,153.16,35.3,153.16,0,0,94.59,68.22,155.88-19.59h0c27.1-38.82,40.22-97.45,46.44-150.79l12.55-132.75c.05-.86.1-1.71.14-2.57Z");
  /*mask-image: url(../images/brand/logo-r.svg);
  mask-repeat: no-repeat;
  mask-size: 80% auto;
  mask-position: 50% 50%;*/
}
learning-loop-visual[data-animate] circle {
  animation: learning-loop-path var(--learning-loop-speed) infinite linear;
  display: block;
}

.learning-loop-visual__item {
  position: absolute;
  justify-content: center;
  display: flex;
  align-items: center;
  font-size: 4cqw;
  transform-origin: 50% 50%;
  aspect-ratio: 1/1;
  text-transform: uppercase;
  text-align: center;
  line-height: 1;
  z-index: var(--z-index-800);
}

html[dir="ltr"] .learning-loop-visual__item {
  text-align: center;
}

html[dir="rtl"] .learning-loop-visual__item {
  text-align: center;
}
learning-loop-visual[data-animate] .learning-loop-visual__item {
  animation: learning-loop-path-button var(--learning-loop-speed) infinite ease-in-out;
}
.learning-loop-visual__item:nth-child(1) {
  left: 16%;
  top: 9%;
  width: 30%;
}
.learning-loop-visual__item:nth-child(2) {
  left: 57.5%;
  top: 39.7%;
  width: 30%;
  animation-delay: calc(var(--learning-loop-speed) / 3);
}
.learning-loop-visual__item:nth-child(3) {
  left: 11%;
  top: 62%;
  width: 30%;
  animation-delay: calc(var(--learning-loop-speed) / 3 * 2);
}

@keyframes learning-loop-path-zindex {
  0% {
    z-index: var(--z-index-200);
  }
  50% {
    z-index: var(--z-index-200);
  }
  51% {
    z-index: var(--z-index-600);
  }
  100% {
    z-index: var(--z-index-600);
  }
}
@keyframes learning-loop-path {
  0% {
    offset-distance: 0%;
  }
  100% {
    offset-distance: 100%;
  }
}
@keyframes learning-loop-path-button {
  0% {
    transform: none;
  }
  5% {
    transform: scale(1.1);
  }
  10% {
    transform: none;
  }
  15% {
    transform: scale(1.1);
  }
  20% {
    transform: none;
  }
  25% {
    transform: scale(1.1);
  }
  33% {
    transform: none;
  }
  100% {
    transform: none;
  }
}
.youtube-embed iframe {
  width: 100%;
  aspect-ratio: 16/9;
  height: auto;
}

table {
  position: relative;
  overflow: auto;
  border: 0px none;
  box-shadow: var(--color-boxshadow-default);
  max-width: 100%;
  font-size: var(--size-rel-300);
}
@media (min-width: 62em) {
  table {
    font-size: var(--size-rel-400);
  }
}
table table {
  border: 0px none;
}
table td, table th {
  border-color: var(--color-tint);
  padding: var(--size-300);
}
table th, table thead td {
  --row-color: var(--color-accent);
  background-color: var(--color-accent);
  color: var(--color-bg);
  font-family: var(--font-serif);
  font-weight: var(--weight-normal);
}
table tbody tr:nth-child(even) {
  --row-color: var(--color-card-bg);
  background-color: var(--color-card-bg);
}
table td:first-child, table th:first-child {
  position: sticky;
  left: 0;
  background-color: var(--row-color, var(--color-bg));
  z-index: var(--zindex-400);
}

.table-wrapper {
  overflow: auto;
  max-width: 100%;
}

.table-wrapper table {
  overflow: visible;
}

.heading-icon {
  display: flex;
  gap: 1ch;
  align-items: center;
  flex-direction: row-reverse;
}
@media (min-width: 62em) {
  .heading-icon {
    flex-direction: row;
  }
}

.heading-icon__icon {
  flex-shrink: 0;
  font-size: var(--size-900);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1em;
  height: 1em;
}
.heading-icon__icon > * {
  display: flex;
}

.heading-icon__text {
  flex-grow: 1;
}

.heading-pre {
  text-transform: uppercase;
  color: var(--color-text-light-lrg);
}

.heading-pre:before {
  content: "";
  display: block;
  width: 3ch;
  height: 0.1em;
  background-color: currentColor;
  margin-bottom: var(--size-400);
}

.time-format {
  font-style: italic;
}

.trust-block {
  max-width: 20em;
  margin-left: auto;
  margin-right: auto;
}

.trust-block__text {
  text-align: center;
  font-size: var(--size-500);
  text-wrap: balance;
}

html[dir="ltr"] .trust-block__text {
  text-align: center;
}

html[dir="rtl"] .trust-block__text {
  text-align: center;
}

.card {
  --card-border: var(--color-card-border);
  --card-bg: var(--color-card-bg);
  --card-text: var(--color-card-text);
  --card-hover-bg: var(--color-card-bg);
  --card-hover-color: var(--color-card-text);
  --card-hover-border: var(--color-card-text);
  --flow-spacing: var(--size-400);
  --card-padding: var(--flow-spacing);
  --card-border-radius: var(--size-200);
  --card-width: var(--width-card);
  --card-box-shadow: var(--color-boxshadow-default);
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  max-width: 100%;
  width: var(--card-width);
  flex-grow: 1;
  flex-shrink: 1;
  text-align: left;
  container-name: card;
  container-type: inline-size;
}

html[dir="ltr"] .card {
  text-align: left;
}

html[dir="rtl"] .card {
  text-align: left;
}
.card:only-child {
  min-height: 100%;
}

.card__inner {
  position: relative;
  -webkit-text-decoration: none;
  text-decoration: none;
  border: 1px solid var(--card-border);
  background-color: var(--card-bg);
  color: var(--card-text);
  text-align: inherit;
  border-radius: var(--card-border-radius);
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
  box-shadow: var(--card-box-shadow);
  overflow: hidden;
  transition: var(--transition-default) color, var(--transition-default) background-color, var(--transition-default) border-color, var(--transition-default) box-shadow;
}

html[dir="ltr"] .card__inner {
  text-align: inherit;
}

html[dir="rtl"] .card__inner {
  text-align: inherit;
}
.card__inner:is(button, a[href]) {
  cursor: pointer;
}
.card__inner:is(a[href], button, summary, input[type=button]):not(:disabled, .card--disabled):hover, .card__inner:is(a[href], button, summary, input[type=button]):not(:disabled, .card--disabled).card--hover, a[href]:not(:disabled, .card--disabled):hover .card__inner, a[href]:not(:disabled, .card--disabled) .card__inner.card--hover, button:not(:disabled, .card--disabled):hover .card__inner, button:not(:disabled, .card--disabled) .card__inner.card--hover, summary:not(:disabled, .card--disabled):hover .card__inner, summary:not(:disabled, .card--disabled) .card__inner.card--hover {
  color: var(--card-hover-color);
  background-color: var(--card-hover-bg);
}
.card__inner:has(.card__action) {
  justify-content: space-between;
}

.card__main {
  width: 100%;
}

.card__content,
.card__action {
  padding: var(--card-padding);
}
.card__content + .card__content, .card__main:has(.card__content) + .card__content,
.card__content + .card__action,
.card__main:has(.card__content) + .card__action,
.card__action + .card__content,
.card__action + .card__action {
  padding-top: 0;
}

.card__content p {
  text-wrap: balance;
}

.card__content ul:not([class]) {
  list-style-type: disc;
  padding-left: var(--size-500);
}

html[dir="ltr"] .card__content ul:not([class]) {
  padding-left: var(--size-500);
}

html[dir="rtl"] .card__content ul:not([class]) {
  padding-right: var(--size-500);
}

.card__action {
  display: flex;
  align-items: center;
  gap: var(--card-padding);
  flex-wrap: wrap;
  width: 100%;
}

.card__metadata {
  display: flex;
  flex-wrap: wrap;
  gap: var(--flow-spacing);
}

.card__metadata__group {
  padding-left: var(--card-padding);
  border-left: 2px solid var(--color-accent);
}

html[dir="ltr"] .card__metadata__group {
  padding-left: var(--card-padding);
}

html[dir="rtl"] .card__metadata__group {
  padding-right: var(--card-padding);
}

.card__metadata dt {
  font-weight: var(--weight-bold);
  font-size: var(--size-rel-300);
}

.card__image {
  position: relative;
  height: 10em;
  overflow: hidden;
}
.card__image > img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: var(--transition-default) transform;
}

.card__tag {
  position: relative;
  text-align: right;
}

html[dir="ltr"] .card__tag {
  text-align: right;
}

html[dir="rtl"] .card__tag {
  text-align: right;
}
.card__tag .button {
  font-size: var(--size-300);
}

.card__image__tag {
  position: absolute;
  bottom: var(--size-200);
  right: var(--size-200);
}

.card__inner:is(a[href], button, summary, input[type=button]):not(:disabled, .card--disabled):hover, .card__inner:is(a[href], button, summary, input[type=button]):not(:disabled, .card--disabled).card--hover, a[href]:not(:disabled, .card--disabled):hover .card__inner, a[href]:not(:disabled, .card--disabled) .card__inner.card--hover, button:not(:disabled, .card--disabled):hover .card__inner, button:not(:disabled, .card--disabled) .card__inner.card--hover, summary:not(:disabled, .card--disabled):hover .card__inner, summary:not(:disabled, .card--disabled) .card__inner.card--hover {
  border-color: var(--card-hover-border);
}
.card__inner:is(a[href], button, summary, input[type=button]):not(:disabled, .card--disabled):hover .card__image > img, .card__inner:is(a[href], button, summary, input[type=button]):not(:disabled, .card--disabled).card--hover .card__image > img, a[href]:not(:disabled, .card--disabled):hover .card__inner .card__image > img, a[href]:not(:disabled, .card--disabled) .card__inner.card--hover .card__image > img, button:not(:disabled, .card--disabled):hover .card__inner .card__image > img, button:not(:disabled, .card--disabled) .card__inner.card--hover .card__image > img, summary:not(:disabled, .card--disabled):hover .card__inner .card__image > img, summary:not(:disabled, .card--disabled) .card__inner.card--hover .card__image > img {
  transform: scale(1.2);
}
.card__inner:is(a[href], button, summary, input[type=button]):not(:disabled, .card--disabled):active .card__content, .card__inner:is(a[href], button, summary, input[type=button]):not(:disabled, .card--disabled).card--active .card__content, a[href]:not(:disabled, .card--disabled):active .card__inner .card__content, a[href]:not(:disabled, .card--disabled) .card__inner.card--active .card__content, button:not(:disabled, .card--disabled):active .card__inner .card__content, button:not(:disabled, .card--disabled) .card__inner.card--active .card__content, summary:not(:disabled, .card--disabled):active .card__inner .card__content, summary:not(:disabled, .card--disabled) .card__inner.card--active .card__content {
  transform: scale(98%);
}

.card[data-card-type=bullet] {
  --card-bg: var(--color-bg);
  --card-text: var(--color-text);
  --card-hover-bg: var(--color-card-bg);
  --card-hover-color: var(--color-card-accent);
  --card-bullet-size: calc(1.5 * var(--card-padding));
}
.card[data-card-type=bullet] .card__bullet {
  font-size: var(--card-bullet-size);
  width: calc(2 * var(--card-padding) + var(--card-bullet-size));
  display: block;
  flex-grow: 0 !important;
}
.card[data-card-type=bullet] .card__bullet[data-color=accent] {
  color: var(--color-accent);
}
@container card (min-width: 20em) {
  .card[data-card-type=bullet][data-card-orientation=landscape] .card__bullet {
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
  }


  html[dir="ltr"] .card[data-card-type=bullet][data-card-orientation=landscape] .card__bullet {
    text-align: center;
  }


  html[dir="rtl"] .card[data-card-type=bullet][data-card-orientation=landscape] .card__bullet {
    text-align: center;
  }
  .card[data-card-type=bullet][data-card-orientation=landscape] .card__bullet + .card__content {
    padding-top: var(--card-padding);
  }
  .card[data-card-type=bullet][data-card-orientation=landscape] .card__inner {
    padding-left: calc(var(--card-bullet-size) + var(--card-padding));
  }
}
.card[data-card-type=bullet][data-card-orientation=landscape-force] .card__bullet {
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
}
html[dir="ltr"] .card[data-card-type=bullet][data-card-orientation=landscape-force] .card__bullet {
  text-align: center;
}
html[dir="rtl"] .card[data-card-type=bullet][data-card-orientation=landscape-force] .card__bullet {
  text-align: center;
}
.card[data-card-type=bullet][data-card-orientation=landscape-force] .card__bullet + .card__content {
  padding-top: var(--card-padding);
}
.card[data-card-type=bullet][data-card-orientation=landscape-force] .card__inner {
  padding-left: calc(var(--card-bullet-size) + var(--card-padding));
}
.card[data-card-type=bullet][data-card-size=large] {
  --card-padding: var(--size-600);
  --card-bullet-size: calc(1.8 * var(--card-padding));
}
.card[data-card-type=bullet][data-card-size=large] .card__content:not(:last-child) {
  padding-bottom: var(--flow-spacing);
}
.card[data-card-type=bullet][data-card-size=large]:has(.card__action) .card__content:last-child {
  padding-bottom: var(--flow-spacing);
}
.card[data-card-type=bullet][data-card-textalign=center] .card__bullet {
  margin-left: auto;
  margin-right: auto;
}
.card[data-card-type=bullet][data-card-textalign=center] p {
  margin-left: auto;
  margin-right: auto;
}
.card[data-card-type=bullet] .card__inner:is(a[href], button, summary, input[type=button]):not(:disabled, .card--disabled):hover .card__bullet, .card[data-card-type=bullet] .card__inner:is(a[href], button, summary, input[type=button]):not(:disabled, .card--disabled).card--hover .card__bullet, a[href]:not(:disabled, .card--disabled):hover .card[data-card-type=bullet] .card__inner .card__bullet, a[href]:not(:disabled, .card--disabled) .card[data-card-type=bullet] .card__inner.card--hover .card__bullet, button:not(:disabled, .card--disabled):hover .card[data-card-type=bullet] .card__inner .card__bullet, button:not(:disabled, .card--disabled) .card[data-card-type=bullet] .card__inner.card--hover .card__bullet, summary:not(:disabled, .card--disabled):hover .card[data-card-type=bullet] .card__inner .card__bullet, summary:not(:disabled, .card--disabled) .card[data-card-type=bullet] .card__inner.card--hover .card__bullet {
  color: var(--color-card-accent);
}

.card[data-card-type=feature],
.card[data-card-type=tip] {
  --card-hover-color: var(--color-card-accent);
  --card-width: var(--width-card-wide);
  text-align: center;
}

html[dir="ltr"] .card[data-card-type=feature],
html[dir="ltr"] .card[data-card-type=tip] {
  text-align: center;
}

html[dir="rtl"] .card[data-card-type=feature],
html[dir="rtl"] .card[data-card-type=tip] {
  text-align: center;
}
.card[data-card-type=feature] .card__content p,
.card[data-card-type=tip] .card__content p {
  margin-left: auto;
  margin-right: auto;
}
.card[data-card-type=feature] .card__icon,
.card[data-card-type=tip] .card__icon {
  font-size: var(--size-800);
  height: 1em;
  line-height: 1;
}
.card[data-card-type=feature] .card__icon[data-color=accent],
.card[data-card-type=tip] .card__icon[data-color=accent] {
  color: var(--color-card-accent);
}
.card[data-card-type=feature] .card__action,
.card[data-card-type=tip] .card__action {
  justify-content: center;
}

.card[data-card-type=multiaction] {
  text-align: center;
}

html[dir="ltr"] .card[data-card-type=multiaction] {
  text-align: center;
}

html[dir="rtl"] .card[data-card-type=multiaction] {
  text-align: center;
}
.card[data-card-type=multiaction] .card__content p {
  margin-left: auto;
  margin-right: auto;
}
.card[data-card-type=multiaction] .card__content .faicon,
.card[data-card-type=multiaction] .card__content .custom-icon {
  font-size: var(--size-800);
  color: var(--color-card-accent);
}
.card[data-card-type=multiaction] .card__action {
  justify-content: center;
}

@container card (min-width: 30em) {
  .card[data-card-type=article][data-card-orientation=landscape]:has(.card__image img) {
    --card-width: var(--width-card-carousel);
    min-height: var(--width-card);
  }
  .card[data-card-type=article][data-card-orientation=landscape]:has(.card__image img) .card__content,
  .card[data-card-type=article][data-card-orientation=landscape]:has(.card__image img) .card__action {
    padding-left: calc(50% + var(--card-padding));
  }
  .card[data-card-type=article][data-card-orientation=landscape]:has(.card__image img) .card__image {
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    aspect-ratio: initial;
  }
}
@container card (min-width: 30em) {
  .card[data-card-type=article][data-card-orientation=landscape-reverse]:has(.card__image img) {
    --card-width: var(--width-card-carousel);
    min-height: var(--width-card);
  }
  .card[data-card-type=article][data-card-orientation=landscape-reverse]:has(.card__image img) .card__content,
  .card[data-card-type=article][data-card-orientation=landscape-reverse]:has(.card__image img) .card__action {
    padding-right: calc(50% + var(--card-padding));
  }
  .card[data-card-type=article][data-card-orientation=landscape-reverse]:has(.card__image img) .card__image {
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    aspect-ratio: initial;
  }
}

@media (min-width: 62em) {
  .card[data-card-type=carousel]:not([data-card-orientation=portrait]) {
    --card-width: var(--width-card-carousel);
    --card-padding: calc(2 * var(--flow-spacing));
  }
  .card[data-card-type=carousel]:not([data-card-orientation=portrait]) .card__content,
  .card[data-card-type=carousel]:not([data-card-orientation=portrait]) .card__action {
    padding-left: calc(50% + var(--card-padding));
  }
  .card[data-card-type=carousel]:not([data-card-orientation=portrait]) .card__image {
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    aspect-ratio: initial;
  }
  .card[data-card-type=carousel]:not([data-card-orientation=portrait]) .card__inner {
    align-items: center;
  }
  .card[data-card-type=carousel]:not([data-card-orientation=portrait]) .card__image {
    flex-grow: 0;
    align-self: stretch;
  }
}

.card[data-card-type=product] {
  --card-width: var(--width-card);
}
.card[data-card-type=product] .card__icon {
  font-size: var(--size-900);
  width: 1em;
  height: 1em;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.card[data-card-type=article] {
  --card-width: var(--width-card-wide);
}

.card[data-card-type=image] .card__image {
  height: auto;
}
.card[data-card-type=image] .card__image > img {
  position: relative;
  left: auto;
  top: auto;
  height: auto;
  width: 100%;
}

.card[data-card-type=article-academic-interest] {
  --card-width: var(--width-card-full);
  --card-bg: transparent;
}

.card[data-card-type=profile] .card__image {
  height: auto;
  aspect-ratio: 1/1;
}

.card[data-card-width=full] {
  --card-width: 100% !important;
}

.card[data-card-width=auto] {
  --card-width: auto;
}

.card[data-card-width=menu] {
  flex-grow: 1;
}
.card[data-card-width=menu][data-card-type=article], .card[data-card-width=menu][data-card-type=feature] {
  --card-width: var(--width-card);
}
@media (min-width: 75em) {
  .card[data-card-width=menu][data-card-type=article], .card[data-card-width=menu][data-card-type=feature] {
    --card-width: var(--width-card-wide);
  }
}

.card[data-card-height=tall] .card__image {
  height: 20em;
}

.card[data-card-border=none] {
  --card-border: transparent;
  --card-box-shadow: none;
}

.card[data-card-border=shadow] {
  --card-box-shadow: var(--color-boxshadow-drop);
}

.card[data-card-justify=center] {
  margin-left: auto;
  margin-right: auto;
}

.card[data-card-textalign=center] {
  text-align: center;
}

html[dir="ltr"] .card[data-card-textalign=center] {
  text-align: center;
}

html[dir="rtl"] .card[data-card-textalign=center] {
  text-align: center;
}
.card[data-card-textalign=center] .card__action {
  justify-content: center;
}
.card[data-card-textalign=center] .icon-list__item {
  justify-content: center;
}

accordion-item {
  display: block;
  border-radius: var(--size-200);
  border: 1px solid var(--color-tint);
}
accordion-item summary.button[data-button-variant=nav] {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 1ch;
  --button-padding: 0.5em var(--flow-spacing);
}
accordion-item summary.button[data-button-variant=nav]::-webkit-details-marker {
  display: none;
}

.accordion__content {
  padding: var(--flow-spacing);
}

@media (min-width: 62em) {
  accordion-item[data-desktop] {
    border: 0px none;
  }
  accordion-item[data-desktop] details[open] summary {
    display: none;
  }
  accordion-item[data-desktop] details[open] summary + * {
    margin-top: 0;
  }
  accordion-item[data-desktop] .accordion__content {
    padding: 0;
  }
}

accordion-item[data-border=none] {
  border: 0px none;
}
accordion-item[data-border=none] summary.button[data-button-variant=nav] {
  --button-padding: 0.5em 0;
  --button-border-color: var(--color-tint);
}
accordion-item[data-border=none] .accordion__content {
  padding: var(--flow-spacing) 0;
}

.social-share {
  --social-facebook: #4c77d8;
  --social-twitter: #000;
  --social-linkedin: #0077b5;
  --social-whatsapp: #25d366;
  --social-email: var(--color-grey-dark);
  font-size: var(--size-300);
  display: block;
}
@media (min-width: 62em) {
  .social-share {
    font-size: var(--size-500);
    width: 2em;
  }
}

.social-share__title {
  font-size: var(--size-300);
  text-align: center;
  border: 1px solid var(--color-border);
  display: none;
  background-color: var(--color-bg);
  color: var(--color-text);
}

html[dir="ltr"] .social-share__title {
  text-align: center;
}

html[dir="rtl"] .social-share__title {
  text-align: center;
}
@media (min-width: 62em) {
  .social-share__title {
    display: block;
  }
}

.social-share__list {
  display: flex;
  width: 100%;
}
@media (min-width: 62em) {
  .social-share__list {
    flex-direction: column;
  }
}
.social-share__list li {
  flex-grow: 1;
}

a.social-share__item {
  --social-item-background: var(--color-bg);
  background-color: var(--social-item-background);
  color: var(--color-white);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 2em;
}
a.social-share__item .custom-icon {
  transition: var(--transition-default) transform;
}
a.social-share__item:hover {
  color: var(--color-white);
}
a.social-share__item:hover .custom-icon {
  transform: scale(1.2);
}
a.social-share__item--facebook {
  --social-item-background: var(--social-facebook);
}
a.social-share__item--twitter {
  --social-item-background: var(--social-twitter);
}
a.social-share__item--linkedin {
  --social-item-background: var(--social-linkedin);
}
a.social-share__item--whatsapp {
  --social-item-background: var(--social-whatsapp);
}
a.social-share__item--email {
  --social-item-background: var(--social-email);
}

.social-share[data-socialshare-position=sticky] {
  position: sticky;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: var(--z-index-500);
}
@media (min-width: 62em) {
  .social-share[data-socialshare-position=sticky] {
    top: 0;
    bottom: auto;
    left: auto;
    right: 0;
    padding-top: var(--size-500);
    width: 2em;
    float: right;
  }


  html[dir="ltr"] .social-share[data-socialshare-position=sticky] {
    float: right;
  }


  html[dir="rtl"] .social-share[data-socialshare-position=sticky] {
    float: right;
  }
}

.social-share[data-socialshare-mode=desktop] {
  display: none;
}
@media (min-width: 62em) {
  .social-share[data-socialshare-mode=desktop] {
    display: block;
  }
}

.social-share[data-socialshare-mode=mobile] {
  display: block;
}
@media (min-width: 62em) {
  .social-share[data-socialshare-mode=mobile] {
    display: none;
  }
}

.marketo-form {
  transition: var(--transition-default) background, var(--transition-default) max-height, var(--transition-default) filter;
  max-height: initial;
  display: block;
  text-align: left;
}

html[dir="ltr"] .marketo-form {
  text-align: left;
}

html[dir="rtl"] .marketo-form {
  text-align: left;
}

.marketo-form:has([data-styles-ready=false]) {
  --marketo-form-loading-scale: 2;
  --marketo-form-loading-size: calc(var(--marketo-form-loading-scale) * 2em);
  height: 100vh;
  max-height: 50vh;
  background: repeating-linear-gradient(180deg, var(--color-bg) 0em, var(--color-tint) 0em, var(--color-tint) var(--marketo-form-loading-size), var(--color-bg) var(--marketo-form-loading-size), var(--color-bg) calc(var(--marketo-form-loading-size) * (var(--marketo-form-loading-scale) - 0.5)));
  filter: blur(1px);
}

/*@property --marketo-form-loading-scale {
  syntax: '<number>';
  initial-value: 1;
  inherits: false;
}
@keyframes marketo-form-loading {
  0% {
    --marketo-form-loading-scale: 1;

  }
  50% {
    --marketo-form-loading-scale: 2;
  }
  100% {
    --marketo-form-loading-scale: 1;
  }
}*/
.mktoForm {
  opacity: 0;
  transition: var(--transition-default) opacity;
}

.mktoForm[data-styles-ready=true] {
  opacity: 1;
}

.mktoForm {
  /*display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: stretch;
  gap: var(--flow-spacing);*/
}

@media (min-width: 62em) {
  .mktoForm[data-columns="2"] {
    columns: 2;
  }
}

.mktoFormRow {
  max-width: var(--width-content);
}

.mktoFormRow:not(:has(.mktoFieldWrap, .mktoLabel)) {
  display: none;
}

.mktoFieldWrap {
  position: relative;
  page-break-inside: avoid;
  break-inside: avoid;
}

/* Label */
.mktoLabel {
  padding-left: var(--flow-spacing);
  padding-right: var(--flow-spacing);
  display: block;
  padding-bottom: var(--size-100);
}

.mktoAsterix {
  color: var(--color-accent);
  float: right;
  display: none;
}

html[dir="ltr"] .mktoAsterix {
  float: right;
}

html[dir="rtl"] .mktoAsterix {
  float: right;
}

.mktoRequiredField .mktoAsterix {
  display: block;
}

/* Width */
.mktoHasWidth {
  width: 100% !important;
}

.mktoFieldWrap:has(.mktoLogicalField) {
  display: flex;
  gap: var(--size-100);
  align-items: center;
}
.mktoFieldWrap:has(.mktoLogicalField) .mktoHasWidth {
  width: auto !important;
}
.mktoFieldWrap:has(.mktoLogicalField) .mktoLabel {
  padding: 0;
  font-family: var(--font-base);
}
.mktoFieldWrap:has(.mktoLogicalField) input[type=checkbox],
.mktoFieldWrap:has(.mktoLogicalField) input[type=radio] {
  margin: 0;
}

/* Errors */
.mktoErrorMsg {
  color: var(--color-accent);
  padding: var(--size-100);
  font-size: var(--size-300);
  background-color: var(--color-accent);
  color: var(--color-bg);
  position: absolute;
  max-width: 20ch;
  top: calc(100% - var(--size-100));
  right: var(--size-500);
}

search-form {
  position: relative;
  display: block;
  max-width: var(--width-content);
}

search-form form {
  position: relative;
  display: block;
}

.search-form__input {
  position: relative;
  z-index: var(--z-index-400);
}

.search-form__results {
  position: absolute;
  top: var(--size-500);
  left: 0;
  right: 0;
  padding: var(--size-rel-200);
  padding-top: calc(var(--size-500) + var(--size-rel-200));
  background-color: var(--color-bg);
  box-shadow: var(--color-boxshadow-drop);
  border: 1px solid var(--color-tint);
  border-radius: var(--size-rel-200);
  border-top-right-radius: 0;
  border-top-left-radius: 0;
  z-index: var(--z-index-200);
  max-height: 80vh;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.search-form__results__list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.search-form__results__list > * + *, .search-form__results__list > * + ul[class], .search-form__results__list > * + ol[class] {
  margin-top: var(--flow-spacing, 1em);
}
.search-form__results__list li {
  --flow-spacing: var(--size-rel-200);
}

.section:has(search-form) {
  z-index: var(--z-index-500);
}

.layout-columns {
  --columns-gap: var(--flow-spacing);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--columns-gap);
}
@media (min-width: 62em) {
  .layout-columns {
    flex-direction: row;
  }
}

.layout-columns[data-columns-justify=left] {
  justify-content: flex-start;
}

.layout-columns[data-columns-justify=center] {
  justify-content: center;
}

.layout-columns[data-columns-justify=right] {
  justify-content: flex-end;
}

.layout-columns[data-columns-justify=space-between] {
  justify-content: space-between;
}

@media (min-width: 62em) {
  .layout-columns[data-columns-grow] .layout-columns__item {
    flex-grow: 1;
    width: 1px;
    max-width: max-content;
  }
}

.layout-content {
  --layout-gap: var(--flow-spacing, 1em);
  --layout-width-main: 1px;
  --layout-width-aside: var(--width-aside);
  display: flex;
  justify-content: space-between;
  max-width: var(--width-max);
  gap: var(--layout-gap);
  flex-wrap: wrap;
}
@media (min-width: 62em) {
  .layout-content {
    flex-wrap: nowrap;
    --layout-gap: var(--flow-spacing-horizontal);
  }
}

.layout-content__main {
  width: 100%;
}
@media (min-width: 62em) {
  .layout-content__main {
    width: var(--layout-width-main);
    flex-grow: 1;
  }
}

.layout-content__aside {
  width: 100%;
}
@media (min-width: 62em) {
  .layout-content__aside {
    width: var(--layout-width-aside);
    flex-grow: 0;
    flex-shrink: 0;
  }
}

.layout-content[data-layout-align=middle] {
  align-items: center;
}

.layout-content[data-layout-align=stretch] {
  align-items: stretch;
}

.layout-content[data-layout-align=end] {
  align-items: flex-end;
}

.layout-content[data-layout-justify=start] {
  justify-content: flex-start;
}

@media (min-width: 62em) {
  .layout-content[data-layout-direction=reverse] {
    flex-direction: row-reverse;
  }
}

@media (min-width: 62em) {
  .layout-content[data-layout-width=flip] {
    --layout-width-main: var(--width-aside);
    --layout-width-aside: 1px;
  }
  .layout-content[data-layout-width=flip] .layout-content__main {
    flex-grow: 0;
  }
  .layout-content[data-layout-width=flip] .layout-content__aside {
    flex-grow: 1;
  }
}

@media (min-width: 62em) {
  .layout-content[data-layout-width=equal] .layout-content__aside,
  .layout-content[data-layout-width=equal] .layout-content__main {
    width: 1px;
    flex-grow: 1;
    flex-shrink: 0;
    max-width: 100%;
  }
}

@media (min-width: 62em) {
  .layout-content[data-layout-width=narrow] .layout-content__aside {
    width: var(--width-aside-narrow);
  }
}

@media (min-width: 62em) {
  .layout-content[data-layout-width=full] .layout-content__main {
    width: 100%;
    flex-shrink: 0;
  }
}
.layout-content[data-layout-width=full] .layout-content__aside {
  display: none;
}

.layout-content[data-layout-gap="600"] {
  --layout-gap: var(--size-600);
}
@media (min-width: 62em) {
  .layout-content[data-layout-gap="600"] {
    --layout-gap: calc(var(--size-600) * 2);
  }
}

.layout-content[data-layout-minheight=full] {
  min-height: 100%;
}

.layout-grid {
  --grid-gap: var(--flow-spacing);
  --grid-columns: 1;
  --grid-item-width: calc(
    (100% / var(--grid-columns)) - var(--grid-gap) + (var(--grid-gap) / var(--grid-columns))
  );
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: var(--grid-gap);
}

.layout-grid__item {
  flex-shrink: 0;
  flex-grow: 0;
  max-width: 100%;
}
.layout-grid__item--grow {
  flex-grow: 1;
}
.layout-grid__item--shrink {
  flex-shrink: 1;
}
[data-grid-columns] .layout-grid__item {
  width: var(--grid-item-width);
}
.layout-grid__item > * {
  width: 100%;
}

.layout-grid[data-grid-columns-min="2"] {
  --grid-columns: 2;
}

.layout-grid[data-grid-columns-min="3"] {
  --grid-columns: 3;
}

.layout-grid[data-grid-columns-min="4"] {
  --grid-columns: 4;
}

.layout-grid[data-grid-columns-min="5"] {
  --grid-columns: 5;
}

.layout-grid[data-grid-gap="500"] {
  --grid-gap: var(--size-500);
}

.layout-grid[data-grid-gap="600"] {
  --grid-gap: var(--size-600);
}

@media (min-width: 48em) {
  .layout-grid[data-grid-columns="2"] {
    --grid-columns: 2;
  }
}

@media (min-width: 48em) {
  .layout-grid[data-grid-columns="3"] {
    --grid-columns: 3;
  }
}

@media (min-width: 48em) {
  .layout-grid[data-grid-columns="4"] {
    --grid-columns: 2;
  }
}
@media (min-width: 62em) {
  .layout-grid[data-grid-columns="4"] {
    --grid-columns: 4;
  }
}

@media (min-width: 48em) {
  .layout-grid[data-grid-columns="5"] {
    --grid-columns: 3;
  }
}
@media (min-width: 62em) {
  .layout-grid[data-grid-columns="5"] {
    --grid-columns: 5;
  }
}

.layout-grid[data-grid-align=center] {
  align-items: center;
}

.layout-grid[data-grid-justify=center] {
  justify-content: center;
}

.layout-inline {
  --layout-gap: var(--size-100);
  --layout-justify: flex-start;
  --layout-align: flex-start;
  display: flex;
  flex-wrap: wrap;
  justify-content: var(--layout-justify);
  align-items: var(--layout-align);
  gap: var(--layout-gap);
}

.layout-inline[data-layout-justify=center] {
  --layout-justify: center;
}

.layout-inline[data-layout-justify=right] {
  --layout-justify: flex-end;
}

.layout-inline[data-layout-justify=space-between] {
  --layout-justify: space-between;
}

.layout-inline[data-layout-align=center] {
  --layout-align: center;
}

.layout-inline[data-layout-align=end] {
  --layout-align: flex-end;
}

.layout-inline[data-layout-gap="100"] {
  --layout-gap: calc(var(--size-100) * 1);
}

.layout-inline[data-layout-gap-vertical="100"] {
  row-gap: calc(var(--size-100) * 1);
}

.layout-inline[data-layout-gap-horizontal="100"] {
  column-gap: calc(var(--size-100) * 1);
}

.layout-inline[data-layout-gap="200"] {
  --layout-gap: calc(var(--size-200) * 1);
}

.layout-inline[data-layout-gap-vertical="200"] {
  row-gap: calc(var(--size-200) * 1);
}

.layout-inline[data-layout-gap-horizontal="200"] {
  column-gap: calc(var(--size-200) * 1);
}

.layout-inline[data-layout-gap="300"] {
  --layout-gap: calc(var(--size-300) * 1);
}

.layout-inline[data-layout-gap-vertical="300"] {
  row-gap: calc(var(--size-300) * 1);
}

.layout-inline[data-layout-gap-horizontal="300"] {
  column-gap: calc(var(--size-300) * 1);
}

.layout-inline[data-layout-gap="400"] {
  --layout-gap: calc(var(--size-400) * 1);
}

.layout-inline[data-layout-gap-vertical="400"] {
  row-gap: calc(var(--size-400) * 1);
}

.layout-inline[data-layout-gap-horizontal="400"] {
  column-gap: calc(var(--size-400) * 1);
}

.layout-inline[data-layout-gap="500"] {
  --layout-gap: calc(var(--size-500) * 1);
}

.layout-inline[data-layout-gap-vertical="500"] {
  row-gap: calc(var(--size-500) * 1);
}

.layout-inline[data-layout-gap-horizontal="500"] {
  column-gap: calc(var(--size-500) * 1);
}

.layout-inline[data-layout-gap="600"] {
  --layout-gap: calc(var(--size-600) * 1);
}

.layout-inline[data-layout-gap-vertical="600"] {
  row-gap: calc(var(--size-600) * 1);
}

.layout-inline[data-layout-gap-horizontal="600"] {
  column-gap: calc(var(--size-600) * 1);
}

.layout-inline[data-layout-gap="700"] {
  --layout-gap: calc(var(--size-700) * 1);
}

.layout-inline[data-layout-gap-vertical="700"] {
  row-gap: calc(var(--size-700) * 1);
}

.layout-inline[data-layout-gap-horizontal="700"] {
  column-gap: calc(var(--size-700) * 1);
}

.layout-inline[data-layout-gap="800"] {
  --layout-gap: calc(var(--size-800) * 1);
}

.layout-inline[data-layout-gap-vertical="800"] {
  row-gap: calc(var(--size-800) * 1);
}

.layout-inline[data-layout-gap-horizontal="800"] {
  column-gap: calc(var(--size-800) * 1);
}

.layout-inline[data-layout-gap="900"] {
  --layout-gap: calc(var(--size-900) * 1);
}

.layout-inline[data-layout-gap-vertical="900"] {
  row-gap: calc(var(--size-900) * 1);
}

.layout-inline[data-layout-gap-horizontal="900"] {
  column-gap: calc(var(--size-900) * 1);
}

.definition-list {
  --flow-spacing: var(--size-700);
  font-size: var(--size-500);
  line-height: var(--line-height-500);
}

.definition-list__group {
  --flow-spacing: 1em;
  display: flex;
  gap: 1em;
}

.definition-list__icon {
  position: relative;
  flex-grow: 0;
  flex-shrink: 0;
  font-size: 1.2em;
  width: 1em;
  top: -0.1em;
  text-align: center;
}

html[dir="ltr"] .definition-list__icon {
  text-align: center;
}

html[dir="rtl"] .definition-list__icon {
  text-align: center;
}

.definition-list__content dt {
  font-family: var(--font-serif);
  font-weight: var(--weight-medium);
  font-size: 0.77em;
  line-height: var(--line-height-400);
}
.definition-list__content dd {
  color: var(--color-accent);
  line-height: var(--line-height-400);
  margin-top: var(--size-100);
}
.definition-list__content dd + dd {
  margin-top: var(--size-200);
}

.icon-list {
  display: flex;
  flex-direction: column;
  align-items: justify;
  gap: var(--flow-spacing);
}

.icon-list__item {
  display: flex;
  gap: 1em;
  width: 100%;
}

.icon-list__icon {
  position: relative;
  flex-grow: 0;
  flex-shrink: 0;
  font-size: 1.2em;
  color: var(--color-accent);
  width: 1em;
  top: -0.1em;
  text-align: center;
}

html[dir="ltr"] .icon-list__icon {
  text-align: center;
}

html[dir="rtl"] .icon-list__icon {
  text-align: center;
}

.number-list {
  counter-reset: number-list;
  font-size: var(--size-500);
  line-height: var(--line-height-500);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1em;
  list-style: none;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 0;
  padding: 0;
}
.number-list li {
  position: relative;
  counter-increment: number-list;
  padding-left: 2.3em;
  margin-top: 0;
  margin-bottom: 0;
}
.number-list li:before {
  content: counter(number-list);
  position: absolute;
  top: 0;
  left: 0;
  width: 1.7em;
  height: 1.7em;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: var(--color-accent);
  color: var(--color-bg);
  font-weight: var(--weight-bold);
  font-size: 0.875em;
}

.tick-list {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1em;
}

.tick-list[data-list-size=large] {
  font-size: var(--size-500);
  line-height: var(--line-height-500);
}

.tick-list li {
  position: relative;
  padding-left: 2.3em;
  overflow-wrap: break-word;
  -webkit-hyphens: auto;
          hyphens: auto;
}

.tick-list li:before {
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  content: "\f00c";
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-accent);
  font-size: 1.3em;
  top: -0.1em;
}

.trust-list {
  flex-wrap: wrap;
  flex-direction: row;
  font-size: var(--size-500);
  line-height: var(--line-height-500);
}

@media (min-width: 36em) {
  .trust-list .icon-list__item {
    width: calc(50% - var(--flow-spacing) / 2);
  }
}

.map-iframe {
  position: relative;
  display: flex;
  height: 100%;
  min-height: 20em;
}
.map-iframe iframe {
  max-width: 100%;
  width: 100vw;
  max-height: 100%;
}

.alert {
  display: flex;
  gap: var(--flow-spacing-horizontal);
  align-items: center;
}

.alert__icon {
  color: var(--color-accent);
  font-size: var(--size-500);
}

.alert[data-alert-display=block] {
  padding: var(--flow-spacing);
  background-color: var(--color-card-bg);
}

.alert + .alert {
  border-top: 1px solid var(--color-border);
  padding-top: var(--flow-spacing);
}

@media (prefers-color-scheme: dark) {
  .alert:last-child {
    padding-bottom: var(--flow-spacing);
    border-bottom: 3px solid var(--color-text);
  }
}
[data-mode=dark] .alert:last-child {
  padding-bottom: var(--flow-spacing);
  border-bottom: 3px solid var(--color-text);
}

.site-modal {
  --modal-padding: var(--size-500) var(--size-600);
  --modal-footer-padding: var(--size-200) var(--size-600);
  display: inline-flex;
  align-items: stretch;
  justify-content: stretch;
  min-height: 100%;
}

.site-modal__dialog {
  border: 0px none;
  border-radius: var(--size-400);
  padding: 0;
  box-shadow: var(--color-boxshadow-default);
  text-align: left;
  max-width: calc(100% - 2 * var(--size-200));
}

html[dir="ltr"] .site-modal__dialog {
  text-align: left;
}

html[dir="rtl"] .site-modal__dialog {
  text-align: left;
}
@media (min-width: 62em) {
  .site-modal__dialog {
    min-width: var(--width-content);
  }
}

.site-modal__dialog::backdrop {
  background-color: var(--color-tint);
}

.site-modal__dialog__inner {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.site-modal__header {
  position: sticky;
  top: 0;
  left: 0;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  background-color: var(--color-card-bg);
  padding: var(--modal-padding);
  gap: var(--size-200);
  z-index: var(--z-index-600);
}

.site-modal__content {
  position: relative;
  padding: var(--modal-padding);
  flex-grow: 1;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.site-modal__content:has(.youtube-embed iframe, .iframe-embed iframe, video) {
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: var(--color-black);
  color: var(--color-white);
}

.site-modal__content:has(.youtube-embed iframe, video, .iframe-embed iframe, .img-embed img) {
  overflow: hidden;
}

.site-modal__content .youtube-embed iframe,
.site-modal__content .iframe-embed iframe,
.site-modal__content video {
  --video-unit: min(1vw, calc(1vh * 1.5));
  max-width: 100%;
  max-height: 100%;
  width: calc(var(--video-unit) * 80);
  height: calc(var(--video-unit) * 45);
}

.site-modal__content .img-embed > img {
  position: relative;
  max-width: 90vw;
  max-height: calc(90vh - 8em);
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.site-modal__content .img-embed .img-border {
  --img-unit: calc(
    min(calc(90vw - 2 * var(--size-500)), calc(90vh - 4em - 2 * var(--size-600))) / 90
  );
  position: relative;
  max-width: calc(var(--img-unit) * 90);
  max-height: calc(var(--img-unit) * 90);
  min-height: 0;
  min-width: 0;
  height: auto;
  margin: 0;
}

.site-modal__footer {
  display: flex;
  justify-content: flex-end;
  gap: var(--flow-spacing, 1rem);
  align-items: center;
  border-top: 1px solid var(--color-card-bg);
  padding: var(--modal-footer-padding);
}

/* Animations */
/*   Open state of the dialog  */
.site-modal__dialog[open] {
  opacity: 1;
  transform: scaleY(1);
}

/*   Closed state of the dialog   */
.site-modal__dialog {
  opacity: 0;
  transition: opacity var(--transition-long), transform var(--transition-long), overlay var(--transition-long) allow-discrete, display var(--transition-long) allow-discrete;
  /* Equivalent to
  transition: all 0.7s allow-discrete; */
}

/*   Before-open state  */
/* Needs to be after the previous dialog[open] rule to take effect,
    as the specificity is the same */
@starting-style {
  .site-modal__dialog[open] {
    opacity: 0;
  }
}
.site-modal__dialog[open]::backdrop {
  opacity: 1;
}

.site-modal__dialog::backdrop {
  opacity: 0;
  transition: opacity var(--transition-long);
}

@starting-style {
  .site-modal__dialog::backdrop {
    opacity: 0;
  }
}
.site-modal[data-display=block] {
  display: flex;
}

.breadcrumbs {
  line-height: var(--line-height-500);
}

.breadcrumbs span span {
  display: none;
}

.breadcrumbs > span span:nth-last-child(2) {
  display: inline-block;
}
.breadcrumbs > span span:nth-last-child(2) a:before {
  content: "< Back to ";
}
@media (min-width: 62em) {
  .breadcrumbs > span span:nth-last-child(2) a:before {
    content: "";
  }
}

@media (min-width: 62em) {
  .breadcrumbs > span span {
    display: inline-block;
    padding-right: 1ch;
    line-height: var(--line-height-400);
  }


  html[dir="ltr"] .breadcrumbs > span span {
    padding-right: 1ch;
  }


  html[dir="rtl"] .breadcrumbs > span span {
    padding-left: 1ch;
  }
  .breadcrumbs > span span:before {
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\f054";
    color: var(--color-accent);
    padding-right: 2ch;
    font-size: var(--size-300);
  }


  html[dir="ltr"] .breadcrumbs > span span:before {
    padding-right: 2ch;
  }


  html[dir="rtl"] .breadcrumbs > span span:before {
    padding-left: 2ch;
  }
  .breadcrumbs > span span:first-child:before {
    content: "\f015";
    padding-right: 1ch;
  }


  html[dir="ltr"] .breadcrumbs > span span:first-child:before {
    padding-right: 1ch;
  }


  html[dir="rtl"] .breadcrumbs > span span:first-child:before {
    padding-left: 1ch;
  }
  .breadcrumbs > span span a {
    -webkit-text-decoration: none;
    text-decoration: none;
  }
}
.focus-nav {
  display: flex;
  gap: var(--flow-spacing);
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.focus-nav__label {
  font-family: var(--font-serif);
  font-weight: var(--weight-regular);
  width: 100%;
  text-align: center;
}

html[dir="ltr"] .focus-nav__label {
  text-align: center;
}

html[dir="rtl"] .focus-nav__label {
  text-align: center;
}
@media (min-width: 62em) {
  .focus-nav__label {
    width: auto;
  }
}

.focus-nav__list {
  display: contents;
}

.footer-nav .button {
  --button-padding: 0;
}

.footer-nav__list li {
  --flow-spacing: var(--size-200);
}

.mega-nav {
  position: relative;
}
.mega-nav .layout-columns {
  --columns-gap: var(--size-700);
}
.mega-nav .section[data-shadow] {
  box-shadow: none;
}
@media (min-width: 62em) {
  .mega-nav .section[data-shadow] {
    box-shadow: var(--color-boxshadow-drop);
  }
}
.mega-nav .section__inner {
  padding-left: 0;
  padding-right: 0;
}
@media (min-width: 62em) {
  .mega-nav .section__inner {
    padding: var(--section-padding);
  }
}
@media (min-width: 62em) {
  .mega-nav {
    /*overflow: auto;
    -webkit-overflow-scrolling: touch;*/
    /*
    transition: opacity var(--transition-default), transform var(--transition-default);
    transform-origin: 50% 0%;

    &[hidden] {
      visibility: hidden;
      display: block;

      opacity: 0;
      transform: rotateX(-90deg);
    }*/
  }
}

.mega-nav__section {
  min-height: 100%;
}
@media (min-width: 62em) {
  .mega-nav__section .card {
    max-width: var(--width-card-wide);
    container-type: normal;
  }
}

.mega-nav__column > h4, .mega-nav__column > .h4 {
  color: var(--color-accent);
}

ul.mega-nav__list li {
  --flow-spacing: var(--size-200);
}
ul.mega-nav__list .button {
  --button-padding: 0;
}

.mega-nav__buttons {
  --flow-spacing: var(--size-600);
  display: flex;
  gap: var(--size-300);
  flex-wrap: wrap;
}

.mega-nav__close {
  position: absolute;
  top: var(--size-100);
  right: var(--size-100);
  z-index: var(--z-index-600);
  font-size: var(--size-500);
  --button-padding: 0.35em 0.6em;
  display: none;
}
@media (min-width: 62em) {
  .mega-nav__close {
    display: block;
  }
}

.pagination {
  display: flex;
  justify-content: center;
  gap: var(--flow-spacing);
  flex-wrap: wrap;
}

.pagination__pages {
  display: flex;
  gap: var(--flow-spacing);
  flex-wrap: wrap;
}

.pagination__dir {
  -webkit-text-decoration: none;
  text-decoration: none;
}
.pagination__dir .faicon {
  font-size: var(--size-300);
}
.pagination__dir[disabled] {
  opacity: 0.5;
  color: var(--color-text);
}

.pagination__link,
.pagination__current {
  min-width: 2ch;
  display: inline-block;
  -webkit-text-decoration: none;
  text-decoration: none;
  text-align: center;
}

html[dir="ltr"] .pagination__link,
html[dir="ltr"] .pagination__current {
  text-align: center;
}

html[dir="rtl"] .pagination__link,
html[dir="rtl"] .pagination__current {
  text-align: center;
}

.pagination__current {
  border-bottom: 2px solid currentColor;
}

primary-nav {
  position: relative;
}

.primary-nav__list > li + li {
  border-top: 1px solid var(--color-border);
}
@media (min-width: 62em) {
  .primary-nav__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  .primary-nav__list > li + li {
    border-top: 0;
  }
}

primary-nav-item {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: var(--size-100);
  padding: var(--size-200) var(--size-400);
  justify-content: space-between;
}
@media (min-width: 62em) {
  primary-nav-item {
    border-top-left-radius: var(--size-100);
    border-top-right-radius: var(--size-100);
  }
}
primary-nav-item:not(:has(.primary-nav__expander)) .primary-nav__link.button[data-button-variant=nav] {
  flex-grow: 1;
}
primary-nav-item .primary-nav__link.button[data-button-variant=nav] {
  --button-padding: 0;
  position: relative;
  font-size: 1.15em;
  line-height: 1.5;
}
primary-nav-item .primary-nav__expander.button[data-button-variant=icon] {
  --button-padding: 0;
  --button-bg: transparent;
  --button-color: currentColor;
  --button-hover-bg: transparent;
  --button-hover-color: currentColor;
  --button-border-radius: 0;
  transition: 0.2s transform;
  flex-grow: 1;
}
primary-nav-item .primary-nav__expander.button[data-button-variant=icon] .button__icon {
  margin-left: auto;
}
primary-nav-item .mega-nav {
  width: 100%;
}
@media (min-width: 62em) {
  primary-nav-item .mega-nav {
    position: absolute;
    top: 100%;
    left: 0;
  }
}
primary-nav-item[data-menu-expanded=true] {
  background-color: var(--color-card-bg);
}

.simple-nav {
  position: relative;
}

.simple-nav__list > li + li {
  border-top: 1px solid var(--color-border);
}
.simple-nav__list > li + li:has(.button[data-button-variant=primary]) {
  border-top: 0;
}
@media (min-width: 62em) {
  .simple-nav__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  .simple-nav__list > li + li {
    border-top: 0;
  }
}

simple-nav-item {
  position: relative;
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  padding: var(--size-200) var(--size-400);
  justify-content: space-between;
}
@media (min-width: 62em) {
  simple-nav-item {
    border-top-left-radius: var(--size-100);
    border-top-right-radius: var(--size-100);
  }
}
simple-nav-item[data-menu-expanded=true] {
  background-color: var(--color-card-bg);
}
simple-nav-item .button[data-button-variant=nav] {
  flex-grow: 1;
}

.simple-nav-item__expander.button[data-button-variant=nav] {
  --button-icon-color: currentColor;
}

.simple-nav-item__expander.button[data-button-variant=icon] {
  --button-padding: 0;
  --button-bg: transparent;
  --button-color: currentColor;
  --button-hover-bg: transparent;
  --button-hover-color: currentColor;
  --button-border-radius: 0;
  width: auto;
  height: auto;
  transition: 0.2s transform, var(--transition-default) border, var(--transition-default) color, var(--transition-default) background-color;
  flex-grow: 0;
  border-bottom-width: 1px;
}

simple-nav-item[data-menu-expanded=true] > .button[data-button-variant=nav] {
  --button-border-color: var(--color-accent);
}

simple-nav-item .button[aria-current=page] + .button[data-button-variant=icon] {
  --button-border-color: var(--color-accent);
}

.simple-nav-item__expander {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

ul.simple-nav-item__submenu {
  width: 100%;
}
@media (min-width: 62em) {
  ul.simple-nav-item__submenu {
    position: absolute;
    top: 100%;
    right: 0;
    width: 100%;
    padding: var(--size-200);
    background: var(--color-card-bg);
    border-bottom-right-radius: var(--size-100);
    border-bottom-left-radius: var(--size-100);
  }
}

.sitewide-nav {
  position: relative;
  z-index: var(--z-index-500);
}

.sitewide-nav__list {
  display: flex;
  gap: var(--size-200);
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}
@media (min-width: 62em) {
  .sitewide-nav__list {
    justify-content: flex-end;
  }
}

sitewide-nav-dropdown {
  position: relative;
}

.sitewide-nav__dropdown__content {
  border: 1px solid var(--color-border);
  border-radius: var(--size-200);
}
@media (min-width: 62em) {
  .sitewide-nav__dropdown__content {
    position: absolute;
    top: calc(100% + var(--size-100));
    left: 0;
    width: 100%;
    background-color: var(--color-bg);
  }
}
.sitewide-nav__dropdown__content .button {
  width: 100%;
}

.table-of-contents {
  padding: var(--size-400);
  background-color: var(--color-card-bg);
  border: 1px solid var(--color-card-border);
  border-radius: var(--size-400);
  max-width: var(--width-content);
}

.table-of-contents ol {
  margin-bottom: 0;
}

.section {
  --section-width: var(--width-max);
  --section-padding: var(--size-600);
  --section-minheight: 0;
  position: relative;
  z-index: var(--z-index-400);
}
@media (min-width: 62em) {
  .section {
    --section-padding: var(--size-800);
  }
}
.section[data-sticky] {
  position: sticky;
  top: -1px;
  left: 0;
  z-index: var(--z-index-600);
}
.section[data-sticky=bottom] {
  top: auto;
  bottom: -1px;
}

.section[data-shadow] {
  box-shadow: var(--color-boxshadow-drop);
}

.section__inner {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  max-width: var(--section-width);
  width: 100%;
  padding: var(--section-padding);
  min-height: var(--section-minheight);
  z-index: var(--z-index-400);
}

.section[data-width=full] {
  --section-width: 100%;
}

.section[data-width=mid] {
  --section-width: var(--width-mid);
}

.section[data-width=thin] {
  --section-width: var(--width-content);
}

.section[data-padding=none] {
  --section-padding: 0;
}

.section[data-padding=notop] .section__inner {
  padding-top: 0;
}

.section[data-padding=nobottom] .section__inner {
  padding-bottom: 0;
}

.section[data-padding=noblock] .section__inner {
  padding-top: 0;
  padding-bottom: 0;
}

.section[data-padding=narrow] .section__inner {
  padding: calc(var(--section-padding) / 2) var(--section-padding);
}

.section[data-padding=narrowbottom] .section__inner {
  padding-bottom: calc(var(--section-padding) / 2);
}

.section[data-padding=narrow-nobottom] .section__inner {
  padding: calc(var(--section-padding) / 2) var(--section-padding);
}
.section[data-padding=narrow-nobottom] .section__inner {
  padding-bottom: 0;
}

.section[data-padding=equal-narrow] .section__inner {
  padding: calc(var(--section-padding) / 2);
}

.section[data-padding="400"] .section__inner {
  padding: var(--size-400) var(--section-padding);
}

@media (min-width: 62em) {
  .section[data-padding-desktop=notop] .section__inner {
    padding-top: 0;
  }
}

@media (min-width: 62em) {
  .section[data-padding-desktop=nobottom] .section__inner {
    padding-bottom: 0;
  }
}

@media (min-width: 62em) {
  .section[data-padding-desktop=noblock] .section__inner {
    padding-top: 0;
    padding-bottom: 0;
  }
}

@media (min-width: 62em) {
  .section[data-padding-desktop=narrow] .section__inner {
    padding: calc(var(--section-padding) / 2) var(--section-padding);
  }
}

@media (min-width: 62em) {
  .section[data-padding-desktop=narrowbottom] .section__inner {
    padding-bottom: calc(var(--section-padding) / 2);
  }
}

.section[data-height=full] {
  --section-minheight: 100vh;
}

.section[data-height=half] {
  --section-minheight: 50vh;
}

.section[data-justify=center] .section__inner {
  text-align: center;
}

html[dir="ltr"] .section[data-justify=center] .section__inner {
  text-align: center;
}

html[dir="rtl"] .section[data-justify=center] .section__inner {
  text-align: center;
}

.section[data-callout] {
  border-top: 2px solid var(--color-accent);
  border-bottom: 2px solid var(--color-accent);
}

.section__background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: var(--z-index-100);
  overflow: hidden;
}
.section__background > *, .section__background img, .section__background video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.section__background:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to right, rgba(32, 32, 36, 0.85) 0%, rgba(32, 32, 36, 0.25) 100%);
}

.section[data-theme=""]:not([data-padding=none], [data-callout]) + .section[data-theme=""]:not([data-padding=none], [data-callout]) > .section__inner,
.section[data-theme=default]:not([data-padding=none], [data-callout]) + .section[data-theme=default]:not([data-padding=none], [data-callout]) > .section__inner,
.section[data-theme=alternative]:not([data-padding=none], [data-callout]) + .section[data-theme=alternative]:not([data-padding=none], [data-callout]) > .section__inner,
.section[data-theme=grey]:not([data-padding=none], [data-callout]) + .section[data-theme=grey]:not([data-padding=none], [data-callout]) > .section__inner {
  padding-top: 0;
}

/* Zindex */
.section[data-zindex="100"] {
  z-index: var(--z-index-100);
}

.section[data-zindex="200"] {
  z-index: var(--z-index-200);
}

.section[data-zindex="300"] {
  z-index: var(--z-index-300);
}

.section[data-zindex="400"] {
  z-index: var(--z-index-400);
}

.section[data-zindex="500"] {
  z-index: var(--z-index-500);
}

.section[data-zindex="600"] {
  z-index: var(--z-index-600);
}

.section[data-zindex="700"] {
  z-index: var(--z-index-700);
}

.section[data-zindex="800"] {
  z-index: var(--z-index-800);
}

.section[data-zindex="900"] {
  z-index: var(--z-index-900);
}

tab-carousel {
  display: block;
}

tab-carousel[data-ready=true] .tab-carousel__tablist {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--size-300);
}

tab-carousel[data-ready=true] .tab-carousel__panels {
  position: relative;
  flex-grow: 1;
}

tab-carousel[data-ready=true] .tab-carousel__panel {
  transition: var(--transition-default) opacity, var(--transition-default) transform;
}

tab-carousel[data-ready=true] .tab-carousel__panel[aria-hidden=true] {
  visibility: hidden;
  height: 0px;
  opacity: 0;
  transform: translateY(-1em);
}

tab-group {
  display: block;
}

tab-group[data-ready=true] .tabs {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
  gap: var(--flow-spacing);
}
@media (min-width: 48em) {
  tab-group[data-ready=true] .tabs {
    gap: 0;
  }
}

tab-group[data-ready=true] .tabs__tabs {
  position: relative;
  z-index: var(--z-index-400);
}

tab-group[data-ready=true] .tabs__tablist {
  display: flex;
  align-items: stretch;
  gap: var(--size-200);
  overflow: auto;
}
tab-group[data-ready=true] .tabs__tablist li {
  flex-grow: 1;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: stretch;
  align-items: stretch;
}

tab-group[data-ready=true] .tabs__tab {
  min-width: 100%;
  min-height: 100%;
  flex-grow: 1;
}
@media (min-width: 48em) {
  tab-group[data-ready=true] .tabs__tab {
    min-width: 15ch;
  }
}

tab-group[data-ready=true] .tabs__panels {
  position: relative;
  flex-grow: 1;
  padding: var(--section-padding, var(--size-rel-400));
  border-radius: var(--size-200);
  z-index: var(--z-index-300);
}

tab-group[data-ready=true] .tabs__panel {
  transition: var(--transition-default) opacity, var(--transition-default) transform;
}

tab-group[data-ready=true] .tabs__panel[aria-hidden=true] {
  visibility: hidden;
  height: 0px;
  opacity: 0;
  transform: translateY(-1em);
  overflow: hidden;
}

tab-group[data-ready=true] .tabs__controls {
  display: flex;
  justify-content: center;
  gap: var(--flow-spacing);
}

tab-group[data-ready=true][data-tab-display=vertical] .tabs {
  --layout-gap: var(--flow-spacing-horizontal);
  flex-direction: row;
}

tab-group[data-ready=true][data-tab-display=vertical] .tabs__tablist {
  flex-direction: column;
  max-width: 30ch;
}

tab-group[data-ready=true][data-tab-display=vertical] .tabs__tab {
  min-width: 100%;
}

tab-group[data-ready=true][data-tab-display=mobile] .tabs__tablist {
  flex-direction: column;
  gap: 0;
}

tab-group[data-ready=true][data-tab-display=horizontal] .tabs__panels {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

tab-group[data-ready=true][data-tab-display=vertical] .tabs__panels {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
@media (min-width: 48em) {
  tab-group[data-ready=true][data-tab-display=vertical] .tabs__panels {
    width: 1px;
  }
}

.blockquote-author {
  --blockquote-author-font-size: 1em;
  border: 0px none;
  padding: 0;
}

.blockquote-author__main {
  position: relative;
  padding-left: 1.5em;
  line-height: var(--line-height-500);
  font-size: var(--blockquote-author-font-size);
  line-height: var(--line-height-500);
  order: 5;
  text-wrap: balance;
}

html[dir="ltr"] .blockquote-author__main {
  padding-left: 1.5em;
}

html[dir="rtl"] .blockquote-author__main {
  padding-right: 1.5em;
}

.blockquote-author__quote {
  position: relative;
  color: var(--color-accent);
}

.blockquote-author__quote:first-child {
  position: absolute;
  top: -0.2em;
  left: 0;
}

.blockquote-author__quote:last-child {
  top: -0.3em;
  margin-left: 0.3em;
}

.blockquote-author__footer {
  display: flex;
  gap: var(--size-400);
  align-items: center;
}

.blockquote-author__image {
  width: var(--size-900);
  height: var(--size-900);
  overflow: hidden;
  border-radius: 50%;
  flex-shrink: 0;
}
.blockquote-author__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.blockquote-author__citation {
  display: flex;
  flex-direction: column;
  gap: 0.3em;
  order: 10;
}

.blockquote-author__name,
.blockquote-author__title {
  display: block;
}

/* Large */
.blockquote-author[data-blockquoteauthor-size=large] {
  --blockquote-author-font-size: var(--size-600);
}

/* Center */
.blockquote-author[data-blockquoteauthor-align=center] {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--size-200);
}
html[dir="ltr"] .blockquote-author[data-blockquoteauthor-align=center] {
  text-align: center;
}
html[dir="rtl"] .blockquote-author[data-blockquoteauthor-align=center] {
  text-align: center;
}

.blockquote-author[data-blockquoteauthor-align=center] .blockquote-author__quote {
  position: relative;
  margin-left: 0.3em;
  margin-right: 0.3em;
}

.blockquote-author[data-blockquoteauthor-align=center] .blockquote-author__main {
  padding-left: 0;
  padding-top: 0;
}

html[dir="ltr"] .blockquote-author[data-blockquoteauthor-align=center] .blockquote-author__main {
  padding-left: 0;
}

html[dir="rtl"] .blockquote-author[data-blockquoteauthor-align=center] .blockquote-author__main {
  padding-right: 0;
}

.blockquote-author[data-blockquoteauthor-align=center] .blockquote-author__footer {
  display: contents;
}

.blockquote-author[data-blockquoteauthor-align=center] .blockquote-author__image {
  order: 1;
}

.content--footnotes {
  font-size: var(--size-300);
  line-height: var(--line-height-400);
  --flow-spacing: 1em;
  padding: var(--flow-spacing);
  border: 1px solid var(--color-tint);
}

.content--intro {
  font-size: var(--size-500);
  --flow-spacing: 1em;
  line-height: var(--line-height-400);
}
.content--intro p:first-child {
  font-weight: var(--weight-bold);
}

.content--large {
  font-size: var(--size-500);
  line-height: var(--line-height-400);
  --flow-spacing: 1em;
  text-wrap: balance;
}

.content--large > ol {
  counter-reset: number-list;
  font-size: var(--size-500);
  line-height: var(--line-height-500);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1em;
  list-style: none;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 0;
  padding: 0;
}
.content--large > ol li {
  position: relative;
  counter-increment: number-list;
  padding-left: 2.3em;
  margin-top: 0;
  margin-bottom: 0;
}
.content--large > ol li:before {
  content: counter(number-list);
  position: absolute;
  top: 0;
  left: 0;
  width: 1.7em;
  height: 1.7em;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: var(--color-accent);
  color: var(--color-bg);
  font-weight: var(--weight-bold);
  font-size: 0.875em;
}

.button-list {
  display: flex;
  flex-direction: column;
  gap: var(--flow-spacing);
  justify-content: space-between;
  align-items: stretch;
  min-height: 100%;
}

.button-list__list {
  position: relative;
}
.button-list__list .button {
  align-items: flex-start;
}
.button-list__list .card {
  --card-width: 100%;
}

.button-list[data-item-display=button] .button-list__list:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: var(--color-bg);
  z-index: var(--z-index-500);
}
.button-list[data-item-display=button] .button-list__list li {
  position: relative;
  z-index: var(--z-index-400);
  border-top: 1px solid var(--color-tint);
}

.button-list[data-item-display=card] .button-list__list {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--flow-spacing);
}

@media (min-width: 62em) {
  .button-list[data-columns="2"] .button-list__list {
    columns: 2;
  }
}

@media (min-width: 48em) {
  .button-list[data-columns="3"] .button-list__list {
    columns: 2;
  }
}
@media (min-width: 62em) {
  .button-list[data-columns="3"] .button-list__list {
    columns: 3;
  }
}

.button-list .button[aria-current=page] {
  border-bottom: 0px;
  color: var(--color-accent);
}

card-grid-filter .layout-content__main .layout-grid__item {
  transition: width var(--transition-default), height var(--transition-default), transform var(--transition-default), opacity var(--transition-default), margin-right var(--transition-default);
}
card-grid-filter .layout-content__main .layout-grid__item[hidden] {
  visibility: hidden;
  display: block;
  width: 0px;
  height: 0px;
  transform: scale(0);
  opacity: 0;
  margin-right: calc(-1 * var(--grid-gap));
}
html[dir="ltr"] card-grid-filter .layout-content__main .layout-grid__item[hidden] {
  margin-right: calc(-1 * var(--grid-gap));
}
html[dir="rtl"] card-grid-filter .layout-content__main .layout-grid__item[hidden] {
  margin-left: calc(-1 * var(--grid-gap));
}

.card-reveal {
  display: block;
}

.card-reveal__item {
  display: contents;
}
.card-reveal__item > * {
  transition: opacity var(--transition-default), transform var(--transition-default);
}
.card-reveal[data-state=collapsed] .card-reveal__item > * {
  transition: opacity var(--transition-default), transform var(--transition-default), height var(--transition-default), width var(--transition-default);
}
.card-reveal__item[hidden] {
  visibility: hidden;
}
.card-reveal__item[hidden] > * {
  width: 0px;
  height: 0px;
  transform: scale(0);
  opacity: 0;
}

.card-reveal__controls {
  display: flex;
  justify-content: center;
}
.card-reveal__controls[hidden] {
  display: none;
}
.card-reveal__controls .button[data-card-reveal] .faicon {
  transition: transform var(--transition-default);
}
.card-reveal__controls .button[data-card-reveal][aria-expanded=true] .faicon {
  transform: rotate(180deg);
}

.card-scroller {
  position: relative;
  display: block;
  container-name: card-scroller;
  container-type: inline-size;
}

.card-scroller .card-scroller__track {
  position: relative;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  display: flex;
  gap: var(--flow-spacing);
  padding-bottom: var(--size-200);
  scroll-snap-align: start;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  border-radius: var(--size-200);
  scrollbar-color: var(--color-accent) transparent;
}
.card-scroller .card-scroller__track > * {
  flex-shrink: 0;
}
.card-scroller .card-scroller__track .card:not([data-card-type=carousel]) {
  max-width: calc(100cqw - 2px);
}

.card-scroller__track__item {
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.card-scroller .card-scroller__controls {
  display: flex;
  justify-content: center;
}
.card-scroller .card-scroller__controls[hidden] {
  display: none;
}

.flexible-content.flow {
  --flow-spacing: var(--size-600);
}

.flexible-content .site-modal {
  min-height: 0;
}

.filter-grid__layout {
  display: flex;
  flex-direction: column;
  gap: var(--flow-spacing);
}

@media (min-width: 62em) {
  filter-grid[data-layout=horizontal] .filter-grid__layout {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: space-between;
  }
  filter-grid[data-layout=horizontal] .filter-grid__layout .field-container,
  filter-grid[data-layout=horizontal] .filter-grid__layout select-group {
    flex-grow: 1;
    flex-shrink: 1;
    width: 1px;
  }
}
.footer {
  position: relative;
  z-index: var(--z-index-300);
}
@media (prefers-color-scheme: dark) {
  .footer {
    border-top: 1px solid var(--color-border);
  }
}
[data-mode=dark] .footer {
  border-top: 1px solid var(--color-border);
}

.footer__inner {
  --flow-spacing: 2em;
}

.footer__inner .flow > * {
  --flow-spacing: 1em;
}

.footer__content {
  font-size: var(--size-300);
  line-height: var(--lineheight-400);
}
.footer__content p {
  max-width: initial;
}

site-header {
  position: relative;
  z-index: var(--z-index-700);
  display: block;
}

.header {
  position: relative;
  border-bottom: 1px solid var(--color-tint);
}

.header__inner {
  position: static;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--size-100);
  flex-wrap: wrap;
}
@media (min-width: 62em) {
  .header__inner {
    padding-top: var(--size-600);
    padding-bottom: var(--size-400);
  }
}

.header__logo {
  width: 10em;
  max-width: 40%;
}
@media (min-width: 62em) {
  .header__logo {
    width: 14em;
    transition: width var(--transition-default);
  }
  [data-stuck] .header__logo {
    width: 8em;
  }
}

.header__nav {
  color: inherit;
}
.header__nav[open] {
  position: fixed;
  top: 0;
  right: 0;
  width: 30em;
  max-width: 100%;
  background-color: var(--color-bg);
  z-index: var(--z-index-900);
  height: 100%;
  box-shadow: var(--color-boxshadow-default);
  padding: var(--section-padding);
  max-height: 100%;
  border: 0px none;
  margin: 0;
  margin-left: auto;
  overflow: visible;
  transition: transform var(--transition-default);
}
html[dir="ltr"] .header__nav[open] {
  margin-left: auto;
}
html[dir="rtl"] .header__nav[open] {
  margin-right: auto;
}
@starting-style {
  .header__nav[open] {
    transform: translateX(100%);
  }
}
.header__nav[open]:backdrop {
  background-color: var(--color-tint);
  transition: background-color var(--transition-default);
}
@starting-style {
  .header__nav[open]:backdrop {
    background-color: transparent;
  }
}
@media (min-width: 62em) {
  .header__nav {
    display: contents;
  }
}

.header__nav__inner {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--flow-spacing);
  height: 100%;
}
@media (min-width: 62em) {
  .header__nav__inner {
    display: contents;
  }
}

.header__nav__row {
  display: contents;
}
@media (min-width: 62em) {
  .header__nav__row {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    gap: var(--flow-spacing);
    order: 3;
  }
}

.header__nav .sitewide-nav {
  min-height: var(--size-700);
  padding-right: var(--size-700);
  order: 2;
}
@media (min-width: 62em) {
  .header__nav .sitewide-nav {
    padding-right: 0;
  }
}

.header__nav primary-nav {
  position: static;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  height: 1px;
  flex-grow: 1;
  order: 3;
}
@media (min-width: 62em) {
  .header__nav primary-nav {
    overflow: initial;
    height: initial;
    flex-grow: initial;
    order: 10;
  }
  .header__nav primary-nav .mega-nav {
    top: calc(100% - var(--size-400));
  }
}

.header__nav simple-nav {
  order: 4;
  flex-grow: 1;
}
@media (min-width: 62em) {
  .header__nav simple-nav {
    order: 11;
    flex-grow: initial;
  }
}

.header__search {
  order: 0;
}
@media (min-width: 62em) {
  .header__search {
    flex-shrink: 1;
    min-width: 20ch;
    order: 5;
    padding-top: var(--size-100);
    padding-bottom: var(--size-100);
  }
}

.header-nav__button[data-button-variant=icon] {
  font-size: var(--size-600);
  --button-padding: 0;
  --button-hover-bg: transparent;
  --button-hover-color: var(--color-accent);
}
@media (min-width: 62em) {
  .header-nav__button[data-button-variant=icon] {
    display: none;
  }
}

.header-nav__close {
  position: absolute;
  top: 0;
  right: 0;
  font-size: var(--size-500);
  --button-border-radius: 0;
}
@media (min-width: 62em) {
  .header-nav__close {
    display: none;
  }
}

learning-loop {
  position: relative;
  display: block;
  --flow-spacing: var(--size-700);
  max-width: var(--width-max);
  margin-left: auto;
  margin-right: auto;
  gap: var(--flow-spacing);
}
learning-loop > * {
  --flow-spacing: var(--size-rel-400);
}
@media (min-width: 62em) {
  learning-loop {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(6, 1fr);
    column-gap: var(--size-400);
  }
  learning-loop learning-loop-visual {
    width: 100%;
    max-width: 100%;
  }
}
@media (min-width: 75em) {
  learning-loop {
    gap: var(--flow-spacing);
  }
}

.learning-loop__column {
  display: contents;
}
@media (min-width: 62em) {
  .learning-loop__column {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    z-index: var(--z-index-400);
  }
  .learning-loop__column[data-position=visual] {
    grid-area: 1/3/7/5;
  }
  .learning-loop__column[data-position=item1] {
    grid-area: 1/1/4/3;
  }
  .learning-loop__column[data-position=item2] {
    grid-area: 2/5/6/7;
    padding-top: 8%;
  }
  .learning-loop__column[data-position=item3] {
    grid-area: 4/1/7/3;
  }
}

.learning-loop__content {
  margin-top: var(--flow-spacing-horizontal, 1em);
  position: relative;
  z-index: var(--z-index-500);
}
@media (min-width: 62em) {
  .learning-loop__content {
    display: contents;
  }
}

.learning-loop__content__image img {
  width: 5em;
  height: 5em;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid var(--color-text);
  object-fit: cover;
  filter: grayscale(100%);
  max-width: initial;
}

.learning-loop__content__item__layout {
  display: flex;
  gap: var(--flow-spacing, 1em);
  align-items: center;
  flex-wrap: wrap;
}
@media (min-width: 36em) {
  .learning-loop__content__item__layout {
    flex-wrap: nowrap;
  }
}

.learning-loop__content__item {
  --border-length: min(5vw, 5em);
  margin-top: var(--flow-spacing-horizontal, 1em);
}
@media (min-width: 62em) {
  .learning-loop__content__item {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: initial;
  }
  .learning-loop__content__item[data-item="1"]:before, .learning-loop__content__item[data-item="3"]:before {
    left: calc(100% + var(--flow-spacing));
  }
  .learning-loop__content__item[data-item="1"] .learning-loop__content__item__layout, .learning-loop__content__item[data-item="3"] .learning-loop__content__item__layout {
    flex-direction: row-reverse;
  }
  .learning-loop__content__item[data-item="2"]:before {
    right: calc(100% + var(--flow-spacing));
  }
  .learning-loop__content__item[data-item="1"] {
    --border-length: min(6vw, 6em);
  }
  .learning-loop__content__item[data-item="3"] {
    --border-length: min(4.5vw, 4.5em);
  }
}
@media (min-width: 75em) {
  .learning-loop__content__item:before {
    content: "";
    position: absolute;
    top: 50%;
    width: var(--border-length);
    height: 6px;
    background-color: var(--color-text);
    border-bottom: 2px solid var(--color-bg);
    border-top: 2px solid var(--color-bg);
    transform: translateY(-50%);
  }
}

/* Hide headings */
@media (min-width: 62em) {
  learning-loop:not([data-headings-desktop]) .learning-loop__content__item h3:not(:focus):not(:active) {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
  }
  learning-loop:not([data-headings-desktop]) .learning-loop__content__item h3:not(:focus):not(:active) + * {
    margin-top: 0;
  }
}

school-map {
  position: relative;
  display: block;
  max-width: var(--width-max);
}
school-map .layout-content {
  position: relative;
  z-index: var(--z-index-400);
}
@media (min-width: 62em) {
  school-map .layout-content {
    height: 70vh;
    min-height: 30em;
  }
}

.school-map__nav {
  display: flex;
  flex-direction: column;
  gap: var(--flow-spacing);
}
@media (min-width: 62em) {
  .school-map__nav {
    height: 100%;
  }
}

@media (min-width: 62em) {
  .school-map__list {
    height: 1px;
    flex-grow: 1;
    overflow: auto;
    --webkit-overflow-scrolling: touch;
  }
}
.school-map__list li + li {
  border-top: 1px solid var(--color-tint);
}
.school-map__list li:has(button[hidden]) {
  display: none;
}

.school-map__button {
  margin: 0;
  padding: 0;
  border: 0px none;
  display: block;
  width: 100%;
  text-align: left;
  background-color: transparent;
  cursor: pointer;
  display: flex;
  gap: var(--size-200);
  padding: var(--size-rel-200) var(--size-rel-300);
  color: inherit;
  align-items: flex-start;
  transition: color var(--transition-default), background-color var(--transition-default);
}

html[dir="ltr"] .school-map__button {
  text-align: left;
}

html[dir="rtl"] .school-map__button {
  text-align: left;
}
.school-map__button:hover {
  background-color: var(--color-tint);
}
.school-map__button[aria-selected=true] {
  background-color: var(--color-accent);
  color: var(--color-bg);
}
.school-map__button[aria-selected=true] .school-map__marker .custom-icon {
  --custom-icon-color: var(--color-bg);
  --custom-icon-bg: var(--color-accent);
}

.school-map__marker {
  flex-grow: 0;
  flex-shrink: 0;
}
.school-map__marker .custom-icon {
  font-size: 2em;
}
gmp-advanced-marker .school-map__marker {
  font-size: 1rem;
}

.school-map__main {
  position: sticky;
  top: 0;
  left: 0;
}
@media (min-width: 62em) {
  .school-map__main {
    display: flex;
    height: 100%;
  }
}

.school-map__map {
  display: none;
  width: 100vw;
  max-width: 100%;
  height: 100%;
}
@media (min-width: 62em) {
  .school-map__map {
    display: block;
  }
}
.school-map__map button:not([class]) {
  --button-border-radius: 0;
}
.school-map__map .marker-icon {
  font-size: var(--size-400);
}

.school-map__panels {
  position: fixed;
  bottom: var(--size-200);
  left: var(--size-200);
  right: var(--size-200);
  max-height: 50vh;
  padding: var(--size-400);
  border-radius: var(--size-400);
  background-color: var(--color-bg);
  color: var(--color-text);
  box-shadow: var(--color-boxshadow-drop);
  border: 1px solid var(--color-tint);
  z-index: var(--z-index-500);
  overflow: auto;
  --webkit-overflow-scrolling: touch;
}
@media (min-width: 62em) {
  .school-map__panels {
    position: absolute;
    max-width: calc(100% - 2 * var(--size-200));
    max-height: calc(100% - 2 * var(--size-200));
  }
}

.school-map__panel {
  transition: var(--transition-default) opacity, var(--transition-default) transform;
}

.school-map__panel[aria-hidden=true] {
  visibility: hidden;
  height: 0px;
  opacity: 0;
  overflow: hidden;
  transform: translateY(-1em);
}

.school-map__header {
  display: flex;
  justify-content: space-between;
  gap: var(--size-200);
}

.school-map__key {
  position: relative;
  display: flex;
  gap: var(--size-400);
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
  z-index: var(--z-index-100);
}
@media (min-width: 62em) {
  .school-map__key {
    justify-content: flex-end;
  }
}

.school-map__key__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  gap: var(--size-200);
  justify-content: center;
  flex-wrap: wrap;
}
@media (min-width: 62em) {
  .school-map__key__list {
    justify-content: flex-end;
  }
}

.mast {
  background-color: var(--color-ren-grey-standard);
  color: var(--color-white);
}

.mast .layout-content {
  min-height: 30vh;
}

.mast .logo {
  width: 20ch;
}

.mast .layout-content__aside {
  align-self: flex-end;
}

.mast__aside {
  position: relative;
  padding: var(--size-600);
  border-top-left-radius: var(--size-600);
  border-top-right-radius: var(--size-600);
  margin-bottom: calc(-1 * var(--section-padding));
  box-shadow: var(--color-boxshadow-drop);
}

promotion-item {
  display: block;
}

promotion-bar {
  background-color: var(--color-bg);
  border: 2px solid var(--color-accent);
  box-shadow: var(--color-boxshadow-drop);
  border-radius: var(--size-400);
  padding: var(--size-200) var(--size-400);
  display: flex;
  gap: var(--size-400);
  align-items: center;
  flex-wrap: wrap;
}
@media (min-width: 48em) {
  promotion-bar {
    flex-wrap: nowrap;
  }
}

.promotion-bar__icon {
  font-size: var(--size-700);
  color: var(--color-accent);
  order: 1;
  flex-grow: 1;
}
.promotion-bar__icon .theme-icon,
.promotion-bar__icon .custom-icon,
.promotion-bar__icon .product-icon,
.promotion-bar__icon .fa-icon {
  display: flex;
}
@media (min-width: 48em) {
  .promotion-bar__icon {
    order: 0;
    flex-grow: 0;
  }
}

.promotion-bar__content {
  flex-grow: 1;
  font-size: var(--size-500);
  order: 2;
  width: 100%;
}
@media (min-width: 48em) {
  .promotion-bar__content {
    width: auto;
  }
}

.promotion-bar__button {
  order: 5;
  width: 100%;
}
@media (min-width: 48em) {
  .promotion-bar__button {
    order: 3;
    width: auto;
  }
}

.promotion-bar__dismiss {
  flex-shrink: 0;
  order: 1;
}
@media (min-width: 48em) {
  .promotion-bar__dismiss {
    order: 4;
  }
}

promotion-toaster {
  background-color: var(--color-bg);
  border: 2px solid var(--color-accent);
  box-shadow: var(--color-boxshadow-drop);
  border-radius: var(--size-400);
  padding: var(--size-200);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  max-width: max-content;
  border-left: 0px none;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

promotion-modal {
  display: block;
}

promotion-modal .site-modal__dialog {
  border: 2px solid var(--color-accent);
}

promotion-item[data-display=fixed] promotion-bar {
  position: fixed;
  top: var(--size-100);
  left: var(--size-100);
  right: var(--size-100);
  z-index: var(--z-index-900);
}
promotion-item[data-display=fixed] promotion-toaster {
  position: fixed;
  bottom: var(--size-800);
  left: 0;
  z-index: var(--z-index-900);
}

/* Animations */
/*   Open state of the dialog  */
promotion-bar {
  opacity: 1;
  transform: none;
  transition-behavior: allow-discrete;
  transition: opacity var(--transition-long), transform var(--transition-long), display var(--transition-long) allow-discrete;
}

/*   Closed state of the dialog   */
promotion-bar[hidden] {
  display: none;
  opacity: 0;
  transform: translateY(-100%);
  /* Equivalent to
  transition: all 0.7s allow-discrete; */
}

/*   Before-open state  */
/* Needs to be after the previous dialog[open] rule to take effect,
    as the specificity is the same */
@starting-style {
  promotion-bar {
    opacity: 0;
    transform: translateY(-100%);
  }
}
/* Animations */
/*   Open state of the dialog  */
promotion-toaster {
  opacity: 1;
  transform: none;
  transition-behavior: allow-discrete;
  transition: opacity var(--transition-long), transform var(--transition-long), display var(--transition-long) allow-discrete;
}

/*   Closed state of the dialog   */
promotion-toaster[hidden] {
  display: none;
  opacity: 0;
  transform: translateX(-100%);
  /* Equivalent to
  transition: all 0.7s allow-discrete; */
}

/*   Before-open state  */
/* Needs to be after the previous dialog[open] rule to take effect,
    as the specificity is the same */
@starting-style {
  promotion-toaster {
    opacity: 0;
    transform: translateX(-100%);
  }
}
.reports-article-nav {
  position: relative;
  color: var(--color-text);
}
@media (min-width: 62em) {
  .reports-article-nav {
    max-width: max-content;
  }
  .reports-article-nav:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: var(--color-border);
    z-index: var(--z-index-100);
  }
}

.reports-article-nav[data-mode=desktop] {
  display: none;
}
@media (min-width: 62em) {
  .reports-article-nav[data-mode=desktop] {
    display: block;
  }
}

.reports-article-nav__content {
  position: relative;
  z-index: var(--z-index-400);
}
@media (min-width: 62em) {
  .reports-article-nav__content {
    display: flex;
    gap: var(--size-500);
    align-items: center;
    padding-left: var(--size-400);
    padding-right: var(--size-400);
  }
}

.reports-article-nav[data-justify=center] {
  margin-left: auto;
  margin-right: auto;
}

.reports-article-nav__title {
  position: relative;
  display: none;
  background-color: var(--color-card-bg);
  padding: var(--size-100) var(--size-200);
  font-size: var(--size-400);
}
@media (min-width: 62em) {
  .reports-article-nav__title {
    display: block;
  }
}

.reports-article-nav__list {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--size-200);
}
@media (min-width: 62em) {
  .reports-article-nav__list {
    flex-direction: row;
    gap: var(--size-300);
    align-items: center;
    flex-wrap: wrap;
  }
}

.reports-article-nav .button[data-button-variant=dot] {
  --button-font-size: var(--size-600);
  display: block;
}

.reports-article-nav .button[data-button-variant=dot] .button__text {
  font-size: var(--size-300);
}

.reports-article-nav__pagination {
  display: flex;
  gap: var(--size-300);
  align-items: center;
  justify-content: center;
}
@media (min-width: 62em) {
  .reports-article-nav__pagination {
    display: none;
  }
}

/* Desktop */
.reports-article-nav .button[data-button-variant=dot] {
  display: none;
}
@media (min-width: 62em) {
  .reports-article-nav .button[data-button-variant=dot] {
    display: flex;
  }
}

/* Mobile */
.reports-article-nav__list .button[data-button-variant=nav] {
  --button-padding: 0;
  width: 100%;
  border-left-width: 3px;
  border-bottom-width: 0;
  padding-left: var(--size-200);
}
html[dir="ltr"] .reports-article-nav__list .button[data-button-variant=nav] {
  padding-left: var(--size-200);
}
html[dir="rtl"] .reports-article-nav__list .button[data-button-variant=nav] {
  padding-right: var(--size-200);
}

.reports-article-nav .button[data-button-variant=nav],
.reports-article-nav .button[data-button-variant=icon] {
  display: flex;
}
@media (min-width: 62em) {
  .reports-article-nav .button[data-button-variant=nav],
  .reports-article-nav .button[data-button-variant=icon] {
    display: none;
  }
}

.reports-footer {
  position: relative;
  z-index: var(--z-index-300);
  --section-padding: var(--size-600);
}
@media (min-width: 62em) {
  .reports-footer {
    --section-padding: var(--size-800);
  }
}
@media (prefers-color-scheme: dark) {
  .reports-footer {
    padding-bottom: var(--section-padding, var(--size-600));
  }
}
[data-mode=dark] .reports-footer {
  padding-bottom: var(--section-padding, var(--size-600));
}

.reports-footer__logo .logo {
  margin-left: auto;
  margin-right: auto;
  width: 20ch;
}
/*# sourceMappingURL=style.css.map */