@charset "UTF-8";
:root {
  /* Puchix / Sitework portfolio tokens */
  --color--site-bg: #faf6f5;
  --color--primary: #f5fe90;
  --color--secondary: #80b700;
  --color--dark: black;
  --color--light: white;
  --color--grey-1: #616161;
  --color--grey-2: #c3c3c2;
  --color--transparent: #0000;
  /* Compat met bestaande Sitework theme-variabelen */
  --backBlack: #000;
  --text: #000;
  --primary: #f5fe90;
  --secondary: #80b700;
  --lightGray: #c3c3c2;
  --dark-gray: #616161;
  --rgb-backBlack: 0, 0, 0;
  --rgb-text: 0, 0, 0;
  --rgb-primary: 245, 254, 144;
  --rgb-secondary: 128, 183, 0;
  --rgb-lightGray: 195, 195, 194;
  --bodyFont: 'Urbanist';
  --bodyFontType: 'sans-serif';
  --headingFont: 'Urbanist';
  --headingFontType: 'sans-serif';
  --sitework: 'Urbanist';
  --siteworkType: 'sans-serif';
  --baseFontSize: 18px;
  --baseLineHeight: 1.5;
  --borderRadius: 12px;
  --sw-breakpoint-sm: 480px;
  --sw-breakpoint-md: 768px;
  --sw-breakpoint-lg: 992px;
  --sw-breakpoint-xl: 1200px;
  --sw-breakpoint-xxl: 1440px;
}

.headingfont {
  font-family: var(--headingFont), var(--headingFontType);
}

h1,
.h1 {
  font-family: var(--headingFont), var(--headingFontType);
  font-size: clamp(29.6662546354px, 23.68px + 1.871vw, 48px);
  font-weight: 600;
  line-height: 1.2;
}

h2,
.h2 {
  font-family: var(--headingFont), var(--headingFontType);
  font-size: clamp(24.7218788628px, 19.733px + 1.559vw, 40px);
  font-weight: 600;
  line-height: 1.2;
}

h3,
.h3 {
  font-family: var(--headingFont), var(--headingFontType);
  font-size: clamp(21.0135970334px, 16.773px + 1.325vw, 34px);
  font-weight: 600;
  line-height: 1.2;
}

h4,
.h4 {
  font-family: var(--headingFont), var(--headingFontType);
  font-size: clamp(12.978986403px, 10.36px + 0.818vw, 21px);
  font-weight: 600;
  line-height: 1.2;
}

h5,
.h5 {
  font-family: var(--headingFont), var(--headingFontType);
  font-size: clamp(11.1248454883px, 8.88px + 0.702vw, 18px);
  font-weight: 600;
  line-height: 1.2;
}

h6,
.h6 {
  font-family: var(--headingFont), var(--headingFontType);
  font-size: clamp(11.1248454883px, 8.88px + 0.702vw, 18px);
  font-weight: 600;
  line-height: 1.2;
}

a {
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  color: var(--text-color);
}
a:visited {
  color: var(--text-color);
}
a:hover {
  color: var(--primary);
}
a:active {
  color: var(--text-color);
}

.standaard-content h1, .standaard-content h2, .standaard-content h3, .standaard-content h4, .standaard-content h5, .standaard-content h6,
.standaard-content .h1, .standaard-content .h2, .standaard-content .h3, .standaard-content .h4, .standaard-content .h5, .standaard-content .h6 {
  margin-bottom: 0.85rem;
}
.standaard-content p {
  font-weight: 400;
  line-height: normal;
  margin-bottom: 0.85rem;
}
.standaard-content p > * {
  font-weight: 400;
}
.standaard-content a:not(.btn) {
  color: var(--primary) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  text-decoration-thickness: 2px !important;
}
.standaard-content a:not(.btn):hover {
  color: var(--primary-dark) !important;
}
.standaard-content strong {
  font-weight: 700;
  color: var(--primary);
}
.standaard-content ul {
  list-style: disc;
  padding-left: 1.5rem;
  margin-bottom: 0.85rem;
}
.standaard-content ul li {
  font-weight: 400;
  margin-bottom: 0.125rem;
}
.standaard-content ol {
  list-style: decimal;
  padding-left: 1.5rem;
  margin-bottom: 0.85rem;
}
.standaard-content ol li {
  font-weight: 400;
  margin-bottom: 0.125rem;
}

.swiper-pagination.swiper-pagination-lock {
  display: none !important;
}

/* SITEWORK - consolidated stylesheet (hand-cleaned Webflow export).
   1 reset  2 base framework (load-bearing rules, renamed .wf-)
   2b widget geometry the dropped runtime rules used to provide
   3 Sitework design (incl. the renamed commerce layout)
   4 components (vanilla replacements for the Webflow runtime and
   its IX2 interactions).
   Fonts: assets/fonts/fonts.css (Urbanist, self-hosted woff2). */
/* ======================================================================
   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, .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 {
  -webkit-box-sizing: content-box;
          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] {
  -webkit-box-sizing: border-box;
          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-)
   ====================================================================== */
