/** Shopify CDN: Minification failed

Line 3645:9 Unexpected "{"
Line 3645:18 Expected ":"
Line 3655:9 Unexpected "{"
Line 3655:18 Expected ":"
Line 3669:9 Unexpected "{"
Line 3669:18 Expected ":"
Line 3670:9 Unexpected "{"
Line 3670:18 Expected ":"
Line 3678:11 Unexpected "{"
Line 3678:20 Expected ":"
... and 5 more hidden warnings

**/
/* ==================== 1. 注册真正的 1:1 Futura 氛围正文字库 ==================== */
@font-face {
    font-family: 'KronivFutura';
    src: url('/cdn/shop/files/JetBrainsMono-Medium.woff?v=1786209763') format('woff');
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    font-display: swap;
}

product-component,
collection-component {
  display: block;
}

: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;
}

body:has(.section-header .drawer-menu) .announcement-bar-section .page-width {
  max-width: 100%;
}

.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;
}

.content-for-layout {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.content-for-layout > .shopify-section:last-child {
  flex-grow: 1;
}

.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-announcement-bar: 250ms;
  --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';
  }

  .announcement-bar.announcement-bar--one-announcement,
  .announcement-bar--one-announcement .announcement-bar__link {
    width: fit-content;
    margin: auto;
  }
}

.announcement-bar,
.announcement-bar__announcement {
  color: rgb(var(--color-foreground));
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  align-content: center;
  grid-area: announcements;
}

.announcement-bar .slider--everywhere {
  margin-bottom: 0;
  scroll-behavior: auto;
}

.utility-bar__grid .announcement-bar-slider {
  width: 100%;
}

.utility-bar__grid .announcement-bar-slider {
  width: 100%;
}

.announcement-bar-slider,
.announcement-bar-slider .slider {
  width: 100%;
}

.announcement-bar .slider-button--next {
  margin-right: -1.5rem;
  min-width: 44px;
}

.announcement-bar .slider-button--prev {
  margin-left: -1.5rem;
  min-width: 44px;
}

.announcement-bar .slider-button--next:focus-visible,
.announcement-bar .slider-button--prev:focus-visible,
.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;
  }

  .announcement-bar-slider {
    width: 60%;
  }

  .announcement-bar .slider-button {
    height: 3.8rem;
  }
}

.announcement-bar__link {
  display: flex;
  width: 100%;
  text-decoration: none;
  height: 100%;
  justify-content: center;
  align-items: center;
}

.announcement-bar__link:hover {
  text-decoration: underline;
}

.announcement-bar__link .icon-arrow {
  display: inline-block;
  pointer-events: none;
  margin-left: 0.8rem;
  vertical-align: middle;
  margin-bottom: 0.2rem;
}

.announcement-bar__message {
  text-align: center;
  padding: 1rem 0;
  margin: 0;
  letter-spacing: 0.1rem;
  min-height: 3.8rem;
}

.announcement-bar-slider--fade-in-next .announcement-bar__message,
.announcement-bar-slider--fade-in-previous .announcement-bar__message,
.announcement-bar-slider--fade-out-next .announcement-bar__message,
.announcement-bar-slider--fade-out-previous .announcement-bar__message {
  animation-duration: var(--duration-announcement-bar);
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
}

.announcement-bar-slider--fade-in-next .announcement-bar__message {
  --announcement-translate-from: -1.5rem;
  /* Prevent flicker */
  opacity: 0;
  animation-name: translateAnnouncementSlideIn;
  animation-delay: var(--duration-announcement-bar);
}

.announcement-bar-slider--fade-in-previous .announcement-bar__message {
  --announcement-translate-from: 1.5rem;
  /* Prevent flicker */
  opacity: 0;
  animation-name: translateAnnouncementSlideIn;
  animation-delay: var(--duration-announcement-bar);
}

.announcement-bar-slider--fade-out-next .announcement-bar__message {
  --announcement-translate-to: 1.5rem;
  animation-name: translateAnnouncementSlideOut;
}

.announcement-bar-slider--fade-out-previous .announcement-bar__message {
  --announcement-translate-to: -1.5rem;
  animation-name: translateAnnouncementSlideOut;
}

@keyframes translateAnnouncementSlideIn {
  0% {
    opacity: 0;
    transform: translateX(var(--announcement-translate-from));
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes translateAnnouncementSlideOut {
  0% {
    opacity: 1;
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    transform: translateX(var(--announcement-translate-to));
  }
}

/* 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 .icon {
  height: 4.4rem;
  width: 4.4rem;
  padding: 0;
}

.header__icon--cart {
  position: relative;
  margin-right: -1.2rem;
}

.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);
  }
}

/* ==========================================================================
   KRONIV TERMINAL: 100% 全设备绝对居中 + 强力抹除一切按钮白框和隐形阴影
   ========================================================================== */

/* 1. 强制容器级全设备绝对水平居中 */
.banner__content,
#Banner-{{ section.id }} .banner__content {
  display: flex !important;
  justify-content: center !important; 
  align-items: center !important;
  text-align: center !important;
  flex-direction: column !important; 
}

/* 2. 强力绝杀：扒掉按钮的实体白边框，并彻底熔断导致它死活消不掉的重度暗影/伪元素 */
.banner__buttons a.button,
#Banner-{{ section.id }} .banner__buttons a {
  background: transparent !important;
  color: #E5E7EB !important;
  margin: 0 auto !important;
  border: none !important; 
  border-width: 0px !important;
  border-color: transparent !important;
  outline: none !important;
  box-shadow: none !important; 
  -webkit-box-shadow: none !important;
}

.banner__buttons a.button::before,
.banner__buttons a.button::after,
#Banner-{{ section.id }} .banner__buttons a::before,
#Banner-{{ section.id }} .banner__buttons a::after {
  display: none !important;
  content: none !important;
}

/* 3. 📱 手机/移动端专属【视觉丰满度】微调（解决排版奇怪问题） */
@media screen and (max-width: 749px) {
  .banner__buttons a.button,
  #Banner-{{ section.id }} .banner__buttons a {
    /* 🛠️ 修改 1：把按钮字号从 1.1 改成 1.3，让 EQUIP YOUR ARMOR 更丰满、更有点击欲望 */
    font-size: 1.3rem !important;   
    padding: 10px 20px !important;   
    /* 🛠️ 修改 2：让按钮文字的字母间距也微微拉开，呼应大标题的高冷感 */
    letter-spacing: 0.08em !important;
    font-weight: 600 !important; /* 稍微加粗一点点，更加清晰 */
  }
  
  /* 优化手机端大标题的字号与赛博呼吸感 */
  .banner__heading {
    font-size: 1.5rem !important;      
    letter-spacing: 0.12em !important; 
    line-height: 1.3 !important;
    /* 🛠️ 修改 3：把下边距从 1rem 放大到 2.2rem！强行把两行字撑开，拉出高级的视觉呼吸感 */
    margin-bottom: 2.2rem !important;    
  }
}
/* ==========================================================================
   KRONIV DESTRUCTION: 彻底全球封杀并蒸发商品列表页一切默认的 Products 标题
   ========================================================================== */
.collection-hero__title,
.collection-hero__title.title,
h1.collection-hero__title,
.main-collection-banner h1,
.collection-title,
[class*="collection-hero"] h1,
[class*="collection"] .title {
  display: none !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
}
/* KRONIV STAGE BLACKOUT DRIVE */
.template-search,
.main-search,
.search-page,
#MainContent {
    background-color: #0D0D0D !important;
}
.template-search h1,
.template-search h2,
.main-page-title,
h1.h2 {
    color: #E5E7EB !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important;
}
.template-search input[type="search"] {
    background-color: #0A0A0A !important;
    color: #E5E7EB !important;
    border: 1px solid #444444 !important;
    border-radius: 0px !important;
}
.template-search input[type="search"]:focus {
    border-color: #70E0A6 !important;
    outline: none !important;
}
/* 强行击穿 DAWN 主题 404 隐形淡化遮罩，全面强制唤醒 KRONIV 高亮白绿光 */
.template-404 .title, 
.template-404 h1, 
.template-404 p, 
.template-404 a, 
.template-404 span, 
.template-404 .subtext {
    opacity: 1 !important;
    filter: none !important;
    visibility: visible !important;
}

/* 强锁 Page not found 为刺破黑暗的纯白 Impact 大标题 */
.template-404 h1, 
.template-404 .title {
    color: #E5E7EB !important;
    font-family: 'Impact', 'Arial Black', sans-serif !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    font-size: 36px !important;
}

/* 强锁 404 数字提示和副标题为高亮、不刺眼的钛金淡绿 */
.template-404 p, 
.template-404 .subtext {
    color: #E5E7EB!important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
}

/* 强硬直角：彻底锁定 Continue shopping 按钮为纯黑底、纯白硬朗钢铁边框 */
.template-404 a.button, 
.template-404 .button {
    background-color: #0D0D0D !important;
    color: #E5E7EB !important;
    border: 2px solid #E5E7EB !important;
    border-radius: 0px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 900 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    padding: 15px 35px !important;
    display: inline-block !important;
}

/* 按钮悬停时亮起柔和钛金绿高光反应 */
.template-404 a.button:hover, 
.template-404 .button:hover {
    border-color: #70E0A6 !important;
    color: #70E0A6 !important;


/* ==========================================================================
   KRONIV ABOUT US PAGE SLIDESHOW FORCE HORIZONTAL ALLIGNMENT
   去 base.css 底部一键暴力治愈：强行逼迫所有页面变成左右幻灯片，不影响首页
   ========================================================================== */

/* 1. 一击必杀：彻底击碎上下平铺，强行逼迫多张幻灯片在横向拉成一排 */
.template-page .slideshow .slideshow__track,
.template-page .slideshow [class*="slider"] {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important; /* 允许手势或鼠标丝滑左右划动 */
  scroll-snap-type: x mandatory !important; /* 滑动时自动吸附对齐 */
  scroll-behavior: smooth !important;
  -webkit-overflow-scrolling: touch !important;
}

/* 2. 锁死每一页幻灯片的宽度为 100%，确保一屏只展示一页，绝不露头或上下重叠 */
.template-page .slideshow .slideshow__slide,
.template-page .slideshow [class*="slide"] {
  flex: 0 0 100% !important;
  width: 100% !important;
  min-width: 100% !important;
  scroll-snap-align: start !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

/* 隐藏手机和电脑端多余的原生滚动条，只保留纯净的画面切换 */
.template-page .slideshow .slideshow__track::-webkit-scrollbar,
.template-page .slideshow [class*="slider"]::-webkit-scrollbar {
  display: none !important;
}

/* 3. 大牌画册全家居中排版 */
.template-page .slideshow .slideshow__text, 
.template-page .slideshow [class*="banner__box"] {
  text-align: center !important;
  align-items: center !important;
  justify-content: center !important; 
  display: flex !important;
  flex-direction: column !important;
}

/* 4. 核心强化：为文字容器注入 45% 半透明黑色暗影幕布，防止图片撞色 */
.template-page .slideshow [class*="banner__box"] {
  padding: 3.5rem 4rem !important; 
  background: rgba(0, 0, 0, 0.45) !important; 
  backdrop-filter: blur(2px) !important; 
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.5) !important;
  max-width: 80rem !important; 
  margin: 0 auto !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important; 
}



/* 6. 副标题故事文字：KronivFutura 扁平终端字体 + 立体黑影 */
.template-page .slideshow [class*="banner__box"] .banner__text,
.template-page .slideshow [class*="banner__box"] p,
.template-page .slideshow [class*="banner__box"] span {
  text-align: center !important;
  color: #E5E7EB !important;
  font-family: 'KronivFutura' !important;
  font-size: 1.5rem !important; 
  line-height: 1.6 !important;
  letter-spacing: 0.08rem !important;
  margin: 0 0 2.5rem 0 !important;
  text-shadow: 2px 2px 4px #0D0D0D !important;
}

/* ==========================================================================
   INTER CUSTOM FONTS INJECTION
   ========================================================================== */
@font-face {
  font-family: 'MyInterBold';
  src: url('/cdn/shop/files/Inter-Bold.woff?v=1785494116') format('woff');
}

/* ==========================================================================
   KRONIV 最终补丁：首页轮播图（Slideshow）行动按钮黑白灰大牌重塑
   ========================================================================== */

/* 1. 强行锁定轮播图核心行动按钮：洗净荧光绿，注入全站高冷黑白秩序 */
.template-page .slideshow [class*="banner__box"] .banner__buttons a.button,
.template-page .slideshow .slideshow__text a.button,
.template-page .slideshow .button {
  align-self: center !important;
  display: inline-block !important;
  background-color: #0D0D0D !important;   /* 纯黑底色，维持厚重的下沉感 */
  color: #E5E7EB !important;              /* 暴力去绿！文字转换为极致纯白 */
  border: 1px solid #E5E7EB !important;    /* 换上 1 像素高精细纯白实线包边，更显利落 */
  font-family: 'KronivFutura', sans-serif !important; /* 100% 锁死你的品牌特制专属字体 */
  font-weight: 700 !important;            /* 优化为 700 骨感粗体，拒绝 900 带来页游的笨重感 */
  text-decoration: none !important;
  text-transform: uppercase !important;   /* 维持全大写的大牌块状规整风 */
  letter-spacing: 0.2rem !important;     /* 保持标志性的稀疏字间距，拉满大牌仪式感 */
  padding: 1.2rem 4rem !important; 
  margin-top: 1rem !important;
  transition: all 0.25s ease-in-out !important; /* 平滑顺畅的悬停过渡动画 */
  border-radius: 0 !important;            /* 死锁 100% 硬朗直角几何体 */
}

/* 2. 注入高街时尚特有的【纯白填充+反转黑字】凌厉悬停特效 */
.template-page .slideshow .button:hover, 
.template-page .slideshow [class*="banner__buttons"] a.button:hover {
  background-color: #E5E7EB !important;   /* 悬停时：瞬间蜕变为满格纯白填充 */
  color: #0D0D0D !important;              /* 文字强行反转为极致纯黑，高反差撞色极其扎眼 */
  border-color: #E5E7EB !important;        /* 边框同步变为白色 */
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6) !important; /* 彻底斩断原先突兀恶俗的绿色霓虹发光，改为高级下沉大牌暗影 */
  transform: translateY(-2px) !important; /* 维持你满意的轻微离地悬浮动效 */
}


/* 8. 针对手机移动端媒体查询：单独维持手机端的小字号与紧凑边距 */
@media screen and (max-width: 749px) {
  .template-page .slideshow [class*="banner__box"] { padding: 2rem 1.5rem !important; max-width: 92% !important; }
  .template-page .slideshow [class*="banner__box"] h2 { font-size: 1.8rem !important; }
  .template-page .slideshow [class*="banner__box"] p, 
  .template-page .slideshow [class*="banner__box"] span { font-size: 1.2rem !important; line-height: 1.5 !important; }
}
/* ==========================================================================
   KRONIV HOMEPAGE HERO BANNER CORE STYLES
   锁死域名主页，一键暴力重塑首页赛博重工业调性，绝不波及其他页面
   ========================================================================== */

/* 1. 强行将首页文字容器、盒子、按钮全部强制正中央居中对齐 */
.template-index .banner,
.template-index .banner__content,
.template-index .banner__box {
  text-align: center !important;
  align-items: center !important;
  justify-content: center !important; 
  display: flex !important;
  flex-direction: column !important;
}

/* 2. 核心拯救：为首页文字加一层 45% 半透明黑色暗影幕布，彻底逼退晃眼的皮肤颜色，抠出文字 */
.template-index .banner__box {
  padding: 3.5rem 5rem !important; /* 撑开四周边距 */
  background: rgba(0, 0, 0, 0.45) !important; /* 45%重度半透明黑 */
  backdrop-filter: blur(2px) !important; /* 微弱毛玻璃防晃眼 */
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.6) !important;
  max-width: 85rem !important; 
  margin: 0 auto !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important; /* 极暗的工业外边框 */
}


}

/* 4. 首页副标题与长描述：切换为纯白 KronivFutura + 立体黑影，字号强行放大 */
.template-index .banner__box .banner__text,
.template-index .banner__box p,
.template-index .banner__box span {
  text-align: center !important;
  color: #E5E7EB !important;
  font-family: 'KronivFutura'!important;
  font-size: 1.6rem !important; /* 强行放大描述文字 */
  line-height: 1.7 !important;
  letter-spacing: 0.08rem !important;
  margin: 0 0 2.5rem 0 !important;
  text-shadow: 2px 2px 6px rgba(0, 0, 0, 1), 
               -1px -1px 2px rgba(0, 0, 0, 1), 
               1px -1px 2px rgba(0, 0, 0, 1), 
               -1px 1px 2px rgba(0, 0, 0, 1), 
               1px 1px 2px rgba(0, 0, 0, 1) !important;
}


/* 6. 针对手机移动端的自适应微调，防止屏幕太小显得拥挤 */
@media screen and (max-width: 749px) {
  .template-index .banner__box { padding: 2rem 1.5rem !important; max-width: 92% !important; }
  .template-index .banner__box h2 { font-size: 1.9rem !important; }
  .template-index .banner__box p, .template-index .banner__box span { font-size: 1.2rem !important; line-height: 1.5 !important; }
}
/* ==========================================================================
   KRONIV 全局字体计划 8.0：CLOCKS 像素级复刻黄金平衡版 (2026 STABLE)
   ========================================================================== */



/* ==================== 2. 氛围感区域与产品描述：统一为 KronivFutura（1:1 纯正暗黑血统） ==================== */
/* 核心修正：把 p 标签、产品描述彻底从错误的 Inter 路径中解救出来，强制灌入真正的 Futura */
html, body, p, 
.product__title h1, 
.product__description, .product__description *,
.rte, .rte p, .rich-text__text, .rich-text__text p,
.announcement-bar, .announcement-bar__message,
.header__inline-menu a, .header__inline-menu span, .menu-drawer__menu-item, .list-menu__item, .header__icon,
.banner__heading, .banner__text, .banner__buttons .button, .banner__buttons a,
.kroniv-trust-item, .kroniv-tag, .kroniv-trust-text-container *,
.footer-block__newsletter, .footer-block__newsletter h2, .footer-block__newsletter .field__input, .footer-block__newsletter .field__label {
  font-family: 'KronivFutura', "Helvetica Neue", Arial, sans-serif !important; /* 丢弃等宽 monospace 垫底，防止降级变 Courier New */
}

