@charset "UTF-8";
/* Correct way to overwrite shit (also, place @font-face in project/ */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  -moz-padding-start: 0px;
  -webkit-padding-start: 0px;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

* {
  box-sizing: border-box;
}

.no-select {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
supported by Chrome, Edge, Opera and Firefox */
}

/* ----------------------------------------------------------------------------------------------------

Super Form Reset

A couple of things to watch out for:

- IE8: If a text input doesn't have padding on all sides or none the text won't be centered.
- The default border sizes on text inputs in all UAs seem to be slightly different. You're better off using custom borders.
- You NEED to set the font-size and family on all form elements
- Search inputs need to have their appearance reset and the box-sizing set to content-box to match other UAs
- You can style the upload button in webkit using ::-webkit-file-upload-button
- ::-webkit-file-upload-button selectors can't be used in the same selector as normal ones. FF and IE freak out.
- IE: You don't need to fake inline-block with labels and form controls in IE. They function as inline-block.
- By turning off ::-webkit-search-decoration, it removes the extra whitespace on the left on search inputs

----------------------------------------------------------------------------------------------------*/
input,
label,
select,
button,
textarea {
  margin: 0;
  border: 0;
  padding: 0;
  display: inline-block;
  vertical-align: middle;
  white-space: normal;
  background: none;
  line-height: 1;
  /* Browsers have different default form fonts */
  font-size: 13px;
  font-family: Arial;
}

/* Remove the stupid outer glow in Webkit */
input:focus {
  outline: 0;
}