[class^=w-icon-], [class*=" w-icon-"] {
  font-family: "webflow-icons" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

* {
  -webkit-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, h2, h3, h4, h5, h6, .heading-scale-1, .heading-scale-2, .heading-scale-3, .heading-scale-4, .heading-scale-5, .heading-scale-6 {
  font-weight: bold;
  margin-bottom: 10px;
}

h1, .heading-scale-1 {
  font-size: 38px;
  line-height: 44px;
  margin-top: 20px;
}

h2, .heading-scale-2 {
  font-size: 32px;
  line-height: 36px;
  margin-top: 20px;
}

h3, .heading-scale-3 {
  font-size: 24px;
  line-height: 30px;
  margin-top: 20px;
}

h4, .heading-scale-4 {
  font-size: 18px;
  line-height: 24px;
  margin-top: 10px;
}

h5, .heading-scale-5 {
  font-size: 14px;
  line-height: 20px;
  margin-top: 10px;
}

h6, .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;
  -ms-grid-column: 1;
      grid-column-start: 1;
  -ms-grid-row: 1;
      grid-row-start: 1;
  -ms-grid-column-span: 1;
  grid-column-end: 2;
  -ms-grid-row-span: 1;
  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::-webkit-input-placeholder {
  color: #999;
}

.wf-input::-moz-placeholder {
  color: #999;
}

.wf-input:-ms-input-placeholder {
  color: #999;
}

.wf-input::-ms-input-placeholder {
  color: #999;
}

.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-form-label {
  display: inline-block;
  cursor: pointer;
  font-weight: normal;
  margin-bottom: 0px;
}

.wf-container {
  margin-left: auto;
  margin-right: auto;
  max-width: 940px;
}

.wf-container:before, .wf-container:after {
  content: " ";
  display: table;
  -ms-grid-column: 1;
      grid-column-start: 1;
  -ms-grid-row: 1;
      grid-row-start: 1;
  -ms-grid-column-span: 1;
  grid-column-end: 2;
  -ms-grid-row-span: 1;
  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;
  -ms-grid-column: 1;
      grid-column-start: 1;
  -ms-grid-row: 1;
      grid-row-start: 1;
  -ms-grid-column-span: 1;
  grid-column-end: 2;
  -ms-grid-row-span: 1;
  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 .richtext-figure-selected.richtext-figure-type-video div:after, .richtext .richtext-figure-selected[data-rt-type=video] div:after {
  outline: 2px solid #2895f7;
}

.richtext .richtext-figure-selected.richtext-figure-type-image div, .richtext .richtext-figure-selected[data-rt-type=image] div {
  outline: 2px solid #2895f7;
}

.richtext figure.richtext-figure-type-video > div:after, .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 figcaption.richtext-figcaption-placeholder {
  opacity: 0.6;
}

.richtext figure div {
  font-size: 0px;
  color: transparent;
}

.richtext figure.richtext-figure-type-image, .richtext figure[data-rt-type=image] {
  display: table;
}

.richtext figure.richtext-figure-type-image > div, .richtext figure[data-rt-type=image] > div {
  display: inline-block;
}

.richtext figure.richtext-figure-type-image > figcaption, .richtext figure[data-rt-type=image] > figcaption {
  display: table-caption;
  caption-side: bottom;
}

.richtext figure.richtext-figure-type-video, .richtext figure[data-rt-type=video] {
  width: 60%;
  height: 0;
}

.richtext figure.richtext-figure-type-video iframe, .richtext figure[data-rt-type=video] iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.richtext figure.richtext-figure-type-video > div, .richtext figure[data-rt-type=video] > div {
  width: 100%;
}

.richtext figure.richtext-align-center {
  margin-right: auto;
  margin-left: auto;
  clear: both;
}

.richtext figure.richtext-align-center.richtext-figure-type-image > div, .richtext figure.richtext-align-center[data-rt-type=image] > div {
  max-width: 100%;
}

.richtext figure.richtext-align-normal {
  clear: both;
}

.richtext figure.richtext-align-fullwidth {
  width: 100%;
  max-width: 100%;
  text-align: center;
  clear: both;
  display: block;
  margin-right: auto;
  margin-left: auto;
}

.richtext figure.richtext-align-fullwidth > div {
  display: inline-block;
  padding-bottom: inherit;
}

.richtext figure.richtext-align-fullwidth > figcaption {
  display: block;
}

.richtext figure.richtext-align-floatleft {
  float: left;
  margin-right: 15px;
  clear: none;
}

.richtext figure.richtext-align-floatright {
  float: right;
  margin-left: 15px;
  clear: none;
}

.tabset {
  position: relative;
}

.tabset:before, .tabset:after {
  content: " ";
  display: table;
  -ms-grid-column: 1;
      grid-column-start: 1;
  -ms-grid-row: 1;
      grid-row-start: 1;
  -ms-grid-column-span: 1;
  grid-column-end: 2;
  -ms-grid-row-span: 1;
  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;
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
/* ======================================================================
   2b. Widget geometry the dropped rules used to provide
   ====================================================================== */
/* Geometry the dropped Webflow widget rules used to provide.
 *
 * build_css drops the `.w-nav*` / `.w-dropdown*` / `.w-icon-*` rules because the
 * runtime that drove them is gone. Those rules also carried real layout that the
 * design sheet silently relies on, so it is transcribed here against this
 * design's own class names and emitted BETWEEN the framework and the design --
 * the design then keeps overriding it exactly as it did in the export.
 *
 * Everything in this file was read off webflow.css; nothing is invented. */
/* ---- navbar ------------------------------------------------------------- */
/* `.w-nav` -- the design overrides background and z-index, not position. */
.navbar-container {
  position: relative;
}

/* `.w-nav-brand`. Its `float: left` did nothing (the parent is flex), but the
   padding below 767px is real -- and there the design zeroes it again. */
.navbar-brand {
  position: relative;
  text-decoration: none;
  padding-left: 10px;
}

/* `.w-nav-menu`. `float: right` was likewise inert on a flex item. */
.nav-menu-wrapper {
  position: relative;
}

/* `.w-nav-button` -- hidden above the collapse breakpoint (`data-collapse
   ="medium"`, so 991px). The design turns it into a 32px flex box at <=991px, which is exactly where the runtime used to show it. */
.menu-button {
  position: relative;
  display: none;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* The runtime lifted the open menu into a generated `.w-nav-overlay` wrapper.
   That wrapper is written into the markup instead, and above the collapse
   breakpoint `display: contents` takes it back out of the box tree so
   `.nav-menu-wrapper` stays a direct flex child of `.navbar-wrapper`. */
.nav-overlay {
  display: contents;
}

@media screen and (max-width: 991px) {
  /* `.w-nav[data-collapse='medium'] .w-nav-menu { display: none }
  ` */
  .nav-menu-wrapper {
    display: none;
  }
  /* `.w-nav-overlay` */
  .nav-overlay {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 100%;
    overflow: hidden;
  }
  .nav-overlay.is-open {
    display: block;
    overflow: visible;
  }
  /* `[data-nav-menu-open]` was the one declaration the runtime forced past the
       design sheet, plus `.w-nav-overlay [data-nav-menu-open] { top: 0 }
  `. */
  .nav-overlay.is-open .nav-menu-wrapper {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    min-width: 200px;
    text-align: center;
    overflow: visible;
  }
}
/* ---- nav dropdown ------------------------------------------------------- */
/* `.w-dropdown` */
.nav-dropdown {
  position: relative;
  display: inline-block;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  z-index: 900;
}

/* `.w-dropdown-toggle`. The design replaces the 40px right padding with 18px
   and adds its own type, so only the box, the cursor and the nowrap survive. */
.nav-dropdown-toggle {
  position: relative;
  display: inline-block;
  vertical-align: top;
  text-align: left;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  padding-right: 40px;
  margin-left: auto;
  margin-right: auto;
}

/* `.w-dropdown-list` + `.w-dropdown-list.w--open`. Note this is
   `.nav-dropdown-list-WRAP`: `.nav-dropdown-list` is one of the design's own
   class names, for the three columns inside the panel. The design's
   `left: -544px` on the open desktop panel is what centres it under the nav, so losing the `.w--open` -> `.is-open` remap does not merely change a colour;
   the panel lands hard against its toggle and overflows the viewport. */
.nav-dropdown-list-wrap {
  position: absolute;
  display: none;
  min-width: 100%;
}

.nav-dropdown-list-wrap.is-open {
  display: block;
}

/* `.w-icon-dropdown-toggle`. The glyph came from Webflow's icon webfont
   (U+E603); it is an inline <svg> in the markup now, so only the box remains.
   The design then sets `margin-right: 0; font-size: 12px`. */
.nav-dropdown-icon {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  margin-right: 20px;
  width: 1em;
  height: 1em;
}

.nav-dropdown-icon svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: currentColor;
}

/* ---- widgets rebuilt as native elements --------------------------------- */
/* Four things the runtime drove as a <div> or an <a> are real <button>s now:
   the tab links, the accordion rows, the mobile menu toggle and the dropdown
   toggle. That drags in the UA button styling -- a 2px outset border, a grey
   background and 13.33px Arial -- none of which the design sheet overrides, because it never had a button to override.

   `:where()` scores zero, so this beats the UA sheet (author origin always
   does) while losing to every authored rule, including the design's own
   `.nav-dropdown-toggle`, `.faq-question-wrap` and `.menu-button`. */
:where(button.tabset-link, button.menu-button, button.nav-dropdown-toggle, button.cart-open, button.cart-close, button.remove-button, button.cookies-button, button.modal-close) {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  font: inherit;
  color: inherit;
  width: auto;
  text-align: inherit;
  cursor: pointer;
  /* The UA sheet resets these on form controls, and `font: inherit` does NOT
     bring them back -- they are not part of the `font` shorthand. This design
     sets `letter-spacing: -.02em` on its headings and button text and relies on
     it reaching every line; without this the accordion questions measure
     narrower than the export and wrap a line early. */
  letter-spacing: inherit;
  word-spacing: inherit;
  text-transform: inherit;
  text-indent: inherit;
  text-shadow: inherit;
}

/* Webflow's custom checkbox is two elements: a real <input> that is visually
   hidden, and a styled <div> proxy beside it that shows the state.

   The export hid the INPUT with an inline `opacity: 0` -- which the transform's
   baked-state filter strips, because IX2 uses inline opacity for its reveal
   rest states. So the rule is restated here, keyed on the input itself. Keying
   it on `.checkbox-input` hides the PROXY instead and leaves the native
   checkbox on show, which is the opposite of the intent. */
.wf-checkbox input[type=checkbox] {
  opacity: 0;
  position: absolute;
  z-index: -1;
}

/* Screen-reader-only. The three commerce pages carry no visible page title, so
   transform.py gives each one a heading here rather than promoting a section
   heading that does not name the page. */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ======================================================================
   3. Sitework design
   ====================================================================== */
:root {
  --color--site-bg: #faf6f5;
  --font-weight--font-family: Urbanist, Arial, sans-serif;
  --color--grey-1: #616161;
  --_typography---paragraph-02--font-size: 16px;
  --_typography---paragraph-02--line-height: 24px;
  --font-weight--medium: 500;
  --color--dark: black;
  --_typography---h1--font-size: 62px;
  --_typography---h1--line-height: 70px;
  --font-weight--semi-bold: 600;
  --_typography---h1--letter-spacing: var(--later-spacing--2);
  --_typography---h2--font-size: 56px;
  --_typography---h2--line-height: 62px;
  --_typography---h2--font-weight: var(--font-weight--semi-bold);
  --_typography---h2--letter-spacing: var(--later-spacing--2);
  --_typography---h3--font-size: 42px;
  --_typography---h3--line-height: 50px;
  --_typography---h3--font-weight: var(--font-weight--semi-bold);
  --_typography---h3--letter-spacing: 0px;
  --_typography---h4--font-size: 32px;
  --_typography---h4--line-height: 40px;
  --_typography---h4--font-weight: var(--font-weight--semi-bold);
  --_typography---h4--letter-spacing: var(--later-spacing--2);
  --_typography---h5--font-size: 24px;
  --_typography---h5--line-height: 32px;
  --_typography---h5--font-weight: var(--font-weight--semi-bold);
  --_typography---h5--letter-spacing: var(--later-spacing--2);
  --_typography---h6--font-size: 20px;
  --_typography---h6--line-height: 30px;
  --_typography---h6--font-weight: var(--font-weight--semi-bold);
  --_typography---h6--letter-spacing: var(--later-spacing--2);
  --_typography---paragraph-01--font-size: 18px;
  --_typography---paragraph-01--line-height: 27px;
  --color--light: white;
  --later-spacing--100: 100%;
  --_responsive---padding--padding-80-px: 80px;
  --_responsive---padding--padding-160-px: 160px;
  --_responsive---margin--margin-100-px: 100px;
  --color--secondary: #80b700;
  --_typography---tag--font-size: 14px;
  --_typography---tag--line-height: 20px;
  --later-spacing--2: -.02em;
  --_typography---display-01--font-size: 180px;
  --_typography---display-01--line-height: 180px;
  --font-weight--normal: 400;
  --_typography---display-01--letter-spacing: var(--later-spacing--4);
  --_typography---display-02--font-size: 82px;
  --_typography---display-02--line-height: 88px;
  --_typography---display-02--letter-spacing: var(--later-spacing--4);
  --color--primary: #f5fe90;
  --color--grey-2: #c3c3c2;
  --_typography---button-text--font-size: 16px;
  --_typography---button-text--line-height: 24px;
  --_responsive---border-radius-12-px: 12px;
  --color--transparent: #0000;
  --_responsive---border-radius-10-px: 10px;
  --_responsive---border-radius-8-px: 8px;
  --_responsive---margin--margin-60-px: 60px;
  --_responsive---padding--padding-32-px: 32px;
  --_responsive---border-radius-16-px: 16px;
  --_responsive---margin--margin-80-px: 80px;
  --_responsive---padding--padding-100-px: 100px;
  --_responsive---padding--padding-24-px: 24px;
  --_responsive---padding--padding-134-px: 134px;
  --_responsive---padding--padding-60-px: 60px;
  --_responsive---padding--padding-40-px: 40px;
  --_responsive---padding--padding-30-px: 30px;
  --_responsive---padding--padding-20-px: 20px;
  --_responsive---padding--padding-27-px: 27px;
  --_responsive---margin--margin-160-px: 160px;
  --_responsive---margin--margin-140-px: 140px;
  --_responsive---margin--margin-120-px: 120px;
  --_responsive---margin--margin-96-px: 96px;
  --_responsive---margin--margin-72-px: 72px;
  --_responsive---margin--margin-70-px: 70px;
  --_responsive---padding--padding-173-px: 173px;
  --_responsive---padding--padding-140-px: 140px;
  --later-spacing--1: -.01em;
  --_responsive---padding--padding-120-px: 120px;
  --later-spacing--3: -.03em;
  --_typography---display-01--font-weight: var(--font-weight--normal);
  --_typography---display-02--font-weight: var(--font-weight--medium);
  --_typography---h1--font-weight: var(--font-weight--semi-bold);
  --_responsive---padding--padding-70-px: 70px;
  --later-spacing--4: -.04em;
  --_typography---paragraph-01--font-weight: var(--font-weight--medium);
  --_typography---paragraph-01--letter-spacing: 0px;
  --_typography---paragraph-02--font-weight: var(--font-weight--medium);
  --_typography---paragraph-02--letter-spacing: 0px;
  --_typography---button-text--font-weight: var(--font-weight--semi-bold);
  --_responsive---padding--padding-22-px: 22px;
  --_typography---button-text--letter-spacing: var(--later-spacing--2);
  --_typography---tag--font-weight: var(--font-weight--semi-bold);
  --_typography---tag--letter-spacing: var(--later-spacing--2);
  --font-weight--bold: 700;
}

.wf-commerce-commercecartwrapper {
  display: inline-block;
  position: relative;
}

.wf-commerce-commercecartopenlink {
  color: #fff;
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: #3898ec;
  border-width: 0;
  border-radius: 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 9px 15px;
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  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: rgba(0, 0, 0, 0.8);
  position: fixed;
  inset: 0;
}

.wf-commerce-commercecartcontainerwrapper--cartType-modal {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecartcontainer {
  background-color: #fff;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
  min-width: 320px;
  max-width: 480px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: auto;
  -webkit-box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2509803922);
          box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2509803922);
}

.wf-commerce-commercecartheader {
  border-bottom: 1px solid #e6e6e6;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 16px 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  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 {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecartform {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecartlist {
  -webkit-overflow-scrolling: touch;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  padding: 12px 24px;
  overflow: auto;
}

.wf-commerce-commercecartitem {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  padding-top: 12px;
  padding-bottom: 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecartitemimage {
  width: 60px;
  height: 0%;
}

.wf-commerce-commercecartiteminfo {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  margin-left: 16px;
  margin-right: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecartproductname {
  font-weight: 700;
}

.wf-commerce-commercecartquantity {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecartquantity::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecartquantity:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecartquantity::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecartquantity::placeholder {
  color: #999;
}

.wf-commerce-commercecartquantity:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecartfooter {
  border-top: 1px solid #e6e6e6;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  padding: 16px 24px 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecartlineitem {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  margin-bottom: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecartordervalue {
  font-weight: 700;
}

.wf-commerce-commercecartcheckoutbutton {
  color: #fff;
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  text-align: center;
  background-color: #3898ec;
  border-width: 0;
  border-radius: 2px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 9px 15px;
  text-decoration: none;
  display: block;
}

.wf-commerce-commercecartemptystate {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 100px;
  padding-bottom: 100px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecarterrorstate {
  background-color: #ffdede;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  margin: 0 24px 24px;
  padding: 10px;
}

.wf-checkbox {
  margin-bottom: 5px;
  padding-left: 20px;
  display: block;
}

.wf-checkbox:before {
  content: " ";
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-area: 1/1/2/2;
  display: table;
}

.wf-checkbox:after {
  content: " ";
  clear: both;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-area: 1/1/2/2;
  display: table;
}

.checkbox-input {
  float: left;
  margin: 4px 0 0 -20px;
  line-height: normal;
}

.checkbox-input-custom {
  border: 1px solid #ccc;
  border-radius: 2px;
  width: 12px;
  height: 12px;
}

.checkbox-input-custom.is-checked {
  background-color: #3898ec;
  background-image: url("../images/checkbox-checkmark.svg");
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-color: #3898ec;
}

.checkbox-input-custom.is-focus {
  -webkit-box-shadow: 0 0 3px 1px #3898ec;
          box-shadow: 0 0 3px 1px #3898ec;
}

.wf-commerce-commerceaddtocartform {
  margin: 0 0 15px;
}

.wf-commerce-commerceaddtocartquantityinput {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commerceaddtocartquantityinput::-moz-placeholder {
  color: #999;
}

.wf-commerce-commerceaddtocartquantityinput:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commerceaddtocartquantityinput::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commerceaddtocartquantityinput::placeholder {
  color: #999;
}

.wf-commerce-commerceaddtocartquantityinput:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commerceaddtocartbutton {
  color: #fff;
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: #3898ec;
  border-width: 0;
  border-radius: 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 9px 15px;
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.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-commercelayoutcontainer {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercelayoutmain {
  -webkit-box-flex: 0;
      -ms-flex: 0 800px;
          flex: 0 800px;
  margin-right: 20px;
}

.wf-commerce-commercecheckoutcustomerinfowrapper {
  margin-bottom: 20px;
}

.wf-commerce-commercecheckoutblockheader {
  background-color: #fff;
  border: 1px solid #e6e6e6;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  padding: 4px 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  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 {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutemailinput::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutemailinput:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutemailinput::-ms-input-placeholder {
  color: #999;
}

.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 {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingfullname::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingfullname:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingfullname::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingfullname::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingfullname:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutshippingstreetaddress {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstreetaddress::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstreetaddress:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstreetaddress::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstreetaddress::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstreetaddress:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutshippingstreetaddressoptional {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstreetaddressoptional::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstreetaddressoptional:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstreetaddressoptional::-ms-input-placeholder {
  color: #999;
}

.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: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecheckoutcolumn {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  padding-left: 8px;
  padding-right: 8px;
}

.wf-commerce-commercecheckoutshippingcity {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingcity::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingcity:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingcity::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingcity::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingcity:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutshippingstateprovince {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstateprovince::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstateprovince:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstateprovince::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstateprovince::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingstateprovince:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutshippingzippostalcode {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingzippostalcode::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingzippostalcode:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingzippostalcode::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingzippostalcode::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingzippostalcode:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutshippingcountryselector {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingcountryselector::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingcountryselector:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutshippingcountryselector::-ms-input-placeholder {
  color: #999;
}

.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;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  margin-bottom: 0;
  padding: 16px;
  font-weight: 400;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecheckoutshippingmethoddescriptionblock {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  margin-left: 12px;
  margin-right: 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  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 {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardnumber::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardnumber:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardnumber::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardnumber::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardnumber:focus, .wf-commerce-commercecheckoutcardnumber.-wfp-focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutcardexpirationdate {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardexpirationdate::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardexpirationdate:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardexpirationdate::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardexpirationdate::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardexpirationdate:focus, .wf-commerce-commercecheckoutcardexpirationdate.-wfp-focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutcardsecuritycode {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardsecuritycode::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardsecuritycode:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardsecuritycode::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardsecuritycode::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutcardsecuritycode:focus, .wf-commerce-commercecheckoutcardsecuritycode.-wfp-focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutbillingaddresstogglewrapper {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  display: -webkit-box;
  display: -ms-flexbox;
  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 {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingfullname::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingfullname:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingfullname::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingfullname::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingfullname:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutbillingstreetaddress {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstreetaddress::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstreetaddress:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstreetaddress::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstreetaddress::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstreetaddress:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutbillingstreetaddressoptional {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstreetaddressoptional::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstreetaddressoptional:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstreetaddressoptional::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstreetaddressoptional::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstreetaddressoptional:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutbillingcity {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingcity::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingcity:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingcity::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingcity::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingcity:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutbillingstateprovince {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstateprovince::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstateprovince:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstateprovince::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstateprovince::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingstateprovince:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutbillingzippostalcode {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingzippostalcode::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingzippostalcode:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingzippostalcode::-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingzippostalcode::placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingzippostalcode:focus {
  border-color: #3898ec;
  outline-style: none;
}

.wf-commerce-commercecheckoutbillingcountryselector {
  -webkit-appearance: none;
     -moz-appearance: none;
          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::-webkit-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingcountryselector::-moz-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingcountryselector:-ms-input-placeholder {
  color: #999;
}

.wf-commerce-commercecheckoutbillingcountryselector::-ms-input-placeholder {
  color: #999;
}

.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;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  padding: 4px 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecheckoutorderitemslist {
  margin-bottom: -20px;
}

.wf-commerce-commercecheckoutorderitem {
  margin-bottom: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecheckoutorderitemdescriptionwrapper {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  margin-left: 16px;
  margin-right: 16px;
}

.wf-commerce-commercecheckoutorderitemquantitywrapper {
  white-space: pre-wrap;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercelayoutsidebar {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 320px;
          flex: 0 0 320px;
  position: sticky;
  top: 20px;
}

.wf-commerce-commercecheckoutordersummarywrapper {
  margin-bottom: 20px;
}

.wf-commerce-commercecheckoutsummarylineitem {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-bottom: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecheckoutsummarytotal {
  font-weight: 700;
}

.wf-commerce-commercecheckoutplaceorderbutton {
  color: #fff;
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  text-align: center;
  background-color: #3898ec;
  border-width: 0;
  border-radius: 3px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          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 {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wf-commerce-commercecheckoutsummarytextspacingondiv {
  margin-right: 0.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: 767px) {
  .wf-commerce-commercelayoutcontainer {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
  }
  .wf-commerce-commercelayoutmain {
    -ms-flex-preferred-size: auto;
        flex-basis: auto;
    margin-right: 0;
  }
  .wf-commerce-commercelayoutsidebar {
    -ms-flex-preferred-size: auto;
        flex-basis: auto;
  }
}
@media screen and (max-width: 479px) {
  .wf-commerce-commercecartcontainerwrapper--cartType-modal {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            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 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            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 {
  background-color: var(--color--site-bg);
  font-family: var(--font-weight--font-family);
  color: var(--color--grey-1);
  font-size: var(--_typography---paragraph-02--font-size);
  line-height: var(--_typography---paragraph-02--line-height);
  font-weight: var(--font-weight--medium);
}

h1, .heading-scale-1 {
  color: var(--color--dark);
  font-size: var(--_typography---h1--font-size);
  line-height: var(--_typography---h1--line-height);
  font-weight: var(--font-weight--semi-bold);
  letter-spacing: var(--_typography---h1--letter-spacing);
  margin-top: 0;
  margin-bottom: 0;
}

h2, .heading-scale-2 {
  color: var(--color--dark);
  font-size: var(--_typography---h2--font-size);
  line-height: var(--_typography---h2--line-height);
  font-weight: var(--_typography---h2--font-weight);
  letter-spacing: var(--_typography---h2--letter-spacing);
  margin-top: 0;
  margin-bottom: 0;
}

h3, .heading-scale-3 {
  color: var(--color--dark);
  font-size: var(--_typography---h3--font-size);
  line-height: var(--_typography---h3--line-height);
  font-weight: var(--_typography---h3--font-weight);
  letter-spacing: var(--_typography---h3--letter-spacing);
  margin-top: 0;
  margin-bottom: 0;
}

h4, .heading-scale-4 {
  color: var(--color--dark);
  font-size: var(--_typography---h4--font-size);
  line-height: var(--_typography---h4--line-height);
  font-weight: var(--_typography---h4--font-weight);
  letter-spacing: var(--_typography---h4--letter-spacing);
  margin-top: 0;
  margin-bottom: 0;
}

h5, .heading-scale-5 {
  color: var(--color--dark);
  font-size: var(--_typography---h5--font-size);
  line-height: var(--_typography---h5--line-height);
  font-weight: var(--_typography---h5--font-weight);
  letter-spacing: var(--_typography---h5--letter-spacing);
  margin-top: 0;
  margin-bottom: 0;
}

h6, .heading-scale-6 {
  color: var(--color--dark);
  font-size: var(--_typography---h6--font-size);
  line-height: var(--_typography---h6--line-height);
  font-weight: var(--_typography---h6--font-weight);
  letter-spacing: var(--_typography---h6--letter-spacing);
  margin-top: 0;
  margin-bottom: 0;
}

p {
  font-size: var(--_typography---paragraph-01--font-size);
  line-height: var(--_typography---paragraph-01--line-height);
  font-weight: var(--font-weight--medium);
  margin-bottom: 0;
}

ul {
  margin-top: 0;
  margin-bottom: 10px;
  padding-left: 40px;
}

.utility-page-wrap {
  background-color: var(--color--light);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  height: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.utility-page-content {
  width: var(--later-spacing--100);
  background-color: var(--color--site-bg);
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  padding-top: 180px;
  padding-bottom: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.utility-page-form {
  width: 536px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  padding-left: 20px;
  padding-right: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.page-wrapper {
  position: relative;
}

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

.container {
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.container.hero-container {
  z-index: 2;
  height: var(--later-spacing--100);
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.container.expertise-container {
  z-index: 1;
  position: relative;
}

.container.service-hero-container {
  z-index: 1;
  height: var(--later-spacing--100);
  position: relative;
}

.style-guide {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-160-px);
}

.style-guide-bottom {
  margin-top: var(--_responsive---margin--margin-100-px);
  grid-column-gap: 100px;
  grid-row-gap: 100px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.style-guide-item {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.style-guide-item-left {
  position: sticky;
  top: 25px;
}

.style-guide-item-right {
  width: 768px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.tag-wrap {
  background-color: var(--color--secondary);
  border-radius: 3px;
  padding: 2px 11px;
}

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

.tag {
  color: var(--color--light);
  font-size: var(--_typography---tag--font-size);
  line-height: var(--_typography---tag--line-height);
  font-weight: var(--font-weight--semi-bold);
  letter-spacing: var(--later-spacing--2);
  text-transform: uppercase;
}

.tag.text-secondary {
  color: var(--color--secondary);
}

.typography-list {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.paragraph-01 {
  color: var(--color--grey-1);
  font-family: Urbanist, Arial, sans-serif;
  font-size: var(--_typography---paragraph-01--font-size);
  line-height: var(--_typography---paragraph-01--line-height);
  font-weight: var(--font-weight--medium);
}

.paragraph-01.text-dark._01 {
  margin-left: 8px;
}

.paragraph-01.about-subheading {
  color: rgba(18, 18, 18, 0.7019607843);
}

.paragraph-01.text-white-80 {
  color: rgba(255, 255, 255, 0.8);
}

.paragraph-01.sub-heading-blog {
  max-width: 520px;
}

.display-01 {
  color: var(--color--dark);
  font-size: var(--_typography---display-01--font-size);
  line-height: var(--_typography---display-01--line-height);
  font-weight: var(--font-weight--normal);
  letter-spacing: var(--_typography---display-01--letter-spacing);
  margin-top: 0;
  margin-bottom: 0;
}

.display-02 {
  color: var(--color--dark);
  font-size: var(--_typography---display-02--font-size);
  line-height: var(--_typography---display-02--line-height);
  font-weight: var(--font-weight--medium);
  letter-spacing: var(--_typography---display-02--letter-spacing);
  margin-top: 0;
  margin-bottom: 0;
}

.vertical-line-wrap {
  background-color: var(--color--primary);
  width: 100%;
  height: 1px;
}

.vertical-line {
  background-color: #e1e1e1;
  width: 100%;
  height: 1px;
}

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

.paragraph-02 {
  font-size: var(--_typography---paragraph-02--font-size);
  line-height: var(--_typography---paragraph-02--line-height);
  font-weight: var(--font-weight--medium);
}

.paragraph-02.text-grey-02 {
  color: var(--color--grey-2);
}

.paragraph-02.blog-subtitle {
  color: #767676;
}

.paragraph-02.text-grey-01 {
  color: var(--color--grey-1);
}

.paragraph-02.price-duration {
  color: var(--color--dark);
  margin-bottom: 6px;
}

.button-text {
  color: var(--color--light);
  font-size: var(--_typography---button-text--font-size);
  line-height: var(--_typography---button-text--line-height);
  font-weight: var(--font-weight--semi-bold);
  letter-spacing: var(--later-spacing--2);
}

.button-text.text-dark {
  color: var(--color--dark);
}

.button-text.contact-link {
  max-width: 194px;
  color: var(--color--secondary);
  text-decoration: none;
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
}

.button-text.contact-link:hover {
  color: #540aff;
}

.button-text.license-link {
  color: var(--color--dark);
  text-underline-position: under;
  text-decoration-thickness: 2px;
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
}

.button-text.license-link:hover {
  color: var(--color--secondary);
}

.style-guide-color-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 1fr 24px 1fr 24px 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: -ms-grid;
  display: grid;
}

.style-guide-color-wrap > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.style-guide-color-wrap > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.style-guide-color-wrap > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}

.color-block-wrap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.color-block {
  width: var(--later-spacing--100);
  border-radius: var(--_responsive---border-radius-12-px);
  height: 178px;
}

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

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

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

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

.color-block.bg-light.broder-grey-2 {
  border: 1px solid var(--color--grey-2);
}

.color-block.bggrey-1 {
  background-color: var(--color--grey-1);
}

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

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

.color-block-text {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.button-01 {
  border: 1px solid var(--color--transparent);
  background-color: var(--color--primary);
  border-radius: 100px;
  padding: 12px 24px;
  text-decoration: none;
  position: relative;
  overflow: hidden;
}

.button-01:where(.variant-button-01-hero) {
  padding-top: 19px;
  padding-bottom: 19px;
}

.button-01.pricing-button {
  width: var(--later-spacing--100);
}

.button-01.hero-butoon {
  padding-top: 19px;
  padding-bottom: 19px;
}

.button-01-wrap {
  z-index: 3;
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.button-hover-circle {
  z-index: 2;
  width: var(--later-spacing--100);
  height: var(--later-spacing--100);
  background-color: var(--color--dark);
  -webkit-perspective-origin: 0 100%;
          perspective-origin: 0 100%;
  -webkit-transform-origin: 0 100%;
          transform-origin: 0 100%;
  border-radius: 100px;
  position: absolute;
  inset: auto auto 0% 0%;
  -webkit-transform: translate(0);
          transform: translate(0);
}

.button-01-icon-wrap {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 18px;
  height: 18px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}

.style-guide-button-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  -ms-grid-rows: auto 24px auto;
  grid-template-rows: auto auto;
  -ms-grid-columns: 1fr 24px 1fr;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.style-guide-button-wrap > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.style-guide-button-wrap > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.style-guide-button-wrap > *:nth-child(3) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}

.style-guide-button-wrap > *:nth-child(4) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}

.hero-v1 {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  max-width: 646px;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.hero-v1:where(.variant-hero-v1-width-614) {
  max-width: 614px;
}

.hero-v1._01 {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  max-width: 590px;
}

.hero-v1-heading-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.hero-v1-sub-heading.pricing-details-sub-heading {
  max-width: 476px;
}

.footer {
  padding-top: var(--_responsive---padding--padding-80-px);
  background-color: var(--color--dark);
  color: var(--color--light);
  padding-bottom: 28px;
}

.footer-wrap {
  overflow: hidden;
}

.footer-top {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.footer-bottom {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 194px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.footer-text-link {
  color: var(--color--light);
  text-decoration: none;
  -webkit-transition: color 0.4s;
  transition: color 0.4s;
}

.footer-text-link:hover {
  color: var(--color--secondary);
}

.footer-text-link.footer-link-text-02 {
  color: var(--color--primary);
}

.footer-text-link.footer-link-text-02:hover {
  color: var(--color--secondary);
}

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

.footer-top-left {
  width: 370px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.footer-top-right {
  width: 506px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.sub-heading-wrap.faq-sub-heading {
  width: 365px;
}

.sub-heading-wrap.presence-sub-heading {
  width: 388px;
  max-width: var(--later-spacing--100);
}

.social-link-list {
  width: 44px;
  height: 44px;
  overflow: hidden;
}

.social-link-list.first-one {
  margin-left: -14px;
}

.social-link {
  width: var(--later-spacing--100);
}

.footer-right-01 {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row;
          flex-flow: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.footer-right-02 {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.footer-right-02._01 {
  width: var(--later-spacing--100);
}

.footer-info-box {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.footer-info-link {
  text-decoration: none;
}

.navbar-right {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.close-button {
  border-radius: var(--_responsive---border-radius-10-px);
  background-color: var(--color--primary);
  cursor: pointer;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.button-02-arrow {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

.hide {
  display: none;
}

.remove-button {
  color: red;
  text-decoration: none;
}

.navbar-container {
  z-index: 5;
  background-color: var(--color--transparent);
  width: 100%;
  max-width: 1360px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.cart-list {
  padding-left: 20px;
  padding-right: 20px;
}

.nav-link {
  color: var(--color--dark);
  border-radius: 100px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  padding: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  text-decoration: none;
  -webkit-transition: color 0.4s;
  transition: color 0.4s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.nav-link:hover, .nav-link[aria-current=page], .nav-link.is-active {
  color: var(--color--grey-1);
}

.paragraph-03 {
  color: #08090a;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.error-state {
  background-color: #fff;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.cart-header {
  border-bottom-color: #ebebeb;
}

.navbar-center {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.navbar-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.cart-button {
  border-radius: var(--_responsive---border-radius-8-px);
  background-color: var(--color--primary);
  width: 100%;
  color: var(--color--dark);
  text-align: center;
  letter-spacing: -0.02em;
  padding: 12px 10px;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  text-decoration: none;
  -webkit-transition: color 0.3s, background-color 0.3s;
  transition: color 0.3s, background-color 0.3s;
}

.cart-button:hover {
  color: #fff;
  background-color: #08090a;
}

.mobile-margin-top-10 {
  display: none;
}

.navbar-left {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.cart-quantity {
  background-color: var(--color--secondary);
  color: #fff;
  font-weight: 500;
  position: absolute;
  inset: 0% 0% auto auto;
}

.cart-option-item {
  margin-bottom: 0;
}

.button-02-arrow-group {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 24px;
  height: 24px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  overflow: hidden;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.paragraph-6 {
  color: #01030b;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.cart-link {
  background-color: rgba(56, 152, 236, 0);
  padding: 8px 10px 8px 8px;
}

.nav-item {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  margin-bottom: 0;
}

.cart-text {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.menu-button {
  width: 32px;
  height: 32px;
}

.paragraph-7 {
  color: #08090a;
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
}

.paragraph-7.cart-error {
  color: red;
}

.nav-menu {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.button-04 {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.nav-button-wrapper {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.menu-lottie {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}

.paragraph-text-08 {
  color: #1f1f1f;
  font-size: 18px;
  font-weight: 600;
  line-height: 150%;
}

.paragraph-text-08.button-04-text {
  line-height: 28px;
}

.cart-option-list {
  margin-top: 0;
}

.error-text {
  color: red;
}

.cart-container {
  border-radius: 0;
}

.paragraph-8 {
  color: #08090a;
  margin-bottom: 0;
  font-size: 22px;
  font-weight: 400;
  line-height: 28px;
}

.button-04-text-wrap {
  height: 28px;
  overflow: hidden;
}

.cart-footer {
  border-top-color: #ebebeb;
}

.navbar {
  z-index: 9999;
  padding-top: 20px;
  padding-bottom: 20px;
  position: relative;
}

.nav-dropdown-list-wrap {
  background-color: #fff;
  border-radius: 12px;
}

.nav-dropdown-list-wrap.is-open {
  padding-top: 10px;
  padding-bottom: 10px;
}

.nav-dropdown-list-wrap.shadow-three.mobile-shadow-hide {
  background-color: rgba(255, 255, 255, 0);
}

.nav-dropdown-list-wrap.shadow-three.mobile-shadow-hide.is-open {
  padding-top: 10px;
  padding-bottom: 0;
}

.nav-dropdown-list-wrap.shadow-three.mobile-shadow-hide.pages.is-open {
  padding-top: 16px;
  left: -544px;
}

.nav-dropdown-toggle {
  color: var(--color--dark);
  margin-top: 2px;
  padding: 0 18px 0 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}

.nav-dropdown-toggle:focus-visible, .nav-dropdown-toggle[data-wf-focus-visible] {
  outline-offset: 0px;
  color: #0050bd;
  border-radius: 5px;
  outline: 2px solid #0050bd;
}

.nav-dropdown-list.left {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  padding-right: 40px;
}

.nav-dropdown-list.center {
  border-left: 1px dashed rgba(0, 0, 0, 0.1019607843);
  border-right: 1px dashed rgba(0, 0, 0, 0.1019607843);
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  padding-left: 40px;
  padding-right: 40px;
}

.nav-dropdown-list.right {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  padding-left: 40px;
}

.dropdown-page-link-list {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 122px;
  margin-top: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.nav-dropdown-list-body {
  border-radius: var(--_responsive---border-radius-10-px);
  background-color: var(--color--primary);
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 645px;
  max-width: 100%;
  padding: 32px 32px 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-shadow: 0 100px 80px rgba(0, 0, 0, 0.031372549), 0 41.78px 33.42px rgba(0, 0, 0, 0.0196078431), 0 22.34px 17.87px rgba(0, 0, 0, 0.0196078431), 0 12.52px 10.02px rgba(0, 0, 0, 0.0196078431), 0 6.65px 5.32px rgba(0, 0, 0, 0.0117647059), 0 2.77px 2.21px rgba(0, 0, 0, 0.0117647059);
          box-shadow: 0 100px 80px rgba(0, 0, 0, 0.031372549), 0 41.78px 33.42px rgba(0, 0, 0, 0.0196078431), 0 22.34px 17.87px rgba(0, 0, 0, 0.0196078431), 0 12.52px 10.02px rgba(0, 0, 0, 0.0196078431), 0 6.65px 5.32px rgba(0, 0, 0, 0.0117647059), 0 2.77px 2.21px rgba(0, 0, 0, 0.0117647059);
}

.nav-dropdown-icon {
  margin-right: 0;
  font-size: 12px;
}

.dropdown-page-link.dropdown-link-text {
  color: var(--color--dark);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  text-decoration: none;
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
}

.dropdown-page-link.dropdown-link-text:hover, .dropdown-page-link.dropdown-link-text[aria-current=page], .dropdown-page-link.dropdown-link-text.is-active {
  color: var(--color--grey-1);
}

.icon {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  font-size: 14px;
  line-height: 22px;
}

.h5 {
  color: var(--color--dark);
  letter-spacing: var(--later-spacing--2);
  font-family: Urbanist, Arial, sans-serif;
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
}

.h6 {
  color: var(--color--dark);
  font-size: 20px;
  font-weight: 600;
  line-height: 30px;
}

.home-hero {
  height: var(--later-spacing--100);
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  position: relative;
}

.home-hero-wrap {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 100%;
  padding-bottom: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.home-hero-bg {
  z-index: 1;
  width: var(--later-spacing--100);
  position: absolute;
  inset: 0%;
  overflow: hidden;
}

.fit-cover {
  width: var(--later-spacing--100);
  height: var(--later-spacing--100);
  -o-object-fit: cover;
     object-fit: cover;
}

.fit-cover:where(.variant-blog-widget-v2) {
  min-height: 480px;
  max-height: 480px;
}

.fit-cover.blog-details-image {
  -o-object-position: 50% 15%;
     object-position: 50% 15%;
}

.home-hero-top {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  max-width: 590px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.hero-button-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.hero-text-secondary {
  color: #bcfd68;
}

.hero-button-01 {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 220px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.button-02 {
  backdrop-filter: blur(9px);
  background-color: rgba(255, 255, 255, 0.1019607843);
  border: 1px solid #c3c3c2;
  border-radius: 100px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 19px 42px;
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.button-text-wrap {
  max-height: 24px;
  overflow: hidden;
}

.hero-hom-sub-heading {
  width: var(--later-spacing--100);
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  max-width: 471px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  inset: auto 20px 40px auto;
}

.home-nav-hero-wrap {
  background-color: var(--color--light);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.hero-brand {
  background-color: var(--color--light);
}

.hero-brand-wrap {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.hero-brand-left {
  width: 500px;
  max-width: var(--later-spacing--100);
}

.hero-brand-right {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 36px;
  padding-bottom: 36px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  overflow: hidden;
}

.logo-outer {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.logo-box {
  width: var(--later-spacing--100);
  height: var(--later-spacing--100);
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  max-width: 145px;
  margin-right: 80px;
}

.bg-linner-left {
  background-image: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0)), to(var(--color--light)));
  background-image: linear-gradient(-90deg, rgba(255, 255, 255, 0), var(--color--light));
  width: 218px;
  height: 100%;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.bg-linner-right {
  background-image: -webkit-gradient(linear, right top, left top, from(#fff), to(rgba(255, 255, 255, 0)));
  background-image: linear-gradient(270deg, #fff, rgba(255, 255, 255, 0));
  width: 50px;
  height: 100%;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.home-about {
  padding-top: var(--_responsive---padding--padding-160-px);
}

.home-about-top {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.home-about-bottom {
  margin-top: var(--_responsive---margin--margin-60-px);
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 1fr 8px 1fr 8px 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: -ms-grid;
  display: grid;
}

.home-about-bottom > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.home-about-bottom > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.home-about-bottom > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}

.home-about-top-right {
  width: 905px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.button-wrap.awadrs-button {
  margin-top: 17px;
}

.button-wrap._404-page-button {
  margin-top: 14px;
}

.home-about-box {
  height: 416px;
  padding: var(--_responsive---padding--padding-32-px);
  border-radius: var(--_responsive---border-radius-16-px);
  background-color: var(--color--light);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  overflow: hidden;
}

.hover-dot {
  background-color: var(--color--primary);
  border-radius: 7px;
  width: 14px;
  height: 14px;
  margin-top: 32px;
  margin-right: 32px;
  position: absolute;
  inset: 0% 0% auto auto;
}

.hover-dot.bg-secondary {
  background-color: #bcfd68;
}

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

.home-about-box-text {
  z-index: 2;
  width: var(--later-spacing--100);
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.statistics-number-wrap {
  height: 88px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}

.statistics-number-wrap._01 {
  height: 180px;
}

.statistics-number-box.upper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.statistics-number-box.lower {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.choose-us {
  padding-top: var(--_responsive---padding--padding-160-px);
  padding-bottom: var(--_responsive---padding--padding-160-px);
}

.choose-us-bottom {
  margin-top: var(--_responsive---margin--margin-100-px);
}

.hero-v2 {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.hero-v2-heading-wrap:where(.variant-hero-v2-heading-width-452), .hero-v2-heading-wrap.heading-width-456 {
  max-width: 452px;
}

.choose-us-tabs {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.tabs-content {
  width: 712px;
  max-width: var(--later-spacing--100);
  margin-left: auto;
}

.tabs-menu {
  width: 588px;
  max-width: var(--later-spacing--100);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.choose-us-image-wrap {
  height: 753px;
  max-width: var(--later-spacing--100);
  border-radius: var(--_responsive---border-radius-10-px);
  position: relative;
  overflow: hidden;
}

.tab-pane-tab-1 {
  width: 712px;
  max-width: var(--later-spacing--100);
}

.choose-us-tab-link {
  padding: 25px var(--_responsive---padding--padding-32-px);
  background-color: var(--color--transparent);
}

.choose-us-tab-link[aria-current=page], .choose-us-tab-link.is-active {
  background-color: var(--color--light);
  border-radius: 7px;
}

.choose-tab-link-text {
  grid-column-gap: 43px;
  grid-row-gap: 43px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.tab-details-text {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.tab-details-text-01 {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.ceo-words {
  position: relative;
}

.ceo-words-wrap {
  grid-column-gap: 303px;
  grid-row-gap: 303px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  padding-top: 60px;
  padding-bottom: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.ceo-words-bg {
  z-index: -1;
  position: absolute;
  inset: 0%;
}

.ceo-words-top {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  max-width: 661px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.ceo-words-bottom {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.ceo-words-bottom-left {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.ceo-image {
  border-radius: 100px;
  width: 56px;
  height: 56px;
}

.ceo-info-box {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.ceo-name {
  color: var(--color--light);
  font-size: 20px;
  font-weight: 600;
  line-height: 30px;
}

.ceo-title {
  color: var(--color--light);
}

.our-service {
  padding-top: var(--_responsive---padding--padding-160-px);
  padding-bottom: var(--_responsive---padding--padding-160-px);
}

.our-service-top {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.our-service-bottom {
  margin-top: var(--_responsive---margin--margin-80-px);
  grid-column-gap: 28px;
  grid-row-gap: 28px;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 1fr 28px 1fr 28px 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: -ms-grid;
  display: grid;
}

.our-service-bottom > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.our-service-bottom > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.our-service-bottom > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}

.our-service-top-left {
  width: 842px;
  max-width: var(--later-spacing--100);
}

.home-service-box {
  width: var(--later-spacing--100);
  height: var(--later-spacing--100);
  padding: var(--_responsive---padding--padding-32-px);
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  border-radius: var(--_responsive---border-radius-16-px);
  background-color: var(--color--light);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-transition: -webkit-box-shadow 0.6s;
  transition: -webkit-box-shadow 0.6s;
  transition: box-shadow 0.6s;
  transition: box-shadow 0.6s, -webkit-box-shadow 0.6s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.home-service-box:hover {
  -webkit-box-shadow: 0 2px 15px rgba(0, 0, 0, 0.2);
          box-shadow: 0 2px 15px rgba(0, 0, 0, 0.2);
}

.service-card-text {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-card-icon-wrap {
  background-color: var(--color--site-bg);
  border-radius: 100px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 64px;
  height: 64px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-card-icon {
  width: 24px;
}

.projects-v1 {
  padding-top: var(--_responsive---padding--padding-100-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
  background-color: var(--color--dark);
  color: var(--color--light);
  overflow: clip;
}

.projects-v1-top {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.projects-v1-bottom {
  height: 400vh;
  margin-top: var(--_responsive---margin--margin-80-px);
}

.projects-v1-heading {
  width: 614px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.heading-wrap.we-are-heading {
  width: 905px;
  max-width: var(--later-spacing--100);
}

.process {
  padding-top: var(--_responsive---padding--padding-160-px);
  padding-bottom: var(--_responsive---padding--padding-160-px);
}

.process-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.process-left {
  width: 497px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  top: 50px;
}

.process-right {
  width: 679px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 17px;
  grid-row-gap: 17px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.process-list-wrap {
  max-width: var(--later-spacing--100);
  padding: var(--_responsive---padding--padding-24-px);
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  border-radius: var(--_responsive---border-radius-16-px);
  background-color: var(--color--light);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  top: 50px;
}

.process-number-box {
  background-color: var(--color--site-bg);
  border-radius: 100px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 64px;
  height: 64px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.process-text-wrap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.need-to-know {
  padding-top: var(--_responsive---padding--padding-100-px);
  padding-bottom: var(--_responsive---padding--padding-100-px);
  background-color: var(--color--primary);
}

.need-to-know-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  overflow: clip;
}

.need-to-know-left {
  width: 516px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  top: 80px;
}

.need-to-know-right {
  width: 520px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}

.know-top-linner {
  pointer-events: none;
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(245, 254, 144, 0)), color-stop(12%, rgba(245, 254, 144, 0)), color-stop(25%, rgba(245, 254, 144, 0.5019607843)), to(#f5fe90));
  background-image: linear-gradient(rgba(245, 254, 144, 0), rgba(245, 254, 144, 0) 12%, rgba(245, 254, 144, 0.5019607843) 25%, #f5fe90);
  width: 520px;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.reviews {
  padding-top: var(--_responsive---padding--padding-100-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
  background-color: var(--color--primary);
}

.reviews-top {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.reviews-bottom {
  margin-top: var(--_responsive---margin--margin-80-px);
  grid-column-gap: 21px;
  grid-row-gap: 21px;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 0.9fr 21px 1.2fr 21px 0.9fr;
  grid-template-columns: 0.9fr 1.2fr 0.9fr;
  grid-auto-columns: 1fr;
  place-items: stretch stretch;
  display: -ms-grid;
  display: grid;
}

.reviews-bottom > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.reviews-bottom > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.reviews-bottom > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}

.reviews-box-wrap {
  width: var(--later-spacing--100);
  height: var(--later-spacing--100);
  border-radius: var(--_responsive---border-radius-8-px);
  position: relative;
  overflow: hidden;
}

.review-box-image {
  z-index: 0;
  height: var(--later-spacing--100);
  position: relative;
}

.reviews-box-text-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  inset: auto 32px 32px;
}

.faq {
  padding-top: var(--_responsive---padding--padding-100-px);
  padding-bottom: var(--_responsive---padding--padding-100-px);
}

.faq-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.faq-left {
  width: 390px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.faq-right {
  width: 654px;
  max-width: var(--later-spacing--100);
}

.faq-content {
  width: 100%;
}

.plus-icon-01 {
  background-color: var(--color--secondary);
  border-radius: 1px;
  width: 2px;
  height: 10px;
  position: absolute;
}

.faq-question-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.normal-s-regular {
  color: #03030f;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.normal-s-regular.faq-answer {
  color: var(--color--grey-1);
  padding-top: 8px;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}

.faq-list {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.faq-item {
  border-bottom: 1px solid var(--color--grey-2);
  background-color: rgba(0, 0, 0, 0);
  width: 100%;
  padding: 0 0 32px;
}

.faq-item[aria-current=page], .faq-item.is-active {
  background-color: rgba(0, 0, 0, 0);
}

.faq-item.last-one {
  border-bottom-color: var(--color--transparent);
}

.faq-answer-wrap {
  max-width: 606px;
  overflow: hidden;
}

.minus-icon {
  background-color: var(--color--secondary);
  border-radius: 1px;
  width: 10px;
  height: 2px;
}

.faq-icon-box {
  border: 2px solid var(--color--secondary);
  border-radius: 100px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 20px;
  height: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.sticky {
  width: var(--later-spacing--100);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  top: 0;
}

.collection-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.collection-item {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  max-width: 840px;
  padding-right: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.project-v1-list {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  color: var(--color--light);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.project-v1-top {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}

.project-v1-bottom {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.project-v1-image {
  width: var(--later-spacing--100);
  border-radius: var(--_responsive---border-radius-12-px);
  height: 530px;
  overflow: hidden;
}

.project-v1-image.v2 {
  height: 437px;
  position: relative;
}

.project-v1-text-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.text-grey-02 {
  color: var(--color--grey-2);
}

.hover-button-wrap {
  opacity: 0;
  position: absolute;
}

.button-text-wrapper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.button-01-icon {
  z-index: 2;
  position: relative;
}

.button-01-icon.hover-icon {
  position: absolute;
  inset: 0%;
}

.button-icon-box {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 18px;
  height: 18px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  overflow: hidden;
}

.button-text-box {
  z-index: 2;
  height: 22px;
  position: relative;
  overflow: hidden;
}

.button-02-bg {
  z-index: 1;
  background-color: var(--color--primary);
  width: 110%;
  height: 110%;
  position: absolute;
  inset: -5% 0% 0% -5%;
}

.hocer-button {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  border-radius: 10px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 20px;
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  overflow: hidden;
}

.hocer-button.project-btn {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  border: 1px solid var(--color--transparent);
  border-radius: 0;
  padding: 12px 24px;
}

.button-02-hover-bg {
  z-index: 1;
  background-color: var(--color--dark);
  width: 110%;
  height: 110%;
  position: absolute;
  inset: -5% 0% 0% -5%;
  -webkit-transform: translate(101%);
          transform: translate(101%);
}

.about-hero {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
  background-color: var(--color--light);
  overflow: clip;
}

.about-hero-wrap {
  height: 250vh;
  position: relative;
}

.about-hero-top {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  max-width: 864px;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.about-hero-bottom {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 32px;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  top: 0;
}

.about-image-wrap {
  z-index: 1;
  border-radius: var(--_responsive---border-radius-10-px);
  width: 40%;
  height: 30vh;
  position: relative;
  overflow: hidden;
}

.about-hero-image {
  width: var(--later-spacing--100);
  height: var(--later-spacing--100);
  -o-object-fit: cover;
     object-fit: cover;
}

.about-sub-heading {
  max-width: 564px;
}

.about-sub-heading-wrap {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  top: 288px;
}

.about-left-image {
  width: 156px;
  max-width: var(--later-spacing--100);
  border-radius: var(--_responsive---border-radius-10-px);
  position: absolute;
  inset: 102px auto auto 0%;
  overflow: hidden;
  -webkit-transform: rotate(-8deg);
          transform: rotate(-8deg);
}

.about-short-image {
  border-radius: var(--_responsive---border-radius-10-px);
}

.about-right-image {
  width: 156px;
  max-width: var(--later-spacing--100);
  border-radius: var(--_responsive---border-radius-10-px);
  position: absolute;
  inset: 56px 0% auto auto;
  overflow: hidden;
  -webkit-transform: rotate(5deg);
          transform: rotate(5deg);
}

.about-brand {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
  background-color: var(--color--site-bg);
}

.about-brand-wrap {
  padding: var(--_responsive---padding--padding-24-px);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  border-radius: var(--_responsive---border-radius-16-px);
  background-color: #fff;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.about-brand-left {
  width: 448px;
  max-width: var(--later-spacing--100);
  padding: var(--_responsive---padding--padding-32-px);
  grid-column-gap: 80px;
  grid-row-gap: 80px;
  border-radius: var(--_responsive---border-radius-16-px);
  background-color: var(--color--site-bg);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.about-brand-right {
  width: 792px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 80px;
  grid-row-gap: 54px;
  -ms-grid-rows: auto 54px auto;
  grid-template-rows: auto auto;
  -ms-grid-columns: 1fr 80px 1fr;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: -ms-grid;
  display: grid;
}

.about-brand-right > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.about-brand-right > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.about-brand-right > *:nth-child(3) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}

.about-brand-right > *:nth-child(4) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}

.about-brand-logo-wrap {
  max-width: 152px;
}

.brand-counter-box {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.left-brand-box {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.lefft-brand-image {
  width: 156px;
}

.who-we-are {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
  background-color: var(--color--site-bg);
}

.who-we-are-top {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.who-we-are-bottom {
  margin-top: var(--_responsive---margin--margin-80-px);
}

.company-history {
  padding-top: var(--_responsive---padding--padding-134-px);
  padding-bottom: var(--_responsive---padding--padding-160-px);
  background-color: var(--color--site-bg);
}

.history-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.history-left {
  width: 563px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  top: 25px;
}

.history-right {
  width: 632px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.history-heading-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.history-list-wrap {
  padding: var(--_responsive---padding--padding-32-px);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  border-radius: var(--_responsive---border-radius-10-px);
  background-color: var(--color--light);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-transition: -webkit-box-shadow 0.3s;
  transition: -webkit-box-shadow 0.3s;
  transition: box-shadow 0.3s;
  transition: box-shadow 0.3s, -webkit-box-shadow 0.3s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  top: 25px;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0);
          box-shadow: 0 2px 5px rgba(0, 0, 0, 0);
}

.history-list-wrap:hover {
  -webkit-box-shadow: 0 2px 10px rgba(128, 183, 0, 0.4);
          box-shadow: 0 2px 10px rgba(128, 183, 0, 0.4);
}

.history-top-icon {
  width: 40px;
}

.history-top-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.text-grey-01 {
  color: var(--color--grey-1);
}

.expertise {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
  position: relative;
}

.expertise-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.expertise-bg {
  z-index: 0;
  position: absolute;
  inset: 0%;
}

.expertise-left {
  width: 356px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.expertise-right {
  width: 570px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 56px;
  grid-row-gap: 56px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.expertise-text-wrap {
  grid-column-gap: 22px;
  grid-row-gap: 22px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.expertise-list {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.expertise-list-text-wrap {
  width: 428px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  margin-top: -5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.expertise-list-text {
  color: var(--color--light);
  font-size: 40px;
  line-height: 48px;
}

.accelerate {
  padding-top: var(--_responsive---padding--padding-160-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
  background-color: var(--color--site-bg);
}

.accelerate-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.accelerate-01 {
  width: 429px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 50px;
  grid-row-gap: 50px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.accelerate-02 {
  width: 471px;
  max-width: var(--later-spacing--100);
  padding: var(--_responsive---padding--padding-60-px);
  border-radius: var(--_responsive---border-radius-12-px);
  background-image: url("../images/Accelerate-Image-1.avif");
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
}

.accelerate-03 {
  width: 380px;
  max-width: var(--later-spacing--100);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.accelerate-image {
  width: var(--later-spacing--100);
  height: var(--later-spacing--100);
  -o-object-fit: cover;
     object-fit: cover;
}

.accelerate-image-wrap {
  height: var(--later-spacing--100);
  border-radius: var(--_responsive---border-radius-10-px);
  overflow: hidden;
}

.accelerate-left-list {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.accelerate-left-list-wrap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.dot-4 {
  background-color: var(--color--secondary);
  border-radius: 1px;
  width: 8px;
  height: 8px;
}

.accelerate-03-inner {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  margin-top: 57px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.teams {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-160-px);
  background-color: var(--color--site-bg);
}

.teams-top {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.teams-bottom {
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 1fr 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  overflow: visible;
}

.teams-bottom > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.teams-bottom > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 2;
}

.teams-bottom > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.teams-bottom > *:nth-child(4) {
  -ms-grid-row: 1;
  -ms-grid-column: 4;
}

.awadrs {
  padding-top: var(--_responsive---padding--padding-160-px);
  padding-bottom: var(--_responsive---padding--padding-160-px);
  background-color: var(--color--dark);
}

.awadrs-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.awadrs-left {
  width: 429px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 23px;
  grid-row-gap: 23px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  align-self: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  top: 100px;
}

.awadrs-right {
  width: 672px;
  max-width: var(--later-spacing--100);
  position: relative;
  overflow: hidden;
}

.awadrs-right-inner {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.awadrs-right-shadow {
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(18, 18, 18, 0)), color-stop(35%, var(--color--dark)), to(var(--color--dark)));
  background-image: linear-gradient(180deg, rgba(18, 18, 18, 0), var(--color--dark) 35%, var(--color--dark));
  pointer-events: none;
  position: absolute;
  inset: 0%;
}

.awadrs-list-wrap {
  padding-bottom: var(--_responsive---padding--padding-24-px);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  border-bottom: 1px solid #414141;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.presence {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-160-px);
  background-color: #000;
}

.presence-top h2,
.presence-top h3 {
  color: var(--color--light);
}

.presence-top {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.presence-bottom {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 1fr 8px 1fr 8px 1fr 8px 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  margin-top: 64px;
  display: -ms-grid;
  display: grid;
}

.presence-bottom > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.presence-bottom > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.presence-bottom > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}

.presence-bottom > *:nth-child(4) {
  -ms-grid-row: 1;
  -ms-grid-column: 7;
}

.presence-top-right {
  width: 632px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.presence-list {
  padding: var(--_responsive---padding--padding-24-px);
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  border-radius: var(--_responsive---border-radius-12-px);
  background-color: var(--color--light);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-transition: -webkit-box-shadow 0.4s;
  transition: -webkit-box-shadow 0.4s;
  transition: box-shadow 0.4s;
  transition: box-shadow 0.4s, -webkit-box-shadow 0.4s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0);
          box-shadow: 0 2px 5px rgba(0, 0, 0, 0);
}

.presence-list:hover {
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2588235294);
          box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2588235294);
}

.presence-icon-wrap {
  background-color: #faf6f5;
  border-radius: 100px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 56px;
  height: 56px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}

.presence-icon {
  width: 32px;
}

.presence-box-text {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.blog-v1 {
  padding-top: var(--_responsive---padding--padding-160-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
  background-color: var(--color--site-bg);
}

.blog-v1-top {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.blog-v1-bottom {
  margin-top: var(--_responsive---margin--margin-60-px);
}

.blog-v1-top-left {
  width: 497px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.blog-v1-collection-list {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 1fr 20px 1fr 20px 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: -ms-grid;
  display: grid;
}

.blog-v1-collection-list > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.blog-v1-collection-list > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.blog-v1-collection-list > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}

.blog-v1-image {
  width: var(--later-spacing--100);
  border-radius: var(--_responsive---border-radius-12-px);
  max-height: 260px;
  position: relative;
  overflow: hidden;
}

.blog-v1-image:where(.variant-blog-widget-v2) {
  max-height: none;
}

.blog-v1-list {
  width: var(--later-spacing--100);
  height: var(--later-spacing--100);
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}

.blog-v1-text-wrap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.short-dot {
  background-color: #767676;
  border-radius: 100px;
  width: 3px;
  height: 3px;
}

.blog-v1-sub-title {
  grid-column-gap: 8px;
  grid-row-gap: 4px;
  -ms-flex-flow: wrap;
      flex-flow: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-hero {
  padding-top: var(--_responsive---padding--padding-60-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  position: relative;
}

.service-hero-bg-wrap {
  z-index: 0;
  position: absolute;
  inset: 0%;
}

.service-hero-wrap {
  height: var(--later-spacing--100);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-hero-left {
  width: 560px;
  max-width: var(--later-spacing--100);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-hero-right {
  width: 340px;
  max-width: var(--later-spacing--100);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-nav-hero {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}

.service-hero-card {
  padding: var(--_responsive---padding--padding-40-px);
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  background-color: var(--color--primary);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.hero-card-text {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.hero-card-icon {
  width: 60px;
}

.service-heading-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service {
  padding-top: var(--_responsive---padding--padding-160-px);
  padding-bottom: var(--_responsive---padding--padding-160-px);
  background-color: var(--color--site-bg);
}

.service-bottom {
  margin-top: var(--_responsive---margin--margin-80-px);
}

.service-button-wrap {
  margin-top: var(--_responsive---padding--padding-40-px);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-top-heading {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-top-left {
  width: 620px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-top-bottom {
  width: 213px;
  max-width: var(--later-spacing--100);
}

.service-tab-menu {
  border-bottom: 1px solid var(--color--grey-2);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-tab-link {
  padding: var(--_responsive---padding--padding-30-px) 0px;
  border-top: 1px solid var(--color--grey-2);
  background-color: var(--color--transparent);
}

.service-tab-link[aria-current=page], .service-tab-link.is-active {
  background-color: rgba(200, 200, 200, 0);
}

.service-box-top {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-box-icon {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 14px;
  height: 14px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  overflow: hidden;
}

.vratical-line {
  width: 1.5px;
  height: var(--later-spacing--100);
  background-color: var(--color--dark);
  border-radius: 1px;
}

.horizontal-line {
  width: var(--later-spacing--100);
  background-color: var(--color--dark);
  border-radius: 1px;
  height: 1.5px;
  position: absolute;
}

.service-heading-title {
  grid-column-gap: 22px;
  grid-row-gap: 22px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-box-bottom {
  overflow: hidden;
}

.service-box-inner-bottom {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  padding-top: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-box-right {
  width: 213px;
  height: 260px;
  max-width: var(--later-spacing--100);
  position: relative;
}

.service-box-left {
  width: 880px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 50px;
  grid-row-gap: 50px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-inner-right {
  width: 420px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.service-inner-left {
  width: 330px;
  max-width: var(--later-spacing--100);
}

.service-list-01 {
  width: 202px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 0;
  padding-left: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.choose-us-v1 {
  padding-bottom: var(--_responsive---padding--padding-160-px);
  background-color: var(--color--site-bg);
}

.choose-us-v1-bottom {
  margin-top: var(--_responsive---margin--margin-80-px);
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.choose-us-box-top {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.choose-us-box-list-40 {
  width: 40%;
  height: 340px;
  padding: var(--_responsive---padding--padding-30-px);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  border-radius: var(--_responsive---border-radius-12-px);
  background-color: var(--color--light);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.choose-us-box-list-40.box-card-hover {
  -webkit-box-shadow: 0 2px 5px 0 var(--color--transparent);
          box-shadow: 0 2px 5px 0 var(--color--transparent);
  -webkit-transition: -webkit-box-shadow 0.3s;
  transition: -webkit-box-shadow 0.3s;
  transition: box-shadow 0.3s;
  transition: box-shadow 0.3s, -webkit-box-shadow 0.3s;
}

.choose-us-box-list-40.box-card-hover:hover {
  -webkit-box-shadow: 0 2px 5px 0 var(--color--grey-2);
          box-shadow: 0 2px 5px 0 var(--color--grey-2);
}

.choose-us-box-list-20 {
  width: 20%;
  height: 340px;
  padding: var(--_responsive---padding--padding-30-px);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  border-radius: var(--_responsive---border-radius-12-px);
  background-color: var(--color--light);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.choose-us-box-list-20.box-card-hover {
  -webkit-box-shadow: 0 2px 5px 0 var(--color--transparent);
          box-shadow: 0 2px 5px 0 var(--color--transparent);
  -webkit-transition: -webkit-box-shadow 0.3s;
  transition: -webkit-box-shadow 0.3s;
  transition: box-shadow 0.3s;
  transition: box-shadow 0.3s, -webkit-box-shadow 0.3s;
}

.choose-us-box-list-20.box-card-hover:hover {
  -webkit-box-shadow: 0 2px 5px 0 var(--color--grey-2);
          box-shadow: 0 2px 5px 0 var(--color--grey-2);
}

.works {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
}

.works-bottom {
  margin-top: var(--_responsive---margin--margin-60-px);
}

.work-collection-list {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 1fr 40px 1fr;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: -ms-grid;
  display: grid;
}

.work-collection-list > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.work-collection-list > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.work-details {
  padding-bottom: var(--_responsive---padding--padding-160-px);
}

.work-details-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.work-details-left {
  width: 920px;
  max-width: var(--later-spacing--100);
}

.work-details-right {
  width: 408px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  margin-top: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  top: 50px;
}

.work-main-image {
  width: var(--later-spacing--100);
  border-radius: var(--_responsive---border-radius-12-px);
  height: 683px;
  overflow: hidden;
}

.work-details-image-wrap {
  margin-top: var(--_responsive---padding--padding-40-px);
  grid-column-gap: 17px;
  grid-row-gap: 17px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.work-details-image-01 {
  width: var(--later-spacing--100);
  height: 567px;
  overflow: hidden;
}

.work-details-image-02 {
  grid-column-gap: 17px;
  grid-row-gap: 17px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.work-details-image-v2 {
  width: var(--later-spacing--100);
  height: 556px;
  overflow: hidden;
}

.work-info-box {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.work-details-box {
  border-top: 1px solid #e7e7e7;
}

.work-details-box-inner {
  grid-column-gap: 102px;
  grid-row-gap: 102px;
  border-bottom: 1px solid #e7e7e7;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  padding-top: 12px;
  padding-bottom: 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.services-list {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.work-title-box {
  width: 60px;
  max-width: var(--later-spacing--100);
}

.work-rich-text h5 {
  margin-top: 40px;
}

.work-rich-text p {
  margin-top: 8px;
}

.related-work {
  padding-bottom: var(--_responsive---padding--padding-80-px);
}

.related-work-top {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.related-work-bottom {
  margin-top: var(--_responsive---margin--margin-60-px);
}

.blog {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: 124px;
}

.blog-bottom {
  margin-top: 136px;
}

.blog-tabs {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.blog-tabs-content {
  width: 1131px;
  max-width: var(--later-spacing--100);
  margin-left: auto;
}

.blog-tabs-menu {
  width: 160px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  margin-right: 60px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.blog-tab-link {
  border: 1px solid var(--color--grey-2);
  background-color: var(--color--transparent);
  border-radius: 100px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 19px;
  padding-bottom: 19px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.blog-tab-link[aria-current=page], .blog-tab-link.is-active {
  border-color: var(--color--transparent);
  background-color: var(--color--primary);
}

.blog-list-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.blog-list-top {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 1fr 16px 1fr 16px 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  display: -ms-grid;
  display: grid;
}

.blog-list-top > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.blog-list-top > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.blog-list-top > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}

.blog-details-bottom {
  margin-top: var(--_responsive---margin--margin-80-px);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.blog-details-left {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  top: 50px;
}

.blog-details-right {
  width: 787px;
  max-width: var(--later-spacing--100);
}

.blog-main-image {
  width: var(--later-spacing--100);
  height: 720px;
  overflow: hidden;
}

.blog-heading {
  padding-bottom: 12px;
}

.blog-rich-text h5 {
  margin-top: 40px;
}

.blog-rich-text p {
  margin-top: 8px;
}

.blog-rich-text ul {
  margin-bottom: 0;
  padding-left: 26px;
}

.blog-rich-text li {
  color: var(--color--dark);
  margin-top: 8px;
}

.blog-details-image-wrap {
  width: var(--later-spacing--100);
  height: 480px;
  margin-top: var(--_responsive---padding--padding-40-px);
  overflow: hidden;
}

.similar-blog {
  padding-top: var(--_responsive---padding--padding-160-px);
  padding-bottom: var(--_responsive---padding--padding-160-px);
}

.similar-blog-top {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.similar-blog-bottom {
  margin-top: var(--_responsive---margin--margin-80-px);
}

.blog-details-left-top {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.blog-details-left-bottom {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.blog-details-tag {
  border: 1px solid var(--color--grey-2);
  border-radius: 100px;
  padding: 8px 16px;
}

.social-share-wrap {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.social-share-link {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  overflow: hidden;
}

.icon-02 {
  opacity: 0;
  position: absolute;
  inset: 0%;
}

.contact-info {
  padding-top: var(--_responsive---padding--padding-100-px);
  padding-bottom: var(--_responsive---padding--padding-100-px);
  background-color: var(--color--site-bg);
}

.contact-info-top {
  text-align: center;
  max-width: 350px;
  margin-left: auto;
  margin-right: auto;
}

.contact-info-bottom {
  margin-top: var(--_responsive---margin--margin-80-px);
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 1fr 16px 1fr 16px 1fr 16px 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: -ms-grid;
  display: grid;
}

.contact-info-bottom > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.contact-info-bottom > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.contact-info-bottom > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}

.contact-info-bottom > *:nth-child(4) {
  -ms-grid-row: 1;
  -ms-grid-column: 7;
}

.contact-wrap {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.contact-right {
  width: var(--later-spacing--100);
  max-width: 720px;
  height: 960px;
  overflow: hidden;
}

.contact-left {
  width: 720px;
  max-width: var(--later-spacing--100);
  padding-top: 85px;
  padding-right: var(--_responsive---padding--padding-40-px);
  grid-column-gap: 48px;
  grid-row-gap: 48px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.contact-heading-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.form-field-wrap {
  width: var(--later-spacing--100);
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.form-field-main-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.form-button-wrap {
  margin-top: 24px;
}

.contact-form {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.text-secondary {
  color: var(--color--secondary);
}

.text-field {
  border: 1px solid var(--color--grey-2);
  min-height: 56px;
  color: var(--color--dark);
  border-radius: 108px;
  margin-bottom: 0;
  padding: 16px 20px;
}

.text-field:focus {
  border-color: var(--color--secondary);
}

.text-field::-webkit-input-placeholder {
  color: var(--color--grey-1);
}

.text-field::-moz-placeholder {
  color: var(--color--grey-1);
}

.text-field:-ms-input-placeholder {
  color: var(--color--grey-1);
}

.text-field::-ms-input-placeholder {
  color: var(--color--grey-1);
}

.text-field::placeholder {
  color: var(--color--grey-1);
}

.text-field-02 {
  border: 1px solid var(--color--grey-2);
  min-height: 120px;
  color: var(--color--dark);
  border-radius: 16px;
  margin-bottom: 0;
  padding: 16px 20px;
}

.text-field-02:focus {
  border-color: var(--color--secondary);
}

.text-field-02::-webkit-input-placeholder {
  color: var(--color--grey-1);
}

.text-field-02::-moz-placeholder {
  color: var(--color--grey-1);
}

.text-field-02:-ms-input-placeholder {
  color: var(--color--grey-1);
}

.text-field-02::-ms-input-placeholder {
  color: var(--color--grey-1);
}

.text-field-02::placeholder {
  color: var(--color--grey-1);
}

.checkbox {
  border: 1px solid var(--color--dark);
  font-size: 20px;
  line-height: 20;
}

.submit-button {
  width: var(--later-spacing--100);
  border: 1px solid var(--color--transparent);
  background-color: var(--color--primary);
  color: var(--color--dark);
  background-image: url("../images/Button-Icon-1.svg");
  background-position: 366px;
  background-repeat: no-repeat;
  background-size: auto;
  border-radius: 100px;
  padding: 12px 282px 12px 256px;
  font-weight: 600;
  -webkit-transition: border-color 0.3s, background-color 0.3s;
  transition: border-color 0.3s, background-color 0.3s;
}

.submit-button:hover {
  border: 1px solid var(--color--secondary);
  background-color: var(--color--light);
}

.success-message {
  border-radius: var(--_responsive---border-radius-10-px);
  background-color: var(--color--primary);
}

.contact-info-box {
  padding: var(--_responsive---padding--padding-32-px);
  grid-column-gap: 64px;
  grid-row-gap: 64px;
  border-radius: var(--_responsive---border-radius-12-px);
  background-color: var(--color--light);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.contact-box-icon-wrap {
  background-color: var(--color--site-bg);
  border-radius: 100px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 60px;
  height: 60px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.contact-box-icon {
  width: 24px;
}

.contact-info-box-top {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.contact-info-box-top-bottom {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.pricing {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
}

.pricing-bottom {
  margin-top: var(--_responsive---margin--margin-100-px);
}

.pricing-collection-list {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 1fr 8px 1fr 8px 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: -ms-grid;
  display: grid;
}

.pricing-collection-list > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.pricing-collection-list > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.pricing-collection-list > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}

.pricing-list-wrap {
  padding: var(--_responsive---padding--padding-24-px);
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  border-radius: var(--_responsive---border-radius-12-px);
  background-color: var(--color--light);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.pricing-list-wrap.pricing-card-bg {
  background-color: var(--color--site-bg);
}

.pricing-top-inner {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.pricing-middle {
  border-top: 1px solid var(--color--grey-2);
}

.pricing-middle-list {
  border-bottom: 1px solid var(--color--grey-2);
  padding-top: 12px;
  padding-bottom: 12px;
}

.pricing-middle-list._01 {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.pricing-middle-list._02 {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.scope-list {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.pricing-details {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
}

.pricing-details-wrap {
  max-width: 1055px;
  margin-left: auto;
  margin-right: auto;
}

.pricing-details-bottom {
  margin-top: var(--_responsive---margin--margin-100-px);
}

.pricing-card-wrap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.pricing-details-text {
  margin-top: 20px;
}

.pricing-rich-text h5 {
  margin-top: 40px;
}

.pricing-rich-text p {
  margin-top: 12px;
}

.pricing-card-left {
  width: 628px;
  max-width: var(--later-spacing--100);
}

.pricing-card-right {
  width: 419px;
  max-width: var(--later-spacing--100);
  padding: var(--_responsive---padding--padding-32-px);
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  border-radius: var(--_responsive---border-radius-12-px);
  background-color: var(--color--primary);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.price-wrap {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.default-state {
  margin-bottom: 0;
}

.add-to-cart-button {
  width: var(--later-spacing--100);
  background-color: var(--color--light);
  color: var(--color--dark);
  letter-spacing: var(--later-spacing--2);
  background-image: url("../images/Button-Icon-1.svg");
  background-position: 212px;
  background-repeat: no-repeat;
  background-size: auto;
  border-radius: 100px;
  padding: 12px 155px 12px 129px;
  font-weight: 600;
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
}

.add-to-cart-button:hover {
  background-color: var(--color--dark);
  color: var(--color--light);
  background-image: url("../images/Button-Icon-2.svg");
  background-position: 212px;
  background-repeat: no-repeat;
  background-size: auto;
}

.license {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
}

.license-bottom {
  margin-top: var(--_responsive---margin--margin-100-px);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 1fr 20px 1fr;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: -ms-grid;
  display: grid;
}

.license-bottom > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.license-bottom > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.license-list-wrap {
  padding: var(--_responsive---padding--padding-32-px);
  grid-column-gap: 52px;
  grid-row-gap: 52px;
  border-radius: var(--_responsive---border-radius-12-px);
  background-color: var(--color--site-bg);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.license-icon {
  width: 28px;
}

.license-box-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.license-box-text {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.changelog {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
}

.changelog-bottom {
  margin-top: var(--_responsive---margin--margin-100-px);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  -ms-grid-columns: 1fr 20px 1fr;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: -ms-grid;
  display: grid;
}

.changelog-bottom > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.changelog-bottom > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.changelog-list-wrap {
  padding: var(--_responsive---padding--padding-32-px);
  grid-column-gap: 52px;
  grid-row-gap: 52px;
  border-radius: var(--_responsive---border-radius-12-px);
  background-color: var(--color--site-bg);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.changelog-item-text {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.changelog-list-item {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  margin-bottom: 0;
  padding-left: 26px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.privacy-policy,
.standard-text-page {
  padding-top: var(--_responsive---padding--padding-80-px);
  padding-bottom: var(--_responsive---padding--padding-80-px);
}

.privacy-policy-wrap,
.standard-text-page-wrap {
  max-width: 856px;
  margin-left: auto;
  margin-right: auto;
}

.privacy-policy-bottom,
.standard-text-page-bottom {
  margin-top: var(--_responsive---margin--margin-100-px);
  grid-column-gap: 48px;
  grid-row-gap: 48px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.policy-item-list {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.policy-item-top, .policy-item-bottom {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.policy-item-list-01 {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  margin-bottom: 0;
  padding-left: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.pass-icon {
  width: 48px;
}

.pass-icon-heading {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.pass-inpute-box {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.password-text-field {
  background-color: var(--color--light);
  min-height: 48px;
  color: var(--color--dark);
  border: 1px solid #ebebeb;
  border-radius: 52px;
  margin-bottom: 0;
  padding: 12px 24px;
}

.password-text-field:focus {
  border-color: var(--color--secondary);
}

.password-text-field::-webkit-input-placeholder {
  color: var(--color--grey-1);
}

.password-text-field::-moz-placeholder {
  color: var(--color--grey-1);
}

.password-text-field:-ms-input-placeholder {
  color: var(--color--grey-1);
}

.password-text-field::-ms-input-placeholder {
  color: var(--color--grey-1);
}

.password-text-field::placeholder {
  color: var(--color--grey-1);
}

.primary-submit-button {
  border: 1px solid var(--color--primary);
  background-color: var(--color--primary);
  color: var(--color--dark);
  background-image: url("../images/Button-Icon-1.svg");
  background-position: 78px;
  background-repeat: no-repeat;
  background-size: auto;
  border-radius: 100px;
  padding: 12px 46px 12px 20px;
  font-weight: 600;
  -webkit-transition: background-color 0.3s, border-color 0.3s;
  transition: background-color 0.3s, border-color 0.3s;
}

.primary-submit-button:hover {
  border: 1px solid var(--color--secondary);
  background-color: var(--color--light);
}

.primary-submit-button._01 {
  background-image: none;
  margin-bottom: 0;
  padding-left: 20px;
  padding-right: 20px;
}

._404-wrap {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100vw;
  height: 100vh;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

._404-inner-wrap {
  width: 438px;
  max-width: var(--later-spacing--100);
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.text-style-h6 {
  font-size: var(--_typography---h6--font-size);
  line-height: var(--_typography---h6--line-height);
  font-weight: var(--_typography---h6--font-weight);
  letter-spacing: var(--_typography---h6--letter-spacing);
}

.text-style-h5 {
  font-size: var(--_typography---h5--font-size);
  line-height: var(--_typography---h5--line-height);
  font-weight: var(--_typography---h5--font-weight);
  letter-spacing: var(--_typography---h5--letter-spacing);
}

.text-style-h4 {
  font-size: var(--_typography---h4--font-size);
  line-height: var(--_typography---h4--line-height);
  font-weight: var(--_typography---h4--font-weight);
  letter-spacing: var(--_typography---h4--letter-spacing);
}

.text-style-h3 {
  font-size: var(--_typography---h3--font-size);
  line-height: var(--_typography---h3--line-height);
  font-weight: var(--_typography---h3--font-weight);
  letter-spacing: var(--_typography---h3--letter-spacing);
}

.text-style-h2 {
  font-size: var(--_typography---h2--font-size);
  line-height: var(--_typography---h2--line-height);
  font-weight: var(--_typography---h2--font-weight);
  letter-spacing: var(--_typography---h2--letter-spacing);
}

.form-container {
  padding: var(--_responsive---padding--padding-100-px) 0px;
  background-color: var(--color--site-bg);
}

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

.image-grid {
  z-index: 99;
  width: var(--later-spacing--100);
  height: var(--later-spacing--100);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  -ms-grid-rows: auto 0px auto 0px auto 0px auto 0px auto;
  grid-template-rows: auto auto auto auto auto;
  -ms-grid-columns: 1fr 0px 1fr 0px 1fr 0px 1fr 0px 1fr 0px 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: -ms-grid;
  display: grid;
  position: absolute;
  inset: 0%;
}

.image-grid > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.image-grid > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.image-grid > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}

.image-grid > *:nth-child(4) {
  -ms-grid-row: 1;
  -ms-grid-column: 7;
}

.image-grid > *:nth-child(5) {
  -ms-grid-row: 1;
  -ms-grid-column: 9;
}

.image-grid > *:nth-child(6) {
  -ms-grid-row: 1;
  -ms-grid-column: 11;
}

.image-grid > *:nth-child(7) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}

.image-grid > *:nth-child(8) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}

.image-grid > *:nth-child(9) {
  -ms-grid-row: 3;
  -ms-grid-column: 5;
}

.image-grid > *:nth-child(10) {
  -ms-grid-row: 3;
  -ms-grid-column: 7;
}

.image-grid > *:nth-child(11) {
  -ms-grid-row: 3;
  -ms-grid-column: 9;
}

.image-grid > *:nth-child(12) {
  -ms-grid-row: 3;
  -ms-grid-column: 11;
}

.image-grid > *:nth-child(13) {
  -ms-grid-row: 5;
  -ms-grid-column: 1;
}

.image-grid > *:nth-child(14) {
  -ms-grid-row: 5;
  -ms-grid-column: 3;
}

.image-grid > *:nth-child(15) {
  -ms-grid-row: 5;
  -ms-grid-column: 5;
}

.image-grid > *:nth-child(16) {
  -ms-grid-row: 5;
  -ms-grid-column: 7;
}

.image-grid > *:nth-child(17) {
  -ms-grid-row: 5;
  -ms-grid-column: 9;
}

.image-grid > *:nth-child(18) {
  -ms-grid-row: 5;
  -ms-grid-column: 11;
}

.image-grid > *:nth-child(19) {
  -ms-grid-row: 7;
  -ms-grid-column: 1;
}

.image-grid > *:nth-child(20) {
  -ms-grid-row: 7;
  -ms-grid-column: 3;
}

.image-grid > *:nth-child(21) {
  -ms-grid-row: 7;
  -ms-grid-column: 5;
}

.image-grid > *:nth-child(22) {
  -ms-grid-row: 7;
  -ms-grid-column: 7;
}

.image-grid > *:nth-child(23) {
  -ms-grid-row: 7;
  -ms-grid-column: 9;
}

.image-grid > *:nth-child(24) {
  -ms-grid-row: 7;
  -ms-grid-column: 11;
}

.image-grid > *:nth-child(25) {
  -ms-grid-row: 9;
  -ms-grid-column: 1;
}

.image-grid > *:nth-child(26) {
  -ms-grid-row: 9;
  -ms-grid-column: 3;
}

.image-grid > *:nth-child(27) {
  -ms-grid-row: 9;
  -ms-grid-column: 5;
}

.image-grid > *:nth-child(28) {
  -ms-grid-row: 9;
  -ms-grid-column: 7;
}

.image-grid > *:nth-child(29) {
  -ms-grid-row: 9;
  -ms-grid-column: 9;
}

.image-grid > *:nth-child(30) {
  -ms-grid-row: 9;
  -ms-grid-column: 11;
}

.works-grid-item {
  width: var(--later-spacing--100);
  height: var(--later-spacing--100);
  backdrop-filter: blur(14px);
  background-color: rgba(14, 14, 14, 0.1019607843);
}

.tag-wrap-hero {
  background-color: var(--color--secondary);
  border-radius: 3px;
  padding: 2px 11px;
}

.error-message {
  border-radius: var(--_responsive---border-radius-8-px);
  background-color: var(--color--grey-2);
  color: var(--color--dark);
  text-align: center;
}

.team-mamber-list {
  padding-right: var(--_responsive---padding--padding-20-px);
  padding-left: var(--_responsive---padding--padding-20-px);
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  border-left: 1px solid var(--color--grey-2);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.team-mamber-list._01 {
  border-left-width: 1px;
}

.team-mamber-list._001 {
  border-left-width: 0;
}

.team-mamber-image {
  width: var(--later-spacing--100);
  border-radius: var(--_responsive---border-radius-12-px);
  height: 318px;
  overflow: hidden;
}

.team-mamber-info {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.drag-box {
  background-color: var(--color--primary);
  cursor: -webkit-grabbing;
  cursor: grabbing;
  border-radius: 100px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 160px;
  height: 160px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
}

.drag-box-text {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.team-bottom-wrap {
  margin-top: var(--_responsive---margin--margin-80-px);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  overflow: hidden;
}

.cookies-block {
  z-index: 5555;
  width: 100%;
  max-width: 445px;
  padding: var(--_responsive---padding--padding-27-px);
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  background-color: var(--color--light);
  border-radius: 12px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  display: none;
  position: fixed;
  inset: auto 32px 32px auto;
  -webkit-box-shadow: 0 41px 33px rgba(0, 0, 0, 0.0196078431), 0 100px 80px rgba(0, 0, 0, 0.031372549);
          box-shadow: 0 41px 33px rgba(0, 0, 0, 0.0196078431), 0 100px 80px rgba(0, 0, 0, 0.031372549);
}

.cookies-text-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.utility-copyright-link {
  color: var(--color--dark);
  text-decoration: underline;
}

.cookies-button {
  grid-column-gap: 8px;
  background-color: #009fe3;
  color: #fff;
  cursor: pointer;
  border-radius: 100px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 12px 50px;
  font-weight: 600;
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.cookie-button-text {
  z-index: 3;
  position: relative;
  margin: 0;
}

.cookies-text-block p {
  margin: 0;
}

.cookies-text-block .text-style-h6 {
  margin: 0;
}

.modal-title-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  margin-bottom: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.button {
  z-index: 1;
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  color: #fff;
  background-color: #000;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 14px 34px;
  text-decoration: none;
  -webkit-transition: all 0.7s;
  transition: all 0.7s;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}

.button:hover {
  color: #000;
  background-color: #e3e9e4;
}

.modal-form-button-wrap {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  padding-top: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.modal-form-block {
  margin-bottom: 0;
}

.modal-title-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: #070515;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.modal-wrapper {
  z-index: 55555;
  backdrop-filter: blur(5px);
  background-color: rgba(7, 5, 21, 0.3019607843);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 20px;
  display: none;
  position: fixed;
  inset: 0%;
}

.submit-button-2 {
  z-index: 5;
  opacity: 0;
  margin-bottom: 0;
  position: absolute;
  inset: 0%;
}

.modal {
  z-index: 5;
  background-color: var(--color--light);
  border-radius: 12px;
  width: 100%;
  max-width: 554px;
  padding: 24px;
  position: relative;
}

.modal-bg {
  z-index: 2;
  position: absolute;
  inset: 0%;
}

.modal-input-field-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -ms-grid-rows: auto 16px auto;
  grid-template-rows: auto auto;
  -ms-grid-columns: 1fr 16px 1fr;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: -ms-grid;
  display: grid;
}

.modal-input-field-wrapper > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.modal-input-field-wrapper > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.modal-input-field-wrapper > *:nth-child(3) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}

.modal-input-field-wrapper > *:nth-child(4) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}

.modal-wrap {
  z-index: 5;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: auto;
}

.modal-close-icon {
  position: absolute;
  inset: 24px 24px auto auto;
}

.footer-link {
  color: var(--color--light);
  text-decoration: none;
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
}

.footer-link:hover, .footer-link[aria-current=page], .footer-link.is-active {
  color: var(--color--primary);
}

.footer-link-widget {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.fooer-link-wrap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media screen and (max-width: 991px) {
  body {
    --_responsive---padding--padding-80-px: 70px;
    --_responsive---padding--padding-160-px: 100px;
    --_responsive---margin--margin-100-px: 80px;
    --_responsive---border-radius-12-px: 10px;
    --_responsive---border-radius-10-px: 10px;
    --_responsive---border-radius-8-px: 8px;
    --_responsive---margin--margin-60-px: 50px;
    --_responsive---padding--padding-32-px: 30px;
    --_responsive---border-radius-16-px: 14px;
    --_responsive---margin--margin-80-px: 60px;
    --_responsive---padding--padding-100-px: 80px;
    --_responsive---padding--padding-24-px: 20px;
    --_responsive---padding--padding-134-px: 130px;
    --_responsive---padding--padding-60-px: 50px;
    --_responsive---padding--padding-40-px: 30px;
    --_responsive---padding--padding-30-px: 28px;
    --_responsive---padding--padding-20-px: 20px;
    --_responsive---padding--padding-27-px: 22px;
    --_responsive---margin--margin-160-px: 120px;
    --_responsive---margin--margin-140-px: 100px;
    --_responsive---margin--margin-120-px: 100px;
    --_responsive---margin--margin-96-px: 70px;
    --_responsive---margin--margin-72-px: 60px;
    --_responsive---margin--margin-70-px: 60px;
    --_responsive---padding--padding-173-px: 120px;
    --_responsive---padding--padding-140-px: 100px;
    --_responsive---padding--padding-120-px: 80px;
    --_responsive---padding--padding-70-px: 60px;
    --_responsive---padding--padding-22-px: 20px;
    --_typography---paragraph-02--font-size: 16px;
    --_typography---paragraph-02--line-height: 24px;
    --_typography---h1--font-size: 50px;
    --_typography---h1--line-height: 58px;
    --_typography---h1--letter-spacing: var(--later-spacing--2);
    --_typography---h2--font-size: 44px;
    --_typography---h2--line-height: 52px;
    --_typography---h2--font-weight: var(--font-weight--semi-bold);
    --_typography---h2--letter-spacing: var(--later-spacing--2);
    --_typography---h3--font-size: 34px;
    --_typography---h3--line-height: 42px;
    --_typography---h3--font-weight: var(--font-weight--semi-bold);
    --_typography---h3--letter-spacing: 0px;
    --_typography---h4--font-size: 28px;
    --_typography---h4--line-height: 36px;
    --_typography---h4--font-weight: var(--font-weight--semi-bold);
    --_typography---h4--letter-spacing: var(--later-spacing--2);
    --_typography---h5--font-size: 22px;
    --_typography---h5--line-height: 30px;
    --_typography---h5--font-weight: var(--font-weight--semi-bold);
    --_typography---h5--letter-spacing: var(--later-spacing--2);
    --_typography---h6--font-size: 20px;
    --_typography---h6--line-height: 30px;
    --_typography---h6--font-weight: var(--font-weight--semi-bold);
    --_typography---h6--letter-spacing: var(--later-spacing--2);
    --_typography---paragraph-01--font-size: 18px;
    --_typography---paragraph-01--line-height: 27px;
    --_typography---tag--font-size: 14px;
    --_typography---tag--line-height: 20px;
    --_typography---display-01--font-size: 80px;
    --_typography---display-01--line-height: 88px;
    --_typography---display-01--letter-spacing: var(--later-spacing--4);
    --_typography---display-02--font-size: 60px;
    --_typography---display-02--line-height: 68px;
    --_typography---display-02--letter-spacing: var(--later-spacing--4);
    --_typography---button-text--font-size: 16px;
    --_typography---button-text--line-height: 24px;
    --_typography---display-01--font-weight: var(--font-weight--normal);
    --_typography---display-02--font-weight: var(--font-weight--medium);
    --_typography---h1--font-weight: var(--font-weight--semi-bold);
    --_typography---paragraph-01--font-weight: var(--font-weight--medium);
    --_typography---paragraph-01--letter-spacing: 0px;
    --_typography---paragraph-02--font-weight: var(--font-weight--medium);
    --_typography---paragraph-02--letter-spacing: 0px;
    --_typography---button-text--font-weight: var(--font-weight--semi-bold);
    --_typography---button-text--letter-spacing: var(--later-spacing--2);
    --_typography---tag--font-weight: var(--font-weight--semi-bold);
    --_typography---tag--letter-spacing: var(--later-spacing--2);
  }
  .utility-page-content {
    padding-top: 140px;
    padding-bottom: 140px;
  }
  .utility-page-form {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .container {
    padding-left: 18px;
    padding-right: 18px;
  }
  .style-guide-bottom {
    grid-column-gap: 80px;
    grid-row-gap: 80px;
  }
  .style-guide-item {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .style-guide-item-left {
    position: static;
  }
  .style-guide-item-right {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .hero-v1 {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .hero-v1._01 {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .hero-v1-heading-wrap {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .footer-top {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .footer-bottom {
    text-align: center;
    -ms-flex-flow: wrap;
        flex-flow: wrap;
    margin-top: 100px;
  }
  .footer-top-left {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
    width: auto;
  }
  .footer-top-right {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    width: 100%;
  }
  .sub-heading-wrap.faq-sub-heading {
    width: var(--later-spacing--100);
  }
  .footer-right-01 {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
  }
  .footer-right-02 {
    grid-column-gap: 34px;
    grid-row-gap: 34px;
  }
  .footer-info-box {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }
  .navbar-right {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .nav-menu-wrapper {
    background-color: #fff;
    border-top: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
    margin-top: 10px;
    padding: 30px;
  }
  .navbar-container {
    padding-left: 16px;
    padding-right: 16px;
  }
  .nav-link {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .paragraph-03 {
    font-size: 14px;
  }
  .cart-quantity {
    min-width: 16px;
    height: 16px;
    font-size: 10px;
    line-height: 16px;
  }
  .nav-item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .menu-button {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 3px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .menu-button.is-open {
    color: #fff;
    background-color: rgba(200, 200, 200, 0);
  }
  .paragraph-7 {
    font-size: 16px;
  }
  .nav-menu {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .nav-button-wrapper {
    width: 100%;
    margin-left: 0;
    display: none;
  }
  .paragraph-8 {
    font-size: 20px;
    line-height: 25px;
  }
  .navbar {
    padding-top: 18px;
    padding-bottom: 18px;
  }
  .nav-dropdown-list-wrap.shadow-three.is-open {
    position: absolute;
  }
  .nav-dropdown-list-wrap.shadow-three.mobile-shadow-hide.pages.is-open {
    padding-top: 10px;
    position: relative;
    left: 0;
  }
  .nav-dropdown-toggle {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
  }
  .nav-dropdown-toggle.is-open {
    margin-left: 0;
    margin-right: 0;
  }
  .nav-dropdown {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .nav-dropdown-list.left {
    padding-right: 20px;
  }
  .nav-dropdown-list.center {
    padding-left: 20px;
    padding-right: 20px;
  }
  .nav-dropdown-list.right {
    padding-left: 20px;
  }
  .dropdown-page-link-list {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
    margin-top: 20px;
  }
  .nav-dropdown-list-body {
    border-top-width: 1px;
    width: 100%;
    padding: 26px;
  }
  .dropdown-page-link.dropdown-link-text {
    font-size: 16px;
    line-height: 22px;
  }
  .h5 {
    font-size: 22px;
    line-height: 30px;
  }
  .h6 {
    font-size: 18px;
    line-height: 26px;
  }
  .fit-cover:where(.variant-blog-widget-v2) {
    min-height: 400px;
    max-height: 400px;
  }
  .fit-cover.choose-image {
    -o-object-position: 50% 26%;
       object-position: 50% 26%;
  }
  .fit-cover.expertise-bg-image {
    -o-object-position: 0% 50%;
       object-position: 0% 50%;
  }
  .fit-cover.contact-image {
    -o-object-position: 50% 32%;
       object-position: 50% 32%;
  }
  .home-hero-top {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .hero-hom-sub-heading {
    margin-top: 0;
    bottom: 30px;
  }
  .hero-brand-left {
    width: 350px;
  }
  .hero-brand-right {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .logo-box {
    max-width: 132px;
    margin-right: 20px;
  }
  .bg-linner-right {
    border-right-width: 0;
  }
  .home-about-top {
    grid-column-gap: 34px;
    grid-row-gap: 34px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .home-about-bottom {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .home-about-top-right {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .button-wrap.awadrs-button {
    margin-top: 0;
  }
  .button-wrap._404-page-button {
    margin-top: 10px;
  }
  .home-about-box {
    height: 300px;
  }
  .home-about-box-text {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }
  .statistics-number-wrap {
    height: 67px;
  }
  .statistics-number-wrap._01 {
    height: 87px;
  }
  .hero-v2 {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .choose-us-tabs {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .tabs-content {
    width: var(--later-spacing--100);
    margin-top: 40px;
  }
  .tabs-menu {
    width: var(--later-spacing--100);
  }
  .choose-us-image-wrap {
    height: 500px;
  }
  .tab-pane-tab-1 {
    width: var(--later-spacing--100);
  }
  .choose-us-tab-link {
    padding: 24px;
  }
  .choose-tab-link-text {
    grid-column-gap: 35px;
    grid-row-gap: 35px;
  }
  .tab-details-text-01 {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .ceo-words-wrap {
    grid-column-gap: 200px;
    grid-row-gap: 200px;
    padding-top: 50px;
    padding-bottom: 30px;
  }
  .our-service-top {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .our-service-bottom {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    -ms-grid-columns: 1fr 20px 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .home-service-box {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .service-card-icon-wrap {
    width: 54px;
    height: 54px;
  }
  .service-card-icon {
    width: 22px;
  }
  .projects-v1-top {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .projects-v1-bottom {
    height: auto;
  }
  .projects-v1-heading {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .process-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .process-left {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
    position: static;
  }
  .process-right {
    width: var(--later-spacing--100);
    grid-column-gap: 26px;
    grid-row-gap: 26px;
  }
  .process-number-box {
    width: 58px;
    height: 58px;
  }
  .need-to-know-wrap {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .need-to-know-left {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
    text-align: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: static;
  }
  .need-to-know-right {
    width: var(--later-spacing--100);
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .know-top-linner {
    display: none;
  }
  .reviews-bottom {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    -ms-grid-columns: 1fr 10px 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .reviews-box-wrap {
    height: 500px;
  }
  .reviews-box-text-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    bottom: 20px;
    left: 20px;
    right: 20px;
  }
  .faq {
    padding-top: 20px;
  }
  .faq:where(.variant-faq-margin-20) {
    padding-top: 60px;
  }
  .faq-wrap {
    grid-column-gap: 58px;
    grid-row-gap: 58px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .faq-left {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    text-align: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 418px;
  }
  .faq-right {
    width: var(--later-spacing--100);
  }
  .normal-s-regular.faq-answer {
    padding-top: 12px;
  }
  .faq-list {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .faq-item {
    padding-bottom: 24px;
  }
  .faq-item.last-one {
    padding-bottom: 0;
  }
  .sticky {
    height: auto;
  }
  .wrapper {
    width: var(--later-spacing--100);
  }
  .collection-list {
    grid-column-gap: 20px;
    grid-row-gap: 40px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    -ms-grid-columns: 1fr 20px 1fr;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: -ms-grid;
    display: grid;
  }
  .collection-list > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .collection-list > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .collection-item {
    max-width: var(--later-spacing--100);
    padding-right: 0;
  }
  .project-v1-image {
    height: 200px;
  }
  .project-v1-image.v2 {
    height: 300px;
  }
  .project-v1-text-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 2px;
    -ms-flex-flow: wrap;
        flex-flow: wrap;
  }
  .about-hero {
    padding-bottom: 60px;
  }
  .about-hero-wrap {
    height: auto;
  }
  .about-hero-top {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .about-hero-bottom {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    margin-top: 29px;
  }
  .about-image-wrap {
    width: 50%;
    height: 200px;
  }
  .about-sub-heading-wrap {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
    position: static;
  }
  .about-left-image {
    width: 140px;
    top: 54px;
  }
  .about-right-image {
    width: 140px;
  }
  .about-brand-wrap {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .about-brand-left {
    width: var(--later-spacing--100);
    grid-column-gap: 60px;
    grid-row-gap: 60px;
  }
  .about-brand-right {
    grid-column-gap: 60px;
    grid-row-gap: 40px;
  }
  .brand-counter-box, .left-brand-box {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .lefft-brand-image {
    width: 140px;
  }
  .who-we-are-top {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    text-align: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .company-history {
    padding-top: 40px;
  }
  .history-wrap {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .history-left {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: static;
  }
  .history-right {
    width: var(--later-spacing--100);
  }
  .history-heading-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    text-align: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .history-list-wrap, .history-top-wrap {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .expertise-wrap {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .expertise-left {
    grid-column-gap: 26px;
    grid-row-gap: 26px;
    width: 800px;
  }
  .expertise-right {
    width: var(--later-spacing--100);
    grid-column-gap: 34px;
    grid-row-gap: 34px;
  }
  .expertise-text-wrap {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .expertise-list-text-wrap {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
  }
  .accelerate-wrap {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .accelerate-01 {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    width: 600px;
  }
  .accelerate-02 {
    width: 600px;
    height: 500px;
    margin-left: auto;
    margin-right: auto;
    padding: 40px;
  }
  .accelerate-03 {
    width: var(--later-spacing--100);
  }
  .accelerate-03-inner {
    margin-top: 0;
  }
  .teams {
    padding-top: 20px;
  }
  .teams-top {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .teams-bottom {
    width: var(--later-spacing--100);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    -ms-grid-columns: 1fr 0px 1fr;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: -ms-grid;
    display: grid;
  }
  .teams-bottom > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .teams-bottom > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .awadrs-wrap {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .awadrs-left {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    text-align: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 600px;
    position: static;
  }
  .awadrs-right-inner {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .awadrs-right-shadow {
    display: none;
  }
  .awadrs-list-wrap {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .presence-top {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .presence-bottom {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    margin-top: 40px;
  }
  .presence-top-right {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .blog-v1 {
    padding-top: 60px;
  }
  .blog-v1-top-left {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .blog-v1-collection-list {
    grid-column-gap: 12px;
    grid-row-gap: 30px;
    -ms-grid-columns: 1fr 12px 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .blog-v1-image {
    height: 100%;
  }
  .service-hero-left {
    width: 450px;
  }
  .service-hero-card {
    grid-column-gap: 31px;
    grid-row-gap: 31px;
  }
  .hero-card-text {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .service-heading-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .service-top-heading {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .service-top-left {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .service-top-bottom {
    width: 100%;
  }
  .service-box-inner-bottom {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-flow: column-reverse;
            flex-flow: column-reverse;
    padding-top: 40px;
  }
  .service-box-left {
    width: var(--later-spacing--100);
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .service-inner-right, .service-inner-left {
    width: var(--later-spacing--100);
  }
  .service-list-01 {
    width: 200px;
  }
  .choose-us-v1-bottom {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    -ms-grid-columns: 1fr 14px 1fr;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: -ms-grid;
    display: grid;
  }
  .choose-us-v1-bottom > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .choose-us-v1-bottom > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .choose-us-box-list-40, .choose-us-box-list-20 {
    width: var(--later-spacing--100);
    grid-column-gap: 80px;
    grid-row-gap: 80px;
    height: auto;
  }
  .work-collection-list {
    grid-column-gap: 24px;
  }
  .work-details-wrap {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-flow: column-reverse;
            flex-flow: column-reverse;
  }
  .work-details-right {
    width: var(--later-spacing--100);
    grid-column-gap: 36px;
    grid-row-gap: 36px;
    position: static;
  }
  .work-main-image {
    height: 500px;
  }
  .work-details-image-01 {
    height: 450px;
  }
  .work-details-image-v2 {
    height: 400px;
  }
  .work-details-box-inner {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .work-rich-text h5 {
    margin-top: 28px;
  }
  .blog {
    padding-bottom: 80px;
  }
  .blog-bottom {
    margin-top: 80px;
  }
  .blog-tabs {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .blog-tabs-content {
    margin-top: 40px;
  }
  .blog-tabs-menu {
    width: var(--later-spacing--100);
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-flow: row;
            flex-flow: row;
  }
  .blog-tab-link {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .blog-list-wrap {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
  }
  .blog-list-top {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
    -ms-grid-columns: 1fr 14px 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .blog-details-bottom {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-flow: column-reverse;
            flex-flow: column-reverse;
  }
  .blog-details-left {
    position: static;
  }
  .blog-main-image {
    height: 450px;
  }
  .blog-heading {
    padding-bottom: 10px;
  }
  .blog-rich-text h5 {
    margin-top: 30px;
  }
  .blog-details-image-wrap {
    height: 400px;
  }
  .contact-info-bottom {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    -ms-grid-columns: 1fr 12px 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .contact-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-flow: column-reverse;
            flex-flow: column-reverse;
  }
  .contact-right {
    height: 500px;
    max-width: var(--later-spacing--100);
  }
  .contact-left {
    width: var(--later-spacing--100);
    padding-top: 0;
    padding-right: 0;
  }
  .form-field-wrap {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }
  .form-field-main-wrap {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .contact-form {
    grid-column-gap: 22px;
    grid-row-gap: 22px;
  }
  .text-field {
    min-height: 50px;
  }
  .submit-button {
    background-image: none;
    background-repeat: repeat;
    background-size: auto;
    padding-left: 20px;
    padding-right: 20px;
  }
  .contact-info-box {
    grid-column-gap: 56px;
    grid-row-gap: 56px;
  }
  .contact-info-box-top {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .pricing-collection-list {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .pricing-list-wrap {
    grid-column-gap: 31px;
    grid-row-gap: 31px;
  }
  .pricing-middle-list {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .pricing-details-text {
    margin-top: 0;
  }
  .pricing-rich-text h5 {
    margin-top: 30px;
  }
  .pricing-card-right {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    padding: 20px;
  }
  .add-to-cart-button {
    background-image: none;
    background-repeat: repeat;
    background-size: auto;
    padding-left: 15px;
    padding-right: 15px;
  }
  .add-to-cart-button:hover {
    background-image: none;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto;
  }
  .license-bottom {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .license-list-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .license-box-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .changelog-bottom {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .changelog-list-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .privacy-policy-bottom,
  .standard-text-page-bottom {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .policy-item-list {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .policy-item-bottom {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .policy-item-list-01 {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }
  .pass-icon-heading {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  ._404-inner-wrap {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .form-container {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .team-mamber-list {
    padding-bottom: 40px;
    padding-right: 0;
  }
  .team-mamber-list._01 {
    border-left-width: 0;
    padding-left: 0;
    padding-right: 20px;
  }
  .team-mamber-list._001 {
    padding-left: 0;
    padding-right: 20px;
  }
  .team-mamber-image {
    height: auto;
  }
  .team-mamber-info {
    grid-column-gap: 2px;
    grid-row-gap: 2px;
  }
  .drag-box {
    display: none;
  }
  .team-bottom-wrap {
    width: var(--later-spacing--100);
  }
  .button {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    padding-left: 24px;
    padding-right: 24px;
  }
  .footer-link-widget {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }
}
@media screen and (max-width: 767px) {
  body {
    --_responsive---padding--padding-80-px: 50px;
    --_responsive---padding--padding-160-px: 80px;
    --_responsive---margin--margin-100-px: 60px;
    --_responsive---border-radius-12-px: 8px;
    --_responsive---border-radius-10-px: 8px;
    --_responsive---border-radius-8-px: 8px;
    --_responsive---margin--margin-60-px: 40px;
    --_responsive---padding--padding-32-px: 24px;
    --_responsive---border-radius-16-px: 10px;
    --_responsive---margin--margin-80-px: 50px;
    --_responsive---padding--padding-100-px: 60px;
    --_responsive---padding--padding-24-px: 18px;
    --_responsive---padding--padding-134-px: 100px;
    --_responsive---padding--padding-60-px: 40px;
    --_responsive---padding--padding-40-px: 26px;
    --_responsive---padding--padding-30-px: 20px;
    --_responsive---padding--padding-20-px: 18px;
    --_responsive---padding--padding-27-px: 18px;
    --_responsive---margin--margin-160-px: 100px;
    --_responsive---margin--margin-140-px: 80px;
    --_responsive---margin--margin-120-px: 80px;
    --_responsive---margin--margin-96-px: 50px;
    --_responsive---margin--margin-72-px: 40px;
    --_responsive---margin--margin-70-px: 40px;
    --_responsive---padding--padding-173-px: 100px;
    --_responsive---padding--padding-140-px: 80px;
    --_responsive---padding--padding-120-px: 60px;
    --_responsive---padding--padding-70-px: 50px;
    --_responsive---padding--padding-22-px: 18px;
    --_typography---paragraph-02--font-size: 15px;
    --_typography---paragraph-02--line-height: 23px;
    --_typography---h1--font-size: 42px;
    --_typography---h1--line-height: 50px;
    --_typography---h1--letter-spacing: var(--later-spacing--2);
    --_typography---h2--font-size: 38px;
    --_typography---h2--line-height: 46px;
    --_typography---h2--font-weight: var(--font-weight--semi-bold);
    --_typography---h2--letter-spacing: var(--later-spacing--2);
    --_typography---h3--font-size: 30px;
    --_typography---h3--line-height: 38px;
    --_typography---h3--font-weight: var(--font-weight--semi-bold);
    --_typography---h3--letter-spacing: 0px;
    --_typography---h4--font-size: 26px;
    --_typography---h4--line-height: 34px;
    --_typography---h4--font-weight: var(--font-weight--semi-bold);
    --_typography---h4--letter-spacing: var(--later-spacing--2);
    --_typography---h5--font-size: 20px;
    --_typography---h5--line-height: 28px;
    --_typography---h5--font-weight: var(--font-weight--semi-bold);
    --_typography---h5--letter-spacing: var(--later-spacing--2);
    --_typography---h6--font-size: 18px;
    --_typography---h6--line-height: 26px;
    --_typography---h6--font-weight: var(--font-weight--semi-bold);
    --_typography---h6--letter-spacing: var(--later-spacing--2);
    --_typography---paragraph-01--font-size: 15px;
    --_typography---paragraph-01--line-height: 23px;
    --_typography---tag--font-size: 14px;
    --_typography---tag--line-height: 20px;
    --_typography---display-01--font-size: 70px;
    --_typography---display-01--line-height: 78px;
    --_typography---display-01--letter-spacing: var(--later-spacing--4);
    --_typography---display-02--font-size: 50px;
    --_typography---display-02--line-height: 58px;
    --_typography---display-02--letter-spacing: var(--later-spacing--4);
    --_typography---button-text--font-size: 16px;
    --_typography---button-text--line-height: 24px;
    --_typography---display-01--font-weight: var(--font-weight--normal);
    --_typography---display-02--font-weight: var(--font-weight--medium);
    --_typography---h1--font-weight: var(--font-weight--semi-bold);
    --_typography---paragraph-01--font-weight: var(--font-weight--medium);
    --_typography---paragraph-01--letter-spacing: 0px;
    --_typography---paragraph-02--font-weight: var(--font-weight--medium);
    --_typography---paragraph-02--letter-spacing: 0px;
    --_typography---button-text--font-weight: var(--font-weight--semi-bold);
    --_typography---button-text--letter-spacing: var(--later-spacing--2);
    --_typography---tag--font-weight: var(--font-weight--semi-bold);
    --_typography---tag--letter-spacing: var(--later-spacing--2);
  }
  .utility-page-content {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .utility-page-form {
    grid-column-gap: 26px;
    grid-row-gap: 26px;
  }
  .container {
    padding-left: 14px;
    padding-right: 14px;
  }
  .style-guide-bottom {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
  }
  .style-guide-item {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .style-guide-item-right {
    grid-column-gap: 26px;
    grid-row-gap: 26px;
  }
  .typography-list {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }
  .style-guide-color-wrap {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .color-block {
    height: 150px;
  }
  .button-01 {
    padding: 10px 22px;
  }
  .button-01:where(.variant-button-01-hero), .button-01.hero-butoon {
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .style-guide-button-wrap {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .hero-v1 {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .hero-v1._01 {
    max-width: 490px;
  }
  .hero-v1-heading-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .footer-top {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .footer-bottom {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-top: 80px;
  }
  .footer-top-left {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    width: 500px;
  }
  .social-link-list {
    width: 40px;
    height: 40px;
  }
  .footer-right-01 {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .footer-right-02 {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .footer-info-box {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }
  .navbar-right {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .navbar-brand {
    padding-left: 0;
  }
  .nav-menu-wrapper {
    padding: 28px;
  }
  .navbar-container {
    padding-left: 14px;
    padding-right: 14px;
  }
  .mobile-margin-top-10 {
    margin-top: 10px;
  }
  .button-02-arrow-group {
    width: 22px;
    height: 22px;
  }
  .menu-button {
    width: 30px;
    height: 30px;
  }
  .nav-menu {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .button-04 {
    padding: 6px 6px 6px 22px;
  }
  .paragraph-8 {
    font-size: 18px;
    line-height: 24px;
  }
  .navbar {
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .nav-dropdown-list-wrap.shadow-three {
    -webkit-box-shadow: 0 8px 50px rgba(0, 0, 0, 0.0509803922);
            box-shadow: 0 8px 50px rgba(0, 0, 0, 0.0509803922);
  }
  .nav-dropdown-list-wrap.shadow-three.is-open {
    position: relative;
  }
  .nav-dropdown-list-wrap.shadow-three.mobile-shadow-hide {
    -webkit-box-shadow: none;
            box-shadow: none;
  }
  .nav-dropdown-toggle.is-open {
    margin-left: 0;
    margin-right: 0;
  }
  .nav-dropdown-list.left {
    padding-right: 16px;
  }
  .nav-dropdown-list.center {
    padding-left: 16px;
    padding-right: 16px;
  }
  .nav-dropdown-list.right {
    padding-left: 16px;
  }
  .dropdown-page-link-list {
    grid-column-gap: 11px;
    grid-row-gap: 11px;
    margin-top: 16px;
  }
  .nav-dropdown-list-body {
    width: 100%;
    padding: 16px;
  }
  .nav-dropdown-icon {
    font-size: 12px;
  }
  .dropdown-page-link.dropdown-link-text {
    font-size: 14px;
    line-height: 20px;
  }
  .h5 {
    font-size: 20px;
    line-height: 28px;
  }
  .h6 {
    font-size: 16px;
    line-height: 24px;
  }
  .fit-cover:where(.variant-blog-widget-v2) {
    min-height: 350px;
    max-height: 350px;
  }
  .home-hero-top {
    grid-column-gap: 21px;
    grid-row-gap: 21px;
  }
  .hero-button-wrap {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .hero-button-01 {
    width: 180px;
  }
  .button-02 {
    padding: 16px 22px;
  }
  .hero-brand-wrap {
    text-align: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding-top: 30px;
  }
  .hero-brand-right {
    padding-top: 21px;
    padding-bottom: 21px;
  }
  .logo-box {
    margin-right: 33px;
  }
  .bg-linner-left {
    border-left: 1px solid #ebebeb;
    width: 132px;
  }
  .bg-linner-right {
    border-right-width: 1px;
    width: 132px;
  }
  .button-wrap._404-page-button {
    margin-top: 6px;
  }
  .home-about-box {
    height: 250px;
  }
  .home-about-box-text {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }
  .statistics-number-wrap {
    height: 58px;
  }
  .statistics-number-wrap._01 {
    height: 78px;
  }
  .hero-v2 {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .tabs-content {
    margin-top: 30px;
  }
  .choose-us-image-wrap {
    height: 400px;
  }
  .choose-us-tab-link {
    padding: 20px;
  }
  .choose-tab-link-text {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .tab-details-text-01 {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }
  .ceo-words-wrap {
    grid-column-gap: 100px;
    grid-row-gap: 100px;
    padding-top: 40px;
    padding-bottom: 20px;
  }
  .ceo-words-top {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .ceo-words-bottom-right {
    margin-bottom: -13px;
  }
  .our-service-bottom {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .home-service-box {
    grid-column-gap: 26px;
    grid-row-gap: 26px;
  }
  .projects-v1-top {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .projects-v1-heading {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .heading-wrap.project-heading {
    width: 500px;
  }
  .process-number-box {
    width: 54px;
    height: 54px;
  }
  .need-to-know-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .need-to-know-left {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .need-to-know-right {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .reviews-bottom {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .reviews-box-wrap {
    height: 400px;
  }
  .reviews-box-text-wrap {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .faq:where(.variant-faq-margin-20) {
    padding-top: 60px;
  }
  .faq-wrap {
    grid-column-gap: 44px;
    grid-row-gap: 44px;
  }
  .faq-left {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .normal-s-regular.faq-answer {
    padding-top: 10px;
  }
  .collection-list {
    grid-column-gap: 34px;
    grid-row-gap: 34px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .project-v1-list {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .project-v1-image {
    height: 320px;
  }
  .project-v1-image.v2 {
    height: 200px;
  }
  .about-hero {
    padding-bottom: 50px;
  }
  .about-hero-top {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .about-hero-bottom {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    margin-top: 20px;
  }
  .about-image-wrap {
    width: 57%;
    height: 170px;
  }
  .about-sub-heading-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .about-left-image, .about-right-image {
    width: 100px;
  }
  .about-brand-wrap {
    grid-column-gap: 44px;
    grid-row-gap: 44px;
  }
  .about-brand-left {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
  }
  .about-brand-right {
    grid-column-gap: 18px;
    grid-row-gap: 40px;
  }
  .brand-counter-box {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .left-brand-box {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .lefft-brand-image {
    width: 120px;
  }
  .who-we-are-top {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .history-wrap {
    grid-column-gap: 42px;
    grid-row-gap: 42px;
  }
  .history-right {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .history-top-icon {
    width: 38px;
  }
  .history-top-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .expertise-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .expertise-left {
    grid-column-gap: 22px;
    grid-row-gap: 22px;
  }
  .expertise-right {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .expertise-text-wrap {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }
  .expertise-list {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .expertise-list-text-wrap {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
  }
  .expertise-list-text {
    font-size: 38px;
    line-height: 46px;
  }
  .accelerate-01 {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
  }
  .accelerate-02 {
    width: var(--later-spacing--100);
    height: 400px;
    padding: 34px;
  }
  .teams-top {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .awadrs-left {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .awadrs-right-inner {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .presence-top {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .presence-bottom {
    margin-top: 30px;
  }
  .presence-top-right {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .presence-icon {
    width: 30px;
  }
  .blog-v1 {
    padding-top: 50px;
  }
  .blog-v1-top {
    grid-column-gap: 17px;
    grid-row-gap: 17px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .blog-v1-top-left {
    grid-column-gap: 17px;
    grid-row-gap: 17px;
  }
  .blog-v1-collection-list {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .blog-v1-list {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .blog-v1-text-wrap {
    grid-column-gap: 5px;
    grid-row-gap: 5px;
  }
  .blog-v1-sub-title {
    grid-row-gap: 0px;
    -ms-flex-flow: wrap;
        flex-flow: wrap;
  }
  .service-hero-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
  .service-hero-right {
    width: 280px;
  }
  .service-nav-hero {
    height: 80vh;
  }
  .service-hero-card {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    padding: 20px;
  }
  .hero-card-text {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .hero-card-icon {
    width: 50px;
  }
  .service-top-heading, .service-top-left {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .service-box-inner-bottom {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    padding-top: 20px;
  }
  .service-box-right {
    width: 180px;
    height: 240px;
  }
  .service-box-left {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .service-inner-right {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
  .choose-us-v1-bottom {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .choose-us-box-list-40, .choose-us-box-list-20 {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
  }
  .work-collection-list {
    grid-column-gap: 18px;
    grid-row-gap: 26px;
  }
  .work-details-right {
    grid-column-gap: 26px;
    grid-row-gap: 26px;
  }
  .work-main-image {
    height: 350px;
  }
  .work-details-image-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .work-details-image-01 {
    height: 320px;
  }
  .work-details-image-02 {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .work-details-image-v2 {
    height: 300px;
  }
  .work-rich-text h5 {
    margin-top: 24px;
  }
  .work-rich-text p {
    font-size: 16px;
    line-height: 24px;
  }
  .related-work-top {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .blog {
    padding-bottom: 60px;
  }
  .blog-bottom {
    margin-top: 60px;
  }
  .blog-tabs-content {
    margin-top: 30px;
  }
  .blog-tabs-menu {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    -ms-flex-flow: wrap;
        flex-flow: wrap;
  }
  .blog-tab-link {
    padding: 10px 26px;
  }
  .blog-list-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .blog-list-top {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .blog-details-bottom {
    margin-top: 50px;
  }
  .blog-details-left {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .blog-main-image {
    height: auto;
  }
  .blog-rich-text h5 {
    margin-top: 20px;
  }
  .blog-rich-text p {
    font-size: 16px;
    line-height: 25px;
  }
  .blog-rich-text li {
    margin-top: 6px;
  }
  .blog-details-image-wrap {
    height: auto;
  }
  .contact-right {
    height: 400px;
  }
  .contact-left {
    grid-column-gap: 38px;
    grid-row-gap: 38px;
  }
  .contact-heading-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .form-field-wrap {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
  }
  .form-field-main-wrap {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .contact-form {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .text-field-02 {
    min-height: 100px;
  }
  .contact-info-box {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .contact-box-icon-wrap {
    width: 50px;
    height: 50px;
  }
  .contact-box-icon {
    width: 20px;
  }
  .contact-info-box-top {
    grid-column-gap: 11px;
    grid-row-gap: 11px;
  }
  .pricing-collection-list {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .pricing-middle-list {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .pricing-card-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .pricing-details-text {
    margin-top: 20px;
  }
  .pricing-rich-text h5 {
    margin-top: 24px;
  }
  .pricing-rich-text p {
    margin-top: 10px;
  }
  .pricing-card-right {
    width: var(--later-spacing--100);
    padding: 18px;
  }
  .add-to-cart-button {
    padding: 12px;
  }
  .license-bottom {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .license-list-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .license-box-wrap {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .changelog-bottom {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .changelog-list-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .privacy-policy-bottom,
  .standard-text-page-bottom {
    grid-column-gap: 26px;
    grid-row-gap: 26px;
  }
  .policy-item-list, .policy-item-top {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .policy-item-list-01 {
    padding-left: 22px;
  }
  .pass-icon-heading, .pass-inpute-box {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .form-container {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .team-mamber-list {
    padding-bottom: 30px;
  }
  .team-mamber-list._01, .team-mamber-list._001 {
    padding-right: 18px;
  }
  .team-mamber-image {
    height: auto;
  }
  .cookies-block {
    bottom: 20px;
    right: 20px;
  }
  .modal-input-field-wrapper {
    grid-row-gap: 24px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .modal-wrap {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    max-height: 500px;
  }
  .footer-link-widget {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }
  .fooer-link-wrap {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
  }
}
@media screen and (max-width: 479px) {
  body {
    --_responsive---padding--padding-80-px: 40px;
    --_responsive---padding--padding-160-px: 70px;
    --_responsive---margin--margin-100-px: 40px;
    --_responsive---border-radius-12-px: 6px;
    --_responsive---border-radius-10-px: 6px;
    --_responsive---border-radius-8-px: 6px;
    --_responsive---margin--margin-60-px: 30px;
    --_responsive---padding--padding-32-px: 20px;
    --_responsive---border-radius-16-px: 8px;
    --_responsive---margin--margin-80-px: 40px;
    --_responsive---padding--padding-100-px: 40px;
    --_responsive---padding--padding-24-px: 16px;
    --_responsive---padding--padding-134-px: 80px;
    --_responsive---padding--padding-60-px: 30px;
    --_responsive---padding--padding-40-px: 20px;
    --_responsive---padding--padding-30-px: 18px;
    --_responsive---padding--padding-20-px: 16px;
    --_responsive---padding--padding-27-px: 16px;
    --_responsive---margin--margin-160-px: 80px;
    --_responsive---margin--margin-140-px: 60px;
    --_responsive---margin--margin-120-px: 60px;
    --_responsive---margin--margin-96-px: 40px;
    --_responsive---margin--margin-72-px: 30px;
    --_responsive---margin--margin-70-px: 30px;
    --_responsive---padding--padding-173-px: 80px;
    --_responsive---padding--padding-140-px: 60px;
    --_responsive---padding--padding-120-px: 40px;
    --_responsive---padding--padding-70-px: 40px;
    --_responsive---padding--padding-22-px: 16px;
    --_typography---paragraph-02--font-size: 15px;
    --_typography---paragraph-02--line-height: 23px;
    --_typography---h1--font-size: 34px;
    --_typography---h1--line-height: 42px;
    --_typography---h1--letter-spacing: var(--later-spacing--2);
    --_typography---h2--font-size: 28px;
    --_typography---h2--line-height: 36px;
    --_typography---h2--font-weight: var(--font-weight--semi-bold);
    --_typography---h2--letter-spacing: var(--later-spacing--2);
    --_typography---h3--font-size: 24px;
    --_typography---h3--line-height: 32px;
    --_typography---h3--font-weight: var(--font-weight--semi-bold);
    --_typography---h3--letter-spacing: 0px;
    --_typography---h4--font-size: 22px;
    --_typography---h4--line-height: 30px;
    --_typography---h4--font-weight: var(--font-weight--semi-bold);
    --_typography---h4--letter-spacing: var(--later-spacing--2);
    --_typography---h5--font-size: 18px;
    --_typography---h5--line-height: 26px;
    --_typography---h5--font-weight: var(--font-weight--semi-bold);
    --_typography---h5--letter-spacing: var(--later-spacing--2);
    --_typography---h6--font-size: 16px;
    --_typography---h6--line-height: 24px;
    --_typography---h6--font-weight: var(--font-weight--semi-bold);
    --_typography---h6--letter-spacing: var(--later-spacing--2);
    --_typography---paragraph-01--font-size: 15px;
    --_typography---paragraph-01--line-height: 23px;
    --_typography---tag--font-size: 14px;
    --_typography---tag--line-height: 20px;
    --_typography---display-01--font-size: 60px;
    --_typography---display-01--line-height: 68px;
    --_typography---display-01--letter-spacing: var(--later-spacing--4);
    --_typography---display-02--font-size: 44px;
    --_typography---display-02--line-height: 52px;
    --_typography---display-02--letter-spacing: var(--later-spacing--4);
    --_typography---button-text--font-size: 15px;
    --_typography---button-text--line-height: 23px;
    --_typography---display-01--font-weight: var(--font-weight--normal);
    --_typography---display-02--font-weight: var(--font-weight--medium);
    --_typography---h1--font-weight: var(--font-weight--semi-bold);
    --_typography---paragraph-01--font-weight: var(--font-weight--medium);
    --_typography---paragraph-01--letter-spacing: 0px;
    --_typography---paragraph-02--font-weight: var(--font-weight--medium);
    --_typography---paragraph-02--letter-spacing: 0px;
    --_typography---button-text--font-weight: var(--font-weight--semi-bold);
    --_typography---button-text--letter-spacing: var(--later-spacing--2);
    --_typography---tag--font-weight: var(--font-weight--semi-bold);
    --_typography---tag--letter-spacing: var(--later-spacing--2);
  }
  .utility-page-content {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .utility-page-form {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    padding-left: 10px;
    padding-right: 10px;
  }
  .container {
    padding-left: 12px;
    padding-right: 12px;
  }
  .container.hero-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding-bottom: 40px;
  }
  .style-guide-bottom {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .style-guide-item {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .style-guide-item-right {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .style-guide-color-wrap {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .color-block {
    height: 100px;
  }
  .button-01 {
    padding-left: 20px;
    padding-right: 20px;
  }
  .button-01:where(.variant-button-01-hero), .button-01.hero-butoon {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .button-01-wrap {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }
  .button-01-icon-wrap {
    width: 16px;
    height: 16px;
  }
  .style-guide-button-wrap {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .hero-v1 {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .hero-v1-heading-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .footer {
    padding-bottom: 16px;
  }
  .footer-top {
    grid-column-gap: 34px;
    grid-row-gap: 34px;
  }
  .footer-bottom {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
    margin-top: 50px;
  }
  .text-light.footer-heading {
    font-size: 22px;
    line-height: 30px;
  }
  .footer-top-left {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .footer-top-right {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    -ms-flex-flow: wrap;
        flex-flow: wrap;
  }
  .social-link-wrap {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .social-link-list {
    width: 30px;
    height: 30px;
  }
  .social-link-list.first-one {
    margin-left: -10px;
  }
  .footer-right-01 {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    width: 100%;
  }
  .footer-right-02 {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .footer-info-box {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
  }
  .navbar-right {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .navbar-brand {
    width: 130px;
  }
  .nav-menu-wrapper {
    padding: 24px 18px;
  }
  .navbar-container {
    padding-left: 12px;
    padding-right: 12px;
  }
  .cart-list {
    padding-left: 5px;
    padding-right: 5px;
  }
  .cart-header {
    padding-left: 16px;
    padding-right: 16px;
  }
  .button-02-arrow-group {
    width: 20px;
    height: 20px;
  }
  .menu-button {
    width: 28px;
    height: 28px;
    padding: 2px;
  }
  .paragraph-7 {
    font-size: 14px;
    line-height: 25px;
  }
  .nav-menu {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .button-04 {
    padding: 5px 5px 5px 20px;
  }
  .nav-button-wrapper {
    width: auto;
  }
  .paragraph-8 {
    font-size: 16px;
    line-height: 22px;
  }
  .navbar {
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .nav-dropdown-list-wrap.shadow-three.mobile-shadow-hide.pages.is-open {
    padding-top: 8px;
  }
  .nav-dropdown-list {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }
  .nav-dropdown-list.left {
    padding-right: 0;
  }
  .nav-dropdown-list.center {
    border-left-width: 0;
    border-right-width: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .nav-dropdown-list.right {
    padding-left: 0;
  }
  .dropdown-page-link-list {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    margin-top: 12px;
  }
  .nav-dropdown-list-body {
    grid-column-gap: 16px;
    grid-row-gap: 24px;
    -ms-grid-rows: auto 24px auto;
    grid-template-rows: auto auto;
    -ms-grid-columns: 1fr 16px 1fr;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: -ms-grid;
    display: grid;
  }
  .nav-dropdown-list-body > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .nav-dropdown-list-body > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .nav-dropdown-list-body > *:nth-child(3) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .nav-dropdown-list-body > *:nth-child(4) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
  .h5 {
    font-size: 18px;
    line-height: 26px;
  }
  .h6 {
    font-size: 16px;
  }
  .home-hero-wrap {
    padding-bottom: 0;
  }
  .fit-cover.ceo-home-bg {
    -o-object-position: 10% 50%;
       object-position: 10% 50%;
  }
  .fit-cover.expertise-bg-image {
    display: none;
  }
  .fit-cover.service-image {
    -o-object-position: 50% 0%;
       object-position: 50% 0%;
  }
  .home-hero-top {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .hero-button-wrap {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .hero-button-01 {
    width: var(--later-spacing--100);
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .hero-button-01._01 {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .button-02 {
    padding: 12px 20px;
  }
  .hero-hom-sub-heading {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    position: static;
  }
  .hero-brand-wrap {
    padding-top: 20px;
  }
  .hero-brand-right {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .logo-box {
    max-width: 120px;
    margin-right: 23px;
  }
  .bg-linner-left, .bg-linner-right {
    width: 100px;
  }
  .home-about-top {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .home-about-bottom {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .home-about-top-right {
    grid-column-gap: 22px;
    grid-row-gap: 22px;
  }
  .button-wrap._404-page-button {
    margin-top: 5px;
  }
  .home-about-box {
    height: 220px;
  }
  .hover-dot {
    margin-top: 20px;
    margin-right: 20px;
  }
  .statistics-number-wrap {
    height: 52px;
  }
  .statistics-number-wrap._01 {
    height: 68px;
  }
  .hero-v2 {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .tabs-content {
    margin-top: 20px;
  }
  .choose-us-image-wrap {
    height: 300px;
  }
  .choose-us-tab-link {
    padding: 16px;
  }
  .choose-tab-link-text {
    grid-column-gap: 28px;
    grid-row-gap: 28px;
  }
  .tab-details-text {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }
  .tab-details-text-01 {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }
  .ceo-words-wrap {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .ceo-words-bottom {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-flow: column-reverse;
            flex-flow: column-reverse;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .ceo-words-bottom-left {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .ceo-words-bottom-right {
    margin-bottom: 0;
  }
  .ceo-image {
    width: 52px;
    height: 52px;
  }
  .our-service-top, .our-service-bottom {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .home-service-box {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
  }
  .service-card-icon-wrap {
    width: 52px;
    height: 52px;
  }
  .service-card-icon {
    width: 20px;
  }
  .process-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .process-left {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .process-number-box {
    width: 50px;
    height: 50px;
  }
  .need-to-know-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .need-to-know-left {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .need-to-know-right {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .reviews-box-wrap {
    height: auto;
  }
  .reviews-box-text-wrap {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
    left: 14px;
    right: 14px;
  }
  .faq:where(.variant-faq-margin-20) {
    padding-top: 40px;
  }
  .faq-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .faq-left {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }
  .faq-item {
    padding-bottom: 20px;
  }
  .faq-icon-box {
    -webkit-box-flex: 0;
        -ms-flex: none;
            flex: none;
  }
  .collection-list {
    grid-column-gap: 26px;
    grid-row-gap: 26px;
  }
  .project-v1-list {
    grid-column-gap: 13px;
    grid-row-gap: 13px;
  }
  .project-v1-bottom {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .project-v1-image {
    height: 200px;
  }
  .project-v1-image.v2 {
    height: 220px;
  }
  .project-v1-text-wrap {
    grid-column-gap: 8px;
    grid-row-gap: 1px;
  }
  .about-hero-top {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .about-hero-bottom {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
    margin-top: 19px;
  }
  .about-image-wrap {
    width: 60%;
    height: 150px;
  }
  .about-sub-heading-wrap {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .about-left-image, .about-right-image {
    width: 74px;
  }
  .about-brand-wrap {
    grid-column-gap: 36px;
    grid-row-gap: 36px;
  }
  .about-brand-left {
    grid-column-gap: 38px;
    grid-row-gap: 38px;
    padding: 10px;
  }
  .about-brand-right {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .brand-counter-box {
    grid-column-gap: 7px;
    grid-row-gap: 7px;
  }
  .left-brand-box {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .who-we-are-top {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .company-history {
    padding-top: 20px;
  }
  .history-wrap {
    grid-column-gap: 38px;
    grid-row-gap: 38px;
  }
  .history-left {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .history-heading-wrap {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }
  .history-list-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .history-top-icon {
    width: 34px;
  }
  .history-top-wrap {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .expertise-bg {
    background-color: var(--color--dark);
  }
  .expertise-right {
    grid-column-gap: 26px;
    grid-row-gap: 26px;
  }
  .expertise-list {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .expertise-list-text {
    font-size: 30px;
    line-height: 38px;
  }
  .accelerate-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .accelerate-01 {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .accelerate-02 {
    padding: 30px;
  }
  .teams-top {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .teams-bottom {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .awadrs {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .awadrs-left {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .awadrs-right-inner {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .presence-bottom {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    margin-top: 27px;
  }
  .presence-icon-wrap {
    width: 54px;
    height: 54px;
  }
  .presence-icon {
    width: 28px;
  }
  .blog-v1 {
    padding-top: 40px;
  }
  .blog-v1-top {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }
  .blog-v1-top-left {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .blog-v1-collection-list {
    grid-row-gap: 24px;
  }
  .blog-v1-list {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .service-hero-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .service-hero-right {
    width: var(--later-spacing--100);
  }
  .service-nav-hero {
    height: 70vh;
  }
  .service-heading-wrap {
    grid-column-gap: 11px;
    grid-row-gap: 11px;
  }
  .service-top-heading, .service-top-left {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }
  .service-box-inner-bottom {
    grid-column-gap: 22px;
    grid-row-gap: 22px;
  }
  .service-box-right {
    width: var(--later-spacing--100);
    height: 300px;
  }
  .service-box-left {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .service-inner-right {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    -ms-flex-flow: wrap;
        flex-flow: wrap;
  }
  .choose-us-v1-bottom {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .work-collection-list {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .work-details-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
  .work-details-right {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .work-main-image {
    height: 240px;
  }
  .work-details-image-01 {
    height: 200px;
  }
  .work-details-image-02 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .work-details-image-v2 {
    height: 200px;
  }
  .work-details-box-inner {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
  }
  .work-rich-text h5 {
    margin-top: 22px;
  }
  .work-rich-text p {
    margin-top: 6px;
    font-size: 15px;
    line-height: 23px;
  }
  .related-work-top {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .blog {
    padding-bottom: 40px;
  }
  .blog-bottom {
    margin-top: 40px;
  }
  .blog-tabs-content {
    margin-top: 20px;
  }
  .blog-tabs-menu {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }
  .blog-tab-link {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .blog-list-wrap {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
  }
  .blog-list-top {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .blog-details-bottom {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    margin-top: 40px;
  }
  .blog-details-left {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .blog-main-image {
    height: 175px;
  }
  .blog-rich-text h5 {
    margin-top: 18px;
  }
  .blog-rich-text p {
    font-size: 15px;
    line-height: 24px;
  }
  .blog-rich-text ul {
    padding-left: 24px;
  }
  .blog-rich-text li {
    font-size: 15px;
    line-height: 23px;
  }
  .similar-blog-top {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .blog-details-left-top {
    grid-column-gap: 11px;
    grid-row-gap: 11px;
    -ms-flex-flow: wrap;
        flex-flow: wrap;
  }
  .contact-info-bottom {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .contact-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .contact-right {
    height: auto;
  }
  .contact-left {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .form-field-wrap {
    grid-column-gap: 2px;
    grid-row-gap: 2px;
  }
  .form-field-main-wrap {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .form-button-wrap {
    margin-top: 10px;
  }
  .contact-form {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
  .text-field {
    min-height: 48px;
    padding: 12px 18px;
  }
  .contact-info-box {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
  .pricing-collection-list {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .pricing-list-wrap {
    grid-column-gap: 28px;
    grid-row-gap: 28px;
  }
  .pricing-middle-list {
    padding-top: 6px;
    padding-bottom: 6px;
  }
  .pricing-middle-list._02 {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  .pricing-details-text {
    margin-top: 10px;
  }
  .pricing-rich-text h5 {
    margin-top: 22px;
  }
  .pricing-rich-text p {
    margin-top: 8px;
  }
  .pricing-card-right {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
  .license-list-wrap {
    grid-column-gap: 26px;
    grid-row-gap: 26px;
  }
  .license-icon {
    width: 24px;
  }
  .license-box-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
  .changelog-list-wrap {
    grid-column-gap: 26px;
    grid-row-gap: 26px;
  }
  .changelog-list-item {
    padding-left: 20px;
  }
  .policy-item-top, .policy-item-bottom {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }
  .pass-inpute-box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .password-text-field {
    min-height: 46px;
  }
  .primary-submit-button {
    width: var(--later-spacing--100);
    border: 1px solid var(--color--primary);
    background-image: none;
    background-repeat: repeat;
    background-size: auto;
    padding: 10px 20px;
    -webkit-transition: border-color 0.3s, background-color 0.3s;
    transition: border-color 0.3s, background-color 0.3s;
  }
  .primary-submit-button:hover {
    border: 1px solid var(--color--secondary);
    background-color: var(--color--light);
  }
  ._404-wrap {
    padding-left: 10px;
    padding-right: 10px;
  }
  ._404-inner-wrap {
    grid-column-gap: 13px;
    grid-row-gap: 13px;
  }
  .form-container {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .team-mamber-list {
    border-left-width: 0;
    padding-bottom: 0;
    padding-left: 0;
  }
  .team-mamber-list._01, .team-mamber-list._001 {
    width: var(--later-spacing--100);
    padding-bottom: 0;
    padding-right: 0;
  }
  .team-mamber-image {
    max-width: var(--later-spacing--100);
  }
  .cookies-block {
    max-width: 280px;
  }
  .footer-link-widget {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
  }
}
#node-_8827d1e6-ab0c-df94-7263-de3c417d1fa9-417d1f95 {
  grid-area: span 1/span 2/span 1/span 2;
}

#node-_40c53d0f-1f36-335a-9552-a83c836cfe08-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe09-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe0a-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe0b-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe0c-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe0d-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe0e-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe0f-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe10-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe11-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe12-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe13-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe14-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe15-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe16-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe17-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe18-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe19-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe1a-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe1b-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe1c-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe1d-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe1e-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe1f-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe20-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe21-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe22-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe23-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe24-836cfe07, #node-_40c53d0f-1f36-335a-9552-a83c836cfe25-836cfe07 {
  grid-area: span 1/span 1/span 1/span 1;
}

#node-ba86b5c0-329e-6f13-cd01-a79850920e31-088eae1e {
  grid-area: span 1/span 2/span 1/span 2;
}

#node-a7a09d12-1706-f709-e583-ca71723c0221-088eae1e {
  grid-area: span 1/span 1/span 1/span 1;
}

@media screen and (max-width: 991px) {
  #node-_33037e29-8dca-791f-af25-320cdcd074ce-088eae19, #node-c841634d-f16e-f370-e439-23df25cfff5f-25cfff45, #node-_215a419c-35d8-fab0-694e-64f785525f87-85525f1f {
    grid-area: span 1/span 2/span 1/span 2;
  }
  #node-ba86b5c0-329e-6f13-cd01-a79850920e31-088eae1e {
    grid-area: span 1/span 1/span 1/span 1;
  }
}
@media screen and (max-width: 767px) {
  #node-_33037e29-8dca-791f-af25-320cdcd074ce-088eae19 {
    -ms-grid-column-span: 1;
    grid-column: span 1/span 1;
  }
  #node-_8827d1e6-ab0c-df94-7263-de3c417d1fa9-417d1f95 {
    grid-area: span 1/span 1/span 1/span 1;
  }
  #node-c841634d-f16e-f370-e439-23df25cfff5f-25cfff45 {
    -ms-grid-column-span: 1;
    grid-column: span 1/span 1;
  }
}
@media screen and (max-width: 479px) {
  #node-_215a419c-35d8-fab0-694e-64f785525f87-85525f1f {
    -ms-grid-column-span: 1;
    grid-column: span 1/span 1;
  }
  #node-_9ce7e095-5690-856e-dbcc-e4be07d2878d-07d28758 {
    grid-area: span 1/span 1/span 1/span 1;
  }
}
/* ======================================================================
   4. Components (hand-written)
   ====================================================================== */
/* Components: vanilla replacements for the Webflow runtime and its IX2
 * interactions.
 *
 * Every duration, delay, offset and easing here was read off the decoded IX2
 * payload (ix2_lists.txt) -- nothing is guessed. Webflow's easing names map to
 * the curves below; `ease` is the CSS keyword of the same name.
 *
 * Rest states live on the ELEMENT, animated states on a class or an attribute
 * main.js toggles, so nothing depends on inline style the way IX2 did. */
:root {
  --ease-out-quart: cubic-bezier(.165, .84, .44, 1);
  --ease-in-out-expo: cubic-bezier(1, 0, 0, 1);
  --ease-in-out: cubic-bezier(.455, .03, .515, .955);
  --ease-out-circ: cubic-bezier(.075, .82, .165, 1);
}

/* ======================================================================
   Scroll reveals
   ======================================================================
   IX2 wrote the rest state inline and animated it away. Here the rest state is
   the class, and main.js removes every reveal class once the element has
   played -- so the animation runs once, exactly as `SCROLL_INTO_VIEW` did, and
   the element is left with nothing of the reveal on it.

   The rest state applies ONLY when scripting is available (`html.js`): with
   JavaScript off, nothing would ever remove it and the page would be blank.

   ANIMATIONS, NOT TRANSITIONS. A `transition:` on the played state would
   replace whatever transition the element already had: `.home-service-box`, `.history-list-wrap`, `.presence-list` and the two `.choose-us-box-list-*`
   cards each carry `transition: box-shadow` AND a reveal, so a transition-based
   reveal silently kills their hover the moment they scroll into view. An
   animation touches no other property, and stripping the classes afterwards
   leaves the element exactly as the design sheet wrote it. */
.js .reveal {
  will-change: transform, opacity, filter;
}

/* -- the designer's six "Slide Up Ns": rise 20%, unblur 5px, fade in.
      500ms for the move and fade, 600ms for the blur, at six delays. */
.js .reveal-blur-up {
  opacity: 0;
  -webkit-filter: blur(5px);
          filter: blur(5px);
  -webkit-transform: translateY(20%);
          transform: translateY(20%);
}

.reveal-blur-up.is-in {
  -webkit-animation: reveal-rise-pct 0.5s ease both, reveal-unblur 0.6s ease both;
          animation: reveal-rise-pct 0.5s ease both, reveal-unblur 0.6s ease both;
}

/* -- "Fade In 0.2": 50px rather than 20%, and a much longer 1200ms outQuart. */
.js .reveal-rise {
  opacity: 0;
  -webkit-filter: blur(5px);
          filter: blur(5px);
  -webkit-transform: translateY(50px);
          transform: translateY(50px);
}

.reveal-rise.is-in {
  -webkit-animation: reveal-rise-px 1.2s var(--ease-out-quart) both, reveal-unblur 0.6s ease both;
          animation: reveal-rise-px 1.2s var(--ease-out-quart) both, reveal-unblur 0.6s ease both;
}

/* -- Webflow's stock presets. All four settle over 1000ms outQuart. */
.js .reveal-fade {
  opacity: 0;
}

.reveal-fade.is-in {
  -webkit-animation: reveal-fade 1s var(--ease-out-quart) both;
          animation: reveal-fade 1s var(--ease-out-quart) both;
}

.js .reveal-up {
  opacity: 0;
  -webkit-transform: translateY(100px);
          transform: translateY(100px);
}

.reveal-up.is-in {
  -webkit-animation: reveal-slide-up 1s var(--ease-out-quart) both;
          animation: reveal-slide-up 1s var(--ease-out-quart) both;
}

.js .reveal-grow {
  opacity: 0;
  -webkit-transform: scale(0.75);
          transform: scale(0.75);
}

.reveal-grow.is-in {
  -webkit-animation: reveal-grow 1s var(--ease-out-quart) both;
          animation: reveal-grow 1s var(--ease-out-quart) both;
}

.js .reveal-shrink {
  opacity: 0;
  -webkit-transform: scale(1.25);
          transform: scale(1.25);
}

.reveal-shrink.is-in {
  -webkit-animation: reveal-shrink 1s var(--ease-out-quart) both;
          animation: reveal-shrink 1s var(--ease-out-quart) both;
}

@-webkit-keyframes reveal-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes reveal-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes reveal-unblur {
  from {
    -webkit-filter: blur(5px);
            filter: blur(5px);
  }
  to {
    -webkit-filter: blur(0);
            filter: blur(0);
  }
}
@keyframes reveal-unblur {
  from {
    -webkit-filter: blur(5px);
            filter: blur(5px);
  }
  to {
    -webkit-filter: blur(0);
            filter: blur(0);
  }
}
/* Opacity travels WITH the transform in these: two animations cannot both own
   `transform`, so each pairing is one set of keyframes. */
@-webkit-keyframes reveal-rise-pct {
  from {
    opacity: 0;
    -webkit-transform: translateY(20%);
            transform: translateY(20%);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes reveal-rise-pct {
  from {
    opacity: 0;
    -webkit-transform: translateY(20%);
            transform: translateY(20%);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes reveal-rise-px {
  from {
    opacity: 0;
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes reveal-rise-px {
  from {
    opacity: 0;
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes reveal-slide-up {
  from {
    opacity: 0;
    -webkit-transform: translateY(100px);
            transform: translateY(100px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes reveal-slide-up {
  from {
    opacity: 0;
    -webkit-transform: translateY(100px);
            transform: translateY(100px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes reveal-grow {
  from {
    opacity: 0;
    -webkit-transform: scale(0.75);
            transform: scale(0.75);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes reveal-grow {
  from {
    opacity: 0;
    -webkit-transform: scale(0.75);
            transform: scale(0.75);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@-webkit-keyframes reveal-shrink {
  from {
    opacity: 0;
    -webkit-transform: scale(1.25);
            transform: scale(1.25);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes reveal-shrink {
  from {
    opacity: 0;
    -webkit-transform: scale(1.25);
            transform: scale(1.25);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
/* The eight stagger delays, straight from the action lists. */
.reveal[data-reveal-delay="100"].is-in {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}

.reveal[data-reveal-delay="150"].is-in {
  -webkit-animation-delay: 0.15s;
          animation-delay: 0.15s;
}

.reveal[data-reveal-delay="200"].is-in {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}

.reveal[data-reveal-delay="250"].is-in {
  -webkit-animation-delay: 0.25s;
          animation-delay: 0.25s;
}

.reveal[data-reveal-delay="300"].is-in {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}

.reveal[data-reveal-delay="400"].is-in {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}

.reveal[data-reveal-delay="500"].is-in {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}

.reveal[data-reveal-delay="600"].is-in {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}

/* `.about-short-image` both grows in and then breathes. The pulse is a separate
   class main.js adds once the reveal has finished and its classes are gone --
   both animate `transform`, so running them together would mean the grow never
   showed at all. IX2 gave the pulse a 5s hold before its first scale. */
.is-breathing {
  -webkit-animation: breathe 10s ease 5s infinite;
          animation: breathe 10s ease 5s infinite;
}

@-webkit-keyframes breathe {
  0%, 100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  25% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
  }
  50% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes breathe {
  0%, 100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  25% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
  }
  50% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
/* ======================================================================
   Navigation
   ====================================================================== */
/* The hamburger. The export drove a Lottie ("Navbar Black Json"): three bars
   for frames 0-21, a two-stroke cross for 21-58, played 0 -> 70% on open. Three
   spans and a transform draw the same two states over the same 500ms. */
.menu-bars {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}

.menu-bars span {
  position: absolute;
  left: 10%;
  width: 80%;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  -webkit-transition: opacity 0.25s ease, -webkit-transform 0.5s ease;
  transition: opacity 0.25s ease, -webkit-transform 0.5s ease;
  transition: transform 0.5s ease, opacity 0.25s ease;
  transition: transform 0.5s ease, opacity 0.25s ease, -webkit-transform 0.5s ease;
}

.menu-bars span:nth-child(1) {
  top: 26%;
}

.menu-bars span:nth-child(2) {
  top: calc(50% - 1px);
}

.menu-bars span:nth-child(3) {
  top: 74%;
}

.menu-button {
  color: var(--color--dark);
}

.menu-button.is-open .menu-bars span:nth-child(1) {
  -webkit-transform: translateY(32%) rotate(45deg);
          transform: translateY(32%) rotate(45deg);
  top: calc(50% - 1px);
}

.menu-button.is-open .menu-bars span:nth-child(2) {
  opacity: 0;
}

.menu-button.is-open .menu-bars span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  top: calc(50% - 1px);
}

@media screen and (max-width: 991px) {
  /* The panel slides down from under the bar, matching the runtime's
       `data-animation="default"` over-under slide at 400ms. */
  .nav-overlay.is-open .nav-menu-wrapper {
    -webkit-animation: nav-drop 0.4s ease both;
            animation: nav-drop 0.4s ease both;
  }
}
@-webkit-keyframes nav-drop {
  from {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes nav-drop {
  from {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
/* The "Pages" dropdown -- IX2 a-10 / a-11. The panel slides up 20px into place
   and the chevron flips; the label and the chevron go grey while it is open. */
.nav-dropdown-list-wrap {
  -webkit-transform: translateY(20px);
          transform: translateY(20px);
  -webkit-transition: -webkit-transform 0.4s ease;
  transition: -webkit-transform 0.4s ease;
  transition: transform 0.4s ease;
  transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}

.nav-dropdown-list-wrap.is-open {
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.nav-dropdown-icon {
  -webkit-transition: color 0.4s ease, -webkit-transform 0.4s ease;
  transition: color 0.4s ease, -webkit-transform 0.4s ease;
  transition: transform 0.4s ease, color 0.4s ease;
  transition: transform 0.4s ease, color 0.4s ease, -webkit-transform 0.4s ease;
}

.nav-dropdown-toggle .nav-dropdown-text {
  -webkit-transition: color 0.4s ease;
  transition: color 0.4s ease;
}

.nav-dropdown-toggle.is-open .nav-dropdown-icon, .nav-dropdown-toggle.is-open .nav-dropdown-text {
  color: var(--color--grey-1);
}

.nav-dropdown-toggle.is-open .nav-dropdown-icon {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

/* ======================================================================
   Tabs and the two accordions
   ====================================================================== */
.tabset-pane {
  display: none;
}

.tabset-pane.is-active {
  display: block;
}

/* FAQ (a-21 / a-22): the answer's height animates to its content and the plus
   stroke rotates to make a minus. The `.minus-icon` is the fixed bar and
   `.plus-icon-01` the one that turns. */
.faq-answer-wrap, .service-box-bottom {
  height: 0;
  overflow: hidden;
  -webkit-transition: height 0.5s ease;
  transition: height 0.5s ease;
}

.plus-icon-01, .vratical-line {
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}

.faq-item.is-active .plus-icon-01 {
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}

/* Service list (a-33 / a-34): same shape, but the vertical rule rotates. */
.service-tab-link.is-active .vratical-line {
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}

/* ======================================================================
   Hovers
   ======================================================================
   Written as `:hover`/`:focus-within` rules rather than JS: IX2's MOUSE_OVER /
   MOUSE_OUT pairs are exactly a CSS hover, and doing it in CSS means the state
   survives a dropped frame and works from the keyboard. */
/* -- a-2 / a-3 / a-38 / a-39 / a-57 / a-58: the dark disc grows from the
      bottom-left corner, the label turns light, the arrow slides out and
      rotates 45deg while its twin slides in, and the border lights up. */
[data-hover=button-01] .button-hover-circle {
  -webkit-transform: scale(0);
          transform: scale(0);
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}

/* The label's REST colour comes from IX2, not from the stylesheet. The design
   sheet says `.button-text { color: var(--color--light) }
` -- white -- and
   group 0 of the hover (the rest state) painted it `--color--dark` at load, on
   every `.button-01`. Without it the label is white on the lime button and
   simply cannot be read. */
[data-hover=button-01] .button-text {
  color: var(--color--dark);
  -webkit-transition: color 0.5s ease;
  transition: color 0.5s ease;
}

[data-hover=button-01] .button-icon-02 {
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}

[data-hover=button-01], [data-hover=button-01] .button-01 {
  -webkit-transition: border-color 0.5s ease;
  transition: border-color 0.5s ease;
}

[data-hover=button-01]:hover .button-hover-circle, [data-hover=button-01]:focus-visible .button-hover-circle {
  -webkit-transform: scale(1);
          transform: scale(1);
}

[data-hover=button-01]:hover .button-text, [data-hover=button-01]:focus-visible .button-text {
  color: var(--color--light);
}

[data-hover=button-01]:hover .button-icon-02, [data-hover=button-01]:focus-visible .button-icon-02 {
  -webkit-transform: translateX(100%) rotate(45deg);
          transform: translateX(100%) rotate(45deg);
}

[data-hover=button-01]:hover, [data-hover=button-01]:focus-visible {
  border-color: var(--color--light);
}

/* -- a-12 / a-13: the label rolls up to its duplicate and the glass fill turns
      solid primary. */
[data-hover=button-02] .button-text {
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}

[data-hover=button-02] {
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

[data-hover=button-02]:hover .button-text, [data-hover=button-02]:focus-visible .button-text {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
}

[data-hover=button-02]:hover, [data-hover=button-02]:focus-visible {
  background-color: var(--color--primary);
}

/* -- a-24 / a-25: the dark panel wipes in from the left, the label rolls to its
      light twin, the arrow crossfades to its hover copy and the border turns
      primary. */
[data-hover=project-btn] .button-02-hover-bg {
  -webkit-transform: translateX(-101%);
          transform: translateX(-101%);
  -webkit-transition: -webkit-transform 0.4s ease;
  transition: -webkit-transform 0.4s ease;
  transition: transform 0.4s ease;
  transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}

[data-hover=project-btn] .button-text-wrapper {
  -webkit-transition: -webkit-transform 0.4s ease;
  transition: -webkit-transform 0.4s ease;
  transition: transform 0.4s ease;
  transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}

[data-hover=project-btn] .button-01-icon {
  opacity: 1;
  -webkit-transition: opacity 0.4s ease;
  transition: opacity 0.4s ease;
}

[data-hover=project-btn] .button-01-icon.hover-icon {
  opacity: 0;
}

[data-hover=project-btn] {
  -webkit-transition: border-color 0.5s ease;
  transition: border-color 0.5s ease;
}

.project-v1-list:hover [data-hover=project-btn] .button-02-hover-bg, [data-hover=project-btn]:hover .button-02-hover-bg {
  -webkit-transform: translateX(0);
          transform: translateX(0);
}

.project-v1-list:hover [data-hover=project-btn] .button-text-wrapper, [data-hover=project-btn]:hover .button-text-wrapper {
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.project-v1-list:hover [data-hover=project-btn] .button-01-icon, [data-hover=project-btn]:hover .button-01-icon {
  opacity: 0;
}

.project-v1-list:hover [data-hover=project-btn] .button-01-icon.hover-icon, [data-hover=project-btn]:hover .button-01-icon.hover-icon {
  opacity: 1;
}

.project-v1-list:hover [data-hover=project-btn], [data-hover=project-btn]:hover {
  border-color: var(--color--primary);
}

/* -- a-4 / a-5: the icon rolls up inside its 44px window to the copy below. */
[data-hover=social-roll] .social-link {
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}

[data-hover=social-roll]:hover .social-link, [data-hover=social-roll]:focus-visible .social-link {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
}

/* -- a-6 / a-7 */
[data-hover=footer-link] .text-light {
  -webkit-transition: color 0.5s ease;
  transition: color 0.5s ease;
}

[data-hover=footer-link]:hover .text-light, [data-hover=footer-link]:focus-visible .text-light {
  color: var(--color--primary);
}

/* -- a-15 / a-18: the 14px dot scales 80x to flood the card. 1000ms in and out.

   The text inverts on ONE card only. IX2's colour actions name specific element
   ids rather than a class, and every one of them resolves inside the card whose
   dot is `.bg-dark`; on the other cards those ids are not in the subtree, so
   IX2 recoloured nothing and the text stayed dark. That is load-bearing:
   `.hover-dot` floods lime and `.hover-dot.bg-secondary` floods green, and white
   text on either is unreadable. `:has()` keys the inversion to the dark dot, so
   it follows the design rather than a hard-coded card. */
[data-hover=about-box] .hover-dot {
  -webkit-transform: scale(1);
          transform: scale(1);
  -webkit-transition: -webkit-transform 1s ease;
  transition: -webkit-transform 1s ease;
  transition: transform 1s ease;
  transition: transform 1s ease, -webkit-transform 1s ease;
}

[data-hover=about-box] .home-about-box-text, [data-hover=about-box] .home-about-box-text * {
  -webkit-transition: color 1s ease;
  transition: color 1s ease;
}

[data-hover=about-box]:hover .hover-dot, [data-hover=about-box]:focus-within .hover-dot {
  -webkit-transform: scale(80);
          transform: scale(80);
}

[data-hover=about-box]:has(.hover-dot.bg-dark):hover .home-about-box-text, [data-hover=about-box]:has(.hover-dot.bg-dark):hover .home-about-box-text *, [data-hover=about-box]:has(.hover-dot.bg-dark):focus-within .home-about-box-text, [data-hover=about-box]:has(.hover-dot.bg-dark):focus-within .home-about-box-text * {
  color: var(--color--light);
}

/* -- a-26 / a-27: the cover image zooms, the title turns primary, the body copy
      lifts to the site background, and the "View" button appears. */
[data-hover=service-v1] .fit-cover {
  -webkit-transform: scale(1);
          transform: scale(1);
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}

[data-hover=service-v1] .text-light, [data-hover=service-v1] .text-grey-02 {
  -webkit-transition: color 0.5s ease;
  transition: color 0.5s ease;
}

[data-hover=service-v1] .hover-button-wrap {
  -webkit-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease;
}

[data-hover=service-v1]:hover .fit-cover, [data-hover=service-v1]:focus-visible .fit-cover {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}

[data-hover=service-v1]:hover .text-light, [data-hover=service-v1]:focus-visible .text-light {
  color: var(--color--primary);
}

[data-hover=service-v1]:hover .text-grey-02, [data-hover=service-v1]:focus-visible .text-grey-02 {
  color: var(--color--site-bg);
}

[data-hover=service-v1]:hover .hover-button-wrap, [data-hover=service-v1]:focus-visible .hover-button-wrap {
  opacity: 1;
}

/* -- a-31 / a-32 */
[data-hover=blog] .fit-cover {
  -webkit-transform: scale(1);
          transform: scale(1);
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}

[data-hover=blog]:hover .fit-cover, [data-hover=blog]:focus-visible .fit-cover {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}

/* -- a-35: the hovered card takes 40% of the row and its two neighbours give up
      the difference (25% / 20%). The design's own widths are the rest state, so
      only the hovered arrangement is written here. 700ms. */
.choose-us-box-list-40, .choose-us-box-list-20 {
  -webkit-transition: width 0.7s ease;
  transition: width 0.7s ease;
}

@media screen and (min-width: 992px) {
  /* `:not(:hover)` rather than specificity juggling: the hovered card matches
       its own width rule and every OTHER card in the row matches one of the two
       below, so the three never fight. */
  .choose-us-v1-bottom:has([data-hover=choose]:hover) [data-hover=choose]:not(:hover).choose-us-box-list-40 {
    width: 20%;
  }
  .choose-us-v1-bottom:has([data-hover=choose]:hover) [data-hover=choose]:not(:hover).choose-us-box-list-20 {
    width: 25%;
  }
  .choose-us-v1-bottom [data-hover=choose]:hover {
    width: 40%;
  }
}
/* -- a-36 / a-37: two stacked icons crossfade. */
[data-hover=social-icon] .icon-01, [data-hover=social-icon] .icon-02 {
  -webkit-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease;
}

[data-hover=social-icon]:hover .icon-01, [data-hover=social-icon]:focus-visible .icon-01 {
  opacity: 0;
}

[data-hover=social-icon]:hover .icon-02, [data-hover=social-icon]:focus-visible .icon-02 {
  opacity: 1;
}

/* -- a-46 / a-47: the round "drag" badge fades in over the team strip. */
[data-cursor=teams] .drag-box {
  opacity: 0;
  -webkit-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease;
}

[data-cursor=teams]:hover .drag-box {
  opacity: 1;
}

/* ======================================================================
   Motion driven by main.js
   ====================================================================== */
/* -- a: the rule under a heading draws itself in, 900ms after a 300ms wait. */
.vertical-line {
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
          transform-origin: 0 50%;
}

[data-line=grow].is-in .vertical-line {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
  -webkit-transition: -webkit-transform 0.9s ease 0.3s;
  transition: -webkit-transform 0.9s ease 0.3s;
  transition: transform 0.9s ease 0.3s;
  transition: transform 0.9s ease 0.3s, -webkit-transform 0.9s ease 0.3s;
}

/* -- a-14: the logo belt. IX2 moved one copy of the row by -100% over 20s and
      snapped back; a duplicated track makes that seamless. */
[data-marquee] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}

[data-marquee] .marquee-track {
  -webkit-animation: marquee 20s linear infinite;
          animation: marquee 20s linear infinite;
}

[data-marquee]:hover .marquee-track {
  -webkit-animation-play-state: paused;
          animation-play-state: paused;
}

@-webkit-keyframes marquee {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

@keyframes marquee {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}
/* -- a-17: the statistics slot-roll. `.upper` is stretched to the 88px window
      and pushed to `flex-end`, so it rests on its LAST digit; `.lower` rests on
      its first. 400% of the window is four digits of travel. */
[data-counter=stats] .statistics-number-box.upper {
  -webkit-transform: translateY(400%);
          transform: translateY(400%);
}

[data-counter=stats] .statistics-number-box.lower {
  -webkit-transform: translateY(-400%);
          transform: translateY(-400%);
}

[data-counter=stats].is-in .statistics-number-box {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition: -webkit-transform 1.5s var(--ease-in-out);
  transition: -webkit-transform 1.5s var(--ease-in-out);
  transition: transform 1.5s var(--ease-in-out);
  transition: transform 1.5s var(--ease-in-out), -webkit-transform 1.5s var(--ease-in-out);
}

/* -- a-45: six frosted tiles lie over the cover image and fade out in turn, 500ms for the first and 800ms for the rest, 100ms apart. */
[data-tiles=reveal] .works-grid-item {
  opacity: 1;
}

[data-tiles=reveal].is-in .works-grid-item {
  opacity: 0;
  -webkit-transition: opacity 0.8s var(--ease-in-out-expo);
  transition: opacity 0.8s var(--ease-in-out-expo);
}

[data-tiles=reveal].is-in .works-grid-item._01 {
  -webkit-transition-duration: 0.5s;
          transition-duration: 0.5s;
}

[data-tiles=reveal].is-in .works-grid-item._02 {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}

[data-tiles=reveal].is-in .works-grid-item._03 {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}

[data-tiles=reveal].is-in .works-grid-item._04 {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}

[data-tiles=reveal].is-in .works-grid-item._05 {
  -webkit-transition-delay: 0.1s;
          transition-delay: 0.1s;
}

/* -- a-28 / a-48 / a-49: pointer-driven. main.js writes the progress as a
      custom property so the transform stays declarative. */
.hover-button-wrap {
  -webkit-transform: translate(calc(var(--pointer-x, 0.5) * 160% - 80%), calc(var(--pointer-y, 0.5) * 160% - 80%));
          transform: translate(calc(var(--pointer-x, 0.5) * 160% - 80%), calc(var(--pointer-y, 0.5) * 160% - 80%));
}

[data-cursor=teams] .drag-box {
  -webkit-transform: translate(calc(var(--pointer-x, 0.5) * 100vw - 50vw), calc(var(--pointer-y, 0.5) * 100vh - 50vh));
          transform: translate(calc(var(--pointer-x, 0.5) * 100vw - 50vw), calc(var(--pointer-y, 0.5) * 100vh - 50vh));
}

@media screen and (min-width: 992px) {
  [data-cursor=teams] .teams-bottom {
    -webkit-transform: translateX(calc(46% - var(--pointer-x, 0.5) * 92%));
            transform: translateX(calc(46% - var(--pointer-x, 0.5) * 92%));
    -webkit-transition: -webkit-transform 0.2s linear;
    transition: -webkit-transform 0.2s linear;
    transition: transform 0.2s linear;
    transition: transform 0.2s linear, -webkit-transform 0.2s linear;
  }
}
/* -- the five scroll scrubs. `--scrub` is 0 at the top of the section's travel
      and 1 at the bottom; every keyframe below is the payload's own percentage
      mapped onto it in main.js. */
[data-scrub=know] .know-top-linner {
  -webkit-transform: translateY(calc(var(--scrub, 0) * 90%));
          transform: translateY(calc(var(--scrub, 0) * 90%));
}

[data-scrub=awards] .awadrs-right-shadow {
  -webkit-transform: translateY(calc(var(--scrub, 0) * 90%));
          transform: translateY(calc(var(--scrub, 0) * 90%));
}

/* The gallery pans as ONE track.
 *
 * IX2 moved each `.collection-item` by -252% of ITS OWN width, and the four
 * cards are not the same width: the featured one hits its 840px cap while the
 * rest sit at 445px, so -252% is -2117px for the first and -1121px for the
 * others. They drift a thousand pixels apart and tear a hole in the row --
 * on the published site as much as here.
 *
 * So the translate moves the list instead, by `--pan`: the distance main.js
 * measures between the row's content width and the box that clips it. The row
 * travels as a row, and the last card lands flush at the right edge at every
 * width instead of overshooting by a card and a half. */
[data-scrub=projects] .collection-list {
  -webkit-transform: translateX(calc(var(--pan, 0px) * -1));
          transform: translateX(calc(var(--pan, 0px) * -1));
  will-change: transform;
}

[data-scrub=process] .process-list-wrap {
  -webkit-transform: scale(var(--scale, 1));
          transform: scale(var(--scale, 1));
}

[data-scrub=about-hero] .about-sub-heading-wrap {
  -webkit-transform: translateY(calc(var(--scrub, 0) * -290px));
          transform: translateY(calc(var(--scrub, 0) * -290px));
}

@media screen and (min-width: 992px) {
  [data-scrub=about-hero] .about-image-wrap {
    width: calc(40% + var(--scrub, 0) * 60%);
    height: calc(30vh + var(--scrub, 0) * 70vh);
  }
}
/* ======================================================================
   Cookie notice
   ====================================================================== */
/* The design ships `.cookies-block { display: none }
` and no interaction that
   ever shows it, so on the published site the notice and its close button are
   dead markup. The close button and its IX2 action say what was intended, so
   main.js shows it once per visitor and remembers the dismissal. */
.cookies-block.is-open {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

/* ======================================================================
   Cart and checkout
   ======================================================================
   Webflow Ecommerce is gone; main.js keeps the basket in localStorage. Every
   element kept its commerce class, so the design sheet still styles all of it
   and only the open/closed state is authored here. */
/* Written as `:not(<state>) { display: none }
` rather than a pair of rules, so
   the visible state falls back to whatever the design sheet already sets --
   `.wf-commerce-commercecartform` is a flex column and the empty state is a
   centred flex box, and re-declaring `display: block` here would flatten both. */
.cart-modal:not(.is-open), .cart-form:not(.is-visible), .cart-empty:not(.is-visible), .cart-error-state:not(.is-visible) {
  display: none;
}

.cart-count[hidden] {
  display: none;
}

.wf-commerce-commercecartitemimage {
  background: var(--color--site-bg);
  -o-object-fit: cover;
     object-fit: cover;
}

.add-to-cart-form.is-added .wf-commerce-commerceaddtocartbutton {
  opacity: 0.7;
}

/* The billing block only exists when "same as shipping" is unchecked, and the
   two error panels only when something is. */
.wf-commerce-commercecheckoutbillingaddresswrapper:not(.is-visible), .wf-commerce-commercecheckouterrorstate:not(.is-visible), .wf-commerce-commercepaypalcheckouterrorstate:not(.is-visible) {
  display: none;
}

.checkout-empty {
  padding: 24px 0;
}

/* ======================================================================
   Forms
   ====================================================================== */
/* The custom checkbox is a hidden <input> plus a styled <div> proxy that sits
   BEFORE it in the DOM. Webflow's runtime marked the proxy `.w--redirected-
   checked`; `:has()` reads the input's own state instead, so the control shows
   its state with scripting off and without a click handler.

   The checked state is also wrong in the source, and therefore on the published
   site: the design overrode the proxy's border but not its background, so
   Webflow's default blue (#3898ec) survives, and `background-size: cover`
   stretches the 13x11 tick to all four edges of a 12px box. Restated here in
   this design's own colours, with the tick sized to sit inside the border. */
.wf-checkbox:has(input[type=checkbox]:checked) .checkbox-input-custom, .checkbox-input-custom.is-checked {
  background-color: var(--color--dark);
  border-color: var(--color--dark);
  background-image: url("../images/checkbox-checkmark.svg");
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 8px auto;
}

/* The input carries the focus, but it is the proxy that is on screen. */
.wf-checkbox:has(input[type=checkbox]:focus-visible) .checkbox-input-custom {
  outline: 2px solid var(--color--secondary);
  outline-offset: 2px;
}

/* Webflow zeroes the native select chrome (`appearance: none`) and never draws
   a replacement, so the two country pickers on checkout are pixel-identical to
   the text inputs beside them and give no sign they open a list. A chevron
   matching the nav's is drawn in, with room on the right for it. Same box, so nothing around it moves. */
.wf-commerce-commercecheckoutshippingcountryselector, .wf-commerce-commercecheckoutbillingcountryselector {
  padding-right: 34px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23616161' d='M12 15.4 5.3 8.7l1.4-1.4 5.3 5.3 5.3-5.3 1.4 1.4z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 12px 12px;
}

/* Webflow's framework hides both panels and its runtime set `display: block`
   inline when one applied; the class does the same job. */
[data-form-done].is-visible, [data-form-fail].is-visible {
  display: block;
}

/* ======================================================================
   Reduced motion
   ======================================================================
   Everything above is decoration. Someone who has asked for less of it gets the
   finished state immediately, and the two looping animations stop. */
@media (prefers-reduced-motion: reduce) {
  .js .reveal,
  .js .reveal-blur-up,
  .js .reveal-rise,
  .js .reveal-fade,
  .js .reveal-up,
  .js .reveal-grow,
  .js .reveal-shrink {
    opacity: 1;
    -webkit-filter: none;
            filter: none;
    -webkit-transform: none;
            transform: none;
  }
  .vertical-line {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
  }
  [data-counter=stats] .statistics-number-box {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  [data-tiles=reveal] .works-grid-item {
    opacity: 0;
  }
  [data-marquee] .marquee-track,
  .is-breathing {
    -webkit-animation: none;
            animation: none;
  }
  /* The scrub and pointer targets by name: they sit at different depths, so a
     child combinator would miss most of them. main.js already refuses to write
     `--scrub` and `--pointer-*` under reduced motion, which leaves every
     `calc()` above at its resting value; this pins the transforms as well so
     even the first frame is still.

     `.about-image-wrap` is deliberately absent: its size is a `calc()` on
     `--scrub`, so with nothing written it already sits at the design's own
     40% x 30vh. */
  [data-scrub=know] .know-top-linner,
  [data-scrub=awards] .awadrs-right-shadow,
  [data-scrub=projects] .collection-list,
  [data-scrub=process] .process-list-wrap,
  [data-scrub=about-hero] .about-sub-heading-wrap,
  .hover-button-wrap,
  [data-cursor=teams] .drag-box,
  [data-cursor=teams] .teams-bottom {
    -webkit-transform: none;
            transform: none;
  }
  *,
  *::before,
  *::after {
    -webkit-transition-duration: 0.01ms !important;
            transition-duration: 0.01ms !important;
    -webkit-animation-duration: 0.01ms !important;
            animation-duration: 0.01ms !important;
    -webkit-animation-iteration-count: 1 !important;
            animation-iteration-count: 1 !important;
  }
}
/* =========================================================
   Sitework Navigation
   No jQuery required
   Breakpoint is controlled only by JavaScript.
   ========================================================= */
.navigation {
  /* Fonts */
  --nav-font-family: var(--font-serif);
  --nav-font-size: 16px;
  --nav-font-weight: 500;
  /* Main navigation */
  --nav-background: #ffffff;
  --nav-color: #1b2138;
  --nav-hover-color: var(--color-primary);
  --nav-active-color: var(--color-primary);
  /* Dropdown */
  --nav-dropdown-background: #ffffff;
  --nav-dropdown-color: #1b2138;
  --nav-dropdown-hover-background: #f5f5f5;
  --nav-dropdown-hover-color: var(--color-primary);
  --nav-dropdown-width: 240px;
  /* Mobile */
  --nav-mobile-background: #ffffff;
  --nav-mobile-width: min(90vw, 400px);
  --nav-mobile-overlay: rgb(0 0 0 / 45%);
  /* Mega menu */
  --nav-mega-background: #ffffff;
  --nav-mega-gap: 30px;
  --nav-mega-padding: 30px;
  --nav-mega-title-color: #1b2138;
  --nav-mega-title-size: 16px;
  --nav-mega-title-weight: 700;
  --nav-mega-text-color: #666666;
  --nav-mega-highlight-background: #f5f5f5;
  --nav-mega-button-background: var(--nav-hover-color);
  --nav-mega-button-color: #ffffff;
  /* General */
  --nav-border-color: #e8e8e8;
  --nav-border-radius: 6px;
  --nav-dropdown-shadow: 0 10px 30px rgb(0 0 0 / 12%);
  --nav-transition: 200ms ease;
  --nav-z-index: 1000;
  position: relative;
  z-index: var(--nav-z-index);
  font-family: var(--nav-font-family);
  font-size: var(--nav-font-size);
  font-weight: var(--nav-font-weight);
}
.navigation *,
.navigation *::before,
.navigation *::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.navigation a {
  color: inherit;
  text-decoration: none;
}
.navigation :focus-visible {
  outline: 2px solid var(--nav-hover-color);
  outline-offset: 3px;
}

/*
 * First paint before JS adds .is-mobile / .is-desktop / .navigation-ready.
 * Keep this max-width in sync with SiteworkNavigation breakpoint (default 1024).
 * On small screens the panel is already off-canvas, so enabling mobile mode
 * does not slide the in-flow menu out of view.
 */
.navigation:not(.navigation-ready) .submenu-toggle {
  display: none;
}
.navigation:not(.navigation-ready) .nav-menus-wrapper,
.navigation:not(.navigation-ready) .nav-overlay {
  -webkit-transition: none !important;
  transition: none !important;
}

@media (max-width: 1023px) {
  .navigation:not(.navigation-ready) .nav-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
  .navigation:not(.navigation-ready) .nav-menus-wrapper {
    position: fixed;
    top: 0;
    right: 0;
    z-index: calc(var(--nav-z-index) + 2);
    width: var(--nav-mobile-width);
    height: 100dvh;
    overflow: hidden;
    visibility: hidden;
    pointer-events: none;
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
@media (min-width: 1024px) {
  .navigation:not(.navigation-ready) .nav-header {
    display: none;
  }
}
/* =========================================================
   Main menu
   ========================================================= */
.nav-menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.nav-menu > li {
  position: relative;
}
.nav-menu > li > a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 18px 16px;
  color: var(--nav-color);
  -webkit-transition: color var(--nav-transition), background-color var(--nav-transition);
  transition: color var(--nav-transition), background-color var(--nav-transition);
}
.nav-menu > li > a:hover, .nav-menu > li > a:focus-visible {
  color: var(--nav-hover-color);
}
.nav-menu > li.active > a, .nav-menu > li.current-menu-item > a {
  color: var(--nav-active-color);
}

/* =========================================================
   Submenu indicator
   ========================================================= */
.has-submenu > a {
  padding-right: 32px !important;
}
.has-submenu > a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  -webkit-transform: translateY(-65%) rotate(45deg);
          transform: translateY(-65%) rotate(45deg);
  -webkit-transition: -webkit-transform var(--nav-transition);
  transition: -webkit-transform var(--nav-transition);
  transition: transform var(--nav-transition);
  transition: transform var(--nav-transition), -webkit-transform var(--nav-transition);
}

/* =========================================================
   Dropdown base
   ========================================================= */
.nav-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 10;
  width: var(--nav-dropdown-width);
  min-width: 100%;
  margin: 0;
  padding: 8px 0;
  list-style: none;
  background: var(--nav-dropdown-background);
  border: 1px solid var(--nav-border-color);
  border-radius: var(--nav-border-radius);
  -webkit-box-shadow: var(--nav-dropdown-shadow);
          box-shadow: var(--nav-dropdown-shadow);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  -webkit-transform: translateY(8px);
          transform: translateY(8px);
  -webkit-transition: opacity var(--nav-transition), visibility var(--nav-transition), -webkit-transform var(--nav-transition);
  transition: opacity var(--nav-transition), visibility var(--nav-transition), -webkit-transform var(--nav-transition);
  transition: opacity var(--nav-transition), transform var(--nav-transition), visibility var(--nav-transition);
  transition: opacity var(--nav-transition), transform var(--nav-transition), visibility var(--nav-transition), -webkit-transform var(--nav-transition);
}
.nav-dropdown li {
  position: relative;
}
.nav-dropdown a {
  display: block;
  padding: 10px 16px;
  color: var(--nav-dropdown-color);
  -webkit-transition: color var(--nav-transition), background-color var(--nav-transition);
  transition: color var(--nav-transition), background-color var(--nav-transition);
}
.nav-dropdown a:hover, .nav-dropdown a:focus-visible {
  color: var(--nav-dropdown-hover-color);
  background: var(--nav-dropdown-hover-background);
}
.nav-dropdown .nav-dropdown {
  top: -9px;
  left: 100%;
}

/* =========================================================
   Hamburger
   ========================================================= */
.nav-toggle {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  color: var(--nav-color);
  background: transparent;
  border: 0;
  cursor: pointer;
}
.nav-toggle::before, .nav-toggle::after {
  content: "";
  position: absolute;
  width: 24px;
  height: 2px;
  background: currentColor;
  -webkit-transition: top var(--nav-transition), -webkit-transform var(--nav-transition);
  transition: top var(--nav-transition), -webkit-transform var(--nav-transition);
  transition: transform var(--nav-transition), top var(--nav-transition);
  transition: transform var(--nav-transition), top var(--nav-transition), -webkit-transform var(--nav-transition);
}
.nav-toggle::before {
  top: 15px;
  -webkit-box-shadow: 0 6px 0 currentColor;
          box-shadow: 0 6px 0 currentColor;
}
.nav-toggle::after {
  top: 27px;
}

.navigation.nav-open .nav-toggle::before {
  top: 21px;
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.navigation.nav-open .nav-toggle::after {
  top: 21px;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

/* =========================================================
   Submenu toggle
   ========================================================= */
.submenu-toggle {
  position: absolute;
  top: 0;
  right: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 50px;
  height: 50px;
  padding: 0;
  color: inherit;
  background: transparent;
  border: 0;
  cursor: pointer;
}
.submenu-toggle::after {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  -webkit-transform: translateY(-2px) rotate(45deg);
          transform: translateY(-2px) rotate(45deg);
  -webkit-transition: -webkit-transform var(--nav-transition);
  transition: -webkit-transform var(--nav-transition);
  transition: transform var(--nav-transition);
  transition: transform var(--nav-transition), -webkit-transform var(--nav-transition);
}
.submenu-toggle[aria-expanded=true]::after {
  -webkit-transform: translateY(2px) rotate(225deg);
          transform: translateY(2px) rotate(225deg);
}

/* =========================================================
   Desktop mode
   Controlled by JS: .is-desktop
   ========================================================= */
.navigation.is-desktop .nav-header,
.navigation.is-desktop .submenu-toggle {
  display: none;
}
.navigation.is-desktop .has-submenu:hover > a::after, .navigation.is-desktop .has-submenu:focus-within > a::after, .navigation.is-desktop .has-submenu.submenu-open > a::after {
  -webkit-transform: translateY(-35%) rotate(225deg);
          transform: translateY(-35%) rotate(225deg);
}
.navigation.is-desktop .has-submenu:hover > .nav-dropdown, .navigation.is-desktop .has-submenu:focus-within > .nav-dropdown, .navigation.is-desktop .has-submenu.submenu-open > .nav-dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.navigation.is-desktop .nav-menu li:hover > .nav-dropdown,
.navigation.is-desktop .nav-menu li:focus-within > .nav-dropdown,
.navigation.is-desktop .nav-menu li.submenu-open > .nav-dropdown,
.navigation.is-desktop .nav-dropdown li:hover > .nav-dropdown,
.navigation.is-desktop .nav-dropdown li:focus-within > .nav-dropdown,
.navigation.is-desktop .nav-dropdown li.submenu-open > .nav-dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.navigation.is-desktop {
  /* Mega menu */
}
.navigation.is-desktop .nav-menu {
  position: relative;
}
.navigation.is-desktop .nav-menu > .megamenu {
  position: static;
}
.navigation.is-desktop .megamenu > .mega-dropdown {
  top: 100%;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  gap: var(--nav-mega-gap);
  width: 100%;
  min-width: 0;
  padding: var(--nav-mega-padding);
  background: var(--nav-mega-background);
  -webkit-transform: translateY(8px);
          transform: translateY(8px);
}
.navigation.is-desktop .megamenu:hover > .mega-dropdown, .navigation.is-desktop .megamenu:focus-within > .mega-dropdown, .navigation.is-desktop .megamenu.submenu-open > .mega-dropdown {
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.navigation.is-desktop .mega-dropdown > .mega-column {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
  min-width: 0;
}
.navigation.is-desktop .mega-column-2 {
  -webkit-box-flex: 2 !important;
      -ms-flex-positive: 2 !important;
          flex-grow: 2 !important;
}
.navigation.is-desktop .mega-column-3 {
  -webkit-box-flex: 3 !important;
      -ms-flex-positive: 3 !important;
          flex-grow: 3 !important;
}
.navigation.is-desktop .mega-title {
  display: block;
  margin-bottom: 10px;
  color: var(--nav-mega-title-color);
  font-size: var(--nav-mega-title-size);
  font-weight: var(--nav-mega-title-weight);
}
.navigation.is-desktop .mega-column > ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.navigation.is-desktop .mega-column > ul > li {
  margin: 0;
  padding: 0;
}
.navigation.is-desktop .mega-column > ul > li > a {
  display: block;
  padding: 7px 0;
  color: var(--nav-dropdown-color);
  background: transparent;
  border-radius: 0;
}
.navigation.is-desktop .mega-column > ul > li > a:hover, .navigation.is-desktop .mega-column > ul > li > a:focus-visible {
  color: var(--nav-dropdown-hover-color);
  background: transparent;
}
.navigation.is-desktop .mega-column p {
  margin: 0 0 16px;
  color: var(--nav-mega-text-color);
  line-height: 1.5;
}
.navigation.is-desktop .mega-highlight {
  padding: 20px;
  background: var(--nav-mega-highlight-background);
  border-radius: var(--nav-border-radius);
}
.navigation.is-desktop .mega-button {
  display: -webkit-inline-box !important;
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: auto;
  padding: 10px 16px !important;
  color: var(--nav-mega-button-color) !important;
  background: var(--nav-mega-button-background) !important;
  border-radius: var(--nav-border-radius);
  -webkit-transition: opacity var(--nav-transition), -webkit-transform var(--nav-transition);
  transition: opacity var(--nav-transition), -webkit-transform var(--nav-transition);
  transition: opacity var(--nav-transition), transform var(--nav-transition);
  transition: opacity var(--nav-transition), transform var(--nav-transition), -webkit-transform var(--nav-transition);
}
.navigation.is-desktop .mega-button:hover, .navigation.is-desktop .mega-button:focus-visible {
  opacity: 0.85;
}

/* =========================================================
   Mobile mode
   Controlled by JS: .is-mobile
   ========================================================= */
.navigation.is-mobile .nav-header {
  position: relative;
  z-index: calc(var(--nav-z-index) + 3);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.navigation.is-mobile .nav-menus-wrapper {
  position: fixed;
  top: 0;
  right: 0;
  z-index: calc(var(--nav-z-index) + 2);
  width: var(--nav-mobile-width);
  height: 100dvh;
  overflow-y: auto;
  background: var(--nav-mobile-background);
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
  -webkit-transition: -webkit-transform 300ms ease;
  transition: -webkit-transform 300ms ease;
  transition: transform 300ms ease;
  transition: transform 300ms ease, -webkit-transform 300ms ease;
}
.navigation.is-mobile .nav-menus-wrapper .sectie-inner {
  width: 100%;
  max-width: none;
  padding: 0;
}
.navigation.is-mobile.nav-open .nav-menus-wrapper {
  -webkit-transform: translateX(0);
          transform: translateX(0);
}
.navigation.is-mobile .nav-menu {
  display: block;
  padding: 70px 0 30px;
}
.navigation.is-mobile .nav-menu > li {
  border-bottom: 1px solid var(--nav-border-color);
}
.navigation.is-mobile .nav-menu > li > a {
  min-height: 50px;
  padding: 14px 55px 14px 20px;
}
.navigation.is-mobile .has-submenu > a::after {
  display: none;
}
.navigation.is-mobile .nav-dropdown {
  position: static;
  display: block;
  width: 100%;
  min-width: 0;
  max-height: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  opacity: 1;
  visibility: hidden;
  pointer-events: none;
  -webkit-transform: none;
          transform: none;
  background: var(--nav-dropdown-background);
  -webkit-transition: max-height 300ms ease, visibility 0s linear 300ms;
  transition: max-height 300ms ease, visibility 0s linear 300ms;
}
.navigation.is-mobile .nav-dropdown li {
  border-top: 1px solid var(--nav-border-color);
}
.navigation.is-mobile .nav-dropdown a {
  padding: 13px 20px 13px 35px;
}
.navigation.is-mobile .nav-dropdown .nav-dropdown a {
  padding-left: 50px;
}
.navigation.is-mobile .submenu-open > .nav-dropdown {
  visibility: visible;
  pointer-events: auto;
  -webkit-transition: max-height 300ms ease, visibility 0s linear 0s;
  transition: max-height 300ms ease, visibility 0s linear 0s;
}
.navigation.is-mobile {
  /* Mega menu becomes a normal accordion */
}
.navigation.is-mobile .mega-dropdown {
  display: block;
  max-height: 0;
  padding: 0;
  overflow: hidden;
  visibility: hidden;
  -webkit-transition: max-height 300ms ease, visibility 0s linear 300ms;
  transition: max-height 300ms ease, visibility 0s linear 300ms;
}
.navigation.is-mobile .megamenu.submenu-open > .mega-dropdown {
  visibility: visible;
  -webkit-transition: max-height 300ms ease, visibility 0s linear 0s;
  transition: max-height 300ms ease, visibility 0s linear 0s;
}
.navigation.is-mobile .mega-column {
  width: 100%;
  padding: 0;
  border-top: 1px solid var(--nav-border-color);
}
.navigation.is-mobile .mega-column > .mega-title {
  display: block;
  padding: 14px 20px 7px;
  color: var(--nav-mega-title-color);
  font-size: var(--nav-mega-title-size);
  font-weight: var(--nav-mega-title-weight);
}
.navigation.is-mobile .mega-column > ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.navigation.is-mobile .mega-column > ul > li > a {
  display: block;
  padding: 10px 20px 10px 35px;
  color: var(--nav-dropdown-color);
}
.navigation.is-mobile .mega-column p {
  margin: 0 0 15px;
  line-height: 1.5;
}
.navigation.is-mobile .mega-highlight {
  margin: 15px 20px;
  padding: 20px;
  background: var(--nav-mega-highlight-background);
  border: 0;
  border-radius: var(--nav-border-radius);
}
.navigation.is-mobile .mega-button {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  padding: 10px 16px !important;
  color: var(--nav-mega-button-color) !important;
  background: var(--nav-mega-button-background) !important;
  border-radius: var(--nav-border-radius);
}

/* =========================================================
   Overlay
   ========================================================= */
.nav-overlay {
  position: fixed;
  inset: 0;
  z-index: 999;
  background: var(--nav-mobile-overlay, rgba(0, 0, 0, 0.45));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  -webkit-transition: opacity 300ms ease, visibility 300ms ease;
  transition: opacity 300ms ease, visibility 300ms ease;
}

.navigation.is-mobile.nav-open + .nav-overlay {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* =========================================================
   Reduced motion
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
  .navigation *,
  .navigation *::before,
  .navigation *::after {
    scroll-behavior: auto !important;
    -webkit-transition-duration: 0.01ms !important;
            transition-duration: 0.01ms !important;
    -webkit-animation-duration: 0.01ms !important;
            animation-duration: 0.01ms !important;
    -webkit-animation-iteration-count: 1 !important;
            animation-iteration-count: 1 !important;
  }
}
.btn, a[title=knop] {
  font-size: var(--baseFontSize);
  display: inline-block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  text-decoration: none;
  background-color: var(--primary);
  color: #fff !important;
  padding: 10px 20px;
  -webkit-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  border-radius: var(--borderRadius);
}
.btn.secondary, a[title=knop].secondary {
  background-color: var(--secondary);
}
.btn.back:before, a[title=knop].back:before {
  opacity: 0;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-weight: 900;
  content: "\f053";
  padding-left: 0;
  font-family: "Font Awesome 6 Pro";
  width: 0;
  -webkit-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
.btn.back:after, a[title=knop].back:after {
  display: none;
}
.btn.back:hover, a[title=knop].back:hover {
  -webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
          box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
.btn.back:hover::before, a[title=knop].back:hover::before {
  width: 5px;
  opacity: 1;
  padding-right: 15px;
}
.btn.large, a[title=knop].large {
  padding: 15px 30px;
}
.btn:hover, a[title=knop]:hover {
  -webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
          box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  color: white;
}
.btn:hover::after, a[title=knop]:hover::after {
  width: 5px;
  opacity: 1;
  padding-left: 15px;
}
.btn:after, a[title=knop]:after {
  opacity: 0;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-weight: 900;
  content: "\f054";
  padding-left: 0;
  font-family: "Font Awesome 6 Pro";
  width: 0;
  -webkit-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
.btn.search::after, a[title=knop].search::after {
  content: none;
}
.btn:focus-visible, a[title=knop]:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
  -webkit-box-shadow: 0 0 0 3px var(--primary, #00b4ff);
          box-shadow: 0 0 0 3px var(--primary, #00b4ff);
}

.formulier {
  margin-top: 60px;
  width: 100%;
}
.formulier .form-group {
  position: relative;
  display: block;
  padding: 5px 0;
  margin-bottom: 10px;
}
.formulier .form-group.form-text {
  margin-top: 15px;
}
.formulier .form-group.hidden {
  display: none;
}
.formulier .form-group.area {
  margin-top: 12px;
}
.formulier .form-group label {
  display: block;
}
.formulier .form-group .jumplabel {
  position: absolute;
  left: 16px;
  top: 18px;
  -webkit-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
}
.formulier .form-group input:not(:-moz-placeholder) + .jumplabel {
  top: -10px;
  font-size: 12px;
  color: var(--text);
  padding: 0;
  left: 0px;
}
.formulier .form-group input:not(:-ms-input-placeholder) + .jumplabel {
  top: -10px;
  font-size: 12px;
  color: var(--text);
  padding: 0;
  left: 0px;
}
.formulier .form-group input:focus + .jumplabel,
.formulier .form-group input:not(:placeholder-shown) + .jumplabel {
  top: -10px;
  font-size: 12px;
  color: var(--text);
  padding: 0;
  left: 0px;
}
.formulier .form-group textarea:not(:-moz-placeholder) + .jumplabel {
  top: -14px;
  font-size: 12px;
  color: var(--text);
  padding: 0;
  left: 0px;
}
.formulier .form-group textarea:not(:-ms-input-placeholder) + .jumplabel {
  top: -14px;
  font-size: 12px;
  color: var(--text);
  padding: 0;
  left: 0px;
}
.formulier .form-group textarea:focus + .jumplabel,
.formulier .form-group textarea:not(:placeholder-shown) + .jumplabel {
  top: -14px;
  font-size: 12px;
  color: var(--text);
  padding: 0;
  left: 0px;
}
.formulier .form-group input {
  display: block;
  width: 100%;
  line-height: 100%;
  padding: 15px;
  border: 1px solid var(--lightGray);
  border-radius: 5px;
}
.formulier .form-group input:focus {
  border-color: var(--primary, #00b4ff);
  outline: 2px solid var(--primary, #00b4ff);
  outline-offset: 2px;
  background: rgb(242.25, 242.25, 242.25);
}
.formulier .form-group input::-webkit-input-placeholder {
  color: var(--text);
}
.formulier .form-group input::-moz-placeholder {
  color: var(--text);
}
.formulier .form-group input:-ms-input-placeholder {
  color: var(--text);
}
.formulier .form-group input::-ms-input-placeholder {
  color: var(--text);
}
.formulier .form-group input::placeholder {
  color: var(--text);
}
.formulier .form-group input[type=radio], .formulier .form-group input[type=checkbox] {
  display: inline-block;
  width: auto;
  margin-right: 5px;
}
.formulier .form-group span {
  display: inline-block;
  margin-right: 15px;
}
.formulier .form-group .file {
  position: relative;
  background: white;
  padding: 15px 15px 15px 35px;
}
.formulier .form-group #fileinput::-webkit-file-upload-button {
  visibility: hidden;
}
.formulier .form-group #fileinput::before {
  content: "Selecteren";
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: var(--primary);
  color: white;
  font-size: 18px;
  width: auto;
  padding: 0px 35px 0px 35px;
  border-radius: 0px 5px 5px 0px;
  text-decoration: none;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border: 0;
  cursor: pointer;
}
.formulier .form-group textarea {
  display: block;
  width: 100%;
  padding: 10px 15px;
  border: 1px solid var(--lightGray);
  height: 100px;
  border-radius: 5px;
}
.formulier .form-group textarea:focus {
  border-color: var(--primary, #00b4ff);
  outline: 2px solid var(--primary, #00b4ff);
  outline-offset: 2px;
  background: rgb(242.25, 242.25, 242.25);
}
.formulier .form-group .styled-select {
  position: relative;
  width: auto;
  display: inline-block;
}
.formulier .form-group .styled-select:hover::before {
  color: var(--text);
  background-color: rgba(var(--primary), 0.2);
}
.formulier .form-group .styled-select::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  font-weight: 600;
  content: "\f078";
  font-family: "Font Awesome 6 Pro";
  position: absolute;
  top: 0px;
  right: 0;
  width: 20%;
  height: 100%;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
  font-size: var(--fontSizeBase);
  color: var(--text);
  background-color: rgba(var(--primary), 0.1);
  pointer-events: none;
}
.formulier .form-group .styled-select select {
  background-color: #fff;
  color: var(--text);
  padding: 12px;
  width: 250px;
  border: none;
  font-size: 16px;
  border: 1px solid var(--lightGray);
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.formulier .form-group .styled-select select:focus-visible {
  outline-color: var(--primary, #00b4ff);
}
.formulier .form-group .styled-select select option {
  padding: 30px;
}
.formulier .form-group .checkbox, .formulier .form-group .radio {
  margin-left: -15px;
}
.formulier .form-group .checkbox input[type=checkbox], .formulier .form-group .checkbox input[type=radio], .formulier .form-group .radio input[type=checkbox], .formulier .form-group .radio input[type=radio] {
  opacity: 0;
}
.formulier .form-group .checkbox label, .formulier .form-group .radio label {
  position: relative;
  display: inline-block;
  /*16px width of fake checkbox + 6px distance between fake checkbox and text*/
  padding-left: 28px;
}
.formulier .form-group .checkbox label a, .formulier .form-group .radio label a {
  color: var(--primary);
}
.formulier .form-group .checkbox label::before, .formulier .form-group .checkbox label::after, .formulier .form-group .radio label::before, .formulier .form-group .radio label::after {
  position: absolute;
  content: "";
  /*Needed for the line-height to take effect*/
  display: inline-block;
}
.formulier .form-group .checkbox label::before, .formulier .form-group .radio label::before {
  height: 20px;
  width: 20px;
  border: 1px solid var(--lightGray);
  border-radius: 5px;
  left: -1px;
  background: white;
  /*(24px line-height - 16px height of fake checkbox) / 2 - 1px for the border
  *to vertically center it.
  */
  top: 3px;
}
.formulier .form-group .checkbox label::after, .formulier .form-group .radio label::after {
  height: 5px;
  width: 9px;
  border-left: 2px solid;
  border-bottom: 2px solid;
  border-color: var(--primary);
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  left: 5px;
  top: 9px;
}
.formulier .form-group .radio label::before {
  height: 18px;
  width: 18px;
  border: 1px solid var(--lightGray);
  left: 0px;
  /*(24px line-height - 16px height of fake checkbox) / 2 - 1px for the border
  *to vertically center it.
  */
  top: 3px;
  border-radius: 50%;
}
.formulier .form-group {
  /*Hide the checkmark by default*/
}
.formulier .form-group .radio input[type=radio] + label::after {
  content: none;
}
.formulier .form-group {
  /*Unhide on the checked state*/
}
.formulier .form-group .radio input[type=radio]:checked + label::after {
  content: "";
}
.formulier .form-group {
  /*Adding focus styles on the outer-box of the fake checkbox*/
}
.formulier .form-group .radio input[type=radio]:focus + label::before,
.formulier .form-group .radio input[type=radio]:focus-visible + label::before {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}
.formulier .form-group {
  /*Hide the checkmark by default*/
}
.formulier .form-group .checkbox input[type=checkbox] + label::after {
  content: none;
}
.formulier .form-group {
  /*Unhide on the checked state*/
}
.formulier .form-group .checkbox input[type=checkbox]:checked + label::after {
  content: "";
}
.formulier .form-group {
  /*Adding focus styles on the outer-box of the fake checkbox*/
}
.formulier .form-group .checkbox input[type=checkbox]:focus + label::before,
.formulier .form-group .checkbox input[type=checkbox]:focus-visible + label::before {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}
.formulier .button {
  float: left;
  clear: both;
  margin-top: -5px;
  background: var(--primary);
  padding: 10px 15px;
  color: #fff;
  border: 0;
  font-size: 16px;
  border-radius: 0 0 15px 15px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.formulier .button:hover {
  background: var(--secondary);
  cursor: pointer;
}

#recaptcha2,
.recaptcha2,
.cf-turnstile,
.h-captcha {
  float: left;
  clear: both;
  padding: 0.25rem 0 0.75rem 0;
}

.formulier .btn {
  float: left;
  clear: both;
}

.submit-form {
  margin-top: 0.25rem;
}
.submit-form:disabled {
  background-color: gray !important;
}

.filter-select {
  position: relative;
  width: auto;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.25rem;
}
.filter-select:hover::before {
  color: var(--text);
  background-color: rgba(var(--primary), 0.2);
}
.filter-select::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  font-weight: 600;
  content: "\f078";
  font-family: "Font Awesome 6 Pro";
  position: absolute;
  bottom: 12px;
  right: 0;
  width: 20%;
  height: auto;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
  font-size: var(--fontSizeBase);
  color: var(--text);
  background-color: rgba(var(--primary), 0.1);
  pointer-events: none;
}
.filter-select label {
  height: 24px;
}
.filter-select select {
  background-color: #fff;
  border: 1px solid var(--lightGray);
  color: var(--text);
  padding: 12px 16px 12px 12px;
  width: 255px;
  border-radius: 0.375rem;
  font-size: 16px;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.filter-select select:focus-visible {
  outline-color: var(--primary, #00b4ff);
}
.filter-select select option {
  padding: 30px;
}

#header-main {
  position: fixed;
  top: 0;
  width: 100%;
  background: var(--backBlack);
  z-index: 11;
  height: 117px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
#header-main #logo {
  display: inline-block;
  width: 200px;
  height: auto;
  max-height: 100px;
  overflow: hidden;
}
@media only screen and (max-width: 600px) {
  #header-main #logo {
    width: 150px;
  }
}
#header-main #logo img {
  width: auto;
  height: auto;
  position: relative;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  top: 50%;
}
#header-main #topmenu {
  margin-top: 25px;
  margin-right: 15px;
  height: 20px;
  opacity: 1;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 1000px) {
  #header-main #topmenu {
    margin-top: 0;
  }
  #header-main #topmenu .top-cta > a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
}
@media only screen and (max-width: 800px) {
  #header-main #topmenu .top-cta > a {
    display: none;
  }
}
#header-main #topmenu .top-cta a {
  color: white;
  margin-left: 1rem;
  font-size: 16px;
  letter-spacing: 0.025rem;
}
#header-main #topmenu .top-cta a:hover, #header-main #topmenu .top-cta a:focus-visible {
  color: var(--primary);
}
#header-main #topmenu .top-cta a:hover i, #header-main #topmenu .top-cta a:focus-visible i {
  color: var(--primary);
}
#header-main #topmenu .top-cta a i {
  margin-right: 0.75rem;
}
@media only screen and (max-width: 1000px) {
  #header-main #topmenu .top-cta a {
    font-size: 0;
  }
  #header-main #topmenu .top-cta a i {
    font-size: 16px;
  }
}
#header-main #topmenu > ul {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1.25rem;
}
#header-main #topmenu > ul li {
  height: auto !important;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1.25rem;
}
#header-main #topmenu > ul li a {
  padding: 0 !important;
  font-size: 16px;
  letter-spacing: 0.025rem;
}
#header-main #topmenu > ul li:last-of-type::after {
  content: "";
  position: relative;
  height: 20px;
  width: 2px;
  background-color: #CCC;
}
@media only screen and (max-width: 1000px) {
  #header-main .right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}

@media only screen and (max-width: 1000px) {
  .navigation {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}

#taalswitch {
  list-style: none;
  -webkit-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
}

.taalkeuze {
  width: 70px;
  cursor: pointer;
}
.taalkeuze a.chevron {
  font-size: 16px !important;
  cursor: pointer;
}
.taalkeuze a.chevron:after {
  font-size: 16px !important;
  content: "\f078";
  font-family: "Font Awesome 6 Pro";
  font-weight: 700;
  padding-left: 5px;
  position: absolute;
  margin-top: 3px;
  color: #fff;
}
.taalkeuze a {
  color: #fff;
  font-size: 18px;
  float: left;
  text-transform: uppercase;
  text-decoration: none;
  opacity: 1 !important;
}
@media only screen and (max-width: 700px) {
  .taalkeuze a {
    font-size: 0.75rem !important;
    line-height: 1rem;
  }
}
.taalkeuze a img {
  float: left;
  margin-right: 5px;
  margin-top: 3px;
  display: block;
  height: 20px;
  width: 30px;
}
.taalkeuze ul {
  top: 0px;
  min-width: initial;
  -webkit-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
}
.taalkeuze ul li a {
  color: var(--backBlack) !important;
  font-weight: 600;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 16px !important;
}
.taalkeuze ul li a:hover {
  color: var(--primary) !important;
}
.taalkeuze ul:hover {
  display: block;
}
.taalkeuze:hover > ul, .taalkeuze:focus-within > ul {
  display: block;
  margin-left: -20px;
  width: 90px;
  min-width: 0px;
  padding-top: 40px;
}
.taalkeuze:hover > ul a, .taalkeuze:focus-within > ul a {
  padding: 10px 16px;
}

#slider-main {
  height: 60vh;
  padding-left: 0px;
  padding-right: 0px;
  margin-top: 117px;
}
@media only screen and (max-width: 1000px) {
  #slider-main .container {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
}
@media only screen and (max-width: 976px) {
  #slider-main {
    height: 50vh;
  }
}
#slider-main.slider-vervolg {
  height: 40vh;
}
#slider-main .basis-slider {
  width: 100%;
  height: 100% !important;
  margin: 0;
  padding: 0;
}
#slider-main .basis-slider .basis-slides {
  height: 100%;
}
#slider-main .basis-slider .basis-slides .slick-list,
#slider-main .basis-slider .basis-slides .slick-track {
  height: 100%;
}
#slider-main .basis-slider .basis-slides .slick-track::before {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent;
  z-index: 1;
}
#slider-main .basis-slider .basis-slides .block-img {
  position: relative;
}
#slider-main .basis-slider .basis-slides .block-img::before {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: linear-gradient(225deg, black 5%, transparent 100%);
  z-index: 2;
}
#slider-main .basis-slider .basis-slides .block-img .hoofd_caption {
  position: absolute;
  top: 30%;
  right: 10%;
  z-index: 5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
@media only screen and (max-width: 480px) {
  #slider-main .basis-slider .basis-slides .block-img .hoofd_caption {
    top: 30%;
    right: auto;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
}
#slider-main .basis-slider .basis-slides .block-img .hoofd_caption span {
  color: var(--lightGray);
  cursor: auto;
}
#slider-main .basis-slider .basis-slides .block-img .hoofd_caption span:hover {
  color: var(--lightGray);
}
#slider-main .basis-slider .basis-slides .block-img .caption {
  position: relative;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
  background: none;
  padding: 0px;
}
@media only screen and (max-width: 700px) {
  #slider-main .basis-slider .basis-slides .block-img .caption {
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
}
#slider-main .basis-slider .basis-slides .block-img .caption .headtitle, #slider-main .basis-slider .basis-slides .block-img .caption .subtitle, #slider-main .basis-slider .basis-slides .block-img .caption a {
  margin: 0.5rem 0;
  line-height: 1;
}
#slider-main .basis-slider .basis-slides .slick-next, #slider-main .basis-slider .basis-slides .slick-prev {
  position: absolute;
  top: calc(50% - 1rem);
  width: 4rem !important;
  height: 4rem !important;
  background-color: rgba(var(--secondary), 80%);
  color: white;
  border-radius: 100%;
  font-size: 0 !important;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
  z-index: 1;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
#slider-main .basis-slider .basis-slides .slick-next:hover, #slider-main .basis-slider .basis-slides .slick-prev:hover {
  background-color: var(--secondary);
}
#slider-main .basis-slider .basis-slides .slick-prev {
  left: 10px;
}
#slider-main .basis-slider .basis-slides .slick-prev::before {
  content: "\f053" !important;
  font-family: "Font Awesome 6 Pro" !important;
}
#slider-main .basis-slider .basis-slides .slick-next {
  right: 10px;
}
#slider-main .basis-slider .basis-slides .slick-next::before {
  content: "\f054" !important;
  font-family: "Font Awesome 6 Pro" !important;
}
#slider-main .blokken-slider li {
  width: 50% !important;
  background-position: center center !important;
}
#slider-main .blokken-slider .block-img {
  height: 100%;
  position: relative;
}
#slider-main .blokken-slider .block-img::before {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: linear-gradient(225deg, black 5%, transparent 100%);
  z-index: 2;
}
#slider-main .blokken-slider .block-img .hoofd_caption {
  position: absolute;
  top: 30%;
  right: 10%;
  z-index: 5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
@media only screen and (max-width: 480px) {
  #slider-main .blokken-slider .block-img .hoofd_caption {
    top: 30%;
    right: auto;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
}
#slider-main .blokken-slider .block-img .hoofd_caption span {
  color: var(--lightGray);
  cursor: auto;
}
#slider-main .blokken-slider .block-img .hoofd_caption span:hover {
  color: var(--lightGray);
}
#slider-main .blokken-slider .block-img .caption {
  position: relative;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
  background: none;
  padding: 0px;
}
@media only screen and (max-width: 700px) {
  #slider-main .blokken-slider .block-img .caption {
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
}
#slider-main .blokken-slider .block-img .caption .headtitle, #slider-main .blokken-slider .block-img .caption .subtitle, #slider-main .blokken-slider .block-img .caption a {
  margin: 0.5rem 0;
  line-height: 1;
}
#slider-main .container-slider .slides li {
  background-position: center center !important;
}
#slider-main .container-slider .block-img {
  height: 100%;
  position: relative;
}
#slider-main .container-slider .block-img::before {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: linear-gradient(225deg, black 5%, transparent 100%);
  z-index: 2;
}
#slider-main .container-slider .block-img .hoofd_caption {
  position: absolute;
  top: 30%;
  right: 10%;
  z-index: 5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
@media only screen and (max-width: 480px) {
  #slider-main .container-slider .block-img .hoofd_caption {
    top: 30%;
    right: auto;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
}
#slider-main .container-slider .block-img .hoofd_caption span {
  color: var(--lightGray);
  cursor: auto;
}
#slider-main .container-slider .block-img .hoofd_caption span:hover {
  color: var(--lightGray);
}
#slider-main .container-slider .block-img .caption {
  position: relative;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
  background: none;
  padding: 0px;
}
@media only screen and (max-width: 700px) {
  #slider-main .container-slider .block-img .caption {
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
}
#slider-main .container-slider .block-img .caption .headtitle, #slider-main .container-slider .block-img .caption .subtitle, #slider-main .container-slider .block-img .caption a {
  margin: 0.5rem 0;
  line-height: 1;
}
#slider-main #sticker {
  position: absolute;
  right: 4rem;
  top: 4rem;
  border-radius: 50%;
  height: 200px;
  width: 200px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background: var(--secondary);
  color: white;
  z-index: 2;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-align: center;
  padding: 1rem;
  -webkit-transform: rotate(10deg);
          transform: rotate(10deg);
  -webkit-box-shadow: 0px 0px 24px 0px rgba(50, 50, 50, 0.33);
          box-shadow: 0px 0px 24px 0px rgba(50, 50, 50, 0.33);
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
#slider-main #sticker:hover {
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}
@media only screen and (max-width: 700px) {
  #slider-main #sticker {
    top: 0rem;
    right: 0rem;
    height: 100px;
    width: auto;
    max-width: 50%;
    font-size: 14px;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    border-radius: 0;
  }
}

#footer-main {
  background: #000;
  padding-top: 30px;
  padding-bottom: 30px;
  color: #fff;
}
#footer-main #footer-logo {
  width: 200px;
  margin-bottom: 1.5rem;
}
#footer-main #socialmedia {
  float: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 1rem;
}
#footer-main #socialmedia a {
  height: 45px;
  width: 45px;
  border-radius: 5px;
  border: 3px solid var(--primary);
  background-color: var(--backBlack);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: 0.4s all;
  transition: 0.4s all;
}
#footer-main #socialmedia a i {
  font-size: 20px;
  color: white;
  margin: 0;
}
#footer-main #socialmedia a:hover, #footer-main #socialmedia a:focus-visible {
  background-color: var(--primary);
}

#footer-small span {
  opacity: 0.5;
}

#sitework {
  color: var(--primary);
}
#sitework svg path {
  fill: var(--text);
}
#sitework .sitework-footer {
  opacity: 1;
  font-weight: 600;
  font-size: 14px;
}

.paginatie {
  width: 100%;
  padding: 10px 6px 10px 10px;
  overflow: hidden;
  background-color: #000000;
  margin-top: 15px;
  float: left;
}
.paginatie a {
  text-decoration: none;
  color: inherit;
}
.paginatie a:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

.paginatie_inactief, .paginatie_actief {
  float: left;
  margin-right: 10px;
  width: 30px;
  height: 30px;
  text-align: center;
  border: 1px solid #fff;
  color: #fff;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  line-height: 1;
  text-decoration: none;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.paginatie_inactief:hover, .paginatie_inactief:focus-visible, .paginatie_actief:hover, .paginatie_actief:focus-visible {
  background: #ccc;
  color: #000;
}

.paginatie_inactief {
  background: var(--secondary);
  color: #FFFFFF;
}

#paginatie_actief {
  background: var(--primary);
  color: #FFFFFF;
}

#vorige, #volgende {
  text-indent: -9999px;
  float: left;
  height: 30px;
  width: 30px;
  margin-top: 0px;
  padding-top: 2px;
  padding-bottom: 1px;
  cursor: pointer;
  position: relative;
  margin-right: 10px;
  -webkit-appearance: none;
}
#vorige:hover, #volgende:hover {
  background: #ccc;
}

.volgende-pijl, .vorige-pijl {
  position: relative;
  float: left;
  display: block;
  width: 30px;
  height: 30px;
}
.volgende-pijl:hover:after, .volgende-pijl:focus-visible:after, .vorige-pijl:hover:after, .vorige-pijl:focus-visible:after {
  background: #ccc;
}
.volgende-pijl:after, .vorige-pijl:after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 600;
  color: #FFF;
  display: block;
  border: 1px solid #fff;
  background-color: var(--secondary);
  font-size: 15px;
  position: absolute;
  z-index: 25;
  text-align: center;
  padding-top: 7px;
  width: 28px;
  height: 21px;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.volgende-pijl:after {
  content: "\f105";
}

.vorige-pijl:after {
  content: "\f104";
}

#pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.75rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-bottom: 2rem;
}
#pagination .page-item {
  opacity: 1;
  padding: 8px 12px;
  border-radius: 4px;
  background-color: var(--lightGray);
  color: var(--text);
}
#pagination .page-item.active, #pagination .page-item:hover, #pagination .page-item:focus-visible {
  background-color: var(--primary);
  color: white;
  outline-offset: 2px;
}
#pagination .page-item.disabled {
  opacity: 0.25;
  pointer-events: none;
  cursor: not-allowed;
}

.onscroll {
  /*hier komen css wijzigingen zodra je gaat scrollen. Wanneer dit wordt getriggerd is aan te passen in sitework.js*/
}
.onscroll #header-main {
  position: fixed;
  height: 72px;
}
.onscroll #header-main #topmenu > a {
  display: none;
}
.onscroll #slider-main {
  margin-top: 118px;
}
.onscroll #logo {
  width: 100px !important;
  max-height: 50px !important;
}
.onscroll .right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.onscroll .taalkeuze:hover > ul {
  padding-top: 40px;
}

.progress-wrap {
  position: fixed;
  right: 10px;
  bottom: 10px;
  height: 46px;
  width: 46px;
  cursor: pointer;
  display: block;
  border-radius: 50px;
  -webkit-box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.2);
          box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.2);
  z-index: 10000;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(15px);
          transform: translateY(15px);
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
  --test: var(--primary);
}
@media only screen and (max-width: mqTabletPort) {
  .progress-wrap {
    display: none;
  }
}

.progress-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.progress-wrap::after {
  position: absolute;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  content: "\f062";
  font-weight: 600;
  text-align: center;
  line-height: 46px;
  font-size: 18px;
  color: var(--primary);
  left: 0;
  top: 0;
  height: 46px;
  width: 46px;
  cursor: pointer;
  display: block;
  z-index: 1;
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
}

.progress-wrap::before {
  position: absolute;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 6 Pro";
  font-weight: 600;
  text-align: center;
  line-height: 46px;
  font-size: 18px;
  opacity: 0;
  background-image: linear-gradient(298deg, var(--red), var(--yellow));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  left: 0;
  top: 0;
  height: 46px;
  width: 46px;
  cursor: pointer;
  display: block;
  z-index: 2;
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
}

.progress-wrap:hover::before {
  opacity: 1;
}

.progress-wrap svg path {
  fill: none;
}

.progress-wrap svg.progress-circle path {
  stroke: var(--primary);
  stroke-width: 4;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
}

#mobile-cta {
  display: none;
}
@media only screen and (max-width: 800px) {
  #mobile-cta {
    display: block;
  }
}
#mobile-cta {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9998;
  background: var(--backBlack);
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding-bottom: env(safe-area-inset-bottom, 0);
  -webkit-box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.18);
          box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.18);
}
#mobile-cta ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  margin: 0;
  padding: 0;
  list-style: none;
}
#mobile-cta li {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 25%;
          flex: 1 1 25%;
  min-width: 0;
}
#mobile-cta li:not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, 0.1);
}
#mobile-cta a,
#mobile-cta span,
#mobile-cta button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  min-height: 56px;
  color: #fff;
  text-decoration: none;
  cursor: pointer;
  background: transparent;
  border: 0;
  padding: 0;
  font: inherit;
  -webkit-transition: background-color 0.2s ease, color 0.2s ease;
  transition: background-color 0.2s ease, color 0.2s ease;
  -webkit-tap-highlight-color: transparent;
}
#mobile-cta a i,
#mobile-cta span i,
#mobile-cta button i {
  font-size: 22px;
  line-height: 1;
  margin: 0;
  pointer-events: none;
}
#mobile-cta a:hover, #mobile-cta a:focus-visible,
#mobile-cta span:hover,
#mobile-cta span:focus-visible,
#mobile-cta button:hover,
#mobile-cta button:focus-visible {
  background: rgba(var(--rgb-primary), 0.15);
  color: var(--primary);
  outline: 2px solid var(--primary);
  outline-offset: -2px;
}
#mobile-cta a:active,
#mobile-cta span:active,
#mobile-cta button:active {
  background: rgba(var(--rgb-primary), 0.25);
}

@media only screen and (max-width: 800px) {
  body {
    padding-bottom: calc(56px + env(safe-area-inset-bottom, 0));
  }
  .progress-wrap {
    display: none !important;
  }
}
#breadcrumbs {
  background: white;
  border-bottom: 1px dashed var(--lightGray);
}
#breadcrumbs .container ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
#breadcrumbs .container ul li {
  display: inline-block;
  margin: 0 10px;
}
#breadcrumbs .container ul li a {
  color: var(--primary);
  position: relative;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
#breadcrumbs .container ul li a:after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  font-weight: 600;
  content: "\f054";
  position: absolute;
  right: -15px;
  top: 4px;
  font-size: 10px;
  font-family: "Font Awesome 6 Pro";
}

#content-vervolg-main #zoekblok h1 {
  color: var(--primary);
  margin-bottom: 10px;
}
#content-vervolg-main #zoekblok #zoekform {
  display: -ms-grid;
  display: grid;
  gap: 20px;
}
#content-vervolg-main #zoekblok #zoekform #q {
  border-radius: 8px;
  padding: 12px 18px;
  background: #EEE;
}
#content-vervolg-main #zoekblok #zoekform .btn {
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
#content-vervolg-main #zoekblok #zoekresultaten {
  display: -ms-grid;
  display: grid;
  gap: 30px;
  margin-bottom: 70px;
}
#content-vervolg-main #zoekblok #zoekresultaten .zoekitem {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 5px;
  background: #fff;
  color: var(--backBlack);
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 8px;
  overflow: hidden;
  -webkit-box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
          box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
#content-vervolg-main #zoekblok #zoekresultaten .zoekitem .picture-container {
  border-radius: 8px 8px 0 0;
  overflow: hidden;
}
#content-vervolg-main #zoekblok #zoekresultaten .zoekitem .zoekHighlight {
  color: var(--primary);
  font-weight: 600;
}
#content-vervolg-main #zoekblok #zoekresultaten .zoekitem .zoek-img {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  width: 100%;
}
#content-vervolg-main #zoekblok #zoekresultaten .zoekitem .zoek-img .block-img {
  height: 100%;
}
#content-vervolg-main #zoekblok #zoekresultaten .zoekitem .zoekitem-tekst {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 20px;
  padding: 20px;
  height: 100%;
  width: 100%;
}
#content-vervolg-main #zoekblok #zoekresultaten .zoekitem .zoekitem-tekst .titel-en-tekst {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
#content-vervolg-main #zoekblok #zoekresultaten .zoekitem .zoekitem-tekst a {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  text-decoration: none !important;
}
#content-vervolg-main #zoekblok #zoekresultaten .zoekitem .zoekitem-tekst .zoekitem_titel {
  font-size: 22px;
  margin-bottom: 10px;
  color: var(--primary);
}

.zoekterm-hidden {
  display: none;
}

.sw-skip-link {
  position: absolute;
  left: 0.75rem;
  top: -100%;
  z-index: 100000;
  padding: 0.65rem 1rem;
  background: var(--secondary, var(--color--secondary, #80b700));
  color: #fff !important;
  font-weight: 600;
  text-decoration: none;
  border-radius: var(--borderRadius, 8px);
  -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
          box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}
.sw-skip-link:focus, .sw-skip-link:focus-visible {
  top: 0.75rem;
  outline: 3px solid #fff;
  outline-offset: 3px;
  color: #fff !important;
}

:focus:not(:focus-visible) {
  outline: none;
}

a:focus-visible,
button:focus-visible,
[href]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible {
  outline: 2px solid var(--secondary, var(--color--secondary, #80b700));
  outline-offset: 2px;
}

.sw-form .sw-control:focus-visible {
  outline: none;
}

#main-content {
  scroll-margin-top: 8rem;
}

.reveal {
  opacity: 0;
  -webkit-transform: translateY(18px);
          transform: translateY(18px);
  -webkit-transition: opacity 0.75s var(--ease-out), -webkit-transform 0.75s var(--ease-out);
  transition: opacity 0.75s var(--ease-out), -webkit-transform 0.75s var(--ease-out);
  transition: opacity 0.75s var(--ease-out), transform 0.75s var(--ease-out);
  transition: opacity 0.75s var(--ease-out), transform 0.75s var(--ease-out), -webkit-transform 0.75s var(--ease-out);
  -webkit-transition-delay: 0s;
          transition-delay: 0s;
}

.reveal.is-in {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.reveal-delay-1 {
  -webkit-transition-delay: 0.07s;
          transition-delay: 0.07s;
}

.reveal-delay-2 {
  -webkit-transition-delay: 0.14s;
          transition-delay: 0.14s;
}

.reveal-delay-3 {
  -webkit-transition-delay: 0.21s;
          transition-delay: 0.21s;
}

.reveal-delay-4 {
  -webkit-transition-delay: 0.28s;
          transition-delay: 0.28s;
}

.reveal-delay-5 {
  -webkit-transition-delay: 0.35s;
          transition-delay: 0.35s;
}

.reveal-delay-6 {
  -webkit-transition-delay: 0.42s;
          transition-delay: 0.42s;
}

/* —— Parallax frames —— */
.parallax-frame {
  isolation: isolate;
  overflow: hidden;
}

.parallax-media {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  will-change: transform;
}

/* Hero full-bleed parallax: oversize media so scroll shift never shows edges */
#hero .parallax-frame {
  overflow: hidden;
}

#hero .parallax-media {
  position: absolute;
  inset: -10% 0;
  width: 100%;
  height: 120%;
  max-width: none;
  -o-object-fit: cover;
     object-fit: cover;
}

/* —— Page enter ——
   Do NOT put transform/will-change on html or body: any non-none transform
   creates a containing block and breaks position:fixed (header, mobile CTA)
   and can mess with height/vh layout. Animate <main> instead; end on transform:none. */
#hero, #breadcrumbs {
  opacity: 0;
  -webkit-animation: pageEnter 620ms var(--ease-out) forwards;
          animation: pageEnter 620ms var(--ease-out) forwards;
}

@-webkit-keyframes pageEnter {
  from {
    opacity: 0;
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes pageEnter {
  from {
    opacity: 0;
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
    -webkit-transition: none;
    transition: none;
  }
  .parallax-media {
    -webkit-transform: none !important;
            transform: none !important;
  }
  #hero .parallax-media {
    inset: 0;
    height: 100%;
  }
  #hero, #breadcrumbs {
    -webkit-animation: pageEnterFade 260ms ease forwards;
            animation: pageEnterFade 260ms ease forwards;
  }
  @-webkit-keyframes pageEnterFade {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
  @keyframes pageEnterFade {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
}
body {
  background-color: var(--color--site-bg, #faf6f5);
  font-family: var(--font-weight--font-family, Urbanist, Arial, sans-serif);
}

.page-wrapper {
  min-height: 100%;
}

main > section[id^=block-] {
  display: block;
}

.menu-button:focus-visible,
.nav-link:focus-visible,
.nav-dropdown-toggle:focus-visible,
.button-01:focus-visible,
.button-02:focus-visible,
.faq-item:focus-visible,
.tabset-link:focus-visible {
  outline: 2px solid var(--color--secondary, #80b700);
  outline-offset: 3px;
}