*{
  padding: 0;
  margin: 0;
}

.store-page {
    position: relative;
    width: 100%;
}



.back-to-main {
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
}

.main-site-button {
    display: flex;
    padding: 14px 24px;
    align-items: center;
    gap: 8px;
    max-width: max-content;
    text-decoration: none;
    border-radius: 10px;
    background: rgba(131, 129, 129, 0.763);
    font-size: 16px;
    font-weight: 600;
    line-height: 120%;
    color: white;

 
}

       @media (max-width: 767px) {
        .main-site-button {
            font-size: 12px;
            padding: 10px 10px;
            width: 100%;

        }
        }


.main-site-button:hover {
  background: #333;
  transform: translateY(-2px);
}

.store-page .shopifyContainer {
    position: relative;
    max-width: 100%;
    padding: 0 0px;
    margin: 0 auto;
    width: 100%;
}

.store-page .shopifyContainer .hero-image img {
    width: 100%;
    /* height: auto; */
    height: 100vh;
    /* display: block; */
}

@media (max-width: 767px) {
    .store-page .shopifyContainer .hero-image img {
        height: auto;
    }
}

.store-page .shopifyContainer .product-box {
    position: absolute;
    padding: 8px 20px;
    border-radius: 6px;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Scaling rules inside .product-box */
@media (max-width: 480px) {
    .store-page .shopifyContainer .product-box {
        transform: scale(0.55);
    }
}

@media (min-width: 481px) and (max-width: 1024px) {
    .store-page .shopifyContainer .product-box {
        transform: scale(0.66);
    }
}

@media (min-width: 1400px) {
    .store-page .shopifyContainer .product-box {
        transform: scale(1.1);
    }
}

/* Positioning product-boxes */
.store-page .shopifyContainer .product-box:nth-of-type(1) { top: 5%; left: 25%; }
.store-page .shopifyContainer .product-box:nth-of-type(2) { top: 37%; left: 73%; }
.store-page .shopifyContainer .product-box:nth-of-type(3) { top: 18%; right: 32%; }
.store-page .shopifyContainer .product-box:nth-of-type(4) { top: 63%; left: 54%; }
.store-page .shopifyContainer .product-box:nth-of-type(5) { top: 25%; left: 81%; }
.store-page .shopifyContainer .product-box:nth-of-type(6) { top: 41%; left: 65%; }
.store-page .shopifyContainer .product-box:nth-of-type(7) { top: 14%; right: 2%; }
.store-page .shopifyContainer .product-box:nth-of-type(8) { top:80%; left:12%; }
.store-page .shopifyContainer .product-box:nth-of-type(9) { top:36%; right:53%; }
.store-page .shopifyContainer .product-box:nth-of-type(10) { top:57%; left:30%; }
.store-page .shopifyContainer .product-box:nth-of-type(11) { top:10%; left:5%; }


/* Mobile positions */
@media (max-width:767px){
  .store-page .shopifyContainer .product-box:nth-of-type(1) { top:55%; left:45%; }
  .store-page .shopifyContainer .product-box:nth-of-type(2) { top:18%; left:37%; }
  .store-page .shopifyContainer .product-box:nth-of-type(3) { top:23%; right:67%; }
  .store-page .shopifyContainer .product-box:nth-of-type(4) { top:30%; left:-2%; }
  .store-page .shopifyContainer .product-box:nth-of-type(5) { top:12%; left:55%; }
  .store-page .shopifyContainer .product-box:nth-of-type(6) { top:12%; left:19%; }
  .store-page .shopifyContainer .product-box:nth-of-type(7) { top:6%; right:0%; }
  .store-page .shopifyContainer .product-box:nth-of-type(8) { top:90%; left:12%; }
  .store-page .shopifyContainer .product-box:nth-of-type(9) { top:68%; right:10%; }
  .store-page .shopifyContainer .product-box:nth-of-type(10) { top:79%; left:53%; }
.store-page .shopifyContainer .product-box:nth-of-type(11) { top:55%; left:0%; }
  
}

@media (min-width:767px) and (max-width:1024px){
  .store-page .shopifyContainer .product-box:nth-of-type(1) { top:6%; left:24%; }
  .store-page .shopifyContainer .product-box:nth-of-type(2) { top:35%; left:72%; }
  .store-page .shopifyContainer .product-box:nth-of-type(3) { top:18%; right:31%; }
  .store-page .shopifyContainer .product-box:nth-of-type(4) { top:56%; left:52%; }
  .store-page .shopifyContainer .product-box:nth-of-type(5) { top:24%; left:80%; }
  .store-page .shopifyContainer .product-box:nth-of-type(6) { top:42%; left:65%; }
  .store-page .shopifyContainer .product-box:nth-of-type(7) { top:12%; right:1%; }
  .store-page .shopifyContainer .product-box:nth-of-type(8) { top:80%; left:10%; }
  .store-page .shopifyContainer .product-box:nth-of-type(9) { top:36%; right:53%; }
  .store-page .shopifyContainer .product-box:nth-of-type(10) { top:57%; left:30%; }
  .store-page .shopifyContainer .product-box:nth-of-type(11) { top:10%; left:5%; }
}


/* Dot styling */
.dot {
    display: inline-block;
    cursor: pointer;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: #FFFFFF;
    z-index: 1;
    box-shadow: 0 0 0 6px rgba(221, 208, 208, 0.5);
    animation: blinking 1.5s infinite alternate ease-in-out;
}

@media (max-width: 480px) {
    .dot {
        width: 12px;
        height: 12px;
    }
}

/* Label */
.label {
    position: absolute;
    top: 23px;
    left: 50%;
    transform: translateX(-50%);
    background: white;
    color: black;
    padding: 4px 16px;
    border-radius: 3996px;
    width: max-content;
    font-size: 14px;
}

@media (max-width: 767px) {
    .label {
        font-size: 12px;
        padding: 3px 8px;
    }
}

.closet-btn {
    margin: 40px auto;
    text-align: center;
    font-size: 20px;
}

.arrow-btn {
    display: inline-block;
    font-size: 32px;
    text-decoration: none;
    margin-bottom: 8px;
}

.muP {
    position: relative;
}

.wrap {
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 0 10px 5px 10px;
    border-color: transparent transparent white transparent;
    transform: translateX(-50%);
    position: absolute;
    top: 20px;
    left: 50%;
}

/* Tote Blink Animation */
.tote-blink {
    animation: toteBlink 1.4s infinite ease-in-out;
    box-shadow: 0 0 8px rgba(14, 13, 13, 0.7);
}

@keyframes toteBlink {
    0% {
        opacity: 1;
        transform: scale(1);
        box-shadow: 0 0 8px rgba(65, 65, 63, 0.7);
    }
    50% {
        opacity: 0.2;
        transform: scale(1.4);
        box-shadow: 0 0 18px rgba(102, 100, 100, 0.9);
    }
    100% {
        opacity: 1;
        transform: scale(1);
        box-shadow: 0 0 8px rgba(97, 95, 95, 0.7);
    }
}



@media (max-width: 480px) {

  .product-box {
    transform: scale(0.75); /* make dots + label smaller */
  }

  .label {
    font-size: 12px;
    padding: 3px 12px;
  }

  .dot {
    width: 12px;
    height: 12px;
  }
}


/* -------- 📱 Tablet (481px–1024px) -------- */
@media (min-width: 481px) and (max-width: 1024px) {

  .product-box {
    transform: scale(0.9);
  }

}


/* -------- 🖥 Large Screens 1200px+ -------- */
@media (min-width: 1400px) {

  .product-box {
    transform: scale(1.1); /* slightly bigger on large screens */
  }

  .label {
    font-size: 16px;
  }

  .dot {
    width: 18px;
    height: 18px;
  }
  
}
.mobHide{
    display: block;
    
}
.mobShow{
    display: none;
}

@media screen and (max-width: 767px){
    .mobHide{
        display: none !important;
    }
    .mobShow{
        display: block !important;
    }
}