/** Shopify CDN: Minification failed

Line 225:0 Unexpected "}"
Line 439:0 Unexpected "}"
Line 966:7 Unexpected "and"
Line 1071:10 Expected ":"
Line 1368:3 Expected identifier but found "."
Line 3012:5 Expected ":"
Line 3012:7 Expected identifier but found "4px"
Line 3906:2 "ont-family" is not a known CSS property
Line 4046:0 Unexpected "}"
Line 4834:23 Unexpected "{"
... and 81 more hidden warnings

**/
/*Boost Search*/

body.boost-sd__search-opening::before {
  margin-top: 117px;
}

/* TEMP FIXES: */

.al-collections-nav {
  display: none;
}

/********/

/**** GLOBAL STYLES ****/

.imega-widgets-holder {
  max-width: 563px;
  margin: 0 auto;
}

.section-container {
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  
}

/********/

/**** Mega Menu ****/

/*.MegaMenu {
  left: auto!important;
  width: 69%!important;
}

.HorizontalList__Item.nav-sales > a {
  color: #d10000 !important;
}

.MegaMenu--custom .MegaMenu__Inner--custom {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  padding: 30px;
}

.MegaMenu__Columns {
  display: flex;
  gap: 40px;
}

.MegaMenu__Column {
  min-width: 180px;
}

.MegaMenu__Column img {
  margin-top: 10px;
  width: 100%;
}

.MegaMenu__Feature {
  max-width: 220px;
  text-align: center;
}

.MegaMenu__ProductTitle {
  font-size: 14px;
  margin: 10px 0;
}

*/
/********/

/**** Responsive ****/

/* Medium screens (tablets, small desktops) */
@media (min-width: 768px) {
  .section-container {
    padding-left: 40px;
    padding-right: 40px;
  }
}
@media (min-width: 1280px) {
  .section-container {
    /*padding-left: 60px!important;
    padding-right: 60px!important;*/
  }
  #section-footer {
    margin-top: 133px;
  }
}
@media (max-width: 768px) {
  .inventory-yn, #demo-badge {
    margin-top: 18px;
  }
  #productpage-412612 > div.boost-sd__recommendation-title.boost-sd__recommendation-title--center > span {
    font-size: 18px!important;
  }
  #productpage-412612 > div.boost-sd__recommendation-title.boost-sd__recommendation-title--center {
    margin-bottom: 20px!important;
  }
  #boost-sd-widget-productpage-412612 {
    padding-top: 60px!important;
    padding-left: 20px;
    padding-right: 20px;
  }
  .product-videos-header {
    flex-direction: column;
  }
  .video-tabs {
    margin-top: -15px!important;
    margin-bottom: -43px!important;
  }
  .section-container {
    padding-top: 40px!important;
  }
  .special-heading {
    margin-bottom: -30px!important;
  }
  .product-benefits-header {
    margin-bottom: 10px!important;
  }
  .product-benefits {
    padding-top: 40px!important;
  }
  .benefit-title {
    font-size: 14px!important;
  }
  .product-videos {
    padding-left: 20px!important;
    padding-right: 20px!important;
  }
    .product-benefits-list {
    flex-direction: column;
  }
  .special-details-carousel {
    padding: 40px;
    flex-direction: column;
  }
  .StickyCTA, .Product__SlideshowNav {
    display: none!important;
  }
  .ProductMeta {
    text-align: left;
  }
  .special-order-box, .restock-info, .in-stock-box {
    /*width: 308px!important;*/
  }
  #section-footer {
    margin-top: 80px;
  }
}

@media (max-width: 768px) {
  .restock-info {
    display: flex;
    /*flex-direction: column; */
    align-items: flex-start;
  }

  /* Create a horizontal row for the icon and frame */
  .material-symbols,
  .frame {
    display: inline-flex;
    vertical-align: middle;
  }

  /* Put the icon and frame on one line */
  .material-symbols {
    margin-right: 10px;
  }

  /* Wrap icon + frame together using flex on the parent */
  .restock-info > .material-symbols,
  .restock-info > .frame {
    display: inline-block;
  }

  /* Force them to behave like a row */
  .restock-info > .material-symbols {
    float: left;
  }

  .restock-info > .frame {
    display: block;
    overflow: hidden;
  }

  /* Keep the button below */
  .restock-info .container {
    clear: both;
    margin-top: 10px;
    width: 100%;
  }
h2.section-heading, h2.special-heading, h2.product-videos-title, h2.audio-playlist-title {
  font-size: 18px!important;
}
h2.audio-playlist-title {
  margin-bottom: -30px!important;
}
  /*.why-choose-us {
    width: auto!important;
  }*/
}

}

/* Large screens */
@media (min-width: 1024px) {
  .section-container {
    padding-left: 60px;
    padding-right: 60px;
  }
}

/* Extra-large screens */
@media (min-width: 1440px) {
  .section-container {
    padding-left: 0px;
    padding-right: 0px;
  }
}


/********/
.js-flickity, .cta-flickity, .popular-products-flickity {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  height: auto!important;
}

/**** Items adjusted and need discussion: ****/

.olark-launch-button-wrapper {
  display: none; /* This is omitted in the design but is normally visible. It hides the Sticky__CTA Add to Cart button when visible though */
}

/********/

/**** Global ****/
body {
  background: #FAFAFA;
}

/********/

/**** Header (header.liquid) ****/

/*.Header__Wrapper:not(.HW-secondary) {
  max-width: 1280px;
}
.Search__Inner {
  margin: 0;
}
.header-searchbar {
  flex: 2;
  min-width: 500px;
  margin-top: 5px;
}
.Header__LogoImage {
  max-width: 180px!important;
}
.kmr-services-container {
  display: none;
}
.S25-consultation-button {
    display: inline-flex;
    height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 20px;
    position: relative;
    flex: 0 0 auto;
    margin-top: -2.00px;
    margin-bottom: -2.00px;
    margin-left: -2.00px;
    border-radius: 10px;
    border: 2px solid;
    border-color: var(--kmr-red);
}
.consultation-text-wrapper {
    position: relative;
    width: fit-content;
    margin-top: -1.50px;
    font-family: var(--desktop-button-text-font-family);
    font-weight: var(--desktop-button-text-font-weight);
    color: var(--kmr-white);
    font-size: var(--desktop-button-text-font-size);
    text-align: center;
    letter-spacing: var(--desktop-button-text-letter-spacing);
    line-height: var(--desktop-button-text-line-height);
    white-space: nowrap;
    font-style: var(--desktop-button-text-font-style);
}
.header-contact-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.header-accountcart {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
}
.t-icons {
  margin-left: auto; 
  display: flex;
  align-items: center;
  gap: 16px; 
}
.t-icons {
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  gap: 16px;
}
.contact-us-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: white;
  line-height: 1.2;
}

.contact-us-block .label {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 4px;
}

.contact-us-block .number {
  font-size: 22px;
  font-weight: 800;
  color: white;
  text-decoration: none;
}
.contact-row {
  display: flex;
  align-items: center;
  gap: 24px; 
}

.frame-5 {
  display: flex;
  align-items: center;
  gap: 10px; 
}

.frame-5 .img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}
*/

.Header__Wrapper {
  border-bottom: solid 0.5px #000;
}

.icon-user { width: 24px; height: 24px; color: #fff; }

/**** PRODUCT PAGE ****/

  /* PRODUCT PAGE */
.Product__SlideshowNav {
  margin-left: 50px;
}
.thumb-carousel {
  margin-top: 10px;
}
/* Force thumbnails into a single horizontal scrollable row */
.Product__SlideshowNavScroller {
  display: flex !important;           /* Override grid with flex */
  flex-wrap: nowrap !important;       /* Prevent wrapping to multiple rows */
  overflow-x: auto !important;        /* Enable horizontal scroll */
  overflow-y: hidden !important;      /* Hide vertical overflow */
  gap: 8px;                           /* Space between thumbnails */
  /*max-width: calc(4 * 80px + 3 * 8px);*/ /* Show exactly 4 thumbnails at once */
  max-width: 665px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;  /* Smooth scrolling on iOS */
  scrollbar-width: none;              /* Hide scrollbar in Firefox */
}

.Product__SlideshowNavScroller::-webkit-scrollbar {
  display: none; /* Hide scrollbar in Chrome/Safari */
}

.Product__SlideshowNavScroller .Product__SlideshowNavImage {
  flex: 0 0 auto !important;          /* Keep thumbnails in a row */
  /*width: 80px !important;    */         /* Thumbnail width */
  scroll-snap-align: start;
}
.Product__SlideshowNav .Product__SlideshowNavScroller {
  justify-content: flex-start;
}

@media screen and (min-width: 1140px) {
  .Product__Gallery:not(.Product__Gallery--stack).Product__Gallery--withThumbnails .Product__SlideshowNav, .Product__SlideshowNavScroller {
    margin: 0 auto!important;
  }
}

/* === Product thumb carousel (self-contained) === */

/* Let Flickity handle positioning */
@media screen and (max-width: 768px) {
  .thumb-carousel-wrapper {
    display: none;
  }
}

}.thumb-carousel {
  display: block !important;
}

/* Cell size + spacing (margin, not flex gap) */
.thumb-carousel .thumb-slide {
  width: 145px !important;
  margin-right: 12px;
  flex: 0 0 auto;
}

/* Aspect-ratio frame */
.thumb-carousel .thumb-slide > a.AspectRatio {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  --aspect-ratio: 1 !important;
  overflow: hidden !important;
}

.thumb-carousel .thumb-slide > a.AspectRatio::before {
  content: "" !important;
  display: block !important;
  padding-bottom: calc(100% / var(--aspect-ratio, 1)) !important;
}

/* Image inside frame */
.thumb-carousel .flickity-slider .thumb-slide > a.AspectRatio > img,
.thumb-carousel .thumb-slide > a.AspectRatio > img,
.thumb-carousel .thumb-slide .AspectRatio > img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;       /* or 'contain' */
  object-position: center center !important;
  transform: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Safety: ensure viewport never collapses during init */
.js-flickity-thumb-carousel .flickity-viewport {
  min-height: 110px;
}

/* === Flat pill-style dots === */
.thumb-carousel-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 16px;
}

/* === Animated expanding dots === */
.thumb-carousel-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 16px;
}

.custom-dot {
  display: inline-block;
  width: 24px;           /* inactive width */
  height: 6px;
  background: #e2e2e2;
  cursor: pointer;
  transition: width 0.3s ease, background-color 0.3s ease, opacity 0.3s ease;
  /*opacity: 0.8;*/
}

.custom-dot:hover {
  opacity: 1;
}

.custom-dot.active {
  width: 48px;           /* active width */
  background: #000;      /* or brand color */
  opacity: 1;
}

/* Optional – compact on mobile */
@media (max-width: 768px) {
  .custom-dot {
    width: 18px;
  }
  .custom-dot.active {
    width: 36px;
  }
}

.product_short-description {
  margin-bottom: 20px;
}

/**** Price ****/

/*.ProductMeta__PriceList*/.ProductMeta__PriceRow {
  padding-top: 20px;
  border-top: 0.5px solid #6A6A6A33;
  margin-top: auto;

}

/* Accordion General Styles */
.accordion {

  overflow: hidden;
  max-width: 563px;
  margin: 0 auto;
}

.accordion-item {
  border: 1px solid;
  border-color: var(--kmr-light-grey);
  border-radius: 8px;
  margin-bottom: 14px;
}

.accordion-item:last-child {
  border-bottom: none;
}

/* Accordion Header */
.accordion-header {
  width: 100%;
  background-color: var(--kmr-background);
  color: #000;
  font-weight: bold;
  padding: 15px 20px;
  text-align: left;
  border: none;
  outline: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between; /* Pushes icon to the right */
  align-items: center;
  transition: background 0.3s;
}

/*.accordion-header:hover {
  background: #ddd;
}
*/
/* Accordion Content */

.accordion-content li {
  list-style-position: outside; 
  padding-left: 0.5em; 
  text-indent: 0em; 
}
.accordion-content {
  display: block;
  max-height: 0;
  overflow-y: scroll;
  padding: 0 20px;
  background: #fafafa;
  border-top: 1px solid;
  border-top-color: var(--kmr-light-grey);
  opacity: 0;
  transition: max-height 0.4s ease, opacity 0.4s ease, padding 0.4s ease;
}

/* Open State */
.accordion-content.open {
  max-height: 500px; /* Adjust as needed */
  opacity: 1;
  padding: 15px 20px;
}

/* Icon Rotation */
.accordion-icon {
  font-size: 18px;
  transition: transform 0.4s ease;
}

.accordion-header.open .accordion-icon {
  transform: rotate(180deg)!important;
}


.ProductForm {
  background-color: white;
  padding: 20px;
}

/********/

/**** Key Features ****/
.feature-label {
  margin-left: 15px;
}
.feature-icon {
  margin-bottom: -5px;
}
.key-features-section {
  background: #ffffff;
  padding-bottom: 30px;
  padding-top: 10px;
  padding-left: 20px;
}
@media (max-width: 768px) {
  .key-features-section {
    padding-left: 0px!important;
  }
}
.key-features-section h3 {
  margin-left: 20px;
}
.key-features-container {
  display: grid;
  grid-template-columns: repeat(2, auto); /* two columns */
  gap: 20px 40px; /* adjust horizontal spacing as needed */
  margin-top: 10px; /* spacing from title */
  margin-left: 20px;
}

.feature-item {
  font-size: 14px;
  color: #333;
}


.feature-item .feature-icon {
  width: 24px;
  height: 24px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
}

.icon-gain { background-image: url('/icons/gain.svg'); }
.icon-stereo-link { background-image: url('/icons/stereo-link.svg'); }
.icon-voltage { background-image: url('/icons/voltage.svg'); }
.icon-weight { background-image: url('/icons/weight.svg'); }
.icon-power { background-image: url('/icons/power.svg'); }
.icon-dimensions { background-image: url('/icons/dimensions.svg'); }

.feature-label {
  font-size: 14px;
  color: #333;
}

/********/
/***** Product Downloads *****/

