/* Basic Styling */
.custom-section-1 {
    font-family: Arial, sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    margin: 0;
    background: #f3f3f3;
}

/* Slideshow Container */
.custom-slideshow-container {
    position: relative;
    width: 100%; /* Full width */
    height: 100vh; /* Full viewport height */
    overflow: hidden;
    border-radius: 0; /* Ensure full-screen with no rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* Individual Slides */
.custom-slide {
    display: none;
    position: absolute;
    width: 100%; /* Full container width */
    height: 100%; /* Full container height */
}

/* Ensure images cover the container */
.custom-slide img {
    width: 100%;
    height: 100%; /* Full container height */
    object-fit: cover; /* Maintain aspect ratio while filling the container */
}

/* Active slide class */
.custom-slide.show {
    display: block;
    animation: customSlideInEffect 0.8s forwards;
}

@keyframes customSlideInEffect {
    from { transform: translateX(100%); } /* Start off-screen */
    to { transform: translateX(0); } /* Slide into view */
}


/* Text Overlay */
.custom-text-overlay {
    position: absolute;
    bottom: 20px;
    left: 20px;
    color: white;
    font-size: 16px;
    padding: 8px 12px;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 5px;
    width: auto;
}

/* Navigation Arrows */
.custom-prev, .custom-next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    padding: 10px;
    color: white;
    font-size: 20px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.5);
    user-select: none;
    z-index: 10;
}

.custom-prev { left: 10px; }
.custom-next { right: 10px; }

/* Dots */
.custom-dot-container {
    position: absolute;
    bottom: 15px;
    width: 100%;
    text-align: center;
}

