input,
:before,
:after,
* {
    box-sizing: border-box
}

audio,
canvas,
progress,
video {
    display: inline-block;
    vertical-align: baseline
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    display: none
}

input[type=number] {
    -moz-appearance: textfield;
    -webkit-appearance: textfield;
    appearance: textfield
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

input[type=search]::-ms-clear {
    display: none
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video,
button {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

body {
    line-height: 1
}

ol,
ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

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

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

a {
    text-decoration: none
}

button {
    background: transparent;
    border: none;
    box-shadow: none;
    cursor: pointer
}

.clearfix:after {
    content: "";
    display: table;
    clear: both
}

.hide,
.hidden {
    display: none
}

summary {
    list-style: none
}

summary::-webkit-details-marker {
    display: none
}

*:focus:not(:focus-visible) {
    outline: none !important
}

* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.visually-hidden {
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    overflow: hidden !important;
    position: absolute !important;
    white-space: nowrap !important;
    width: 1px !important
}

:root {
    --gutter-small: 15px;
    --gutter-regular: 25px;
    --gutter-large: 50px;
    --gutter-xlarge: 80px;
    --gutter-container: 40px;
    --sidebar-width: 420px;
    --sidebar-gutter: 40px;
    --full-height: 100vh;
    --button-padding-large: .9375rem 2.875rem;
    --button-padding-regular: .6875rem 2.25rem;
    --button-padding-regular-unmodified: .6875rem 2.25rem;
    --button-padding-small: .5rem 1.625rem;
    --button-checkout-size: 48px;
    --input-padding: .75rem;
    --button-product: 3.75rem;
    --button-checkout-product-size: 60px;
    --header-vertical-space: 20px;
    --container-vertical-space: var(--container-vertical-space-base);
    --grid-gap: var(--grid-gap-original-base)
}

@media screen and (max-width: 1280px) {
    :root {
        --gutter-small: 12px;
        --gutter-regular: 20px;
        --gutter-large: 35px;
        --gutter-xlarge: 60px;
        --container-vertical-space: calc(var(--container-vertical-space-base) * .8);
        --grid-gap: calc(var(--grid-gap-original-base) * .8)
    }
}

@media screen and (max-width: 1023px) {
    :root {
        --gutter-small: 9px;
        --gutter-regular: 15px;
        --gutter-large: 25px;
        --gutter-xlarge: 40px;
        --gutter-container: 30px;
        --button-padding-large: .75rem 2.5rem;
        --button-checkout-size: 46px;
        --sidebar-width: 375px;
        --sidebar-gutter: 20px;
        --header-vertical-space: 15px;
        --container-vertical-space: calc(var(--container-vertical-space-base) * .6);
        --grid-gap: calc(var(--grid-gap-original-base) * .5)
    }
}

@media screen and (max-width: 767px) {
    :root {
        --button-padding-large: .75rem 2rem;
        --button-padding-regular: .5rem 1.5rem;
        --button-padding-small: .375rem .875rem;
        --button-checkout-size: 40px;
        --input-padding: .5rem;
        --button-product: 3.125rem;
        --button-checkout-product-size: 50px;
        --gutter-container: 20px;
        --header-vertical-space: 10px
    }
}

@media screen and (max-width: 474px) {
    :root {
        --sidebar-width: 100%;
        --sidebar-gutter: 15px;
        --gutter-container: 15px
    }
}

.gutter--small {
    padding: var(--gutter-small)
}

.gutter--regular {
    padding: var(--gutter-regular)
}

.gutter--large {
    padding: var(--gutter-large)
}

.gutter--xlarge {
    padding: var(--gutter-xlarge)
}

.gutter-top--small {
    padding-top: var(--gutter-small)
}

.gutter-top--regular {
    padding-top: var(--gutter-regular)
}

.gutter-top--large {
    padding-top: var(--gutter-large)
}

.gutter-top--xlarge {
    padding-top: var(--gutter-xlarge)
}

.gutter-bottom--small {
    padding-bottom: var(--gutter-small)
}

.gutter-bottom--regular {
    padding-bottom: var(--gutter-regular)
}

.gutter-bottom--large {
    padding-bottom: var(--gutter-large)
}

.gutter-bottom--xlarge {
    padding-bottom: var(--gutter-xlarge)
}

.spacing--xsmall>* {
    margin-bottom: .25em
}

.spacing--xsmall>*.increased-spacing {
    margin-top: .75em;
    margin-bottom: .75em
}

.spacing--small>* {
    margin-bottom: .5em
}

.spacing--small>*.increased-spacing {
    margin-top: 1em;
    margin-bottom: 1em
}

.spacing--large>* {
    margin-bottom: .75em
}

.spacing--large>*.increased-spacing {
    margin-top: 1.5em;
    margin-bottom: 1.5em
}

.spacing--xlarge>* {
    margin-bottom: 1em
}

.spacing--xlarge>*.increased-spacing {
    margin-top: 2em;
    margin-bottom: 2em
}

.spacing--xxlarge>* {
    margin-bottom: 1.5em
}

.spacing--xxlarge>*.increased-spacing {
    margin-top: 3em;
    margin-bottom: 3em
}

.panel,
.card {
    /* border: solid var(--border-width-cards) var(--color-borders-cards); */
    /* border-radius: var(--border-radius-cards); */
    overflow: hidden;
    background-color: var(--color-background-cards);
    position: relative;
    color: var(--color-text-cards);
    box-shadow: var(--shadow-x-cards) var(--shadow-y-cards) var(--shadow-blur-cards) var(--color-shadow-cards);
    margin-bottom: calc(var(--shadow-y-cards) + var(--shadow-blur-cards));
    margin-inline-end: calc(var(--shadow-x-cards) + var(--shadow-blur-cards))
}

.has-negative-shadow-x .panel,
.has-negative-shadow-x .card {
    margin-inline-end: 0;
    margin-inline-start: calc(var(--shadow-x-cards) * -1 + var(--shadow-blur-cards))
}

.has-negative-shadow-y .panel,
.has-negative-shadow-y .card {
    margin-bottom: 0;
    margin-top: calc(var(--shadow-y-cards) * -1 + var(--shadow-blur-cards))
}

.card .button {
    color: var(--color-text-cards)
}

.card .button--solid {
    background-color: var(--color-text-header);
    border-color: var(--color-text-header);
    color: var(--color-foreground-header)
}

.card .button--icon svg * {
    stroke: var(--color-text-cards)
}

.no-touchevents .card .button:not(.button--outline-hover):hover {
    background-color: var(--color-accent-cards);
    border-color: var(--color-accent-cards);
    color: var(--color-foreground-accent-cards)
}

.no-touchevents .card .button:not(.button--outline-hover):hover svg * {
    stroke: var(--color-foreground-accent-cards)
}

.card .button--outline-hover:hover {
    border-color: var(--color-accent-cards);
    color: var(--color-accent-cards)
}

.card a {
    color: var(--color-text-cards)
}

.card .text-animation--underline {
    background-image: linear-gradient(to right, var(--color-text-cards), var(--color-text-cards))
}

@media screen and (max-width: 1023px) {

    .text-size--xsmall,
    .text-with-icon--tooltip .text-with-icon__label {
        font-size: calc(11px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {

    .text-size--xsmall,
    .text-with-icon--tooltip .text-with-icon__label {
        font-size: calc(12px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (max-width: 1023px) {
    .text-size--small {
        font-size: calc(12px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {
    .text-size--small {
        font-size: calc(14px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (max-width: 474px) {

    input,
    textarea,
    select,
    .text-size--regular {
        font-size: calc(14px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 475px) and (max-width: 1023px) {

    input,
    textarea,
    select,
    .text-size--regular {
        font-size: calc(15px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {

    input,
    textarea,
    select,
    .text-size--regular {
        font-size: calc(16px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (max-width: 1023px) {

    .shopify-challenge__container .shopify-challenge__message,
    .text-size--large {
        font-size: calc(16px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {

    .shopify-challenge__container .shopify-challenge__message,
    .text-size--large {
        font-size: calc(18px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (max-width: 474px) {
    .text-size--xlarge {
        font-size: calc(16px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 475px) and (max-width: 1023px) {
    .text-size--xlarge {
        font-size: calc(20px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {
    .text-size--xlarge {
        font-size: calc(24px / 16 * var(--base-body-size) + 0px)
    }
}

.text-size--heading {
    letter-spacing: var(--base-headings-spacing)
}

@media screen and (max-width: 1023px) {
    .text-size--heading {
        font-size: calc(38px / 60 * var(--base-headings-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {
    .text-size--heading {
        font-size: calc(42px / 60 * var(--base-headings-size) + 0px)
    }
}

.button--small {
    padding: var(--button-padding-small)
}

@media screen and (max-width: 474px) {
    .button--small {
        font-size: calc(14px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 475px) and (max-width: 1023px) {
    .button--small {
        font-size: calc(15px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {
    .button--small {
        font-size: calc(16px / 16 * var(--base-body-size) + 0px)
    }
}

.button--regular {
    padding: var(--button-padding-regular)
}

@media screen and (max-width: 1023px) {
    .button--regular {
        font-size: calc(16px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {
    .button--regular {
        font-size: calc(18px / 16 * var(--base-body-size) + 0px)
    }
}

.button--large {
    padding: var(--button-padding-large)
}

@media screen and (max-width: 1023px) {
    .button--large {
        font-size: calc(18px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {
    .button--large {
        font-size: calc(20px / 16 * var(--base-body-size) + 0px)
    }
}

.alert {
    display: inline-flex;
    padding: .875rem 1rem .75rem;
    margin-bottom: 1.125rem;
    border-radius: var(--border-radius-forms);
    border: 1px solid;
    line-height: 1.1;
    clear: left;
    align-items: center
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: var(--font-stack-headings);
    font-weight: var(--font-weight-headings);
    font-style: var(--font-style-headings);
    line-height: var(--base-headings-line);
    letter-spacing: var(--base-headings-spacing);
    margin-bottom: 1rem
}

@media screen and (max-width: 1023px) {

    h1,
    .h1 {
        font-size: calc(34px / 60 * var(--base-headings-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {

    h1,
    .h1 {
        font-size: calc(58px / 60 * var(--base-headings-size) + 0px)
    }
}

@media screen and (max-width: 1023px) {

    h2,
    .h2 {
        font-size: calc(28px / 60 * var(--base-headings-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {

    h2,
    .h2 {
        font-size: calc(42px / 60 * var(--base-headings-size) + 0px)
    }
}

@media screen and (max-width: 1023px) {

    h3,
    .h3 {
        font-size: calc(24px / 60 * var(--base-headings-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {

    h3,
    .h3 {
        font-size: calc(32px / 60 * var(--base-headings-size) + 0px)
    }
}

@media screen and (max-width: 1023px) {

    h4,
    .h4 {
        font-size: calc(20px / 60 * var(--base-headings-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {

    h4,
    .h4 {
        font-size: calc(24px / 60 * var(--base-headings-size) + 0px)
    }
}

@media screen and (max-width: 1023px) {

    h5,
    .h5 {
        font-size: calc(16px / 60 * var(--base-headings-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {

    h5,
    .h5 {
        font-size: calc(18px / 60 * var(--base-headings-size) + 0px)
    }
}

@media screen and (max-width: 1023px) {

    h6,
    .h6 {
        font-size: calc(15px / 60 * var(--base-headings-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {

    h6,
    .h6 {
        font-size: calc(16px / 60 * var(--base-headings-size) + 0px)
    }
}

a {
    color: var(--color-text-main)
}

body,
input,
textarea,
select {
    font-family: var(--font-stack-body);
    font-weight: var(--font-weight-body);
    font-style: var(--font-style-body);
    line-height: var(--base-body-line);
    letter-spacing: var(--base-body-spacing)
}

body {
    color: var(--color-text-main);
    background: var(--color-background-main)
}

@media screen and (max-width: 474px) {
    body {
        font-size: calc(14px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 475px) and (max-width: 1023px) {
    body {
        font-size: calc(15px / 16 * var(--base-body-size) + 0px)
    }
}

@media screen and (min-width: 1024px) {
    body {
        font-size: calc(16px / 16 * var(--base-body-size) + 0px)
    }
}

input,
textarea,
select {
    font-size: calc(16px / 16 * var(--base-body-size) + 0px)
}

.text-weight--bold {
    font-weight: var(--font-weight-body-bold)
}

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

.text-color--opacity {
    opacity: .62
}

.text-decoration--underline {
    text-decoration: underline
}

.text-decoration--line-through {
    text-decoration: line-through
}

.text-line-height--small {
    line-height: 1.1
}

.text-line-height--medium {
    line-height: 1.25
}

.text-style--italic {
    font-style: italic
}

.text-style--normal {
    font-style: normal
}

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

.text-align--center {
    text-align: center
}

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

.text-animation--underline {
    background-image: linear-gradient(to right, var(--color-text-main), var(--color-text-main));
    background-size: 0% 2px;
    background-repeat: no-repeat;
    display: inline;
    padding-bottom: 3px;
    transition: all .1s linear
}

html[dir=rtl] .text-animation--underline {
    background-position: right calc(1em + 3px)
}

html[dir=ltr] .text-animation--underline {
    background-position: left calc(1em + 3px)
}

.no-touchevents a:hover .text-animation--underline,
.no-touchevents button:hover .text-animation--underline {
    background-size: 100% 2px
}

@media screen and (max-width: 1023px) {
    a .text-animation--underline.underline-mobile {
        background-size: 100% 2px
    }
}

.text-animation--underline-thin {
    background-image: linear-gradient(to right, var(--color-text-main), var(--color-text-main));
    background-size: 0% 1px;
    background-repeat: no-repeat;
    display: inline;
    padding-bottom: 3px;
    transition: all .1s linear
}

html[dir=rtl] .text-animation--underline-thin {
    background-position: right calc(1em + 2px)
}

html[dir=ltr] .text-animation--underline-thin {
    background-position: left calc(1em + 2px)
}

.no-touchevents a:hover .text-animation--underline-thin,
.no-touchevents button:hover .text-animation--underline-thin {
    background-size: 100% 1px
}

@media screen and (max-width: 1023px) {
    a .text-animation--underline-thin.underline-mobile {
        background-size: 100% 1px
    }
}

.text-animation--underline-in-header {
    background-image: linear-gradient(to right, var(--color-accent-header), var(--color-accent-header));
    background-size: 0% 1px;
    background-repeat: no-repeat;
    display: inline;
    padding-bottom: 3px;
    transition: all .1s linear
}

html[dir=rtl] .text-animation--underline-in-header {
    background-position: right calc(1em + 2px)
}

html[dir=ltr] .text-animation--underline-in-header {
    background-position: left calc(1em + 2px)
}

.no-touchevents a:hover .text-animation--underline-in-header,
.no-touchevents button:hover .text-animation--underline-in-header {
    background-size: 100% 1px
}

@media screen and (max-width: 1023px) {
    a .text-animation--underline-in-header.underline-mobile {
        background-size: 100% 1px
    }
}

.text-with-icon {
    position: relative;
    color: var(--color-text-main);
    display: inline-flex;
    align-items: center;
    margin-inline-end: 1.25rem
}

.text-with-icon svg * {
    fill: var(--color-text-main)
}

.text-with-icon .text-animation--underline-thin {
    background-position: 100% calc(1em + 4px);
    padding-bottom: 0
}

.text-with-icon--compact {
    margin-inline-end: 1.875rem
}

.text-with-icon--compact .text-with-icon__icon {
    margin-inline-end: .625rem
}

.text-with-icon--compact .text-with-icon__icon--nolabel {
    margin-inline-end: 0
}

.text-with-icon--tooltip {
    position: relative;
    width: 2rem;
    height: 2rem;
    margin-inline-end: .625rem
}

.text-with-icon--tooltip .text-with-icon__label {
    position: absolute;
    top: -100%;
    left: 50%;
    width: max-content;
    transform: translate(-50%);
    background: var(--color-text-main);
    color: var(--color-background-main);
    padding: .0625rem .4375rem;
    border-radius: clamp(0px, var(--border-radius-buttons), 5px);
    opacity: 0;
    transition: opacity .12s linear;
    pointer-events: none
}

.product-item .text-with-icon--tooltip .text-with-icon__label {
    background: var(--color-text-cards);
    color: var(--color-background-cards)
}

.text-with-icon--tooltip .text-with-icon__label:after {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: transparent;
    border-top-color: var(--color-text-main);
    border-width: .3125rem;
    margin-inline-start: -.3125rem
}

.product-item .text-with-icon--tooltip .text-with-icon__label:after {
    border-top-color: var(--color-text-cards)
}

.text-with-icon--tooltip:hover .text-with-icon__label {
    opacity: 1
}

.text-with-icon__icon {
    display: flex;
    align-items: center;
    margin-inline-end: .5rem
}

.text-with-icon--small svg {
    width: 1.375rem;
    height: 1.375rem
}

.text-with-icon--large svg {
    width: 2rem;
    height: 2rem
}

.pill {
    display: inline-flex !important;
    pointer-events: none;
    color: var(--color-text-main);
    background: var(--color-third-background-main);
    padding: .25rem .375rem;
    border-radius: clamp(0px, var(--border-radius-buttons), 5px);
    align-items: center;
    position: relative
}

.pill__icon {
    width: 1.125rem;
    height: 1.125rem;
    margin-inline-end: .3125rem
}

.pill__icon--remove {
    width: 1rem;
    height: 1rem;
    display: flex;
    margin-inline-end: 0;
    margin-inline-start: .3125rem;
    position: relative;
    cursor: pointer;
    opacity: .78
}

.no-touchevents .pill__icon--remove:hover {
    opacity: 1
}

.pill__icon--remove:before {
    content: "";
    position: absolute;
    width: calc(100% + .625rem);
    height: calc(100% + .625rem);
    top: -.3125rem;
    left: -.3125rem
}

.pill__icon--remove svg * {
    stroke-width: 1px !important
}

.pill svg {
    width: 100%;
    height: 100%
}

.pill svg * {
    fill: transparent !important;
    stroke-width: 4px;
    stroke: var(--color-text-main)
}

#main a.text-link,
.rte a {
    color: var(--color-text-main);
    border-bottom: 1px solid;
    padding-bottom: 1px;
    transition: all .1s linear
}

.no-touchevents #main a.text-link:hover,
.no-touchevents .rte a:hover {
    color: var(--color-accent-main)
}

a.text-link {
    border-bottom: 1px solid;
    padding-bottom: 1px;
    transition: all .1s linear
}

.no-touchevents a.text-color--opacity:hover {
    opacity: 1
}

.text-link--has-icon {
    border: 0;
    display: inline-flex;
    align-items: center;
    gap: var(--gutter-small)
}

.text-link--has-icon svg path {
    fill: var(--color-text-main)
}

.text-link--has-icon span {
    border-bottom: solid 1px
}

del {
    text-decoration: line-through;
    opacity: .62
}

strong {
    font-weight: var(--font-weight-body-bold)
}

em {
    font-style: italic
}

p {
    margin-bottom: 1rem
}

.rte ul,
.rte ol {
    margin-top: .75rem;
    margin-bottom: 1em;
    margin-inline-start: 2em
}

.rte ul li:not(:first-child),
.rte ol li:not(:first-child) {
    margin-top: .75rem
}

.rte ul ul,
.rte ul ol,
.rte ol ul,
.rte ol ol {
    margin-inline-start: 2em
}

.rte ul {
    list-style: disc outside
}

.rte ul ul {
    list-style: circle outside
}

.rte ul ul ul {
    list-style: square outside
}

.rte ol {
    list-style: decimal outside
}

.rte blockquote {
    padding: .75rem 1.125rem;
    border-left: .1875rem solid var(--color-borders-main)
}

.rte blockquote:not(:first-child) {
    margin-top: 1.5rem
}

.rte blockquote:not(:last-child) {
    margin-bottom: 1.5rem
}

.rte img {
    max-width: 100%;
    height: auto
}

iframe[src*=youtube],
iframe[src*=vimeo] {
    width: 100%;
    height: 100%;
    aspect-ratio: 16/9
}

.remove-line-height-space {
    margin-bottom: calc(1em * var(--base-body-line) / -2 + .3125rem)
}

.remove-line-height-space--small {
    margin-bottom: -.55em
}

.remove-line-height-space--medium {
    margin-bottom: calc(-.625em + .3125rem)
}

.rte table {
    width: 100%;
    border: 1px solid var(--color-borders-main);
    margin-bottom: 1rem
}

html[dir=rtl] .rte table {
    text-align: right
}

html[dir=ltr] .rte table {
    text-align: left
}

.rte table tr {
    border-top: 1px solid var(--color-borders-main)
}

.rte table thead tr {
    border-top: none
}

.rte table th,
.rte table td {
    min-height: 41px;
    padding: 10px 14px 8px
}

html[dir=rtl] .rte table th,
html[dir=rtl] .rte table td {
    border-left: 1px solid var(--color-borders-main)
}

html[dir=ltr] .rte table th,
html[dir=ltr] .rte table td {
    border-right: 1px solid var(--color-borders-main)
}

.rte table td,
.rte table th {
    vertical-align: top
}

.jdgm-widget select,
#klaviyo-product-reviews-wrapper select {
    background-image: none !important
}

.container--small {
    margin: 0 auto;
    width: 100%;
    max-width: 667px;
    padding-inline-start: var(--gutter-container);
    padding-inline-end: var(--gutter-container)
}

.container--compact {
    margin: 0 auto;
    width: 100%;
    max-width: calc(var(--theme-max-width) * 867 / 1360);
    padding-inline-start: var(--gutter-container);
    padding-inline-end: var(--gutter-container)
}

.container--medium {
    margin: 0 auto;
    width: 100%;
    max-width: calc(var(--theme-max-width) * 1023 / 1360);
    padding-inline-start: var(--gutter-container);
    padding-inline-end: var(--gutter-container)
}

.container--large {
    margin: 0 auto;
    width: 100%;
    max-width: var(--theme-max-width);
    padding-inline-start: var(--gutter-container);
    padding-inline-end: var(--gutter-container)
}

.container--fullwidth {
    max-width: 100%;
    padding: 0
}

.container--vertical-space {
    margin-top: var(--container-vertical-space)
}

.container--vertical-space-grid {
    margin-top: var(--grid-gap)
}

.container--vertical-space-small {
    margin-top: clamp(2.5rem, var(--container-vertical-space), 5rem)
}

.container--vertical-space-xsmall {
    margin-top: calc(var(--container-vertical-space) * .5)
}

.container--no-margin-if-not-first:not(:first-of-type) {
    margin-top: 0
}

.container--remove-bottom-margin {
    margin-bottom: calc(var(--container-vertical-space) * -.5)
}

.shopify-section:last-child .container--fullwidth,
.shopify-section:last-child .container--has-background {
    margin-bottom: calc(var(--container-vertical-space) * -1)
}

.mount-slideshow:last-child .css-slider--bottom-navigation .css-slider-navigation-container {
    margin-bottom: -.75rem
}

#main .shopify-section:first-child .container--vertical-space:not(.container--fullwidth) {
    margin-top: clamp(24px, var(--container-vertical-space) / 2, 50px)
}

#main .shopify-section:first-child .container--fullwidth {
    margin-top: 0
}

.container--remove-margin-after+.container--remove-margin-before {
    margin-top: 0
}

.section--remove-bottom-margin-after+.shopify-section>.container--vertical-space:first-of-type {
    margin-top: 0
}

.container--negative-margin {
    margin-bottom: calc(var(--container-vertical-space) * -1)
}

.shopify-section {
    position: relative
}

.container--has-background {
    padding-top: var(--container-vertical-space);
    padding-bottom: var(--container-vertical-space)
}

@media screen and (max-width: 767px) {
    .container--has-background {
        padding-top: calc(var(--container-vertical-space) / 2);
        padding-bottom: calc(var(--container-vertical-space) / 2)
    }
}

.remove-empty-space>*:empty {
    display: none
}

.remove-empty-space>*:first-child {
    margin-top: 0
}

.remove-empty-space>*:last-child {
    margin-bottom: 0
}

.gutter-bottom--page {
    margin-bottom: calc(var(--gutter-large) * .8)
}

.margin-bottom--regular {
    margin-bottom: var(--gutter-regular)
}

.margin-bottom--large {
    margin-bottom: var(--gutter-large)
}

.margin-top--regular {
    margin-top: var(--gutter-regular)
}

.spacing--custom-xsmall>* {
    margin-bottom: calc(var(--gutter-small) / 2)
}

.spacing--custom-small>* {
    margin-bottom: var(--gutter-small)
}

.spacing--custom-large>* {
    margin-bottom: var(--gutter-regular)
}

.spacing--custom-xlarge>* {
    margin-bottom: calc(var(--gutter-large) * .8)
}

.spacing--custom-xxlarge>* {
    margin-bottom: calc(var(--gutter-large) * 1.1)
}

.align-content {
    display: flex;
    height: 100%;
    position: relative
}

.align-content--horizontal-left {
    justify-content: flex-start;
    text-align: start
}

.align-content--horizontal-center {
    justify-content: center;
    text-align: center
}

.align-content--horizontal-right {
    justify-content: flex-end;
    text-align: end
}

.align-content--vertical-top {
    align-items: flex-start
}

.align-content--vertical-middle {
    align-items: center
}

.align-content--vertical-bottom {
    align-items: flex-end
}

.element--wrap-paranth:before {
    content: " (";
    white-space: pre
}

.element--wrap-paranth:after {
    content: ") ";
    white-space: pre
}

.element--height-small {
    min-height: 40vh
}

.element--height-regular {
    min-height: 60vh
}

.element--height-large {
    min-height: 80vh
}

.element--body-bgc {
    background-color: var(--color-background-main)
}

.element--card-bgc {
    background-color: var(--color-background-cards)
}

.element--has-border {
    border-color: var(--color-borders-cards);
    border-width: var(--border-width-cards);
    border-style: solid
}

.element--has-border--body {
    border-color: var(--color-borders-main);
    border-width: var(--border-width-cards);
    border-style: solid
}

.element--has-shadow {
    box-shadow: var(--shadow-x-cards) var(--shadow-y-cards) var(--shadow-blur-cards) var(--color-shadow-cards);
    margin-bottom: var(--shadow-y-cards);
    margin-inline-end: var(--shadow-x-cards)
}

.has-negative-shadow-x .element--has-shadow {
    margin-inline-end: 0;
    margin-inline-start: calc(var(--shadow-x-cards) * -1 + var(--shadow-blur-cards))
}

.has-negative-shadow-y .element--has-shadow {
    margin-bottom: 0;
    margin-top: calc(var(--shadow-y-cards) * -1 + var(--shadow-blur-cards))
}

.element--has-border-thin {
    border-width: 1px
}

.element--no-border {
    border: 0
}

@media screen and (max-width: 767px) {
    .element--no-border-on-small {
        border: 0
    }
}

.element--border-radius {
    border-radius: var(--border-radius-cards);
    overflow: hidden
}

.element--border-radius .lazy-image:before,
.element--border-radius .lazy-image:after {
    border-radius: var(--border-radius-cards)
}

.element--border-radius img {
    border-radius: var(--border-radius-cards)
}

.element--border-radius-top {
    border-radius: var(--border-radius-cards) var(--border-radius-cards) 0 0
}

.element--border-radius-top .lazy-image:before,
.element--border-radius-top .lazy-image:after {
    border-radius: var(--border-radius-cards) 0 0
}

.element--border-radius-top img {
    border-radius: var(--border-radius-cards) var(--border-radius-cards) 0 0
}

.element--border-width-clamped {
    border-style: solid;
    border-width: clamp(0px, var(--border-width-cards), 1px)
}

.element--no-radius {
    border-radius: 0
}

.element--is-inline-block {
    display: inline-block
}

.element--display-none {
    display: none
}

@media screen and (max-width: 767px) {
    .element--hide-on-small {
        display: none !important
    }
}

@media screen and (min-width: 768px) {
    .element--hide-on-desk {
        display: none
    }
}

.element--align-self-center {
    align-self: center
}

.element--z-1 {
    z-index: 1
}

@media screen and (min-width: 768px) {
    .element--is-sticky {
        position: sticky !important;
        top: var(--col-gap)
    }
}

.element--overflow-hidden {
    overflow: hidden
}

.element--vertically-centered {
    top: 50%;
    transform: translateY(-50%);
    position: relative;
    width: 100%
}

@media screen and (min-width: 1024px) {
    .element--width-50 {
        width: 50%
    }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
    .element--width-50 {
        width: 60%
    }
}

@media screen and (max-width: 767px) {
    .element--width-50 {
        width: 70%
    }
}

@media screen and (max-width: 474px) {
    .element--width-50 {
        width: 100%
    }
}

@media screen and (min-width: 1024px) {
    .element--width-70 {
        width: 70%
    }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
    .element--width-70 {
        width: 75%
    }
}

@media screen and (max-width: 767px) {
    .element--width-70 {
        width: 80%
    }
}

@media screen and (max-width: 474px) {
    .element--width-70 {
        width: 100%
    }
}

.element--width-100 {
    width: 100%
}

.shopify-policy__container {
    width: 100%;
    max-width: var(--theme-max-width) !important;
    padding-left: var(--gutter-container) !important;
    padding-right: var(--gutter-container) !important;
    margin-top: clamp(2.5rem, var(--container-vertical-space), 4.375rem) !important
}

.shopify-policy__title {
    text-align: left !important
}

.grid {
    --col-gap: var(--grid-gap);
    --col-size: calc((100% - var(--col-gap) * (var(--visible-cols) - 1)) / var(--visible-cols));
    display: grid;
    grid-gap: var(--col-gap)
}

.grid-1 {
    --visible-cols: 1
}

.grid-2 {
    --visible-cols: 2
}

.grid-3 {
    --visible-cols: 3
}

.grid-4 {
    --visible-cols: 4
}

.grid-5 {
    --visible-cols: 5
}

.grid-6 {
    --visible-cols: 6
}

@media screen and (max-width: 1280px) {
    .grid-laptop-1 {
        --visible-cols: 1
    }
}

@media screen and (max-width: 1280px) {
    .grid-laptop-2 {
        --visible-cols: 2
    }
}

@media screen and (max-width: 1280px) {
    .grid-laptop-3 {
        --visible-cols: 3
    }
}

@media screen and (max-width: 1280px) {
    .grid-laptop-4 {
        --visible-cols: 4
    }
}

@media screen and (max-width: 1280px) {
    .grid-laptop-5 {
        --visible-cols: 5
    }
}

@media screen and (max-width: 1280px) {
    .grid-laptop-6 {
        --visible-cols: 6
    }
}

@media screen and (max-width: 1023px) {
    .grid-portable-1 {
        --visible-cols: 1
    }
}

@media screen and (max-width: 1023px) {
    .grid-portable-2 {
        --visible-cols: 2
    }
}

@media screen and (max-width: 1023px) {
    .grid-portable-3 {
        --visible-cols: 3
    }
}

@media screen and (max-width: 1023px) {
    .grid-portable-4 {
        --visible-cols: 4
    }
}

@media screen and (max-width: 1023px) {
    .grid-portable-5 {
        --visible-cols: 5
    }
}

@media screen and (max-width: 1023px) {
    .grid-portable-6 {
        --visible-cols: 6
    }
}

@media screen and (max-width: 767px) {
    .grid-lap-1 {
        --visible-cols: 1
    }
}

@media screen and (max-width: 767px) {
    .grid-lap-2 {
        --visible-cols: 2
    }
}

@media screen and (max-width: 767px) {
    .grid-lap-3 {
        --visible-cols: 3
    }
}

@media screen and (max-width: 767px) {
    .grid-lap-4 {
        --visible-cols: 4
    }
}

@media screen and (max-width: 767px) {
    .grid-lap-5 {
        --visible-cols: 5
    }
}

@media screen and (max-width: 767px) {
    .grid-lap-6 {
        --visible-cols: 6
    }
}

@media screen and (max-width: 474px) {
    .grid-palm-1 {
        --visible-cols: 1
    }
}

@media screen and (max-width: 474px) {
    .grid-palm-2 {
        --visible-cols: 2
    }
}

@media screen and (max-width: 474px) {
    .grid-palm-3 {
        --visible-cols: 3
    }
}

@media screen and (max-width: 474px) {
    .grid-palm-4 {
        --visible-cols: 4
    }
}

@media screen and (max-width: 474px) {
    .grid-palm-5 {
        --visible-cols: 5
    }
}

@media screen and (max-width: 474px) {
    .grid-palm-6 {
        --visible-cols: 6
    }
}

.grid--slider {
    grid-auto-flow: column;
    grid-template-columns: var(--col-size);
    grid-auto-columns: var(--col-size);
    position: relative
}

.grid--layout {
    grid-template-columns: repeat(var(--visible-cols), var(--col-size))
}

@media screen and (min-width: 1024px) {
    .grid--highlight-first-item {
        grid-template-columns: repeat(4, 1fr)
    }

    .grid--highlight-first-item div:first-child {
        grid-column-start: span 2
    }
}

@media screen and (max-width: 359px) {
    .grid-tiny-1:not(.kill-grid-tiny) {
        --visible-cols: 1
    }
}

@media screen and (max-width: 1280px) {
    .laptop-hide {
        display: none !important
    }

    .laptop-show {
        display: block
    }
}

@media screen and (max-width: 1023px) {
    .portable-hide {
        display: none !important
    }

    .portable-show {
        display: block
    }
}

@media screen and (max-width: 767px) {
    .lap-hide {
        display: none !important
    }

    .lap-show {
        display: block
    }
}

@media screen and (max-width: 474px) {
    .palm-hide {
        display: none !important
    }

    .palm-show {
        display: block
    }
}

.grid--gap-small {
    --col-gap: 18px
}

.grid--gap-large {
    --col-gap: calc(var(--gutter-xlarge) * .6)
}

.grid--gap-xlarge {
    --col-gap: calc(var(--gutter-xlarge) * .8)
}

.grid--gap-none {
    --col-gap: 0px
}

.grid--gap-bottom {
    row-gap: var(--gutter-xlarge)
}

.grid--no-stretch,
.grid--align-items-start {
    align-items: start
}

.grid--align-items-center {
    align-items: center
}

.grid--align-items-end {
    align-items: end
}

.grid--align-items-stretch {
    align-items: stretch
}

.grid-offset-1 {
    grid-column-start: span 1
}

.grid-offset-2 {
    grid-column-start: span 2
}

.grid-offset-3 {
    grid-column-start: span 3
}

.grid-offset-4 {
    grid-column-start: span 4
}

.grid-offset-5 {
    grid-column-start: span 5
}

.grid-offset-6 {
    grid-column-start: span 6
}

@media screen and (max-width: 1280px) {
    .grid-offset-laptop-1 {
        grid-column-start: span 1
    }
}

@media screen and (max-width: 1280px) {
    .grid-offset-laptop-2 {
        grid-column-start: span 2
    }
}

@media screen and (max-width: 1280px) {
    .grid-offset-laptop-3 {
        grid-column-start: span 3
    }
}

@media screen and (max-width: 1280px) {
    .grid-offset-laptop-4 {
        grid-column-start: span 4
    }
}

@media screen and (max-width: 1280px) {
    .grid-offset-laptop-5 {
        grid-column-start: span 5
    }
}

@media screen and (max-width: 1280px) {
    .grid-offset-laptop-6 {
        grid-column-start: span 6
    }
}

@media screen and (max-width: 1023px) {
    .grid-offset-portable-1 {
        grid-column-start: span 1
    }
}

@media screen and (max-width: 1023px) {
    .grid-offset-portable-2 {
        grid-column-start: span 2
    }
}

@media screen and (max-width: 1023px) {
    .grid-offset-portable-3 {
        grid-column-start: span 3
    }
}

@media screen and (max-width: 1023px) {
    .grid-offset-portable-4 {
        grid-column-start: span 4
    }
}

@media screen and (max-width: 1023px) {
    .grid-offset-portable-5 {
        grid-column-start: span 5
    }
}

@media screen and (max-width: 1023px) {
    .grid-offset-portable-6 {
        grid-column-start: span 6
    }
}

@media screen and (max-width: 767px) {
    .grid-offset-lap-1 {
        grid-column-start: span 1
    }
}

@media screen and (max-width: 767px) {
    .grid-offset-lap-2 {
        grid-column-start: span 2
    }
}

@media screen and (max-width: 767px) {
    .grid-offset-lap-3 {
        grid-column-start: span 3
    }
}

@media screen and (max-width: 767px) {
    .grid-offset-lap-4 {
        grid-column-start: span 4
    }
}

@media screen and (max-width: 767px) {
    .grid-offset-lap-5 {
        grid-column-start: span 5
    }
}

@media screen and (max-width: 767px) {
    .grid-offset-lap-6 {
        grid-column-start: span 6
    }
}

@media screen and (max-width: 474px) {
    .grid-offset-palm-1 {
        grid-column-start: span 1
    }
}

@media screen and (max-width: 474px) {
    .grid-offset-palm-2 {
        grid-column-start: span 2
    }
}

@media screen and (max-width: 474px) {
    .grid-offset-palm-3 {
        grid-column-start: span 3
    }
}

@media screen and (max-width: 474px) {
    .grid-offset-palm-4 {
        grid-column-start: span 4
    }
}

@media screen and (max-width: 474px) {
    .grid-offset-palm-5 {
        grid-column-start: span 5
    }
}

@media screen and (max-width: 474px) {
    .grid-offset-palm-6 {
        grid-column-start: span 6
    }
}

@media screen and (max-width: 1023px) {
    .portable--grid--slider {
        --col-gap: var(--grid-gap);
        --col-size: calc((100% - var(--col-gap) * (var(--visible-cols) - 1)) / var(--visible-cols)) !important;
        grid-auto-flow: column !important;
        grid-template-columns: var(--col-size) !important;
        grid-auto-columns: var(--col-size) !important
    }

    .portable--grid--slider.grid-1 {
        --visible-cols: 1
    }
}

.alert strong {
    text-transform: capitalize
}

.alert a {
    text-decoration: underline
}

.alert--error {
    background-color: #efe3e3;
    border-color: #e1d2d2;
    color: #000
}

.alert--success {
    background-color: #eef3eb;
    border-color: #d8e1d2;
    color: #000
}

.alert--blank {
    border-color: var(--color-borders-main)
}

.alert--note {
    background-color: var(--color-third-background-main);
    border-color: var(--color-borders-main);
    color: var(--color-text-main)
}

.alert--unstyled {
    background: transparent;
    border: none;
    padding: 0;
    margin: 0
}

.alert--circle {
    line-height: 1
}

.alert--circle:before {
    content: "";
    display: inline-block;
    width: .75rem;
    height: .75rem;
    border-radius: 100%;
    margin-inline-end: .625rem;
    position: relative;
    top: .125rem;
    flex-shrink: 0;
    align-self: flex-start
}

.alert--circle.alert--blank:before {
    border: 2px solid;
    opacity: .25
}

.alert--circle.alert--note:before {
    border: 2px solid;
    opacity: .5
}

.alert--circle.alert--success:before {
    background-color: #52c057
}

.alert--circle.alert--error:before {
    background-color: #e56d6d
}

.alert--circle.alert--circle-loading:before {
    animation: circle-bounce .4s linear infinite alternate
}

.alert__icon {
    width: 1.3125rem;
    height: 1.3125rem;
    display: inline-flex;
    float: left;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    position: relative;
    top: 0;
    margin-inline-end: .75rem;
    flex-shrink: 0;
    align-self: flex-start
}

.alert__icon svg * {
    fill: #fff !important;
    stroke: none !important
}

.alert--error .alert__icon {
    background-color: #e56d6d
}

.alert--success .alert__icon {
    background-color: #52c057
}

.card .alert:not(#product-page-form-error-cart-alert) {
    color: var(--color-text-cards)
}

.alert[onclick] {
    cursor: pointer
}

.alert--wide {
    width: 100%;
    display: flex
}

@keyframes circle-bounce {
    0% {
        border-width: 2px;
        opacity: .5
    }

    to {
        border-width: 4px;
        opacity: .25
    }
}

.button {
    text-align: center;
    display: inline-block;
    border-style: solid;
    border-radius: var(--border-radius-buttons);
    transition: all .1s linear;
    font-weight: var(--font-weight-buttons);
    letter-spacing: var(--base-body-spacing);
    line-height: 1.25;
    cursor: pointer;
    border-width: var(--border-width-buttons);
    color: var(--color-text-main);
    box-shadow: var(--shadow-x-buttons) var(--shadow-y-buttons) var(--shadow-blur-buttons) var(--color-shadow-buttons)
}

.button--regular-mobile {
    padding: var(--button-padding-regular-unmodified)
}

.button--fullwidth {
    width: 100%
}

.button--icon {
    align-items: center;
    display: inline-flex;
    position: relative;
    padding-inline-start: 3.3125rem
}

.button--icon span {
    line-height: 1
}

.button--icon .button__icon {
    width: 22px;
    height: 100%;
    position: absolute;
    top: 0;
    display: flex;
    pointer-events: none;
    align-items: center
}

html[dir=rtl] .button--icon .button__icon {
    right: 1.25rem
}

html[dir=ltr] .button--icon .button__icon {
    left: 1.25rem
}

.button--icon svg {
    width: 22px;
    height: 100%
}

.button--icon svg * {
    stroke: var(--color-text-main);
    transition: all .1s linear
}

.button--loader {
    position: relative
}

.button--loader .button__preloader {
    position: absolute;
    margin: 0;
    width: 20px;
    height: 20px;
    transform: translate3d(-50%, -50%, 0);
    top: 50%;
    left: 50%;
    display: none
}

.button--loader .button__preloader-element {
    animation: rotate 2s linear infinite;
    height: 100%;
    transform-origin: center center;
    width: 100%;
    position: absolute;
    top: 0;
    margin: auto
}

html[dir=rtl] .button--loader .button__preloader-element {
    right: 0
}

html[dir=ltr] .button--loader .button__preloader-element {
    left: 0
}

.button--loader .button__preloader-element circle {
    stroke-dasharray: 150, 200;
    stroke-dashoffset: -10;
    animation: dash 1.5s ease-in-out infinite;
    stroke-linecap: round
}

.button--loader.button--outline circle {
    stroke: var(--color-text-main)
}

.button--loader.button--solid circle {
    stroke: var(--color-foreground-main)
}

.card .button--loader circle {
    stroke: var(--color-text-cards)
}

.button--loader.working {
    pointer-events: none
}

.button--loader.working .button__text {
    opacity: 0
}

.button--loader.working .button__preloader {
    display: block
}

.button--outline {
    background-color: transparent
}

.button--solid {
    background-color: var(--color-text-main);
    border-color: var(--color-text-main);
    color: var(--color-foreground-main)
}

.button--no-padding {
    padding: 0
}

.no-touchevents .button:not(.button--outline-hover):hover {
    background-color: var(--color-accent-main);
    border-color: var(--color-accent-main);
    color: var(--color-foreground-accent-main)
}

.no-touchevents .button:not(.button--outline-hover):hover svg * {
    stroke: var(--color-foreground-accent-main)
}

.no-touchevents .button--outline-hover:not(.button--no-hover):hover {
    border-color: var(--color-accent-main);
    color: var(--color-accent-main)
}

.button:focus-visible {
    box-shadow: 0 0 0 3px var(--color-secondary-background-main)
}

.button--invisibile-trigger {
    display: block !important;
    position: absolute;
    width: 50px;
    height: 100%;
    top: 0;
    opacity: 0
}

a.button__icon {
    padding-top: 1px
}

.flex-buttons {
    position: relative;
    display: flex;
    flex-flow: row wrap;
    width: calc(100% + .625rem);
    margin-inline-start: -.3125rem;
    margin-top: .625rem !important
}

.flex-buttons>* {
    margin: .625rem .3125rem 0;
    flex: auto;
    width: auto
}

@-webkit-keyframes rotate {
    to {
        transform: rotate(360deg)
    }
}

@keyframes rotate {
    to {
        transform: rotate(360deg)
    }
}

@-webkit-keyframes dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0
    }

    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35
    }

    to {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0
    }

    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35
    }

    to {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124
    }
}

.main-go-top {
    position: fixed;
    bottom: var(--gutter-regular);
    display: flex;
    width: 2.75rem;
    height: 2.75rem;
    align-items: center;
    justify-content: center;
    border-style: solid;
    border-radius: var(--border-radius-buttons);
    border-width: var(--border-width-buttons);
    border-color: var(--color-borders-main);
    background: var(--color-background-main);
    cursor: pointer;
    transform: translateY(200%);
    transition: .25s linear transform;
    z-index: 99
}

html[dir=rtl] .main-go-top {
    left: var(--gutter-regular)
}

html[dir=ltr] .main-go-top {
    right: var(--gutter-regular)
}

.main-go-top__icon svg {
    transform: scaleY(-1);
    transform-origin: 0% 40%
}

.main-go-top__icon path {
    fill: var(--color-text-main)
}

.main-go-top.show {
    transform: translateY(0)
}

shopify-accelerated-checkout,
shopify-accelerated-checkout-cart {
    --shopify-accelerated-checkout-button-border-radius: var(--border-radius-buttons);
    --shopify-accelerated-checkout-skeleton-background-color: var(--color-text-main)
}

shopify-accelerated-checkout-cart {
    --shopify-accelerated-checkout-button-block-size: var(--button-checkout-size)
}

shopify-accelerated-checkout {
    --shopify-accelerated-checkout-button-block-size: var(--button-checkout-product-size)
}

.sidebar .additional-checkout-buttons {
    margin-top: .75rem !important
}

@media screen and (max-width: 474px) {
    .sidebar .additional-checkout-buttons {
        margin-top: .5rem !important
    }
}

.template-cart .additional-checkout-buttons {
    margin-top: .5rem !important
}

.block-image a {
    display: block
}

.block-image__figure {
    height: var(--image-height)
}

@media screen and (max-width: 767px) {
    .block-image__figure {
        height: max(60px, var(--image-height) * .75)
    }
}

@media screen and (max-width: 474px) {
    .block-image__figure {
        height: max(40px, var(--image-height) * .5)
    }
}

.block-image__figure:not(.lazyloaded) img {
    opacity: 0
}

.block-image__figure img,
.block-image__figure svg {
    transition: opacity .1s linear;
    height: 100%;
    width: auto
}

.block-image__figure .onboarding-svg {
    height: 100%;
    aspect-ratio: 1;
    width: var(--image-height)
}

@media screen and (max-width: 767px) {
    .block-image__figure .onboarding-svg {
        width: max(60px, var(--image-height) * .75)
    }
}

@media screen and (max-width: 474px) {
    .block-image__figure .onboarding-svg {
        width: max(40px, var(--image-height) * .5)
    }
}

.content-group {
    display: flex !important;
    flex-flow: row wrap;
    align-items: center;
    justify-content: var(--horizontal-alignment)
}

.content-group>* {
    width: auto
}

@media screen and (max-width: 474px) {
    .content-group>* {
        flex: auto
    }
}

.content-group>* {
    display: inline-block
}

.divider {
    display: inline-block;
    width: 100%;
    border-top: var(--divider-style) var(--divider-height) var(--divider-color);
    margin: var(--divider-vertical-space) 0;
    height: 0;
    background-repeat: repeat-x;
    background-position: 0 center;
    background-size: contain
}

.divider--small {
    width: 3.125rem
}

.divider--medium,
.divider--large {
    width: 6.25rem
}

.grid--layout-items {
    grid-auto-flow: row;
    grid-auto-rows: 1fr;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    --grid-base: 6;
    --grid-aspect: 1;
    --min-row-height: calc(min(var(--theme-max-width) - (var(--gutter-container) * 2), calc(100vw - (var(--gutter-container) * 2))) / var(--grid-base) * var(--grid-aspect))
}

@media screen and (min-width: 768px) {
    .grid--layout-items {
        grid-template-columns: repeat(12, minmax(0, 1fr))
    }
}

@media screen and (max-width: 767px) {
    .grid--layout-items {
        --grid-base: 2;
        --grid-aspect: var(--grid-aspect-mobile) !important
    }
}

.container--fullwidth .grid--layout-items {
    --min-row-height: calc(100vw / var(--grid-base) * var(--grid-aspect))
}

.block-grid-item {
    grid-area: span var(--row-mobile)/span var(--column-mobile);
    height: 100%;
    min-height: calc(var(--row-mobile) * var(--min-row-height))
}

@media screen and (min-width: 768px) {
    .block-grid-item {
        grid-area: span var(--row-desktop)/span var(--column-desktop);
        min-height: calc(var(--row-desktop) * var(--min-row-height))
    }
}

@media screen and (min-width: 640px) {
    .block-grid-item .card__text {
        max-width: var(--card-text-width);
        position: relative
    }
}

@media screen and (max-width: 767px) {
    .grid--layout-flex.mobile-autoheight .block-flex-item .card__image {
        min-height: auto;
        height: auto
    }
}

.grid--layout-flex .card__image {
    min-height: var(--image-height-mobile);
    height: var(--image-height-mobile)
}

@media screen and (min-width: 768px) {
    .grid--layout-flex .card__image {
        min-height: var(--image-height-desktop);
        height: var(--image-height-desktop)
    }
}

.grid--layout-flex .video-component {
    border-radius: 0
}

.grid--layout-flex {
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

@media screen and (min-width: 768px) {
    .grid--layout-flex {
        grid-template-columns: repeat(12, 1fr)
    }
}

@media screen and (max-width: 767px) {
    .grid--layout-flex {
        grid-gap: calc(var(--col-gap) + var(--shadow-y-cards))
    }
}

.grid--layout-flex .block-flex-item {
    grid-column: span 2;
    height: 100%
}

@media screen and (min-width: 768px) {
    .grid--layout-flex .block-flex-item {
        grid-column: span var(--column-desktop)
    }
}

.star-rating {
    font-size: 0;
    width: 100%;
    height: 1rem;
    display: grid;
    grid-template-columns: max-content auto;
    align-items: center;
    gap: .625rem
}

.star-rating__stars {
    background-repeat: repeat-x;
    font-size: 0;
    display: inline-block;
    text-align: start
}

.star-rating__stars-active {
    display: inline-block;
    font-size: 0;
    height: .875rem;
    background-repeat: repeat-x
}

.star-rating--block {
    justify-content: var(--horizontal-alignment)
}

.card--no-sideborders {
    border-left: 0;
    border-right: 0
}

.card--no-radius {
    border-radius: 0;
    --border-radius-cards: 0
}

.card--no-shadow {
    box-shadow: none;
    margin: 0 !important
}

.card--no-borders {
    border: 0
}

.card--fullwidth {
    width: 100%;
    height: 80lvh;
    min-height: 450px;
}

.card__icon {
    width: 3.125rem;
    margin: 0 auto;
    background-color: transparent;
    overflow: hidden;
    position: relative;
    width: 100%;
    aspect-ratio: 1
}

.card__icon a {
    width: 100%;
    height: 100%;
    display: block
}

.card__icon svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50%;
    height: 50%
}

.card__icon svg path {
    stroke: #000
}

.card__icon-size--small {
    max-width: 120px
}

.card__icon-size--regular {
    max-width: 100px
}

.card__icon-size--large {
    max-width: 220px
}

@media screen and (max-width: 1023px) {
    .card__icon-size--large {
        width: 160px
    }
}

.card__icon-crop--fit img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain;
    object-position: center
}

@media screen and (max-width: 474px) {
    .card__icon {
        max-width: 120px
    }
}

.card__icon--is-img img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) !important;
    width: 50%;
    height: 50%
}

.card__image {
    height: 0;
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%
}

.card__image svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #00000014
}

.card__image--background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.card__image--with-overlay:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-background-cards);
    opacity: .36;
    border-radius: var(--border-radius-cards);
    z-index: 9
}

.card__text {
    z-index: 99;
    word-wrap: break-word;
    word-break: break-word
}

.card__text>* {
    display: block
}

@media screen and (max-width: 767px) {
    .card__text.gutter--xlarge {
        padding: var(--gutter-large)
    }
}

.card__text:empty {
    display: none
}

.card__whole-link {
    display: block;
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 100;
    cursor: pointer
}

.card__whole-link:focus-visible {
    outline: none
}

.card__whole-link:focus-visible .card__text {
    outline: auto 5px -webkit-focus-ring-color
}

.card__whole-link--alternate~.card__image img,
.card__whole-link--alternate~.card__image video {
    transform: scale(1);
    transition: transform .3s ease-in-out, opacity .3s linear !important
}

.card__whole-link--alternate:focus-visible~.card__image:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 101;
    border-radius: var(--border-radius-cards);
    box-shadow: inset 0 0 0 3px #5475cfe6
}

.no-touchevents .card__whole-link--alternate:hover~.card__image img,
.no-touchevents .card__whole-link--alternate:hover~.card__image video {
    transform: scale(1.05);
    transition: transform .3s ease-out, opacity .3s !important
}

.collection-item--button {
    display: flex;
    align-items: center;
    gap: .3125rem
}

.collection-item--button .card__image {
    height: auto;
    padding-top: 0 !important;
    aspect-ratio: var(--aspect-ratio);
    width: 8.125rem;
    border-radius: var(--border-radius-cards) 0 0 var(--border-radius-cards)
}

html[dir=rtl] .collection-item--button .card__text {
    text-align: right
}

html[dir=ltr] .collection-item--button .card__text {
    text-align: left
}

.card-widget {
    border: solid var(--border-width-cards) var(--widget-borders-color);
    border-radius: var(--border-radius-cards);
    position: relative;
    z-index: 0;
    color: var(--color-text-main);
    background-color: var(--color-background-main)
}

.card-widget.card-widget--layout-compact {
    border: 0;
    border-radius: 0;
    background-color: transparent
}

.card-widget.card-widget--layout-compact .toggle__icon {
    top: .375rem !important
}

html[dir=rtl] .card-widget.card-widget--layout-compact .toggle__icon {
    left: 0 !important
}

html[dir=ltr] .card-widget.card-widget--layout-compact .toggle__icon {
    right: 0 !important
}

.card-widget.card-widget--layout-compact .toggle__icon svg {
    top: 0 !important;
    transform: translate(0) !important
}

html[dir=rtl] .card-widget.card-widget--layout-compact .toggle__icon svg {
    right: 0 !important
}

html[dir=ltr] .card-widget.card-widget--layout-compact .toggle__icon svg {
    left: 0 !important
}

.card-widget.card-widget--layout-compact+.card-widget.card-widget--layout-compact.card-widget--layout-compact {
    border-top: solid var(--widget-borders-color) 1px;
    padding-top: 1.25rem
}

.card-widget_clickable-overlay {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 4
}

.card-widget__header {
    background-color: var(--color-background-widget-header);
    display: flex;
    position: relative;
    gap: .75rem;
    width: 100%;
    min-height: 3.75rem;
    padding: 1.1875rem calc(var(--gutter-regular) * .9) 1.125rem;
    border-top-left-radius: var(--border-radius-cards);
    border-top-right-radius: var(--border-radius-cards);
    border-bottom: solid var(--border-width-cards) var(--widget-borders-color)
}

@media screen and (max-width: 1023px) {
    .card-widget__header {
        padding-top: .9375rem;
        padding-bottom: .9375rem;
        min-height: 3.3125rem
    }
}

@media screen and (max-width: 767px) {
    .card-widget__header {
        padding-top: .625rem;
        padding-bottom: .625rem;
        min-height: 2.8125rem
    }
}

.card-widget--is-collapsible .card-widget__header {
    border-top-left-radius: var(--border-radius-cards);
    border-top-right-radius: var(--border-radius-cards);
    transition: border-radius 50ms linear .15s
}

[aria-expanded=true] .card-widget__header {
    border-bottom: solid var(--border-width-cards) var(--widget-borders-color)
}

[aria-expanded=false] .card-widget__header {
    border: 0;
    border-bottom-left-radius: var(--border-radius-cards);
    border-bottom-right-radius: var(--border-radius-cards)
}

.card-widget--layout-boxed .toggle.opened .card-widget__header {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    transition: border-radius 50ms linear
}

.card-widget--layout-compact .card-widget__header {
    padding: 0;
    min-height: 0;
    border-radius: 0;
    border: 0;
    margin-bottom: calc(var(--gutter-regular) * .9);
    background-color: transparent
}

.card-widget--is-collapsible .card-widget__header {
    padding-inline-end: 4rem
}

.card-widget--is-collapsible.card-widget--layout-compact .card-widget__header {
    margin-bottom: 0
}

.card-widget--no-content .card-widget__header {
    border: 0;
    border-radius: var(--border-radius-cards)
}

.card-widget--no-content .card-widget__header p:last-child {
    margin: 0
}

.card-widget--no-content .card-widget__header a {
    text-decoration: underline;
    border-bottom: 0 !important
}

.card-widget__header-icon {
    max-height: 1.5rem;
    max-width: 1.5rem;
    align-self: flex-start
}

.card-widget__header-icon svg {
    max-height: 1.5rem;
    max-width: 1.5rem
}

.card-widget__header-icon svg path {
    stroke: var(--color-text-main)
}

.card-widget__header-icon img {
    max-height: 1.5rem;
    max-width: 1.5rem
}

.card-widget__header-text {
    display: grid;
    align-items: center;
    grid-template-columns: 100%
}

.card-widget__header-text__title {
    display: inline-flex;
    align-items: center;
    gap: .625rem;
    width: 100%;
    line-height: 1;
    word-break: break-word;
    font-weight: var(--font-weight-body-bold);
    color: var(--color-text-main)
}

.card-widget--layout-compact .card-widget__header-text__title {
    margin-top: 0
}

.card-widget__header-text__subtitle {
    display: inline-flex;
    align-items: start;
    gap: .625rem;
    width: 100%;
    line-height: 1.2;
    margin-top: .25rem;
    word-break: break-word;
    color: var(--color-text-main)
}

.card-widget__header-info {
    position: relative;
    align-self: center;
    z-index: 5
}

.card-widget__header-info svg circle {
    stroke: var(--color-text-main)
}

.card-widget__header-info svg path {
    fill: var(--color-text-main)
}

.card-widget__header-info p {
    margin-bottom: .625rem
}

.card-widget__header-info p:last-child {
    margin: 0
}

.card-widget__header-info a {
    color: var(--color-background-cards);
    text-decoration: underline
}

.card-widget__header-info .text-with-icon--tooltip {
    width: 1.5rem;
    height: 1.5rem;
    margin: 0
}

.card-widget__header-info .text-with-icon__label {
    padding: var(--gutter-small);
    top: -.875rem;
    max-width: 13.75rem;
    transform: translate(-50%, -100%);
    background-color: var(--color-background-tooltip);
    color: var(--color-foreground-tooltip);
    line-height: 1.2;
    border: none;
    box-shadow: 10px 10px 20px #00000026
}

.card-widget__header-info .text-with-icon__label:after {
    border-top-color: var(--color-background-tooltip);
    border-width: .625rem;
    margin-inline-start: -.625rem;
    margin-top: -1px
}

@media screen and (max-width: 474px) {
    .card-widget__header-info .text-with-icon__label {
        transform: translateY(-100%);
        left: auto;
        right: -1.5rem
    }

    .card-widget__header-info .text-with-icon__label:after {
        right: 1.625rem;
        left: auto
    }
}

.card-widget__content {
    padding: calc(var(--gutter-regular) * .9);
    border-bottom-left-radius: var(--border-radius-cards);
    border-bottom-right-radius: var(--border-radius-cards)
}

.card-widget--layout-compact .card-widget__content {
    border-radius: 0
}

.card-widget--layout-compact.card-widget--is-collapsible .card-widget__content {
    padding-top: calc(var(--gutter-regular) * .9)
}

.card-widget__content>div:not(:last-child) {
    margin-bottom: 1.25rem
}

.card-widget__content p {
    word-break: break-word
}

.card-widget--layout-compact .card-widget__content {
    padding: 0;
    background-color: transparent
}

.card-widget--no-padding .card-widget__content,
.card-widget .toggle__title {
    padding: 0
}

.card-widget .toggle__title .toggle__icon {
    position: absolute;
    top: 1.625rem;
    display: inline-block;
    width: .8125rem;
    height: .5rem
}

html[dir=rtl] .card-widget .toggle__title .toggle__icon {
    left: calc(var(--gutter-regular) * .9)
}

html[dir=ltr] .card-widget .toggle__title .toggle__icon {
    right: calc(var(--gutter-regular) * .9)
}

@media screen and (max-width: 767px) {
    .card-widget .toggle__title .toggle__icon {
        top: 1.1875rem
    }
}

.card-widget .toggle__title .toggle__icon svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-height: 1.5rem;
    max-width: 1.5rem
}

.card-widget .toggle__title .toggle__icon svg path {
    fill: var(--color-text-main)
}

.card-widget .toggle__title+.toggle__content {
    padding: 0
}

.card-widget .toggle--table {
    border: 0
}

.element--border-radius .toggle__content,
.card-widget--layout-boxed .toggle__content {
    border-bottom-left-radius: var(--border-radius-cards);
    border-bottom-right-radius: var(--border-radius-cards)
}

input,
textarea,
select {
    background-color: var(--color-background-main);
    border: var(--border-width-forms) solid var(--color-borders-forms-primary);
    border-radius: var(--border-radius-forms);
    color: var(--color-text-main);
    resize: none;
    padding: var(--input-padding);
    vertical-align: middle;
    -webkit-appearance: none;
    outline: none !important;
    transition: all .1s linear
}

input::placeholder,
textarea::placeholder,
select::placeholder {
    color: var(--color-text-main);
    opacity: .66;
    transition: all .1s linear
}

.no-touchevents input:hover,
input:focus,
.no-touchevents textarea:hover,
textarea:focus,
.no-touchevents select:hover,
select:focus {
    border-color: var(--color-borders-forms-secondary)
}

input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    box-shadow: 0 0 0 .1875rem var(--color-secondary-background-main)
}

.site-header-container input,
.site-header-container textarea,
.site-header-container select {
    color: var(--color-text-header);
    background: transparent
}

textarea {
    height: 7.8125rem;
    line-height: 1.4;
    padding-top: .625rem
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    appearance: none
}

input[type=number] {
    -moz-appearance: textfield
}

input:not([type=checkbox]):not([type=radio]):not([type=submit]):-webkit-autofill,
input:not([type=checkbox]):not([type=radio]):not([type=submit]):-webkit-autofill:hover,
input:not([type=checkbox]):not([type=radio]):not([type=submit]):-webkit-autofill:focus,
input:not([type=checkbox]):not([type=radio]):not([type=submit]):-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1.875rem var(--color-background-main) inset !important
}

input[type=checkbox],
input[type=radio] {
    width: 20px;
    height: 20px
}

input[type=checkbox]:not(.styled-checkbox) {
    -moz-appearance: checkbox;
    -webkit-appearance: checkbox;
    appearance: checkbox
}

input[type=radio]:not(.styled-radio) {
    -moz-appearance: radio;
    -webkit-appearance: radio;
    appearance: radio
}

.styled-checkbox,
.styled-radio {
    width: 20px;
    height: 20px;
    border-radius: 5px;
    padding: 0;
    margin: 0;
    position: relative
}

.styled-checkbox:before,
.styled-radio:before {
    content: "";
    clip-path: polygon(86% 11%, 39% 67%, 12% 43%, 0% 57%, 40% 95%, 100% 22%);
    transform-origin: top left;
    background-color: var(--color-background-main);
    background-size: contain;
    width: 70%;
    height: 70%;
    transform: scale(0) translate(-50%, -50%);
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    transition: transform ease .25s
}

.styled-checkbox:checked,
.styled-radio:checked {
    background: var(--color-text-main)
}

.styled-checkbox:checked:before,
.styled-radio:checked:before {
    transform: scale(1) translate(-50%, -50%)
}

select {
    background-repeat: no-repeat;
    background-position: calc(100% - 1.5rem) center;
    background-size: .8125rem .5rem;
    padding: var(--input-padding);
    width: 100%;
    cursor: pointer;
    text-align: start;
    transition: border .1s linear;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none
}

html[dir=rtl] select {
    background-position: 1.25rem center
}

html[dir=rtl] select {
    padding-left: 3.3125rem;
    padding-right: 1rem
}

html[dir=ltr] select {
    padding-right: 3.3125rem;
    padding-left: 1rem
}

input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
    -webkit-appearance: none
}

.form-field label {
    display: block;
    margin-bottom: .375rem
}

.form-field input,
.form-field textarea {
    width: 100%
}

.shopify-challenge__container {
    background-color: #00000003;
    border: solid 1px rgba(0, 0, 0, .1);
    border-radius: .625rem;
    padding: var(--gutter-large) 0;
    margin-top: 100px !important
}

.shopify-challenge__container .shopify-challenge__message {
    padding: var(--gutter-large) 0 var(--gutter-small)
}

.shopify-challenge__container input[type=submit] {
    background-color: var(--color-accent-main);
    border-color: var(--color-accent-main);
    color: var(--color-foreground-accent-main);
    margin-top: 1.25rem;
    cursor: pointer
}

.form-row {
    width: 100%;
    display: block;
    padding-top: var(--gutter-small)
}

.form-row input {
    width: 100%
}

@media screen and (max-width: 1023px) {
    .contact-form {
        row-gap: var(--gutter-xlarge)
    }
}

.contact-form__row label {
    padding-bottom: .25rem;
    display: inline-block
}

.contact-form__row input:not([type=checkbox]) {
    width: 100%
}

.contact-form__row textarea {
    width: 100%;
    height: 14.25rem
}

.contact-form__row {
    padding-bottom: var(--gutter-small)
}

.contact-form__row--checkbox {
    display: flex;
    align-items: center;
    gap: .5rem
}

.contact-form__row--checkbox label {
    padding-bottom: 0
}

.contact-form__row--checkbox:first-child:last-child {
    padding-bottom: 0
}

.contact-form__info a {
    text-decoration: underline
}

.lazy-image {
    position: relative;
    overflow: hidden
}

.lazy-image:not(.lazy-image--no-transition):before,
.lazy-image:not(.lazy-image--no-transition):after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: -1
}

.lazy-image:not(.lazy-image--no-transition):before {
    background: var(--color-fourth-background-main)
}

.lazy-image:not(.lazy-image--no-transition):after {
    background: var(--color-secondary-background-main);
    animation: lazy-loading 5s infinite;
    opacity: .2
}

.lazy-image.lazy-image--animation.lazyloaded {
    overflow: hidden
}

.lazy-image.lazy-image--animation.lazyloaded img {
    transform: scale(1);
    transition: transform .3s ease-in-out, opacity .3s linear
}

.no-touchevents a:hover .lazy-image.lazy-image--animation.lazyloaded img {
    transform: scale(1.05);
    transition: transform .3s ease-out, opacity .3s !important
}

.lazy-image img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    transition: opacity .3s linear;
    vertical-align: bottom;
    position: relative;
    z-index: 9;
    opacity: 0
}

.lazy-image.lazyloaded:before,
.lazy-image.lazyloaded:after {
    display: none
}

.lazy-image.lazyloaded img {
    opacity: 1
}

.lazy-image.lazy-image--background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100% !important;
    z-index: 0;
    padding-top: 0 !important
}

.lazy-image.lazy-image--background img {
    height: 100%;
    width: 100%;
    object-fit: cover
}

.lazy-image.lazy-image--fit img {
    object-fit: contain !important;
    padding: var(--image-fit-padding)
}

.lazy-image.lazy-image--fit.lazy-image--small img {
    padding: 5%
}

.lazy-image[data-ratio] {
    height: 0
}

.lazy-image[data-ratio] img {
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    object-fit: cover
}

html[dir=rtl] .lazy-image[data-ratio] img {
    right: 0
}

html[dir=ltr] .lazy-image[data-ratio] img {
    left: 0
}

@keyframes lazy-loading {
    0% {
        width: 0;
        left: 0
    }

    50% {
        width: 100%;
        left: 0
    }

    to {
        left: 100%;
        width: 0
    }
}

.onboarding-svg {
    position: relative;
    display: block;
    text-align: center;
    width: 100%
}

.onboarding-svg svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

svg.onboarding-svg--reduced {
    background: #00000080;
    opacity: .2
}

.svg-placeholder {
    display: block;
    font-size: 0;
    position: relative
}

.svg-placeholder svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    fill: var(--color-secondary-text-main);
    width: 80%;
    height: 80%
}

.svg-placeholder.svg-placeholder--background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #0000000f
}

.svg-placeholder--foreground {
    background: var(--color-secondary-background-main)
}

body.modal-opened,
body.sidebar-opened {
    overflow: hidden
}

.main-content {
    position: relative
}

.search-page-form form {
    display: flex;
    gap: var(--gutter-regular);
    flex-wrap: wrap
}

.search-page-form form .site-search-handle {
    flex-grow: 1
}

.search-page-form form input {
    width: 100%
}

.search-page-form form svg path {
    fill: var(--color-text-main)
}

.search-title {
    font-weight: var(--font-weight-body)
}

.search-item.active {
    background-color: var(--color-third-background-main);
    outline: .625rem solid var(--color-third-background-main);
    border-radius: clamp(0px, var(--border-radius-cards), 1px)
}

.search-more.active {
    background-color: var(--color-accent-main) !important;
    color: var(--color-foreground-accent-main) !important;
    border-color: transparent !important
}

.skip-to-content:focus {
    clip-path: none;
    clip: auto;
    width: auto;
    height: auto;
    margin: 0;
    color: var(--color-text-main);
    background-color: var(--color-background-main);
    position: fixed;
    padding: 10px;
    opacity: 1;
    z-index: 10000;
    transition: none;
    top: 0
}

html[dir=rtl] .skip-to-content:focus {
    right: 0
}

html[dir=ltr] .skip-to-content:focus {
    left: 0
}

html[dir=rtl] .disclosure-has-popup[open]>summary:before {
    left: 0 !important
}

body:not(.template-index).body--no-breadcrumb .main-content div:first-child .container--vertical-space-small {
    margin-top: clamp(1.25rem, var(--container-vertical-space) / 3, 2.5rem)
}

.panel--no-sideborders {
    border-left: 0;
    border-right: 0
}

.panel--no-radius {
    border-radius: 0
}

.panel--no-borders {
    border: 0
}

.show-more {
    position: relative;
    display: block;
    padding-bottom: var(--gutter-regular);
    --height: 200px
}

@media screen and (max-width: 767px) {
    .show-more {
        padding-bottom: 1.875rem
    }
}

@media screen and (max-width: 767px) {
    .facets__wrapper .show-more:not(.disabled) {
        padding-bottom: 2.5rem
    }
}

.show-more--active-not-active {
    padding-bottom: 0
}

.show-more_toggler {
    position: absolute;
    top: calc(100% - 20px);
    left: 0;
    width: 100%;
    display: block;
    z-index: 1;
    cursor: pointer
}

@media screen and (max-width: 767px) {
    .facets__wrapper .show-more_toggler {
        top: calc(100% - 30px)
    }
}

.show-more_toggler.disabled {
    display: none
}

.show-more_toggler.disabled+.show-more_panel {
    margin-bottom: 0
}

.show-more_toggler.active+.show-more_panel:after {
    display: none
}

.show-more_toggler:not(.init),
.show-more_toggler:not(.init)+.show-more_panel:after {
    visibility: hidden
}

.show-more_panel {
    position: relative;
    z-index: 0;
    max-height: var(--height);
    overflow: hidden;
    transition: all ease .5s
}

.show-more_panel:after {
    content: "";
    background: var(--color-background-main);
    background: linear-gradient(0deg, var(--color-background-main) 10%, var(--color-opacity-background-main) 100%);
    position: absolute;
    bottom: 0;
    display: inline-block;
    height: 1.25rem;
    width: 100%;
    z-index: 2
}

html[dir=rtl] .show-more_panel:after {
    right: 0
}

html[dir=ltr] .show-more_panel:after {
    left: 0
}

.section-heading {
    color: var(--color-text-main);
    display: flex;
    align-items: flex-end;
    justify-content: space-between
}

.section-heading__title {
    margin-bottom: 10px;
    display: block
}

.section-heading__subheading {
    display: inline-block;
    width: 100%
}

.section-heading__text {
    padding-inline-end: 10%;
    word-break: break-word
}

.section-heading__actions {
    flex-shrink: 0
}

.section-heading--center {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important
}

.section-heading--center .section-heading__text {
    padding-inline-end: 0
}

@media screen and (max-width: 767px) {
    .section-heading:not(.section-heading--single-line) {
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start
    }

    .section-heading:not(.section-heading--single-line) .section-heading__actions {
        margin-top: .625rem
    }
}

.section-heading:empty {
    display: none
}

.social-icons {
    display: flex;
    flex-wrap: wrap;
    margin-inline-start: -.3125rem;
    gap:6px ;
}

.social-icons a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    margin: .3125rem;
    border: none
}

.social-icons a .icon {
    width: 1.25rem;
    height: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center
}

.social-icons a .icon svg {
    height: 100%;
    width: 100%
}

/*# sourceMappingURL=/cdn/shop/t/49/assets/theme.css.map?v=69646378577744532091760045862 */