/** Shopify CDN: Minification failed

Line 1322:10 Expected identifier but found whitespace
Line 1322:23 Unexpected "!"

**/
@media (max-width: 768px) { 
  /* Center text, buttons, and links for all AI sections */
  [class*="ai-flex-layout"] {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    gap: 20px !important;
    padding-bottom: 70px !important;
  }

  [class*="ai-flex-layout"] [class*="ai-heading"],
  [class*="ai-flex-layout"] [class*="ai-text-wrapper"] {
    text-align: center !important;
  }

  /* Mobile font size for headings */
  [class*="ai-heading"] {
    font-size: 28px !important;
  }

  /* Wrapper - ensure no stretching and proper centering */
  [class*="ai-link-wrapper"] {
    display: flex !important;
    justify-content: center !important; 
    width: 100% !important;
    background: transparent !important; /* remove second layer */
    margin: 4px auto !important;
    border-radius: 2px !important;
    position: relative !important;
    text-align: center !important;
  }

  /* Actual button element */
[class*="ai-link-wrapper"] > a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 16px !important; /* extra space between text and arrow */
  scale: 0.8;
  background-color: #d4a373 !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: 22px !important;
  font-weight: normal !important;
  text-decoration: none !important;

  padding: 12px 50px !important;
  padding-right: 27px !important;
  border-radius: 2px !important;
  line-height: 1.5 !important;
  white-space: nowrap !important;
  width: auto !important;
  min-width: unset !important;
  min-height: unset !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
  margin-left: 0px !important;
}

/* Replace short chevron with a proper arrow */
[class*="ai-link-wrapper"] > a::after {
  content: "";
  display: inline-block;
  width: 22px;  /* arrow width */
  height: 17px; /* arrow height */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 24' fill='white'><path d='M0 12h30M18 4l10 8-10 8' stroke='white' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}


  /* Ensure button text color stays white */
  [class*="ai-link-wrapper"] > a,
  [class*="ai-link-wrapper"] > a * {
    color: #fff !important;
    fill: #fff !important;
    text-decoration: none !important;
  }
}










/* 1) Hide the built-in inline SVG so you don't get double arrows */
[class*="ai-link-wrapper"] > a svg {
  display: none !important;
}

/* 2) Make the long-tail arrow responsive (uses font size) */
[class*="ai-link-wrapper"] > a::after {
  content: "";
  display: inline-block;
  width: 1.6em;    /* scales with text size */
  height: 1.1em;   /* scales with text size */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 24'><path d='M0 12h30M18 4l10 8-10 8' stroke='white' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  flex: 0 0 auto;
}

/* Optional: tiny nudge on hover (no motion for reduced-motion users) */
@media (hover:hover) {
  [class*="ai-link-wrapper"] > a:hover::after {
    transform: translateX(2px);
  }
}
@media (prefers-reduced-motion: reduce) {
  [class*="ai-link-wrapper"] > a:hover::after {
    transform: none;
  }
}

















/* Desktop-only margin for headings */
@media (min-width: 769px) {
  [class*="ai-flex-layout"] [class*="ai-heading"] {
    margin-left: 50px !important;
  }
}



/* Desktop padding for the Collections List section */
@media (min-width: 769px) {
  #CollectionsList--template--18567959675030__section_collections_list_TBmaxN {
    padding-top: 160px !important; /* Adjust desktop value */
  }
}

/* Mobile padding for the Collections List section */
@media (max-width: 768px) {
  #CollectionsList--template--18567959675030__section_collections_list_TBmaxN {
    padding-top: 120px !important; /* Adjust mobile value */
  }
}




/* Desktop */
@media (min-width: 769px) {
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX {
    position: relative;
    top: 50px;                  /* Push down without shifting horizontally */
    max-width: 80%;             /* Shrinks section width safely */
    margin: 0 auto;
    text-align: center;
    padding: 10px 0;            /* Reduce vertical padding */
  }

  /* Reduce title and subtitle size slightly */
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-title-template--18567959675030__ss_video_banner_r9jQnX h2 {
    font-size: 28px !important;
  }

  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-subtitle-template--18567959675030__ss_video_banner_r9jQnX p {
    font-size: 16px !important;
  }
}




/* Desktop */
@media (min-width: 769px) {
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX > div > div > div > div > div.ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX {
    max-width: 80% !important;
    margin: 50px auto 0 !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    left: 0 !important;
    transform: none !important;
  }

  /* Title font size */
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-title-template--18567959675030__ss_video_banner_r9jQnX h2 {
    font-size: 42px !important; /* adjust as needed */
    line-height: 1.2 !important;
    margin-bottom: 15px !important;
  }

  /* Paragraph font size */
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-subtitle-template--18567959675030__ss_video_banner_r9jQnX p {
    font-size: 18px !important; /* adjust as needed */
    line-height: 1.6 !important;
    margin-bottom: 20px !important;
  }
}




/* Mobile */
@media (max-width: 768px) {
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX > div > div > div > div > div.ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX {
    max-width: 90% !important;
    margin: 50px auto 0 !important;
    margin-top: 30px !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    left: 0 !important;
    transform: none !important;
  }

  /* Title font size */
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-title-template--18567959675030__ss_video_banner_r9jQnX h2 {
    font-size: 20px !important;
    line-height: 1.3 !important;
    margin-bottom: 10px !important;
  }

  /* Paragraph font size */
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-subtitle-template--18567959675030__ss_video_banner_r9jQnX p {
    font-size: 12px !important;
    line-height: 1.5 !important;
    margin-bottom: 15px !important;
  }
}






/* === Reel-height hero: remove the mask + make wrapper full-height (this section only) === */

/* === Reel-height hero: remove the mask + make wrapper full-height on desktop === */

