/** Shopify CDN: Minification failed

Line 3641:24 Unexpected ")"
Line 5984:1 Expected "}" to go with "{"

**/
:root {
  --alpha-button-background: 1;
  --alpha-button-border: 1;
  --alpha-link: 0.85;
  --alpha-badge-border: 0.1;
  --focused-base-outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
  --focused-base-outline-offset: 0.3rem;
  --focused-base-box-shadow: 0 0 0 0.3rem rgb(var(--color-background)), 0 0 0.5rem 0.4rem rgba(var(--color-foreground), 0.3);
}

.product-card-wrapper .card,
.contains-card--product {
  --border-radius: var(--product-card-corner-radius);
  --border-width: var(--product-card-border-width);
  --border-opacity: var(--product-card-border-opacity);
  --shadow-horizontal-offset: var(--product-card-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--product-card-shadow-vertical-offset);
  --shadow-blur-radius: var(--product-card-shadow-blur-radius);
  --shadow-opacity: var(--product-card-shadow-opacity);
  --shadow-visible: var(--product-card-shadow-visible);
  --image-padding: var(--product-card-image-padding);
  --text-alignment: var(--product-card-text-alignment);
}

.collection-card-wrapper .card,
.contains-card--collection {
  --border-radius: var(--collection-card-corner-radius);
  --border-width: var(--collection-card-border-width);
  --border-opacity: var(--collection-card-border-opacity);
  --shadow-horizontal-offset: var(--collection-card-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--collection-card-shadow-vertical-offset);
  --shadow-blur-radius: var(--collection-card-shadow-blur-radius);
  --shadow-opacity: var(--collection-card-shadow-opacity);
  --shadow-visible: var(--collection-card-shadow-visible);
  --image-padding: var(--collection-card-image-padding);
  --text-alignment: var(--collection-card-text-alignment);
}

.article-card-wrapper .card,
.contains-card--article {
  --border-radius: var(--blog-card-corner-radius);
  --border-width: var(--blog-card-border-width);
  --border-opacity: var(--blog-card-border-opacity);
  --shadow-horizontal-offset: var(--blog-card-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--blog-card-shadow-vertical-offset);
  --shadow-blur-radius: var(--blog-card-shadow-blur-radius);
  --shadow-opacity: var(--blog-card-shadow-opacity);
  --shadow-visible: var(--blog-card-shadow-visible);
  --image-padding: var(--blog-card-image-padding);
  --text-alignment: var(--blog-card-text-alignment);
}

.contains-content-container,
.content-container {
  --border-radius: var(--text-boxes-radius);
  --border-width: var(--text-boxes-border-width);
  --border-opacity: var(--text-boxes-border-opacity);
  --shadow-horizontal-offset: var(--text-boxes-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--text-boxes-shadow-vertical-offset);
  --shadow-blur-radius: var(--text-boxes-shadow-blur-radius);
  --shadow-opacity: var(--text-boxes-shadow-opacity);
  --shadow-visible: var(--text-boxes-shadow-visible);
}

.contains-media,
.global-media-settings {
  --border-radius: var(--media-radius);
  --border-width: var(--media-border-width);
  --border-opacity: var(--media-border-opacity);
  --shadow-horizontal-offset: var(--media-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--media-shadow-vertical-offset);
  --shadow-blur-radius: var(--media-shadow-blur-radius);
  --shadow-opacity: var(--media-shadow-opacity);
  --shadow-visible: var(--media-shadow-visible);
}

/* base */

.page-width {
  max-width: var(--page-width);
  margin: 0 auto;
  padding: 0 1.5rem;
}

.page-width.drawer-menu {
  max-width: 100%;
}

.page-width-desktop {
  padding: 0;
  margin: 0 auto;
}

.utility-bar__grid.page-width {
  padding-left: 3rem;
  padding-right: 3rem;
}

@media screen and (min-width: 750px) {
  .page-width {
    padding: 0 5rem;
  }

  .header.page-width,
  .utility-bar__grid.page-width {
    padding-left: 3.2rem;
    padding-right: 3.2rem;
  }

  .page-width--narrow {
    padding: 0 9rem;
  }

  .page-width-desktop {
    padding: 0;
  }

  .page-width-tablet {
    padding: 0 5rem;
  }
}

@media screen and (min-width: 990px) {
  .header:not(.drawer-menu).page-width {
    padding-left: 5rem;
    padding-right: 5rem;
  }

  .page-width--narrow {
    max-width: 72.6rem;
    padding: 0;
  }

  .page-width-desktop {
    max-width: var(--page-width);
    padding: 0 5rem;
  }
}

.isolate {
  position: relative;
  z-index: 0;
}

.section + .section {
  margin-top: var(--spacing-sections-mobile);
}

@media screen and (min-width: 750px) {
  .section + .section {
    margin-top: var(--spacing-sections-desktop);
  }
}

.element-margin-top {
  margin-top: 5rem;
}

@media screen and (min-width: 750px) {
  .element-margin {
    margin-top: calc(5rem + var(--page-width-margin));
  }
}

.background-secondary {
  background-color: rgba(var(--color-foreground), 0.04);
}

.grid-auto-flow {
  display: grid;
  grid-auto-flow: column;
}

.page-margin,
.shopify-challenge__container {
  margin: 7rem auto;
}

.rte-width {
  max-width: 82rem;
  margin: 0 auto 2rem;
}

.list-unstyled {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hidden {
  display: none !important;
}

.visually-hidden {
  position: absolute !important;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0 0 0 0);
  word-wrap: normal !important;
}

.visually-hidden--inline {
  margin: 0;
  height: 1em;
}

.overflow-hidden {
  overflow: hidden;
}

.skip-to-content-link:focus {
  z-index: 9999;
  position: inherit;
  overflow: auto;
  width: auto;
  height: auto;
  clip: auto;
}

.full-width-link {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
}

::selection {
  background-color: rgba(var(--color-foreground), 0.2);
}

.text-body {
  font-size: 1.5rem;
  letter-spacing: 0.06rem;
  line-height: calc(1 + 0.8 / var(--font-body-scale));
  font-family: var(--font-body-family);
  font-style: var(--font-body-style);
  font-weight: var(--font-body-weight);
}

h1,
h2,
h3,
h4,
h5,
.h0,
.h1,
.h2,
.h3,
.h4,
.h5 {
  font-family: var(--font-heading-family);
  font-style: var(--font-heading-style);
  font-weight: var(--font-heading-weight);
  letter-spacing: calc(var(--font-heading-scale) * 0.06rem);
  color: rgb(var(--color-foreground));
  line-height: calc(1 + 0.3 / max(1, var(--font-heading-scale)));
  word-break: break-word;
}

.hxxl {
  font-size: clamp(calc(var(--font-heading-scale) * 5.6rem), 14vw, calc(var(--font-heading-scale) * 7.2rem));
  line-height: 1.1;
}

.hxl {
  font-size: calc(var(--font-heading-scale) * 5rem);
  line-height: calc(1 + 0.3 / max(1, var(--font-heading-scale)));
}

@media only screen and (min-width: 750px) {
  .hxl {
    font-size: calc(var(--font-heading-scale) * 6.2rem);
  }
}

.h0 {
  font-size: calc(var(--font-heading-scale) * 4rem);
}

@media only screen and (min-width: 750px) {
  .h0 {
    font-size: calc(var(--font-heading-scale) * 5.2rem);
  }
}

h1,
.h1 {
  font-size: calc(var(--font-heading-scale) * 3rem);
}

@media only screen and (min-width: 750px) {
  h1,
  .h1 {
    font-size: calc(var(--font-heading-scale) * 4rem);
  }
}

h2,
.h2 {
  font-size: calc(var(--font-heading-scale) * 2rem);
}

@media only screen and (min-width: 750px) {
  h2,
  .h2 {
    font-size: calc(var(--font-heading-scale) * 2.4rem);
  }
}

h3,
.h3 {
  font-size: calc(var(--font-heading-scale) * 1.7rem);
}

@media only screen and (min-width: 750px) {
  h3,
  .h3 {
    font-size: calc(var(--font-heading-scale) * 1.8rem);
  }
}

h4,
.h4 {
  font-family: var(--font-heading-family);
  font-style: var(--font-heading-style);
  font-size: calc(var(--font-heading-scale) * 1.5rem);
}

h5,
.h5 {
  font-size: calc(var(--font-heading-scale) * 1.2rem);
}

@media only screen and (min-width: 750px) {
  h5,
  .h5 {
    font-size: calc(var(--font-heading-scale) * 1.3rem);
  }
}

h6,
.h6 {
  color: rgba(var(--color-foreground), 0.75);
  margin-block-start: 1.67em;
  margin-block-end: 1.67em;
}

blockquote {
  font-style: italic;
  color: rgba(var(--color-foreground), 0.75);
  border-left: 0.2rem solid rgba(var(--color-foreground), 0.2);
  padding-left: 1rem;
}

@media screen and (min-width: 750px) {
  blockquote {
    padding-left: 1.5rem;
  }
}

.caption {
  font-size: 1rem;
  letter-spacing: 0.07rem;
  line-height: calc(1 + 0.7 / var(--font-body-scale));
}

@media screen and (min-width: 750px) {
  .caption {
    font-size: 1.2rem;
  }
}

.caption-with-letter-spacing {
  font-size: 1rem;
  letter-spacing: 0.13rem;
  line-height: calc(1 + 0.2 / var(--font-body-scale));
  text-transform: uppercase;
}

.caption-with-letter-spacing--medium {
  font-size: 1.2rem;
  letter-spacing: 0.16rem;
}

.caption-with-letter-spacing--large {
  font-size: 1.4rem;
  letter-spacing: 0.18rem;
}

.caption-large,
.customer .field input,
.customer select,
.field__input,
.form__label,
.select__select {
  font-size: 1.3rem;
  line-height: calc(1 + 0.5 / var(--font-body-scale));
  letter-spacing: 0.04rem;
}

.color-foreground {
  color: rgb(var(--color-foreground));
}

table:not([class]) {
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 1.4rem;
  border-style: hidden;
  box-shadow: 0 0 0 0.1rem rgba(var(--color-foreground), 0.2);
  /* draws the table border  */
}

table:not([class]) td,
table:not([class]) th {
  padding: 1em;
  border: 0.1rem solid rgba(var(--color-foreground), 0.2);
}

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

@media screen and (min-width: 750px) and (max-width: 989px) {
  .medium-hide {
    display: none !important;
  }
}

@media screen and (min-width: 990px) {
  .large-up-hide {
    display: none !important;
  }
}

.left {
  text-align: left;
}

.center {
  text-align: center;
}

.right {
  text-align: right;
}

.uppercase {
  text-transform: uppercase;
}

.light {
  opacity: 0.7;
}

a:empty,
ul:empty,
dl:empty,
div:empty,
section:empty,
article:empty,
p:empty,
h1:empty,
h2:empty,
h3:empty,
h4:empty,
h5:empty,
h6:empty {
  display: none;
}

.link,
.customer a {
  cursor: pointer;
  display: inline-block;
  border: none;
  box-shadow: none;
  text-decoration: underline;
  text-underline-offset: 0.3rem;
  color: rgb(var(--color-link));
  background-color: transparent;
  font-size: 1.4rem;
  font-family: inherit;
}

.link--text {
  color: rgb(var(--color-foreground));
}

.link--text:hover {
  color: rgba(var(--color-foreground), 0.75);
}

.link-with-icon {
  display: inline-flex;
  font-size: 1.4rem;
  font-weight: 600;
  letter-spacing: 0.1rem;
  text-decoration: none;
  margin-bottom: 4.5rem;
  white-space: nowrap;
}

.link-with-icon .icon {
  width: 1.5rem;
  margin-left: 1rem;
}

a:not([href]) {
  cursor: not-allowed;
}

.circle-divider::after {
  content: '\2022';
  margin: 0 1.3rem 0 1.5rem;
}

.circle-divider:last-of-type::after {
  display: none;
}

hr {
  border: none;
  height: 0.1rem;
  background-color: rgba(var(--color-foreground), 0.2);
  display: block;
  margin: 5rem 0;
}

@media screen and (min-width: 750px) {
  hr {
    margin: 7rem 0;
  }
}

.full-unstyled-link {
  text-decoration: none;
  color: currentColor;
  display: block;
}

.placeholder {
  background-color: rgba(var(--color-foreground), 0.04);
  color: rgba(var(--color-foreground), 0.55);
  fill: rgba(var(--color-foreground), 0.55);
}

details > * {
  box-sizing: border-box;
}

.break {
  word-break: break-word;
}

.visibility-hidden {
  visibility: hidden;
}

@media (prefers-reduced-motion) {
  .motion-reduce {
    transition: none !important;
    animation: none !important;
  }
}

:root {
  --duration-short: 100ms;
  --duration-default: 200ms;
  --duration-medium: 300ms;
  --duration-long: 500ms;
  --duration-extra-long: 600ms;
  --duration-extra-longer: 750ms;
  --duration-extended: 3s;
  --ease-out-slow: cubic-bezier(0, 0, 0.3, 1);
  --animation-slide-in: slideIn var(--duration-extra-long) var(--ease-out-slow) forwards;
  --animation-fade-in: fadeIn var(--duration-extra-long) var(--ease-out-slow);
}

.underlined-link,
.customer a,
.inline-richtext a {
  text-underline-offset: 0.3rem;
  text-decoration-thickness: 0.1rem;
  transition: text-decoration-thickness ease 100ms;
}

.underlined-link,
.customer a {
  color: rgba(var(--color-link), var(--alpha-link));
}

.inline-richtext a,
.rte.inline-richtext a {
  color: currentColor;
}

.underlined-link:hover,
.customer a:hover,
.inline-richtext a:hover {
  color: rgb(var(--color-link));
  text-decoration-thickness: 0.2rem;
}

.icon-arrow {
  width: 1.5rem;
}

h3 .icon-arrow,
.h3 .icon-arrow {
  width: calc(var(--font-heading-scale) * 1.5rem);
}

/* arrow animation */
.animate-arrow .icon-arrow path {
  transform: translateX(-0.25rem);
  transition: transform var(--duration-short) ease;
}

.animate-arrow:hover .icon-arrow path {
  transform: translateX(-0.05rem);
}

.svg-wrapper {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
}

.svg-wrapper > svg {
  height: 100%;
  width: 100%;
}

/* base-details-summary */
summary {
  cursor: pointer;
  list-style: none;
  position: relative;
}

summary .icon-caret {
  position: absolute;
  height: 0.6rem;
  right: 1.5rem;
  top: calc(50% - 0.2rem);
}

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

.disclosure-has-popup {
  position: relative;
}

.disclosure-has-popup[open] > summary::before {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: block;
  cursor: default;
  content: ' ';
  background: transparent;
}

.disclosure-has-popup > summary::before {
  display: none;
}

.disclosure-has-popup[open] > summary + * {
  z-index: 100;
}

@media screen and (min-width: 750px) {
  .disclosure-has-popup[open] > summary + * {
    z-index: 4;
  }

  .facets .disclosure-has-popup[open] > summary + * {
    z-index: 2;
  }
}

.placeholder-svg {
  height: 100%;
  width: 100%;
}

/* base-focus */
/*
  Focus ring - default (with offset)
*/

*:focus {
  outline: 0;
  box-shadow: none;
}

*:focus-visible {
  outline: var(--focused-base-outline);
  outline-offset: var(--focused-base-outline-offset);
  box-shadow: var(--focused-base-box-shadow);
}

/* Fallback - for browsers that don't support :focus-visible, a fallback is set for :focus */
.focused {
  outline: var(--focused-base-outline);
  outline-offset: var(--focused-base-outline-offset);
  box-shadow: var(--focused-base-box-shadow);
}

/*
  Focus ring - inset
*/

.focus-inset:focus-visible {
  outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
  outline-offset: -0.2rem;
  box-shadow: 0 0 0.2rem 0 rgba(var(--color-foreground), 0.3);
}

.focused.focus-inset {
  outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
  outline-offset: -0.2rem;
  box-shadow: 0 0 0.2rem 0 rgba(var(--color-foreground), 0.3);
}

/*
  Focus ring - none
*/

/* Dangerous for a11y - Use with care */
.focus-none {
  box-shadow: none !important;
  outline: 0 !important;
}

.focus-offset:focus-visible {
  outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
  outline-offset: 1rem;
  box-shadow: 0 0 0 1rem rgb(var(--color-background)), 0 0 0.2rem 1.2rem rgba(var(--color-foreground), 0.3);
}

.focus-offset.focused {
  outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
  outline-offset: 1rem;
  box-shadow: 0 0 0 1rem rgb(var(--color-background)), 0 0 0.2rem 1.2rem rgba(var(--color-foreground), 0.3);
}

/* component-title */
.title,
.title-wrapper-with-link {
  margin: 3rem 0 2rem;
}

.title-wrapper-with-link .title {
  margin: 0;
}

.title .link {
  font-size: inherit;
}

.title-wrapper {
  margin-bottom: 3rem;
}

.title-wrapper-with-link {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1rem;
  margin-bottom: 3rem;
  flex-wrap: wrap;
}

.title--primary {
  margin: 4rem 0;
}