/* Wrapper that stacks the download rows */
.pdf-downloads {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* <a class="pdf-download">… */
.pdf-download {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  background: #fff;
  text-decoration: none;       /* anchor as card */
  color: inherit;
  flex-wrap: nowrap;           /* keep single row on small screens */
}

/* hover/focus states */
.pdf-download:hover .pdf-link { text-decoration: underline; }
.pdf-download:focus-visible {
  outline: 2px solid #111;
  outline-offset: 2px;
  text-decoration: none;
}

/* Left: icon + labels */
.pdf-info {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1 1 auto;              /* middle area grows/shrinks */
  min-width: 0;                /* allow text truncation */
}

.pdf-icon {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;              /* don't shrink the icon */
}

.pdf-info > div {
  line-height: 1.1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;         /* keep title on one line */
}

.pdf-info strong {
  display: block;
  margin: 0;
  font-size: 0.95em;
}

.pdf-info span {
  display: block;
  margin: 0;
  font-size: 0.85em;
  color: #666;
}

/* Right: "Download PDF" label pinned to the edge */
.pdf-link {
  margin-left: auto;           /* push to the right edge */
  white-space: nowrap;
  font-weight: 600;
  font-size: 0.9em;
  text-decoration: underline;  /* visible as a link even though whole row clicks */
}

/* Tighten on tiny screens but keep row layout */
@media (max-width: 480px) {
  .pdf-download { gap: 8px; padding: 10px 12px; }
  .pdf-icon { width: 36px; height: 36px; }
  .pdf-info strong { font-size: 14px; }
  .pdf-info span { display: none; } /* optional: hide subtext if space is tight */
}



/********/

/**** Product Meta ****/
.Product__Meta-Container {
  background: #ffffff;
  padding: 0px 20px 6px 20px;
}
.Product__Info {
  max-width: none;
  background: #ffffff;
  padding-bottom: 10px!important;
}

.Product {
  max-width: 1443px;
}
@media (min-width: 769px) {
  .Product__InfoWrapper {
  margin-top: 22px;
  width: 603px!important;
}
}

@media (max-width: 768px) {
  .Product__InfoWrapper {
    max-width: 500px!important;
    width: 100%;
    margin: 0 auto;
  }
}

.Product__SlideItem img {
  padding: 30px;
  background-color: white;
}
@media screen and (min-width: 1140px) {
  .Product--small .Product__Slideshow {
    max-width: 720px;
  }
}
.ProductMeta__Title.Heading.u-h2 {
  color: black!important;
}
.ProductMeta {
  border-bottom: none;
  margin-bottom: 0px;
  padding-bottom: 0px;
}
@media screen and (min-width: 1008px) {
  .Product__Gallery {
    width: 50%;
  }
    .Product__InfoWrapper {
    width: 42%;
}
}
  .Product__Wrapper .Product__Gallery {
    border: none;
    padding-top: 0px;
  }
.ProductMeta__TaxNotice {
  display: none;
}
.ProductMeta__Price.Price.Text--subdued.u-h4 {
  color: black;
  font-size: 21px;
}
.excluding-vat {
  margin-left: 10px;
}
.ProductForm__AddToCart.Button.Button--secondary.Button--full{
  background-color: black;
}
.ProductForm__AddToCart {
  border-radius: 5px;
}
.ProductForm__BuyButtons {
  width: calc(100% - 100px);
}
.ProductForm__QuantitySelector {
  width: 100px;
}
.QuantitySelector--large .QuantitySelector__Button {
  padding: 10px 10px;
  /*border: 1px solid var(--border-color);*/
}
.excluding-vat {
  position: relative;
  margin-left: 5px!important;
  display: inline-block;
  font-size: 0.9em; 
  color: #333!important; 
}

.ProductForm__AddToCart {
  font-size: 13px;
  font-weight: 600;
  padding: 14px 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  border-radius: 5px;
  text-transform: uppercase;
}

.AddToCart__Content {
  display: flex;
  align-items: center;
  gap: 5px;
}

.AddToCart__Icon {
  width: 16px;
  height: 16px;
  margin-top: -3px;
  object-fit: contain;
  display: block;
}

.AddToCart__Text {
  white-space: nowrap;
}

.AddToCart__Price {
  white-space: nowrap;
  font-weight: 600;
}

.Button__SeparatorDot::before {
  content: "•";
  margin: 0 8px;
  color: #999;
}

/* Special Order */

.special-order-box {
  margin-left: -110px;
  margin-top: 20px;
  border: 1px solid #f5a623;
  background-color: #fdfaf4;
  padding: 12px 16px;
  border-radius: 8px;
  font-family: system-ui, sans-serif;
}

.special-order-header {
  display: flex;
  align-items: center;
  font-size: 14px;
  /*margin-bottom: 4px;*/
  color: #000;
}

.orange-status-dot {
  margin-bottom: 2px;
  width: 10px;
  height: 10px;
  background-color: #f5a623;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
  flex-shrink: 0;
}
.green-status-dot {
  width: 10px;
  height: 10px;
  background-color: #28a745;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
  flex-shrink: 0;
}
.special-order-subtext {
  /*font-size: 14px; too big from Strafe */
  font-size: 13px;
  line-height: 17px;
  color: #555;
}

/* In Stock */

.in-stock-box {
  margin-left: -110px;
  margin-top: 20px;
  border: 1px solid #00c853;
  background-color: #f5fdf8;
  padding: 12px 16px;
  border-radius: 8px;
  font-family: system-ui, sans-serif;
  
}
@media and (min-width: 769px){
  .in-stock-box, .special-order-box, .restock-info {
    width: 563px;
  }
}
.in-stock-header {
  display: flex;
  align-items: center;
  font-size: 14px;
  color: #000;
}

.status-dot.green {
  margin-bottom: 2px;
  width: 10px;
  height: 10px;
  background-color: #00c853;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
  flex-shrink: 0;
}

.status-dot.orange {
  margin-bottom: 2px;
  width: 10px;
  height: 10px;
  background-color: #f5a623;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
  flex-shrink: 0;
}

.in-stock-subtext {
  font-size: 14px;
  color: #555;
}


/********/

/**** Discount badge ****/

.reduction-pc-main {
  color: #d10000;
  background-color: transparent!important;
  position: relative;
}

.promo-badge {
  display: flex;
  padding: 8px 12px;
  flex-direction: row; /* changed to row so icon and text are side by side */
  align-items: center;
  gap: 8px; /* smaller gap to match your screenshot */
  border-radius: 100px;
  background: rgba(209, 0, 0, 0.05);
}

.promo-icon {
  color: #D10000; /* Manley red */
  font-size: 18px;
  line-height: 1;
}

.promo-text {
  color: #D10000;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
}

/********/

/**** Check stock availability button ****/

#stock-availability {
  display: block;
  /*padding-top: 10px;*/
}

#check-stock-availability-container {
  margin-left: -110px;
  margin-top: 15px;
  width: 563px;
}
.restock-info {
  display: flex;
  gap: 2px;
  align-items: center;
  position: relative;
  margin-left: -110px;
  margin-top: 20px;
  padding-bottom: 20px;
}

#PBFPopup {
  padding-bottom: 20px;
  position: relative;
  margin-bottom: 20px!important;
      background: #fafafa!important;
    margin-left: 20px!important;
    max-width: 563px!important;
    border-radius: 8px!important;
    border 1px solid #fafafa!important;
}
#rev-sep {
  display: none!important;
}
@media (max-width: 768px) {
  #PBFPopup {
    margin-top: 25px!important;
}
.pbf-finance-widget-button {
  min-width: 199px!important;
}
#PBFPopup > img:nth-child(1) {
  margin-bottom: 20px;
}
}
.restock-info::after, #PBFPopup::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 93%;
  border-bottom: 0.5px solid #6A6A6A33;
}

.restock-info .material-symbols {
  position: relative;
  width: 24px;
  height: 24px;
}

.restock-info .frame {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 2px;
  position: relative;
  flex: 1;
  flex-grow: 1;
}

.restock-info .restock-date {
  position: relative;
  align-self: stretch;
  margin-top: 0px;
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  color: var(--kmr-black);
  font-size: 14px;
  letter-spacing: 0;
  line-height: 18px;
}

.restock-info .container {
  display: inline-flex;
  justify-content: center;
  gap: 8px;
  padding: 14px 30px;
  flex: 0 0 auto;
  border-radius: 10px;
  border: 2px solid;
  border-color: var(--kmr-black);
  align-items: center;
  position: relative;
}

.restock-info .add-to-cart {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  position: relative;
  flex: 0 0 auto;
}

.restock-info .add-to-cart-text {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  margin-bottom: -4px!important;
  font-family: var(--desktop-button-text-font-family);
  font-weight: var(--desktop-button-text-font-weight);
  color: var(--kmr-black);
  font-size: 16px;
  text-align: center;
  letter-spacing: var(--desktop-button-text-letter-spacing);
  line-height: var(--desktop-button-text-line-height);
  white-space: nowrap;
  font-style: var(--desktop-button-text-font-style);
}



/********/

/**** Why Choose KMR block ****/

.why-choose-us-wrapper {
  position: relative;
  padding-bottom: 20px;
}

.why-choose-us-wrapper::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: -110px; /* Shift just the border left */
  width: calc(100% + 110px); /* Extend width so it reaches fully */
  border-bottom: 0.5px solid #6A6A6A33;
}

.why-choose-us {
  margin-left: -110px;
  background: #fafafa;
  padding: 18px;
    margin-top: 20px;
  border-radius: 8px;
  border: 1px solid #6A6A6A33;
}

.why-choose-us-list {
  font-family: Helvetica;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.why-choose-us-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1 1 calc(50% - 20px); /* two per row on desktop */
}

.why-choose-us-list img {
  flex-shrink: 0;
  width: 14px;
  height: 14px;
}

@media (max-width: 768px) {
  .why-choose-us-list {
    flex-direction: column;
  }
  
  .why-choose-us-list li {
    flex: 1 1 100%;
  }
}


/********/

/**** Product Key Details & Benefits (product-key-benefits.liquid) ****/

.product-benefits {
  max-width: 1440px;
  margin: 0 auto;
  padding-top: 120px;
  /*padding-inline: 20px;*/
}

.product-benefits-header {
  text-align: center;
  margin-bottom: 40px;
}

.section-heading {
  all: unset;
  font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-size: var(--desktop-h2-heading-font-size);
  letter-spacing: var(--desktop-h2-heading-letter-spacing, -0.3px);
  line-height: var(--desktop-h2-heading-line-height);
  color: var(--kmr-black);
  font-style: var(--desktop-h2-heading-font-style);
}

.product-benefits-list {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  justify-content: space-between;
}

.product-benefit {
  background-color: var(--kmr-white);
  flex: 1 1 calc(33.333% - 20px);
  display: flex;
  flex-direction: column;
  padding: 40px;
  box-sizing: border-box;
}

.benefit-icon {
  width: 30px;
  height: 30px;
  margin-bottom: 10px;
}

.benefit-title {
  text-transform: uppercase;
  font-family: "gothambold";
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: var(--kmr-black);
  margin: 0 0 14px; 
}

.benefit-description {
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  font-size: 14px;
  line-height: 23.1px;
  color: var(--kmr-grey);
  margin: 0;
}

/********/

/**** Special Product Details and Features (special-product-details.liquid) ****/

.special-product-details {

  max-width: 1440px;
  margin: 0 auto;
padding: 133px 0px 0;

  position: relative;
  overflow: hidden;
  text-align: center;
}

.special-heading, #special-details-heading {
  font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-size: var(--desktop-h2-heading-font-size);
  color: var(--kmr-black);
  line-height: var(--desktop-h2-heading-line-height);
  letter-spacing: -0.3px;
  margin-bottom: 40px;
}

.special-details-carousel {
  display: flex;
  gap: 20px;
  justify-content: space-between;
  flex-wrap: wrap;
}

.detail-slide {
  background-color: #fafafa;
  flex: 1 1 calc(33.333% - 20px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  /*background: var(--kmr-white);*/
  /*padding: 20px;*/
  box-sizing: border-box;
  text-align: left;
}

.detail-image {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.detail-title {
  font-family: "gothambold";
  text-transform: uppercase;
  font-size: 18px;
  line-height: 28px;
  color: var(--kmr-black);
  font-weight: 400;
  margin: 0;
}

.detail-description {
  font-family: "Helvetica-Regular", Helvetica;
  font-size: 14px;
  line-height: 23.1px;
  color: var(--kmr-grey);
  margin: 0;
}


@media (max-width: 768px) {
  .special-heading {
    margin-bottom: -30px !important;
  }

  /* Flickity takes over */
  ..special-details-carousel.flickity-enabled {
    display: block;
    padding-bottom: 40px; /* space so content doesn’t overlap dots */
    position: relative;   /* make container the positioning context */
  }

  .special-details-carousel .detail-slide {
    width: 100% !important;
    margin-right: 0;
    box-sizing: border-box;
    padding: 0 20px; /* side gutters */
  }

  .special-details-carousel .flickity-viewport {
    overflow: visible; /* stop clipping */
  }

  .special-details-carousel .flickity-page-dots {
    position: absolute !important;
    bottom: 10px;   /* distance from bottom of the carousel */
    left: 0;
    right: 0;
    display: flex !important;
    justify-content: center;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
    opacity: 1;
    visibility: visible;
    z-index: 2;
  }

  .special-details-carousel .flickity-page-dots .dot {
    width: 20px;
    height: 6px;
    border-radius: 0;
    margin: 0 0!important;
    background: #e9e9e9;
    cursor: pointer;
    transition: all 0.3s ease;
  }


.special-details-carousel .flickity-page-dots .dot.is-selected {
    background: var(--kmr-black);
    width: 48px;
  
  }
  .special-details-carousel .detail-slide {
    width: 100% !important; margin-right: 0; box-sizing: border-box; padding: 0 20px;
  }
}

/* Hide dots by default (desktop) */
.special-details-carousel .flickity-page-dots {
  display: none;
}





/********/

/**** Product Videos (product-videos.liquid) ****/

nav.video-tabs .video-tab {
  display: inline-block;
  text-decoration: none !important;
  border-bottom: 2px solid transparent;
  padding-bottom: 4px;
}

nav.video-tabs .video-tab.active {
  border-bottom-color: #d10000;
}

.product-videos {
  max-width: 1440px;
  margin: 0 auto;
  padding: 133px 0px 0;
  display: flex;
  flex-direction: column;
  gap: 40px;
  border-radius: 4px;
}

.product-videos-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
}

.product-videos-title {
  font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-size: var(--desktop-h2-heading-font-size);
  color: var(--kmr-black);
  line-height: var(--desktop-h2-heading-line-height);
  font-style: var(--desktop-h2-heading-font-style);
  margin: 0;
}

.video-tab {
  color: #d10000;
}

.video-tabs {
  display: flex;
  gap: 28px;
  /*margin-bottom: 27px;*/
}

.video-tab {
  font-family: var(--desktop-button-text-font-family);
  font-weight: var(--desktop-button-text-font-weight);
  font-size: var(--desktop-button-text-font-size);
  line-height: var(--desktop-button-text-line-height);
  letter-spacing: var(--desktop-button-text-letter-spacing);
  font-style: var(--desktop-button-text-font-style);
  background: none;
  border: none;
  color: var(--kmr-grey);
  cursor: pointer;
  white-space: nowrap;
  padding: 0;
  text-decoration: none;
  transition: color 0.2s ease;
}

.video-tab.active {
  color: var(--kmr-black);
  text-decoration: underline;
}

.video-preview {
  width: 100%;
}

.video-thumbnail {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 4px;
  object-fit: cover;
}

/********/

/**** Product Insights (product-insights.liquid) ****/

#insights-heading {
  margin-bottom: 30px;
}

.insights-header {
  line-height: 1!important;
}

.insights-content.carousel-cell {

  box-sizing: border-box;
}
/*@media (min-width: 1440px) {

    min-width: 1200px;
  max-width: 1440px;
}
}*/

.insights-carousel {
    padding-top: 133px;
  /*padding-left: 60px;
  padding-right: 60px;*/
}

.insights {
  max-width: 1440px;
  margin: 0 auto;
  padding: 80px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 40px;
}

.insights-title {
  font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-size: var(--desktop-h2-heading-font-size);
  color: var(--kmr-black);
  line-height: var(--desktop-h2-heading-line-height);
  font-style: var(--desktop-h2-heading-font-style);
  letter-spacing: var(--desktop-h2-heading-letter-spacing, -0.3px);
  margin: 0;
}

.insights-content {
  background-color: var(--kmr-light-grey);
  padding: 60px 40px;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
.insights-header {
  text-align: center;
}
.insights-avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  object-fit: cover;
}

.insights-author {
  font-family: "gothambook";
  font-size: 12px;
  line-height: 28px;
  color: var(--kmr-red);
  font-weight: 400;
}

.insights-quote {
  text-align: center;
  text-transform: uppercase;
  font-family: "gothambold";
  font-size: 18px;
  line-height: 28px;
  color: var(--kmr-black);
  font-weight: 400;
  margin: 0;
  quotes: "“" "”" "‘" "’";
}

.insights-description {
  font-family: "Helvetica-Regular", Helvetica;
  font-size: 14px;
  line-height: 23.1px;
  color: var(--kmr-grey);
  font-weight: 400;
  margin: 0;
}

.insights-experience {
  font-family: "gothambook", Helvetica;
  font-size: 12px;
  line-height: 28px;
  color: var(--kmr-black);
  font-weight: 400;
}

.insights-pagination {
  display: flex;
  gap: 6px;
  justify-content: center;
  margin-top: 20px;
}

.dot {
  width: 24px;
  height: 6px;
  background-color: var(--kmr-light-grey);

}

.dot.active {
  width: 48px;
  background-color: var(--kmr-black);
}
/* Always give the outer wrapper a little breathing room on small screens */
.carousel-wrapper {
  padding-inline: 10px; /* 10px left + right under 1480px */
}

/* Center the viewport and clamp it to 1440px on large screens */
.carousel-wrapper .flickity-viewport {
  max-width: 1440px;
  margin-inline: auto; /* centers it */
}

/* Make each slide fill the available viewport width */
.insights-content.carousel-cell {
  width: 100%;
  box-sizing: border-box; /* keeps your internal padding sane */
}

/* On wide screens (≥1480px), remove the side padding so the 1440px can truly center */
@media (min-width: 1480px) {
  .carousel-wrapper {
    padding-inline: 0;
  }
}


/********/

/**** Audio Playlist (snippets/audio-playlist.liquid) ****/

.soundcloud-embed {
  width: 100%;
}

.audio-playlist {
  max-width: 1440px;
  margin: 0 auto;
  padding: 80px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 40px;
  margin-bottom: -100px;
}

.audio-playlist-title {
  font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-size: var(--desktop-h2-heading-font-size);
  color: var(--kmr-black);
  line-height: var(--desktop-h2-heading-line-height);
  font-style: var(--desktop-h2-heading-font-style);
  letter-spacing: var(--desktop-h2-heading-letter-spacing, -0.3px);
  margin: 0;
}

/********/

/**** Product FAQs ****/

.product-faqs {
  max-width: 1440px;
  margin: 0 auto;
  padding: 80px 20px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  text-align: center;
}

.product-faqs-title {
  font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-size: var(--desktop-h2-heading-font-size);
  line-height: var(--desktop-h2-heading-line-height);
  color: var(--kmr-black);
  font-style: var(--desktop-h2-heading-font-style);
  letter-spacing: var(--desktop-h2-heading-letter-spacing, -0.3px);
  margin: 0;
}