.custom-dot {
    cursor: pointer;
    height: 12px;
    width: 12px;
    margin: 0 5px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.custom-active, .custom-dot:hover {
    background-color: #717171;
}

/* Responsive Design */
@media screen and (max-width: 768px) {
    .custom-text-overlay {
        font-size: 14px;
        bottom: 15px;
        left: 15px;
    }

    .custom-prev, .custom-next {
        font-size: 18px;
        padding: 8px;
    }
}

@media screen and (max-width: 480px) {
    .custom-text-overlay {
        font-size: 12px;
        padding: 5px 10px;
    }

    .custom-prev, .custom-next {
        font-size: 16px;
        padding: 5px;
    }

    .custom-dot {
        height: 10px;
        width: 10px;
    }
}

 /* Basic Reset */
 .f1hy654fdvh564sd { margin: 0; padding: 10; box-sizing: border-box; }
 .f2hy123fdrt234sd { font-family: Arial, sans-serif; }

 /* Hero Banner */
 .h1fdg343kjf234gk {
     display: flex;
     align-items: center;
     justify-content: center;
     height: 80vh;
     background: url('../img/slide/1.jpg') no-repeat center/cover;
     color: white;
     text-align: center;
     padding: 20px;
 }
 .h2sfg235hr3k5j6k {
     max-width: 600px;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 20px;
     border-radius: 5px;
 }
 .h3hsf534kj4k5j3k { font-size: 3em; margin-bottom: 10px; }
 .h4jfsd234j4k5k4j { font-size: 1.2em; }
 .btn234htr3j2kl4k {
     background: #ff6b6b;
     padding: 10px 20px;
     border: none;
     color: white;
     font-size: 1em;
     cursor: pointer;
     border-radius: 5px;
     margin-top: 15px;
     transition: background 0.3s;
 }
 .btn234htr3j2kl4k:hover { background: #ff5252; }

 /* Sections */
 .sec434j5k3h2j4h {
     padding: 40px 20px;
     max-width: 1200px;
     margin: 0 auto;
 }
 .sec-title3jk4h53g2k { text-align: center; margin-bottom: 20px; font-size: 2em; }

 /* Featured Products & New Arrivals */
 .prod-grid5y3h43k2j {
     display: grid;
     gap: 20px;
     grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
 }
 .prod-card2j3g43h2kj {
     background: #fff;
     border: 1px solid #ddd;
     padding: 15px;
     text-align: center;
     border-radius: 5px;
     transition: box-shadow 0.3s;
 }
 .prod-card2j3g43h2kj:hover { box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2); }
 .prod-img53gk2k35j { width: 100%; height: 150px; object-fit: cover; border-radius: 5px; }
 .prod-title4h53k23jh { font-size: 1.2em; margin: 10px 0; }
 .prod-price2kjh5j34k { color: #777; font-size: 0.9em; }

 /* Categories */
 .cat-grid4j5k3hg34 {
     display: flex;
     gap: 20px;
     overflow-x: auto;
     padding: 10px;
 }
 .cat-card53kj42gh5 {
     min-width: 150px;
     background: #f0f0f0;
     text-align: center;
     padding: 20px;
     border-radius: 5px;
     transition: background 0.3s;
 }
 .cat-card53kj42gh5:hover { background: #ddd; }
 .cat-img3g4jk35jk { width: 100%; height: 100px; object-fit: cover; border-radius: 5px; }
 .cat-title3j4k2jkh { margin-top: 10px; font-size: 1em; }

 /* Testimonials */
 .testimonials5k4j3ghk2 { text-align: center; }
 .testimonial-card2jk3hg5j3k {
     display: inline-block;
     background: #fff;
     padding: 20px;
     border: 1px solid #ddd;
     border-radius: 5px;
     margin: 0 10px;
     max-width: 300px;
 }

 /* Newsletter Signup */
 .newsletter5kj3hg5j34 {
     background: #333;
     color: white;
     text-align: center;
     padding: 30px 20px;
     border-radius: 5px;
 }
 .newsletter-input3j5gh2j4 {
     padding: 10px;
     width: 70%;
     border: none;
     border-radius: 3px;
     margin-right: 10px;
 }
 .newsletter-btn23k4gh23 {
     padding: 10px 20px;
     border: none;
     background: #ff6b6b;
     color: white;
     border-radius: 3px;
     cursor: pointer;
     transition: background 0.3s;
 }
 .newsletter-btn23k4gh23:hover { background: #ff5252; }

 /* Responsive */
 @media (max-width: 768px) {
     .h3hsf534kj4k5j3k { font-size: 2em; }
     .prod-grid5y3h43k2j, .cat-grid4j5k3hg34 { grid-template-columns: 1fr 1fr; }
     .newsletter-input3j5gh2j4 { width: 60%; margin: 5px 0; }
 }

 /* Sales and Promotions */
.sec-sales2j5k4h2 { padding: 40px 20px; max-width: 1200px; margin: 0 auto; }
.sales-grid6k4j5k2 { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.sales-card3j5k4j2 { background: #fff; border: 1px solid #ddd; padding: 15px; border-radius: 5px; text-align: center; transition: box-shadow 0.3s; }
.sales-img5j4k2h5 { width: 100%; height: 150px; object-fit: cover; border-radius: 5px; }
.sales-title2j5k4j3 { font-size: 1.5em; margin: 10px 0; }
.sales-price8h5j4h3 { font-size: 1.2em; color: #d9534f; margin: 10px 0; }
.sales-description4h5j2k3 { color: #555; margin-bottom: 15px; }
.sales-btn5j3k4h5 {
   background: #ff6b6b;
   padding: 10px 15px;
   border: none;
   color: white;
   font-size: 1em;
   cursor: pointer;
   border-radius: 5px;
   transition: background 0.3s;
}
.sales-btn5j3k4h5:hover { background: #ff5252; }
/* Festive Offers */
.sec-festive3d4g5k2 { padding: 40px 20px; max-width: 1200px; margin: 0 auto; background: #f9f9f9; border-radius: 5px; }
.sec-title3d2g4k5 { text-align: center; margin-bottom: 20px; font-size: 2.5em; color: #d9534f; }

.festive-grid4k2g3j2 { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.festive-card3k4g5j2 { background: #fff; border: 1px solid #ddd; padding: 15px; border-radius: 5px; text-align: center; box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1); transition: transform 0.3s; }
.festive-card3k4g5j2:hover { transform: translateY(-5px); }

.festive-img3j5k4g2 { width: 100%; height: 150px; object-fit: cover; border-radius: 5px; }
.festive-title3d5g4k2 { font-size: 1.5em; margin: 10px 0; color: #333; }
.festive-price5d3g2 { font-size: 1.2em; color: #d9534f; margin: 10px 0; }
.festive-description4g3k5d2 { color: #555; margin-bottom: 15px; }
.festive-btn3g5k2 {
   background: #ff6b6b;
   padding: 10px 15px;
   border: none;
   color: white;
   font-size: 1em;
   cursor: pointer;
   border-radius: 5px;
   transition: background 0.3s;
}
.festive-btn3g5k2:hover { background: #ff5252;
 }