/** Shopify CDN: Minification failed

Line 327:6 Expected identifier but found whitespace
Line 327:8 Unexpected "{"
Line 327:17 Expected ":"
Line 327:35 Expected ":"
Line 339:12 Expected identifier but found whitespace
Line 339:14 Unexpected "{"
Line 339:23 Expected ":"
Line 339:49 Expected ":"

**/
/*********************************************************************
 * MAX GLOBAL - design tokens (redesign 2026-06-16, preserve-mode)
 * Single locked accent + one shape system. Do not introduce new
 * accent colours or ad-hoc radii below; reference these tokens.
 *********************************************************************/
:root {
  --mg-ink: #000000;          /* brand black */
  --mg-paper: #ffffff;        /* brand white */
  --mg-hi-vis: #facb00;       /* THE single locked accent (safety yellow) */
  --mg-hi-vis-deep: #e0b400;  /* hover/active shade of the accent */
  --mg-line: #e3e3e3;         /* hairline / card border */
  --mg-muted: #5c5c5c;        /* secondary text on paper */
  --mg-radius: 0px;           /* containers/titles/cards = sharp (matches theme global radius 0) */
  --mg-radius-pill: 999px;    /* interactive pills / icon buttons only */
  --mg-ink-2: #16181b;
  --mg-surface: #f5f6f7;
  --mg-text: #14161a;
}

/* homepage: lift the best-sellers band off the white sections above/below it */
[id$="__best_sellers_20260710"] .color-scheme-1 { background: var(--mg-surface) !important; }

/********************************* product page gradient bar css here  *********************************/
.gradient-bar {
  width: 100%;
  height: 3px;
      margin-bottom: 10px;
  background: linear-gradient(
    90deg,
    #FFFFFF 0%,
    var(--mg-hi-vis) 46.63%,
    #FFFFFF 100%
  );
}
/********************************* featured product section css code here  *********************************/
.bestseller-div{
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.25);
        padding: 5px;
}
 
.bestseller-head{
font-size: 22px;
    font-weight: 600;
    margin-left: 25px;
}
.bestseller-price{
    margin-left: 25px;
    font-size: 18px;
    font-weight: 500;
}
.bestseller-title {
  display: inline-block;
  background: var(--mg-ink);
  color: var(--mg-hi-vis);
  font-size: clamp(22px, 3vw, 40px);
  font-weight: 700;
  padding: 12px 42px;
  border-radius: var(--mg-radius);
  margin-bottom: 50px;
}
/********************************* atc btn css code here  *********************************/
.max-buy{

      background: var(--mg-ink);
  color:rgb(245, 245, 244);
  font-size: clamp(22px, 3vw, 18px);
  font-family: var(--font-heading-family);
}
.viewall-btn {
  display: inline-block;
  background: var(--mg-ink);
  color: #fff;
padding: 8px 42px;
    border-radius: var(--mg-radius);
    height: 54px;
  text-decoration: none;
  font-weight: 600;
  border: 1px solid var(--mg-hi-vis);
      font-size: 22px;
    width: 200px;
  transition: background 0.2s ease, color 0.2s ease;
}
.viewall-btn:hover {
  background: var(--mg-hi-vis);
  color: var(--mg-ink);
  border-color: var(--mg-ink);
}
/********************* ended here ******************** */

/******************** categories-section ********************************/
.categories-section {
  background: #ffffff;
  padding: 70px 40px;
  text-align: center;
}

/********************************* Title *********************************/
.categories-section .categories-title {
  display: inline-block;
  background: var(--mg-ink);
  color: var(--mg-hi-vis);
  font-size: clamp(24px, 4vw, 40px);
  font-weight: 700;
  padding: 12px 42px;
  border-radius: var(--mg-radius);
  margin-bottom: 50px;
}