.product-faqs-columns {
  display: flex;
  gap: 40px;
  flex-wrap: wrap;
  justify-content: space-between;
}

.product-faqs-column {
  flex: 1 1 48%;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.product-faqs-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  background-color: var(--kmr-white);
  border: 1px solid var(--kmr-light-grey);
  border-radius: 10px;
}

.product-faqs-question {
  font-family: var(--desktop-button-text-font-family);
  font-weight: var(--desktop-button-text-font-weight);
  font-size: var(--desktop-button-text-font-size);
  line-height: var(--desktop-button-text-line-height);
  letter-spacing: var(--desktop-button-text-letter-spacing);
  color: var(--kmr-black);
  margin: 0;
  flex: 1;
  text-align: left;
}

.product-faqs-icon {
  width: 16.5px;
  height: 9px;
  flex-shrink: 0;
}

/********/

/**** Product Audio (product-audio.liquid) ****/

.product-audio {
  max-width: 1440px;
  margin: 0 auto;
}

/********/

/**** Related Products (snippets/related-products.liquid) ****/

.related-products > header:nth-child(1) {
  line-height: 1;
}

.related-products .product-title {
  font-family: "Helvetica-Regular", Helvetica;
  font-size: 18px;
}

.related-products .discounted {
  color: #d10000;
}

.related-products .original {
  text-decoration: line-through;
  font-size: 16px;
}

.related-products .price {
  margin-bottom: -5px;
  font-family: "gothambold";
  font-size: 18px;
}

.related-products .ex-vat {
  font-family: "Helvetica";
  font-size: 12px;
}

.related-products .badge {
  font-weight: bold;
}

.related-products {
  max-width: 1440px;
  margin: 0 auto;
  padding-top: 133px;
}

.related-products h2 {
  text-transform: uppercase;
  text-align: center;
  font-size: var(--desktop-h2-heading-font-size);
  margin-bottom: 30px;
}

.related-products-carousel {
  display: block;
}

.related-product-card {
  width: 320px;
  flex: none;
  margin-right: 20px;
  background: #fff;
  border: 1px solid var(--kmr-light-grey);
  border-radius: 8px;
  text-align: left;
}

.related-product-card img {
  width: 100%;
  display: block;
}

.product-info {
  padding-top: 25px;
}

.badge {
  position: absolute;
  top: 10px;
  right: 10px;
  background: var(--kmr-black);
  color: #fff;
  padding: 4px 8px;
  font-size: 12px;
  border-radius: 100px;
}

.badge.sale { background: var(--kmr-red); }

.related-products-dots {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: 20px;
}

.related-products-dots button {
  width: 24px;
  height: 6px;
  background: var(--kmr-light-grey);
  border: none;
  cursor: pointer;
  transition: background-color 0.2s ease, width 0.2s ease;
}

.related-products-dots button.active {
  width: 48px;
  background: var(--kmr-black);
}

.related-carousel-wrapper {
  position: relative;
  overflow: hidden; /* ensures fades overlay correctly */
}

.fade-left,
.fade-right {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 80px; /* adjust for strength of fade */
  pointer-events: none; /* ensures you can still interact with products */
  z-index: 5;
}

.fade-left {
  z-index: 4;
  left: 0;
  background: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}

.fade-right {
  z-index: 4;
  right: 0;
  background: linear-gradient(to left, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}

.related-products-dots {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: 20px;
}

.related-products-dots button {
  width: 24px;
  height: 6px;
  background-color: var(--kmr-light-grey);
  border: none;
  cursor: pointer;
  transition: all 0.3s ease; /* width & color animation */
}

.related-products-dots button.active {
  width: 48px;
  background-color: var(--kmr-black);
}



/********/
/**** Related Products v2 (related-products-v2.liquid) ****/

.related-products-v2 {
  display: flex;
  margin: 0 auto;
  flex-direction: column;
  max-width: 1440px;
  align-items: center;
  justify-content: center;
  gap: 40px;
  position: relative;
}
.related-products-v2 .related-products-v2-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}
.related-products-v2 .div-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 20px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}
.related-products-v2 .text-wrapper {
  position: relative;
  align-self: stretch;
  margin-top: -1.00px;
  font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  color: var(--kmr-black);
  font-size: var(--desktop-h2-heading-font-size);
  text-align: center;
  letter-spacing: var(--desktop-h2-heading-letter-spacing);
  line-height: var(--desktop-h2-heading-line-height);
  font-style: var(--desktop-h2-heading-font-style);
}
.related-products-v2 .overlap-wrapper {
  position: relative;
  width: 1442px;
  height: 425px;
  margin-left: -1px;
  margin-right: -1px;
}
.related-products-v2 .overlap {
  position: relative;
  height: 425px;
}
.related-products-v2 .related-product-wrapper {
  position: absolute;
  width: 1442px;
  height: 424px;
  top: 1px;
  left: 0;
  overflow: hidden;
}
.related-products-v2 .related-product {
  display: inline-flex;
  align-items: flex-start;
  gap: 20px;
  position: relative;
  left: -681px;
}
.related-products-v2 .div {
  display: flex;
  flex-direction: column;
  width: 320px;
  align-items: flex-start;
  gap: 25px;
  position: relative;
}
.related-products-v2 .related-product-2 {
  position: relative;
  align-self: stretch;
  width: 100%;
  height: 320px;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--kmr-light-grey);
  background-image: url(./img/related-product-image-12.png);
  background-size: cover;
  background-position: 50% 50%;
}
.related-products-v2 .img {
  position: absolute;
  width: 296px;
  height: 296px;
  object-fit: cover;
}
.related-products-v2 .related-product-3 {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  padding: 8px 12px;
  position: absolute;
  top: 20px;
  left: 245px;
  background-color: var(--kmr-black);
  border-radius: 100px;
}
.related-products-v2 .related-product-4 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  position: relative;
}
.related-products-v2 .related-product-5 {
  font-family: "gothambook", Helvetica;
  font-weight: 400;
  color: var(--kmr-white);
  font-size: 12px;
  letter-spacing: -0.3px;
  line-height: 14px;
  white-space: nowrap;
}
.related-products-v2 .related-product-6 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 12px;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}
.related-products-v2 .related-product-7 {
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  color: var(--kmr-black);
  font-size: 18px;
  line-height: 23.1px;
  white-space: nowrap;
}
.related-products-v2 .related-product-8 {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
}
.related-products-v2 .related-product-9 {
  font-family: "gothambook", Helvetica;
  font-weight: 400;
  color: var(--kmr-black);
  font-size: 18px;
  line-height: 23.1px;
  white-space: nowrap;
}
.related-products-v2 .related-product-10 {
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  color: var(--kmr-grey);
  font-size: 12px;
  margin-top: -5px;
  line-height: 23.1px;
  white-space: nowrap;
}
.related-products-v2 .rectangle,
.related-products-v2 .vector {
  position: absolute;
}
.related-products-v2 .review-pagination {
  position: relative;
  width: 168px;
  height: 5.6px;
}
.related-products-v2 .pagination-dot,
.related-products-v2 .pagination-dot-2,
.related-products-v2 .pagination-dot-3,
.related-products-v2 .pagination-dot-4,
.related-products-v2 .pagination-dot-5 {
  position: absolute;
  width: 24px;
  height: 6px;
  top: 0;
  background-color: var(--kmr-light-grey);
}
.related-products-v2 .pagination-dot {
  left: 0;
  width: 48px;
  background-color: var(--kmr-black);
}
.related-products-v2 .pagination-dot-2 { left: 54px; }
.related-products-v2 .pagination-dot-3 { left: 84px; }
.related-products-v2 .pagination-dot-4 { left: 114px; }
.related-products-v2 .pagination-dot-5 { left: 144px; }

/********/

/**** BOOST RELATED PRODUCTS ****/

.boost-sd__slider .slick-dots li button::before {
  content: none !important;
}
.boost-sd__product-item {
  background: #fafafa;
}
#productpage-412612 .boost-sd__recommendation-title {
  color: #000000!important;
}

/* Base container */
.slick-dots {
  display: flex !important;        /* line them up */
  justify-content: center!important;         /* center under carousel */
  gap: 6px!important;                        /* space between pills */
  margin: 16px 0 0!important;                /* tweak spacing */
  padding: 0!important;
  list-style: none!important;
}

/* Reset list items */
.slick-dots li {
  margin: 0!important;
  padding: 0!important;
}

/* Dot button base */
.slick-dots li button {
  width: auto!important;
  height: 6px!important;
  padding: 0 14px!important;                 /* horizontal pill shape */
  border: none!important;
        /* pill */
  background-color: #ddd!important;
  font-size: 0!important;                    /* hide number text */
  cursor: pointer!important;
  transition: all 0.3s ease!important;
}

/* Active state */
.slick-dots li.slick-active button {
  background-color: #000!important;          /* active fill */
  width: auto!important;
  padding: 0 24px!important;                 /* slightly longer pill */
}

/* Dots container */
.boost-sd__slider .slick-dots{
  display:flex !important;
  justify-content:center;
  gap:8px;                 /* space between pills */
  margin:16px 0 0;
  padding:0;
  list-style:none;
}

/* Reset list items */
.boost-sd__slider .slick-dots li{
  margin:0;
  padding:0;
  width:auto;              /* don’t let themes force widths */
}

/* Pill base */
.boost-sd__slider .slick-dots li button{
  display:block;           /* ensures border-radius applies cleanly */
  position:relative;       /* cancel any abs. pos assumptions */
  width:56px;              /* ← pill length */
  height:6px;             /* ← pill thickness */
  padding:0;               /* ← IMPORTANT: no padding */
  border:0;
   /* pill shape */
  background:#d9d9d9;      /* inactive colour */
  font-size:0;             /* hide numbers */
  line-height:0;           /* no stray line box */
  cursor:pointer;
  transition:background .25s ease;
  overflow:hidden;         /* guards against odd radius clipping */
}
ul.slick-dots {
  position: static;
  margin-top: 40px!important;
}
/* Active pill */
.boost-sd__slider .slick-dots li.slick-active button{
  background:#000;
}
/*.boost-sd__button {
  display: none!important;
}*/
.kmr-related-products .boost-sd__product-title {
  font-family: Helvetica!important;
  font-size: 18px!important;
}
.kmr-related-products .boost-sd__product-info {
    text-align: left!important;
    justify-content: left!important;
}

.kmr-related-products .boost-sd__format-currency {
    color: #000000!important;
    font-size: 18px !important;
    font-family: gothambold!important;
}

.kmr-related-products .boost-sd__product-price-stack {
  align-items: start!important;
}
.kmr-related-products .boost-sd__exvat {
    font-family: helvetica !important;
    font-size: 12px !important;
    color: #6a6a6a !important;
}
/********/

/**** Sticky CTA Container ****/

.StickyCTA {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #fff;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
    padding: 10px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 1000;
}

/* Inner Wrapper */
.StickyCTA__Actions {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 15px;
}
.StickyCTA__Content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    flex-wrap: no-wrap;
}

/* Product Info */
.StickyCTA__Info {
    flex: 1;
    display: flex;
    align-items: center;
    min-width: 0;
}
.StickyCTA__Info img {
  margin-right: 20px;
}

.StickyCTA__Image {
    width: 60px;
    height: auto;
    margin-right: 10px;
}

.StickyCTA__Details {
    display: flex;
    flex-direction: column;
}

.StickyCTA__Title {
    font-size: 16px;
    /*font-weight: bold;*/
    margin-bottom: 3px;
}

.StickyCTA__Subtitle {
    margin: 0;
    font-size: 14px;
    color: #666;
}

.StickyCTA__Stock {
    margin: 0;
    font-size: 12px;
    color: #000000;
    font-weight: bold;
    display: flex;
    align-items: center;
}
.StickyCTA__OutStock {
    margin: 0;
    font-size: 12px;
    color: #000000;
    font-weight: bold;
    display: flex;
    align-items: center;
}

/* Pricing */
.StickyPrice {
    text-align: right;
    margin-right: 15px;
}

.StickyProductPrice {
    font-size: 18px;
    font-weight: bold;
    display: block;
}

.StickyExcludingVAT {
    font-size: 14px;
    color: #666;
}

/* Quantity Selector */
.StickyQuantitySelector {
    display: flex;
    align-items: center;
    background: #f7f7f7;
    border-radius: 5px;
    padding: 5px;
}

.StickyQuantityButton {
    background: none;
    border: none;
    font-size: 18px;
    cursor: pointer;
    padding: 5px;
    width: 30px;
}

.StickyQuantityInput {
    width: 40px;
    text-align: center;
    font-size: 16px;
    border: none;
    background: none;
}

/* Add to Cart Button */
.StickyCTA__AddToCart {
    background: black;
    color: white;
    border: none;
    padding: 10px 20px;
    font-size: 16px;
    display: flex;
    align-items: center;
    cursor: pointer;
    border-radius: 5px;
    font-weight: bold;
}

.CartIcon {
    width: 20px;
    height: 20px;
    fill: white;
    margin-right: 8px;
}

/* Put subtitle + stock on one line */
.Sticky__Meta{
  display:flex;
  align-items:center;
  gap:12px;         /* space between subtitle and the dot/text */
  flex-wrap:wrap;   /* stack on mobile if needed */
}

/* Push the stock message to the far side of the meta row */
.StickyCTA__Stock{
  margin:0 0 0 auto;       /* moves it to the right within .Sticky__Meta */
  display:flex;
  align-items:center;
  font-weight:700;
  font-size:12px;
  white-space:nowrap;      /* keep it on one line */
  text-transform:uppercase;
}

/* the green dot */
.green-status-dot{
  width:10px; height:10px;
  border-radius:50%;
  background:#1bcf3a;
  display:inline-block;
  margin-right:8px;
}

/* mobile: stack subtitle above stock */
@media (max-width: 768px){
  .Sticky__Meta{ flex-direction:column; align-items:flex-start; }
  .StickyCTA__Stock{ margin-left:0; }
}

/* small fix: typo */
.StickyCTA__Content { flex-wrap: nowrap; } /* not 'no-wrap' */

.Sticky__Meta .StickyCTA__Stock, .Sticky__Meta .StickyCTA__OutStock {
  margin-left: 80px;
}

/********/

/**** HOME PAGE ****/

/**** Hero Banner (sections/home-hero-banner.liquid) ****/

.hero-split {
  display: flex;
  width: 100%;
  height: 484px;
  background-color: var(--kmr-black);
  color: white;
  font-family: "gothambook", Helvetica, sans-serif;
  overflow: hidden;
}

.hero-left {
  flex: 1;
  padding: 4rem clamp(2rem, 5vw, 6rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2rem;
  background-color: var(--kmr-black);
}

/* RIGHT SIDE (image or video container) */
.hero-right {
  flex: 1;
  position: relative;
  overflow: hidden;
  background-color: var(--kmr-black);
}

/* The media layer fills hero-right */
.hero-right-media {
  position: absolute;
  inset: 0;
  z-index: 0;
}

/* Image fallback styles */
.hero-right-media--image {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Video iframe fills */
.hero-video-element {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

/* Desktop-only overlay */
@media (min-width: 1024px) {
  .hero-right::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      to right,
      var(--kmr-black) 0%,
      rgba(0, 0, 0, 0) 35%
    );
    z-index: 1;
    pointer-events: none;
  }
}

/* Kill overlay on mobile/tablet */
@media (max-width: 1023px) {
  .hero-right::before,
  .hero-right::after {
    content: none !important;
    background: none !important;
    display: none !important;
  }
}

.experience-header {
  font-size: 0.875rem;
  color: var(--kmr-red);
  text-transform: uppercase;
  letter-spacing: -0.3px;
}

.experience-title {
  font-size: 3rem;
  /*font-weight: bold;*/
  line-height: 1.2;
  margin: 0;
}

.experience-subtext {
  font-size: 1rem;
  line-height: 1.5;
  max-width: 36rem;
  color: white;
  margin: 0;
}

.experience-buttons {
  display: flex;
  gap: 1rem;
  font-size: 16px;
  font-family: Helvetica;
}

.button {
  padding: 0.875rem 2rem;
  border-radius: 8px;
  font-weight: bold;
  font-size: 1rem;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  display: inline-block;
}

.button.red {
  background-color: var(--kmr-red);
  color: white;
}

.button.light {
  background-color: white;
  color: black;
}

.trustpilot {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.9rem;
  font-weight: 600;
}

.trustpilot .stars {
  height: 24px;
}

/* MOBILE */
@media (max-width: 768px) {
  .hero-split {
    flex-direction: column;
    height: auto;
  }

  .hero-right {
    width: 100%;
    height: 0;              /* key: aspect ratio box */
    padding-top: 56.25%;    /* 16:9 */
  }

  /* Ensure media fills the aspect ratio box */
  .hero-right-media,
  .hero-video-element {
    position: absolute;
    inset: 0;
  }

  .hero-left {
    padding: 2rem 1.25rem;
    gap: 1.5rem;
  }

  .experience-buttons {
    flex-direction: column;
    align-items: stretch;
    gap: 1rem;
  }

  .button {
    width: 100%; /* only applies on mobile */
  }

  .experience-title {
    font-size: 2rem;
    line-height: 1.3;
  }

  .experience-subtext {
    font-size: 1rem;
    line-height: 1.5;
  }

  .trustpilot {
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    text-align: center;
  }

  .trustpilot .label {
    width: 100%;
    font-size: 0.9rem;
  }

  .trustpilot .stars {
    height: 22px;
  }
}

/* Make the video behave like background-cover */
.hero-right-media--video {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
}

/* Scale + crop the iframe to remove top/bottom bars */
.hero-right-media--video .hero-video-element {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  border: 0;
  /*transform: translate(-50%, -50%) scale(1.25); */
  transform-origin: center;
}
.hero-right-media--video {
  pointer-events: none;
}
@media (min-width: 768px){
  .hero-container {
  max-width: 50%;
}
}
/* Make the right column a container so we can size the iframe to *its* shape */
@supports (container-type: size) {
  .hero-right { 
    container-type: size;
  }

  .hero-right-media--video {
    position: absolute;
    inset: 0;
    overflow: hidden;
  }

  /* Default: fit HEIGHT (best when the column is tall/narrow) */
  .hero-right-media--video .hero-video-element {
    position: absolute;
    top: 50%;
    left: 50%;
    border: 0;
    transform: translate(-50%, -50%);
    height: 100cqh;
    width: 177.7778cqh; /* 16/9 * height */
  }

  /* If the column is wide enough, fit WIDTH instead */
  @container (min-aspect-ratio: 16 / 9) {
    .hero-right-media--video .hero-video-element {
      width: 100cqw;
      height: 56.25cqw; /* 9/16 * width */
    }
  }
}

.hero-right-media--video,
.hero-right-media--video .hero-video-element,
.hero-right-media--video video {
  width: 100%;
  height: 100%;
}

.hero-right-media--video {
  overflow: hidden;
}

.hero-right-media--video .hero-video-element,
.hero-right-media--video video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

/********/

/**** Popular Categories Carousel (sections/popular-categories-carousel.liquid) ****/

#shopify-section-template--27014524076380__popular_categories_carousel_ti3nJp {
  background-color: #fafafa;
}

