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

   Fonts: assets/fonts/fonts.css (Anton + Geist, self-hosted woff2;
   the export pulled both from Google at runtime, along with a third
   family it never used). */

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

   This file is emitted BETWEEN the framework and the design sections, so the
   design keeps overriding it exactly as it overrode the originals. Nothing here
   may out-score the design rule it stands in for: a replacement that wins the
   cascade where the original lost is how Aureva threw a slider arrow across the
   page. Where a selector had to grow (the nav overlay's closed state), it is
   wrapped in `:where()` so it still scores what it scored before. */

/* --- nav bar ------------------------------------------------------------ */
/* `.w-nav`. The design sets `position: absolute` and a transparent background
   over these, so only the stacking context is load-bearing. The clearfix
   pseudo-elements are reproduced because they are real boxes -- a `display:
   table` with a space in it is not zero height. `.navbar` is a block, not a
   flex container, so they stay table boxes rather than becoming flex items:
   that is the difference that cost Nuestudio its whole nav. */
.navbar {
  position: relative;
  z-index: 1000;
}
.navbar:before, .navbar:after {
  content: " ";
  display: table;
  grid-column-start: 1;
  grid-row-start: 1;
  grid-column-end: 2;
  grid-row-end: 2;
}
.navbar:after {
  clear: both;
}
/* `.w-nav-brand`. The float is inert -- `.nav-menu-wrapper` is a flex row and
   floats do not apply to flex items -- but it is reproduced because the rule
   was there and because the 767px padding below overrides through it. */
.brand-logo-link {
  position: relative;
  float: left;
  text-decoration: none;
  color: #333;
}
/* `.w-nav-menu`. */
.nav-menu {
  position: relative;
  float: right;
}
/* `.w-nav-button`, plus the `[data-collapse='medium']` pair that showed it and
   hid the menu below 992px. The button is a real <button> now, so the UA's
   form-control reset has to be undone as well -- see the reset at the end. */
.menu-button {
  position: relative;
  float: right;
  padding: 18px;
  font-size: 24px;
  display: none;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  user-select: none;
}
/* --- nav overlay -------------------------------------------------------- */
/* Above 992px the overlay must not exist as a box at all. `.nav-menu-wrapper`
   is a flex row with `justify-content: space-between` and `.nav-menu` is one of
   its three items; putting a plain <div> between the two makes the DIV the flex
   item and the menu stops being spaced against the logo and the cart.
   `display: contents` removes the wrapper from the box tree and hands
   `.nav-menu` its place back, unchanged. */
.nav-overlay {
  display: contents;
}
@media screen and (max-width: 991px) {
/* `.w-nav[data-collapse='medium']`: the menu goes and the hamburger arrives.
     `.nav-menu` is hidden here rather than in components.hand.css because this
     is the framework rule it is standing in for -- the OPEN state, which has to
     beat it, lives with the rest of the behaviour. */
  .nav-menu {
    display: none;
  }
.menu-button {
    display: block;
  }
/* `.w-nav-overlay`, which the runtime built in JavaScript and measured. It is
     static here: a fixed panel the sheet slides in, so nothing is measured. */
  .nav-overlay {
    display: block;
    position: absolute;
    overflow: hidden;
    top: 100%;
    left: 0;
    right: 0;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
/* `.w-nav-brand`. The design zeroes this again in its own 767px block, which
     is why it has to exist for the design to zero. */
  .brand-logo-link {
    padding-left: 10px;
  }
}
/* --- Pages dropdown ----------------------------------------------------- */
/* `.w-dropdown`. */
.dropdown {
  display: inline-block;
  position: relative;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  z-index: 900;
}
/* `.w-dropdown-btn, .w-dropdown-toggle, .w-dropdown-link` -- one rule in the
   framework sheet, split here because the three now have different names. The
   design overrides the padding and the colour on the toggle and most of it on
   the link, so what is really load-bearing is `position: relative` and
   `white-space: nowrap`. */
.dropdown-toggle, .dd-link {
  position: relative;
  vertical-align: top;
  text-decoration: none;
  color: #222;
  padding: 20px;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  white-space: nowrap;
}
/* `.w-dropdown-toggle`. */
.dropdown-toggle {
  user-select: none;
  display: inline-block;
  cursor: pointer;
  padding-right: 40px;
}
.dropdown-toggle:focus {
  outline: 0;
}
/* `.w-dropdown-list`. `display: none` is the CLOSED state, and it is the one
   rule here the behaviour sheet has to beat -- see components.hand.css. */
.dd-navigation {
  position: absolute;
  background: #ddd;
  display: none;
  min-width: 100%;
}
/* `.w-dropdown-link`. */
.dd-link {
  padding: 10px 20px;
  display: block;
  color: #222;
}
.dd-link:focus {
  outline: 0;
}
/* --- sliders ------------------------------------------------------------ */
/* `.w-slider`. The `height: 300px` and the grey background are both overridden
   by every one of the five sliders' own design rules, but `position: relative`
   is what the arrows are absolutely positioned against and `clear: both` is
   what keeps the slider clear of the floats above it. */
.discover-slider, .gear-slider, .testimonial-slider, .trips-slider {
  position: relative;
  height: 300px;
  text-align: center;
  background: #ddd;
  clear: both;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
/* `.w-slider-mask`. */
.discover-slide-mask, .gear-slider-mask, .testimonial-slider-mask, .trips-slider-mask {
  position: relative;
  display: block;
  overflow: hidden;
  z-index: 1;
  left: 0;
  right: 0;
  height: 100%;
  white-space: nowrap;
}
/* `.w-slide`. `white-space: normal` matters: the mask is `nowrap` so that the
   slides sit on one line, and without this every slide's own text would inherit
   it and run off the side. */
.discover-slide, .gear-slide, .testimonial-slide, .trips-single-slide {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 100%;
  height: 100%;
  white-space: normal;
  text-align: left;
}
/* `.w-slider-arrow-left, .w-slider-arrow-right`. The design gives both arrows a
   size and a place, so only the positioning context and the two z-indexes are
   load-bearing. They are real <button>s now; the reset at the end of this file
   is what stops the UA drawing a border round them. */
.testimonial-left-arrow, .testimonial-right-arrow {
  position: absolute;
  width: 80px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  cursor: pointer;
  overflow: hidden;
  color: #fff;
  font-size: 40px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  user-select: none;
}
.testimonial-left-arrow {
  z-index: 3;
  right: auto;
}
.testimonial-right-arrow {
  z-index: 4;
  left: auto;
}
/* --- retagged elements -------------------------------------------------- */
/* THE MOST LOAD-BEARING BLOCK IN THIS FILE.
   ---------------------------------------------------------------------------
   This design styles the BARE `a` element -- colour, line-height, `font-weight: bold`, letter-spacing and `display: inline-block`. Eleven
   elements stop being `<a>` in this build (both tab strips, the FAQ questions, the cart's open and close links, "Place Order"), and each of them silently
   loses all five. Eyeconic shipped a tab strip 7px short by missing exactly
   this.

   `<button>` loses more again: the UA's form-control reset drops the INHERITED
   `letter-spacing`, `word-spacing` and `text-transform`, and `font: inherit`
   does NOT bring those three back -- they have to be named.

   Everything here is wrapped in `:where()` so it scores ZERO. That is not
   tidiness: `a` scores (0, 0, 1) and loses to every design class, so a
   replacement scoring (0, 1, 0) would start WINNING against rules the original
   lost to, and the design would quietly change. */
:where(.faq-tabs-link, .shop-tabs-link, .faq-question-wrap, .wf-commerce-commercecartopenlink, .wf-commerce-commercecartcloselink, .wf-commerce-commercecheckoutplaceorderbutton, .dropdown-toggle, .menu-button, .testimonial-left-arrow, .testimonial-right-arrow) {
  color: var(--black);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---bold);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
  text-decoration: none;
  display: inline-block;
}
/* The form-control reset, for the seven that became <button>. */
:where(button.faq-question-wrap, button.shop-tabs-link, button.wf-commerce-commercecartopenlink, button.wf-commerce-commercecartcloselink, button.wf-commerce-commercecheckoutplaceorderbutton, button.dropdown-toggle, button.menu-button, button.testimonial-left-arrow, button.testimonial-right-arrow, button.remove-button, button.wf-commerce-commerceaddtocartoptionpill) {
  background: none;
  border: 0;
  margin: 0;
  font: inherit;
  /* Not covered by `font: inherit`; the UA reset drops all three. */
  letter-spacing: inherit;
  word-spacing: inherit;
  text-transform: inherit;
  text-align: inherit;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
/* --- skip link ---------------------------------------------------------- */
/* Off-screen until focused, then parked over the header. Every page has one and
   the export had none. */
.skip-link {
  position: absolute;
  top: -100vh;
  left: 1rem;
  z-index: 2000;
  padding: 0.75rem 1.25rem;
  background: var(--dark-color);
  color: var(--white);
  border-radius: 0.5rem;
}
.skip-link:focus {
  top: 1rem;
}
/* A heading that exists for the outline rather than for the page. */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
/* A visible focus ring, everywhere. The framework sheet had none and the design
   sheet removes the UA's on several controls, so without this the template is
   unusable from the keyboard. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--dark-blood);
  outline-offset: 3px;
}
/* ======================================================================
   3. Camp design
   ====================================================================== */
:root {
  --background: #f7f3e9;
  --_font-family---secondary-font: Geist, sans-serif;
  --black: black;
  --_typography---medium: 16px;
  --_line-height---line-height-3xl: 150%;
  --_font-weight---medium: 500;
  --_font-family---primary-font: Anton, sans-serif;
  --_typography---h1: 110px;
  --_line-height---line-height-m: 100%;
  --_font-weight---regular: 400;
  --_letter-speacing---letter-speacing-xl: -2.4px;
  --_typography---h2: 100px;
  --_line-height---line-height-l: 105%;
  --_letter-speacing---letter-speacing-x: -2px;
  --_typography---h3: 64px;
  --_typography---h4: 48px;
  --_line-height---line-height-x: 108%;
  --_typography---h5: 40px;
  --_line-height---line-height-xl: 110%;
  --_letter-speacing---letter-speacing-l: -.64px;
  --_typography---h6: 24px;
  --dark-blood: #5c0404;
  --_font-weight---bold: 700;
  --_margin-padding---gap-xs: 20px;
  --transparent: transparent;
  --_margin-padding---gap-m: 30px;
  --dark-color: #212121;
  --_letter-speacing---letter-speacing-m: -.16px;
  --white: white;
  --_margin-padding---gap-3xl: 120px;
  --_margin-padding---gap-4xl: 170px;
  --_margin-padding---gap-xxl: 100px;
  --_margin-padding---gap-xl: 80px;
  --_margin-padding---gap-l: 72px;
  --_border-radius---border-l: 24px;
  --_margin-padding---gap-s: 24px;
  --primary-color: #ff9348;
  --gray-color: #73726e;
  --_border-radius---border-xl: 999px;
  --_typography---regular: 14px;
  --_typography---dispaly-font: 160px;
  --_letter-speacing---letter-speacing-xxl: -6.4px;
  --_border-radius---border-s: 16px;
  --_font-family---third-font: Arial, "Helvetica Neue", Helvetica, sans-serif;
  --_line-height---line-height-xxl: 112%;
  --white-10: #ffffff1a;
  --_line-height---line-height-s: 80%;
  --_border-radius---border-m: 13px;
  --_letter-speacing---letter-speacing-s: -.14px;
  --_typography---font-zero: 0px;
}
.wf-layout-blockcontainer {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
.wf-commerce-commercecartwrapper {
  display: inline-block;
  position: relative;
}
.wf-commerce-commercecartopenlink {
  color: #fff;
  cursor: pointer;
  appearance: none;
  background-color: #3898ec;
  border-width: 0;
  border-radius: 0;
  align-items: center;
  padding: 9px 15px;
  text-decoration: none;
  display: flex;
}
.wf-commerce-commercecartopenlinkcount {
  color: #3898ec;
  text-align: center;
  background-color: #fff;
  border-radius: 9px;
  min-width: 18px;
  height: 18px;
  margin-left: 8px;
  padding-left: 6px;
  padding-right: 6px;
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
  display: inline-block;
}
.wf-commerce-commercecartcontainerwrapper {
  z-index: 1001;
  background-color: #000c;
  position: fixed;
  inset: 0;
}
.wf-commerce-commercecartcontainerwrapper--cartType-leftSidebar {
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  display: flex;
}
.wf-commerce-commercecartcontainer {
  background-color: #fff;
  flex-direction: column;
  width: 100%;
  min-width: 320px;
  max-width: 480px;
  display: flex;
  overflow: auto;
  box-shadow: 0 5px 25px #00000040;
}
.wf-commerce-commercecartheader {
  border-bottom: 1px solid #e6e6e6;
  flex: none;
  justify-content: space-between;
  align-items: center;
  padding: 16px 24px;
  display: flex;
  position: relative;
}
.wf-commerce-commercecartheading {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 0;
}
.wf-commerce-commercecartcloselink {
  width: 16px;
  height: 16px;
}
.wf-commerce-commercecartformwrapper {
  flex-direction: column;
  flex: 1;
  display: flex;
}
.wf-commerce-commercecartform {
  flex-direction: column;
  flex: 1;
  justify-content: flex-start;
  display: flex;
}
.wf-commerce-commercecartlist {
  -webkit-overflow-scrolling: touch;
  flex: 1;
  padding: 12px 24px;
  overflow: auto;
}
.wf-commerce-commercecartitem {
  align-items: flex-start;
  padding-top: 12px;
  padding-bottom: 12px;
  display: flex;
}
.wf-commerce-commercecartitemimage {
  width: 60px;
  height: 0%;
}
.wf-commerce-commercecartiteminfo {
  flex-direction: column;
  flex: 1;
  margin-left: 16px;
  margin-right: 16px;
  display: flex;
}
.wf-commerce-commercecartproductname {
  font-weight: 700;
}
.wf-commerce-commercecartoptionlist {
  margin-bottom: 0;
  padding-left: 0;
  text-decoration: none;
  list-style-type: none;
}
.wf-commerce-commercecartquantity {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 60px;
  height: 38px;
  margin-bottom: 10px;
  padding: 8px 6px 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecartquantity::placeholder {
  color: #999;
}
.wf-commerce-commercecartquantity:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecartfooter {
  border-top: 1px solid #e6e6e6;
  flex-direction: column;
  flex: none;
  padding: 16px 24px 24px;
  display: flex;
}
.wf-commerce-commercecartlineitem {
  flex: none;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 16px;
  display: flex;
}
.wf-commerce-commercecartordervalue {
  font-weight: 700;
}
.wf-commerce-commercecartcheckoutbutton {
  color: #fff;
  cursor: pointer;
  appearance: none;
  text-align: center;
  background-color: #3898ec;
  border-width: 0;
  border-radius: 2px;
  align-items: center;
  padding: 9px 15px;
  text-decoration: none;
  display: block;
}
.wf-commerce-commercecartemptystate {
  flex: 1;
  justify-content: center;
  align-items: center;
  padding-top: 100px;
  padding-bottom: 100px;
  display: flex;
}
.wf-commerce-commercecarterrorstate {
  background-color: #ffdede;
  flex: none;
  margin: 0 24px 24px;
  padding: 10px;
}
.wf-commerce-commerceaddtocartform {
  margin: 0 0 15px;
}
.wf-commerce-commerceaddtocartoptionpillgroup {
  margin-bottom: 10px;
  display: flex;
}
.wf-commerce-commerceaddtocartoptionpill {
  color: #000;
  cursor: pointer;
  background-color: #fff;
  border: 1px solid #000;
  margin-right: 10px;
  padding: 8px 15px;
}
.wf-commerce-commerceaddtocartoptionpill.is-selected {
  color: #fff;
  background-color: #000;
}
.wf-commerce-commerceaddtocartoptionpill.is-disabled {
  color: #666;
  cursor: not-allowed;
  background-color: #e6e6e6;
  border-color: #e6e6e6;
  outline-style: none;
}
.wf-commerce-commerceaddtocartquantityinput {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 60px;
  height: 38px;
  margin-bottom: 10px;
  padding: 8px 6px 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commerceaddtocartquantityinput::placeholder {
  color: #999;
}
.wf-commerce-commerceaddtocartquantityinput:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commerceaddtocartbutton {
  color: #fff;
  cursor: pointer;
  appearance: none;
  background-color: #3898ec;
  border-width: 0;
  border-radius: 0;
  align-items: center;
  padding: 9px 15px;
  text-decoration: none;
  display: flex;
}
.wf-commerce-commerceaddtocartbutton.is-disabled {
  color: #666;
  cursor: not-allowed;
  background-color: #e6e6e6;
  border-color: #e6e6e6;
  outline-style: none;
}
.wf-commerce-commerceaddtocartoutofstock {
  background-color: #ddd;
  margin-top: 10px;
  padding: 10px;
}
.wf-commerce-commerceaddtocarterror {
  background-color: #ffdede;
  margin-top: 10px;
  padding: 10px;
}
.wf-commerce-commercecheckoutformcontainer {
  background-color: #f5f5f5;
  width: 100%;
  min-height: 100vh;
  padding: 20px;
}
.wf-commerce-commercelayoutcontainer {
  justify-content: center;
  align-items: flex-start;
  display: flex;
}
.wf-commerce-commercelayoutmain {
  flex: 0 800px;
  margin-right: 20px;
}
.wf-commerce-commercecheckoutcustomerinfowrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutblockheader {
  background-color: #fff;
  border: 1px solid #e6e6e6;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 20px;
  display: flex;
}
.wf-commerce-commercecheckoutblockcontent {
  background-color: #fff;
  border-bottom: 1px solid #e6e6e6;
  border-left: 1px solid #e6e6e6;
  border-right: 1px solid #e6e6e6;
  padding: 20px;
}
.wf-commerce-commercecheckoutlabel {
  margin-bottom: 8px;
}
.wf-commerce-commercecheckoutemailinput {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 0;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutemailinput::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutemailinput:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingaddresswrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutshippingfullname {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingfullname::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingfullname:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingstreetaddress {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingstreetaddress::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingstreetaddress:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingstreetaddressoptional {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingstreetaddressoptional::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingstreetaddressoptional:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutrow {
  margin-left: -8px;
  margin-right: -8px;
  display: flex;
}
.wf-commerce-commercecheckoutcolumn {
  flex: 1;
  padding-left: 8px;
  padding-right: 8px;
}
.wf-commerce-commercecheckoutshippingcity {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingcity::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingcity:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingstateprovince {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingstateprovince::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingstateprovince:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingzippostalcode {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingzippostalcode::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingzippostalcode:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingcountryselector {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 0;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutshippingcountryselector::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutshippingcountryselector:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutshippingmethodswrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutshippingmethodslist {
  border-left: 1px solid #e6e6e6;
  border-right: 1px solid #e6e6e6;
}
.wf-commerce-commercecheckoutshippingmethoditem {
  background-color: #fff;
  border-bottom: 1px solid #e6e6e6;
  flex-direction: row;
  align-items: baseline;
  margin-bottom: 0;
  padding: 16px;
  font-weight: 400;
  display: flex;
}
.wf-commerce-commercecheckoutshippingmethoddescriptionblock {
  flex-direction: column;
  flex-grow: 1;
  margin-left: 12px;
  margin-right: 12px;
  display: flex;
}
.wf-commerce-commerceboldtextblock {
  font-weight: 700;
}
.wf-commerce-commercecheckoutshippingmethodsemptystate {
  text-align: center;
  background-color: #fff;
  border-bottom: 1px solid #e6e6e6;
  border-left: 1px solid #e6e6e6;
  border-right: 1px solid #e6e6e6;
  padding: 64px 16px;
}
.wf-commerce-commercecheckoutpaymentinfowrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutcardnumber {
  appearance: none;
  cursor: text;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutcardnumber::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutcardnumber:focus, .wf-commerce-commercecheckoutcardnumber.is-focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutcardexpirationdate {
  appearance: none;
  cursor: text;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutcardexpirationdate::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutcardexpirationdate:focus, .wf-commerce-commercecheckoutcardexpirationdate.is-focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutcardsecuritycode {
  appearance: none;
  cursor: text;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutcardsecuritycode::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutcardsecuritycode:focus, .wf-commerce-commercecheckoutcardsecuritycode.is-focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingaddresstogglewrapper {
  flex-direction: row;
  display: flex;
}
.wf-commerce-commercecheckoutbillingaddresstogglecheckbox {
  margin-top: 4px;
}
.wf-commerce-commercecheckoutbillingaddresstogglelabel {
  margin-left: 8px;
  font-weight: 400;
}
.wf-commerce-commercecheckoutbillingaddresswrapper {
  margin-top: 16px;
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutbillingfullname {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingfullname::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingfullname:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingstreetaddress {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingstreetaddress::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingstreetaddress:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingstreetaddressoptional {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingstreetaddressoptional::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingstreetaddressoptional:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingcity {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingcity::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingcity:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingstateprovince {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingstateprovince::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingstateprovince:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingzippostalcode {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 16px;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingzippostalcode::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingzippostalcode:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutbillingcountryselector {
  appearance: none;
  background-color: #fafafa;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 100%;
  height: 38px;
  margin-bottom: 0;
  padding: 8px 12px;
  line-height: 20px;
  display: block;
}
.wf-commerce-commercecheckoutbillingcountryselector::placeholder {
  color: #999;
}
.wf-commerce-commercecheckoutbillingcountryselector:focus {
  border-color: #3898ec;
  outline-style: none;
}
.wf-commerce-commercecheckoutorderitemswrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutsummaryblockheader {
  background-color: #fff;
  border: 1px solid #e6e6e6;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 20px;
  display: flex;
}
.wf-commerce-commercecheckoutorderitemslist {
  margin-bottom: -20px;
}
.wf-commerce-commercelayoutsidebar {
  flex: 0 0 320px;
  position: sticky;
  top: 20px;
}
.wf-commerce-commercecheckoutordersummarywrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutsummarylineitem, .wf-commerce-commercecheckoutordersummaryextraitemslistitem {
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 8px;
  display: flex;
}
.wf-commerce-commercecheckoutsummarytotal {
  font-weight: 700;
}
.wf-commerce-commercecheckoutplaceorderbutton {
  color: #fff;
  cursor: pointer;
  appearance: none;
  text-align: center;
  background-color: #3898ec;
  border-width: 0;
  border-radius: 3px;
  align-items: center;
  margin-bottom: 20px;
  padding: 9px 15px;
  text-decoration: none;
  display: block;
}
.wf-commerce-commercecheckouterrorstate {
  background-color: #ffdede;
  margin-top: 16px;
  margin-bottom: 16px;
  padding: 10px 16px;
}
.wf-commerce-commercepaypalcheckoutformcontainer {
  background-color: #f5f5f5;
  width: 100%;
  min-height: 100vh;
  padding: 20px;
}
.wf-commerce-commercecheckoutcustomerinfosummarywrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercecheckoutsummaryitem, .wf-commerce-commercecheckoutsummarylabel {
  margin-bottom: 8px;
}
.wf-commerce-commercecheckoutsummaryflexboxdiv {
  flex-direction: row;
  justify-content: flex-start;
  display: flex;
}
.wf-commerce-commercecheckoutsummarytextspacingondiv {
  margin-right: .33em;
}
.wf-commerce-commercecheckoutpaymentsummarywrapper {
  margin-bottom: 20px;
}
.wf-commerce-commercepaypalcheckouterrorstate {
  background-color: #ffdede;
  margin-top: 16px;
  margin-bottom: 16px;
  padding: 10px 16px;
}
.wf-commerce-commerceorderconfirmationcontainer {
  background-color: #f5f5f5;
  width: 100%;
  min-height: 100vh;
  padding: 20px;
}
.wf-commerce-commercecheckoutshippingsummarywrapper {
  margin-bottom: 20px;
}
@media screen and (max-width: 991px) {
.wf-layout-blockcontainer {
    max-width: 728px;
  }
}
@media screen and (max-width: 767px) {
.wf-layout-blockcontainer {
    max-width: none;
  }
.wf-commerce-commercelayoutcontainer {
    flex-direction: column;
    align-items: stretch;
  }
.wf-commerce-commercelayoutmain {
    flex-basis: auto;
    margin-right: 0;
  }
.wf-commerce-commercelayoutsidebar {
    flex-basis: auto;
  }
}
@media screen and (max-width: 479px) {
.wf-commerce-commercecartquantity, .wf-commerce-commerceaddtocartquantityinput, .wf-commerce-commercecheckoutemailinput, .wf-commerce-commercecheckoutshippingfullname, .wf-commerce-commercecheckoutshippingstreetaddress, .wf-commerce-commercecheckoutshippingstreetaddressoptional {
    font-size: 16px;
  }
.wf-commerce-commercecheckoutrow {
    flex-direction: column;
  }
.wf-commerce-commercecheckoutshippingcity, .wf-commerce-commercecheckoutshippingstateprovince, .wf-commerce-commercecheckoutshippingzippostalcode, .wf-commerce-commercecheckoutshippingcountryselector, .wf-commerce-commercecheckoutcardnumber, .wf-commerce-commercecheckoutcardexpirationdate, .wf-commerce-commercecheckoutcardsecuritycode, .wf-commerce-commercecheckoutbillingfullname, .wf-commerce-commercecheckoutbillingstreetaddress, .wf-commerce-commercecheckoutbillingstreetaddressoptional, .wf-commerce-commercecheckoutbillingcity, .wf-commerce-commercecheckoutbillingstateprovince, .wf-commerce-commercecheckoutbillingzippostalcode, .wf-commerce-commercecheckoutbillingcountryselector {
    font-size: 16px;
  }
}
body {
  background-color: var(--background);
  font-family: var(--_font-family---secondary-font);
  color: var(--black);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  --_margin-padding---gap-xs: 20px;
  --_margin-padding---gap-m: 30px;
  --_margin-padding---gap-3xl: 120px;
  --_margin-padding---gap-4xl: 170px;
  --_margin-padding---gap-xxl: 100px;
  --_margin-padding---gap-xl: 80px;
  --_margin-padding---gap-l: 72px;
  --_margin-padding---gap-s: 24px;
  --_border-radius---border-l: 24px;
  --_border-radius---border-xl: 999px;
  --_border-radius---border-s: 16px;
  --_border-radius---border-m: 13px;
  --_font-family---secondary-font: Geist, sans-serif;
  --_font-family---primary-font: Anton, sans-serif;
  --_font-family---third-font: Arial, "Helvetica Neue", Helvetica, sans-serif;
  --_font-weight---medium: 500;
  --_font-weight---regular: 400;
  --_font-weight---bold: 700;
  --_letter-speacing---letter-speacing-xl: -2.4px;
  --_letter-speacing---letter-speacing-x: -2px;
  --_letter-speacing---letter-speacing-l: -.64px;
  --_letter-speacing---letter-speacing-m: -.16px;
  --_letter-speacing---letter-speacing-xxl: -6.4px;
  --_letter-speacing---letter-speacing-s: -.14px;
  --_line-height---line-height-3xl: 150%;
  --_line-height---line-height-m: 100%;
  --_line-height---line-height-l: 105%;
  --_line-height---line-height-x: 108%;
  --_line-height---line-height-xl: 110%;
  --_line-height---line-height-xxl: 112%;
  --_line-height---line-height-s: 80%;
  --_typography---medium: 16px;
  --_typography---h1: 110px;
  --_typography---h2: 100px;
  --_typography---h3: 64px;
  --_typography---h4: 48px;
  --_typography---h5: 40px;
  --_typography---h6: 24px;
  --_typography---regular: 14px;
  --_typography---dispaly-font: 160px;
  --_typography---font-zero: 0px;
  --background: #f7f3e9;
  --black: black;
  --dark-blood: #5c0404;
  --transparent: transparent;
  --dark-color: #212121;
  --white: white;
  --primary-color: #ff9348;
  --gray-color: #73726e;
  --white-10: #ffffff1a;
  text-decoration: none;
}
h1:where(:not([class*="heading-scale-"])), :where(.heading-scale-1) {
  font-family: var(--_font-family---primary-font);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
}
h2:where(:not([class*="heading-scale-"])), :where(.heading-scale-2) {
  font-family: var(--_font-family---primary-font);
  font-size: var(--_typography---h2);
  line-height: var(--_line-height---line-height-l);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-x);
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
}
h3:where(:not([class*="heading-scale-"])), :where(.heading-scale-3) {
  font-family: var(--_font-family---primary-font);
  font-size: var(--_typography---h3);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
}
h4:where(:not([class*="heading-scale-"])), :where(.heading-scale-4) {
  font-family: var(--_font-family---primary-font);
  font-size: var(--_typography---h4);
  line-height: var(--_line-height---line-height-x);
  font-weight: var(--_font-weight---regular);
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
}
h5:where(:not([class*="heading-scale-"])), :where(.heading-scale-5) {
  font-family: var(--_font-family---primary-font);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
}
h6:where(:not([class*="heading-scale-"])), :where(.heading-scale-6) {
  font-family: var(--_font-family---primary-font);
  font-size: var(--_typography---h6);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---regular);
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
}
p {
  color: var(--dark-blood);
  margin-bottom: 0;
}
a {
  color: var(--black);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---bold);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
  text-decoration: none;
  display: inline-block;
}
ul {
  margin-top: 0;
  margin-bottom: 10px;
  padding-left: 40px;
}
img {
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  display: inline-block;
}
.navbar {
  padding-top: var(--_margin-padding---gap-xs);
  padding-bottom: var(--_margin-padding---gap-xs);
  background-color: var(--background);
  position: absolute;
  inset: 0% 0% auto;
}
.navbar.white {
  background-color: var(--transparent);
  position: absolute;
}
.container {
  max-width: 1230px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
}
.container.h100 {
  height: 100%;
}
.container.w1360 {
  max-width: 1390px;
}
.nav-menu-wrap {
  grid-column-gap: var(--_margin-padding---gap-m);
  grid-row-gap: var(--_margin-padding---gap-m);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.nav-menu-link {
  color: var(--dark-color);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
  overflow: hidden;
}
.nav-menu-link.white {
  color: var(--white);
}
.nav-menu-line {
  background-color: var(--dark-color);
  width: 100%;
  height: 2px;
}
.nav-menu-line.white {
  background-color: var(--white);
}
.nav-menu-wrapper {
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.section {
  padding-top: var(--_margin-padding---gap-3xl);
  padding-bottom: var(--_margin-padding---gap-3xl);
}
.section.style {
  padding-top: var(--_margin-padding---gap-4xl);
  padding-bottom: var(--_margin-padding---gap-xxl);
}
.section.footer {
  padding-top: var(--_margin-padding---gap-xl);
  background-color: var(--dark-color);
  padding-bottom: 0;
  overflow: hidden;
}
.section.gallery {
  padding-top: var(--_margin-padding---gap-4xl);
  padding-bottom: var(--_margin-padding---gap-xxl);
}
.section.faq {
  padding-top: var(--_margin-padding---gap-xxl);
  padding-bottom: var(--_margin-padding---gap-xxl);
}
.section.inner {
  background-color: var(--dark-color);
  padding-top: 260px;
  padding-bottom: 190px;
}
.section.contact {
  padding-top: var(--_margin-padding---gap-xxl);
  padding-bottom: var(--_margin-padding---gap-xxl);
}
.section.events {
  padding-top: var(--_margin-padding---gap-xxl);
}
.section._404 {
  background-image: url('../images/404.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  padding-top: 289px;
  padding-bottom: 303px;
}
.section.blog-single, .section.event-single, .section.checkout {
  padding-top: var(--_margin-padding---gap-4xl);
  padding-bottom: var(--_margin-padding---gap-xxl);
}
.section.hero {
  height: 100vh;
  padding-bottom: var(--_margin-padding---gap-xl);
  background-color: var(--black);
  background-image: url('../images/Hero-BG.webp');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
}
.section.about {
  padding-top: 130px;
  padding-bottom: var(--_margin-padding---gap-xl);
  background-color: var(--dark-color);
}
.section.shop-v2 {
  overflow: clip;
}
.section.officer {
  padding-bottom: 0;
}
.section.choose {
  padding-top: 0;
  padding-bottom: 40px;
}
.section.blog-v2 {
  padding-bottom: 96px;
}
.section.cta {
  padding-bottom: var(--_margin-padding---gap-l);
}
.section.gear, .section.trips {
  overflow: hidden;
}
.section.footer-v1 {
  background-color: var(--dark-color);
  background-image: url('../images/Footer-BG.webp');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: 100%;
  padding-top: 40px;
  padding-bottom: 0;
}
.section.shop-single {
  padding-top: var(--_margin-padding---gap-4xl);
  padding-bottom: var(--_margin-padding---gap-xxl);
}
.section.more-shop {
  padding-top: var(--_margin-padding---gap-xxl);
}
.section.investor {
  padding-top: 190px;
  padding-bottom: var(--_margin-padding---gap-xxl);
}
.style-top-wrap {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.style-wrap {
  margin-top: var(--_margin-padding---gap-xxl);
}
.style-title {
  color: var(--dark-color);
  text-align: center;
}
.style-flex-wrap {
  grid-column-gap: var(--_margin-padding---gap-l);
  grid-row-gap: var(--_margin-padding---gap-l);
  flex-flow: column;
  display: flex;
}
.style-single-wrap {
  grid-column-gap: var(--_margin-padding---gap-m);
  grid-row-gap: var(--_margin-padding---gap-m);
  flex-flow: column;
  display: flex;
}
.style-single-title {
  color: var(--dark-color);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.typography-wrap {
  padding: var(--_margin-padding---gap-m);
  grid-column-gap: var(--_margin-padding---gap-m);
  grid-row-gap: var(--_margin-padding---gap-m);
  border: 1px solid var(--white);
  border-radius: var(--_border-radius---border-l);
  background-color: var(--white);
  flex-flow: column;
  display: flex;
}
.typography-single-wrap {
  grid-column-gap: 184px;
  grid-row-gap: 184px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.typography-left-wrap {
  padding: 18px var(--_margin-padding---gap-xs);
  background-color: var(--dark-blood);
  color: var(--white);
  border-radius: 10px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}
.typography-left-text {
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.typography-left-text.fs-24 {
  font-size: var(--_typography---h6);
  letter-spacing: 0;
}
.typography-left-text.fs-16 {
  font-size: var(--_typography---medium);
  letter-spacing: 0;
}
.typography-right-wrap {
  min-height: 80px;
  padding: 18px var(--_margin-padding---gap-xs);
  background-color: var(--background);
  color: var(--dark-blood);
  border-radius: 10px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}
.style-color-grid-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.style-colo-wrap {
  border-radius: var(--_border-radius---border-l);
  background-color: var(--primary-color);
  height: 330px;
}
.style-colo-wrap._02 {
  background-color: var(--dark-color);
}
.style-colo-wrap._03 {
  background-color: var(--white);
}
.style-colo-wrap._04 {
  background-color: var(--dark-blood);
}
.style-colo-wrap._05 {
  border: 1px solid var(--dark-color);
  background-color: var(--background);
}
.style-colo-wrap._06 {
  background-color: var(--gray-color);
}
.style-button-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  display: flex;
}
.primary-button {
  font-family: var(--_font-family---secondary-font);
  color: var(--dark-color);
  font-weight: var(--_font-weight---bold);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.primary-btn-text-wrapper {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--primary-color);
  justify-content: flex-start;
  align-items: center;
  padding: 12px 24px;
}
.primary-btn-text-wrapper.white {
  background-color: var(--background);
}
.primary-btn-text-wrap {
  height: 24px;
  padding-right: 2px;
  overflow: hidden;
}
.primary-btn-icon-wrap {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--primary-color);
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  display: flex;
  position: relative;
  overflow: hidden;
  transform: rotate(-45deg);
}
.primary-btn-icon-wrap.white {
  background-color: var(--background);
}
.primary-btn-icon {
  width: 24px;
  height: 24px;
}
.primary-btn-icon._02 {
  position: absolute;
}
.footer-top-wrap {
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.footer-menu-wrap {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.footer-contact-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  display: flex;
}
.footer-menu-link {
  color: var(--white);
  font-size: var(--_typography---medium);
  transition: color .4s;
}
.footer-menu-link:hover, .footer-menu-link[aria-current="page"], .footer-menu-link.is-active {
  color: var(--primary-color);
}
.footer-menu-slash {
  color: var(--gray-color);
  font-weight: var(--_font-weight---bold);
}
.footer-contact-single-wrap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.footer-contact-single-link {
  color: var(--background);
  transition: color .3s;
}
.footer-contact-single-link:hover {
  color: var(--primary-color);
}
.footer-contact-single-title {
  color: var(--gray-color);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.footer-wrap {
  justify-content: space-between;
  align-items: center;
  margin-top: 150px;
  display: flex;
}
.footer-left-wrap {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.social-link {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--background);
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  transition: all .4s;
  display: flex;
}
.social-link:hover {
  background-color: var(--primary-color);
  transform: translate(0, -10px);
}
.social-icon {
  width: 24px;
  height: 24px;
}
.copyright-text {
  color: var(--gray-color);
  font-size: var(--_typography---regular);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  letter-spacing: -.14px;
  text-transform: uppercase;
}
.footer-logo-wrap {
  margin-top: var(--_margin-padding---gap-m);
  margin-left: auto;
  margin-right: auto;
}
.footer-logo {
  width: 100%;
}
.license-top-wrap {
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.license-wrap {
  margin-top: var(--_margin-padding---gap-xxl);
  grid-column-gap: 64px;
  grid-row-gap: 64px;
  flex-flow: column;
  display: flex;
}
.license-details {
  max-width: 570px;
  color: var(--gray-color);
  font-weight: var(--_font-weight---medium);
  text-align: center;
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.license-flex-wrap {
  grid-column-gap: var(--_margin-padding---gap-m);
  grid-row-gap: var(--_margin-padding---gap-m);
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.license-left-wrap {
  flex: none;
}
.license-right-wrap {
  grid-column-gap: var(--_margin-padding---gap-m);
  grid-row-gap: var(--_margin-padding---gap-m);
  flex-flow: column;
  width: 100%;
  max-width: 785px;
  display: flex;
}
.license-single-title {
  color: var(--dark-color);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.license-single-details {
  color: var(--gray-color);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.license-single-link {
  color: var(--dark-blood);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  display: inline-block;
}
.license-image {
  border-radius: var(--_border-radius---border-l);
  width: 100%;
}
.license-icon-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.license-img-grid-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.changelog-wrapper {
  max-width: 996px;
  margin-left: auto;
  margin-right: auto;
}
.changelog-wrap {
  margin-top: var(--_margin-padding---gap-xxl);
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  flex-flow: column;
  display: flex;
}
.changelog-single-wrap {
  border-radius: var(--_border-radius---border-l);
  background-color: var(--white);
  flex-flow: column;
  padding: 48px;
  display: flex;
}
.changelog-title {
  color: var(--black);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.changelog-list {
  margin-top: var(--_margin-padding---gap-s);
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  font-family: var(--_font-family---secondary-font);
  color: var(--gray-color);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
  flex-flow: column;
  margin-bottom: 40px;
  padding-left: 25px;
  display: flex;
}
.changelog-date {
  color: var(--black);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---bold);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.gallery-top-wrap {
  z-index: 1;
  max-width: 646px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
.gallery-wrap {
  margin-top: -290px;
}
.gallery-img-wrap {
  border-radius: var(--_border-radius---border-l);
  position: relative;
  overflow: hidden;
}
.gallery-image {
  width: 100%;
  height: 100%;
}
.galler-dubble-grid {
  margin-top: var(--_margin-padding---gap-s);
  margin-bottom: var(--_margin-padding---gap-s);
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.gallery-single-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  flex-flow: column;
  display: flex;
}
.gallery-last-grid-wrap {
  margin-top: var(--_margin-padding---gap-s);
  margin-bottom: var(--_margin-padding---gap-s);
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1.64fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.gallery-title {
  font-size: var(--_typography---dispaly-font);
  line-height: var(--_line-height---line-height-m);
  text-align: center;
  letter-spacing: var(--_letter-speacing---letter-speacing-xxl);
}
.yellow-color {
  color: var(--primary-color);
  display: inline;
}
.yellow-color.inline {
  display: inline;
}
.inner-top-wrap {
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.inner-top-text {
  color: var(--background);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.inner-title {
  color: var(--background);
  text-align: center;
}
.faq-wrapper {
  max-width: 996px;
  margin-left: auto;
  margin-right: auto;
}
.faq-icon {
  width: 100%;
}
.faq-icon._02 {
  position: absolute;
}
.faq-tabs-menu {
  grid-column-gap: 22px;
  grid-row-gap: 22px;
  flex-flow: column;
  display: flex;
}
.display-none {
  display: none;
}
.faq-tabs-link {
  border-radius: var(--_border-radius---border-s);
  background-color: var(--white);
  padding: 20px;
}
.faq-tabs-link[aria-current="page"], .faq-tabs-link.is-active {
  background-color: var(--white);
}
.faq-question-wrap {
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.faq-icon-wrap {
  aspect-ratio: 1;
  display: flex;
  position: relative;
}
.faq-question {
  font-family: var(--_font-family---primary-font);
  color: var(--dark-color);
  font-size: var(--_typography---h6);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: 0;
  text-transform: uppercase;
}
.faq-answer {
  max-width: 770px;
  color: var(--gray-color);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
  margin-top: 6px;
}
.faq-answer-wrap {
  overflow: hidden;
}
.contact-top-wrap {
  grid-column-gap: 132px;
  grid-row-gap: 132px;
  display: flex;
}
.contact-left-wrap {
  max-width: 480px;
}
.contact-right-wrap {
  border-radius: var(--_border-radius---border-l);
  background-color: var(--white);
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 588px;
  padding: 30px;
  display: flex;
  overflow: hidden;
}
.contact-title {
  color: var(--dark-color);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
}
.blood-color {
  color: var(--dark-blood);
  display: inline;
}
.contact-form-block {
  width: 100%;
  margin-bottom: 0;
}
.contact-form {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.contact-text-field {
  border: 1px solid var(--gray-color);
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--transparent);
  height: auto;
  font-family: var(--_font-family---third-font);
  color: var(--black);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  margin-bottom: 0;
  padding: 16px;
}
.contact-text-field:focus {
  border-color: var(--primary-color);
}
.contact-text-field::placeholder {
  color: var(--dark-color);
}
.contact-all-wrap {
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  flex-flow: column;
  width: 100%;
  display: flex;
}
.contact-single-wrap {
  justify-content: flex-start;
  align-items: center;
  width: 100%;
}
.contact-single-wrapper {
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  display: flex;
}
.contact-text-area {
  border: 1px solid var(--gray-color);
  border-radius: var(--_border-radius---border-s);
  background-color: var(--transparent);
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 140px;
  min-height: 140px;
  font-family: var(--_font-family---third-font);
  color: var(--black);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  margin-bottom: 0;
  padding: 16px;
}
.contact-text-area:focus {
  border-color: var(--primary-color);
}
.contact-text-area::placeholder {
  color: var(--dark-color);
}
.contact-submit-button {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--primary-color);
  color: var(--dark-color);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---bold);
  padding: 12px 24px;
}
.contact-submit-button._01 {
  transition: color .4s, background-color .4s;
}
.contact-submit-button._01:hover {
  background-color: var(--dark-blood);
  color: var(--white);
}
.contact-submit-btn-wrap {
  margin-top: var(--_typography---h5);
  cursor: pointer;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.contact-icon-wrap {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--primary-color);
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  display: flex;
  transform: rotate(-45deg);
}
.contact-icon {
  width: 32px;
  height: 32px;
}
.success-message {
  border-radius: var(--_border-radius---border-s);
  background-color: var(--primary-color);
}
.error-message {
  border-radius: var(--_border-radius---border-s);
  background-color: var(--dark-blood);
  color: var(--white);
  text-align: center;
  margin-top: 15px;
  padding: 20px;
}
.contact-wrap {
  margin-top: var(--_margin-padding---gap-xxl);
}
.touch-title-wrap {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  overflow: hidden;
}
.touch-title {
  color: var(--dark-color);
  text-align: center;
}
.touch-grid-wrap {
  margin-top: var(--_margin-padding---gap-l);
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.touch-single-wrap {
  padding: var(--_margin-padding---gap-s);
  border-radius: var(--_border-radius---border-l);
  background-color: var(--white);
}
.touch-icon-wrap {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--dark-color);
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  display: flex;
}
.touch-icon {
  width: 20px;
  height: 20px;
}
.touch-single-title {
  color: var(--gray-color);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
  margin-top: 78px;
  margin-bottom: 6px;
}
.touch-single-link {
  font-family: var(--_font-family---primary-font);
  color: var(--dark-blood);
  font-size: var(--_typography---h6);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: 0;
  text-transform: uppercase;
}
.touch-map-wrap {
  width: 100%;
  margin-top: var(--_margin-padding---gap-s);
  border-radius: var(--_border-radius---border-l);
  position: relative;
  overflow: hidden;
}
.touch-map {
  width: 100%;
}
.faq-v1-top-wrap {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  overflow: hidden;
}
.faq-v1-wrap {
  margin-top: var(--_margin-padding---gap-l);
}
.faq-title {
  color: var(--dark-color);
}
.blog-grid-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1.262fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.blog-image-wrap {
  border-radius: var(--_border-radius---border-s);
  display: flex;
  position: relative;
  overflow: hidden;
}
.blog-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.blog-image._01 {
  filter: blur(7px);
}
.blog-image._02 {
  border-radius: var(--_border-radius---border-s);
  position: absolute;
}
.blog-right-wrap {
  padding: var(--_margin-padding---gap-m);
  border-radius: var(--_border-radius---border-s);
  background-color: var(--white);
  flex-flow: column;
  justify-content: space-between;
  display: flex;
  overflow: hidden;
}
.blog-right-top-wrap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: flex;
}
.blog-right-btm-wrap {
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.blog-card-date {
  color: var(--dark-blood);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.blog-card-title {
  font-family: var(--_font-family---primary-font);
  color: var(--dark-color);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
  text-transform: uppercase;
  transition: color .4s;
}
.blog-card-title:hover {
  color: var(--dark-blood);
}
.blog-card-details {
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.shop-grid-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: 40px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.shop-card-wrap {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}
.shop-image-link-wrap {
  border-radius: var(--_border-radius---border-s);
  display: flex;
  position: relative;
  overflow: hidden;
}
.shop-icon-wrap {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--dark-blood);
  justify-content: center;
  align-items: center;
  width: 70px;
  height: 70px;
  display: flex;
  position: absolute;
  inset: auto 20px 20px auto;
}
.shop-icon-img {
  width: 30px;
  height: 30px;
}
.shop-card-title {
  font-family: var(--_font-family---primary-font);
  color: var(--dark-color);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
  text-transform: uppercase;
  transition: all .3s;
}
.shop-card-title:hover {
  color: var(--dark-blood);
}
.shop-details-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}
.shop-card-price {
  font-family: var(--_font-family---primary-font);
  color: var(--dark-blood);
  font-size: var(--_typography---h6);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---regular);
  text-transform: uppercase;
}
.events-grid-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.event-all-link-wrap {
  display: flex;
  position: relative;
  overflow: hidden;
}
.event-card-img {
  width: 100%;
}
.event-img-wrap {
  border-radius: var(--_border-radius---border-s);
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
  overflow: hidden;
}
.event-bg-wrap {
  background-image: linear-gradient(#1010104d, #1010104d);
  position: absolute;
  inset: 0%;
}
.event-btn-wrap {
  position: absolute;
}
.event-details-wrap {
  flex-flow: column;
  justify-content: space-between;
  display: flex;
  position: absolute;
  inset: 24px 24px 36px;
}
.event-details-text {
  color: var(--white);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.event-card-title-wrap {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}
.event-card-title {
  font-family: var(--_font-family---primary-font);
  color: var(--background);
  font-size: var(--_typography---h6);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: 0;
  text-transform: uppercase;
}
.event-date-wrapper {
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.event-date-wrap {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.event-date-text {
  color: var(--background);
  font-size: var(--_typography---regular);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  letter-spacing: 0;
  text-transform: uppercase;
}
._404-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
._404-title {
  font-family: var(--_font-family---primary-font);
  color: var(--dark-color);
  font-size: var(--_typography---dispaly-font);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-xxl);
}
.password-form-block {
  background-image: url('../images/Icon.svg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: auto;
  justify-content: center;
  align-items: center;
  margin-bottom: 0;
  padding-top: 260px;
  padding-bottom: 245px;
  display: flex;
}
.password-form {
  max-width: 520px;
  padding-left: 15px;
  padding-right: 15px;
}
.password-title {
  color: var(--dark-color);
  text-align: center;
}
.password-btm-wrap {
  margin-top: var(--_margin-padding---gap-xs);
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  display: flex;
}
.password-text-field {
  border: 1px solid var(--gray-color);
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--background);
  height: auto;
  font-family: var(--_font-family---third-font);
  color: var(--dark-color);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  margin-bottom: 0;
  padding: 12px 16px;
}
.password-text-field:focus {
  border-color: var(--primary-color);
}
.password-text-field::placeholder {
  color: var(--dark-color);
}
.blog-cl-flex-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  flex-flow: column;
  display: flex;
}
.blog-single-title {
  max-width: 1120px;
}
.blog-author-wrapper {
  margin-top: var(--_margin-padding---gap-l);
  margin-bottom: var(--_margin-padding---gap-xs);
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.blog-author-wrap {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.blog-author-name {
  font-family: var(--_font-family---primary-font);
  color: var(--dark-blood);
  font-size: var(--_typography---h6);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---regular);
  text-transform: uppercase;
}
.blog-time-wrap {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.blog-time-wrap._01 {
  justify-content: flex-start;
  align-items: flex-end;
}
.blog-time-title {
  color: var(--gray-color);
  text-align: center;
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.blog-time-text {
  color: var(--dark-blood);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.blog-banner-image-wrap {
  border-radius: var(--_border-radius---border-s);
  position: relative;
  overflow: hidden;
}
.blog-banner-image {
  object-fit: cover;
  width: 100%;
  height: 668px;
}
.blog-single-flex-wrap {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.blog-single-left-wrap {
  grid-column-gap: var(--_margin-padding---gap-m);
  grid-row-gap: var(--_margin-padding---gap-m);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 792px;
  display: flex;
}
.blog-single-right-wrap {
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  flex-flow: column;
  margin-top: 72px;
  display: flex;
}
.blog-rich-text {
  margin-top: 42px;
}
.blog-rich-text h5 {
  margin-top: var(--_margin-padding---gap-m);
  margin-bottom: 14px;
}
.blog-rich-text p {
  color: var(--gray-color);
  text-transform: uppercase;
}
.blog-rich-text ul {
  margin-top: var(--_margin-padding---gap-s);
  margin-bottom: var(--_margin-padding---gap-s);
  color: var(--gray-color);
  text-transform: uppercase;
  padding-left: 24px;
}
.blog-social-title {
  color: var(--dark-blood);
  font-weight: var(--_font-weight---bold);
  text-align: right;
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.blog-social-wrap {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.blog-social-icon {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--white);
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  transition: transform .4s;
  display: flex;
}
.blog-social-icon:hover {
  transform: translate(0, -10px);
}
.blog-rich-grid {
  margin-top: var(--_margin-padding---gap-m);
  margin-bottom: var(--_margin-padding---gap-m);
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1.64fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.blog-left-item-wrap {
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.blog-left-item-title {
  color: var(--dark-color);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.blog-left-item-details {
  color: var(--gray-color);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.related-top-wrap {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  overflow: hidden;
}
.related-wrap {
  margin-top: var(--_margin-padding---gap-l);
}
.event-single-top-wrap {
  border-radius: var(--_border-radius---border-s);
  justify-content: center;
  align-items: center;
  height: 600px;
  display: flex;
  position: relative;
  overflow: hidden;
}
.event-banner-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.event-banner-bg {
  background-image: linear-gradient(#0003, #0003);
  position: absolute;
  inset: 0%;
}
.event-single-title {
  color: var(--background);
  position: absolute;
}
.event-flex-wrap {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.event-left-wrap {
  width: 100%;
  max-width: 792px;
  margin-top: 42px;
}
.event-right-wrap {
  width: 100%;
  max-width: 276px;
  padding: var(--_margin-padding---gap-xs);
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  border-radius: var(--_border-radius---border-s);
  background-color: var(--white);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 72px;
  display: flex;
  position: sticky;
  top: 120px;
}
.event-top-rich h5 {
  margin-top: var(--_margin-padding---gap-m);
  color: var(--dark-color);
  margin-bottom: 14px;
}
.event-top-rich p {
  color: var(--gray-color);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.event-top-rich ul {
  color: var(--gray-color);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
  margin-bottom: 0;
  padding-left: 25px;
}
.event-rich-grid {
  margin-top: var(--_margin-padding---gap-m);
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.event-rich-image-wrap {
  border-radius: var(--_border-radius---border-s);
  position: relative;
  overflow: hidden;
}
.event-item-wrapper {
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  flex-flow: column;
  width: 100%;
  display: flex;
}
.event-item-wrap {
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.event-item-title {
  color: var(--gray-color);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.event-item-details {
  color: var(--dark-blood);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.event-single-line {
  background-color: #2121211a;
  width: 100%;
  height: 1px;
}
.checkout-form {
  background-color: var(--transparent);
  min-height: auto;
  padding: 0;
}
.block-header {
  border-color: var(--gray-color);
  background-color: var(--transparent);
  padding-top: 20px;
  padding-bottom: 20px;
}
.checkout-title {
  font-family: var(--_font-family---primary-font);
  color: var(--dark-color);
  font-size: var(--_typography---h4);
  line-height: var(--_line-height---line-height-xxl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
}
.checkout-email-field {
  border-color: var(--gray-color);
  background-color: var(--transparent);
  height: 45px;
}
.checkout-email-field:focus, .checkout-email-field.is-focus {
  border-color: var(--primary-color);
}
.checkbox {
  margin-top: 0;
}
.checkbox-label {
  margin-bottom: 0;
}
.checkout-submit-button {
  background-color: var(--dark-color);
  color: var(--white);
  font-weight: var(--_font-weight---medium);
  text-transform: uppercase;
  padding-top: 15px;
  padding-bottom: 15px;
  transition: background-color .4s;
}
.checkout-submit-button:hover {
  background-color: var(--primary-color);
}
.checkout-right-wrap {
  flex-basis: 380px;
  top: 140px;
}
.hero-wrapper {
  height: 100%;
}
.hero-wrap {
  flex-flow: row;
  justify-content: space-between;
  align-items: flex-end;
  height: 100%;
  display: flex;
}
.hero-title-wrap {
  width: 100%;
  max-width: 761px;
  overflow: hidden;
}
.hero-title {
  color: var(--background);
}
.about-v1-wrap {
  margin-top: var(--_margin-padding---gap-l);
  grid-column-gap: var(--_margin-padding---gap-m);
  grid-row-gap: var(--_margin-padding---gap-m);
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.about-v1-title {
  color: var(--dark-blood);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.about-v1-left-wrap {
  grid-column-gap: var(--_margin-padding---gap-m);
  grid-row-gap: var(--_margin-padding---gap-m);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 810px;
  display: flex;
}
.about-v1-right-wrap {
  border-radius: 12px;
  width: 100%;
  max-width: 337px;
  position: relative;
  overflow: hidden;
}
.about-v1-image {
  width: 100%;
}
.about-v1-details {
  color: var(--dark-color);
  font-size: var(--_typography---h4);
  line-height: var(--_line-height---line-height-x);
  font-weight: var(--_font-weight---regular);
  letter-spacing: 0;
}
.about-top-wrap {
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  max-width: 746px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}
.about-wrap {
  margin-top: 50px;
  overflow: hidden;
}
.about-image-wrap {
  background-image: url('../images/About-BG-Image.svg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: auto;
  width: 100%;
  max-width: 400px;
  height: 480px;
  position: relative;
  overflow: hidden;
}
.about-image {
  border-radius: var(--_border-radius---border-s);
  width: 100%;
  height: 460px;
}
.about-image-text {
  color: var(--white);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.about-title {
  color: var(--white);
  text-align: center;
}
.feature-top-wrap {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.feature-wrap {
  margin-top: var(--_margin-padding---gap-l);
}
.feature-top-text {
  color: var(--dark-blood);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.feature-flex-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}
.feature-single-wrap {
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}
.feature-single-title-wrap {
  z-index: 1;
  flex-flow: column;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
}
.feature-single-title {
  z-index: 1;
  color: var(--gray-color);
  text-align: center;
  position: relative;
}
.feature-single-bg {
  border-radius: var(--_border-radius---border-s);
  background-color: var(--dark-blood);
  width: 100%;
  height: 0%;
  position: absolute;
}
.feature-single-image {
  z-index: 2;
  opacity: 0;
  border-radius: 20px;
  width: 100%;
  max-width: 220px;
  height: 280px;
  min-height: 280px;
  position: absolute;
}
.shop-v2-top-wrap {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.shop-v2-title {
  max-width: 820px;
  color: var(--dark-color);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
}
.shop-height-wrap {
  height: 200vh;
  margin-top: 48px;
}
.shop-sticky-wrap {
  position: sticky;
  top: 100px;
}
.shop-v2-flex-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  display: flex;
}
.shop-v2-item-wrap {
  border-radius: var(--_border-radius---border-s);
  flex: none;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 580px;
  display: flex;
  position: relative;
  overflow: hidden;
}
.shop-v2-image {
  width: 100%;
}
.shop-v2-item-details-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  text-align: center;
  flex-flow: column;
  width: 100%;
  max-width: 200px;
  display: flex;
  position: absolute;
}
.shop-single-item-title {
  color: var(--background);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  font-weight: var(--_font-weight---regular);
  text-align: center;
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.shop-single-item-details {
  color: var(--background);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.officer-top-text {
  color: var(--dark-blood);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.officer-wrap {
  margin-top: var(--_margin-padding---gap-l);
  grid-column-gap: var(--_margin-padding---gap-m);
  grid-row-gap: var(--_margin-padding---gap-m);
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.officer-image-wrap {
  border-radius: 12px;
  width: 100%;
  max-width: 337px;
  position: relative;
  overflow: hidden;
}
.officer-image {
  width: 100%;
}
.officer-details-wrap {
  width: 100%;
  max-width: 763px;
}
.officer-details {
  color: var(--dark-color);
  font-size: var(--_typography---h4);
  line-height: var(--_line-height---line-height-x);
  font-weight: var(--_font-weight---regular);
}
.choose-wrapper {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
}
.choose-bg-wrap {
  max-width: 1360px;
  padding-top: var(--_margin-padding---gap-xxl);
  padding-bottom: var(--_margin-padding---gap-xxl);
  border-radius: var(--_border-radius---border-s);
  background-color: var(--dark-blood);
  margin-left: auto;
  margin-right: auto;
}
.choose-top-wrap {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  overflow: hidden;
}
.choose-title {
  color: var(--background);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  text-align: center;
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
}
.choose-wrap {
  margin-top: 60px;
}
.choose-grid-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.choose-single-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  border-radius: var(--_border-radius---border-s);
  background-color: var(--background);
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  padding-top: 30px;
  padding-left: 30px;
  padding-right: 30px;
  display: flex;
}
.choose-single-title {
  color: var(--dark-blood);
  font-size: var(--_typography---h4);
  line-height: var(--_line-height---line-height-x);
  font-weight: var(--_font-weight---regular);
}
.choose-single-title._01 {
  max-width: 280px;
}
.choose-single-icon {
  width: 100%;
  max-width: 200px;
}
.choose-icon-wrap {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
}
.testimonial-top-wrap {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.testimonial-sub-title {
  color: var(--dark-blood);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
  flex: none;
}
.testimonial-sub-title.mobile-on {
  display: none;
}
.testimonial-title {
  max-width: 935px;
  color: var(--dark-color);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  text-align: right;
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
}
.testimonial-wrap {
  margin-top: 56px;
  margin-bottom: var(--_margin-padding---gap-xl);
}
.testimonial-slider {
  background-color: var(--transparent);
  height: auto;
}
.testimonial-left-arrow {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--primary-color);
  justify-content: center;
  align-items: center;
  width: 56px;
  height: 56px;
  transition: transform .4s;
  display: flex;
  inset: auto auto 80px 0%;
}
.testimonial-left-arrow:hover {
  transform: scale(.9);
}
.testimonial-left-arrow._01 {
  inset: -130px 80px auto auto;
}
.testimonial-left-arrow.trip {
  inset: -120px auto auto 0%;
}
.testimonial-left-arrow._02 {
  z-index: 2;
  inset: auto 0% 0% -20%;
}
.testimonial-right-arrow {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--primary-color);
  justify-content: center;
  align-items: center;
  width: 56px;
  height: 56px;
  transition: transform .4s;
  display: flex;
  inset: auto auto 80px 70px;
}
.testimonial-right-arrow:hover {
  transform: scale(.9);
}
.testimonial-right-arrow._02 {
  inset: -130px 0% auto auto;
}
.testimonial-right-arrow.trip {
  inset: -120px auto auto 70px;
}
.testimonial-right-arrow._01 {
  inset: auto 0% 0% 20%;
}
.testimonial-single-slider {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.testimonial-details-wrap {
  width: 100%;
  max-width: 757px;
  margin-top: 70px;
}
.testimonial-author-wrap {
  border-radius: var(--_border-radius---border-l);
  width: 100%;
  max-width: 424px;
  overflow: hidden;
}
.testimonial-author-img {
  width: 100%;
}
.testimonial-details {
  color: var(--dark-color);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.testimonial-btm-wrap {
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.testimonial-btm-line {
  background-color: var(--dark-color);
  width: 100%;
  max-width: 48%;
  height: 2px;
}
.team-top-wrap {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.team-wrap {
  margin-top: 48px;
}
.team-title {
  width: 100%;
  max-width: 766px;
}
.team-grid-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.team-single-wrap {
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  border-radius: var(--_border-radius---border-l);
  background-color: var(--white);
  flex-flow: column;
  padding: 10px 10px 20px;
  display: flex;
}
.team-image-wrap {
  border-radius: var(--_margin-padding---gap-xs);
  position: relative;
  overflow: hidden;
}
.team-image {
  object-fit: cover;
  width: 100%;
  height: 340px;
  transition: all .4s;
}
.team-image:hover {
  filter: grayscale();
  transform: scale(1.1);
}
.team-details-wrap {
  justify-content: space-between;
  align-items: center;
  margin-left: 10px;
  margin-right: 10px;
  display: flex;
}
.team-author-wrap {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.team-author-name {
  font-family: var(--_font-family---primary-font);
  color: var(--dark-blood);
  font-size: var(--_typography---h6);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  text-transform: uppercase;
}
.team-author-pst {
  color: var(--gray-color);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---bold);
}
.team-single-link-icon {
  width: 32px;
}
.blog-v2-top-wrap {
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}
.blog-v2-wrap {
  margin-top: var(--_margin-padding---gap-l);
}
.blog-v2-title {
  width: 100%;
  max-width: 800px;
  color: var(--dark-color);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
}
.blog-v2-right-wrap {
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-end;
  display: flex;
}
.cta-wrapper {
  max-width: 1144px;
}
.cta-title-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.cta-title {
  color: var(--dark-color);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
  margin-right: 10px;
}
.cta-btm-title-wrap {
  justify-content: space-between;
  align-items: center;
  max-width: 850px;
  display: flex;
}
.cta-blood-title {
  color: var(--dark-blood);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
}
.cta-icon-wrap {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--dark-blood);
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100px;
  display: flex;
}
.cta-icon {
  width: 44px;
  height: 44px;
}
.cta-details {
  width: 100%;
  max-width: 280px;
  color: var(--gray-color);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
  margin-top: 20px;
  margin-left: auto;
  margin-right: 205px;
}
.trust-top-wrap {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.trust-title {
  width: 100%;
  max-width: 433px;
  color: var(--dark-color);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  text-align: right;
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
}
.trusted-wrap {
  margin-top: var(--_margin-padding---gap-xxl);
}
.trusted-grid-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: flex;
}
.work-v2-card {
  border-radius: var(--_border-radius---border-s);
  background-color: var(--white);
  width: 100%;
  max-width: 384px;
  padding: 24px;
  position: relative;
  overflow: hidden;
}
.work-v2-all-card {
  z-index: 1;
  position: relative;
}
.work-v2-icon-wrap {
  flex-flow: column;
  width: 48px;
  height: 48px;
  display: inline-flex;
  overflow: hidden;
}
.work-v2-icon {
  width: 100%;
}
.work-v2-single-title {
  color: var(--dark-color);
  margin-top: 240px;
  margin-bottom: 12px;
}
.work-v2-overly-wrap {
  background-color: var(--dark-blood);
  height: 0%;
  position: absolute;
  inset: auto 0% 0%;
}
.work-v2-card-wrap._01 {
  margin-top: -280px;
}
.work-v2-card-wrap._02 {
  margin-top: -140px;
}
.trust-btn-wrap {
  z-index: 1;
  margin-top: -48px;
  position: relative;
}
.discover-top-wrap {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.discover-title {
  max-width: 842px;
  color: var(--dark-color);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  text-align: center;
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
}
.discover-wrap {
  margin-top: 48px;
}
.fast-top-wrap {
  grid-column-gap: var(--_margin-padding---gap-m);
  grid-row-gap: var(--_margin-padding---gap-m);
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.fast-title {
  width: 100%;
  max-width: 700px;
  color: var(--dark-color);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
}
.fast-details {
  width: 100%;
  max-width: 304px;
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.fast-wrap {
  margin-top: 48px;
}
.fast-grid-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  min-height: 600px;
  display: grid;
}
.fast-single-wrap {
  grid-column-gap: var(--_margin-padding---gap-s);
  grid-row-gap: var(--_margin-padding---gap-s);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.fast-image-wrap {
  border-radius: var(--_border-radius---border-s);
  width: 100%;
  height: 428px;
  position: relative;
  overflow: hidden;
}
.fast-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.fast-number {
  color: var(--black);
  font-size: var(--_typography---h4);
  line-height: var(--_line-height---line-height-x);
  font-weight: var(--_font-weight---regular);
}
.fast-number.white {
  color: var(--background);
  position: absolute;
  inset: 24px auto auto 24px;
}
.fast-number.black {
  background-color: var(--background);
}
.gear-top-wrap {
  grid-column-gap: var(--_margin-padding---gap-m);
  grid-row-gap: var(--_margin-padding---gap-m);
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.gear-wrap {
  margin-top: 36px;
}
.gear-title {
  width: 100%;
  max-width: 800px;
  color: var(--dark-color);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
}
.gear-slider {
  background-color: var(--transparent);
  height: auto;
}
.gear-slider-mask {
  max-width: 384px;
  overflow: visible;
}
.gear-slide {
  margin-right: var(--_margin-padding---gap-s);
}
.gear-single-slide {
  border-radius: var(--_border-radius---border-s);
  position: relative;
  overflow: hidden;
}
.gear-single-image {
  width: 100%;
}
.gear-single-details-wrap {
  grid-column-gap: var(--_border-radius---border-s);
  grid-row-gap: var(--_border-radius---border-s);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
  position: absolute;
  inset: auto 24px 36px;
}
.gear-single-title {
  font-family: var(--_font-family---primary-font);
  color: var(--background);
  font-size: var(--_typography---h6);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  text-transform: uppercase;
}
.gear-single-details {
  color: var(--background);
  font-size: var(--_typography---regular);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  text-transform: uppercase;
}
.trips-top-wrap {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.trips-wrap {
  margin-top: 48px;
}
.trips-title {
  width: 100%;
  max-width: 700px;
  color: var(--dark-color);
  font-size: var(--_typography---h1);
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
}
.trips-slider {
  background-color: var(--transparent);
  height: auto;
}
.trips-slider-mask {
  max-width: 384px;
  overflow: visible;
}
.trips-single-slide {
  margin-right: var(--_margin-padding---gap-s);
}
.footer-v1-top-wrap {
  justify-content: space-between;
  align-items: flex-end;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}
.footer-v1-arrow-wrap {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--primary-color);
  justify-content: center;
  align-items: center;
  width: 222px;
  height: 222px;
  margin-bottom: 20px;
  display: flex;
}
.footer-v1-arrow-icon {
  width: 48px;
  height: 48px;
}
.footer-v1-image {
  width: 100%;
  max-width: 374px;
}
.footer-v1-wrap {
  justify-content: space-between;
  align-items: flex-end;
  margin-top: 142px;
  display: flex;
}
.footer-v1-contact-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  display: flex;
}
.footer-copyright-wrap {
  justify-content: space-between;
  align-items: center;
  margin-top: 94px;
  display: flex;
}
.cta-icon-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  display: flex;
}
.shop-single-top-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1.042fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.shop-single-left-wrap {
  border-radius: var(--_border-radius---border-s);
  position: relative;
  overflow: hidden;
}
.shop-single-right-wrap {
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.shop-banner-image {
  width: 100%;
}
.shop-single-title {
  color: var(--dark-color);
}
.shop-reviw-wrap {
  margin-top: var(--_margin-padding---gap-xs);
  margin-bottom: var(--_margin-padding---gap-m);
  grid-column-gap: var(--_border-radius---border-s);
  grid-row-gap: var(--_border-radius---border-s);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.shop-reviw-text {
  color: var(--gray-color);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.pricing-price {
  color: var(--dark-color);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.shop-single-wrap {
  margin-top: var(--_margin-padding---gap-xxl);
}
.shop-tabs-menu {
  border-bottom: 2px solid var(--gray-color);
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.shop-tabs-content {
  margin-top: var(--_margin-padding---gap-xs);
}
.shop-tabs-link {
  border-bottom: 2px solid var(--white-10);
  background-color: var(--transparent);
  font-family: var(--_font-family---primary-font);
  color: var(--gray-color);
  font-size: var(--_typography---h6);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: 0;
  text-transform: uppercase;
  margin-bottom: -2px;
  padding: 0;
}
.shop-tabs-link[aria-current="page"], .shop-tabs-link.is-active {
  border-bottom-color: var(--black);
  background-color: var(--transparent);
  color: var(--dark-color);
}
.shop-description-wrap {
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  flex-flow: column;
  width: 100%;
  max-width: 700px;
  display: flex;
}
.shop-description {
  color: var(--gray-color);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.shop-all-review-flex-wrap {
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  flex-flow: column;
  display: flex;
}
.shop-single-review {
  padding: var(--_margin-padding---gap-m);
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  border-radius: var(--_border-radius---border-s);
  background-color: var(--white);
  flex-flow: column;
  justify-content: flex-start;
  align-items: stretch;
  display: flex;
}
.shop-review-author-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.shop-review-author {
  font-size: var(--_typography---h6);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: 0;
}
.verified-wrap {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.verified-text {
  color: var(--primary-color);
}
.shop-single-icon {
  width: 82px;
}
.shop-verified-icon {
  width: 16px;
}
.shop-reviw-star-wrap {
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.shop-single-date {
  color: var(--dark-color);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
}
.shop-single-review-details {
  color: var(--dark-color);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
}
.more-shop-top-wrap {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}
.more-shop-wrap {
  margin-top: var(--_margin-padding---gap-l);
}
.more-shop-titile {
  text-align: center;
}
.investor-wrap {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
.investor-title {
  font-family: var(--_font-family---primary-font);
  color: var(--dark-color);
  font-size: 240px;
  line-height: var(--_line-height---line-height-m);
  font-weight: var(--_font-weight---regular);
  text-align: center;
  letter-spacing: -9.6px;
}
.story-top-wrap {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.story-wrap {
  margin-top: 40px;
}
.story-single-slide {
  background-image: url('../images/svg-shape.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding-top: 120px;
  padding-bottom: 88px;
  display: flex;
}
.story-single-number {
  color: var(--dark-blood);
  font-size: var(--_typography---dispaly-font);
  line-height: var(--_line-height---line-height-m);
  letter-spacing: var(--_letter-speacing---letter-speacing-xl);
  text-transform: uppercase;
}
.story-single-wrap {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.story-single-details {
  font-family: var(--_font-family---primary-font);
  color: var(--dark-color);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  font-weight: var(--_font-weight---regular);
  text-align: center;
  letter-spacing: -.8px;
  text-transform: uppercase;
}
.cart-button {
  background-color: var(--transparent);
  padding: 0;
  position: relative;
}
.cart-quantity {
  background-color: var(--black);
  color: var(--white);
  position: absolute;
  inset: -5px -5px auto auto;
}
.cart-quantity.white {
  background-color: var(--white);
  color: var(--black);
}
.cart-container {
  background-color: var(--background);
}
.cart-icon {
  border-radius: var(--_border-radius---border-s);
}
.cart-title-flex-wrap {
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.remove-button {
  color: var(--dark-blood);
  margin-top: 5px;
}
.cart-price, .cart-item-title {
  font-family: var(--_font-family---primary-font);
  font-size: var(--_typography---h6);
  font-weight: var(--_font-weight---regular);
}
.close-button {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--white);
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: flex;
}
.cart-header {
  border-bottom-color: var(--dark-color);
}
.cart-footer {
  border-top-color: var(--dark-color);
}
.overly-image {
  z-index: 9;
  background-color: var(--background);
  width: 100%;
  height: 0%;
  position: absolute;
  inset: auto 0% 0%;
}
.copyright-link {
  color: var(--primary-color);
  font-size: var(--_typography---regular);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  letter-spacing: -.14px;
  text-transform: uppercase;
  transition: all .4s;
}
.copyright-link:hover {
  color: var(--gray-color);
}
.testimonial-arrow {
  width: 24px;
  height: 24px;
}
.cart-label {
  font-family: var(--_font-family---secondary-font);
  color: var(--dark-color);
  font-size: var(--_typography---regular);
  line-height: var(--_line-height---line-height-xxl);
  font-weight: var(--_font-weight---regular);
  margin-bottom: 12px;
}
.option-list {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  display: flex;
}
.cart-page-button {
  border-color: var(--gray-color);
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--transparent);
  padding-left: 28px;
  padding-right: 28px;
}
.cart-page-button.is-selected {
  border-color: var(--dark-color);
  background-color: var(--white);
  color: var(--dark-color);
}
.quantity-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.field-label {
  color: var(--dark-color);
  font-size: var(--_typography---regular);
  font-weight: var(--_font-weight---regular);
  margin-top: 40px;
  margin-bottom: 12px;
}
.quantity {
  border-color: var(--gray-color);
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--transparent);
  width: 130px;
  height: auto;
  margin-bottom: 0;
  padding: 16px 20px 16px 56px;
}
.add-to-cart-button {
  border-radius: var(--_border-radius---border-xl);
  background-color: var(--primary-color);
  font-family: var(--_font-family---secondary-font);
  color: var(--dark-color);
  font-weight: var(--_font-weight---bold);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
  padding: 16px 40px;
  transition: all .4s;
}
.add-to-cart-button:hover {
  background-color: var(--dark-blood);
  color: var(--white);
}
.default-state {
  margin-bottom: 0;
}
.slider-number-wrap {
  position: absolute;
  inset: 42% auto auto 0%;
}
.slider-number-overflow {
  height: 44px;
  overflow: hidden;
}
.slider-number {
  color: var(--dark-blood);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.slider-number-flex-wrap {
  display: flex;
}
.slider-slash-number {
  color: var(--dark-blood);
  font-size: var(--_typography---h5);
  line-height: var(--_line-height---line-height-xl);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.dd-single-wrap {
  grid-column-gap: var(--_margin-padding---gap-xs);
  grid-row-gap: var(--_margin-padding---gap-xs);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.dd-flex-wrap {
  justify-content: space-between;
  display: flex;
}
.dropdown-toggle {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--dark-color);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---medium);
  letter-spacing: var(--_letter-speacing---letter-speacing-m);
  text-transform: uppercase;
  justify-content: flex-start;
  align-items: center;
  padding: 0;
  display: inline-flex;
}
.dropdown-toggle.white {
  color: var(--white);
}
.dd-single-line {
  background-color: #e1e1e1;
  width: 1px;
}
.dd-navigation {
  background-color: var(--transparent);
  width: 505px;
  overflow: hidden;
  transform: translate(-50%);
}
.dd-navigation.is-open {
  background-color: #0000;
}
.dd-single-title {
  font-family: var(--_font-family---secondary-font);
  color: var(--gray-color);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---bold);
  letter-spacing: var(--_letter-speacing---letter-speacing-l);
}
.dd-menu-wrap {
  border-radius: var(--_border-radius---border-s);
  background-color: var(--white);
  margin-top: 20px;
  padding: 24px;
}
.dd-all-link-wrap {
  grid-column-gap: var(--_border-radius---border-s);
  grid-row-gap: var(--_border-radius---border-s);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.dd-link {
  font-family: var(--_font-family---primary-font);
  color: var(--dark-color);
  font-size: var(--_typography---medium);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---regular);
  letter-spacing: 0;
  text-transform: uppercase;
  margin-left: 0;
  margin-right: 0;
  padding: 0;
  transition: color .4s;
}
.dd-link:hover {
  color: #ff3900;
}
.dd-link[aria-current="page"], .dd-link.is-active {
  color: var(--primary-color);
}
.investor-icon {
  -webkit-backdrop-filter: blur(26px);
  backdrop-filter: blur(26px);
  width: 224px;
  height: 72px;
  position: absolute;
}
.investor-icon._05 {
  border-radius: var(--_border-radius---border-xl);
  inset: auto -66px 160px auto;
}
.investor-icon._04 {
  border-radius: var(--_border-radius---border-xl);
  inset: auto auto 60px -35px;
}
.investor-icon._03 {
  border-radius: var(--_border-radius---border-xl);
  inset: 156px auto auto 240px;
}
.investor-icon._02 {
  border-radius: var(--_border-radius---border-xl);
  inset: -21px 190px auto auto;
}
.investor-icon._01 {
  border-radius: var(--_border-radius---border-xl);
  inset: 74px auto auto 124px;
}
.discover-left-wrap {
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  flex-flow: column;
  width: 100%;
  max-width: 115px;
  display: flex;
}
.discover-right-wrap {
  background-image: url('../images/Feature-Slider-BG.avif');
  background-position: 50% 32%;
  background-repeat: no-repeat;
  background-size: 100%;
  width: 100%;
  max-width: 792px;
}
.discover-flex-wrap {
  grid-column-gap: 90px;
  grid-row-gap: 90px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.discover-slider {
  background-color: var(--transparent);
  max-width: 384px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 110px;
}
.discover-single-slide {
  border-radius: var(--_border-radius---border-s);
  overflow: hidden;
}
.discover-single-image {
  width: 100%;
}
.discover-slider-text {
  font-family: var(--_font-family---primary-font);
  color: var(--gray-color);
  line-height: var(--_line-height---line-height-3xl);
  text-transform: uppercase;
}
.idea-button {
  color: var(--primary-color);
  font-weight: var(--_font-weight---medium);
  overflow: hidden;
}
.idea-btn-wrap {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  display: flex;
}
.idea-btn-icon {
  max-width: 22px;
}
.idea-btn-text {
  flex: none;
}
.idea-btn-line {
  background-color: var(--primary-color);
  width: 100%;
  height: 1px;
}
.discover-btm-wrap {
  z-index: -1;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 0;
  display: flex;
}
.discover-btm-details {
  text-transform: uppercase;
  max-width: 282px;
}
.shipping-method {
  border-bottom-color: var(--gray-color);
  background-color: var(--transparent);
}
.shipping-method-list {
  border-right-color: var(--gray-color);
  border-left-color: var(--gray-color);
}
.total-text {
  font-size: var(--_typography---h6);
  line-height: var(--_line-height---line-height-3xl);
  font-weight: var(--_font-weight---bold);
}
.story-height-wrap {
  height: 300vh;
}
.story-sticky-wrap {
  position: sticky;
  top: 120px;
}
.story-flex-wrap {
  justify-content: space-between;
  align-items: center;
  display: flex;
  position: relative;
}
.story-all-wrap {
  width: 100%;
  max-width: 1082px;
  height: 452px;
  overflow: hidden;
}
.story-dot-wrap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 20px;
  height: 80px;
  display: flex;
}
.sotry-dots {
  border-radius: var(--_border-radius---border-xl);
  background-color: #2121214d;
  width: 12px;
  height: 12px;
}
@media screen and (min-width: 1440px) {
.footer-v1-top-wrap {
    max-width: 1127px;
  }
}
@media screen and (min-width: 1920px) {
.footer-v1-top-wrap {
    max-width: 100%;
  }
.footer-v1-wrap {
    margin-top: 220px;
  }
.footer-copyright-wrap {
    margin-top: 60px;
  }
}
@media screen and (max-width: 991px) {
body {
    --_typography---medium: 16px;
    --_typography---h1: 80px;
    --_typography---h2: 64px;
    --_typography---h3: 54px;
    --_typography---h4: 42px;
    --_typography---h5: 36px;
    --_typography---h6: 22px;
    --_typography---regular: 14px;
    --_typography---dispaly-font: 100px;
    --_typography---font-zero: 0px;
    --_letter-speacing---letter-speacing-xl: -2px;
    --_letter-speacing---letter-speacing-x: -1.5px;
    --_letter-speacing---letter-speacing-l: -.4px;
    --_letter-speacing---letter-speacing-m: -.1px;
    --_letter-speacing---letter-speacing-xxl: -4px;
    --_letter-speacing---letter-speacing-s: -.1px;
    --_margin-padding---gap-xs: 20px;
    --_margin-padding---gap-m: 30px;
    --_margin-padding---gap-3xl: 100px;
    --_margin-padding---gap-4xl: 160px;
    --_margin-padding---gap-xxl: 100px;
    --_margin-padding---gap-xl: 60px;
    --_margin-padding---gap-l: 50px;
    --_margin-padding---gap-s: 24px;
    --_border-radius---border-l: 20px;
    --_border-radius---border-xl: 999px;
    --_border-radius---border-s: 16px;
    --_border-radius---border-m: 13px;
  }
.navbar.white {
    background-color: var(--transparent);
  }
.nav-menu-wrap {
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 40px;
    overflow: auto;
  }
.nav-button-wrap {
    grid-column-gap: var(--_margin-padding---gap-m);
    grid-row-gap: var(--_margin-padding---gap-m);
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }
.nav-menu {
    background-color: var(--white);
    height: 100vh;
    overflow: auto;
  }
.nav-menu.white {
    background-color: var(--dark-color);
  }
.menu-button {
    background-color: var(--transparent);
    width: 40px;
    height: 40px;
    padding: 0;
    overflow: hidden;
  }
.menu-button.is-open {
    background-color: var(--transparent);
    padding: 0;
  }
.section.inner {
    padding-top: var(--_margin-padding---gap-4xl);
    padding-bottom: var(--_margin-padding---gap-xxl);
  }
.section.contact {
    padding-bottom: 0;
  }
.section._404 {
    background-position: 50% 100%;
    background-size: 400px;
    padding-top: 160px;
    padding-bottom: 100px;
  }
.section.blog-single {
    padding-bottom: 0;
  }
.section.hero {
    height: 80vh;
  }
.section.about-v1, .section.testimonial, .section.team, .section.blog-v2, .section.trust {
    padding-bottom: 0;
  }
.section.fast {
    padding-top: 0;
    padding-bottom: 0;
  }
.section.gear, .section.trips {
    padding-bottom: 0;
  }
.section.footer-v1 {
    background-image: none;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto;
  }
.section.shop-single {
    padding-bottom: 0;
  }
.section.investor {
    padding-top: 100px;
  }
.section.story {
    padding-top: 0;
    padding-bottom: 0;
  }
.typography-single-wrap {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
  }
.style-color-grid-wrap {
    grid-template-columns: 1fr 1fr;
  }
.style-colo-wrap {
    height: 250px;
  }
.footer-top-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    flex-flow: column;
  }
.footer-wrap {
    margin-top: 80px;
  }
.license-wrap {
    grid-column-gap: var(--_margin-padding---gap-l);
    grid-row-gap: var(--_margin-padding---gap-l);
  }
.license-img-grid-wrap {
    grid-template-columns: 1fr 1fr;
  }
.changelog-single-wrap {
    padding: 30px 25px;
  }
.changelog-list {
    margin-bottom: 30px;
  }
.gallery-wrap {
    margin-top: -100px;
  }
.faq-tabs-menu {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
.faq-tabs-link {
    padding: 25px;
  }
.contact-top-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
.contact-single-wrapper {
    flex-flow: column;
  }
.touch-grid-wrap {
    grid-template-columns: 1fr 1fr;
  }
.touch-single-title {
    margin-top: 50px;
  }
.blog-image {
    object-position: 50% 0%;
  }
.blog-right-wrap {
    grid-column-gap: var(--_margin-padding---gap-m);
    grid-row-gap: var(--_margin-padding---gap-m);
  }
.shop-grid-wrap {
    grid-template-columns: 1fr 1fr;
  }
.shop-icon-wrap {
    width: 60px;
    height: 60px;
  }
.events-grid-wrap {
    grid-template-columns: 1fr 1fr;
  }
._404-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
.password-form-block {
    background-position: 50% 100%;
    background-size: 400px 400px;
    padding-top: 160px;
    padding-bottom: 100px;
  }
.blog-cl-flex-wrap {
    grid-column-gap: var(--_margin-padding---gap-l);
    grid-row-gap: var(--_margin-padding---gap-l);
  }
.blog-banner-image {
    height: 550px;
  }
.blog-single-flex-wrap {
    flex-flow: column;
  }
.blog-single-right-wrap {
    justify-content: flex-start;
    align-items: flex-start;
    margin-top: 40px;
  }
.blog-rich-text {
    margin-top: 20px;
  }
.event-single-top-wrap {
    height: 500px;
  }
.event-flex-wrap {
    grid-column-gap: var(--_margin-padding---gap-xs);
    grid-row-gap: var(--_margin-padding---gap-xs);
  }
.checkout-right-wrap {
    flex-basis: 300px;
  }
.hero-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
.hero-title-wrap {
    max-width: 500px;
  }
.about-v1-wrap {
    flex-flow: column;
  }
.about-v1-left-wrap, .about-v1-right-wrap {
    max-width: none;
  }
.about-v1-image {
    object-fit: cover;
    height: 450px;
  }
.feature-single-image {
    max-width: 180px;
    height: 240px;
    min-height: 240px;
  }
.officer-details {
    font-size: var(--_typography---h5);
  }
.choose-grid-wrap {
    grid-template-columns: 1fr 1fr;
  }
.testimonial-wrap {
    margin-top: 50px;
  }
.testimonial-left-arrow {
    inset: auto auto 0% 0%;
  }
.testimonial-left-arrow.trip {
    inset: auto 0% 0% -10%;
  }
.testimonial-right-arrow {
    inset: auto auto 0% 70px;
  }
.testimonial-right-arrow.trip {
    inset: auto 0% 0% 10%;
  }
.testimonial-single-slider {
    justify-content: space-between;
    align-items: flex-start;
  }
.testimonial-details-wrap {
    margin-top: 0;
  }
.testimonial-btm-line {
    display: none;
  }
.team-grid-wrap {
    grid-template-columns: 1fr 1fr;
  }
.blog-v2-title {
    max-width: 500px;
  }
.cta-btm-title-wrap {
    max-width: 600px;
  }
.cta-icon-wrap {
    width: 60px;
    height: 60px;
  }
.cta-icon {
    width: 26px;
  }
.cta-details {
    max-width: 550px;
  }
.trusted-grid-wrap {
    grid-column-gap: var(--_margin-padding---gap-s);
    grid-row-gap: var(--_margin-padding---gap-s);
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }
.work-v2-card {
    max-width: none;
  }
.work-v2-single-title {
    margin-top: 160px;
  }
.work-v2-card-wrap._01, .work-v2-card-wrap._02 {
    margin-top: 0;
  }
.trust-btn-wrap {
    flex-flow: column;
    justify-content: center;
    align-items: center;
    margin-top: 48px;
    display: flex;
  }
.discover-wrap {
    margin-top: 40px;
  }
.fast-grid-wrap {
    grid-template-columns: 1fr 1fr;
  }
.fast-single-wrap {
    min-height: 565px;
  }
.fast-image-wrap {
    height: 400px;
  }
.trips-top-wrap {
    grid-column-gap: var(--_margin-padding---gap-m);
    grid-row-gap: var(--_margin-padding---gap-m);
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
  }
.trips-title {
    text-align: center;
    max-width: 450px;
  }
.trips-slider {
    padding-bottom: 100px;
  }
.footer-v1-arrow-wrap {
    margin-bottom: 0;
  }
.footer-v1-image {
    max-width: 222px;
  }
.footer-v1-wrap {
    margin-top: 100px;
  }
.footer-v1-contact-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
.footer-copyright-wrap {
    margin-top: 80px;
  }
.shop-single-top-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
.shop-banner-image {
    height: 100%;
  }
.investor-title {
    letter-spacing: -4px;
    font-size: 160px;
  }
.story-single-slide {
    background-size: cover;
    padding-bottom: 60px;
  }
.option-list {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
  }
.field-label {
    margin-top: 15px;
  }
.slider-number-overflow {
    height: 40px;
  }
.dropdown, .dropdown-toggle {
    margin-left: 0;
    margin-right: 0;
  }
.dd-navigation {
    transform: none;
  }
.dd-menu-wrap {
    background-color: var(--background);
  }
.investor-icon {
    width: 140px;
    height: auto;
  }
.investor-icon._05 {
    width: 140px;
    bottom: 120px;
    right: 66px;
  }
.investor-icon._04 {
    width: 140px;
    left: 32px;
  }
.investor-icon._03, .investor-icon._02 {
    width: 140px;
  }
.investor-icon._01 {
    width: 140px;
    left: 160px;
  }
.discover-left-wrap {
    flex-flow: wrap;
    justify-content: space-between;
    align-items: flex-start;
    max-width: none;
  }
.discover-flex-wrap {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    flex-flow: column;
  }
.discover-slider {
    max-width: 350px;
  }
.story-sticky-wrap {
    top: 160px;
  }
.story-all-wrap {
    height: 360px;
  }
}
@media screen and (max-width: 767px) {
body {
    --_typography---medium: 16px;
    --_typography---h1: 64px;
    --_typography---h2: 48px;
    --_typography---h3: 42px;
    --_typography---h4: 36px;
    --_typography---h5: 32px;
    --_typography---h6: 20px;
    --_typography---regular: 14px;
    --_typography---dispaly-font: 72px;
    --_typography---font-zero: 0px;
    --_letter-speacing---letter-speacing-xl: -1.5px;
    --_letter-speacing---letter-speacing-x: -1px;
    --_letter-speacing---letter-speacing-l: -.3px;
    --_letter-speacing---letter-speacing-m: 0px;
    --_letter-speacing---letter-speacing-xxl: -3px;
    --_letter-speacing---letter-speacing-s: 0px;
    --_margin-padding---gap-xs: 20px;
    --_margin-padding---gap-m: 25px;
    --_margin-padding---gap-3xl: 80px;
    --_margin-padding---gap-4xl: 140px;
    --_margin-padding---gap-xxl: 80px;
    --_margin-padding---gap-xl: 40px;
    --_margin-padding---gap-l: 40px;
    --_margin-padding---gap-s: 20px;
    --_border-radius---border-l: 15px;
    --_border-radius---border-xl: 999px;
    --_border-radius---border-s: 15px;
    --_border-radius---border-m: 13px;
  }
.brand-logo-link {
    padding-left: 0;
  }
.nav-menu-wrap {
    padding: 30px;
  }
.nav-menu {
    height: 90vh;
  }
.section._404 {
    padding-top: 140px;
    padding-bottom: 80px;
  }
.section.hero {
    height: 60vh;
  }
.section.shop-v2 {
    padding-top: 0;
  }
.section.investor {
    padding-top: 80px;
  }
.typography-single-wrap {
    grid-template-columns: 1fr 1fr;
  }
.typography-right-wrap {
    min-height: 70px;
  }
.style-color-grid-wrap {
    grid-template-columns: 1fr;
  }
.style-colo-wrap {
    height: 200px;
  }
.style-button-wrap {
    flex-flow: wrap;
  }
.footer-top-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
.footer-contact-wrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }
.footer-wrap {
    grid-column-gap: var(--_margin-padding---gap-m);
    grid-row-gap: var(--_margin-padding---gap-m);
    flex-flow: column;
    margin-top: 60px;
  }
.copyright-text {
    text-align: center;
  }
.license-flex-wrap {
    flex-flow: column;
  }
.license-image {
    width: 100%;
    height: 150px;
  }
.changelog-single-wrap {
    padding: 25px 20px;
  }
.changelog-list {
    margin-bottom: 25px;
  }
.gallery-wrap {
    margin-top: var(--_margin-padding---gap-xxl);
  }
.gallery-img-wrap._01 {
    height: 350px;
  }
.gallery-image {
    object-fit: cover;
  }
.galler-dubble-grid, .gallery-last-grid-wrap {
    grid-template-columns: 1fr;
  }
.faq-tabs-menu {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
  }
.faq-tabs-link {
    padding: 20px;
  }
.faq-question {
    width: 90%;
  }
.contact-top-wrap {
    flex-flow: column;
  }
.contact-left-wrap {
    text-align: center;
    max-width: none;
  }
.contact-right-wrap {
    max-width: none;
    padding: 25px 20px;
  }
.contact-text-field {
    padding-top: 15px;
    padding-bottom: 15px;
  }
.touch-grid-wrap {
    grid-template-columns: 1fr;
  }
.touch-single-title {
    margin-top: 40px;
  }
.blog-grid-wrap {
    grid-template-columns: 1fr;
  }
.shop-grid-wrap {
    grid-row-gap: 30px;
    grid-template-columns: 1fr;
  }
.shop-card-wrap {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
  }
.shop-icon-wrap {
    width: 55px;
    height: 55px;
  }
.shop-icon-img {
    width: 26px;
  }
.events-grid-wrap {
    grid-template-columns: 1fr;
  }
.event-card-img {
    object-fit: cover;
    height: 450px;
  }
._404-wrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }
.password-form-block {
    background-size: 300px 300px;
    padding-top: 140px;
    padding-bottom: 80px;
  }
.blog-cl-flex-wrap {
    grid-column-gap: var(--_margin-padding---gap-l);
    grid-row-gap: var(--_margin-padding---gap-l);
  }
.blog-author-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
.blog-banner-image {
    height: 450px;
  }
.blog-single-right-wrap {
    margin-top: 30px;
  }
.blog-rich-grid {
    grid-template-columns: 1fr 1.64fr;
  }
.event-single-top-wrap {
    height: 400px;
  }
.event-single-title {
    text-align: center;
    margin-left: 15px;
    margin-right: 15px;
  }
.event-wrap {
    margin-top: var(--_margin-padding---gap-m);
  }
.event-flex-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    flex-flow: column;
  }
.event-left-wrap {
    margin-top: 0;
  }
.event-right-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    max-width: none;
    margin-top: 0;
    position: static;
  }
.block-header {
    padding: 15px;
  }
.checkout-right-wrap {
    flex: 0 auto;
    position: static;
  }
.hero-wrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
    flex-flow: column;
    justify-content: flex-end;
    align-items: flex-start;
  }
.about-v1-image {
    height: 400px;
  }
.about-v1-details {
    display: block;
  }
.about-image-wrap {
    background-size: 100%;
    max-width: 300px;
    height: 370px;
  }
.about-image {
    height: 350px;
  }
.feature-top-text.top {
    order: -9999;
  }
.feature-single-image {
    max-width: 160px;
  }
.shop-v2-top-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
  }
.shop-v2-title {
    font-size: var(--_typography---h2);
    text-align: center;
  }
.shop-height-wrap {
    height: auto;
    margin-top: 40px;
  }
.shop-sticky-wrap {
    position: static;
  }
.shop-v2-flex-wrap {
    flex-flow: column;
  }
.shop-v2-item-wrap {
    position: sticky;
    top: 120px;
  }
.shop-v2-image {
    object-fit: cover;
    height: 450px;
  }
.officer-wrap {
    flex-flow: column;
  }
.officer-image-wrap {
    max-width: none;
  }
.officer-image {
    object-fit: cover;
    object-position: 50% 0%;
    height: 400px;
  }
.choose-grid-wrap {
    grid-template-columns: 1fr;
  }
.choose-single-wrap {
    height: 300px;
    position: sticky;
    top: 120px;
  }
.choose-single-title._01 {
    max-width: none;
  }
.testimonial-top-wrap {
    grid-column-gap: var(--_margin-padding---gap-m);
    grid-row-gap: var(--_margin-padding---gap-m);
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
  }
.testimonial-sub-title {
    text-align: center;
    order: -9999;
  }
.testimonial-sub-title.mobile-on {
    display: block;
  }
.testimonial-sub-title.mobile-off {
    display: none;
  }
.testimonial-title {
    text-align: center;
  }
.testimonial-wrap {
    margin-top: 40px;
  }
.testimonial-slider {
    padding-bottom: 20px;
  }
.testimonial-slider._01 {
    padding-bottom: 80px;
  }
.testimonial-left-arrow {
    width: 50px;
    height: 50px;
    inset: auto 0% 0% -15%;
  }
.testimonial-left-arrow._01 {
    inset: auto 0% 0% -15%;
  }
.testimonial-left-arrow.trip {
    left: -15%;
  }
.testimonial-left-arrow._02 {
    left: -14%;
  }
.testimonial-right-arrow {
    width: 50px;
    height: 50px;
    inset: auto 0% 0% 15%;
  }
.testimonial-right-arrow._02 {
    inset: auto 0% 0% 15%;
  }
.testimonial-right-arrow.trip {
    left: 15%;
  }
.testimonial-right-arrow._01 {
    left: 17%;
  }
.testimonial-single-slider {
    grid-column-gap: var(--_typography---h5);
    grid-row-gap: var(--_typography---h5);
    flex-flow: column;
  }
.testimonial-author-wrap {
    max-width: none;
  }
.testimonial-btm-wrap {
    flex-flow: column;
  }
.team-top-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
  }
.team-title {
    text-align: center;
  }
.team-grid-wrap {
    grid-template-columns: 1fr;
  }
.team-single-wrap {
    padding-bottom: 10px;
  }
.team-image {
    object-position: 50% 0%;
  }
.blog-v2-top-wrap {
    grid-column-gap: var(--_margin-padding---gap-m);
    grid-row-gap: var(--_margin-padding---gap-m);
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
  }
.blog-v2-title {
    text-align: center;
  }
.blog-v2-right-wrap {
    justify-content: space-between;
    align-items: center;
  }
.cta-title-wrap {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
  }
.cta-title {
    font-size: var(--_typography---h2);
  }
.cta-btm-title-wrap {
    max-width: 450px;
    margin-top: 10px;
  }
.cta-blood-title {
    font-size: var(--_typography---h2);
  }
.cta-details {
    max-width: none;
    margin-right: auto;
  }
.trust-top-wrap {
    grid-column-gap: var(--_margin-padding---gap-m);
    grid-row-gap: var(--_margin-padding---gap-m);
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    position: sticky;
    top: 20px;
  }
.trust-title {
    text-align: center;
  }
.trusted-grid-wrap {
    grid-template-columns: 1fr;
  }
.work-v2-card {
    max-width: none;
    padding: 20px;
  }
.work-v2-single-title {
    margin-top: 60px;
  }
.work-v2-card-wrap {
    position: sticky;
    top: 220px;
  }
.trust-btn-wrap {
    margin-top: 40px;
  }
.discover-title {
    max-width: 400px;
  }
.fast-top-wrap {
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
  }
.fast-title {
    text-align: center;
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    max-width: 400px;
    display: flex;
  }
.fast-details {
    text-align: center;
    max-width: 450px;
  }
.fast-grid-wrap {
    grid-template-columns: 1fr;
  }
.fast-single-wrap {
    min-height: auto;
    position: sticky;
    top: 120px;
  }
.fast-image-wrap {
    height: 350px;
  }
.fast-image {
    object-fit: cover;
  }
.fast-number.white {
    display: none;
  }
.gear-top-wrap {
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
  }
.gear-title {
    text-align: center;
    order: 9999;
  }
.gear-slider {
    padding-bottom: 80px;
  }
.footer-v1-arrow-wrap {
    width: 150px;
    height: 150px;
  }
.footer-v1-image {
    max-width: 160px;
  }
.footer-v1-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    margin-top: 60px;
  }
.footer-v1-contact-wrap {
    flex-flow: wrap;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
  }
.footer-copyright-wrap {
    grid-column-gap: var(--_margin-padding---gap-m);
    grid-row-gap: var(--_margin-padding---gap-m);
    flex-flow: column;
    margin-top: 60px;
  }
.cta-icon-wrapper {
    order: -9999;
  }
.shop-single-top-wrap {
    grid-template-columns: 1fr;
  }
.shop-single-right-wrap {
    grid-column-gap: var(--_margin-padding---gap-m);
    grid-row-gap: var(--_margin-padding---gap-m);
  }
.shop-banner-image {
    object-fit: cover;
    height: 350px;
  }
.shop-tabs-menu {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    border-bottom-style: none;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }
.shop-tabs-link {
    margin-bottom: 0;
  }
.investor-title {
    letter-spacing: -2px;
    font-size: 100px;
  }
.story-single-slide {
    background-position: 50% 0;
    background-size: contain;
    padding-top: 60px;
  }
.story-single-wrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }
.copyright-link {
    text-align: center;
  }
.slider-number-wrap {
    justify-content: center;
    align-items: center;
    display: flex;
    inset: auto 0% 0%;
  }
.slider-number-overflow {
    height: 36px;
  }
.dd-navigation {
    width: 420px;
  }
.investor-icon._05, .investor-icon._04, .investor-icon._03, .investor-icon._02, .investor-icon._01 {
    display: none;
  }
.discover-right-wrap {
    background-image: none;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto;
  }
.discover-flex-wrap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
.discover-slider {
    max-width: none;
    padding-bottom: 80px;
    overflow: hidden;
  }
.discover-single-image {
    object-fit: cover;
    height: 400px;
  }
.discover-btm-wrap {
    grid-column-gap: var(--_margin-padding---gap-xs);
    grid-row-gap: var(--_margin-padding---gap-xs);
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    margin-top: 40px;
  }
.discover-btm-details {
    text-align: center;
    order: -9999;
    max-width: none;
  }
.story-all-wrap {
    height: 252px;
  }
}
@media screen and (max-width: 479px) {
body {
    --_typography---medium: 16px;
    --_typography---h1: 48px;
    --_typography---h2: 42px;
    --_typography---h3: 36px;
    --_typography---h4: 32px;
    --_typography---h5: 28px;
    --_typography---h6: 18px;
    --_typography---regular: 14px;
    --_typography---dispaly-font: 54px;
    --_typography---font-zero: 0px;
    --_letter-speacing---letter-speacing-xl: -1px;
    --_letter-speacing---letter-speacing-x: -.4px;
    --_letter-speacing---letter-speacing-l: .2px;
    --_letter-speacing---letter-speacing-m: 0px;
    --_letter-speacing---letter-speacing-xxl: -2px;
    --_letter-speacing---letter-speacing-s: 0px;
    --_margin-padding---gap-xs: 15px;
    --_margin-padding---gap-m: 20px;
    --_margin-padding---gap-3xl: 60px;
    --_margin-padding---gap-4xl: 120px;
    --_margin-padding---gap-xxl: 60px;
    --_margin-padding---gap-xl: 40px;
    --_margin-padding---gap-l: 30px;
    --_margin-padding---gap-s: 15px;
    --_border-radius---border-l: 10px;
    --_border-radius---border-xl: 999px;
    --_border-radius---border-s: 10px;
    --_border-radius---border-m: 10px;
  }
.nav-menu-wrap {
    padding: 25px;
  }
.nav-menu {
    height: 85vh;
  }
.section._404 {
    background-size: 250px;
    padding-top: 120px;
    padding-bottom: 60px;
  }
.section.hero {
    height: 50vh;
  }
.section.about {
    padding-top: 120px;
  }
.section.investor {
    padding-top: 60px;
  }
.typography-single-wrap {
    grid-template-columns: 1fr;
  }
.typography-right-wrap {
    min-height: 60px;
  }
.style-colo-wrap {
    height: 150px;
  }
.style-button-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
.footer-top-wrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
  }
.footer-menu-wrap {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
    flex-flow: wrap;
    justify-content: center;
    align-items: flex-start;
  }
.footer-contact-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
  }
.footer-menu-slash {
    display: none;
  }
.footer-contact-single-wrap {
    justify-content: flex-start;
    align-items: center;
  }
.footer-wrap {
    margin-top: 40px;
  }
.license-image {
    object-fit: cover;
  }
.license-icon-wrap, .license-img-grid-wrap {
    grid-template-columns: 1fr;
  }
.changelog-single-wrap {
    padding: 20px 15px;
  }
.changelog-list {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    margin-bottom: 20px;
  }
.gallery-img-wrap, .gallery-img-wrap._01 {
    height: 300px;
  }
.faq-tabs-link {
    padding: 15px;
  }
.faq-icon-wrap {
    width: 26px;
  }
.faq-question {
    width: 85%;
  }
.faq-answer {
    font-size: var(--_typography---regular);
  }
.contact-right-wrap {
    border-radius: var(--_border-radius---border-s);
    padding: 20px 15px;
  }
.contact-text-field {
    border-radius: var(--_border-radius---border-s);
    padding-top: 12px;
    padding-bottom: 12px;
  }
.touch-single-title {
    margin-top: 30px;
  }
.blog-image-wrap {
    height: 300px;
  }
.shop-grid-wrap {
    grid-row-gap: 25px;
  }
.shop-icon-wrap {
    width: 50px;
    height: 50px;
  }
.shop-icon-img {
    width: 24px;
  }
.event-card-img {
    height: 400px;
  }
.event-details-wrap {
    inset: 20px 15px;
  }
.event-date-wrapper {
    grid-column-gap: var(--_typography---medium);
    grid-row-gap: var(--_typography---medium);
    flex-flow: wrap;
  }
.event-date-wrap {
    flex-flow: wrap;
  }
.event-date-icon {
    width: 18px;
  }
._404-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
.password-form-block {
    background-position: 50% 100%;
    background-size: 240px;
    padding-top: 120px;
    padding-bottom: 60px;
  }
.blog-single-title {
    font-size: var(--_typography---h3);
  }
.blog-author-wrapper {
    grid-column-gap: var(--_margin-padding---gap-m);
    grid-row-gap: var(--_margin-padding---gap-m);
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
  }
.blog-time-wrap, .blog-time-wrap._01 {
    justify-content: flex-start;
    align-items: flex-start;
  }
.blog-banner-image {
    height: 350px;
  }
.blog-single-right-wrap {
    margin-top: 20px;
  }
.blog-rich-grid {
    grid-template-columns: 1fr;
  }
.event-single-top-wrap {
    height: 350px;
  }
.event-flex-wrap {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }
.event-right-wrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
    margin-top: 0;
  }
.event-rich-grid {
    grid-template-columns: 1fr;
  }
.hero-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
.about-v1-image {
    height: 350px;
  }
.about-top-wrap {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
    flex-flow: wrap;
    justify-content: center;
    align-items: center;
  }
.about-image-wrap {
    order: 9999;
  }
.feature-single-image {
    max-width: 120px;
  }
.shop-height-wrap {
    margin-top: 30px;
  }
.shop-v2-image {
    height: 350px;
  }
.choose-single-wrap {
    padding-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
  }
.testimonial-title {
    font-size: var(--_typography---h2);
  }
.testimonial-wrap {
    margin-top: 30px;
  }
.testimonial-slider {
    padding-bottom: 0;
  }
.testimonial-left-arrow {
    width: 45px;
    height: 45px;
    left: -20%;
  }
.testimonial-left-arrow._01, .testimonial-left-arrow.trip {
    left: -20%;
  }
.testimonial-right-arrow {
    width: 45px;
    height: 45px;
    left: 20%;
  }
.testimonial-right-arrow._02, .testimonial-right-arrow.trip {
    left: 20%;
  }
.team-grid-wrap {
    grid-template-columns: 1fr;
  }
.team-single-wrap {
    position: sticky;
    top: 120px;
  }
.team-image {
    height: 300px;
  }
.cta-title-wrap {
    justify-content: flex-start;
    align-items: center;
  }
.cta-btm-title-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: wrap;
    justify-content: center;
    align-items: flex-start;
  }
.cta-btn-wrap {
    order: 9999;
  }
.cta-details {
    text-align: center;
    max-width: 350px;
  }
.work-v2-card {
    padding: 15px;
  }
.work-v2-single-title {
    margin-top: 40px;
  }
.trust-btn-wrap {
    margin-top: 30px;
  }
.discover-title {
    max-width: 300px;
  }
.fast-image-wrap {
    height: 300px;
  }
.gear-title {
    font-size: var(--_typography---h2);
  }
.trips-slider {
    padding-bottom: 80px;
  }
.footer-v1-arrow-wrap {
    width: 120px;
    height: 120px;
  }
.footer-v1-image {
    max-width: 120px;
  }
.footer-v1-wrap {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }
.footer-v1-contact-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
.footer-copyright-wrap {
    margin-top: 40px;
  }
.shop-banner-image {
    height: 300px;
  }
.shop-reviw-wrap {
    flex-flow: wrap;
  }
.shop-tabs-menu {
    grid-template-columns: 1fr;
  }
.investor-title {
    letter-spacing: -1px;
    font-size: 72px;
  }
.story-single-slide {
    padding-top: 40px;
    padding-bottom: 40px;
  }
.cart-list {
    padding-left: 15px;
    padding-right: 15px;
  }
.quantity {
    width: 80px;
    padding-left: 20px;
    padding-right: 20px;
  }
.slider-number-overflow {
    height: 30px;
  }
.dd-flex-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-rows: auto;
    grid-template-columns: 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }
.dd-single-line {
    display: none;
  }
.dd-navigation {
    width: 280px;
  }
.discover-left-wrap {
    justify-content: center;
    align-items: flex-start;
  }
.discover-btm-wrap {
    margin-top: 30px;
  }
.story-sticky-wrap {
    top: 120px;
  }
.story-all-wrap {
    height: 190px;
  }
}
@media screen and (max-width: 767px) {
#node-a4d2e634-27cf-0af8-4572-0298aa49e83d-dfc62b05 {
    grid-area: span 1 / span 2 / span 1 / span 2;
  }
}
@media screen and (max-width: 479px) {
#node-a4d2e634-27cf-0af8-4572-0298aa49e83d-dfc62b05 {
    grid-column: span 1 / span 1;
  }
}
/* ======================================================================
   4. Components (hand-written)
   ====================================================================== */
/* Components -- vanilla replacements for the Webflow runtime and its IX2 / IX3
   interactions.
   ---------------------------------------------------------------------------
   Every value here was read out of the decoded payload (ix2.json / ix3.json), not re-guessed by eye: durations, delays, offsets, easings, the colours, and
   the breakpoints each behaviour was limited to. build_ix2_map.py turns that
   payload into the hooks the markup carries; this file and main.js implement
   them.

   Three rules this file obeys, each of them a bug an earlier conversion
   shipped:

     * A REVEAL IS AN ANIMATION, NEVER A TRANSITION. `transition: opacity .8s`
       on a reveal class REPLACES the element's own `transition` shorthand, so
       every hover on that element stops easing. Reveals use `@keyframes` and
       leave `transition` untouched.
     * A STATE CLASS LANDS ON THE TRIGGER. IX2's CHILDREN scope means the thing
       that moves is usually not the thing that is observed, so a rule has to be
       written for the descendant -- `[hook].is-revealed .child` -- and, where
       the trigger IS the target, for the element itself as well.
     * A BREAKPOINT-GATED BEHAVIOUR MUST GATE ITS REST STATE TOO. The "How
       fast" cards are the case here: IX2 parks them at 428px, and the export's
       own <style> block wraps that in the same `>= 768px` the hover is limited
       to. An ungated rest state is invisible to every layout test, because the
       parity harness forces reveals visible on both sides before it measures.

   Easings, as Webflow names them and as CSS spells them:
     outQuart    cubic-bezier(.165, .84, .44, 1)
     outCubic    cubic-bezier(.215, .61, .355, 1)
     inOutCubic  cubic-bezier(.645, .045, .355, 1)
     ease        ease
*/

/* ========================================================================
   1. Reveals
   ======================================================================== */
/* Four stock Webflow presets drive 171 of the 361 events: `slideInBottom`
   (164), `slideInLeft` (3), `slideInRight` (2) and `growBigIn` (2). All four
   are 1000ms outQuart from opacity 0, and all four fire at a 0% scroll offset, so `.reveal` carries the hidden state and one class per preset carries the
   move. Every one of them runs at every breakpoint -- Camp gates no reveal --
   which is why there is no `[data-reveal-mq]` block here.

   `:where(.js)` is what stops a scripting-off visitor seeing a blank page: the
   hidden state only applies once main.js is there to remove it. `:where()` so
   the gate costs nothing in the cascade. */
:where(.js) .reveal {
  opacity: 0;
}
:where(.js) .reveal.is-revealed {
  opacity: 1;
  animation-duration: 1s;
  animation-timing-function: cubic-bezier(.165, .84, .44, 1);
  animation-fill-mode: both;
  animation-delay: var(--reveal-delay, 0ms);
}
:where(.js) .reveal-up.is-revealed {
  animation-name: reveal-up;
}
:where(.js) .reveal-left.is-revealed {
  animation-name: reveal-left;
}
:where(.js) .reveal-right.is-revealed {
  animation-name: reveal-right;
}
:where(.js) .reveal-grow.is-revealed {
  animation-name: reveal-grow;
}
@keyframes reveal-up {
from { opacity: 0; transform: translate3d(0, 100px, 0); }
to { opacity: 1; transform: none; }
}
@keyframes reveal-left {
from { opacity: 0; transform: translate3d(-100px, 0, 0); }
to { opacity: 1; transform: none; }
}
@keyframes reveal-right {
from { opacity: 0; transform: translate3d(100px, 0, 0); }
to { opacity: 1; transform: none; }
}
@keyframes reveal-grow {
from { opacity: 0; transform: scale3d(0, 0, 1); }
to { opacity: 1; transform: none; }
}
/* Nobody who has asked for less motion should get 171 slides. The elements
   still appear -- they are `opacity: 0` until observed -- they just arrive
   without travelling. */
@media (prefers-reduced-motion: reduce) {
  :where(.js) .reveal.is-revealed {
    animation-name: reveal-fade;
    animation-duration: .2s;
  }

  @keyframes reveal-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
  }
}
/* ========================================================================
   2. Scroll-triggered image moves
   ======================================================================== */
/* THE ZOOM-OUT FAMILY. Thirteen action lists, one shape: an image is parked at
   scale 1.4 or 1.5 -- baked into the markup by IX2, stripped by transform, and
   restated here -- and settles to 1 over 1200 or 1500ms once its wrap is in
   view. The hook value names the child and the duration because both differ
   per list, and the child is always a DESCENDANT of the observed wrap. */
[data-zoom] .about-image, [data-zoom] .about-v1-image, [data-zoom] .blog-banner-image, [data-zoom] .blog-image._02, [data-zoom] .event-banner-image, [data-zoom] .event-card-img, [data-zoom] .event-rich-image, [data-zoom] .gallery-image, [data-zoom] .officer-image, [data-zoom] .shop-banner-image, [data-zoom] .shop-image, [data-zoom] .touch-map {
  transform: scale(1.5);
  transition: transform 1.2s cubic-bezier(.165, .84, .44, 1);
}
/* The five lists that take 1500ms rather than 1200ms. */
[data-zoom~="gallery-1500"] .gallery-image, [data-zoom~="event-banner-1500"] .event-banner-image, [data-zoom~="event-rich-1500"] .event-rich-image, [data-zoom~="map-1500"] .touch-map, [data-zoom~="about-v1-1500"] .about-v1-image, [data-zoom~="officer-1500"] .officer-image, [data-zoom~="about-1500"] .about-image {
  transition-duration: 1.5s;
}
[data-zoom].is-revealed .about-image, [data-zoom].is-revealed .about-v1-image, [data-zoom].is-revealed .blog-banner-image, [data-zoom].is-revealed .blog-image._02, [data-zoom].is-revealed .event-banner-image, [data-zoom].is-revealed .event-card-img, [data-zoom].is-revealed .event-rich-image, [data-zoom].is-revealed .gallery-image, [data-zoom].is-revealed .officer-image, [data-zoom].is-revealed .shop-banner-image, [data-zoom].is-revealed .shop-image, [data-zoom].is-revealed .touch-map {
  transform: none;
}
/* THE ODD ONE OUT. `a-41` starts at 1.4, not 1.5, and its target is a PAGE-WIDE
   `.team-image` while only the FOURTH and FIFTH of the six `.team-image-wrap`s
   carry a trigger -- so the whole row of six un-zooms together when the second
   grid row arrives. main.js marks the SECTION, not the card; a per-card reveal
   would un-zoom card one a screen early, which is not what the original does. */
[data-zoom~="team-1500"] .team-image {
  transform: scale(1.4);
  transition: transform 1.5s cubic-bezier(.165, .84, .44, 1);
}
[data-zoom~="team-1500"].is-revealed .team-image {
  transform: none;
}
/* THE CURTAIN. `.overly-image` is a full-bleed block over each picture. The
   design sheet parks it at `height: 0%`; IX2 bakes `height: 100%` inline, which
   CONTRADICTS the sheet -- so this is one of the rest states that is NOT
   redundant, and dropping the inline style without restating it here would mean
   34 curtains that never close and so never open.

   The hook is on the curtain ITSELF: IX2's CHILDREN scope includes the trigger
   when the trigger matches the selector, and here it does. It fires at a 20%
   scroll offset, which main.js reads from `data-scroll-offset`. */
[data-wipe~="image"] {
  height: 100%;
  transition: height 1.2s cubic-bezier(.165, .84, .44, 1);
}
[data-wipe~="image"].is-revealed {
  height: 0%;
}
@media (prefers-reduced-motion: reduce) {
[data-zoom] .about-image, [data-zoom] .about-v1-image, [data-zoom] .blog-banner-image, [data-zoom] .blog-image._02, [data-zoom] .event-banner-image, [data-zoom] .event-card-img, [data-zoom] .event-rich-image, [data-zoom] .gallery-image, [data-zoom] .officer-image, [data-zoom] .shop-banner-image, [data-zoom] .shop-image, [data-zoom] .touch-map, [data-zoom~="team-1500"] .team-image {
    transform: none;
    transition: none;
  }
[data-wipe~="image"] {
    height: 0%;
    transition: none;
  }
}
/* ========================================================================
   3. Nav overlay and its hamburger
   ======================================================================== */
/* Below 992px `.nav-menu` is the panel. framework.hand.css hides it there, in
   the framework rule's place; this is the open state, and it has to beat that
   rule -- `[data-nav-menu-open] { display: block !important }` is what the
   runtime used, and `.is-open` scoring one class higher than the bare
   `.nav-menu` does the same job without the `!important`. */
@media screen and (max-width: 991px) {
  .nav-menu.is-open {
    display: block;
  }

  .nav-overlay {
    height: 0;
    transition: height .4s ease;
  }

  .nav-overlay:has(.nav-menu.is-open) {
    height: auto;
  }
}
/* The hamburger, transcribed from `documents/Hamburger-Menu.json`: a 50x50 box
   with a top bun, a bottom bun and TWO middle strokes stacked on each other.
   Open, the buns fly out and the two middle strokes rotate to +45 and -45 to
   make the cross. The 6 KB of JSON, the 1.3 KB `.lottie` and the player the
   2.8 MB bundle carried for them are all gone; this is four transitions.

   `data-duration="4.083..."` at 24fps is 98 frames, and IX2 drove the player to
   frame 45 -- so the open state is a little under half the clip, and 400ms is
   the duration the MOUSE_CLICK list gives it. */
.hamburger {
  display: block;
  width: 40px;
  height: 40px;
}
.nav-icon {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.nav-icon path {
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  transform-origin: 25px 25px;
  transition: transform .4s ease, opacity .4s ease;
}
/* At rest the two crossing strokes are stacked in the middle, so the icon reads
   as three bars. */
.nav-icon-cross-a, .nav-icon-cross-b {
  opacity: 0;
}
[aria-expanded="true"] .nav-icon-top {
  transform: translateY(8px);
  opacity: 0;
}
[aria-expanded="true"] .nav-icon-bottom {
  transform: translateY(-8px);
  opacity: 0;
}
[aria-expanded="true"] .nav-icon-cross-a {
  opacity: 1;
  transform: rotate(45deg);
}
[aria-expanded="true"] .nav-icon-cross-b {
  opacity: 1;
  transform: rotate(-45deg);
}
/* The menu button is a <button> now; the design's own `.menu-button` rules
   give it its size, and this stops the UA drawing the rest. */
.menu-button {
  color: inherit;
}
/* ========================================================================
   4. The Pages dropdown
   ======================================================================== */
/* `a-45` / `a-46`: `.dd-navigation` between 0 and auto over 400ms, with
   `overflow: hidden` already on it from the design sheet -- so what the visitor
   sees is the panel wiping down from its top edge.

   THE GRID TRICK DOES NOT WORK HERE, and it is worth saying why, because it
   works everywhere else in this file. `grid-template-rows: 0fr` collapses the
   item's CONTENT box; it does not collapse the item's own margin or padding, and `.dd-menu-wrap` carries `margin-top: 20px` and `padding: 24px`. Closed, that leaves a 68px block of background sitting under the nav bar on every
   page -- collapsed by the numbers, plainly visible on screen.

   `clip-path` collapses the whole thing. The panel keeps its natural height, which costs nothing because it is `position: absolute` and out of flow, and
   the clip reveals it top-down over the payload's own 400ms. Nothing is
   measured at runtime, and a buyer who changes the panel's padding does not
   break the animation.

   framework.hand.css holds the closed `display: none` the framework rule used
   to provide; `.is-open` beats it by one class, exactly as `.w--open` did. */
.dd-navigation {
  /* Beats the `display: none` framework.hand.css restates from
     `.w-dropdown-list`. A clip cannot animate on a box that is not generated,
     so the panel is always displayed and always clipped instead -- which costs
     nothing, because it is `position: absolute` and out of flow. `visibility`
     and `pointer-events` are what actually take it out of reach when closed:
     a clipped box is still focusable and still hoverable without them. */
  display: block;
  clip-path: inset(0 0 100% 0);
  visibility: hidden;
  pointer-events: none;
  transition: clip-path .4s ease, visibility 0s linear .4s;
  z-index: 900;
  left: 50%;
}
.dd-navigation.is-open {
  clip-path: inset(0 0 0 0);
  visibility: visible;
  pointer-events: auto;
  transition: clip-path .4s ease, visibility 0s;
}
/* `.dropdown-arrow` turns while the panel is open. The export animated this in
   the same list; here the disclosure's own state drives it. */
.dropdown-arrow {
  transition: transform .4s ease;
}
[aria-expanded="true"] .dropdown-arrow {
  transform: rotate(180deg);
}
@media screen and (max-width: 991px) {
/* The design drops the centring translate here, so the panel's own left edge
     is where it sits. */
  .dd-navigation {
    left: auto;
  }
}
/* ========================================================================
   5. The FAQ accordion
   ======================================================================== */
/* `a-5` / `a-6`, which arrive as TAB_ACTIVE / TAB_INACTIVE because the export
   built the accordion on the tab widget. `.faq-answer-wrap` goes 0 <-> auto
   over 400ms and the two icons cross-fade.

   Same `grid-template-rows` trick as the dropdown: the panel's height is not
   measured, so a CMS answer of any length opens correctly. */
.faq-answer-wrap {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .4s ease;
}
.faq-tabs-link.is-active .faq-answer-wrap {
  grid-template-rows: 1fr;
}
.faq-answer-wrap > * {
  min-height: 0;
  overflow: hidden;
  /* `grid-template-rows: 0fr` collapses the item's CONTENT box and nothing
     else, so `.faq-answer`'s own `margin-top: 6px` survives the collapse and
     every closed answer leaves a 6px gap under its question. The margin
     travels with the panel. 6px is the design sheet's value, restated rather
     than invented -- see `.faq-answer`. */
  margin-top: 0;
  transition: margin-top .4s ease;
}
.faq-tabs-link.is-active .faq-answer-wrap > * {
  margin-top: 6px;
}
/* The plus and the minus are two images stacked in one square. */
.faq-icon._01 {
  opacity: 1;
  transition: opacity .4s ease;
}
.faq-icon._02 {
  opacity: 0;
  transition: opacity .4s ease;
}
.faq-tabs-link.is-active .faq-icon._01 {
  opacity: 0;
}
.faq-tabs-link.is-active .faq-icon._02 {
  opacity: 1;
}
/* The question is a <button> filling the row it used to be a <div> in. */
button.faq-question-wrap {
  width: 100%;
  padding: 0;
}
/* ========================================================================
   6. The product tab set
   ======================================================================== */
/* `.tabset-pane { display: none }` and `.tabset-pane.is-active { display:
   block }` both survive from the framework sheet, renamed. All this adds is the
   fade the widget's `data-duration-in="300"` asked for. */
.tabset-pane.is-active {
  animation: tab-in .3s ease both;
}
@keyframes tab-in {
from { opacity: 0; }
to { opacity: 1; }
}
/* ========================================================================
   7. The five sliders
   ======================================================================== */
/* Three animations, because the export configures three: `slide` translates the
   track (gear, trips), `fade` cross-fades slides stacked on each other
   (discover), and `outin` fades the old slide out BEFORE the new one fades in
   (both testimonial sliders). Collapsing them into one would be the most
   visible motion regression in the build. All five are `infinite` and none
   autoplays, which is what main.js implements. */

/* --- slide: one flex row, moved by whole slides -------------------------- */
[data-slider-mode="slide"] [data-slider-track] {
  display: flex;
  white-space: normal;
}
[data-slider-mode="slide"] .slider-slide {
  flex: 0 0 auto;
  display: block;
}
/* ON THE TRACK, NOT ON ITS CHILDREN.
   main.js moves the TRACK -- `track.style.transform = translateX(...)` -- so a
   transition declared on `[data-slider-track] > *` is attached to elements
   whose transform never changes, and the slider jumps to each slide instead of
   travelling to it. The children need no transition of their own; they are
   carried by the track.
   700ms `ease` is the export's own `data-duration` for the two `slide`
   sliders. */
[data-slider-mode="slide"] [data-slider-track] {
  transition: transform .7s ease;
}
/* A resize RE-MEASURES the offset and re-applies it, which is a correction
   rather than a move, so it must not animate. main.js adds this class for the
   frame in which it re-measures. */
[data-slider-mode="slide"] [data-slider-track].is-resizing {
  transition: none;
}
/* --- fade / outin: slides stacked, one visible --------------------------- */
[data-slider-mode="fade"] [data-slider-track], [data-slider-mode="outin"] [data-slider-track] {
  display: grid;
}
[data-slider-mode="fade"] .slider-slide, [data-slider-mode="outin"] .slider-slide {
  grid-area: 1 / 1;
  display: block;
  opacity: 0;
  visibility: hidden;
  transition: opacity .4s ease, visibility .4s ease;
}
[data-slider-mode="fade"] .slider-slide.is-current, [data-slider-mode="outin"] .slider-slide.is-current {
  opacity: 1;
  visibility: visible;
}
/* `outin` is the same two states with the incoming slide's fade delayed by the
   outgoing one's -- 400ms each way, as the payload says. */
[data-slider-mode="outin"] .slider-slide.is-current {
  transition-delay: .4s;
}
/* The first slide is put in place with transitions off -- otherwise the slider
   animates INTO its own rest state on load, and on the two `outin` sliders that
   animation carries a 400ms delay, so the section renders blank before it
   settles. main.js adds this for the one frame it needs. */
[data-slider].is-init [data-slider-track], [data-slider].is-init .slider-slide {
  transition: none;
}
so the runtime would have been building markup nothing ever
   showed. */
[data-slider-arrow][disabled] {
  opacity: .35;
  cursor: default;
}
@media (prefers-reduced-motion: reduce) {
[data-slider-mode] [data-slider-track], [data-slider-mode] .slider-slide {
    transition: none;
  }
}
/* --- the Discover slider's index list ------------------------------------ */
/* `a-50`..`a-54`: five SLIDER_ACTIVE events, one per slide, each turning one of
   five `.discover-slider-text._0N` labels dark-blood and the other four grey.
   The labels are a page-wide selector in the payload, and there is one set, so
   main.js sets `.is-current` on the matching label. */
.discover-slider-text {
  transition: color .4s ease;
}
.discover-slider-text.is-current {
  color: var(--dark-blood);
}
/* ========================================================================
   8. Hovers
   ======================================================================== */
/* Thirteen paired [In]/[Out] lists. A CSS `:hover` plays both directions, so
   each pair is one rule: the "in" list gives the hovered state and its duration, and the "out" list -- which is always the same values back at its own
   duration -- gives the rest transition. Where the two durations differ (500ms
   settling, 400ms arriving) the payload's own numbers are used.

   `:focus-within` is added to every one of them. The originals were pointer-only, so a keyboard user reaching a card got nothing at all. */

/* --- the nav underline (`a` / `a-2`) ------------------------------------- */
/* The rule enters from -102% and LEAVES to +100%, so it wipes across rather
   than retracing. That asymmetry is the whole effect and it is why the two
   lists are not mirror images. */
.nav-menu-link .nav-menu-line {
  transform: translateX(100%);
  transition: transform .4s ease;
}
.nav-menu-link:hover .nav-menu-line, .nav-menu-link:focus-visible .nav-menu-line {
  transform: translateX(0);
  transition-duration: .4s;
}
/* Rest is -102%, so the next hover enters from the left again. main.js resets
   it after the leave transition; the class keeps the sheet honest about where
   the rule parks. */
.nav-menu-link .nav-menu-line.is-reset {
  transform: translateX(-102%);
  transition: none;
}
/* --- `.primary-button` (`a-3` / `a-4`) ---------------------------------- */
/* The label rolls up 100% inside its `overflow: hidden` box while two arrow
   icons chase each other across by 200%. */
[data-hover~="primary-button"] .primary-btn-text {
  transition: transform .4s ease;
}
[data-hover~="primary-button"] .primary-btn-icon._01, [data-hover~="primary-button"] .primary-btn-icon._02 {
  transition: transform .4s ease;
}
[data-hover~="primary-button"] .primary-btn-icon._02 {
  transform: translateX(-200%);
}
[data-hover~="primary-button"]:hover .primary-btn-text, [data-hover~="primary-button"]:focus-visible .primary-btn-text {
  transform: translateY(-100%);
}
[data-hover~="primary-button"]:hover .primary-btn-icon._01, [data-hover~="primary-button"]:focus-visible .primary-btn-icon._01 {
  transform: translateX(200%);
}
[data-hover~="primary-button"]:hover .primary-btn-icon._02, [data-hover~="primary-button"]:focus-visible .primary-btn-icon._02 {
  transform: translateX(0);
}
/* --- `.idea-button` (`a-48` / `a-49`) ----------------------------------- */
/* One rule wipes out to +100% and back in from -100%, both 300ms. Four groups
   in the payload because IX2 has to write the jump-back as its own step; in CSS
   it is one keyframe pair. */
[data-hover~="idea-button"] .idea-btn-line {
  transform-origin: left center;
}
[data-hover~="idea-button"]:hover .idea-btn-line, [data-hover~="idea-button"]:focus-visible .idea-btn-line {
  animation: idea-line .6s ease both;
}
@keyframes idea-line {
0% { transform: translateX(0); }
49% { transform: translateX(100%); }
50% { transform: translateX(-100%); }
100% { transform: translateX(0); }
}
/* --- the contact form's submit (`a-7` / `a-8`) -------------------------- */
/* Button and icon chip cross to the primary colour together. The button half is
   a page-wide selector in the payload, which is safe: there is exactly one
   `.contact-submit-button` per page. */
[data-hover~="contact-submit"] .contact-submit-button, [data-hover~="contact-submit"] .contact-icon-wrap {
  transition: background-color .4s ease;
}
[data-hover~="contact-submit"]:hover .contact-submit-button, [data-hover~="contact-submit"]:focus-within .contact-submit-button, [data-hover~="contact-submit"]:hover .contact-icon-wrap, [data-hover~="contact-submit"]:focus-within .contact-icon-wrap {
  background-color: var(--primary-color);
}
/* --- the blog card (`a-9` / `a-10`) ------------------------------------- */
/* The thumbnail SHRINKS to 0.7 rather than growing -- the only card in the
   template that does. */
[data-hover~="blog-card"] .blog-image._02 {
  transition: transform .4s ease;
}
[data-hover~="blog-card"]:hover .blog-image._02, [data-hover~="blog-card"]:focus-visible .blog-image._02 {
  transform: scale(.7);
}
/* --- the shop card (`a-11` / `a-12`) ------------------------------------ */
[data-hover~="shop-card"] .shop-image {
  transition: transform .4s ease;
}
[data-hover~="shop-card"]:hover .shop-image, [data-hover~="shop-card"]:focus-visible .shop-image {
  transform: scale(1.1);
}
/* --- the event card (`a-13` / `a-14`) ----------------------------------- */
/* The copy rolls up 200% out of view and the button and the dark tint fade in
   behind it. */
[data-hover~="event-card"] .event-details-p-wrap {
  transform: translateY(-200%);
  transition: transform .4s ease;
}
[data-hover~="event-card"] .event-btn-wrap, [data-hover~="event-card"] .event-bg-wrap {
  opacity: 0;
  transition: opacity .4s ease;
}
[data-hover~="event-card"]:hover .event-details-p-wrap, [data-hover~="event-card"]:focus-within .event-details-p-wrap {
  transform: translateY(0);
}
[data-hover~="event-card"]:hover .event-btn-wrap, [data-hover~="event-card"]:focus-within .event-btn-wrap, [data-hover~="event-card"]:hover .event-bg-wrap, [data-hover~="event-card"]:focus-within .event-bg-wrap {
  opacity: 1;
}
/* --- the About feature card (`a-15` / `a-17`), >= 768px only ------------- */
/* A `-bg` block grows to full height behind the title, the title crosses grey
   to white, and the floating image fades up. The design already parks
   `.feature-single-bg` at `height: 0%` and `.feature-single-image` at
   `opacity: 0`, so the rest state needs no restating -- only the transitions
   and the hovered values. */
@media screen and (min-width: 768px) {
  [data-hover~="feature-card"] .feature-single-bg {
    transition: height .4s ease;
  }

  [data-hover~="feature-card"] .feature-single-title {
    transition: color .4s ease;
  }

  [data-hover~="feature-card"] .feature-single-image {
    transition: opacity .4s ease;
  }

  [data-hover~="feature-card"]:hover .feature-single-bg,
  [data-hover~="feature-card"]:focus-within .feature-single-bg {
    height: 100%;
  }

  [data-hover~="feature-card"]:hover .feature-single-title,
  [data-hover~="feature-card"]:focus-within .feature-single-title {
    color: var(--white);
  }

  [data-hover~="feature-card"]:hover .feature-single-image,
  [data-hover~="feature-card"]:focus-within .feature-single-image {
    opacity: 1;
  }
}
/* --- the Discover card (`a-19` / `a-20`) -------------------------------- */
[data-hover~="work-card"] .work-v2-overly-wrap {
  transition: height .4s ease;
}
[data-hover~="work-card"] .work-v2-icon {
  transition: transform .4s ease;
}
[data-hover~="work-card"] .work-v2-single-title {
  transition: color .4s ease;
}
[data-hover~="work-card"]:hover .work-v2-overly-wrap, [data-hover~="work-card"]:focus-within .work-v2-overly-wrap {
  height: 100%;
}
[data-hover~="work-card"]:hover .work-v2-icon, [data-hover~="work-card"]:focus-within .work-v2-icon {
  transform: translateY(-100%);
}
[data-hover~="work-card"]:hover .work-v2-single-title, [data-hover~="work-card"]:focus-within .work-v2-single-title {
  color: var(--background);
}
/* --- "How fast can you pitch it" (`a-21` / `a-22`), >= 768px only -------- */
/* THE REST STATE IS GATED WITH THE HOVER, and that is not a nicety. The design
   sheet gives `.fast-image-wrap` 428px at >= 992px but 400px at 768-991px --
   and IX2 forces 428px at BOTH, which is why the export ships its own
   `<style>` block wrapping that height in exactly these two media queries.
   Restating it ungated would make the card 428px on a phone, where the design
   says 300px, and no layout test could see it. */
@media screen and (min-width: 768px) {
  [data-hover~="fast-card"] .fast-image-wrap {
    height: 428px;
    transition: height .4s cubic-bezier(.215, .61, .355, 1);
  }

  [data-hover~="fast-card"]:hover .fast-image-wrap,
  [data-hover~="fast-card"]:focus-within .fast-image-wrap {
    height: 496px;
    transition-duration: .3s;
  }

  /* The black number swaps for the white one 200ms in, which is a
     GENERAL_DISPLAY pair in the payload -- so it is a hard swap, not a fade. */
  [data-hover~="fast-card"] .fast-number.white {
    display: none;
  }

  [data-hover~="fast-card"]:hover .fast-number.white,
  [data-hover~="fast-card"]:focus-within .fast-number.white {
    display: block;
    animation: fast-swap .2s step-end both;
  }

  [data-hover~="fast-card"]:hover .fast-number.black,
  [data-hover~="fast-card"]:focus-within .fast-number.black {
    animation: fast-swap-out .2s step-end both;
  }

  @keyframes fast-swap {
    from { visibility: hidden; }
    to   { visibility: visible; }
  }

  @keyframes fast-swap-out {
    from { visibility: visible; }
    to   { visibility: hidden; }
  }
}
/* ========================================================================
   9. Scroll-scrubbed sections
   ======================================================================== */
/* Three SCROLLING_IN_VIEW lists. main.js reads the section's progress through
   the viewport and writes it to `--progress` (0..1); the sheet does the
   arithmetic, so there is no inline style to fight with and the rest state is
   whatever `--progress: 0` computes to.

   Each is gated exactly as the payload gates it, REST STATE INCLUDED. */

/* `a-18`: the shop strip slides one full width across, between 30% and 70% of
   the section's pass. >= 768px. */
@media screen and (min-width: 768px) {
  [data-scrub~="shop-strip"] .shop-v2-flex-wrap {
    transform: translateX(calc(var(--scrub, 0) * -100%));
  }
}
/* `a-33`: two Discover cards rise 280px and 140px into place between 10% and
   30%. >= 992px only -- below that the design zeroes their negative margins, so there is nothing to rise into. */
@media screen and (min-width: 992px) {
  [data-scrub~="work-cards"] .work-v2-card-wrap._01 {
    transform: translateY(calc((1 - var(--scrub, 0)) * 280px));
  }

  [data-scrub~="work-cards"] .work-v2-card-wrap._02 {
    transform: translateY(calc((1 - var(--scrub, 0)) * 140px));
  }
}
/* `a-55`: the About story deck. Four slides and their index roll up 100% at a
   time while four dots take turns being dark-blood. Every breakpoint. The step
   is an integer main.js writes to `--step`, because the payload's keyframes are
   flat between changes -- it is a slide deck scrubbed by scroll, not a
   continuous move. */
[data-scrub~="story"] .story-single-slide, [data-scrub~="story"] .slider-number {
  transform: translateY(calc(var(--step, 0) * -100%));
  transition: transform .4s ease;
}
[data-scrub~="story"] .sotry-dots {
  transition: background-color .4s ease;
}
[data-scrub~="story"] .sotry-dots.is-current {
  background-color: var(--dark-blood);
}
@media (prefers-reduced-motion: reduce) {
[data-scrub~="story"] .story-single-slide, [data-scrub~="story"] .slider-number {
    transition: none;
  }
}
/* ========================================================================
   10. Pointer-driven
   ======================================================================== */
/* Two MOUSE_MOVE lists, both >= 768px. main.js writes the pointer's position
   across the trigger as `--px` (-1..1) and the sheet maps it onto the payload's
   own ranges. On a touch screen `--px` never changes, so both rest at 0, which
   is exactly where the payload's 50% keyframe puts them. */
@media screen and (min-width: 768px) {
  /* `a-16`: the feature card's image tracks the pointer -200%..200% and tilts
     -15..15 degrees. */
  [data-cursor~="feature-image"] .feature-single-image {
    transform: translateX(calc(var(--px, 0) * 200%))
               rotate(calc(var(--px, 0) * 15deg));
  }

  /* `a-47`: five investor chips scatter, each on its own axis and its own
     distance -- which is why this is five rules and not one. */
  [data-cursor~="investor-icons"] .investor-icon._01 {
    transform: translateX(calc(var(--px, 0) * 80px));
  }

  [data-cursor~="investor-icons"] .investor-icon._02 {
    transform: translateY(calc((1 - var(--px, 0)) * 40px));
  }

  [data-cursor~="investor-icons"] .investor-icon._03 {
    transform: translateX(calc((1 - var(--px, 0)) * 40px));
  }

  [data-cursor~="investor-icons"] .investor-icon._04 {
    transform: translateX(calc((1 - var(--px, 0)) * 50px));
  }

  [data-cursor~="investor-icons"] .investor-icon._05 {
    transform: translateY(calc((1 - var(--px, 0)) * 50px));
  }
}
@media (prefers-reduced-motion: reduce) {
[data-cursor~="feature-image"] .feature-single-image, [data-cursor] .investor-icon {
    transform: none;
  }
}
/* ========================================================================
   11. Split text (IX3)
   ======================================================================== */
/* The export's ONLY IX3 payload: two scroll-scrubbed `splitText` timelines that
   colour a paragraph character by character from #73726e to #212121 as it
   passes -- `.about-v1-details` on the home page (scrub 0.8) and
   `.officer-details` on the about page (scrub 2).

   GSAP, SplitText and ScrollTrigger were three more third-party scripts; main.js
   splits the text into spans and moves one index, and the sheet colours the
   characters before it. Splitting happens at the WORD, with characters inside:
   characters left as atomic inline-blocks are boxes the line breaker cannot
   break, so a word would split mid-syllable.

   The export hides the paragraph until IX3 initialises
   (`html.w-mod-js:not(.w-mod-ix3) :is(.about-v1-details) { visibility: hidden }`).
   That is not reproduced: the characters start at the colour the design sheet
   already gives the paragraph, so there is nothing to hide. */
.split-word {
  display: inline-block;
  white-space: nowrap;
}
.split-char {
  color: #73726e;
  transition: color .2s linear;
}
.split-char.is-lit {
  color: #212121;
}
@media (prefers-reduced-motion: reduce) {
.split-char {
    color: #212121;
    transition: none;
  }
}
/* ========================================================================
   12. The cart drawer
   ======================================================================== */
/* The design gives `.cart-container` its background and the framework sheet
   gives the wrapper its `leftSidebar` geometry; both survive the rename. All
   this adds is the open state and the transition the runtime animated. */
[data-cart-panel] {
  display: block;
  visibility: hidden;
  opacity: 0;
  transition: opacity .3s ease, visibility .3s ease;
}
[data-cart-panel].is-open {
  visibility: visible;
  opacity: 1;
}
/* `hidden` on the panel would beat everything, so it is only the no-JS state:
   main.js removes the attribute at startup and drives `.is-open` after that. */
[data-cart-panel][hidden] {
  display: none;
}
.remove-button {
  padding: 0;
  color: var(--gray-color);
  text-decoration: underline;
  font-size: .875rem;
}
/* A body that cannot scroll behind the open drawer or the open mobile menu. */
.no-scroll {
  overflow: hidden;
}
@media (prefers-reduced-motion: reduce) {
[data-cart-panel] {
    transition: none;
  }
}
/* ========================================================================
   13. Forms
   ======================================================================== */
/* The success and error blocks the runtime swapped in.
   ---------------------------------------------------------------------------
   Two rules are needed, not one, and each is load-bearing.

   `[hidden]` first, because the framework sheet gives `.wf-form-done` and
   `.wf-form-fail` a `display` of their own and a class beats the attribute --
   without `!important` a "hidden" block would be permanently visible.

   Then the SHOWN state, because removing the attribute is not enough either:
   `.wf-form-done { display: none }` is still there underneath, so main.js can
   take `hidden` off and the block stays invisible. That is exactly what the
   401 page did -- the right message, in the DOM, unhidden, and `display:
   none`. `:not([hidden])` scores one class higher than the framework rule it
   has to beat, and no higher. */
[hidden] {
  display: none !important;
}
.form-success:not([hidden]), .form-error:not([hidden]), [data-cart-error]:not([hidden]), [data-add-error]:not([hidden]), [data-add-soldout]:not([hidden]), [data-checkout-error]:not([hidden]) {
  display: block;
}