/** Shopify CDN: Minification failed

Line 4594:0 Expected "}" to go with "{"

**/
@font-face {
  font-family: 'Boldstrom';
  src: url('https://your-cdn.com/fonts/boldstrom-bold.woff2') format('woff2'),
       url('https://your-cdn.com/fonts/boldstrom-bold.woff') format('woff'),
       url('/cdn/shop/files/Boldstrom.otf?v=1728483118') format('otf');
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: 'Boldstrom';
  src: url('{{ "boldstrom-bold.woff2" | asset_url }}') format('woff2'),
       url('{{ "boldstrom-bold.woff" | asset_url }}') format('woff'),
       url('{{ "Boldstrom.otf" | asset_url }}') format('opentype');
  font-weight: 900;
  font-style: normal;
}
.klaviyo-bis-trigger__container .klaviyo-bis-trigger {
  background-color: #dc3748!important;
  border-color: #dc3748!important;
}
button#AddToCart:disabled {
  opacity: .5;
  margin-bottom: -3px;
}
.product_atc.disabled {
  opacity: .5;
  margin-bottom: -3px;
}
button#AddToCart:disabled:hover {
  color: #fff;
  background: #161515;
}
.fixed-product-form__atc:disabled {
  opacity: 0.5;
}
.fixed-product-form__atc.sold-out {
  display: none;
}
.fixed-product-form__atc ~ .fixed_notify_me_available.klaviyo-bis-trigger {
  display: none !important;
}
.fixed-product-form__atc.sold-out~.fixed_notify_me_available.klaviyo-bis-trigger {
  display: block!important;
  width: 332px !important;
  /* max-width: 100%; */
  margin-left: 10px;
}
button#AddToCart:disabled+.shopify-payment-button {
display: none;
}
.fixed_notify_me_available {
  background-color: #Dc3748!important;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  padding: 14px;
  border: 1px solid #Dc3748!important;
  cursor: pointer;
  width: auto !important;
}
.fixed_notify_me_available:hover {
  background-color: #Dc3748!important;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  padding: 14px;
  border: 1px solid #Dc3748!important;
  cursor: pointer;
  width: auto !important;
}
#CartDrawer .afterpay_more_info, #CartDrawer .afterpay_popup_main {
display: none;
}
/* Search bar cross icon css start */
.search-form__container {
  position: relative;
}
span.desktop_clear_search {
  cursor: pointer;
  position: absolute;
  right: 0;
  width: 18px;
  height: 18px;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}
span.mobile_clear_search {
  display: inline-block;
  width: 22px;
  padding-top: 10px;
}
/* Search bar cross icon css start */
/* gift card css start */
.property_box_main .property_box label {
  display: block;
}
.property_box_main .property_box input {
  width: 100%;
  border: 1px solid #ddd;
  padding: 15px;
  margin-top: 10px;
}
.property_box_main .property_box {
  margin-bottom: 10px;
}
.property_box_main span.error {
  color: red;
}
.property_box_main textarea {
  resize: none;
  border: 1px solid #ddd;
  padding: 15px;
  width: 100%;
  min-height: 100px;
}
.line-item__properties.mt-4 {
  padding-left: 10px;
  margin-bottom: 10px;
}
span.font-bold.porperty_key {
  font-weight: 600;
  width: 100%;
  /* display: block; */
}
.property_box_main div.custom_add_to_cart_properties {
  width: 100%;
  background: #000;
  color: #fff;
  text-align: center;
  padding: 15px;
  border: 1px solid #000;
  cursor: pointer;
  margin-top: 20px;
}
.property_box_main div.custom_add_to_cart_properties:hover {
  background: #fff;
  color: #000;
}
/* gift card css end */
.collection-tab__triggers button[aria-selected=true] {
  background: #fff;
  color: #000;
  line-height: 1;
  border: 1px solid;
}
.collection-tab__triggers button[aria-selected=true]:after {
  display: none;
}
.collection-tab__triggers button {
  padding: 10px 25px;
  line-height: 1;
}
.collection-tab__triggers button:hover {
  /* background: #000; */
  color: #000;
  border: 1px solid;
}
.collection-tab__triggers button[aria-selected="true"]:before {
display: none;
}
.collection-tab__triggers button[aria-selected="false"]:after {
display: none;
}
button.site-header__destkop-account {
  color: #000 !important;
}
button.site-header__destkop-account.active {
  color: #f84141 !important;
}

button.site-header__destkop-account .desktop-account-dropdown {
 display: none !important;
}
/* button.site-header__destkop-account .desktop-account-dropdown a:last-child{
display: none;
} */
button.site-header__destkop-account.active .desktop-account-dropdown {
  display: flex!important;
  /* top: 35px; */
  bottom: -110px;
}
header.collection-header.x-men .hero__image, header.collection-header.dnd .hero__image {
 height: calc(22vw);
}
li.site-header__section-menu-gc-header-title {
  margin-bottom: 4px;
  line-height: 1.1;
}
.pagination-wrapper {
z-index: unset;
}
.site-header__menu-items .site-header__menu-item  {
    padding: 12px 8px;
}
.site-header__menu-items .site-header__menu-item a.site-header__menu-link {
    padding: 8px;
    display: block;
    white-space: nowrap;
}
.image-with-text-blocks-inner {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  gap: 50px;
  margin-top: 30px;
}
.image-with-text-blocks-inner .image-with-text-block-single .image-box {
  position: relative;
}
.image-with-text-blocks-inner .image-with-text-block-single .image-box .badge-label {
  position: absolute;
  right: 0;
  top: 10px;
  background: #f84141;
  display: flex;
  color: #fff;
  width: 50px;
  text-align: center;
  justify-content: center;
  line-height: unset;
  height: 22px;
  border-radius: 3px;
  margin: 0;
}
.image-with-text-blocks-inner .image-with-text-block-single {
  text-align: center;
}
.image-with-text-blocks-inner .image-with-text-block-single .subtitle-box {
  margin-top: 20px;
}
.image-with-text-blocks-inner .image-with-text-block-single .subtitle-box h5 {
  font-weight: 600;
}
.image-with-text-blocks-inner .image-with-text-block-single .image-box a img {
  border-radius: 100%;
  /* border: 1px solid #ccc; */
}
.square-image-blocks-inner {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 30px;
  margin-top: 30px;
}
.square-image-blocks-single {
  position: relative;
}
.square-image-blocks-single .subtitle-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* Background is now controlled via section settings */
}
.square-image-blocks-single .subtitle-box .subtitle-box-inner {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
}
.square-image-blocks-single .subtitle-box .subtitle-box-inner a {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
}
.square-image-blocks-single .subtitle-box .subtitle-box-inner h5 {
  font-size: 28px;
  font-weight: 600;
  color: #fff;
  padding: 15px;
  text-align: center;
}
.desktop-account-dropdown {
  z-index: 9;
  box-shadow: 0px 0px 22px -1px rgba(0,0,0,0.16);
  -webkit-box-shadow: 0px 0px 22px -1px rgba(0,0,0,0.16);
  -moz-box-shadow: 0px 0px 22px -1px rgba(0,0,0,0.16);
}
.desktop-account-dropdown:after {
  right: unset;
  top: -.25rem;
  left: 6px;
}
/* .alert-title-wishlist {
  color: red;
  text-align: center;
  font-style: italic;
  background: #f9dada;
  padding: 5px 20px;
  margin-bottom: 25px;
} */
/* .wishlist-collection #wk-share-head {
  position: relative;
  margin-top: 80px;
}
.wishlist-collection #wk-share-head:before {
  content: "ANNOUNCEMENT: We will be updating this app on October 12th, 2023 and all wishlists will be deleted. Please screenshot your wishlist or write it down prior to the update. Apologies for the inconvenience!";
  width: 100%;
  position: absolute;
  left: 0;
  top: -65px;
  background: #f9dada;
  color: red;
  padding: 5px 20px;
  font-style: normal;
  font-size: 14px;
  font-family: sans-serif;
  text-transform: initial;
}
.account {
 flex-wrap: wrap;
}
.alert-message {
  background: #f9dada;
  color: red;
  padding: 5px 20px;
  text-align: center;
  margin-bottom: 20px;
} */
/*
.account ::before {
 content: 'ANNOUNCEMENT: We will be updating this app on October 12th, 2023 and all wishlists will be deleted. Please screenshot your wishlist or write it down prior to the update. Apologies for the inconvenience!';
  width: 100%;
  position: absolute;
  left: 0;
  top: 60px;
  background: #f9dada;
  color: red;
  padding: 5px 20px;
  font-style: normal;
} */
.image-with-text-blocks-mobile-main {
  display: none;
}
.image-with-text-blocks-inner .image-with-text-block-single .subtitle-box {
  word-break: break-all;
}
.search-image-blocks-inner {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 30px;
}
.search-image-blocks-single {
  position: relative;
  height: 350px;
}
.search-image-blocks-single .image-box {
  height: 100%;
  display: flex;
  width: 100%;
}
.search-image-blocks-single .image-box img {
  height: 100%;
  object-fit: cover;
  display: flex;
  width: 100%;
  object-position: top;
}
.search-image-blocks-single .subtitle-box {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 100%;
  background: rgb(0 0 0 / 30%);
  display: flex;
  align-items: end;
  justify-content: center;
}
.search-image-blocks-single .subtitle-box h5 {
  margin-bottom: 30px;
  font-size: 14px;
  padding: 12px 48px;
  color: #000;
  border: 1px solid #fff;
  text-transform: uppercase;
  background-color: #fff;
}
p.no_result_found {
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  color: #111;
  text-transform: uppercase;
}
p.dont-give-up-no-result {
  text-align: center;
  margin-top: 18px;
  font-size: 16px;
  font-weight: 500;
  color: #111;
}
.search-product-collection__dots {
  margin-top: 60px;
  margin-bottom: 30px;
}
/* .klaviyo-bis-trigger {
  display: block !important;
} */
.new-klaviyo-open-pop {
  background-color: #Dc3748;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  padding: 14px;
  border: 1px solid #Dc3748;
  margin-top: 10px;
  cursor: pointer;
}
.klaviyo-new-popup-main {
  position: fixed;
  top: 0;
  z-index: 9;
  background: #00000082;
  width: 100%;
  height: 100%;
  display: none;
  align-items: center;
  justify-content: center;
}
.klaviyo-new-popup-main.klaviyo-new-popup-main-open {
 display: flex;
}
.laviyo-new-popup {
  max-width: 460px;
  background-color: #fff;
  border-radius: 5px;
  padding: 30px 40px;
  position: relative;
}
.laviyo-new-popup span.close-popup {
  position: absolute;
  right: 16px;
  top: -6px;
  font-size: 40px;
  rotate: 45deg;
  font-weight: 700;
  display: inline-flex;
  cursor: pointer;
}
.laviyo-new-popup .text-box {
  margin-top: 15px;
  margin-bottom: 15px;
}
.laviyo-new-popup h2 {
  padding-top: 15px;
  font-size: 24px;
  font-family: Roboto Mono,sans-serif;
  text-transform: capitalize;
}
.laviyo-new-popup form {
padding: 0 !important;
margin-top: 10px;
}
.laviyo-new-popup form .needsclick {
 padding-left: 0 !important;
  padding-right: 0 !important;
}
.next-section-padding+s-carousel {
 padding-top: 0;
 padding-bottom: 0;
}
.next-section-padding+s-carousel .collection-header__categories-item {
  padding-top:32px;
  padding-bottom: 32px;
}
#MainContent.min-h-header {
  display: block;
}
.desktop-top-result-not-search {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 15px;
}
.template-search.template-search--empty {
  padding-top: 10px;
  padding-bottom: 30px;
}
.template-search.template-search--empty h1.h2 {
  font-size: 28px;
}
.template-search.template-search--empty form .field {
  margin-top: 5px;
  margin-bottom: 5px;
}
.template-search.template-search--empty p.element-margin.no_result_found {
  font-size: 16px;
}
.template-search.template-search--empty p.dont-give-up-no-result {
  margin-top: 5px;
  font-size: 14px;
}
.site-header__menu-item__section {
  z-index: 1;
}

/**** sticky add to cart start ****/
.product__form.fixed-form {
  transform: translateY(90px);
  transition: all 0.5s ease;
}
.product__form.fixed-form.fixed-form-sticky {
  transform: translateY(0);
}
/**** sticky add to cart end ****/

/** product slider start ***/

.product-img-slide {
display: inline-block;
width: 100%;
}

/* Pre-initialization styles to prevent vertical stacking */
.product-img-slide .slider-for:not(.slick-initialized) {
  opacity: 0;
  visibility: hidden;
}

.product-img-slide .slider-for.slick-initialized {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.3s ease;
}

.product-img-slide .slider-for:not(.slick-initialized) > *:not(:first-child) {
  display: none !important;
}

.product-img-slide .slider-nav:not(.slick-initialized) {
  opacity: 0;
  visibility: hidden;
}

.product-img-slide .slider-nav.slick-initialized {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.3s ease;
}

.product-img-slide .slider-for {
width: calc(100% - 140px);
float: right;
background: #fff;
overflow: hidden;
}

.product-img-slide .slider-nav {
width: 130px;
padding: 35px 0;
}
.product-img-slide .slider-nav button {
padding-bottom: 5px;
overflow: visible; /* Ensure images aren't cropped */
}
.product-img-slide .slider-nav .thumb-slide {
padding: 4px;
margin-bottom: 12px;
background: #fff;
border: 1px solid #ddd;
overflow: hidden;
border-radius: 4px;
}

.product-img-slide .slider-nav .thumb-slide:last-child {
margin-bottom: 0;
}

.product-img-slide .slider-nav .thumb-slide.slick-current {
border-color: #ddd;
}

.product-img-slide .slider-nav .thumb-slide img {
max-width: 175px;
}

/* Ensure slider-nav images maintain aspect ratio and don't get cropped */
.product-img-slide .slider-nav button img {
max-width: 100%;
height: auto;
display: block;
}

.product-img-slide .slider-nav .slick-arrow {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 20px;
  background-color: #000;
  border-radius: 50%;
  z-index: 9;
  cursor: pointer;
  border: none;
  opacity: .75;
}

/* Override critical-css ::after arrows to be white */
.product-img-slide .slider-nav .slick-arrow::after {
  border-color: #fff !important;
  width: 6px;
  height: 6px;
  border-width: 0 2px 2px 0;
}

/* Previous arrow (top) - pointing up */
.product-img-slide .slider-nav .slick-arrow.slick-prev {
  top: 0;
}
.product-img-slide .slider-nav .slick-prev::after {
  transform: translate(-50%, -30%) rotate(-135deg);
}

/* Next arrow (bottom) - pointing down */
.product-img-slide .slider-nav .slick-arrow.slick-next {
  top: auto;
  bottom: 0;
}
.product-img-slide .slider-nav .slick-next::after {
  transform: translate(-50%, -70%) rotate(45deg);
}

/* Disabled state */
.product-img-slide .slider-nav .slick-arrow.slick-disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

/* Hover state */
.product-img-slide .slider-nav .slick-arrow:hover:not(.slick-disabled) {
  opacity: 0.85;
}