.title-wrapper--self-padded-tablet-down,
.title-wrapper--self-padded-mobile {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

@media screen and (min-width: 750px) {
  .title-wrapper--self-padded-mobile {
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (min-width: 990px) {
  .title,
  .title-wrapper-with-link {
    margin: 5rem 0 3rem;
  }

  .title--primary {
    margin: 2rem 0;
  }

  .title-wrapper-with-link {
    align-items: center;
  }

  .title-wrapper-with-link .title {
    margin-bottom: 0;
  }

  .title-wrapper--self-padded-tablet-down {
    padding-left: 0;
    padding-right: 0;
  }
}

.title-wrapper-with-link .link-with-icon {
  margin: 0;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.title-wrapper-with-link .link-with-icon .svg-wrapper {
  width: 1.5rem;
}

.title-wrapper-with-link a {
  margin-top: 0;
  flex-shrink: 0;
}

.title-wrapper--no-top-margin {
  margin-top: 0;
}

.title-wrapper--no-top-margin > .title {
  margin-top: 0;
}

.subtitle {
  font-size: 1.8rem;
  line-height: calc(1 + 0.8 / var(--font-body-scale));
  letter-spacing: 0.06rem;
  color: rgba(var(--color-foreground), 0.7);
}

.subtitle--small {
  font-size: 1.4rem;
  letter-spacing: 0.1rem;
}

.subtitle--medium {
  font-size: 1.6rem;
  letter-spacing: 0.08rem;
}

/* component-grid */
.grid {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 2rem;
  padding: 0;
  list-style: none;
  column-gap: var(--grid-mobile-horizontal-spacing);
  row-gap: var(--grid-mobile-vertical-spacing);
}

@media screen and (min-width: 750px) {
  .grid {
    column-gap: var(--grid-desktop-horizontal-spacing);
    row-gap: var(--grid-desktop-vertical-spacing);
  }
}

.grid:last-child {
  margin-bottom: 0;
}

.grid__item {
  width: calc(25% - var(--grid-mobile-horizontal-spacing) * 3 / 4);
  max-width: calc(50% - var(--grid-mobile-horizontal-spacing) / 2);
  flex-grow: 1;
  flex-shrink: 0;
}

@media screen and (min-width: 750px) {
  .grid__item {
    width: calc(25% - var(--grid-desktop-horizontal-spacing) * 3 / 4);
    max-width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }
}

.grid--gapless.grid {
  column-gap: 0;
  row-gap: 0;
}

@media screen and (max-width: 749px) {
  .grid__item.slider__slide--full-width {
    width: 100%;
    max-width: none;
  }
}

.grid--1-col .grid__item {
  max-width: 100%;
  width: 100%;
}

.grid--3-col .grid__item {
  width: calc(33.33% - var(--grid-mobile-horizontal-spacing) * 2 / 3);
}

@media screen and (min-width: 750px) {
  .grid--3-col .grid__item {
    width: calc(33.33% - var(--grid-desktop-horizontal-spacing) * 2 / 3);
  }
}

.grid--2-col .grid__item {
  width: calc(50% - var(--grid-mobile-horizontal-spacing) / 2);
}

@media screen and (min-width: 750px) {
  .grid--2-col .grid__item {
    width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  .grid--4-col-tablet .grid__item {
    width: calc(25% - var(--grid-desktop-horizontal-spacing) * 3 / 4);
  }

  .grid--3-col-tablet .grid__item {
    width: calc(33.33% - var(--grid-desktop-horizontal-spacing) * 2 / 3);
  }

  .grid--2-col-tablet .grid__item {
    width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }
}

@media screen and (max-width: 989px) {
  .grid--1-col-tablet-down .grid__item {
    width: 100%;
    max-width: 100%;
  }

  .slider--tablet.grid--peek {
    margin: 0;
    width: 100%;
  }

  .slider--tablet.grid--peek .grid__item {
    box-sizing: content-box;
    margin: 0;
  }

  .slider.slider--tablet .scroll-trigger.animate--slide-in,
  .slider.slider--mobile .scroll-trigger.animate--slide-in {
    animation: none;
    opacity: 1;
    transform: inherit;
  }

  .scroll-trigger:not(.scroll-trigger--offscreen) .slider--tablet {
    animation: var(--animation-slide-in);
  }
}

@media screen and (min-width: 990px) {
  .grid--6-col-desktop .grid__item {
    width: calc(16.66% - var(--grid-desktop-horizontal-spacing) * 5 / 6);
    max-width: calc(16.66% - var(--grid-desktop-horizontal-spacing) * 5 / 6);
  }

  .grid--5-col-desktop .grid__item {
    width: calc(20% - var(--grid-desktop-horizontal-spacing) * 4 / 5);
    max-width: calc(20% - var(--grid-desktop-horizontal-spacing) * 4 / 5);
  }

  .grid--4-col-desktop .grid__item {
    width: calc(25% - var(--grid-desktop-horizontal-spacing) * 3 / 4);
    max-width: calc(25% - var(--grid-desktop-horizontal-spacing) * 3 / 4);
  }

  .grid--3-col-desktop .grid__item {
    width: calc(33.33% - var(--grid-desktop-horizontal-spacing) * 2 / 3);
    max-width: calc(33.33% - var(--grid-desktop-horizontal-spacing) * 2 / 3);
  }

  .grid--2-col-desktop .grid__item {
    width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
    max-width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  .slider.slider--desktop .scroll-trigger.animate--slide-in {
    animation: none;
    opacity: 1;
    transform: inherit;
  }

  .scroll-trigger:not(.scroll-trigger--offscreen) .slider--desktop {
    animation: var(--animation-slide-in);
  }
}

@media screen and (min-width: 990px) {
  .grid--1-col-desktop {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .grid--1-col-desktop .grid__item {
    width: 100%;
    max-width: 100%;
  }
}

@media screen and (max-width: 749px) {
  .grid--peek.slider--mobile {
    margin: 0;
    width: 100%;
  }

  .grid--peek.slider--mobile .grid__item {
    box-sizing: content-box;
    margin: 0;
  }

  .grid--peek .grid__item {
    min-width: 35%;
  }

  .grid--peek.slider .grid__item:first-of-type {
    margin-left: 1.5rem;
  }

  /* Fix to show some space at the end of our sliders in all browsers */
  .grid--peek.slider:after {
    margin-left: calc(-1 * var(--grid-mobile-horizontal-spacing));
  }

  .grid--2-col-tablet-down .grid__item {
    width: calc(50% - var(--grid-mobile-horizontal-spacing) / 2);
  }

  .slider--tablet.grid--peek.grid--2-col-tablet-down .grid__item,
  .grid--peek .grid__item {
    width: calc(50% - var(--grid-mobile-horizontal-spacing) - 3rem);
  }

  .slider--tablet.grid--peek.grid--1-col-tablet-down .grid__item,
  .slider--mobile.grid--peek.grid--1-col-tablet-down .grid__item {
    width: calc(100% - var(--grid-mobile-horizontal-spacing) - 3rem);
  }
}

@media screen and (min-width: 750px) and (max-width: 989px) {
  .slider--tablet.grid--peek .grid__item {
    width: calc(25% - var(--grid-desktop-horizontal-spacing) - 3rem);
  }

  .slider--tablet.grid--peek.grid--3-col-tablet .grid__item {
    width: calc(33.33% - var(--grid-desktop-horizontal-spacing) - 3rem);
  }

  .slider--tablet.grid--peek.grid--2-col-tablet .grid__item,
  .slider--tablet.grid--peek.grid--2-col-tablet-down .grid__item {
    width: calc(50% - var(--grid-desktop-horizontal-spacing) - 3rem);
  }

  .slider--tablet.grid--peek .grid__item:first-of-type {
    margin-left: 1.5rem;
  }

  .grid--2-col-tablet-down .grid__item {
    width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  .grid--1-col-tablet-down.grid--peek .grid__item {
    width: calc(100% - var(--grid-desktop-horizontal-spacing) - 3rem);
  }
}

/* component-media */
.media {
  display: block;
  background-color: rgba(var(--color-foreground), 0.1);
  position: relative;
  overflow: hidden;
}

.media--transparent {
  background-color: transparent;
}

.media > *:not(.zoom):not(.deferred-media__poster-button),
.media model-viewer {
  display: block;
  max-width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.media > img {
  object-fit: cover;
  object-position: center center;
  transition: opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.media--square {
  padding-bottom: 100%;
}

.media--portrait {
  padding-bottom: 125%;
}

.media--landscape {
  padding-bottom: 66.6%;
}

.media--cropped {
  padding-bottom: 56%;
}

.media--16-9 {
  padding-bottom: 56.25%;
}

.media--circle {
  padding-bottom: 100%;
  border-radius: 50%;
}

.media.media--hover-effect > img + img {
  opacity: 0;
}

@media screen and (min-width: 990px) {
  .media--cropped {
    padding-bottom: 63%;
  }
}

deferred-media {
  display: block;
}

/* component-button */
/* Button - default */

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

.button--tertiary {
  --alpha-button-background: 0;
  --alpha-button-border: 0.2;
}

.button,
.shopify-challenge__button,
.customer button,
button.shopify-payment-button__button--unbranded {
  --shadow-horizontal-offset: var(--buttons-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--buttons-shadow-vertical-offset);
  --shadow-blur-radius: var(--buttons-shadow-blur-radius);
  --shadow-opacity: var(--buttons-shadow-opacity);
  --shadow-visible: var(--buttons-shadow-visible);
  --border-offset: var(--buttons-border-offset); /* reduce radius edge artifacts */
  --border-opacity: calc(1 - var(--buttons-border-opacity));
  border-radius: var(--buttons-radius-outset);
  position: relative;
}

.button,
.shopify-challenge__button,
.customer button,
button.shopify-payment-button__button--unbranded {
  min-width: calc(12rem + var(--buttons-border-width) * 2);
  min-height: calc(4.5rem + var(--buttons-border-width) * 2);
}

.button,
.shopify-challenge__button,
.customer button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border: 0;
  padding: 0 3rem;
  cursor: pointer;
  font: inherit;
  font-size: 1.5rem;
  text-decoration: none;
  color: rgb(var(--color-button-text));
  transition: box-shadow var(--duration-short) ease;
  -webkit-appearance: none;
  appearance: none;
  background-color: rgba(var(--color-button), var(--alpha-button-background));
}

.button:before,
.shopify-challenge__button:before,
.customer button:before,
.shopify-payment-button__button--unbranded:before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  border-radius: var(--buttons-radius-outset);
  box-shadow: var(--shadow-horizontal-offset) var(--shadow-vertical-offset) var(--shadow-blur-radius)
    rgba(var(--color-shadow), var(--shadow-opacity));
}

.button:after,
.shopify-challenge__button:after,
.customer button:after,
.shopify-payment-button__button--unbranded:after {
  content: '';
  position: absolute;
  top: var(--buttons-border-width);
  right: var(--buttons-border-width);
  bottom: var(--buttons-border-width);
  left: var(--buttons-border-width);
  z-index: 1;
  border-radius: var(--buttons-radius);
  box-shadow: 0 0 0 calc(var(--buttons-border-width) + var(--border-offset))
      rgba(var(--color-button-text), var(--border-opacity)),
    0 0 0 var(--buttons-border-width) rgba(var(--color-button), var(--alpha-button-background));
  transition: box-shadow var(--duration-short) ease;
}

.button:not([disabled]):hover::after,
.shopify-challenge__button:hover::after,
.customer button:hover::after,
.shopify-payment-button__button--unbranded:hover::after {
  --border-offset: 1.3px;
  box-shadow: 0 0 0 calc(var(--buttons-border-width) + var(--border-offset))
      rgba(var(--color-button-text), var(--border-opacity)),
    0 0 0 calc(var(--buttons-border-width) + 1px) rgba(var(--color-button), var(--alpha-button-background));
}

.button--secondary:after {
  --border-opacity: var(--buttons-border-opacity);
}

.button:focus-visible,
.button:focus,
.button.focused,
.shopify-payment-button__button--unbranded:focus-visible,
.shopify-payment-button__button--unbranded:focus {
  outline: 0;
  box-shadow: 0 0 0 0.3rem rgb(var(--color-background)), 0 0 0 0.5rem rgba(var(--color-foreground), 0.5),
    0 0 0.5rem 0.4rem rgba(var(--color-foreground), 0.3);
}

.button:focus:not(:focus-visible):not(.focused),
.shopify-payment-button__button--unbranded:focus:not(:focus-visible):not(.focused) {
  box-shadow: inherit;
}

.button::selection,
.shopify-challenge__button::selection,
.customer button::selection {
  background-color: rgba(var(--color-button-text), 0.3);
}

.button,
.button-label,
.shopify-challenge__button,
.customer button {
  font-size: 1.5rem;
  letter-spacing: 0.1rem;
  line-height: calc(1 + 0.2 / var(--font-body-scale));
}

.button--tertiary {
  font-size: 1.2rem;
  padding: 1rem 1.5rem;
  min-width: calc(9rem + var(--buttons-border-width) * 2);
  min-height: calc(3.5rem + var(--buttons-border-width) * 2);
}

.button--small {
  padding: 1.2rem 2.6rem;
}

/* Shopify Accelerated Checkout */

shopify-accelerated-checkout {
  --shopify-accelerated-checkout-button-border-radius: var(--buttons-radius-outset);
  --shopify-accelerated-checkout-button-box-shadow: var(--shadow-horizontal-offset) var(--shadow-vertical-offset) var(--shadow-blur-radius)
  rgba(var(--color-shadow), var(--shadow-opacity));
}
shopify-accelerated-checkout-cart {
  --shopify-accelerated-checkout-button-border-radius: var(--buttons-radius-outset);
  --shopify-accelerated-checkout-button-box-shadow: var(--shadow-horizontal-offset) var(--shadow-vertical-offset) var(--shadow-blur-radius)
  rgba(var(--color-shadow), var(--shadow-opacity));
}


/* Button - other */

.button:disabled,
.button[aria-disabled='true'],
.button.disabled,
.customer button:disabled,
.customer button[aria-disabled='true'],
.customer button.disabled,
.quantity__button.disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.button--full-width {
  display: flex;
  width: 100%;
}

.button.loading {
  color: transparent;
  position: relative;
}

@media screen and (forced-colors: active) {
  .button.loading {
    color: rgb(var(--color-foreground));
  }
}

.button.loading > .loading__spinner {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
  height: 100%;
  display: flex;
  align-items: center;
}

.button.loading > .loading__spinner .spinner {
  width: fit-content;
}

.button.loading > .loading__spinner .path {
  stroke: rgb(var(--color-button-text));
}

/* Button - social share */

.share-button {
  display: block;
  position: relative;
}

.share-button details {
  width: fit-content;
}

.share-button__button {
  font-size: 1.4rem;
  display: flex;
  align-items: center;
  color: rgb(var(--color-link));
  margin-left: 0;
  padding-left: 0;
  min-height: 4.4rem;
}

details[open] > .share-button__fallback {
  animation: animateMenuOpen var(--duration-default) ease;
}

.share-button__button:hover {
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}

.share-button__button,
.share-button__fallback button {
  cursor: pointer;
  background-color: transparent;
  border: none;
}

.share-button__button .icon-share {
  height: 1.2rem;
  margin-right: 1rem;
  min-width: 1.3rem;
}

.share-button__fallback {
  display: flex;
  align-items: center;
  position: absolute;
  top: 3rem;
  left: 0.1rem;
  z-index: 3;
  width: 100%;
  min-width: max-content;
  border-radius: var(--inputs-radius);
  border: 0;
}

.share-button__fallback:after {
  pointer-events: none;
  content: '';
  position: absolute;
  top: var(--inputs-border-width);
  right: var(--inputs-border-width);
  bottom: var(--inputs-border-width);
  left: var(--inputs-border-width);
  border: 0.1rem solid transparent;
  border-radius: var(--inputs-radius);
  box-shadow: 0 0 0 var(--inputs-border-width) rgba(var(--color-foreground), var(--inputs-border-opacity));
  transition: box-shadow var(--duration-short) ease;
  z-index: 1;
}

.share-button__fallback:before {
  background: rgb(var(--color-background));
  pointer-events: none;
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: var(--inputs-radius-outset);
  box-shadow: var(--inputs-shadow-horizontal-offset) var(--inputs-shadow-vertical-offset)
    var(--inputs-shadow-blur-radius) rgba(var(--color-shadow), var(--inputs-shadow-opacity));
  z-index: -1;
}

.share-button__fallback button {
  width: 4.4rem;
  height: 4.4rem;
  padding: 0;
  flex-shrink: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  right: var(--inputs-border-width);
}

.share-button__fallback button:hover {
  color: rgba(var(--color-foreground), 0.75);
}

.share-button__fallback button:hover .svg-wrapper {
  transform: scale(1.07);
}

.share-button__close:not(.hidden) + .share-button__copy {
  display: none;
}

.share-button__close,
.share-button__copy {
  background-color: transparent;
  color: rgb(var(--color-foreground));
}

.share-button__copy:focus-visible,
.share-button__close:focus-visible {
  background-color: rgb(var(--color-background));
  z-index: 2;
}

.share-button__copy:focus,
.share-button__close:focus {
  background-color: rgb(var(--color-background));
  z-index: 2;
}

.field:not(:focus-visible):not(.focused) + .share-button__copy:not(:focus-visible):not(.focused),
.field:not(:focus-visible):not(.focused) + .share-button__close:not(:focus-visible):not(.focused) {
  background-color: inherit;
}

.share-button__fallback .field:after,
.share-button__fallback .field:before {
  content: none;
}

.share-button__fallback .field {
  border-radius: 0;
  min-width: auto;
  min-height: auto;
  transition: none;
}

.share-button__fallback .field__input:focus,
.share-button__fallback .field__input:-webkit-autofill {
  outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
  outline-offset: 0.1rem;
  box-shadow: 0 0 0 0.1rem rgb(var(--color-background)), 0 0 0.5rem 0.4rem rgba(var(--color-foreground), 0.3);
}

.share-button__fallback .field__input {
  box-shadow: none;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  filter: none;
  min-width: auto;
  min-height: auto;
}

.share-button__fallback .field__input:hover {
  box-shadow: none;
}

.share-button__fallback .icon {
  width: 1.5rem;
  height: 1.5rem;
}

.share-button__message:not(:empty) {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  margin-top: 0;
  padding: 0.8rem 0 0.8rem 1.5rem;
  margin: var(--inputs-border-width);
}

.share-button__message:not(:empty):not(.hidden) ~ * {
  display: none;
}

/* component-form */
.field__input,
.select__select,
.customer .field input,
.customer select {
  -webkit-appearance: none;
  appearance: none;
  background-color: rgb(var(--color-background));
  color: rgb(var(--color-foreground));
  font-family: var(--font-body-family);
  font-style: var(--font-body-style);
  font-weight: var(--font-body-weight);
  font-size: 1.6rem;
  width: 100%;
  box-sizing: border-box;
  transition: box-shadow var(--duration-short) ease;
  border-radius: var(--inputs-radius);
  height: 4.5rem;
  min-height: calc(var(--inputs-border-width) * 2);
  min-width: calc(7rem + (var(--inputs-border-width) * 2));
  position: relative;
  border: 0;
}

.field:before,
.select:before,
.customer .field:before,
.customer select:before,
.localization-form__select:before {
  pointer-events: none;
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: var(--inputs-radius-outset);
  box-shadow: var(--inputs-shadow-horizontal-offset) var(--inputs-shadow-vertical-offset)
    var(--inputs-shadow-blur-radius) rgba(var(--color-shadow), var(--inputs-shadow-opacity));
  z-index: -1;
}

.field:after,
.select:after,
.customer .field:after,
.customer select:after,
.localization-form__select:after {
  pointer-events: none;
  content: '';
  position: absolute;
  top: var(--inputs-border-width);
  right: var(--inputs-border-width);
  bottom: var(--inputs-border-width);
  left: var(--inputs-border-width);
  border: 0.1rem solid transparent;
  border-radius: var(--inputs-radius);
  box-shadow: 0 0 0 var(--inputs-border-width) rgba(var(--color-foreground), var(--inputs-border-opacity));
  transition: box-shadow var(--duration-short) ease;
  z-index: 1;
}

.select__select {
  font-family: var(--font-body-family);
  font-style: var(--font-body-style);
  font-weight: var(--font-body-weight);
  font-size: 1.2rem;
  color: rgba(var(--color-foreground), 0.75);
}

.field:hover.field:after,
.select:hover.select:after,
.select__select:hover.select__select:after,
.customer .field:hover.field:after,
.customer select:hover.select:after,
.localization-form__select:hover.localization-form__select:after {
  box-shadow: 0 0 0 calc(0.1rem + var(--inputs-border-width))
    rgba(var(--color-foreground), var(--inputs-border-opacity));
  outline: 0;
  border-radius: var(--inputs-radius);
}

.field__input:focus-visible,
.select__select:focus-visible,
.customer .field input:focus-visible,
.customer select:focus-visible,
.localization-form__select:focus-visible.localization-form__select:after {
  box-shadow: 0 0 0 calc(0.1rem + var(--inputs-border-width)) rgba(var(--color-foreground));
  outline: 0;
  border-radius: var(--inputs-radius);
}

.field__input:focus,
.select__select:focus,
.customer .field input:focus,
.customer select:focus,
.localization-form__select:focus.localization-form__select:after {
  box-shadow: 0 0 0 calc(0.1rem + var(--inputs-border-width)) rgba(var(--color-foreground));
  outline: 0;
  border-radius: var(--inputs-radius);
}

.localization-form__select:focus {
  outline: 0;
  box-shadow: none;
}

.text-area,
.select {
  display: flex;
  position: relative;
  width: 100%;
}

/* Select */

.select .svg-wrapper,
.customer select + .svg-wrapper {
  height: 0.6rem;
  width: 1rem;
  pointer-events: none;
  position: absolute;
  top: calc(50% - 0.2rem);
  right: 0;
}

.select__select,
.customer select {
  cursor: pointer;
  line-height: calc(1 + 0.6 / var(--font-body-scale));
  padding: 0 calc(var(--inputs-border-width) + 3rem) 0 2rem;
  margin: var(--inputs-border-width);
  min-height: calc(var(--inputs-border-width) * 2);
}

/* Field */

.field {
  position: relative;
  width: 100%;
  display: flex;
  transition: box-shadow var(--duration-short) ease;
}

.customer .field {
  display: flex;
}

.field--with-error {
  flex-wrap: wrap;
}

.field__input,
.customer .field input {
  flex-grow: 1;
  text-align: left;
  padding: 1.5rem;
  margin: var(--inputs-border-width);
  transition: box-shadow var(--duration-short) ease;
}

.field__label,
.customer .field label {
  font-size: 1.6rem;
  left: calc(var(--inputs-border-width) + 2rem);
  top: calc(1rem + var(--inputs-border-width));
  margin-bottom: 0;
  pointer-events: none;
  position: absolute;
  transition: top var(--duration-short) ease, font-size var(--duration-short) ease;
  color: rgba(var(--color-foreground), 0.75);
  letter-spacing: 0.1rem;
  line-height: 1.5;
}

.field__input:focus ~ .field__label,
.field__input:not(:placeholder-shown) ~ .field__label,
.field__input:-webkit-autofill ~ .field__label,
.customer .field input:focus ~ label,
.customer .field input:not(:placeholder-shown) ~ label,
.customer .field input:-webkit-autofill ~ label {
  font-size: 1rem;
  top: calc(var(--inputs-border-width) + 0.5rem);
  left: calc(var(--inputs-border-width) + 2rem);
  letter-spacing: 0.04rem;
}

.field__input:focus,
.field__input:not(:placeholder-shown),
.field__input:-webkit-autofill,
.customer .field input:focus,
.customer .field input:not(:placeholder-shown),
.customer .field input:-webkit-autofill {
  padding: 2.2rem 1.5rem 0.8rem 2rem;
  margin: var(--inputs-border-width);
}

.field__input::-webkit-search-cancel-button,
.customer .field input::-webkit-search-cancel-button {
  display: none;
}

.field__input::placeholder,
.customer .field input::placeholder {
  opacity: 0;
}

.field__button {
  align-items: center;
  background-color: transparent;
  border: 0;
  color: currentColor;
  cursor: pointer;
  display: flex;
  height: 4.4rem;
  justify-content: center;
  overflow: hidden;
  padding: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 4.4rem;
}

.field__button > .svg-wrapper {
  height: 2.5rem;
  width: 2.5rem;
}

.field__input:-webkit-autofill ~ .field__button,
.field__input:-webkit-autofill ~ .field__label,
.customer .field input:-webkit-autofill ~ label {
  color: rgb(0, 0, 0);
}

/* Text area */

.text-area {
  font-family: var(--font-body-family);
  font-style: var(--font-body-style);
  font-weight: var(--font-body-weight);
  min-height: 10rem;
  resize: none;
}

input[type='checkbox'] {
  display: inline-block;
  width: auto;
  margin-right: 0.5rem;
}

/* Form global */

.form__label {
  display: block;
  margin-bottom: 0.6rem;
}

.form__message {
  align-items: center;
  display: flex;
  font-size: 1.4rem;
  line-height: 1;
  margin-top: 1rem;
}

.form__message--large {
  font-size: 1.6rem;
}

.customer .field .form__message {
  font-size: 1.4rem;
  text-align: left;
}

.form__message .icon,
.customer .form__message .svg-wrapper {
  flex-shrink: 0;
  height: 1.3rem;
  margin-right: 0.5rem;
  width: 1.3rem;
}

.form__message--large .icon,
.customer .form__message .svg-wrapper {
  height: 1.5rem;
  width: 1.5rem;
  margin-right: 1rem;
}

.customer .field .form__message .svg-wrapper {
  align-self: start;
}

.form-status {
  margin: 0;
  font-size: 1.6rem;
}

.form-status-list {
  padding: 0;
  margin: 2rem 0 4rem;
}

.form-status-list li {
  list-style-position: inside;
}

.form-status-list .link::first-letter {
  text-transform: capitalize;
}

/* component-quantity */
.quantity {
  color: rgba(var(--color-foreground));
  position: relative;
  width: calc(14rem / var(--font-body-scale) + var(--inputs-border-width) * 2);
  display: flex;
  border-radius: var(--inputs-radius);
  min-height: calc((var(--inputs-border-width) * 2) + 4.5rem);
}

.quantity:after {
  pointer-events: none;
  content: '';
  position: absolute;
  top: var(--inputs-border-width);
  right: var(--inputs-border-width);
  bottom: var(--inputs-border-width);
  left: var(--inputs-border-width);
  border: 0.1rem solid transparent;
  border-radius: var(--inputs-radius);
  box-shadow: 0 0 0 var(--inputs-border-width) rgba(var(--color-foreground), var(--inputs-border-opacity));
  transition: box-shadow var(--duration-short) ease;
  z-index: 1;
}

.quantity:before {
  background: rgb(var(--color-background));
  pointer-events: none;
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: var(--inputs-radius-outset);
  box-shadow: var(--inputs-shadow-horizontal-offset) var(--inputs-shadow-vertical-offset)
    var(--inputs-shadow-blur-radius) rgba(var(--color-shadow), var(--inputs-shadow-opacity));
  z-index: -1;
}

.quantity__input {
  color: currentColor;
  font-family: var(--font-body-family);
  font-style: var(--font-body-style);
  font-weight: var(--font-body-weight);
  font-size: 1.6rem;
  font-weight: 500;
  opacity: 0.85;
  text-align: center;
  background-color: transparent;
  border: 0;
  padding: 0 0.5rem;
  width: 100%;
  flex-grow: 1;
  -webkit-appearance: none;
  appearance: none;
}

.quantity__button {
  width: calc(4.5rem / var(--font-body-scale));
  flex-shrink: 0;
  font-size: 1.8rem;
  border: 0;
  background-color: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgb(var(--color-foreground));
  padding: 0;
}

.quantity__button:first-child {
  margin-left: calc(var(--inputs-border-width));
}

.quantity__button:last-child {
  margin-right: calc(var(--inputs-border-width));
}

.quantity__button .svg-wrapper {
  width: 1rem;
  pointer-events: none;
}

.quantity__button:focus-visible,
.quantity__input:focus-visible {
  background-color: rgb(var(--color-background));
  z-index: 2;
}

.quantity__button:focus,
.quantity__input:focus {
  background-color: rgb(var(--color-background));
  z-index: 2;
}

.quantity__button:not(:focus-visible):not(.focused),
.quantity__input:not(:focus-visible):not(.focused) {
  box-shadow: inherit;
  background-color: inherit;
}

.quantity__input:-webkit-autofill,
.quantity__input:-webkit-autofill:hover,
.quantity__input:-webkit-autofill:active {
  box-shadow: 0 0 0 10rem rgb(var(--color-background)) inset !important;
  -webkit-box-shadow: 0 0 0 10rem rgb(var(--color-background)) inset !important;
}

.quantity__input::-webkit-outer-spin-button,
.quantity__input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.quantity__input[type='number'] {
  -moz-appearance: textfield;
}

.quantity__rules {
  margin-top: 0.5rem;
  position: relative;
  font-size: 1.2rem;
}

.quantity__rules .caption {
  display: inline-block;
  margin-top: 0;
  margin-bottom: 0;
}

.quantity__rules .divider + .divider::before {
  content: '\2022';
  margin: 0 0.5rem;
}

.quantity__rules-cart {
  position: relative;
}

.product__info-container .loading__spinner:not(.hidden) ~ *,
.quantity__rules-cart .loading__spinner:not(.hidden) ~ * {
  visibility: hidden;
}

/* component-modal */
.modal__toggle {
  list-style-type: none;
}

.modal__toggle-close {
  display: none;
}

.modal__toggle-open {
  display: flex;
}

.modal__close-button.link {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0rem;
  height: 4.4rem;
  width: 4.4rem;
  background-color: transparent;
}

.modal__close-button .icon {
  width: 1.7rem;
  height: 1.7rem;
}

.modal__content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgb(var(--color-background));
  z-index: 4;
  display: flex;
  justify-content: center;
  align-items: center;
}

.media-modal {
  cursor: zoom-out;
}

.media-modal .deferred-media {
  cursor: initial;
}

/* component-cart-count-bubble */
.cart-count-bubble:empty {
  display: none;
}

.cart-count-bubble {
  position: absolute;
  background-color: rgb(var(--color-button));
  color: rgb(var(--color-button-text));
  height: 1.7rem;
  width: 1.7rem;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.9rem;
  bottom: 0.8rem;
  left: 2.2rem;
  line-height: calc(1 + 0.1 / var(--font-body-scale));
}

/* utility-bar */
.utility-bar {
  height: 100%;
}

.utility-bar--bottom-border {
  border-bottom: 0.1rem solid rgba(var(--color-foreground), 0.08);
}

@media screen and (min-width: 990px) {
  .utility-bar--bottom-border-social-only {
    border-bottom: 0.1rem solid rgba(var(--color-foreground), 0.08);
  }
}

.utility-bar__grid {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-areas: 'announcements';
}

.utility-bar__grid .list-social {
  justify-content: flex-start;
  align-content: center;
  margin-left: -1.2rem;
  grid-area: social-icons;
}

@media screen and (max-width: 989px) {
  .utility-bar .utility-bar__grid .list-social {
    display: none;
  }
}

.utility-bar .list-social__item .icon {
  scale: 0.9;
}

@media screen and (min-width: 990px) {
  .utility-bar__grid--3-col {
    grid-template-columns: 3fr 4fr 3fr;
    grid-template-areas: 'social-icons announcements language-currency';
  }

  .utility-bar__grid--2-col {
    grid-template-columns: 1fr 1fr;
    grid-template-areas: 'social-icons language-currency';
  }
}

.utility-bar .list-social__link:focus-visible {
  outline-offset: -0.3rem;
  box-shadow: 0 0 0 -0.2rem rgb(var(--color-foreground));
}

.localization-wrapper {
  grid-area: language-currency;
  align-self: center;
  display: flex;
  justify-content: flex-end;
}

.localization-wrapper .localization-selector + .disclosure__list-wrapper {
  animation: animateMenuOpen var(--duration-default) ease;
}

.utility-bar .localization-wrapper .disclosure .localization-form__select,
.utility-bar .localization-wrapper .disclosure__link {
  font-size: calc(var(--font-heading-scale) * 1.3rem);
}

@media screen and (min-width: 990px) {
  body:has(.section-header .header:not(.drawer-menu)) .utility-bar .page-width {
    padding-left: 5rem;
    padding-right: 5rem;
  }
}

/* section-header */
.section-header.shopify-section-group-header-group {
  z-index: 3;
}

.shopify-section-header-sticky {
  position: sticky;
  top: 0;
}

.shopify-section-header-hidden {
  top: calc(-1 * var(--header-height));
}

.shopify-section-header-hidden.menu-open {
  top: 0;
}

.section-header.animate {
  transition: top 0.15s ease-out;
}

.shopify-section-group-header-group {
  z-index: 4;
}

.section-header ~ .shopify-section-group-header-group {
  z-index: initial;
}

/* Main Header Layout */
.header-wrapper {
  display: block;
  position: relative;
  background-color: rgb(var(--color-background));
}

.header-wrapper--border-bottom {
  border-bottom: 0.1rem solid rgba(var(--color-foreground), 0.08);
}

.header {
  display: grid;
  grid-template-areas: 'left-icons heading icons';
  grid-template-columns: 1fr 2fr 1fr;
  align-items: center;
}

@media screen and (max-width: 749px) {
  .header--has-app {
    grid-template-columns: auto 1fr auto;
  }
}

@media screen and (min-width: 990px) {
  .header {
    grid-template-columns: 1fr auto 1fr;
  }

  .header--top-left,
  .header--middle-left:not(.header--has-menu) {
    grid-template-areas:
      'heading icons'
      'navigation navigation';
    grid-template-columns: 1fr auto;
  }

  .header--top-left.drawer-menu,
  .header--middle-left.drawer-menu {
    grid-template-areas: 'navigation heading icons';
    grid-template-columns: auto 1fr auto;
    column-gap: 1rem;
  }

  .header--middle-left {
    grid-template-areas: 'heading navigation icons';
    grid-template-columns: auto auto 1fr;
    column-gap: 2rem;
  }

  .header--middle-center:not(.drawer-menu) {
    grid-template-areas: 'navigation heading icons';
    grid-template-columns: 1fr auto 1fr;
    column-gap: 2rem;
  }

  .header--middle-center a.header__heading-link {
    text-align: center;
  }

  .header--top-center {
    grid-template-areas:
      'left-icons heading icons'
      'navigation navigation navigation';
  }

  .header--top-center.drawer-menu {
    grid-template-areas: 'left-icons heading icons';
    grid-template-columns: 1fr auto 1fr;
  }

  .header:not(.header--middle-left, .header--middle-center) .header__inline-menu {
    margin-top: 1.05rem;
  }
}

.header *[tabindex='-1']:focus {
  outline: none;
}

.header__heading {
  margin: 0;
  line-height: 0;
}

.header > .header__heading-link {
  line-height: 0;
}

.header__heading,
.header__heading-link {
  grid-area: heading;
  justify-self: center;
}

.header__heading-link {
  display: inline-block;
  padding: 0.75rem;
  text-decoration: none;
  word-break: break-word;
}

.header__heading-link:hover .h2 {
  color: rgb(var(--color-foreground));
}

.header__heading-link .h2 {
  line-height: 1;
  color: rgba(var(--color-foreground), 0.75);
}

.header__heading-logo {
  height: auto;
  max-width: 100%;
}

.header__heading-logo-wrapper {
  width: 100%;
  display: inline-block;
  transition: width 0.3s cubic-bezier(0.52, 0, 0.61, 0.99);
}

@media screen and (max-width: 989px) {
  .header__heading,
  .header__heading-link {
    text-align: center;
  }

  .header--mobile-left .header__heading,
  .header--mobile-left .header__heading-link {
    text-align: left;
    justify-self: start;
  }

  .header--mobile-left {
    grid-template-columns: auto 2fr 1fr;
  }
}

@media screen and (min-width: 990px) {
  .header--middle-left .header__heading-link,
  .header--top-left .header__heading-link {
    margin-left: -0.75rem;
  }

  .header__heading,
  .header__heading-link {
    justify-self: start;
  }

  .header--middle-center .header__heading-link,
  .header--middle-center .header__heading {
    justify-self: center;
    text-align: center;
  }

  .header--top-center .header__heading-link,
  .header--top-center .header__heading {
    justify-self: center;
    text-align: center;
  }
}

/* Header icons */
.header__icons {
  display: flex;
  grid-area: icons;
  justify-self: end;
  padding-right: 0.8rem;
}

.header__icons .shopify-app-block {
  max-width: 4.4rem;
  max-height: 4.4rem;
  overflow: hidden;
}

.header__icon:not(.header__icon--summary),
.header__icon span {
  display: flex;
  align-items: center;
  justify-content: center;
}

.header__icon {
  color: rgb(var(--color-foreground));
}

.header__icon span {
  height: 100%;
}

.header__icon .svg-wrapper {
  width: 44px;
  height: 44px;
}

.header__icon::after {
  content: none;
}

.header__icon:hover .icon,
.modal__close-button:hover .icon {
  transform: scale(1.07);
}

.header__icon .icon {
  height: 2rem;
  width: 2rem;
  fill: none;
  vertical-align: middle;
}

.header__icon,
.header__icon--cart {
  height: 4.4rem;
  width: 4.4rem;
  padding: 0;

}


/* ===== GlowenLiving cart icon - prevent SVG clipping ===== */
.header__icon--cart,
.header__icon--cart .svg-wrapper,
.header__icon--cart svg {
  overflow: visible !important;
}

.header__icon--cart .svg-wrapper {
  flex-shrink: 0;
}

.header__icon--cart {
  position: relative;
}

.header__icon--cart .icon {
  height: 40px;
  width: 40px;
}

.header__icon--menu[aria-expanded='true']::before {
  content: '';
  top: 100%;
  left: 0;
  height: calc(var(--viewport-height, 100vh) - (var(--header-bottom-position, 100%)));
  width: 100%;
  display: block;
  position: absolute;
  background: rgba(var(--color-foreground), 0.5);
}

.header__icon--account shop-user-avatar {
  --shop-avatar-size: 2.8rem;
}

details .header__icon-close {
  display: none;
}

details[open] .header__icon-close {
  display: inline-block;
}

account-icon {
  display: flex;
}

/* Search */
menu-drawer + .header__search {
  display: none;
}

.header > .header__search {
  grid-area: left-icons;
  justify-self: start;
}

.header--top-center.drawer-menu > .header__search {
  margin-left: 3.2rem;
}

.header--top-center header-drawer {
  grid-area: left-icons;
}

.header:not(.header--has-menu) * > .header__search {
  display: none;
}

.header__search {
  display: inline-flex;
  line-height: 0;
}

.header--top-center > .header__search {
  display: none;
}

.header--top-center * > .header__search {
  display: inline-flex;
}

@media screen and (min-width: 990px) {
  .header:not(.header--top-center) * > .header__search,
  .header--top-center > .header__search {
    display: inline-flex;
  }

  .header:not(.header--top-center) > .header__search,
  .header--top-center * > .header__search {
    display: none;
  }
}

details[open] > .search-modal {
  opacity: 1;
  animation: animateMenuOpen var(--duration-default) ease;
}

details[open] .modal-overlay {
  display: block;
}

details[open] .modal-overlay::after {
  position: absolute;
  content: '';
  background-color: rgb(var(--color-foreground), 0.5);
  top: 100%;
  left: 0;
  right: 0;
  height: 100vh;
}

.search-modal {
  opacity: 0;
  border-bottom: 0.1rem solid rgba(var(--color-foreground), 0.08);
  min-height: calc(100% + var(--inputs-margin-offset) + (2 * var(--inputs-border-width)));
  height: 100%;
}

.search-modal__content {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0 5rem 0 1rem;
  line-height: calc(1 + 0.8 / var(--font-body-scale));
  position: relative;
}

.search-modal__content-bottom {
  bottom: calc((var(--inputs-margin-offset) / 2));
}

.search-modal__content-top {
  top: calc((var(--inputs-margin-offset) / 2));
}

.search-modal__form {
  width: 100%;
}

.search-modal__close-button {
  position: absolute;
  right: 0.3rem;
}

@media screen and (min-width: 750px) {
  .search-modal__close-button {
    right: 1rem;
  }

  .search-modal__content {
    padding: 0 6rem;
  }
}

@media screen and (min-width: 990px) {
  .search-modal__form {
    max-width: 74.2rem;
  }

  .search-modal__close-button {
    position: initial;
    margin-left: 0.5rem;
  }
}

/* Header menu drawer */
.header__icon--menu .icon {
  display: block;
  position: absolute;
  opacity: 1;
  transform: scale(1);
  transition: transform 150ms ease, opacity 150ms ease;
}

details:not([open]) > .header__icon--menu .icon-close,
details[open] > .header__icon--menu .icon-hamburger {
  visibility: hidden;
  opacity: 0;
  transform: scale(0.8);
}

.js details[open]:not(.menu-opening) > .header__icon--menu .icon-close {
  visibility: hidden;
}

.js details[open]:not(.menu-opening) > .header__icon--menu .icon-hamburger {
  visibility: visible;
  opacity: 1;
  transform: scale(1.07);
}

.js details > .header__submenu {
  opacity: 0;
  transform: translateY(-1.5rem);
}

details[open] > .header__submenu {
  animation: animateMenuOpen var(--duration-default) ease;
  animation-fill-mode: forwards;
  z-index: 1;
}

@media (prefers-reduced-motion) {
  details[open] > .header__submenu {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Header menu */
.header__inline-menu {
  margin-left: -1.2rem;
  grid-area: navigation;
  display: none;
}

.header--top-center .header__inline-menu,
.header--top-center .header__heading-link {
  margin-left: 0;
}

@media screen and (min-width: 990px) {
  .header__inline-menu {
    display: block;
  }

  .header--top-center .header__inline-menu {
    justify-self: center;
  }

  .header--top-center .header__inline-menu > .list-menu--inline {
    justify-content: center;
  }

  .header--middle-left .header__inline-menu {
    margin-left: 0;
  }
}

.header__menu {
  padding: 0 1rem;
}

.header__menu-item {
  padding: 1.2rem;
  text-decoration: none;
  color: rgba(var(--color-foreground), 0.75);
}

.header__menu-item:hover {
  color: rgb(var(--color-foreground));
}

.header__menu-item span {
  transition: text-decoration var(--duration-short) ease;
}

.header__menu-item:hover span {
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}

details[open] > .header__menu-item {
  text-decoration: underline;
}

details[open]:hover > .header__menu-item {
  text-decoration-thickness: 0.2rem;
}

details[open] > .header__menu-item .icon-caret {
  transform: rotate(180deg);
}

.header__active-menu-item {
  transition: text-decoration-thickness var(--duration-short) ease;
  color: rgb(var(--color-foreground));
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}

.header__menu-item:hover .header__active-menu-item {
  text-decoration-thickness: 0.2rem;
}

.header__submenu {
  transition: opacity var(--duration-default) ease, transform var(--duration-default) ease;
}

.global-settings-popup,
.header__submenu.global-settings-popup {
  border-radius: var(--popup-corner-radius);
  border-color: rgba(var(--color-foreground), var(--popup-border-opacity));
  border-style: solid;
  border-width: var(--popup-border-width);
  box-shadow: var(--popup-shadow-horizontal-offset) var(--popup-shadow-vertical-offset) var(--popup-shadow-blur-radius)
    rgba(var(--color-shadow), var(--popup-shadow-opacity));
  z-index: -1;
}

.header__submenu.list-menu {
  padding: 1rem 0;
}

.header__submenu .header__submenu {
  background-color: rgba(var(--color-foreground), 0.03);
  padding: 1rem 0;
  margin: 1rem 0;
}

.header__submenu .header__menu-item:after {
  right: 2rem;
}

.header__submenu .header__menu-item {
  justify-content: space-between;
  padding: 0.8rem 2rem;
}

.header__submenu .header__menu-item:hover {
  text-decoration-line: underline;
}

.header__menu-item .icon-caret {
  right: 0.8rem;
}

.header__submenu .icon-caret {
  flex-shrink: 0;
  margin-left: 1rem;
  position: static;
}

header-menu > details,
details-disclosure > details {
  position: relative;
}

@keyframes animateMenuOpen {
  0% {
    opacity: 0;
    transform: translateY(-1.5rem);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.overflow-hidden-mobile,
.overflow-hidden-tablet,
.overflow-hidden-desktop {
  overflow: hidden;
}

@media screen and (min-width: 750px) {
  .overflow-hidden-mobile {
    overflow: auto;
  }
}

@media screen and (min-width: 990px) {
  .overflow-hidden-tablet {
    overflow: auto;
  }
}

.badge {
  border: 1px solid transparent;
  border-radius: var(--badge-corner-radius);
  display: inline-block;
  font-size: 1.2rem;
  letter-spacing: 0.1rem;
  line-height: 1;
  padding: 0.5rem 1.3rem 0.6rem 1.3rem;
  text-align: center;
  background-color: rgb(var(--color-badge-background));
  border-color: rgba(var(--color-badge-border), var(--alpha-badge-border));
  color: rgb(var(--color-badge-foreground));
  word-break: break-word;
}

.gradient {
  background: rgb(var(--color-background));
  background: var(--gradient-background);
  background-attachment: fixed;
}

@media screen and (forced-colors: active) {
  .icon {
    color: CanvasText;
    fill: CanvasText !important;
  }

  .icon-close-small path {
    stroke: CanvasText;
  }
}

.ratio {
  display: flex;
  position: relative;
  align-items: stretch;
}

.ratio::before {
  content: '';
  width: 0;
  height: 0;
  padding-bottom: var(--ratio-percent);
}

.content-container {
  border-radius: var(--text-boxes-radius);
  border: var(--text-boxes-border-width) solid rgba(var(--color-foreground), var(--text-boxes-border-opacity));
  position: relative;
}

.content-container:after {
  content: '';
  position: absolute;
  top: calc(var(--text-boxes-border-width) * -1);
  right: calc(var(--text-boxes-border-width) * -1);
  bottom: calc(var(--text-boxes-border-width) * -1);
  left: calc(var(--text-boxes-border-width) * -1);
  border-radius: var(--text-boxes-radius);
  box-shadow: var(--text-boxes-shadow-horizontal-offset) var(--text-boxes-shadow-vertical-offset)
    var(--text-boxes-shadow-blur-radius) rgba(var(--color-shadow), var(--text-boxes-shadow-opacity));
  z-index: -1;
}

.content-container--full-width:after {
  left: 0;
  right: 0;
  border-radius: 0;
}

@media screen and (max-width: 749px) {
  .content-container--full-width-mobile {
    border-left: none;
    border-right: none;
    border-radius: 0;
  }
  .content-container--full-width-mobile:after {
    display: none;
  }
}

.global-media-settings {
  position: relative;
  border: var(--media-border-width) solid rgba(var(--color-foreground), var(--media-border-opacity));
  border-radius: var(--media-radius);
  overflow: visible !important;
  background-color: rgb(var(--color-background));
}

.global-media-settings:after {
  content: '';
  position: absolute;
  top: calc(var(--media-border-width) * -1);
  right: calc(var(--media-border-width) * -1);
  bottom: calc(var(--media-border-width) * -1);
  left: calc(var(--media-border-width) * -1);
  border-radius: var(--media-radius);
  box-shadow: var(--media-shadow-horizontal-offset) var(--media-shadow-vertical-offset) var(--media-shadow-blur-radius)
    rgba(var(--color-shadow), var(--media-shadow-opacity));
  z-index: -1;
  pointer-events: none;
}

.global-media-settings--no-shadow {
  overflow: hidden !important;
}

.global-media-settings--no-shadow:after {
  content: none;
}

.global-media-settings img,
.global-media-settings iframe,
.global-media-settings model-viewer,
.global-media-settings video,
.global-media-settings .placeholder-svg {
  border-radius: calc(var(--media-radius) - var(--media-border-width));
}

.content-container--full-width,
.global-media-settings--full-width,
.global-media-settings--full-width img,
.global-media-settings--full-width video,
.global-media-settings--full-width iframe,
.global-media-settings--full-width .placeholder-svg {
  border-radius: 0;
  border-left: none;
  border-right: none;
}

/* check for flexbox gap in older Safari versions */
@supports not (inset: 10px) {
  .grid {
    margin-left: calc(-1 * var(--grid-mobile-horizontal-spacing));
  }

  .grid__item {
    padding-left: var(--grid-mobile-horizontal-spacing);
    padding-bottom: var(--grid-mobile-vertical-spacing);
  }

  @media screen and (min-width: 750px) {
    .grid {
      margin-left: calc(-1 * var(--grid-desktop-horizontal-spacing));
    }

    .grid__item {
      padding-left: var(--grid-desktop-horizontal-spacing);
      padding-bottom: var(--grid-desktop-vertical-spacing);
    }
  }

  .grid--gapless .grid__item {
    padding-left: 0;
    padding-bottom: 0;
  }

  @media screen and (min-width: 749px) {
    .grid--peek .grid__item {
      padding-left: var(--grid-mobile-horizontal-spacing);
    }
  }

  .product-grid .grid__item {
    padding-bottom: var(--grid-mobile-vertical-spacing);
  }

  @media screen and (min-width: 750px) {
    .product-grid .grid__item {
      padding-bottom: var(--grid-desktop-vertical-spacing);
    }
  }
}

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

/* outline and border styling for Windows High Contrast Mode */
@media (forced-colors: active) {
  .button,
  .shopify-challenge__button,
  .customer button {
    border: transparent solid 1px;
  }

  .button:focus-visible,
  .button:focus,
  .button.focused,
  .shopify-payment-button__button--unbranded:focus-visible,
  .shopify-payment-button [role='button']:focus-visible,
  .shopify-payment-button__button--unbranded:focus,
  .shopify-payment-button [role='button']:focus {
    outline: solid transparent 1px;
  }

  .field__input:focus,
  .select__select:focus,
  .customer .field input:focus,
  .customer select:focus,
  .localization-form__select:focus.localization-form__select:after {
    outline: transparent solid 1px;
  }

  .localization-form__select:focus {
    outline: transparent solid 1px;
  }
}

.rte:after {
  clear: both;
  content: '';
  display: block;
}

.rte > *:first-child {
  margin-top: 0;
}

.rte > *:last-child {
  margin-bottom: 0;
}

.rte table {
  table-layout: fixed;
}

@media screen and (min-width: 750px) {
  .rte table td {
    padding-left: 1.2rem;
    padding-right: 1.2rem;
  }
}

.rte img {
  height: auto;
  max-width: 100%;
  border: var(--media-border-width) solid rgba(var(--color-foreground), var(--media-border-opacity));
  border-radius: var(--media-radius);
  box-shadow: var(--media-shadow-horizontal-offset) var(--media-shadow-vertical-offset) var(--media-shadow-blur-radius)
    rgba(var(--color-shadow), var(--media-shadow-opacity));
  margin-bottom: var(--media-shadow-vertical-offset);
}

.rte ul,
.rte ol {
  list-style-position: inside;
  padding-left: 2rem;
}

.rte li {
  list-style: inherit;
}

.rte li:last-child {
  margin-bottom: 0;
}

.rte a {
  color: rgba(var(--color-link), var(--alpha-link));
  text-underline-offset: 0.3rem;
  text-decoration-thickness: 0.1rem;
  transition: text-decoration-thickness var(--duration-short) ease;
}

.rte a:hover {
  color: rgb(var(--color-link));
  text-decoration-thickness: 0.2rem;
}

.rte blockquote {
  display: inline-flex;
}

.rte blockquote > * {
  margin: -0.5rem 0 -0.5rem 0;
}

/* Image mask global styles */

.shape--mask {
  display: block;
  height: 0;
  width: 0;
}

.shape--arch {
  clip-path: url('#Shape-Arch');
}

.shape--blob {
  clip-path: polygon(var(--shape--blob-1));
}

.shape--chevronleft {
  clip-path: polygon(100% 0%, 85% 50%, 100% 100%, 15% 100%, 0% 50%, 15% 0%);
}

.shape--chevronright {
  clip-path: polygon(85% 0%, 100% 50%, 85% 100%, 0% 100%, 15% 50%, 0% 0%);
}

.shape--circle {
  clip-path: circle(closest-side);
}

.shape--diamond {
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

.shape--parallelogram {
  clip-path: polygon(15% 0, 100% 0%, 85% 100%, 0% 100%);
}

.shape--round {
  clip-path: ellipse(45% 45% at 50% 50%);
}

/* Fixed background */
.animate--fixed {
  clip-path: inset(0);
}

.animate--fixed > img:not(.zoom):not(.deferred-media__poster-button),
.animate--fixed > svg:not(.zoom):not(.deferred-media__poster-button) {
  position: fixed;
  height: 100vh;
}

/* Zoom in image on scroll */
.animate--zoom-in {
  --zoom-in-ratio: 1;
}

.animate--zoom-in > img,
.animate--zoom-in > .svg-wrapper {
  transition: scale var(--duration-short) linear;
  scale: var(--zoom-in-ratio);
}

/* Animations */

@media (prefers-reduced-motion: no-preference) {
  .animate--ambient > img,
  .animate--ambient > .svg-wrapper {
    animation: animateAmbient 30s linear infinite;
  }

  @keyframes animateAmbient {
    0% {
      transform: rotate(0deg) translateX(1em) rotate(0deg) scale(1.2);
    }
    100% {
      transform: rotate(360deg) translateX(1em) rotate(-360deg) scale(1.2);
    }
  }

  .scroll-trigger.animate--fade-in,
  .scroll-trigger.animate--slide-in {
    opacity: 0.01;
  }

  .scroll-trigger.animate--slide-in {
    transform: translateY(2rem);
  }

  .scroll-trigger:not(.scroll-trigger--offscreen).animate--fade-in {
    opacity: 1;
    animation: var(--animation-fade-in);
  }

  .scroll-trigger:not(.scroll-trigger--offscreen).animate--slide-in {
    animation: var(--animation-slide-in);
    animation-delay: calc(var(--animation-order) * 75ms);
  }

  .scroll-trigger.scroll-trigger--design-mode.animate--fade-in,
  .scroll-trigger.scroll-trigger--design-mode.animate--slide-in,
  .scroll-trigger.scroll-trigger--design-mode .slider,
  .scroll-trigger:not(.scroll-trigger--offscreen).scroll-trigger--cancel {
    opacity: 1;
    animation: none;
    transition: none;
    transform: none;
  }

  .scroll-trigger.scroll-trigger--design-mode.animate--slide-in {
    transform: translateY(0);
  }

  @keyframes slideIn {
    from {
      transform: translateY(2rem);
      opacity: 0.01;
    }
    to {
      transform: translateY(0);
      opacity: 1;
    }
  }

  @keyframes fadeIn {
    from {
      opacity: 0.01;
    }
    to {
      opacity: 1;
    }
  }
}

/* Element Hovers: Vertical Lift, 3d Lift */

@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .animate--hover-3d-lift .card-wrapper .card--card,
  .animate--hover-3d-lift .card-wrapper .card--standard .card__inner,
  .animate--hover-3d-lift .button:not(.button--tertiary),
  .animate--hover-3d-lift .shopify-challenge__button,
  .animate--hover-3d-lift .customer button,
  .animate--hover-3d-lift .shopify-payment-button__button,
  .animate--hover-3d-lift .deferred-media .deferred-media__poster-button {
    transition: transform var(--duration-long) ease, box-shadow var(--duration-long) ease;
    transform-origin: center;
  }

  .animate--hover-3d-lift .card-wrapper:hover .card--card,
  .animate--hover-3d-lift .card-wrapper:hover .card--standard .card__inner,
  .animate--hover-3d-lift .button:not(.button--tertiary):not([disabled]):hover,
  .animate--hover-3d-lift .shopify-challenge__button:not([disabled]):hover,
  .animate--hover-3d-lift .customer button:not([disabled]):hover,
  .animate--hover-3d-lift .shopify-payment-button__button:hover,
  .animate--hover-3d-lift .deferred-media:hover .deferred-media__poster-button {
    transition: transform var(--duration-extended) ease, box-shadow var(--duration-long) ease; /* Slow the card transition speed while hover is active. */
    transform: rotate(1deg);
    box-shadow: -1rem -1rem 1rem -1rem rgba(0, 0, 0, 0.05), 1rem 1rem 1rem -1rem rgba(0, 0, 0, 0.05),
      0 0 0.5rem 0 rgba(255, 255, 255, 0), 0 2rem 3.5rem -2rem rgba(0, 0, 0, 0.5);
  }

  .animate--hover-3d-lift .deferred-media:hover .deferred-media__poster-button {
    transform: translate(-50%, -50%) scale(1.05); /* Apply a specialized transform to the video play button. */
  }

  .animate--hover-3d-lift .collage__item .card-wrapper:hover .card--card,
  .animate--hover-3d-lift .collage__item .card-wrapper:hover .card--standard .card__inner {
    transform: rotate(0.5deg); /* Less intense rotation for collage items. */
  }

  .animate--hover-3d-lift .product-grid .grid__item:hover,
  .animate--hover-3d-lift .collection-list .grid__item:hover,
  .animate--hover-3d-lift .collage__item:hover,
  .animate--hover-3d-lift .blog-articles .article:hover,
  .animate--hover-3d-lift .complementary-slide li:hover {
    z-index: 2; /* Make sure the hovered card is the topmost card. */
  }

  .animate--hover-3d-lift .product-grid {
    isolation: isolate; /* Ensure z-index changes here don't negatively effect other UI stacking. */
  }

  .animate--hover-3d-lift .card-wrapper .card--shape.card--standard:not(.card--text) .card__inner {
    box-shadow: none;
    transition: transform var(--duration-long) ease, filter var(--duration-long) ease;
  }

  .animate--hover-3d-lift .card-wrapper:hover .card--shape.card--standard:not(.card--text) .card__inner {
    transition: transform calc(2 * var(--duration-extended)) ease, filter var(--duration-long) ease; /* Slow the card transition speed while hover is active. */
    filter: drop-shadow(0rem 2rem 2rem rgba(0, 0, 0, 0.15)) drop-shadow(0rem 1rem 1rem rgba(0, 0, 0, 0.15));
  }

  .animate--hover-3d-lift .card-wrapper:hover .card--card:after,
  .animate--hover-3d-lift .card-wrapper:hover .card--standard .card__inner:after,
  .animate--hover-3d-lift
    .card-wrapper:hover
    .card--shape.card--standard:not(.card--text)
    .card__inner
    .card__media:before {
    background-image: var(--easter-egg);
    background-size: 250px 250px;
    mix-blend-mode: color-dodge;
    pointer-events: none;
    z-index: 2;
  }

  .animate--hover-3d-lift
    .card-wrapper:hover
    .card--shape.card--standard:not(.card--text)
    .card__inner
    .card__media:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  }

  .animate--hover-3d-lift .card-wrapper .card--card:before,
  .animate--hover-3d-lift .card-wrapper .card--standard .card__media:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    pointer-events: none;
    transition: background-position calc(2 * var(--duration-extended)) ease, opacity var(--duration-default) ease;
    mix-blend-mode: overlay;
    background-size: 400% 100%;
    background-position: 90% 0;
    background-repeat: no-repeat;
    background-image: linear-gradient(
      135deg,
      rgba(255, 255, 255, 0) 45%,
      rgba(255, 255, 255, 1) 50%,
      rgba(255, 255, 255, 0) 55%
    );
  }

  .animate--hover-3d-lift .card-wrapper:hover .card--card:before,
  .animate--hover-3d-lift .card-wrapper:hover .card--standard .card__media:after {
    opacity: 0.2;
    transition: background-position 6s ease, opacity var(--duration-long) ease;
    background-position: left;
    z-index: 2;
  }

  :root {
    --easter-egg: none;
    --sparkle: url('./sparkle.gif');
  }

  .animate--hover-vertical-lift .button:not(.button--tertiary),
  .animate--hover-vertical-lift .shopify-challenge__button,
  .animate--hover-vertical-lift .customer button,
  .animate--hover-vertical-lift .shopify-payment-button__button {
    transition: transform var(--duration-default) var(--ease-out-slow);
  }

  .animate--hover-vertical-lift .card-wrapper .card--card,
  .animate--hover-vertical-lift .card-wrapper .card--standard .card__inner {
    transition: transform var(--duration-medium) var(--ease-out-slow);
  }

  .animate--hover-vertical-lift .card-wrapper:hover .card--card,
  .animate--hover-vertical-lift .card-wrapper:hover .card--standard .card__inner {
    transform: translateY(-0.75rem);
  }

  .animate--hover-vertical-lift .card-wrapper:active .card--card,
  .animate--hover-vertical-lift .card-wrapper:active .card--standard .card__inner {
    transform: translateY(-0.5rem);
  }

  .animate--hover-vertical-lift .button:not(.button--tertiary):not([disabled]):hover,
  .animate--hover-vertical-lift .shopify-challenge__button:not([disabled]):hover,
  .animate--hover-vertical-lift .customer button:not([disabled]):hover,
  .animate--hover-vertical-lift .shopify-payment-button__button:hover {
    transform: translateY(-0.25rem);
  }

  .animate--hover-vertical-lift .button:not(.button--tertiary):not([disabled]):active,
  .animate--hover-vertical-lift .shopify-challenge__button:not([disabled]):active,
  .animate--hover-vertical-lift .customer button:not([disabled]):active,
  .animate--hover-vertical-lift .shopify-payment-button__button:active {
    transform: translateY(0);
  }

  .animate--hover-vertical-lift .button:not([disabled]):hover:after,
  .animate--hover-vertical-lift .customer button:not([disabled]):hover:after,
  .animate--hover-vertical-lift .shopify-payment-button__button:not([disabled]):hover:after {
    --border-offset: 0.3px; /* Default is 1.3px as defined above in this file. This removes 1px to prevent the border from growing on buttons when this effect is on.  */
    box-shadow: 0 0 0 calc(var(--buttons-border-width) + var(--border-offset))
        rgba(var(--color-button-text), var(--border-opacity)),
      0 0 0 var(--buttons-border-width) rgba(var(--color-button), var(--alpha-button-background));
  }

  .animate--hover-vertical-lift .button:not([disabled]).button--secondary:hover:after {
    --border-offset: 0px; /* Prevent the border from growing on buttons when this effect is on. */
  }
}

/* Loading spinner */
.loading__spinner {
  position: absolute;
  z-index: 1;
  width: 1.8rem;
}

.loading__spinner {
  width: 1.8rem;
  display: inline-block;
}

.spinner {
  animation: rotator 1.4s linear infinite;
}

@keyframes rotator {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(270deg);
  }
}

.path {
  stroke-dasharray: 280;
  stroke-dashoffset: 0;
  transform-origin: center;
  stroke: rgb(var(--color-foreground));
  animation: dash 1.4s ease-in-out infinite;
}

@media screen and (forced-colors: active) {
  .path {
    stroke: CanvasText;
  }
}

@keyframes dash {
  0% {
    stroke-dashoffset: 280;
  }
  50% {
    stroke-dashoffset: 75;
    transform: rotate(135deg);
  }
  100% {
    stroke-dashoffset: 280;
    transform: rotate(450deg);
  }
}

.loading__spinner:not(.hidden) + .cart-item__price-wrapper,
.loading__spinner:not(.hidden) ~ cart-remove-button {
  opacity: 50%;
}

.loading__spinner:not(.hidden) ~ cart-remove-button {
  pointer-events: none;
  cursor: default;
}

/* Progress bar */
.progress-bar-container {
  width: 100%;
  margin: auto;
}

.progress-bar {
  height: 0.13rem;
  width: 100%;
}

.progress-bar-value {
  width: 100%;
  height: 100%;
  background-color: rgb(var(--color-foreground));
  animation: indeterminateAnimation var(--duration-extra-longer) infinite ease-in-out;
  transform-origin: 0;
}

.progress-bar .progress-bar-value {
  display: block;
}

@keyframes indeterminateAnimation {
  0% {
    transform: translateX(-20%) scaleX(0);
  }
  40% {
    transform: translateX(30%) scaleX(0.7);
  }
  100% {
    transform: translateX(100%) scaleX(0);
  }
}
/* ==============================================
   GLOWENLIVING SORT/FILTER POPOVER PREMIUM FINISH
   Fase 12 — subtiele premium afronding sort/filter popover
   Scope: .facets__display (collectie sort- en filter-popover),
   uitsluitend gerenderd binnen snippets/facets.liquid
   ============================================== */

.facets__display {
  background-color: #FCFAF7 !important;
  border: 1px solid rgba(201, 162, 77, 0.25) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
}

.facets__display .facets__header {
  background-color: #FCFAF7 !important;
  border-bottom-color: rgba(201, 162, 77, 0.2) !important;
}

.facets__display .facets__label {
  appearance: none;
  -webkit-appearance: none;
  background-color: transparent;
  border: none;
  border-radius: 8px;
  width: 100%;
  text-align: left;
  padding: 10px 14px;
  margin: 2px 0 !important;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.facets__display .facets__label:hover {
  background-color: rgba(201, 162, 77, 0.08);
}

.facets__display .facets__label.active {
  background-color: rgba(201, 162, 77, 0.14);
  font-weight: 600;
}

.facets__display .facets__label:focus-visible {
  outline: 1px solid rgba(201, 162, 77, 0.6);
  outline-offset: -1px;
}

/* ==============================================
   GLOWENLIVING PRODUCT CARD — FULL CORNER RADIUS FIX
   Fase 12 — ook onderhoeken van productafbeeldingen afronden
   Root cause: Dawn's eigen stock-regel ".card--card .card__inner
   .card__media" (assets/component-card.css) zet border-bottom-left/
   right-radius bewust terug naar 0, zodat het beeld naadloos aansluit
   op de kaart-inhoud eronder. Er is geen native Theme Editor-instelling
   om dit per hoek te sturen. Deze override herstelt uitsluitend de
   onderhoeken naar dezelfde waarde als de bovenhoeken, met exact
   dezelfde formule als Dawn zelf gebruikt voor de bovenhoeken —
   blijft dus automatisch in sync met de "Product cards → Corner
   radius"-instelling (nu 18px). Scope: uitsluitend .product-card-wrapper
   (productkaarten), NIET collection-cards of blog-cards.
   ============================================== */

.product-card-wrapper .card--card .card__inner .card__media {
  border-bottom-right-radius: calc(var(--border-radius) - var(--border-width) - var(--image-padding)) !important;
  border-bottom-left-radius: calc(var(--border-radius) - var(--border-width) - var(--image-padding)) !important;
}

/* ==============================================
   GLOWENLIVING HOMEPAGE COLLECTION CARDS — WHITE BOTTOM EDGE FIX
   Root cause: een los "Custom Liquid"-sectieblok (niet onderdeel van de
   theme-bestanden) injecteert een sitebrede inline <style>-regel
   ".product-card__image, .product-card__media, [class*=\'product\']
   [class*=\'image\'], .card__image, .card__media { margin-bottom: 16px; }".
   Op de homepage "Ontdek onze collecties"-kaarten (collection-list,
   card-stijl "standard") is .card__media absoluut gepositioneerd met
   inset:0 binnen een vierkante .card__inner-ratiobox; de margin-bottom
   van die externe regel duwt de afbeelding 16px korter dan de kaart,
   wat een leeg wit vlak onder de afgeronde hoeken laat staan. Deze fix
   neutraliseert die margin uitsluitend voor de homepage-collectiekaarten
   — de externe regel zelf (en het effect elders, indien van toepassing)
   blijft onaangeroerd.
   Scope: uitsluitend .collection-card-wrapper .card__media
   ============================================== */

.collection-card-wrapper .card__media {
  margin-bottom: 0 !important;
}

/* ============================
   GLOWENLIVING – CLEAN FIXES (SCHOON)
   Plak dit helemaal ONDERAAN base.css
   ============================ */

:root{
  --gl-bg: --gl-bg: #F5F0E8;
  --gl-text: #EDEDED;
  --gl-gold: #C9A24D;
}

/* 1) Verwijder gradient op alle pagina’s behalve homepage */
body:not(.template-index),
body:not(.template-index) .gradient,
body:not(.template-index) #MainContent,
body:not(.template-index) .content-for-layout,
body:not(.template-index) .color-background-1,
body:not(.template-index) .color-background-2,
body:not(.template-index) .color-background-3{
  background: var(--gl-bg) !important;
  background-image: none !important;
}

/* ===== GlowenLiving cart drawer + cart-count badge — lokaal gescoopte fix =====
   Root cause: de bestaande custom --gl-bg variabele is kapot (bevat een
   verdubbelde eigenschapsnaam in zijn eigen waarde) EN de bijbehorende
   "behalve homepage"-uitzondering (body:not(.template-index)) werkt nooit,
   omdat <body> in dit theme nooit een .template-index klasse krijgt.
   Deze fix raakt GEEN van beide kapotte mechanismen aan en gebruikt in
   plaats daarvan uitsluitend Dawn's eigen, correct werkende
   --color-background/--color-foreground variabelen, strikt gescoopt tot
   de cart drawer en de cart-count-badge in de header. */

#CartDrawer .drawer__inner {
  background: rgb(var(--color-background)) !important;
}

#cart-icon-bubble .cart-count-bubble {
  background-color: rgb(var(--color-foreground)) !important;
  color: rgb(var(--color-background)) !important;
}

/* ===== GlowenLiving mobiele cart-drawer grid-fix =====
   Root cause (native, onaangepast Publisher/Dawn-bestand
   assets/component-cart-drawer.css, regel 217):
   ".cart-drawer .cart-item__image { max-width: 100%; }" heeft een hogere
   specificiteit dan ".cart-item__image { max-width: 10rem/... }" uit
   component-cart-items.css, en geldt zonder mediaquery. In combinatie met
   de mobiele grid-layout ".cart-item { grid-template: repeat(2,auto) /
   repeat(4,1fr); }" (eveneens native, zelfde bestand) zorgt de standaard
   CSS Grid "min-width:auto"-regel ervoor dat de afbeeldingskolom niet kan
   krimpen -- die eist zijn volle content-breedte op en verdrukt de andere
   3 kolommen (gemeten: 150px/12px/12px/117px i.p.v. gelijke kolommen).
   Op desktop is dit onzichtbaar omdat de drawer daar veel breder is en de
   scheve verdeling geen zichtbare schade geeft; op mobiel (veel smaller)
   leidt het tot de gerapporteerde overlappende/verkeerd gepositioneerde
   cart-drawer-inhoud. Minimale, uitsluitend mobiele, uitsluitend
   drawer-gescoopte correctie: laat de kolommen daadwerkelijk krimpen. */
@media screen and (max-width: 749px) {
  #CartDrawer .cart-item {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* ===== GlowenLiving checkout-knop tekstcontrast — lokaal gescoopte fix =====
   Root cause: kleurenschema "scheme-1" (gebruikt door cart_color_scheme)
   heeft zowel button als button_label op wit (#ffffff) staan -- elke
   primaire .button binnen scheme-1 (o.a. de checkoutknop in de cart
   drawer en op de losse /cart-pagina) krijgt daardoor witte tekst op een
   witte achtergrond: onzichtbaar, maar wel aanwezig en klikbaar. Alle
   overige 19 kleurenschema's in dit theme zijn correct geconfigureerd
   (goud/wit); scheme-1 is de enige afwijkende. Deze fix raakt uitsluitend
   de twee checkoutknoppen zelf, niet het onderliggende kleurenschema. */
#CartDrawer-Checkout,
#checkout.cart__checkout-button {
  background-color: #C9A24D !important;
  color: #FFFFFF !important;
}

body:not{.template-index){
  --gradient-background: var(--gl-bg) !important;
  --color-background: 245,240,232 !important;
  color: var(--gl-text);
}

/* 2) Productpagina: tekst leesbaar + geen afkappen */
.template-product,
.template-product p,
.template-product li,
.template-product h1,
.template-product h2,
.template-product h3{
  color: var(--gl-text) !important;
}

.template-product #MainContent,
.template-product .product,
.template-product .product__info-wrapper,
.template-product .product__info-container,
.template-product .product__description,
.template-product .shopify-section{
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

.template-product #MainContent{
  padding-bottom: 140px !important;
}

/* 3) Productpagina knoppen */
.template-product .button,
.template-product button,
.template-product input[type="submit"]{
  background-color: var(--gl-gold) !important;
  border-color: var(--gl-gold) !important;
  color: #000 !important;
}

/* 4) FIX: zwarte box in homepage hero (ALLEEN deze banner sectie) */
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__box,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__content,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__box::before,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__box::after,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__content::before,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__box.gradient{
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

#shopify-section-template--26943059952000__image_banner_G8B84X .banner__box::before,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__box::after,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__content::before{
  display: none !important;
  opacity: 0 !important;
}
/* 4) FIX: zwarte box in homepage hero (ALLEEN deze banner sectie) */
#shopify-section-template--26943059952000__image_banner_G8B84X,
#shopify-section-template--26943059952000__image_banner_G8B84X .gradient,
#shopify-section-template--26943059952000__image_banner_G8B84X [class*="color-scheme-"].gradient{
  --gradient-background: transparent !important;
  background: transparent !important;
  background-image: none !important;
}

#shopify-section-template--26943059952000__image_banner_G8B84X .banner__box,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__content,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__box::before,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__box::after,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__content::before,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__box.gradient{
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

#shopify-section-template--26943059952000__image_banner_G8B84X .banner__box::before,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__box::after,
#shopify-section-template--26943059952000__image_banner_G8B84X .banner__content::before{
  display: none !important;
  opacity: 0 !important;
}
/* FIX: zwarte balk onder homepage hero (rich text sectie) */
#shopify-section-template--26943059952000__rich-text .rich-text,
#shopify-section-template--26943059952000__rich-text .gradient,
#shopify-section-template--26943059952000__rich-text .content-container,
#shopify-section-template--26943059952000__rich-text .color-scheme-4 {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
/* FIX: zwarte balk onder homepage hero (rich text sectie) */
#shopify-section-template--26943059952000__rich-text .rich-text,
#shopify-section-template--26943059952000__rich-text .gradient,
#shopify-section-template--26943059952000__rich-text .content-container,
#shopify-section-template--26943059952000__rich-text .color-scheme-4 {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
/* ========== GLOWENLIVING: HERO BOX TRANSPARANT (Homepage) ========== */
.template-index #shopify-section-template--26943059952000__image_banner_G8B84X .banner__box,
.template-index #shopify-section-template--26943059952000__image_banner_G8B84X .banner__content,
.template-index #shopify-section-template--26943059952000__image_banner_G8B84X .content-container {
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* haal de “container shadow/overlay” weg (dit is vaak de echte boosdoener) */
.template-index #shopify-section-template--26943059952000__image_banner_G8B84X .content-container:after,
.template-index #shopify-section-template--26943059952000__image_banner_G8B84X .banner__box:before,
.template-index #shopify-section-template--26943059952000__image_banner_G8B84X .banner__box:after,
.template-index #shopify-section-template--26943059952000__image_banner_G8B84X .banner__content:before {
  display: none !important;
  opacity: 0 !important;
}
/* GLOWENLIVING – homepage hero tekstbox volledig transparant */
.template-index 
#shopify-section-template--26943059952000__image_banner_G8B84X 
.banner__box {
  background: transparent !important;
  box-shadow: none !important;
  max-width: 100% !important;
  padding: 0 !important;
}
/* GLOWENLIVING – HERO: zwarte tekstbox écht weg (Publisher) */
.template-index
#shopify-section-template--26943059952000__image_banner_G8B84X
.banner__box,
.template-index
#shopify-section-template--26943059952000__image_banner_G8B84X
.banner__content,
.template-index
#shopify-section-template--26943059952000__image_banner_G8B84X
.content-container {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Dit is vaak de échte boosdoener: schaduw/overlay via :after/:before */
.template-index
#shopify-section-template--26943059952000__image_banner_G8B84X
.content-container::after,
.template-index
#shopify-section-template--26943059952000__image_banner_G8B84X
.banner__box::before,
.template-index
#shopify-section-template--26943059952000__image_banner_G8B84X
.banner__box::after,
.template-index
#shopify-section-template--26943059952000__image_banner_G8B84X
.banner__content::before {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
}

/* Als de box “smal” blijft: force full width + geen padding */
.template-index
#shopify-section-template--26943059952000__image_banner_G8B84X
.banner__box {
  max-width: 100% !important;
  padding: 0 !important;
}
/* GLOWENLIVING – zwarte balk onder hero (rich text sectie) */
.template-index
#shopify-section-template--26943059952000__rich-text,
.template-index
#shopify-section-template--26943059952000__rich-text .gradient,
.template-index
#shopify-section-template--26943059952000__rich-text .content-container,
.template-index
#shopify-section-template--26943059952000__rich-text .rich-text {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: 0 !important;
}

.template-index
#shopify-section-template--26943059952000__rich-text .content-container::after{
  content: none !important;
  display: none !important;
  opacity: 0 !important;
}
/* Remove the background “box” behind text for this specific image banner */
#template--00__image_banner_GBX .banner__box,
#template--00__image_banner_GBX .image-with-text__content,
#template--00__image_banner_GBX .banner__content,
#template--00__image_banner_GBX .banner__text {
  background: transparent !important;
  box-shadow: none !important;
}
#template--26943059952000__image_banner_G88B4X .banner__box::before,
#template--26943059952000__image_banner_G88B4X .banner__box::after {
  background: transparent !important;
  opacity: 0 !important;
  content: none !important;
}
#template--00__image_banner_GBX .banner__box {
  background: transparent !important;
  box-shadow: none !important;
}
#template--00__image_banner_GBX .banner__box::before,
#template--00__image_banner_GBX .banner__box::after {
  background: transparent !important;
  opacity: 0 !important;
}
/* Remove the text background box on this specific Image banner */
#Banner-template--26943059952000__image_banner_G88B4X .banner__box.content-container {
  background: transparent !important;
  box-shadow: none !important;
}

