*{padding: 0;margin: 0;box-sizing: border-box;font-family:'Times New Roman', Times, serif;}
body {scroll-behavior: smooth;/*font-family: 'Poppins', sans-serif;*/background-color: #0D0D0D;cursor: pointer;}
.ticker {overflow: hidden;background: black;color: white;/*background: rgba(0, 0, 0, 0.788);color: orange;*/box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);position: sticky; z-index: 1000;}
.ticker-content {display: inline-block;white-space: nowrap;padding-left: 100%;animation: tickerMove 22s linear infinite;}
@keyframes tickerMove {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}
.ticker-content p span {display: inline-block;/*padding: 0.2rem 1rem;*/padding-top:1rem ;font-size: 18px;font-weight: 700;padding-right: 1.5rem;color: #FF6A00;}
/* NAVBAR */
.navbar {display: flex;justify-content: space-between;align-items: center;/*padding:;*//*background: #eee;*//*orginal*/background: #0D0D0D;/*position: sticky; z-index: 1;top: 0;*/}
/* Hamburger */
.hamburger i{font-size: 20px;padding: 15px;cursor: pointer;color: #FF6A00;}
/* Sidebar */
.sidebar {position: fixed;top: 0;left: 0;width: 260px;height: 100%;/*background: white;*//*original*/background: #0D0D0D;color: white;padding-top: 60px;z-index: 1000;transform: translateX(-100%); /* hidden */transition: transform 0.4s ease-in-out;}
/* Active state */
.sidebar.active {transform: translateX(0);} 
/* Links */
.sidebar a {display: block;padding: 15px;padding-top: 20px;padding-bottom: 20px;font-size: 16px;text-decoration: none;/*color: #111;*/color: white;transition: background 0.3s;border-bottom: 1px solid /*rgba(235, 235, 235, 0.815)*/#FF6A00;}
.sidebar a:hover {background: rgba(235, 235, 235, 0.815);/*color: #111;*//*color: white;*/color: #FF6A00;}
.menu{border-bottom: 1px solid /*rgba(235, 235, 235, 0.815)*/#FF6A00;}
.menu-bar{position: absolute;top: 20px;left: 20px;font-size: 20px;cursor: pointer;/*color: #111;*/color:white;}
/* Close Button */
.close-btn {position: absolute;top: 15px;right: 20px;padding: 3px 3px;font-size: 18px;cursor: pointer;/*color: #111;*/color: #FF6A00;/*background-color: rgba(235, 235, 235, 0.815);*/}
/* Overlay */
.overlay {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.5);opacity: 0;visibility: hidden;transition: 0.4s ease;}
.overlay.active {opacity: 1;visibility: visible;}
.social-media-icons{display: flex;} 
.social-media-icons a{border: none;border-radius: 50%;}
.social-media-icons a:hover{background: none;}
.social-media-icons a i{color: white;}
.social-media-icons a i:hover{color: #FF6A00;}
i{font-size: 24px;margin: 10px;cursor: pointer;color: #FF6A00;}
/*SEARCH*/
.search-icon i{margin-right: 50px;}
@media (max-width: 600px) {
  .search-container{
    width:90%;
  }
  #mobile-icon {
    display: none;
  }
  .search-container input{
    margin-top: 5%;
    margin-bottom: 5%;
  }
  .close-btn{
    margin-top: -3%;
    margin-right: -4%;
  }
}
/*logo*/
.logo {font-size: 18px;font-weight: bold;letter-spacing: 1px;padding: 2px 0;}
/* SEARCH OVERLAY */
.search-overlay {position: fixed;top: -100%; /* hidden above */left: 0;width: 100%;background: #303134;padding-top: 20px;transition: 0.4s ease;z-index: 1000;}
.search-overlay.active {top: 0; /* slides down */} 
/* SEARCH BOX */
.search-container {max-width: 800px;margin: auto;position: relative;}
.search-container input {width: 100%;padding: 15px 50px;border-radius: 10px;border: 0.1px solid #FF6A00;font-size: 14px;margin-top: 1.5%;margin-bottom: 3%;background-color: rgb(31, 30, 30);color: #FF6A00;}
/* ICONS INSIDE INPUT */
.search-container .fa-search {position: absolute;right: 15px;top: 30%;transform: translateY(-50%);font-size: 18px;}
/*.close-btn{position: absolute;right: 17%;top: 35%;font-size: 24px;transform: translateY(-50%);cursor: pointer;}
.close-btn:hover{font-size: 28px;transition: 0.4s ease;}*/
/* RESULTS */
/*.results {max-width: 800px;margin: 20px auto;}
.results div {padding: 10px;border-bottom: 1px solid #ddd;}*/
.results div {padding: 12px;border-bottom: 1px solid #eee;cursor: pointer;padding-bottom: 10px;}
.results div:hover {background: #f5f5f5;}
/* CAROUSEL */
.carousel {width: 100%;height: 90vh;overflow: hidden;position: relative;}
.carousel::after {/*content: "StreetSoul"*/position: absolute;bottom: 50px;left: 50px;color: white;font-size: 28px;font-weight: bold;font-style: italic;}
.slides {width: 100%;height: 100%;position: relative;}
.slide {position: absolute;width: 100%;height: 100%;object-fit: cover;opacity: 0;filter: blur(20px);transform: scale(1.1);transition: opacity 1s ease, filter 1s ease, transform 1s ease;}
/* ACTIVE IMAGE */
.slide.active {opacity: 1;filter: blur(0);transform: scale(1);}
/*product section*/
.product-section {display: grid;grid-template-columns: repeat(4, 1fr);gap: 10px;/*padding: 40px;*//*padding: 50px 60px;*/padding: 5%;}
@media (max-width: 1024px) {
  .product-section {grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 600px) {
  .product-section {grid-template-columns: repeat(2, 1fr);padding: 3%;gap: 15px;}
}
.shop-btn {position: relative;padding: 14px 35px;margin-top: 450px;margin-left: 620px;/*border: 2px solid white;*/background: transparent;color:;font-size: 20px;cursor: pointer;overflow: hidden;/* border-radius: 50px;*/display: inline-flex;align-items: center;justify-content: center;transition: 0.4s ease;}
.shop-btn .text {transition: transform 0.4s ease;}
.shop-btn .arrow {opacity: 0;transform: translateX(-10px);margin-left: 8px;transition: all 0.4s ease;}
/* Hover effect */
.shop-btn:hover .text {transform: translateX(-3px);}
.shop-btn:hover .arrow {opacity: 1;transform: translateX(0);color: #FF6A00;font-weight:bolder ;}
.shop-btn:hover {/*background: rgba(255,255,255,0.1);*/font-weight: 600;border: 1px solid #FF6A00;border-radius: 10px;}
/* FOOTER */
.footer {/*background: #f5f5f5;background: #0D0D0D;*/color: white;padding: 60px 40px 20px;background: black;margin-top: 1%;}
/* CONTAINER */
.footer-container {display: flex;/*justify-content: space-between;*//*align-items: flex-start;*//*gap: 25%;*/gap: 10%;/*margin-left: 50px;*/}
/* LOGO */
.footer-logo img {width: 120px;border-radius: 4%;/*padding: 30px 0;*/}
/* LINKS */
.footer-links h3 {margin-bottom: 20px;font-size: 20px;}
.footer-links a {display: block;margin-bottom: 12px;text-decoration: none;/*color: #333;*/color: white;font-size: 18px;}
.footer-links a:hover {text-decoration: underline;color: #FF6A00;}
/* BOTTOM TEXT */
.footer-bottom {text-align: center;margin-top: 40px;font-size: 13px;color: #555;}
/* SCROLL BUTTON */
.scroll-top {position: fixed;bottom: 20px;right: 20px;background: black;color: white;width: 45px;height: 45px;border-radius: 50%;display: flex;align-items: center;justify-content: center;cursor: pointer;font-size: 20px;}
@media (max-width: 768px) {
  .footer-container {flex-direction: column;align-items: flex-start;gap: 30px;}
  .footer-logo {text-align: center;width: 100%;justify-content: center;}
  .footer-logo img {margin: auto;display: block;}
  .footer-links {width: 100%;}
  .footer{margin-top: 5%;}
}
@media (max-width: 1400px) {
  .footer-logo img{margin-left:80px;margin-top: 20px;}
}
.scroll-top:hover {transform: scale(1.1);}
/*--------------------------------------------------------------------------------*/
/* GRID */
.product-grid {display: grid;grid-template-columns: repeat(2, 1fr);gap:20px;/*padding: 60px;padding-top: 40px;padding-bottom: 40px;*/padding-top: 5%;padding-bottom: 5%;padding-left: 6%;background-color: #0D0D0D;}
@media (max-width: 768px) {.product-grid {grid-template-columns: 1fr;padding-left: 8%;padding-top: 15%;padding-bottom: 15%;gap:40px;}}
.product-card {width:87%;aspect-ratio: 1 / 1;overflow: hidden;border-radius: 15px;cursor: pointer;box-shadow: 0 3px 3px rgba(0,0,0,0.3);border: 0.8px solid #ff2f00;}
.product-card img {width:100%;object-fit: cover;height: 100%;margin-bottom: 50px;}
.img-wrapper {position: relative;overflow: hidden;width: 100%;height: 100%;}
.img-wrapper img {position: absolute;width: 100%;object-fit: contain;top: 0;left: 0;transition: opacity 0.4s ease;height: 100%;}  
.img-default {opacity: 1;}
.img-hover {opacity: 0;width: 100%;height: 100%;transform: scale(0.95) translateY(25px)}
.product-card:hover .img-default {opacity: 0; transform: scale(1.05) translateY(-10px);}
.product-card:hover .img-hover {opacity: 1; transform: scale(1.05) translateY(0);}
.product-card:hover {box-shadow: 0 10px 10px rgba(0,0,0,0.6);background: transparent;}
/*--------------------------------------------------------------------------------------------------------------------------*/
/* CONTACT FORM */ 
/* Background overlay */
.modal {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.7);display: none;justify-content: center;align-items: center;}
/* Show modal */
.modal.active {display: flex;}
/* Main box */
.modal-box {background: #fff;width: 700px;max-width: 90%;border-radius: 10px;overflow: hidden;position: relative;}
/* Close button */
.closeBtn {position: absolute;top: 10px;right: 15px;font-size: 22px;cursor: pointer;}
/* Split layout */
.modal-content {display: flex;}
/* Left side */
.left {width: 40%;background: #000;color: #fff;padding: 30px;}
.left h4 {margin-bottom: 10px;}
.left p a{text-decoration: none;color: white;}
.left p{padding-bottom: 10px;}
.left p a:hover{color: #FF6A00;}
.whatsapp-icon a i{color: white;}
/* Right side */
.right {width: 60%;padding: 30px;}
/* Inputs */
.right input,
.right textarea {width: 100%;margin-bottom: 15px;padding: 10px;border: 1px solid #000;background: transparent;color: #000;}
/* Button */
.submitBtn {width: 100%;padding: 12px;background: #000;color: #fff;border: none;cursor: pointer;transition: 0.3s;}
.submitBtn:hover {background: #fff;color: #000;}
.submitBtn a{color: white;}
.submitBtn a:hover {background: #fff;color: #000;}
@media (max-width: 768px) {
  .modal-content {flex-direction: column;}
  .left, .right {width: 100%;}
  .closeBtn {color: #fff;}
}

/*privacy policy*/
.privacy-policy {max-width: 800px;margin: 40px auto;padding: 0 20px;}
h1, h2 {margin-bottom: 20px;}
p {margin-bottom: 15px;line-height: 1.6;}
ul{margin-left: 20px;margin-bottom: 15px;}
li{margin-bottom: 10px;}
/*.trail {position: fixed;width: 10px;height: 10px;background: #00f5ff;border-radius: 50%;pointer-events: none;animation: fadeOut 0.6s linear forwards;}
@keyframes fadeOut {
  to {opacity: 0;transform: scale(0.5);}}*/
.trail {position: fixed;width: 8px;height: 8px;border-radius: 50%;pointer-events: none;animation: fadeOut 0.8s linear forwards;}
@keyframes fadeOut {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(0.3);
  }
}

@media (max-width: 768px) {
  .footer-links{
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    justify-content: center;
  }
}


/*--------------------------------------------------------------------------------*/* PRODUCT GRID */
.product-card{
    /*position:relative;*/
    width:87%;
    aspect-ratio:1 / 1;

    overflow:hidden;
    border-radius:15px;
    cursor:pointer;

    background:#111;

    box-shadow:0 3px 3px rgba(0,0,0,0.3);

    transition:
      transform .4s ease,
      box-shadow .4s ease;
}

/* GLOW BORDER */
.product-card::before{
    content:"";

   /* position:absolute;*/
    inset:0;

    border-radius:15px;
    padding:2px;

    background:linear-gradient(
        135deg,
        #ff5a00,
        #ff2f00,
        #ff7b00,
        #ff3c00
    );

    background-size:300% 300%;

    opacity:0;

    transition:opacity .4s ease;

    animation:glowMove 4s linear infinite;

    z-index:2;

    /* BORDER ONLY */
    -webkit-mask:
      linear-gradient(#fff 0 0) content-box,
      linear-gradient(#fff 0 0);

    -webkit-mask-composite:xor;
            mask-composite:exclude;

    filter:
      drop-shadow(0 0 5px #ff5a00)
      drop-shadow(0 0 15px rgba(255,90,0,0.7));
}

/* SHOW BORDER ON HOVER */
.product-card:hover::before{
    opacity:1;
}

/* CARD HOVER */
.product-card:hover{
    transform:translateY(-5px);

    box-shadow:
      0 10px 30px rgba(0,0,0,0.6),
      0 0 25px rgba(255,90,0,0.25);
}

/* IMAGE EFFECTS */
.product-card img{
    width:100%;
    object-fit:cover;
    height:100%;
}

/* IMAGE WRAPPER */
.img-wrapper{
    position:relative;
    overflow:hidden;
    width:100%;
    height:100%;
    border-radius:15px;
}

.img-wrapper img{
    position:absolute;
    width:100%;
    object-fit:contain;
    top:0;
    left:0;

    transition:
      opacity .4s ease,
      transform .6s ease;

    height:100%;
}

.img-default{
    opacity:1;
}

.img-hover{
    opacity:0;
    transform:scale(0.95) translateY(25px);
}

/* IMAGE ANIMATION */
.product-card:hover .img-default{
    opacity:0;
    transform:scale(1.08) translateY(-10px);
}

.product-card:hover .img-hover{
    opacity:1;
    transform:scale(1.05) translateY(0);
}

/* ANIMATED GLOW */
@keyframes glowMove{
    0%{
        background-position:0% 50%;
    }

    50%{
        background-position:100% 50%;
    }

    100%{
        background-position:0% 50%;
    }
}



/*--------------------------------------------------------------------------------*/
.product-name-tshirt {
    position: absolute;
    bottom: 10px;
    left: 10px;
    color: white;
    font-size: 16px;
    text-shadow: 0 0 5px rgba(0,0,0,0.7);
    z-index: 3;
    padding:20px 10px 20px 12%;
    background: #0D0D0D;
    width: 100%;
}

@media (max-width: 768px){
    .product-name-tshirt {
        font-size: 12px;
        padding:10px 10px 10px 15%;
    }
}

.img-container{
  margin-bottom: 20px;
}
.img-container:hover .product-name-tshirt {
  text-decoration: underline;
}