.product-img-slide .slick-slide img {
margin: 0 auto;
}
/* .prd-slide-mob {
display: none;
}
.prd-slide-mob.prd-slide-mob-show{
display: flex;
} */
.product-slider-main-desk {
  padding-right: 15px;
}
.product__layout {
  max-width: 1500px;
  width: 100%;
}
/* .product-img-slide .slider-for picture {
padding: 2px;
} */
.product__images .carousel__buttons {
  width: 163px;
}
nav.product-breadcrumbs {
  padding-top: 10px;
}
.main-zoom-box {
  position: fixed;
  width: 100%;
  height: 100vh;
  top: 0;
  /* background: rgb(0 0 0 / 54%); */
  background: #fff;
  display: none;
  z-index: 1000;
}
.main-zoom-box-inner {
  position: relative;
  /* padding: 122px; */
  width: 100%;
}
.main-zoom-box-inner img {
  width: 100%;
  max-width: 1200px;
  max-height: 1200px;
}
body.stop_scroll {
  overflow: hidden;
}
.main-zoom-box-inner .image-box {
  overflow-y: scroll;
  height: 100vh;
  scrollbar-width: thin;
  width: 1200px;
  margin-inline: auto;
  /* display: flex;
  align-items: center; */
  -ms-overflow-style: none;  /* Internet Explorer 10+ */
  scrollbar-width: none;  /* Firefox */
}
.main-zoom-box-inner .image-box::-webkit-scrollbar {
  display: none;
}
.main-zoom-box-inner span.close-btn {
  position: absolute;
  right: 2rem;
  width: 16px;
  height: 16px;
  top: 1.5rem;
  cursor: pointer;
}
.main-zoom-box-inner span.close-btn:hover {
  color: red;
}
.product-img-slide span.zoom_button_prd_img {
  position: absolute;
  width: 40px;
  height: 40px;
  padding: .5rem;
  /* background-color: #f3f1f1; */
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  right: 1.5rem;
  z-index: 1;
  bottom: 1.5rem;
  cursor: pointer;
}
button[js-open-gallery-zoom] {
  background: transparent;
}
.product-img-slide {
  position: relative;
}
/** product slider end */



@media only screen and (min-width: 1024px) {
.product__layout {
  display: flex;
  flex-wrap: wrap;
}
.product__layout .product__images {
width: 54%;
}
.product__layout .product__information {
  width: calc(46% - 2rem);
}
}
@media only screen and (min-width: 1440px) {
.product__layout .product__images {
width: 56.5%;
}
.product__layout .product__information {
  width: calc(42.5% - 2rem);
}
}

.product-img-slide .slider-for .w-full:not(:first-child) picture {
  display: none;
}
.square-image-blocks-single .image-box img {
 width: 100%;
}
s-modal#GalleryZoomModal {
  max-height: 100vh;
  z-index: 15;
  height: 100vh;
}
s-modal#GalleryZoomModal .w-screen {
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
}
s-modal#GalleryZoomModal .w-screen picture {
  width: 100%;
  max-width: 1200px;
}
s-drawer#CartDrawer  {
  /* position: relative; */
}
form.ajaxcart__content {
  position: unset;
}
#AjaxCartTemplate .ajaxcart__content footer.ajaxcart__footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  background: #fff;
  z-index: 1;
  margin-bottom: 0;
  border-bottom: navajowhite;
  /* border-top: 1px solid; */
  left: 0;
  padding-left: 15px;
  padding-right: 15px;
}
main.ajaxcart__main.relative {
  position: unset;
}
main.ajaxcart__main .upsell {
  margin-bottom: 175px;
}
div#AjaxCartTemplate {
  overflow-y: scroll;
  overflow-x: hidden;
}
div#AjaxCartTemplate::-webkit-scrollbar {
  display: none;
}
.ajaxcart__header h2.text-blue {
  font-size: 25px;
}
button.ajaxcart__checkout {
  font-size: 20px;
}
h4.ajaxcart__subtotal-title {
  text-transform: unset;
  font-family: 'trade-gothic-next';
  font-size: 16px;
  font-weight: bold;
}
main.ajaxcart__main .upsell {
  margin-top: 10px;
}
.ajaxcart__main h3.upsell__title {
  font-size: 25px;
  margin-top: 0;
  padding-top: 0;
}
.ajaxcart__main p.inline-block.w-auto {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.ajaxcart__main p.inline-block.w-auto  span.price {
  font-weight: bold;
  padding-left: 5px;
}
.cart_after_pay_img {
  width: 75px;
  height: auto;
  margin-top: 3px;
}
@media only screen and (min-width: 1921px) {
.main-zoom-box-inner .image-box {
  display: flex;
  align-items: center;
}
s-modal#GalleryZoomModal .w-screen {
  align-items: center;
}
}
@media only screen and (max-width: 1700px) {
.search-image-blocks-single {
  height: 300px;
}
}
@media only screen and (max-width: 1471px) {
.product__layout {
  max-width: 1350px;
}
}
@media only screen and (max-width: 1367px) {
.site-header__menu-items .site-header__menu-item  {
    padding: 8px 6px 8px 8px;
}
.site-header__menu-items .site-header__menu-item a.site-header__menu-link {
    padding: 8px 6px 8px 8px;
}
.image-with-text-blocks-inner {
  gap: 30px;
}
.product__layout {
  max-width: 1300px;
}
}
.site-header__section-menu-gc-header-link p {
  max-width: 120px;
  font-size: 12px;
  min-height: 30px;
}
@media only screen and (max-width: 1280px) {
.site-header__menu-items .site-header__menu-item  {
    padding: 8px 4px 8px 8px;
}
.site-header__menu-items .site-header__menu-item a.site-header__menu-link {
    padding: 8px 5px 8px 8px;
}
}
@media only screen and (max-width: 1205px) {
.site-header__menu-items .site-header__menu-item  a {
    font-size: 13px;
}
}
@media only screen and (max-width: 1180px) {
.site-header__menu-items .site-header__menu-item {
  padding: 8px 1px 8px 8px;
}
.site-header__menu-items .site-header__menu-item a.site-header__menu-link {
    padding: 8px 2px 8px 8px;
}
.site-header__menu-items .site-header__menu-item  a {
    font-size: 12px;
}
}

/* Prevent text wrapping in navigation at narrow desktop widths */
@media only screen and (min-width: 1025px) and (max-width: 1083px) {
  .site-header__menu-items .site-header__menu-item a.site-header__menu-link {
    white-space: nowrap;
    font-size: 11px;
  }
  .site-header__menu-items .site-header__menu-item {
    padding: 8px 2px 8px 4px;
    flex-shrink: 0;
  }
}

@media only screen and (max-width: 1024px) {
header.collection-header.x-men .hero__image, header.collection-header.dnd .hero__image {
  height: calc(30vw);
}
.announcement-nav--next {
  /* width: 30px; */
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.announcement-nav svg {
  height: 15px;
  width: 15px;
}
button#header-open-nav {
  height: 32px;
}
.site-header__destkop-wishlist.wk-link {
  height: 32px;
}
.next-section-padding+s-carousel .collection-header__categories-item {
  padding-top:10px;
  padding-bottom: 10px;
}
.image-with-text-blocks-inner {
  gap: 50px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.square-image-blocks-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
  margin-top: 30px;
}
.image-with-text-blocks-inner .image-with-text-block-single {
  text-align: center;
  width: calc(33.3% - 50px);
}
.image-with-text-blocks-main {
  display: none;
}
.image-with-text-blocks-mobile-main {
  display: block;
}
.image-with-text-blocks-inner .image-with-text-block-single .image-box {
  position: relative;
  /* width: 80%; */
  margin: auto;
}
.image-with-text-blocks-mobile-main .image-with-text-blocks-inner .image-with-text-block-single {
  text-align: center;
  width: 100%;
}
.image-with-text-blocks-mobile-main .image-with-text-blocks-inner {
  gap: 40px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  row-gap: 20px;
}
.image-with-text-blocks-mobile-main .image-with-text-blocks {
  padding-top: 5px;
}
.prd-slide-mob {
display: flex !important;
}
.product-slider-main-desk {
display: none;
}
.product__images .carousel__buttons {
  width: unset;
}
}
@media only screen and (max-width: 992px) {
.article__image.bg-cover{
  height: 100% !important;
}
 .article__image.bg-cover{
  aspect-ratio: 2.8333333333333335;
}
}
@media only screen and (max-width: 768px) {
header.collection-header.x-men .hero__image, header.collection-header.dnd .hero__image {
  height: calc(60vw);
}
.collection-title.dnd h1, .collection-title.x-men h1 {
 font-size: 30px;
}
.next-section-padding .hero__image {
  height: 100% !important;
}
.image-with-text-blocks-inner .image-with-text-block-single .subtitle-box {
  margin-top: 5px;
  font-size: 12px;
  word-break: break-all;
}

}
@media only screen and (max-width: 574px) {
.kaviyo-new-popup_inner {
  height: 100%;
  overflow-y: scroll;
  overflow-x: hidden;
}
.fixed-product-form__atc.sold-out~.fixed_notify_me_available.klaviyo-bis-trigger {
  display: block!important;
  width: 239px!important;
  margin-left: 0;
  font-size: 12px;
  border: 2px solid #Dc3748 !important;
}
 .template--page-about .image-mobile {
  background-size: 500px;
  background-position: center!important;
  background-attachment: unset;
}
.template--page-about  .h-header {
  height: calc(50vh - var(--header-height));
}
.collection-tab__triggers button {
  padding: 8px 15px;
  line-height: 1;
  font-size: 14px;
  margin-left: 5px;
  margin-right: 5px;
  margin-bottom: 5px;
}
s-modal#GalleryZoomModal {
  max-height: 100vh;
  z-index: 15;
  height: auto;
}
/* button.product-galleryzoom__close {
  top: 40px;
} */
s-modal#GalleryZoomModal .w-screen {
  height: auto;
  display: block;
}
.image-with-text-blocks-inner .image-with-text-block-single .image-box .badge-label {
  position: absolute;
  right: -4px;
  top: 0px;
  background: #f84141;
  display: flex;
  color: #fff;
  width: 30px;
  text-align: center;
  justify-content: center;
  line-height: unset;
  height: 14px;
  border-radius: 3px;
  margin: 0;
  font-size: 9px;
}
.square-image-blocks-single .subtitle-box .subtitle-box-inner h5 {
  font-size: 20px;
}
.image-with-text-blocks-inner .image-with-text-block-single {
  width: calc(33.3% - 15px);
}
.image-with-text-blocks-inner {
  gap: 15px;
}
/* .wishlist-collection #wk-share-head {
  margin-top: 125px;
}
.wishlist-collection #wk-share-head:before {
  top: -105px;
}   */
.search-image-blocks-inner {
  grid-template-columns: 1fr;
}
/* .klaviyo-new-popup-main {
  align-items: start;
}
.laviyo-new-popup {
  border-radius: 0;
}   */
.desktop-top-result-not-search-main .collection-title {
  padding-top: 0;
  padding-bottom: 0;
}
.desktop-top-result-not-search-main h1 {
  font-size: 22px;
}
.desktop-top-result-not-search {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
#AjaxCartTemplate .ajaxcart__content footer.ajaxcart__footer {
  bottom: 64px;
}
.banner_custom_title {
  font-size: 60px !important;
}
}

.product-color-option .color-swatch img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.product-color-swatch__container {
  gap: 10px;
}

.product-color-option .color-swatch {
  width: 50px;
  height: 50px;
  padding: 5px;
    border: 1px solid transparent;
}
.product-color-option .color-swatch.active {
  border-color: black;
}

.product-color-swatch__container .color-swatch img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.product-color-swatch__container .color-swatch {
  width: 50px;
  height: 50px;
  padding: 5px;
}



.game_card_6 {
max-width: 1050px;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
gap: 20px 0;
}
.game_card_circle {
width: 33.33%;
text-align: center;
padding: 15px;
}
.game_card_img_circle {
position: relative;
width: 310px;
height: 310px;
padding: 20px;
margin: 0 auto;
}
.game_card_circle img {
height: 100%;
object-fit: contain;
position: relative;
margin: 0 auto;
width: 100%;
}
.game_card_img_circle::after {
background: #fff;
border-radius: 100%;
border: 10px solid #95d1e1;
content: "";
width: 90%;
height: 90%;
display: block;
position: absolute;
top: 50%;
z-index: -1;
left: 50%;
transform: translateX(-50%) translateY(-50%);
}
.game_card_circle:nth-child(2) .game_card_img_circle img {
height: 290px !important;
top: 50%;
transform: translateY(-50%);
}
.game_card_circle:first-child .game_card_img_circle img {
right: 10%;
}
.game_card_circle:nth-child(3) .game_card_img_circle img {
width: 91% !important;
}
.game_card_circle:nth-child(5) .game_card_img_circle img {
width: 341px !important;
position: absolute !important;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
}
.game_card_circle:nth-child(6) .game_card_img_circle img {
height: 320px;
width: 100%;
object-fit: contain;
top: 50%;
left: 50%;
position: absolute;
transform: translateX(-50%) translateY(-55%);
}
#shopify-section-template--18072221974686__icon_with_text_fpKatm {
background: #2583b6;
-webkit-clip-path: polygon(0 2.5rem,100% 0,100% calc(100% - 2.5rem),0 100%);
clip-path: polygon(0 2.5rem,100% 0,100% calc(100% - 2.5rem),0 100%);
padding: 40px 20px;
}

#shopify-section-template--18072221974686__icon_with_text_fpKatm .icon-with-text-inner {
display: unset;
color: #fff;
}

#shopify-section-template--18072221974686__landing_banner_BbQiXY .hero__content.flex.flex-col.bg-transparent {
color: #fff;
max-width: 500px;
text-align: left;
font-size: 20px;
}
#shopify-section-template--18072221974686__landing_banner_BbQiXY .hero__content-wrapper {
justify-content: center;
align-items: end;
}
.banner_custom_title {
text-align: center;
/* font-family: 'Boldstrom', sans-serif; */
font-family: bebas-neue,sans-serif;
font-weight: 900;
color: #fff;
/* font-size: 46px; */
font-size: 70px;
line-height: normal;
margin-bottom: 0px;
}
#shopify-section-template--18072221974686__landing_banner_BbQiXY .lazypicture.block.w-full {
padding: 20px 0px;
height: 100%;
display: block;
}
#shopify-section-template--18072221974686__landing_performance_style_LwDHJt {
margin-top: -23px !important;
display: inline-block;
width:100%;
}
.image-with-text.px-16.bonus_grand_prize_section {
max-width: 1050px;
}
#shopify-section-template--18072221974686__landing_banner_BbQiXY .w-full.hero__image {
height: 100%;
object-fit: cover;
object-position: top;
}
#shopify-section-template--18072222007454__landing_title_with_text_Di3MQK .title.pb-16 {
font-weight: 900;
font-size: 32px;
}
#shopify-section-template--18072222007454__landing_banner_tbYFjX .hero__content.flex.flex-col.bg-transparent {
color: #fff;
max-width: 500px;
text-align: left;
font-size: 20px;
}
#shopify-section-template--18072222007454__landing_banner_tbYFjX .hero__content.flex.flex-col.bg-transparent {
  color: #fff;
  max-width: 500px;
  text-align: left;
  font-size: 20px;
}
#shopify-section-template--18072222007454__landing_banner_tbYFjX .hero__content-wrapper {
justify-content: center;
align-items: start;
}
.game-type-box h2, .game-type-box h3 {
font-weight: 900;
}
.banner__hero.mask .lazypicture.block.w-full {
display: block;
}
.performace-style__top.mask.flex.items-center.justify-center.desktop\:py-\[100px\].bg-cover.bg-center.bg-no-repeat.px-16.py-72 {
padding-top: 66px;
}