/* If the dark layer is applied via the "gradient" utility class */
#Banner-template--26943059952000__image_banner_G88B4X .banner__box.gradient {
  background: transparent !important;
}
#Banner-template--00__image_banner_GBX .banner__box::before,
#Banner-template--00__image_banner_GBX .banner__box::after,
#Banner-template--00__image_banner_GBX .content-container::before,
#Banner-template--00__image_banner_GBX .content-container::after {
  background: transparent !important;
  opacity: 0 !important;
  content: none !important;
}
/* GlowenLiving - Product grid text readability (Publisher) */
.template-collection .card__heading,
.template-collection .card__heading a,
.template-collection .price,
.template-collection .price-item {
  color: rgba(245, 240, 230, 0.92) !important;
}

.template-collection .card__heading a:hover {
  color: rgba(255, 248, 235, 0.98) !important;
}
/* FIX: content verdwijnt niet achter sticky header (Publisher) */
.template-product {
  scroll-margin-top: 120px;
}

@media screen and (max-width: 749px) {
  #shopify-section-template--26943059952000__image_banner_G88B4X .banner__content {
    top: 15% !important;
    transform: translateY(0) !important;
  }
  
  #shopify-section-template--26943059952000__image_banner_G88B4X .banner__media img {
    object-position: top center !important;
  }
  
  #shopify-section-template--26943059952000__image_banner_G88B4X .banner {
    min-height: 60vh !important;
  }
}/* ============================
   GLOWENLIVING BUTTON FIX
   ============================ */