/* 0) Make the whole section act like a full-height stage */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX,
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX > div,
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX > div > div,
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX > div > div > div,
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX > div > div > div > div {
  position: relative !important;
  height: 100vh !important;
  min-height: 100svh !important;  /* mobile-friendly unit */
  overflow: visible !important;
}

/* 1) Target wrapper: kill ratio padding, make it full height */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
> div > div > div > div 
> div.ab-banner-video-wrapper-template--18567959675030__ss_video_banner_r9jQnX {
  position: relative !important;
  height: 100% !important;
  min-height: 100% !important;
  padding: 0 !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
}

/* 2) Remove any ::before aspect ratio spacers */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
div.ab-banner-video-wrapper-template--18567959675030__ss_video_banner_r9jQnX::before,
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX [class*="video-wrapper"]::before,
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX .media::before {
  content: none !important;
  display: none !important;
}

/* 3) Remove inline padding-top ratios */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX [style*="padding-top"] {
  padding-top: 0 !important;
}

/* 4) Make the video fill the wrapper */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
div.ab-banner-video-wrapper-template--18567959675030__ss_video_banner_r9jQnX > video {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  max-height: none !important;
  display: block !important;
  aspect-ratio: auto !important;
}

/* 5) Keep banner text/CTAs above the video */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX [class*="banner-content"],
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX [class*="overlay"] {
  position: relative !important;
  z-index: 2 !important;
}

/* 6) Hide poster image if any */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX [class*="poster"],
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX img[loading][decoding] {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* === Mobile override: make hero 70% viewport height on screens ≤ 768px === */
@media (max-width: 768px) {
  /* Stage & parents */
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX,
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX > div,
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX > div > div,
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX > div > div > div,
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX > div > div > div > div {
    height: 70vh !important;
    min-height: 70vh !important;
  }

  /* Wrapper */
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  > div > div > div > div 
  > div.ab-banner-video-wrapper-template--18567959675030__ss_video_banner_r9jQnX {
    height: 100% !important;
    min-height: 100% !important;
  }
}











#shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX {
  
  position: absolute !important;
  bottom: 15%;       /* how high from bottom of the video */
  left: 50%;         /* start from horizontal center */
  transform: translateX(30%); /* push it to the right */
  
  z-index: 10 !important;   /* keep above video & play button */
}














/* 1) Make the slide a positioning context */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-slide-template--18567959675030__ss_video_banner_r9jQnX {
  position: relative !important; /* anchor for absolute button */
}

/* 2) Take the button out of the flow and place it ON the video */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX {
  position: absolute !important;
  right: 10% !important;     /* push toward right side */
  bottom: 10% !important;    /* lift it above the bottom edge */
  left: auto !important;
  transform: none !important;
  z-index: 10 !important;    /* above video & play icon */
}

/* (keep your matched design) */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  scale: 0.8;
  background-color: #d4a373 !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: 33px !important;
  font-weight: normal !important;
  text-decoration: none !important;
  padding: 15px 50px !important;
  border-radius: 2px !important;
  line-height: 1.7 !important;
  white-space: nowrap !important;
  width: auto !important;
  min-width: unset !important;
  min-height: unset !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.2) !important;
  margin-left: 0 !important;
}

#shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX:hover {
  background-color: #b97f4b !important;
  color: #fff !important;
}

/* 3) Mobile: center it horizontally, a bit higher so thumbs don't cover it */
@media (max-width: 768px) {
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX {
    font-size: 25px !important;
    
      right: auto !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: 14% !important;
  }
}

/* 4) Safety: ensure the content overlay sits above the video */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX {
  z-index: 5 !important;
  pointer-events: none; /* prevent overlay from intercepting clicks */
}
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX 
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX {
  pointer-events: auto; /* keep the button clickable */
}










/* Hide old inline SVG so only custom arrow shows */
[class*="ai-link-wrapper"] > a svg {
  display: none !important;
}

/* Default (mobile-first): arrow is white */
[class*="ai-link-wrapper"] > a::after {
  content: "";
  display: inline-block;
  width: 1.4em;
  height: 1.4em;
  margin-left: 8px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M14.375 13.125L17.5 10M17.5 10L14.375 6.875M17.5 10H2.5' stroke='white' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  flex: 0 0 auto;
}

/* Desktop override: arrow golden brown (#d4a373) */
@media (min-width: 769px) {
  [class*="ai-link-wrapper"] > a::after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M14.375 13.125L17.5 10M17.5 10L14.375 6.875M17.5 10H2.5' stroke='%23d4a373' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  }
}




/* ========== Tweaks you can change ========== */
:root{
  --btn-gap-desktop: 4px;         /* desktop text↔arrow gap */
  --btn-gap-mobile: 12px;         /* mobile text↔arrow gap */
  --btn-arrow-ml-desktop: 4px;    /* extra left margin for arrow (desktop) */
  --btn-arrow-ml-mobile: 6px;     /* extra left margin for arrow (mobile) */

  --btn-color-desktop: #d4a373;   /* desktop text color */
  --btn-hover-desktop: #e8c9a3;   /* desktop text color on hover (subtle) */

  --arrow-color-desktop: #d4a373; /* desktop arrow color */
  --arrow-hover-desktop: #e8c9a3; /* desktop arrow color on hover */

  --anim: 220ms ease;
}

/* Kill inline SVG arrows so we only have one arrow */
[class*="ai-link-wrapper"] > a svg,
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX svg{
  display: none !important;
}

