/* Custom Styles */
 .hero-bg {
     background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('https://images.pexels.com/photos/1162983/pexels-photo-1162983.jpeg');
     background-size: cover;
     background-position: center;
     background-attachment: fixed;
 }

 .dark .hero-bg {
     background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('https://images.pexels.com/photos/1162983/pexels-photo-1162983.jpeg');
 }

 .testimonial-slider {
     transition: transform 0.5s ease-in-out;
 }

 .observe-section {
     opacity: 0;
     transform: translateY(40px);
     transition: opacity 0.8s ease, transform 0.8s ease;
 }

 .observe-section.visible {
     opacity: 1;
     transform: translateY(0);
 }

 /* Hamburger Menu Icon Styling */
 .hamburger {
     cursor: pointer;
     width: 28px;
     height: 24px;
     transition: all 0.25s;
     position: relative;
 }

 .hamburger-top,
 .hamburger-middle,
 .hamburger-bottom {
     position: absolute;
     width: 28px;
     height: 3px;
     background: #333;
     /* Dark text color for light mode */
     border-radius: 5px;
     transform: rotate(0);
     transition: all 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55);
 }

 .dark .hamburger-top,
 .dark .hamburger-middle,
 .dark .hamburger-bottom {
     background: #e5e7eb;
     /* Light text color for dark mode */
 }

 .hamburger-top {
     top: 0;
 }

 .hamburger-middle {
     top: 10px;
 }

 .hamburger-bottom {
     top: 20px;
 }

 .open .hamburger-top {
     transform: rotate(45deg) translateY(12px) translateX(5px);
 }

 .open .hamburger-middle {
     opacity: 0;
     transform: translateX(-20px);
 }

 .open .hamburger-bottom {
     transform: rotate(-45deg) translateY(-12px) translateX(5px);
 }

 /* Modal styles */
 .modal-overlay {
     transition: opacity 0.3s ease;
 }

 .modal-content {
     transition: transform 0.3s ease, opacity 0.3s ease;
 }

 /* Cart Sidebar */
 #cart-modal .modal-content {
     transition: transform 0.4s ease-out;
     will-change: transform;
 }

 #cart-modal.open .modal-content {
     transform: translateX(0);
 }