/* Add to cart knop */
button[type="submit"],
.product-form__submit {
  background-color: #D4AF37

 !important; /* goud */
  color: #000000 !important; /* zwart tekst */
  border: none !important;
}

/* Hover effect */
button[type="submit"]:hover,
.product-form__submit:hover {
  background-color: #b8903f !important; /* iets donkerder goud */
  color: #000000 !important;
}

/* Zorg dat PayPal knop niet domineert */
.shopify-payment-button__button {
  opacity: 0.85;
}
/* ============================
   GLOWENLIVING PREMIUM BUTTON
   ============================ */

/* Hoofdknop */
.product-form__submit {
  background-color: #F5F0E8  !important; /* rijk goud */
  color: #000000 !important; /* zwart tekst */
  border: none !important;
  border-radius: 6px;
  
  /* glow effect */
  box-shadow: 0 6px 18px rgba(212, 175, 55, 0.35);
  
  /* vloeiende animatie */
  transition: all 0.25s ease;
}

/* Hover effect */
.product-form__submit:hover {
  background-color: #b8962e !important; /* donkerder goud */
  
  /* lift effect */
  transform: translateY(-2px);
  
  /* sterkere glow */
  box-shadow: 0 10px 25px rgba(212, 175, 55, 0.45);
}

/* Klik effect */
.product-form__submit:active {
  transform: translateY(0px);
  box-shadow: 0 4px 10px rgba(212, 175, 55, 0.3);
}