.popular-categories {
  background-color: #fafafa;
  /*padding-top: 50px;*/
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0 auto;
  gap: 40px;
}
@media (max-width: 768px){
    .popular-categories {
    /*gap: 20px;*/
    gap: 0;
  }
}

.popular-categories-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 28px;
  width: 100%;
  margin-top: 100px;
}
@media (max-width: 768px){
  .popular-categories-wrapper {
      margin-top: 50px;
  }
}

.popular-categories .div-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 20px;
  width: 100%;
}

#popular-categories-heading {
  text-transform: uppercase;
}

.popular-categories .text-wrapper {
  font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-size: var(--desktop-h2-heading-font-size);
  color: var(--kmr-black);
  letter-spacing: var(--desktop-h2-heading-letter-spacing);
  line-height: var(--desktop-h2-heading-line-height);
  text-align: center;
  width: 100%;
}

.popular-categories .div {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 20px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.popular-category {
  flex: 0 0 calc(33.333% - 13.333px);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  height: 600px;
  /*padding: 40px;*/
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  scroll-snap-align: start;
  /*border-radius: 8px;*/
  color: var(--kmr-black);
  position: relative;
}

.popular-category-2 {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.popular-category-wrapper {
  display: flex;
  flex-direction: column;
}

.popular-category {
  display: flex;
  flex-direction: column;
  flex: 0 0 calc(33.333% - 13.333px);
  scroll-snap-align: start;
  /*border-radius: 8px;*/
  overflow: hidden;
  background: #fff; 
}

.popular-image-container {
  height: 600px; 
  background-color: var(--kmr-light-grey);
  background-size: contain;
  background-position: center;
  /*border-top-left-radius: 8px;
  border-top-right-radius: 8px;*/
  background-repeat: no-repeat;
}

.popular-category-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
  padding: 20px;
   background-color: var(--kmr-light-grey); 
}

.popular-category-3 {
  margin-bottom: -10px;
  text-transform: uppercase;
  font-size: 18px;
  /*font-family: var(--desktop-feature-copy-font-family);
  font-weight: var(--desktop-feature-copy-font-weight);
  font-size: var(--desktop-feature-copy-font-size);*/
  letter-spacing: var(--desktop-feature-copy-letter-spacing);
  line-height: var(--desktop-feature-copy-line-height);
}

.p {
  font-family: Helvetica, sans-serif;
  font-size: 14px;
  line-height: 23.1px;
}

.span {
  color: var(--kmr-grey);
}

.text-wrapper-2 {
  color: var(--kmr-black);
}

@media (max-width: 768px) {

  #popular-categories-heading {
    font-size: 20px;
  }
  .popular-categories .div {
    flex-wrap: wrap;
    overflow-x: visible;
    gap: 20px;
  }

  .popular-category {
    flex: 0 0 100%;
    height: auto;
    padding: 0;
  }

  .popular-image-container {
    height: auto;
    /*aspect-ratio: 1.5 / 1; */
    aspect-ratio: 1 / 1; 
  }

  .popular-category-info {
    padding: 20px;
  }

  .popular-category-3 {
    font-size: 1.1rem;
    line-height: 1.4;
  }

  .p {
    font-size: 0.95rem;
  }
}


/********/

/**** CTA 1 Carousel (sections/cta-1-carousel.liquid) ****/

/*@media (min-width: 769px){*/
.cta-1-carousel {
  margin-top: 50px!important;
  background-color: #fafafa;
}
/*}*/
@media (max-width: 768px){
  cta-1-carousel {
    margin-top: 0px;
    background-color: #fafafa;
  }
}

.flickity-custom-dots {
  display: flex !important;
  visibility: visible;
  opacity: 1;
  justify-content: center;
  gap: 8px;

  margin-top: 20px;
  position: relative;
  z-index: 1;
}

.flickity-custom-dots .dot {
  width: 24px;
  height: 6px;
  background-color: #f3f3f3;
  transition: background-color 0.3s, width 0.3s;
}

.flickity-custom-dots .dot.is-selected {
  background-color: #000;
  width: 48px;
}

@media (min-width: 769px) {
.flickity-page-dots {
  display: none !important;
}
}

.ProductForm__Variants {
  margin-top: -10px!important;
}
.ProductMeta__PriceList {
  margin-top: 2px!important;
}

.product_short-description {
  margin-top: 0px!important;
  margin-bottom: 5px;
  color: #6a6a6a;
}
.ProductMeta__PriceRow {
  /*display: flex;*/
  align-items: baseline;
  gap: 8px;
}
/* 1) Put the three bits on one line */
.ProductMeta__PriceRow .product-meta-pricecompare{
  display:flex;
  flex-wrap:nowrap;          /* don't drop to a new line */
  align-items:baseline;      /* nice text alignment */
  gap:12px;
}

/* 2) Stop theme from making them block-level */
.ProductMeta__PriceRow .ProductMeta__Price,
.ProductMeta__PriceRow .excluding-vat{
  display:inline-flex !important;
  margin:0;
  line-height:1.1;
}

/* 3) Keep “ex VAT” together */
.ProductMeta__PriceRow .excluding-vat{
  white-space:nowrap;
  opacity:.8;                /* optional styling */
}

/* (optional) control order: main, compare-at, ex VAT */
.ProductMeta__PriceRow .Price--highlight{ order:0; }
.ProductMeta__PriceRow .Price--compareAt{ order:1; }
.ProductMeta__PriceRow .excluding-vat{ order:2; }

/* Allow wrap on very small screens if needed */
@media (max-width: 640px){
  .ProductMeta__PriceRow .product-meta-pricecompare{ flex-wrap:wrap; }
}

.ProductMeta__PriceRow, .product-meta-pricecompare { display:block !important; } /* neutralize column flex parents */

.excluding-vat {
  top; 4px;
}

@media (max-width: 768px) {
  .Image--lazyLoaded, .Product__Meta-Container {
    border-radius: 8px;
  }
  .ProductForm {
    padding: 0!important;
  }
  .Product__Info {
    border-radius: 8px;
    margin-left: 16px;
    margin-right: 16px;
  }
.AspectRatio {
  padding-right: 40px;
  margin-top: 40px;
}
  .inventory-msg {
    display: none;
  }
  .Product__Meta-Container {
    padding-top: 0px;
    padding-left: 15px!important;
    padding-right: 15px!important;
    /*background-color: #fafafa;*/
    background-color: white;
  }

  .Product__SlideshowMobileNav {
    margin-top: 0px!important;
    margin-bottom: 43px;
  }

  /* MOBILE custom pill dots under main image */
.Product__SlideshowMobileNav .flickity-page-dots{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  margin:16px 0 0;
}

/* reset Flickity's default circles */
.Product__SlideshowMobileNav .flickity-page-dots .dot{
  appearance:none;
    border-radius: 0px!important;
  border:0;
  background:#e2e2e2;
  padding:0;
  margin:0;
  width:24px;                 /* inactive width */
  height:6px;
  opacity:.8;
  transition:width .3s ease, background-color .3s ease, opacity .3s ease;
}

/* hover/focus */
.Product__SlideshowMobileNav .flickity-page-dots .dot:hover,
.Product__SlideshowMobileNav .flickity-page-dots .dot:focus{
  opacity:1;
  outline:none;
}

/* active/selected state */
.Product__SlideshowMobileNav .flickity-page-dots .dot.is-selected{
  width:48px;                 /* active width */
  background:#000;            /* match project color if needed */
  opacity:1;
}

/* (optional) compact on smaller phones */
@media (max-width: 380px){
  .Product__SlideshowMobileNav .flickity-page-dots .dot{ width:18px; }
  .Product__SlideshowMobileNav .flickity-page-dots .dot.is-selected{ width:36px; }
}

/* (optional) hide the mobile arrows if you only want dots */
.Product__SlideshowMobileNav .Product__SlideshowNavArrow{
  display:none;
}
}

/*.flickity-page-dots {
  position: absolute;
  bottom: -40px;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 8px;
  padding-top: 12px;
  z-index: 10;
}

.flickity-page-dots .dot {
  width: 24px;
  height: 6px;
  border-radius: 3px;
  background-color: #f3f3f3;
  transition: background-color 0.3s, width 0.3s;
}

.flickity-page-dots .dot.is-selected {
  background-color: #000000;
  width: 48px;
}*/

#shopify-section-template--24867517858140__cta_1_carousel_9GLpjC {
  margin-top: 100px;
}