/* 核心排版修正：1:1 复刻 Clocks & Colours 的力量感凝聚力（高密度、中等厚度、暗银色值） */
p, .product__description, .product__description p, .rte p {
  font-weight: 500 !important;              /* 字重加厚到 500，拒绝轻飘飘 */
  color: #B5B5B5 !important;                /* 标志性暗银色，长文高级耐看 */
  line-height: 1.45 !important;             /* 狠狠压缩行高！彻底终结散架的空隙 */
  letter-spacing: 0.03em !important;        /* 微弱的高奢字距感 */
  margin-top: 0 !important;
  margin-bottom: 12px !important;           /* 严格收紧段落间距 */
  -webkit-font-smoothing: subpixel-antialiased !important; /* 硬件级抗锯齿渲染，让黑底白字厚实饱满 */
}

/* ==================== 3. 核心交易表单区：使用系统内置的高级无衬线体（安全转化线） ==================== */
/* 剥离了产品描述和 P 标签，确保变体、表单、下拉框和购物车清晰可读 */
td, th, label, input, select, option,
.product-form, .product-form *,
.product__accordion content, .product__accordion content *,
.facets__form, .facet-filters__label, .facet-filters__sort, .product-count, .product-count__text,
.card__heading, .card__heading a, .price, .price *, .card-information *, .badge,
.cart-drawer, .cart-drawer *, .cart-items, .cart-items *, .totals, .totals *, 
.cart__ctas button, #checkout, .cart__checkout-button, [name="checkout"], .product-form__submit,
[class*="delivery"], [id*="delivery"], [class*="counter"], [id*="counter"] {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

/* 增强表单和购买方砖按钮的重工业力量感 */
.price, .product-form__submit, #checkout, .cart__checkout-button, [name="checkout"] {
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;    /* 强制按钮大写 */
}

/* ==================== 4. 针对 Judge.me 评论区星星的特赦令 ==================== */
.jdgm-star,
.jdgm-star::before,
.jdgm-star::after,
.jdgm-star * {
  font-family: 'JudgemeStar' !important; 
}

/* ==================== 5. 移动端全机型体验优化 ==================== */
@media screen and (max-width: 749px) {
  .product__accordion summary h2,
  .product__accordion summary,
  .product__accordion .accordion__title {
    font-family: 'KronivFutura', sans-serif !important; 
    font-size: 1.3rem !important; 
    white-space: nowrap !important; 
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .announcement-bar__message {
    font-size: 1.1rem !important;
    line-height: 1.3 !important;
  }
  .banner__heading {
    font-size: 2.2rem !important;
  }
  .banner__buttons .button {
    font-size: 1.2rem !important;
  }
}




/* ========================================================
   KRONIV 专属：全局彻底隐藏国家/地区与语言切换按钮
   ======================================================== */

/* 1. 暴力抹除手机端侧边栏底部的国家切换器 */
.menu-drawer__localization,
.menu-drawer .localization-form,
.menu-drawer__utility-links .localization-selector,
[class*="menu-drawer"] .localization-form,
[class*="menu"] .localization-form {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* 2. 顺便抹除网页最底部页脚（Footer）可能露出的国家/货币切换器（双重保险） */
.footer__localization,
.footer .localization-form,
.footer__column--localization,
[class*="footer"] .localization-form {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}



--------------------------------------------------------
   B 部分：【全站通用美化】多列组件极客荧光绿视觉纯化风格（已修剪冲突）
   -------------------------------------------------------- */

/* 1. 间距修复：恢复自动高度，消灭组件重叠，让下方的订阅邮件回归最底部 */
.shopify-section:has(style),
[id*="Custom_Liquid"], 
[id*="custom-liquid"] {
  margin: 0 !important;
  padding: 0 !important;
  height: auto !important; 
}

/* 2. 多列大标题一键暴力居中：通杀全站多列标题 */
.multicolumn .title,
.multicolumn .title-wrapper-with-link,
.multicolumn .title-wrapper-with-link h2,
.title-wrapper-with-link h2.title {
  text-align: center !important; 
  margin: 0 auto 3rem auto !important; 
  width: 100% !important;
  display: block !important;
  font-family: 'KronivFutura',  sans-serif !important;
  color: #E5E7EB !important; 
  font-size: 2.8rem !important; 
  text-transform: uppercase !important;
  letter-spacing: 0.15rem !important;
  text-shadow: 3px 3px 5px #0D0D0D, -2px -2px 0px #0D0D0D, 2px -2px 0px #0D0D0D, -2px 2px 0px #0D0D0D !important;
}

.multicolumn-card__image-wrapper img {
  filter: brightness(0.96) contrast(1.04) saturate(0.95) !important;
  -webkit-filter: brightness(0.96) contrast(1.04) saturate(0.95) !important;
  transition: all 0.3s ease !important;
}

.multicolumn-card__image-wrapper {
  background-color: #0D0D0D !important;
  position: relative !important;
  overflow: hidden !important;
}

.multicolumn-card__image-wrapper::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 3 !important;
  pointer-events: none !important;
  /* 终极改动：将完全透明的安全区从 15% 暴力扩大到 52%！
     并在 52% 到 88% 之间采用极度平滑的稀薄烟雾过渡，只在 98% 的最边缘死角一刀切黑 */
  background: radial-gradient(circle at center, rgba(0,20,20,0.03) 52%, rgba(0,0,0,0.2) 75%, rgba(0,0,0,0.7) 88%, rgba(0,0,0,1) 98%) !important;
}





/* 5. 强行开启纵向弹性盒模型，为行动链接/按钮绝对在底部对齐做铺垫 */
.multicolumn-list__item .multicolumn-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}
.multicolumn-list__item .multicolumn-card__info {
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
  justify-content: flex-start !important; 
  padding-bottom: 4rem !important; 
  position: relative !important;
}



/* 7. 副标题故事文字：纯白 KronivFutura + 阴影 */
.multicolumn-list__item .rte,
.multicolumn-list__item p {
  text-align: center !important;
  color: #E5E7EB !important;
  font-size: 1.35rem !important; 
  line-height: 1.6 !important;
  margin-bottom: 2rem !important;
}

/* ==========================================================================
   KRONIV 最终补丁：多列卡片底部锚点链接黑白灰重塑（100% 维持绝对对齐）
   ========================================================================== */

/* 1. 终极救命对齐：不管文字多长多短，强行把三个行动按钮死死锁在卡片的最底部 */
.multicolumn-list__item a.link,
.multicolumn-list__item .button {
  position: absolute !important;         /* 100% 维持你原厂的绝对定位骨架 */
  bottom: 0 !important; 
  left: 50% !important;
  transform: translateX(-50%) !important; /* 确保链接在任何分辨率下都绝对横向居中对齐 */
  
  color: #E5E7EB !important;             /* 暴力去绿！强制洗成冷冽纯白 */
  font-family: 'KronivFutura', sans-serif !important; /* 锁定品牌特制 KronivFutura */
  font-weight: bold !important;
  text-transform: uppercase !important;   /* 维持全大写的大牌块状规整风 */
  letter-spacing: 0.15rem !important;
  text-decoration: none !important;
  padding-bottom: 6px !important;        /* 稍微拉开一点与线条的衬垫距离，更有精细感 */
  
  /* 斩断页游感：彻底剔除原先廉价粗糙的绿色虚线（dashed），换成大牌通用的纯白高精细实线 */
  border-bottom: 1px solid #E5E7EB !important; 
  
  white-space: nowrap !important;
  transition: all 0.25s ease-in-out !important; /* 平滑的悬停过渡动画 */
}

/* 2. 按钮悬停交互特效：优雅转为高级的中灰色淡化反馈 */
.multicolumn-list__item a.link:hover {
  color: #888888 !important;             /* 悬停微变高级中灰 */
  border-bottom: 1px solid #888888 !important; /* 下衬线同步平滑变灰，反馈极其冷酷 */
}






/* 1. 强行把被压扁的抽屉底盘彻底拉宽撑开，变成纯黑色 */
#menu-drawer, 
.menu-drawer,
.js-menu-drawer {
  width: 85% !important;           /* 宽度强制恢复占手机屏幕的 85% */
  min-width: 280px !important;     /* 确保不会缩成细条 */
  background-color: #0D0D0D !important; /* 强制填满纯黑色 */
  visibility: visible !important;
  transform: none !important;      /* 砸碎错乱的位移 */
  display: block !important;
}

/* 2. 强行洗掉系统自带的半透明或灰色干扰底色 */
.menu-drawer__inner-container,
.menu-drawer__navigation-container {
  background-color: #0D0D0D !important; /* 内部也必须是纯黑 */
  padding: 40px 24px !important;      /* 留出帅气的四周空隙 */
}


/* ========================================================
   1. 彻底改造 US SIZE 下拉框（压缩面积、收紧间距）
   ======================================================== */
/* 限制下拉框的最大宽度，不再让它傻大黑粗地占满整行 */
.product-form__input--dropdown {
  max-width: 200px !important;
  margin-bottom: 0.5rem !important; /* 大幅缩减下方空白 */
}

/* 缩减标签 (US SIZE) 和下拉框之间的死空白 */
.product-form__input--dropdown .form__label {
  margin-bottom: 0.4rem !important;
  font-family: 'KronivFutura' !important;
  font-size: 1.1rem !important;
  letter-spacing: 2px !important;
  color: #888 !important; /* 降低标签亮度，突出选项本身 */
}

/* 精细化下拉框的内部间距和质感 */
.product-form__input--dropdown select {
  border: 2px solid #333 !important; /* 暗色工业风边框 */
  background-color: #0D0D0D !important; 
  color: #E5E7EB !important; 
  font-family: 'KronivFutura' !important; 
  font-weight: bold !important;
  font-size: 1.3rem !important;
  border-radius: 0px !important; /* 彻底直角 */
  padding: 8px 12px !important; /* 极度紧凑的内边距 */
  height: auto !important;
}

/* 聚焦或点击时变亮 */
.product-form__input--dropdown select:focus {
  border-color: #E5E7EB !important;
  box-shadow: none !important;
}

/* ========================================================
   2. 彻底改造 QUANTITY 数量框
   ======================================================== */
.product-form__input--quantity {
  margin-top: 0.5rem !important;
  margin-bottom: 1.5rem !important; /* 让它跟下方的加购按钮拉开安全距离 */
}

.product-form__input--quantity .form__label {
  margin-bottom: 0.4rem !important;
  font-family: 'KronivFutura' !important;
  letter-spacing: 2px !important;
  color: #888 !important;
}

.quantity {
  width: 140px !important; /* 锁死宽度，避免变形 */
  min-height: 38px !important;
  border: 2px solid #333 !important;
  background-color: #0D0D0D !important;
  border-radius: 0px !important;
}

.quantity__input, .quantity__button {
  color: #E5E7EB !important;
  font-family: 'KronivFutura' !important;
  font-weight: bold !important;
}




/* 让下方的火苗到货时间组件字体更硬朗 */
.product__info-container .custom-delivery-time, /* 如果是App生成的组件 */
.product__info-container p, 
.product__info-container span {
  font-family: 'KronivFutura' !important;
  text-transform: uppercase !important;
}

/* ========================================================
   3. 商品页核心组件（下拉框、数量框、按钮）的赛博风微调
   ======================================================== */
/* 下拉框和数量框：黑底、直角、灰暗边框突出绿色内容 */
.product-form__input--dropdown select,
.quantity {
  border: 2px solid #333 !important;
  background-color: #0D0D0D !important; 
  color: #E5E7EB !important; 
  border-radius: 0px !important;
  font-family: 'KronivFutura' !important;
}

/* 限制下拉框宽度并压缩死空白 */
.product-form__input--dropdown {
  max-width: 200px !important;
  margin-bottom: 0.5rem !important;
}


.product-form__buttons .button--secondary:hover {
  background-color: #E5E7EB !important;
  color: #0D0D0D !important;
}

/* 压缩按钮和到货组件上下多余的巨额空隙 */
.product-form__buttons {
  margin-top: 1rem !important;
  margin-bottom: 0.5rem !important;
}
.product-form__buttons + button, 
.shopify-payment-button__more-options {
  display: none !important; /* 隐藏多余的快捷支付下划线细字 */
}




/* 2. 导航栏鼠标悬停时交互：变为纯白 */
nav.header__inline-menu ul li a:hover,
.header__inline-menu .list-menu__item:hover {
    color: #E5E7EB !important;           /* 鼠标放上去时变成纯白 */
}


/* 强制将变体选择器与数量选择器的所有文字、数字改为 KronivFutura */
.product-form__input .form__label,
.product-form__input select,
.product-form__input option,
.quantity__label,
.quantity__input,
.quantity__button {
    font-family: 'KronivFutura', sans-serif !important;
    text-transform: uppercase !important; /* 保持你一贯的大写朋克风 */
    font-weight: bold !important;         /* 适当加粗，增强机械感 */
}

/* 针对多属性下拉框内部的微调 */
.product-form__input select {
    letter-spacing: 0.05rem !important;
}
/* 1. 强力穿透：针对 Quantity 数量选择器的所有输入框、按钮和数字进行无缝覆盖 */
div[class*="quantity"] *,
.quantity,
.quantity__input,
.quantity__button,
input[name="quantity"],
.product-form__quantity .quantity__input {
    font-family: 'KronivFutura', sans-serif !important;
    font-weight: bold !important;
}


/* 精准修复 US SIZE 标签：强制变白、加粗、同步字号 */
.product-form__input .form__label,
label[for^="Option"],
.product-form__input > label {
    color: #E5E7EB !important;           /* 彻底告别发灰，强制变为纯白 */
    font-size: 1.4rem !important;        /* 调整字号，与 QUANTITY 的大小完美对齐 */
    font-weight: bold !important;        /* 极限加粗，增强工业机械感 */
    letter-spacing: 0.1rem !important;   /* 微调字间距，让大写字母更舒展 */
    text-transform: uppercase !important; /* 强制保持全大写 */
    opacity: 1 !important;               /* 彻底拔除系统自带的半透明发灰滤镜 */
}

/* ==========================================================================
   KRONIV EXCLUSIVE: COLLAPSIBLE ROWS REBOOT (NEON GREEN INTERFACE & LEFT-ALIGNED)
   ========================================================================== */

/* 1. 强行规范折叠行标题区：洗净荧光绿，将标题、小图标、箭头全部变为极致纯白 */
.product__accordion summary,
.product__accordion summary *,
.collapsible-row__summary,
.collapsible-row__summary-title,
summary[id^="Summary-"] *,
.product__accordion summary .icon,
.accordion,
.accordion *,
.product__accordion details,
[id^="Details-"] * {
    color: #E5E7EB !important;            /* 暴力去绿！标题变为清爽纯白 */
    font-weight: 700 !important;          /* 优化为 700 粗体，避免 900 带来页游的笨重感 */
    text-transform: uppercase !important; /* 维持大写代码风格的块状美感 */
    fill: #E5E7EB !important;             /* 强制让图标/右侧箭头完美变白，彻底绝育绿色 */
}

/* 2. 鼠标悬停或手指点击时的交互：模仿大牌先锋网站，悬停时转为优雅的「高级中灰色」 */
.product__accordion summary:hover,
.product__accordion summary:hover *,
.accordion summary:hover,
.accordion summary:hover * {
    color: #888888 !important;            /* 悬停时变为中灰色，提供极其内敛的交互反馈 */
    fill: #888888 !important;             /* 图标和箭头同步变灰，冷酷利落 */
}

/* 3. 精细微调：折叠行点开后的“内部文字”渲染（严格遵循之前调校好的全局黄金行距与段距） */
.product__accordion .accordion__content,
.product__accordion .accordion__content *,
.collapsible-row__content,
.accordion__content,
.accordion__content * {
    color: #E5E7EB !important;            /* 内里正文保持纯白，保证最强可读性 */
    letter-spacing: 0.03rem !important;   /* 完美匹配我们之前全站死锁的 0.03rem 品牌字间距 */
    text-transform: none !important;      /* 确保内里正文绝对不被大写锁污染，恢复极佳的阅读舒适度 */
}



/* ==========================================================================
   🎯 赛博重工业控制台对齐重塑：强行将所有折叠行组件死死【全端绝对居中】
   ========================================================================== */
.product__accordion,
.product__accordion details,
.product__accordion summary,
.accordion,
.accordion details,
.accordion summary,
.accordion__content,
.collapsible-row__content {
  text-align: center !important;         /* 🛠️ 核心修复：强制内部所有文字、中括号文本绝对横向居中 */
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: auto !important;          /* 🛠️ 核心修复：左右外边距自动平分，强制容器块居中 */
  margin-right: auto !important;
}

/* 🛠️ 针对 Dawn 主题底层 summary 弹性盒模型的中心垂直轴死锁对齐 */
.product__accordion summary,
.accordion summary {
  display: flex !important;
  justify-content: center !important;    /* 🛠️ 核心修复：迫使标题文本和右侧小箭头整体向中轴线靠拢居中 */
  align-items: center !important;
  text-align: center !important;
}
/* ==========================================================================
   🎛️ 补充重构：手风琴字号压缩 + 赛博高级灰深浅洗净（与全站调性闭环）
   ========================================================================== */

/* 1. 总大标题重塑（PACK_LOGS // METALLURGY_Q&A） */
.collapsible-content__heading,
.collapsible-content .title,
.product__accordion .heading {
  font-size: 18px !important;               /* 🛠️ 压缩总标题体积，拒绝粗暴的大字体 */
  font-weight: 700 !important;
  color: #E5E7EB !important;                /* 保持顶部最高权限的清脆纯白 */
  letter-spacing: 0.08rem !important;
  margin-bottom: 2rem !important;
}