@media only screen and (max-width: 1199px) {
#shopify-section-template--18072221974686__landing_banner_BbQiXY .hero {
height:800px;
}
}
@media only screen and (max-width: 991px) {
.game_card_circle {
width: 50% !important;
}
 .hero__text.leading-relaxed {
  width: 100% !important;
  max-width: 100%;
}
#shopify-section-template--18072222007454__landing_banner_tbYFjX .hero__content.flex.flex-col.bg-transparent, #shopify-section-template--18072221974686__landing_banner_BbQiXY .hero__content.flex.flex-col.bg-transparent {
max-width: 100% !important;
width: 100%;
}
#shopify-section-template--18072221974686__landing_banner_BbQiXY .hero__content.flex.flex-col.bg-transparent {
    align-items: center;
justify-content: center;
}
}
@media only screen and (max-width: 700px) {
.game_card_circle {
width: 100% !important;
}
#shopify-section-template--18072222007454__landing_banner_tbYFjX .banner__hero.mask .lazypicture.block.w-full {
height: 600px;
}
#shopify-section-template--18072222007454__landing_banner_tbYFjX .hero__content.flex.flex-col.bg-transparent {
max-width: 700px;
align-items: center;
justify-content: center;
}
}
@media only screen and (max-width: 600px) {
#shopify-section-template--18072222007454__landing_banner_tbYFjX .banner__hero.mask .lazypicture.block.w-full {
height: 700px !important;
}
.performace-style__top.mask.flex.items-center.justify-center.desktop\:py-\[100px\].bg-cover.bg-center.bg-no-repeat.px-16.py-72 {
padding-bottom: 40px !important;
}
#shopify-section-template--18072221974686__icon_with_text_fpKatm {
margin-top: -23px !important;
}
#shopify-section-template--18072221974686__collection_cta_74ncJK .cta-contanier.px-16.pb-32 {
padding-top: 3rem !important;
}
.side-video-with-text-inner .button-box {
  text-align: center !important;
}
.side-video-with-text-main.px-16.py-72 {
  padding-bottom: 0px !important;
}
}
@media only screen and (max-width: 420px) {
  #shopify-section-template--18072221974686__landing_banner_BbQiXY .hero {
  height: 850px !important;
}
}
#shopify-section-template--18072221974686__collection_cta_74ncJK .cta-contanier.px-16.pb-32 {
padding-top: 6rem;
}




.side-video-with-text-inner .button-box a {
border: 1px solid #2583b6 !important;
color: #fff !important;
background: #2583b6 !important;
}
.side-video-with-text-inner .button-box a:hover {
background-color: #161515 !important;
color: #fff !important;
border-color: #000 !important;
}
.side-video-with-text-main .side-video-with-text-inner .video-box {
  order: 2;
}
.cta-contanier .cta-grid.grid .cta-item__img-collection::after {
display: none !important;
}
.sec-head-text h2.title {
font-family: bebas-neue,sans-serif !important;
}
.game-type-box h2, .game-type-box h3 {
font-family: bebas-neue,sans-serif !important;
}
.performance-style .performance-style__top-content .step-cards .s-card-box p {
text-align: center !important;
}




.predictive_grid_main {
grid-template-columns: 1fr 415px;
gap: 50px;
}
.predictive_products_list {
/* padding-left: 124px; */
padding-block: 50px;
padding-left: 20px;
}
.predictive_products_cat_list {
/* padding-right: 124px; */
padding-left: 50px;
margin-right: 20px;
background-color: #f0f2f5;
padding-block: 50px;
}

@media (max-width: 991px) {
#predictive-search-results .predictive_products_cat_list {
  margin-right: 20px;
  margin-left: 0;
}
}

.predictive_products_cat_list ul + div{
margin-top: 40px
}
.predictive_products_list .predictive-search__view-all{
margin-top: 30px;
}
.predictive_products_list .predictive-search__view-all a{
font-size: 18px;
text-decoration: underline;
font-weight: 600;
}
.mobile_search_result{
display: none
}
.no_results_box{
background-color: #ffe6e6;
text-align: center;
padding-bottom:15px
}
.no_results_box h1{
font-size: 20px !important;
font-family: trade-gothic-next, sans-serif;
text-transform: none
}
.predictive_products_list.withNoItems{
padding-top: 0
}
@media (max-width: 1500px) and (min-width: 1201px) {
.desktop-top-result-not-search,
.predictive_products_list .predictive-search__results-list{
  grid-template-columns: repeat(3, 1fr) !important
}
}
@media (max-width: 1200px) and (min-width: 992px) {
.desktop-top-result-not-search,
.predictive_products_list .predictive-search__results-list{
  grid-template-columns: repeat(2, 1fr) !important
}
}
@media (max-width: 1024px) {
.predictive_products_list.withNoItems{
  padding-top: 30px
}
}
@media (max-width: 991px) {
.desktop-top-result-not-search {
    grid-template-columns: 1fr 1fr;
  }
.predictive_products_cat_list {
  padding-left: 20px;
   padding-block: 20px;
}
.predictive_products_list{
   padding-block: 20px;

}
.predictive_grid_main {
  grid-template-columns: 1fr 335px;
  gap: 20px;
}
}
@media (max-width: 767px) {
.desktop-top-result-not-search-main h1{
  font-size: 14px !important;
}
.desktop-top-result-not-search-main .collection-title{
  padding-bottom: 15px;
  margin-bottom: 15px
}
/* Mobile-only search fallback scrolling fix */
@media (max-width: 767px) {
  #search-fallback {
    /* Use 100dvh for better Safari support */
    height: calc(100dvh - var(--header-height, 64px)) !important;
    /* max-height: calc(100dvh - var(--header-height, 64px)) !important; */
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
    /* iOS Safari safe area handling */
    padding-bottom: max(env(safe-area-inset-bottom), 20px);
  }

  .predictive_grid_main {
    grid-template-columns: 100%;
    max-height: none; /* Allow natural height */
  }

  /* Additional padding for Safari bottom bar */
  .predictive_products_cat_list {
    padding-bottom: calc(30px + max(env(safe-area-inset-bottom), 20px));
  }

  /* Fallback for older Safari versions */
  @supports not (height: 100dvh) {
    #search-fallback {
      height: calc(100vh - var(--header-height, 64px) - 20px) !important;
      /* max-height: calc(100vh - var(--header-height, 64px) - 20px) !important; */
    }
  }
}
.predictive_products_list{
  padding-inline: 20px;
  padding-bottom: 0
}
.mobile_search_result{
display: block;
}
.mobile_search_result a{
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 10px;
  align-items: center;
}
.mobile_search_result a h3{
  font-size: 16px;
  white-space: nowrap; /* Prevent text from wrapping */
overflow: hidden;    /* Hide overflowing text */
text-overflow: ellipsis; /* Add ellipsis ("...") for overflowed text */
  text-transform: inherit !important;
  font-family: trade-gothic-next,sans-serif
}
.desktop-top-result-not-search .collection-carousel__slide,
.predictive_products_list .product-card{
  display: none !important
}
.desktop-top-result-not-search,
 .predictive_products_list .predictive-search__results-list{
   grid-template-columns: 100% !important;
   gap: 10px !important
 }
.predictive_products_cat_list{
  background-color: transparent;
  padding-block: 0 30px
}
.predictive_products_cat_list ul+div {
    margin-top: 10px;
}
.predictive_products_list .predictive-search__view-all{
  text-align: center
}

.pages_list_search li .predictive-search__details{
    white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.pages_list_search li:nth-child(n+4) {
display: none;
}
.predictive_grid_main h2{
  font-size: 26px;
}
.predictive_products_list .predictive-search__view-all a {
  font-size: 16px;
  text-decoration: none;
  font-weight: 400;
  width: calc(100% - 40px);
  display: flex;
  justify-content: center;
  margin: auto;
  background-color: #000;
  color: #fff;
  border-radius: 35px;
  height: 35px;
  align-items: center;
  padding-bottom: 4px;
}
}

/* new css start (21-7-2025) */

button.product-card__quickadd-desktop-btn.absolute.w-64.h-64.bg-white.justify-center.items-center.flex.desktop\:bottom-0.desktop\:right-20.rounded-full.shadow-lg {
  border-radius: 8px;
}
button.product-card__atc {
  border-radius: 4px;
}

quick-add.product-card__quickadd.w-full.bg-white.flex.flex-col.justify-start.items-center.relative.desktop\:pt-16 {
  border: 1px solid #00263A3D;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 4px;
  padding-top: 0px !important;
}

quick-add.product-card__quickadd.w-full.bg-white.flex.flex-col.justify-start.items-center.relative.desktop\:pt-16.sunilmobile.quickadd-no-variants {
  padding-top: 30px !important;
}

.product-option.product-color-option.py-16 {
padding: 0px;
}
.product-option {
padding-bottom: 0 !important;
padding-top: 10px !important;
}
.product-swatch__container {
padding-top: 5px !important;
}
.product-color-option .color-swatch {
width: 44px !important;
border: 1px solid #1615151F !important;
height: 44px !important;
cursor: pointer !important;
border-radius: 2px;
}
.product-color-option .color-swatch.active {
border-color: #000 !important;
}
.product-option {
padding-bottom: 0 !important;
padding-top: 10px !important;
}
.product-swatch__label {
padding: 8px 3px !important;
min-width: 55px !important;
}
button.product-card__atc {
margin: 10px 0 !important;
}
quick-add.product-card__quickadd.w-full.bg-white.flex.flex-col.justify-start.items-center.relative.desktop\:pt-16 {
border: 1px solid #00263A3D;
padding-left: 10px;
padding-right: 10px;
border-radius: 4px;
}
.img-quickadd .product-card__image-featured {
max-width: 80px;
}
quick-add.product-card__quickadd button.product-card__quickadd-desktop-btn {
width: 18px !important;
height: 18px !important;
top: 12px !important;
z-index: 3;
}
h4.product-swatch__header.pr-quk-add {
padding-top: 10px;
}
.product-card__quickadd .product-swatch__header {
font-size: 16px !important;
}
@media (max-width: 1025px) {
.product-card .product-card__quickadd {
  position: fixed;
  display: block !important;
  pointer-events: none;
  opacity: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: white;
  z-index: 10000;
  padding: 15px 15px 0;
  padding-top: 15px;
  padding-right: 15px;
  padding-left: 15px;
}
  product-card.product-card.quickadd-desktop-open::before {
  content: '';
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 999;
  background: black;
  opacity: 0.4;
}
.product-card.quickadd-desktop-open .product-card__quickadd {
  opacity: 1 !important;
  pointer-events: auto !important;
}
  quick-add button.product-card__quickadd-desktop-btn {
  position: absolute;
}
  button.product-card__quickadd-desktop-btn {
  width: 2rem !important;
  height: 2rem !important;
  right: 1rem !important;
  bottom: 0 !important;
}

  .product-card.quickadd-desktop-open .product-card__quickadd {
  pointer-events: auto !important;
}
  .product-card .product-card__quickadd {
  pointer-events: none;
}
  .img-quickadd {
  display: flex;
  column-gap: 11px;
  align-items: center;
}
}
s-drawer {
  z-index: 99999;
}

/* new css start (06-08-2025) */

.collection-grid__grid-item .product-card.relative.block.quickadd-desktop-open .product-card__quickadd.w-full.bg-white.flex.flex-col.justify-start.items-center.relative.desktop\:pt-16.sunilmobile .img-quickadd {
display: none;
}

.collection-grid__grid-item .product-card.relative.block.quickadd-desktop-open .product-card__quickadd.w-full.bg-white.flex.flex-col.justify-start.items-center.relative.desktop\:pt-16.sunilmobile .product-swatch__header.pr-quk-add {
display: none;
}

@media (max-width: 1025px) {

#MobileQuickAddDrawer .mobile-quickadd-drawer__content .product-card__image-featured.w-1\/2.mx-auto {
  display: none;
}
#MobileQuickAddDrawer {
  padding: 0;
  border-radius: 5px;
}


#MobileQuickAddDrawer .mobile-quickadd-drawer__content .product-card__quickadd.w-full.bg-white.flex.flex-col.justify-start.items-center.relative.desktop\:pt-16.sunilmobile {
  display: block !important;
}

#MobileQuickAddDrawer .mobile-quickadd-drawer__content .product-card__quickadd.w-full.bg-white.flex.flex-col.justify-start.items-center.relative.desktop\:pt-16.sunilmobile .product-card__options.w-full.flex.flex-col.no-js-hidden .product-option.var-opt-1.option-Size.py-16.order-2 .product-option__swatch.product-swatch.relative .product-swatch__container.pt-8.desktop\:pt-28.flex.flex-wrap.gap-y-8.justify-center {
  justify-content: start;
}
#MobileQuickAddDrawer .mobile-quickadd-drawer__btn.w-24.h-24.bg-white.flex.justify-center.items-center.absolute.top-24.right-24 {
z-index: 99;
top: 10px;
  right: 10px;
}
#MobileQuickAddDrawer .mobile-quickadd-drawer__btn.w-24.h-24.bg-white.flex.justify-center.items-center.absolute.top-24.right-24 .mobile-quickadd-drawer__btn--close.w-8 {
width: 1rem;
}
#MobileQuickAddDrawer .mobile-quickadd-drawer__content .product-card__quickadd.w-full.bg-white.flex.flex-col.justify-start.items-center.relative.desktop\:pt-16.sunilmobile .product-card__options.w-full.flex.flex-col.no-js-hidden .product-option.multi-opt.var-opt-2.option-Style.py-16.order-2 .product-option__swatch.product-swatch.relative .product-swatch__container.pt-8.desktop\:pt-28.flex.flex-wrap.gap-y-8.justify-center {
justify-content: start;
}
}

@media (min-width: 1026px) {
.product-collection__carousel.block.mt-16.relative .cs-collection-carousel.w-full.p-16.desktop\:mt-32.desktop\:p-24.slick-initialized.slick-slider.slick-dotted .slick-list.draggable .product-collection__slide.mr-16.slick-slide .product-card.relative.block.quickadd-desktop-open .product-card__quickadd.w-full.bg-white.flex.flex-col.justify-start.items-center.relative.desktop\:pt-16.sunilmobile .product-swatch__header.pr-quk-add {
display: none;
}
.product-collection__carousel.block.mt-16.relative .cs-collection-carousel.w-full.p-16.desktop\:mt-32.desktop\:p-24.slick-initialized.slick-slider.slick-dotted .slick-list.draggable .product-collection__slide.mr-16.slick-slide .product-card.relative.block.quickadd-desktop-open .product-card__quickadd.w-full.bg-white.flex.flex-col.justify-start.items-center.relative.desktop\:pt-16.sunilmobile .img-quickadd {
display: none;
}
.collection-carousel__slide .product-card.relative.block .product-card__quickadd .product-swatch__header.pr-quk-add {
display:none;
}
.collection-carousel__slide .product-card.relative.block .product-card__quickadd .img-quickadd {
display:none;
}
}
button.product-card__quickadd-desktop-btn.absolute.w-64.h-64.bg-white.justify-center.items-center.hidden.desktop\:flex.desktop\:bottom-0.desktop\:right-20.rounded-full.shadow-lg {
border-radius: 8px;
}
.product-recommendations__carousel .product-card__price {
  /* display: none; */
}