/* PayPal minder dominant */
.shopify-payment-button__button {
  opacity: 0.8;
}
.product-form__submit {
  letter-spacing: 0.5px;
  font-weight: 600;
}
/* === EMAIL FORM FIX GLOWENLIVING === */

.newsletter-form__field-wrapper {
  display: flex;
  align-items: stretch;
  max-width: 500px;
}

.newsletter-form__field-wrapper input {
  border-radius: 8px 0 0 8px;
  border-right: none;
}

.newsletter-form__button {
  background: #C9A24D;
  border-radius: 0 8px 8px 0;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* hover effect */
.newsletter-form__button:hover {
  background: #b8923f;
}
.newsletter-form__field-wrapper input {
  background: #111;
  color: #fff;
  border: 1px solid #333;
}

.newsletter-form__field-wrapper input::placeholder {
  color: #888;
}

/* === GLOWENLIVING: Newsletter email field (perfect aligned) === */

/* Wrapper (Shopify newsletter uses field / field__input / field__button) */
.newsletter-form__field-wrapper .field {
  display: flex;
  align-items: stretch;
  border-radius: 10px;
  overflow: hidden;              /* voorkomt overlap */
  border: 1px solid rgba(255,255,255,.35);
  background: #111;
}

/* Input */
.newsletter-form__field-wrapper .field__input {
  border: 0 !important;
  background: transparent !important;
  color: #fff !important;
  padding: 12px 14px !important;
  box-shadow: none !important;
}

/* Button (pijltje) */
.newsletter-form__field-wrapper .field__button {
  margin: 0 !important;
  border: 0 !important;
  background: #C9A24D !important;
  color: #000 !important;
  width: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Zorg dat icon netjes mee kleurt */
.newsletter-form__field-wrapper .field__button svg {
  fill: currentColor !important;
}
/* ============================
   EMAIL FORM FIX (GLOWENLIVING)
   ============================ */

.newsletter-form {
  display: flex !important;
  justify-content: center;
}

.newsletter-form__field-wrapper {
  display: flex !important;
  align-items: center;
  border: 1px solid #C9A24D;
  border-radius: 12px;
  overflow: hidden;
  max-width: 420px;
  width: 100%;
  background-color: #0d0d0d;
}

/* Input veld */
.newsletter-form__field-wrapper input {
  flex: 1;
  padding: 14px 16px;
  border: none;
  background: transparent;
  color: white;
  font-size: 14px;
}

/* Placeholder */
.newsletter-form__field-wrapper input::placeholder {
  color: #aaa;
}

/* Button */
.newsletter-form__button {
  background: #C9A24D !important;
  color: black !important;
  border: none !important;
  padding: 0 20px !important;
  height: 48px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/* Hover effect */
.newsletter-form__button:hover {
  background: #b8933f !important;
}
/* ============================
   GLOWENLIVING PREMIUM EMAIL
   ============================ */

.newsletter-form {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}

/* Container */
.newsletter-form__field-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 440px;
  height: 56px;
  border-radius: 16px;
  background: #0f0f0f;
  border: 1.5px solid rgba(201,162,77,0.6);
  overflow: hidden;

  /* luxe shadow */
  box-shadow:
    0 0 0 1px rgba(201,162,77,0.15),
    0 10px 40px rgba(0,0,0,0.6),
    inset 0 0 15px rgba(255,255,255,0.02);
}

/* Input */
.newsletter-form__field-wrapper input {
  flex: 1;
  height: 100%;
  padding: 0 18px;
  border: none;
  background: transparent;
  color: #fff;
  font-size: 15px;
  letter-spacing: 0.3px;
}

/* Placeholder */
.newsletter-form__field-wrapper input::placeholder {
  color: #888;
}

/* Button */
.newsletter-form__button {
  height: 100%;
  min-width: 70px;
  border: none;

  /* luxe goud gradient */
  background: linear-gradient(
    135deg,
    #d4af37 0%,
    #c9a24d 40%,
    #b8933f 100%
  ) !important;

  color: black;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;

  /* subtiele scheiding */
  border-left: 1px solid rgba(0,0,0,0.2);
}

/* Hover effect */
.newsletter-form__button:hover {
  background: linear-gradient(
    135deg,
    #e0bd55,
    #c9a24d
  ) !important;
}

/* Focus effect */
.newsletter-form__field-wrapper:focus-within {
  border: 1.5px solid #d4af37;
  box-shadow:
    0 0 0 2px rgba(212,175,55,0.2),
    0 10px 40px rgba(0,0,0,0.6);
}
/* ============================
   NEWSLETTER HARD ALIGN FIX
   (maakt input + knop 1 strak geheel)
   ============================ */

.newsletter-form__field-wrapper{
  height: 52px !important;
  padding: 0 !important;
  align-items: stretch !important;  /* key */
}

/* input neemt exact de hoogte */
.newsletter-form__field-wrapper .field__input,
.newsletter-form__field-wrapper input{
  height: 100% !important;
  min-height: 100% !important;
  line-height: 1 !important;
  padding: 0 16px !important;
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* knop neemt exact de hoogte */
.newsletter-form__field-wrapper .newsletter-form__button,
.newsletter-form__field-wrapper button,
.newsletter-form__field-wrapper .button{
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-left: 1px solid rgba(0,0,0,.25) !important;
  box-shadow: none !important;
}

/* verwijder rare outlines */
.newsletter-form__field-wrapper input:focus,
.newsletter-form__field-wrapper button:focus{
  outline: none !important;
}
/* ============================
   GLOWENLIVING PREMIUM FINISH
   ============================ */

/* Container nog iets luxer */
.newsletter-form__field-wrapper{
  border: 1.5px solid rgba(201,162,77,0.55) !important;
  box-shadow:
    0 0 0 1px rgba(201,162,77,0.1),
    0 8px 30px rgba(0,0,0,0.7),
    inset 0 0 10px rgba(255,255,255,0.02) !important;
}

/* Input iets rustiger */
.newsletter-form__field-wrapper input{
  font-size: 14px !important;
  letter-spacing: 0.4px;
}

/* Placeholder subtieler */
.newsletter-form__field-wrapper input::placeholder{
  color: rgba(255,255,255,0.5) !important;
}

/* Knop: smaller + luxe goud */
.newsletter-form__button{
  min-width: 56px !important;
  padding: 0 !important;

  background: linear-gradient(
    135deg,
    #d4af37 0%,
    #c9a24d 40%,
    #a8832f 100%
  ) !important;

  border-left: 1px solid rgba(0,0,0,0.3) !important;
}

/* Arrow netjes centreren */
.newsletter-form__button svg{
  width: 18px;
  height: 18px;
}

/* Hover: subtiele luxe shine */
.newsletter-form__button:hover{
  background: linear-gradient(
    135deg,
    #e0bd55,
    #c9a24d
  ) !important;
}

/* Focus effect (premium glow) */
.newsletter-form__field-wrapper:focus-within{
  border: 1.5px solid rgba(212,175,55,0.8) !important;
  box-shadow:
    0 0 0 2px rgba(212,175,55,0.2),
    0 10px 40px rgba(0,0,0,0.8);
}
/* ============================
   FINAL LUXURY FIX (MINIMAL)
   ============================ */

/* container strakker */
.newsletter-form__field-wrapper{
  border: 1px solid rgba(201,162,77,0.5) !important;
  border-radius: 10px !important;
  height: 50px !important;
  background: #0c0c0c !important;
  box-shadow: 0 6px 25px rgba(0,0,0,0.6) !important;
}

/* input cleaner */
.newsletter-form__field-wrapper input{
  font-size: 14px !important;
  padding-left: 16px !important;
}

/* knop strak (geen ronde hoek rechts meer) */
.newsletter-form__button{
  min-width: 52px !important;
  border-radius: 0 !important;
  background: #C9A24D !important;
  border-left: 1px solid rgba(0,0,0,0.4) !important;
}

/* hover subtiel */
.newsletter-form__button:hover{
  background: #b8933f !important;
}

/* arrow iets kleiner en rustiger */
.newsletter-form__button svg{
  width: 16px;
  height: 16px;
}
.newsletter-form__field-wrapper{
  max-width: 520px !important;
  height: 56px !important;
}
/* ============================
   NEWSLETTER: REMOVE INNER BORDER
   ============================ */

/* kill alle borders/shadows binnen de nieuwsbrief */
.newsletter-form__field-wrapper,
.newsletter-form__field-wrapper *{
  box-shadow: none !important;
}

.newsletter-form__field-wrapper .field,
.newsletter-form__field-wrapper .field__input,
.newsletter-form__field-wrapper input{
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
}

/* themes zetten vaak een rand via pseudo-elements */
.newsletter-form__field-wrapper .field::before,
.newsletter-form__field-wrapper .field::after,
.newsletter-form__field-wrapper .field__input::before,
.newsletter-form__field-wrapper .field__input::after,
.newsletter-form__field-wrapper input::before,
.newsletter-form__field-wrapper input::after{
  content: none !important;
  display: none !important;
}

/* maak de wrapper zélf de enige rand */
.newsletter-form__field-wrapper{
  background: #0c0c0c !important;
  border: 1px solid rgba(201,162,77,.55) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

/* nette scheiding naar de knop */
.newsletter-form__button{
  border-left: 1px solid rgba(0,0,0,.35) !important;
  border-radius: 0 !important;
}
/* ============================
   FINAL TOUCH (ONE BAR LOOK)
   ============================ */

/* zachtere overgang tussen input en knop */
.newsletter-form__button{
  border-left: 1px solid rgba(255,255,255,0.08) !important;
}

/* wrapper iets strakker */
.newsletter-form__field-wrapper{
  border: 1px solid rgba(201,162,77,0.45) !important;
}

/* subtiele hover glow (premium gevoel) */
.newsletter-form__field-wrapper:hover{
  border-color: rgba(201,162,77,0.7) !important;
}

/* knop iets minder fel */
.newsletter-form__button{
  background: #c19a45 !important;
}

.newsletter-form__button:hover{
  background: #b38936 !important;
}
/* ===============================
   GLOWENLIVING PREMIUM CART FIX
   =============================== */

/* Subtotaal prijs groter */
.cart-drawer__footer strong,
.cart-drawer__footer span {
  font-size: 20px !important;
  font-weight: 600 !important;
}

/* Gouden glow knop */
.cart-drawer__footer button {
  background: linear-gradient(135deg, #C9A24D, #E5C97A) !important;
  color: #000 !important;
  font-weight: 600 !important;
  border-radius: 12px !important;
  box-shadow: 0 0 12px rgba(201,162,77,0.4);
  transition: all 0.3s ease;
}

/* Hover effect */
.cart-drawer__footer button:hover {
  box-shadow: 0 0 18px rgba(201,162,77,0.7);
  transform: translateY(-1px);
}

/* Product blok spacing */
.cart-item {
  padding: 10px 0 !important;
}

/* Gouden scheidingslijn */
.cart-item + .cart-item {
  border-top: 1px solid rgba(201,162,77,0.3);
}

/* Titel iets groter */
.cart-item__name {
  font-size: 15px;
  font-weight: 500;
}

/* Prijs goud */
.cart-item__price {
  color: #C9A24D !important;
  font-weight: 600;
}

/* Aantal box strakker */
.cart-item__quantity-wrapper {
  border: 1px solid #C9A24D;
  border-radius: 8px;
}

/* Remove icon goud */
.cart-item__remove {
  color: #C9A24D !important;
}

/* Subtotaal lijn */
.cart-drawer__footer {
  border-top: 1px solid rgba(201,162,77,0.4);
  padding-top: 15px;
}

/* Checkout knop groter */
.cart-drawer__footer button {
  width: 100%;
  height: 50px;
  font-size: 16px;
}
.badge--sale {
  background-color: #C6A75E !important;
  color: #000 !important;
}/* GlowenLiving – Premium sale badge kleur (goud) */
:root{
  --gl-sale-bg: #C6A75E;   /* goud/champagne */
  --gl-sale-txt: #111111; /* bijna zwart */
}

/* 1) Veel voorkomende Shopify badge classes */
.badge,
.badge--sale,
.badge--on-sale,
.badge--onsale,
.product-badge,
.product__badge,
.product-badges__badge,
.card__badge,
.card__badge--sale,
.price__badge-sale,
.price__badge--sale,
.price__badge--sale,
.price__badge-sale,
.price-item--sale,
.sale-badge,
.onsale,
.on-sale,
.label--sale,
.label-sale,
.tag--sale,
.tag-sale,
.ribbon,
.ribbon--sale,
.sticker,
.sticker--sale{
  background: var(--gl-sale-bg) !important;
  color: var(--gl-sale-txt) !important;
  border-color: transparent !important;
}

/* 2) Als jouw theme de badge als <span class="badge"> met extra wrappers zet */
[class*="badge"][class*="sale"],
[class*="badge"][class*="Sale"],
[class*="label"][class*="sale"],
[class*="tag"][class*="sale"],
[class*="ribbon"][class*="sale"],
[class*="sticker"][class*="sale"]{
  background: var(--gl-sale-bg) !important;
  color: var(--gl-sale-txt) !important;
  border-color: transparent !important;
}

/* 3) Ronde/“pill” look (premium) */
.badge,
.product-badge,
.card__badge,
.price__badge-sale,
.sale-badge,
.onsale,
.on-sale{
  border-radius: 999px !important;
  padding: 6px 10px !important;
  font-weight: 600 !important;
  letter-spacing: .2px !important;
}

/* 4) Optioneel: maak ‘Aanbieding’ iets subtieler */
.badge,
.product-badge,
.card__badge,
.price__badge-sale,
.sale-badge,
.onsale,
.on-sale{
  box-shadow: none !important;
}.product__info-container .price__badge,
.product__info-container .badge,
.product__info-container .price--on-sale {
  background: transparent !important;
  padding: 0 !important;
}.product__info-container .price__container {
  background: transparent !important;
}/* Verwijder gouden sale balk boven producttitel */
.product__info-container .price__badge,
.product__info-container .badge,
.product__info-container .price__container .badge,
.product__info-container .price__container .price__badge-sale {
  display: none !important;
}

/* Verwijder goud-highlight/label rond sale prijs (als je theme die gebruikt) */
.product__info-container .price__sale .price-item,
.product__info-container .price__sale .price-item--sale,
.product__info-container .price__regular .price-item,
.product__info-container .price-item--sale {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
}
/* Verberg alleen badges met tekst "Aanbieding" / "Sale" */
.badge, .price__badge-sale, .badge--sale, .badge--on-sale {
  font-size: 0 !important; /* reset */
}

.badge::before,
.price__badge-sale::before,
.badge--sale::before,
.badge--on-sale::before{
  content: "" !important;
}

/* Als jouw theme de tekst als echte tekstnode toont:
   verberg alleen als er 'Aanbieding' in staat via attribute/variant */
.badge[aria-label*="Aanbieding"],
.badge[aria-label*="Sale"],
.badge[title*="Aanbieding"],
.badge[title*="Sale"]{
  display:none !important;
}/* Verwijder de "badge-bol" op productkaarten (collecties / grid) */
.card__badge,
.card__badge .badge,
.card__badge::before,
.card__badge::after,
.product-card__badge,
.product-card__badge .badge {
  display: none !important;
}/* Vangnet: badges die over de productfoto liggen (grid) */
.grid .badge,
.collection .badge,
.product-grid .badge,
[class*="card__badge"],
[class*="product-card__badge"]{
  display: none !important;
}.badge--sale,
.card__badge.badge--sale,
.product__badge.badge--sale {
  border-radius: 50px !important;
  padding: 0.4em 1em !important;
}
/* ===== GLOWENLIVING PRICE CLEAN FIX ===== */

/* Verwijder gekleurde achtergrond achter sale prijzen */
.price-item--sale,
.price__sale .price-item,
.card-information .price-item--sale,
.card__information .price-item--sale {
  background: transparent !important;
  background-color: transparent !important;
  padding: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Productkaart prijzen in collectie / gerelateerde producten */
.card-information .price,
.card__information .price {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
}

.card-information .price .price-item--sale,
.card__information .price .price-item--sale {
  font-size: 18px !important;
  font-weight: 600 !important;
  color: #d4af37 !important;
}

.card-information .price .price-item--regular,
.card__information .price .price-item--regular {
  font-size: 16px !important;
  font-weight: 400 !important;
  color: rgba(212, 175, 55, 0.65) !important;
  text-decoration: line-through !important;
}

/* Productpagina hoofdprijs iets groter, maar niet overdreven */
.product__info-container .price .price-item--sale,
.product__info-container .price .price-item--regular:not(.price-item--last) {
  font-size: 24px !important;
  font-weight: 600 !important;
  color: #d4af37 !important;
}

.product__info-container .price .price-item--regular.price-item--last,
.product__info-container .price .price__sale .price-item--regular {
  font-size: 17px !important;
  font-weight: 400 !important;
  color: rgba(212, 175, 55, 0.65) !important;
  text-decoration: line-through !important;
}/* =========================
   GLOWENLIVING RECOVERY FIX
   Tijdelijke herstel-CSS
   ========================= */

/* 1) Algemene tekst altijd leesbaar maken */
body,
p,
li,
span,
small,
.caption,
.rte,
.rte p,
.rte li,
.product__description,
.product__description p,
.product__description li,
.product__description h1,
.product__description h2,
.product__description h3,
.product__description h4,
.product__description h5,
.product__description h6,
.card__information,
.card__heading,
.price,
.price-item,
.full-unstyled-link,
.collection .card__heading,
.product__title,
.product__text,
.rich-text__text,
.rich-text__heading,
.banner__heading,
.banner__text,
.image-banner__heading,
.image-banner__text {
  color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* 2) Beschrijvingen netjes opmaken */
.product__description ul,
.rte ul {
  padding-left: 20px !important;
  margin-left: 0 !important;
}

.product__description li,
.rte li {
  margin-bottom: 8px !important;
}

/* 3) Zwarte / vreemde achtergronden achter tekst uitschakelen */
.banner__box,
.banner__content,
.image-banner__content,
.image-banner__box,
.rich-text__blocks,
.rich-text__wrapper,
.product__info-container,
.card__content,
.card__information,
.collection-hero__text-wrapper,
.multicolumn-card__info,
.slideshow__text-wrapper,
.slideshow__text-content {
  background: transparent !important;
  box-shadow: none !important;
}

/* 4) Overlays en pseudo-elementen die tekst camoufleren uitschakelen */
.banner::before,
.banner::after,
.image-banner::before,
.image-banner::after,
.slideshow__slide::before,
.slideshow__slide::after,
.rich-text::before,
.rich-text::after,
.section::before,
.section::after {
  opacity: 0 !important;
  background: transparent !important;
  display: none !important;
}

/* 5) Productinformatie altijd boven andere lagen */
.product__info-wrapper,
.product__info-container,
.product__description,
.product__title,
.product__text,
.rte {
  position: relative !important;
  z-index: 5 !important;
}

/* 6) Links leesbaar houden */
a,
.link,
.inline-richtext a,
.rte a,
.product__description a {
  color: #d4af37 !important;
  opacity: 1 !important;
  text-decoration: none !important;
}

/* 7) Prijzen en badges leesbaar */
.price,
.price-item,
.price__regular,
.price__sale,
.badge,
.price--on-sale .price-item--sale {
  color: #ffffff !important;
  opacity: 1 !important;
}

/* 8) Formulieren / invoervelden leesbaar */
input,
textarea,
select,
.field__input {
  color: #ffffff !important;
  background: #111111 !important;
  border-color: rgba(255,255,255,0.2) !important;
}

/* 9) Buttons iets netter en duidelijk */
.button,
button,
.shopify-payment-button__button {
  border-radius: 10px !important;
}

/* 10) Mobiele veiligheid */
@media screen and (max-width: 749px) {
  .banner__box,
  .banner__content,
  .image-banner__content,
  .rich-text__blocks,
  .product__info-container {
    background: transparent !important;
    box-shadow: none !important;
  }

  .banner__heading,
  .banner__text,
  .image-banner__heading,
  .image-banner__text,
  .product__title,
  .product__description,
  .product__description p,
  .product__description li {
    color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
}/* =========================
   GLOWENLIVING PRODUCT PAGE CLEANUP
   Alleen voor productpagina's
   ========================= */

/* Productpagina rustiger en netter */
.template-product .page-width,
.template-product .product,
.template-product .product__info-wrapper,
.template-product .product__info-container {
  background: transparent !important;
  box-shadow: none !important;
}

/* Titels en tekst op productpagina goed leesbaar */
.template-product .product__title,
.template-product .product__title h1,
.template-product .product__text,
.template-product .product__description,
.template-product .product__description p,
.template-product .product__description li,
.template-product .product__description strong,
.template-product .product__description em,
.template-product .accordion__title,
.template-product .accordion__content,
.template-product .product-popup-modal__text {
  color: #ffffff !important;
  opacity: 1 !important;
}

/* Beschrijving mooier en rustiger */
.template-product .product__description p {
  margin-bottom: 12px !important;
  line-height: 1.7 !important;
}

.template-product .product__description ul {
  padding-left: 20px !important;
  margin-top: 10px !important;
  margin-bottom: 14px !important;
}

.template-product .product__description li {
  margin-bottom: 8px !important;
  line-height: 1.6 !important;
}

/* Prijs netjes zichtbaar */
.template-product .price,
.template-product .price-item,
.template-product .price__regular,
.template-product .price__sale,
.template-product .price-item--regular,
.template-product .price-item--sale,
.template-product .price__container {
  color: #ffffff !important;
  opacity: 1 !important;
  font-weight: 500 !important;
}

/* Compare-at prijs subtieler */
.template-product .price-item--regular:has(+ .price-item--sale),
.template-product s.price-item,
.template-product .price__sale .price-item--regular {
  opacity: 0.7 !important;
}

/* Variant- en koopblokken opschonen */
.template-product .product-form,
.template-product .product-form__input,
.template-product variant-selects,
.template-product .select,
.template-product .quantity,
.template-product .shopify-payment-button {
  background: transparent !important;
  box-shadow: none !important;
}

/* Knoppen netter */
.template-product .product-form__submit,
.template-product .shopify-payment-button__button,
.template-product .button {
  border-radius: 12px !important;
  min-height: 48px !important;
}

/* Accordeons / inklapbare stukken */
.template-product .accordion,
.template-product details,
.template-product summary {
  background: transparent !important;
  box-shadow: none !important;
  border-color: rgba(255,255,255,0.12) !important;
}

/* Media en info beter uitgelijnd op desktop */
@media screen and (min-width: 990px) {
  .template-product .product--large:not(.product--no-media) .product__media-wrapper {
    max-width: 52% !important;
  }

  .template-product .product--large:not(.product--no-media) .product__info-wrapper {
    max-width: 48% !important;
    padding-left: 32px !important;
  }
}

/* Mobiel: minder rommelig */
@media screen and (max-width: 749px) {
  .template-product .product__title {
    margin-bottom: 10px !important;
  }

  .template-product .price {
    margin-bottom: 12px !important;
  }

  .template-product .product__description {
    margin-top: 10px !important;
  }

  .template-product .product__info-container > * + * {
    margin-top: 14px !important;
  }
}/* ===== FIX VERBORGEN / OVERLAY TEKST ===== */
.product__description,
.product__description * {
  color: #FFFFFF !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.rte,
.rte * {
  color: #FFFFFF !important;
  background: transparent !important;
}

.banner__box,
.banner__content,
.image-banner__content {
  background: transparent !important;
  box-shadow: none !important;
}/* ===== PRIJS FIX ===== */
.price,
.price * {
  color: #C9A24D !important;
  font-weight: 500 !important;
}

.price-item--regular {
  font-size: 18px !important;
}/* ===== BUTTON FIX ===== */
button,
.btn,
.button {
  background: #C9A24D !important;
  color: #000000 !important;
  border-radius: 8px !important;
  border: none !important;
}

button:hover,
.btn:hover,
.button:hover {
  opacity: 0.9;
}/* FIX: normale prijs + doorgestreepte oude prijs tegelijk zichtbaar */

.price__sale {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

.price__sale .price-item--sale {
  display: inline-block !important;
  color: #C9A24D !important;
  font-size: 24px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  opacity: 1 !important;
  visibility: visible !important;
}



.price__regular .price-item--regular {
  display: inline-block !important;
  color: #C9A24D !important;
  font-size: 24px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* niks verstoppen */
.price,
.price *,
.price__container,
.price__sale,
.price__regular {
  opacity: 1 !important;
  visibility: visible !important;
}
h1,
h2,
.page-title,
.main-page-title,
.title,
.template-page h1,
.template-page .title {
  color: #FFFFFF !important;
}
/* Mobile menu overlay achtergrond */
.header__submenu,
details[open] > .header__submenu,
.disclosure__list-wrapper {
  background-color: var(--color-background) !important;
  opacity: 1 !important;
}
/* Fix: paginatekst overlapt niet met sticky header op mobiel */
@media screen and (max-width: 749px) {
  .shopify-section:not(.shopify-section-header) ~ .shopify-section:first-of-type,
  main .shopify-section:first-child {
    padding-top: 80px;
  }
}
/* ===== GlowenLiving mobiel navigatiepaneel — geïsoleerde paneelstyling =====
   Positionering, hoogte, transform, overlay, open/dicht-logica en stacking blijven
   volledig native Publisher 15.4.1 (assets/component-menu-drawer.css + assets/global.js),
   via de bestaande .menu-drawer-class en <details>/<summary>-structuur — niets daaraan
   is gewijzigd.
   Uitsluitend de VISUELE paneelkleur is losgekoppeld: #menu-drawer droeg voorheen ook de
   generieke .gradient-utility-class, die een wit gradient-achtergrondbeeld plus
   background-attachment:fixed toepast. Die combinatie (samen met natives eigen
   filter:drop-shadow() op .menu-drawer) staat bekend om compositing-problemen op
   Android/Samsung. In plaats van dit via CSS-specificiteit te overschrijven, is de
   .gradient-class in snippets/header-drawer.liquid verwijderd van dit ene element en
   vervangen door de neutrale, eigen class .glw-mobile-panel hieronder — het paneel
   erft de conflicterende styling dus niet meer, in plaats van dat we hem bestrijden. */
.glw-mobile-panel {
  background-color: rgb(var(--color-background));
  color: rgb(var(--color-foreground));
  /* Native .menu-drawer zet altijd filter:drop-shadow(), ook al staat
     drawer_shadow_opacity op 0 (onzichtbaar). Zonder zichtbaar verlies uitgezet om
     onnodige GPU-laag-compositing op dit grote paneel te vermijden. */
  filter: none;
}
/* ===== GlowenLiving Mobile Fixes ===== */
@media screen and (max-width: 749px) {

  /* 1. Homepage: verwijder lege zwarte ruimte tussen secties */
  .shopify-section {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Compacte padding voor alle secties op mobiel */
  .section {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }

  /* Verwijder min-height die lege ruimte veroorzaakt */
  .shopify-section > * {
    min-height: unset !important;
  }

  /* 2. Hero banner: overlay + tekstcontrast */
  .banner__media::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
      to bottom,
      rgba(0, 0, 0, 0.35) 0%,
      rgba(0, 0, 0, 0.55) 60%,
      rgba(0, 0, 0, 0.65) 100%
    );
    z-index: 1;
  }

  .banner__box {
    position: relative;
    z-index: 2;
    text-align: center !important;
    padding: 24px 20px !important;
  }

  .banner__heading {
    color: #ffffff !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.8) !important;
    font-size: clamp(1.6rem, 6vw, 2.4rem) !important;
  }

  .banner__text {
    color: rgba(255, 255, 255, 0.92) !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.7) !important;
  }

  /* Knop "Ontdek de collectie" */
  .banner .button,
  .banner .btn {
    background-color: #c9a84c !important;
    color: #000000 !important;
    border: 2px solid #c9a84c !important;
    font-weight: 600 !important;
    padding: 12px 28px !important;
    letter-spacing: 0.05em !important;
  }

  /* 3. Contactpagina: invoervelden op donkere achtergrond */
  .contact__fields input,
  .contact__fields textarea,
  .contact__fields select,
  form input[type="text"],
  form input[type="email"],
  form input[type="tel"],
  form textarea,
  form select {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    border: 1px solid #c9a84c !important;
    border-radius: 2px !important;
    padding: 12px 14px !important;
  }

  /* Placeholder tekst leesbaar */
  form input::placeholder,
  form textarea::placeholder {
    color: rgba(255, 255, 255, 0.45) !important;
  }

  /* Labels leesbaar */
  form label,
  .field__label {
    color: #e0e0e0 !important;
    font-size: 0.85rem !important;
  }

  /* Foutmeldingen zichtbaar */
  .field__message--error,
  .form__message--error {
    color: #ff6b6b !important;
    border-left: 3px solid #ff6b6b !important;
    padding-left: 8px !important;
  }

  /* Verplichte veld indicator */
  .field__label .required,
  label .required {
    color: #c9a84c !important;
  }

}
/* GlowenLiving: Contact form uniformiteit mobiel */
@media screen and (max-width: 749px) {

  /* Textarea zelfde stijl als andere invoervelden */
  .contact-form textarea,
  form textarea {
    border-radius: 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    padding: 12px 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    font-size: 1rem !important;
    font-family: inherit !important;
  }

  /* Verzendknop gecentreerd */
  .contact-form button[type="submit"],
  .contact-form .button,
  form .button--primary {
    display: block !important;
    margin: 24px auto 0 !important;
    width: auto !important;
    min-width: 200px !important;
    text-align: center !important;
  }

}
/* GlowenLiving: Premium uniforme formulierstijl mobiel */
@media screen and (max-width: 749px) {

  /* Inputs + textarea */
  .field__input,
  .text-area.field__input,
  input[type="email"].field__input {
    border-radius: 10px !important;
    border: 1px solid rgba(201, 168, 76, 0.4) !important;
    background-color: #111111 !important;
    color: #ffffff !important;
    padding: 12px 16px !important;
    min-height: 48px !important;
    font-size: 1rem !important;
    transition: all 0.25s ease;
  }

  /* Focus state (BELANGRIJK voor premium gevoel) */
  .field__input:focus,
  .text-area.field__input:focus {
    border: 1px solid #C9A24D !important;
    box-shadow: 0 0 0 1px rgba(201, 162, 77, 0.3);
    outline: none !important;
  }

  /* Textarea */
  .text-area.field__input {
    min-height: 120px !important;
  }

  /* Placeholder */
  .field__input::placeholder {
    color: rgba(255, 255, 255, 0.4) !important;
  }

  /* Labels */
  .field__label {
    color: rgba(255, 255, 255, 0.7) !important;
  }

  /* Contact knop */
  .contact__button {
    display: flex !important;
    justify-content: center !important;
    margin-top: 16px !important;
  }

  .contact__button .button {
    background-color: #C9A24D !important;
    color: #000 !important;
    border-radius: 10px !important;
    padding: 12px 24px !important;
    font-weight: 500;
    transition: all 0.25s ease;
  }

  .contact__button .button:active {
    transform: scale(0.97);
  }

  /* Nieuwsbrief input */
  .newsletter .field__input {
    border-radius: 10px !important;
    border: 1px solid rgba(201, 168, 76, 0.4) !important;
    background-color: #111111 !important;
    color: #ffffff !important;
  }

  /* Nieuwsbrief knop (pijl) */
  .newsletter-form__button {
    background-color: #C9A24D !important;
    color: #000 !important;
    border-radius: 0 10px 10px 0 !important;
  }

}/* GlowenLiving final polish mobiel */
@media screen and (max-width: 749px) {

  /* Maak alle inputs exact gelijk */
  .field__input {
    background-color: #111111 !important;
  }

  /* Verwijder visuele “scheiding” tussen blokken */
  .contact {
    padding-top: 20px !important;
  }

  .contact__fields {
    gap: 12px !important;
  }

  /* Button sterker maken */
  .contact__button .button {
    width: 80%;
    max-width: 260px;
    font-weight: 600;
    letter-spacing: 0.5px;
  }

  /* Iets meer ruimte boven formulier (maar subtiel) */
  .contact__form {
    margin-top: 10px !important;
  }

}.newsletter-form__button {
  box-shadow: 0 2px 8px rgba(201, 162, 77, 0.2);
}/* GlowenLiving: FORCE alle velden exact gelijk */
@media screen and (max-width: 749px) {

  /* Alle mogelijke input types pakken */
  .field input,
  .field__input,
  .contact__fields input,
  .contact__fields .field__input,
  .contact textarea,
  .text-area,
  .text-area.field__input {

    background-color: #111111 !important;
    border: 1px solid rgba(201, 168, 76, 0.4) !important;
    border-radius: 10px !important;
    color: #ffffff !important;

    padding: 12px 16px !important;
    min-height: 48px !important;

    box-shadow: none !important;
    outline: none !important;

  }

  /* Zorg dat wrapper geen rare styling toevoegt */
  .field {
    border-radius: 10px !important;
  }

}/* GlowenLiving FINAL fix telefoonveld */
@media screen and (max-width: 749px) {

  input[type="tel"] {
    background-color: #111111 !important;
    border: 1px solid rgba(201, 168, 76, 0.4) !important;
    border-radius: 10px !important;
    color: #ffffff !important;

    padding: 12px 16px !important;
    min-height: 48px !important;

    box-shadow: none !important;
    outline: none !important;
  }

}/* GlowenLiving FINAL telefoonveld echt gelijk trekken */
@media screen and (max-width: 749px) {

  .contact .field,
  .contact .field:before,
  .contact .field:after,
  .contact input[type="tel"],
  .contact input[name*="phone"],
  .contact input[id*="phone"] {
    border-radius: 10px !important;
  }

  .contact input[type="tel"],
  .contact input[name*="phone"],
  .contact input[id*="phone"] {
    background: #111111 !important;
    border: 1px solid rgba(201, 168, 76, 0.4) !important;
    color: #ffffff !important;
    min-height: 48px !important;
    padding: 12px 16px !important;
    box-shadow: none !important;
    outline: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
  }

  .contact .field:before,
  .contact .field:after {
    box-shadow: none !important;
    border: none !important;
  }

}.field__input:focus,
.text-area.field__input:focus,
input[type="tel"]:focus {
  border: 1px solid #C9A24D !important;
  box-shadow: 0 0 6px rgba(201, 162, 77, 0.4);
}/* GlowenLiving – definitieve mobiele formulierstijl */
@media screen and (max-width: 749px) {

  .contact .field,
  .contact .field:before,
  .contact .field:after,
  .contact .field__input,
  .contact input,
  .contact input[type="text"],
  .contact input[type="email"],
  .contact input[type="tel"],
  .contact textarea,
  .contact .text-area,
  .newsletter .field__input,
  .newsletter input[type="email"] {
    border-radius: 12px !important;
    box-shadow: none !important;
  }

  .contact .field__input,
  .contact input,
  .contact input[type="text"],
  .contact input[type="email"],
  .contact input[type="tel"],
  .contact textarea,
  .contact .text-area,
  .newsletter .field__input,
  .newsletter input[type="email"] {
    background: #0F0F0F !important;
    border: 1.5px solid #C9A24D !important;
    color: #FFFFFF !important;
    min-height: 52px !important;
    padding: 14px 16px !important;
    outline: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
  }

  .contact textarea,
  .contact .text-area {
    min-height: 120px !important;
  }

  .contact .field__label,
  .newsletter .field__label {
    color: rgba(255,255,255,0.78) !important;
  }

  .contact .field__input::placeholder,
  .contact input::placeholder,
  .contact textarea::placeholder,
  .newsletter input::placeholder {
    color: rgba(255,255,255,0.45) !important;
  }

  .contact .field__input:focus,
  .contact input:focus,
  .contact textarea:focus,
  .newsletter input:focus {
    border-color: #D4AF37 !important;
    box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.35) !important;
  }

  .contact__button .button {
    background: #C9A24D !important;
    color: #000000 !important;
    border-radius: 12px !important;
    min-height: 52px !important;
    font-weight: 600 !important;
  }

  .newsletter-form__button {
    background: #C9A24D !important;
    color: #000000 !important;
    border-radius: 0 12px 12px 0 !important;
  }
}/* GlowenLiving – desktop formulierstijl */
@media screen and (min-width: 750px) {

  .contact .field,
  .contact .field:before,
  .contact .field:after,
  .contact .field__input,
  .contact input,
  .contact input[type="text"],
  .contact input[type="email"],
  .contact input[type="tel"],
  .contact textarea,
  .contact .text-area,
  .newsletter .field__input,
  .newsletter input[type="email"] {
    border-radius: 12px !important;
    box-shadow: none !important;
  }

  .contact .field__input,
  .contact input,
  .contact input[type="text"],
  .contact input[type="email"],
  .contact input[type="tel"],
  .contact textarea,
  .contact .text-area,
  .newsletter .field__input,
  .newsletter input[type="email"] {
    background: #0A0A0A !important;
    border: 1.5px solid #C9A24D !important;
    color: #FFFFFF !important;
    min-height: 54px !important;
    padding: 14px 18px !important;
    outline: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
  }

  .contact textarea,
  .contact .text-area {
    min-height: 140px !important;
  }

  .contact .field__label,
  .newsletter .field__label {
    color: rgba(255,255,255,0.78) !important;
  }

  .contact .field__input::placeholder,
  .contact input::placeholder,
  .contact textarea::placeholder,
  .newsletter input::placeholder {
    color: rgba(255,255,255,0.45) !important;
  }

  .contact .field__input:focus,
  .contact input:focus,
  .contact textarea:focus,
  .newsletter input:focus {
    border-color: #D4AF37 !important;
    box-shadow: 0 0 0 1px rgba(212,175,55,0.30) !important;
  }

  .contact__button {
    margin-top: 20px !important;
  }

  .contact__button .button {
    background: #C9A24D !important;
    color: #000000 !important;
    border-radius: 12px !important;
    min-height: 54px !important;
    padding: 0 28px !important;
    font-weight: 600 !important;
  }
}/* GlowenLiving – knop perfect centreren desktop */
@media screen and (min-width: 750px) {

  .contact__button {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
  }

  .contact__button .button {
    margin: 0 auto !important;
    display: inline-flex !important;
    justify-content: center;
  }

}/* GlowenLiving – mobiele bannertekst hoger zetten zonder header/logo te raken */
@media screen and (max-width: 749px) {

  .template-index .banner__content,
  .template-index .image-banner__content {
    align-items: flex-start !important;
    justify-content: flex-start !important;
    padding-top: 120px !important;
    padding-bottom: 40px !important;
  }

  .template-index .banner__box {
    margin-top: 0 !important;
    transform: translateY(-20px) !important;
    background: transparent !important;
  }
/* GlowenLiving – mobiele bannertekst hoger zetten zonder header/logo te raken */
@media screen and (max-width: 749px) {

  .template-index .banner__content,
  .template-index .image-banner__content {
    align-items: flex-start !important;
    justify-content: flex-start !important;
    padding-top: 120px !important;
    padding-bottom: 40px !important;
  }

  .template-index .banner__box {
    margin-top: 0 !important;
    transform: translateY(-20px) !important;
    background: transparent !important;
  }

  .template-index .banner__heading,
  .template-index .image-banner__heading {
    margin-bottom: 12px !important;
  }

  .template-index .banner__text,
  .template-index .image-banner__text {
    margin-bottom: 18px !important;
  }

  .template-index .banner__buttons,
  .template-index .image-banner__buttons {
    margin-top: 0 !important;
  }
}/* GlowenLiving: Banner content hoger op mobiel */
@media screen and (max-width: 749px) {

  .template-index .banner__content,
  .template-index .image-banner__content,
  .template-index .banner__box {
    justify-content: flex-start !important;
    align-items: center !important;
    padding-top: 32px !important;
    margin-top: -80px !important;
    transform: translateY(-60px) !important;
  }

}
/* GlowenLiving: Banner content hoger op mobiel */
@media screen and (max-width: 749px) {

  .banner__content {
    justify-content: flex-start !important;
    padding-top: 40px !important;
  }

  .banner__box {
    margin-top: 0 !important;
    transform: translateY(-40px) !important;
  }

}
transform: translateY(-70px) !important;
@media screen and (max-width: 749px) {
  .banner__content {
    justify-content: flex-start !important;
  }
  .banner__box {
    transform: translateY(-70px) !important;
  }
}
@media screen and (max-width: 749px) {
  .banner__content {
    justify-content: flex-start !important;
  }
  .banner__box {
    transform: translateY(-70px) !important;
  }
}
.header-wrapper,
.header {
  border-top: none !important;
  box-shadow: none !important;
}
}.price__compare {
  color: #999;
  text-decoration: line-through;
  margin-right: 10px;
  font-size: 14px;
  opacity: 0.7;
}

.contact .rich-text {
  text-align: center;
}

.contact .field {
  max-width: 600px;
  margin: 0 auto;
}/* GlowenLiving contactpagina fix */
body:has(.contact) .main-page-title,
body:has(.contact) .page-title {
  text-align: center !important;
}

body:has(.contact) .page-width,
body:has(.contact) .contact,
body:has(.contact) .contact.page-width {
  max-width: 820px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}

body:has(.contact) .rte,
body:has(.contact) .rich-text__text {
  text-align: left !important;
  max-width: 760px !important;
  margin: 0 auto 40px auto !important;
}

body:has(.contact) form {
  max-width: 760px !important;
  margin: 0 auto !important;
}

body:has(.contact) .field,
body:has(.contact) .contact__fields {
  width: 100% !important;
}

body:has(.contact) .field__input,
body:has(.contact) .text-area {
  border: 1px solid #c9a24d !important;
  border-radius: 12px !important;
}/* GlowenLiving contactpagina fix */
body:has(.contact) .main-page-title,
body:has(.contact) .page-title {
  text-align: center !important;
}

body:has(.contact) .page-width,
body:has(.contact) .contact,
body:has(.contact) .contact.page-width {
  max-width: 820px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}

body:has(.contact) .rte,
body:has(.contact) .rich-text__text {
  text-align: left !important;
  max-width: 760px !important;
  margin: 0 auto 40px auto !important;
}

body:has(.contact) form {
  max-width: 760px !important;
  margin: 0 auto !important;
}

body:has(.contact) .field,
body:has(.contact) .contact__fields {
  width: 100% !important;
}

body:has(.contact) .field__input,
body:has(.contact) .text-area {
  border: 1px solid #c9a24d !important;
  border-radius: 12px !important;
}/* CONTACT PAGINA FIX (force) */
.template-page .page-width {
  max-width: 800px !important;
  margin: 0 auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.template-page h1,
.template-page .main-page-title {
  text-align: center !important;
}

.template-page .rte {
  max-width: 700px;
  margin: 0 auto 40px auto;
  text-align: left;
}

.template-page form {
  max-width: 700px;
  margin: 0 auto;
}

.template-page .field__input,
.template-page textarea {
  border: 1px solid #c9a24d;
  border-radius: 10px;
}/* =========================
   GLOWENLIVING LUX CONTACT
   ========================= */

/* Container strak centreren */
.template-page .page-width {
  max-width: 760px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
}

/* Titel luxe spacing */
.template-page h1,
.template-page .main-page-title {
  text-align: center !important;
  margin-bottom: 30px !important;
  letter-spacing: 1px;
}

/* Tekst blok premium spacing */
.template-page .rte {
  max-width: 640px;
  margin: 0 auto 50px auto;
  line-height: 1.8;
  font-size: 15px;
  color: #e5e5e5;
}

/* Form perfect uitlijnen */
.template-page form {
  max-width: 640px;
  margin: 0 auto;
}

/* Input velden luxe look */
.template-page .field__input,
.template-page textarea {
  background: transparent;
  border: 1px solid rgba(201,162,77,0.5);
  border-radius: 12px;
  padding: 14px 16px;
  color: #fff;
  transition: all 0.3s ease;
}

/* Hover effect */
.template-page .field__input:hover,
.template-page textarea:hover {
  border-color: #c9a24d;
}

/* Focus effect (premium glow) */
.template-page .field__input:focus,
.template-page textarea:focus {
  border-color: #c9a24d;
  box-shadow: 0 0 0 1px #c9a24d;
}

/* Button luxe stijl */
.template-page button {
  background: #c9a24d;
  color: #000;
  border-radius: 999px;
  padding: 12px 28px;
  font-weight: 500;
  transition: all 0.3s ease;
}

/* Button hover */
.template-page button:hover {
  background: #b8933f;
}

/* Alles iets meer lucht */
.template-page .field {
  margin-bottom: 18px;
}/* =========================
   GLOWENLIVING LUX CONTACT
   ========================= */

/* Container strak centreren */
.template-page .page-width {
  max-width: 760px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
}

/* Titel luxe spacing */
.template-page h1,
.template-page .main-page-title {
  text-align: center !important;
  margin-bottom: 30px !important;
  letter-spacing: 1px;
}

/* Tekst blok premium spacing */
.template-page .rte {
  max-width: 640px;
  margin: 0 auto 50px auto;
  line-height: 1.8;
  font-size: 15px;
  color: #e5e5e5;
}

/* Form perfect uitlijnen */
.template-page form {
  max-width: 640px;
  margin: 0 auto;
}

/* Input velden luxe look */
.template-page .field__input,
.template-page textarea {
  background: transparent;
  border: 1px solid rgba(201,162,77,0.5);
  border-radius: 12px;
  padding: 14px 16px;
  color: #fff;
  transition: all 0.3s ease;
}

/* Hover effect */
.template-page .field__input:hover,
.template-page textarea:hover {
  border-color: #c9a24d;
}

/* Focus effect (premium glow) */
.template-page .field__input:focus,
.template-page textarea:focus {
  border-color: #c9a24d;
  box-shadow: 0 0 0 1px #c9a24d;
}

/* Button luxe stijl */
.template-page button {
  background: #c9a24d;
  color: #000;
  border-radius: 999px;
  padding: 12px 28px;
  font-weight: 500;
  transition: all 0.3s ease;
}

/* Button hover */
.template-page button:hover {
  background: #b8933f;
}

/* Alles iets meer lucht */
.template-page .field {
  margin-bottom: 18px;
}/* FORCE CONTACT FULL WIDTH FIX */
.template-page .page-width {
  max-width: 1200px !important;
}

.template-page .rte {
  max-width: 700px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.template-page .contact {
  max-width: 700px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.template-page form {
  max-width: 700px !important;
  margin-left: auto !important;
  margin-right: auto !important;

}/* CONTACT PAGINA 100% FIX */
body:has(a[href="/pages/contact"][aria-current="page"]) main,
body:has(a[href="/pages/contact"].header__active-menu-item) main,
body:has(form[action*="/contact"]) main {
  padding-top: 180px !important;
}

body:has(a[href="/pages/contact"][aria-current="page"]) h1,
body:has(a[href="/pages/contact"].header__active-menu-item) h1,
body:has(form[action*="/contact"]) h1 {
  margin-top: 0 !important;
  display: block !important;
  position: relative !important;
  z-index: 2 !important;
}/* VERBERG PAGINA TITELS (CONTACT / OVER ONS) */
.template-page .main-page-title,
.template-page h1 {
  display: none !important;
}/* Mobile header overlap fix */
@media screen and (max-width: 749px) {
  .section-header {
    position: relative !important;
  }
}