.cta-1-carousel { 
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

.cta-1-carousel .flickity-viewport {
  /*height: auto !important;*/
  min-height: 475px;
}

.carousel-wrapper {
  display: block;
}

.cta-slide {
  min-height: 475px;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
  /*padding: 80px 120px;*/
  background: #000;
  color: #fff;
  box-sizing: border-box;
}

.cta-slide-text {
  padding: 40px 0px 40px 100px;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 40px;
  z-index: 1;
  max-width: 50%;
}

.frame {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
@media (max-width: 768px){
  .frame {
    gap: 0;
  }
}

.cta-1-header {
  margin-top: 20px;
    font-family: var(--desktop-tagline-font-family);
  font-weight: var(--desktop-tagline-font-weight);
  font-size: var(--desktop-tagline-font-size);
  color: var(--kmr-red);
  letter-spacing: var(--desktop-tagline-letter-spacing);
  line-height: var(--desktop-tagline-line-height);
  font-style: var(--desktop-tagline-font-style);
  font-family: "Gotham", Helvetica, sans-serif;
  font-size: 12px;
  line-height: 14px;
  letter-spacing: -0.3px;
  color: #d10000;
  text-transform: uppercase;
}

.cta-1-campaign {
    font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-size: var(--desktop-h2-heading-font-size);
  color: var(--kmr-black);
  letter-spacing: var(--desktop-h2-heading-letter-spacing);
  line-height: var(--desktop-h2-heading-line-height);
  font-style: var(--desktop-h2-heading-font-style);
  color: #fff;
}

.cta-1-text-content {
  font-family: "gothambook", Helvetica, sans-serif;
  font-size: 14px;
  line-height: 23.1px;
  color: #f3f3f3;
}

.shop-products-button-wrapper {
  align-self: flex-start;
  background-color: #d10000;
  border-radius: 10px;
  padding: 14px 40px;
  display: inline-block;
  text-decoration: none;
  width: auto; 
}

.cta-slide .shop-products-button-wrapper {
  width: auto !important;
  max-width: fit-content;
}

.shop-products-button {
  font-family: "Helvetica-Bold", Helvetica, sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  line-height: 22.9px;
  white-space: nowrap;
  width: auto; 
}


.image-area {
  flex: 0 0 auto;
  position: relative;
  width: 646px;
  min-width: 646px;
  height: auto;
  transform: none;
  z-index: 1;
}

.confetti {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  max-width: 100%;
  z-index: 0;
  mix-blend-mode: luminosity;
}

.cta-1-image {
  position: relative;
  width: 100%;
  max-width: 100%;
  height: auto;
  z-index: 1;
  transform: none;
}

.discount-amount {
  position: absolute;
  width: 179px;
  height: 179px;
  bottom: 20px;
  right: 25%;
  border-radius: 50%;
  background: linear-gradient(180deg, rgba(26, 26, 26, 1) 0%, rgba(128, 128, 128, 0.15) 100%);
  overflow: hidden;
  transform: rotate(-21.44deg);
  z-index: 2;
}

.discount-amount::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 2.35px;
  border-radius: 50%;
  background: linear-gradient(180deg, #fff 0%, rgba(153, 153, 153, 0) 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  z-index: 1;
  pointer-events: none;
}

.element {
  position: absolute;
  width: 131px;
  height: 82px;
  top: 49px;
  left: 25px;
  transform: rotate(21.44deg);
}

.js-flickity {
  display: block !important;
  height: auto !important;
  opacity: 1;
  visibility: visible;
}

.flickity-slider {
  display: flex;
  align-items: stretch;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

.flickity-custom-dots {
  display: flex !important;
  position: relative;
  justify-content: center;
  gap: 8px;
  padding-top: 16px;
  /*z-index: 2;*/
  background: #fafafa;
}

@media (max-width: 768px) {
  .cta-slide .shop-products-button-wrapper
 {
  width: 100%!important;
  max-width: 100%!important;
 }
  .popular-image-container {
    background-size: contain;
    background-repeat: no-repeat;
  }

    .cta-1-carousel .flickity-viewport {
   /* height: auto !important;*/
      min-height: 600px;
  }

  .cta-1-carousel .flickity-slider {
    height: auto !important;
    align-items: flex-start;
  }

  .cta-slide {
    height: auto !important;
    min-height: unset;
  }

  .cta-slide {
    flex-direction: column;
    padding: 32px 20px;
    align-items: flex-start;
    gap: 32px;
  }

  .cta-slide-text {
    max-width: 100%;
    padding: 0;
    order: 1;
  }

  .cta-1-header {
    font-weight: bold;
    font-size: 12px;
    line-height: 14px;
    margin: 0 28px 20px 0;
  }

  .cta-1-campaign {
    font-size: 24px;
    line-height: 32px;
    margin: 0 0 16px;
  }

  .cta-1-text-content {
    font-size: 14px;
    line-height: 22px;
    margin: 0 0 28px;
  }

  .shop-products-button-wrapper {
    width: 100%;
    text-align: center;
    padding: 14px 40px;
  }

  .shop-products-button {
    width: 100%;
  }

  .image-area {
    width: 100%;
    min-width: auto;
    height: auto;
    order: 2;
    position: relative;
  }

  .cta-1-image {
    width: 100%;
    height: auto;
    display: block;
  }

  .confetti {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    z-index: 0;
  }

  .discount-amount {
    position: absolute;
    height: 120px;
    width: 120px;
    left: 16px;
    bottom: 43px;
    transform: rotate(-21.44deg);
    z-index: 2;
  }

  .element {
    width: 88px;
    height: 82px;
    top: 17px;
    left: 15px;
    transform: rotate(21.44deg);
    position: absolute;
  }

  .flickity-custom-dots {
    background: transparent;
    padding-top: 16px;
    position: relative;
    z-index: 3;
  }
  
    .cta-1-carousel .flickity-viewport {
    /*height: auto !important;*/
  }

  .cta-1-carousel .flickity-slider {
   /* height: auto !important;*/
    align-items: flex-start;
  }

  .cta-slide {
    height: auto !important;
    min-height: unset;
  }
}

/** ADDITIONAL CTA-1 STYLES **/

/* Make each slide take full viewport width (one-at-a-time) */
.cta-1-carousel .carousel-cell { width: 100%; }

/* If you had flex on the wrapper, Flickity adds its own structure—avoid forcing column */
.cta-1-carousel .cta-flickity { display: block; }

/* Optional: dot styling */
.flickity-custom-dots { display:flex; gap:.5rem; justify-content:center; margin-top:12px; }
.flickity-custom-dots .dot { width:24px; height:8px; border:0; background:#ccc; }
.flickity-custom-dots .dot.is-selected { background:#000; }


/* CTA1: text left, image right */
.section-container.cta-1-carousel .cta-slide{
  display: flex!important;
  align-items: stretch;
  gap: 32px;
}

.section-container.cta-1-carousel .cta-slide-text{
  flex: 1 1 55%;
  min-width: 0;
}

.section-container.cta-1-carousel .image-area{
  flex: 0 0 45%;
  display: flex;
  justify-content: flex-end;  /* push image to the right */
  align-items: center;
  min-width: 0;
  position: relative;
  
}

@media (min-width: 769px){
  .section-container.cta-1-carousel .image-area {
    padding-right: 40px;
  }
}

/* make sure the main image behaves */
.section-container.cta-1-carousel .cta-1-image{
  display: block;
  max-width: 100%;
  height: auto;
}

/* Mobile: stack (optional, but usually desired) */
@media (max-width: 768px){
  .section-container.cta-1-carousel .cta-slide{
    flex-direction: column;
  }
  .section-container.cta-1-carousel .image-area{
    justify-content: center;
  }
}

/* Fix: keep slide layout as row on desktop */
@media (min-width: 769px){
  .cta-1-carousel .cta-slide.carousel-cell{
    flex-direction: row !important;   /* override the column rule */
    justify-content: space-between;
    align-items: stretch;
  }
}

/* Make the slide a fixed height (or use min-height if you prefer) */
.cta-slide {
  height: 475px;              /* match whatever you’re using */
  align-items: stretch;       /* important */
}

/* Make the right image column stretch full height */
.cta-slide .image-area{
  height: 100%;
  align-self: stretch;
  display: flex;
  align-items: stretch;
}

/* Force the main image to fill that full height */
.cta-slide .cta-1-image{
  height: 100%;
  width: 100%;
  object-fit: cover;          /* fills height, crops as needed */
  display: block;
}

/* Optional: ensure confetti covers too */
.cta-slide .confetti{
  height: 100%;
  width: 100%;
  object-fit: cover;
}

/* =========================================================
   CTA 1 Carousel — MOBILE spacing rules (<=768px)
   Requirements:
   - 28px padding around text + button area
   - 20px below header
   - 16px below campaign H2
   - 28px below body copy
   ========================================================= */

@media (max-width: 768px) {

  /* Kill any inherited gaps that vary between slides */
  .cta-1-carousel .cta-slide-text { gap: 0 !important; }
  .cta-1-carousel .frame { gap: 0 !important; }

  /* 28px padding all around the text + button content area */
  .cta-1-carousel .cta-slide-text{
    padding: 28px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Optional but usually needed so image lines up with text edges */
  .cta-1-carousel .image-area{
    padding: 0 28px 28px !important;
    box-sizing: border-box !important;
  }

  /* Remove default element margins so your numbers are the ONLY ones */
  .cta-1-carousel .cta-1-header,
  .cta-1-carousel .cta-1-campaign,
  .cta-1-carousel .cta-1-text-content{
    margin: 0 !important;
  }

  /* Apply your exact vertical gaps */
  .cta-1-carousel .cta-1-header{ margin-bottom: 20px !important; }
  .cta-1-carousel .cta-1-campaign{ margin-bottom: 16px !important; }
  .cta-1-carousel .cta-1-text-content{ margin-bottom: 28px !important; }

  /* Button sits inside the padded area, full width if you want */
  .cta-1-carousel .shop-products-button-wrapper{
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  .cta-1-carousel .shop-products-button{
    width: 100% !important;
    text-align: center;
  }

  /* Stop slide-level padding from interfering with the 28px rule above */
  .cta-1-carousel .cta-slide{
    padding: 0 !important;
    gap: 0 !important;
  }
}
/********/


/**** Scroll Banner ****/

  .scroll-banner-list .line-divider {
 margin-left: 40px;
    margin-right: 40px;
}
.scroll-banner {
  overflow: hidden;
  border-bottom: 1px solid #f3f3f3;
  background-color: var(--kmr-white);
  padding: 10px 0;
}

.scroll-banner-track {
  display: flex;
  animation: scroll-left 60s linear infinite;
  width: max-content;
}

.scroll-banner-list {
  display: flex;
  /*gap: 40px;*/
}

.scroll-banner-list li {
  display: flex;
  align-items: center;
  gap: 12px;
  white-space: nowrap;
  flex-shrink: 0;
}

.scroll-banner-list img {
  width: 24px;
  height: 24px;
}

.scroll-banner-list h3 {
  font-family: var(--desktop-tagline-font-family);
  font-size: var(--desktop-tagline-font-size);
  color: var(--kmr-black);
  margin: 0;
}

.scroll-banner-list p {
  font-family: Helvetica, sans-serif;
  font-size: 14px;
  color: var(--kmr-grey);
  margin: 0;
}

@keyframes scroll-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* =========================================================
   CTA 1 Carousel — DESKTOP/TABLET spacing rules (>=769px)
   Requirements:
   - 20px below header
   - 20px below campaign H2
   - 40px below body copy
   ========================================================= */

@media (min-width: 769px) {

  /* Remove variable gaps */
  .cta-1-carousel .cta-slide-text { gap: 0 !important; }
  .cta-1-carousel .frame { gap: 0 !important; }

  /* Remove default element margins */
  .cta-1-carousel .cta-1-header,
  .cta-1-carousel .cta-1-campaign,
  .cta-1-carousel .cta-1-text-content{
    margin: 0 !important;
  }

  /* Apply your exact vertical gaps */
  .cta-1-carousel .cta-1-header{ margin-bottom: 20px !important; }
  .cta-1-carousel .cta-1-campaign{ margin-bottom: 20px !important; }
  .cta-1-carousel .cta-1-text-content{ margin-bottom: 40px !important; }
}

/********/

/**** Popular Products (sections/popular-products.liquid) ****/

.flickity-prev-next-button {
  display: none;
}

.popular-products-carousel .flickity-slider {
  display: flex !important;
  width: 100% !important;
  justify-content: flex-start;
}
.popular-products-carousel .flickity-viewport {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
}

.popular-products {

  margin-top: 60px;
  margin-left: auto;
  margin-right: auto;


  width: 1440px;

  display: flex;
  flex-direction: column;
  gap: 40px;
}

.popular-products-header {
  font-weight: bold;
  height: 40px;
  text-transform: uppercase;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
}

.popular-products-header h2,
.popular-products-header nav {
  flex: 0 1 auto; /* prevents them from stretching */
  max-width: 100%; /* avoids overflow */
}

.popular-products-header h2 {
  font-size: var(--desktop-h2-heading-font-size);
  font-family: var(--desktop-h2-heading-font-family);
  font-weight: 400;
  color: var(--kmr-black);
}

.popular-products-nav {
  font-weight: normal;
}

.popular-products-nav ul {
  list-style: none;
  display: flex;
  gap: 28px;
  padding: 0;
  margin: 0;
}

.popular-products-nav button {
  background: none;
  border: none;
  font-family: var(--desktop-button-text-font-family);
  font-size: var(--desktop-button-text-font-size);
  color: var(--kmr-grey);
  cursor: pointer;
  text-transform: uppercase;
}

.popular-products-nav button.active {
  color: var(--kmr-black);
  text-decoration: none;
}

.popular-products-nav button.active {
  position: relative;
  color: var(--kmr-black); /* or red if you prefer */
}

.popular-products-nav button.active::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -6px; /* pushes the line lower */
  width: 100%;
  height: 3px; /* thickness */
  background-color: var(--kmr-red); /* use your red variable or actual color */
}


.popular-products-carousel {
  /*display: flex;*/
  /*overflow: hidden;*/
  width: 100%;
}

.product-card {
  width: 320px!important;
  height: auto;
  flex: 0 0 auto;
  margin-right: 20px;

  box-sizing: border-box;
  /*padding: 20px;*/

  display: flex;
  flex-direction: column;
  gap: 16px;

  border: 1px solid var(--kmr-light-grey);
  border-radius: 10px;
  background: #fff;
}



.product-card .product-image {
  position: relative;
  display: block;
  width: 100%;
  padding-top: 100%;
  background: #f9f9f9;
  border-radius: 10px;
  overflow: hidden;
}

.product-card .product-image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.product-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 6px 10px;
  border-radius: 9999px;
  font-size: 12px;
  font-family: gothambook, sans-serif;
  color: #fff;
  background-color: var(--kmr-black);
}

.product-badge.sale {
  background-color: var(--kmr-red);
}

.product-info {
  background: #fafafa;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.product-name {
  margin-bottom: -5px;
  font-size: 16px;
  color: var(--kmr-black);
  font-family: Helvetica;
}

.product-price {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-family: gothambook;
}

.product-price .price {
  font-size: 18px;
  font-weight: bold;
  font-family: gothambook, sans-serif;
  color: var(--kmr-black);
}

.product-price .discounted {
  color: var(--kmr-red);
}

.product-price .original-price {
  text-decoration: line-through;
  color: var(--kmr-grey);
  font-size: 14px;
  font-weight: bold;
  ont-family: gothambook;
}

.product-price .ex-vat {
  font-size: 12px;
  line-height: 0.5;
  color: var(--kmr-grey);
  font-family: Helvetica;
}

@media (max-width: 768px) {
  .boost-sd__recommendation-title-text::after {
    font-size: 18px;
  }
}
  .popular-products {
    width: 100%;
    padding: 0 16px;
    gap: 24px;
  }

  .popular-products-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .popular-products-header h2 {
    font-size: 24px;
    line-height: 1.2;
  }

  .popular-products-nav ul {
    flex-wrap: wrap;
    gap: 16px;
  }

  .popular-products-nav button {
    font-size: 14px;
    padding: 4px 6px;
  }

  .popular-products-carousel .flickity-slider {
    /*gap: 0;*/
    display: flex!important;
  }

    .popular-products-carousel .product-card {
    width: 100% !important;
    /*max-width: 100%;*/
    flex: 0 0 100%!important;
    margin-right: 0!important;
      box-sizing: border-box;
  }

  .popular-products-carousel .flickity-viewport {
    width: 100%!important;
    overflow: hidden;
  }

  .product-card {
    width: 100% !important; /* Force one card per slide */
    margin-right: 10px;
    padding: 16px;
    border-radius: 12px;
  }

  .product-card .product-image {
    border-radius: 12px;
  }

  .product-name {
    font-size: 15px;
    line-height: 1.3;
  }

  .product-price .price {
    font-size: 18px;
  }

  .product-price .original-price {
    font-size: 13px;
  }

  .product-price .ex-vat {
    font-size: 12px;
  }

  .flickity-custom-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 12px !important;
  }

  .flickity-custom-dots .dot {
    width: 20px;
    height: 6px;
    /*border-radius: 9999px;*/
    background: #ccc;
    border: none;
  }

  .flickity-custom-dots .dot.is-selected {
    background: var(--kmr-black);
  }
  .popular-products-nav ul {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    row-gap: 8px;
    padding: 0;
    margin: 0;
  }

  .popular-products-nav button {
    font-size: 14px;
    font-weight: 500;
    padding: 0 6px 4px 6px;
    border: none;
    background: none;
    color: var(--kmr-grey);
    position: relative;
    text-transform: uppercase;
  }

  .popular-products-nav button.active {
    color: var(--kmr-black);
    font-weight: 700;
  }

  .popular-products-nav button.active::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 100%;
    height: 2px;
    background-color: var(--kmr-red);
  }
}


/********/

/**** Promo Banner - (sections/promo-banner.liquid) ****/

@media (max-width: 768px){
  .section-container {
    padding-top: 0px!important;
  }
}
.promo-banner-container {
  margin-left: auto;
  margin-right: auto;
  background-color: var(--kmr-light-grey);
  display: flex;
  align-items: center;
  position: relative;
  flex-wrap: wrap;
  gap: 30px;
}
@media (min-width: 769px){
    .promo-banner-container {
      margin-top: 100px;
    }
}

.promo-banner-image {
  width: 100%;
  max-width: 600px;
  height: auto;
  object-fit: cover;
}

@media (min-width: 769px){

.promo-banner-content {
  background-color: var(--kmr-light-grey);
  padding: 60px 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
}
}

@media (max-width: 768px){

.promo-banner-content {
  background-color: var(--kmr-light-grey);
  padding: 28px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
}
.promo-banner-container{
  margin-top: 50px;
}
}

.promo-banner-text {
  text-align: center;
  max-width: 700px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.promo-sub-heading {
  font-family: var(--desktop-tagline-font-family);
  font-weight: var(--desktop-tagline-font-weight);
  font-size: var(--desktop-tagline-font-size);
  color: var(--kmr-red);
  letter-spacing: var(--desktop-tagline-letter-spacing);
  line-height: var(--desktop-tagline-line-height);
  font-style: var(--desktop-tagline-font-style);
}

@media(min-width: 769px){

  .promo-header {
  font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-size: var(--desktop-h2-heading-font-size);
  color: var(--kmr-black);
  letter-spacing: var(--desktop-h2-heading-letter-spacing);
  line-height: var(--desktop-h2-heading-line-height);
  font-style: var(--desktop-h2-heading-font-style);
}
}
@media(max-width: 768px){

  .promo-header {
  font-family: var(--mobile-h2-heading-font-family);
  font-weight: var(--mobile-h2-heading-font-weight);
  font-size: var(--mobile-h2-heading-font-size);
  color: var(--kmr-black);
  letter-spacing: var(--mobile-h2-heading-letter-spacing);
  line-height: var(--mobile-h2-heading-line-height);
  font-style: var(--mobile-h2-heading-font-style);
}
}


.promo-detail {
  font-family: "gothambook";
  font-size: 14px;
  color: var(--kmr-grey);
  line-height: 23.1px;
}

.shop-products-button-wrapper {
  display: inline-block;
  background-color: var(--kmr-red);
  padding: 14px 40px;
  border-radius: 10px;
  text-decoration: none;
}

.shop-products-button {
  font-family: var(--desktop-button-text-font-family);
  font-weight: var(--desktop-button-text-font-weight);
  font-size: var(--desktop-button-text-font-size);
  color: #fff;
  letter-spacing: var(--desktop-button-text-letter-spacing);
  line-height: var(--desktop-button-text-line-height);
  font-style: var(--desktop-button-text-font-style);
  white-space: nowrap;
}

.promo-banner-button-container {
  display: flex;
  justify-content: center;
}

.promo-banner-button-container .shop-products-button {
  background-color: var(--kmr-red);
  color: #fff;
  padding: 14px 40px;
  border-radius: 10px;
  font-family: var(--desktop-button-text-font-family);
  font-weight: var(--desktop-button-text-font-weight);
  font-size: var(--desktop-button-text-font-size);
  letter-spacing: var(--desktop-button-text-letter-spacing);
  line-height: var(--desktop-button-text-line-height);
  font-style: var(--desktop-button-text-font-style);
  text-decoration: none;
  white-space: nowrap;
  display: inline-block;
}
/* Mobile: put content first, image second */
@media (max-width: 768px){
  .promo-banner-image { order: 2; }
  .promo-banner-content { order: 1; }
}
@media (max-width: 1086px){.promo-banner-image {margin: 0 auto;}}
@media (max-width: 768px){
  .promo-banner-container {
    gap: 0;
  }
  /* stop the universal spacing */
  .promo-banner-text { gap: 0; }

  /* 1) Limited Time Offer -> H2 : 20px */
  .promo-sub-heading { margin: 0 0 20px; }

  /* 2) H2 -> body text : 16px */
  .promo-header { margin: 0 0 16px; }

  /* 3) body text -> button : 28px */
  .promo-detail { margin: 0 0 28px; }

  /* optional: prevent extra default margins if anything else sneaks in */
  .promo-banner-button-container { margin: 0; }
}
/********/

/**** Book Consultation Banner (sections/book-consultation.liquid) ****/

@media (min-width: 769px){
.consultations-section {
  margin-top: 100px;
}
}
@media (max-width: 768px){
.consultations-section {
  margin-top: 50px;
}
}

.consultations-inner-section {
  display: flex;
  padding: 100px 40px;
  background-size: cover;
  background-position: center;
  color: #fff;
}

@media (min-width: 768px){
.consultations-info-container {
  width: 1440px;
  margin: 0 auto;
  
}
}
.consultations-info {
  max-width: 960px;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.consultations-header {
  font-family: "gothambook", Helvetica, sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--kmr-red);
  letter-spacing: -0.3px;
  line-height: 14px;
  text-transform: uppercase;
}

.consultations-heading {
  font-family: var(--desktop-h2-heading-font-family);
  font-size: var(--desktop-h2-heading-font-size);
  font-weight: var(--desktop-h2-heading-font-weight);
  letter-spacing: var(--desktop-h2-heading-letter-spacing);
  line-height: var(--desktop-h2-heading-line-height);
  font-style: var(--desktop-h2-heading-font-style);
  color: var(--kmr-white);
}
@media (max-width: 768px){
  .consultations-heading {
  font-family: var(--mobile-h2-heading-font-family);
  font-size: var(--mobile-h2-heading-font-size);
  font-weight: var(--mobile-h2-heading-font-weight);
  letter-spacing: var(--mobile-h2-heading-letter-spacing);
  line-height: var(--mobile-h2-heading-line-height);
  font-style: var(--mobile-h2-heading-font-style);
  color: var(--kmr-white);
}
}

.consultations-description {
  font-family: var(--desktop-feature-reg-font-family);
  font-size: var(--desktop-feature-reg-font-size);
  font-weight: var(--desktop-feature-reg-font-weight);
  letter-spacing: var(--desktop-feature-reg-letter-spacing);
  line-height: var(--desktop-feature-reg-line-height);
  font-style: var(--desktop-feature-reg-font-style);
  color: var(--kmr-light-grey);
  max-width: 600px;
}

.consultation-button-wrapper {
  display: inline-flex;
  background-color: transparent; 
  border-radius: 0;              
  padding: 0;                    
}


.book-consultation {
  display: inline-block;
  padding: 14px 40px;
  background-color: var(--kmr-red);
  border-radius: 10px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
  font-family: var(--desktop-button-text-font-family);
  font-size: var(--desktop-button-text-font-size);
  font-weight: var(--desktop-button-text-font-weight);
  letter-spacing: var(--desktop-button-text-letter-spacing);
  line-height: var(--desktop-button-text-line-height);
  font-style: var(--desktop-button-text-font-style);
}
@media (max-width: 768px){
  .consultations-info {
    gap: 0;
  }
  .consultations-header {
    margin: 0 0 20px;
  }
  .consultations-heading {
    margin: 0 0 16px;
  }
  .consultations-description {
    margin: 0 0 28px;
  }
}

.consultations-inner-section {
  display: flex;
  padding: 100px 40px;
  color: #fff;

  /* desktop background (text over image) */
  background-image: linear-gradient(90deg, rgba(0,0,0,1), rgba(0,0,0,0)), var(--consultations-bg);
  background-size: cover;
  background-position: center;
}

/* MOBILE: text on black, image becomes a block UNDER the content */
@media (max-width: 768px) {
  .consultations-inner-section {
    flex-direction: column;
    padding: 60px 20px 0;
    background: #000;
    background-image: none;
  }

  .consultations-inner-section::after {
    content: "";
    display: block;

    /* full-bleed image under the content */
    width: calc(100% + 40px);
    margin-left: -20px;
    margin-top: 32px;

    /* pick an aspect ratio that feels like your mock */
    aspect-ratio: 4 / 3;

    /* optional: slight fade at top of image like your design */
    background-image: linear-gradient(180deg, rgba(0,0,0,0.35), rgba(0,0,0,0)), var(--consultations-bg);
    background-size: cover;
    background-position: center;
  }
}

@media (max-width: 768px){
  .consultation-button-wrapper{
    display: flex;
    width: 100%;
  }

  .book-consultation{
    width: 100%;
    display: block;
    text-align: center;
    white-space: normal; /* override nowrap */
    padding: 16px 20px;  /* optional: nicer mobile padding */
  }
}

/********/

/**** Product Categories (/sections/product-categories.liquid) ****/

.product-categories-wrapper {
  margin-top: 100px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}

@media (max-width: 768px){
  .product-categories-wrapper {
    margin-top: 50px;
}
}
.product-categories-heading {
  font-family: var(--desktop-h2-heading-font-family);
  font-size: var(--desktop-h2-heading-font-size);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-style: var(--desktop-h2-heading-font-style);
  letter-spacing: var(--desktop-h2-heading-letter-spacing);
  line-height: var(--desktop-h2-heading-line-height);
  text-align: center;
  color: var(--kmr-black);
  margin: 0 auto;
  margin-bottom: 20px;
}
@media (max-width: 768px){
  .product-categories-heading {
  font-family: var(--mobile-h2-heading-font-family);
  font-size: var(--mobile-h2-heading-font-size);
  font-weight: var(--mobile-h2-heading-font-weight);
  font-style: var(--mobile-h2-heading-font-style);
  letter-spacing: var(--mobile-h2-heading-letter-spacing);
  line-height: var(--mobile-h2-heading-line-height);
  text-align: center;
  color: var(--kmr-black);
  margin: 0 auto;
}
}

.product-categories-wrapper {
  margin-top: 100px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}

@media (max-width: 768px) {
  .product-categories-wrapper {
    margin-top: 50px;
  }
}

.product-categories-heading {
  font-family: var(--desktop-h2-heading-font-family);
  font-size: var(--desktop-h2-heading-font-size);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-style: var(--desktop-h2-heading-font-style);
  letter-spacing: var(--desktop-h2-heading-letter-spacing);
  line-height: var(--desktop-h2-heading-line-height);
  text-align: center;
  color: var(--kmr-black);
  margin: 0 auto 20px;
}

@media (max-width: 768px) {
  .product-categories-heading {
    font-family: var(--mobile-h2-heading-font-family);
    font-size: var(--mobile-h2-heading-font-size);
    font-weight: var(--mobile-h2-heading-font-weight);
    font-style: var(--mobile-h2-heading-font-style);
    letter-spacing: var(--mobile-h2-heading-letter-spacing);
    line-height: var(--mobile-h2-heading-line-height);
    text-align: center;
    color: var(--kmr-black);
    margin: 0 auto;
  }
}

.product-categories-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}

.product-category-card {
  display: flex;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: inherit;
  min-width: 0;
}

.product-category-inner {
  background: #F1F1F1;
  padding: 23.3px 23.3px 46.6px;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.product-category-inner img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  display: block;
}

.product-category-label {
  display: block;
  margin-top: auto;
  padding-top: 16px;
  text-transform: uppercase;
  font-family: var(--desktop-button-text-font-family);
  font-size: 14px;
  font-weight: var(--desktop-button-text-font-weight);
  font-style: var(--desktop-button-text-font-style);
  letter-spacing: var(--desktop-button-text-letter-spacing);
  line-height: var(--desktop-button-text-line-height);
  color: var(--kmr-black);
  text-align: left;
}

@media (max-width: 768px) {
  .product-categories-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .product-category-inner {
    padding: 16px 16px 24px;
  }

  .product-category-label {
    padding-top: 12px;
  }
}








/********/

/**** CTA 2 Section (sections/cta-2-section.liquid) ****/

.cta-2-section {
  margin-top: 100px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  align-items: center;
  gap: 30px;
  background-color: var(--kmr-black);
  flex-wrap: wrap;
  justify-content: center;
}
@media (max-width: 768px){
  .cta-2-section {
  margin-top: 50px;
  gap: 0px;
}
}

.cta-2-content {
  max-width: 681px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  color: var(--kmr-light-grey);
}
@media (max-width: 768px){
  .cta-2-content {
    text-align: center;
    padding: 28px;
  }
}

.cta-2-subheading {
  font-family: var(--desktop-tagline-font-family);
  font-weight: var(--desktop-tagline-font-weight);
  font-size: var(--desktop-tagline-font-size);
  letter-spacing: var(--desktop-tagline-letter-spacing);
  line-height: var(--desktop-tagline-line-height);
  font-style: var(--desktop-tagline-font-style);
  color: var(--kmr-red);
  white-space: nowrap;
}

.cta-2-heading {
  font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-size: var(--desktop-h2-heading-font-size);
  letter-spacing: var(--desktop-h2-heading-letter-spacing);
  line-height: var(--desktop-h2-heading-line-height);
  font-style: var(--desktop-h2-heading-font-style);
  color: var(--kmr-white);
}
@media (max-width: 768px){
  .cta-2-heading {
  font-family: var(--mobile-h2-heading-font-family);
  font-weight: var(--mobile-h2-heading-font-weight);
  font-size: var(--mobile-h2-heading-font-size);
  letter-spacing: var(--mobile-h2-heading-letter-spacing);
  line-height: var(--mobile-h2-heading-line-height);
  font-style: var(--mobile-h2-heading-font-style);
  color: var(--kmr-white);
}
}

.cta-2-body {
  font-family: "Helvetica-Regular", Helvetica, sans-serif;
  font-size: 14px;
  line-height: 23.1px;
  color: var(--kmr-light-grey);
}

.cta-2-button-wrapper {
  display: flex;
  justify-content: flex-start; /* or center if you prefer */
  padding: 0; /* Remove padding here */
  background: none; /* Ensure background isn't set on wrapper */
}

.cta-2-button {
  display: inline-block;
  padding: 14px 40px;
  background-color: var(--kmr-red);
  border-radius: 10px;
  font-family: var(--desktop-button-text-font-family);
  font-weight: var(--desktop-button-text-font-weight);
  font-size: var(--desktop-button-text-font-size);
  letter-spacing: var(--desktop-button-text-letter-spacing);
  line-height: var(--desktop-button-text-line-height);
  font-style: var(--desktop-button-text-font-style);
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
}
@media (max-width: 768px){
  .cta-2-button {
    width: 100%;
  }
}


.cta-2-image-wrapper {
  flex: 0 0 auto;
}

.cta-2-image {
  width: 600px;
  height: 382px;
  object-fit: cover;
}

/* =========================================================
   CTA 2 Section — consistent spacing override
   Mirrors CTA1 rules:
   Mobile (<=768): 28 padding + 20 / 16 / 28
   Desktop (>=769): 20 / 20 / 40
   ========================================================= */

/* Remove variable gap spacing */
.cta-2-section .cta-2-content { gap: 0 !important; }

/* Remove default margins so spacing is deterministic */
.cta-2-section .cta-2-subheading,
.cta-2-section .cta-2-heading,
.cta-2-section .cta-2-body {
  margin: 0 !important;
}

/* Desktop / Tablet (>=769px): 20 / 20 / 40 */
@media (min-width: 769px) {
  .cta-2-section .cta-2-subheading { margin-bottom: 20px !important; }
  .cta-2-section .cta-2-heading    { margin-bottom: 20px !important; }
  .cta-2-section .cta-2-body       { margin-bottom: 40px !important; }

  /* Don’t add extra space beyond the body’s 40px */
  .cta-2-section .cta-2-button-wrapper { margin: 0 !important; padding: 0 !important; }
}

/* Mobile (<=768px): 28 padding + 20 / 16 / 28 */
@media (max-width: 768px) {
  .cta-2-section .cta-2-content {
    padding: 28px !important;
    box-sizing: border-box !important;
    text-align: center;
  }

  .cta-2-section .cta-2-subheading { margin-bottom: 20px !important; }
  .cta-2-section .cta-2-heading    { margin-bottom: 16px !important; }
  .cta-2-section .cta-2-body       { margin-bottom: 28px !important; }

  .cta-2-section .cta-2-button-wrapper { margin: 0 !important; padding: 0 !important; }

  /* Full-width button */
  .cta-2-section .cta-2-button {
    width: 100% !important;
    text-align: center;
  }

  /* If you still want centered text on mobile, flip these two lines:
     text-align: center;  and  justify-content: center;
  */
  .cta-2-section .cta-2-button-wrapper { justify-content: center !important; }
}

/********/

/**** Demo Room Banner (sections/demo-room-banner.liquid) ****/

/*.demo-room-container {
  margin-top: 60px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 30px;
  padding: 40px 0;
}

.testimonial-column {
  position: relative;
  width: 50%;
  max-width: 720px;
}

.testimonial-image {
  width: 100%;
  height: auto;
  display: block;
}

.testimonial-box {
  background: #fff;
  border: 1px solid #f3f3f3;
  padding: 40px;
  position: absolute;
  bottom: 0;
  left: 0;
  max-width: 520px;
}

.testimonial-heading {
  font-family: "gothambook", Helvetica, sans-serif;
  font-size: 18px;
  line-height: 28px;
  margin-bottom: 10px;
}

.testimonial-text {
  font-family: "Helvetica-Regular", Helvetica, sans-serif;
  font-size: 14px;
  color: #6a6a6a;
  line-height: 23.1px;
  margin-bottom: 10px;
}

.testimonial-author {
  font-family: "gothambook", Helvetica, sans-serif;
  font-size: 12px;
  color: #000;
  line-height: 28px;
}

.demo-content {
  width: 45%;
  max-width: 600px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.demo-heading {
  font-family: "gothambook", Helvetica, sans-serif;
  font-size: 45px;
  line-height: 50px;
  color: #000;
}

.demo-intro {
  font-size: 16px;
  font-family: "gothambook", Helvetica, sans-serif;
  line-height: 23.1px;
  color: #000;
}

.demo-body {
  font-size: 16px;
  font-family: "Helvetica-Regular", Helvetica, sans-serif;
  line-height: 23.1px;
  color: #6a6a6a;
}

.demo-button-wrapper {
  margin-top: 10px;
}

.demo-button {
  display: inline-block;
  padding: 14px 40px;
  background-color: #d10000;
  color: #fff;
  font-family: "Helvetica-Bold", Helvetica, sans-serif;
  font-size: 16px;
  line-height: 22.9px;
  text-decoration: none;
  border-radius: 10px;
  white-space: nowrap;
}
*/
/********/


    /* --- Demo Room Banner --- */

    @media (max-width: 768px) {
    .video-demo-room-header {
      height: 496px!important;
      background-image: url('/cdn/shop/files/KMR_Video_Demo_Room_2026_mobile.jpg?v=1775042326')!important;
      background-size: contain!important;
      background-repeat: no-repeat;
    }
  }
    #section-template--26981775769983__e4bc1a94-2c99-4541-8fb4-98bcb15ebbda h1 {
    display: none;
  }
    #demo-room-banner-{{ section.id }} {
      padding: 3rem 1.5rem;
    }

    #demo-room-banner-{{ section.id }} .demo-room-banner__inner {
      
      margin: 0 auto;
      display: flex;
      gap: 3rem;
      align-items: stretch;
      flex-wrap: wrap;
      margin-top: 100px;
    }

    @media (max-width: 768px){
      #demo-room-banner-{{ section.id }} .demo-room-banner__inner {
        margin-top: 10px;
      }
    }

    /* Left media column */
    #demo-room-banner-{{ section.id }} .demo-room-banner__media {
      position: relative;
      flex: 1 1 320px;
      min-width: 0;
    }

    #demo-room-banner-{{ section.id }} .demo-room-banner__image {
      display: block;
      width: 100%;
      height: auto;
      object-fit: cover;
    }

    #demo-room-banner-{{ section.id }} .demo-room-banner__testimonial-card {
      position: absolute;
      left: 0;
      bottom: 0;
      transform: translateY(10%);
      background: #ffffff;
      border: 1px solid #f3f3f3;
      padding: 1.75rem 2rem;
      max-width: 90%;
      box-shadow: 0 14px 40px rgba(0, 0, 0, 0.08);
    }

    #demo-room-banner-{{ section.id }} .demo-room-banner__testimonial-heading {
      margin: 0 0 0.5rem;
      font-size: 1.125rem;
      line-height: 1.5;
      font-weight: 500;
    }

    #demo-room-banner-{{ section.id }} .demo-room-banner__testimonial-body {
      margin: 0 0 0.75rem;
      font-size: 0.9rem;
      line-height: 1.6;
      color: #6a6a6a;
    }

    #demo-room-banner-{{ section.id }} .demo-room-banner__testimonial-name {
      margin: 0;
      font-size: 0.8rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    /* Right content column */
    #demo-room-banner-{{ section.id }} .demo-room-banner__content {
      flex: 1 1 320px;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 1rem;
      justify-content: center;
    }

    #demo-room-banner-{{ section.id }} .demo-room-banner__eyebrow {
      margin: 0;
      font-size: 0.8rem;
      letter-spacing: 0.16em;
      text-transform: uppercase;
    }

    #demo-room-banner-{{ section.id }} .demo-room-banner__heading {
      margin: 0;
      font-family: var(--desktop-h2-heading-font-family);
      font-weight: var(--desktop-h2-heading-font-weight);
      font-size: var(--desktop-h2-heading-font-size);
      letter-spacing: var(--desktop-h2-heading-letter-spacing);
      line-height: var(--desktop-h2-heading-line-height);
      font-style: var(--desktop-h2-heading-font-style);
    }
    @media (max-width: 768px){
      #demo-room-banner-{{ section.id }} .demo-room-banner__heading {
      margin: 0;
      font-family: var(--mobile-h2-heading-font-family);
      font-weight: var(--mobile-h2-heading-font-weight);
      font-size: var(--mobile-h2-heading-font-size);
      letter-spacing: var(--mobile-h2-heading-letter-spacing);
      line-height: var(--mobile-h2-heading-line-height);
      font-style: var(--mobile-h2-heading-font-style);
    }
    }

    #demo-room-banner-{{ section.id }} .demo-room-banner__intro {
      margin: 0.25rem 0 0;
      font-size: 1rem;
      line-height: 1.5;
    }

    #demo-room-banner-{{ section.id }} .demo-room-banner__body {
      margin: 0;
      font-size: 0.95rem;
      line-height: 1.6;
      color: #6a6a6a;
    }

    #demo-room-banner-{{ section.id }} .demo-room-banner__cta {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      max-width: 200px;
      padding: 0.9rem 2.5rem;
      margin-top: 1.5rem;
      border-radius: 10px;
      background-color: #d10000;
      color: #ffffff;
      font-size: var(--desktop-button-text-font-size);
      font-weight: 600;
      text-decoration: none;
      white-space: nowrap;
      transition: background-color 0.2s ease, transform 0.2s ease,
        box-shadow 0.2s ease;
    }

    #demo-room-banner-{{ section.id }} .demo-room-banner__cta:hover {
      background-color: #b10000;
      transform: translateY(-1px);
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    }

    /* Responsive tweaks */
    @media (max-width: 900px) {
      #demo-room-banner-{{ section.id }} .demo-room-banner__inner {
        flex-direction: column-reverse;
      }

      #demo-room-banner-{{ section.id }} .demo-room-banner__testimonial-card {
        position: relative;
        transform: none;
        max-width: 100%;
        margin-top: -2rem;
      }
    }

    @media (max-width: 600px) {
      /*#demo-room-banner-{{ section.id }} {
        padding: 2.5rem 1rem;
      }

      #demo-room-banner-{{ section.id }} .demo-room-banner__heading {
        font-size: 1.9rem;
      }*/
      #demo-room-banner-{{ section.id }} .demo-room-banner__cta {
        width: 100%;
        justify-content: center;
      }
    }


