@charset "UTF-8";
/* =======================================================
   📋 CUSTOM ACCOUNT SCRIPTS & CONVERSION STYLES
   ======================================================= */
body.ecwid-customer-group-21398251 .ec-size .ec-store .ec-cart-coupon {
  display: none;
}

/* 1. Hides the black base price ONLY if your discount script is active */
.ec-cart-item:has(.discount-details) .ec-cart-item__price-inner {
  display: none !important;
}

/* 2. Adds the "ea" label to your custom price */
.discount-details::after {
  content: " / ea";
  font-size: 0.9em;
  font-weight: normal;
  margin-left: 4px;
}

/* 3. FIX: Stops the @ symbol and text from inverting to white-on-black */
.discount-details {
  background: transparent !important;
  background-color: transparent !important;
  color: inherit !important;
  padding: 0 !important;
  border: none !important;
}

.footer-new .ec-likely:after {
  content: "";
}

/* =======================================================
   💻 UNIFIED DESKTOP HARDLOCK (Standard Monitors & Tablets)
   ======================================================= */
@media screen and (min-width: 769px) {
  /* 1. CONTAINER LIMIT: Clean 380px vertical height keeps the banner crisp */
  div.cover,
.ec-storefront div[class*="cover"],
.ec-storefront .tile-section--half-cover {
    height: 380px !important;
    min-height: 380px !important;
    max-height: 380px !important;
    position: relative !important;
    display: block !important;
  }
  div.cover__background,
div[class*="cover__background"] {
    height: 380px !important;
    min-height: 380px !important;
    max-height: 380px !important;
    background-size: cover !important;
    background-position: center center !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 1 !important;
  }
  div[class*="cover__content"],
div[class*="hero__content"],
.ec-storefront .tile-section__content {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  /* 2. THE SUCCESSFUL SMOOTH FLOW LOCK: Re-establishes fluid margin scaling */
  .ec-storefront .tile-section__title-wrapper,
div[class*="title-wrapper"] {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    position: relative !important;
    left: 0 !important;
    transform: none !important;
    width: 100% !important;
    max-width: 95vw !important;
    margin: 110px auto 0 auto !important;
    padding: 0px !important;
  }
  /* 6. Enforce strict horizontal centering text flow for Title */
  div[class*="cover__title"], .ec-storefront .tile-section__title {
    text-align: center !important;
    margin: 15px auto 10px auto !important;
    padding: 0px !important;
    line-height: 1.1 !important;
    display: block !important;
    width: 100% !important;
  }
  /* 7. Enforce strict horizontal centering text flow for Tagline */
  div[class*="cover__description"], .ec-storefront .tile-section__description {
    text-align: center !important;
    margin: 0px auto 15px auto !important;
    padding: 0px !important;
    line-height: 1.2 !important;
    display: block !important;
    width: 100% !important;
  }
  /* 🎯 THE DESKTOP CLS FIREWALL: Safely contained inside desktop bounds to prevent mobile code bleeding */
  .tile-store,
div[id*="main"][class*="store"] {
    /* 🚀 THE FIXED MOVEMENT RESET: Replaces contain:layout to instantly unfreeze your desktop chat */
    margin-top: 40px !important;
    display: block !important;
  }
}

/* =======================================================
   🖥️ ULTRA-WIDE 4K CORRECTION FIREWALL (Screens > 1400px Only)
   ======================================================= */
@media screen and (min-width: 1400px) {
  div.cover, .ec-storefront div[class*="cover"], .ec-storefront .tile-section--half-cover {
    height: 25vw !important;
    max-height: 550px !important;
  }
  div.cover__background, div[class*="cover__background"] {
    height: 25vw !important;
    max-height: 550px !important;
  }
  .ec-storefront .tile-section__title-wrapper, div[class*="title-wrapper"] {
    top: 50% !important;
    transform: translate(-50%, -45%) !important;
  }
}

/* 3. Global element collapse helper */
.ec-storefront .tile-section__spacer {
  display: none !important;
  height: 0px !important;
  margin: 0px !important;
  padding: 0px !important;
}

/* =======================================================
   📲 FINAL HIGH-SPEED MOBILE RIBBON FRAMEWORK (< 768px Only)
   ======================================================= */
@media screen and (max-width: 768px) {
  /* 1. COMPACT CONTAINER: Stable low-profile 150px height layout ribbon */
  div.cover,
.ec-storefront div[class*="cover"],
.ec-storefront .tile-section--half-cover {
    display: block !important;
    height: 150px !important;
    min-height: 150px !important;
    max-height: 150px !important;
    width: 100% !important;
    max-width: 100vw !important;
    position: relative !important;
    margin: 0 auto !important;
    padding: 0px 0px 10px 0px !important;
    contain: paint !important;
  }
  /* 2. UNIFIED BACKGROUND LOGIC */
  div.cover__background,
div[class*="cover__background"] {
    background-image: url("https://d2j6dbq0eux0bg.cloudfront.net/startersite/images/77830252/1789580052915.webp") !important;
    background-size: cover !important;
    background-position: center center !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1 !important;
  }
  /* 3. PERFORMANCE SHIELD */
  .ec-storefront .tile-section__title-wrapper,
div[class*="title-wrapper"],
div[class*="cover__title"],
div[class*="cover__description"],
.ec-storefront .tile-section__title,
.ec-storefront .tile-section__description {
    display: none !important;
    height: 0px !important;
    width: 0px !important;
    margin: 0px !important;
    padding: 0px !important;
    opacity: 0 !important;
    visibility: hidden !important;
  }
}