/* ----- Arrow pseudo-element: masked SVG, color via background-color ----- */
[class*="ai-link-wrapper"] > a::after,
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX::after{
  content: "";
  display: inline-block;
  width: 1.4em;
  height: 1.4em;
  flex: 0 0 auto;

  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M14.375 13.125L17.5 10M17.5 10L14.375 6.875M17.5 10H2.5' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M14.375 13.125L17.5 10M17.5 10L14.375 6.875M17.5 10H2.5' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center;  mask-position: center;
  -webkit-mask-size: contain;     mask-size: contain;

  background-color: var(--arrow-color) !important;  /* <- force the color to follow the var */
  transition: background-color var(--anim), transform var(--anim), opacity var(--anim);
  opacity: .95;
}

/* =================== Mobile (<=768px) =================== */
@media (max-width: 768px){
  [class*="ai-link-wrapper"] > a{
    display: inline-flex !important;
    align-items: center !important;
    gap: var(--btn-gap-mobile) !important;
    margin-left: 0 !important;
    color: #fff !important;                 /* white text on mobile */
  }
  [class*="ai-link-wrapper"] > a::after{
    margin-left: var(--btn-arrow-ml-mobile) !important;
    --arrow-color: #fff !important;         /* white arrow on mobile */
  }
}

/* =================== Desktop (>=769px) =================== */
@media (min-width: 769px){
  /* target both AI buttons and the hero button */
  [class*="ai-link-wrapper"] > a,
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX{
    display: inline-flex !important;
    align-items: center !important;
    gap: var(--btn-gap-desktop) !important;         /* desktop gap control */
    color: var(--btn-color-desktop) !important;     /* text color */
    --arrow-color: var(--arrow-color-desktop) !important; /* base arrow color */
    background-color: transparent !important;       /* no bg hover */
    box-shadow: none !important;
    border-color: transparent !important;
    transition: color var(--anim);
  }

  /* arrow margin tweak on desktop */
  [class*="ai-link-wrapper"] > a::after,
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX::after{
    margin-left: var(--btn-arrow-ml-desktop) !important;
  }

  /* hover: change text color AND arrow var together */
  [class*="ai-link-wrapper"] > a:hover,
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX:hover{
    color: var(--btn-hover-desktop) !important;
    --arrow-color: var(--arrow-hover-desktop) !important; /* <- sync the arrow */
    background-color: transparent !important;  /* keep bg clean */
    box-shadow: none !important;
  }

  /* tiny nudge for the arrow */
  [class*="ai-link-wrapper"] > a:hover::after,
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX:hover::after{
    transform: translateX(3px);
    opacity: 1;
  }
}

/* Accessibility: disable motion if user requests */
@media (prefers-reduced-motion: reduce){
  [class*="ai-link-wrapper"] > a::after,
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX::after{
    transition: none !important;
  }
}













/* =============== KWINTNER — Footer Texture (clean, single source of truth) =============== */
:root{
  /* Image + effect */
  --footer-tex-url: url("/cdn/shop/files/Untitled_3074_x_980_px_1.png?v=1756377721");
  --footer-tex-grayscale: 0.9;        /* 1 = B/W, 0 = color */
  --footer-tex-contrast: 1.3;      /* pop the ridges a bit */
  --footer-tex-opacity: 0.70;       /* texture strength (0–1) */
  --footer-tex-blend: multiply;     /* try: overlay | soft-light | luminosity | multiply */

  /* Zoom & focal point */
  --footer-tex-size-desktop: 2100px;      /* smaller value = more zoom in */
  --footer-tex-pos-desktop:   center 42%;
  --footer-tex-size-mobile:   1700px;
  --footer-tex-pos-mobile:    center 55%;

  /* Inner shadow (depth) */
  --footer-shadow-strength: .47;    /* 0–1 */
  --footer-shadow-blur: 300px;
  --footer-shadow-spread: 100px;

  /* Footer background color + opacity (behind the texture) */
  --footer-bg-rgb: 40,40,40;        /* your gray */
  --footer-bg-alpha: 0.60;          /* 0–1 controls footer background opacity */
}

/* Base wrapper: stacking context + background opacity control */
#shopify-section-sections--18567960330390__footer > footer.site-footer-wrapper{
  position: relative;
  isolation: isolate;
  overflow: hidden;

  /* Footer background itself (separate from texture) */
  background-color: rgba(var(--footer-bg-rgb), var(--footer-bg-alpha)) !important;
}

/* ---- TEXTURE LAYER (below content) ---- */
#shopify-section-sections--18567960330390__footer > footer.site-footer-wrapper::before{
  content: "";
  position: absolute; inset: 0;
  z-index: 0; pointer-events: none;

  background-image: var(--footer-tex-url);
  background-repeat: no-repeat;
  background-position: var(--footer-tex-pos-desktop);
  background-size: var(--footer-tex-size-desktop);

  filter: grayscale(var(--footer-tex-grayscale)) contrast(var(--footer-tex-contrast));
  mix-blend-mode: var(--footer-tex-blend);
  opacity: var(--footer-tex-opacity);
}

/* ---- INNER SHADOW / VIGNETTE (adds depth) ---- */
#shopify-section-sections--18567960330390__footer > footer.site-footer-wrapper::after{
  content: "";
  position: absolute; inset: 0;
  z-index: 0; pointer-events: none;

  /* soft vignette + a hint of top/bottom shading */
  box-shadow: inset 0 0 var(--footer-shadow-blur) var(--footer-shadow-spread)
              rgba(0,0,0,var(--footer-shadow-strength));
  background:
    radial-gradient(120% 100% at 50% 20%, rgba(0,0,0,.12) 0%, rgba(0,0,0,0) 55%),
    radial-gradient(120% 80%  at 50% 100%, rgba(0,0,0,.12) 0%, rgba(0,0,0,0) 60%);
  mix-blend-mode: multiply;
}

/* Content always above effects */
#shopify-section-sections--18567960330390__footer > footer.site-footer-wrapper > *{
  position: relative; z-index: 1;
}