/* Box Sizing Reset
-----------------------------------------------*/
/* All of our custom controls should be what we expect them to be */
input,
textarea {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

/* These elements are usually rendered a certain way by the browser */
button,
input[type=reset],
input[type=button],
input[type=submit],
input[type=checkbox],
input[type=radio],
select {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* Text Inputs
-----------------------------------------------*/
/* Button Controls
-----------------------------------------------*/
input[type=checkbox],
input[type=radio] {
  width: 13px;
  height: 13px;
}

/* File Uploads
-----------------------------------------------*/
/* Search Input
-----------------------------------------------*/
/* Make webkit render the search input like a normal text field */
input[type=search] {
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
}

/* Turn off the recent search for webkit. It adds about 15px padding on the left */
::-webkit-search-decoration {
  display: none;
}

/* Buttons
-----------------------------------------------*/
button,
input[type=reset],
input[type=button],
input[type=submit] {
  /* Fix IE7 display bug */
  overflow: visible;
  width: auto;
}

/* IE8 and FF freak out if this rule is within another selector */
::-webkit-file-upload-button {
  padding: 0;
  border: 0;
  background: none;
}

/* Textarea
-----------------------------------------------*/
textarea {
  /* Move the label to the top */
  vertical-align: top;
  /* Turn off scroll bars in IE unless needed */
  overflow: auto;
}

/* Selects
-----------------------------------------------*/
select[multiple] {
  /* Move the label to the top */
  vertical-align: top;
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
/* Correct way to overwrite shit (also, place @font-face in project/ */
.-font-heading, .content-box strong, h1, h2, h3, h4, h5, h6 {
  font-family: "Instrument Serif", serif;
  font-optical-sizing: auto;
  line-height: 100%;
}

.-font-body, p, body, html {
  font-family: "IBM Plex Mono", monospace;
  font-optical-sizing: auto;
}

.-font-ui, .select-dropdown ._list, .button, .flow-chart .node a, .content-box a {
  font-family: "IBM Plex Mono", monospace;
  font-optical-sizing: auto;
}

body, html {
  font-size: 18px;
  line-height: 133%;
}
@media (max-width:500px) {
  body, html {
    font-size: 18px;
  }
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
}

p {
  line-height: 133%;
}

a {
  color: var(--col-accent);
  text-decoration: none;
}
a:visited {
  color: var(--col-accent);
}
a:hover {
  text-decoration: underline;
}

strong, b {
  font-weight: bold;
}

em, i {
  font-style: italic;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th, td {
  padding: 0.5rem;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px dashed var(--col-accent);
}

th {
  font-weight: bold;
}

code {
  font-family: "IBM Plex Mono", monospace;
  font-size: 0.9em;
  background: var(--col-off-bg);
  padding: 0 0.25em;
  border: 1px solid var(--col-accent);
  border-radius: 0.25em;
}

pre {
  width: 100%;
  overflow-x: auto;
  font-size: 0.9em;
  line-height: 1.5;
  background: rgba(0, 0, 0, 0.03);
  padding: 1rem;
  border-radius: 4px;
  border-left: 3px solid var(--col-accent);
}
pre code {
  background: none;
  padding: 0;
  border: none;
  font-size: inherit;
}

.bg-image pre,
ascii-img pre {
  background: none;
  padding: 0;
  border-radius: 0;
}

h1 {
  font-size: 4em;
}

h2 {
  font-size: 3rem;
}

h3 {
  font-size: 2rem;
}

h4 {
  font-size: 1.33rem;
}

h5 {
  font-size: 1rem;
}

h6 {
  font-size: 0.8rem;
}

.-font-xxxl {
  font-size: 4em;
}

.-font-xxl {
  font-size: 3rem;
}

.-font-xl {
  font-size: 2rem;
}

.-font-l, .content-box strong {
  font-size: 1.33rem;
}

.-font-m {
  font-size: 1rem;
}

.-font-s, .content-box > .content-box, .content-box.-pillar ._info ._split h4, .content-box.-pillar ._info ._split p, .tooltip, v-tooltip, .select-dropdown ._list {
  font-size: 0.8rem;
}

.-text-no-wrap {
  white-space: nowrap;
}

.-text-left {
  text-align: left;
}

.-text-center, .flow-chart .node {
  text-align: center;
}

.-text-right {
  text-align: right;
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
:root {
  --col-accent: #09f;
}

.-theme-dark {
  --col-main:white;
  --col-bg: #005;
  --col-off-bg: #03d;
}

.-theme-off-dark {
  --col-main:white;
  --col-bg: #03d;
  --col-off-bg: #005;
}

.-theme-light {
  --col-main: #005;
  --col-bg: white;
  --col-off-bg: #d8f5f9;
}

.-theme-off-light {
  --col-main: #005;
  --col-bg: #d8f5f9;
  --col-off-bg: white;
}

.-theme-accent, .modal ._modal-window, .menu, vicert-menu, footer, .tooltip, v-tooltip, .button:not(.-primary):not(.-secondary).-selected, .flow-chart .node a:not(.-primary):not(.-secondary).-selected, .content-box a:not(.-primary):not(.-secondary).-selected {
  --col-main: white;
  --col-bg: #09f;
  --col-off-bg: #d8f5f9;
  --col-accent: #005;
}

.-apply-theme, .flow-chart .node, main.-article, .content-box, .button.-secondary, .flow-chart .node a.-secondary, .content-box a.-secondary, .-theme-dark, .-theme-off-dark, .-theme-light, .-theme-off-light, .-theme-accent, .modal ._modal-window, .menu, vicert-menu, footer, .tooltip, v-tooltip, .button:not(.-primary):not(.-secondary).-selected, .flow-chart .node a:not(.-primary):not(.-secondary).-selected, .content-box a:not(.-primary):not(.-secondary).-selected {
  background: var(--col-bg);
  color: var(--col-main);
  stroke: var(--col-main);
}

.-invert-theme, .button.-primary, .flow-chart .node a.-primary, .content-box a.-primary {
  background: var(--col-main);
  color: var(--col-bg);
  stroke: var(--col-bg);
}

.-apply-bg {
  background: var(--col-bg);
}

.-apply-color {
  color: var(--col-main);
  stroke: var(--col-main);
}

.-col-accent, .flow-chart .node.-ai, main h1, .button:not(.-primary):not(.-secondary), .chip, .flow-chart .node a:not(.-primary):not(.-secondary), .content-box a:not(.-primary):not(.-secondary) {
  color: var(--col-accent);
  stroke: var(--col-accent);
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
.-space-xxxl {
  margin-top: 24rem;
}

.-space-xxl {
  margin-top: 16rem;
}

.-space-xl, .flow-chart .row-scroll:not(:first-child), .flow-chart .branch, .flow-chart .branch-col .row-scroll:not(:first-child), .content {
  margin-top: 8rem;
}

.-space-l, .menu nav, vicert-menu nav {
  margin-top: 4rem;
}

.-space, .content-box ul.impact, .space-m {
  margin-top: 1rem;
}

.-space-s {
  margin-top: 0.5rem;
}

.-space-block-xl {
  margin-block: 8rem;
}

.-pad-xl {
  padding: 8rem;
}

.-pad-l, .flow-chart .node.-decision, footer {
  padding: 4rem;
}

.-pad, .menu nav, vicert-menu nav, .menu nav ul li a, .menu nav ul li a:visited, vicert-menu nav ul li a, vicert-menu nav ul li a:visited, main.-article, .content-box ul.impact li, .select-dropdown, .button.-primary, .button.-secondary, .flow-chart .node a.-primary, .content-box a.-primary, .flow-chart .node a.-secondary, .content-box a.-secondary,
.-pad-m {
  padding: 1rem;
}

.-pad-s, .tooltip, v-tooltip, .button:not(.-primary):not(.-secondary), .flow-chart .node a:not(.-primary):not(.-secondary), .content-box a:not(.-primary):not(.-secondary) {
  padding: 0.5rem;
}

.-pad-xs {
  padding: 2px;
}

.-pad-horiz-l {
  padding: 1rem 4rem;
}

.-pad-horiz, .-pad-horiz-m {
  padding: 0.5rem 1rem;
}

.-absolute, .leader-line, .linker-line {
  position: absolute;
}

.-relative, .logo-vicert, footer {
  position: relative;
}

.-fixed, .menu, vicert-menu {
  position: fixed;
}

.-sticky {
  position: sticky;
}

.-z-modal {
  z-index: 300;
}

.-z-over-top {
  z-index: 200;
}

.-z-top {
  z-index: 100;
}

.-z-mid {
  z-index: 50;
}

.-z-over, .leader-line, .linker-line, footer {
  z-index: 2;
}

.-aspect-1x1 {
  aspect-ratio: 1;
}

.-aspect-16x9 {
  aspect-ratio: 16/9;
}

.-aspect-9x16 {
  aspect-ratio: 9/16;
}

.-aspect-2x1 {
  aspect-ratio: 2;
}

.-aspect-1x2 {
  aspect-ratio: 0.5;
}

.-aspect-3x2 {
  aspect-ratio: 1.5;
}

.-aspect-2x3 {
  aspect-ratio: 2/3;
}

.-aspect-4x3 {
  aspect-ratio: 4/3;
}

.-aspect-3x4 {
  aspect-ratio: 3/4;
}

.-aspect-4x5 {
  aspect-ratio: 4/5;
}

.-scroll-lock {
  overflow: hidden;
  width: 100%;
}

.-no-select, .button, .flow-chart .node a, .content-box a {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
supported by Chrome, Edge, Opera and Firefox */
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
.-round-corners, .content-box, .select-dropdown {
  border-radius: 4px;
  overflow: hidden;
}

.-round-big-corners {
  border-radius: 100vmax;
  overflow: hidden;
}

.-round {
  border-radius: 50%;
  overflow: hidden;
}

.-shadow, .select-dropdown {
  box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.1333333333);
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
.container, .flow-chart, main.-page, main.-article {
  position: relative;
  width: calc(100% - 2rem);
  margin-left: auto;
  margin-right: auto;
}
@media (orientation:portrait) {
  .container, .flow-chart, main.-page, main.-article {
    width: calc(100% - 2rem);
  }
}
.container.-xl, main.-xl.-page, main.-xl.-article, .flow-chart, main.-page.flow-chart, main.-article.flow-chart {
  max-width: 1440px;
}
.container.-l, .-l.flow-chart, main.-page, main.-article {
  max-width: 1152px;
}
.container.-m, .-m.flow-chart, main.-m.-page, main.-m.-article {
  max-width: 800px;
}
.container.-s, .-s.flow-chart, main.-s.-page, main.-s.-article {
  max-width: 540px;
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
/* Common for both horizontal and vertical flex layouts */
.flex-h, .modal ._modal-window ._header ._cta, .flow-chart .row, .content-box.-pillar ._info ._split, .button, .flow-chart .node a, .content-box a, .flex-v, .modal ._modal-window ._header, .modal ._modal-window ._scroll-container ._content, .flow-chart, .flow-chart .node, .flow-chart .node ul, main.-page, main.-article, .content-box, .content-box ul.impact, .content-box.-pillar ._header, .content-box.-pillar ._info, .select-dropdown ._list {
  --gap: 1rem;
  display: flex;
}
.flex-h.-reverse, .modal ._modal-window ._header .-reverse._cta, .flow-chart .-reverse.row, .content-box.-pillar ._info .-reverse._split, .-reverse.button, .flow-chart .node a.-reverse, .content-box a.-reverse, .flex-v.-reverse, .modal ._modal-window .-reverse._header, .modal ._modal-window ._scroll-container .-reverse._content, .-reverse.flow-chart, .flow-chart .-reverse.node, .flow-chart .node ul.-reverse, main.-reverse.-page, main.-reverse.-article, .-reverse.content-box, .content-box ul.-reverse.impact, .content-box.-pillar .-reverse._header, .content-box.-pillar .-reverse._info, .select-dropdown .-reverse._list {
  flex-direction: row-reverse;
}
.flex-h.-no-gap, .modal ._modal-window ._header .-no-gap._cta, .flow-chart .-no-gap.row, .content-box.-pillar ._info .-no-gap._split, .-no-gap.button, .flow-chart .node a.-no-gap, .content-box a.-no-gap, .modal ._modal-window ._header .select-dropdown ._cta._list, .select-dropdown .modal ._modal-window ._header ._cta._list, .content-box.-pillar ._info .select-dropdown ._split._list, .select-dropdown .content-box.-pillar ._info ._split._list, .flow-chart .node .select-dropdown a._list, .select-dropdown .flow-chart .node a._list, .flex-v.-no-gap, .modal ._modal-window .-no-gap._header, .modal ._modal-window ._scroll-container .-no-gap._content, .-no-gap.flow-chart, .flow-chart .-no-gap.node, .flow-chart .node ul.-no-gap, main.-no-gap.-page, main.-no-gap.-article, .-no-gap.content-box, .content-box ul.-no-gap.impact, .content-box.-pillar .-no-gap._header, .content-box.-pillar .-no-gap._info, .modal ._modal-window .select-dropdown ._header._list, .select-dropdown .modal ._modal-window ._header._list, .modal ._modal-window ._scroll-container .select-dropdown ._content._list, .select-dropdown .modal ._modal-window ._scroll-container ._content._list, .flow-chart .node .select-dropdown ul._list, .select-dropdown .flow-chart .node ul._list, .content-box .select-dropdown ul.impact._list, .select-dropdown .content-box ul.impact._list, .content-box.-pillar .select-dropdown ._header._list, .select-dropdown .content-box.-pillar ._header._list, .content-box.-pillar .select-dropdown ._info._list, .select-dropdown .content-box.-pillar ._info._list, .select-dropdown ._list {
  --gap: 0 ;
}
.flex-h, .modal ._modal-window ._header ._cta, .flow-chart .row, .content-box.-pillar ._info ._split, .button, .flow-chart .node a, .content-box a, .flex-v, .modal ._modal-window ._header, .modal ._modal-window ._scroll-container ._content, .flow-chart, .flow-chart .node, .flow-chart .node ul, main.-page, main.-article, .content-box, .content-box ul.impact, .content-box.-pillar ._header, .content-box.-pillar ._info, .select-dropdown ._list {
  /* this only for compatibility, should be removed as gap is the default now */
}
.flex-h.-gap, .flow-chart .-gap.row, .-gap.button, .flow-chart .node a.-gap, .content-box a.-gap, .modal ._modal-window .flex-h._header, .flow-chart .modal ._modal-window .row._header, .modal ._modal-window .flow-chart .row._header, .modal ._modal-window .button._header, .flow-chart .node .modal ._modal-window a._header, .modal ._modal-window .flow-chart .node a._header, .content-box .modal ._modal-window a._header, .modal ._modal-window .content-box a._header, .modal ._modal-window ._header ._cta, .modal ._modal-window ._scroll-container .flex-h._content, .flow-chart .modal ._modal-window ._scroll-container .row._content, .modal ._modal-window ._scroll-container .flow-chart .row._content, .modal ._modal-window ._scroll-container .button._content, .flow-chart .node .modal ._modal-window ._scroll-container a._content, .modal ._modal-window ._scroll-container .flow-chart .node a._content, .content-box .modal ._modal-window ._scroll-container a._content, .modal ._modal-window ._scroll-container .content-box a._content, .flow-chart .flex-h.node, .flow-chart .row.node, .flow-chart .button.node, .flow-chart .node a.node, .content-box .flow-chart a.node, .flow-chart .content-box a.node, main.flex-h.-page, .flow-chart main.row.-page, main.button.-page, main.flex-h.-article, .flow-chart main.row.-article, main.button.-article, .flex-h.content-box, .flow-chart .row.content-box, .button.content-box, .flow-chart .node a.content-box, .content-box a.content-box, .content-box.-pillar .flex-h._header, .flow-chart .content-box.-pillar .row._header, .content-box.-pillar .flow-chart .row._header, .content-box.-pillar .button._header, .content-box.-pillar a._header, .content-box.-pillar .flex-h._info, .flow-chart .content-box.-pillar .row._info, .content-box.-pillar .flow-chart .row._info, .content-box.-pillar .button._info, .content-box.-pillar a._info, .content-box.-pillar ._info ._split, .flex-v.-gap, .modal ._modal-window .-gap._header, .modal ._modal-window ._scroll-container .-gap._content, .-gap.flow-chart, .flow-chart .-gap.node, .flow-chart .node ul.-gap, main.-gap.-page, main.-gap.-article, .-gap.content-box, .content-box ul.-gap.impact, .content-box.-pillar .-gap._header, .content-box.-pillar .-gap._info, .select-dropdown .-gap._list, .modal ._modal-window .flex-v._header, .modal ._modal-window ._header, .modal ._modal-window ._scroll-container ._content._header, .modal ._modal-window .flow-chart._header, .flow-chart .modal ._modal-window .node._header, .modal ._modal-window .flow-chart .node._header, .flow-chart .node .modal ._modal-window ul._header, .modal ._modal-window .flow-chart .node ul._header, .modal ._modal-window main.-page._header, .modal ._modal-window main.-article._header, .modal ._modal-window .content-box._header, .content-box .modal ._modal-window ul.impact._header, .modal ._modal-window .content-box ul.impact._header, .content-box.-pillar .modal ._modal-window ._header, .modal ._modal-window .content-box.-pillar ._header, .content-box.-pillar .modal ._modal-window ._info._header, .modal ._modal-window .content-box.-pillar ._info._header, .select-dropdown .modal ._modal-window ._list._header, .modal ._modal-window .select-dropdown ._list._header, .modal ._modal-window ._header .flex-v._cta, .modal ._modal-window ._header ._header._cta, .modal ._modal-window ._scroll-container ._header ._content._cta, .modal ._modal-window ._header ._scroll-container ._content._cta, .modal ._modal-window ._header .flow-chart._cta, .flow-chart .modal ._modal-window ._header .node._cta, .modal ._modal-window ._header .flow-chart .node._cta, .flow-chart .node .modal ._modal-window ._header ul._cta, .modal ._modal-window ._header .flow-chart .node ul._cta, .modal ._modal-window ._header main.-page._cta, .modal ._modal-window ._header main.-article._cta, .modal ._modal-window ._header .content-box._cta, .content-box .modal ._modal-window ._header ul.impact._cta, .modal ._modal-window ._header .content-box ul.impact._cta, .content-box.-pillar .modal ._modal-window ._header ._header._cta, .modal ._modal-window ._header .content-box.-pillar ._header._cta, .content-box.-pillar .modal ._modal-window ._header ._info._cta, .modal ._modal-window ._header .content-box.-pillar ._info._cta, .select-dropdown .modal ._modal-window ._header ._list._cta, .modal ._modal-window ._header .select-dropdown ._list._cta, .modal ._modal-window ._scroll-container .flex-v._content, .modal ._modal-window ._scroll-container ._header._content, .modal ._modal-window ._scroll-container ._content, .modal ._modal-window ._scroll-container .flow-chart._content, .flow-chart .modal ._modal-window ._scroll-container .node._content, .modal ._modal-window ._scroll-container .flow-chart .node._content, .flow-chart .node .modal ._modal-window ._scroll-container ul._content, .modal ._modal-window ._scroll-container .flow-chart .node ul._content, .modal ._modal-window ._scroll-container main.-page._content, .modal ._modal-window ._scroll-container main.-article._content, .modal ._modal-window ._scroll-container .content-box._content, .content-box .modal ._modal-window ._scroll-container ul.impact._content, .modal ._modal-window ._scroll-container .content-box ul.impact._content, .content-box.-pillar .modal ._modal-window ._scroll-container ._header._content, .modal ._modal-window ._scroll-container .content-box.-pillar ._header._content, .content-box.-pillar .modal ._modal-window ._scroll-container ._info._content, .modal ._modal-window ._scroll-container .content-box.-pillar ._info._content, .select-dropdown .modal ._modal-window ._scroll-container ._list._content, .modal ._modal-window ._scroll-container .select-dropdown ._list._content, .flow-chart .flex-v.node, .modal ._modal-window .flow-chart ._header.node, .flow-chart .modal ._modal-window ._header.node, .modal ._modal-window ._scroll-container .flow-chart ._content.node, .flow-chart .modal ._modal-window ._scroll-container ._content.node, .flow-chart .flow-chart.node, .flow-chart .node, .flow-chart .node ul.node, .flow-chart main.-page.node, .flow-chart main.-article.node, .flow-chart .content-box.node, .content-box .flow-chart ul.impact.node, .flow-chart .content-box ul.impact.node, .content-box.-pillar .flow-chart ._header.node, .flow-chart .content-box.-pillar ._header.node, .content-box.-pillar .flow-chart ._info.node, .flow-chart .content-box.-pillar ._info.node, .select-dropdown .flow-chart ._list.node, .flow-chart .select-dropdown ._list.node, main.flex-v.-page, .modal ._modal-window main._header.-page, .modal ._modal-window ._scroll-container main._content.-page, main.flow-chart.-page, .flow-chart main.node.-page, main.-page, main.-article.-page, main.content-box.-page, .content-box.-pillar main._header.-page, .content-box.-pillar main._info.-page, .select-dropdown main._list.-page, main.flex-v.-article, .modal ._modal-window main._header.-article, .modal ._modal-window ._scroll-container main._content.-article, main.flow-chart.-article, .flow-chart main.node.-article, main.-page.-article, main.-article, main.content-box.-article, .content-box.-pillar main._header.-article, .content-box.-pillar main._info.-article, .select-dropdown main._list.-article, .flex-v.content-box, .modal ._modal-window ._header.content-box, .modal ._modal-window ._scroll-container ._content.content-box, .flow-chart.content-box, .flow-chart .node.content-box, .flow-chart .node ul.content-box, main.-page.content-box, main.-article.content-box, .content-box, .content-box ul.impact.content-box, .content-box.-pillar ._header.content-box, .content-box.-pillar ._info.content-box, .select-dropdown ._list.content-box, .content-box.-pillar .flex-v._header, .modal ._modal-window .content-box.-pillar ._header, .content-box.-pillar .modal ._modal-window ._header, .modal ._modal-window ._scroll-container .content-box.-pillar ._content._header, .content-box.-pillar .modal ._modal-window ._scroll-container ._content._header, .content-box.-pillar .flow-chart._header, .flow-chart .content-box.-pillar .node._header, .content-box.-pillar .flow-chart .node._header, .flow-chart .node .content-box.-pillar ul._header, .content-box.-pillar .flow-chart .node ul._header, .content-box.-pillar main.-page._header, .content-box.-pillar main.-article._header, .content-box.-pillar .content-box._header, .content-box.-pillar ul.impact._header, .content-box.-pillar ._header, .content-box.-pillar ._info._header, .select-dropdown .content-box.-pillar ._list._header, .content-box.-pillar .select-dropdown ._list._header, .content-box.-pillar .flex-v._info, .modal ._modal-window .content-box.-pillar ._header._info, .content-box.-pillar .modal ._modal-window ._header._info, .modal ._modal-window ._scroll-container .content-box.-pillar ._content._info, .content-box.-pillar .modal ._modal-window ._scroll-container ._content._info, .content-box.-pillar .flow-chart._info, .flow-chart .content-box.-pillar .node._info, .content-box.-pillar .flow-chart .node._info, .flow-chart .node .content-box.-pillar ul._info, .content-box.-pillar .flow-chart .node ul._info, .content-box.-pillar main.-page._info, .content-box.-pillar main.-article._info, .content-box.-pillar .content-box._info, .content-box.-pillar ul.impact._info, .content-box.-pillar ._header._info, .content-box.-pillar ._info, .select-dropdown .content-box.-pillar ._list._info, .content-box.-pillar .select-dropdown ._list._info, .content-box.-pillar ._info .flex-v._split, .modal ._modal-window .content-box.-pillar ._info ._header._split, .content-box.-pillar ._info .modal ._modal-window ._header._split, .modal ._modal-window ._scroll-container .content-box.-pillar ._info ._content._split, .content-box.-pillar ._info .modal ._modal-window ._scroll-container ._content._split, .content-box.-pillar ._info .flow-chart._split, .flow-chart .content-box.-pillar ._info .node._split, .content-box.-pillar ._info .flow-chart .node._split, .flow-chart .node .content-box.-pillar ._info ul._split, .content-box.-pillar ._info .flow-chart .node ul._split, .content-box.-pillar ._info main.-page._split, .content-box.-pillar ._info main.-article._split, .content-box.-pillar ._info .content-box._split, .content-box.-pillar ._info ul.impact._split, .content-box.-pillar ._info ._header._split, .content-box.-pillar ._info ._info._split, .select-dropdown .content-box.-pillar ._info ._list._split, .content-box.-pillar ._info .select-dropdown ._list._split {
  --gap: 1rem;
}
.flex-h.-gap-xl, .modal ._modal-window ._header .-gap-xl._cta, .flow-chart .-gap-xl.row, .content-box.-pillar ._info .-gap-xl._split, .-gap-xl.button, .flow-chart .node a.-gap-xl, .content-box a.-gap-xl, .flex-v.-gap-xl, .modal ._modal-window .-gap-xl._header, .modal ._modal-window ._scroll-container .-gap-xl._content, .-gap-xl.flow-chart, .flow-chart .-gap-xl.node, .flow-chart .node ul.-gap-xl, main.-gap-xl.-page, main.-gap-xl.-article, .-gap-xl.content-box, .content-box ul.-gap-xl.impact, .content-box.-pillar .-gap-xl._header, .content-box.-pillar .-gap-xl._info, .select-dropdown .-gap-xl._list {
  --gap: 8rem;
}
.flex-h.-gap-l, .modal ._modal-window ._header .-gap-l._cta, .flow-chart .-gap-l.row, .content-box.-pillar ._info .-gap-l._split, .-gap-l.button, .flow-chart .node a.-gap-l, .content-box a.-gap-l, .flex-v.-gap-l, .modal ._modal-window .-gap-l._header, .modal ._modal-window ._scroll-container .-gap-l._content, .-gap-l.flow-chart, .flow-chart .-gap-l.node, .flow-chart .node ul.-gap-l, main.-gap-l.-page, main.-gap-l.-article, .-gap-l.content-box, .content-box ul.-gap-l.impact, .content-box.-pillar .-gap-l._header, .content-box.-pillar .-gap-l._info, .select-dropdown .-gap-l._list {
  --gap: 4rem;
}
.flex-h.-gap-s, .modal ._modal-window ._header .-gap-s._cta, .flow-chart .-gap-s.row, .content-box.-pillar ._info .-gap-s._split, .-gap-s.button, .flow-chart .node a.-gap-s, .content-box a.-gap-s, .modal ._modal-window ._header .content-box ul._cta.impact, .content-box .modal ._modal-window ._header ul._cta.impact, .content-box.-pillar ._info ul._split.impact, .flex-v.-gap-s, .modal ._modal-window .-gap-s._header, .modal ._modal-window ._scroll-container .-gap-s._content, .-gap-s.flow-chart, .flow-chart .-gap-s.node, .flow-chart .node ul.-gap-s, main.-gap-s.-page, main.-gap-s.-article, .-gap-s.content-box, .content-box.-pillar .-gap-s._header, .content-box.-pillar .-gap-s._info, .select-dropdown .-gap-s._list, .modal ._modal-window .content-box ul._header.impact, .content-box .modal ._modal-window ul._header.impact, .modal ._modal-window ._scroll-container .content-box ul._content.impact, .content-box .modal ._modal-window ._scroll-container ul._content.impact, .content-box ul.impact, .content-box.-pillar ul._header.impact, .content-box.-pillar ul._info.impact {
  --gap: 0.5rem;
}
.flex-h.-space-between, .modal ._modal-window ._header .-space-between._cta, .flow-chart .-space-between.row, .content-box.-pillar ._info .-space-between._split, .-space-between.button, .flow-chart .node a.-space-between, .content-box a.-space-between, .modal ._modal-window ._header .flow-chart ._cta.node, .flow-chart .modal ._modal-window ._header ._cta.node, .content-box.-pillar ._info .flow-chart ._split.node, .flow-chart .content-box.-pillar ._info ._split.node, .flow-chart .node a.node, .flex-v.-space-between, .modal ._modal-window .-space-between._header, .modal ._modal-window ._scroll-container .-space-between._content, .-space-between.flow-chart, .flow-chart .node ul.-space-between, main.-space-between.-page, main.-space-between.-article, .-space-between.content-box, .content-box ul.-space-between.impact, .content-box.-pillar .-space-between._header, .content-box.-pillar .-space-between._info, .select-dropdown .-space-between._list, .modal ._modal-window .flow-chart ._header.node, .flow-chart .modal ._modal-window ._header.node, .modal ._modal-window ._scroll-container .flow-chart ._content.node, .flow-chart .modal ._modal-window ._scroll-container ._content.node, .flow-chart .node, .flow-chart .node ul.node, .content-box .flow-chart ul.impact.node, .flow-chart .content-box ul.impact.node, .content-box.-pillar .flow-chart ._header.node, .flow-chart .content-box.-pillar ._header.node, .content-box.-pillar .flow-chart ._info.node, .flow-chart .content-box.-pillar ._info.node {
  justify-content: space-between;
}
.flex-h.-space-around, .modal ._modal-window ._header .-space-around._cta, .flow-chart .-space-around.row, .content-box.-pillar ._info .-space-around._split, .-space-around.button, .flow-chart .node a.-space-around, .content-box a.-space-around, .flex-v.-space-around, .modal ._modal-window .-space-around._header, .modal ._modal-window ._scroll-container .-space-around._content, .-space-around.flow-chart, .flow-chart .-space-around.node, .flow-chart .node ul.-space-around, main.-space-around.-page, main.-space-around.-article, .-space-around.content-box, .content-box ul.-space-around.impact, .content-box.-pillar .-space-around._header, .content-box.-pillar .-space-around._info, .select-dropdown .-space-around._list {
  justify-content: space-around;
}
.flex-h.-justify-center, .modal ._modal-window ._header .-justify-center._cta, .content-box.-pillar ._info .-justify-center._split, .-justify-center.button, .flow-chart .node a.-justify-center, .content-box a.-justify-center, .modal ._modal-window ._header ._cta._header, .content-box.-pillar ._info .modal ._modal-window ._split._header, .modal ._modal-window .content-box.-pillar ._info ._split._header, .modal ._modal-window ._header .flow-chart ._cta.row, .flow-chart .modal ._modal-window ._header ._cta.row, .flow-chart .row, .content-box.-pillar ._info .flow-chart ._split.row, .flow-chart .content-box.-pillar ._info ._split.row, .flow-chart .node a.row, .modal ._modal-window ._header .flow-chart .node ul._cta, .flow-chart .node .modal ._modal-window ._header ul._cta, .content-box.-pillar ._info .flow-chart .node ul._split, .flow-chart .node .content-box.-pillar ._info ul._split, .flex-v.-justify-center, .-justify-center.flow-chart, .flow-chart .-justify-center.node, main.-justify-center.-page, main.-justify-center.-article, .-justify-center.content-box, .content-box ul.-justify-center.impact, .content-box.-pillar .-justify-center._header, .content-box.-pillar .-justify-center._info, .select-dropdown .-justify-center._list, .modal ._modal-window ._header, .modal ._modal-window ._scroll-container ._content, .content-box .flow-chart ul.impact.row, .flow-chart .content-box ul.impact.row, .content-box.-pillar .flow-chart ._header.row, .flow-chart .content-box.-pillar ._header.row, .content-box.-pillar .flow-chart ._info.row, .flow-chart .content-box.-pillar ._info.row, .flow-chart .node ul, .content-box.-pillar .flow-chart .node ul._header, .flow-chart .node .content-box.-pillar ul._header, .content-box.-pillar .flow-chart .node ul._info, .flow-chart .node .content-box.-pillar ul._info {
  justify-content: center;
}
.flex-h.-justify-start, .modal ._modal-window ._header .-justify-start._cta, .flow-chart .-justify-start.row, .content-box.-pillar ._info .-justify-start._split, .modal ._modal-window ._header ._cta.button, .flow-chart .row.button, .content-box.-pillar ._info ._split.button, .button, .modal ._modal-window ._header .flow-chart .node a._cta, .flow-chart .node .modal ._modal-window ._header a._cta, .flow-chart .node a, .modal ._modal-window ._header .content-box a._cta, .content-box .modal ._modal-window ._header a._cta, .flow-chart .content-box a.row, .content-box .flow-chart a.row, .content-box.-pillar ._info a._split, .content-box a, .flex-v.-justify-start, .modal ._modal-window .-justify-start._header, .modal ._modal-window ._scroll-container .-justify-start._content, .-justify-start.flow-chart, .flow-chart .-justify-start.node, .flow-chart .node ul.-justify-start, main.-justify-start.-page, main.-justify-start.-article, .-justify-start.content-box, .content-box ul.-justify-start.impact, .content-box.-pillar .-justify-start._header, .content-box.-pillar .-justify-start._info, .select-dropdown .-justify-start._list, .modal ._modal-window ._header.button, .modal ._modal-window ._scroll-container ._content.button, .flow-chart .node.button, .flow-chart .node ul.button, main.-page.button, main.-article.button, .content-box ul.impact.button, .content-box.-pillar ._header.button, .content-box.-pillar ._info.button, .select-dropdown ._list.button, .modal ._modal-window .flow-chart .node a._header, .flow-chart .node .modal ._modal-window a._header, .modal ._modal-window ._scroll-container .flow-chart .node a._content, .flow-chart .node .modal ._modal-window ._scroll-container a._content, .modal ._modal-window .content-box a._header, .content-box .modal ._modal-window a._header, .modal ._modal-window ._scroll-container .content-box a._content, .content-box .modal ._modal-window ._scroll-container a._content, .flow-chart .content-box a.node, .content-box .flow-chart a.node, .content-box.-pillar a._header, .content-box.-pillar a._info, .select-dropdown .content-box a._list, .content-box .select-dropdown a._list {
  justify-content: flex-start;
}
.flex-h.-justify-end, .modal ._modal-window ._header .-justify-end._cta, .flow-chart .-justify-end.row, .content-box.-pillar ._info .-justify-end._split, .-justify-end.button, .flow-chart .node a.-justify-end, .content-box a.-justify-end, .flex-v.-justify-end, .modal ._modal-window .-justify-end._header, .modal ._modal-window ._scroll-container .-justify-end._content, .-justify-end.flow-chart, .flow-chart .-justify-end.node, .flow-chart .node ul.-justify-end, main.-justify-end.-page, main.-justify-end.-article, .-justify-end.content-box, .content-box ul.-justify-end.impact, .content-box.-pillar .-justify-end._header, .content-box.-pillar .-justify-end._info, .select-dropdown .-justify-end._list {
  justify-content: flex-end;
}
.flex-h.-align-stretch, .modal ._modal-window ._header .-align-stretch._cta, .content-box.-pillar ._info .-align-stretch._split, .-align-stretch.button, .flow-chart .node a.-align-stretch, .content-box a.-align-stretch, .modal ._modal-window ._header .flow-chart ._cta.row, .flow-chart .modal ._modal-window ._header ._cta.row, .flow-chart .row, .content-box.-pillar ._info .flow-chart ._split.row, .flow-chart .content-box.-pillar ._info ._split.row, .flow-chart .node a.row, .modal ._modal-window ._header .select-dropdown ._cta._list, .select-dropdown .modal ._modal-window ._header ._cta._list, .content-box.-pillar ._info .select-dropdown ._split._list, .select-dropdown .content-box.-pillar ._info ._split._list, .flow-chart .node .select-dropdown a._list, .select-dropdown .flow-chart .node a._list, .flex-v.-align-stretch, .modal ._modal-window .-align-stretch._header, .-align-stretch.flow-chart, .flow-chart .-align-stretch.node, .flow-chart .node ul.-align-stretch, main.-align-stretch.-page, main.-align-stretch.-article, .-align-stretch.content-box, .content-box ul.-align-stretch.impact, .content-box.-pillar .-align-stretch._header, .content-box.-pillar .-align-stretch._info, .modal ._modal-window ._scroll-container ._content, .modal ._modal-window .flow-chart ._header.row, .flow-chart .modal ._modal-window ._header.row, .flow-chart .node ul.row, .content-box .flow-chart ul.impact.row, .flow-chart .content-box ul.impact.row, .content-box.-pillar .flow-chart ._header.row, .flow-chart .content-box.-pillar ._header.row, .content-box.-pillar .flow-chart ._info.row, .flow-chart .content-box.-pillar ._info.row, .modal ._modal-window .select-dropdown ._header._list, .select-dropdown .modal ._modal-window ._header._list, .flow-chart .node .select-dropdown ul._list, .select-dropdown .flow-chart .node ul._list, .content-box .select-dropdown ul.impact._list, .select-dropdown .content-box ul.impact._list, .content-box.-pillar .select-dropdown ._header._list, .select-dropdown .content-box.-pillar ._header._list, .content-box.-pillar .select-dropdown ._info._list, .select-dropdown .content-box.-pillar ._info._list, .select-dropdown ._list {
  align-items: stretch;
}
.flex-h.-align-center, .modal ._modal-window ._header .-align-center._cta, .flow-chart .-align-center.row, .content-box.-pillar ._info .-align-center._split, .modal ._modal-window .flex-h._header, .modal ._modal-window ._header ._cta._header, .flow-chart .modal ._modal-window .row._header, .modal ._modal-window .flow-chart .row._header, .modal ._modal-window .button._header, .flow-chart .node .modal ._modal-window a._header, .modal ._modal-window .flow-chart .node a._header, .content-box .modal ._modal-window a._header, .modal ._modal-window .content-box a._header, .flex-h.flow-chart, .modal ._modal-window ._header ._cta.flow-chart, .flow-chart .row.flow-chart, .content-box.-pillar ._info ._split.flow-chart, .flow-chart .flex-h.node, .modal ._modal-window ._header .flow-chart ._cta.node, .flow-chart .modal ._modal-window ._header ._cta.node, .flow-chart .row.node, .content-box.-pillar ._info .flow-chart ._split.node, .flow-chart .content-box.-pillar ._info ._split.node, .flow-chart .button.node, .content-box .flow-chart a.node, .flow-chart .content-box a.node, main.flex-h.-page, .modal ._modal-window ._header main._cta.-page, .flow-chart main.row.-page, .content-box.-pillar ._info main._split.-page, main.button.-page, main.flex-h.-article, .modal ._modal-window ._header main._cta.-article, .flow-chart main.row.-article, .content-box.-pillar ._info main._split.-article, main.button.-article, .content-box.-pillar .flex-h._header, .flow-chart .content-box.-pillar .row._header, .content-box.-pillar .flow-chart .row._header, .content-box.-pillar ._info ._split._header, .content-box.-pillar .button._header, .content-box.-pillar a._header, .modal ._modal-window ._header ._cta.button, .flow-chart .row.button, .content-box.-pillar ._info ._split.button, .button, .modal ._modal-window ._header .flow-chart .node a._cta, .flow-chart .node .modal ._modal-window ._header a._cta, .flow-chart .node a, .modal ._modal-window ._header .content-box a._cta, .content-box .modal ._modal-window ._header a._cta, .flow-chart .content-box a.row, .content-box .flow-chart a.row, .content-box.-pillar ._info a._split, .content-box a, .flex-v.-align-center, .modal ._modal-window .-align-center._header, .modal ._modal-window ._scroll-container .-align-center._content, .-align-center.flow-chart, .flow-chart .-align-center.node, .flow-chart .node ul.-align-center, main.-align-center.-page, main.-align-center.-article, .-align-center.content-box, .content-box ul.-align-center.impact, .content-box.-pillar .-align-center._header, .content-box.-pillar .-align-center._info, .select-dropdown .-align-center._list, .modal ._modal-window .flex-v._header, .modal ._modal-window ._header, .modal ._modal-window ._scroll-container ._content._header, .modal ._modal-window .flow-chart._header, .flow-chart .modal ._modal-window .node._header, .modal ._modal-window .flow-chart .node._header, .flow-chart .node .modal ._modal-window ul._header, .modal ._modal-window .flow-chart .node ul._header, .modal ._modal-window main.-page._header, .modal ._modal-window main.-article._header, .modal ._modal-window .content-box._header, .content-box .modal ._modal-window ul.impact._header, .modal ._modal-window .content-box ul.impact._header, .content-box.-pillar .modal ._modal-window ._header, .modal ._modal-window .content-box.-pillar ._header, .content-box.-pillar .modal ._modal-window ._info._header, .modal ._modal-window .content-box.-pillar ._info._header, .select-dropdown .modal ._modal-window ._list._header, .modal ._modal-window .select-dropdown ._list._header, .flex-v.flow-chart, .modal ._modal-window ._header.flow-chart, .modal ._modal-window ._scroll-container ._content.flow-chart, .flow-chart, .flow-chart .node.flow-chart, .flow-chart .node ul.flow-chart, main.-page.flow-chart, main.-article.flow-chart, .content-box.flow-chart, .content-box ul.impact.flow-chart, .content-box.-pillar ._header.flow-chart, .content-box.-pillar ._info.flow-chart, .select-dropdown ._list.flow-chart, .flow-chart .flex-v.node, .modal ._modal-window .flow-chart ._header.node, .flow-chart .modal ._modal-window ._header.node, .modal ._modal-window ._scroll-container .flow-chart ._content.node, .flow-chart .modal ._modal-window ._scroll-container ._content.node, .flow-chart .flow-chart.node, .flow-chart .node, .flow-chart .node ul.node, .flow-chart main.-page.node, .flow-chart main.-article.node, .flow-chart .content-box.node, .content-box .flow-chart ul.impact.node, .flow-chart .content-box ul.impact.node, .content-box.-pillar .flow-chart ._header.node, .flow-chart .content-box.-pillar ._header.node, .content-box.-pillar .flow-chart ._info.node, .flow-chart .content-box.-pillar ._info.node, .select-dropdown .flow-chart ._list.node, .flow-chart .select-dropdown ._list.node, main.flex-v.-page, .modal ._modal-window main._header.-page, .modal ._modal-window ._scroll-container main._content.-page, main.flow-chart.-page, .flow-chart main.node.-page, main.-page, main.-article.-page, main.content-box.-page, .content-box.-pillar main._header.-page, .content-box.-pillar main._info.-page, .select-dropdown main._list.-page, main.flex-v.-article, .modal ._modal-window main._header.-article, .modal ._modal-window ._scroll-container main._content.-article, main.flow-chart.-article, .flow-chart main.node.-article, main.-page.-article, main.-article, main.content-box.-article, .content-box.-pillar main._header.-article, .content-box.-pillar main._info.-article, .select-dropdown main._list.-article, .content-box.-pillar .flex-v._header, .modal ._modal-window .content-box.-pillar ._header, .content-box.-pillar .modal ._modal-window ._header, .modal ._modal-window ._scroll-container .content-box.-pillar ._content._header, .content-box.-pillar .modal ._modal-window ._scroll-container ._content._header, .content-box.-pillar .flow-chart._header, .flow-chart .content-box.-pillar .node._header, .content-box.-pillar .flow-chart .node._header, .flow-chart .node .content-box.-pillar ul._header, .content-box.-pillar .flow-chart .node ul._header, .content-box.-pillar main.-page._header, .content-box.-pillar main.-article._header, .content-box.-pillar .content-box._header, .content-box.-pillar ul.impact._header, .content-box.-pillar ._header, .content-box.-pillar ._info._header, .select-dropdown .content-box.-pillar ._list._header, .content-box.-pillar .select-dropdown ._list._header, .flex-v.button, .modal ._modal-window ._header.button, .modal ._modal-window ._scroll-container ._content.button, .flow-chart.button, .flow-chart .node.button, .flow-chart .node ul.button, main.-page.button, main.-article.button, .content-box.button, .content-box ul.impact.button, .content-box.-pillar ._header.button, .content-box.-pillar ._info.button, .select-dropdown ._list.button, .flow-chart .node a.flex-v, .modal ._modal-window .flow-chart .node a._header, .flow-chart .node .modal ._modal-window a._header, .modal ._modal-window ._scroll-container .flow-chart .node a._content, .flow-chart .node .modal ._modal-window ._scroll-container a._content, .flow-chart .node a.flow-chart, .flow-chart .node a.node, .flow-chart .node a.content-box, .content-box.-pillar .flow-chart .node a._header, .flow-chart .node .content-box.-pillar a._header, .content-box.-pillar .flow-chart .node a._info, .flow-chart .node .content-box.-pillar a._info, .select-dropdown .flow-chart .node a._list, .flow-chart .node .select-dropdown a._list, .content-box a.flex-v, .modal ._modal-window .content-box a._header, .content-box .modal ._modal-window a._header, .modal ._modal-window ._scroll-container .content-box a._content, .content-box .modal ._modal-window ._scroll-container a._content, .content-box a.flow-chart, .flow-chart .content-box a.node, .content-box .flow-chart a.node, .content-box a.content-box, .content-box.-pillar a._header, .content-box.-pillar a._info, .select-dropdown .content-box a._list, .content-box .select-dropdown a._list {
  align-items: center;
}
.flex-h.-align-start, .modal ._modal-window ._header .-align-start._cta, .flow-chart .-align-start.row, .content-box.-pillar ._info .-align-start._split, .-align-start.button, .flow-chart .node a.-align-start, .content-box a.-align-start, .modal ._modal-window ._header ._cta.content-box, .flow-chart .row.content-box, .content-box.-pillar ._info ._split.content-box, .flow-chart .node a.content-box, .content-box a.content-box, .flex-v.-align-start, .modal ._modal-window .-align-start._header, .modal ._modal-window ._scroll-container .-align-start._content, .-align-start.flow-chart, .flow-chart .-align-start.node, .flow-chart .node ul.-align-start, main.-align-start.-page, main.-align-start.-article, .content-box ul.-align-start.impact, .content-box.-pillar .-align-start._header, .content-box.-pillar .-align-start._info, .select-dropdown .-align-start._list, .modal ._modal-window ._header.content-box, .modal ._modal-window ._scroll-container ._content.content-box, .flow-chart .node.content-box, .flow-chart .node ul.content-box, main.-page.content-box, main.-article.content-box, .content-box, .content-box ul.impact.content-box, .content-box.-pillar ._header.content-box, .content-box.-pillar ._info.content-box, .select-dropdown ._list.content-box {
  align-items: flex-start;
}
.flex-h.-align-end, .modal ._modal-window ._header .-align-end._cta, .flow-chart .-align-end.row, .content-box.-pillar ._info .-align-end._split, .-align-end.button, .flow-chart .node a.-align-end, .content-box a.-align-end, .flex-v.-align-end, .modal ._modal-window .-align-end._header, .modal ._modal-window ._scroll-container .-align-end._content, .-align-end.flow-chart, .flow-chart .-align-end.node, .flow-chart .node ul.-align-end, main.-align-end.-page, main.-align-end.-article, .-align-end.content-box, .content-box ul.-align-end.impact, .content-box.-pillar .-align-end._header, .content-box.-pillar .-align-end._info, .select-dropdown .-align-end._list {
  align-items: flex-end;
}
.flex-h .-col-1, .button .-col-1, .flow-chart .node a .-col-1, .modal ._modal-window ._header ._cta .content-box.-pillar ._header, .content-box.-pillar .modal ._modal-window ._header ._cta ._header, .content-box.-pillar ._info ._split ._header, .flex-v .-col-1, .modal ._modal-window ._header .-col-1, .modal ._modal-window ._scroll-container ._content .-col-1, .flow-chart .-col-1, main.-page .-col-1, main.-article .-col-1, .content-box .-col-1, .content-box ul.impact .-col-1, .content-box.-pillar ._header .-col-1, .content-box.-pillar ._info .-col-1, .select-dropdown ._list .-col-1, .modal ._modal-window ._scroll-container ._content .content-box.-pillar ._header, .content-box.-pillar .modal ._modal-window ._scroll-container ._content ._header, .content-box.-pillar ._header {
  flex: 1;
}
.flex-h .-col-2, .button .-col-2, .flow-chart .node a .-col-2, .modal ._modal-window ._header ._cta .content-box.-pillar ._info, .content-box.-pillar .modal ._modal-window ._header ._cta ._info, .content-box.-pillar ._info ._split ._info, .flex-v .-col-2, .modal ._modal-window ._header .-col-2, .modal ._modal-window ._scroll-container ._content .-col-2, .flow-chart .-col-2, main.-page .-col-2, main.-article .-col-2, .content-box .-col-2, .content-box ul.impact .-col-2, .content-box.-pillar ._header .-col-2, .content-box.-pillar ._info .-col-2, .select-dropdown ._list .-col-2, .modal ._modal-window ._scroll-container ._content .content-box.-pillar ._info, .content-box.-pillar .modal ._modal-window ._scroll-container ._content ._info, .content-box.-pillar ._info {
  flex: 2;
}
.flex-h .-col-3, .button .-col-3, .flow-chart .node a .-col-3, .flex-v .-col-3, .modal ._modal-window ._header .-col-3, .modal ._modal-window ._scroll-container ._content .-col-3, .flow-chart .-col-3, main.-page .-col-3, main.-article .-col-3, .content-box .-col-3, .content-box ul.impact .-col-3, .content-box.-pillar ._header .-col-3, .content-box.-pillar ._info .-col-3, .select-dropdown ._list .-col-3 {
  flex: 3;
}
.flex-h .-col-4, .button .-col-4, .flow-chart .node a .-col-4, .flex-v .-col-4, .modal ._modal-window ._header .-col-4, .modal ._modal-window ._scroll-container ._content .-col-4, .flow-chart .-col-4, main.-page .-col-4, main.-article .-col-4, .content-box .-col-4, .content-box ul.impact .-col-4, .content-box.-pillar ._header .-col-4, .content-box.-pillar ._info .-col-4, .select-dropdown ._list .-col-4 {
  flex: 4;
}
.flex-h .-col-5, .button .-col-5, .flow-chart .node a .-col-5, .flex-v .-col-5, .modal ._modal-window ._header .-col-5, .modal ._modal-window ._scroll-container ._content .-col-5, .flow-chart .-col-5, main.-page .-col-5, main.-article .-col-5, .content-box .-col-5, .content-box ul.impact .-col-5, .content-box.-pillar ._header .-col-5, .content-box.-pillar ._info .-col-5, .select-dropdown ._list .-col-5 {
  flex: 5;
}
.flex-h .-col-6, .button .-col-6, .flow-chart .node a .-col-6, .flex-v .-col-6, .modal ._modal-window ._header .-col-6, .modal ._modal-window ._scroll-container ._content .-col-6, .flow-chart .-col-6, main.-page .-col-6, main.-article .-col-6, .content-box .-col-6, .content-box ul.impact .-col-6, .content-box.-pillar ._header .-col-6, .content-box.-pillar ._info .-col-6, .select-dropdown ._list .-col-6 {
  flex: 6;
}

.flex-h, .modal ._modal-window ._header ._cta, .flow-chart .row, .content-box.-pillar ._info ._split, .button, .flow-chart .node a, .content-box a {
  flex-direction: row;
  column-gap: var(--gap);
  row-gap: calc(0.5 * var(--gap));
}
.flex-h.-inline, .modal ._modal-window ._header .-inline._cta, .flow-chart .-inline.row, .content-box.-pillar ._info .-inline._split, .modal ._modal-window ._header ._cta.button, .flow-chart .row.button, .content-box.-pillar ._info ._split.button, .button, .modal ._modal-window ._header .flow-chart .node a._cta, .flow-chart .node .modal ._modal-window ._header a._cta, .flow-chart .node a, .modal ._modal-window ._header .content-box a._cta, .content-box .modal ._modal-window ._header a._cta, .flow-chart .content-box a.row, .content-box .flow-chart a.row, .content-box.-pillar ._info a._split, .content-box a {
  display: inline-flex;
}
.flex-h.-wrap, .modal ._modal-window ._header .-wrap._cta, .flow-chart .-wrap.row, .content-box.-pillar ._info .-wrap._split, .-wrap.button, .flow-chart .node a.-wrap, .content-box a.-wrap {
  flex-wrap: wrap;
}
.flex-h.-equal > *, .modal ._modal-window ._header .-equal._cta > *, .content-box.-pillar ._info .-equal._split > *, .-equal.button > *, .flow-chart .node a.-equal > *, .content-box a.-equal > *, .modal ._modal-window ._header .flow-chart ._cta.row > *, .flow-chart .modal ._modal-window ._header ._cta.row > *, .flow-chart .row > *, .content-box.-pillar ._info .flow-chart ._split.row > *, .flow-chart .content-box.-pillar ._info ._split.row > *, .flow-chart .node a.row > * {
  flex: 1;
}
.flex-h, .modal ._modal-window ._header ._cta, .flow-chart .row, .content-box.-pillar ._info ._split, .button, .flow-chart .node a, .content-box a {
  /* hr is used to break the line */
}
.flex-h hr, .modal ._modal-window ._header ._cta hr, .flow-chart .row hr, .content-box.-pillar ._info ._split hr, .button hr, .flow-chart .node a hr, .content-box a hr {
  flex-basis: 100%;
  height: 0;
  border: none;
  margin: 0;
  padding: 0;
}
@media (orientation:portrait) {
  .flex-h.-responsive, .modal ._modal-window ._header .-responsive._cta, .flow-chart .-responsive.row, .content-box.-pillar ._info .-responsive._split, .-responsive.button, .flow-chart .node a.-responsive, .content-box a.-responsive {
    flex-direction: column;
  }
  .flex-h.-responsive hr:not([class]), .modal ._modal-window ._header .-responsive._cta hr:not([class]), .flow-chart .-responsive.row hr:not([class]), .content-box.-pillar ._info .-responsive._split hr:not([class]), .-responsive.button hr:not([class]), .flow-chart .node a.-responsive hr:not([class]), .content-box a.-responsive hr:not([class]) {
    display: none;
  }
  .flex-h.-responsive, .modal ._modal-window ._header .-responsive._cta, .flow-chart .-responsive.row, .content-box.-pillar ._info .-responsive._split, .-responsive.button, .flow-chart .node a.-responsive, .content-box a.-responsive {
    row-gap: var(--gap);
  }
}

.flex-v, .modal ._modal-window ._header, .modal ._modal-window ._scroll-container ._content, .flow-chart, .flow-chart .node, .flow-chart .node ul, main.-page, main.-article, .content-box, .content-box ul.impact, .content-box.-pillar ._header, .content-box.-pillar ._info, .select-dropdown ._list {
  flex-direction: column;
  gap: var(--gap);
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
.grid, .content {
  --gap: 1rem;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--gap);
  /* Optional gap modifiers */
}
.grid.-gap-s, .-gap-s.content, .content-box ul.grid.impact, .content-box ul.content.impact {
  --gap: 0.5rem;
}
.grid.-gap, .-gap.content, main.grid.-page, main.content.-page, main.grid.-article, main.content.-article, .grid.content-box, .content.content-box, .content-box.-pillar .grid._header, .content-box.-pillar .content._header, .content-box.-pillar .grid._info, .content-box.-pillar .content._info, .content-box.-pillar ._info .grid._split, .content-box.-pillar ._info .content._split {
  --gap: 1rem;
}
.grid.-gap-l, .-gap-l.content {
  --gap: 4rem;
}
.grid.-dense, .-dense.content {
  grid-auto-flow: dense;
}
.grid, .content {
  /* Column span utilities for grid items */
}
.grid .-col-auto, .content .-col-auto {
  grid-column: auto;
}
.grid .-col-1, .content .-col-1, .grid .content-box.-pillar ._header, .content-box.-pillar .grid ._header, .content .content-box.-pillar ._header, .content-box.-pillar .content ._header {
  grid-column: span 1;
}
.grid .-col-2, .content .-col-2, .grid .content-box.-pillar ._info, .content-box.-pillar .grid ._info, .content .content-box.-pillar ._info, .content-box.-pillar .content ._info {
  grid-column: span 2;
}
.grid .-col-3, .content .-col-3 {
  grid-column: span 3;
}
.grid .-col-4, .content .-col-4 {
  grid-column: span 4;
}
.grid .-col-5, .content .-col-5 {
  grid-column: span 5;
}
.grid .-col-6, .content .-col-6 {
  grid-column: span 6;
}
.grid .-col-7, .content .-col-7 {
  grid-column: span 7;
}
.grid .-col-8, .content .-col-8 {
  grid-column: span 8;
}
.grid .-col-9, .content .-col-9 {
  grid-column: span 9;
}
.grid .-col-10, .content .-col-10 {
  grid-column: span 10;
}
.grid .-col-11, .content .-col-11 {
  grid-column: span 11;
}
.grid .-col-12, .content .-col-12 {
  grid-column: span 12;
}
.grid, .content {
  /* Row span utilities for grid items */
}
.grid .-row-auto, .content .-row-auto {
  grid-row: auto;
}
.grid .-row-1, .content .-row-1 {
  grid-row: span 1;
}
.grid .-row-2, .content .-row-2 {
  grid-row: span 2;
}
.grid .-row-3, .content .-row-3 {
  grid-row: span 3;
}
.grid .-row-4, .content .-row-4 {
  grid-row: span 4;
}
.grid .-row-5, .content .-row-5 {
  grid-row: span 5;
}
.grid .-row-6, .content .-row-6 {
  grid-row: span 6;
}
.grid .-row-7, .content .-row-7 {
  grid-row: span 7;
}
.grid .-row-8, .content .-row-8 {
  grid-row: span 8;
}
.grid .-row-9, .content .-row-9 {
  grid-row: span 9;
}
.grid .-row-10, .content .-row-10 {
  grid-row: span 10;
}
.grid .-row-11, .content .-row-11 {
  grid-row: span 11;
}
.grid .-row-12, .content .-row-12 {
  grid-row: span 12;
}
.grid, .content {
  /* Tablet portrait : 6-column grid + proportional remap
  .-col-1 -> span 1
  .-col-2 -> span 1
  .-col-3 -> span 2
  .-col-4 -> span 2
  .-col-5 -> span 3
  .-col-6 -> span 3
  .-col-7 -> span 4
  .-col-8 -> span 4
  .-col-9 -> span 5
  .-col-10 -> span 5
  .-col-11 -> span 6
  .-col-12 -> span 6
  */
}
@media (orientation:portrait) and (min-width:500px) {
  .grid, .content {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .grid .-col-1, .content .-col-1, .grid .content-box.-pillar ._header, .content-box.-pillar .grid ._header, .content .content-box.-pillar ._header, .content-box.-pillar .content ._header {
    grid-column: span 1;
  }
  .grid .-col-2, .content .-col-2, .grid .content-box.-pillar ._info, .content-box.-pillar .grid ._info, .content .content-box.-pillar ._info, .content-box.-pillar .content ._info {
    grid-column: span 1;
  }
  .grid .-col-3, .content .-col-3 {
    grid-column: span 2;
  }
  .grid .-col-4, .content .-col-4 {
    grid-column: span 2;
  }
  .grid .-col-5, .content .-col-5 {
    grid-column: span 3;
  }
  .grid .-col-6, .content .-col-6 {
    grid-column: span 3;
  }
  .grid .-col-7, .content .-col-7 {
    grid-column: span 4;
  }
  .grid .-col-8, .content .-col-8 {
    grid-column: span 4;
  }
  .grid .-col-9, .content .-col-9 {
    grid-column: span 5;
  }
  .grid .-col-10, .content .-col-10 {
    grid-column: span 5;
  }
  .grid .-col-11, .content .-col-11 {
    grid-column: span 6;
  }
  .grid .-col-12, .content .-col-12 {
    grid-column: span 6;
  }
}
.grid, .content {
  /* Tablet: 6-column grid with column-count reduction
     Inherits proportional remap from portrait-tablet, then
     overrides -col-4 (3/row → 2/row) and -col-2 (6/row → 3/row).
     Also declares 6-col grid for landscape edge case where
     portrait-tablet doesn't fire. */
}
@media (max-width:1050px) {
  .grid, .content {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .grid .-col-1, .content .-col-1, .grid .content-box.-pillar ._header, .content-box.-pillar .grid ._header, .content .content-box.-pillar ._header, .content-box.-pillar .content ._header {
    grid-column: span 1;
  }
  .grid .-col-2, .content .-col-2, .grid .content-box.-pillar ._info, .content-box.-pillar .grid ._info, .content .content-box.-pillar ._info, .content-box.-pillar .content ._info {
    grid-column: span 1;
  }
  .grid .-col-3, .content .-col-3 {
    grid-column: span 2;
  }
  .grid .-col-4, .content .-col-4 {
    grid-column: span 2;
  }
  .grid .-col-5, .content .-col-5 {
    grid-column: span 3;
  }
  .grid .-col-6, .content .-col-6 {
    grid-column: span 3;
  }
  .grid .-col-7, .content .-col-7 {
    grid-column: span 4;
  }
  .grid .-col-8, .content .-col-8 {
    grid-column: span 4;
  }
  .grid .-col-9, .content .-col-9 {
    grid-column: span 5;
  }
  .grid .-col-10, .content .-col-10 {
    grid-column: span 5;
  }
  .grid .-col-11, .content .-col-11 {
    grid-column: span 6;
  }
  .grid .-col-12, .content .-col-12 {
    grid-column: span 6;
  }
  .grid .-col-4, .content .-col-4 {
    grid-column: span 3;
  }
  .grid .-col-2, .content .-col-2, .grid .content-box.-pillar ._info, .content-box.-pillar .grid ._info, .content .content-box.-pillar ._info, .content-box.-pillar .content ._info {
    grid-column: span 2;
  }
  .grid, .content {
    /* Narrow tablet: collapse to 1/row */
  }
}
@media (max-width:1050px) and (max-width:750px) {
  .grid .-col-4, .content .-col-4 {
    grid-column: span 6;
  }
  .grid .-col-6, .content .-col-6 {
    grid-column: span 6;
  }
}
.grid, .content {
  /* Mobile: 2-column grid + hard remap */
}
@media (max-width:500px) {
  .grid, .content {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .grid .-col-1, .content .-col-1, .grid .content-box.-pillar ._header, .content-box.-pillar .grid ._header, .content .content-box.-pillar ._header, .content-box.-pillar .content ._header {
    grid-column: span 1;
  }
  .grid .-col-2, .content .-col-2, .grid .content-box.-pillar ._info, .content-box.-pillar .grid ._info, .content .content-box.-pillar ._info, .content-box.-pillar .content ._info {
    grid-column: span 2;
  }
  .grid .-col-3, .content .-col-3 {
    grid-column: span 2;
  }
  .grid .-col-4, .content .-col-4 {
    grid-column: span 2;
  }
  .grid .-col-5, .content .-col-5 {
    grid-column: span 2;
  }
  .grid .-col-6, .content .-col-6 {
    grid-column: span 2;
  }
  .grid .-col-7, .content .-col-7 {
    grid-column: span 2;
  }
  .grid .-col-8, .content .-col-8 {
    grid-column: span 2;
  }
  .grid .-col-9, .content .-col-9 {
    grid-column: span 2;
  }
  .grid .-col-10, .content .-col-10 {
    grid-column: span 2;
  }
  .grid .-col-11, .content .-col-11 {
    grid-column: span 2;
  }
  .grid .-col-12, .content .-col-12 {
    grid-column: span 2;
  }
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
ul, ol {
  --list-gap: 0;
  list-style-position: inside;
  width: 100%;
}

ul {
  list-style-type: disc;
}
ul.-clean {
  list-style-type: disc;
}
ul.-gap {
  --list-gap: tokens.$spacing;
}
ul li:not(:first-child) {
  margin-top: var(--list-gap);
}

.-full-cover, .-absolute-cover {
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
}

.-absolute-cover {
  position: absolute;
  top: 0;
  left: 0;
}

.-full-contain, .content-box img.client-logo, .-absolute-contain {
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  object-fit: contain;
}

.-absolute-contain {
  position: absolute;
  top: 0;
  left: 0;
}

.-fill-width {
  width: 100%;
  min-width: 100%;
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
.button, .flow-chart .node a, .content-box a {
  text-decoration: none;
  cursor: pointer;
}
.button[disabled], .flow-chart .node a[disabled], .content-box a[disabled] {
  pointer-events: none;
  opacity: 0.3;
}
.button.-selected, .flow-chart .node a.-selected, .content-box a.-selected {
  pointer-events: none;
}
.button.-primary, .flow-chart .node a.-primary, .content-box a.-primary {
  padding-inline: 2rem;
  border-radius: 100px;
}
.button.-secondary, .flow-chart .node a.-secondary, .content-box a.-secondary {
  border-radius: 100px;
  border: 2px solid var(--col-main);
}
.button:not(.-primary):not(.-secondary):not(.-round), .flow-chart .node a:not(.-primary):not(.-secondary):not(.-round), .content-box a:not(.-primary):not(.-secondary):not(.-round) {
  padding-inline: 1rem;
}
.button:not(.-primary):not(.-secondary), .flow-chart .node a:not(.-primary):not(.-secondary), .content-box a:not(.-primary):not(.-secondary) {
  border-bottom: 2px solid transparent;
}
.button:not(.-primary):not(.-secondary):hover, .flow-chart .node a:not(.-primary):not(.-secondary):hover, .content-box a:not(.-primary):not(.-secondary):hover {
  background: var(--col-off-bg);
  border-color: var(--col-accent);
}
.chip {
  display: inline-block;
  border: 1px solid var(--col-accent);
  padding: 0 0.5rem;
  border-radius: 4rem;
  margin: 2px;
  cursor: pointer;
}
.chip:hover {
  background: var(--col-off-bg);
}

.select-dropdown {
  display: none;
}
.select-dropdown.-show {
  display: block;
}
/*
This is made to work with Phosphor icons


*/
.icon {
  display: inline-block;
  font-size: 1.5em;
}
.icon.-l {
  font-size: 2em;
}
.icon.-xl {
  font-size: 3em;
}
.icon.-xxl {
  font-size: 6em;
}
.icon.-s {
  font-size: 1em;
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
.tooltip, v-tooltip {
  --display: none;
  position: fixed;
  bottom: var(--y);
  left: var(--x);
  max-width: 25rem;
  display: var(--display);
  border-radius: 4px;
  box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.2666666667);
  z-index: 200;
  pointer-events: none;
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
:root {
  --border-radius: .25rem;
  --col-ai-from: #909;
  --col-ai-to: #F60;
}

main {
  --max-char-width:66ch;
  position: relative;
  z-index: 2;
  margin-top: 8rem;
}
main h1 {
  text-align: center;
}
main.-article {
  border: 1px solid var(--col-accent);
}
main.-article h2 {
  margin-top: 8rem;
}
main.-article h1, main.-article h3 {
  margin-top: 4rem;
}
main.-article p, main.-article h4, main.-article h5 {
  margin-top: 1rem;
}
main.-article p, main.-article ul, main.-article ol, main.-article table, main.-article pre, main.-article figure {
  width: 100%;
  max-width: var(--max-char-width);
}
main.-article figure img {
  margin: 4rem 0;
  width: 100%;
}

.content-box {
  padding: 2rem;
  border: 1px solid var(--col-accent);
}
.content-box > .content-box {
  padding: 1rem 0 0 0;
  border: none;
  border-top: 1px solid rgba(136, 136, 102, 0.5333333333);
  border-radius: 0;
}
.content-box h1, .content-box h2, .content-box h3 {
  width: 100%;
  text-align: center;
}
.content-box strong {
  display: block;
}
.content-box ul.impact {
  list-style-type: none;
}
.content-box ul.impact li {
  border: 1px solid var(--col-accent);
}
.content-box img.small {
  width: 50%;
}
.content-box.-story {
  --gap: 0px;
}
.content-box.-story h3 {
  text-align: left;
}
.content-box.-story h4, .content-box.-story h5 {
  margin-top: 1rem;
}
.content-box.-pillar {
  flex-direction: row;
  align-items: center;
}
.content-box.-pillar ._header {
  flex: 1;
}
@media (orientation:portrait) {
  .content-box.-pillar {
    flex-direction: column;
    align-items: stretch;
  }
}

.logo-vicert {
  width: 20rem;
  max-width: calc(100vw - 8rem);
  text-align: center;
}

.signature {
  padding-bottom: 8rem;
}
.signature ._tagline {
  margin-top: 1rem;
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
.menu, vicert-menu {
  --menu-pos-y: 0;
  --menu-size: 4rem;
  top: 1rem;
  left: 50%;
  transform: translate(-50%, var(--menu-pos-y));
  width: var(--menu-size);
  max-height: var(--menu-size);
  overflow: hidden;
  border-radius: calc(0.5 * var(--menu-size));
  z-index: 200;
  box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.2666666667);
}
.menu.-hide, vicert-menu.-hide {
  --menu-pos-y: calc(-100% - 4rem);
}
.menu.-animated, vicert-menu.-animated {
  transition: width 0.32s cubic-bezier(0.25, 1, 0.5, 1), max-height 0.48s cubic-bezier(0.25, 1, 0.5, 1), transform 0.56s cubic-bezier(0.25, 1, 0.5, 1);
}
.menu.-animated ._icon, vicert-menu.-animated ._icon {
  transition: transform 0.56s cubic-bezier(0.25, 1, 0.5, 1);
}
.menu:hover, vicert-menu:hover {
  width: 16rem;
  max-height: 32rem;
}
.menu:hover nav, vicert-menu:hover nav {
  opacity: 1;
  transition: opacity 0.2s ease 0.15s;
}
.menu ._icon, vicert-menu ._icon {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: var(--menu-size);
  height: var(--menu-size);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}
.menu ._icon .ph-duotone::before, vicert-menu ._icon .ph-duotone::before {
  opacity: 0;
}
.menu nav, vicert-menu nav {
  opacity: 0;
  transition: opacity 0.15s ease;
}
.menu nav ul, vicert-menu nav ul {
  list-style-type: none;
  width: 100%;
}
.menu nav ul li, vicert-menu nav ul li {
  width: 100%;
  text-align: center;
}
.menu nav ul li:not(:first-child), vicert-menu nav ul li:not(:first-child) {
  margin-top: 0;
}
.menu nav ul li.-selected a, vicert-menu nav ul li.-selected a {
  background: rgba(255, 255, 255, 0.2);
  pointer-events: none;
}
.menu nav ul li a, .menu nav ul li a:visited, vicert-menu nav ul li a, vicert-menu nav ul li a:visited {
  display: block;
  text-decoration: none;
  color: white;
  border-radius: 18px;
}
.menu nav ul li a:hover, .menu nav ul li a:visited:hover, vicert-menu nav ul li a:hover, vicert-menu nav ul li a:visited:hover {
  background: rgba(255, 255, 255, 0.2666666667);
  color: white;
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
ascii-img {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(var(--scale));
  --scale: 1;
  will-change: transform;
  backface-visibility: hidden;
  z-index: 1;
  cursor: default;
}
ascii-img pre {
  position: relative;
  font-size: 1.1vw;
  line-height: 100% !important;
  color: #e6eaf0;
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
.flow-chart .row-scroll {
  padding: 0 1rem;
}
.flow-chart .row {
  --gap: 5vw !important;
}
.flow-chart .branch {
  display: flex;
  gap: 5vw;
  width: 100%;
  align-items: flex-start;
}
.flow-chart .branch-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.flow-chart #economics > h2 {
  text-align: center;
  font-size: 2.5rem;
}
.flow-chart .economics-compare {
  width: 100%;
  padding: 1rem 0;
  text-align: center;
}
.flow-chart .economics-compare h4 {
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.flow-chart .economics-compare .economics-before, .flow-chart .economics-compare .economics-now {
  position: relative;
  padding-left: 2.5rem;
}
.flow-chart .economics-compare .economics-label {
  position: absolute;
  left: 0.7rem;
  top: 50%;
  writing-mode: vertical-rl;
  transform: rotate(180deg) translateX(50%);
  text-transform: uppercase;
  letter-spacing: 0.15em;
  font-size: 0.6rem;
  color: #c8a;
  font-weight: 600;
}
.flow-chart .economics-compare .economics-traditional {
  background: #f0f0f0;
  border: 1px solid #ddd;
  border-radius: var(--border-radius);
  padding: 1rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
}
.flow-chart .economics-compare .economics-traditional > p.-font-l {
  font-family: "Instrument Serif", serif;
  font-size: 1.33rem;
}
.flow-chart .economics-compare .economics-divider {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 4rem 0;
}
.flow-chart .economics-compare .economics-divider span {
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--col-accent);
}
.flow-chart .economics-compare .economics-divider::before, .flow-chart .economics-compare .economics-divider::after {
  content: "";
  flex: 1;
  border-top: 2px dashed var(--col-accent);
  opacity: 0.5;
}
.flow-chart .economics-compare .economics-ai {
  display: inline-block;
  background: linear-gradient(135deg, var(--col-ai-to), var(--col-ai-from));
  color: white;
  border-radius: var(--border-radius);
  padding: 1rem 4rem;
  margin-top: 1rem;
}
.flow-chart .economics-compare .economics-ai h4 {
  color: white;
  text-align: center;
}
.flow-chart .economics-compare .economics-ai p {
  color: white;
}
.flow-chart .node {
  position: relative;
}
.flow-chart .node:not(.-start):not(.-end) {
  max-width: 65ch;
}
.flow-chart .node {
  padding: 2rem 1rem;
  border: 2px solid var(--col-accent);
  border-radius: var(--border-radius);
}
.flow-chart .node.-ai {
  --col-accent: var(--col-ai-from);
  --col-off-bg: rgb(245 214 245);
  border-image: linear-gradient(to top, var(--col-ai-from) 0%, var(--col-ai-to) 100%) 1;
  border-width: 2px;
  border-style: solid;
}
.flow-chart .node.-ai h3 {
  background-image: linear-gradient(var(--col-ai-to), var(--col-ai-from));
  color: transparent;
  background-clip: text;
}
.flow-chart .node.-ai a {
  color: #09f !important;
}
.flow-chart .node.-ai a:hover {
  background-color: rgb(252, 202, 252);
}
.flow-chart .node.-decision {
  border: none;
  background-image: url("../gfx/decision-diamond.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%; /* stretch to element box */
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
}
.flow-chart .node.-start, .flow-chart .node.-end {
  border-radius: var(--border-radius);
  max-width: calc(100vw - 4rem);
  padding-inline: 3rem;
}
.flow-chart .node.-input {
  color: var(--col-bg);
  background-color: var(--col-accent);
  clip-path: polygon(15% 0, 100% 0, 85% 100%, 0 100%);
}
.flow-chart .node p, .flow-chart .node ul {
  text-align: center;
  flex: 1;
  font-size: 0.8rem;
}
.flow-chart .node ul {
  height: 100%;
  list-style-type: disc;
  list-style-position: inside;
  width: 100%;
  align-self: stretch;
}
.flow-chart .node ul li {
  text-align: center;
}
.flow-chart .node ul li:not(:first-child) {
  margin-top: 0.5rem;
}
.flow-chart .node a.-secondary:hover {
  background: var(--col-off-bg);
}

@media (orientation:portrait) {
  html {
    overflow-x: hidden;
  }
  body {
    overflow-x: hidden;
  }
  .flow-chart {
    width: 100vw;
    max-width: none;
    overflow-x: hidden;
  }
  .flow-chart .branch .branch-col {
    min-width: 0;
  }
  .flow-chart .branch .row-scroll {
    overflow: visible;
    width: 100%;
  }
  .flow-chart .branch .row {
    flex-direction: column;
    width: 100%;
  }
  .flow-chart .row-scroll {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch; /* smooth touch scroll on iOS */
  }
  .flow-chart .row {
    width: max-content; /* grow to fit all nodes */
    margin-left: auto;
    margin-right: auto;
  }
  .flow-chart .node:not(.-start):not(.-end) {
    max-width: 40vw;
  }
  .flow-chart #economics {
    max-width: calc(100vw - 2rem);
  }
}
@media (max-width:500px) {
  .flow-chart .node:not(.-start):not(.-end) {
    max-width: 66vw;
  }
  .flow-chart #economics {
    max-width: calc(100vw - 2rem);
  }
}
.leader-line, .linker-line {
  max-width: 100vw;
  overflow: visible;
  pointer-events: none;
}
@media (orientation:portrait) {
  .leader-line, .linker-line {
    display: none !important;
  }
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
.modal {
  --modal-margin: 2rem;
  --modal-scale: .95;
  --modal-opacity: 0;
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
}
@supports (height: 100dvh) {
  .modal {
    height: 100dvh;
  }
}
.modal {
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--col-bg) 15%, transparent);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  z-index: 300;
  opacity: var(--modal-opacity);
  transition: opacity 0.4s cubic-bezier(0.25, 1, 0.5, 1), visibility 0s 0.4s;
}
.modal.-show {
  --modal-scale:1;
  --modal-opacity:1;
  visibility: visible;
  transition: opacity 0.4s cubic-bezier(0.25, 1, 0.5, 1), visibility 0s 0s;
}
.modal ._modal-window {
  width: min(100vw - 2 * var(--modal-margin), 2000px);
  height: min(100dvh - 2 * var(--modal-margin), 1400px);
  border-radius: 4px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr;
  transform: scale(var(--modal-scale));
  opacity: var(--modal-opacity);
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
.modal ._modal-window ._header {
  grid-column: 1;
  grid-row: 1;
  padding: 1rem;
}
.modal ._modal-window ._header h1 {
  text-align: center;
}
.modal ._modal-window ._header ._cta {
  z-index: 5;
}
.modal ._modal-window ._scroll-container {
  grid-column: 2;
  grid-row: 1;
  overflow-y: auto;
  scrollbar-width: none;
}
.modal ._modal-window ._scroll-container::-webkit-scrollbar {
  display: none;
}
.modal ._modal-window ._scroll-container ._content {
  min-height: 100%;
  padding: 7.5rem 2rem;
}
.modal ._modal-window ._scroll-container ._content h3 {
  /* ugly hack to force remove the top title*/
  display: none;
}
.modal ._modal-window ._scroll-container ._content .content-box {
  flex: 0 0 auto;
}
.modal ._modal-window ._close {
  position: absolute;
  top: 2rem;
  right: 2rem;
  z-index: 5;
}
.modal ._modal-window ._close:hover {
  background: color-mix(in srgb, var(--col-main) 14%, var(--col-bg));
}
.modal ._modal-window .content-box {
  border-color: var(--col-main);
  padding: 1rem;
  gap: 1rem;
  font-size: 1rem;
}
.modal ._modal-window .content-box h3, .modal ._modal-window .content-box h4 {
  margin-top: 0;
}
.modal ._modal-window .content-box .-col-1 {
  display: none;
}
.modal ._modal-window .content-box a {
  margin-top: 0.5rem;
}
.modal ._modal-window ul.impact li {
  border-color: var(--col-main);
}
.modal ._modal-window .button.-primary {
  color: var(--col-accent);
}
.modal ._modal-window .content-box a:not(.-primary):not(.-secondary) {
  color: var(--col-main);
  align-self: flex-end;
  font-size: 1rem;
  border-bottom-color: transparent;
}
.modal ._modal-window .content-box a:not(.-primary):not(.-secondary):hover {
  background: color-mix(in srgb, var(--col-main) 14%, transparent);
  border-bottom-color: var(--col-main);
  color: var(--col-main);
}
@media (orientation:portrait) {
  .modal ._modal-window {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
  }
  .modal ._modal-window ._header {
    flex-shrink: 0;
    padding-block: 2rem;
  }
  .modal ._modal-window ._scroll-container {
    flex: 1 1 auto;
    overflow: visible;
  }
  .modal ._modal-window ._scroll-container ._content {
    padding: 0 1rem 4rem 1rem;
  }
  .modal ._modal-window ._close {
    position: sticky;
    bottom: 2rem;
    right: auto;
    top: auto;
    width: auto;
    align-self: center;
  }
}

/* Correct way to overwrite shit (also, place @font-face in project/ */
/*
These should be changes to the base framework,
not layout-spefic changes.
*/
h4, h5 {
  font-family: "IBM Plex Mono", monospace;
  font-size: 1rem;
  text-transform: uppercase;
}

h2 {
  text-align: center;
}

@media (max-width:500px) {
  h1 {
    font-size: 3rem;
  }
  h2 {
    font-size: 2.2rem;
  }
}
@view-transition {
  navigation: auto;
}
ascii-img {
  view-transition-name: bg;
}

main {
  view-transition-name: content;
}

vicert-menu {
  view-transition-name: menu;
}

.modal.-show {
  view-transition-name: modal-backdrop;
}

.modal.-show ._modal-window {
  view-transition-name: modal;
}

::view-transition-group(bg) {
  z-index: 1;
  animation-duration: 0s;
}

::view-transition-group(content) {
  z-index: 2;
  animation-duration: 0s;
  animation-delay: 200ms;
  animation-fill-mode: both;
}

::view-transition-group(menu) {
  z-index: 3;
}

::view-transition-group(modal-backdrop) {
  z-index: 5;
}

::view-transition-group(modal) {
  z-index: 10;
}

::view-transition {
  background-color: var(--col-bg);
}

::view-transition-group(menu) {
  animation-duration: 200ms;
  animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
}

::view-transition-old(content) {
  animation: _vt-slide-out 200ms cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
  transform-origin: top center;
  object-fit: none;
  object-position: top;
}

::view-transition-new(content) {
  animation: _vt-slide-in 200ms cubic-bezier(0.25, 0.1, 0.25, 1) 200ms forwards;
  opacity: 0;
  object-fit: none;
  object-position: top;
}

::view-transition-old(bg) {
  animation: _vt-fade-out 200ms cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
}

::view-transition-new(bg) {
  animation: _vt-fade-in 250ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms forwards;
  opacity: 0;
}

::view-transition-old(root) {
  animation: _vt-fade-out 200ms cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
}

::view-transition-new(root) {
  animation: _vt-fade-in 200ms cubic-bezier(0.25, 0.1, 0.25, 1) 200ms forwards;
  opacity: 0;
}

::view-transition-old(modal-backdrop):only-child {
  animation: _vt-fade-out 200ms cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
}

::view-transition-old(modal):only-child {
  animation: _vt-modal-out 200ms cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
}

::view-transition-new(modal-backdrop):only-child {
  animation: none;
}

::view-transition-new(modal):only-child {
  animation: _vt-modal-in 200ms cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
}

@keyframes _vt-modal-in {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes _vt-fade-out {
  to {
    opacity: 0;
  }
}
@keyframes _vt-fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes _vt-slide-out {
  to {
    opacity: 0;
    transform: translateY(-2px) scale(0.96);
  }
}
@keyframes _vt-slide-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes _vt-modal-out {
  to {
    opacity: 0;
    transform: scale(0.95);
  }
}

/*# sourceMappingURL=main.css.map */
