/* GREENAXIS - consolidated stylesheet (hand-cleaned Webflow export).
   1  reset (normalize)
   2  base framework -- the load-bearing rules, renamed .wf-
   2b widget geometry the dropped runtime rules used to provide
   3  Earthon design, including the renamed commerce layout
   4  components -- vanilla replacements for the Webflow runtime
      and its IX2/IX3 interactions

   Fonts: assets/fonts/fonts.css -- Urbanist, self-hosted woff2. The
   export loaded it from Google at runtime through webfont.js; it is
   one variable file here, covering every weight the design asks for.
   No family is substituted: this export shipped no licensed binary. */

/* ======================================================================
   1. Reset (normalize)
   ====================================================================== */
html {
  font-family: sans-serif;
  
  -ms-text-size-adjust: 100%;
  
  -webkit-text-size-adjust: 100%;
  
}
body {
  margin: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block;
}
audio, canvas, progress, video {
  display: inline-block;
  
  vertical-align: baseline;
  
}
audio:not([controls]) {
  display: none;
  height: 0;
}
[hidden], template {
  display: none;
}
a {
  background-color: transparent;
}
a:active, a:hover {
  outline: 0;
}
abbr[title] {
  border-bottom: 1px dotted;
}
b, strong {
  font-weight: bold;
}
dfn {
  font-style: italic;
}
h1:where(:not([class*="heading-scale-"])), :where(.heading-scale-1) {
  font-size: 2em;
  margin: 0.67em 0;
}
mark {
  background: #ff0;
  color: #000;
}
small {
  font-size: 80%;
}
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
img {
  border: 0;
}
svg:not(:root) {
  overflow: hidden;
}
figure {
  margin: 1em 40px;
}
hr {
  box-sizing: content-box;
  height: 0;
}
pre {
  overflow: auto;
}
code, kbd, pre, samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
button, input, optgroup, select, textarea {
  color: inherit;
  
  font: inherit;
  
  margin: 0;
  
}
button {
  overflow: visible;
}
button, select {
  text-transform: none;
}
button, html input[type="button"], input[type="reset"] {
  -webkit-appearance: button;
  
  cursor: pointer;
  
}
button[disabled], html input[disabled] {
  cursor: default;
}
button::-moz-focus-inner, input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
input {
  line-height: normal;
}
input[type='checkbox'], input[type='radio'] {
  box-sizing: border-box;
  
  padding: 0;
  
}
input[type='number']::-webkit-inner-spin-button, input[type='number']::-webkit-outer-spin-button {
  height: auto;
}
input[type='search'] {
  -webkit-appearance: none;
  
}
input[type='search']::-webkit-search-cancel-button, input[type='search']::-webkit-search-decoration {
  -webkit-appearance: none;
}
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
legend {
  border: 0;
  
  padding: 0;
  
}
textarea {
  overflow: auto;
}
optgroup {
  font-weight: bold;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td, th {
  padding: 0;
}
/* ======================================================================
   2. Base framework (runtime-only rules dropped; the rest kept as .wf-)
   ====================================================================== */
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
html {
  height: 100%;
}
body {
  margin: 0;
  min-height: 100%;
  background-color: #fff;
  font-family: Arial, sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #333;
}
img {
  max-width: 100%;
  vertical-align: middle;
  display: inline-block;
}
.inline-block {
  max-width: 100%;
  display: inline-block;
}
.wf-button {
  display: inline-block;
  padding: 9px 15px;
  background-color: #3898EC;
  color: white;
  border: 0;
  line-height: inherit;
  text-decoration: none;
  cursor: pointer;
  border-radius: 0;
}
input.wf-button {
  -webkit-appearance: button;
}
h1:where(:not([class*="heading-scale-"])), h2:where(:not([class*="heading-scale-"])), h3:where(:not([class*="heading-scale-"])), h4:where(:not([class*="heading-scale-"])), h5:where(:not([class*="heading-scale-"])), h6:where(:not([class*="heading-scale-"])), :where(.heading-scale-1), :where(.heading-scale-2), :where(.heading-scale-3), :where(.heading-scale-4), :where(.heading-scale-5), :where(.heading-scale-6) {
  font-weight: bold;
  margin-bottom: 10px;
}
h1:where(:not([class*="heading-scale-"])), :where(.heading-scale-1) {
  font-size: 38px;
  line-height: 44px;
  margin-top: 20px;
}
h2:where(:not([class*="heading-scale-"])), :where(.heading-scale-2) {
  font-size: 32px;
  line-height: 36px;
  margin-top: 20px;
}
h3:where(:not([class*="heading-scale-"])), :where(.heading-scale-3) {
  font-size: 24px;
  line-height: 30px;
  margin-top: 20px;
}
h4:where(:not([class*="heading-scale-"])), :where(.heading-scale-4) {
  font-size: 18px;
  line-height: 24px;
  margin-top: 10px;
}
h5:where(:not([class*="heading-scale-"])), :where(.heading-scale-5) {
  font-size: 14px;
  line-height: 20px;
  margin-top: 10px;
}
h6:where(:not([class*="heading-scale-"])), :where(.heading-scale-6) {
  font-size: 12px;
  line-height: 18px;
  margin-top: 10px;
}
p {
  margin-top: 0;
  margin-bottom: 10px;
}
blockquote {
  margin: 0 0 10px 0;
  padding: 10px 20px;
  border-left: 5px solid #E2E2E2;
  font-size: 18px;
  line-height: 22px;
}
figure {
  margin: 0;
  margin-bottom: 10px;
}
figcaption {
  margin-top: 5px;
  text-align: center;
}
ul, ol {
  margin-top: 0px;
  margin-bottom: 10px;
  padding-left: 40px;
}
.list-unstyled {
  padding-left: 0;
  list-style: none;
}
.embed:before, .embed:after {
  content: " ";
  display: table;
  grid-column-start: 1;
  grid-row-start: 1;
  grid-column-end: 2;
  grid-row-end: 2;
}
.embed:after {
  clear: both;
}
fieldset {
  padding: 0;
  margin: 0;
  border: 0;
}
button, [type='button'], [type='reset'] {
  border: 0;
  cursor: pointer;
  -webkit-appearance: button;
}
.wf-form {
  margin: 0 0 15px;
}
.wf-form-done {
  display: none;
  padding: 20px;
  text-align: center;
  background-color: #dddddd;
}
.wf-form-fail {
  display: none;
  margin-top: 10px;
  padding: 10px;
  background-color: #ffdede;
}
label {
  display: block;
  margin-bottom: 5px;
  font-weight: bold;
}
.wf-input {
  display: block;
  width: 100%;
  height: 38px;
  padding: 8px 12px;
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333333;
  vertical-align: middle;
  background-color: #ffffff;
  border: 1px solid #cccccc;
}
.wf-input::placeholder {
  color: #999;
}
.wf-input:focus {
  border-color: #3898EC;
  outline: 0;
}
.wf-input[disabled], .wf-input[readonly], fieldset[disabled] .wf-input {
  cursor: not-allowed;
}
.wf-input[readonly] {
  background-color: #eeeeee;
}
textarea.wf-input {
  height: auto;
}
.wf-container {
  margin-left: auto;
  margin-right: auto;
  max-width: 940px;
}
.wf-container:before, .wf-container:after {
  content: " ";
  display: table;
  grid-column-start: 1;
  grid-row-start: 1;
  grid-column-end: 2;
  grid-row-end: 2;
}
.wf-container:after {
  clear: both;
}
@media screen and (max-width: 991px) {
  .wf-container {
    max-width: 728px;
  }
}
@media screen and (max-width: 479px) {
  .wf-container {
    max-width: none;
  }
}
.richtext:before, .richtext:after {
  content: " ";
  display: table;
  grid-column-start: 1;
  grid-row-start: 1;
  grid-column-end: 2;
  grid-row-end: 2;
}
.richtext:after {
  clear: both;
}
.richtext[contenteditable="true"]:before, .richtext[contenteditable="true"]:after {
  white-space: initial;
}
.richtext ol, .richtext ul {
  overflow: hidden;
}
.richtext figure[data-rt-type="video"] > div:after {
  content: '';
  position: absolute;
  display: none;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.richtext figure {
  position: relative;
  max-width: 60%;
}
.richtext figure > div:before {
  cursor: default!important;
}
.richtext figure img {
  width: 100%;
}
.richtext figure div {
  
  font-size: 0px;
  color: transparent;
}
.richtext figure.wf-richtext-figure-type-image, .richtext figure[data-rt-type="image"] {
  display: table;
}
.richtext figure.wf-richtext-figure-type-image > div, .richtext figure[data-rt-type="image"] > div {
  display: inline-block;
}
.richtext figure.wf-richtext-figure-type-image > figcaption, .richtext figure[data-rt-type="image"] > figcaption {
  display: table-caption;
  caption-side: bottom;
}
.richtext figure[data-rt-type="video"] {
  width: 60%;
  height: 0;
}
.richtext figure[data-rt-type="video"] iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.richtext figure[data-rt-type="video"] > div {
  width: 100%;
}
.richtext figure.wf-richtext-align-fullwidth {
  width: 100%;
  max-width: 100%;
  text-align: center;
  clear: both;
  display: block;
  margin-right: auto;
  margin-left: auto;
}
.richtext figure.wf-richtext-align-fullwidth > div {
  display: inline-block;
  
  padding-bottom: inherit;
}
.richtext figure.wf-richtext-align-fullwidth > figcaption {
  display: block;
}
.tabset {
  position: relative;
}
.tabset:before, .tabset:after {
  content: " ";
  display: table;
  grid-column-start: 1;
  grid-row-start: 1;
  grid-column-end: 2;
  grid-row-end: 2;
}
.tabset:after {
  clear: both;
}
.tabset-menu {
  position: relative;
}
.tabset-link {
  position: relative;
  display: inline-block;
  vertical-align: top;
  text-decoration: none;
  padding: 9px 30px;
  text-align: left;
  cursor: pointer;
  color: #222222;
  background-color: #dddddd;
}
.tabset-link[aria-current="page"], .tabset-link.is-active {
  background-color: #C8C8C8;
}
.tabset-link:focus {
  outline: 0;
}
.tabset-content {
  position: relative;
  display: block;
  overflow: hidden;
}
.tabset-pane {
  position: relative;
  display: none;
}
.tabset-pane.is-active {
  display: block;
}
@media screen and (max-width: 479px) {
  .tabset-link {
    display: block;
  }
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.wf-condition-invisible {
  display: none !important;
}
/* ======================================================================
   2b. Widget geometry the dropped rules used to provide
   ====================================================================== */
/* ======================================================================
   Widget geometry the dropped framework rules used to provide.

   build_css drops every rule in webflow.css whose only job was to be driven
   by the runtime -- the nav overlay, the dropdown open states, the slider
   track, the background-video box. Most of them were behaviour. Some of them
   were LAYOUT, and this file is those, re-keyed onto the class names this
   design actually uses.

   It is emitted BETWEEN the framework sheet and the design sheet, in the same
   place webflow.css sat, so every rule here is still overridden by the design
   exactly as its original was. That ordering is the whole reason these are
   plain single-class selectors rather than `:where()`: they score the same
   (0, 1, 0) as the framework rules they replace, and losing a tie to the design
   sheet is the correct outcome.

   Everything here is transcribed, not invented. Each block names the rule it
   came from.
   ====================================================================== */

/* ---------------------------------------------------------------- navbar
   `.w-nav`, `.w-nav-brand`, `.w-nav-menu`, `.w-nav-button` and the
   `data-collapse="medium"` pair.

   The design gives `.navbar` its own `position: absolute; inset: 0 0 auto`
   and a transparent background, so only the stacking context is needed from
   the framework -- but `.nav-menu-wrap` has NO desktop rule of its own, and
   without `float: right` the menu drops below the brand on every page. */
.navbar {
  position: relative;
  z-index: 1000;
}
/* `.w-nav:before/:after`. A clearfix, and it is load-bearing here because
   `.nav-menu-wrap` really is floated on desktop -- so without it the header
   collapses to the height of the brand. Kept as `display: table` rather than
   modernised: `.navbar` is not a flex container in this design, so the two
   boxes stay zero-height and nothing moves. */
.navbar:before, .navbar:after {
  content: " ";
  display: table;
  grid-column-start: 1;
  grid-row-start: 1;
  grid-column-end: 2;
  grid-row-end: 2;
}
.navbar:after {
  clear: both;
}
/* `.w-nav-brand`. The design makes it `display: flex`, which is why the float
   never shows -- but it is a child of `.navbar-wrapper`, which IS flex, so
   the float is ignored there anyway. Kept for the positioned children. */
.navbar-brand-wrap {
  position: relative;
  text-decoration: none;
}
/* `.w-nav-menu` */
.nav-menu-wrap {
  position: relative;
  float: right;
}
/* `.w-nav-link` */
.nav-link {
  position: relative;
  display: inline-block;
  vertical-align: top;
  text-decoration: none;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
}
/* `.w-nav-button`, plus the `data-collapse="medium"` pair below. The button
   is hidden above 992px and the menu is hidden below it; this design collapses
   at `medium`, so 991px is the switch. */
.menu-button {
  position: relative;
  float: right;
  padding: 18px;
  font-size: 24px;
  display: none;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  user-select: none;
  /* the export's own <div> became a <button>; these three undo the UA form
     control so the design's rules land on the same box they used to */
  background: none;
  border: 0;
  color: inherit;
}
@media screen and (max-width: 991px) {
  /* `.w-nav[data-collapse='medium'] .w-nav-menu` / `.w-nav-button`. The
     attribute is gone with the runtime, so the pair is keyed on the header
     instead -- one class less specific than the original, which is why the
     design's own `.nav-menu-wrap` block at this width still wins. */
  .navbar .nav-menu-wrap {
    display: none;
  }
  .navbar .menu-button {
    display: block;
  }
  /* `[data-nav-menu-open]`. The one runtime rule that has to survive as a
     rule rather than a class: it is what turns the menu into the full-width
     panel below the header. Everything the framework set for LOOKS (a grey
     background, centred text) is dropped -- the design paints this panel
     white and left-aligns it -- and only the box remains.

     Keyed on the button's own `aria-expanded`, so the panel's open state and
     the control's reported state cannot disagree. */
  .navbar .menu-button[aria-expanded="true"] + .nav-menu-wrap, .navbar .nav-menu-wrap[data-nav-open] {
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    overflow: visible;
    min-width: 200px;
  }
}
@media screen and (max-width: 767px) {
  /* `.w-nav-brand` at small */
  .navbar-brand-wrap {
    padding-left: 10px;
  }
}
/* -------------------------------------------------------------- dropdown
   `.w-dropdown` and friends. TWO widgets are built on it here: the navbar's
   "Pages" mega-menu and every FAQ row, so each rule is stated for both.

   `.w-dropdown-list { display: none }` is the important one. It is the closed
   state of both, and it is the reason the FAQ answers are not all visible at
   once. */
.nav-dropdown, .faq-single-wrap {
  display: inline-block;
  position: relative;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  z-index: 900;
}
/* `.w-dropdown-btn, .w-dropdown-toggle, .w-dropdown-link` and
   `.w-dropdown-toggle`. The export's toggles are now <button>s, so the UA
   form-control reset has to be undone here: a <button> does not inherit
   `font`, and `<a>`-to-<button>` also loses `letter-spacing`, `word-spacing` and `text-transform`, which `font: inherit` does NOT
   restore. Stating all four is what keeps the type identical. */
.dropdown-toggle, .faq-question-wrap {
  position: relative;
  vertical-align: top;
  text-decoration: none;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  user-select: none;
  display: inline-block;
  cursor: pointer;
  background: none;
  border: 0;
  font: inherit;
  letter-spacing: inherit;
  word-spacing: inherit;
  text-transform: inherit;
  color: inherit;
}
/* `.w-dropdown-btn, .w-dropdown-toggle, .w-dropdown-link`'s padding, and
   `.w-dropdown-toggle`'s own `padding-right: 40px`. The design overrides both
   at every width for the FAQ row (`padding: 0`) but NOT for the navbar
   toggle above 992px, where the 40px gutter is what the chevron sits in. */
.dropdown-toggle {
  padding: 20px 40px 20px 20px;
  white-space: nowrap;
}
/* `.w-icon-dropdown-toggle`. The glyph was an icon-font character in an empty
   <div>; rebuild_dropdown draws a real <svg> in its place, and this is the box
   that <svg> sits in. */
.dropdown-chevron {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto 20px auto 0;
  width: 1em;
  height: 1em;
  transition: transform .3s ease;
}
/* `.w-dropdown-list` */
.dropdown-navigation, .faq-navigation {
  position: absolute;
  display: none;
  min-width: 100%;
}
/* `.w-dropdown-link` */
.dropdown-link {
  position: relative;
  vertical-align: top;
  padding: 10px 20px;
  display: block;
  text-decoration: none;
  text-align: left;
  white-space: nowrap;
}
/* ---------------------------------------------------------------- slider
   `.w-slider`, `.w-slider-mask`, `.w-slide` and the two arrows, for all three
   carousels. The design overrides `height` on each root (`auto`, `auto`, `116px`) but nothing else, so the track geometry all comes from here.

   `.w-slide { display: inline-block; width: 100% }` inside a
   `white-space: nowrap` mask is how the whole track is one line of boxes --
   drop it and every slide stacks. */
.slider, .testimonial-slider, .about-slider {
  position: relative;
  height: 300px;
  text-align: center;
  clear: both;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.mask, .testimonial-mask, .about-mask {
  position: relative;
  display: block;
  overflow: hidden;
  z-index: 1;
  left: 0;
  right: 0;
  height: 100%;
  white-space: nowrap;
}
.innovator-slide, .testimonial-slide, .about-slide-wrap {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 100%;
  height: 100%;
  white-space: normal;
  text-align: left;
}
/* `.w-slider-nav`. The design turns this into a centred flex row with its own
   inset, so only the layer and the tap highlight are left. */
.slider-nav {
  position: absolute;
  z-index: 2;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
/* `.w-slider-arrow-left` / `-right`. The design sizes the button (44px round, with its own hover) and then nudges it -- `.is-left { margin-top: 40px }`, `.is-right { margin-top: -40px; left: 54px }`. Those two offsets only mean
   anything against the absolute box below: an earlier conversion dropped this
   rule and threw the slider arrow across the page. */
.innovator-arrow {
  position: absolute;
  width: 80px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  cursor: pointer;
  overflow: hidden;
  user-select: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  /* the export's <div>s became <button>s */
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
}
.innovator-arrow.is-left {
  z-index: 3;
  right: auto;
}
.innovator-arrow.is-right {
  z-index: 4;
  left: auto;
}
/* ------------------------------------------------------ background video
   `.w-background-video` and `.w-background-video > video`.

   The design gives `.planet-video` its size; the containing block, the
   overflow clip and the whole `object-fit` cover block for the <video> come
   from here. Without the second rule the video is an inline element at its
   intrinsic size sitting on top of the layout. */
.planet-video {
  position: relative;
  overflow: hidden;
  color: #fff;
}
.planet-video > video {
  background-size: cover;
  background-position: 50% 50%;
  position: absolute;
  margin: auto;
  width: 100%;
  height: 100%;
  right: -100%;
  bottom: -100%;
  top: -100%;
  left: -100%;
  object-fit: cover;
  z-index: -100;
}
.planet-video > video::-webkit-media-controls-start-playback-button {
  display: none !important;
  -webkit-appearance: none;
}
/* `.w-background-video--control` and its `[hidden]` child. The control is the
   play/pause button; `[hidden]` is how the pair of glyphs inside it take
   turns, and without the `!important` the button's own `display: flex` on the
   span would beat the attribute. */
.wf-background-video--control {
  position: absolute;
  bottom: 1em;
  right: 1em;
  background-color: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
  color: #fff;
}
.wf-background-video--control > [hidden] {
  display: none !important;
}
/* The still frame under the video. It was inside a `<noscript>` in the export, which meant it could never be shown to a reader who HAS scripting and has
   asked for reduced motion -- the one reader it exists for. Unwrapped by
   transform.py, it is hidden by default and revealed by components.hand.css
   when the video is paused for motion sensitivity. */
[data-video-still] {
  display: none;
}
/* ======================================================================
   3. GreenAxis design
   ====================================================================== */
:root {
  --_font-family---primary-font: Urbanist, sans-serif;
  --color--medium-gray: #656565;
  --_typography---paragraph--font-size-xs: 16px;
  --_line-height---line-height-l: 140%;
  --_font-weight---regular: 400;
  --_typography---letter-spacing--default-spacing: -.02em;
  --_spacing---margin-padding--spacing-none: 0px;
  --color--near-black: #0e0e0e;
  --_typography---heading--font-size-5xl: 80px;
  --_line-height---line-height-s: 100%;
  --_font-weight---medium: 500;
  --_typography---letter-spacing--letter-spacing-5xl: -1.6px;
  --_typography---heading--font-size-4xl: 64px;
  --_typography---letter-spacing--letter-spacing-4xl: -1.28px;
  --_typography---heading--font-size-3xl: 48px;
  --_line-height---line-height-m: 120%;
  --_typography---letter-spacing--letter-spacing-3xl: -.96px;
  --_typography---heading--font-size-2xl: 40px;
  --_typography---letter-spacing--letter-spacing-2xl: -.8px;
  --_typography---heading--font-size-xl: 32px;
  --_font-weight---semi-bold: 600;
  --_typography---letter-spacing--letter-spacing-xl: -.64px;
  --_typography---heading--font-size-l: 28px;
  --_typography---letter-spacing--letter-spacing-l: -.56px;
  --_typography---letter-spacing--letter-spacing-xs: -.32px;
  --_spacing---margin-padding--spacing-3xl: 100px;
  --_spacing---margin-padding--spacing-l: 60px;
  --color--white: white;
  --_spacing---margin-padding--spacing-6xl: 168px;
  --_spacing---margin-padding--spacing-7xl: 208px;
  --_spacing---margin-padding--spacing-4xl: 120px;
  --_spacing---margin-padding--spacing-2xl: 80px;
  --_spacing---margin-padding--spacing-5xl: 140px;
  --_typography---paragraph--font-size-s: 20px;
  --_typography---letter-spacing--letter-spacing-s: -.4px;
  --color--light-gray: #ebebeb;
  --color--primary-yellow: #fff017;
  --color--overlay-gray: #0e0e0e1a;
  --color--transparent: transparent;
  --_spacing---margin-padding--spacing-s: 30px;
  --red: #d11313;
  --color--charcoal-gray: #262626;
  --_border-radius---circle-round: 50%;
  --_typography---paragraph--font-size-m: 24px;
  --color--very-light-gray: #e8e8e8;
  --color--off-white: #fafafa;
  --color--dark-gray: #979797;
  --_line-height---line-height-x\<deleted\|variable-9b5a9b39-beaa-b4b2-a523-92f4f57b0f21\>: 150%;
  --_border-radius---border-radius-s: 12px;
  --_typography---letter-spacing--letter-spacing-m: -.48px;
  --color--black: #000;
  --_border-radius---border-radius-xl: 20px;
  --_border-radius---border-radius-m: 14px;
  --_spacing---margin-padding--spacing-m: 40px;
  --_border-radius---border-radius-l: 16px;
  --_border-radius---border-radius-2xl: 24px;
  --color--fill-color: #f6f6f6;
  --color--line-gray: #d7d7d7;
  --_spacing---margin-padding--spacing-xl: 64px;
  --_border-radius---border-radius-xs: 10px;
  --_font-weight---bold: 700;
  --color--neutral-gray: #525252;
  --_spacing---margin-padding--spacing-xs: 24px;
  --_border-radius---border-radius-3xl: 30px;
  --_typography---heading--display-text: 120px;
  --_typography---paragraph--font-size-xxs: 14px;
}
.wf-layout-blockcontainer {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
.wf-commerce-commercecartwrapper {
  display: inline-block;
  position: relative;
}
.wf-commerce-commercecartopenlink {
  color: #fff;
  cursor: pointer;
  appearance: none;
  background-color: #3898ec;
  border-width: 0;
  border-radius: 0;
  align-items: center;
  padding: 9px 15px;
  text-decoration: none;
  display: flex;
}
.wf-commerce-commercecartopenlinkcount {
  color: #3898ec;
  text-align: center;
  background-color: #fff;
  border-radius: 9px;
  min-width: 18px;
  height: 18px;
  margin-left: 8px;
  padding-left: 6px;
  padding-right: 6px;
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
  display: inline-block;
}
.wf-commerce-commercecartcontainerwrapper {
  z-index: 1001;
  background-color: #000c;
  position: fixed;
  inset: 0;
}
.wf-commerce-commercecartcontainerwrapper--cartType-modal {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}
.wf-commerce-commercecartcontainer {
  background-color: #fff;
  flex-direction: column;
  width: 100%;
  min-width: 320px;
  max-width: 480px;
  display: flex;
  overflow: auto;
  box-shadow: 0 5px 25px #00000040;
}
.wf-commerce-commercecartheader {
  border-bottom: 1px solid #e6e6e6;
  flex: none;
  justify-content: space-between;
  align-items: center;
  padding: 16px 24px;
  display: flex;
  position: relative;
}
.wf-commerce-commercecartheading {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 0;
}
.wf-commerce-commercecartcloselink {
  width: 16px;
  height: 16px;
}
.wf-commerce-commercecartformwrapper {
  flex-direction: column;
  flex: 1;
  display: flex;
}
.wf-commerce-commercecartform {
  flex-direction: column;
  flex: 1;
  justify-content: flex-start;
  display: flex;
}
.wf-commerce-commercecartlist {
  -webkit-overflow-scrolling: touch;
  flex: 1;
  padding: 12px 24px;
  overflow: auto;
}
.wf-commerce-commercecartitem {
  align-items: flex-start;
  padding-top: 12px;
  padding-bottom: 12px;
  display: flex;
}
.wf-commerce-commercecartiteminfo {
  flex-direction: column;
  flex: 1;
  margin-left: 16px;
  margin-right: 16px;
  display: flex;
}
.wf-commerce-commercecartitemimage {
  width: 60px;
  height: 0%;
}
.wf-commerce-commercecartproductname {
  font-weight: 700;
}
.wf-commerce-commercecartoptionlist {
  margin-bottom: 0;
  padding-left: 0;
  text-decoration: none;
  list-style-type: none;
}
.wf-commerce-commercecartquantity {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 60px;
  height: 38px;
  margin-bottom: 10px;
  padding: 8px 6px 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecartquantity::placeholder {
  color: #999;
}
.wf-commerce-commercecartquantity:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecartfooter {
  border-top: 1px solid #e6e6e6;
  flex-direction: column;
  flex: none;
  padding: 16px 24px 24px;
  display: flex;
}
.wf-commerce-commercecartlineitem {
  flex: none;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 16px;
  display: flex;
}
.wf-commerce-commercecartordervalue {
  font-weight: 700;
}
.wf-commerce-commercecartcheckoutbutton {
  color: #fff;
  cursor: pointer;
  appearance: none;
  text-align: center;
  background-color: #3898ec;
  border-width: 0;
  border-radius: 2px;
  align-items: center;
  padding: 9px 15px;
  text-decoration: none;
  display: block;
}
.wf-commerce-commercecartemptystate {
  flex: 1;
  justify-content: center;
  align-items: center;
  padding-top: 100px;
  padding-bottom: 100px;
  display: flex;
}
.wf-commerce-commercecarterrorstate {
  background-color: #ffdede;
  flex: none;
  margin: 0 24px 24px;
  padding: 10px;
}
.wf-backgroundvideo-backgroundvideoplaypausebutton:focus-visible {
  outline-offset: 2px;
  border-radius: 50%;
  outline: 2px solid #3b79c3;
}
.wf-commerce-commerceaddtocartform {
  margin: 0 0 15px;
}
.wf-commerce-commerceaddtocartoptionpillgroup {
  margin-bottom: 10px;
  display: flex;
}
.wf-commerce-commerceaddtocartoptionpill {
  color: #000;
  cursor: pointer;
  background-color: #fff;
  border: 1px solid #000;
  margin-right: 10px;
  padding: 8px 15px;
}
.wf-commerce-commerceaddtocartoptionpill.is-selected {
  color: #fff;
  background-color: #000;
}
.wf-commerce-commerceaddtocartoptionpill.is-disabled {
  color: #666;
  cursor: not-allowed;
  background-color: #e6e6e6;
  border-color: #e6e6e6;
  outline-style: none;
}
.wf-commerce-commerceaddtocartquantityinput {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 60px;
  height: 38px;
  margin-bottom: 10px;
  padding: 8px 6px 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commerceaddtocartquantityinput::placeholder {
  color: #999;
}
.wf-commerce-commerceaddtocartquantityinput:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commerceaddtocartbutton {
  color: #fff;
  cursor: pointer;
  appearance: none;
  background-color: #3898ec;
  border-width: 0;
  border-radius: 0;
  align-items: center;
  padding: 9px 15px;
  text-decoration: none;
  display: flex;
}
.wf-commerce-commerceaddtocartbutton.is-disabled {
  color: #666;
  cursor: not-allowed;
  background-color: #e6e6e6;
  border-color: #e6e6e6;
  outline-style: none;
}
.wf-commerce-commerceaddtocartoutofstock {
  background-color: #ddd;
  margin-top: 10px;
  padding: 10px;
}
.wf-commerce-commerceaddtocarterror {
  background-color: #ffdede;
  margin-top: 10px;
  padding: 10px;
}
.wf-commerce-commercecheckoutformcontainer {
  background-color: #f5f5f5;
  width: 100%;
  min-height: 100vh;
  padding: 20px;
}
.wf-commerce-commercelayoutmain {
  flex: 0 800px;
  margin-right: 20px;
}
.wf-commerce-commercecheckoutcustomerinfowrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutblockheader {
  background-color: #fff;
  border: 1px solid #e6e6e6;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 20px;
  display: flex;
}
.wf-commerce-commercecheckoutblockcontent {
  background-color: #fff;
  border-bottom: 1px solid #e6e6e6;
  border-left: 1px solid #e6e6e6;
  border-right: 1px solid #e6e6e6;
  padding: 20px;
}
.wf-commerce-commercecheckoutlabel {
  margin-bottom: 8px;
}
.wf-commerce-commercecheckoutemailinput {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 0;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutemailinput::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutemailinput:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingaddresswrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutshippingfullname {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingfullname::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingfullname:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingstreetaddress {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingstreetaddress::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingstreetaddress:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingstreetaddressoptional {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingstreetaddressoptional::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingstreetaddressoptional:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutrow {
  margin-left: -8px;
  margin-right: -8px;
  display: flex;
}
.wf-commerce-commercecheckoutcolumn {
  flex: 1;
  padding-left: 8px;
  padding-right: 8px;
}
.wf-commerce-commercecheckoutshippingcity {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingcity::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingcity:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingstateprovince {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingstateprovince::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingstateprovince:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingzippostalcode {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingzippostalcode::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingzippostalcode:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingcountryselector {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 0;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingcountryselector::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingcountryselector:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingmethodswrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutshippingmethodslist {
  border-left: 1px solid #e6e6e6;
  border-right: 1px solid #e6e6e6;
}
.wf-commerce-commercecheckoutshippingmethoditem {
  background-color: #fff;
  border-bottom: 1px solid #e6e6e6;
  flex-direction: row;
  align-items: baseline;
  margin-bottom: 0;
  padding: 16px;
  font-weight: 400;
  display: flex;
}
.wf-commerce-commercecheckoutshippingmethoddescriptionblock {
  flex-direction: column;
  flex-grow: 1;
  margin-left: 12px;
  margin-right: 12px;
  display: flex;
}
.wf-commerce-commerceboldtextblock {
  font-weight: 700;
}
.wf-commerce-commercecheckoutshippingmethodsemptystate {
  text-align: center;
  background-color: #fff;
  border-bottom: 1px solid #e6e6e6;
  border-left: 1px solid #e6e6e6;
  border-right: 1px solid #e6e6e6;
  padding: 64px 16px;
}
.wf-commerce-commercecheckoutpaymentinfowrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutcardnumber {
  appearance: none;
  cursor: text;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutcardnumber::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutcardnumber:focus, .wf-commerce-commercecheckoutcardnumber.-wfp-focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutcardexpirationdate {
  appearance: none;
  cursor: text;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutcardexpirationdate::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutcardexpirationdate:focus, .wf-commerce-commercecheckoutcardexpirationdate.-wfp-focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutcardsecuritycode {
  appearance: none;
  cursor: text;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutcardsecuritycode::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutcardsecuritycode:focus, .wf-commerce-commercecheckoutcardsecuritycode.-wfp-focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingaddresstogglewrapper {
  flex-direction: row;
  display: flex;
}
.wf-commerce-commercecheckoutbillingaddresstogglecheckbox {
  margin-top: 4px;
}
.wf-commerce-commercecheckoutbillingaddresstogglelabel {
  margin-left: 8px;
  font-weight: 400;
}
.wf-commerce-commercecheckoutbillingaddresswrapper {
  margin-top: 16px;
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutbillingfullname {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingfullname::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingfullname:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingstreetaddress {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingstreetaddress::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingstreetaddress:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingstreetaddressoptional {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingstreetaddressoptional::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingstreetaddressoptional:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingcity {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingcity::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingcity:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingstateprovince {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingstateprovince::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingstateprovince:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingzippostalcode {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingzippostalcode::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingzippostalcode:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingcountryselector {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 0;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingcountryselector::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingcountryselector:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutorderitemswrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutsummaryblockheader {
  background-color: #fff;
  border: 1px solid #e6e6e6;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 20px;
  display: flex;
}
.wf-commerce-commercecheckoutorderitemslist {
  margin-bottom: -20px;
}
.wf-commerce-commercecheckoutorderitem {
  margin-bottom: 20px;
  display: flex;
}
.wf-commerce-commercecheckoutorderitemdescriptionwrapper {
  flex-grow: 1;
  margin-left: 16px;
  margin-right: 16px;
}
.wf-commerce-commercecheckoutorderitemquantitywrapper {
  white-space: pre-wrap;
  display: flex;
}
.wf-commerce-commercecheckoutorderitemoptionlist {
  margin-bottom: 0;
  padding-left: 0;
  text-decoration: none;
  list-style-type: none;
}
.wf-commerce-commercelayoutsidebar {
  flex: 0 0 320px;
  position: sticky;
  top: 20px;
}
.wf-commerce-commercecheckoutordersummarywrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutsummarylineitem {
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 8px;
  display: flex;
}
.wf-commerce-commercecheckoutsummarytotal {
  font-weight: 700;
}
.wf-commerce-commercecheckoutplaceorderbutton {
  color: #fff;
  cursor: pointer;
  appearance: none;
  text-align: center;
  background-color: #3898ec;
  border-width: 0;
  border-radius: 3px;
  align-items: center;
  margin-bottom: 20px;
  padding: 9px 15px;
  text-decoration: none;
  display: block;
}
.wf-commerce-commercecheckouterrorstate {
  background-color: #ffdede;
  margin-top: 16px;
  margin-bottom: 16px;
  padding: 10px 16px;
}
.wf-commerce-commercepaypalcheckoutformcontainer {
  background-color: #f5f5f5;
  width: 100%;
  min-height: 100vh;
  padding: 20px;
}
.wf-commerce-commercecheckoutcustomerinfosummarywrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutsummaryitem, .wf-commerce-commercecheckoutsummarylabel {
  margin-bottom: 8px;
}
.wf-commerce-commercecheckoutsummaryflexboxdiv {
  flex-direction: row;
  justify-content: flex-start;
  display: flex;
}
.wf-commerce-commercecheckoutsummarytextspacingondiv {
  margin-right: .33em;
}
.wf-commerce-commercecheckoutpaymentsummarywrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercepaypalcheckouterrorstate {
  background-color: #ffdede;
  margin-top: 16px;
  margin-bottom: 16px;
  padding: 10px 16px;
}
.wf-commerce-commerceorderconfirmationcontainer {
  background-color: #f5f5f5;
  width: 100%;
  min-height: 100vh;
  padding: 20px;
}
.wf-commerce-commercecheckoutshippingsummarywrapper {
  margin-bottom: 20px;
}
@media screen and (max-width: 991px) {
  .wf-layout-blockcontainer {
    max-width: 728px;
  }
}
@media screen and (max-width: 767px) {
  .wf-layout-blockcontainer {
    max-width: none;
  }
  .wf-commerce-commercelayoutmain {
    flex-basis: auto;
    margin-right: 0;
  }
  .wf-commerce-commercelayoutsidebar {
    flex-basis: auto;
  }
}
@media screen and (max-width: 479px) {
  .wf-commerce-commercecartcontainerwrapper--cartType-modal {
    flex-direction: row;
    justify-content: center;
    align-items: stretch;
  }
  .wf-commerce-commercecartquantity, .wf-commerce-commerceaddtocartquantityinput, .wf-commerce-commercecheckoutemailinput, .wf-commerce-commercecheckoutshippingfullname, .wf-commerce-commercecheckoutshippingstreetaddress, .wf-commerce-commercecheckoutshippingstreetaddressoptional {
    font-size: 16px;
  }
  .wf-commerce-commercecheckoutrow {
    flex-direction: column;
  }
  .wf-commerce-commercecheckoutshippingcity, .wf-commerce-commercecheckoutshippingstateprovince, .wf-commerce-commercecheckoutshippingzippostalcode, .wf-commerce-commercecheckoutshippingcountryselector, .wf-commerce-commercecheckoutcardnumber, .wf-commerce-commercecheckoutcardexpirationdate, .wf-commerce-commercecheckoutcardsecuritycode, .wf-commerce-commercecheckoutbillingfullname, .wf-commerce-commercecheckoutbillingstreetaddress, .wf-commerce-commercecheckoutbillingstreetaddressoptional, .wf-commerce-commercecheckoutbillingcity, .wf-commerce-commercecheckoutbillingstateprovince, .wf-commerce-commercecheckoutbillingzippostalcode, .wf-commerce-commercecheckoutbillingcountryselector {
    font-size: 16px;
  }
}
body {
  font-family: var(--_font-family---primary-font);
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  --_typography---paragraph--font-size-xs: 16px;
  --_typography---letter-spacing--default-spacing: -.02em;
  --_typography---heading--font-size-5xl: 80px;
  --_typography---letter-spacing--letter-spacing-5xl: -1.6px;
  --_typography---heading--font-size-4xl: 64px;
  --_typography---letter-spacing--letter-spacing-4xl: -1.28px;
  --_typography---heading--font-size-3xl: 48px;
  --_typography---letter-spacing--letter-spacing-3xl: -.96px;
  --_typography---heading--font-size-2xl: 40px;
  --_typography---letter-spacing--letter-spacing-2xl: -.8px;
  --_typography---heading--font-size-xl: 32px;
  --_typography---letter-spacing--letter-spacing-xl: -.64px;
  --_typography---heading--font-size-l: 28px;
  --_typography---letter-spacing--letter-spacing-l: -.56px;
  --_typography---letter-spacing--letter-spacing-xs: -.32px;
  --_typography---paragraph--font-size-s: 20px;
  --_typography---letter-spacing--letter-spacing-s: -.4px;
  --_typography---paragraph--font-size-m: 24px;
  --_typography---letter-spacing--letter-spacing-m: -.48px;
  --_typography---heading--display-text: 120px;
  --_typography---paragraph--font-size-xxs: 14px;
  --_spacing---margin-padding--spacing-none: 0px;
  --_spacing---margin-padding--spacing-3xl: 100px;
  --_spacing---margin-padding--spacing-l: 60px;
  --_spacing---margin-padding--spacing-6xl: 168px;
  --_spacing---margin-padding--spacing-7xl: 208px;
  --_spacing---margin-padding--spacing-4xl: 120px;
  --_spacing---margin-padding--spacing-2xl: 80px;
  --_spacing---margin-padding--spacing-5xl: 140px;
  --_spacing---margin-padding--spacing-s: 30px;
  --_spacing---margin-padding--spacing-m: 40px;
  --_spacing---margin-padding--spacing-xl: 64px;
  --_spacing---margin-padding--spacing-xs: 24px;
  --_border-radius---circle-round: 50%;
  --_border-radius---border-radius-s: 12px;
  --_border-radius---border-radius-xl: 20px;
  --_border-radius---border-radius-m: 14px;
  --_border-radius---border-radius-l: 16px;
  --_border-radius---border-radius-2xl: 24px;
  --_border-radius---border-radius-xs: 10px;
  --_border-radius---border-radius-3xl: 30px;
}
h1:where(:not([class*="heading-scale-"])), :where(.heading-scale-1) {
  margin-top: var(--_spacing---margin-padding--spacing-none);
  margin-bottom: var(--_spacing---margin-padding--spacing-none);
  font-family: var(--_font-family---primary-font);
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-5xl);
  line-height: var(--_line-height---line-height-s);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-5xl);
}
h2:where(:not([class*="heading-scale-"])), :where(.heading-scale-2) {
  margin-top: var(--_spacing---margin-padding--spacing-none);
  margin-bottom: var(--_spacing---margin-padding--spacing-none);
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-4xl);
  line-height: var(--_line-height---line-height-s);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-4xl);
}
h3:where(:not([class*="heading-scale-"])), :where(.heading-scale-3) {
  margin-top: var(--_spacing---margin-padding--spacing-none);
  margin-bottom: var(--_spacing---margin-padding--spacing-none);
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-3xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-3xl);
}
h4:where(:not([class*="heading-scale-"])), :where(.heading-scale-4) {
  margin-top: var(--_spacing---margin-padding--spacing-none);
  margin-bottom: var(--_spacing---margin-padding--spacing-none);
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-2xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-2xl);
}
h5:where(:not([class*="heading-scale-"])), :where(.heading-scale-5) {
  margin-top: var(--_spacing---margin-padding--spacing-none);
  margin-bottom: var(--_spacing---margin-padding--spacing-none);
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xl);
}
h6:where(:not([class*="heading-scale-"])), :where(.heading-scale-6) {
  margin-top: var(--_spacing---margin-padding--spacing-none);
  margin-bottom: var(--_spacing---margin-padding--spacing-none);
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-l);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-l);
}
p {
  margin-bottom: var(--_spacing---margin-padding--spacing-none);
  font-family: var(--_font-family---primary-font);
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  text-decoration: none;
}
a {
  text-decoration: none;
  display: inline-block;
}
ul {
  margin-top: 0;
  margin-bottom: var(--_spacing---margin-padding--spacing-none);
}
ol {
  margin-top: 0;
  margin-bottom: 10px;
  padding-left: 40px;
}
img {
  object-fit: cover;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
}
strong {
  font-weight: bold;
}
figure {
  margin-bottom: 10px;
}
.two-section-wrap {
  z-index: 1;
  background-image: url('../images/Footer-Background.webp');
  background-position: 50% 0;
  background-size: cover;
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
  overflow: hidden;
}
.two-section-wrap.utility {
  background-image: none;
}
.section {
  padding-top: var(--_spacing---margin-padding--spacing-3xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
}
.section.call-to-action {
  z-index: 2;
  padding-top: 220px;
  padding-bottom: 220px;
  position: relative;
}
.section.footer {
  z-index: 2;
  padding-top: var(--_spacing---margin-padding--spacing-l);
  padding-bottom: var(--_spacing---margin-padding--spacing-none);
  background-color: var(--color--white);
  position: relative;
}
.section.utility {
  padding-top: var(--_spacing---margin-padding--spacing-6xl);
}
.section._404 {
  padding-top: var(--_spacing---margin-padding--spacing-7xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-4xl);
}
.section.password {
  padding-top: var(--_spacing---margin-padding--spacing-6xl);
  margin-bottom: 0;
  padding-bottom: 170px;
}
.section.changelog {
  padding-top: var(--_spacing---margin-padding--spacing-6xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-4xl);
}
.section.inner {
  padding-top: var(--_spacing---margin-padding--spacing-6xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
}
.section.faq {
  padding-top: var(--_spacing---margin-padding--spacing-3xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
}
.section.contact {
  padding-top: var(--_spacing---margin-padding--spacing-6xl);
}
.section.service-top {
  padding-top: var(--_spacing---margin-padding--spacing-7xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-2xl);
}
.section.services {
  padding-top: var(--_spacing---margin-padding--spacing-3xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
  background-color: var(--color--near-black);
}
.section.pricing-compare {
  padding-top: var(--_spacing---margin-padding--spacing-3xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
}
.section.pricing {
  padding-top: var(--_spacing---margin-padding--spacing-6xl);
}
.section.benefits {
  padding-top: var(--_spacing---margin-padding--spacing-3xl);
}
.section.career-top {
  padding-top: var(--_spacing---margin-padding--spacing-6xl);
}
.section.about-hero {
  background-color: var(--color--near-black);
  background-image: url('../images/About-Banner-Image.webp');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 228px;
  padding-bottom: 212px;
}
.section.team {
  padding-bottom: var(--_spacing---margin-padding--spacing-5xl);
}
.section.about {
  padding-top: var(--_spacing---margin-padding--spacing-2xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
}
.section.hero {
  padding-top: var(--_spacing---margin-padding--spacing-none);
  padding-bottom: var(--_spacing---margin-padding--spacing-none);
  background-image: url('../images/Hero-Background-1-1.webp');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: contain;
}
.section.choice {
  padding-top: var(--_spacing---margin-padding--spacing-3xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
  overflow: hidden;
}
.section.process {
  padding-top: var(--_spacing---margin-padding--spacing-3xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
  background-color: var(--color--near-black);
}
.section.testimonial {
  padding-top: 0;
  overflow: hidden;
}
.section.blog {
  padding-top: var(--_spacing---margin-padding--spacing-3xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
}
.section.checkout {
  padding-top: var(--_spacing---margin-padding--spacing-6xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-4xl);
}
.section.pricing-ctg {
  padding-top: var(--_spacing---margin-padding--spacing-7xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-5xl);
}
.section.more-blog {
  padding-top: var(--_spacing---margin-padding--spacing-none);
}
.section.single-news {
  padding-top: var(--_spacing---margin-padding--spacing-6xl);
}
.section.is-about {
  padding-top: var(--_spacing---margin-padding--spacing-3xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
  background-color: var(--color--white);
}
.section.stats {
  padding-top: var(--_spacing---margin-padding--spacing-2xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-2xl);
}
.section.is-investor {
  padding-top: var(--_spacing---margin-padding--spacing-3xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
  position: relative;
  overflow: hidden;
}
.section.is-value {
  padding-top: var(--_spacing---margin-padding--spacing-3xl);
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
}
.section.is-nature {
  background-color: var(--color--near-black);
}
.container {
  width: 100%;
  max-width: 1310px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
}
.cta-wrap {
  grid-column-gap: 64px;
  grid-row-gap: 64px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}
.cta-title {
  color: var(--color--white);
  font-size: var(--_typography---heading--font-size-5xl);
  line-height: var(--_line-height---line-height-s);
  text-align: center;
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-5xl);
}
.primary-button {
  z-index: 1;
  grid-column-gap: 58px;
  grid-row-gap: 58px;
  background-color: var(--color--white);
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  border-radius: 50px;
  justify-content: space-between;
  align-items: center;
  padding: 10px 10px 10px 24px;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}
.primary-button:where(.primary-button-border) {
  border: 1px solid var(--color--light-gray);
  position: relative;
  overflow: hidden;
}
.primary-button-texts {
  justify-content: center;
  align-items: center;
  padding-right: 3px;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}
.primary-button-texts:where(.primary-button-border) {
  z-index: 2;
  position: relative;
}
.primary-button-text._01 {
  z-index: 1;
  position: relative;
}
.primary-button-text._02 {
  position: absolute;
}
.primary-button-icons {
  background-color: var(--color--primary-yellow);
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  padding: 16px 24px;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}
.primary-button-icons:where(.primary-button-border) {
  z-index: 2;
}
.primary-button-icon {
  max-width: 24px;
  max-height: 24px;
}
.primary-button-icon._02 {
  position: absolute;
}
.copyright-wrap {
  margin-top: var(--_spacing---margin-padding--spacing-l);
  padding-top: 24px;
  padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
  border-top: 1px solid var(--color--overlay-gray);
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.copyright-link {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  transition: color .4s;
}
.copyright-link:hover {
  color: var(--color--medium-gray);
}
.copyright-link.desktop-off {
  display: none;
}
.copyright-text {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.site-link {
  color: var(--color--near-black);
  font-weight: var(--_font-weight---semi-bold);
  text-decoration: underline;
  -webkit-text-decoration-color: var(--color--transparent);
  text-decoration-color: var(--color--transparent);
  transition: text-decoration-color .4s;
}
.site-link:hover {
  -webkit-text-decoration-color: var(--color--near-black);
  text-decoration-color: var(--color--near-black);
}
.footer-wrapper {
  grid-column-gap: var(--_spacing---margin-padding--spacing-s);
  grid-row-gap: var(--_spacing---margin-padding--spacing-s);
  justify-content: space-between;
  align-items: flex-start;
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}
.footer-wrap {
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 735px;
  display: flex;
}
.subscribe-wrap {
  width: 100%;
  max-width: 326px;
}
.subscribe-title {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xl);
}
.subscribe-form-wrap {
  margin-top: 32px;
  margin-bottom: 8px;
}
.subscribe-form {
  justify-content: flex-end;
  align-items: center;
  display: flex;
  position: relative;
}
.success-message {
  background-color: var(--color--primary-yellow);
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  text-align: center;
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 8px;
  padding: 20px;
}
.error-message {
  background-color: var(--red);
  color: var(--color--white);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  text-align: center;
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 8px;
  margin-top: 15px;
  padding: 15px;
}
.subscribe-email {
  border: 1px solid var(--color--overlay-gray);
  background-color: var(--color--white);
  height: auto;
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 0;
  margin-bottom: 0;
  padding: 16px 120px 16px 8px;
}
.subscribe-email:focus {
  border-color: var(--color--charcoal-gray);
}
.subscribe-email::placeholder {
  color: var(--color--medium-gray);
}
.subscribe-button {
  background-color: var(--color--near-black);
  color: var(--color--white);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  padding: 12px 20px;
  transition: color .4s, background-color .4s;
  position: absolute;
  right: 4px;
}
.subscribe-button:hover {
  background-color: var(--color--primary-yellow);
  color: var(--color--near-black);
}
.footer-menu-wrap {
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  max-width: 645px;
  display: grid;
}
.footer-menu-wrap.desktop-off {
  display: none;
}
.footer-single-wrap.mobile-off {
  display: block;
}
.footer-single-wrap.mobile-on {
  display: none;
}
.footer-single-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  margin-bottom: 32px;
}
.footer-link-wrap {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.footer-link {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  transition: transform .4s, color .4s;
}
.footer-link:hover {
  color: var(--color--medium-gray);
  transform: translate(6px);
}
.subscribe-details {
  font-weight: var(--_font-weight---medium);
}
.footer-social-wrap {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.social-link {
  z-index: 1;
  border: 1px solid var(--color--overlay-gray);
  border-radius: var(--_border-radius---circle-round);
  justify-content: center;
  align-items: center;
  width: 56px;
  height: 56px;
  transition: border-color .4s, background-color .4s;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}
.social-link:hover {
  border-color: var(--color--primary-yellow);
  background-color: var(--color--primary-yellow);
}
.social-icon {
  max-width: 24px;
  max-height: 24px;
}
.pages-wrapper._404 {
  background-color: #fafafa;
}
.utility-top-wrap {
  margin-bottom: var(--_spacing---margin-padding--spacing-3xl);
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  display: flex;
}
.utility-top-details {
  max-width: 786px;
}
.utility-top-details.license {
  font-size: var(--_typography---paragraph--font-size-s);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.utility-wrap {
  grid-column-gap: var(--_spacing---margin-padding--spacing-3xl);
  grid-row-gap: var(--_spacing---margin-padding--spacing-3xl);
  flex-flow: column;
  display: flex;
}
.utility-single-wrap.font {
  justify-content: space-between;
  align-items: flex-end;
  display: flex;
}
.utility-title-wrap {
  flex-flow: column;
  margin-bottom: 40px;
  display: flex;
}
.utility-title-wrap.font {
  margin-bottom: 0;
}
.utility-subtitle {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.utility-subtitle-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 12px;
  padding-left: 10px;
  display: inline-flex;
}
.utility-sybtitle-dot {
  background-color: var(--color--medium-gray);
  border-radius: 50%;
  width: 5px;
  height: 5px;
}
.color-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  margin-bottom: 20px;
}
.color-wrap {
  grid-column-gap: 0px;
  grid-row-gap: 30px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.color-single-item {
  justify-content: flex-start;
  align-items: flex-end;
  width: 100%;
  max-width: 100%;
  height: 315px;
  padding: 20px 18px;
  display: flex;
}
.color-single-item._01 {
  background-color: var(--color--primary-yellow);
}
.color-single-item._02 {
  background-color: var(--color--near-black);
}
.color-single-item._03 {
  border: 1px solid var(--color--very-light-gray);
  background-color: var(--color--white);
}
.color-single-item._04 {
  background-color: var(--color--medium-gray);
}
.color-single-item._08 {
  background-color: var(--color--charcoal-gray);
}
.color-single-item._07 {
  background-color: var(--color--light-gray);
}
.color-single-item._06 {
  background-color: var(--color--off-white);
}
.color-single-item._05 {
  background-color: var(--color--dark-gray);
}
.color-code {
  background-color: var(--color--white);
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-x\<deleted\|variable-9b5a9b39-beaa-b4b2-a523-92f4f57b0f21\>);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 40px;
  justify-content: center;
  align-items: center;
  padding: 10px 16px;
  display: inline-flex;
}
.utility-wrapper {
  width: 100%;
  max-width: 1248px;
  margin-left: auto;
  margin-right: auto;
}
.typography-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  display: flex;
}
.typography-ctg-title {
  color: var(--color--near-black);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.typography-ctg-wrap {
  border-radius: var(--_border-radius---border-radius-s);
  background-color: var(--color--white);
  margin-bottom: 24px;
  padding: 24px 28px 24px 18px;
}
.typography-flex-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.typography-single-item {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.typography-size {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---regular);
  letter-spacing: 0;
}
.typography-size._01 {
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.paragrapgh-l {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
}
.paragrapgh-l.medium {
  font-weight: var(--_font-weight---medium);
}
.paragrapgh-m {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.paragrapgh-m.regular {
  font-weight: var(--_font-weight---regular);
}
.paragrapgh-s {
  color: var(--color--black);
  font-size: var(--_typography---paragraph--font-size-xs);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.paragrapgh-s.regular {
  font-weight: var(--_font-weight---regular);
}
.style-button-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.theme-button {
  z-index: 1;
  background-color: var(--color--primary-yellow);
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  padding: 16px 24px;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}
.theme-button:where(.theme-button-small) {
  font-size: var(--_typography---paragraph--font-size-xs);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  padding: 12px 20px;
}
.theme-button:where(.theme-button-404) {
  justify-content: center;
  align-items: center;
  padding-left: 24px;
  padding-right: 24px;
  display: flex;
}
.theme-button:where(.theme-button-apply) {
  padding: 10px 24px;
}
.theme-button:where(.theme-button-black) {
  background-color: var(--color--black);
  color: var(--color--white);
}
.theme-button:where(.theme-button-mobile-hide) {
  padding-top: 13px;
  padding-bottom: 13px;
}
.theme-button.compare {
  background-color: var(--color--near-black);
  color: var(--color--white);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  justify-content: center;
  align-items: center;
  padding: 10px;
  display: flex;
}
.theme-button.career {
  background-color: var(--color--off-white);
  padding: 10px 20px;
}
.theme-button.plan-01 {
  width: 100%;
  max-width: 100%;
  font-size: var(--_typography---paragraph--font-size-xs);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  justify-content: center;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
}
.theme-button.plan-02 {
  background-color: var(--color--near-black);
  color: var(--color--white);
  font-size: var(--_typography---paragraph--font-size-xs);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  justify-content: center;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
  transition: background-color .4s;
  display: flex;
}
.theme-button.plan-02:hover {
  background-color: var(--color--primary-yellow);
}
.theme-button.add-cart {
  width: 100%;
  max-width: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
  transition: color .4s, background-color .4s;
}
.theme-button.add-cart:hover {
  background-color: var(--color--near-black);
  color: var(--color--white);
}
.theme-button.cart {
  width: 100%;
  max-width: 100%;
  transition: color .4s, background-color .4s;
}
.theme-button.cart:hover {
  background-color: var(--color--near-black);
  color: var(--color--white);
}
.theme-button-texts {
  z-index: 2;
  justify-content: center;
  align-items: center;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}
.theme-button-text {
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
}
.theme-button-text._01 {
  z-index: 1;
  position: relative;
}
.theme-button-text._02 {
  position: absolute;
}
.theme-button-text._02.black {
  color: var(--color--near-black);
}
.navbar {
  z-index: 9999;
  background-color: var(--color--transparent);
  padding-top: 32px;
  padding-bottom: 32px;
  position: absolute;
  inset: 0% 0% auto;
}
.navbar-wrapper {
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.navbar-brand-wrap {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 105px;
  padding-left: 0;
  display: flex;
}
.navbar-button-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  justify-content: flex-start;
  align-items: center;
  display: inline-flex;
}
.nav-link-wrap {
  background-color: var(--color--white);
  border-radius: 60px;
  justify-content: center;
  align-items: center;
  padding: 4px;
  display: inline-flex;
}
.nav-link {
  background-color: var(--color--white);
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 50px;
  padding: 8px 20px;
  transition: color .4s, background-color .4s;
}
.nav-link:hover, .nav-link[aria-current="page"], .nav-link.is-active {
  background-color: var(--color--near-black);
  color: var(--color--white);
}
.cart-button {
  background-color: var(--color--transparent);
  width: 24px;
  min-width: 24px;
  height: 24px;
  color: var(--color--transparent);
  justify-content: center;
  align-items: center;
  padding: 0;
  position: relative;
}
.cart-icon {
  max-width: 24px;
  max-height: 24px;
}
.cart-quantity {
  background-color: var(--color--primary-yellow);
  min-width: 14px;
  height: 14px;
  color: var(--color--near-black);
  font-size: 10px;
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: 0;
  justify-content: center;
  align-items: center;
  margin-left: 0;
  padding-left: 2px;
  padding-right: 0;
  display: inline-flex;
  position: absolute;
  inset: -2px -3px auto auto;
}
.dropdown-toggle {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  background-color: var(--color--white);
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  padding: 8px 20px;
  display: inline-flex;
  position: static;
}
.dropdown-toggle-icon {
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 0;
  position: static;
}
._404-wrapper {
  grid-column-gap: 58px;
  grid-row-gap: 58px;
  flex-flow: column;
  display: flex;
}
._404-title-wrap {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
._404-image-wrap {
  width: 100%;
  max-width: 791px;
  margin-left: auto;
  margin-right: auto;
}
._404-title {
  font-size: var(--_typography---heading--font-size-4xl);
  line-height: var(--_line-height---line-height-s);
  text-align: center;
}
._404-button {
  width: 100%;
  max-width: 414px;
  margin-left: auto;
  margin-right: auto;
}
.cta-bg-overlay {
  background-image: linear-gradient(#fff01700, #fff01733);
  position: absolute;
  inset: 0%;
}
.password-wrapper {
  grid-column-gap: var(--_spacing---margin-padding--spacing-l);
  grid-row-gap: var(--_spacing---margin-padding--spacing-l);
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.password-title-wrap {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}
.all-device-none {
  margin-top: 0;
  margin-bottom: 0;
  display: none;
}
.password-details {
  color: #444;
  width: 100%;
  max-width: 417px;
  font-weight: var(--_font-weight---medium);
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.password-title {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.password-form-wrap {
  grid-column-gap: 28px;
  grid-row-gap: 28px;
  justify-content: space-between;
  width: 100%;
  max-width: 606px;
  margin-left: auto;
  margin-right: auto;
  padding: 30px;
  display: flex;
}
.password-input {
  border: 1px solid var(--color--light-gray);
  border-radius: var(--_border-radius---border-radius-s);
  background-color: var(--color--white);
  height: auto;
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  margin-bottom: 0;
  padding: 13px 14px;
}
.password-input:focus {
  border-color: var(--color--charcoal-gray);
}
.password-input::placeholder {
  color: #444;
}
.password-submit {
  border-radius: var(--_border-radius---border-radius-s);
  background-color: var(--color--primary-yellow);
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  justify-content: center;
  align-items: center;
  padding: 10px 24px;
  transition: color .4s, background-color .4s;
  display: inline-flex;
}
.password-submit:hover {
  background-color: var(--color--near-black);
  color: var(--color--white);
}
.changelog-wrapper {
  grid-column-gap: var(--_spacing---margin-padding--spacing-4xl);
  grid-row-gap: var(--_spacing---margin-padding--spacing-4xl);
  flex-flow: column;
  display: flex;
}
.changelog-wrap {
  border-radius: var(--_border-radius---border-radius-xl);
  background-color: var(--color--white);
  padding: 40px;
}
.utility-details {
  max-width: 811px;
  font-size: var(--_typography---paragraph--font-size-s);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  margin-top: 8px;
}
.utility-details.image {
  max-width: 958px;
}
.utility-details.font {
  max-width: 907px;
}
.font-button {
  background-color: var(--color--near-black);
  color: var(--color--white);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 6px;
  padding: 13px 20px;
  transition: color .4s, background-color .4s;
  position: relative;
}
.font-button:hover {
  background-color: var(--color--primary-yellow);
  color: var(--color--near-black);
}
.font-button-text._01 {
  position: relative;
}
.font-button-text._02 {
  position: absolute;
}
.font-button-texts {
  z-index: 1;
  justify-content: center;
  align-items: center;
  display: inline-flex;
  position: relative;
}
.license-link {
  color: var(--color--near-black);
  font-weight: var(--_font-weight---medium);
}
.license-icon-wrapper {
  grid-column-gap: 50px;
  grid-row-gap: 50px;
  display: flex;
}
.license-icon-wrap {
  width: 30px;
  height: 30px;
}
.license-line {
  background-color: #c9c9c9;
  width: 1px;
  min-width: 1px;
}
.license-image-wrapper {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  display: flex;
}
.license-flex-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  display: flex;
}
.license-image-wrap {
  border-radius: var(--_border-radius---border-radius-m);
  overflow: hidden;
}
.license-image-wrap._01 {
  width: 100%;
  max-width: 716px;
}
.license-image-wrap._02 {
  width: 100%;
  max-width: 502px;
}
.terms-wrapper {
  width: 100%;
  max-width: 1064px;
  margin-left: auto;
  margin-right: auto;
}
.terms-top-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.terms-top-title {
  text-align: center;
}
.terms-top-details {
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  text-align: center;
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.terms-wrap {
  margin-top: var(--_spacing---margin-padding--spacing-3xl);
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  display: flex;
}
.terms-single-wrap {
  grid-column-gap: 18px;
  grid-row-gap: 18px;
  flex-flow: column;
  display: flex;
}
.terms-item-title {
  color: #10101a;
  font-size: var(--_typography---heading--font-size-l);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-l);
}
.terms-item-details {
  color: #525252;
  font-weight: var(--_font-weight---medium);
}
.privacy-link {
  color: #525252;
  text-decoration: underline;
  -webkit-text-decoration-color: var(--color--transparent);
  text-decoration-color: var(--color--transparent);
  transition: text-decoration-color .4s, color .4s;
}
.privacy-link:hover {
  color: var(--color--near-black);
  -webkit-text-decoration-color: var(--color--near-black);
  text-decoration-color: var(--color--near-black);
}
.privacy-item-details {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  margin-top: 24px;
}
.privacy-single-wrap {
  grid-column-gap: 18px;
  grid-row-gap: 18px;
  flex-flow: column;
}
.privacy-list-wrap {
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  flex-flow: column;
  margin-top: 24px;
  padding-left: 30px;
  display: flex;
}
.privacy-link-text {
  color: #525252;
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.faq-question-wrap {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding: 0;
  display: flex;
  position: static;
}
.faq-answer {
  color: var(--color--white);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-m);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  margin-top: 24px;
}
.faq-icon {
  max-width: 24px;
  max-height: 24px;
}
.faq-icon.plus {
  z-index: 1;
  position: relative;
}
.faq-icon.minus {
  position: absolute;
}
.faq-wrap {
  grid-column-gap: var(--_spacing---margin-padding--spacing-m);
  grid-row-gap: var(--_spacing---margin-padding--spacing-m);
  flex-flow: row;
  justify-content: space-between;
  display: flex;
}
.faq-stickywrap {
  grid-column-gap: var(--_spacing---margin-padding--spacing-m);
  grid-row-gap: var(--_spacing---margin-padding--spacing-m);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: static;
  top: 120px;
}
.faq-icon-wrap {
  z-index: 1;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 24px;
  min-width: 24px;
  height: 24px;
  display: inline-flex;
  position: relative;
}
.faq-answer-wrap {
  max-width: 753px;
}
.section-subtitle {
  color: #737373;
  letter-spacing: -.72px;
  font-size: 18px;
  font-weight: 600;
  line-height: 140%;
}
.faq-navigation {
  background-color: #0000;
  width: 100%;
  position: static;
}
.faq-single-wrap {
  border: 1px solid var(--color--light-gray);
  border-radius: var(--_border-radius---border-radius-l);
  background-color: var(--color--white);
  cursor: pointer;
  flex-flow: column;
  justify-content: flex-start;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding: 32px 24px;
  display: flex;
  position: static;
  overflow: hidden;
}
.faq-right-wrap {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  width: 100%;
  max-width: 849px;
  display: flex;
}
.faq-question {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-l);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-l);
  white-space: normal;
  word-break: keep-all;
}
.contact-wrapper {
  grid-column-gap: var(--_spacing---margin-padding--spacing-3xl);
  grid-row-gap: var(--_spacing---margin-padding--spacing-3xl);
  flex-flow: column;
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.contact-title-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  text-align: center;
  flex-flow: column;
  max-width: 582px;
  display: flex;
}
.contact-details {
  font-size: var(--_typography---paragraph--font-size-s);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
}
.contact-single-item {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.contact-form-block {
  border-radius: var(--_border-radius---border-radius-2xl);
  background-color: var(--color--fill-color);
  width: 100%;
  max-width: 650px;
  padding: 24px;
}
.contact-form-wrap {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 0;
  display: flex;
}
.contact-form {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  width: 100%;
  max-width: 100%;
  display: flex;
}
.contact-group-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  display: flex;
}
.contact-item-wrap {
  width: 100%;
  max-width: 100%;
}
.contact-label-field {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  margin-bottom: 10px;
}
.contact-input-field {
  border: 1px solid var(--color--line-gray);
  background-color: var(--color--white);
  width: 100%;
  max-width: 100%;
  height: auto;
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 8px;
  margin-bottom: 0;
  padding: 13px;
}
.contact-input-field:focus {
  border-color: var(--color--charcoal-gray);
}
.contact-input-field::placeholder {
  color: var(--color--medium-gray);
}
.contact-textarea-field {
  border: 1px solid var(--color--light-gray);
  background-color: var(--color--white);
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: auto;
  min-height: 160px;
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 8px;
  margin-bottom: 0;
  padding: 13px;
}
.contact-textarea-field:focus {
  border-color: var(--color--charcoal-gray);
}
.contact-textarea-field::placeholder {
  color: var(--color--medium-gray);
}
.contact-form-submit {
  background-color: var(--color--primary-yellow);
  height: auto;
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  border-radius: 50px;
  padding: 16px 32px;
  transition: color .4s, background-color .4s;
}
.contact-form-submit:hover {
  background-color: var(--color--near-black);
  color: var(--color--white);
}
.section-top-wrap {
  margin-bottom: var(--_spacing---margin-padding--spacing-3xl);
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.section-top-wrap.hero {
  margin-bottom: 0;
}
.section-top-title {
  text-align: center;
  width: 100%;
  max-width: 786px;
  margin-left: auto;
  margin-right: auto;
}
.section-top-title.pricing {
  max-width: 726px;
}
.section-top-title.white {
  color: var(--color--white);
}
.section-top-details {
  width: 100%;
  max-width: 627px;
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  text-align: center;
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  margin-top: 30px;
}
.section-top-details.white {
  color: var(--color--white);
}
.news-grid-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 40px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.news-grid-wrap.top {
  grid-template-columns: 1fr 1fr;
}
.news-image-wrap {
  border-radius: var(--_border-radius---border-radius-2xl);
  width: 100%;
  max-width: 100%;
  display: block;
  overflow: hidden;
}
.news-content-wrap {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  margin-top: 16px;
  display: flex;
}
.news-date-wrap {
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.news-published {
  font-weight: var(--_font-weight---medium);
}
.news-item-title {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-l);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-l);
  transition: color .4s;
}
.news-item-title:hover {
  color: var(--color--medium-gray);
}
.news-item-title._01 {
  font-size: var(--_typography---heading--font-size-2xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-2xl);
  transition: color .4s;
}
.news-item-title._01:hover {
  color: var(--color--medium-gray);
}
.news-item-details {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.news-wrap {
  margin-top: var(--_spacing---margin-padding--spacing-2xl);
}
.section-title-wrapper {
  margin-bottom: var(--_spacing---margin-padding--spacing-2xl);
}
.section-title-wrapper.planet {
  margin-bottom: var(--_spacing---margin-padding--spacing-l);
}
.section-title-wrapper.choice {
  margin-bottom: 64px;
}
.section-title-wrapper.testimonial {
  margin-bottom: var(--_spacing---margin-padding--spacing-xl);
}
.section-title {
  text-align: center;
  width: 100%;
  max-width: 608px;
  margin-left: auto;
  margin-right: auto;
}
.section-title.services {
  color: var(--color--white);
}
.section-title.compare {
  max-width: 643px;
}
.section-title.benefit {
  max-width: 548px;
}
.section-title.team {
  text-align: left;
  max-width: 670px;
  margin-left: 0;
}
.section-title.process {
  max-width: 502px;
  color: var(--color--white);
}
.section-title.testimonial {
  max-width: 510px;
  color: var(--color--white);
}
.section-title.is-purpose {
  text-align: left;
  margin-left: 0;
}
.section-title.is-nature {
  max-width: 670px;
  color: var(--color--white);
  text-align: left;
  margin-left: 0;
}
.section-top-button {
  text-align: center;
  margin-top: 32px;
}
.projects-wrap {
  grid-column-gap: var(--_spacing---margin-padding--spacing-m);
  grid-row-gap: var(--_spacing---margin-padding--spacing-m);
  flex-flow: column;
  display: flex;
}
.project-flex-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.project-cl-list-wrap.big {
  width: 100%;
  max-width: 738px;
}
.project-cl-list-wrap.small {
  width: 100%;
  max-width: 522px;
}
.project-image-wrap {
  border-radius: var(--_border-radius---border-radius-xl);
  display: block;
  overflow: hidden;
}
.project-image {
  transition: transform .4s;
}
.project-image:hover {
  transform: scale(1.1);
}
.project-content-wrap {
  justify-content: space-between;
  align-items: center;
  margin-top: 16px;
  display: flex;
}
.project-item-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
  transition: color .4s;
}
.project-item-title:hover {
  color: var(--color--charcoal-gray);
}
.project-catgory, .project-year {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.expert-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  display: flex;
}
.expert-image-wrap {
  border-radius: var(--_border-radius---border-radius-m);
  width: 100%;
  max-width: 413px;
  overflow: hidden;
}
.expert-grid-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  max-width: 847px;
  display: grid;
}
.expert-single-wrap {
  background-color: #f7f7f7;
  border-radius: 10px;
  padding: 20px;
  overflow: hidden;
}
.expert-icon-wrap {
  border-radius: var(--_border-radius---border-radius-l);
  background-color: var(--color--near-black);
  justify-content: center;
  align-items: center;
  width: 64px;
  height: 64px;
  display: inline-flex;
  overflow: hidden;
}
.expert-icon {
  filter: invert();
  max-width: 32px;
  max-height: 32px;
}
.expert-details-wrap {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  margin-top: 24px;
  display: flex;
}
.expert-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
}
.expert-details {
  font-weight: var(--_font-weight---medium);
}
.services-wrapper {
  width: 100%;
  max-width: 1064px;
  margin-left: auto;
  margin-right: auto;
}
.services-cl-list {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}
.service-link-wrap {
  z-index: 1;
  border: 1px solid var(--color--charcoal-gray);
  border-radius: var(--_border-radius---border-radius-l);
  background-color: var(--color--near-black);
  justify-content: space-between;
  align-items: center;
  padding: 30px;
  display: flex;
  position: relative;
  overflow: hidden;
}
.service-left-item {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  justify-content: flex-start;
  align-items: center;
  display: inline-flex;
}
.service-number {
  color: var(--color--dark-gray);
}
.service-icon-wrap {
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}
.service-icon._01 {
  z-index: 1;
  position: relative;
}
.service-icon._02 {
  position: absolute;
}
.service-item-title {
  color: var(--color--dark-gray);
}
.service-item-bg {
  z-index: -1;
  border-radius: var(--_border-radius---border-radius-l);
  background-color: var(--color--primary-yellow);
  position: absolute;
  inset: auto 0% 0%;
}
.impact-counter-wrap {
  border-radius: var(--_border-radius---border-radius-2xl);
  background-color: var(--color--primary-yellow);
  padding: 48px 24px;
}
.counter-overflow {
  height: 80px;
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-5xl);
  line-height: var(--_line-height---line-height-s);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-5xl);
  overflow: hidden;
}
.counter-overflow.about {
  height: 64px;
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-4xl);
  line-height: var(--_line-height---line-height-s);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-4xl);
}
.counter-wrap {
  display: flex;
}
.compare-grid-wrap {
  z-index: 1;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
  position: relative;
}
.compare-item-title {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.compare-plan-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
}
.compare-plan-wrap {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  margin-top: 24px;
  margin-bottom: 24px;
  display: flex;
}
.compare-single-wrap {
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  max-width: 100%;
  display: block;
}
.compare-icon {
  max-width: 22px;
  max-height: 22px;
}
.secondary-button {
  grid-column-gap: 25px;
  grid-row-gap: 25px;
  color: #1d1d1d;
  letter-spacing: -.8px;
  background-color: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 16px;
  justify-content: center;
  align-items: center;
  padding: 16px 20px;
  font-size: 20px;
  font-weight: 500;
  line-height: 140%;
  display: inline-flex;
}
.compare-item-wrap {
  border-bottom: 1px solid var(--color--light-gray);
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  max-width: 100%;
  padding-bottom: 16px;
  display: flex;
}
.compare-flex-wrap {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  margin-top: 40px;
  display: flex;
}
.compare-top-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.compare-price-wrap {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.compare-price {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-2xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-2xl);
}
.compare-price-time {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.compare-icon-wrap {
  border-radius: var(--_border-radius---circle-round);
  background-color: var(--color--off-white);
  justify-content: center;
  align-items: center;
  width: 38px;
  height: 38px;
  display: inline-flex;
}
.compare-button {
  width: 100%;
  max-width: 201px;
}
.theme-button-bg {
  z-index: -1;
  background-color: var(--color--near-black);
  border-radius: 50px;
  position: absolute;
  inset: auto 0% 0%;
}
.theme-button-bg.compare {
  background-color: var(--color--primary-yellow);
  inset: auto 0% 0%;
}
.theme-button-bg.primary, .theme-button-bg.careery {
  background-color: var(--color--primary-yellow);
}
.benefits-single-wrap {
  z-index: 1;
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 558px;
  display: flex;
  position: relative;
}
.benefits-single-wrap.right {
  margin-left: auto;
}
.benefit-border-line {
  background-color: var(--color--near-black);
  width: 1px;
  min-width: 1px;
  height: 100%;
  margin-top: 5px;
  position: relative;
}
.benefit-dot-wrap {
  background-color: var(--color--dark-gray);
  border-radius: 50%;
  width: 12px;
  min-width: 12px;
  height: 12px;
}
.benefit-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
}
.benefit-details {
  font-weight: var(--_font-weight---medium);
}
.benefits-wrap {
  z-index: 1;
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  width: 100%;
  max-width: 100%;
  display: flex;
  position: relative;
}
.benefit-details-wrap {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  background-color: var(--color--off-white);
  border-radius: 8px;
  flex-flow: column;
  width: 100%;
  max-width: 522px;
  padding: 16px;
  display: flex;
}
.benefit-active-line {
  background-color: #0e0e0e;
  width: 1px;
  min-width: 1px;
  position: absolute;
  inset: 0%;
}
.benefit-border-wrap {
  background-color: var(--color--light-gray);
  justify-content: center;
  width: 1px;
  min-width: 1px;
  height: 85.3%;
  display: flex;
  position: absolute;
  inset: 0% auto 0% 50%;
  transform: translate(-50%);
}
.benefits-wrapper {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  justify-content: space-between;
  width: 100%;
  max-width: 1104px;
  margin-left: auto;
  margin-right: auto;
}
.career-top-grid {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.career-top-image-wrap {
  border-radius: var(--_border-radius---border-radius-l);
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}
.career-wrapper {
  max-width: 1064px;
  margin-left: auto;
  margin-right: auto;
}
.career-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
}
.career-single-wrap {
  z-index: 1;
  grid-column-gap: 50px;
  grid-row-gap: 50px;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 30px;
  display: flex;
  position: relative;
}
.career-content-wrap {
  justify-content: space-between;
  align-items: flex-end;
  width: 100%;
  max-width: 847px;
  display: flex;
}
.career-title-wrap {
  grid-column-gap: 18px;
  grid-row-gap: 18px;
  flex-flow: column;
  display: flex;
}
.career-title {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-l);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-l);
  transition: color .4s;
}
.career-title:hover {
  color: var(--color--medium-gray);
}
.career-meta-wrap {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.career-meta-item {
  border: 1px solid var(--color--light-gray);
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 40px;
  padding: 8px 20px;
}
.career-details-wrap {
  width: 100%;
  max-width: 413px;
}
.career-details-wrap.desktop-off {
  display: none;
}
.career-details {
  font-weight: var(--_font-weight---medium);
}
.career-border-wrap {
  background-color: var(--color--light-gray);
  height: 1px;
  min-height: 1px;
  position: absolute;
  inset: auto 0% 0%;
}
.career-border-line {
  background-color: var(--color--near-black);
  height: 1px;
  min-height: 1px;
  position: absolute;
  inset: 0%;
}
.career-cl-list {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  display: flex;
}
.pricing-wrap {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}
.pricing-tabs {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 100%;
  display: flex;
}
.pricing-tabs-menu {
  background-color: var(--color--off-white);
  border-radius: 22px;
  justify-content: center;
  align-items: center;
  padding: 4px;
  display: inline-flex;
}
.pricing-tabs-menu._01 {
  margin-bottom: 0;
  position: absolute;
  inset: -80px auto auto 0%;
}
.pricing-tab-link {
  z-index: 1;
  background-color: var(--color--transparent);
  width: 76px;
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  text-align: center;
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 18px;
  padding: 7px 10px;
  position: relative;
  overflow: visible;
}
.pricing-tab-link[aria-current="page"], .pricing-tab-link.is-active {
  background-color: var(--color--transparent);
  color: var(--color--near-black);
  font-weight: var(--_font-weight---medium);
}
.pricing-tab-link._01 {
  border-style: none;
  margin-right: 0;
}
.pricing-tab-link._01.is-selected {
  background-color: var(--color--primary-yellow);
  color: var(--color--near-black);
}
.pricing-tabs-content {
  border-radius: var(--_border-radius---border-radius-xl);
  background-color: var(--color--off-white);
  width: 100%;
  max-width: 100%;
  margin-top: 24px;
  padding: 10px 10px 10px 24px;
}
.pricing-tab-pane {
  width: 100%;
  max-width: 100%;
}
.pricing-all-item-wrap {
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  display: grid;
}
.pricing-item-wrap {
  width: 100%;
  max-width: 317px;
}
.pricing-single-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  display: flex;
}
.pricing-icon-wrap {
  border-radius: var(--_border-radius---circle-round);
  background-color: var(--color--white);
  justify-content: center;
  align-items: center;
  width: 38px;
  height: 38px;
  font-style: normal;
  display: inline-flex;
}
.pricing-icon {
  max-width: 20px;
  max-height: 20px;
}
.plan-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
}
.plan-details {
  font-weight: var(--_font-weight---medium);
  margin-top: 10px;
}
.plan-price-wrap {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.plan-price {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-2xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-2xl);
}
.plan-duration {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.plan-feature-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.plan-feature-list {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  margin-top: 12px;
  padding-left: 0;
  display: flex;
}
.plan-feature-list-item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.plan-feature-icon {
  max-width: 16px;
  max-height: 16px;
}
.pricing-grid-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  border-radius: var(--_border-radius---border-radius-m);
  background-color: #f5f5f5;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  padding: 14px 24px;
  display: grid;
}
.compare-plan-cl-grid {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.compare-prices {
  justify-content: center;
  align-items: center;
  display: inline-flex;
  position: relative;
}
.planet-tabs {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.planet-tabs-menu {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  justify-content: center;
  align-items: center;
  display: flex;
}
.planet-tabs-content {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 100%;
  margin-top: 30px;
}
.planet-video-wrap {
  border-radius: var(--_border-radius---border-radius-xl);
  width: 100%;
  max-width: 100%;
  height: 700px;
  overflow: hidden;
}
.planet-video {
  width: 100%;
  max-width: 100%;
  height: 100%;
}
.planet-tab-link {
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  border-radius: var(--_border-radius---border-radius-m);
  background-color: var(--color--off-white);
  justify-content: flex-start;
  align-items: center;
  padding: 14px;
  display: flex;
}
.planet-tab-link[aria-current="page"], .planet-tab-link.is-active {
  background-color: var(--color--primary-yellow);
}
.planet-icon-wrap {
  z-index: 1;
  border-radius: var(--_border-radius---border-radius-xs);
  background-color: var(--color--white);
  justify-content: center;
  align-items: center;
  width: 60px;
  min-width: 60px;
  height: 60px;
  display: inline-flex;
  position: relative;
}
.planet-icon {
  max-width: 30px;
  max-height: 30px;
}
.planet-icon._02 {
  z-index: -1;
  position: absolute;
}
.planet-tab-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
}
.planet-wrap {
  margin-top: var(--_spacing---margin-padding--spacing-l);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.planet-counter-title {
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  margin-top: 16px;
}
.team-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 50px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.team-single-wrap {
  z-index: 1;
  background-color: var(--color--white);
}
.team-image-wrap {
  border-radius: 10px;
  overflow: hidden;
}
.team-content-wrap {
  flex-flow: column;
  padding-top: 16px;
  display: flex;
}
.team-name {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
}
.team-social-link {
  z-index: 1;
  justify-content: center;
  align-items: center;
  width: 24px;
  min-width: 24px;
  height: 24px;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}
.team-description {
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
}
.about-wrapper {
  grid-column-gap: var(--_spacing---margin-padding--spacing-l);
  grid-row-gap: var(--_spacing---margin-padding--spacing-l);
  flex-flow: column;
  display: flex;
}
.about-flex-wrap {
  grid-column-gap: var(--_spacing---margin-padding--spacing-l);
  grid-row-gap: var(--_spacing---margin-padding--spacing-l);
  justify-content: space-between;
  align-items: flex-end;
  display: flex;
}
.about-flex-wrap.top {
  align-items: stretch;
}
.about-left-wrap {
  width: 100%;
  max-width: 238px;
}
.about-left-wrap.top {
  flex-flow: column;
  justify-content: space-between;
  display: flex;
}
.about-right-wrap {
  width: 100%;
  max-width: 847px;
}
.about-right-wrap.bottom {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.about-single-wrap {
  border-radius: var(--_border-radius---border-radius-xs);
  background-color: #f6f6f6;
  flex-flow: column;
  justify-content: flex-end;
  align-items: flex-start;
  width: 100%;
  max-width: 100%;
  height: 228px;
  padding: 14px;
  display: flex;
}
.about-details-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}
.about-title-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
}
.about-title {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-2xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-2xl);
}
.about-subtitle {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
}
.about-slider {
  background-color: var(--color--transparent);
  flex-flow: column;
  justify-content: flex-end;
  align-items: flex-start;
  width: 100%;
  max-width: 100%;
  height: 116px;
}
.about-mask {
  height: 100%;
}
.about-slide-wrap {
  height: auto;
}
.about-counter-title {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  margin-top: 10px;
}
.about-border-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.about-single-border {
  background-color: var(--color--light-gray);
  border-radius: 3px;
  width: 52px;
  height: 3px;
  position: relative;
  overflow: hidden;
}
.about-active-line {
  background-color: var(--color--near-black);
  border-radius: 3px;
  position: absolute;
  inset: 0%;
}
.impact-list-item {
  z-index: 1;
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border: .5px solid var(--color--light-gray);
  background-color: var(--color--white);
  cursor: pointer;
  border-radius: 8px;
  flex-flow: row;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: 0;
  margin-right: 0;
  padding: 24px 16px;
  display: flex;
  position: relative;
}
.impact-list-item[aria-current="page"], .impact-list-item.is-active {
  border-color: var(--color--primary-yellow);
  background-color: var(--color--primary-yellow);
}
.hero-wrapper {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  padding-top: 60px;
  padding-bottom: 60px;
  display: flex;
}
.hero-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  justify-content: space-between;
  align-items: flex-end;
  width: 100%;
  margin-bottom: 10px;
  display: flex;
}
.hero-left-wrap {
  max-width: 274px;
}
.hero-right-wrap {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-end;
  max-width: 221px;
  display: flex;
}
.hero-title {
  font-size: var(--_typography---heading--font-size-4xl);
}
.power-wrapper {
  grid-column-gap: var(--_spacing---margin-padding--spacing-4xl);
  grid-row-gap: var(--_spacing---margin-padding--spacing-4xl);
  flex-flow: column;
  display: none;
}
.power-wrap {
  grid-column-gap: var(--_spacing---margin-padding--spacing-2xl);
  grid-row-gap: var(--_spacing---margin-padding--spacing-2xl);
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.power-title {
  max-width: 740px;
  color: var(--color--medium-gray);
  font-size: var(--_typography---heading--font-size-2xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  text-align: center;
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-2xl);
  margin-left: auto;
  margin-right: auto;
}
.power-content-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  text-align: center;
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
}
.power-single-item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 140px;
  display: flex;
}
.power-icon-wrap {
  border: .5px solid var(--color--light-gray);
  border-radius: var(--_border-radius---circle-round);
  justify-content: center;
  align-items: center;
  width: 104px;
  height: 104px;
  display: inline-flex;
}
.power-icon {
  max-width: 40px;
  max-height: 40px;
}
.power-item-title {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  text-align: center;
}
.power-item-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  justify-content: center;
  align-items: center;
  margin-top: 24px;
  display: flex;
}
.power-image-wrapper {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: center;
  width: 100%;
  max-width: 804px;
  display: flex;
}
.power-image-wrap {
  border-radius: var(--_border-radius---border-radius-l);
  width: 100%;
  max-width: 400px;
  height: 200px;
  overflow: hidden;
}
.power-bottom-wrap {
  grid-column-gap: var(--_spacing---margin-padding--spacing-xl);
  grid-row-gap: var(--_spacing---margin-padding--spacing-xl);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.power-setup {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.choice-slide-wrap {
  z-index: 1;
  grid-column-gap: 200px;
  grid-row-gap: 200px;
  border-radius: var(--_border-radius---border-radius-2xl);
  background-color: var(--color--off-white);
  flex-flow: column;
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 475px;
  padding: 32px;
  display: flex;
  position: relative;
  overflow: hidden;
}
.choice-top-wrap {
  z-index: 5;
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
  position: relative;
}
.choice-details-wrap {
  z-index: 3;
  position: relative;
}
.choice-details {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.choice-icon-wrap {
  border-radius: var(--_border-radius---border-radius-l);
  background-color: var(--color--primary-yellow);
  justify-content: center;
  align-items: center;
  width: 64px;
  height: 64px;
  display: inline-flex;
}
.choice-icon {
  max-width: 32px;
  max-height: 32px;
}
.choice-title {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xl);
}
.choice-image-wrap {
  z-index: 1;
  height: 327px;
  position: absolute;
  inset: 60px 0% auto auto;
}
.choice-image-wrap._02 {
  height: 353px;
  top: 28px;
}
.choice-image-wrap._03 {
  top: 32px;
}
.process-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  display: flex;
}
.process-single-wrap {
  grid-column-gap: 64px;
  grid-row-gap: 64px;
  justify-content: space-between;
  display: flex;
}
.process-right-wrap {
  width: 100%;
  max-width: 916px;
  padding-bottom: var(--_spacing---margin-padding--spacing-l);
  grid-column-gap: 48px;
  grid-row-gap: 48px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.process-image-wrap {
  border: 1px solid var(--color--charcoal-gray);
  border-radius: var(--_border-radius---border-radius-xl);
  width: 100%;
  max-width: 532px;
  overflow: hidden;
}
.process-details-wrap {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  max-width: 336px;
  display: flex;
}
.process-title {
  width: 100%;
  max-width: 232px;
  color: var(--color--white);
  font-size: var(--_typography---heading--font-size-2xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-2xl);
}
.process-title._03 {
  max-width: 100%;
}
.process-details {
  color: var(--color--dark-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.process-left-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 300px;
  display: flex;
}
.process-button-wrap {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  border: 1px solid var(--color--charcoal-gray);
  background-color: var(--color--near-black);
  width: 100%;
  max-width: 100%;
  color: var(--color--white);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 50px;
  justify-content: flex-start;
  align-items: center;
  padding: 6px;
  display: flex;
}
.process-number-wrap {
  border: 1px solid var(--color--charcoal-gray);
  border-radius: var(--_border-radius---circle-round);
  background-color: var(--color--near-black);
  justify-content: center;
  align-items: center;
  width: 48px;
  min-width: 48px;
  height: 48px;
  display: inline-flex;
}
.process-line-wrap {
  background-color: var(--color--charcoal-gray);
  width: 1px;
  min-width: 1px;
  height: 100%;
  margin-left: 30px;
  position: relative;
}
.process-active-line {
  background-color: var(--color--primary-yellow);
  position: absolute;
  inset: 0%;
}
.testimonial-wrapper {
  z-index: 1;
  padding-top: 160px;
  padding-bottom: 160px;
  position: relative;
  overflow: hidden;
}
.testimonial-bg-wrapper {
  position: absolute;
  inset: 0%;
}
.testimonial-bg-wrap {
  object-fit: cover;
  width: 100%;
  max-width: 100%;
  height: 100%;
}
.testimonial-bg-wrap._01 {
  z-index: 1;
  position: relative;
}
.testimonial-bg-wrap._02, .testimonial-bg-wrap._03 {
  position: absolute;
  inset: 0%;
}
.testimonial-wrap {
  z-index: 5;
  position: relative;
}
.testimonial-slider {
  height: auto;
  padding-bottom: var(--_spacing---margin-padding--spacing-2xl);
  background-color: var(--color--transparent);
}
.testimonial-mask {
  width: 100%;
  max-width: 1063px;
  margin-left: auto;
  margin-right: auto;
  overflow: visible;
}
.testimonial-slide {
  border: 1px solid var(--color--overlay-gray);
  border-radius: var(--_border-radius---border-radius-2xl);
  background-color: var(--color--white);
  width: 100%;
  max-width: 100%;
  height: 100%;
  margin-right: 24px;
  padding: 20px;
}
.testimonial-single-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  justify-content: flex-start;
  align-items: stretch;
  display: flex;
}
.testimonial-image-wrap {
  border-radius: var(--_border-radius---border-radius-s);
  width: 100%;
  max-width: 540px;
  overflow: hidden;
}
.testimonial-content-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  justify-content: space-between;
  width: 100%;
  max-width: 443px;
  padding-top: 20px;
  padding-bottom: 20px;
  display: flex;
}
.testimonial-author-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.testimonial-author-name {
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.testimonial-details-wrap, .testimonial-details {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
}
.testimonial-counter-title {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  margin-top: 16px;
}
.counter-unit {
  color: var(--color--dark-gray);
  font-size: var(--_typography---heading--font-size-2xl);
  line-height: var(--_line-height---line-height-m);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-2xl);
  justify-content: flex-start;
  align-items: flex-start;
  padding-top: 30px;
}
.testimonial-top-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  display: flex;
}
.blog-top-wrap {
  margin-bottom: var(--_spacing---margin-padding--spacing-2xl);
}
.blog-top-title-wrap {
  width: 100%;
  max-width: 520px;
}
.blog-top-details-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  max-width: 630px;
  margin-left: auto;
  display: flex;
}
.blog-top-details {
  width: 100%;
  max-width: 366px;
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.blog-wrapper {
  overflow: hidden;
}
.checkout-wrapper {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  background-color: var(--color--transparent);
  justify-content: center;
  align-items: flex-start;
  padding: 0;
  display: flex;
}
.checkout-right-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  flex-basis: 360px;
  display: flex;
  top: 140px;
}
.checkout-left-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  margin-right: 0;
  display: flex;
}
.checkout-single-wrap {
  margin-top: 0;
  margin-bottom: 0;
}
.order-summary {
  margin-bottom: 0;
}
.error-state {
  color: var(--color--white);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  text-align: center;
  background-color: #cf1515;
  border-radius: 8px;
  margin-bottom: 0;
  margin-left: 24px;
  margin-right: 24px;
}
.checkout-submit {
  background-color: var(--color--primary-yellow);
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  border-radius: 8px;
  margin-bottom: 0;
  padding: 12px 24px;
  transition: color .4s, background-color .4s;
}
.checkout-submit:hover {
  background-color: var(--color--black);
  color: var(--color--white);
}
.checkout-title-wrap {
  border-style: solid;
  border-color: var(--color--light-gray);
  background-color: var(--color--white);
  padding: 20px;
}
.checkout-content-wrap {
  border-right: 1px solid var(--color--light-gray);
  border-bottom-width: 1px;
  border-bottom-color: var(--color--light-gray);
  border-left-color: var(--color--light-gray);
  background-color: var(--color--white);
  color: var(--color--near-black);
  padding: 20px;
}
.checkout-total-wrap {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.shipping-method-list {
  border-right-color: var(--color--light-gray);
  border-left-color: var(--color--light-gray);
}
.shipping-method {
  border-bottom-color: var(--color--light-gray);
  background-color: var(--color--white);
  color: var(--color--near-black);
  padding: 20px;
}
.empty-state {
  border-right-color: var(--color--light-gray);
  border-bottom-color: var(--color--light-gray);
  border-left-color: var(--color--light-gray);
  background-color: var(--color--white);
  color: var(--color--near-black);
  padding: 64px 20px;
}
.order-item-left {
  margin-left: 0;
}
.billing-address-toggle {
  justify-content: flex-start;
  align-items: center;
}
.checkbox-label {
  margin-bottom: 0;
}
.checkbox {
  margin-top: 0;
}
.checkout-label-field {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  margin-bottom: 10px;
}
.checkout-input-field {
  border: 1px solid var(--color--light-gray);
  background-color: var(--color--white);
  width: 100%;
  max-width: 100%;
  height: auto;
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 8px;
  margin-bottom: 16px;
  padding: 10px 13px;
}
.checkout-input-field:focus, .checkout-input-field.-wfp-focus {
  border-color: var(--color--charcoal-gray);
}
.checkout-input-field::placeholder {
  color: var(--color--medium-gray);
}
.checkout-input-field._01 {
  margin-bottom: 0;
}
.checkout-input-field.card {
  height: 44px;
}
.single-pricing-wrapper {
  width: 100%;
  max-width: 1064px;
  margin-left: auto;
  margin-right: auto;
}
.single-pricing-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 40px;
  display: flex;
}
.single-pricing-left-wrap {
  z-index: 1;
  width: 100%;
  max-width: 365px;
  padding-top: 80px;
  position: sticky;
  top: 140px;
}
.single-pricing-right-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  width: 100%;
  max-width: 659px;
  display: flex;
}
.single-price-item {
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  flex-flow: column;
  display: flex;
}
.single-price-item-title {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-l);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-l);
}
.single-price-details {
  font-size: var(--_typography---paragraph--font-size-s);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.single-price-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  border-radius: var(--_border-radius---border-radius-l);
  background-color: var(--color--off-white);
  flex-flow: column;
  width: 100%;
  max-width: 100%;
  padding: 24px;
  display: flex;
}
.single-price-wrap._01 {
  position: relative;
}
.single-career-wrapper {
  width: 100%;
  max-width: 1064px;
  margin-left: auto;
  margin-right: auto;
}
.single-career-title {
  margin-bottom: var(--_spacing---margin-padding--spacing-l);
}
.single-career-meta {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  max-width: 916px;
  display: grid;
}
.career-meta-item-wrap {
  border-bottom: .5px solid var(--color--light-gray);
  padding-bottom: 12px;
}
.career-meta-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  margin-bottom: 2px;
}
.career-meta-text {
  color: #444;
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.single-career-wrap {
  margin-top: 40px;
}
.career-button-wrap {
  margin-top: 30px;
}
.career-rich-details h3:where(:not([class*="heading-scale-"])), .career-rich-details :where(.heading-scale-3) {
  font-size: var(--_typography---heading--font-size-l);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-l);
  margin-bottom: 18px;
}
.career-rich-details p {
  color: var(--color--neutral-gray);
  font-weight: var(--_font-weight---medium);
}
.career-rich-details h4:where(:not([class*="heading-scale-"])), .career-rich-details :where(.heading-scale-4) {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-l);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-l);
  margin-top: 30px;
  margin-bottom: 18px;
}
.career-rich-details ul {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: #525252;
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  flex-flow: column;
  margin-top: 18px;
  padding-left: 30px;
  display: flex;
}
.career-rich-details ol {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: var(--color--neutral-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  flex-flow: column;
  margin-top: 18px;
  margin-bottom: 0;
  padding-left: 0;
  list-style-type: none;
  display: flex;
}
.single-service-wrapper {
  width: 100%;
  max-width: 1064px;
  margin-left: auto;
  margin-right: auto;
}
.single-service-top-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  width: 100%;
  max-width: 847px;
  display: flex;
}
.single-service-details {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.service-image-wrap {
  width: 100%;
  max-width: 100%;
  margin-top: var(--_spacing---margin-padding--spacing-l);
  margin-bottom: var(--_spacing---margin-padding--spacing-m);
  border-radius: var(--_border-radius---border-radius-xl);
  overflow: hidden;
}
.service-rich-details h3:where(:not([class*="heading-scale-"])), .service-rich-details :where(.heading-scale-3) {
  margin-bottom: var(--_spacing---margin-padding--spacing-xs);
  font-size: var(--_typography---heading--font-size-2xl);
  line-height: var(--_line-height---line-height-m);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-2xl);
}
.service-rich-details ul {
  margin-top: var(--_spacing---margin-padding--spacing-xs);
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  flex-flow: column;
  padding-left: 30px;
  display: flex;
}
.service-rich-details p {
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.service-rich-details h4:where(:not([class*="heading-scale-"])), .service-rich-details :where(.heading-scale-4) {
  margin-top: var(--_spacing---margin-padding--spacing-s);
  margin-bottom: var(--_spacing---margin-padding--spacing-xs);
}
.service-rich-details ol {
  margin-top: var(--_border-radius---border-radius-2xl);
  margin-bottom: var(--_spacing---margin-padding--spacing-none);
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  flex-flow: column;
  padding-left: 0;
  display: flex;
}
.service-rich-details strong {
  color: var(--color--near-black);
  font-weight: var(--_font-weight---semi-bold);
}
.more-news-title {
  margin-bottom: var(--_spacing---margin-padding--spacing-2xl);
}
.single-news-title-wrap {
  width: 100%;
  max-width: 877px;
}
.single-news-title {
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
}
.meta-wrap {
  width: 100%;
  max-width: 630px;
  margin-top: var(--_spacing---margin-padding--spacing-xs);
  margin-bottom: var(--_spacing---margin-padding--spacing-m);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.meta-wrap.project {
  max-width: 596px;
  margin-top: var(--_border-radius---border-radius-3xl);
  flex-flow: row;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 50px;
  display: flex;
}
.meta-single-item {
  border-bottom: 1px solid var(--color--light-gray);
  padding-bottom: 12px;
}
.meta-single-item.project {
  border-bottom-style: none;
  padding-bottom: 0;
}
.meta-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.meta-text {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  margin-top: 2px;
}
.single-news-left-wrap {
  width: 100%;
  max-width: 847px;
}
.single-news-image-wrap {
  width: 100%;
  max-width: 100%;
  margin-bottom: var(--_spacing---margin-padding--spacing-m);
  border-radius: var(--_border-radius---border-radius-xl);
  overflow: hidden;
}
.news-rich-details h3:where(:not([class*="heading-scale-"])), .news-rich-details :where(.heading-scale-3) {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-l);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-l);
  margin-bottom: 18px;
}
.news-rich-details p {
  color: var(--color--neutral-gray);
  font-weight: var(--_font-weight---medium);
}
.news-rich-details h4:where(:not([class*="heading-scale-"])), .news-rich-details :where(.heading-scale-4) {
  margin-top: var(--_border-radius---border-radius-3xl);
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-l);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-l);
  margin-bottom: 18px;
}
.news-rich-details figure {
  width: 100%;
  max-width: 100%;
  margin-top: var(--_spacing---margin-padding--spacing-m);
  margin-bottom: var(--_spacing---margin-padding--spacing-m);
  border-radius: var(--_border-radius---border-radius-xl);
  overflow: hidden;
}
.news-rich-details ul {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--color--medium-gray);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  flex-flow: column;
  padding-left: 30px;
  display: flex;
}
.single-news-right-wrap {
  width: 100%;
  max-width: 393px;
}
.single-news-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  justify-content: space-between;
  display: flex;
}
.single-news-content {
  grid-column-gap: 130px;
  grid-row-gap: 130px;
  border-radius: var(--_border-radius---border-radius-m);
  background-color: var(--color--near-black);
  flex-flow: column;
  justify-content: space-between;
  padding: 24px;
  display: flex;
  position: sticky;
  top: 140px;
}
.single-news-form-title {
  color: var(--color--white);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-m);
  margin-bottom: 12px;
}
.single-news-form-details {
  color: var(--color--dark-gray);
}
.single-news-form-wrap {
  margin-bottom: 0;
}
.single-news-form {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  display: flex;
}
.single-news-email {
  border: 1px solid var(--color--charcoal-gray);
  background-color: var(--color--near-black);
  height: auto;
  color: var(--color--white);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 30px;
  margin-bottom: 0;
  padding: 12px 12px 12px 14px;
}
.single-news-email:focus {
  border-color: var(--color--white);
}
.single-news-email::placeholder {
  color: var(--color--light-gray);
}
.single-news-submit {
  background-color: var(--color--primary-yellow);
  height: auto;
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  background-image: url('../images/news-arrow-right.svg');
  background-position: 72%;
  background-repeat: no-repeat;
  background-size: 24px 24px;
  border-radius: 30px;
  padding: 10px 24px;
  transition: background-color .4s;
}
.single-news-submit:hover {
  background-color: var(--color--white);
  color: var(--color--near-black);
  background-image: url('../images/news-arrow-right.svg');
  background-position: 72%;
  background-repeat: no-repeat;
  background-size: 24px 24px;
}
.single-project-image-wrap {
  width: 100%;
  max-width: 100%;
  margin-bottom: var(--_spacing---margin-padding--spacing-m);
  border-radius: var(--_border-radius---border-radius-xl);
  overflow: hidden;
}
.single-project-image-wrap._03 {
  margin-top: var(--_spacing---margin-padding--spacing-l);
}
.single-project-image {
  max-height: 711px;
}
.single-project-title-wrap {
  margin-bottom: var(--_border-radius---border-radius-3xl);
  border-bottom: 1px solid var(--color--light-gray);
  padding-bottom: 12px;
}
.single-project-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.single-project-content-wrap {
  width: 100%;
  max-width: 736px;
  margin-left: auto;
}
.project-rich-details p {
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.project-rich-details strong {
  margin-top: var(--_border-radius---border-radius-3xl);
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  font-weight: var(--_font-weight---medium);
  display: block;
}
.project-rich-details ul {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  flex-flow: column;
  margin-top: 14px;
  padding-left: 0;
  list-style-type: none;
  display: flex;
}
.project-rich-details li {
  border-bottom: 1px solid var(--color--light-gray);
  padding-bottom: 6px;
}
.project-cl-multi-image-wrap {
  margin-top: var(--_spacing---margin-padding--spacing-l);
  margin-bottom: 20px;
}
.project-cl-multi-image {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.project-multiimage-wrap {
  border-radius: var(--_border-radius---border-radius-l);
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}
.single-project-flex {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.single-project-item-title {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-l);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-l);
}
.single-project-item-title-wrap {
  width: 100%;
  max-width: 413px;
}
.single-project-details {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.dd-single-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.dropdown-navigation {
  background-color: var(--color--transparent);
  width: 504px;
  overflow: hidden;
  transform: translate(-35%);
}
.dropdown-navigation.is-open {
  background-color: #0000;
}
.dropdown-flex-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  justify-content: space-between;
  display: flex;
}
.dropdown-link {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  margin-left: 0;
  margin-right: 0;
  padding: 0;
  transition: color .4s;
}
.dropdown-link:hover {
  color: var(--color--near-black);
}
.dropdown-link[aria-current="page"], .dropdown-link.is-active {
  color: var(--color--near-black);
  font-weight: var(--_font-weight---medium);
}
.dd-all-link-wrap {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.dropdown-menu-wrap {
  border-radius: var(--_border-radius---border-radius-l);
  background-color: #f8f8f9;
  margin-top: 10px;
  padding: 24px 24px 40px;
}
.dropdown-single-wrap {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.menu-title, .nav-contact-wrap {
  display: none;
}
.primary-button-bg {
  z-index: -1;
  background-color: var(--color--primary-yellow);
  position: absolute;
  inset: auto 0% 0%;
}
.primary-button-bg:where(.primary-button-border) {
  background-color: var(--color--primary-yellow);
  position: absolute;
  inset: auto 0% 0%;
}
.privacy-wrap {
  margin-top: var(--_spacing---margin-padding--spacing-3xl);
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  display: flex;
}
.privacy-top-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.privacy-wrapper {
  width: 100%;
  max-width: 1064px;
  margin-left: auto;
  margin-right: auto;
}
.cart-subtotal-wrap {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.cart-footer {
  border-top-color: var(--color--light-gray);
  padding: 16px 24px 24px;
}
.cart-left-wrap {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  margin-left: 0;
}
.cart-plan-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.cart-item-pice {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
}
.cart-item-duration {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
}
.remove-button {
  color: var(--color--charcoal-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  text-decoration: underline;
}
.cart-header {
  border-bottom-color: var(--color--light-gray);
  padding: 16px 24px;
}
.cart-list {
  padding: 12px 24px;
}
.close-button {
  cursor: pointer;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  display: inline-flex;
}
.slider-nav {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: center;
  align-items: center;
  height: auto;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  inset: auto 0% -8px;
}
.slider-nav.testimonial {
  bottom: 0;
}
.project-rich-v2-details p {
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
}
.project-rich-v2-details ul {
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
  flex-flow: column;
  margin-top: 14px;
  padding-left: 30px;
  display: flex;
}
.compare-tabs-menu {
  background-color: var(--color--off-white);
  border-radius: 22px;
  justify-content: center;
  align-items: center;
  padding: 4px;
  display: inline-flex;
  position: absolute;
  inset: 50% auto auto 0%;
  transform: translate(0, -50%);
}
.compare-tab-link {
  background-color: var(--color--off-white);
  color: var(--color--medium-gray);
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  border-radius: 18px;
  padding: 7px 10px;
}
.compare-tab-link[aria-current="page"], .compare-tab-link.is-active {
  background-color: var(--color--primary-yellow);
  color: var(--color--near-black);
  font-weight: var(--_font-weight---medium);
}
.default-state {
  margin-bottom: 0;
}
.power-setup-bracket {
  color: var(--color--light-gray);
}
.logomark {
  max-width: 26px;
  max-height: 32px;
}
.career-marquee {
  display: none;
}
.pricing-tab-bg {
  z-index: -1;
  background-color: var(--color--primary-yellow);
  border-radius: 18px;
  position: absolute;
  inset: 0%;
}
.hero-title-block {
  grid-row-gap: 30px;
  text-align: center;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 600px;
  margin-bottom: 20px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}
.hero-title-wrap {
  grid-row-gap: 16px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  text-decoration: none;
  display: flex;
}
.text-large {
  font-size: var(--_typography---paragraph--font-size-s);
}
.hero-link-title {
  color: var(--color--near-black);
}
.link {
  color: var(--color--medium-gray);
}
.link:hover {
  color: var(--color--black);
}
.hero-icon-wrapper {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 630px;
  display: flex;
}
.hero-icon-wrap {
  aspect-ratio: 1;
  border: 1px solid var(--color--line-gray);
  border-radius: var(--_border-radius---circle-round);
  justify-content: center;
  align-items: center;
  width: 54px;
  display: flex;
}
.hero-icon {
  display: flex;
}
.about-content-block {
  grid-column-gap: 50px;
  grid-row-gap: 50px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  display: flex;
}
.about-top {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex: 0 auto;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  display: flex;
}
.about-sub-title {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  margin-top: 0;
  margin-bottom: 0;
  text-decoration: none;
}
.about-top-content {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 738px;
  display: flex;
}
.about-top-text {
  width: 100%;
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-2xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--letter-spacing-2xl);
  margin-top: 0;
  margin-bottom: 0;
}
.about-stats-block {
  grid-column-gap: 80px;
  grid-row-gap: 80px;
  flex: 0 auto;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.about-stats-widget {
  grid-row-gap: 12px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 248px;
  display: flex;
}
.about-stats-text {
  width: 100%;
  font-size: var(--_typography---paragraph--font-size-xs);
  line-height: var(--_line-height---line-height-l);
  margin-top: 0;
  margin-bottom: 0;
}
.about-bottom-content {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  justify-content: flex-end;
  align-items: flex-end;
  width: 100%;
  max-width: 738px;
  margin-left: auto;
  display: flex;
}
.about-image-wrap {
  border-radius: var(--_border-radius---border-radius-l);
  background-color: #fff;
  overflow: hidden;
}
.about-image {
  object-fit: cover;
}
.about-bottom-right {
  grid-row-gap: 30px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 522px;
  display: flex;
}
.about-bottom-right-top {
  grid-row-gap: 24px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  text-decoration: none;
  display: flex;
}
.about-bottom-text {
  width: 100%;
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  margin-top: 0;
  margin-bottom: 0;
}
.about-bottom-list {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  display: flex;
}
.about-bottom-list-item {
  grid-column-gap: 8px;
  width: 100%;
  font-weight: var(--_font-weight---medium);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.about-list-item-icon {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: 6px;
  height: 6px;
  text-decoration: none;
  display: flex;
}
.about-bottom {
  width: 100%;
}
.stats-content-block {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  flex: 0 auto;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}
.stats-left {
  grid-column-gap: 120px;
  grid-row-gap: 120px;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  max-width: 451px;
  display: flex;
}
.stats-left-top {
  grid-row-gap: 16px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  display: flex;
}
.stats-title {
  width: 100%;
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-3xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  margin-top: 0;
  margin-bottom: 0;
  text-decoration: none;
}
.stats-left-bottom {
  grid-row-gap: 14px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 430px;
  display: flex;
}
.stats-image {
  border-radius: var(--_border-radius---border-radius-xl);
  object-fit: cover;
}
.stats-right {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  max-width: 522px;
  display: flex;
}
.stats-widget-large {
  grid-row-gap: 16px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 446px;
  text-decoration: none;
  display: flex;
}
.stats-widget-large-no {
  width: 100%;
  color: var(--color--near-black);
  font-size: var(--_typography---heading--display-text);
  line-height: var(--_line-height---line-height-s);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.stats-widget-large-text {
  width: 100%;
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.stats-right-bottom {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  display: flex;
}
.stats-widget {
  grid-row-gap: 6px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 218px;
  display: flex;
}
.stats-no {
  width: 100%;
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-4xl);
  line-height: var(--_line-height---line-height-s);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.stats-widget-text {
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.stats-right-top {
  grid-row-gap: 16px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  display: flex;
}
.stats-bottom-description {
  font-weight: var(--_font-weight---semi-bold);
}
.stats-widget-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  border-top: 1px solid var(--color--line-gray);
  flex-flow: row;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  padding-top: 16px;
  display: flex;
}
.choice-tab-link {
  background-color: var(--color--transparent);
  width: 35%;
  padding: 0;
  transition: all .3s;
}
.choice-tab-link[aria-current="page"], .choice-tab-link.is-active {
  background-color: var(--color--transparent);
  width: 100%;
  max-width: 560px;
}
.choice-tabs-menu {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-content: space-between;
  display: flex;
}
.innovator-slide-content {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  border-radius: var(--_border-radius---border-radius-xl);
  background-color: var(--color--fill-color);
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 285px;
  min-height: 385px;
  padding: 20px;
  display: flex;
}
.innovator-slide-no {
  width: 100%;
  color: var(--color--near-black);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.innovator-slide-icon {
  object-fit: cover;
  max-width: 48px;
  overflow: hidden;
}
.innovator-slide-body {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  text-decoration: none;
  display: flex;
}
.innovator-slide-title {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.innovator-slide-description {
  letter-spacing: -.02em;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Urbanist, sans-serif;
  font-weight: 600;
}
.slider {
  z-index: 3;
  background-color: var(--color--transparent);
  height: auto;
}
.mask {
  max-width: 285px;
  overflow: visible;
}
.innovator-slide {
  margin-right: 20px;
}
.hide {
  display: none;
}
.innovator-title {
  z-index: 5;
  max-width: 371px;
  position: relative;
}
.innovator-content-block {
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.innovator-arrow {
  aspect-ratio: 1;
  background-color: var(--color--fill-color);
  width: 44px;
  color: var(--color--medium-gray);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  margin-left: 0;
  transition: all .3s;
  display: flex;
  position: relative;
}
.innovator-arrow:hover, .innovator-arrow:focus {
  background-color: var(--color--primary-yellow);
  color: var(--color--near-black);
}
.innovator-arrow.is-left {
  margin-top: 40px;
}
.innovator-arrow.is-right {
  margin-top: -40px;
  left: 54px;
}
.innovator-arrow-icon {
  display: flex;
}
.innovator-overlay {
  z-index: 4;
  background-color: var(--color--white);
  pointer-events: none;
  width: 100%;
  min-width: 2000px;
  min-height: 600px;
  position: absolute;
  inset: 0% 0% 0% auto;
}
.innovator-title-block {
  width: 45%;
  height: 100%;
  padding-right: 160px;
  position: relative;
}
.news-author-image {
  border-radius: 50%;
  max-width: 34px;
}
.news-author-image-wrap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.news-dot {
  aspect-ratio: 1;
  background-color: var(--color--line-gray);
  border-radius: 50%;
  width: 8px;
}
.news-metadata-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--color--near-black);
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.value-card-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.value-card {
  border-radius: var(--_border-radius---border-radius-2xl);
  background-color: var(--color--near-black);
  min-height: 346px;
  box-shadow: inset 0 0 0 1px var(--color--fill-color);
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: 30px;
  display: flex;
}
.value-card-icon {
  display: flex;
}
.value-card-title {
  color: var(--color--white);
  font-size: var(--_typography---heading--font-size-xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
}
.sustain-top-left-card {
  grid-column-gap: 128px;
  grid-row-gap: 128px;
  border-radius: var(--_border-radius---border-radius-2xl);
  background-color: var(--color--near-black);
  background-image: linear-gradient(#0009, #0009), url('../images/Sustain-1.webp');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 630px;
  padding: 24px;
  display: flex;
}
.sustain-card-sub-title {
  grid-column-gap: 10px;
  background-color: var(--color--white);
  color: var(--color--near-black);
  border-radius: 50px;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  padding: 10px 18px;
  text-decoration: none;
  display: flex;
}
.sustain-card-sub-title.is-outline {
  border: 1px solid var(--color--near-black);
  background-color: var(--color--transparent);
}
.sustain-sub-title-text {
  font-size: var(--_typography---paragraph--font-size-xxs);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
  text-decoration: none;
}
.sustain-top-left-body {
  grid-row-gap: 14px;
  width: 100%;
  color: var(--color--white);
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.sustain-card-title {
  font-size: var(--_typography---heading--font-size-l);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.sustain-top-right-card {
  grid-row-gap: 90px;
  border-radius: var(--_border-radius---border-radius-2xl);
  background-color: var(--color--primary-yellow);
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 305px;
  padding: 24px;
  text-decoration: none;
  display: flex;
}
.frame-2147239026 {
  grid-row-gap: 10px;
  width: 100%;
  color: var(--color--near-black);
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.sustain-stats-no {
  width: 100%;
  font-size: var(--_typography---heading--font-size-5xl);
  line-height: var(--_line-height---line-height-s);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.sustain-left-top {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  display: flex;
}
.sustain-bottom-right-card {
  grid-row-gap: 46px;
  border-radius: var(--_border-radius---border-radius-2xl);
  background-color: var(--color--fill-color);
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 630px;
  padding: 24px;
  display: flex;
}
.sustain-bottom-right-body {
  grid-row-gap: 8px;
  width: 100%;
  max-width: 521px;
  color: var(--color--near-black);
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.sustain-author-block {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}
.sustain-review-author {
  border-style: solid;
  border-width: undefinedpx;
  object-fit: cover;
  border-color: #fff;
  max-width: 76px;
}
.sustain-left-bottom {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  display: flex;
}
.sustain-bottom-left-card {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  border-radius: var(--_border-radius---border-radius-2xl);
  background-color: var(--color--fill-color);
  flex-flow: column;
  justify-content: space-between;
  padding: 24px;
  display: flex;
}
.sustain-bottom-left-body {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 257px;
  display: flex;
}
.sustain-bottom-left-text {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  margin-top: 0;
  margin-bottom: 0;
}
.sustain-bottom-left-image {
  border-radius: var(--_border-radius---border-radius-l);
  max-height: 137px;
}
.sustain-left {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  max-width: 955px;
  display: flex;
}
.sustain-right-card {
  grid-row-gap: 14px;
  border-radius: var(--_border-radius---border-radius-2xl);
  background-color: var(--color--near-black);
  width: 100%;
  max-width: 305px;
  height: 100%;
  color: var(--color--white);
  background-image: linear-gradient(#0000, #000), url('../images/Sustain-3.webp');
  background-position: 0 0, 50% 0;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  padding: 24px;
  display: flex;
}
.sustain-right-stats {
  grid-row-gap: 8px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  text-decoration: none;
  display: flex;
}
.sustain-card-text {
  width: 100%;
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.sustain-content-block {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-content: space-between;
  display: flex;
}
.sustain-right {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  justify-content: space-between;
  display: flex;
}
.sustain-right-button-wrap {
  grid-column-gap: 7px;
  grid-row-gap: 7px;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
  max-width: 297px;
  text-decoration: none;
  display: flex;
}
.sustain-button {
  grid-column-gap: 10px;
  background-color: var(--color--near-black);
  color: var(--color--white);
  font-weight: var(--_font-weight---semi-bold);
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  padding: 12px 13px 12px 14px;
  text-decoration: none;
  display: flex;
}
.sustain-badge {
  grid-column-gap: 10px;
  background-color: var(--color--primary-yellow);
  color: var(--color--near-black);
  font-weight: var(--_font-weight---semi-bold);
  border-radius: 50px;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  padding: 12px 14px;
  text-decoration: none;
  display: flex;
}
.sustain-author-description {
  max-width: 254px;
  color: var(--color--near-black);
  font-weight: var(--_font-weight---semi-bold);
}
.purpose-content-block {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 1280px;
  text-decoration: none;
  display: flex;
}
.purpose-widget-block {
  grid-column-gap: 45px;
  grid-row-gap: 45px;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
  text-decoration: none;
  display: flex;
}
.purpose-widget {
  grid-column-gap: 80px;
  grid-row-gap: 80px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 595px;
  text-decoration: none;
  display: flex;
}
.purpose-widget-body {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  text-decoration: none;
  display: flex;
}
.purpose-widget-title {
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-xl);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.purpose-widget-description {
  width: 100%;
  font-size: var(--_typography---paragraph--font-size-s);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.purpose-image {
  border-radius: var(--_border-radius---border-radius-2xl);
  object-fit: cover;
}
.purpose-widget-icon {
  display: flex;
}
.purpose-widget-divider {
  background-color: var(--color--line-gray);
  width: 1px;
}
.nature-content-wrap {
  grid-column-gap: 128px;
  grid-row-gap: 128px;
  flex: 0 auto;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.nature-widget-block {
  grid-column-gap: 56px;
  grid-row-gap: 56px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 522px;
  text-decoration: none;
  display: flex;
}
.nature-widget {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  text-decoration: none;
  display: flex;
}
.nature-widget-title-block {
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 177px;
  text-decoration: none;
  display: flex;
}
.seeding-fill {
  object-fit: cover;
  max-width: 26px;
  overflow: hidden;
}
.nature-widget-title {
  color: var(--color--dark-gray);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.nature-widget-description {
  color: var(--color--dark-gray);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.nature-image {
  border-radius: var(--_border-radius---border-radius-2xl);
  object-fit: cover;
}
.nature-content-block {
  width: 100%;
  max-width: 1064px;
  margin-left: auto;
  margin-right: auto;
}
.responsibility-title {
  max-width: 520px;
  color: var(--color--near-black);
  font-size: var(--_typography---heading--font-size-4xl);
  line-height: var(--_line-height---line-height-s);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.responsibility-content-block {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  text-decoration: none;
  display: flex;
}
.responsibility-image {
  object-fit: cover;
}
.responsibility-tab-link-inner {
  border-bottom: 1px solid var(--color--line-gray);
  cursor: pointer;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding-top: 30px;
  padding-bottom: 30px;
  text-decoration: none;
  display: flex;
}
.responsibility-tab-text-block {
  grid-row-gap: 16px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 460px;
  text-decoration: none;
  display: flex;
  overflow: hidden;
}
.responsibility-tab-link-title {
  grid-column-gap: 12px;
  flex: 0 auto;
  justify-content: flex-start;
  align-items: center;
  text-decoration: none;
  display: flex;
}
.responsibility-tab-icon {
  object-fit: cover;
  max-width: 28px;
  overflow: hidden;
}
.responsibility-tab-title-text {
  color: var(--color--near-black);
  font-family: Urbanist, sans-serif;
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
  text-decoration: none;
}
.learn-more-button {
  grid-column-gap: 6px;
  flex: 0 auto;
  justify-content: flex-start;
  align-items: flex-end;
  display: flex;
}
.learn-more-button-text {
  color: var(--color--medium-gray);
  font-weight: var(--_font-weight---semi-bold);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.learn-more-button-icon {
  border-style: solid;
  border-width: undefinedpx;
  object-fit: fill;
  border-color: #656565;
  max-width: 22px;
}
.responsibility-image-wrap {
  border-radius: 20px;
  width: 100%;
  max-width: 630px;
  overflow: hidden;
}
.responsibility-tab-text-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding-top: 16px;
  display: flex;
}
.responsibility-tab-link {
  border-bottom: 1px solid var(--color--line-gray);
  background-color: var(--color--transparent);
  padding: 30px 0;
}
.responsibility-tab-link[aria-current="page"], .responsibility-tab-link.is-active {
  background-color: var(--color--transparent);
}
.responsibility-tab-description {
  font-weight: var(--_font-weight---medium);
}
.responsibility-tab-link-wrapper {
  border-top: 1px solid var(--color--line-gray);
  flex-flow: column;
  width: 100%;
  max-width: 522px;
  display: flex;
}
.process-widget-block {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-end;
  width: 100%;
  height: 100%;
  position: relative;
}
.process-section {
  background-color: var(--color--near-black);
  height: 400vh;
}
.process-section-sticky {
  height: 100vh;
  padding-top: 48px;
  padding-bottom: 48px;
  position: sticky;
  top: 0;
  overflow: hidden;
}
.process-widget-wrap {
  min-width: 100vw;
}
.process-widget-wrapper {
  overflow: hidden;
}
.process-widget-wrapper.one {
  z-index: 1;
  position: relative;
  overflow: hidden;
}
.process-widget-wrapper.three {
  z-index: 3;
  position: absolute;
  inset: 0%;
}
.process-widget-wrapper.two {
  z-index: 2;
  position: absolute;
  inset: 0%;
}
.sub-title {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  color: #000;
  text-transform: uppercase;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 40px;
  display: flex;
}
.process-widget {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  background-color: var(--color--near-black);
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
  height: 67vh;
  text-decoration: none;
  display: flex;
}
.process-widget-text-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  text-decoration: none;
  display: flex;
}
.process-widget-title {
  color: var(--color--white);
  font-size: var(--_typography---heading--font-size-4xl);
  line-height: var(--_line-height---line-height-s);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.process-widget-description {
  width: 100%;
  color: var(--color--dark-gray);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
  margin-top: 0;
  margin-bottom: 0;
}
.process-widget-image {
  object-fit: cover;
  border-radius: 16px;
  max-width: 630px;
  height: auto;
  overflow: hidden;
}
.process-widget-text-block {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  max-width: 522px;
  text-decoration: none;
  display: flex;
}
.process-widget-no-wrap {
  aspect-ratio: 1;
  background-color: var(--color--primary-yellow);
  border-radius: 14px;
  justify-content: center;
  align-items: center;
  width: 60px;
  display: flex;
  box-shadow: inset 0 -2px 2px 1px #0003, inset 0 2px 12px #00000024;
}
.process-widget-no {
  color: var(--color--near-black);
  font-size: var(--_typography---paragraph--font-size-m);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_typography---letter-spacing--default-spacing);
}
.process-section-title {
  max-width: 608px;
  color: var(--color--white);
  font-size: var(--_typography---heading--font-size-4xl);
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 1280px) {
  .section.more-blog {
    padding-top: var(--_spacing---margin-padding--spacing-3xl);
    padding-bottom: var(--_spacing---margin-padding--spacing-3xl);
  }
  .faq-stickywrap {
    max-width: 303px;
  }
  .contact-wrapper {
    grid-column-gap: var(--_spacing---margin-padding--spacing-2xl);
    grid-row-gap: var(--_spacing---margin-padding--spacing-2xl);
  }
  .news-published-date {
    color: var(--color--near-black);
  }
  .single-news-left-wrap {
    max-width: 847px;
  }
  .innovator-title {
    width: 100%;
    margin-right: 260px;
  }
  .innovator-title-block {
    padding-right: 0;
  }
  .nature-widget {
    grid-column-gap: 70px;
    grid-row-gap: 70px;
  }
  .nature-widget-description {
    width: 100%;
    max-width: 271px;
  }
}
@media screen and (max-width: 991px) {
  body {
    --_typography---paragraph--font-size-xs: 16px;
    --_typography---letter-spacing--default-spacing: -.02em;
    --_typography---heading--font-size-5xl: 64px;
    --_typography---letter-spacing--letter-spacing-5xl: -1.28px;
    --_typography---heading--font-size-4xl: 48px;
    --_typography---letter-spacing--letter-spacing-4xl: -.96px;
    --_typography---heading--font-size-3xl: 40px;
    --_typography---letter-spacing--letter-spacing-3xl: -.8px;
    --_typography---heading--font-size-2xl: 36px;
    --_typography---letter-spacing--letter-spacing-2xl: -.72px;
    --_typography---heading--font-size-xl: 30px;
    --_typography---letter-spacing--letter-spacing-xl: -.6px;
    --_typography---heading--font-size-l: 26px;
    --_typography---letter-spacing--letter-spacing-l: -.52px;
    --_typography---letter-spacing--letter-spacing-xs: -.32px;
    --_typography---paragraph--font-size-s: 20px;
    --_typography---letter-spacing--letter-spacing-s: -.4px;
    --_typography---paragraph--font-size-m: 22px;
    --_typography---letter-spacing--letter-spacing-m: -.44px;
    --_typography---heading--display-text: 80px;
    --_typography---paragraph--font-size-xxs: 14px;
    --_spacing---margin-padding--spacing-none: 0px;
    --_spacing---margin-padding--spacing-3xl: 80px;
    --_spacing---margin-padding--spacing-l: 50px;
    --_spacing---margin-padding--spacing-6xl: 160px;
    --_spacing---margin-padding--spacing-7xl: 160px;
    --_spacing---margin-padding--spacing-4xl: 100px;
    --_spacing---margin-padding--spacing-2xl: 60px;
    --_spacing---margin-padding--spacing-5xl: 100px;
    --_spacing---margin-padding--spacing-s: 25px;
    --_spacing---margin-padding--spacing-m: 35px;
    --_spacing---margin-padding--spacing-xl: 50px;
    --_spacing---margin-padding--spacing-xs: 20px;
    --_border-radius---circle-round: 50%;
    --_border-radius---border-radius-s: 12px;
    --_border-radius---border-radius-xl: 16px;
    --_border-radius---border-radius-m: 12px;
    --_border-radius---border-radius-l: 14px;
    --_border-radius---border-radius-2xl: 20px;
    --_border-radius---border-radius-xs: 10px;
    --_border-radius---border-radius-3xl: 24px;
  }
  .two-section-wrap {
    padding-top: 0;
    padding-left: 15px;
    padding-right: 15px;
  }
  .section.call-to-action {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .section.password {
    padding-bottom: var(--_spacing---margin-padding--spacing-4xl);
  }
  .section.contact {
    padding-bottom: var(--_spacing---margin-padding--spacing-none);
  }
  .section.about-hero {
    padding-top: var(--_spacing---margin-padding--spacing-6xl);
    padding-bottom: var(--_spacing---margin-padding--spacing-4xl);
  }
  .section.hero {
    padding-top: var(--_spacing---margin-padding--spacing-6xl);
    padding-bottom: 60px;
  }
  .section.blog, .section.is-about {
    padding-bottom: var(--_spacing---margin-padding--spacing-none);
  }
  .cta-wrap {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    max-width: 520px;
  }
  .copyright-wrap {
    padding-top: 20px;
  }
  .footer-wrap {
    justify-content: flex-end;
    align-items: flex-start;
  }
  .subscribe-form-wrap {
    margin-top: 25px;
  }
  .footer-menu-wrap {
    display: none;
  }
  .footer-menu-wrap.desktop-off {
    grid-template-columns: 1fr 1fr 1fr;
    max-width: 100%;
    margin-top: 40px;
    display: grid;
  }
  .footer-single-title {
    margin-bottom: 28px;
  }
  .footer-social-wrap {
    flex-flow: row;
    justify-content: flex-start;
    align-items: flex-start;
  }
  .social-link {
    width: 50px;
    height: 50px;
  }
  .utility-top-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .utility-single-wrap.font {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
  }
  .utility-title-wrap {
    margin-bottom: 35px;
  }
  .color-wrap {
    grid-row-gap: 25px;
    grid-template-columns: 1fr 1fr;
  }
  .color-single-item {
    height: 240px;
  }
  .typography-wrap {
    grid-column-gap: 35px;
    grid-row-gap: 35px;
  }
  .typography-ctg-wrap {
    margin-bottom: 20px;
    padding: 20px 16px;
  }
  .typography-flex-wrap, .typography-single-item {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }
  .theme-button:where(.theme-button-mobile-hide) {
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .navbar {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .navbar-button-wrap {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
  }
  .nav-menu-wrap {
    background-color: var(--color--white);
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    max-width: 100%;
    height: 85vh;
    padding-top: 15px;
    padding-left: 16px;
    padding-right: 16px;
    display: flex;
  }
  .nav-link-wrap {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
    border-radius: 0;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    max-width: 100%;
    height: 90%;
    margin-top: 14px;
    padding: 0;
    display: inline-flex;
  }
  .nav-link {
    font-size: 28px;
    line-height: var(--_line-height---line-height-m);
    font-weight: var(--_font-weight---semi-bold);
    letter-spacing: -.56px;
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding: 0;
  }
  .nav-link:hover, .nav-link[aria-current="page"], .nav-link.is-active {
    background-color: var(--color--white);
    color: var(--color--near-black);
  }
  .nav-dropdown {
    margin-left: 0;
    margin-right: 0;
  }
  .dropdown-toggle {
    font-size: 28px;
    line-height: var(--_line-height---line-height-m);
    font-weight: var(--_font-weight---semi-bold);
    letter-spacing: -.56px;
    padding: 0;
  }
  .dropdown-toggle.is-open {
    margin-left: 0;
  }
  .menu-button {
    padding: 0;
  }
  .menu-button.is-open {
    background-color: var(--color--transparent);
  }
  ._404-wrapper {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
  }
  ._404-title-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  ._404-image-wrap {
    max-width: 620px;
  }
  .password-form-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    padding: 24px;
  }
  .changelog-wrap {
    padding: 30px 30px 30px 35px;
  }
  .license-image-wrapper, .license-flex-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .license-image-wrap._01, .license-image-wrap._02, .terms-wrapper {
    max-width: 100%;
  }
  .terms-top-wrap, .terms-wrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }
  .privacy-item-details {
    margin-top: 20px;
  }
  .privacy-list-wrap {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    margin-top: 20px;
  }
  .faq-icon {
    max-width: 20px;
    max-height: 20px;
  }
  .faq-wrap {
    flex-flow: column;
  }
  .faq-stickywrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    justify-content: flex-start;
    align-items: center;
    max-width: 100%;
  }
  .faq-icon-wrap {
    width: 35px;
    min-width: 35px;
    height: 35px;
  }
  .faq-title {
    text-align: center;
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
  }
  .faq-single-wrap {
    padding: 20px;
  }
  .faq-right-wrap {
    max-width: 100%;
  }
  .faq-button-wrap {
    text-align: center;
  }
  .contact-wrapper {
    flex-flow: column;
  }
  .contact-title-wrap {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    max-width: 542px;
  }
  .contact-form-block {
    max-width: 100%;
    padding: 20px;
  }
  .contact-form {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .contact-group-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .contact-textarea-field {
    min-height: 150px;
  }
  .section-top-title, .section-top-title.project {
    max-width: 600px;
  }
  .section-top-details {
    margin-top: 24px;
  }
  .news-grid-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 35px;
    grid-template-columns: 1fr 1fr;
  }
  .news-content-wrap {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .section-title-wrapper.choice {
    margin-bottom: 40px;
  }
  .section-title {
    max-width: 520px;
  }
  .section-title.services {
    max-width: 480px;
  }
  .section-title.benefit {
    max-width: 420px;
  }
  .section-title.team {
    max-width: 520px;
  }
  .section-title.process {
    max-width: 420px;
  }
  .section-title.testimonial {
    max-width: 380px;
  }
  .section-title.mission, .section-title.is-value, .section-title.is-purpose {
    max-width: 440px;
  }
  .section-title.is-nature {
    max-width: 520px;
  }
  .project-flex-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }
  .project-cl-list-wrap.big, .project-cl-list-wrap.small {
    max-width: 100%;
  }
  .project-image-wrap {
    height: 258px;
  }
  .expert-wrap {
    flex-flow: column;
  }
  .expert-image-wrap {
    object-fit: cover;
    max-width: 100%;
    height: 500px;
  }
  .expert-grid-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .expert-icon-wrap {
    width: 60px;
    height: 60px;
  }
  .expert-icon {
    max-width: 30px;
    max-height: 30px;
  }
  .service-link-wrap {
    padding: 24px;
  }
  .service-left-item {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
  }
  .impact-counter-wrap {
    flex-flow: column;
    justify-content: space-between;
    padding: 30px 20px;
    display: flex;
  }
  .counter-overflow {
    height: 64px;
  }
  .counter-overflow.about {
    height: 48px;
  }
  .compare-wrap {
    width: 1000px;
    overflow: auto;
  }
  .compare-all-wrap {
    overflow: auto;
  }
  .secondary-button {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .benefits-single-wrap {
    max-width: 100%;
  }
  .benefits-single-wrap.right {
    max-width: 100%;
    margin-left: 0;
  }
  .benefit-dot-wrap {
    order: -9999;
  }
  .benefits-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    justify-content: flex-start;
    align-items: center;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  .benefit-details-wrap {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    max-width: 100%;
  }
  .benefit-border-wrap {
    inset: 0% auto 0% 6px;
  }
  .benefits-wrapper {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    flex-flow: column;
  }
  .career-top-grid {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-columns: 1fr 1fr;
  }
  .career-single-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    padding-bottom: 24px;
  }
  .career-content-wrap {
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 100%;
  }
  .career-details-wrap.desktop-off {
    display: block;
  }
  .career-details-wrap.desktop-on {
    display: none;
  }
  .career-button {
    flex: none;
  }
  .career-cl-list {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }
  .pricing-tabs-content {
    margin-top: 20px;
    padding-left: 20px;
  }
  .pricing-all-item-wrap {
    grid-row-gap: 30px;
    grid-template-columns: 1fr;
    place-items: stretch start;
  }
  .pricing-grid-wrap {
    padding-left: 20px;
    padding-right: 20px;
  }
  .planet-tabs-menu {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }
  .planet-video-wrap {
    height: 520px;
  }
  .planet-wrap {
    grid-template-columns: 1fr 1fr;
  }
  .team-wrap {
    grid-row-gap: 40px;
    grid-template-columns: 1fr 1fr;
  }
  .about-flex-wrap {
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
  }
  .about-left-wrap {
    order: 9999;
    max-width: 100%;
    display: flex;
  }
  .about-right-wrap {
    order: 9999;
    max-width: 100%;
  }
  .about-right-wrap.bottom {
    grid-template-columns: 1fr 1fr;
    max-width: 100%;
  }
  .about-single-wrap {
    height: 200px;
  }
  .about-subtitle-wrap {
    margin-bottom: 20px;
  }
  .hero-wrapper {
    height: auto;
    padding-top: 0;
  }
  .power-title {
    max-width: 100%;
  }
  .power-content-wrap {
    width: 100%;
    max-width: 100%;
  }
  .power-icon-wrap {
    width: 80px;
    height: 80px;
  }
  .power-icon {
    max-width: 30px;
    max-height: 30px;
  }
  .power-item-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    margin-top: 20px;
  }
  .power-image-wrapper {
    max-width: 100%;
  }
  .choice-slide-wrap {
    grid-column-gap: 120px;
    grid-row-gap: 120px;
    height: auto;
    max-height: none;
    padding: 30px 24px;
  }
  .choice-top-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .choice-icon-wrap {
    width: 60px;
    height: 60px;
  }
  .choice-image-wrap {
    height: 225px;
    top: 30px;
  }
  .choice-image-wrap._02 {
    height: 300px;
    top: 60px;
  }
  .process-single-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .process-right-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: column;
  }
  .process-details-wrap {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    max-width: 100%;
  }
  .process-number-wrap {
    width: 40px;
    min-width: 40px;
    height: 40px;
  }
  .testimonial-wrapper {
    padding-top: var(--_spacing---margin-padding--spacing-4xl);
    padding-bottom: var(--_spacing---margin-padding--spacing-4xl);
  }
  .testimonial-wrap {
    padding-left: 15px;
    padding-right: 15px;
  }
  .testimonial-slide {
    padding: 16px;
  }
  .testimonial-single-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .testimonial-content-wrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .testimonial-counter-title {
    margin-top: 10px;
  }
  .counter-unit {
    padding-top: 20px;
  }
  .testimonial-top-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .blog-top-wrap {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }
  .blog-top-title-wrap {
    margin-left: auto;
    margin-right: auto;
  }
  .blog-top-title {
    text-align: center;
  }
  .blog-top-details-wrap {
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    margin-top: 16px;
    margin-left: auto;
    margin-right: auto;
  }
  .blog-top-details {
    text-align: center;
    max-width: 420px;
  }
  .checkout-right-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-basis: 320px;
  }
  .checkout-left-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .error-state {
    margin-left: 20px;
    margin-right: 20px;
  }
  .checkout-title-wrap, .checkout-content-wrap, .shipping-method {
    padding: 16px;
  }
  .checkout-input-wrap {
    flex-flow: column;
  }
  .single-pricing-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    margin-top: 30px;
  }
  .single-pricing-right-wrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }
  .single-price-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    padding: 20px;
  }
  .single-service-top-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .single-news-title-wrap {
    max-width: 520px;
  }
  .single-news-left-wrap, .single-news-right-wrap {
    max-width: 100%;
  }
  .single-news-wrap {
    flex-flow: row;
  }
  .single-news-content {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    padding: 20px;
  }
  .single-news-submit {
    background-position: 60%;
  }
  .single-project-image {
    max-height: none;
  }
  .single-project-flex {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .dropdown-navigation {
    transform: none;
  }
  .dropdown-menu-wrap {
    border-style: none;
  }
  .menu-title {
    font-size: var(--_typography---paragraph--font-size-s);
    line-height: var(--_line-height---line-height-l);
    font-weight: var(--_font-weight---medium);
    text-align: left;
    letter-spacing: var(--_typography---letter-spacing--letter-spacing-s);
    display: block;
  }
  .nav-contact-wrap {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    display: flex;
  }
  .nav-email {
    color: var(--color--near-black);
    font-size: var(--_typography---paragraph--font-size-xs);
    line-height: var(--_line-height---line-height-l);
    font-weight: var(--_font-weight---medium);
    text-align: left;
    letter-spacing: var(--_typography---letter-spacing--letter-spacing-xs);
  }
  .privacy-wrap, .privacy-top-wrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }
  .privacy-wrapper {
    max-width: 100%;
  }
  .nav-menu {
    width: 100%;
    max-width: 100%;
    height: 100%;
    overflow: auto;
  }
  .nav-menu-flex-wrap {
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    max-width: 100%;
    height: 100%;
    padding-bottom: 72px;
    display: flex;
  }
  .humbarger {
    width: 40px;
    height: 40px;
    overflow: hidden;
  }
  .hero-title-block {
    max-width: 440px;
  }
  .about-top-content {
    max-width: 450px;
  }
  .about-stats-block {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .about-bottom-right {
    max-width: 450px;
  }
  .stats-content-block {
    flex-flow: column;
  }
  .stats-left {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    max-width: none;
  }
  .stats-left-bottom {
    max-width: none;
  }
  .stats-right {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    max-width: none;
  }
  .stats-right-bottom {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .choice-tab-link {
    width: 100%;
  }
  .choice-tab-link[aria-current="page"], .choice-tab-link.is-active {
    max-width: none;
  }
  .choice-tabs-menu {
    flex-flow: column;
  }
  .innovator-title-block {
    padding-right: 80px;
  }
  .value-card-block {
    grid-template-columns: 1fr 1fr;
  }
  .sustain-right-card {
    background-position: 0 0, 50% 15%;
    background-size: auto, cover;
    max-width: none;
    min-height: 450px;
  }
  .sustain-content-block {
    flex-flow: column;
  }
  .sustain-right-button-wrap {
    max-width: none;
  }
  .sustain-button, .sustain-badge {
    width: 100%;
  }
  .purpose-content-block {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .purpose-widget-block {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
  }
  .purpose-widget {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .nature-content-wrap {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
    flex-flow: column;
    align-items: stretch;
  }
  .nature-widget-block {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .team-blank {
    display: none;
  }
  .responsibility-title {
    max-width: 400px;
  }
  .responsibility-content-block {
    flex-flow: column;
    align-items: stretch;
  }
  .responsibility-tab-link-inner {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .responsibility-tab-text-block.one, .responsibility-image-wrap {
    max-width: none;
  }
  .responsibility-tab-text-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .responsibility-tab-link-wrapper {
    max-width: none;
  }
  .process-widget-block {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    align-items: stretch;
    display: flex;
  }
  .process-widget {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    flex-flow: column;
  }
  .process-widget-text-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .process-widget-image {
    object-position: 50% 0%;
    max-width: none;
  }
  .process-widget-text-block {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
    max-width: none;
  }
  .process-widget-no-wrap {
    border-radius: 12px;
    width: 56px;
  }
}
@media screen and (max-width: 767px) {
  body {
    --_typography---paragraph--font-size-xs: 16px;
    --_typography---letter-spacing--default-spacing: -.02em;
    --_typography---heading--font-size-5xl: 48px;
    --_typography---letter-spacing--letter-spacing-5xl: -.96px;
    --_typography---heading--font-size-4xl: 40px;
    --_typography---letter-spacing--letter-spacing-4xl: -.8px;
    --_typography---heading--font-size-3xl: 36px;
    --_typography---letter-spacing--letter-spacing-3xl: -.72px;
    --_typography---heading--font-size-2xl: 30px;
    --_typography---letter-spacing--letter-spacing-2xl: -.6px;
    --_typography---heading--font-size-xl: 28px;
    --_typography---letter-spacing--letter-spacing-xl: -.56px;
    --_typography---heading--font-size-l: 24px;
    --_typography---letter-spacing--letter-spacing-l: -.48px;
    --_typography---letter-spacing--letter-spacing-xs: -.32px;
    --_typography---paragraph--font-size-s: 19px;
    --_typography---letter-spacing--letter-spacing-s: -.38px;
    --_typography---paragraph--font-size-m: 21px;
    --_typography---letter-spacing--letter-spacing-m: -.42px;
    --_typography---heading--display-text: 52px;
    --_typography---paragraph--font-size-xxs: 14px;
    --_spacing---margin-padding--spacing-none: 0px;
    --_spacing---margin-padding--spacing-3xl: 60px;
    --_spacing---margin-padding--spacing-l: 45px;
    --_spacing---margin-padding--spacing-6xl: 140px;
    --_spacing---margin-padding--spacing-7xl: 140px;
    --_spacing---margin-padding--spacing-4xl: 80px;
    --_spacing---margin-padding--spacing-2xl: 50px;
    --_spacing---margin-padding--spacing-5xl: 80px;
    --_spacing---margin-padding--spacing-s: 20px;
    --_spacing---margin-padding--spacing-m: 30px;
    --_spacing---margin-padding--spacing-xl: 40px;
    --_spacing---margin-padding--spacing-xs: 16px;
    --_border-radius---circle-round: 50%;
    --_border-radius---border-radius-s: 12px;
    --_border-radius---border-radius-xl: 12px;
    --_border-radius---border-radius-m: 12px;
    --_border-radius---border-radius-l: 12px;
    --_border-radius---border-radius-2xl: 16px;
    --_border-radius---border-radius-xs: 10px;
    --_border-radius---border-radius-3xl: 20px;
  }
  .two-section-wrap {
    padding-left: 0;
    padding-right: 0;
  }
  .section.call-to-action {
    padding-top: 80px;
    padding-bottom: 80px;
    overflow: hidden;
  }
  .cta-wrapper {
    z-index: 1;
    position: relative;
  }
  .cta-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    max-width: 400px;
  }
  .primary-button {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-right: 6px;
  }
  .primary-button-icons {
    padding: 10px 18px;
  }
  .copyright-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    flex-flow: column;
    width: 100%;
    max-width: 100%;
  }
  .copyright-link.desktop-off {
    display: inline-block;
  }
  .copyright-link.mobile-off {
    display: none;
  }
  .copyright-text {
    text-align: center;
  }
  .footer-wrapper {
    display: block;
  }
  .footer-wrap {
    max-width: none;
  }
  .subscribe-wrap {
    max-width: 100%;
  }
  .subscribe-form-wrap {
    width: 100%;
    max-width: 100%;
    margin-top: 20px;
  }
  .footer-menu-wrap {
    display: none;
  }
  .footer-menu-wrap.desktop-off {
    margin-top: 30px;
  }
  .footer-single-wrap.mobile-off {
    display: none;
  }
  .footer-single-wrap.mobile-on {
    margin-top: 30px;
    display: block;
  }
  .footer-single-title {
    margin-bottom: 24px;
  }
  .social-link {
    width: 45px;
    height: 45px;
  }
  .social-icon {
    max-width: 20px;
    max-height: 20px;
  }
  .utility-top-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .utility-title-wrap {
    margin-bottom: 30px;
  }
  .color-single-item {
    height: 200px;
  }
  .typography-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .typography-ctg-wrap {
    margin-bottom: 16px;
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .typography-flex-wrap, .typography-single-item {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .style-button-wrap {
    flex-flow: wrap;
  }
  .theme-button:where(.theme-button-mobile-hide) {
    display: none;
  }
  .navbar {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .navbar-button-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .nav-menu-wrap {
    height: 90vh;
  }
  .nav-link {
    letter-spacing: -.48px;
    font-size: 24px;
  }
  .nav-dropdown {
    width: 100%;
    max-width: 100%;
  }
  .dropdown-toggle {
    letter-spacing: -.48px;
    font-size: 24px;
  }
  .menu-button.is-open {
    background-color: var(--color--transparent);
  }
  ._404-wrapper {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  ._404-title-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  ._404-image-wrap {
    max-width: 420px;
  }
  .cta-bg-overlay {
    background-image: linear-gradient(#ffffff87, #fff0);
  }
  .cta-bg-overlay.mobile-off {
    display: none;
  }
  .password-form-wrap {
    padding: 20px;
  }
  .changelog-wrap {
    padding: 24px 24px 24px 30px;
  }
  .terms-top-wrap, .terms-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .terms-single-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .privacy-item-details {
    margin-top: 16px;
  }
  .privacy-list-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    margin-top: 16px;
  }
  .faq-wrap {
    flex-flow: column;
  }
  .faq-stickywrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .faq-title {
    max-width: 340px;
  }
  .faq-single-wrap {
    padding: 20px 16px;
  }
  .faq-right-wrap {
    max-width: 100%;
  }
  .contact-title-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    max-width: 100%;
  }
  .contact-title {
    max-width: 400px;
  }
  .contact-form {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .contact-group-wrap {
    flex-flow: column;
  }
  .contact-textarea-field {
    min-height: 130px;
  }
  .section-top-title {
    max-width: 520px;
  }
  .section-top-title.project {
    max-width: 460px;
  }
  .section-top-details {
    margin-top: 20px;
  }
  .news-grid-wrap {
    grid-row-gap: 30px;
    grid-template-columns: 1fr;
  }
  .news-grid-wrap.top {
    grid-template-columns: 1fr;
  }
  .news-content-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .section-title-wrapper.choice {
    margin-bottom: 32px;
  }
  .section-title {
    max-width: 440px;
  }
  .section-title.services {
    max-width: 400px;
  }
  .section-title.benefit {
    max-width: 320px;
  }
  .section-title.team {
    max-width: 440px;
  }
  .section-title.process {
    max-width: 340px;
  }
  .section-title.testimonial {
    max-width: 300px;
  }
  .section-title.mission, .section-title.is-value, .section-title.is-purpose {
    max-width: 400px;
  }
  .section-title.is-nature {
    max-width: 440px;
  }
  .project-flex-wrap {
    grid-column-gap: var(--_spacing---margin-padding--spacing-m);
    grid-row-gap: var(--_spacing---margin-padding--spacing-m);
    grid-template-columns: 1fr;
  }
  .project-cl-list-wrap.big, .project-cl-list-wrap.small {
    max-width: 100%;
  }
  .project-image-wrap {
    height: 400px;
  }
  .expert-image-wrap {
    height: 450px;
  }
  .expert-grid-wrap {
    grid-template-columns: 1fr;
  }
  .expert-icon-wrap {
    width: 55px;
    height: 55px;
  }
  .expert-icon {
    max-width: 26px;
    max-height: 26px;
  }
  .service-link-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    padding: 20px 16px;
  }
  .service-left-item {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .service-number {
    font-size: var(--_typography---heading--font-size-2xl);
  }
  .service-icon-wrap {
    width: 35px;
    height: 35px;
  }
  .service-item-title {
    font-size: var(--_typography---heading--font-size-2xl);
    letter-spacing: var(--_typography---letter-spacing--letter-spacing-2xl);
  }
  .counter-overflow {
    height: 48px;
  }
  .counter-overflow.about {
    height: 40px;
  }
  .benefits-single-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    max-width: 100%;
  }
  .benefits-single-wrap.right, .benefits-wrap, .benefit-details-wrap {
    max-width: 100%;
  }
  .benefits-wrapper {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .career-top-wrapper {
    overflow: hidden;
  }
  .career-top-grid {
    grid-template-columns: 1fr;
    display: none;
  }
  .career-single-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    justify-content: space-between;
    align-items: flex-end;
    padding-bottom: 20px;
  }
  .career-meta-wrap {
    flex-flow: wrap;
  }
  .career-cl-list {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .pricing-tabs-content {
    padding-left: 16px;
  }
  .pricing-all-item-wrap {
    width: 100%;
    max-width: 100%;
  }
  .pricing-item-wrap {
    max-width: 100%;
  }
  .plan-details._02 {
    max-width: 320px;
  }
  .pricing-grid-wrap {
    grid-template-columns: 1fr;
  }
  .planet-tabs-menu {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    max-width: 100%;
  }
  .planet-video-wrap {
    height: 400px;
  }
  .planet-tab-link {
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
  }
  .team-wrap {
    grid-row-gap: 32px;
    grid-template-columns: 1fr 1fr;
  }
  .about-single-wrap {
    height: 160px;
  }
  .about-slider {
    height: auto;
  }
  .about-border-wrap {
    padding-top: 30px;
  }
  .hero-wrapper {
    padding-top: 0;
  }
  .hero-wrap {
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
  }
  .hero-left-wrap {
    text-align: center;
    max-width: none;
  }
  .hero-right-wrap {
    justify-content: flex-start;
    align-items: center;
  }
  .hero-title {
    text-align: center;
  }
  .power-item-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .power-image-wrapper {
    grid-template-columns: 1fr 1fr;
  }
  .power-image-wrap {
    max-width: 100%;
  }
  .power-image-wrap._03 {
    display: none;
  }
  .power-bottom-wrap {
    grid-template-columns: 1fr 1fr;
  }
  .choice-slide-wrap {
    padding: 20px;
  }
  .choice-icon-wrap {
    width: 55px;
    height: 55px;
  }
  .choice-image-wrap {
    height: 200px;
    top: 30px;
  }
  .choice-image-wrap._02 {
    height: 240px;
    top: 30px;
  }
  .process-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .process-single-wrap {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    flex-flow: column;
  }
  .process-right-wrap {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    max-width: 100%;
  }
  .process-details-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .process-title {
    max-width: 100%;
  }
  .process-line-wrap {
    display: none;
  }
  .testimonial-single-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
  }
  .testimonial-content-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    max-width: 100%;
    padding-top: 0;
    padding-bottom: 0;
  }
  .counter-unit {
    padding-top: 15px;
  }
  .testimonial-top-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .checkout-wrapper {
    flex-flow: column;
  }
  .checkout-right-wrap {
    flex: 0 auto;
    width: 100%;
    max-width: 100%;
    position: static;
  }
  .checkout-left-wrap {
    width: 100%;
    max-width: 100%;
  }
  .error-state {
    margin-left: 16px;
    margin-right: 16px;
  }
  .single-pricing-wrap {
    flex-flow: column;
  }
  .single-pricing-left-wrap {
    max-width: 100%;
    position: static;
    top: 0;
  }
  .single-career-meta {
    grid-template-columns: 1fr 1fr;
  }
  .career-button-wrap {
    margin-top: 25px;
  }
  .career-rich-details h3:where(:not([class*="heading-scale-"])), .career-rich-details :where(.heading-scale-3) {
    margin-bottom: 16px;
  }
  .career-rich-details h4:where(:not([class*="heading-scale-"])), .career-rich-details :where(.heading-scale-4) {
    margin-top: 25px;
    margin-bottom: 16px;
  }
  .career-rich-details ul, .career-rich-details ol {
    margin-top: 16px;
  }
  .single-service-top-wrap {
    max-width: 100%;
  }
  .meta-wrap {
    grid-column-gap: 16px;
    max-width: 100%;
  }
  .meta-wrap.project {
    margin-bottom: 40px;
  }
  .news-rich-details h3:where(:not([class*="heading-scale-"])), .news-rich-details h4:where(:not([class*="heading-scale-"])), .news-rich-details :where(.heading-scale-3), .news-rich-details :where(.heading-scale-4) {
    margin-bottom: 16px;
  }
  .single-news-wrap {
    flex-flow: column;
  }
  .single-news-content {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    position: static;
  }
  .single-news-submit {
    background-position: 67%;
  }
  .single-project-content-wrap {
    max-width: 100%;
    margin-left: 0;
  }
  .project-cl-multi-image {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .single-project-flex {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    flex-flow: column;
  }
  .dropdown-navigation {
    width: 420px;
  }
  .dropdown-navigation.is-open {
    width: auto;
  }
  .dropdown-flex-wrap {
    grid-column-gap: 15px;
    grid-row-gap: 40px;
    flex-flow: wrap;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }
  .dropdown-menu-wrap {
    padding: 20px 20px 30px;
  }
  .privacy-wrap, .privacy-top-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .nav-menu {
    height: 85%;
  }
  .nav-menu-flex-wrap {
    padding-bottom: 132px;
  }
  .humbarger {
    width: 35px;
    height: 35px;
  }
  .copyright-link-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 100%;
    display: flex;
  }
  .project-rich-v2-details ul {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .career-marquee {
    display: block;
  }
  .career-marquee-flex {
    display: flex;
  }
  .career-single-marquee {
    flex: none;
    display: flex;
  }
  .career-marquee-image-wrap {
    border-radius: var(--_border-radius---border-radius-l);
    flex: none;
    width: 340px;
    margin-right: 20px;
    overflow: hidden;
  }
  .hero-title-block {
    max-width: 370px;
  }
  .about-top {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
    flex-flow: column;
  }
  .about-top-content {
    max-width: none;
  }
  .about-stats-block {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
  }
  .about-bottom-content {
    flex-flow: column;
    align-items: stretch;
  }
  .about-bottom-right {
    max-width: none;
  }
  .stats-content-block {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .stats-right, .stats-right-bottom {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
  }
  .innovator-title {
    max-width: none;
  }
  .innovator-content-block {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    flex-flow: column;
  }
  .innovator-overlay {
    display: none;
  }
  .innovator-title-block {
    width: 100%;
    padding-right: 0;
  }
  .value-card {
    min-height: 300px;
    padding: 24px;
  }
  .sustain-top-left-card {
    padding: 16px;
  }
  .sustain-top-right-card {
    max-width: none;
    padding: 16px;
  }
  .sustain-left-top {
    flex-flow: column;
  }
  .sustain-bottom-right-card {
    padding: 16px;
  }
  .sustain-left-bottom {
    flex-flow: column;
  }
  .sustain-bottom-left-card {
    padding: 16px;
  }
  .sustain-right-card {
    min-height: 426px;
    padding: 16px;
  }
  .purpose-widget-block {
    flex-flow: column;
  }
  .purpose-widget {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
  }
  .purpose-widget-body {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .purpose-widget-divider {
    width: 100%;
    height: 1px;
  }
  .nature-content-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .nature-widget-block {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
  }
  .nature-widget {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
  }
  .responsibility-title {
    max-width: 330px;
  }
  .responsibility-tab-link-inner {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .responsibility-image-wrap {
    border-radius: 16px;
  }
  .responsibility-tab-text-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    padding-top: 12px;
  }
  .process-widget-block, .process-widget {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
  }
  .process-widget-text-wrap {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .process-widget-text-block {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
  }
  .process-widget-no-wrap {
    border-radius: 10px;
    width: 52px;
  }
}
@media screen and (max-width: 479px) {
  body {
    --_typography---paragraph--font-size-xs: 16px;
    --_typography---letter-spacing--default-spacing: -.02em;
    --_typography---heading--font-size-5xl: 40px;
    --_typography---letter-spacing--letter-spacing-5xl: -.8px;
    --_typography---heading--font-size-4xl: 32px;
    --_typography---letter-spacing--letter-spacing-4xl: -.64px;
    --_typography---heading--font-size-3xl: 30px;
    --_typography---letter-spacing--letter-spacing-3xl: -.6px;
    --_typography---heading--font-size-2xl: 28px;
    --_typography---letter-spacing--letter-spacing-2xl: -.56px;
    --_typography---heading--font-size-xl: 26px;
    --_typography---letter-spacing--letter-spacing-xl: -.52px;
    --_typography---heading--font-size-l: 22px;
    --_typography---letter-spacing--letter-spacing-l: -.44px;
    --_typography---letter-spacing--letter-spacing-xs: -.32px;
    --_typography---paragraph--font-size-s: 18px;
    --_typography---letter-spacing--letter-spacing-s: -.36px;
    --_typography---paragraph--font-size-m: 20px;
    --_typography---letter-spacing--letter-spacing-m: -.4px;
    --_typography---heading--display-text: 48px;
    --_typography---paragraph--font-size-xxs: 14px;
    --_spacing---margin-padding--spacing-none: 0px;
    --_spacing---margin-padding--spacing-3xl: 50px;
    --_spacing---margin-padding--spacing-l: 40px;
    --_spacing---margin-padding--spacing-6xl: 120px;
    --_spacing---margin-padding--spacing-7xl: 120px;
    --_spacing---margin-padding--spacing-4xl: 60px;
    --_spacing---margin-padding--spacing-2xl: 40px;
    --_spacing---margin-padding--spacing-5xl: 60px;
    --_spacing---margin-padding--spacing-s: 20px;
    --_spacing---margin-padding--spacing-m: 25px;
    --_spacing---margin-padding--spacing-xl: 35px;
    --_spacing---margin-padding--spacing-xs: 16px;
    --_border-radius---circle-round: 50%;
    --_border-radius---border-radius-s: 10px;
    --_border-radius---border-radius-xl: 10px;
    --_border-radius---border-radius-m: 10px;
    --_border-radius---border-radius-l: 10px;
    --_border-radius---border-radius-2xl: 12px;
    --_border-radius---border-radius-xs: 10px;
    --_border-radius---border-radius-3xl: 16px;
  }
  .two-section-wrap {
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .section.call-to-action {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .cta-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    max-width: 280px;
  }
  .cta-title {
    font-size: var(--_typography---heading--font-size-4xl);
    letter-spacing: var(--_typography---letter-spacing--letter-spacing-4xl);
  }
  .primary-button {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    padding: 6px 6px 6px 20px;
  }
  .primary-button:where(.primary-button-border), .primary-button:where(.primary-button-mobile) {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    padding-left: 16px;
  }
  .primary-button-texts, .primary-button-texts:where(.primary-button-border) {
    padding-right: 3px;
  }
  .primary-button-icons {
    padding: 10px 20px;
  }
  .primary-button-icons:where(.primary-button-border), .primary-button-icons:where(.primary-button-mobile) {
    padding: 12px 16px;
  }
  .copyright-wrap {
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    flex-flow: column;
  }
  .copyright-text {
    order: 9999;
  }
  .subscribe-form {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    flex-flow: column;
    align-items: stretch;
  }
  .subscribe-email {
    padding-top: 12px;
    padding-bottom: 12px;
    padding-right: 8px;
  }
  .subscribe-button {
    position: static;
  }
  .footer-menu-wrap.desktop-off {
    grid-row-gap: 30px;
    grid-template-columns: 1fr 1fr;
    margin-top: 25px;
  }
  .footer-single-wrap.mobile-on {
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    margin-top: 0;
    display: flex;
  }
  .footer-single-title {
    margin-bottom: 16px;
  }
  .footer-social-wrap {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    flex-flow: wrap;
  }
  .utility-title-wrap {
    margin-bottom: 25px;
  }
  .color-wrap {
    grid-row-gap: 20px;
    grid-template-columns: 1fr;
  }
  .color-single-item {
    height: 180px;
  }
  .typography-wrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }
  .typography-ctg-wrap {
    padding: 15px 12px;
  }
  .typography-single-item {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .navbar {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .navbar-button-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .nav-menu-wrap {
    height: 95vh;
  }
  .nav-link {
    letter-spacing: -.44px;
    font-size: 22px;
  }
  .nav-dropdown {
    flex-flow: column;
    display: block;
  }
  .dropdown-toggle {
    letter-spacing: -.44px;
    font-size: 22px;
  }
  ._404-wrapper {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  ._404-title-wrap {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
  }
  ._404-image-wrap {
    max-width: 260px;
  }
  ._404-button {
    max-width: 240px;
  }
  .password-form-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    flex-flow: column;
    padding-left: 16px;
    padding-right: 16px;
  }
  .password-submit {
    transition: color .4s, background-color .4s;
  }
  .password-submit:hover {
    background-color: var(--color--near-black);
    color: var(--color--white);
  }
  .changelog-wrap {
    padding: 20px 20px 20px 25px;
  }
  .license-flex-wrap {
    flex-flow: column;
  }
  .terms-top-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .terms-top-title {
    width: 100%;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
  }
  .faq-icon {
    max-width: 16px;
    max-height: 16px;
  }
  .faq-stickywrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }
  .faq-icon-wrap {
    width: 30px;
    min-width: 30px;
    height: 30px;
  }
  .faq-title {
    max-width: 300px;
  }
  .faq-single-wrap {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .contact-title-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .contact-title {
    max-width: 300px;
  }
  .contact-single-item {
    flex: 1;
    min-width: 180px;
  }
  .contact-textarea-field {
    min-height: 120px;
  }
  .section-top-title {
    max-width: 340px;
  }
  .section-top-title.project {
    max-width: 340px;
    font-size: var(--_typography---heading--font-size-4xl);
    letter-spacing: var(--_typography---letter-spacing--letter-spacing-4xl);
  }
  .section-top-title.career {
    font-size: var(--_typography---heading--font-size-4xl);
    letter-spacing: var(--_typography---letter-spacing--letter-spacing-4xl);
  }
  .section-top-details {
    margin-top: 16px;
  }
  .section-title-wrapper.is-team, .section-title-wrapper.is-value {
    position: sticky;
    top: 40px;
  }
  .section-title {
    max-width: 340px;
  }
  .section-title.services {
    max-width: 300px;
  }
  .section-title.benefit {
    max-width: 280px;
  }
  .section-title.team {
    max-width: 320px;
  }
  .section-title.process {
    max-width: 300px;
  }
  .section-title.testimonial {
    max-width: 260px;
  }
  .section-title.mission, .section-title.is-value, .section-title.is-purpose, .section-title.is-nature {
    max-width: 320px;
  }
  .project-flex-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .project-image-wrap {
    height: 300px;
  }
  .expert-image-wrap {
    height: auto;
  }
  .expert-icon-wrap {
    width: 50px;
    height: 50px;
  }
  .expert-icon {
    max-width: 24px;
    max-height: 24px;
  }
  .service-link-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    flex-flow: row;
    justify-content: space-between;
    align-items: flex-start;
    padding: 16px;
  }
  .service-left-item {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
  }
  .service-icon-wrap {
    width: 30px;
    height: 30px;
  }
  .service-item-title {
    font-size: var(--_typography---heading--font-size-xl);
    letter-spacing: var(--_typography---letter-spacing--letter-spacing-xl);
  }
  .counter-overflow {
    height: 40px;
  }
  .counter-overflow.about {
    height: 32px;
  }
  .secondary-button {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .benefits-single-wrap, .benefits-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .benefit-border-wrap {
    height: 84.4%;
  }
  .career-single-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: 16px;
  }
  .career-title-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .career-meta-wrap {
    flex-flow: wrap;
  }
  .career-meta-item {
    padding: 6px 16px;
  }
  .pricing-tabs-content {
    padding-left: 10px;
  }
  .pricing-grid-wrap {
    padding-left: 16px;
    padding-right: 16px;
  }
  .planet-tabs-menu {
    grid-template-columns: 1fr;
  }
  .planet-video-wrap {
    height: 350px;
  }
  .planet-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 20px;
    flex-flow: wrap;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }
  .team-wrap {
    grid-template-columns: 1fr;
  }
  .team-single-wrap {
    border-radius: 10px;
    position: sticky;
    top: 140px;
  }
  .team-image-wrap {
    border-radius: 8px;
  }
  .about-right-wrap.bottom {
    grid-template-columns: 1fr;
  }
  .about-single-wrap {
    height: 140px;
  }
  .impact-list-item {
    flex-flow: column;
  }
  .hero-wrapper {
    padding-bottom: 20px;
  }
  .hero-left-wrap {
    max-width: 100%;
  }
  .hero-title {
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
  }
  .power-item-wrap {
    flex-flow: wrap;
  }
  .power-image-wrapper {
    flex-flow: column;
    grid-template-columns: 1fr;
  }
  .power-image-wrap {
    flex-flow: column;
    position: sticky;
    top: 40px;
  }
  .power-image-wrap._03 {
    display: block;
  }
  .choice-slide-wrap {
    padding: 16px;
  }
  .choice-top-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .choice-image-wrap {
    height: 160px;
    top: 20px;
  }
  .choice-image-wrap._02 {
    height: 200px;
    top: 20px;
  }
  .process-single-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .process-details-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .process-number-wrap {
    width: 35px;
    min-width: 35px;
    height: 35px;
  }
  .testimonial-slide {
    padding-left: 12px;
    padding-right: 12px;
  }
  .counter-unit {
    padding-top: 8px;
  }
  .single-price-wrap {
    padding-left: 16px;
    padding-right: 16px;
  }
  .single-service-top-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .single-news-title-wrap {
    max-width: 360px;
  }
  .meta-wrap {
    flex-flow: wrap;
    display: flex;
  }
  .meta-wrap.project {
    flex-flow: wrap;
    margin-bottom: 30px;
  }
  .single-news-content {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    padding-left: 16px;
    padding-right: 16px;
  }
  .single-news-submit {
    background-position: 78%;
  }
  .single-project-content-wrap {
    max-width: 100%;
    margin-left: 0;
  }
  .project-cl-multi-image-wrap {
    margin-bottom: 16px;
  }
  .project-cl-multi-image {
    grid-template-columns: 1fr;
  }
  .single-project-flex {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .single-project-item-title-wrap {
    max-width: 100%;
  }
  .dropdown-navigation {
    width: auto;
  }
  .dropdown-flex-wrap {
    grid-column-gap: 32px;
    grid-row-gap: 40px;
    grid-template-rows: auto;
    grid-template-columns: 1fr;
    grid-auto-columns: 1fr;
    display: flex;
  }
  .privacy-top-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .nav-menu-flex-wrap {
    padding-bottom: 80px;
  }
  .humbarger {
    width: 30px;
    height: 30px;
  }
  .project-rich-v2-details ul {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .career-marquee-image-wrap {
    width: 280px;
    margin-right: 16px;
  }
  .hero-title-block {
    max-width: 300px;
  }
  .about-top {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
  }
  .about-stats-block {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    flex-flow: column;
  }
  .about-stats-widget {
    max-width: none;
  }
  .value-card-block {
    grid-template-columns: 1fr;
  }
  .value-card {
    padding: 20px;
    position: sticky;
    top: 140px;
  }
  .sustain-top-left-card {
    justify-content: space-between;
    min-height: 350px;
    position: sticky;
    top: 40px;
  }
  .sustain-top-right-card {
    justify-content: space-between;
    min-height: 350px;
    position: sticky;
    top: 50px;
  }
  .sustain-bottom-right-card {
    justify-content: space-between;
    min-height: 350px;
    position: sticky;
  }
  .sustain-bottom-left-card {
    min-height: 350px;
    position: sticky;
    top: 40px;
  }
  .sustain-right-card {
    min-height: 350px;
  }
  .sustain-right-button-wrap {
    grid-column-gap: 13px;
    grid-row-gap: 13px;
    flex-flow: column;
  }
  .process-widget-no-wrap {
    width: 48px;
  }
}
#node-_4325dd11-440c-dab9-1c21-1bfa6b2fcb4b-a89b3df9, #node-_703cd23b-112d-fe01-70d0-8cf31c15d5f9-a89b3df9, #node-c70da987-7095-b4fe-3e5f-b6878c4b9136-a89b3df9, #node-e59563a0-116d-2031-8f03-1582033651ed-a89b3df9 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}
#node-_21b895ef-f682-82ab-93bf-ae101396f107-9471e104, #node-_3cff6ccb-e1af-425f-4328-05fdc55381e7-9471e104 {
  grid-area: 1 / 2 / 2 / 4;
}
#node-_924cfc16-d021-a8b5-1038-7f60f04ef5cc-9471e104, #node-ab5b85b2-2465-f6ef-80a5-623dd0812f39-9471e104 {
  grid-area: 1 / 2 / 2 / 5;
}
#node-_2d1bc7fe-954e-1821-d353-e665a36c3adf-460d2144, #node-_2d1bc7fe-954e-1821-d353-e665a36c3b66-460d2144 {
  grid-area: 1 / 2 / 2 / 4;
}
@media screen and (max-width: 991px) {
  #node-_21b895ef-f682-82ab-93bf-ae101396f107-9471e104, #node-_3cff6ccb-e1af-425f-4328-05fdc55381e7-9471e104 {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }
}
/* ======================================================================
   4. Components (hand-written)
   ====================================================================== */
/* ======================================================================
   GREENAXIS components -- vanilla replacements for the Webflow runtime and for its
   IX2 / IX3 interactions.

   Every value here was read out of the export's own payload (see
   inspect_ix2.py), not invented: the durations, the easings, the percentages
   and the colours are the ones Webflow would have animated to. Where a
   behaviour needed no JavaScript it is a rule; where it needed measurement it
   is a class main.js moves.

   The colours are `var(--color--*)` throughout, because the design sheet
   already declares every swatch IX2 referenced by id.
   ====================================================================== */

/* ------------------------------------------------------------- utilities */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 10000;
  padding: 12px 20px;
  background: var(--color--near-black);
  color: var(--color--white);
  font-size: 15px;
  text-decoration: none;
}
.skip-link:focus {
  left: 0;
}
/* A visible focus ring everywhere. The export relied on the UA default and
   then removed it in four places (`.w-dropdown-toggle:focus`, `.w-slider-arrow-*:focus`, `.w-nav-button:focus`, `.w-dropdown-link:focus`
   all set `outline: 0`), which is how a keyboard user loses the cursor. Those
   rules are dropped with the rest of the runtime; this puts the ring back. */
:focus-visible {
  outline: 2px solid var(--color--near-black);
  outline-offset: 2px;
}
/* ================================================================ reveals
   Webflow's `slideInBottom` and `growIn` presets. Both are
   `useFirstGroupAsInitialState`, so group 0 -- `opacity: 0` -- is the rest
   state the export baked inline and clean_style stripped; group 1 is where
   the motion starts (100px below, or scale 0.75) and group 2 is 1000ms
   `outQuart` to rest.

   Two things about the shape of this, both learned the hard way:

   * the rest state is gated on `.js`. Without that, a reader with scripting
     off gets a blank page, because nothing would ever add `.is-revealed`.
   * the played state is an ANIMATION, not a transition. A `transition:`
     shorthand on a reveal wrapper DELETES whatever transition the element
     already had -- and several of these elements are also hover targets. An
     animation composes instead of replacing.
   ====================================================================== */
:where(.js) .reveal {
  opacity: 0;
}
:where(.js) .reveal.reveal-up {
  transform: translate3d(0, 100px, 0);
}
:where(.js) .reveal.reveal-grow {
  transform: scale(.75);
}
.reveal.is-revealed {
  animation: reveal-up 1000ms cubic-bezier(.165, .84, .44, 1) both;
}
.reveal.reveal-grow.is-revealed {
  animation-name: reveal-grow;
}
@keyframes reveal-up {
  from { opacity: 0; transform: translate3d(0, 100px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes reveal-grow {
  from { opacity: 0; transform: scale(.75); }
  to { opacity: 1; transform: scale(1); }
}
/* The stagger. Eight distinct delays across the payload, written as
   attribute rules so the markup carries the number rather than a class per
   step. `both` above holds the rest state through the delay. */
.reveal[data-reveal-delay="100"] { animation-delay: 100ms; }
.reveal[data-reveal-delay="200"] { animation-delay: 200ms; }
.reveal[data-reveal-delay="250"] { animation-delay: 250ms; }
.reveal[data-reveal-delay="300"] { animation-delay: 300ms; }
.reveal[data-reveal-delay="400"] { animation-delay: 400ms; }
.reveal[data-reveal-delay="500"] { animation-delay: 500ms; }
.reveal[data-reveal-delay="600"] { animation-delay: 600ms; }
.reveal[data-reveal-delay="700"] { animation-delay: 700ms; }
/* Two reveals in the payload are breakpoint-gated, and THE REST STATE HAS TO
   BE GATED WITH THEM. main.js will not add `.is-revealed` outside the gate, so an ungated `opacity: 0` would hide the element permanently at the widths
   where the interaction never runs -- and the parity harness cannot see it, because it forces reveals visible on both sides before measuring. */
@media (min-width: 992px) {
  :where(.js) .reveal[data-reveal-mq="below-main"],
  :where(.js) .reveal[data-reveal-mq="small"] {
    opacity: 1;
    transform: none;
  }
}
@media (min-width: 768px) {
  :where(.js) .reveal[data-reveal-mq="small"] {
    opacity: 1;
    transform: none;
  }
}
/* ============================================================ page load
   a-54 "Logomark Rotate": PAGE_START on all 24 pages, spinning the navbar's
   `<img class="logomark">` from 0 to 360deg over 5000ms, once. The event
   targets the page and only the action item names the element, which is why
   this is a rule rather than a hook.
   ====================================================================== */
.logomark {
  animation: logomark-spin 5000ms linear 1;
}
@keyframes logomark-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
/* a-56 "Career Marquee": PAGE_START, `small, tiny` ONLY -- a 20000ms loop
   translating `.career-single-marquee` to -100% and snapping back. The media
   query IS the payload's `mediaQueries` field; running it ungated would
   animate an element the design hides on desktop, forever. */
@media (max-width: 767px) {
  .career-single-marquee {
    animation: marquee-x 20000ms linear infinite;
  }
}
@keyframes marquee-x {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}
/* =============================================================== navbar */
/* The hamburger, from `documents/black.json` -- two buns and two crossing
   bars over 98 frames. `.humbarger` keeps the design's own 40/35/30px box;
   these four spans are what used to be an SVG renderer. */
.hamburger {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}
.hamburger-bar {
  position: absolute;
  left: 15%;
  width: 70%;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  transition: transform .3s ease, opacity .3s ease;
}
.hamburger-bar.is-top { top: 28%; }
.hamburger-bar.is-mid, .hamburger-bar.is-mid-2 { top: calc(50% - 1px); }
.hamburger-bar.is-bottom { top: 72%; }
/* Open: the buns slide into the middle and fade, the two middle bars cross.
   That is the lottie's own choreography -- it is why the source draws four
   layers rather than three. */
.menu-button[aria-expanded="true"] .hamburger-bar.is-top, .menu-button[aria-expanded="true"] .hamburger-bar.is-bottom {
  opacity: 0;
  transform: translateY(0);
}
.menu-button[aria-expanded="true"] .hamburger-bar.is-top {
  transform: translateY(calc(50% + 6px));
}
.menu-button[aria-expanded="true"] .hamburger-bar.is-bottom {
  transform: translateY(calc(-50% - 6px));
}
.menu-button[aria-expanded="true"] .hamburger-bar.is-mid {
  transform: rotate(45deg);
}
.menu-button[aria-expanded="true"] .hamburger-bar.is-mid-2 {
  transform: rotate(-45deg);
}
/* The open panel below 992px. `.nav-menu-wrap` gets its look from the design
   (white, column, 85vh); framework.hand.css gives it the absolute box. This
   is only the scroll lock's companion -- the page behind must not scroll. */
body.is-nav-open {
  overflow: hidden;
}
/* ------------------------------------------------------------- dropdown
   a-7 / a-43 "Dropdown Hover In / Out", 500ms `ease`:
     the toggle goes near-black with white text, the panel opens from height 0 to auto, the chevron rotates 180deg.

   Height `auto` cannot be transitioned, so the panel animates
   `grid-template-rows` instead -- and it is `minmax(0, 0fr)`, not `0fr`: a
   bare `0fr` does not collapse the track, which is how an earlier conversion
   shipped a "closed" panel that still took its full height. */
.dropdown-toggle {
  transition: background-color .5s ease, color .5s ease;
}
.nav-dropdown.is-open > .dropdown-toggle {
  background-color: var(--color--near-black);
  color: var(--color--white);
}
.nav-dropdown.is-open .dropdown-chevron {
  transform: rotate(180deg);
}
.dropdown-navigation {
  display: grid;
  grid-template-rows: minmax(0, 0fr);
  transition: grid-template-rows .5s ease;
}
.nav-dropdown.is-open > .dropdown-navigation {
  grid-template-rows: minmax(0, 1fr);
}
/* The grid child that actually clips. `overflow: hidden` has to sit on a
   wrapper inside the track, not on the track itself. */
.dropdown-navigation > * {
  overflow: hidden;
  min-height: 0;
}
/* ==================================================================== FAQ
   `a` / `a-2` "Faq Open / Close", 500ms `ease`: the card inverts to
   near-black with a near-black border, the question and answer go white, the
   plus fades out as the minus fades in, and the panel opens to auto height.
   ====================================================================== */
.faq-single-wrap {
  transition: background-color .5s ease, border-color .5s ease;
}
.faq-question, .faq-answer {
  transition: color .5s ease;
}
.faq-icon {
  transition: opacity .5s ease;
}
.faq-icon.minus {
  opacity: 0;
}
.faq-single-wrap.is-open {
  background-color: var(--color--near-black);
  border-color: var(--color--near-black);
}
.faq-single-wrap.is-open .faq-question, .faq-single-wrap.is-open .faq-answer {
  color: var(--color--white);
}
.faq-single-wrap.is-open .faq-icon.plus { opacity: 0; }
.faq-single-wrap.is-open .faq-icon.minus { opacity: 1; }
.faq-navigation {
  display: grid;
  grid-template-rows: minmax(0, 0fr);
  transition: grid-template-rows .5s ease;
}
.faq-single-wrap.is-open > .faq-navigation {
  grid-template-rows: minmax(0, 1fr);
}
.faq-navigation > * {
  overflow: hidden;
  min-height: 0;
}
/* ================================================================== tabs */
/* a-19 / a-20 "Planet Tab Active / Deactive", 400ms `ease`. */
.planet-icon-wrap {
  transition: background-color .4s ease;
}
.planet-icon {
  transition: opacity .4s ease;
}
.planet-icon._02 { opacity: 0; }
.planet-tab-link.is-active .planet-icon-wrap {
  background-color: var(--color--near-black);
}
.planet-tab-link.is-active .planet-icon._01 { opacity: 0; }
.planet-tab-link.is-active .planet-icon._02 { opacity: 1; }
/* a-63 / a-64 "Choice Tab In / Out". The rest state is scale .7 and -14% on
   the title with both the image and the copy at zero opacity; the played
   state is 300ms to rest. */
.choice-title {
  transform: translateX(-14%) scale(.7);
  transition: transform .3s, opacity .3s;
}
.choice-image, .choice-details {
  opacity: 0;
  transition: opacity .3s;
}
.choice-tab-link.is-active .choice-title {
  transform: translateX(0) scale(1);
}
.choice-tab-link.is-active .choice-image, .choice-tab-link.is-active .choice-details {
  opacity: 1;
}
/* a-60 / a-61 "Pricing Tab N Bg Change", 400ms. The pill slides 76px to the
   right when the second tab is chosen, and the label of whichever tab is NOT
   chosen goes near-black. The pill lives inside tab 1, so the offset is
   measured from there -- 76px is the payload's own number, not a computed
   one. */
.pricing-tab-bg {
  transition: transform .4s cubic-bezier(.455, .03, .515, .955);
}
.pricing-tab-link-text {
  transition: color .4s cubic-bezier(.455, .03, .515, .955);
}
.pricing-tabs-menu[data-active="2"] .pricing-tab-bg {
  transform: translateX(76px);
}
/* a-66 to a-69 "Responsibility Tab N In", 300ms. Four rows; opening one
   collapses the other three to height 0. Same `minmax(0, 0fr)` reason as the
   dropdown. */
.responsibility-tab-text-block {
  display: grid;
  grid-template-rows: minmax(0, 0fr);
  transition: grid-template-rows .3s ease;
}
.responsibility-tab-link-inner[aria-expanded="true"] + .responsibility-tab-text-block, .responsibility-tab-text-block.is-open {
  grid-template-rows: minmax(0, 1fr);
}
.responsibility-tab-text-block > * {
  overflow: hidden;
  min-height: 0;
}
/* The rows became <button>s, so the UA form-control reset has to be undone --
   `font: inherit` alone does NOT bring back `letter-spacing`, `word-spacing`
   or `text-transform`. `:where()` for the same reason as `.tabset-link`
   below: this sheet is emitted after the design, and an un-neutralised reset
   here beats the design's own padding. */
:where(.responsibility-tab-link-inner) {
  display: block;
  width: 100%;
  text-align: inherit;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  font: inherit;
  letter-spacing: inherit;
  word-spacing: inherit;
  text-transform: inherit;
  color: inherit;
}
/* =============================================================== sliders */
/* The track. All three carousels are one line of `display: inline-block`
   slides inside an `overflow: hidden` mask (see framework.hand.css), so the
   move is a transform on the track and the duration is the export's own
   `data-slider-duration`. */
.mask > *, .testimonial-mask > *, .about-mask > * {
  transition: transform .5s ease;
}
/* `data-slider="outin"` is the about slider: Webflow's "cross fade", where the
   outgoing slide fades out as the incoming one fades in rather than sliding.

   A cross-fade needs the slides STACKED, and the framework geometry lays them
   out in a row -- so this is the one slider whose slides come out of the flow.
   `.about-slider` has a fixed 116px height in the design, which is what makes
   `inset: 0` safe here and nowhere else. */
[data-slider="outin"] .about-mask {
  position: relative;
}
[data-slider="outin"] .about-slide-wrap {
  position: absolute;
  inset: 0;
  width: 100%;
  opacity: 0;
  transition: opacity .5s ease;
}
/* a-24 to a-27 "About Slider Active N", 400ms `ease`: the four progress bars, the chosen one at 100% width and the rest at 0. */
.about-active-line {
  width: 0%;
  transition: width .4s ease;
}
.about-slider[data-active="1"] .about-active-line._01, .about-slider[data-active="2"] .about-active-line._02, .about-slider[data-active="3"] .about-active-line._03, .about-slider[data-active="4"] .about-active-line._04 {
  width: 100%;
}
/* a-28 to a-30 "Testimonial Slider Active N", 500ms `ease`: the three
   backdrops cross-fade, and the dot for the shown slide goes yellow while the
   other two are dark grey. */
.testimonial-bg-wrap {
  opacity: 0;
  transition: opacity .5s ease;
}
.testimonial-slider[data-active="1"] .testimonial-bg-wrap._01, .testimonial-slider[data-active="2"] .testimonial-bg-wrap._02, .testimonial-slider[data-active="3"] .testimonial-bg-wrap._03 {
  opacity: 1;
}
/* The dots. Webflow generated these at RUNTIME into an empty container, so
   the export ships nothing here at all and there is no design rule to
   inherit -- the size and gap come from `.slider-nav`'s own flex row, and the
   two colours are the ones a-28 animates. */
.slider-dot {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background-color: var(--color--dark-gray);
  cursor: pointer;
  transition: background-color .5s ease;
}
.slider-dot.is-active {
  background-color: var(--color--primary-yellow);
}
/* ======================================================== slot counter
   a-3 "Counter Number", 2000ms. Two reels of ten digits inside an
   `overflow: hidden` box; reel 1 travels from 0 to -90% and reel 2 from -90%
   to 0, so they land on different digits. The two easings are the payload's
   own -- reel 1 uses `easeInOutQuart`-ish, reel 2 the linear pair -- and they
   are why the two columns do not move in lockstep.
   ====================================================================== */
.counter-numbers {
  transition: transform 2000ms cubic-bezier(.785, .135, .15, .86);
}
.counter-numbers._02 {
  transform: translateY(-90%);
  transition-timing-function: cubic-bezier(.25, .25, .75, .75);
}
[data-counter="roll"].is-rolling .counter-numbers._01 {
  transform: translateY(-90%);
}
[data-counter="roll"].is-rolling .counter-numbers._02 {
  transform: translateY(0);
}
/* ============================================================== scrubs
   Five SCROLLING_IN_VIEW lists. main.js measures the trigger's progress
   through the viewport and writes it back as a custom property or a step
   index; the look is here.
   ====================================================================== */

/* a-62 "Banner Parallex Effect": the hero rises to -25% at the midpoint and
   returns. `--scrub` is 0..1 across the trigger. */
[data-scrub="hero-parallax"] .hero-wrap, [data-scrub="hero-parallax"] {
  will-change: transform;
}
/* a-6 "Benefits Item Scrolling": six dots light in turn as the block passes, and a rule grows between them. main.js writes the lit count. */
.benefit-dot-wrap {
  background-color: var(--color--dark-gray);
  transition: background-color .5s ease;
}
.benefit-border-line {
  height: 0%;
  transition: height .5s ease;
}
[data-scrub="benefits"][data-lit="1"] .benefit-dot-wrap._01, [data-scrub="benefits"][data-lit="2"] .benefit-dot-wrap._01, [data-scrub="benefits"][data-lit="2"] .benefit-dot-wrap._02, [data-scrub="benefits"][data-lit="3"] .benefit-dot-wrap._01, [data-scrub="benefits"][data-lit="3"] .benefit-dot-wrap._02, [data-scrub="benefits"][data-lit="3"] .benefit-dot-wrap._03, [data-scrub="benefits"][data-lit="4"] .benefit-dot-wrap._01, [data-scrub="benefits"][data-lit="4"] .benefit-dot-wrap._02, [data-scrub="benefits"][data-lit="4"] .benefit-dot-wrap._03, [data-scrub="benefits"][data-lit="4"] .benefit-dot-wrap._04, [data-scrub="benefits"][data-lit="5"] .benefit-dot-wrap._01, [data-scrub="benefits"][data-lit="5"] .benefit-dot-wrap._02, [data-scrub="benefits"][data-lit="5"] .benefit-dot-wrap._03, [data-scrub="benefits"][data-lit="5"] .benefit-dot-wrap._04, [data-scrub="benefits"][data-lit="5"] .benefit-dot-wrap._05, [data-scrub="benefits"][data-lit="6"] .benefit-dot-wrap._01, [data-scrub="benefits"][data-lit="6"] .benefit-dot-wrap._02, [data-scrub="benefits"][data-lit="6"] .benefit-dot-wrap._03, [data-scrub="benefits"][data-lit="6"] .benefit-dot-wrap._04, [data-scrub="benefits"][data-lit="6"] .benefit-dot-wrap._05, [data-scrub="benefits"][data-lit="6"] .benefit-dot-wrap._06 {
  background-color: var(--color--near-black);
}
[data-scrub="benefits"] .benefit-border-line {
  height: calc(var(--scrub, 0) * 100%);
}
/* a-33 "Process Scrolling Animation": three steps, each lighting from
   near-black-on-charcoal to white-on-white with a yellow number puck as the
   scroll passes its keyframe (10%, 33%, 56%). Written as a step index rather
   than six transcribed keyframes -- the fades are 500ms either way, so the
   result is the same and the rule says what it means. */
.process-button-wrap, .process-number-wrap, .process-button-text {
  transition: background-color .5s ease, border-color .5s ease, color .5s ease;
}
.process-active-line {
  height: 0%;
  transition: height .5s ease;
}
[data-scrub="process"][data-step="1"] .process-button-wrap._01, [data-scrub="process"][data-step="2"] .process-button-wrap._01, [data-scrub="process"][data-step="2"] .process-button-wrap._02, [data-scrub="process"][data-step="3"] .process-button-wrap._01, [data-scrub="process"][data-step="3"] .process-button-wrap._02, [data-scrub="process"][data-step="3"] .process-button-wrap._03 {
  background-color: var(--color--white);
  border-color: var(--color--white);
}
[data-scrub="process"][data-step="1"] .process-number-wrap._01, [data-scrub="process"][data-step="2"] .process-number-wrap._01, [data-scrub="process"][data-step="2"] .process-number-wrap._02, [data-scrub="process"][data-step="3"] .process-number-wrap._01, [data-scrub="process"][data-step="3"] .process-number-wrap._02, [data-scrub="process"][data-step="3"] .process-number-wrap._03 {
  background-color: var(--color--primary-yellow);
  border-color: var(--color--primary-yellow);
  color: var(--color--near-black);
}
[data-scrub="process"][data-step="1"] .process-button-text._01, [data-scrub="process"][data-step="2"] .process-button-text._01, [data-scrub="process"][data-step="2"] .process-button-text._02, [data-scrub="process"][data-step="3"] .process-button-text._01, [data-scrub="process"][data-step="3"] .process-button-text._02, [data-scrub="process"][data-step="3"] .process-button-text._03 {
  color: var(--color--near-black);
}
[data-scrub="process"][data-step="1"] .process-active-line._01, [data-scrub="process"][data-step="2"] .process-active-line._01, [data-scrub="process"][data-step="2"] .process-active-line._02, [data-scrub="process"][data-step="3"] .process-active-line._01, [data-scrub="process"][data-step="3"] .process-active-line._02, [data-scrub="process"][data-step="3"] .process-active-line._03 {
  height: 100%;
}
/* a-65 "Value Card Scrolling": four cards fanned out (+-122% and +-40%, with
   a +-3deg tilt) that slide together as the section passes. The keyframes are
   at 25% and 45% of the trigger's progress, so the interpolation is over that
   window and the cards are at rest either side of it. */
.value-card {
  will-change: transform;
}
/* a-70 "Process Section Scroll": two rules that wipe to full width, at 45%
   and 60%. */
.process-widget-wrapper.two, .process-widget-wrapper.three {
  width: 0%;
  transition: width .5s ease;
}
[data-scrub="process-stack"][data-step="2"] .process-widget-wrapper.two, [data-scrub="process-stack"][data-step="3"] .process-widget-wrapper.two, [data-scrub="process-stack"][data-step="3"] .process-widget-wrapper.three {
  width: 100%;
}
/* ========================================================= IX3 split text
   The one IX3 interaction: `.power-title-wrap` on the home page, scrubbed
   from "top 100%" to "bottom 50%" with `clamp` and `scrub: 0.8`. Its
   characters go from #656565 to #0e0e0e, staggered 0.03s each.

   The export hid the whole block until IX3 loaded --
   `html.w-mod-js:not(.w-mod-ix3) :is(.power-title-wrap) { visibility: hidden
   !important }` -- which build_head drops with the rest of the inline
   <style>. The equivalent here is that the characters simply start at the
   unfilled colour, so the heading is readable at once whether or not the
   script runs.
   ====================================================================== */
.power-title-wrap .split-char {
  color: var(--color--medium-gray);
  transition: color .4s linear;
}
.power-title-wrap .split-char.is-filled {
  color: var(--color--near-black);
}
/* =========================================================== button hovers
   a-9 / a-10 (theme) and a-11 / a-12 (primary), both 400ms `ease`. Each
   stacks two copies of its label in an `overflow: hidden` box: the first
   rolls up and out at -110% as the second arrives from +110%, while a
   background pane grows from height 0 to 100%.
   ====================================================================== */
.theme-button-bg, .primary-button-bg {
  height: 0%;
  transition: height .4s ease;
}
.theme-button-text, .primary-button-text {
  transition: transform .4s ease, color .4s ease;
}
.theme-button-text._02, .primary-button-text._02 {
  transform: translateY(110%);
}
.theme-button:hover .theme-button-bg, .theme-button:focus-visible .theme-button-bg, .primary-button:hover .primary-button-bg, .primary-button:focus-visible .primary-button-bg {
  height: 100%;
}
.theme-button:hover .theme-button-text._01, .theme-button:focus-visible .theme-button-text._01, .primary-button:hover .primary-button-text._01, .primary-button:focus-visible .primary-button-text._01 {
  transform: translateY(-110%);
}
.theme-button:hover .theme-button-text._02, .theme-button:focus-visible .theme-button-text._02, .primary-button:hover .primary-button-text._02, .primary-button:focus-visible .primary-button-text._02 {
  transform: translateY(0);
}
/* a-9's colour half: the arriving label goes yellow -- EXCEPT on the black
   variant, whose own list holds it at near-black in both groups. */
.theme-button-text._02 {
  color: var(--color--near-black);
}
.theme-button:hover .theme-button-text._02, .theme-button:focus-visible .theme-button-text._02 {
  color: var(--color--primary-yellow);
}
.theme-button:hover .theme-button-text._02.black, .theme-button:focus-visible .theme-button-text._02.black {
  color: var(--color--near-black);
}
/* a-11's icon half: the puck behind the two arrows goes from yellow to white
   while the arrows themselves swap sideways at +-110%. */
.primary-button-icons {
  background-color: var(--color--primary-yellow);
  transition: background-color .4s ease;
}
.primary-button-icon {
  transition: transform .4s ease, opacity .4s ease;
}
.primary-button-icon._02 {
  transform: translateX(-110%);
  opacity: 0;
}
.primary-button:hover .primary-button-icons, .primary-button:focus-visible .primary-button-icons {
  background-color: var(--color--white);
}
.primary-button:hover .primary-button-icon._01, .primary-button:focus-visible .primary-button-icon._01 {
  transform: translateX(110%);
  opacity: 0;
}
.primary-button:hover .primary-button-icon._02, .primary-button:focus-visible .primary-button-icon._02 {
  transform: translateX(0);
  opacity: 1;
}
/* ============================================================ card hovers */
/* a-13 / a-14 "News Image Hover", 400ms; a-17 / a-18 "Team Item Hover", 500ms. Both scale their picture to 1.1. */
.news-image, .team-image {
  transition: transform .4s ease;
}
.team-image {
  transition-duration: .5s;
}
.news-image-wrap:hover .news-image, .news-image-wrap:focus-visible .news-image { transform: scale(1.1); }
.team-single-wrap:hover .team-image { transform: scale(1.1); }
/* a-15 / a-16 "Career Item Hover", 500ms: a rule wipes across the row. */
.career-border-line {
  width: 0%;
  transition: width .5s ease;
}
.career-single-wrap:hover .career-border-line, .career-single-wrap:focus-within .career-border-line {
  width: 100%;
}
/* a-38 / a-39 "Service Item Hover", 500ms: the row's border goes yellow, a
   pane fills it from the bottom, the number and title come up from grey to
   near-black, and the two icons swap on a diagonal. */
.service-link-wrap {
  transition: border-color .5s ease;
}
.service-item-bg {
  height: 0%;
  transition: height .5s ease;
}
.service-number, .service-item-title {
  color: var(--color--dark-gray);
  transition: color .5s ease;
}
.service-icon {
  transition: transform .5s ease;
}
.service-icon._02 {
  transform: translate(-110%, 110%);
}
.service-link-wrap:hover, .service-link-wrap:focus-visible {
  border-color: var(--color--primary-yellow);
}
.service-link-wrap:hover .service-item-bg, .service-link-wrap:focus-visible .service-item-bg { height: 100%; }
.service-link-wrap:hover .service-number, .service-link-wrap:hover .service-item-title, .service-link-wrap:focus-visible .service-number, .service-link-wrap:focus-visible .service-item-title {
  color: var(--color--near-black);
}
.service-link-wrap:hover .service-icon._01, .service-link-wrap:focus-visible .service-icon._01 {
  transform: translate(110%, -110%);
}
.service-link-wrap:hover .service-icon._02, .service-link-wrap:focus-visible .service-icon._02 {
  transform: translate(0, 0);
}
/* a-57 / a-58 / a-59 "Power Image 0N Hover In", 400ms. Three panels that
   share a row: the hovered one is 400x200 and the other two are 202x200.
   Because they are siblings, one rule on the shared parent reproduces all
   three lists at once.

   THE REST STATE IS NOT IN EITHER STYLESHEET. The export writes it in a
   `<style>` block in the <head> --
   `html.w-mod-js:not(.w-mod-ix) [data-w-id="..."] { width: 400px; height:
   200px }` and two at 202px -- which build_head drops with the rest of the
   inline styles. Without these three lines the panels would size themselves
   from their content and the row would not add up. The gate is the export's
   own: the block is wrapped in `min-width: 992px` and `768-991px`. */
@media (min-width: 768px) {
  .power-image-wrap {
    transition: width .4s ease, height .4s ease;
  }

  .power-image-wrap._01 { width: 400px; height: 200px; }
  .power-image-wrap._02 { width: 202px; height: 200px; }
  .power-image-wrap._03 { width: 202px; height: 200px; }

  .power-images:hover .power-image-wrap { width: 202px; }
  .power-images .power-image-wrap:hover { width: 400px; }
}
/* ====================================================== background video */
/* A reader who has asked for reduced motion gets the still frame instead of
   the video. The export could not do this: its fallback <img> was inside a
   `<noscript>`, so the only reader who could ever see it was one with
   scripting off -- and the `@media (prefers-reduced-motion)` rule inside that
   `<noscript>`'s `<style>` was therefore unreachable for everyone else. */
@media (prefers-reduced-motion: reduce) {
  .planet-video > video {
    display: none;
  }

  [data-video-still] {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -100;
  }
}
/* main.js pauses the video when the reader asks it to; this is what the
   still does while it is paused. */
.planet-video.is-paused > video { opacity: 0; }
.planet-video.is-paused [data-video-still] {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -100;
}
/* =================================================================== cart
   The drawer, on the export's own commerce classes so the design still
   paints it. clean_style stripped the inline `display: none` the runtime used
   as its closed state (see RUNTIME_HIDDEN), so the closed state is stated
   here instead -- as a rule the open class can beat.
   ====================================================================== */
.wf-commerce-commercecartcontainerwrapper {
  display: none;
}
.wf-commerce-commercecartcontainerwrapper.is-open {
  display: flex;
}
/* Empty and filled are mutually exclusive; main.js sets `.has-items` on the
   wrapper when the basket is not empty. */
.wf-commerce-commercecartform, .wf-commerce-commercecarterrorstate, .wf-commerce-commercecheckouterrorstate, .wf-commerce-commercepaypalcheckouterrorstate {
  display: none;
}
.is-open.has-items .wf-commerce-commercecartform { display: block; }
.is-open.has-items .wf-commerce-commercecartemptystate { display: none; }
.wf-commerce-commercecarterrorstate.is-shown, .wf-commerce-commercecheckouterrorstate.is-shown, .wf-commerce-commercepaypalcheckouterrorstate.is-shown {
  display: block;
}
/* The remove control became a <button>; the design styles `.remove-button` as
   the <a> it used to be, so the reset is `:where()`d out of the cascade. */
:where(.remove-button) {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  font: inherit;
  letter-spacing: inherit;
  word-spacing: inherit;
  text-transform: inherit;
  color: inherit;
}
/* ============================================== the tab and slider controls
   Every tab link and both slider arrows became <button>s. A <button> does not
   inherit `font`, and -- the part `font: inherit` does NOT fix -- it also
   drops the inherited `letter-spacing`, `word-spacing` and `text-transform`
   through the UA form-control reset. Stating all four is what keeps a
   retagged control measuring exactly what the <a> measured.

   WRAPPED IN `:where()`, AND THAT IS THE WHOLE POINT.

   This sheet is emitted LAST, after the design. A bare `.tabset-link` scores
   (0, 1, 0) and therefore BEATS the design's own `.pricing-tab-link` -- so the
   `padding: 0` below, which exists only to undo the UA button padding, was
   also undoing the design's `7px 10px`. Every tab in the Monthly/Yearly strip
   measured 22px instead of 36, and the pricing hero came out 14px short.

   `:where()` scores zero, so the UA default is still replaced and every real
   rule in the design still wins. */
:where(.tabset-link) {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  font: inherit;
  letter-spacing: inherit;
  word-spacing: inherit;
  text-transform: inherit;
  color: inherit;
  text-align: inherit;
}
.tabset-pane {
  display: none;
}
.tabset-pane.is-active {
  display: block;
}
/* ================================================= reduced motion, global
   Everything above is decoration. A reader who has asked for less of it gets
   the end state immediately rather than nothing at all -- reveals in
   particular must still END VISIBLE, or the page is blank.
   ====================================================================== */
@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal.is-revealed {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }

  .logomark,
  .career-single-marquee {
    animation: none !important;
  }

  *,
  *::before,
  *::after {
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}