/* ---- MOBILE TUNING ---- */
@media (max-width: 768px){
  #shopify-section-sections--18567960330390__footer > footer.site-footer-wrapper::before{
    background-size: var(--footer-tex-size-mobile);
    background-position: var(--footer-tex-pos-mobile);
    /* small boost so texture shows on smaller area; tweak or remove */
    opacity: calc(var(--footer-tex-opacity) + 0.02);
  }
  #shopify-section-sections--18567960330390__footer > footer.site-footer-wrapper::after{
    box-shadow: inset 0 0 calc(var(--footer-shadow-blur) * .75)
                       calc(var(--footer-shadow-spread) * .6)
                       rgba(0,0,0, calc(var(--footer-shadow-strength) * .8));
  }
}

/* Fallback: older browsers without blend modes */
@supports not (mix-blend-mode: multiply){
  #shopify-section-sections--18567960330390__footer > footer.site-footer-wrapper::before{
    opacity: calc(var(--footer-tex-opacity) * .6);
  }
}










/* ===== r9jQnX — fix header overlay, remove top crop/white bar, and position CTA ===== */

/* 0) Make sure this section does NOT sit above the site header */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX {
  position: relative !important;
  z-index: auto !important;      /* don’t exceed the header */
  overflow: visible !important;  /* don't crop the top */
}

/* 1) Kill tiny margins/padding that create a white bar and cropping */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .section-template--18567959675030__ss_video_banner_r9jQnX {
  margin-top: 0 !important;      /* theme had 3/4px */
  overflow: visible !important;  /* let the hero breathe; we’ll clip deeper */
}
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .section-template--18567959675030__ss_video_banner_r9jQnX-padding {
  padding-top: 0 !important;     /* avoid top gap */
}

/* 2) Slide & video: act as clipping contexts, but stay UNDER everything */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-slide-template--18567959675030__ss_video_banner_r9jQnX {
  position: absolute !important; inset: 0 !important;
  overflow: hidden !important; z-index: 0 !important;
}
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-video-wrapper-template--18567959675030__ss_video_banner_r9jQnX,
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-image-wrapper-playing-video-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-video-wrapper-template--18567959675030__ss_video_banner_r9jQnX,
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-video-wrapper-template--18567959675030__ss_video_banner_r9jQnX video {
  position: absolute !important; inset: 0 !important;
  z-index: 0 !important; pointer-events: none !important;
}

/* 3) Content overlay: full box above video, but NOT above the header */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX {
  position: absolute !important; inset: 0 !important; height: 100% !important;
  z-index: 1 !important;                  /* keep modest so header wins */
  display: block !important;
  left: 0 !important; width: 100% !important;
  transform: none !important;             /* drop left:50% translateX */
  pointer-events: auto !important;
}

/* 4) CTA: anchor to bottom-center on mobile */
@media (max-width: 768px){
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX {
    position: absolute !important;
    left: 50% !important; bottom: 14% !important; right: auto !important; top: auto !important;
    transform: translateX(-50%) !important;
    z-index: 2 !important;

    display: inline-flex !important; align-items: center !important; white-space: nowrap !important;
    background-color: #d4a373 !important; color: #fff !important;
    border: none !important; box-shadow: 0 4px 12px rgba(0,0,0,.2) !important;
    padding: 14px 28px !important; font-weight: 700 !important;
  }
}

/* 5) CTA: move to the right on desktop (bottom-right-ish) */
@media (min-width: 769px){
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX {
    position: absolute !important;
    right: 10% !important; bottom: 10% !important; left: auto !important; top: auto !important;
    transform: none !important;
    z-index: 2 !important;

    display: inline-flex !important; align-items: center !important; white-space: nowrap !important;
    background-color: #d4a373 !important; color: #fff !important;
    border: none !important; box-shadow: 0 4px 12px rgba(0,0,0,.2) !important;
    padding: 16px 32px !important; font-weight: 700 !important;
  }
}

/* 6) Ensure header wins the stack across the page (no visual cover) */
header, .shopify-section-header, #shopify-section-header, .site-header-wrapper, .site-header {
  position: relative; 
  z-index: 100 !important;   /* higher than the hero’s content (1–2) */
}


/* === HERO CTA arrow always visible + bottom-center on desktop === */

/* 1) Give the hero button a default arrow color (both mobile & desktop) */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX {
  --arrow-color: #fff !important; /* arrow is white by default */
}

/* 2) Ensure the arrow pseudo-element is rendered (wins over older rules) */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX::after{
  content: "" !important;
  display: inline-block !important;
  width: 1.4em !important;
  height: 1.4em !important;
  margin-left: 8px !important;

  /* masked SVG arrow; color comes from --arrow-color */
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M14.375 13.125L17.5 10M17.5 10L14.375 6.875M17.5 10H2.5' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M14.375 13.125L17.5 10M17.5 10L14.375 6.875M17.5 10H2.5' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center;  mask-position: center;
  -webkit-mask-size: contain;     mask-size: contain;

  background-color: var(--arrow-color) !important;
  opacity: .98 !important;
  transition: transform 220ms ease, background-color 220ms ease, opacity 220ms ease !important;
}

/* (optional) subtle nudge on hover */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX:hover::after{
  transform: translateX(3px) !important;
}

/* 3) Desktop: keep the CTA bottom-center (not bottom-right) */
@media (min-width: 769px){
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX {
    left: 50% !important;
    right: auto !important;
    bottom: 13% !important;            /* tweak 8–14% to taste */
    transform: translateX(-50%) !important;
     transform: translateX(calc(-50% - 10px)) !important; /* tweak to -1px/-3px if needed */
  }
}