/********************************* Grid *********************************/
.categories-section .categories-grid {
  max-width: 1600px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

/********************************* Card *********************************/
.categories-section .category-card {
  background: #ffffff;
  border-radius: var(--mg-radius);
  padding: 24px;
  text-align: left;
  border: 1px solid var(--mg-line);
  text-decoration: none;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.categories-section .category-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 30px rgba(0,0,0,0.08);
  border-color: var(--mg-ink);
}

/********************************* Card title *********************************/
.categories-section .category-card h3 {
  font-size: clamp(18px, 2.5vw, 22px);
  font-weight: 500;
  margin: 0;
  color: #000;
  text-transform: capitalize;
}

/********************************* Image wrapper *********************************/
.categories-section .category-card img {
  width: 100%;
  max-height: 180px;
  object-fit: contain;
  display: block;
  margin: 0 auto;
}
.sub-collection-list .category-card img {
  max-height: 100px;
}

/********************************* LARGE TABLET *********************************/
@media (max-width: 1200px) {
  .categories-section .categories-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/********************************* TABLET *********************************/
@media (max-width: 1024px) {
  .categories-section {
    padding: 60px 30px;
  }

  .categories-section .categories-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/********************************* MOBILE *********************************/
@media (max-width: 600px) {
  .categories-section {
    padding: 40px 20px;
  }

  .categories-section .categories-title {
    padding: 10px 24px;
    margin-bottom: 30px;
  }

  .categories-section .categories-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}


/********************************* Banner tablet responsive  *********************************/

@media screen and (min-width: 750px) and (max-width: 1024px) {
  /* Tablet hero: rely on Dawn's middle-right box alignment instead of
     fixed-pixel pushes (replaces the old 225px / 235% !important hacks). */
  .slideshow__text-wrapper.banner__content {
    height: 100%;
    padding: 0 40px !important;
    margin: 0;
  }
  .banner--desktop-transparent .banner__box {
    padding: 0 !important;
    max-width: 480px;
    margin-left: auto; /* hold the copy column to the right edge */
  }
  .banner__heading p {
    margin: 0;
    width: auto;
    font-size: clamp(24px, 4vw, 34px);
  }
}
@media screen and (min-width: 1114px) and (max-width: 1280px) {
  .slideshow__text-wrapper.banner__content {
    padding: 1rem !important;
  }
}


/********************************* tablet view header menu *********************************/


@media (min-width: 1024px) and (max-width: 1350px) {
  nav.header__inline-menu {
    padding: 20px;
    margin-left: 20px;
  }
}

/********************************* ends here  *********************************/
/********************************* collection list  *********************************/

.catenone{
  display:none;
}
.ps-col-div {
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.25);
           border-radius: var(--mg-radius) !important;
}
.ps-gap{
      row-gap: 15px;
    column-gap: 8px;
}
.ps-card-ratio:before {
    padding-bottom: 50% !important;
}
.media.media--transparent.media--hover-effect.pscat
 {
       max-width: 95%;
    max-height: 80%;
    margin-left: 75px;
}
.card__media .pscat img{

     height: 100%;
    object-fit: contain !important;
    object-position: right !important;
 
    width: 80% !important;
    height: 100% !important;
}

 .card__heading .pstitle {
    font-size: 29px;
    font-weight: 500;
    font-family: var(--font-heading-family);
}
.pscol-title {
  display: inline-block !important;
  background: var(--mg-ink);
  color: var(--mg-hi-vis);
  font-size: clamp(22px, 3vw, 40px);
  font-weight: 700;
  padding: 12px 42px;
  border-radius: var(--mg-radius);
  text-align: center;

  position: relative;
  left: 50%;
  transform: translateX(-50%);

  margin-bottom: 50px;
  width: auto !important;
  max-width: 100%;
}
/********************************* end here  *********************************/

/********************************* brands css code starts here *********************************/

.brands-section {
  background: #ffffff;
  padding: 60px 40px;
  text-align: center;
}

.brands-title {
  display: inline-block;
  background: var(--mg-ink);
  color: var(--mg-hi-vis);
  font-size: clamp(20px, 3vw, 40px);
  font-weight: 700;
  padding: 12px 40px;
  border-radius: var(--mg-radius);
  margin-bottom: 40px;
}

.brands-grid {
  max-width: 1600px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat({{ section.settings.desktop_columns }}, 1fr);
  gap: {{ section.settings.gap }}px;
}

.brand-card {

  padding: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.brand-card img {
  max-width: {{ section.settings.image_width }}px;
  max-height: 120px;
  object-fit: contain;
}


/********************************* TABLET *********************************/
@media (max-width: 1024px) {
  .brands-grid {
    grid-template-columns: repeat({{ section.settings.tablet_columns }}, 1fr);
  }
}

/********************************* MOBILE *********************************/
@media (max-width: 600px) {
  .brands-grid {
    grid-template-columns: repeat({{ section.settings.mobile_columns }}, 1fr);
  }

  .brand-card {
    padding: 20px;
  }

  .brand-card img {
    max-height: 80px;
  }
}

/********************************* ended here *********************************/

/********************************* Loader css *********************************/

.predictive-search__loading-state {
  position: absolute;
  inset: 0;
  background: transparent;
  display: none;
}

.slidehide{
    display: none !important;
}

/* Slideshow base */
/* .slideshow {
  position: relative;
} */
 
.ps-slide-controls {
    position: unset !important;
}
.ps-slide-controls button.slider-button--prev {
    position: absolute;
    top: 45%;
    left: 0;
    transform: translateY(-50%);
  pointer-events: auto;
  width: 46px;
  height: 46px;
  background: #ffffff;
  border-radius: 50%;
  box-shadow: 0 6px 18px rgba(0,0,0,0.25);
}
.ps-slide-controls button.slider-button--next {
    position: absolute;
    top: 45%;
    right: 0;
    transform: translateY(-50%);
  pointer-events: auto;
  width: 46px;
  height: 46px;
  background: #ffffff;
  border-radius: 50%;
  box-shadow: 0 6px 18px rgba(0,0,0,0.25);
}

/* banner image mobile responsive  */

@media screen and (max-width: 426px) {
  .banner--medium.banner--mobile-bottom:not(.banner--adapt) .banner__media,
  .banner--medium.banner--stacked:not(.banner--mobile-bottom):not(
      .banner--adapt
    )
    > .banner__media {
    height: 10rem !important ;
  }
}