/* ==========================================================================
   🖤 KRONIV HARDCORE ACCORDION CORE // 终极整合手风琴面板全局控制
   ========================================================================== */

/* 1. 【双轴死锁绝对居中】+【纯黑容器净化】：彻底消灭原生灰底线框，让面板横向对称 */
.product__accordion,
.product__accordion details,
.product__accordion summary,
.product__accordion .grid,
.accordion,
.accordion details,
.accordion summary,
.accordion__content,
.collapsible-row__content,
.collapsible-content__grid,
.collapsible-content__wrapper,
.collapsible-content__item {
  text-align: center !important;
  background: #0D0D0D !important;
  background-color: #0D0D0D !important;
  border: none !important;
  box-shadow: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 2. 【弹性中心对齐轴】：迫使内部文字标题和右侧小箭头整体向中轴线靠拢 */
.product__accordion summary,
.accordion summary {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* 3. 【总大标题控制】：同步放大对标下方，增强黑客控制台气场 */
.collapsible-content__heading,
.collapsible-content .title,
.product__accordion .heading {
  font-size: 22px !important;               /* 🛠️ 从 18px 完美提速放大至 22px，精准咬合下方大小 */
  font-weight: 800 !important;               /* 🛠️ 强行拉满极客重工业特粗权重，使其更加硬朗 */
  color: #E5E7EB !important;                /* 维持精神的纯白 */
  letter-spacing: 0.12rem !important;        /* 🛠️ 拉宽字母间距，对齐潮牌和硬核控制台的横向版式 */
  margin-bottom: 2rem !important;
}


/* 4. 【行标题重塑】：深度穿透内壳标签，强制压缩至 13px，并将亮度降为高级中灰 */
.product__accordion summary h3,
.product__accordion summary h2,
.product__accordion summary span,
.product__accordion .accordion__title,
.accordion summary h3,
.accordion summary h2,
.accordion summary span,
.accordion .accordion__title {
  font-size: 13px !important;
  --font-heading-scale: 1 !important; /* 🛠️ 强行废除 Dawn 15.5 原生的放大系数变量 */
  font-weight: 700 !important;
  color: #a0a0a0 !important;
  -webkit-text-fill-color: #a0a0a0 !important;
  letter-spacing: 0.05rem !important;
}

/* 5. 【工业风间距平滑调校】：告别死板堆叠，赋予黑客终端呼吸感 */
.product__accordion details,
.product__accordion .accordion,
.accordion,
.accordion details {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.product__accordion summary,
.accordion summary {
  padding-top: 0.55rem !important;    /* 🛠️ 从 0.25 适度放宽，让每行菜单上下舒展开 */
  padding-bottom: 0.55rem !important;
  min-height: 0 !important;           
}

.accordion__title,
.accordion summary .title,
.product__accordion summary * {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  line-height: 1.5 !important;        /* 🛠️ 从 1.2 提升至 1.5，彻底消除文字挤压感 */
}
/* 6. 【详情页模块隔离】：强行推开折叠菜单与下方描述的距离，留下工业呼吸感 */
.product__info-container .product__accordion,
.product__info-container > .accordion {
  margin-bottom: 1rem !important; /* 🛠️ 在折叠菜单组的最下方，向下踹开 2.5rem 的清晰边界 */
}


/* 6. 【微观小箭头清洗】：将右侧 SVG 箭头物理体积缩小，并淡化为极低调的暗灰色 */
.product__accordion summary svg,
.accordion summary svg,
.accordion__icon,
.accordion__icon svg {
  width: 11px !important;
  height: 11px !important;
  min-width: 11px !important;
  stroke: #555555 !important;
  fill: none !important;
  opacity: 0.7 !important;
  transition: all 0.25s ease-in-out !important;
}

/* 7. 【解密交互高亮】：平时冷酷克制，当买家点击展开时，对应的行文字与箭头瞬间如通电般高亮为纯白 */
.accordion details[open] summary *,
.product__accordion details[open] summary *,
.accordion summary:hover svg,
.accordion details[open] summary svg * {
  color: #E5E7EB !important;
  -webkit-text-fill-color: #E5E7EB !important;
  stroke: #E5E7EB !important;
  opacity: 1 !important;
}


/* ==========================================================================
   KRONIV EXCLUSIVE: EMPTY CART PAGE CYBERPUNK REBOOT
   ========================================================================== */

/* 1. 彻底重构空购物车页面的大标题（YOUR CART IS EMPTY） */
.cart__empty-text,
.template-cart .title--wrapper .title,
h1.cart__empty-text {
    font-family: 'KronivFutura', sans-serif !important;
    color: #E5E7EB !important;           /* 保持冷冽纯白 */
    font-weight: 900 !important;         /* 极限加粗 */
    letter-spacing: 0.2rem !important;  /* 拉开字间距 */
    text-transform: uppercase !important;/* 强制大写 */
}

/* 2. 彻底清洗绿框：重构 CONTINUE SHOPPING 按钮（变为大牌标志性「满格纯白填充黑字」） */
.cart__warnings .button,
.template-cart .button,
a[href*="/collections"] {
    background-color: #E5E7EB !important; /* 暴力去绿！升级为满格纯白填充，在空旷页面中释放最高视觉权重 */
    color: #0D0D0D !important;            /* 文字反转为纯黑，在大牌高反差撞色中如同刀锋般利落 */
    border: 1px solid #E5E7EB !important;  /* 纯白包边，与全站黑白灰秩序高度闭环 */
    border-radius: 0px !important;        /* 强制保持硬朗直角，拒绝圆角 */
    font-family: 'KronivFutura', sans-serif !important;
    font-weight: 700 !important;          /* 优化为 700 粗体，避免 900 产生页游的笨重感 */
    letter-spacing: 0.15rem !important;
    padding: 1.5rem 3rem !important;      /* 维持你在手机端调整好的充实感衬垫 */
    box-shadow: none !important;          /* 彻底斩断原先恶俗的绿色霓虹发光特效！ */
    transition: all 0.25s ease-in-out !important; /* 平滑的悬停过渡动画 */
}

/* CONTINUE SHOPPING 按钮手指悬停/点击时的优雅反馈 */
.cart__warnings .button:hover,
.template-cart .button:hover {
    background-color: #E5E5E5 !important; /* 去绿！悬停时微调为质感银灰色，产生优雅的工业级交互感 */
    color: #0D0D0D !important;            /* 文字维持纯黑 */
    border-color: #E5E5E5 !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important; /* 仅仅增加微弱的先锋下沉阴影，绝不漏绿 */
}

/* 3. 修改下方的登录提示文字区域（HAVE AN ACCOUNT? / LOG IN） */
.cart__login-title,
.cart__login-paragraph {
    font-family: 'KronivFutura', sans-serif !important;
    color: #888888 !important;            /* 调整为高级中浅灰，与上方大标题拉开优雅层级 */
    text-transform: uppercase !important;
}
/* 强行把底部的登录链接下划线和文字同步微调（洗净荧光绿，回归极致纯白） */
.cart__warnings a[href*="/account/login"] {
    font-family: 'KronivFutura', sans-serif !important;
    color: #E5E7EB !important;            /* 暴力去绿！登录链接强制变为极致纯白 */
    font-weight: bold !important;
    text-transform: uppercase !important; /* 英文强制大写，呼应全站块状大牌感 */
    text-decoration: underline !important;/* 维持经典的下划线锚点提示 */
    text-shadow: none !important;         /* 斩断一切绿色发光残留 */
}




/* 精准缩小空购物车大标题，恢复精致的黑客代码质感 */
.cart__empty-text,
.template-cart .title--wrapper .title,
h1.cart__empty-text {
    font-family: 'KronivFutura', sans-serif !important;
    color: #E5E7EB !important;           /* 保持冷冽纯白 */
    font-size: 1.8rem !important;        /* 【核心】从原先的超级大字暴降到1.8rem，精致内敛 */
    font-weight: bold !important;        /* 改为普通加粗，拒绝极限大粗体 */
    letter-spacing: 0.15rem !important;  /* 稍微收紧一点字间距，让这排大写字母在手机端完美居中 */
    text-transform: uppercase !important;/* 强制大写 */
    margin-bottom: 2.5rem !important;    /* 稍微拉开一点跟下方按钮的间距，给呼吸感 */
}
/* 强行同步全站底部页脚的所有文字、版权、法律条款为 KronivFutura 纯大写 */
footer.footer,
.footer *,
.footer__copyright,
.footer__copyright *,
.footer__localization-toggle,
.footer__linklist-item a {
        text-transform: uppercase !important; /* 强制全大写 */
    font-size: 1.1rem !important;        /* 保持微缩精致的小字号 */
    letter-spacing: 0.08rem !important;  /* 微调字间距，防止大写字母挤在一起 */
    color: #888888 !important;           /* 调成更深的暗矿灰，不抢主视觉的绿色风头 */
}

/* 底部条款鼠标悬停或手指点击时亮起变白 */
.footer__linklist-item a:hover,
.footer__copyright a:hover {
    color: #E5E7EB !important;
}
/* ==========================================================================
   KRONIV EXCLUSIVE: ACTIVE & EMPTY CART DRAWER BLACKOUT (ULTIMATE EDITION)
   ========================================================================== */

/* 1. 【核心】强行将滑出购物车的所有层级（含空、满、侧边栏、卡片）背景全部锁死为纯黑 */
.drawer,
.drawer__inner,
#CartDrawer,
div[id^="CartDrawer-"],
.cart-drawer .drawer__body,
.cart-drawer .drawer__footer,
.cart-drawer div[class*="footer"],
#CartDrawer-Form,
.cart-items,
.cart-item {
    background-color: #0D0D0D !important;
    background: #0D0D0D !important;
}

/* 2. 【字体与格式】滑出购物车内所有文本、单品名、属性等强制锁定为 KronivFutura 纯大写 */
.cart-drawer,
.cart-drawer *,
.drawer__heading,
.cart-item__name,
.cart-item__details *,
.cart-drawer .totals *,
.cart-drawer .tax-note,
.cart-drawer p,
.cart-drawer span {
        text-transform: uppercase !important; /* 强制全大写 */
    color: #E5E7EB !important;           /* 强制变为冷冽纯白 */
}
/* ==========================================================================
   KRONIV EXCLUSIVE: CART DRAWER BLACK-WHITE-GRAY REBOOT
   ========================================================================== */

/* 3. 【折扣高级化】：斩断促销绿！将优惠券名称和折扣金额洗练为极致纯白 */
/* 思路：摒弃廉价的促销大绿，利用纯白加粗和利落线条，让折扣呈现如同“尊贵加密代码减免”的高级感 */
.cart-drawer .discounts__discount,
.cart-drawer .discounts__discount *,
.cart-drawer .discounts__discount svg {
    color: #E5E7EB !important;          /* 暴力去绿！折扣金额转换为高亮纯白 */
    fill: #E5E7EB !important;           /* 优惠券图标同步转为纯白 */
    font-weight: bold !important;       /* 维持加粗，确保降价信息清晰可见 */
    letter-spacing: 0.05rem !important; /* 微调间距，杜绝紧凑 */
    text-shadow: none !important;        /* 斩断一切可能的发光残留 */
}

/* 4. 【数量选择器变黑白】：维持重工业深灰底色，在纯黑底盘下完美融合 */
.cart-drawer .quantity {
    background-color: #121212 !important; /* 维持高级的重工业深灰底 */
    border: 1px solid #333333 !important; /* 维持低调的暗灰微边框 */
    border-radius: 0px !important;        /* 严格锁死 100% 硬朗直角 */
}
.cart-drawer .quantity__input,
.cart-drawer .quantity__button {
    color: #E5E7EB !important;            /* 数字与加减号保持干净纯白 */
}
.cart-drawer cart-remove-button button {
    color: #E5E7EB !important;            /* 移除（垃圾桶）按钮保持冷冽纯白 */
}

/* 5. 【系统元素黑化】：顶部关闭按钮“X”与内部全线切断绿色，拥抱暗夜秩序 */
.drawer__close svg {
    color: #E5E7EB !important;
    fill: #E5E7EB !important;             /* 侧滑关闭“X”号绝对纯白利落 */
}
.cart-drawer .cart-item,
.cart-drawer .drawer__footer {
    border-color: #222222 !important;     /* 分割线维持暗夜灰，在黑底中若隐若现，低调且高级 */
}

/* ==========================================================================
   KRONIV 最终绝杀：购物车抽屉终极结账按钮（CHECKOUT）黑白灰重塑补丁
   ========================================================================== */

/* 6. 【高阶推进器】重构满状态下的 CHECKOUT 结账按钮（纯白满格填充、极致高反差黑字） */
#CartDrawer-Checkout,
.cart-drawer .cart__checkout-button,
button[name="checkout"] {
    background-color: #E5E7EB !important; /* 暴力去绿！升级为无瑕纯白填充，在暗黑抽屉底盘中释放至高转化权重 */
    color: #0D0D0D !important;            /* 文字反转为纯黑，在大牌撞色秩序中如同刀锋般利落、醒目 */
    border: 1px solid #E5E7EB !important;  /* 纯白包边，与全站黑白灰大牌视觉完全闭环 */
    border-radius: 0px !important;        /* 强制去圆角，死锁 100% 硬朗直角几何体 */
    font-family: 'KronivFutura', sans-serif !important; /* 规范字族为品牌特制 KronivFutura */
    font-weight: 700 !important;          /* 优化为 700 骨感粗体，拒绝 900 产生页游的突兀感 */
    letter-spacing: 0.2rem !important;   /* 维持标志性的稀疏字间距，拉满仪式感 */
    box-shadow: none !important;          /* 彻底斩断原先恶俗的绿色霓虹呼吸发光特效！ */
    transition: all 0.25s ease-in-out !important; /* 平滑顺畅的悬停过渡动画 */
    height: auto !important;
    padding: 1.5rem 0 !important;         /* 维持你在手机端调整好的极具存在感的大气高度 */
}

/* CHECKOUT 按钮在鼠标悬停或手指点击时的优雅交互：平滑过渡至质感银灰色 */
#CartDrawer-Checkout:hover,
button[name="checkout"]:hover {
    background-color: #E5E5E5 !important; /* 悬停时微调为质感银灰色，产生极具克制的科技交互感 */
    color: #0D0D0D !important;            /* 文字维持纯黑 */
    border-color: #E5E5E5 !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important; /* 仅仅增加微弱的先锋下沉阴影，绝不漏绿 */
}



/* ==========================================================================
   KRONIV EXCLUSIVE: HOMEPAGE HERO BANNER & TITLES REBOOT
   ========================================================================== */

/* 1. 精准撑开间距：彻底解决 Banner 底部副标题与下方产品标题重叠的问题 */
.image-banner + .index-section,
div[id^="shopify-section-template"] .rich-text,
.featured-collection {
    margin-top: 5rem !important; /* 强制拉开 50px 的安全黑色留白空间 */
    padding-top: 2rem !important;
}

/* 2. 将首页所有组件的大标题、副标题统一锁定为 KronivFutura 纯大写 */
.banner__heading,
.banner__text,
.collection-list-title,
.title-wrapper-with-link .title,
h2[class*="title"],
.rich-text__text {
    font-family: 'KronivFutura', sans-serif !important;
    text-transform: uppercase !important; /* 强制全大写 */
    letter-spacing: 0.15rem !important;  /* 拉开字间距 */
}



/* ==========================================================================
   KRONIV EXCLUSIVE: CHONGQING RICH TEXT & COLLECTION SPACING FIX
   ========================================================================== */

/* 1. 强行锁定“重庆赛博迷宫”富文本区域的字体、颜色和完美的上下间距 */
div[id^="shopify-section-template"] .rich-text,
.rich-text__wrapper,
.rich-text__blocks {
        color: #E5E7EB !important;           /* 文字保持纯白 */
    text-transform: uppercase !important;/* 强制大写 */
    margin-top: 4rem !important;         /* 与上方大 Banner 拉开 40px 距离 */
    margin-bottom: 4rem !important;      /* 与下方特色产品拉开 40px 距离 */
    padding: 2rem 0 !important;          /* 撑开内部呼吸感 */
}

/* 2. 强行让被挤掉的特色产品标题 [ FORGED WEAPONS ] 显形、变大、加粗 */
.featured-collection .title,
.featured-collection h2,
.title-wrapper-with-link h2.title {
    font-family: 'KronivFutura', sans-serif !important;
    color: #E5E7EB !important;           /* 标题为白色 */
    font-size: 2.2rem !important;        /* 放大字号，作为分区的视觉抓手 */
    font-weight: bold !important;        /* 加粗文字 */
    text-transform: uppercase !important;/* 强制大写 */
    letter-spacing: 0.15rem !important;  /* 拉开字间距 */
    display: block !important;           /* 强行穿透并显形 */
    visibility: visible !important;
}


/* ==========================================================================
   KRONIV EXCLUSIVE: GRID REBOOT (DESKTOP 4-COLUMNS / MOBILE 2-COLUMNS)
   ========================================================================== */

/* 1. 【电脑端分辨率 - 屏幕大于 750px】强制锁死为完美的 4 列网格大货架 */
@media screen and (min-width: 750px) {
    .featured-collection ul.grid,
    .featured-collection .grid--4-col-desktop {
        display: grid !important;
        grid-template-columns: repeat(4, 1fr) !important; /* 强制电脑端一排雷打不动并排 4 个商品 */
        gap: 2rem !important;                             /* 戒指之间的工业空隙 */
    }
    .featured-collection ul.grid .grid__item {
        width: 100% !important;                           /* 彻底干掉原生百分比导致的不对齐 */
        max-width: 100% !important;
    }
}

/* 2. 【手机端分辨率 - 屏幕小于 750px】强制锁死为干净的 2 列矩阵滚动，拒绝缩水 */
@media screen and (max-width: 749px) {
    .featured-collection ul.grid,
    .featured-collection .grid--2-col-tablet-down {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important; /* 强制手机端一排并排 2 个商品 */
        gap: 1.5rem !important;                           /* 手机端商品间距 */
    }
    .featured-collection ul.grid .grid__item {
        width: 100% !important;                           /* 彻底拔除导致排版崩溃的行内宽度 */
        max-width: 100% !important;
    }
}
/* ==========================================================================
   KRONIV EXCLUSIVE: BANNER TITLE ROUTING TO GLOBAL BASE
   ========================================================================== */
.template-index .banner__heading, 
.template-index .banner__heading span,
html body .template-index h2.banner__heading {
    font-family: 'KronivFutura', sans-serif !important;
    color: #E5E7EB !important;
    font-weight: 900 !important;
    font-size: 2.4rem !important;
    letter-spacing: 0.18rem !important;
    text-transform: uppercase !important;
    text-shadow: 0px 2px 10px rgba(0, 0, 0, 0.8) !important;
}

@media screen and (min-width: 750px) {
    html body .template-index .banner__heading {
        font-size: 4.2rem !important;
        letter-spacing: 0.3rem !important;
    }
}
/* ==========================================================================
   KRONIV EXCLUSIVE: FOOTER HEADING BLACK-WHITE-GRAY REBOOT
   ========================================================================== */

/* 1. 强行将页脚的所有列大标题彻底洗白（剥离任何荧光绿与霓虹发光残留） */
.footer .footer-block__heading,
.footer h2.footer-block__heading,
.footer .footer-block .inline-richtext,
.footer div:has(> p) h2 {
    color: #E5E7EB !important;           /* 暴力去绿！核心大标题强制洗成纯白色 */
    font-weight: 700 !important;          /* 优化为 700 骨感粗体，拒绝 900 产生页游的笨重感 */
    letter-spacing: 0.2rem !important;   /* 细节升华：微微加宽间距，释放 KronivFutura 大写字母的稀疏大牌感 */
    text-transform: uppercase !important; /* 强制大写，保持规整块状感 */
    
    /* 
       斩断页游感：彻底剔除原先恶俗突兀的绿色霓虹发光特效！
       还原本质的极简扁平秩序，让页脚在全站最底部达成最完美的低调闭环。
    */
    text-shadow: none !important; 
    line-height: 1.3 !important;          /* 收紧标题行距 */
    margin-bottom: 2rem !important;       /* 给予下方链接完美的呼吸空间 */
}

/* ==========================================================================
   KRONIV EXCLUSIVE: MOBILE MENU DRAWER BORDER CLEANUP FIX
   ========================================================================== */

/* 精准揪出左侧手机导航菜单内部被误伤的所有边框、阴影和多余底色，强行将其彻底剥离归零 */
.menu-drawer__menu-item,
.menu-drawer__menu-item *,
.menu-drawer__inner-container *,
.header__inline-menu .list-menu__item,
nav[class*="menu-drawer"] *,
.menu-drawer ul li a {
    border: none !important;              /* 【核心】彻底干掉这个突兀的荧光绿中空大边框 */
    border-width: 0px !important;         /* 强制边框宽度清零 */
    box-shadow: none !important;          /* 彻底剥离任何残留的按钮外发光特效 */
    text-shadow: none !important;         /* 剥离多余的字形投影，保持冰冷清脆 */
    background: transparent !important;   /* 确保文字背景完全中空透明，不产生色块冲突 */
    background-color: transparent !important;
}
/* 保证手机导航栏里的各个分类大字在没有任何边框干扰下，依旧保持完美的 KronivFutura 字体与极致纯白 */
.menu-drawer__menu-item,
.menu-drawer__menu-item * {
    font-family: 'KronivFutura', sans-serif !important; /* 锁定品牌专属特制字体 */
    color: #E5E7EB !important;                          /* 暴力去绿！主分类大字强制洗成极致纯白 */
    text-transform: uppercase !important;               /* 维持全大写的大牌块状规整风 */
    font-weight: bold !important;                       
    letter-spacing: 0.15rem !important;                 /* 微调字间距，释放新字体特有的稀疏大牌感 */
}


/* ==========================================================================
   KRONIV EXCLUSIVE: MOBILE MENU UL LIST HARD LEFT-ALIGN FIX
   ========================================================================== */

/* 1. 彻底击碎 Dawn 默认列表的多余外边距与弹性盒偏移，把容器宽度直接拉满 */
.menu-drawer__menu,
ul.menu-drawer__menu,
.menu-drawer nav,
.menu-drawer__navigation {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important; /* 清空列表原生缩进 */
}

/* 2. 强行将列表内所有的 li 标签和 a 标签的宽度拉到100%，并锁定绝对左对齐 */
.menu-drawer__menu li,
.menu-drawer__menu-item,
.menu-drawer__menu-item *,
.menu-drawer__menu li a {
    width: 100% !important;
    display: flex !important;
    justify-content: flex-start !important; /* 强制弹性盒元素全部贴紧左侧起点 */
    text-align: left !important;            /* 文字绝对左对齐 */
}

/* 3. 精准控制：给文字设置一个统一、干净的左侧物理留白，确保它们完美在一条垂直线上对齐 */
.menu-drawer__menu-item {
    padding-left: 3.5rem !important; /* 这里控制字离手机左侧屏幕边缘的距离，可根据视觉喜好微调 */
    padding-right: 2rem !important;
}

/* ==========================================================================
   KRONIV EXCLUSIVE: RICH TEXT HEADING BLACK-WHITE-GRAY REBOOT
   ========================================================================= */

/* 1. 仅让富文本分区的“大标题”洗净荧光绿，回归利落纯白（100% 维持大气尺寸） */
.rich-text__blocks h2, 
.rich-text__blocks .inline-richtext {
  font-family: 'KronivFutura', sans-serif !important; /* 锁死品牌专属特制字体 */
  color: #E5E7EB !important;                          /* 暴力去绿！强制洗成极致纯白 */
  font-size: 32px !important;                         /* 完美维持你指定的 32px 大气统治级字号 */
  letter-spacing: 2px !important;                    /* 维持 2px 稀疏字间距，尽显画册高级感 */
  text-transform: uppercase !important;               /* 英文强制大写，保持规整块状感 */
  
  /* 
     斩断页游感：彻底剔除原先恶俗突兀的双层绿色霓虹发光特效！
     还原本质的极简扁平秩序，让品牌故事标题呈现如同刀锋般的利落线条。
  */
  text-shadow: none !important;
  line-height: 1.3 !important;                        /* 收紧大标题行距，防止多行时散架 */
}

/* ==========================================================================
   KRONIV EXCLUSIVE: LOGO RESPONSIVE EXPANSION (MOBILE FIXED)
   ========================================================================== */

/* 💻 电脑大屏幕端：保持宽裕的右侧安全距离，防止撞车导航 */
@media screen and (min-width: 750px) {
    .header__heading-link, 
    .header__heading,
    .header__heading-logo {
        margin-right: 3.5rem !important;            
        filter: none !important; /* 🛠️ 这里改成了 none，彻底关闭绿色发光 */
        display: inline-block !important;
        transform: none !important;                 
    }
}


/* ==========================================================================
   KRONIV EXCLUSIVE: ANTI-WHITE FLASH & ANTI-GAP OVERSCROLL FIX
   ========================================================================== */

/* 1. 【斩草除根】：强制全站最原始的骨架底层完全漆黑，彻底干掉回弹时暴露出来的白色视窗 */
html, 
body, 
#a11y-main-page-content,
.gradient {
    background-color: #0D0D0D !important;
    background: #0D0D0D !important;
}

/* 2. 【物理锁死】：修复 Dawn 主题粘性页头在手机端上滑动画时的像素间隙 */
#shopify-section-header,
.header-wrapper,
sticky-header {
    background-color: #0D0D0D !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* 3. 【极客保险】：防止部分安卓或旧版 iOS 系统在边缘弹性拉伸时图层穿透 */
html {
    scroll-behavior: smooth;
    overscroll-behavior-y: none; /* 【神技】直接从根源上禁止手机浏览器的垂直恶性橡皮筋过载回弹，全网秒开且极度平稳 */
}
/* ==========================================================================
   KRONIV EXCLUSIVE: BANNER TEXT CONTAINER BOX VAPORIZATION (PC FIXED)
   ========================================================================== */

/* 1. 【彻底蒸发黑色大方块】：剥离大屏下Banner文字背后的死板不透明背景色与阴影 */
.image-banner .banner__content .banner__box,
.banner__content .banner__box,
.banner--desktop-transparent .banner__box {
    background-color: transparent !important;   /* 强制完全透明，让后面的戒指纹身大图完美展现 */
    background: transparent !important;
    border: none !important;                     /* 剔除可能存在的原厂边框 */
    box-shadow: none !important;                  /* 拔掉所有死板的投影 */
    padding: 0 !important;                       /* 释放多余的内边距，让文字排版更凌厉 */
}

/* 2. 【高街字形微调】：确保中间大字在没有方块后，依然具备极强的错落可读性 */
.krnv-banner-title {
    /* 维持双层高浓度纯黑投影，利用阴影把白字从复杂的纹身背景中狠狠“抠”出来，高级感拉满 */
    text-shadow: 0px 4px 15px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 0.9) !important;
}
/* ==========================================================================
   KRONIV EXCLUSIVE: ULTIMATE MOBILE DRAWER GRAY BLOT ERADICATION
   ========================================================================== */

/* 1. 【核心绝杀】：彻底剥离点击关闭按钮时，手机浏览器和主题自带的灰色高亮与聚焦框 */
.menu-drawer__header *,
.menu-drawer__header button,
.menu-drawer__header summary,
.menu-drawer__header details,
.header__icon--menu,
.header__icon--menu * {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
    -webkit-tap-highlight-color: transparent !important; /* 【神技】强制安卓和 iOS 彻底禁用手指触摸时的原生灰色高亮图层 */
    background: transparent !important;
    background-color: transparent !important;
}

/* 2. 【双重保险】：物理蒸发掉该区域一切可能由 Grid 或 Flex 挤压出来的原厂装饰细线 */
.menu-drawer__header,
.menu-drawer__inner-container .menu-drawer__header,
#menu-drawer,
.menu-drawer__navigation-container {
    border-top: none !important;
    border-bottom: none !important;
    border: none !important;
    box-shadow: none !important;
    background-color: #0D0D0D !important; /* 强制所有容器的底层血统为纯黑 */
}

}
/* 赛博等宽对齐锁：强制后续所有可折叠行内部正文字体与标题完全等大 */
.product__accordion .accordion__content,
.product__accordion .accordion__content * {
  font-size: 1.6rem !important;      /* 强行对齐Dawn主题原生的标准标题字号 */
  line-height: 1.5 !important;       /* 规范行高，防止字号变大后行距过挤 */
}

}

/* ==========================================================================
   KRONIV 专属：产品折叠行前置图标黑白灰重塑补丁
   ========================================================================== */
.product__accordion summary::before {
  font-size: 1.8rem !important;
  font-weight: 900 !important;
  color: #E5E7EB !important;       /* 暴力去绿！强制洗成纯白色 */
  text-shadow: none !important;     /* 彻底斩断绿色的霓虹外发光，杜绝毛边残留 */
  margin-right: 15px !important;
  display: inline-block !important;
  vertical-align: middle !important;
}


/* ==========================================================================
   KRONIV EMAIL SIGNUP BLITZ: 独立邮箱板块标题黑白灰高级重塑补丁
   ========================================================================== */

/* 1. 地毯式精准抓取：将邮箱注册板块里的所有标题洗净荧光绿，回归极致纯白 */
.email-signup .title,
.email-signup .section-heading,
.email-signup h2,
.email-signup-banner__heading,
[id^="Slider-"] + .email-signup h2,
div:has(> .email-signup) h2 {
  font-family: 'KronivFutura', sans-serif !important; /* 锁死品牌专属特制字体 */
  color: #E5E7EB !important;                          /* 暴力去绿！核心标题强制洗成极致纯白 */
  opacity: 1 !important;                 
  text-transform: uppercase !important;               /* 维持全大写的大牌块状美感 */
  line-height: 1.3 !important;                        /* 收紧标题行距 */
  
  /* 
     斩断页游感：彻底剔除原先恶俗突兀的绿色霓虹外发光特效！
     还原本质的极简扁平秩序，让买家感受到正规独立站的安全感。
  */
  text-shadow: none !important; 
}

/* 2. 顺手锁死内部 Email 输入框打字时的颜色（洗净绿色，转为利落纯白） */
.email-signup .field__input {
  color: #E5E7EB !important;                          /* 暴力去绿！打字时呈现冷酷纯白 */
  font-family: 'KronivFutura', sans-serif !important; /* 锁定品牌字体 */
}


/* 2. 🟢 彻底解锁产品详情（The Story）：强制剥离全大写外壳，恢复你在后台创建的真实小写 */
.product__description,
.product__description *,
.product-single__description,
.product-single__description *,
.rte,
.rte *,
.rte p,
.rte span,
#MainContent [class*="description"] *,
#MainContent [class*="rte"] * {
  text-transform: none !important;  /* 斩断全大写清洗令，强制吐出后台的正常大小写 */
  }

