.intro-section {
        display: block;
        overflow: hidden; 
        background-color: #f8f9fa;
    }

    .slider-image {
    width: 100%;
    height: auto !important; /* ৭০০ পিক্সেল মুছে auto দিন */
    max-height: 700px; /* সর্বোচ্চ উচ্চতা ৭০০ পিক্সেল থাকবে */
    object-fit: fill; /* পুরো জায়গা জুড়ে ইমেজ দেখাবে */
    transition: transform 6s ease-out; 
}

   
   

   
@media (max-width: 767px) {
    /* ডেক্সটপ সেকশন হাইড করা */
    .intro-section {
        display: none;
    }
    
    /* মোবাইল সেকশন শো করা */
    .intro-section-mobile {
        display: block;
    }

    .slider-image {
        width: 100% !important; 
        height: auto !important;  
        min-height: 350px; 
        object-fit: cover; 
        transform: none !important; 
    }
}

   
    @media (min-width: 768px) {
        .intro-section-mobile {
            display: none;
        }
    }
    
  
    .carousel-control-prev, .carousel-control-next {
        width: 6%;
        opacity: 0;
        transition: all 0.3s ease;
    }

    .carousel:hover .carousel-control-prev, 
    .carousel:hover .carousel-control-next {
        opacity: 1;
    }

    .carousel-control-prev-icon, .carousel-control-next-icon {
        background-color: transparent; 
        border-radius: 50%;
        padding: 25px;
        filter: invert(1) grayscale(100%) brightness(0); 
    }
    
    
     .fancybox-shop-now:hover {
        color: #ffffff !important;
    }
    
    
    
    .premium-cat-slider { width: 100%; padding: 20px 0; position: relative; }
    .swiper-slide { width: auto; display: flex; justify-content: center; }
    .cat-card { display: flex; flex-direction: column; align-items: center; text-decoration: none; width: 100%; cursor: pointer; }

    .cat-img-box {
        width: 90px; height: 90px; background: #f5f5f7; border-radius: 50%;
        display: flex; align-items: center; justify-content: center; padding: 15px;
        position: relative; overflow: hidden; border: 1px solid #eee; transition: 0.3s;
    }

    .cat-img-box img { width: 100%; height: 100%; object-fit: contain; transition: 0.4s; }

    .hover-img { position: absolute; top: 15px; left: 15px; width: calc(100% - 30px) !important; height: calc(100% - 30px) !important; opacity: 0; }
    .cat-card:hover .main-img { opacity: 0; }
    .cat-card:hover .hover-img { opacity: 1; }
    .cat-card:hover .cat-img-box { border-color: #0071e3; background: #fff; box-shadow: 0 5px 15px rgba(0,0,0,0.08); }

    .cat-label { 
        margin-top: 12px; 
        font-size: 15px !important; 
        color: #111111 !important; 
        font-weight: 600 !important; /* একদম গাঢ় বা এক্সট্রা বোল্ড */
        text-align: center; 
        white-space: nowrap; 
        transition: 0.3s;
        text-transform: capitalize; 
        letter-spacing: 0.3px;
        font-family: 'Poppins', 'Segoe UI', sans-serif !important; /* প্রিমিয়াম মডার্ন স্টাইল */
    }
    .cat-card:hover .cat-label { color: #0071e3; }

    /* --- Arrow Control Section --- */
    .premium-cat-slider .swiper-button-next, 
    .premium-cat-slider .swiper-button-prev {
        width: 30px !important;
        height: 30px !important;
        background-color: transparent !important; 
        border-radius: 0; 
        box-shadow: none !important; 
        top: 50% !important;
    }

    /* Arrow icon color BLACK kora hoyeche */
    .premium-cat-slider .swiper-button-next::after, 
    .premium-cat-slider .swiper-button-prev::after {
        font-size: 18px !important;       
        color: #000000 !important; 
        background-image: none !important; 
        font-weight: bold;
        fill: #000000 !important; 
    }

   
    .premium-cat-slider .custom-nav {
        color: #000000 !important;
    }

    /* Dane-Bame soranor control */
    .premium-cat-slider .swiper-button-next { right: 15px !important; } 
    .premium-cat-slider .swiper-button-prev { left: 0px !important; }  

    @media (max-width: 624px) {
    .cat-img-box { width: 70px; height: 70px; padding: 10px; }
    .hover-img { top: 10px; left: 10px; width: calc(100% - 20px) !important; height: calc(100% - 20px) !important; }
    
    /* মোবাইলের টেক্সট স্লিম ও পারফেক্ট সাইজ করা হলো */
    .cat-label { font-size: 12px !important; font-weight: 600 !important; color: #222222 !important; }
    
    /* Mobile-e arrow ektu choto kora hoyeche */
    .premium-cat-slider .swiper-button-next, 
    .premium-cat-slider .swiper-button-prev { 
        width: 25px !important; 
        height: 25px !important; 
    }
    .premium-cat-slider .swiper-button-next::after, 
    .premium-cat-slider .swiper-button-prev::after { 
        font-size: 10px !important; 
    }
}
    
    
    /* Prince Optics Brand Button Style */
    .prince-btn {
        background: #F6931E !important; 
        color: #ffffff !important;
        padding: 12px 35px;
        border-radius: 5px;
        text-decoration: none;
        font-weight: 700;
        font-size: 13px;
        text-transform: uppercase;
        letter-spacing: 1px;
        transition: 0.4s ease;
        display: inline-block;
        border: 2px solid #F6931E;
    }
    
    .prince-btn:hover {
        background: transparent !important;
        color: #F6931E !important;
        transform: scale(1.05);
        box-shadow: 0 10px 20px rgba(246, 147, 30, 0.3);
    }


    @media (max-width: 767px) {
        .about-area {
            height: auto !important;
            min-height: 400px;
            padding: 50px 0 !important;
        }
        .brand-card {
            padding: 25px !important;
            margin: 0 15px;
        }
        h2 {
            font-size: 20px !important;
        }
    }
    
    
    /* ==========================================================================
   Product Carousel Premium Styles (Flash Sale, New Arrival, Best Selling)
   ========================================================================== */

/* স্লাইডারের ভেতরের গ্যাপ এবং ওভারফলো ঠিক করা */
.flash-sale-slider, .new-arrival-slider, .best-selling-slider, .all-products-slider, [class*="cat-products-slider-"] {
    width: 100%;
    padding: 15px 0 25px 0 !important;
    overflow: hidden;
    position: relative;
}

/* প্রোডাক্ট কার্ডের চারপাশের অপ্রয়োজনীয় বর্ডার বা শ্যাডো ক্লিন করা */
.flash-sale-slider .swiper-slide, 
.new-arrival-slider .swiper-slide, 
.best-selling-slider .swiper-slide,
.all-products-slider .swiper-slide,
[class*="cat-products-slider-"] .swiper-slide {
    height: auto;
    display: flex;
    justify-content: center;
}

/* See All বাটন ছাড়া হেডিং সেকশনটিকে প্রিমিয়াম দেখানোর স্টাইল */
.featured-productss-area .section-header-area {
    margin-bottom: 25px !important;
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: 12px;
}

/* টাইটেল বা শিরোনামের বামে একটি সুন্দর কালো বর্ডার */
.featured-productss-area .section-title {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1d1d1f !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 !important;
    border-left: 4px solid #1d1d1f;
    padding-left: 15px;
}

/* মোবাইল স্ক্রিনের জন্য রেসপনসিভ অ্যাডজাস্টমেন্ট */
@media (max-width: 767px) {
    .featured-productss-area .section-title {
        font-size: 18px !important;
        padding-left: 10px;
    }
    .flash-sale-slider, .new-arrival-slider, .best-selling-slider, .all-products-slider, [class*="cat-products-slider-"] {
        padding: 10px 0 20px 0 !important;
    }
}



/* ==========================================================================
   Prince Optics Custom Simple Arrows (Fixed Mobile Display & Jet Black Color)
   ========================================================================== */

/* ১. Swiper-এর নিজস্ব ডিফল্ট ব্লু কালারকে রুট লেভেলে একদম পিওর ব্ল্যাক বা ডার্ক করা */
.flash-sale-slider, .new-arrival-slider, .best-selling-slider, .all-products-slider, [class*="cat-products-slider-"] {
    --swiper-navigation-color: #1d1d1f !important; /* কোনোভাবেই আর ব্লু থাকবে না */
    --swiper-theme-color: #1d1d1f !important;
}

/* ২. গোল ব্যাকগ্রাউন্ড বা ডট সম্পূর্ণ রিমুভ করে সাধারণ ক্লিন অ্যারো বাটন তৈরি */
.swiper-button-next.s-next-flash, .swiper-button-next.s-next-new, .swiper-button-next.s-next-best, .swiper-button-next.s-next-all, [class*="s-next-cat-"],
.swiper-button-prev.s-prev-flash, .swiper-button-prev.s-prev-new, .swiper-button-prev.s-prev-best, .swiper-button-prev.s-prev-all, [class*="s-prev-cat-"] {
    background: transparent !important; /* ব্যাকগ্রাউন্ড থাকবে না */
    border: none !important;             /* বর্ডার থাকবে না */
    box-shadow: none !important;         /* শ্যাডো থাকবে না */
    width: 35px !important;              /* বাটনের চওড়া */
    height: 50px !important;             /* বাটনের উচ্চতা */
    top: 50% !important;                 /* প্রোডাক্ট বক্সের ঠিক মাঝ বরাবর পজিশন */
    transform: translateY(-50%) !important;
    z-index: 999 !important;             /* যেন কোনো কিছুর নিচে চাপা না পড়ে */
    transition: all 0.2s ease !important;
    display: flex !important;            /* ডেক্সটপ-মোবাইল সব জায়গায় বাটন দৃশ্যমান রাখবে */
    align-items: center;
    justify-content: center;
}

/* ৩. শুধুমাত্র তীরের আইকনটির সাইজ এবং খাঁটি কালো রঙ ফিক্স */
.swiper-button-next.s-next-flash::after, .swiper-button-next.s-next-new::after, .swiper-button-next.s-next-best::after, .swiper-button-next.s-next-all::after, [class*="s-next-cat-"]::after,
.swiper-button-prev.s-prev-flash::after, .swiper-button-prev.s-prev-new::after, .swiper-button-prev.s-prev-best::after, .swiper-button-prev.s-prev-all::after, [class*="s-prev-cat-"]::after {
    font-size: 24px !important;          /* তীর চিহ্নটি নিখুঁত ও প্রিমিয়াম সাইজ */
    font-weight: 900 !important;
    color: #1d1d1f !important;           /* খাঁটি অ্যাপেল স্টাইল ডার্ক কালার */
    font-family: 'swiper-icons' !important;
    background: none !important;
    fill: #1d1d1f !important;
}

/* ৪. ডেক্সটপ ও বড় স্ক্রিনের জন্য ডান ও বামের পজিশন */
@media (min-width: 1024px) {
    .swiper-button-next.s-next-flash, .swiper-button-next.s-next-new, .swiper-button-next.s-next-best, .swiper-button-next.s-next-all, [class*="s-next-cat-"] {
        right: 10px !important;  
    }
    .swiper-button-prev.s-prev-flash, .swiper-button-prev.s-prev-new, .swiper-button-prev.s-prev-best, .swiper-button-prev.s-prev-all, [class*="s-prev-cat-"] {
        left: 10px !important;   
    }
    .swiper-button-next:hover, .swiper-button-prev:hover {
        transform: translateY(-50%) scale(1.2) !important;
        opacity: 0.8 !important;
    }
}

/* ৫. মোবাইলের জন্য রেসপনসিভ পজিশন ও ছোট সাইজ (ফিক্সড কোড) */
@media (max-width: 1023px) {
    .swiper-button-next.s-next-flash, .swiper-button-next.s-next-new, .swiper-button-next.s-next-best, .swiper-button-next.s-next-all, [class*="s-next-cat-"],
    .swiper-button-prev.s-prev-flash, .swiper-button-prev.s-prev-new, .swiper-button-prev.s-prev-best, .swiper-button-prev.s-prev-all, [class*="s-prev-cat-"] {
        width: 24px !important;   /* বাটনের চওড়া অনেক কমিয়ে ছোট করা হলো */
        height: 35px !important;  /* বাটনের উচ্চতা ছোট করা হলো যেন লম্বা না দেখায় */
    }
    
    .swiper-button-next.s-next-flash, .swiper-button-next.s-next-new, .swiper-button-next.s-next-best, .swiper-button-next.s-next-all, [class*="s-next-cat-"] {
        right: 0px !important;    /* স্ক্রিনের ডান পাশে সুন্দরভাবে ফিট হবে */
    }
    
    .swiper-button-prev.s-prev-flash, .swiper-button-prev.s-prev-new, .swiper-button-prev.s-prev-best, .swiper-button-prev.s-prev-all, [class*="s-prev-cat-"] {
        left: 0px !important;     /* স্ক্রিনের বাম পাশে সুন্দরভাবে ফিট হবে */
    }

    .swiper-button-next.s-next-flash::after, .swiper-button-next.s-next-new::after, .swiper-button-next.s-next-best::after, .swiper-button-next.s-next-all::after, [class*="s-next-cat-"]::after,
    .swiper-button-prev.s-prev-flash::after, .swiper-button-prev.s-prev-new::after, .swiper-button-prev.s-prev-best::after, .swiper-button-prev.s-prev-all::after, [class*="s-prev-cat-"]::after {
        font-size: 14px !important; /* তীরের সাইজ ১৪ পিক্সেল করা হলো (একদম পারফেক্ট ও স্লিম লুক) */
        font-weight: bold !important;
    }
}

/* স্লাইড করার মতো আর প্রোডাক্ট না থাকলে তীরটি আবছা হয়ে যাবে */
.swiper-button-disabled {
    opacity: 0.15 !important;
    pointer-events: none !important;
}


/* ==========================================================================
   Apple Premium Style Product Rounded Corners & Box Effect
   ========================================================================== */

/* ১. মেইন প্রোডাক্ট গ্রিড/কার্ড কন্টেইনারকে রাউন্ড করা */
.single-grid-product {
    border-radius: 16px !important; /* অ্যাপেল স্ট্যান্ডার্ড কার্ভড কর্নার */
    overflow: hidden !important;
    background: #ffffff !important;
    border: 1px solid #f5f5f7 !important; /* একদম হালকা সফট বর্ডার */
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

/* ২. ইমেজ বক্সের ব্যাকগ্রাউন্ড ও কর্নার রাউন্ড করা */
.single-grid-product .product-top {
    background-color: #f5f5f7 !important; /* হালকা অফ-হোয়াইট/গ্রে প্রিমিয়াম ব্যাকগ্রাউন্ড */
    border-radius: 12px !important;       /* ভেতরের ইমেজের চারপাশ হালকা রাউন্ড */
    margin: 8px !important;               /* কার্ডের বর্ডার থেকে সামান্য গ্যাপ */
    overflow: hidden !important;
}

/* ৩. প্রোডাক্টের মূল ছবিটির সাইজিং এবং কর্নার ফিক্স */
.single-grid-product .product-top .product-thumbnal,
.single-grid-product .product-top img {
    border-radius: 12px !important;
    object-fit: contain !important;
    mix-blend-mode: multiply !important; /* ইমেজের সাদা ব্যাকগ্রাউন্ড থাকলে তা ধূসর ব্যাকগ্রাউন্ডের সাথে মিশে যাবে */
    transition: transform 0.5s ease !important;
}

/* ৪. হোভার করলে কার্ডে হালকা প্রিমিয়াম শ্যাডো পড়বে এবং ছবি সামান্য জুম হবে */
.single-grid-product:hover {
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.04) !important; /* খুবই স্মুথ মিনিমাল শ্যাডো */
    border-color: #e8e8ed !important;
}

.single-grid-product:hover .product-top img {
    transform: scale(1.04) !important; /* প্রিমিয়াম হালকা জুম ইফেক্ট */
}

/* ৫. কার্ট বাটনটি রাউন্ড ও অ্যাপেল ব্লু থিমে ম্যাচ করা */
a.add-cart.addCart {
    border-radius: 30px !important; /* ওভাল আকৃতির বাটন */
    font-weight: 600 !important;
    font-size: 13px !important;
}