/**** Use Cases (sections/use-cases.liquid) ****/
/*
.use-cases-wrapper {
  max-width: 1440px;
  margin-top: 60px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.use-cases-heading {
  font-family: var(--desktop-h2-heading-font-family);
  font-size: var(--desktop-h2-heading-font-size);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-style: var(--desktop-h2-heading-font-style);
  letter-spacing: var(--desktop-h2-heading-letter-spacing);
  line-height: var(--desktop-h2-heading-line-height);
  color: var(--kmr-black);
  text-align: center;
  width: 100%;
}

.use-cases-items {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  justify-content: space-between;
}

.use-case-card {
  flex: 1 1 30%;
  min-width: 300px;
  max-width: 32%;
  height: 600px;
  background-size: cover;
  background-position: center;
  text-decoration: none;
  display: flex;
  align-items: flex-end;
  padding: 40px;
  box-sizing: border-box;
}

.use-case-info {
  background: rgba(0, 0, 0, 0.5);
  padding: 20px;
  color: #fff;
  width: 100%;
}

.use-case-title {
  font-family: "gothambook", Helvetica, sans-serif;
  font-size: 18px;
  color: var(--kmr-white);
  margin: 0 0 10px 0;
}

.use-case-description {
  font-family: "Helvetica-Regular", Helvetica, sans-serif;
  font-size: 14px;
  color: #fafafa;
  margin: 0;
}

.use-case-price {
  font-family: "Helvetica-Bold", Helvetica, sans-serif;
  font-weight: 700;
}
*/
/********/