/* 1. 锁死电脑端汉堡菜单 */
@media screen and (min-width: 990px) {
  html body header-drawer,
  html body .header__icon--menu,
  html body menu-drawer,
  html body details[id^="Details-menu-drawer"] {
    display: none !important;
  }
}

/* 终极收网：当手机端菜单没有完全展开、或者正在弹回去（关闭）时，强行让左上角所有伪元素蒸发 */
@media screen and (max-width: 989px) {
  /* 1. 当菜单处于非完全展开状态时（即没有 .menu-opening 类名），左上角所有可能残留的灰块必须彻底隐形 */
  html body header-drawer:not(.menu-opening) ::before,
  html body header-drawer:not(.menu-opening) ::after,
  html body #Details-menu-drawer-container:not([open]) ::before,
  html body #Details-menu-drawer-container:not([open]) ::after {
    display: none !important;
    content: none !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
  }

  /* 2. 强行堵死关闭动画结束后的残余像素，不给左上角留下任何回弹死锁的空间 */
  html body .menu-drawer-container:not(.menu-opening) .modal-overlay,
  html body details:not([open]) > summary::after {
    display: none !important;
    opacity: 0 !important;
  }
}
/* 终极唤醒全站政策页面（Legal Notice / Refund / Terms 等）所有被黑底吞噬的文本与标题 */
.shopify-policy__container,
.shopify-policy__container *,
.shopify-policy__title,
.shopify-policy__body,
div[id*="policy"] *,
main .shopify-policy__container p {
  color: #E5E7EB !important; /* 强制将政策页面的所有文字与正文一键变成纯白 */
}




/* --------------------------------------------------------
   B 部分：【全站通用间距整顿】
   -------------------------------------------------------- */
.shopify-section:has(style), [id*="Custom_Liquid"], [id*="custom-liquid"] {
  margin: 0 !important; padding: 0 !important;
}

/* --------------------------------------------------------
   C 部分：【全站黑客风美化】多列组件极客荧光绿及代码终端样式（已彻底剿灭乱断词）
   -------------------------------------------------------- */
.multicolumn .title, .multicolumn .title-wrapper-with-link h2 {
  text-align: center !important; 
  margin: 0 auto 3rem auto !important; 
  width: 100% !important;
  display: block !important;
  color: #E5E7EB !important; 
  font-size: 2.8rem !important; 
  text-transform: uppercase !important;
  letter-spacing: 0.15rem !important;
  text-shadow: 3px 3px 5px #0D0D0D, -2px -2px 0px #0D0D0D, 2px -2px 0px #0D0D0D, -2px 2px 0px #0D0D0D !important;
}
.multicolumn-list__item .multicolumn-card__image-wrapper img, .multicolumn-card img {
  filter: contrast(1.1) brightness(0.95) hue-rotate(15deg) saturate(0.95) !important;
  mix-blend-mode: luminosity; 
  background: rgba(0, 50, 50, 0.08) !important; 
}
.multicolumn, .multicolumn-list, .multicolumn-list__item * {
   letter-spacing: 0.06rem !important;
}
.multicolumn-list__item .multicolumn-card__info {
  display: flex !important; 
  flex-direction: column !important; 
  align-items: center !important;
  flex-grow: 1 !important; 
  justify-content: flex-start !important; 
  padding-bottom: 5rem !important; 
  position: relative !important;
}
/* ==========================================================================
   KRONIV 最终补丁：多列卡片大标题（h3）黑白灰高级重塑
   ========================================================================== */
.multicolumn-list__item h3 {
  text-align: center !important; 
  color: #E5E7EB !important;                   /* 暴力去绿！强制洗成极致纯白 */
  font-family: 'KronivFutura', sans-serif !important; /* 死锁品牌专属特制字体 */
  font-size: 1.8rem !important; 
  
  /* 细节升华：字间距微微加宽，完全释放大写字母的块状高级感 */
  letter-spacing: 0.15rem !important; 
  text-transform: uppercase !important;        /* 维持全大写的大牌工整风 */
  margin-top: 2rem !important; 
  margin-bottom: 1.5rem !important;
  
  /* 
     斩断页游感：彻底剔除原先恶俗突兀的多层黑影残留。
     换成刀锋般的纯白裸字，回归极其正经、先锋的极简画册秩序。
  */
  text-shadow: none !important;
  line-height: 1.25 !important;               /* 收紧大标题行距，防止多行时散架 */
}


