
/* V155
   - Home page outer structure is full width.
   - Every normal home content block uses a 1600px inner shell.
   - Slider alone spans the full viewport width.
   - Admin is untouched.
*/

:root{
  --v155-home-shell:1600px;
  --v155-home-gutter:24px;
}

/* Prevent a 100vw slider from creating horizontal scrollbars. */
html,body{
  overflow-x:hidden;
}

/* HOME ROOT MUST NOT BE CAPPED AT 1280/1600.
   Only the inner content shells are capped. */
body:not(.admin-layout) .v117-home{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding-left:0!important;
  padding-right:0!important;
}

/* All main home sections may have full-width backgrounds. */
body:not(.admin-layout) .v117-home > section{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}

/* ===== DESKTOP LARGE: ALL CONTENT BLOCKS = 1600px ===== */
@media(min-width:1500px){
  body:not(.admin-layout) .v117-home .v117-shell,
  body:not(.admin-layout) .v119-categories > .v117-shell,
  body:not(.admin-layout) .v117-featured > .v117-shell,
  body:not(.admin-layout) .v117-promos > .v117-shell,
  body:not(.admin-layout) .v117-benefits > .v117-shell,
  body:not(.admin-layout) .v117-news > .v117-shell{
    width:min(var(--v155-home-shell),calc(100% - 48px))!important;
    max-width:var(--v155-home-shell)!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
  }

  /* Header and main menu line up with the same 1600px home grid. */
  body:not(.admin-layout) .v117-header .v117-shell,
  body:not(.admin-layout) .v117-nav-wrap .v117-shell,
  body:not(.admin-layout) .v117-navrow{
    width:min(var(--v155-home-shell),calc(100% - 48px))!important;
    max-width:var(--v155-home-shell)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  /* Featured products: 5 cards across full 1600 shell. */
  body:not(.admin-layout) .v117-home .v117-product-grid,
  body:not(.admin-layout) .v117-featured .v117-product-grid{
    width:100%!important;
    max-width:none!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:18px!important;
  }

  /* These grids must fill their 1600px shell instead of keeping old max-widths. */
  body:not(.admin-layout) .v119-category-grid,
  body:not(.admin-layout) .v117-promo-grid,
  body:not(.admin-layout) .v117-benefit-grid,
  body:not(.admin-layout) .v117-news-grid{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }
}

/* ===== SLIDER: TRUE FULL SCREEN WIDTH ===== */
body:not(.admin-layout) .v117-home > .v117-hero{
  position:relative!important;
  left:50%!important;
  right:50%!important;
  width:100vw!important;
  max-width:none!important;
  margin-left:-50vw!important;
  margin-right:-50vw!important;
  padding-left:0!important;
  padding-right:0!important;
  overflow:hidden!important;
}

body:not(.admin-layout) .v117-hero-slides,
body:not(.admin-layout) .v117-hero-slide,
body:not(.admin-layout) .v117-hero-media{
  width:100%!important;
  max-width:none!important;
}

body:not(.admin-layout) .v117-hero-media{
  position:absolute!important;
  inset:0!important;
}

body:not(.admin-layout) .v117-hero-media img{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:cover!important;
  object-position:center center!important;
}

/* Slider text stays aligned with the 1600px content grid. */
@media(min-width:1500px){
  body:not(.admin-layout) .v117-hero .v117-hero-copy{
    width:min(var(--v155-home-shell),calc(100% - 48px))!important;
    max-width:var(--v155-home-shell)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

/* ===== 1200 - 1499 ===== */
@media(min-width:1200px) and (max-width:1499px){
  body:not(.admin-layout) .v117-home .v117-shell,
  body:not(.admin-layout) .v117-header .v117-shell,
  body:not(.admin-layout) .v117-nav-wrap .v117-shell,
  body:not(.admin-layout) .v117-navrow{
    width:calc(100% - 40px)!important;
    max-width:1380px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  body:not(.admin-layout) .v117-home .v117-product-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}

/* ===== TABLET ===== */
@media(min-width:768px) and (max-width:1199px){
  body:not(.admin-layout) .v117-home .v117-shell{
    width:calc(100% - 32px)!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  body:not(.admin-layout) .v117-home .v117-product-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}

/* ===== MOBILE ===== */
@media(max-width:767px){
  body:not(.admin-layout) .v117-home .v117-shell{
    width:calc(100% - 24px)!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  /* Slider remains edge-to-edge on mobile too. */
  body:not(.admin-layout) .v117-home > .v117-hero{
    width:100vw!important;
    margin-left:-50vw!important;
    margin-right:-50vw!important;
  }

  body:not(.admin-layout) .v117-home .v117-product-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