/**** USE CASES ****/

  /* --- Use Case Grid Section --- */
    #use-case-grid-{{ section.id }} {
      padding: 3rem 1.5rem;
    }

    #use-case-grid-{{ section.id }} .use-case-grid__inner {

      margin: 0 auto;
      margin-top: 100px;
    }

    #use-case-grid-{{ section.id }} .use-case-grid__header {
      margin-bottom: 2rem;
    }

    #use-case-grid-{{ section.id }} .use-case-grid__heading {
      margin: 0;
      text-align: center;
      font-size: 2.2rem;
      line-height: 1.2;
      font-weight: 500;
    }

    #use-case-grid-{{ section.id }} .use-case-grid__list {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      gap: 20px;
      flex-wrap: wrap;
    }

    #use-case-grid-{{ section.id }} .use-case-grid__item {
      flex: 1 1 0;
      min-width: 260px;
    }

    #use-case-grid-{{ section.id }} .use-case-card {
      position: relative;
      display: flex;
      align-items: flex-end;
      height: 420px;
      padding: 2.5rem;
      border-radius: 10px;
      background-size: cover;
      background-position: 50% 50%;
      background-repeat: no-repeat;
      text-decoration: none;
      overflow: hidden;
      color: #ffffff;
    }

    #use-case-grid-{{ section.id }} .use-case-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(
        to top,
        rgba(0, 0, 0, 0.75),
        rgba(0, 0, 0, 0.2),
        rgba(0, 0, 0, 0)
      );
      pointer-events: none;
    }

    #use-case-grid-{{ section.id }} .use-case-card__content {
      position: relative;
      max-width: 380px;
      display: flex;
      flex-direction: column;
      gap: 0.5rem;
    }

    #use-case-grid-{{ section.id }} .use-case-card__title {
      margin: 0;
      font-size: 1.1rem;
      line-height: 1.4;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    #use-case-grid-{{ section.id }} .use-case-card__description {
      margin: 0;
      font-size: 0.9rem;
      line-height: 1.6;
      color: #f5f5f5;
    }

    #use-case-grid-{{ section.id }} .use-case-card__price {
      font-weight: 700;
      margin-left: 0.25rem;
    }

    /* Hover state for linked cards */
    #use-case-grid-{{ section.id }} a.use-case-card {
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    #use-case-grid-{{ section.id }} a.use-case-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 16px 40px rgba(0, 0, 0, 0.25);
    }

    /* Responsive tweaks */
    @media (max-width: 900px) {
      #use-case-grid-{{ section.id }} {
        padding: 2.5rem 1.25rem;
      }

      #use-case-grid-{{ section.id }} .use-case-card {
        height: 360px;
      }
    }

    @media (max-width: 600px) {
      #use-case-grid-{{ section.id }} .use-case-grid__heading {
        font-size: 1.8rem;
        text-align: left;
      }

      #use-case-grid-{{ section.id }} .use-case-grid__list {
        gap: 16px;
      }

      #use-case-grid-{{ section.id }} .use-case-card {
        height: 320px;
        padding: 2rem;
      }
    }

    /****/

    /**** Brands Marquee (one-row, seamless, works in normal .css assets) ****/

.brands-marquee {
  --marquee-gap: 20px;
  --marquee-duration: 120s;

  /*padding: 3rem 1.5rem;*/
}

.brands-marquee .brands-marquee__inner {
  margin: 0 auto;
  margin-top: 100px;
}

@media (max-width: 768px) {
  .brands-marquee {
    padding: 2.5rem 1rem;
    --marquee-gap: 16px;
  }

  .brands-marquee .brands-marquee__inner {
    margin-top: 20px;
  }
}

.brands-marquee .brands-marquee__header {
  margin-bottom: 50px;
}

.brands-marquee .brands-marquee__heading {
  margin: 0;
  text-align: center;
  font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-size: var(--desktop-h2-heading-font-size);
  letter-spacing: var(--desktop-h2-heading-letter-spacing);
  line-height: var(--desktop-h2-heading-line-height);
  font-style: var(--desktop-h2-heading-font-style);
}

@media (max-width: 768px) {
  .brands-marquee .brands-marquee__heading {
    font-family: var(--mobile-h2-heading-font-family);
    font-weight: var(--mobile-h2-heading-font-weight);
    font-size: var(--mobile-h2-heading-font-size);
    letter-spacing: var(--mobile-h2-heading-letter-spacing);
    line-height: 28px;
    font-style: var(--mobile-h2-heading-font-style);
  }
}

/* Viewport hides the overflow */
.brands-marquee .brands-marquee__viewport {
  position: relative;
  overflow: hidden;
  width: 100%;
}

/* Track holds BOTH lists and animates */
.brands-marquee .brands-marquee__track {
  display: flex;
  width: max-content;
  align-items: center;
  will-change: transform;

  animation: brands-marquee-scroll var(--marquee-duration) linear infinite;
  animation-play-state: running; /* protects against accidental overrides */
}

/* Pause on hover/focus */
.brands-marquee .brands-marquee__viewport:hover .brands-marquee__track,
.brands-marquee .brands-marquee__viewport:focus-within .brands-marquee__track {
  animation-play-state: paused;
}

/* Each list is one horizontal row */
.brands-marquee .brands-marquee__list {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  white-space: nowrap;

  list-style: none;
  margin: 0;
  padding: 0;

  gap: 0; /* important: gap doesn't create trailing space at the seam */
}

/* TILE + seam gap */
.brands-marquee .brands-marquee__item {
  flex: 0 0 auto;

  display: flex;
  align-items: center;
  justify-content: center;
  width: 172px;
  height: 172px;
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);

  /* This creates the missing end->start gap (including the seam) */
  margin-right: var(--marquee-gap);
}

.brands-marquee .brands-marquee__logo-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  text-decoration: none;
}

.brands-marquee .brands-marquee__logo {
  display: block;
  max-width: 70%;
  max-height: 70%;
  width: auto;
  height: auto;
  object-fit: contain;

  filter: grayscale(100%);
  opacity: 0.9;
  transition: opacity 0.2s ease, filter 0.2s ease, transform 0.2s ease;
}

.brands-marquee .brands-marquee__logo-link:hover .brands-marquee__logo,
.brands-marquee .brands-marquee__item:hover .brands-marquee__logo {
  filter: grayscale(0%);
  opacity: 1;
  transform: translateY(-1px);
}

/* Because you have 2 identical lists, -50% loops seamlessly */
@keyframes brands-marquee-scroll {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-50%, 0, 0); }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .brands-marquee .brands-marquee__track {
    animation: none;
    transform: none;
  }

  .brands-marquee .brands-marquee__viewport {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .brands-marquee .brands-marquee__item {
    width: 140px;
    height: 140px;
  }

  .brands-marquee .brands-marquee__logo {
    max-width: 75%;
    max-height: 75%;
  }
}

    /**** Insta Feed ****/

    #shopify-section-template--26981776327039__9d35d8da-77cf-44e6-8b08-56290737c4f0 { 
    margin-top: 70px;
    }
    #shopify-section-template--26981776327039__9d35d8da-77cf-44e6-8b08-56290737c4f0 h2 {
      font-size: var(--desktop-h2-heading-font-size);
    }

    @media (max-width: 768px) 
{
  #shopify-section-template--26981776327039__9d35d8da-77cf-44e6-8b08-56290737c4f0 { 
    margin-top: 50px!important;
  }
   #shopify-section-template--26981776327039__9d35d8da-77cf-44e6-8b08-56290737c4f0 h2 {
      font-size: var(--mobile-h2-heading-font-size);
    }
}

/**** Blog ****/

#shopify-section-template--26981776327039__blog_posts2_gKmdFG {
  margin-top: 80px;
}
#shopify-section-template--26981776327039__blog_posts2_gKmdFG h2 {
  font-size: var(--desktop-h2-heading-font-size);
}
@media (max-width: 768px){
  #shopify-section-template--26981776327039__blog_posts2_gKmdFG {

  margin-top: 10px;
}
#shopify-section-template--26981776327039__blog_posts2_gKmdFG h2 {
  font-size: var(--mobile-h2-heading-font-size);
}
}
    /**** Pro Hire Banner (sections/pro-hire-banner.liquid) ****/

  
    /* --- Pro Hire Banner (image right) --- */
.pro-hire-banner {
  /*padding: 3rem 1.5rem;*/
}

.pro-hire-banner .pro-hire-banner__card {
  position: relative;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
  background-color: #000000;
  overflow: hidden;
  min-height: 320px;
  margin-top: 100px;
}

/* Gradient overlay across card (dark left, fades over image) */
.pro-hire-banner .pro-hire-banner__card::before {
  content: "";
  position: absolute;
  inset: 0;
  /*background: linear-gradient(
    90deg,
    rgba(0, 0, 0, 1) 0%,
    rgba(0, 0, 0, 1) 45%,
    rgba(0, 0, 0, 0.7) 65%,
    rgba(0, 0, 0, 0) 100%
  );*/
  z-index: 1;              /* <- move overlay ABOVE image... */
  pointer-events: none;
}

/* Layering: text above overlay, overlay above image */
.pro-hire-banner .pro-hire-banner__content {
  position: relative;
  z-index: 2;              /* text on top */
}

.pro-hire-banner .pro-hire-banner__image-wrapper {
  position: relative;
  z-index: 0;              /* image at the back */
}


/* Left text block */
.pro-hire-banner .pro-hire-banner__content {
  flex: 0 0 55%;
  padding: 80px;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  color: #ffffff;
}

.pro-hire-banner .pro-hire-banner__subheading {


  text-transform: uppercase;


    font-family: var(--desktop-tagline-font-family);
  font-weight: var(--desktop-tagline-font-weight);
  font-size: var(--desktop-tagline-font-size);
  letter-spacing: var(--desktop-tagline-letter-spacing);
  line-height: var(--desktop-tagline-line-height);
  font-style: var(--desktop-tagline-font-style);
  color: var(--kmr-red);
  white-space: nowrap;
}

.pro-hire-banner .pro-hire-banner__heading {


    font-family: var(--desktop-h2-heading-font-family);
  font-weight: var(--desktop-h2-heading-font-weight);
  font-size: var(--desktop-h2-heading-font-size);
  letter-spacing: var(--desktop-h2-heading-letter-spacing);
  line-height: var(--desktop-h2-heading-line-height);
  font-style: var(--desktop-h2-heading-font-style);
  color: var(--kmr-white);
}

@media (max-width: 768px){
  .pro-hire-banner .pro-hire-banner__heading {


    font-family: var(--mobile-h2-heading-font-family);
  font-weight: var(--mobile-h2-heading-font-weight);
  font-size: var(--mobile-h2-heading-font-size);
  letter-spacing: var(--mobile-h2-heading-letter-spacing);
  line-height: var(--mobile-h2-heading-line-height);
  font-style: var(--mobile-h2-heading-font-style);
  color: var(--kmr-white);
}
}

.pro-hire-banner .pro-hire-banner__body {
  margin: 0;
  font-size: 0.98rem;
  line-height: 1.7;
  color: #e3e3e3;
  max-width: 560px;
}

.pro-hire-banner .pro-hire-banner__button-wrapper {
  margin-top: 1.75rem;
}

.pro-hire-banner .pro-hire-banner__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.95rem 2.7rem;
  border-radius: 10px;
  background-color: #d10000;
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: background-color 0.2s ease, transform 0.2s ease,
    box-shadow 0.2s ease;
}

.pro-hire-banner .pro-hire-banner__button:hover {
  background-color: #b00000;
  transform: translateY(-1px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

/* Right image */
.pro-hire-banner .pro-hire-banner__image-wrapper {
  flex: 0 0 45%;
  min-height: 100%;
}

.pro-hire-banner .pro-hire-banner__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Responsive */
@media (max-width: 960px) {
  .pro-hire-banner .pro-hire-banner__card {
    flex-direction: column;
  }

  .pro-hire-banner .pro-hire-banner__content {
    flex-basis: auto;
    padding: 2.5rem 2rem 2.25rem;
  }

  .pro-hire-banner .pro-hire-banner__image-wrapper {
    flex-basis: auto;
    max-height: 260px;
  }

  .pro-hire-banner .pro-hire-banner__card::before {
    background: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.95) 0%,
      rgba(0, 0, 0, 0.5) 55%,
      rgba(0, 0, 0, 0) 100%
    );
  }
}

@media (max-width: 600px) {
  /*.pro-hire-banner {
    padding: 2.5rem 1rem;
  }

  .pro-hire-banner .pro-hire-banner__heading {
    font-size: 2.1rem;
  }*/

  .pro-hire-banner .pro-hire-banner__button {
    width: 100%;
    justify-content: center;
  }
}

  .pro-hire-banner__card{
  position: relative;
}