/* Desktop: hero CTA with NO background (keep mobile filled) */
@media (min-width: 769px){
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX{
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;

    

    /* brand-colored text + arrow */
    color:rgb(255, 255, 255) !important;
    --arrow-color:rgb(255, 255, 255) !important;

    /* keep placement/padding the same so tap target stays comfy */
    padding: 16px 32px !important;
  }

  /* hover: subtle tint, still no background */
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX:hover{
    color: #e8c9a3 !important;
    --arrow-color: #e8c9a3 !important;
    background-color: transparent !important;
    box-shadow: none !important;
  }
}


















/* ===== HERO CTA perfect center (desktop + mobile) ===== */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX{
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50.5%) !important; /* tiny nudge to neutralize optical shift */
}


@media (min-width:769px){
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX{
    bottom: 12% !important;
  }
}

/* ===== Collections buttons: true center + lighter weight ===== */
#CollectionsList--template--18567959675030__section_collections_list_TBmaxN
  .collection-item__info{
  text-align: center !important;
}

/* Make the pseudo-button a block and center it perfectly */
#CollectionsList--template--18567959675030__section_collections_list_TBmaxN
  .collection-item__info::after{
  display: block !important;
  width: fit-content !important;          /* falls back gracefully */
  margin: 12px auto 0 auto !important;    /* centers the block */
  font-weight: 400 !important;            /* lighter than 700 */
}

/* ===== Mobile spacing: add vertical gap between cards ===== */
@media (max-width:768px){
  /* If the grid uses CSS Grid, this will work */
  #CollectionsList--template--18567959675030__section_collections_list_TBmaxN
    .collection-list.grid{
    row-gap: 30px !important;             /* vertical gap */
  }
  /* Fallback for flex-based grids */
  #CollectionsList--template--18567959675030__section_collections_list_TBmaxN
    .collection-list.grid > .grid-item{
    margin-bottom: 30px !important;
  }
}

/* (Optional) If the title pushes to one side, center its inline content */
#CollectionsList--template--18567959675030__section_collections_list_TBmaxN
  .collection-item__info > *{
  display: inline-block;
  text-align: center;
}









/* Collections list — bigger titles (mobile + desktop) */
#CollectionsList--template--18567959675030__section_collections_list_TBmaxN
  .collection-item__info span {
  font-size: 15px !important;     /* mobile */
  line-height: 1.25 !important;
  font-weight: 400 !important;
}

@media (min-width: 769px){
  #CollectionsList--template--18567959675030__section_collections_list_TBmaxN
    .collection-item__info span{
    font-size: 18px !important;   /* desktop */
  }
}

















/* =========================================================
   HERO CTA — base legibility (text + arrow shadows, all viewports)
   ========================================================= */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX {
  text-shadow:
    0 1px 1px rgba(0,0,0,.35),
    0 2px 6px rgba(0,0,0,.35) !important;
}

/* Arrow shadow (masked ::after) — standard + WebKit */
#shopify-section-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX
  .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX::after {
  -webkit-filter:
    drop-shadow(0 1px 1px rgba(0,0,0,.35))
    drop-shadow(0 2px 6px rgba(0,0,0,.35)) !important;
  filter:
    drop-shadow(0 1px 1px rgba(0,0,0,.35))
    drop-shadow(0 2px 6px rgba(0,0,0,.35)) !important;
}

/* =========================================================
   MOBILE (≤768px) — micro-align + link-style + white with shadow
   ========================================================= */
@media (max-width: 768px) {
  /* Button: slight left nudge; keep centered logic */
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX {
    left: calc(50% - 20px) !important;   /* tweak -2px…-6px for fine tuning */
    transform: translateX(-50%) !important;

    /* Link-style (no background) */
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;

    /* Color + legibility */
    color: #fff !important;
    --arrow-color: #fff !important;
    text-shadow:
      0 1px 1px rgba(0,0,0,.35),
      0 2px 6px rgba(0,0,0,.25) !important;

    /* Tap target */
    padding: 14px 28px !important;
  }

  /* Arrow: match the text’s shadow strength */
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX::after {
    -webkit-filter:
      drop-shadow(0 1px 1px rgba(0,0,0,.35))
      drop-shadow(0 2px 6px rgba(0,0,0,.25)) !important;
    filter:
      drop-shadow(0 1px 1px rgba(0,0,0,.35))
      drop-shadow(0 2px 6px rgba(0,0,0,.25)) !important;
  }

  /* Hover/tap: keep link-style & white */
  #shopify-section-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-content-template--18567959675030__ss_video_banner_r9jQnX
    .ab-banner-button-template--18567959675030__ss_video_banner_r9jQnX:hover {
    background-color: transparent !important;
    color: #fff !important;
    --arrow-color: #fff !important;
  }
}

/* .drawer--header.is-open .drawer__inner
 {
    visibility: visible;
    left: 0;
} */

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

@keyframes myslideInLeft {
  from {
    opacity: 0 ;
    transform: translateX(-100%) ;
    visibility: hidden ;
  }
  to {
    opacity: 1 ;
    transform: translateX(100%) ;
    visibility: visible ;
  }
}

@keyframes myslideOutLeft {
  from {
    opacity: 1;
    transform: translateX(100%);
    visibility: unset;
  }
  to {
    opacity: 0;
    transform: none;
    visibility: hidden;
  }
}
@keyframes myslideInRight {
  from {
    opacity: 0;
    transform: none;
    visibility: hidden;
  }
  to {
    opacity: 1;
    transform: translateX(-100%);
    visibility: unset;
  }
}
@keyframes myslideOutRight {
  from {
    opacity: 1;
    transform: translateX(-100%);
    visibility: unset;
  }
  to {
    opacity: 0;
    transform: none;
    visibility: hidden;
  }
}
@keyframes slideInUp {
  from {
    opacity: 0;
    transform: none;
  }
  to {
    opacity: 1;
    transform: translateY(100%);
  }
}
@keyframes slideOutDown {
  from {
    transform: none;
  }
  to {
    transform: translateY(100%);
  }
}

}




