/* ⚡ 核心修复点：将多列内部故事大段落的断词路径彻底洗净，回归纯正英文排版 ⚡ */
.multicolumn-list__item .rte, .multicolumn-list__item p {
  text-align: left !important; 
  color: #E5E7EB !important; 
  font-size: 1.35rem !important; 
  line-height: 1.7 !important; 
  margin-bottom: 2rem !important;
  width: 100% !important; 
  max-width: 86% !important; 
  margin-left: auto !important; 
  margin-right: auto !important; 
  
  /* 
     1. 彻底抹除 break-all。
     2. 用 normal 强制网页排版引擎必须在英文单词的“空格间隙”处寻找换行点。
  */
  word-break: normal !important;
  /* 仅在极端极长、没有任何空格的畸形单串字符（如特殊长标签）塞不下的个别情况下允许破格裁剪，普通单词全词退行 */
  overflow-wrap: break-word !important;
  word-wrap: break-word !important;
  /* 阻断部分手机浏览器自作聪明加小横线并把单词劈成两半的 hyphens 漏洞 */
  -webkit-hyphens: none !important;
  -ms-hyphens: none !important;
  hyphens: none !important;
}
.multicolumn-list__item a.link, 
.multicolumn-list__item .button {
  position: absolute !important;         /* 100% 维持你原厂的救命绝对定位对齐骨架 */
  bottom: 0 !important; 
  left: 50% !important; 
  transform: translateX(-50%) !important; /* 确保链接在任何分辨率下都绝对横向居中 */
  
  color: #E5E7EB !important;             /* 暴力去绿！强制洗成冷冽纯白 */
  font-family: 'KronivFutura', sans-serif !important; /* 100% 锁定品牌专属特制字体 */
  font-weight: bold !important;
  text-transform: uppercase !important;   /* 维持全大写的大牌块状规整风 */
  letter-spacing: 0.15rem !important; 
  text-text-decoration: none !important;
  padding-bottom: 6px !important;        /* 稍微拉开一点与线条的衬垫距离，更有高街精细感 */
  
  /* 斩断页游感：彻底剔除原先廉价粗糙的绿色虚线（dashed），换成大牌通用的纯白高精细实线 */
  border-bottom: 1px solid #E5E7EB !important; 
  
  white-space: nowrap !important;
  transition: all 0.2s ease-in-out !important; 
}


.multicolumn-list__item a.link:hover { 
  color: #E5E7EB !important; 
  border-bottom: 1.5px solid #E5E7EB !important; 
}



/* ==========================================================================
   【重构优化】#262A30 工业灰主图与 #0D0D0D 炭黑网页无缝融合调校
   ========================================================================== */

/* 1. 全站图片光影调校：针对矿石灰底色微调对比，将戒指的金属拉丝与槽线逼出来 */
.product__media-item img,
.card__media img {
    filter: brightness(0.96) contrast(1.08) !important;
    -webkit-filter: brightness(0.96) contrast(1.08) !important;
}

/* 2. 详情页大图：暗角边缘改用网页炭黑底色(#0D0D0D)，让#262A30图片完美消融 */
.product__media-item .product__media {
    background-color: #0D0D0D !important;
    position: relative !important;
    overflow: hidden !important;
}
.product__media-item .product__media::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 3 !important;
    pointer-events: none !important;
    /* 🛠️ 核心修改：将遮罩从中心向外平滑推开，最终以 13,13,13 (#0D0D0D) 咬死边缘，抹除色差边框 */
    background: radial-gradient(ellipse at 50% 50%, rgba(13,13,13,0) 30%, rgba(13,13,13,0.35) 60%, rgba(13,13,13,0.8) 88%, rgba(13,13,13,1) 98%) !important;
}

/* 3. 列表页小图：咬住 Dawn 产品内壳容器，圆角遮罩同步吞噬图片边缘 */
.card-wrapper .card--card, 
.card-wrapper .card--standard .card__inner {
    background-color: #0D0D0D !important;
    position: relative !important;
    overflow: hidden !important;
}
.card-wrapper .card--card::after, 
.card-wrapper .card--standard .card__inner::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 3 !important;
    pointer-events: none !important;
    /* 🛠️ 核心修改：圆形暗角终点站锁定 #0D0D0D 炭黑，消除列表页灰紫色图片的任何断层感 */
    background: radial-gradient(circle at center, rgba(13,13,13,0) 30%, rgba(13,13,13,0.35) 60%, rgba(13,13,13,0.8) 88%, rgba(13,13,13,1) 98%) !important;
}

/* 4. 强制提升 SALE 促销标签的层级，让其无条件置顶浮现 */
.card__badge,
.card__information .badge,
.badge--onsale,
.product__media-item .badge {
    z-index: 5 !important;
    position: relative !important;
}

/* 5. 详情页商品标题微调 */
.product__title h1 {
    font-size: 1.8rem !important; 
    letter-spacing: 0.15rem !important; 
    line-height: 1.4 !important; 
    text-transform: uppercase !important; 
}

/* 6. 精准修正手机端侧边栏每一行文字的绝对左对齐 */
.menu-drawer__menu-item > * {
  margin: 0 !important;
  text-align: left !important;
  justify-content: flex-start !important;
}
.menu-drawer__menu-item {
  justify-content: flex-start !important;
  padding-left: 3rem !important; 
}



/* ==========================================================================
   1. KRONIV 全局绝杀：强制全站文本按完整英文单词自然断句（已完美隔离轮播轴）
   ========================================================================== */
*, 
html, body, p, span, a, li, div, h1, h2, h3, h4, h5, h6,
.rte, .rte *, [class*="rte"], [class*="rte"] * {
  word-break: normal !important;
  overflow-wrap: break-word !important;
  -webkit-hyphens: none !important;
  -ms-hyphens: none !important;
  hyphens: none !important;
}

/* 深度精准打击：专门针对 Shopify Dawn 的普通富文本深层嵌套进行权重压制 */
.rich-text__blocks,
.rich-text__blocks *,
.product__description,
.product__description * {
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

/* ==========================================================================
   ⚡ 核心安全隔离隔离层：对多列轮播轨道实行“免死金牌保护”，禁止任何断句干预宽度 ⚡
   ========================================================================== */
.multicolumn .grid,
.multicolumn ul.multicolumn-list,
.multicolumn slider-component .grid,
.multicolumn li.grid__item,
.multicolumn li.multicolumn-list__item,
.multicolumn .grid__item,
.multicolumn .grid__item * {
  /* 
     强制将多列内部所有元素的排版流模式还原，
     不准触动 overflow-wrap，不准让排版引擎暗中改变 33.3333% 的物理大小！
  */
  overflow-wrap: normal !important;
  word-wrap: normal !important;
}


/* ========================================================
   2. KRONIV 专属：全站多列（3列通用-无缝无黑屏暗黑终极版）轮播轴 38.0
   ======================================================== */

@media screen and (max-width: 749px) {
  /* 恢复安全的视口裁剪，并强制提升 3D 渲染上下文 */
  .multicolumn slider-component {
    display: block !important;
    overflow: hidden !important; 
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    transform: translateZ(0) !important;
    perspective: 1000px !important;
    -webkit-perspective: 1000px !important;
    background-color: #0D0D0D !important; /* 外层全黑兜底 */
  }
  
  /* 刚性锁死底层直线轨道 */
  .multicolumn .grid,
  .multicolumn ul.multicolumn-list,
  .multicolumn slider-component .grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow: visible !important;
    
    scroll-snap-type: none !important;
    scroll-behavior: auto !important;
    -webkit-overflow-scrolling: auto !important;
    touch-action: pan-y !important;
    
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
    
    /* 严格维持 3 列空间占位 */
    width: 300% !important;
    min-width: 300% !important;
    max-width: 300% !important;
    
    /* 总长30秒：每页停留8秒，切换2秒 */
    animation: kroniv_perfect_viewport_swipe 30s cubic-bezier(0.45, 0, 0.15, 1) infinite !important;
    
    /* 强制轨道不被任何外部动画隐藏 */
    opacity: 1 !important;
    visibility: visible !important;
    transform-style: preserve-3d !important;
    background-color: #0D0D0D !important; /* 轨道全黑兜底 */
  }

  /* 物理锁死三列并 100% 强制暴露可见性 */
  .multicolumn li.grid__item,
  .multicolumn li.multicolumn-list__item,
  .multicolumn .grid__item {
    flex: 0 0 33.3333% !important;
    width: 33.3333% !important;
    min-width: 33.3333% !important;
    max-width: 33.3333% !important;
    box-sizing: border-box !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    margin: 0 !important;
    height: auto !important;
    
    /* 彻底干掉原生的隐藏类和淡入延迟，强制 100% 不透明 */
    opacity: 1 !important;
    visibility: visible !important;
    
    /* 强制欺骗浏览器：让第3列在开局就完成 3D 渲染硬编码 */
    transform: translate3d(0, 0, 0) !important;
    will-change: transform !important;
    backface-visibility: visible !important;
    -webkit-backface-visibility: visible !important;
    
    /* 【暗黑修正】卡片底层彻底上色纯黑，融于背景，消除系统默认黑块和闪烁感 */
    background: #0D0D0D !important; 
    background-color: #0D0D0D !important;
  }

  /* 规范卡片内部与图片強制常驻 */
  .multicolumn .multicolumn-card__image-wrapper,
  .multicolumn .multicolumn-card {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    min-height: 250px !important; 
    position: relative !important; 
    opacity: 1 !important;
    visibility: visible !important;
    background-color: #0D0D0D !important; /* 内层全黑兜底 */
  }
  
  .multicolumn .multicolumn-card__image-wrapper img,
  .multicolumn .multicolumn-card img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
    
    /* 击穿任何延迟加载、全时段强制显示 */
    opacity: 1 !important;
    display: block !important;
    visibility: visible !important;
    content-visibility: visible !important; 
  }

  /* 
     ⚡ 30秒时序修正案（每页停留8秒，切换2秒） ⚡
  */
  @keyframes kroniv_perfect_viewport_swipe {
    0%, 26.6%     { transform: translate3d(0, 0, 0); }                  
    33.3%, 60%    { transform: translate3d(-33.3333%, 0, 0); }          
    66.6%, 93.3%  { transform: translate3d(-66.6666%, 0, 0); }          
    100%          { transform: translate3d(0, 0, 0); }                  
  }

  /* 隐藏原生的多余分页指示器 */
  .multicolumn .slider-buttons,
  .multicolumn .slider-counter,
  .multicolumn .slider-button,
  .multicolumn .slider-indicators {
    display: none !important;
  }
  .multicolumn .title { font-size: 2.2rem !important; }
  .multicolumn-list__item h3 { font-size: 1.6rem !important; }
  .multicolumn-list__item p { font-size: 1.2rem !important; line-height: 1.6 !important; }

  /* ==========================================================================
   KRONIV EXCLUSIVE: MULTICOLUMN BUTTON BLACK-WHITE-GRAY REBOOT
   ========================================================================== */

/* 1. 强行锁定多列卡片按钮：洗净荧光绿，融入全站低调暗灰秩序 */
.multicolumn-list__item a.link,
.multicolumn-list__item .button {
  display: inline-flex !important; 
  align-items: center !important;
  justify-content: center !important;
  margin: 1.5rem auto 1rem auto !important; 
  border: 1px solid #444444 !important;      /* 暴力去绿！换成低调内敛的暗灰色细边框 */
  background-color: transparent !important;   /* 静止时保持全透明背景 */
  padding: 0.6rem 1.4rem !important; 
  border-radius: 0px !important;              /* 死锁 100% 硬朗直角几何体 */
  color: #888888 !important;                 /* 暴力去绿！文字转换为质感中浅灰色，与边框完美呼应 */
  font-family: 'KronivFutura', sans-serif !important; /* 锁定品牌特制 KronivFutura */
  font-weight: bold !important;
  text-transform: uppercase !important;       /* 维持全大写的大牌块状规整风 */
  letter-spacing: 0.12rem !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  font-size: 1.15rem !important;
  transition: all 0.25s ease-in-out !important; /* 增加高级平滑的悬停动效 */
}

/* 2. 注入高街先锋特有的【全白填充+反转黑字】致命悬停特效 */
.multicolumn-list__item a.link:hover,
.multicolumn-list__item .button:hover {
  background-color: #E5E7EB !important;       /* 悬停时：瞬间通电蜕变为纯白填充 */
  color: #0D0D0D !important;                  /* 文字强行反转为纯黑色，高反差撞色极其凌厉 */
  border-color: #E5E7EB !important;            /* 边框同步反转为纯白 */
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important; /* 微弱的大牌下沉阴影，绝不漏绿 */
}

}

/* =========================================================================
   KRONIV LAB: IMAGE HARDWARE RADIANCE UPGRADE (NO MORE MULTIPLY)
   ========================================================================= */
.multicolumn-list__item .multicolumn-card__image-wrapper::after,
.multicolumn-card .media::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    /* 核心修改：将死黑遮罩彻底拿掉，改为极微弱的 5% 暗黑滤网，为顶部白色导航留出安全反差 */
    background: rgba(0, 0, 0, 0.05) !important;
    pointer-events: none !important;
    z-index: 2 !important;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.multicolumn-list__item .multicolumn-card__image-wrapper img,