.pro-hire-banner__card-link{
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  /* optional niceties */
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

/* Keep actual content underneath the overlay link */
.pro-hire-banner__content,
.pro-hire-banner__image-wrapper{
  position: relative;
  z-index: 1;
}

/* Put the button ABOVE the overlay so it’s still clickable */
.pro-hire-banner__button-wrapper,
.pro-hire-banner__button{
  position: relative;
  z-index: 3;
}

.pro-hire-banner__card--link{
  display: block;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

/* optional: stop the image intercepting clicks in some themes */
.pro-hire-banner__card--link img{
  pointer-events: none;
}

/* =========================================================
   Pro Hire Banner — consistent spacing (override block)
   ========================================================= */

/* Remove variable “gap” spacing and let margins drive layout */
.pro-hire-banner .pro-hire-banner__content { gap: 0 !important; }

/* Zero default margins so our spacing is deterministic */
.pro-hire-banner .pro-hire-banner__subheading,
.pro-hire-banner .pro-hire-banner__heading,
.pro-hire-banner .pro-hire-banner__body {
  margin: 0 !important;
}

/* -------------------------
   Desktop / Tablet (>=769px)
   - 20px below subheading
   - 20px below heading
   - 40px below body
   ------------------------- */
@media (min-width: 769px) {
  .pro-hire-banner .pro-hire-banner__subheading { margin-bottom: 20px !important; }
  .pro-hire-banner .pro-hire-banner__heading    { margin-bottom: 20px !important; }
  .pro-hire-banner .pro-hire-banner__body       { margin-bottom: 40px !important; }

  /* Button wrapper: no extra top margin (spacing comes from body margin) */
  .pro-hire-banner .pro-hire-banner__button-wrapper { margin-top: 0 !important; }
}

/* -------------------------
   Mobile (<=768px)
   - 28px padding around content (text+button)
   - 20px below subheading
   - 16px below heading
   - 28px below body
   ------------------------- */
@media (max-width: 768px) {
  .pro-hire-banner .pro-hire-banner__content {
    padding: 28px !important;
    box-sizing: border-box !important;
  }

  .pro-hire-banner .pro-hire-banner__subheading { margin-bottom: 20px !important; }
  .pro-hire-banner .pro-hire-banner__heading    { margin-bottom: 16px !important; }
  .pro-hire-banner .pro-hire-banner__body       { margin-bottom: 28px !important; }

  .pro-hire-banner .pro-hire-banner__button-wrapper { margin-top: 0 !important; }

  /* Full-width button (you already do this at 600px; this makes it consistent up to 768px) */
  .pro-hire-banner .pro-hire-banner__button {
    width: 100% !important;
    justify-content: center;
  }
}
  /****/

  /**** WHY SHOP KMR ****/

  #kmr-why-shop-template--26981776327039__why_shop_with_kmr_HBXjLT, .kmr-why-shop__inner {
    background-color: #fafafa;
  }
  
  /**** NOVUNA ****/
  
  .pbf-representative-example, #pbf-termMessage, label[for="radio-pbf-term-6"], label[for="radio-pbf-term-10"], label[for="radio-pbf-term-18"]  {
  display: none;
}
.pbf-finance-widget {
  margin-top: -15px;
}
.pbf-finance-widget-button {
  margin-top: -33px;
}
#PBFPopup > img:nth-child(1) {
  width: 25%;
}

div#PBFPopup {
  /*max-width: none!important;*/
  padding: 25px!important;
  border: 1px solid #6A6A6A33;
}
#PBFPopup > img:nth-child(1) {
  width: 20%;
}
#pbf-termField > label:nth-child(2), #pbf-termField > label:nth-child(4), #pbf-termField > label:nth-child(8)
 {
  /*display: none!important;*/
}
div#PBFPopup .pbf-finance-widget {
  margin-bottom: 0!important;
}
]

/********/

/**** Footer ****/

#section-footer {
  margin-top: 133px;
}

h2 {
  /*font-size: clamp(18px, 4vw, 45px)!important;*/
}

/**** SHIPPING ****/

/* Compact, light sidebar block */
.shipping-info.slim {
  --text: #111;
  --muted: #6b7280;           /* grey-500 */
  --line:  #e5e7eb;           /* grey-200 */
  --pill-bg: #eef2ff;         /* soft pill bg */
  --pill-border: #c7d2fe;     /* soft pill border */
  --radius: 12px;

  color: var(--text);
  background: transparent;    /* no colour background as requested */
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 14px;
}

.shipping-info.slim .shipping-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.shipping-info.slim .shipping-heading {
  font-size: 16px;
  line-height: 1.2;
  margin: 0;
  letter-spacing: .2px;
}

.shipping-info.slim .carrier-logos {
  display: flex;
  align-items: center;
  gap: 8px;
}
.shipping-info.slim .carrier-logos img {
  height: 18px;
  width: auto;
  display: block;
  filter: grayscale(1) contrast(1.05) brightness(.95);
  opacity: .9;
}

/* Rates list */
.shipping-info.slim .rate-list {
  list-style: none;
  margin: 6px 0 0;
  padding: 0;
  border-top: 1px dashed var(--line);
}
.shipping-info.slim .rate-list li {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  gap: 6px 10px;
  padding: 10px 0;
  border-bottom: 1px dashed var(--line);
}
.shipping-info.slim .rate-list .label {
  font-size: 14px;
  font-weight: 600;
}
.shipping-info.slim .rate-list .value {
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}
.shipping-info.slim .rate-list .note {
  grid-column: 1 / -1;
  font-size: 12px;
  color: var(--muted);
  margin-top: 2px;
}

/* FREE pill */
.shipping-info.slim .pill {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--pill-border);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}
.shipping-info.slim .pill.free {
  background: var(--pill-bg);
}

/* Small print */
.shipping-info.slim .smallprint {
  margin: 10px 0 0;
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.55;
}
.shipping-info.slim .smallprint strong { color: #374151; } /* grey-700 */


.restock-info {
  display: flex;
  align-items: center;
  gap: 10px;
  position: relative;
  margin-left: -110px;
  margin-top: 20px;
  padding-bottom: 20px;
  flex-wrap: wrap;          
}

.restock-info::after,
#PBFPopup::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  border-bottom: 0.5px solid #6A6A6A33;
}

.restock-info .material-symbols {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;             /* icon stays 24px wide */
}

.restock-info .frame {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  flex: 1 1 260px;            /* grow + shrink + reasonable basis */
  min-width: 0;               /* ✅ allow text to wrap instead of overflow */
}

.restock-info .restock-date {
  margin-top: 0;
  font-family: "Helvetica-Regular", Helvetica, Arial, sans-serif;
  font-weight: 400;
  color: var(--kmr-black);
  font-size: 14px;
  line-height: 1.3;
}

.restock-info .container {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 18px;         /* smaller by default; we’ll bump on desktop */
  border-radius: 10px;
  border: 2px solid var(--kmr-black);
  flex: 0 0 auto;             /* keep it sized to content */
  max-width: 100%;
}

.restock-info .add-to-cart {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.restock-info .add-to-cart-text {
  font-family: var(--desktop-button-text-font-family);
  font-weight: var(--desktop-button-text-font-weight);
  color: var(--kmr-black);
  font-size: 16px;
  line-height: var(--desktop-button-text-line-height);
  letter-spacing: var(--desktop-button-text-letter-spacing);
  font-style: var(--desktop-button-text-font-style);
  white-space: normal;        /* ✅ allow wrapping (prevents overflow on mobile) */
}

/* Fix the invalid media query: remove 'and' */
@media (min-width: 769px) {
  .in-stock-box,
  .special-order-box,
  .restock-info {
    width: 563px;             /* your desktop width */
  }
  #check-stock-availability-container {
    margin-left: -110px;
    margin-top: 15px;
    width: 563px;
  }
  .restock-info {
    margin-left: -110px;      /* keep your desktop offset if desired */
  }
  .restock-info .container {
    padding: 14px 25px;       /* original desktop padding */
  }
}

/* ——— Mobile tweaks ——— */
@media (max-width: 768px) {
  /* no floats or inline-block gymnastics needed */
  .restock-info {
    align-items: flex-start;
   /* width: 100%;*/
  }

  /* keep icon + copy on the first line when there’s room; then wrap naturally */
  .restock-info .frame {
    order: 2;
  }
  .restock-info .material-symbols {
    order: 1;
    margin-top: 9px;
    margin-right: 0px;
  }

  /* keep button below, sized to content, not full-width */
  .restock-info .container {
    order: 3;
    margin-top: 8px;
    padding: 10px 16px;
  }

  /* remove risky offsets on mobile */
  #check-stock-availability-container,
  #PBFPopup {
    margin-left: 0 !important;
    max-width: 100% !important;
  }
}

#shopify-section-template--17950294212900__hero_split_section_RjL6hF, #shopify-section-template--17950294212900__scroll_banner_febgCT, #shopify-section-template--17950294212900__popular_categories_carousel_ti3nJp, #shopify-section-template--17950294212900__cta_1_carousel_rnCme4 {
  /*display: none;*/
}
/*Final edits for Strafe design sign-off Product Page*/

.lipscore-testimonial-text, .lipscore-testimonial-date, .lipscore-testimonial-user {
  display: none;
}
.lipscore-testimonial-stars {
  position:absolute;
  float: right;
  right: 0;
}
@media (max-width: 768px) {
  .lipscore-testimonial-stars {
    margin-top: 20px;
  }
}
.breadcrumb {
  padding-bottom: 12px;
  margin-left: 3px;
  color: #6a6a6a;
  font-size: 14px;
  font-style: normal;
font-weight: 400;
line-height: 23.1px; 
}
@media (max-width: 768px){
  .breadcrumb {
    padding-bottom: 0px;
    margin-top: 20px;
  }
}

.lipscore-testimonial-stars{
  display: inline-flex;
  align-items: center;
  gap: 5px;             
}

/* clean up any inline margins Lipscore/HTML added */
.lipscore-testimonial-stars > svg{
  margin: 0 !important;
}
/* Breadcrumb spacing */
.breadcrumb {
  display: inline-flex;          /* or flex to full width */
  align-items: center;
  flex-wrap: wrap;
  gap: 0;                        /* base gap (0 = only arrows get spacing) */
}

/* Extra space on both sides of the arrow */
.breadcrumb .crumb-sep{
  font-size: 7px;
  color: #6a6a6a;
  margin-inline: 8px;            /* ← space on left & right */
  line-height: 1;                /* keeps it vertically tidy */
  vertical-align: middle;        /* optional if not using flex */
}
/* keep label normal, date bold */
.restock-line { 
  font-weight: 400; 
  margin: 0; 
  display: flex; 
  align-items: center; 
  gap: 8px;            /* space between icon and text */
}

/* make only the date bold */
.restock-line .restock-date { 
  font-weight: 700; 
}

/* add the icon on the left */
.restock-line::before {
  content: "";
  margin-top: 18px;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  background: url("/cdn/shop/files/material-symbols-production-quantity-limits-rounded.svg?v=1755625520")
              no-repeat center / contain;
  /* Optional vertical nudge if needed: transform: translateY(1px); */
}
.restock-note {
      margin-left: 30px;
    margin-top: -17px;
    color: #6a6a6a;
}
#stock-availability {
  color: #6a6a6a;

}
#ask-stock-btn {
  text-transform: uppercase;
}
/* hide the current page crumb */
nav.breadcrumb > span:last-child { display: none; }

/* hide the separator right before the (now hidden) final crumb */
nav.breadcrumb > .crumb-sep:has(+ span:last-child) { display: none; }

/* if you used a .current class for the last crumb */
nav.breadcrumb > .crumb-sep:has(+ .current) { display: none; }

@media (max-width: 768px) {
  /* if any ancestor has white-space:nowrap, this wins */
  #ask-stock-btn .btn-label {
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    display: block;
    flex: 1 1 auto;   /* if parent is flex */
    min-width: 0;     /* critical for flex items to wrap */
  }

  /* let containers grow if they were constrained */
  #ask-stock-btn,
  .add-to-cart { height: auto !important; min-width: 0 !important; }
}

/* Normalise H2 font weight */

h2 strong {
  font-weight: inherit;  /* or use normal */
}

/**** Collection Promo ***/




/* KMR – Collection Promo Pill (shrink-to-fit + aligned) */
.kmr-collection-promo{
  /* sizing */
  margin-bottom: 20px;
  display:inline-flex !important;         /* defeat any theme block rules */
  width:fit-content;                      /* shrink to text length */
  max-width:100%;                         /* allow wrap if it ever hits container */
  white-space:normal;                     /* permit wrapping when needed */
  vertical-align:middle;

  /* look */
  --kmr-promo-accent:#D10000;
  --kmr-promo-bg-a:rgba(209,0,0,.06);
  --kmr-promo-bg-b:rgba(209,0,0,.03);
  background:linear-gradient(90deg,var(--kmr-promo-bg-a),var(--kmr-promo-bg-b));
  color:var(--kmr-promo-accent);
  border-radius:9999px;
  padding:.65rem 1rem;

  /* type & alignment */
  align-items:center;
  gap:.55rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.02em;
  line-height:1;                          /* keeps height tight, centers vs icon */
}

.kmr-collection-promo__icon{
  display:inline-flex;
  flex:0 0 auto;
  width:1.1em;                            /* scale with text size */
  height:1.1em;
  line-height:0;
  transform:translateY(1px);              /* tiny optical nudge so it centers */
}

.kmr-collection-promo__icon svg{
  width:100%;
  height:100%;
  display:block;
  color:currentColor;                      /* uses --kmr-promo-accent */
}

.kmr-collection-promo__text{
  margin-top: 2px;
  font-family: gothambold;
  font-weight: 400;
  letter-spacing: -0.3px;
  text-transform: uppercase;
  display:inline-block;
  line-height:1;                           /* keeps baselines tidy */
}

/* Optional: if some parent forces 100% width, scope a stronger override */
.product__meta .kmr-collection-promo{ width:fit-content !important; }

.boost-sd__recommendation-bundle-total-discount {
  display: none!important;
}

/**** Manufacturer Logo ****/

.manufacturer-logo {
    display: block;
    float: right;
    margin-right: -18px;
    width: 145px;
    height: auto;
    right: 3px;
    top: 19px;
}

@media (max-width: 768px){
  .manufacturer-logo {
    margin-top: 12px;
  }
}

.lipscore-testimonial {
  margin-top: 10px;
}

/**** BLACK FRIDAY 2025 ****/

 
.ProductMediaWrapper {
  position: relative;
}
.ProductMediaWrapper img.Product__DiscountBadge {
  position: absolute;
  padding: 0px;
  top: 15px;
  right: 15px;
  left: auto;          
  width: 150px;        
  height: auto;
  z-index: 5;
  pointer-events: none;
  transform: none;
}

/**** Shop Hub ****/

/* SHOP HUB LAYOUT (Option B) */
.shop-hub{
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 24px;

  display: grid;
  grid-template-columns: minmax(240px, 280px) minmax(0, 1fr);
  column-gap: 32px;
  row-gap: 24px;
  align-items: start;
}

/* Hero spans both columns */
.shop-hub > .shopify-section:first-child{
  grid-column: 1 / -1;
}

/* Sidebar = second section, left column, spans down */
.shop-hub > .shopify-section:nth-child(2){
  grid-column: 1;
  grid-row: 2 / span 999;
  align-self: start;
}

/* Everything after sidebar goes right column */
.shop-hub > .shopify-section:nth-child(n+3){
  grid-column: 2;
}

/* Prevent inner “container” classes from re-constraining width inside right column */
.shop-hub .section-container,
.shop-hub .page-width,
.shop-hub .container{
  max-width: 100%;
}

/* Sticky wrapper */
.shop-hub .shop-hub-sidebar__inner{
  position: sticky;
  top: var(--shop-hub-sticky-top, 120px); /* adjust for your header height */
}

/* Sidebar + accordion styling (basic) */
.shop-hub-sidebar__title{
  margin: 0 0 12px;
}

.shop-hub-nav__group{
  border-top: 1px solid rgba(0,0,0,.12);
  padding: 10px 0;
}

.shop-hub-nav__summary{
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  list-style: none;
}

.shop-hub-nav__summary::-webkit-details-marker{ display:none; }

.shop-hub-nav__list{
  margin: 10px 0 0;
  padding: 0;
}

.shop-hub-nav__item{ margin: 6px 0; }

.shop-hub-nav__link{
  text-decoration: none;
}

/* Hero tiles */
.shop-hub-tiles{
  margin-top: 16px;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}

.shop-hub-tile{
  display: block;
  text-decoration: none;
}

.shop-hub-tile__img{
  width: 100%;
  height: auto;
  display: block;
}

.shop-hub-tile__label{
  display: block;
  margin-top: 8px;
}

/* Mobile: stack */
@media (max-width: 990px){
  .shop-hub{
    grid-template-columns: 1fr;
    padding: 0 16px;
  }

  .shop-hub > .shopify-section:first-child,
  .shop-hub > .shopify-section:nth-child(2),
  .shop-hub > .shopify-section:nth-child(n+3){
    grid-column: 1;
    grid-row: auto;
  }

  .shop-hub .shop-hub-sidebar__inner{
    position: static;
    top: auto;
  }

  .shop-hub-tiles{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Original menu legacy styles override */

.HorizontalList.HorizontalList--spacingExtraLoose .HorizontalList__Item:nth-of-type(2)::after {
    content: none!important;
    padding-left: none!important;
    top: 0px !important;
}