/* Desktop – make column titles bigger & bold inside the header dropdown */
@media (min-width: 1024px) {
  .header__dropdown .dropdown__family > .navlink--child .navtext {
    font-size: 18px !important;       /* bump size */
    font-weight: 420 !important;   /*     bold */
    line-height: 1.4 !important;
  }

  /* Nice little gap under the title before its children */
  .header__dropdown .dropdown__family > .navlink--child {
    margin-bottom: 8px !important;
  }

  /* Keep the sub-items smaller/regular so the title stands out */
  .header__dropdown .dropdown__family > .navlink--grandchild .navtext {
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
  }
}















/* Center the 5-up multicolumn section */
@media (min-width: 990px){
  #SectionColumns--template--18704710140054__section_multicolumn_fCGRAc .grid.multicolumn{
    justify-content: center !important;   /* center the grid within its container */
    justify-items: center !important;     /* center items inside their grid cells */
  }

  /* Make each card’s content truly centered */
  #SectionColumns--template--18704710140054__section_multicolumn_fCGRAc .grid-item .column__inner{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  /* Ensure images are centered */
  #SectionColumns--template--18704710140054__section_multicolumn_fCGRAc .column__image .image-wrapper,
  #SectionColumns--template--18704710140054__section_multicolumn_fCGRAc .column__image img{
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
}



















/* === Mini-cart: compact + responsive checkout buttons === */

/* Primary checkout button */
.cart__foot__inner .cart__buttons .btn,
.cart__foot__inner .cart__checkout {
  /* height & font scale with viewport but stay sane */
  height: clamp(32px, 4.2vw, 40px) !important;
  min-height: clamp(32px, 4.2vw, 40px) !important;
  padding: clamp(6px, 1.2vw, 10px) clamp(10px, 2vw, 14px) !important;
  font-size: clamp(12px, 1.2vw, 14px) !important;
  line-height: 1.15 !important;
  border-radius: clamp(4px, 1vw, 6px) !important;
}

/* Tighten spacing between blocks */
.cart__foot__inner .cart__buttons-all { gap: clamp(6px, 1vw, 10px) !important; }

/* Accelerated checkout (PayPal/Wallet) — respect smaller heights via CSS vars */
.cart__foot__inner #dynamic-checkout-cart,
.cart__foot__inner .additional-checkout-buttons {
  --shopify-accelerated-checkout-button-block-size: clamp(32px, 4.2vw, 40px);
  --shopify-accelerated-checkout-row-gap: clamp(4px, 0.8vw, 8px);
  --shopify-accelerated-checkout-button-border-radius: clamp(5px, 1vw, 8px);
}

/* Ensure the containers/iframe wrappers follow the responsive height */
.cart__foot__inner .wallet-cart-grid .wallet-cart-button-container,
.cart__foot__inner .wallet-cart-grid .wallet-cart-button,
.cart__foot__inner .accelerated-checkout-button {
  height: clamp(32px, 4.2vw, 40px) !important;
  min-height: clamp(32px, 4.2vw, 40px) !important;
  border-radius: clamp(5px, 1vw, 8px) !important;
  overflow: hidden !important; /* clips PayPal iframe nicely */
}

/* Optional: slightly reduce subtotal text on very small screens */
@media (max-width: 420px){
  .cart__foot__inner .cart__total__label,
  .cart__foot__inner .cart__total__price { font-size: 13px !important; }
}











/* === Product Add-to-Cart: size + typography control === */
/* target ONLY this button instance */
#AddToCart--template--18567960264854__main {
  /* --- tweakables --- */
  --btn-height: 50px;            /* overall height */
  --btn-pad-x: 6px;             /* left/right padding */
  --btn-radius: 5px;            /* corner radius */
  --btn-font: 16px;              /* base text size */
  --btn-weight: 450;             /* 400–700 */
  --btn-letter: 0.3px;           /* letter-spacing */
  --price-font: 16px;            /* price size inside button */
  --gap: 12px;                    /* space between text and price */
  --btn-width: 55%;             /* 100% (full) or e.g. 260px */

  white-space: nowrap;            /* keep on one line */

   
}

  /* --- layout/size --- */
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: var(--gap);
  width: var(--btn-width);
  min-height: var(--btn-height) !important;
  height: var(--btn-height) !important;
  padding: 0 var(--btn-pad-x) !important;
  border-radius: var(--btn-radius) !important;

  /* make sure theme's small variant doesn't shrink it */
  line-height: 1.1 !important;


 
/* text styles */
#AddToCart--template--18567960264854__main .btn__text {
  font-size: var(--btn-font) !important;
  font-weight: var(--btn-weight) !important;
  letter-spacing: var(--btn-letter) !important;
  white-space: nowrap;            /* keep on one line */
}

/* price inside the button */
#AddToCart--template--18567960264854__main .btn__price,
#AddToCart--template--18567960264854__main .btn__price .money {
  font-size: var(--price-font) !important;
  line-height: 1 !important;
}

/* loader icon scales to height nicely */
#AddToCart--template--18567960264854__main .btn__loader .svg-loader {
  width: calc(var(--btn-height) * 0.45) !important;
  height: calc(var(--btn-height) * 0.45) !important;
}

/* optional: responsive scale */
@media (max-width: 480px){
  #AddToCart--template--18567960264854__main{
    --btn-height: 35px;
    --btn-font: 14px;
    --price-font: 16px;
    --btn-width: 65%;
    --btn-pad-x: 10px !important;             /* left/right padding */
    padding: 10px auto !important;
    white-space: nowrap;            /* keep on one line */

  }
}