.multicolumn-card img {
    /* 核心修改：去掉流氓正片叠底，拉高亮度至 1.12，高光瞬间通透，打铁火花细节完美吐出 */
    filter: grayscale(100%) contrast(1.18) brightness(1.12) !important;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* --- MOUSE HOVER STATE: FULL INDUSTRIAL RESURRECTION --- */
.multicolumn-list__item:hover .multicolumn-card__image-wrapper::after,
.multicolumn-custom-card:hover .media::after {
    background: rgba(0, 0, 0, 0) !important;
}

.multicolumn-list__item:hover .multicolumn-card__image-wrapper img,
.multicolumn-card:hover img {
    /* 悬停动作：一秒褪去冰冷黑白，100% 恢复真实重工业硬钢色彩与锐利高光 */
    filter: grayscale(0%) contrast(1) brightness(1) !important;
}




/* ==========================================================================
   KRONIV 专属：列表页（Card）价格纯化补丁（干掉千篇一律的红色原价，斩断廉价感）
   ========================================================================== */

/* 1. 彻底隐藏掉列表页所有产品重复穿帮的红色划线原价，消除清仓大甩卖的廉价感 */
.card-information .price .price__sale s,
.card-information .price--on-sale .price-item--regular,
.grid__item .price__container .price-item--regular {
  display: none !important;
}

/* 2. 规范现价（$392.11）的显示，让它在黑底上干净利落，符合代码终端的高级感 */
.card-information .price-item--sale {
  color: #E5E7EB !important;
  font-family: 'KronivFutura', sans-serif !important;
  font-weight: bold !important;
  font-size: 1.5rem !important;
}


/* ========================================================
   KRONIV 专属：页脚【极道破限 + 强制全员纯白 + 极密双列】40.0
   ======================================================== */

/* 【王炸强刷】只要是在最底部版权区域内的任何文字、链接、图标，全部死锁纯白，干掉绿光 */
[class*="copyright"], 
[class*="copyright"] *, 
.footer__copyright, 
.footer__copyright *,
.footer__localization-panel * {
  color: #E5E7EB !important;
  fill: #E5E7EB !important; /* 预防部分主题使用绿色SVG图标 */
  text-shadow: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
}
/* 统一控制页脚自定义菜单：文字纯白 */
.footer-block__details-content .link {
  font-family: 'KronivFutura', sans-serif !important; /* 锁定品牌专属特制字体 */
  color: #E5E7EB !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  letter-spacing: 0.05rem !important;                /* 微拉字距，呈现精致的版式感 */
  transition: color 0.2s ease-in-out !important;      /* 注入平滑顺畅的过渡动效 */
}

/* ⚡ 悬停效果：彻底绝育绿色，优雅转换为高级中灰色淡化反馈 */
.footer-block__details-content .link:hover {
  color: #888888 !important;                          /* 悬停微变高级中灰，与全站黑白灰战略完全闭环 */
}



/* 手机移动端 (749px及以下)：直接从根部打破 Dawn 框架枷锁 */
@media screen and (max-width: 749px) {
  
  /* 刚性击碎外层所有可能限制宽度的 div 容器 */
  body .footer-block.grid__item,
  body .footer__blocks-wrapper .footer-block,
  body .footer-block.footer-block--menu {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    flex: 0 0 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 重新强制激活双列舒展网格 */
  body ul.footer-block__details-content.list-unstyled {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important; 
    gap: 0.6rem 2rem !important; /* 极窄行距 + 宽敞列距 */
    justify-content: center !important;
    text-align: center !important;
    margin: 1.0rem auto 0.6rem auto !important; 
    padding: 0 2rem !important; /* 给手机两侧留出安全的呼吸边距 */
    max-width: 100% !important;
    width: 100% !important;
  }

  body .footer-block__details-content .link {
    display: block !important;
    padding: 0 !important;
    font-size: 0.95rem !important; 
    white-space: nowrap !important; 
  }
  
  /* 第7个元素（CLASSIFIED_BOUNTY）完美居中垫底 */
  body .footer-block__details-content.list-unstyled li:last-child {
    grid-column: span 2 !important;
    text-align: center !important;
    margin-top: 0.2rem !important;
  }

  /* 压榨底部间距 */
  .footer__content-bottom {
    padding-top: 1.0rem !important;
    padding-bottom: 1.0rem !important;
    margin-top: 0 !important;
  }
}

/* PC桌面端 (750px及以上) */
@media screen and (min-width: 750px) {
  .footer__content-top { padding-bottom: 1.5rem !important; }
  .footer-block__details-content.list-unstyled {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 2.5rem !important; 
    margin-top: 1.5rem !important;
  }
  .footer-block__details-content .link {
    padding: 0 !important;
    display: inline-block !important;
    font-size: 1.1rem !important;
  }
}

<!-- 1. 结构层保持纯净 -->
<div class="kroniv-clocks-story">
  Every digital maze has a virus; every neon-soaked alley demands a rogue hunter.
  <br><br>
  The PROJECT "VOYAGE MAZE" variant ring isn't just an accessory—it's an encrypted relic of ancient defiance reloaded for the cyber age.
</div>

<style>
<style>
<style>

:root {
  --font-body-family: 'KronivFutura', sans-serif !important;
  --font-heading-family: 'KronivFutura', sans-serif !important;
}

body, p, span, a, h1, h2, h3, h4, h5, h6, .button, .header__menu-item {
  font-family: 'KronivFutura', sans-serif !important;
}

/* 1. 强制覆盖产品页专用的 CSS 变量 */
.product,
.product-single,
.product__title,
.price,
.product-form,
.product__description {
  --font-heading-family: 'KronivFutura', sans-serif !important;
  --font-body-family: 'KronivFutura', sans-serif !important;
}

/* 2. 强制定向到产品页的所有核心文本元素 */
.product__title, 
.product__title h1,
.price .price-item,
.product-form__input,
.product-form__input label,
.select__select,
.quantity__input,
.product__description,
.product__description p,
.product__description span,
.product__description li,
.share-button__button {
  font-family: 'KronivFutura', sans-serif !important;
}

/* 3. 修复富文本描述中可能自带的内联样式干扰 */
.product__description [style*="font-family"] {
  font-family: 'KronivFutura', sans-serif !important;
}
/* 1. 强制击穿产品页折叠面板（Collapsible row）和描述的字体 */
.product__accordion,
.accordion,
.accordion__content,
.rte,
.rte p,
.rte span,
.rte ul,
.rte li {
  font-family: 'KronivFutura', sans-serif !important;
  --font-body-family: 'KronivFutura', sans-serif !important;
}

/* 2. 彻底清洗富文本编辑器（RTE）可能带入的任何第三方样式 */
.product .rte *, 
.product__accordion * {
  font-family: 'KronivFutura', sans-serif !important;
}
/* 强制全站所有角落统一为 Futura 字体 */
*, html, body, p, span, div, h1, h2, h3, h4, h5, h6, input, select, button, .rte, .rte * {
  font-family: 'KronivFutura', sans-serif !important;
}

/************************************************
 * 1. 全站字体终极闭环（统一为 Futura）
 ************************************************/
/* 强力穿透全局核心标签、Liquid区块及自定义手写按钮 */
*, html, body, p, span, div, h1, h2, h3, h4, h5, h6, 
input, select, button, .rte, .rte *, .accordion, .accordion *,
.button, .btn, input[type="submit"], input[type="button"], 
.product-form__submit, [class*="button"],
.footer, .footer *, .field__input, .localization-form, .inline-list {
  font-family: 'KronivFutura', sans-serif !important;
}

/* 强力穿透第三方评论及应用区块 (如 Judge.me, Loox 等) */
.jdgm-widget, .jdgm-widget *, .jdgm-write-rev-btn, .jdgm-rev-mgmt,
.spr-container, .spr-container *, .spr-review, .spr-summary,
#shopify-product-reviews, [id^="shopify-block-"] *, 
.shopify-app-block, .shopify-app-block * {
  font-family: 'KronivFutura', sans-serif !important;
}



/************************************************
 * 2. 终极净化：全站文字/链接 100% 变白
 ************************************************/
*, html, body, p, span, div, h1, h2, h3, h4, h5, h6, 
a, a *, .rte, .rte *, .accordion, .accordion *, 
.field__input, .price, .price-item,
.jdgm-widget *, .spr-container *, .shopify-app-block * {
  color: #E5E7EB !important;
}

/************************************************
 * 3. 斩断页游感：按钮「深灰色」重构
 ************************************************/
/* 强制所有行动按钮（包含购买、提交、写评论按钮）转为：高质感深灰色 */
button, .button, .btn, .product-form__submit, input[type="submit"], .jdgm-write-rev-btn {
  background-color: #1A1A1A !important; /* 质感深灰底色 */
  color: #E5E7EB !important;            /* 纯白文字 */
  border: 1px solid #333333 !important;   /* 低调暗灰边框 */
  box-shadow: none !important;
  text-transform: uppercase;            /* 英文强制大写，更具块状高级感 */
  transition: all 0.2s ease-in-out;    /* 增加平滑过渡动画 */
}

/* 按钮悬停（Hover）效果：微微调亮，增加交互反馈 */
button:hover, .button:hover, .btn:hover, .product-form__submit:hover, input[type="submit"]:hover {
  background-color: #333333 !important; /* 中灰色 */
  border-color: #555555 !important;
  color: #E5E7EB !important;
}

/************************************************
 * 4. 线条与细节黑白灰闭环
 ************************************************/
/* 强制全站所有线条、边框为暗灰线，杜绝任何绿线漏出 */
*, *:before, *:after, .variant-input-wrapper, .select__select, .field__input, .accordion {
  border-color: #0D0D0D !important; 
}

/* 评论区星星、图标等如果原本是荧光绿，强制转为纯白 */
.jdgm-star, .spr-starratings, .spr-icon, [class*="star"] {
  color: #E5E7EB !important;
}

/************************************************
 * 5. 专项攻克：产品列表页卡片（标题、价格、标签）
 ************************************************/
/* 强行扭转产品列表页卡片内所有元素的字体 */
.card,
.card *,
.card__heading,
.card__heading a,
.card__information,
.card__information *,
.price,
.price *,
.price-item,
.grid__item .card__heading {
  font-family: 'KronivFutura', sans-serif !important;
}

/* 拦截产品预览区域可能存在的其他文本标签 */
.card-wrapper,
.card-information,
.quick-add {
  font-family: 'KronivFutura', sans-serif !important;
}


/************************************************
 * 6. 终极根除：彻底洗净 REQUISITION 的绿色背景与残留阴影
 ************************************************/
/* 
 * 1. 深度定位到产品卡片下方第一行所有可能的标签元素
 * 2. 强行剥离背板色、发光阴影和绿色滤镜
 */
.card__information > *:first-child,
.card__information span,
.card__information .badge,
.card-wrapper .badge,
[class*="requisition"],
.card__information div:first-of-type {
  /* 基础去色：强制变高级浅灰色（若想用纯白，可把 #888888 改为 #E5E7EB） */
  color: #888888 !important; 
  
  /* 核心去残留：彻底斩断绿色的背景、阴影和边框发光 */
  background: none !important;
  background-color: transparent !important;
  text-shadow: none !important;
  box-shadow: none !important;
  border: none !important;
  outline: none !important;
  filter: none !important;

  /* 样式升华：拉开英文字间距，微调大小，更有高街品牌感 */
  font-size: 1.1rem !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
}
/************************************************
 * 7. 全局两行以上文本：1.6 倍黄金行距
 ************************************************/
/* 
 * 思路：确保任何发生换行的长句之间拥有完美的空白，
 * 彻底解决黑底白字高反差带来的视觉刺眼与压抑感。
 */
*, 
html, 
body, 
p, 
span, 
div, 
li, 
a,
.rte, 
.rte *, 
.accordion__content, 
.accordion__content *,
.product__description, 
.product__description *,
.card__information,
.card__information *,
.shopify-app-block,
.shopify-app-block *,
.jdgm-widget *,
.spr-container * {
  line-height: 1.6 !important; /* 精准调校为 1.6 倍行距，行与行之间不黏连 */
  letter-spacing: 0.03em !important; /* 给予 Futura 字族微小的字母间距 */
}


/************************************************
 * 8. 段落断层优化：段距必须明显宽于行距（核心思路）
 ************************************************/
/* 
 * 思路：在段落与段落之间撑开 2.4rem（相当于字号 2.4 倍）的巨大空白。
 * 让大段的文字、故事、折叠行内容在换段时产生强烈的“视觉呼吸点”，
 * 彻底消灭廉价页游的堆砌感，营造国际大牌的松弛视觉。
 */
p, 
.rte p, 
.product__description p, 
.accordion__content p,
.rte ul,
.rte ol {
  margin-top: 0 !important;
  margin-bottom: 2.4rem !important; /* 核心：制造宽阔的段落间空白断层 */
}

/* 清除段落内最后一个元素的下边距，防止撑坏底部的整体组件边距 */
p:last-child, .rte p:last-child, .product__description p:last-child, .accordion__content p:last-child {
  margin-bottom: 0 !important;
}


/************************************************
 * 9. 视觉反差：保持大标题的紧凑凝聚力
 * **********************************************/
/* 思路：标题如果太稀疏会散架，单独收紧，与正文的松弛形成一紧一松的强烈对比 */
h1, h2, h3, h4, h5, h6, 
.product__title, .card__heading, .card__heading a {
  line-height: 1.25 !important;
  letter-spacing: 0.05em !important;
  margin-top: 0 !important;
  margin-bottom: 1.4rem !important; /* 标题与下方正文的距离稍微收紧 */
}

/* ==========================================================================
   KRONIV 专属：首页主图横幅（Banner）按钮暗黑烟熏毛玻璃重塑补丁
   ========================================================================== */

/* 1. 精准锁定横幅图片上的核心行动按钮（通杀 Dawn 主题横幅按钮类） */
.banner__buttons a.button,
.banner__buttons .button,
.image-with-text__content a.button,
.banner__content .button {
  /* 
     【高级暗黑烟熏毛玻璃核心公式】
     1. rgba(15, 15, 15, 0.5) 注入一层极具质感的暗夜深灰半透明基底，洗净一切绿色杂质。
     2. backdrop-filter 维持 16px 雾面重度毛玻璃模糊，让主图背景优雅透出。
  */
  background: rgba(15, 15, 15, 0.5) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  backdrop-filter: blur(16px) !important;
  
  /* 剥离荧光绿！换成清爽低调的暗灰实线，移除圆角，锁定纯硬核几何体 */
  border: 1.5px solid #444444 !important;
  border-radius: 0px !important;
  
  /* 规范字体为品牌专属 KronivFutura，文字使用绝对纯白 */
  font-family: 'KronivFutura', sans-serif !important;
  font-weight: bold !important;
  color: #E5E7EB !important;
  letter-spacing: 0.15rem !important;
  text-transform: uppercase !important;
  
  /* 斩断绿色外发光！换成内敛的深邃暗影，制造极具分量感的内嵌悬浮效果 */
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4), inset 0 0 1px rgba(255, 255, 255, 0.1) !important;
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

/* 2. 鼠标悬停/手指触碰（Hover）高级动态反馈 */
.banner__buttons a.button:hover,
.banner__buttons .button:hover,
.banner__content .button:hover {
  /* 悬停时：按钮底色变为纯白（100%不透明），与全站其他深灰按钮的悬停逻辑呼应，但在大图上形成极强的视觉对比 */
  background: #E5E7EB !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  
  /* 文字和边框反转为极致的纯深黑 */
  color: #0D0D0D !important;
  border-color: #E5E7EB !important;
  
  /* 剥离任何刺眼的电光发光，改为干净的大牌高光阴影 */
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6) !important;
}

/* ==========================================================================
   KRONIV 最终绝杀：产品多属性尺寸块选中状态黑白灰高级重塑补丁
   ========================================================================== */

/* 1. 强行锁定：当变体块被选中时，全面蜕变为【纯白底 + 纯黑字】的高反差极简状态 */
.product-form__input input[type="radio"]:checked + label {
  background-color: #E5E7EB !important; /* 暴力去绿！替换为无瑕纯白底 */
  color: #0D0D0D !important;            /* 文字反转为纯黑，形成最纯正的时尚大牌高反差 */
  border-color: #E5E7EB !important;      /* 边框同步变为白色 */
  font-weight: bold !important;
  opacity: 1 !important;
}

/* 2. ⚡ 安全避让核心隔离：如果该标签属于数量选择器，瞬间将其所有属性强制初始化复原 ⚡ */
.quantity label,
.quantity input,
.product-form__quantity,
.product-form__quantity *,
[class*="quantity"] *,
.quantity__input {
  background-color: transparent !important;
  color: #E5E7EB !important;
  border-color: #333333 !important; /* 数量选择器保持高级暗灰边框 */
}

/* 3. 悬停微效：未选中时尺寸块滑过的视觉反馈（剔除绿色，改为中灰提亮） */
.product-form__input:not(.quantity):not(.product-form__quantity) label:hover {
  border-color: #666666 !important;     /* 滑过时边框微微提亮，暗示可点击 */
  color: #E5E7EB !important;            /* 文字保持纯白 */
  background-color: #1A1A1A !important; /* 极淡的暗灰悬停背景 */
}

/* 4. 规整未选中状态：确保未选中的尺寸块外观规整（剔除原本突兀的白线，融入整体暗黑秩序） */
.product-form__input:not(.quantity):not(.product-form__quantity) label {
  border: 1px solid #333333 !important; /* 未选中时使用暗灰线，让页面整体视觉向下沉稳 */
  background-color: transparent !important;
  color: #E5E7EB !important;
  border-radius: 0px !important;         /* 刚性死锁，100% 直角，摒弃任何圆角 */
  text-transform: uppercase !important;  /* 英文选项强制大写 */
  padding: 1rem 2rem !important;         /* 适当微调块内衬垫，使其更有分量感 */
  transition: all 0.2s ease-in-out !important;
}

/* ==========================================================================
   KRONIV EXCLUSIVE: SAFE COLOR-ONLY OVERRIDE (100% BLACK-WHITE-GRAY)
   ========================================================================== */

/* 1. 【左侧汉堡菜单】：纯色覆盖，洗净荧光绿，剥离发光滤镜 */
.header__icon--menu .icon-hamburger,
.header__icon--menu .icon-hamburger path {
    stroke: #E5E7EB !important; /* 强行洗成绝对纯白 */
    filter: none !important;    /* 斩断绿色发光，回归清爽线条 */
}

/* 2. 【右侧图标群】：全站变白（包含搜索、小人账户、购物车图标，100%匹配原厂排版） */
.header__icons .header__icon .icon,
.header__icons .header__icon .icon path,
#cart-icon-bubble,
#cart-icon-bubble path,
.icon-cart-toggle,
.icon-cart-toggle path {
    fill: #E5E7EB !important;   /* 填充色变白 */
    stroke: #E5E7EB !important; /* 边框色变白 */
    color: #E5E7EB !important;
}

/* 3. 【图标微发光】：移除所有突兀的绿色发光滤镜，还原本质的极简质感 */
.header__icons .header__icon,
.header__icon--menu {
    filter: none !important; /* 彻底移除 drop-shadow 绿光 */
}

/* 4. 【购物袋角标】：反转为大牌标志性的「白底黑字」高反差微缩徽章 */
.cart-count-bubble {
    background-color: #E5E7EB !important; /* 蜕变为纯白背板 */
    color: #0D0D0D !important;            /* 数字反转为纯黑 */
    border: 1px solid #E5E7EB !important;  /* 边框同步变白，彻底绝育绿色 */
    font-weight: bold !important;
}

/* ==========================================================================
   KRONIV 最终补丁：首页轮播图（Slideshow）大标题高街纯白重塑
   ========================================================================== */
.template-page .slideshow [class*="banner__box"] .banner__heading,
.template-page .slideshow [class*="banner__box"] h2 {
  text-align: center !important;
  color: #E5E7EB !important;                   /* 暴力去绿！强制洗成极致纯白 */
  font-family: 'KronivFutura' !important;       /* 锁定品牌特制 KronivFutura */
  font-size: 2.3rem !important; 
  
  /* 细节升华：大幅加宽字间距，呈现国际一线先锋厂牌特有的稀疏透气感 */
  letter-spacing: 0.2rem !important; 
  text-transform: uppercase !important;
  margin-bottom: 2rem !important;
  
  /* 
     斩断页游感：彻底剔除之前丑陋突兀的5层黑影残留。
     换成国际大牌通用的“现代高精薄雾阴影”，在暗黑底色中完全隐形，
     若背景切换到复杂或浅色图片时，能让白色刀锋字体利落浮现，绝不抢戏。
  */
  text-shadow: 0 4px 15px rgba(0, 0, 0, 0.4) !important; 
  line-height: 1.25 !important;                /* 保持标题特有的块状凝聚力 */
}

/* ==========================================================================
   KRONIV 专属：LOGO 极致纯白重塑（洗净绿色滤镜，斩断边缘发光）
   ========================================================================== */

.header__heading-logo,
.header__heading-inline_image,
[class*="header"] .header__heading-logo-wrapper img,
[class*="header__heading"] img {
  /* 
     【极致纯白核心公式】
     1. brightness(0) invert(1) 能够强行将任何复杂的彩色 LOGO 转化为绝对纯净的纯白色。
     2. 彻底剥离原代码中突兀的荧光绿色彩矩阵和绿光阴影（drop-shadow），还原本质的高级感。
  */
  filter: brightness(0) invert(1) !important;
  
  /* 2. 彻底抹除由于旧代码错误导致的任何可能的背景色残留 */
  background: transparent !important;
  background-color: transparent !important;
  
  transition: opacity 0.3s ease !important; /* 悬停过渡改为更高级的透明度变化 */
}

/* 鼠标悬停时的视觉交互：模仿大牌先锋网站，悬停时产生优雅的微弱呼吸淡化效果 */
.header__heading-logo:hover,
[class*="header__heading"] img:hover {
  filter: brightness(0) invert(1) !important; /* 保持纯白底色不变 */
  opacity: 0.75 !important;                     /* 悬停时微微变淡，极具优雅的动态反馈 */
}

/* ==========================================================================
   KRONIV 最终补丁：多列区块（Multicolumn）卡片小标题高街纯白重塑
   ========================================================================== */
.multicolumn-list__item .inline-richtext,
.multicolumn-list__item h3 {
  text-align: center !important;
  color: #E5E7EB !important;                   /* 暴力去绿！强制洗成纯白色 */
  font-size: 1.8rem !important; 
  
  /* 细节升华：字间距微微加宽，释放 KronivFutura 字体的块状高级感 */
  letter-spacing: 0.15rem !important; 
  text-transform: uppercase !important;
  margin-top: 2rem !important;
  margin-bottom: 1.5rem !important;
  
  /* 
     斩断页游感：彻底剔除之前丑陋突兀的 4 层黑影残留。
     换成无瑕、清爽的利落裸字，回归正经独立站的极致扁平秩序。
  */
  text-shadow: none !important;
  
  /* 匹配标题行距：确保折行时保持完美的块状凝聚力 */
  line-height: 1.25 !important;
}

/* ==========================================================================
   KRONIV 专属：移动端菜单/表单/标签 终极黑白灰净化补丁
   ========================================================================== */

/* 1. 【移动端抽屉菜单】：强行规范菜单文字，洗净荧光绿与霓虹发光 */
.menu-drawer__menu-item {
  font-family: 'KronivFutura', sans-serif !important; 
  font-weight: 700 !important;                      /* 稍微收紧至 700 粗体，避免 900 过度笨重 */
  color: #E5E7EB !important;                        /* 暴力去绿！强制洗成极致纯白 */
  text-shadow: none !important;                     /* 彻底斩断霓虹外发光 */
  padding: 18px 0 !important;                       
  display: block !important;
  font-size: 16px !important;
  letter-spacing: 0.1rem !important;                /* 微调字间距，呼应整体品牌感 */
}

/* 抽屉底部接入终端文本去绿 */
.menu-drawer__utility-links a,
.menu-drawer__utility-links span {
  font-size: 0 !important;
}
.menu-drawer__utility-links a::after {
  content: "ACCESS TERMINAL" !important;
  font-family: 'KronivFutura', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #E5E7EB !important;                        /* 强制清洗为纯白 */
  text-shadow: none !important;                     /* 移除发光 */
  letter-spacing: 1px !important;
}
/* 抽屉底部 SVG 图标线条去绿变白 */
.menu-drawer__utility-links svg path {
  stroke: #E5E7EB !important;                       /* 变更为利落的纯白实线 */
  stroke-width: 1.5px !important;
}

/* 2. 【卡片折扣标签】：从荧光绿洗练为低调清爽的高级中浅灰色 */
.card__badge .badge {
  background: transparent !important;
  color: #888888 !important;                        /* 转化为中浅灰，与下方纯白产品名拉开优雅档次 */
  border: none !important;
  font-family: 'KronivFutura', sans-serif !important;
  font-weight: 700 !important;
  text-shadow: none !important;                     /* 彻底剥离绿光 */
  padding: 0 !important;
  box-shadow: none !important;
  letter-spacing: 0.1em !important;
}

/* 3. 【价格划线】：斩断破坏全站黑白灰秩序的刺眼红字 */
.price .price-item.price-item--regular {
  color: #555555 !important;                        /* 转化为低调沉稳的暗灰色 */
  text-decoration: line-through !important;          /* 维持标准的折扣划线逻辑 */
}

/* 4. 【页脚版权与多列卡片细节】 */
.footer__copyright,
.footer__copyright a,
.footer__copyright span {
  color: #E5E7EB !important;
  opacity: 0.6 !important;                          /* 页脚版权加入柔和透明度，使其向下沉淀 */
}
.multicolumn-card__info {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.multicolumn-card__user-text p:empty,
.multicolumn-card__info:has(a:empty) {
  display: none !important;
}
.multicolumn-list__item .multicolumn-card__info {
  padding: 15px 10px !important;
  margin: 0 !important;
}
.multicolumn-card__info .rte {
  margin-bottom: 5px !important;
}
.multicolumn-card__info>a {
  margin-top: 5px !important;
}

/* 5. 【联系我们表单】：彻底绝育绿色线条与高亮，融入整体暗黑秩序 */
.contact .field__input {
  border: 1px solid #333333 !important;             /* 默认状态下使用低调的暗灰色细边框 */
  background: transparent !important;
  font-family: 'KronivFutura', sans-serif !important;
  color: #E5E7EB !important;                        /* 输入文本洗成纯白色 */
  border-radius: 0px !important;                     /* 死锁 100% 刚性直角 */
  transition: all 0.2s ease-in-out !important;
}
.contact .field__input:focus {
  border-color: #E5E7EB !important;                 /* 焦点选中时：变为干净高反差的纯白线 */
  box-shadow: none !important;                      /* 彻底斩断原先绿色的高光阴影 */
}
.contact .field__label {
  font-family: 'KronivFutura', sans-serif !important;
  color: #888888 !important;                        /* 表单提示文字（Label）清洗为高级浅灰 */
  opacity: 1 !important;
}
.contact .rich-text,
.contact .rich-text * {
  text-align: left !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  margin-left: 0 !important;
}
.multicolumn-list__item {
  padding-bottom: 0 !important;
}
.multicolumn-card {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
  min-height: auto !important;
}
.multicolumn .slider-buttons {
  margin-top: -10px !important;
  margin-bottom: 0 !important;
}

/* ==========================================================================
   KRONIV 最终补丁：顶部/侧边主导航菜单字体纯白化（100% 维持完美对齐）
   ========================================================================== */

/* 1. 强行规范电脑端与手机端主导航菜单：洗净荧光绿，回归极致纯白 */
nav.header__inline-menu ul li a,
.header__inline-menu .list-menu__item,
.menu-drawer__menu-item,
span.header__menu-item {
    font-size: 1.8rem !important;        
    color: #E5E7EB !important;            /* 暴力去绿！强制洗成极致纯白 */
    text-transform: uppercase !important; 
    font-weight: bold !important;        
    letter-spacing: 0.15rem !important;  
    
    /* 
       【完美保留核心排版】
       严格继承你原本用来修复排版歪斜的左对齐与间距逻辑，
       确保手机端侧边栏和电脑端全部稳固居左，只净化颜色，绝不破坏结构。
    */
    justify-content: flex-start !important;
    text-align: left !important;
    padding-left: 2rem !important; 
}

/* 1. 默认状态：剥离伪元素白框，文字深度染白，边框换暗灰 */
.product-form__buttons .button--secondary,
.product-form__submit {
  background: #0D0D0D !important;
  border: 1px solid #333333 !important;
  border-radius: 0px !important;
  box-shadow: none !important;
  transition: all 0.25s ease-in-out !important;
}
/* 🛠️ 核心修复：彻底物理粉碎 Dawn 15.5 原生的绝对定位伪元素白框 */
.product-form__buttons .button--secondary:after,
.product-form__submit:after {
  content: none !important;
  display: none !important;
  box-shadow: none !important;
}
/* 🛠️ 核心修复：深度穿透，把按钮内部任何可能自带荧光绿的子标签强行洗成纯白 */
.product-form__buttons .button--secondary *,
.product-form__submit * {
  color: #E5E7EB !important;
}

/* 2. 悬停状态：平滑反转为全白底、纯黑字、纯白框 */
.product-form__buttons .button--secondary:hover,
.product-form__submit:hover {
  background: #E5E7EB !important;
  border-color: #E5E7EB !important;
}
/* 🛠️ 核心修复：悬停时，内部的所有文字、中括号同步强行染成纯黑 */
.product-form__buttons .button--secondary:hover *,
.product-form__submit:hover * {
  color: #0D0D0D !important;
}


/* 2. 重构第二个按钮：BUY IT NOW（动态结账按钮 - 变为大牌标志性「满格纯白填充黑字」） */
.product-form__buttons .shopify-payment-button__button,
.shopify-payment-button__button--unbranded,
button[class*="buy-it-now"] {
    background-color: #E5E7EB !important; /* 暴力去绿！升级为满格纯白填充，在大暗黑底色中释放至高权重 */
    color: #0D0D0D !important;            /* 文字反转为纯黑，在白底下如同刀锋般利落、醒目 */
    border: 1px solid #E5E7EB !important;  /* 纯白包边，与全站黑白灰秩序高度闭环 */
    border-radius: 0px !important;        /* 强制保持硬朗直角 */
    font-family: 'KronivFutura', sans-serif !important; 
    font-weight: 700 !important;          
    letter-spacing: 0.2rem !important;   
    text-transform: uppercase !important; /* 英文强制大写，拉满模块感 */
    box-shadow: none !important;          /* 彻底斩断原先恶俗的绿色霓虹呼吸发光特效！ */
    transition: all 0.25s ease-in-out !important;
}

/* BUY IT NOW 鼠标悬停/手指点击时的交互：优雅反转为暗夜深灰底，反馈极为克制 */
.product-form__buttons .shopify-payment-button__button:hover {
    background-color: #E5E5E5 !important; /* 悬停时微调为质感银灰色，产生优雅的电控降噪交互感 */
    color: #0D0D0D !important;            /* 文字维持纯黑 */
    border-color: #E5E5E5 !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important; /* 仅仅增加微弱的下沉阴影，绝不漏绿 */
}

/************************************************
 * 🚀 KRONIV EXCLUSIVE: 折叠行内容行距与段距终极疏浚补丁
 ************************************************/
/* 
 * 1. 强力击穿：精准锁定产品详情页折叠面板拉开后的全部内嵌文本容器
 * 2. 强制将两行以上的局促长句拉开至 1.7 倍大牌画册级黄金行距
 */
.product__accordion .accordion__content,
.product__accordion .accordion__content *,
.collapsible-row__content,
.collapsible-row__content *,
.accordion__content,
.accordion__content p,
.accordion__content span,
.accordion__content div,
[id^="Details-"] .accordion__content {
    line-height: 1.7 !important;         /* 强制拉开行距，给英文字母完美的换行呼吸空间 */
    letter-spacing: 0.04em !important;   /* 微加字间距，完全释放 KronivFutura 的硬朗版式感 */
}

/* 
 * 3. 亲密性原则：针对折叠行内部多行文本之间出现的自然换行、单换行（<br>）
 *    或者独立行进行上下间距微调，彻底消灭挤在一起的焦躁感。
 */
.accordion__content p,
.accordion__content div {
    margin-top: 0 !important;
    margin-bottom: 1.8rem !important;    /* 段落之间留出明显空隙，方便海外买家快速扫读卖点 */
}

/* 4. 清除最后一行文本的下边距，防止撑坏折叠面板底部的暗灰边框线 */
.accordion__content p:last-child,
.accordion__content div:last-child {
    margin-bottom: 0 !important;
}

/************************************************
 * 🚀 KRONIV EXCLUSIVE: 垂直按行排列 + 边缘左对齐终极修复补丁
 ************************************************/

/* 1. 【一键解决文字变黑与绿字】：不管在哪个页面，强行将全部分类和底部登录锁定为纯白色 */
.menu-drawer__menu-item,
.menu-drawer__menu-item *,
.menu-drawer__navigation .list-menu__item,
.menu-drawer__navigation .list-menu__item *,
.menu-drawer__utility-links a,
.menu-drawer__utility-links a::after,
.menu-drawer__utility-links svg * {
    color: #E5E7EB !important;                   /* 暴力去黑/去绿！死锁高亮纯白 */
    font-family: 'KronivFutura', sans-serif !important; /* 锁定品牌字体 */
    font-weight: 700 !important;                  /* 保持硬朗线条 */
    text-shadow: none !important;                /* 剥离发光阴影 */
    opacity: 1 !important;
}

@media (max-width:749px){
.menu-drawer{
  overflow:hidden!important;
  display:block!important;
}
.menu-drawer__inner-container{
  overflow:hidden!important;
  position:relative!important;
  width:100vw!important;
  max-width:100%!important;
}
/* 🛠️ 精准打击：强行让所有不在主层级的、潜伏在右侧的错位子菜单容器彻底蒸发 */
.menu-drawer__submenu,
.menu-drawer details[open] .menu-drawer__submenu,
.menu-drawer__inner-submenu{
  display:none!important;
  visibility:hidden!important;
  width:0!important;
  height:0!important;
}
.menu-drawer__navigation{
  width:100%!important;
  max-width:100%!important;
}
.menu-drawer__utility-links{
  display:flex!important;
  padding:2rem 0 2rem 2rem!important;
  margin:2rem 0 0!important;
  box-sizing:border-box!important;
  width:100%!important;
}
.menu-drawer__utility-links a{
  display:flex!important;
  align-items:center!important;
  white-space:nowrap!important;
  gap:12px!important;
}
.menu-drawer__utility-links svg{
  flex-shrink:0!important;
  margin:0!important;
}
.menu-drawer__menu-item:hover,
.menu-drawer__menu-item:hover *,
.menu-drawer__utility-links a:hover,
.menu-drawer__utility-links a:hover *{
  color:#888!important;
}
}







/* 1. 默认状态：强行锁定立即购买按钮为白底黑字，物理粉碎伪元素白框 */
.product-form__buttons .shopify-payment-button__button--unbranded {
  background: #E5E7EB !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 0px !important;
  box-shadow: none !important;
  transition: all 0.25s ease-in-out !important;
}
/* 🛠️ 核心修复：彻底物理粉碎立即购买按钮原生的伪元素外壳重影 */
.product-form__buttons .shopify-payment-button__button--unbranded:after {
  content: none !important;
  display: none !important;
  box-shadow: none !important;
}
/* 🛠️ 核心修复：深度穿透，把按钮内部任何可能被原生锁死的子文字强行洗成纯黑 */
.product-form__buttons .shopify-payment-button__button--unbranded * {
  color: #0D0D0D !important;
}

/* 2. 悬停状态：平滑反转为全黑底、纯白字、纯白框 */
.product-form__buttons .shopify-payment-button__button--unbranded:hover {
  background: #0D0D0D !important;
  border-color: #E5E7EB !important;
}
/* 🛠️ 核心修复：悬停时，内部的所有文字、中括号同步强行反转染成纯白 */
.product-form__buttons .shopify-payment-button__button--unbranded:hover * {
  color: #E5E7EB !important;
}

/* 3. 紧凑间距与多余组件彻底抹杀 */
.product-form__buttons {
  margin-top: 1rem !important;
  margin-bottom: 0.5rem !important;
}
.shopify-payment-button__more-options {
  display: none !important;
}

/* ==========================================================================
   🎯 终极完美版：只杀按钮边框，保全内部文字与箭头
   ========================================================================== */

/* 1. 物理抹除按钮边框：厚度直接归零，并保持完美的纯黑背景 */
.collection-list__item a,
.collection-list__item .card a,
.collection-list__item [class*="button"] {
  border: 0px solid transparent !important;   /* 🛠️ 边框厚度直接归零 */
  border-width: 0px !important;               /* 🛠️ 双重锁死厚度 */
  border-color: #0D0D0D !important;           /* 🛠️ 残留像素强制染黑 */
  outline: none !important;                   /* 🛠️ 蒸发外轮廓 */
  box-shadow: none !important;                /* 🛠️ 去掉任何阴影 */
  background: #0D0D0D !important;             /* 🛠️ 维持完美的纯黑背景 */
  background-color: #0D0D0D !important;
}

/* 2. 彻底打碎 Dawn 官方原生附着在按钮周围的绝对定位伪元素线框/白边 */
.collection-list__item a:after,
.collection-list__item .card a:after,
.collection-list__item *:after {
  content: none !important;
  display: none !important;
  box-shadow: none !important;
}

/* 3. 🛠️ 核心修复：直接对准 a 标签本身以及它内部所有文本，强行洗成极致纯白 */
.collection-list__item a,
.collection-list__item a *,
.collection-list__item [class*="button"],
.collection-list__item [class*="button"] * {
  color: #E5E7EB !important;
  -webkit-text-fill-color: #E5E7EB !important;
  opacity: 1 !important;
  visibility: visible !important;
}



/* ========================================================
   Shopify Dawn 15.5.0 - 标头 LOGO 130px 电脑手机两端精准隔离适配
   ======================================================== */

/* 📱 1. 仅在手机移动端（屏幕小于989px）生效：精致居中对齐 */
@media screen and (max-width: 989px) {
  .header {
    align-items: center !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  .header__heading {
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
  }
  .header__heading-logo {
    width: 130px !important;
    height: auto !important;
  }
  .header__icon {
    transform: scale(0.85) !important;
  }
}

/* 💻 2. 仅在电脑桌面端（屏幕大于990px）生效：锁死大牌尺寸，防止挤乱 */
@media screen and (min-width: 990px) {
  .header__heading-logo {
    width: 130px !important; /* 电脑端同样锁死 130px 高级微缩尺寸 */
    height: auto !important;
  }
  /* 确保电脑端菜单跟小 LOGO 在同一横向轴线上绝对平齐，不发生上下错位 */
  .header--top-center {
    align-items: center !important;
  }
}



/* ========================================================
   KRONIV Q&A 矩阵全员精致微缩与大标题降噪协议（重构版）
   ======================================================== */

/* 1. 外面大标题：物理缩小、换冷灰色、拉开字距、锁定居中 */
.collapsible-content__heading {
  font-family: 'KronivFutura', sans-serif !important;
  color: #cccccc !important;               /* 强行洗成微微暗淡的冷灰色 */
  font-size: 1.3rem !important;            /* 大幅度缩小，确保不折行 */
  font-weight: 700 !important;
  letter-spacing: 0.18rem !important;      /* 拉大字母间距，产生冷冽松弛感 */
  text-transform: uppercase !important;
  text-align: center !important;           /* 🛠️ 仅对最外侧大标题强行居中 */
  margin-bottom: 3.5rem !important;        /* 与下方Q&A拉开呼吸距离 */
  white-space: nowrap !important;
}

/* 2. 四个小标题（Q_01 - Q_04）：同步变小、保持硬朗冷银、靠左对齐 */
.collapsible-content .accordion summary .accordion__title {
  font-family: 'KronivFutura', sans-serif !important;
  color: #E5E7EB !important;               /* 冷银白，与大标题形成高级灰白层级 */
  font-size: 1.25rem !important;           /* 小标题同步微缩变小 */
  font-weight: 700 !important;
  letter-spacing: 0.08rem !important;      /* 精致的微呼吸间距 */
  text-transform: uppercase !important;
  text-align: left !important;             /* 🛠️ 确保折叠盒子的标题严格靠左 */
}

/* 3. 展开后的内部正文：强制解除任何居中命令，恢复完美的左对齐极客排版 */
.collapsible-content .accordion__content,
.collapsible-content .accordion__content *,
.collapsible-content .rte,
.collapsible-content .rte * {
  text-align: left !important;             /* 🛠️ 严防死守，正文必须靠左阅读 */
  justify-content: flex-start !important;
}

/* 4. 顺手微缩右侧的展开小箭头图标，防止图标比字还大 */
.collapsible-content .accordion summary svg {
  transform: scale(0.85) !important;       /* 等比例缩小 15% */
}

.collapsible-content .accordion {
  border-top: none !important;
  border-bottom: none !important;
}

/* 强行压缩产品系列页底部Q&A与页脚之间的臃肿空档 */
.template-collection .collapsible-content,
.template-collection .shopify-section:has(.collapsible-content) {
  padding-bottom: 0px !important;
  margin-bottom: 0px !important;
}
.template-collection .footer {
  margin-top: 1rem !important;             /* 让页脚紧跟在下边缘，拉出最紧凑的军事控制台布局 */
}

/* 8. 【正文微缩降噪】将展开后的极客文本精细化，还原精密控制台质感 */
.collapsible-content .accordion__content,
.collapsible-content .accordion__content p,
.collapsible-content .accordion__content span,
.collapsible-content .rte,
.collapsible-content .rte p {
  font-size: 11px !important;            /* 🛠️ 大幅微缩字号，拒绝臃肿折行 */
  color: #A3A3A3 !important;             /* 🛠️ 统一换上不锈钢拉丝灰，彻底消除刺眼感 */
  line-height: 1.6 !important;           /* 🛠️ 拉开行高，让紧凑的小字具备极佳的阅读舒适度 */
  letter-spacing: 0.05rem !important;    /* 🛠️ 微微拉开字距，营造黑客代码的冷冽呼吸感 */
}
/* 🛠️ 【KRONIV FAQ 终极重叠绝杀补丁】拒绝重叠越界，完美视觉闭环 */

/* 1. 物理隐藏 Dawn 原生自带的右侧 SVG 小图标 */
.collapsible-content .accordion summary svg {
  display: none !important;
}

/* 2. 强构中央矩形：锁死 90% 满屏大比率，彻底释放左右横向延伸空间 */
.collapsible-content .accordion summary {
  position: relative !important;
  display: block !important;           /* 恢复稳定块级流，彻底绝杀行内块导致的溢出重叠 */
  width: 90% !important;               /* 锁死为屏幕宽度的 90%，两边自然留出 5% 的清爽缝隙 */
  max-width: 32rem !important;
  margin: 0 auto !important;           /* 强行在中线绝对居中 */
  text-align: center !important;       /* 文字死死居中 */
  padding: 1.2rem 2.2rem !important;   /* 左右留下精准的安全隔离舱，给长文案腾出空间 */
  box-sizing: border-box !important;
  cursor: pointer !important;
  overflow: visible !important;
}

/* 3. 让折叠面板包裹层同步居中，底盘洗净 */
.collapsible-content .accordion {
  text-align: center !important;
  border-top: none !important;
  border-bottom: none !important;
  width: 100% !important;
}

/* 4. 左侧固定双箭头：利用百分比死死约束在左边缘 5% 处，无论屏幕多窄都绝对不穿透 */
.collapsible-content .accordion summary::before {
  content: ">>" !important;
  position: absolute !important;
  left: 5% !important;                 /* 完美靠左隔离 */
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.1rem !important;
  color: #E5E7EB !important;           /* 锁死大厂高级冷白色 */
  font-weight: bold !important;
  letter-spacing: -1px !important;     /* 紧凑咬合 */
}

/* 5. 右侧固定双箭头：利用百分比死死约束在右边缘 5% 处，物理绝杀溢出、出界、重叠乱码的恶性 Bug */
.collapsible-content .accordion summary::after {
  content: "<<" !important;
  position: absolute !important;
  right: 5% !important;                /* 完美靠右隔离，任何型号手机都绝不出界 */
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.1rem !important;
  color: #E5E7EB !important;           /* 锁死大厂高级冷白色 */
  font-weight: bold !important;
  letter-spacing: -1px !important;     /* 紧凑咬合 */
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}



/* ==========================================================================
   🚨 终极覆盖：多列组件（Multicolumn）所有按钮强制转黑底白字
   ========================================================================== */

/* 1. 物理清洗：将多列组件内所有可能出现的按钮、跳转链接彻底刷成纯黑底、纯白字、暗灰框 */
.multicolumn a.button,
.multicolumn .button,
.multicolumn-list__item a {
  background: #0D0D0D !important;
  background-color: #0D0D0D !important;
  border: 1px solid #333333 !important; /* 精致暗灰线条 */
  color: #E5E7EB !important;             /* 强行洗出极致纯白文字 */
  -webkit-text-fill-color: #E5E7EB !important;
  box-shadow: none !important;
  border-radius: 0px !important;         /* 绝对方角 */
  transition: all 0.25s ease-in-out !important;
}

/* 2. 彻底撕掉 Dawn 官方原生附着在按钮周围的绝对定位伪元素白框/重影 */
.multicolumn a.button:after,
.multicolumn .button:after,
.multicolumn-list__item a:after {
  content: none !important;
  display: none !important;
  box-shadow: none !important;
}

/* 3. 悬停反转（Hover）：鼠标划过时，平滑反转为全白底、纯黑字 */
.multicolumn a.button:hover,
.multicolumn .button:hover,
.multicolumn-list__item a:hover {
  background: #E5E7EB !important;
  background-color: #E5E7EB !important;
  border-color: #E5E7EB !important;
  color: #0D0D0D !important;             /* 悬停时字同步变成极致纯黑 */
  -webkit-text-fill-color: #0D0D0D !important;
}

/* ==========================================================================
   ⬛ 极度克制：彻底消灭原生的 Availability/Price 与 8 products 容器
   ========================================================================== */
.facets-container,
.facets-container-wrapper,
.facets__form,
.facets__wrapper,
#FacetsWrapperDesktop,
#main-collection-filters,
.product-count,
#ProductCount {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: none !important;
}

/* 9. 【详情页折叠正文降噪】全面缩减产品页内部展开文本的字号与色调 */
.product__accordion .accordion__content,
.product__accordion .accordion__content p,
.product__accordion .accordion__content span,
.product__accordion .rte,
.product__accordion .rte * {
  font-size: 11px !important;            /* 🛠️ 大幅缩减字号，使其与 Q&A 正文一致精致 */
  color: #A3A3A3 !important;             /* 🛠️ 强制同步换上不锈钢拉丝灰，消除纯白刺眼感 */
  line-height: 1.6 !important;           /* 🛠️ 适当放宽行高，防止多行代码字贴在一起 */
  letter-spacing: 0.05rem !important;    /* 🛠️ 注入冷冽的极客间距感 */
  text-align: left !important;           /* 🛠️ 咬死靠左绝对对齐，方便阅读 */
}

/* ========================================================
   11. 【结账表单硬核洗白】强行粉碎输入框纯白，还原暗黑终端
   ======================================================== */

/* 1. 强行把所有结账输入框、下拉菜单、文本域洗成深色底 */
.checkout-main-area input,
.checkout-main-area select,
.checkout-main-area textarea,
[class*="field__input"],
[class*="select__select"],
.field__input,
select.select__select {
  background-color: #121212 !important; /* 🛠️ 洗掉纯白，换上极深碳黑底（略亮于网页底色，凸显表单轮廓） */
  color: #E5E7EB !important;            /* 🛠️ 输入文字、填入信息强制锁定冷银白 */
  border: 1px solid #2B2B2B !important;  /* 🛠️ 给一道微弱的工业灰边框，极大提升对齐质感 */
}

/* 2. 修正输入框上方的提示小字（名字、地址等）以及下拉箭头颜色 */
.field__label,
[class*="field__label"],
.select__icon,
[class*="select"] svg {
  color: #A3A3A3 !important;            /* 🛠️ 标签提示字换上不锈钢拉丝灰，清晰好读 */
}

/* 3. 精准捕捉浏览器自动填充（AutoComplete）导致的亮黄/亮白死灰复燃 */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus {
  -webkit-text-fill-color: #E5E7EB !important;
  -webkit-box-shadow: 0 0 0px 1000px #121212 inset !important; /* 🛠️ 用阴影矩阵死死压住浏览器的原生大白块 */
  transition: background-color 5000s ease-in-out 0s;
}

/* ========================================================
   KRONIV 空购物车控制台精密排版与按钮淬火协议
   ======================================================== */

/* 1. 大标题：[ NO GEAR EQUIPPED YET ] 注入冷银色并拉大字距 */
.cart__empty-text,
.shopify-section:has(.cart__warnings) .h1 {
  font-family: 'Courier New', Courier, monospace !important;
  color: #E5E7EB !important;               /* 换上经典的冷银白 */
  letter-spacing: 0.12rem !important;      /* 拉大字母间距，产生冷冽松弛感 */
  margin-bottom: 2rem !important;
  text-transform: uppercase !important;
}

/* 2. 核心修复：彻底分离提示文案的臃肿堆叠，缩小字号并换拉丝钛灰 */
.cart__warnings .cart__login-title,
.cart__warnings .cart__login-paragraph,
.cart__empty-text + p,
.cart__empty-text + p + p,
.cart__warnings p {
  font-family: 'Courier New', Courier, monospace !important;
  font-size: 11px !important;              /* 🛠️ 大幅微缩字号，拒绝突兀 */
  color: #A3A3A3 !important;               /* 🛠️ 统一换上不锈钢拉丝灰，极度护眼 */
  line-height: 1.8 !important;             /* 🛠️ 紧缩并拉开合理的行高，告别上下贴死 */
  letter-spacing: 0.05rem !important;      /* 🛠️ 注入精密微呼吸间距 */
  margin-top: 0.8rem !important;           /* 🛠️ 强行在多行文本间塞入垂直安全留白 */
  margin-bottom: 0.8rem !important;
  text-transform: uppercase !important;    /* 🛠️ 强制大写锁死黑客终端调性 */
}

/* 3. 按钮“淬火”：将“FIND YOUR EDGE”重构成一块极具点击欲的不锈钢高光面板 */
.cart__warnings .button,
.cart__empty-text + a.button {
  font-family: 'Courier New', Courier, monospace !important;
  background-color: #E5E7EB !important;    /* 🛠️ 按钮底色改为冷银色高光 */
  color: #0D0D0D !important;               /* 🛠️ 文字使用炭黑形成强烈的反差对比 */
  border: none !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1rem !important;
  padding: 1.2rem 3rem !important;         /* 🛠️ 增大按钮在手机端的触控区域 */
  text-transform: uppercase !important;
  border-radius: 0px !important;           /* 🛠️ 砸碎圆角，保持朋克冷酷的直角方块 */
  transition: all 0.3s ease !important;
}

/* 4. 按钮悬停动效：触碰时产生金属轻微过载闪烁 */
.cart__warnings .button:hover,
.cart__empty-text + a.button:hover {
  background-color: #FFFFFF !important;
  box-shadow: 0 0 10px rgba(229, 231, 235, 0.5) !important;
}

/* ==========================================================================
   【精准限定】仅对首页系列生效，不影响产品详情页
   ========================================================================== */

/* 1. 使用 <collection-list> 标签限定，精准控制图片效果 */
collection-list .collection-list-card .card__media img {
  filter: grayscale(100%) contrast(160%) brightness(110%) saturate(0%) !important;
  transition: filter 0.4s ease !important;
}

/* 2. 在 <collection-list> 图片上叠加遮罩 */
collection-list .collection-list-card .card__media::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(180deg, rgba(13, 13, 13, 0) 30%, rgba(13, 13, 13, 0.4) 70%, #0D0D0D 100%) !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

/* 3. 悬停交互效果 */
collection-list .collection-list-card:hover .card__media img {
  filter: grayscale(100%) contrast(170%) brightness(125%) !important;
}

/* 🛠️ 【KRONIV 手机导航菜单】100% 物理左对齐死锁补丁 */

/* 1. 强行清洗所有菜单项容器的内边距与外边距，彻底阻断原生缩进穿透 */
.menu-drawer__menu-item,
.menu-drawer__menu-item--link,
.menu-drawer__inner .menu-drawer__menu li,
.menu-drawer__menu-item.list-menu__item {
  padding-left: 0.5rem !important;   /* 🛠️ 核心：将所有行的左内边距统一死死锁在 0.5rem，彻底对齐第一行 */
  margin-left: 0 !important;          /* 强行归零所有潜伏的左外边距 */
  text-align: left !important;        /* 确保所有等宽文本 100% 绝对左对齐 */
  justify-content: flex-start !important; /* 解除原生 flex 弹性撑开导致的错位 */
}

/* 2. 物理屏蔽任何可能潜伏在第二行文字前后的隐形原生按钮或空白占位符 */
.menu-drawer__menu-item svg,
.menu-drawer__menu-item .icon,
.menu-drawer__menu-item::before {
  margin-right: 0 !important;
  padding-left: 0 !important;
}

/* =========================================================================
   KRONIV LAB: HEADER NAVIGATION LINEAR ALIGNMENT FIXED V2
   ========================================================================= */
.header__inline-menu li,
.header__menu-item,
.header__active-menu-item,
.header__inline-menu details[open] > .header__menu-item,
a.header__menu-item,
a.header__active-menu-item {
    display: inline-block !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    /* 核心大招 1：不管点没点，全员行高强制锁死在 1.5 倍字高，杜绝任何因点击导致的微小跳动 */
    line-height: 1.5 !important; 
    /* 核心大招 2：强制所有状态在底线上绝对水平对齐，把跳动的弹簧彻底拔掉 */
    vertical-align: baseline !important; 
}

/* 核心大招 3：无情切除 Dawn 模板在点击（Active / Focus / Hover）时偷偷加在底部、导致文字往上弹的流氓边框和阴影 */
.header__menu-item,
.header__active-menu-item,
.header__menu-item:hover,
.header__menu-item:focus,
.header__active-menu-item:focus {
    border: none !important;
    border-bottom: none !important;
    outline: none !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

/* 核心大招 4：清除激活状态下可能残留的隐藏下划线伪元素空间 */
.header__active-menu-item::after,
.header__menu-item::after {
    display: none !important;
    content: none !important;
}
div.jm-histogram.jm-review-widget-header__star-rating-histogram > div > div > div.jm-progress-bar > div{
background-color: white !important;
}

.jdgm-widget-wrapper *, div[class*="jdgm"] * {
    background-color: #0D0D0D !important;
    background: #0D0D0D !important;
    background-image: none !important;
}


/* =========================================================================
   KRONIV LAB: GLOBAL HEADER HEIGHT FULL SLIMDOWN & LOCK
   ========================================================================= */
.header-wrapper, 
.header, 
#shopify-section-sections--template--header {
    padding-top: 0px !important;     /* 强行切除顶部所有多余空白，全面抽脂 */
    padding-bottom: 0px !important;  /* 强行切除底部所有多余空白，全面抽脂 */
    margin-bottom: 0px !important;
    min-height: unset !important;    /* 解除 Dawn 模板原生的流氓最低高度死锁 */
}

/* 强行压缩标头整体容器的轴线高度，定格在最利落的先锋比例 */
.header {
    height: 60px !important;        /* 强制全站所有页面的标头厚度绝对锁死在 60 像素 */
}

/* 同步压缩内部导航条的物理视窗高度 */
.header__inline-menu {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* ==========================================================================
   🚨 KRONIV TERMINAL - REVIEWS CAROUSEL LEGACY (ABSOLUTE GAP CUT)
   ========================================================================== */

/* 1. 强行砍掉你箭头指的整个 Reviews Carousel - Legacy 组件最外壳的上下大空隙 */
html body .shopify-section .reviews-carousel,
html body .shopify-section [data-block-handle="reviews_carousel"],
html body .jdgm-carousel-wrapper,
html body div.jdgm-widget.jdgm-carousel {
  padding-top: 0px !important;    /* 彻底剥离大黑块上方的多余留白 */
  padding-bottom: 0px !important; /* 彻底剥离大黑块下方的多余留白 */
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

/* 2. 【核心爆破：切除上方大空隙】移除头部总分行、隐藏的小圆点与下方 Larry.M 之间的距离 */
html body .jdgm-carousel .jdgm-carousel__header,
html body .jdgm-widget .jdgm-carousel__header {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
  padding-top: 0px !important;
  padding-bottom: 0px !important;
  height: 0px !important; /* 如果没有显示总评分，强制将头部高度归零 */
  min-height: 0px !important;
  display: none !important; /* 隐藏可能残存的头部空容器 */
}

/* 3. 强行压缩滚动卡片本体内部、名字上方的所有内边距 */
html body .jdgm-carousel .jdgm-carousel__item,
html body .jdgm-widget .jdgm-carousel__item {
  padding-top: 0px !important;    /* 卡片内部上方彻底榨干 */
  padding-bottom: 0px !important; /* 卡片内部下方彻底榨干 */
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

/* 4. 挤压名字、具体评论正文和下划线产品链接之间的无用缝隙 */
html body .jdgm-carousel .jdgm-carousel__reviewer-name {
  margin-top: 0px !important;
  margin-bottom: 4px !important;
}
html body .jdgm-carousel .jdgm-carousel__body {
  margin-top: 4px !important;
  margin-bottom: 4px !important;
}

/* 5. 【核心爆破：切除下方大空隙】移除下划线产品标题长句直到蓝色底边缘之间的所有多余空白 */
html body .jdgm-carousel .jdgm-carousel__product-title,
html body .jdgm-carousel .jdgm-carousel__product-link {
  margin-top: 4px !important;
  margin-bottom: 0px !important;
  padding-bottom: 0px !important;
}

/* 6. 彻底斩断滚动条底层自带的隐藏滑块及小圆点（防止它在你看不到的地方把蓝框往下撑开） */
html body .jdgm-carousel .jdgm-carousel__item-wrapper {
  padding-bottom: 0px !important;
  margin-bottom: 0px !important;
}
html body .jdgm-carousel .jdgm-carousel__left-arrow,
html body .jdgm-carousel .jdgm-carousel__right-arrow {
  margin: 0 !important;
}


/* ==========================================================================
   📱 移动端（手机窄屏）：最高级绝对权重——100%斩断全线大空白
   ========================================================================== */
@media screen and (max-width: 767px) {
  /* 手机端整个外层高度瞬间回缩死守 */
  html body .shopify-section .reviews-carousel,
  html body div.jdgm-carousel-wrapper {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }

  /* 手机端彻底剥离卡片组件头部的隐藏空位 */
  html body .jdgm-carousel .jdgm-carousel__header {
    display: none !important;
  }

  /* 手机端卡片内空压缩至 0px 临界点 */
  html body .jdgm-carousel .jdgm-carousel__item {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }

  /* 手机端彻底拍扁最下方的大空白，强制让整个黑块紧凑收缩 */
  html body .jdgm-carousel .jdgm-carousel__product-title,
  html body .jdgm-carousel .jdgm-carousel__product-link {
    margin-top: 2px !important;
    margin-bottom: 0px !important;
  }
  
  html body .jdgm-carousel .jdgm-carousel__item-wrapper {
    padding-bottom: 0px !important;
  }
}










}













}

}

}
























































}























}













}

}

}