/* New homepage refresh */
.rounded-semi {
border-radius: 0.5rem;
}

@media (max-width: 767px) {
.hero__link {
  font-size: 1.75rem !important;
}

.btn {
  font-size: 1.5rem;
  padding: 0.5rem 1.5rem;
}

.icon--cart-add {
  margin-bottom: 3px !important;
}
}

/* ===== Hero Improved Section Styles (scoped to hero-section--improved only) ===== */
/* Scoped to only affect hero-improved section, not regular hero sections */
.hero-section--improved {
  overflow: visible;
  margin: 0;
  padding: 0;
}

.js-hero-carousel {
  /* Show first slide by default for progressive enhancement */
  opacity: 1;
  visibility: visible;
  transition: opacity 1s ease;
  -webkit-transition: opacity 1s ease;
  overflow: visible;
}

/* Ensure first slide is visible before Slick initializes */
.js-hero-carousel:not(.slick-initialized) .hero-carousel__slide:first-child {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.js-hero-carousel:not(.slick-initialized) .hero-carousel__slide:not(:first-child) {
  display: none;
}

.js-hero-carousel.slick-initialized {
  visibility: visible;
  opacity: 1;
}

.js-hero-carousel .slick-dots {
  bottom: -40px;
  position: absolute !important;
  /* display: block; */
  /* visibility: visible !important;
  opacity: 1 !important;
  z-index: 10; */
}

.js-hero-carousel .slick-dots li {
  margin: 0;
}

.js-hero-carousel .slick-dots li button {
  background-color: #D3DBE4;
  border-radius: 50%;
  width: 10px;
  height: 10px;
}

.js-hero-carousel .slick-dots li button:before {
  display: none;
}

.js-hero-carousel .slick-dots li.slick-active button {
  background-color: #DC3848;
  /* border: 1px solid #DC3848; */
}

.hero-section--improved .hero-carousel__slide {
  position: relative;
}

.hero-section--improved .hero-carousel__slide a .lazypicture img {
  border-radius: 6px;
}

.hero-section--improved .slick-slide {
  transform: scale(1);
  opacity: .4;
  transition: transform .25s, opacity .25s;
  padding: 0 12px;
}

@media(max-width: 768px){
  .hero-section--improved .slick-slide {
    transform: scale(.92);
    padding: 0;
    opacity: 0.6;
  }

  .hero-section--improved .slick-center {
    transform: scale(1);
    opacity: 1;
  }
}

.hero-section--improved .slick-center {
  transform: scale(1);
  opacity: 1;
  z-index: 2;
}

.js-hero-carousel.slick-dotted.slick-slider {
  top: 15px;
  margin-bottom: 50px;
}

/* Inactive hero slides are not clickable; click selects them instead */
.js-hero-carousel .slick-slide:not(.slick-current) a.hero,
.js-hero-carousel .slick-slide:not(.slick-current) .hero__link {
  pointer-events: none;
}

/* ===== Fandom Brands Block (scoped) - Critical Above Fold ===== */
.fandom-brands-blocks-container .fandom-brands-blocks-inner{
--gap: clamp(15px, 2vw, 20px);
--min: 90px;
display: grid;
gap: var(--gap);
/* Optimized grid calculation - reduced complexity */
grid-template-columns: repeat(auto-fit, minmax(max(var(--min), calc((100% - 5 * var(--gap)) / 6)), 1fr));
margin-top: 15px;
/* CSS containment for better performance */
contain: layout style paint;
/* Critical above-the-fold optimizations */
will-change: auto;
transform: translateZ(0);
}

/* Remove padding on mobile */
@media (max-width: 767px) {
.fandom-brands-blocks-container .fandom-brands-blocks-inner {
  padding: 0 !important;
}
}

/* tile/card */
.fandom-brands-blocks-container .brand-image-box{
position: relative;
border: 1px solid #D1D8DB;
border-radius: 6px;
background: #F0F2F3;
--shadow-rgb: 16, 24, 40;
box-shadow:
  0 1px 2px rgba(var(--shadow-rgb), .04),
  0 8px 16px rgba(var(--shadow-rgb), .06);
aspect-ratio: 16 / 10;
display: grid;
place-items: center;
overflow: hidden; /* keeps radius on media */
/* CSS containment for better performance */
contain: layout style paint;
}

/* link/wrapper spans the full tile so we can absolutely-position children */
.fandom-brands-blocks-container .brand-image-box > a,
.fandom-brands-blocks-container .brand-image-box > .brand-media-wrap{
display:block; width:100%; height:100%; position:relative;
}

/* shared media fit */
.fandom-brands-blocks-container .brand-image-box .brand-card__media{
width: 100%;
height: 100%;
object-fit: var(--fit, contain); /* logos usually ‘contain’ */
border-radius: inherit;
display: block;
}

/* videos default to cover unless you switch in the editor */
.fandom-brands-blocks-container .brand-image-box[data-type="video"]{ --fit: cover; }

/* external videos (YouTube/Vimeo iframes) fill too */
.fandom-brands-blocks-container .brand-image-box iframe.brand-card__media{
width: 100% !important;
height: 100% !important;
border: 0;
}

/* ----- Poster + cross-fade for video cards ----- */
.fandom-brands-blocks-container .brand-image-box[data-type="video"] .brand-card__poster,
.fandom-brands-blocks-container .brand-image-box[data-type="video"] .brand-card__media{
position:absolute; inset:0;
width:100%; height:100%;
border-radius:inherit;
transition:opacity .18s ease;
}
.fandom-brands-blocks-container .brand-image-box[data-type="video"] .brand-card__poster{
object-fit: contain; opacity:1; z-index:1;
}
.fandom-brands-blocks-container .brand-image-box[data-type="video"] .brand-card__media{
object-fit: var(--fit, cover); opacity:0;
}

/* when playing, flip visibility */
.fandom-brands-blocks-container .brand-image-box.is-playing .brand-card__poster{ opacity:0; }
.fandom-brands-blocks-container .brand-image-box.is-playing .brand-card__media{ opacity:1; }

/* ---------- HOVER RINGS + LIFT ---------- */
.fandom-brands-blocks-container .image-with-text-block-single{ position: relative; isolation: isolate; }

.fandom-brands-blocks-container .brand-image-box{
--radius: 6px;
transition: box-shadow .18s ease, transform .18s ease,
            background-color .18s ease, border-color .18s ease;
}
.fandom-brands-blocks-container .brand-image-box:hover { box-shadow: none; }

/* OUTER RED RING - DESKTOP ONLY */
@media (min-width: 768px) {
.fandom-brands-blocks-container .image-with-text-block-single::before{
  content:"";
  position:absolute;
  inset:-8px;
  border:4px solid #DC3848;
  border-radius: 12px;
  opacity:0;
  transform:scale(1.03);
  pointer-events:none;
  z-index:2;
  transition:opacity .18s ease, transform .18s ease;
}

/* INNER WHITE STROKE (optional) */
.fandom-brands-blocks-container .brand-image-box::after{
  content:"";
  position:absolute;
  inset:8px;
  border-radius:calc(var(--radius) - 2px);
  opacity:0;
  transform:scale(.98);
  pointer-events:none;
  z-index:2;
  transition:opacity .18s ease, transform .18s ease;
}

/* HOVER / KEYBOARD FOCUS STATES */
.fandom-brands-blocks-container .image-with-text-block-single:hover::before,
.fandom-brands-blocks-container .image-with-text-block-single:focus-within::before,
.fandom-brands-blocks-container .image-with-text-block-single:hover .brand-image-box::after,
.fandom-brands-blocks-container .image-with-text-block-single:focus-within .brand-image-box::after{
  opacity:1;
}
}
.fandom-brands-blocks-container .image-with-text-block-single:hover .brand-image-box,
.fandom-brands-blocks-container .image-with-text-block-single:focus-within .brand-image-box{
background:transparent;
border-color:transparent;
transform:scale(1.03);
}

/* pointer affordance */
.fandom-brands-blocks-container .brand-image-box{ cursor: pointer; }

/* Never play video on touch devices — always show poster */
@media (hover: none), (pointer: coarse){
.fandom-brands-blocks-container .brand-image-box[data-type="video"] .brand-card__media { opacity: 0 !important; }
.fandom-brands-blocks-container .brand-image-box[data-type="video"] .brand-card__poster { opacity: 1 !important; }
}

/* Responsive grid adjustments */
/* @media (max-width: 1200px) {
.fandom-brands-blocks-container .fandom-brands-blocks-inner {
  max-width: calc(5 * 110px + 4 * var(--gap));
}
}

@media (max-width: 900px) {
.fandom-brands-blocks-container .fandom-brands-blocks-inner {
  max-width: calc(4 * 110px + 3 * var(--gap));
}
}

@media (max-width: 600px) {
.fandom-brands-blocks-container .fandom-brands-blocks-inner {
  max-width: calc(3 * 110px + 2 * var(--gap));
}
}

@media (max-width: 400px) {
.fandom-brands-blocks-container .fandom-brands-blocks-inner {
  max-width: calc(2 * 110px + 1 * var(--gap));
}
} */

@media (max-width: 767px){
.fandom-brands-blocks-container .image-with-text-blocks .title-box .btn {
  max-width: none;
  text-align: center;
}
}

/* ===== End Of Fandom Brands Block ===== */

/* ===== Mini Hero Carousel ===== */
/* Header: title + controls */
.mini-hero .mini-hero__header{
display:flex;
align-items:center;
justify-content:space-between;
gap:1rem;
padding-bottom: .5rem !important;
/* CSS containment for better performance */
contain: layout style paint;
}

.mini-hero .mini-hero__slider{
padding-right: 0;
position: relative;
overflow: hidden;
contain: layout style paint;
touch-action: none; /* Desktop: Let JS handle all touch direction detection */
}

/* Mobile override: Allow vertical scroll by default on mobile */
@media (max-width: 1025px) {
  .mini-hero .mini-hero__slider {
    touch-action: pan-y pinch-zoom;
  }
}

/* TranslateX-based Carousel Implementation for Mini Hero */
.mini-hero .mini-hero__track{
  display: flex;
  gap: var(--gap, 20px);
  padding-top: 1rem;
  padding-bottom: 1rem;
  will-change: transform;
  backface-visibility: hidden;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
}

.mini-hero .mini-hero__slider .mini-hero__slide{
  flex: 0 0 var(--slide-width, auto);
  flex-shrink: 0;
  height: auto;
  padding-left: 20px;
}

.mini-hero .js-mini-hero-slider{
  padding-right: var(--peek, 0px) !important;
  padding-left: 0;
  box-sizing: border-box;
}

/* Slider Track (Slick) */
.mini-hero .mini-hero__slider .slick-track{
display:flex !important;
gap: var(--gap, 20px);
align-items:stretch;
padding-top:1rem;
padding-bottom:1rem;

/* Performance optimizations */
will-change: transform;
backface-visibility: hidden;
transform: translateZ(0);
contain: layout style paint;
}

/* Slick list box model kept stable; JS may set padding-right for the peek */
.mini-hero .mini-hero__slider .slick-list{
box-sizing:border-box;
margin-left:0;
margin-right:0;
padding-left:0;
padding-right:0;

-webkit-tap-highlight-color:transparent;
contain: paint;
}

/* Slide padding (we're spacing with track gap, so no extra padding here) */
.mini-hero .mini-hero__slider .slick-slide{
padding-left: 20px;
}

/* Ensure slides auto-size in height */
.mini-hero .mini-hero__slide .slick-slide{
height:auto;
}

/* ===========================
 Card
 =========================== */

.mini-hero .mini-card{
position:relative;
display:block;
}

.mini-hero .mini-card__box{
position:relative;
width:100%;
aspect-ratio:3 / 4;
overflow:hidden;
border-radius: var(--card-radius, 6px);
}

.mini-hero .mini-card__image{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
}

/* ensure the peek padding is actually honored */
.mini-hero .js-mini-hero-slider .slick-list{
padding-right: var(--peek, 0px) !important; /* beats theme defaults */
}

/* Optional: stable pre-init layout so there’s no flicker before Slick */
.mini-hero .js-mini-hero-slider:not(.slick-initialized){
display: flex; gap: var(--gap, 20px);
overflow: hidden;
}
/* .mini-hero .js-mini-hero-slider:not(.slick-initialized) > *{
flex: 0 0 calc((100% - (var(--gap,20px) * (var(--cols,4) - 1))) / var(--cols,4));
} */

.mini-hero .mini-card:before {
content:"";
position:absolute;
inset:0;
border-radius: calc(var(--card-radius, 6px) * 2);
background: linear-gradient(
  to top,
  rgba(0,0,0,.70) 0%,
  rgba(0,0,0,.45) 35%,
  rgba(0,0,0,0) 70%
);
opacity:0;
transition: opacity .2s ease;
pointer-events:none;
z-index:1;
}

@media (hover:hover) and (pointer:fine){
.mini-hero .mini-card:hover::before,
.mini-hero .mini-card:focus-within::before{ opacity:1; }
}

/* Hover outline (desktop/hover-capable only). Also show on keyboard focus */
.mini-hero .mini-card::after{
content:"";
position:absolute;
inset:-8px;
border-radius: calc(var(--card-radius, 6px) * 2);
border:4px solid var(--hover-outline, #FF4B4B);
opacity:0;
transition:opacity .18s ease;
pointer-events:none;
z-index: 1;
}

@media (hover:hover) and (pointer:fine){
.mini-hero .mini-card:hover::after,
.mini-hero .mini-card:focus-visible::after {
  opacity:1;
}
}

/* ===========================
 CTA
 =========================== */

.mini-hero .mini-card__cta-wrap{
position:absolute;
left:50%;
bottom:16px;
transform:translateX(-50%);
display:inline-block;
transition:opacity .18s ease, transform .18s ease;
width:100%;
}

.mini-hero .mini-card__cta{
background: var(--cta-bg, transparent);
color: var(--cta-fg, #FFFFFF);
margin:0 auto;
display:block;
padding:0.25rem 1rem !important;
}

@media (hover:hover) and (pointer:fine){
.mini-hero .mini-card .mini-card__cta:hover{
  background: var(--cta-bg-hover, #FFFFFF);
  color: var(--cta-fg-hover, #178AD3);
}
}

/* Desktop: reveal CTA on hover/focus */
@media (hover:hover) and (pointer:fine){
.mini-hero .mini-card__cta-wrap{
  opacity:0;
  transform:translate(-50%, 8px);
  z-index: 2;
}
.mini-hero .mini-card:hover .mini-card__cta-wrap,
.mini-hero .mini-card:focus-visible .mini-card__cta-wrap{
  opacity:1;
  transform:translate(-50%, 0);
}
}

/* Mobile: CTA always visible */
@media (hover:none){
.mini-hero .mini-card__cta-wrap{ opacity:1; }
}

/* ===========================
 Legal Line
 =========================== */

.mini-hero .mini-card__legal{
position:absolute;
right:10px;
bottom:8px;
color:#fff;
opacity:.7;
font-size:10px;
line-height:1;
text-shadow:0 1px 2px rgba(0,0,0,.45);
}
/* ===== End Of Mini Hero Carousel ===== */

/* ===== RSVLTS Classic Carousel ===== */
.landscape-cards{
--lc-hero-ratio: 16/9;
--lc-thumb-ratio: 16/9;
/* CSS containment for better performance */
contain: layout style paint;
}

/* Header */
.landscape-cards__header{
display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.landscape-cards__title{ margin:0; }

/* -------- Mobile grid (no carousel) -------- */
.landscape-cards__slider{
display:grid;
grid-template-columns: repeat(3, 1fr);
gap: calc(var(--gap) / 2);
padding-left: 1rem;
padding-right: 1rem;
}
/* Mobile: display:contents makes track invisible to grid, cards act as direct children */
.landscape-cards__track{ display: contents; }
.landscape-cards__slider .lc-card:first-child{ grid-column: 1 / -1; }

.lc-card{ display:block; text-decoration:none; color:inherit; }
.lc-card__media{
position:relative; width:100%;
aspect-ratio: var(--lc-ratio, 16/9);
overflow:hidden; border-radius: var(--card-radius, 10px);
}
.landscape-cards__slider .lc-card:first-child .lc-card__media{ --lc-ratio: var(--lc-hero-ratio); }
.landscape-cards__slider .lc-card:not(:first-child) .lc-card__media{ --lc-ratio: var(--lc-thumb-ratio); }

@media (max-width: 767px){
.landscape-cards{ --lc-thumb-ratio: 1/1; }
}
.lc-card__media img.lc-card__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; aspect-ratio:auto; }

/* Subtitle */
.lc-card__subtitle{
margin-top:.5rem; line-height:1.2; display:block;
display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
@media (max-width: 767px){ .lc-card__subtitle{ display:none; } }

/* -------- Desktop (carousel) -------- */
@media (min-width: 768px){
.landscape-cards__slider{
  display:block;
  padding-left:0;
  padding-right:0;
  position: relative;
  overflow: hidden;
  contain: layout style paint;
  touch-action: none; /* Let JS handle all touch direction detection on desktop */
  /* Reserve height to prevent CLS when JS creates track */
  min-height: 236px;
}

/* TranslateX-based Carousel Implementation for Landscape Cards */
.landscape-cards .landscape-cards__track{
  display: flex;
  gap: var(--gap, 20px);
  will-change: transform;
  backface-visibility: hidden;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  align-items: stretch;
}

.landscape-cards .landscape-cards__slider .lc-card{
  flex: 0 0 var(--slide-width, auto);
  flex-shrink: 0;
  height: auto;
  padding: 0;
}

.landscape-cards .js-landscape-cards{
  padding-right: var(--peek, 0px) !important;
  padding-left: 0;
  box-sizing: border-box;
}

/* PRE-INIT: match layout to prevent CLS (track is pre-rendered in Liquid) */
.landscape-cards .js-landscape-cards:not([data-initialized]){
  overflow: hidden;
}
.landscape-cards .js-landscape-cards:not([data-initialized]) .landscape-cards__track{
  display: flex;
  gap: var(--gap, 20px);
}
.landscape-cards .js-landscape-cards:not([data-initialized]) .lc-card{
  /* Match JS calculation: slideWidth = (railWidth - totalGaps) / (floor(cols) + peekFrac) */
  --total-cols: calc(var(--cols-floor, 3) + var(--peek-frac, 0.4));
  --total-gaps: calc((var(--cols-floor, 3) - 1) * var(--gap, 20px));
  flex: 0 0 calc((100% - var(--total-gaps)) / var(--total-cols));
}
}

/* Mobile-only CTA */
.landscape-cards__mobile-cta{ display:none; margin-top:1rem; width:100%; text-align:center; }
@media (max-width: 767px){
.landscape-cards__mobile-cta{ display:block; margin-left:1rem; margin-right:1rem; width:auto; }
}
/* ===== End Of RSVLTS Classic Carousel ===== */

/* ===== Top-10 Carousel ===== */
.top10 {
background: var(--section-bg, #F5F7F8);
/* CSS containment for better performance */
contain: layout style paint;
/* Apply margin variables to section */
margin-top: var(--mt, 0px);
margin-bottom: var(--mb, 0px);
}

.top10__header{
display:flex;
align-items:center;
justify-content:space-between;
gap:1rem;
}

.top10__slider{
  padding-bottom: 2rem;
  padding-right: 0;
}

/* TranslateX-based Carousel Implementation */
.top10 .top10__slider{
  position: relative;
  overflow: hidden;
  contain: layout style paint;
  touch-action: none; /* Let JS handle all touch direction detection */
}

.top10 .top10__track{
  display: flex;
  gap: var(--gap, 20px);
  will-change: transform;
  backface-visibility: hidden;
  transform: translateZ(0);
  /* Force GPU acceleration */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
}

.top10 .top10__slider .top10__slide{
  flex: 0 0 var(--slide-width, auto);
  flex-shrink: 0;
  height: auto;
  padding-left: 20px;
}

/* Fill slide height */
.top10 .top10__slide,
.top10 .top10-card{ height:100%; }

/* Wipe any whole-card framing from theme */
.top10 .top10-card{
position:relative;
background:transparent;
border:0;
padding:0;
}

/* Reserve height + honor peek from first paint */
.top10 .product-card__image-featured{ aspect-ratio: 2 /2; }
.top10 .product-card__image-featured img{ width:100%; height:100%; object-fit:cover; display:block; }

/* Peek effect - show partial next slide */
.top10 .js-top10-slider{
  padding-right: var(--peek, 0px) !important;
  padding-left: 0;
  box-sizing: border-box;
}

/* Pre-init layout (before JS calculates) */
.top10 .js-top10-slider:not([data-initialized]){
  display:flex;
  gap: var(--gap, 20px);
  overflow: hidden;
}
.top10 .js-top10-slider:not([data-initialized]) > .top10__slide{
  flex: 0 0 calc((100% - (var(--gap,20px) * (var(--cols,4) - 1))) / var(--cols,4));
}

/* Mobile-specific fixes for Top 10 carousel */
@media (max-width: 767px){
/* Mobile margin overrides */
.top10 {
  margin-top: var(--mt-m, var(--mt, 0px));
  margin-bottom: var(--mb-m, var(--mb, 0px));
}

/* Mobile: Allow vertical scroll by default, JS will switch to pan-x for horizontal drag */
.top10 .js-top10-slider {
  touch-action: pan-y pinch-zoom;
  -ms-touch-action: pan-y pinch-zoom;
  user-select: none;
}

/* Enable peek effect on mobile - show 1.25 slides */
.top10 .js-top10-slider:not([data-initialized]) > .top10__slide {
  flex: 0 0 85% !important; /* 85% width allows 15% peek of next slide */
  width: 85% !important;
  margin-right: 0 !important;
}

/* Ensure proper initial layout before JS initialization */
.top10 .js-top10-slider:not([data-initialized]) {
  display: flex !important;
  overflow: hidden !important;
}

/* Prevent layout shifts during carousel initialization */
.top10 .js-top10-slider {
  min-height: 300px;
  contain: layout style paint;
}

/* Optimize touch interactions */
.top10 .top10-card {
  pointer-events: auto;
  touch-action: manipulation;
}
}

/* =========================
 Frame only the IMAGE area
 ========================= */
.top10-card .product-card__image-featured {
position:relative;
border: var(--img-border-w, 2px) solid var(--card-border, #DADFE3);
border-radius: var(--img-radius, 16px);
overflow:hidden;
background:#fff;
}

.top10-card .product-card__image-featured::before{
content:"";
position:absolute;
left: -25px;
top: 28px;
width: 136px;
height: 16px;
background: var(--badge-fg, #0E2B33);
transform: rotate(-42deg) translateZ(0);
z-index: 2;                        /* ← below badge (3), above image */
pointer-events:none;
/* Simple flickering prevention */
will-change: auto;
backface-visibility: hidden;
}

.top10 .top10-card :is(.top10-card__row) {
  line-height: 1.3;
}


/* Text colors (hooked to section variables) */
.top10 .top10-card :is(.product-card__vendor, .pc__vendor) {
 color: var(--vendor-color, #0E2832);
 font-family: bebas-neue,sans-serif;
  font-weight: 500;
  font-size: 18px;
}

.top10 .top10-card :is(.product-card__title, .pc__title) {
color: var(--title-color, #0E2832);
text-transform: uppercase;
font-family: bebas-neue,sans-serif;
font-weight: 500;
font-size: 18px;
line-height: 1.3;
}

.top10 .top10-card :is(.price, .product-card__price, .pc__price) {
color: var(--price-color, #0E2832);
font-family: bebas-neue,sans-serif;
font-weight: 500;
font-size: 18px;
}

/* =========================
 Overlays: badge, quick-add
 ========================= */

/* Badge (triangular ribbon) */
.top10 .top10-badge {
position:absolute;
top: var(--img-border-w, 2px);
left: var(--img-border-w, 2px);
--badge-box: 85px;
width: var(--badge-box);
height: var(--badge-box);
overflow:hidden;
border-top-left-radius: calc(var(--img-radius, 16px) - var(--img-border-w, 2px));
background: none;
pointer-events:none;
z-index: 3;
/* Simple flickering prevention */
will-change: auto;
transform: translateZ(0);
backface-visibility: hidden;
}

.top10 .top10-badge::before{
content:"";
position:absolute;
inset:0;
background: var(--badge-bg, #D23C3C);
-webkit-clip-path: polygon(0 0, 100% 0, 0 100%);
        clip-path: polygon(0 0, 100% 0, 0 100%);
/* Simple flickering prevention */
will-change: auto;
backface-visibility: hidden;
}

.top10 .top10-badge::after{
content: attr(data-n);
position: absolute;
left: 12px;
top: 6px;
font-size: 46px;
line-height: 1;
color: var(--badge-num, #fff);
text-shadow: 0 2px 0 rgba(0,0,0,.15);
font-family: bebas-neue,sans-serif;
/* Simple flickering prevention */
will-change: auto;
backface-visibility: hidden;
}

/* Quick add: keep inside the framed image (bottom-right) */
/* .top10 .top10-card .product-card__quickadd-desktop-btn{
right:15px;
bottom:100px;
filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
z-index:3;
} */

.top10 .top10-card .product-card__quickadd-desktop-btn[js-toogle-desktop-quickadd] {
right:15px;
bottom: 16px;
filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
z-index:3;
/* Prevent flickering during carousel updates */
will-change: auto;
transform: translateZ(0);
backface-visibility: hidden;
}

.top10 .top10-card .product-card__quickadd-mobile-btn{
/* top: 79%; */
bottom: 1rem;
width: 3rem !important;
height: 3rem !important;
filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
/* Prevent flickering during carousel updates */
will-change: auto;
transform: translateZ(0);
backface-visibility: hidden;
}

.top10 .top10-card .product-card__quickadd {
padding: 0.5rem 1rem;
border: 1px solid #D1D8DB;
border-radius: 6px;
z-index: 4;
}

.top10 .top10-card .product-card__options .py-16 {
padding-bottom:0;
}

/* Prevent badge flashing during carousel scrolling */
.top10 .product-card__logo-badge-container,
.top10 .product-card__new-tag,
.top10 .product-card__soldout-tag {
  will-change: auto;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

/* Ensure badge child elements are also accelerated */
.top10 .badge__logo-wrapper,
.top10 .badge__messaging-wrapper {
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

/* Optional circular art overlay */
.top10 .top10-thumb{
--thumb-size:120px;
--thumb-left:16px;
--thumb-bottom:28%;
position:absolute;
left:var(--thumb-left);
bottom:var(--thumb-bottom);
width:var(--thumb-size);
height:var(--thumb-size);
border-radius:50%;
overflow:hidden;
background:#fff;
border:4px solid #fff;
box-shadow:0 8px 24px rgba(0,0,0,.18);
z-index:3;
pointer-events:none;
}
.top10 .top10-thumb__img{ width:100%; height:100%; object-fit:cover; display:block; }

@media (max-width: 767px){
.top10 .top10-thumb{
  --thumb-size:92px;
  --thumb-left:12px;
  --thumb-bottom:24%;
}
}
/* ===== End Of Top-10 Carousel ===== */

/* ===== Collection Tabs Carousel ===== */

/* Hidden panels - keep measurable but invisible */
.collection-tab__panel[hidden],
.tab__panel[hidden],
.collection-tab__panel[aria-hidden="true"],
.tab__panel.is-hidden {
display: block !important;
position: absolute !important;
left: -99999px !important;
width: 100% !important;
opacity: 0 !important;
pointer-events: none !important;
overflow: hidden !important;
}

/* Show navigation dots for all carousels */
.cs-collection-carousel .slick-dots,
.cs-collection-carousel .flickity-page-dots {
/* display: block !important; */
/* position: absolute !important; */
/* left: 0;
bottom: 0; */
}

/* Tabs container */
.tabs-container {
display: flex;
align-items: center;
gap: 12px;
flex-direction: row;
justify-content: space-between;
}

@media (max-width: 767px) {
.tabs-container {
  flex-direction: column;
  align-items: stretch;
}
.tabs-container h2 {
  margin-bottom: 1rem;
}
}

/* Tab triggers */
.collection-tab__triggers[role="tablist"] {
display: flex;
gap: 12px;
flex: 1 1 auto;
min-width: 0;
justify-content: flex-start;
flex-wrap: nowrap;
overflow-x: auto;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
overscroll-behavior-x: contain;
scroll-snap-type: x proximity;
padding: 0 1rem;
margin-inline: calc(1rem * -1);
scrollbar-width: none;
scroll-padding-left: 6rem;
scroll-padding-right: 6rem;
}

@media (min-width: 767px) {
.collection-tab__triggers[role="tablist"] {
  gap: 16px;
  justify-content: flex-end;
}
}

/* Hide scrollbar */
.collection-tab__triggers[role="tablist"]::-webkit-scrollbar {
height: 0;
}

/* Tab buttons */
.collection-tab__triggers button {
font-family: bebas-neue, sans-serif;
line-height: 1;
border: 1.5px solid;
opacity: 0.6;
padding: 14px 24px;
margin: 0;
flex: 0 0 auto;
scroll-snap-align: center;
transition: opacity 0.2s ease;
}

.collection-tab__triggers button[aria-selected="true"] {
opacity: 1;
}

@media (max-width: 767px) {
.collection-tab__triggers button {
  font-size: 18px;
  padding: 16px 22px;
  min-height: 56px;
}
}

/* CTA container */
.collection-carousel__cta-container {
margin-top: -20px;
}

/* Product card info spacing */
.collection-carousel__container .collection-tabs__flickity .cs-collection-carousel .collection-carousel__slide .product-card .product-card__info p,
.collection-carousel__container .collection-tabs__flickity .cs-collection-carousel .collection-carousel__slide .product-card .product-card__info div {
padding-bottom: 0 !important;
margin-bottom: -5px;
}

/* Mobile slide width - only for collection carousel */
@media (max-width: 767px) {
.collection-tabs-carousel .slick-slide {
  /* max-width: 185px !important; */
}
}

/* Carousel pre-init state */
.cs-collection-carousel.is-prehide {
visibility: hidden;
overflow: hidden;
}

.cs-collection-carousel:not(.flickity-enabled) {
display: flex;
flex-direction: column;
/* gap: clamp(12px, 2vw, 20px); */
}

.cs-collection-carousel:not(.flickity-enabled) .collection-carousel__slide {
flex: 0 0 clamp(220px, 22vw, 340px);
box-sizing: border-box;
}


/* Product card images */
.product-card__image-featured img,
.product-card__image-featured picture {
display: block;
width: 100%;
height: auto;
object-fit: cover;
/* Performance optimizations */
will-change: auto;
transform: translateZ(0);
/* Prevent infinite resizing */
max-width: 100%;
min-width: 0;
flex-shrink: 0;
}

/* Carousel performance optimizations */
.collection-tabs__flickity {
contain: layout style paint;
}

.cs-collection-carousel {
will-change: transform;
backface-visibility: hidden;
transform: translateZ(0);
}

/* ===== End Of Collection Tabs Carousel ===== */

/* ===== Universal Trackpad Scrolling Support ===== */
.cs-collection-carousel,
.product-collection__carousel {
scroll-behavior: smooth;
-webkit-overflow-scrolling: touch;
}

/* Ensure smooth trackpad scrolling on Flickity carousels */
.flickity-enabled .flickity-viewport {
scroll-behavior: smooth;
}

/* Ensure smooth trackpad scrolling on Slick carousels */
.slick-initialized .slick-list {
scroll-behavior: smooth;
}

/* ===== End Of Universal Trackpad Scrolling Support ===== */

/* =================== Featured Grid Cards (fg-cards*) =================== */
.fg-layout{
--fg-gap: var(--fg-gap, 24px);
--fg-radius: 6px;
--fg-row-h: 240px;         /* right-grid row height (desktop) */
display: grid;
gap: var(--fg-gap);
grid-template-columns: 1fr 2fr;  /* hero | grid (desktop default) */
align-items: stretch;
}

@media (max-width: 767px){
.fg-layout {
  gap: calc(var(--fg-gap) / 2);
}
}

/* ===== Hero (left column) ===== */
.fg-hero {
position: relative;
border-radius: var(--fg-radius);
/* overflow: hidden;  */
}

/* Only set the fixed hero height on desktop */
@media (min-width: 767px){
.fg-hero{ height: calc(var(--fg-row-h) * 2 + var(--fg-gap)); }
}

/* ===== Reusable card shell ===== */
.fg-card{ position: relative; display: block; height: 100%;
border-radius: var(--fg-radius); overflow: hidden; outline: none; transform: translateZ(0); }
.fg-card__media{ height: 100%; position: relative; }
.fg-card__media img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.fg-card__overlay{ position: absolute; inset: 0;
background: color-mix(in srgb, var(--fg-ov-color,#000) calc(var(--fg-ov-opacity,.35)*100%), transparent);
pointer-events: none; transition: opacity .25s ease; }
.fg-card__label{ position: absolute; left: 0; right: 0; bottom: 0; padding: 10px;
display: flex; align-items: flex-end; text-shadow: 0 1px 2px rgba(0,0,0,.35); }
.fg-card__label h3 { line-height: 1 }
.fg-card:focus-visible{ outline: 3px solid #0a84ff; outline-offset: 2px; }

/* Hover polish (only on hover-capable devices) */
@media (hover: hover) and (pointer: fine){
.fg-card:hover .fg-card__overlay,
.fg-card:focus-visible .fg-card__overlay{ opacity: .2; }
.fg-card:hover, .fg-card:focus-visible{
  box-shadow: 0 8px 24px rgba(0,0,0,.14);
  transition: transform .2s ease, box-shadow .2s ease;
}
}

/* ===== Right nested grid ===== */
.fg-cards__grid{
list-style: none; margin: 0; padding: 0;
display: grid; gap: var(--fg-gap);
position: relative;
}

/* DESKTOP: 3 tiles row 1 (4 cols each), 4 tiles row 2 (3 cols each) */
@media (min-width: 767px){
.fg-cards__grid{
  grid-template-columns: repeat(12, minmax(0,1fr));
  grid-auto-rows: var(--fg-row-h);
  grid-auto-flow: dense;
}

/* clear any old span rules before applying our layout */
.fg-cards__grid > *{ grid-column: auto; }

/* Row 1 */
.fg-cards__grid > *:nth-child(1),
.fg-cards__grid > *:nth-child(2),
.fg-cards__grid > *:nth-child(3){ grid-column: span 4; }

/* Row 2 */
.fg-cards__grid > *:nth-child(4),
.fg-cards__grid > *:nth-child(5),
.fg-cards__grid > *:nth-child(6),
.fg-cards__grid > *:nth-child(7){ grid-column: span 3; }

/* After 7 → keep 4-up rhythm */
.fg-cards__grid > *:nth-child(n+8){ grid-column: span 3; }
}

/* ===== MOBILE: make ONE 2-col grid including the hero ===== */
@media (max-width: 767px){
@media (max-width: 767px){
/* Parent = 2-col grid that includes hero + all cards */
.fg-layout{
  grid-template-columns: repeat(2, minmax(0,1fr));
}

/* Flatten the <ul> so its <li> join the parent grid */
.fg-cards__grid{ display: contents; }

/* Make sure NO spans leak to mobile */
.fg-cards__grid > *{
  grid-column: auto / span 1 !important;
  grid-row: auto !important;
}

/* Hero should be a single cell and square-ish */
.fg-hero{
  grid-column: span 1 !important;
  height: auto !important;          /* kill any fixed desktop height */
}

/* Card sizing inside tiles */
/* .fg-card{ height: auto; } */
.fg-card__media{ height: 100%; }
.fg-card__media img{ height: 100%; object-fit: cover; }
}
}

/* Fallback for browsers without display: contents (older Safari) */
@supports not (display: contents){
@media (max-width: 767px){
  .fg-layout{ grid-template-columns: 1fr; }  /* stack hero then grid */
  .fg-cards__grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: var(--fg-gap);
  }
}
}

/* ===== Featured Grid Cards — red hover ring ===== */
.fg-cards{
--fg-ring-offset: 8px;
--fg-ring-size: 4px;
--fg-ring-color: #DC3848;
}

/* the wrapper that gets the OUTER red ring */
.fg-cards .fg-cards__item,
.fg-cards .fg-hero{
position: relative;
isolation: isolate;             /* keeps rings above neighbors */
}

/* OUTER RED RING */
.fg-cards .fg-cards__item::before,
.fg-cards .fg-hero::before{
content: "";
position: absolute;
inset: calc(-1 * var(--fg-ring-offset));
border: var(--fg-ring-size) solid var(--fg-ring-color);
border-radius: calc(var(--fg-radius) + var(--fg-ring-offset));
opacity: 0;
/* transform: scale(1.03); */
pointer-events: none;
z-index: 3;
transition: opacity .18s ease, transform .18s ease;
}

/* HOVER / KEYBOARD FOCUS: show rings + subtle lift */
@media (hover: hover) and (pointer: fine){
.fg-cards .fg-cards__item:hover::before,
.fg-cards .fg-hero:hover::before,
.fg-cards .fg-cards__item:hover .fg-card::after,
.fg-cards .fg-hero:hover .fg-card::after{
  opacity: 1;
  transform: none;
}
}
.fg-cards .fg-cards__item:focus-within::before,
.fg-cards .fg-hero:focus-within::before,
.fg-cards .fg-cards__item:focus-within .fg-card::after,
.fg-cards .fg-hero:focus-within .fg-card::after{
opacity: 1;
transform: none;
}

/* keep existing hover lift—optional to strengthen slightly */
@media (hover: hover) and (pointer: fine){
.fg-cards .fg-card:hover,
.fg-cards .fg-card:focus-visible{
  /* transform: translateY(-2px); */
  box-shadow: 0 8px 24px rgba(0,0,0,.14);
}
}

/* =================== End Of Featured Grid Cards (fg-cards*) =================== */

/* =================== App Slot Section =================== */
.section--app-slot { padding: var(--pad-y) 0; }
.app-slot__inner--constrained {
/* max-width: 1200px;
margin: 0 auto;
padding: 0 16px;  */
}
/* .app-slot__header { margin-bottom: 16px; } */
.app-slot__kicker { font-weight: 700; letter-spacing: .06em; text-transform: uppercase; margin: 0 0 6px; }
.app-slot__title { margin-bottom: -1rem;}
.app-slot__sub { margin: 8px 0 0; color: #5b6b73; }
.app-slot__empty { opacity: .6; font-style: italic; }

/* =================== End Of App Slot Section =================== */

/* ===== Signup + crossing ribbons ===== */
.section--signup-ribbons{
background:#fff;
--ribbon-scale-x: 1.03;                    /* slight horizontal overscan */
--ribbon-bleed: clamp(28px, 8vw, 120px);   /* vertical room for rotated ends */
overflow-x: clip;
}

/* Layout */
.signup-ribbons{
padding: var(--pad-y-mobile, var(--pad-y)) var(--pad-x-mobile, var(--pad-x));
position: relative;
isolation: isolate; /* local stacking context */
background-image: var(--bg-mobile);
background-size: cover;
background-position: right;
background-repeat: no-repeat;
}
@media (min-width: 750px){
.signup-ribbons{
padding: var(--pad-y) var(--pad-x);
background-image: var(--bg-desktop);
}
}
.signup-ribbons__inner{
position: relative;
z-index: 2;         /* copy/form above ribbons */
display: grid;
grid-template-columns: 1fr 1fr;
align-items: start;
gap: clamp(16px, 3vw, 40px);
}
@media (max-width: 749px){
.signup-ribbons__inner{ grid-template-columns: 1fr; }
}
.signup-ribbons__h{
margin: 0;
line-height: 1.05;
font-weight: 500;
font-size: clamp(42px, 6vw, 72px);
}
.signup-ribbons__line{ display:inline-block; }
.signup-ribbons__right .klaviyo-embed > div{ width:100%; }

/* Full-bleed ribbons (paint under the copy) */
.signup-ribbons__strips{
position: relative;
z-index: 1;
width: 100dvw; left: 50%; transform: translateX(-50%);
height: calc(var(--ribbon-h-d) + var(--ribbon-bleed));
margin-top: clamp(16px, 3vw, 28px);
overflow-x: clip; overflow-y: visible;
pointer-events: none; contain: paint;
}
@media (max-width: 749px){
.signup-ribbons__strips{ height: calc(var(--ribbon-h-m) + var(--ribbon-bleed)); }
}
@supports not (width: 100dvw){
.signup-ribbons__strips{ width: 100vw; transform: translateX(-50%); }
}

/* Individual strips */
.signup-ribbons__strip{
--rh: var(--ribbon-h-m);
position: absolute; left:0; right:0;
top: calc(var(--ribbon-bleed)/2); bottom: calc(var(--ribbon-bleed)/2);
transform-origin: 50% 50%;
display: grid; will-change: transform;
}
@media (min-width: 750px){ .signup-ribbons__strip{ --rh: var(--ribbon-h-d); } }

.signup-ribbons__strip--red{
z-index: 1;
transform: translateY(var(--red-y)) rotate(var(--angle-red)) scaleX(var(--ribbon-scale-x));
/* Safari rotation optimization */
-webkit-transform: translateY(var(--red-y)) rotate(var(--angle-red)) scaleX(var(--ribbon-scale-x));
transform-style: preserve-3d;
-webkit-transform-style: preserve-3d;
}
.signup-ribbons__strip--blue{
z-index: 2;
transform: translateY(var(--blue-y)) rotate(var(--angle-blue)) scaleX(var(--ribbon-scale-x));
/* Safari rotation optimization */
-webkit-transform: translateY(var(--blue-y)) rotate(var(--angle-blue)) scaleX(var(--ribbon-scale-x));
transform-style: preserve-3d;
-webkit-transform-style: preserve-3d;
}

/* Rails + scrolling logos */
.signup-ribbons__strip .ribbon__rail{
position:absolute; inset:0; overflow:hidden;
background: var(--ribbon-color, #e94b57);
}
.signup-ribbons__strip--red  .ribbon__rail{ background: var(--ribbon-red,  #E94B57); }
.signup-ribbons__strip--blue .ribbon__rail{ background: var(--ribbon-blue, #0B3147); }

.signup-ribbons__strip .ribbon__track{
position:absolute; top:50%; left:0;
display:flex; align-items:center; gap: var(--ribbon-gap, 56px);
transform: translateY(-50%);
width:max-content;
will-change: transform;
/* Safari animation optimization for rotated elements */
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
animation: ribbon-scroll var(--speed, 18s) linear infinite;
}
.signup-ribbons__strip--red  .ribbon__track{ animation-duration: var(--speed-red, 20s); }
.signup-ribbons__strip--blue .ribbon__track{ animation-duration: var(--speed-blue, 18s); }
.signup-ribbons__strip.is-reverse .ribbon__track{ animation-direction: reverse; }

/* Logo sizing (relative to ribbon height) */
.signup-ribbons__strip .ribbon__item{
height: calc(var(--rh) * var(--scale, .6));
width:auto; filter: var(--logo-filter, none);
}
.signup-ribbons__strip .ribbon__item.logo{ --scale: var(--logo-scale, .6); }
.signup-ribbons__strip .ribbon__item.icon{ --scale: var(--icon-scale, .5); }

@keyframes ribbon-scroll{
from{
  -webkit-transform: translateY(-50%) translateX(0);
  transform: translateY(-50%) translateX(0);
}
to  {
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}
}

@media (prefers-reduced-motion: reduce){
.signup-ribbons__strip .ribbon__track{ animation:none; }
}

/* ===== Crossing ribbons (standalone) ===== */
.section--crossing-ribbons{
/* background:#fff; */
--ribbon-scale-x: 1.03;                    /* slight horizontal overscan */
--ribbon-bleed: clamp(28px, 8vw, 120px);   /* vertical room for rotated ends */
overflow-x: clip;
}

/* Layout */
.crossing-ribbons{
padding: var(--pad-y) 0;
position: relative;
isolation: isolate; /* local stacking context */
}

/* Mobile-specific layout adjustments */
@media (max-width: 749px) {
  .crossing-ribbons {
    padding: var(--pad-y-mobile, var(--pad-y)) 0;
    margin-top: var(--margin-top-mobile, var(--margin-top)) !important;
    margin-bottom: var(--margin-bottom-mobile, var(--margin-bottom)) !important;
  }
}

/* Full-bleed ribbons */
.crossing-ribbons__strips{
position: relative;
z-index: 1;
width: 100dvw; left: 50%; transform: translateX(-50%);
height: calc(var(--ribbon-h-d) + var(--ribbon-bleed));
overflow-x: clip; overflow-y: visible;
pointer-events: none; contain: paint;
}
@media (max-width: 749px){
.crossing-ribbons__strips{ height: calc(var(--ribbon-h-m) + var(--ribbon-bleed)); }
}
@supports not (width: 100dvw){
.crossing-ribbons__strips{ width: 100vw; transform: translateX(-50%); }
}

/* Individual strips */
.crossing-ribbons__strip{
--rh: var(--ribbon-h-m);
position: absolute; left:0; right:0;
top: calc(var(--ribbon-bleed)/2); bottom: calc(var(--ribbon-bleed)/2);
transform-origin: 50% 50%;
display: grid; will-change: transform;
}
@media (min-width: 750px){ .crossing-ribbons__strip{ --rh: var(--ribbon-h-d); } }

.crossing-ribbons__strip--1{
z-index: 1;
transform: translateY(var(--ribbon-1-y)) rotate(var(--angle-1)) scaleX(var(--ribbon-scale-x));
/* Safari rotation optimization */
-webkit-transform: translateY(var(--ribbon-1-y)) rotate(var(--angle-1)) scaleX(var(--ribbon-scale-x));
transform-style: preserve-3d;
-webkit-transform-style: preserve-3d;
}
.crossing-ribbons__strip--2{
z-index: 2;
transform: translateY(var(--ribbon-2-y)) rotate(var(--angle-2)) scaleX(var(--ribbon-scale-x));
/* Safari rotation optimization */
-webkit-transform: translateY(var(--ribbon-2-y)) rotate(var(--angle-2)) scaleX(var(--ribbon-scale-x));
transform-style: preserve-3d;
-webkit-transform-style: preserve-3d;
}

/* Mobile-specific rotation and blur adjustments */
@media (max-width: 749px) {
  .crossing-ribbons__strip--1 {
    transform: translateY(var(--ribbon-1-y)) rotate(var(--ribbon-1-angle-mobile, var(--angle-1))) scaleX(var(--ribbon-scale-x));
    -webkit-transform: translateY(var(--ribbon-1-y)) rotate(var(--ribbon-1-angle-mobile, var(--angle-1))) scaleX(var(--ribbon-scale-x));
  }
  .crossing-ribbons__strip--2 {
    transform: translateY(var(--ribbon-2-y)) rotate(var(--ribbon-2-angle-mobile, var(--angle-2))) scaleX(var(--ribbon-scale-x));
    -webkit-transform: translateY(var(--ribbon-2-y)) rotate(var(--ribbon-2-angle-mobile, var(--angle-2))) scaleX(var(--ribbon-scale-x));
  }
  .crossing-ribbons__strip .ribbon__rail[style*="backdrop-filter"] {
    backdrop-filter: blur(var(--blur-intensity-mobile, var(--blur-intensity))) !important;
    -webkit-backdrop-filter: blur(var(--blur-intensity-mobile, var(--blur-intensity))) !important;
  }
}

/* Rails + scrolling logos */
.crossing-ribbons__strip .ribbon__rail{
position:absolute; inset:0; overflow:hidden;
}
.crossing-ribbons__strip--1 .ribbon__rail{
  position: relative;
}
.crossing-ribbons__strip--1 .ribbon__rail::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--ribbon-1-color, #0B3147);
  opacity: var(--ribbon-1-opacity, 1);
  z-index: 1;
}
.crossing-ribbons__strip--2 .ribbon__rail{
  position: relative;
}
.crossing-ribbons__strip--2 .ribbon__rail::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--ribbon-2-color, #E94B57);
  opacity: var(--ribbon-2-opacity, 1);
  z-index: 1;
}

.crossing-ribbons__strip .ribbon__track{
position:absolute; top:50%; left:0;
display:flex; align-items:center; gap: var(--ribbon-gap, 56px);
transform: translateY(-50%);
width:max-content;
will-change: transform;
-webkit-transform: translateY(-50%);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
animation: ribbon-scroll var(--speed, 18s) linear infinite;
opacity: 1;
z-index: 2;
}
.crossing-ribbons__strip--1 .ribbon__track{ animation-duration: var(--speed-1, 18s); }
.crossing-ribbons__strip--2 .ribbon__track{ animation-duration: var(--speed-2, 20s); }
.crossing-ribbons__strip.is-reverse .ribbon__track{ animation-direction: reverse; }

/* Logo sizing (relative to ribbon height) */
.crossing-ribbons__strip .ribbon__item{
height: calc(var(--rh) * var(--scale, .6));
width:auto; filter: var(--logo-filter, none);
opacity: 1;
}
.crossing-ribbons__strip .ribbon__item.logo{ --scale: var(--logo-scale, .6); }
.crossing-ribbons__strip .ribbon__item.icon{ --scale: var(--icon-scale, .5); }
.crossing-ribbons__strip .ribbon__item.text{
  --scale: var(--logo-scale, .6);
  color: white;
  font-weight: bold;
  font-size: calc(var(--rh) * var(--scale, .6));
  display: flex;
  align-items: center;
  white-space: nowrap;
}

@media (prefers-reduced-motion: reduce){
.crossing-ribbons__strip .ribbon__track{ animation:none; }
}

/* Disable animation when toggle is enabled */
.crossing-ribbons.animation-disabled .crossing-ribbons__strip .ribbon__track {
  animation: none !important;
}

/* Klaviyp SMS input to display right height */
.go2771253331 .input .kl-private-reset-css-Xuajs1 .needsclick {
  height: auto !important;
}

.klaviyo-form input {
font-family: bebas-neue, sans-serif !important;
border-radius: 0 !important;
height: 63px !important;
font-size: 18px !important;
}

.klaviyo-form button {
  cursor: pointer;
  font-size: 2rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  padding: 0.75rem 1.5rem !important;
  text-transform: uppercase !important;
  font-family: bebas-neue, sans-serif !important;
}
/* =================== End Of Signup + crossing ribbons =================== */

/* ================= App Promo ================= */
.section--app-promo{ position: relative; background:#fff; }

.app-promo {
position: relative;
padding: var(--pad-y) var(--pad-x);
}

/* Background image layer */
.app-promo__bg{ position:absolute; inset:0; z-index:0; overflow:hidden; }
.app-promo__bg picture, .app-promo__bg-img{ width:100%; height:100%; display:block; }
.app-promo__bg-img{ object-fit: cover; }
.app-promo__bg-overlay{
position:absolute; inset:0; pointer-events:none;
background: color-mix(in srgb, var(--overlay-color) calc(var(--overlay-opacity) * 100%), transparent);
}

/* Content grid */
.app-promo__inner{
position: relative;
z-index:1;
display: flex;
flex-direction: row;
gap: clamp(16px, 3vw, 50px);
align-items: center;
justify-content: center;
}
@media (max-width: 900px){
.app-promo__inner {
  flex-direction: column;
}
}

/* Headlines */
.app-promo__heading{
margin: 0 0 clamp(12px, 2.4vw, 20px) 0;
line-height: 1.05;
font-weight: 500;
font-size: clamp(42px, 6vw, 68px); /* both lines same size */
}
.app-promo__line{ display:inline-block; }

/* Badges */
.app-promo__badges{
display:grid;
grid-template-columns: repeat(2, minmax(120px, 1fr));
gap: clamp(12px, 2vw, 20px);
max-width: 380px;
}
.app-promo__badge-link{ display:block; transition: opacity .2s ease; }
@media (hover:hover){
.app-promo__badge-link:hover{ opacity:.8; }
}
.app-promo__badge-media svg,
.app-promo__badge-media img{ width:100%; height:auto; display:block; }

/* Right image */
.app-promo__right{ display:flex; align-items:center; justify-content:center; }
.app-promo__image{ width:100%; height:auto; object-fit:contain; max-width: 580px; }
/* ===== End Of App Promo ===== */

/* === Collection Tabs Pro — match "Image 1" look === */
.section--ctpro{
/* palette */
--ctpro-navy: #0F2E3A;   /* active border/text */
--ctpro-muted: #98A8B2;  /* inactive border/text */
}

.section--ctpro .ctpro__tablist{
gap: clamp(16px, 3vw, 20px);
padding-bottom: 6px;
}

/* Base tab */
.section--ctpro .ctpro__tab{
display: inline-flex;
align-items: center;
gap: 12px;

padding: 14px 28px;
background: #fff;

border: 1.5px solid var(--ctpro-muted);
color: var(--ctpro-muted);

text-transform: uppercase;
font-weight: 500;
letter-spacing: .02em;
font-size: 1.25rem; /* ~20px */
line-height: 1;
white-space: nowrap;

transition: color .15s ease, border-color .15s ease, box-shadow .15s ease;
font-family: bebas-neue,sans-serif;
}

/* Hover hint (keeps the muted style) */
@media (hover:hover){
.section--ctpro .ctpro__tab:hover{
  border-color: color-mix(in srgb, var(--ctpro-muted) 70%, var(--ctpro-navy));
  color: color-mix(in srgb, var(--ctpro-muted) 70%, var(--ctpro-navy));
}
}

/* Active state */
.section--ctpro .ctpro__tab[aria-selected="true"]{
border-color: var(--ctpro-navy);
color: var(--ctpro-navy);
}

/* Focus ring */
.section--ctpro .ctpro__tab:focus-visible{
outline: 3px solid #0a84ff;
outline-offset: 2px;
}

/* Mobile sizing */
@media (max-width: 749px){
.section--ctpro .ctpro__tab{
  padding: 16px 22px;
  min-height: 56px;
  font-size: 1.125rem;
}
}

/* base layout (grid, spacing, actions) */
.section--ctpro{
padding: var(--pad-y) var(--pad-x);
}

/* Header spacing */
.section--ctpro .ctpro__hdr{
margin-bottom: clamp(10px, 2vw, 18px);
}
.section--ctpro .ctpro__title{ margin: 0; }
.section--ctpro .ctpro__sub{
margin: 6px 0 0;
font-size: clamp(14px, 1.7vw, 16px);
line-height: 1.4;
}

/* Tablist row */
.section--ctpro .ctpro__tabs{ position: relative; }
.section--ctpro .ctpro__tablist{
display: flex;
flex-wrap: wrap;
align-items: center;
gap: clamp(12px, 2.2vw, 20px);
}

/* Panels */
.section--ctpro .ctpro__panel{
margin-top: clamp(18px, 3vw, 28px);
}

/* Products grid: 2-up mobile, 4-up desktop */
.section--ctpro .ctpro__grid{
list-style: none;
margin: 0;
padding: 0;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: clamp(12px, 2.5vw, 24px);
}
@media (min-width: 992px){
.section--ctpro .ctpro__grid{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
}
.section--ctpro .ctpro__item{ min-width: 0; }


.section--ctpro .ctpro__item .product-card__quickadd-desktop-btn[js-toogle-desktop-quickadd] {
right:15px;
bottom:15px;
filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
z-index:0;
}

.section--ctpro .ctpro__item .product-card__quickadd {
padding: 0.5rem 1rem;
border: 1px solid #D1D8DB;
border-radius: 6px;
z-index: 4;
}

/* Actions row (Load more + Shop all) */
.section--ctpro .ctpro__actions{
display: flex;
flex-wrap: wrap;
gap: 26px;
justify-content: center;
margin-top: clamp(16px, 3vw, 28px);
}

@media (max-width: 749px){
.section--ctpro .ctpro__actions {
  flex-wrap: nowrap;
}

.ctpro__load {
  width: 100%;
}

.ctpro__shopall {
  width: 100%;
  text-align: center;
}
}

.section--ctpro .ctpro__actions.ctpro__actions--solo,
.section--ctpro .ctpro__shopall--solo{
justify-content: center;
}

/* Base: lay tabs in a row */
.section--ctpro .ctpro__tablist{
display: flex;
flex-wrap: wrap;
gap: clamp(12px, 3vw, 20px);
padding-bottom: 6px;
}

/* Mobile: horizontal scrollable tab row */
@media (max-width: 749px){
.section--ctpro .ctpro__tablist{
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch; /* momentum */
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;     /* gentle snapping */
  padding: 0 var(--pad-x,16px) 8px;
  margin-inline: calc(var(--pad-x,16px) * -1); /* bleed to edges */
  scrollbar-width: none;
  padding-left: var(--pad-x,16px);
  scroll-padding-left: var(--pad-x,16px);
}

.section--ctpro .ctpro__tab:first-child{ margin-left: 0; }
.section--ctpro .ctpro__tablist::-webkit-scrollbar{ display:none; } /* WebKit hide */

.section--ctpro .ctpro__tab{
  flex: 0 0 auto;                    /* don’t shrink */
  scroll-snap-align: start;          /* snap position */
}
}
/* === End Of Collection Tabs Pro — match "Image 1" look === */

/* Stop handing horizontal scroll to the page (prevents history swipe while over a carousel) */
.flickity-enabled .flickity-viewport,
.slick-initialized .slick-list {
overscroll-behavior-x: contain;
}

/* Header fixed on top, sits above search */
#shopify-section-header {
position: fixed;
top: 0; left: 0; right: 0;
z-index: 1000;
/* we no longer need overflow hidden when using margin animation */
}

/* Site header (logo/cart/menu) above announcement while it animates */
.site-header { position: relative; z-index: 1; }

/* Announcement: NORMAL state */
.announcement-bar {
position: relative;
z-index: 0;
margin-top: 0;                 /* will animate to a negative value */
transition: margin-top .28s ease;
}

/* Kill the sticky wrapper inside the announcement so it can't float */
.announcement-bar .sticky {
position: static !important;
top: auto !important;
}

/* COLLAPSED state: visually slide the announcement up out of view */
#shopify-section-header.ann--collapsed .announcement-bar {
margin-top: calc(-1 * var(--ann-h, 40px));
/* no transform/absolute needed */
}

/* Mobile search: pinned under the SITE HEADER (not the announcement) */
.mobile-search {
position: sticky;
top: var(--hdr-height, 64px);   /* set from JS */
z-index: 900;                   /* below the fixed header */
}

/* Desktop: --header-offset is 0, margin-top handles spacing via theme.css */
/* Mobile: padding-top handles spacing, margin-top removed */
.main {
  padding-top: var(--header-offset, 0px);
  transition: padding-top .28s ease;
}

@media (max-width: 1024px) {
  #MainContent {
    margin-top: 0;
  }
  .main {
    /* Use full header height from theme.js (includes announcement + nav + search) */
    padding-top: var(--header-height, 150px);
  }
}

/* Treat locked like collapsed (no announcement space) */
#shopify-section-header.ann--locked .announcement-bar,
#shopify-section-header.ann--collapsed.ann--locked .announcement-bar {
margin-top: calc(-1 * var(--ann-h, 40px));
}

.filter-chips {
max-width: 690px;
}

/* When any search overlay is open, don't let the page behind scroll */
html.search-overlay-open,
body.search-overlay-open {
position: relative;
height: 100%;
}

/* Pin the header (override any auto-hide transform) */
html.search-overlay-open .site-header {
transform: none !important;
top: 0 !important;
}

/* If the header uses a hidden class to slide up, cancel it */
html.search-overlay-open .site-header.is-hidden {
transform: none !important;
}

/* Lock the page when predictive is open */
@media (max-width: 1024px) {
html.scroll-locked,
body.scroll-locked {
  overflow: hidden !important;
  height: 100%;
  touch-action: none;
}

/* Make the predictive list the only scroller under the header */
.mobile-search-container[js-predictive-search] {
  left: 0;
  right: 0;
  top: var(--header-height, 56px);
  bottom: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  z-index: 60;
}
}

/* ===== Offer Image Background Section ===== */
.offer-image-background {
  padding-top: var(--pad-top-m);
  padding-bottom: var(--pad-bottom-m);
  position: relative;
  background-image: var(--bg-mobile);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 20px;
}

@media (min-width: 750px) {
  .offer-image-background {
    padding-top: var(--pad-top-d);
    padding-bottom: var(--pad-bottom-d);
    background-image: var(--bg-desktop);
  }
}

.offer-image-background__inner {
  max-width: 800px;
  position: relative;
  z-index: 2;
}

.offer-image-background__inner.text-left {
  text-align: left;
}

.offer-image-background__inner.text-center {
  text-align: center;
  margin: 0 auto;
}

.offer-image-background__inner.text-right {
  text-align: right;
  margin-left: auto;
}

.offer-image-background__h {
  margin: 0 0 1.5rem 0;
  line-height: 1.2;
  font-weight: 500;
  font-size: clamp(30px, 6vw, 60px);
}

.offer-image-background__line {
  display: inline-block;
}

/* ========================================
   Header Countdown Timer Styles
   ======================================== */
   .header-countdown-bar {
    position: relative;
    z-index: 10;
    contain: layout style;
    content-visibility: auto;
  }

  @media (prefers-reduced-motion: reduce) {
    .header-countdown-number {
      text-shadow: none;
    }
  }

  /* Header Countdown Timer - Mobile Margin Adjustment */
  @media screen and (max-width: 1024px) {
    body.header-countdown-active #MainContent {
      margin-top: 91px;
    }
  }
/* --------------- BF styles ---------------- */

body.bfcm-landing {
  background-image: url('topo-bg.webp');
  background-size: contain;
  background-position: top;
  /* background-repeat: no-repeat; */
  /* background-attachment: fixed; */
}

.bfcm-landing .site-header__destkop, .bfcm-landing .site-header__mobile {
  background-color: #170404;
  color: #fff;
}

.bfcm-landing .site-header__destkop-icons-right svg {
  color: #fff;
}

.bfcm-landing .site-header__mobile-menu-container svg {
  color: #fff;
}

.bfcm-landing #CountryList svg {
  color: #000;
}

/* .hero-section {
  background-color: #230407;
}

.hero-carousel {
  background-color: #230407;
}

.hero-carousel .slick-dots {
  background-color: #230407;
  height: 41px;
}

.slick-initialized .slick-list {
  z-index: 3;
}
 */

.bfcm-landing .section--ctpro {
  background-color: #fff;
}

/* ===== BF Fandom Brands Gradient Override ===== */
.bfcm-landing .fandom-brands-blocks-container .brand-image-box {
  background: radial-gradient(ellipse at center, #5E181F 0%, #000000 70%) !important;
  border: 1px solid transparent !important;
}

.bfcm-landing .fandom-brands-blocks-container .brand-image-box > a,
.bfcm-landing .fandom-brands-blocks-container .brand-image-box > .brand-media-wrap {
  position: relative;
  z-index: 2;
}

.bfcm-landing .fandom-brands-blocks-container .image-with-text-block-single:hover .brand-image-box,
.bfcm-landing .fandom-brands-blocks-container .image-with-text-block-single:focus-within .brand-image-box {
  background: radial-gradient(ellipse at center, #5E181F 0%, #000000 70%) !important;
  border-color: transparent !important;
}
button.qsc2-basic.qsc2-stickybtn {
    display: none !important;
}
.qsc2-drawer-header {
    order: 1;
}
.qsc2-drawer-announcement {
    order: 2;
}
.qsc2-drawer-shipping {
    order: 3;
}
.qbk-relative-teleport {
    order: 4;
}
.qsc2-drawer-body {
    margin-bottom: auto;
    order: 5;
}
.qsc2-drawer-footer {
    order: 6;
}

.shopify-pc__banner__dialog button.shopify-pc__banner__btn-manage-prefs {
  text-align:left;
}

/* ===================================
   Header Rewards Dropdown Styles
   =================================== */

/* Desktop Dropdown */
.header-rewards-dropdown {
  position: relative;
}

.header-rewards-dropdown__trigger {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
}

.header-rewards-dropdown__trigger:hover,
.header-rewards-dropdown__trigger:focus {
  opacity: 0.8;
}

.header-rewards-dropdown__icon {
  flex-shrink: 0;
  width: 39px;
  height: 39px;
}

.header-rewards-dropdown__text {
  line-height: 1.2;
}

.header-rewards-dropdown__cta {
  text-decoration: underline;
  text-underline-offset: 2px;
  line-height: 1.5;
}

.header-rewards-dropdown__panel {
  pointer-events: none;
  transform: translateY(-8px);
  min-width: 310px;
  max-width: 450px;
  border-radius: 4px;
  border: 1.5px solid #1a1a1a;
  right: -100px;
  overflow: hidden;
}

.header-rewards-dropdown__panel.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.header-rewards-dropdown__content {
  padding: 20px 20px 0px 20px;
  overflow: hidden;
}

.header-rewards-dropdown__header {
  line-height: 1.4;
  margin-bottom: 10px;
}

.header-rewards-dropdown__title {
  /* font-family: "Obviously Wide", "Oswald", sans-serif; */
  font-size: 20px;
  /* font-weight: 700; */
  /* color: #00263A; */
  text-transform: uppercase;
  /* margin-bottom: 10px; */
  /* line-height: 1.2; */
}

.header-rewards-dropdown__subtitle {
  font-size: 14px;
  line-height: 1.5;
  color: #4B5563;
  font-weight: 400;
}

.header-rewards-dropdown__buttons {
  display: flex;
  gap: 12px;
  margin-bottom: 15px;
}

.header-rewards-dropdown__btn {
  flex: 1;
  text-decoration: none;
  transition: all 0.2s ease;
  border-radius: 4px;
  padding: 4px 8px;
  font-size: 16px;
  /* font-weight: 700; */
  text-transform: uppercase;
  text-align: center;
  display: block;
  min-width: 0;
  white-space: nowrap;
}

.header-rewards-dropdown__btn--primary {
  background-color: #00263A;
  color: #fff;
  border: 2px solid #00263A;
}

.header-rewards-dropdown__btn--primary:hover {
  background-color: #003a5c;
  border-color: #003a5c;
}

.header-rewards-dropdown__btn--secondary {
  background-color: transparent;
  border: 2px solid #00263A;
  color: #00263A;
}

.header-rewards-dropdown__btn--secondary:hover {
  background-color: #00263A;
  color: #fff;
}

.header-rewards-dropdown__nav {
  margin: 0 -28px;
  border-top: 1px solid #E5E5E5;
}

.header-rewards-dropdown__menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

.header-rewards-dropdown__menu-item {
  position: relative;
}

.header-rewards-dropdown__menu-item::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  height: 1px;
  background-color: #E5E5E5;
}

.header-rewards-dropdown__menu-item:last-child::after {
  display: none;
}

.header-rewards-dropdown__link {
  text-decoration: none;
  padding: 15px 28px;
  display: flex;
  align-items: flex-start;
  gap: 15px;
  transition: background-color 0.15s ease;
}

.header-rewards-dropdown__link:hover {
  background-color: #F7F7F7;
}

.header-rewards-dropdown__link-icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.header-rewards-dropdown__link-title {
  font-size: 14px;
  font-weight: 700;
  color: #00263A;
  text-transform: uppercase;
  line-height: 1.3;
  margin-bottom: 4px;
  display: block;
}

.header-rewards-dropdown__link-desc {
  font-size: 12px;
  line-height: 1.4;
  color: #6B7280;
  display: block;
}

.header-rewards-dropdown__link-points {
  flex-shrink: 0;
  text-align: right;
  line-height: 1.2;
}

.header-rewards-dropdown__link-points-value {
  font-size: 18px;
  font-weight: 700;
  color: #DC3848;
  display: block;
}

.header-rewards-dropdown__link-points-label {
  font-size: 12px;
  color: #6B7280;
  display: block;
}

/* ===================================
   Mobile Rewards Section Styles
   =================================== */

.mobile-rewards-section {
  background-color: #fff;
  padding: 16px;
  /* border-bottom: 1px solid #E5E5E5; */
  position: relative;
  z-index: 10;
  /* margin: -16px -16px 0 -16px; Counteract drawer padding */
}

.mobile-rewards-section__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.mobile-rewards-section__content {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
}

.mobile-rewards-section__icon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
}

.mobile-rewards-section__text {
  line-height: 1.3;
  min-width: 0;
}

.mobile-rewards-section__greeting {
  font-size: 16px;
  font-weight: 700;
  color: #00263A;
  margin-bottom: 2px;
}

.mobile-rewards-section__points {
  font-size: 14px;
  color: #6B7280;
}

.mobile-rewards-section__points-value {
  font-weight: 700;
  color: #DC3848;
}

.mobile-rewards-section__cta {
  font-size: 14px;
  font-weight: 700;
  color: #00263A;
  text-transform: uppercase;
}

.mobile-rewards-section__cta-highlight {
  color: #DC3848;
}

.mobile-rewards-section__join {
  font-size: 12px;
  color: #6B7280;
  margin-top: 2px;
}

.mobile-rewards-section__join-link {
  color: #00263A;
  text-decoration: underline;
}

.mobile-rewards-section__action {
  flex-shrink: 0;
  border-radius: 4px;
}

.mobile-rewards-section__btn {
  font-family: bebas-neue,sans-serif;
  display: inline-block;
  padding: 4px 16px;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 4px;
  white-space: nowrap;
  transition: all 0.2s ease;
  letter-spacing: 0.5px;
}

.mobile-rewards-section__btn--red {
  background-color: #DC3848;
  color: #fff;
  border: none;
}

.mobile-rewards-section__btn--red:hover {
  background-color: #c42f3d;
}

.mobile-rewards-section__btn--black {
  background-color: #00263A;
  color: #fff;
  border: none;
}

.mobile-rewards-section__btn--black:hover {
  background-color: #003a5c;
}

/* ===== MOBILE NAVIGATION DRAWER SCROLL FIX ===== */
/* Strategy: Flexbox Scoped Scrolling
   1. Drawer: Clamped to viewport (bottom: 0, height: auto) to handle dynamic 'top' offset.
   2. Body: Flex column to stack Header (Rewards) and Form.
   3. Form: Flex-grow to fill remaining space, acts as scroll container context.
   4. Nav: Positioned for slide animation, scrolls internally via main.
*/

#MobileNavDrawer {
  overflow: hidden !important;
  /* Use auto height + bottom: 0 to fill from 'top' (set by JS) to bottom of screen */
  height: auto !important;
  bottom: 0 !important;
  /* Ensure it doesn't exceed viewport even if top is 0 */
  max-height: 100vh !important;
}

/* Flex container to manage vertical space */
#MobileNavDrawer .mobile-nav-drawer__body {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  overflow: hidden !important;
  position: relative !important;
}

/* Form must grow to fill remaining space - THIS IS THE KEY FIX */
#MobileNavDrawer .mobile-nav-drawer__body > form {
  flex: 1 1 auto !important;
  min-height: 0 !important; /* Allow shrinking for flexbox to work */
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  position: relative !important;
}

/* The Rewards Header (Sign In) - Ensure it doesn't shrink */
#MobileNavDrawer .mobile-rewards-section {
  flex: 0 0 auto !important;
  position: relative !important;
  z-index: 2;
}

/* The Navigation Panels - Keep theme's positioning for slide animation */
#MobileNavDrawer .mobile-nav-drawer__body nav.left-navigation {
  /* Let theme.css handle position: absolute and transform for animation */
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

/* Nested nav panels (submenus) - also need proper sizing */
#MobileNavDrawer .mobile-nav-drawer__body nav nav {
  /* Theme.css handles positioning for slide animation */
  overflow: hidden !important;
}

/* Content wrapper (main) - THIS IS WHERE SCROLLING HAPPENS */
#MobileNavDrawer .mobile-nav-drawer__body nav > main,
#MobileNavDrawer .mobile-nav-drawer__body nav nav > main {
  height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  /* Add padding at bottom for safe area and visual breathing room */
  padding-bottom: 30px !important;
}


/* Responsive adjustments for very small screens */
@media (max-width: 374px) {
  .mobile-rewards-section__inner {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .mobile-rewards-section__action {
    text-align: center;
  }

  .mobile-rewards-section__btn {
    width: 100%;
    text-align: center;
  }
}

/* Mobile Rewards Trigger in Header */
.mobile-rewards-trigger {
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 4px;
}

.mobile-rewards-trigger__icon {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
}

.mobile-rewards-trigger__text {
  line-height: 1.15;
}

.mobile-rewards-trigger__cta {
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: underline;
}

.mobile-rewards-trigger__signin {
  font-size: 10px;
  font-weight: 400;
  line-height: 1.2;
}

/* Smaller screens - hide text, show only icon */
@media (max-width: 374px) {
  .mobile-rewards-trigger__text {
    display: none;
  }
}

/* Medium mobile screens */
@media (min-width: 375px) and (max-width: 479px) {
  .mobile-rewards-trigger__icon {
    width: 24px;
    height: 24px;
  }

  .mobile-rewards-trigger__cta,
  .mobile-rewards-trigger__signin {
    font-size: 9px;
  }
}

/* Larger mobile screens */
@media (min-width: 480px) and (max-width: 767px) {
  .mobile-rewards-trigger__icon {
    width: 28px;
    height: 28px;
  }

  .mobile-rewards-trigger__cta,
  .mobile-rewards-trigger__signin {
    font-size: 10px;
  }
}

/* Shadow for dropdown panel */
.header-rewards-dropdown__panel {
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.25);
}

/* Responsive adjustments */
@media (max-width: 1023px) {
  .header-rewards-dropdown {
    display: none;
  }
}

@media (min-width: 1025px) {
  .mobile-rewards-trigger {
    display: none !important;
  }
}

/* Prevent stacking at medium desktop widths (1024px - 1267px) */
@media (min-width: 1024px) and (max-width: 1267px) {
  .header-rewards-dropdown__icon {
    width: 28px;
    height: 28px;
  }

  .header-rewards-dropdown__text {
    font-size: 10px;
  }

  .header-rewards-dropdown__trigger {
    gap: 4px;
  }

  .header-rewards-dropdown__points,
  .header-rewards-dropdown__greeting,
  .header-rewards-dropdown__cta,
  .header-rewards-dropdown__signin {
    font-size: 10px !important;
  }
}

/* Tablet specific adjustments */
@media (min-width: 768px) and (max-width: 1023px) {
  .mobile-rewards-trigger__icon {
    width: 28px;
    height: 28px;
  }
}

.left-navigation > main > .nav-menu:first-child {
  border-top: 1px solid #bababa;
}

/* Ensure country selector dropdown is above other drawer content */
#MobileNavDrawer .disclosure__list {
  position: relative;
  z-index: 100;
}

/* Ensure country selector receives pointer events */
#MobileNavDrawer localization-form {
  position: relative;
  z-index: 50;
}

#MobileNavDrawer .disclosure__list a {
  pointer-events: auto;
  position: relative;
  z-index: 1;
  cursor: pointer;
}

/* Ensure list items don't block clicks */
#MobileNavDrawer .disclosure__list li {
  pointer-events: auto;
  position: relative;
}
.s-carousel-wrapper {
    display: flex;
    overflow: auto;
}
@media (orientation: landscape) {
.collection-header__categories-item {
    min-width: 11.75rem;
}
}

.collection-header__categories-carousel {
  opacity: 0;
  transition: opacity 0.5s;
    height: 220px;
    overflow: hidden;
}
.collection-header__categories-carousel.flickity-enabled {
  opacity: 1;
    height: unset;

/* =====================================================
   Localization Form Loading States
   ===================================================== */

/* Ensure panel has position context for overlay */
localization-form.localization-form--loading .disclosure__list {
  position: relative;
}

/* Overlay during loading - on the dropdown panel */
localization-form.localization-form--loading .disclosure__list::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.7);
  z-index: 100;
  pointer-events: all;
}

/* Disabled link state during loading */
localization-form.localization-form--loading .disclosure__list a {
  cursor: not-allowed;
  pointer-events: none;
}

/* Error message styling */
.localization-form__error {
  background-color: #fff5f5;
  border: 1px solid #ffcccc;
  border-radius: 4px;
  margin-bottom: 8px;
}