/* Center the 70%-width Add to cart button */
#AddToCart--template--18567960264854__main {
  --btn-width: 65 !important%;
  width: var(--btn-width);

  /* center it */
  display: flex !important;                 /* block-level box (still flex for inner layout) */
  margin-left: auto !important;
  margin-right: auto !important;

  /* if parent is a flex container or grid, these help too */
  align-self: center !important;            /* centers within flex parent */
  justify-self: center !important;          /* centers within grid parent */

  
}

/* optional: full-width on small screens */
@media (max-width: 480px){
  #AddToCart--template--18567960264854__main { --btn-width: 70%; }
  flex-wrap: nowrap !important;
}





/* === Payment icons: size, alignment, spacing (scoped) === */
/* Root container (the <div> inside the ID wrapper) */
#\38 dfe9b48-d917-46ea-a6a5-2d34c4bb52e4 > div{
  /* tweakables */
  --pm-row-width: 70%;            /* 100% or any px/% */
  --pm-justify: center;           /* start | center | end | space-between */
  --pm-gap-x: 8px;               /* horizontal gap between icons */
  --pm-gap-y: 4px;               /* vertical gap when wrapping */
  --pm-icon: 50px;                /* visible icon size (logo artwork) */
  --pm-box: 50px;                 /* square box that holds the icon */
  --pm-radius: 5px;              /* corner radius of the box */
  --pm-pad: 3px;                  /* inner padding around the icon */
  --pm-bg: transparent;           /* e.g. #fff for chips */
  --pm-opacity: 0.95;             /* default icon opacity */
  --pm-hover-opacity: 1;          /* hover opacity */
  --pm-grayscale: 0%;             /* 100% to gray them out */

  /* layout overrides (beat inline styles) */
  width: var(--pm-row-width) !important;
  margin: 8px auto 0 !important; /* center the row */
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: var(--pm-justify) !important;
  column-gap: var(--pm-gap-x) !important;
  row-gap: var(--pm-gap-y) !important;
}

/* Each icon “wrapper” row item */
#\38 dfe9b48-d917-46ea-a6a5-2d34c4bb52e4 > div .custom-wrapper-class{
  gap: var(--pm-gap-x) !important;
  align-items: center !important;
}

/* Optional hover pad/background on the icon chip */
#\38 dfe9b48-d917-46ea-a6a5-2d34c4bb52e4 > div .futureblink-icon-hover-cls{
  padding: var(--pm-pad) !important;
  border-radius: var(--pm-radius) !important;
  background: var(--pm-bg) !important;
}

/* The actual icon element (the inner <div> with background-image) */
#\38 dfe9b48-d917-46ea-a6a5-2d34c4bb52e4 > div .futureblink-icon-hover-cls > div{
  width: var(--pm-box) !important;
  height: var(--pm-box) !important;
  background-size: var(--pm-icon) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  opacity: var(--pm-opacity) !important;
  filter: grayscale(var(--pm-grayscale)) !important;
  transition: transform .15s ease, opacity .15s ease, filter .15s ease;
}
#\38 dfe9b48-d917-46ea-a6a5-2d34c4bb52e4 > div .futureblink-icon-hover-cls:hover > div{
  transform: translateY(-1px);
  opacity: var(--pm-hover-opacity) !important;
  filter: none !important;
}

/* (Optional) mobile tweak */
@media (max-width: 480px){
  #\38 dfe9b48-d917-46ea-a6a5-2d34c4bb52e4 > div{
    --pm-row-width: 60%;
    --pm-icon: 40px;
    --pm-box: 45px;
    --pm-gap-x: 5px;
  }
}


/* Payment icons block: remove top spacing */
#\38 dfe9b48-d917-46ea-a6a5-2d34c4bb52e4{
  margin-top: 4px !important;
  padding-top: 5px !important;
  margin-block-start: 1 !important;
  padding-block-start: 1 !important;
}

/* If there’s still space, it’s from the element above.
   Pull this block up a bit (tune the value). */
/* #\38 dfe9b48-d917-46ea-a6a5-2d34c4bb52e4{ margin-top: -8px !important; } */



/* Disable mobile carousel for payment icons */
@media (max-width: 767px){
  #\38 dfe9b48-d917-46ea-a6a5-2d34c4bb52e4 .icon-container_8dfe9b48-d917-46ea-a6a5-2d34c4bb52e4{
    flex-wrap: nowrap !important;
    overflow-x: visible !important;
    scroll-snap-type: none !important;
    -webkit-overflow-scrolling: auto !important;
    justify-content: center !important;  /* optional */
    gap: 10px !important;                 /* fixes their 'undefinedpx' gap */
  }
  #\38 dfe9b48-d917-46ea-a6a5-2d34c4bb52e4 .icon-container_8dfe9b48-d917-46ea-a6a5-2d34c4bb52e4 > div{
    min-width: auto !important;
    max-width: none !important;
    flex: 0 1 auto !important;
    scroll-snap-align: unset !important;
  }
}

#\38 dfe9b48-d917-46ea-a6a5-2d34c4bb52e4{
  margin-top: 6px !important;
  margin-bottom: 16px !important;
  padding-top: 4px !important;
  padding-bottom: 12px !important;
}


#\38 dfe9b48-d917-46ea-a6a5-2d34c4bb52e4 .futureblink-icon-hover-cls > div{
  width:32px;height:32px;background-color:#f1f1f1; /* placeholder */
}






/* No hover motion/shadow/shine for this button */
#AddToCart--template--18567960264854__main {
  transition: none !important;
}
#AddToCart--template--18567960264854__main:is(:hover,:focus,:active) {
  transform: none !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
  background-image: none !important; /* disables gradient/shine overlays */
  text-decoration: none !important;
}
/* some themes add hover via pseudo elements */
#AddToCart--template--18567960264854__main::before,
#AddToCart--template--18567960264854__main::after {
  content: none !important;
  display: none !important;
}













/* ===== Mini-cart overlay fix: dim everything BUT keep the cart bright ===== */

/* 1) Make the theme overlay truly full-screen and above site content */
.drawer__overlay,
.cart-drawer__overlay,
[data-overlay="drawer"] {
  position: fixed !important;
  inset: 0 !important;
  background: rgba(0,0,0,.55) !important; /* the dim */
  z-index: 2147483646 !important;         /* sits above everything... */
}

/* 2) ...except the cart panel itself, which must be higher */
.cart-drawer,
.drawer--cart,
#CartDrawer,
.mini-cart,
cart-drawer {
  position: fixed !important;             /* most themes already are, but ensure */
  z-index: 2147483647 !important;         /* above overlay */
}

/* 3) Some themes render an overlay INSIDE the drawer.
      Keep that inner overlay BELOW the cart content so it never dims the panel. */
.cart-drawer .drawer__overlay,
.mini-cart .drawer__overlay,
#CartDrawer .drawer__overlay {
  z-index: 2147483645 !important;         /* under the panel layer, still dims the page */
  pointer-events: none !important;        /* don’t block clicks inside the panel */
  background: rgba(0,0,0,.55) !important;
}

/* 4) If your header or hero has a silly-high z-index, force it under the scrim while open */
body:has(.drawer__overlay[aria-hidden="false"]),
body:has(.cart-drawer.is-open),
body:has(#CartDrawer[open]),
body:has(.mini-cart.is-open) header,
body:has(.mini-cart.is-open) .site-header {
  z-index: 1 !important;
}











/* === Mobile CTA: one-line, iPhone-safe, long prices handled === */
@media (max-width: 600px){
  .product__submit__buttons .product__submit__item{ width:100%; }

  .product__submit__buttons .btn{
    display:flex; align-items:center; justify-content:center;
    width:100%; max-width:100%; box-sizing:border-box;
    min-height:48px; line-height:1.2;
    padding-inline: clamp(16px, 4vw, 22px);
    white-space: nowrap !important;           /* keep single line */
    overflow: visible !important;             /* avoid iOS clipping */
    -webkit-mask-image: -webkit-radial-gradient(white, black);
    font-size: clamp(13.5px, 3.4vw, 16px);    /* responsive text */
    letter-spacing: 0.02em !important;        /* tame uppercase tracking */
    word-spacing: 0 !important;
  }

  .product__submit__buttons .btn.btn--small{ padding-block:12px; }

  .product__submit__buttons .btn .btn__text{
    display:inline-flex; align-items:center;
    gap: clamp(4px, 1.4vw, 8px);
    flex-wrap:nowrap; min-width:0;
  }

  .product__submit__buttons .btn .btn__price,
  .product__submit__buttons .btn .btn__price .money{
    font-size:0.95em; letter-spacing:0 !important; /* digits tighter */
  }

  .product__submit__buttons .btn .btn__loader{
    position:absolute; right:12px;            /* don’t steal space */
  }

  /* Sold-out popup may wrap freely */
  popup-component.product-soldout-notification .btn,
  popup-component.product-soldout-notification .btn .btn__text{
    white-space: normal !important;
    overflow: visible !important;
  }
}

/* Ultra-narrow devices */
@media (max-width: 360px){
  .product__submit__buttons .btn{ font-size:13px; letter-spacing:0 !important; }
  .product__submit__buttons .btn .btn__price .money{ font-size:0.92em; }
}
@media (max-width: 330px){
  .product__submit__buttons .btn{ font-size:12.5px; }
  .product__submit__buttons .btn .btn__price .money{ font-size:0.9em; }
}







/* מניעת גלילה אופקית/“דחיפה” במסכים צרים */
html { overflow-x: clip; }           /* עדיף על hidden כדי לא לפגוע בביצועים */
body { width: 100%; }



/* ודא שילדי הפלקס לא דוחפים את הדף לרוחב */
.product__submit__buttons,
.product__submit__item,
.product__submit__item > * {
  min-width: 0 !important;     /* קריטי בפלקס */
  max-width: 100% !important;
  overflow: hidden;             /* אם מישהו מתעקש לגלוש, נגזור אותו פנימה */
}




/* Full-bleed יציב בלי דחיפה (כולל iPhone notch) */
.bleed-100 {
  width: 100svw;                          /* יחידת viewport חכמה לניידים */
  max-width: 100svw;
  margin-left: calc(50% - 50svw);
  margin-right: calc(50% - 50svw);
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
}
@supports not (width: 100svw) {
  .bleed-100 {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }
}














/* === Announcement bar: font-size control + optional mobile stop === */
/* Adjust these two values only */
:root{
  --ann-fs-desktop: 17px;  /* desktop font size */
  --ann-fs-mobile: 13px;   /* mobile font size */
}

/* Desktop font size */
.announcement__message .body-medium h5,
.announcement__message h5,
.announcement__message a,
.announcement__message span,
.announcement__message p {
  font-size: var(--ann-fs-desktop) !important;
  line-height: 1.35 !important;
}

/* Mobile overrides */
@media (max-width: 767px) {
  .announcement__message .body-medium h5,
  .announcement__message h5,
  .announcement__message a,
  .announcement__message span,
  .announcement__message p {
    font-size: var(--ann-fs-mobile) !important;
    line-height: 1.35 !important;
    white-space: normal !important;  /* allow wrapping on small screens */
  }

  /* Optional: stop the marquee/ticker on mobile */
  .announcement__scale,
  .announcement__text {
    animation: none !important;
    transform: none !important;
    overflow: visible !important;
  }
}