/* =========================
        RESET
========================= */

*{
	margin:0;
	padding:0;
	box-sizing:border-box;
	font-family:Arial, Helvetica, sans-serif;
	}
	/*------------------------------------------------------------------
		4. LOADER
	-------------------------------------------------------------------*/

.bg_load {
	float: left;
	position: fixed;
	width: 100%;
	text-align: center;
	height: 100%;
	z-index: 999;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #ffffff;
}

.loader_animation {
	animation-name: rotatey;
	animation-duration: 2s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	-webkit-animation-name: rotatey;
	-webkit-animation-duration: 2s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
	-moz-animation-name: rotatey;
	-moz-animation-duration: 2s;
	-moz-animation-iteration-count: infinite;
	-moz-animation-timing-function: linear;
	-ms-animation-name: rotatey;
	-ms-animation-duration: 2s;
	-ms-animation-iteration-count: infinite;
	-ms-animation-timing-function: linear;
	-o-animation-name: rotatey;
	-o-animation-duration: 2s;
	-o-animation-iteration-count: infinite;
	-o-animation-timing-function: linear;
}

@-webkit-keyframes rotatey {
	from {
		-webkit-transform: rotatey(0deg);
		-moz-transform: rotatey(0deg);
		-ms-transform: rotatey(0deg);
		-o-transform: rotatey(0deg);
		transform: rotatey(0deg);
	}
	to {
		-webkit-transform: rotatey(360deg);
		-moz-transform: rotatey(360deg);
		-ms-transform: rotatey(360deg);
		-o-transform: rotatey(360deg);
		transform: rotatey(360deg);
	}
}

@-moz-keyframes rotatey {
	from {
		-moz-transform: rotatey(0deg);
	}
	to {
		-moz-transform: rotatey(360deg);
	}
}
	
	
	
	/* =========================
			NAVBAR
	========================= */
	
	.header{
	position:fixed;
	top:0;
	width:100%;
	background:#050c17f3;
	z-index:999; 
	border-bottom: white 2px solid;
	}
	
	.nav-wrapper{
	max-width:1200px;
	margin:auto;
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:8px 20px;
	}
	
	.logo{
	/* display:flex; */
	align-items:center;
	gap:0px;
	font-weight:bold;
	}
	.logo .logo-icon img{
		width: 20%;
	}
	
	.logo-text{
	color:#ffffff;
	letter-spacing:1px;
	}
	
	.nav-links{
	display:flex;
	list-style:none;
	gap:30px;
	}
	
	.nav-links a{
	position: relative;
	text-decoration:none;
	color:#d2d7e0;
	font-size:15px;
	top: 9px;
	}
	
	.nav-links a:hover{
	color:#42d4ff;
	}
	
	
	
	/* =========================
			DROPDOWN
	========================= */
	
	.dropdown{
	position:relative;
	top: -5px;
	}
	
	.dropdown-menu{
	position:absolute;
	top:35px;
	left:0;
	background:#0b1220;
	padding:10px 0;
	width:180px;
	display:none;
	border-radius:6px;
	border-top: white 2px solid;
	}
	
	.dropdown-menu li{
	list-style:none;
	}
	
	.dropdown-menu a{
	display:block;
	padding:10px 18px;
	color:#cbd3e2;
	}
	
	.dropdown-menu a:hover{
	background:#111b2e;
	border-top: white 2px solid;
	border-bottom: white 2px solid;
	}
	
	.dropdown:hover .dropdown-menu{
	display:block;
	}
	
	
	
	/* =========================
			NAV ICONS
	========================= */
	
	.nav-icons{
	display:flex;
	align-items:center;
	gap:20px;
	color:white;
	}
	
	.menu-btn{
	display:none;
	flex-direction:column;
	gap:4px;
	cursor:pointer;
	}
	
	.menu-btn span{
	width:22px;
	height:2px;
	background:white;
	}
	
	
	
	/* =========================
			HERO
	========================= */
	
	.hero{
		position: relative;
		padding-top:120px;
	  
		/* Gradient overlay + background image */
		background: linear-gradient(90deg,#050c1765,#02060f85),
					url("/image/hero-banner.jpg");
	  
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	  
		color:white;
	  }
	
	.hero-container{
	position: relative;
	max-width:1200px;
	margin:auto;
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:80px 20px;
	gap:40px;
	}
	
	.hero-text{
	max-width:600px;
	}
	
	
	
	/* DISCOUNT PILL */
	
	.discount-pill{
	background:#0c1b2f;
	padding:10px 18px;
	border-radius:30px;
	display:inline-block;
	margin-bottom:25px;
	color:#44d6ff;
	font-size:14px;
	}
	
	
	
	/* HERO TITLE */
	
	.hero h1{
	font-size:60px;
	line-height:1.1;
	margin-bottom:20px;
	}
	
	.gradient{
	background:linear-gradient(90deg,#00d9ff,#7b6cff);
	-webkit-background-clip:text;
	color:transparent;
	}
	
	.hero p{
	color:#ffffff;
	font-size:18px;
	margin-bottom:35px;
	}
	
	
	
	/* HERO BUTTONS */
	
	.hero-buttons{
	display:flex;
	gap:20px;
	margin-bottom:40px;
	}
	
	.btn-primary{
	background:linear-gradient(90deg,#00d9ff,#3fa7ff);
	padding:14px 28px;
	border-radius:10px;
	color:white;
	text-decoration:none;
	}
	
	.btn-secondary{
	border:2px solid #2a3446;
	padding:14px 28px;
	border-radius:10px;
	color:white;
	text-decoration:none;
	background: transparent;
	}
	
	
	
	/* HERO STATS */
	
	.hero-stats{
	display:flex;
	gap:40px;
	}
	
	.hero-stats h3{
	color:#40d3ff;
	font-size:26px;
	}
	
	
	
	/* HERO IMAGE */
	
	/* .hero-image img{
	width:420px;
	} */


	/*------------------  category-section----------------- */

.category-section{
    background:#050b18;
    padding:80px 8%;
    font-family:Arial, Helvetica, sans-serif;
}

/* HEADER */

.category-header{
    text-align:center;
    margin-bottom:50px;
}

.category-header h2{
    font-size:42px;
    color:white;
    font-weight:700;
}

.category-header span{
    color:#0ea5e9;
}

.category-header p{
    color:#8b9bb7;
    margin-top:10px;
}

/* GRID */

.category-container{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
}

/* CARD */

.category-card{
    position:relative;
    border-radius:16px;
    overflow:hidden;
    cursor:pointer;
    border:1px solid rgba(255,255,255,0.05);
    transition:0.4s;
}

/* IMAGE */

.category-card img{
    width:100%;
    height:320px;
    object-fit:cover;
    transition:transform 6s ease;
}

/* IMAGE ANIMATION */

.category-card:hover img{
    transform:scale(1.2);
}

/* INFO */

.category-info{
    position:absolute;
    bottom:20px;
    left:20px;
}

.category-info h3{
    color:white;
    font-size:20px;
}

.category-info p{
    color:#9fb0d1;
    font-size:14px;
}

/* GLOW HOVER EFFECT */

.category-card:hover{
    box-shadow:
    0 0 20px #0ea5e9,
    0 0 40px rgba(14,165,233,0.5);
    transform:translateY(-5px);
}



/*--------------- offer-section------------------- */
.offer-section{
	background:#070c16;
	padding:80px 6%;
	font-family:Arial, Helvetica, sans-serif;
	}
	
	
	.offer-box{
	display:flex;
	justify-content:space-between;
	align-items:center;
	background:linear-gradient(135deg,#0c2030,#101c3a,#0b1f2e);
	border-radius:20px;
	padding:60px;
	border:1px solid rgba(0,255,255,0.2);
	box-shadow:
	0 0 20px rgba(0,255,255,0.3),
	0 0 60px rgba(0,255,255,0.1);
	
	}
	
	
	/* LEFT SIDE */
	
	.offer-left{
	max-width:550px;
	}
	
	.offer-tag{
	background:#0d3d47;
	color:#27d4ff;
	padding:8px 18px;
	border-radius:20px;
	font-size:14px;
	display:inline-block;
	margin-bottom:20px;
	box-shadow:0 0 10px rgba(0,255,255,0.6);
	}
	
	
	.offer-left h1{
	color:white;
	font-size:42px;
	line-height:1.3;
	margin-bottom:20px;
	font-weight: 700;
	}
	
	
	.highlight{
	color:#22e0ff;
	text-shadow:
	0 0 10px #22e0ff,
	0 0 25px #22e0ff,
	0 0 40px #22e0ff;
	
	}
	
	
	.offer-left p{
	color:#9db0c6;
	line-height:1.7;
	margin-bottom:30px;
	}
	
	
	/* BUTTON */
	
	.offer-btn{
	display:inline-block;
	background:#22c1ff;
	color:#00121b;
	padding:14px 28px;
	border-radius:10px;
	font-weight:bold;
	text-decoration:none;
	transition:.4s;
	box-shadow:0 0 20px rgba(34,193,255,0.8);
	}
	
	.offer-btn:hover{
	transform:translateY(-3px);
	box-shadow:
	0 0 20px #22c1ff,
	0 0 40px #22c1ff;
	}
	
	
	/* RIGHT SIDE */
	
	.discount-circle{
	width:230px;
	height:230px;
	border-radius:50%;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	background:radial-gradient(circle,#0f2c42,#0b1a2d);
	box-shadow:
	0 0 40px rgba(0,255,255,0.5),
	inset 0 0 40px rgba(0,255,255,0.2);
	}
	
	
	.discount-circle h2{
	font-size:55px;
	color:#2de4ff;
	text-shadow:
	0 0 20px #2de4ff,
	0 0 40px #2de4ff;
	margin-bottom:5px;
	}
	
	
	.discount-circle span{
	color:#8fa9c4;
	letter-spacing:2px;
	font-size:14px;
	}

	/*--------------- offer-section ends------------------- */


	
	/*--------------- choose-section------------------- */
	.choose{

		background:#070c14;
		padding:20px 8%;
		font-family:Arial;
		color:white;
		}
		
		
		.choose-title{
		text-align:center;
		margin-bottom:70px;
		}
		
		.choose-title h2{
		font-size:40px;
		font-weight:700;
		}
		
		.choose-title span{
		background:linear-gradient(90deg,#2bd4ff,#6b7cff);
		-webkit-background-clip:text;
		color:transparent;
		}
		
		.choose-title p{
		color:#9aa5b4;
		margin-top:10px;
		}
		
		
		/* GRID */
		
		.choose-container{
		display:grid;
		grid-template-columns:repeat(4,1fr);
		gap:30px;
		}
		
		
		/* BOX */
		
		.choose-box{
		background:#0d1522;
		padding:40px;
		border-radius:15px;
		text-align:center;
		border:1px solid rgba(255,255,255,0.05);
		transition:0.4s;
		position:relative;
		overflow:hidden;
		}
		
		
		/* ICON */
		
		.icon{
		width:70px;
		height:70px;
		background:linear-gradient(180deg,#36d1ff,#1da2d8);
		border-radius:15px;
		display:flex;
		align-items:center;
		justify-content:center;
		margin:0 auto 20px;
		font-size:28px;
		color:#02111f;
		box-shadow:0 0 20px rgba(0,200,255,0.6);
		animation:iconFloat 3s ease-in-out infinite;
		}
		
		
		/* TEXT */
		
		.choose-box h3{
		font-size:20px;
		margin-bottom:10px;
		}
		
		.choose-box p{
		color:#9aa5b4;
		font-size:14px;
		line-height:1.6;
		}
		
		
		/* HOVER GLOW */
		
		.choose-box:hover{
		transform:translateY(-8px);
		box-shadow:
		0 0 25px rgba(0,200,255,0.3),
		0 0 50px rgba(0,200,255,0.2);
		}
		
		
		/* ICON ANIMATION */
		
		@keyframes iconFloat{
		0%{transform:translateY(0px);}
		50%{transform:translateY(-8px);}
		100%{transform:translateY(0px);}
		}
	/*--------------- choose-section-end------------------- */

	/*--------------------------------------------- start of about -----------------------------*/

/* HERO SECTION */
.about-hero {
	width: 100%;
	height: 250px;
	background: linear-gradient(#000000c4,#000000c7),
            url("../image/hero-banner.jpg");

	background-size: cover;
	background-position: center;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: #fff;
	position: relative;
	top: 100px;
  }
  
  /* Overlay container */
  .about-overlay {
	width: 90%;
	max-width: 900px;
  }
  
  /* Breadcrumb */
  .breadcrumb5 {
	margin-bottom: 25px;
  }
  .crumb5:hover{
	color: white;
  }
  
  .crumb5 {
	text-decoration: none;
	padding: 8px 15px;
	background: #2d2d2d;
	color: #fff;
	font-size: 14px;
	transition: 0.3s;
  }
  
  .crumb5.dark {
	background: #1f1f1f;
  }
  
  .arrow5 {
	color: #fff;
	margin: 0 8px;
	font-weight: bold;
  }
  
  /* Heading */
  .about-hero h1 {
	font-size: 42px;
	margin-bottom: 15px;
	font-weight: 600;
  }
  
  /* Paragraph */
  .about-hero p {
	font-size: 18px;
	max-width: 650px;
	margin: auto;
  }
  /*--------------------------------------------- start of about ends -----------------------------*/

  /* General Styles */

.contact-section {
	position: relative;
	background-color: #070e1a;
	padding: 20px;
	top: 3px;
	text-align: center;
  }
  .contact-header {
	background-color: #ffffff;
	color: #070c14;
	padding: 10px 0;
	font-size: 18px;
	font-weight: bold;
  }
  
  .contact-info1 {
	position: relative;
	display: flex;
	gap: 100px;
	width: 100%;
	top: 10px;
  }
  
  .info-item1 {
	position: relative;
	display: flex;
	align-items: center;
	text-align: left;
	left: 20px;
  }
  
  .icon1 {
	background-color: #131e3a;
	width: 100px;
	height: 100px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
	color: #fff;
	font-size: 24px;
	margin-right: 15px;
  }
  
  .icon1 img{
	width: 40%;
  }
  
  .info-text1 h3 {
	font-size: 18px;
	color: #fff;
	margin-bottom: 5px;
  }
  
  .info-text1 p {
	font-size: 14px;
	color: #fff;
  }
  .info-text1 p a{
  text-decoration: none;
  color: #fff;
  font-size: 14px;
  }
  
  /* Default Styles (Desktop) */
  /* No media query needed for larger screens since these are your default styles */
  
  /* Tablets (1024px and below) */
  @media screen and (max-width: 1024px) {
  .contact-info1 {
	  gap: 40px; /* Reduce spacing between items */
	  padding: 0 20px; /* Add some padding for better alignment */
	 left: -20px;
  }
  
  .info-item1 {
	  flex-direction: row; /* Keep items in row layout for tablets */
	  align-items: start; /* Center-align items */
	  text-align: center; /* Center text */
  }
  
  .icon1 {
	  width: 80px; /* Reduce icon size */
	  height: 80px;
  }
  
  .icon1 img {
	  width: 60%; /* Adjust image size inside icon */
  }
  
  .info-text1 h3 {
	  font-size: 22px; /* Keep a consistent heading size */
  }
  
  .info-text1 p {
	  font-size: 18px; /* Keep paragraphs readable */
  }
  }
  
  /* Large Mobile Phones (768px and below) */
  @media screen and (max-width: 768px) {
  .contact-info1 {
	  gap: 30px; /* Reduce spacing further for mobile */
	  padding: 0 15px;
	  left: 0;
  }
  
  .info-item1 {
	  flex-direction: column; /* Stack items vertically */
	  align-items: start; /* Center-align items */
	  text-align: center; /* Center text */
  }
  
  .icon1 {
	  width: 70px; /* Further reduce icon size */
	  height: 70px;
	  margin-bottom: 10px; /* Add spacing between icon and text */
  }
  
  .icon1 img {
	  width: 50%; /* Adjust image size */
  }
  
  .info-text1 h3 {
	font-size: 35px; /* Reduce heading size for small screens */
	margin-bottom: 5px;
	text-align: left;
  }
  
  .info-text1 p {
	font-size: 23px; /* Adjust paragraph font size */
	text-align: left;
  }
  }
  
  /* Small Mobile Phones (480px and below) */
  @media screen and (max-width: 480px) {
  .contact-info1 {
	  flex-direction: column; /* Stack all items vertically */
	  gap: 20px; /* Reduce spacing between items for small screens */
	  padding: 0 10px; /* Add padding to prevent edge clipping */
	  align-items: start;
	  left: 0px;
  }
  
  .info-item1 {
	  flex-direction: column; /* Stack icon and text vertically */
	  align-items: start; /* Center-align items */
	  text-align: center; /* Center text */
  }
  
  .icon1 {
	  width: 60px; /* Reduce icon size */
	  height: 60px;
	  margin-bottom: 10px; /* Add spacing below icon */
  }
  
  .icon1 img {
	  width: 50%; /* Adjust image size */
  }
  
  .info-text1 h3 {
	  font-size: 35px; /* Reduce heading size for small screens */
	  margin-bottom: 5px;
	  text-align: left;
  }
  
  .info-text1 p {
	  font-size: 19px; /* Adjust paragraph font size */
	  text-align: left;
  }
  
  .info-text1 a {
	  font-size: 12px; /* Ensure links are also resized */
  }
  }
  
  
  /* ---------------end----------- */
  
  
  .google-map {
	padding-bottom: 50%;
	position: relative;
	top: 10px;
  }
  
  .google-map iframe {
	height: 100%;
	width: 100%;
	top: 0;
	position: absolute;
	border: 50px solid red; /* Border around the map */
  }
  
  /* Media Queries */
  
  /* Medium screens (tablets and small desktops) */
  @media screen and (max-width: 1024px) {
	.google-map {
	  top: 0px; /* Adjust position for smaller screens */
		height: 500px;
	}
  
	.google-map iframe {
		width: 95%; /* Increase map width to fill more space */
		left: 0px; /* Reduce left offset for better centering */
		height: 100%; /* Adjust height to fit better on smaller screens */
		width: 100%; /* Adjust height to fit better on smaller screens */
		border: 30px solid red; /* Smaller border for smaller screens */
	}
  }
  
  /* Small screens (large phones and tablets) */
  @media screen and (max-width: 768px) {
	.google-map {
	  top: 0px; /* Reduce the top spacing */
		height: 500px;
	}
  
	.google-map iframe {
		width: 100%; /* Full width */
		left: 0; /* Center the map */
		height: 100%; /* Adjust height to fit better on smaller screens */
		border: 20px solid red; /* Further reduce the border */
	}
  }
  
  /* Extra small screens (phones) */
  @media screen and (max-width: 480px) {
	.google-map {
		top: 0px; /* Minimal top spacing */
		width: 100%;
		height: 500px;
	}
  
	.google-map iframe {
		width: 100%; /* Full width */
		left: 0; /* Align to the center */
		height: 100%; /* Adjust height for small screens */
		border: 10px solid red; /* Minimal border */
	}
  }
  
  /* ---------------------end-------------   */


  /* ================= CART ICON STYLE START ================= */

.cart-icon-wrapper{
    position:relative;
}

#cart-btn{
    background:none;
    border:none;
    font-size:22px;
    cursor:pointer;
    color:white;
    position:relative;
}

#cart-count{
    position:absolute;
    top:-8px;
    right:-10px;
    background:#00e0ff;
    color:black;
    font-size:12px;
    padding:2px 6px;
    border-radius:50%;
}

/* ================= CART ICON STYLE END ================= */


/* ================= PRODUCTS SECTION STYLE START ================= */

.featured-products{
	padding:100px 6%;
	background:#07121c;
	color:white;
	text-align:center;
	}
	
	.featured-products h2{
	font-size:38px;
	font-weight:700;
	margin-bottom:10px;
	}
	
	.featured-products h2 span{
	color:#1ed7ff;
	}
	
	.subtitle{
	color:#8ca6b5;
	margin-bottom:60px;
	font-size:16px;
	}
	
	.products-grid{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:30px;
	}
	
	.product-card{
	background:#0e1c27;
	border-radius:16px;
	overflow:hidden;
	transition:0.35s;
	border:1px solid rgba(255,255,255,0.05);
	}
	
	.product-card:hover{
	transform:translateY(-8px);
	box-shadow:0 20px 40px rgba(0,0,0,0.4);
	}
	
	.product-image{
	position:relative;
	/* padding:25px; */
	background:#0b1822;
	}
	
	.product-image img{
	width:100%;
	height:210px;
	object-fit:cover;
	}
	
	.badge{
	position:absolute;
	top:18px;
	left:18px;
	background:#21d4fd;
	color:black;
	font-size:12px;
	padding:6px 12px;
	border-radius:20px;
	font-weight:600;
	}
	
	.badge.sale{
	background:#21d4fd;
	}
	
	.product-info{
	padding:22px;
	text-align:left;
	}
	
	.category{
	color:#21d4fd;
	font-size:12px;
	letter-spacing:1px;
	margin-bottom:6px;
	font-weight:600;
	}
	
	.product-info h4{
	font-size:18px;
	margin-bottom:10px;
	font-weight:600;
	}
	
	.price{
	font-size:20px;
	color:#1ed7ff;
	font-weight:700;
	}
	
	.old-price{
	font-size:14px;
	color:#7b8c99;
	text-decoration:line-through;
	margin-left:10px;
	}
	
	.product-buttons{
	display:flex;
	align-items:center;
	gap:10px;
	margin-top:18px;
	}
	
	.add-cart{
	flex:1;
	background:#19c3e6;
	border:none;
	padding:12px;
	border-radius:10px;
	color:white;
	font-weight:600;
	cursor:pointer;
	transition:0.3s;
	}
	
	.add-cart:hover{
	background:#10a9ca;
	}
	
	.whatsapp-mini{
	width:45px;
	height:45px;
	border-radius:50%;
	border:none;
	background:#1fa463;
	color:white;
	font-size:18px;
	cursor:pointer;
	}
	.whatsapp-mini i{
		color: white;
	}
	
	/* ================= PRODUCT CARD OUTER GLOW ================= */

.product-card{
	position:relative;
	transition:all 0.35s ease;
	}
	
	/* outer glow around the card */
	.product-card:hover{
	box-shadow:
	0 0 10px rgba(0,224,255,0.6),
	0 0 20px rgba(0,224,255,0.4),
	0 0 40px rgba(0,224,255,0.25),
	0 0 60px rgba(0,224,255,0.15);
	}
	
	
	/* ================= IMAGE ZOOM ANIMATION ================= */
	
	.product-image{
	overflow:hidden;
	}
	
	.product-image img{
	transition:transform 0.4s ease;
	}
	
	/* zoom animation when hovering card */
	.product-card:hover .product-image img{
	animation:zoomProduct 3s ease-in-out infinite;
	}
	
	@keyframes zoomProduct{
	
	0%{
	transform:scale(1);
	}
	
	50%{
	transform:scale(1.12);
	}
	
	100%{
	transform:scale(1);
	}
	
	}
	
	/* ================= PRODUCTS SECTION STYLE END ================= */
	
	
	/* ================= RESPONSIVE ================= */
	
	@media(max-width:1100px){
	
	.products-grid{
	grid-template-columns:repeat(2,1fr);
	}
	
	}
	
	@media(max-width:700px){
	
	.products-grid{
	grid-template-columns:1fr;
	}
	
	.featured-products{
	padding:80px 20px;
	}
	.product-card img{
		height: 400px;
	}
	
	}	
	
	/* ================= CART PANEL STYLE START ================= */

#cart-panel{
	position:fixed;
	right:-400px;
	top:0;
	width:350px;
	height:100%;
	background:#0b1822;
	color:white;
	padding:20px;
	transition:.4s;
	z-index:999;
	display:flex;
	flex-direction:column;
	}
	
	#cart-panel.open{
	right:0;
	}
	
	.cart-header{
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-bottom:20px;
	border-bottom:1px solid rgba(255,255,255,0.08);
	padding-bottom:10px;
	}
	
	#close-cart{
	background:none;
	border:none;
	color:white;
	font-size:18px;
	cursor:pointer;
	}
	
	/* scroll area */
	#cart-items{
	flex:1;
	overflow-y:auto;
	padding-right:5px;
	}
	
	/* cart item card */
	
	.cart-item{
	display:flex;
	align-items:center;
	gap:12px;
	background:#101f2b;
	border-radius:12px;
	padding:10px;
	margin-bottom:15px;
	}
	
	.cart-item img{
	width:60px;
	height:60px;
	object-fit:cover;
	border-radius:8px;
	}
	
	/* item info */
	
	.cart-info{
	flex:1;
	}
	
	.cart-info p{
	margin:0;
	font-size:14px;
	}
	
	.cart-price{
	color:#00e0ff;
	font-weight:bold;
	margin-top:3px;
	}
	
	/* quantity */
	
	.cart-qty{
	display:flex;
	align-items:center;
	gap:8px;
	margin-top:6px;
	}
	
	.qty-btn{
	width:24px;
	height:24px;
	border:none;
	background:#1b2f3e;
	color:white;
	border-radius:4px;
	cursor:pointer;
	}
	
	.qty-btn:hover{
	background:#00e0ff;
	color:black;
	}
	
	.qty-number{
	font-size:14px;
	}
	
	/* delete */
	
	.remove-item{
	margin-left:auto;
	background:none;
	border:none;
	color:red;
	font-size:18px;
	cursor:pointer;
	}
	
	/* footer */
	
	.cart-footer{
	margin-top:20px;
	border-top:1px solid rgba(255,255,255,0.08);
	padding-top:15px;
	}
	
	.cart-total{
	display:flex;
	justify-content:space-between;
	font-size:16px;
	margin-bottom:15px;
	}
	
	#cart-total{
	color:#00e0ff;
	font-weight:bold;
	}
	
	.whatsapp-order{
	width:100%;
	background:#25D366;
	border:none;
	padding:12px;
	border-radius:8px;
	cursor:pointer;
	font-weight:bold;
	margin-bottom:10px;
	}
	
	#clear-cart{
	background:none;
	border:1px solid #999;
	color:#ccc;
	padding:10px;
	width:100%;
	cursor:pointer;
	border-radius:6px;
	}
	
	/* ================= CART PANEL STYLE END ================= */

	/* ================= CONTACT SECTION STYLE START ================= */
/* ================= CONTACT & TESTIMONIAL STYLE START ================= */

.contact-wrapper23{
	display:flex;
	justify-content:space-between;
	padding:60px;
	gap:40px;
	background:#06121d;
	}
	
	/* FORM */
	
	.contact-form23{
	width:50%;
	}
	
	.contact-form23 h2{
	color:white;
	margin-bottom:20px;
	}
	
	.contact-form23 input,
	.contact-form23 textarea{
	width:100%;
	padding:15px;
	margin-bottom:15px;
	border:none;
	background:#ddd;
	}
	
	.contact-form23 textarea{
	height:320px;
	}
	
	/* BUTTON STYLE */
	.btn23{
	padding:15px 40px;
	background:#222;
	color:white;
	border:none;
	cursor:pointer;
	transition:0.3s;
	}
	
	/* GLOW EFFECT */
	.btn23:hover{
	box-shadow:0 0 15px #00f0ff, 0 0 30px #00f0ff;
	}
	
	
	/* TESTIMONIAL */
	
	.testimonial23{
	width:50%;
	background:#000;
	padding:20px;
	border-radius:10px;
	}
	
	.testimonial23 h2{
	color:white;
	margin-bottom:20px;
	}
	
	.slider23{
	overflow:hidden;
	width:100%;
	}
	
	.slides23{
	display:flex;
	transition:transform 0.5s ease;
	width:100%;
	}
	
	.slides23 img{
	width:100%;
	max-width:100%;
	border-radius:10px;
	}
	
	/* CONTROLS */
	
	.controls23{
	margin-top:15px;
	display:flex;
	gap:20px;
	}

	/* ================= RESPONSIVE START ================= */

@media (max-width:900px){

	.contact-wrapper23{
	flex-direction:column;
	}
	
	.contact-form23,
	.testimonial23{
	width:100%;
	}
	
	}
	
	@media (max-width:500px){
	
	.contact-wrapper23{
	padding:30px;
	}
	
	.btn23{
	width:100%;
	}
	
	}
	
	/* ================= RESPONSIVE END ================= */
	
	/* ================= CONTACT & TESTIMONIAL STYLE END ================= */
	/* ================= CONTACT SECTION STYLE END ================= */





	/*--------------- footer-section------------------- */
	.footer{
		background:#070c14;
		padding:80px 8% 30px;
		color:#9aa5b4;
		font-family:Arial;
		border-top: rgb(255, 255, 255) 2px solid;
		position: relative;
		top: 40px;
		}
		
		.footer-container{
		display:grid;
		grid-template-columns:repeat(4,1fr);
		gap:50px;
		}
		
		
		/* LOGO */
		
		.logo1{
		color:white;
		font-size:22px;
		margin-bottom:15px;
		}
		
		.logo1 img{
		margin-right:5px;
		width: 20%;
		}
		
		.logo1 span{
		color:#23cfff;
		}
		
		
		/* TEXT */
		
		.footer-box p{
		font-size:14px;
		line-height:1.7;
		margin-bottom:15px;
		}
		
		
		/* HEADINGS */
		
		.footer-box h3{
		color:white;
		margin-bottom:15px;
		}
		.footer-box h2{
			font-size: 16.5PX;
			font-weight: 750;
		}
		
		
		/* LINKS */
		
		.footer-box ul{
		list-style:none;
		}
		
		.footer-box ul li{
		margin-bottom:10px;
		}
		
		.footer-box ul li a{
		text-decoration:none;
		color:#9aa5b4;
		transition:0.3s;
		}
		
		.footer-box ul li a:hover{
		color:#23cfff;
		}
		
		
		/* SOCIAL ICONS */
		
		.socials{
		display:flex;
		gap:15px;
		margin-top:20px;
		}
		
		.socials a{
		width:45px;
		height:45px;
		background:#111827;
		display:flex;
		align-items:center;
		justify-content:center;
		color:white;
		font-size:16px;
		text-decoration:none;
		transform:rotate(45deg);
		border-radius:6px;
		transition:0.4s;
		}
		
		/* ICON ROTATION FIX */
		
		.socials a i{
		transform:rotate(-45deg);
		}
		
		
		/* HOVER GLOW */
		
		.socials a:hover{
		background:#23cfff;
		box-shadow:0 0 15px #23cfff;
		}
		
		
		/* CONTACT ICONS */
		
		.footer-box p i{
		color:#23cfff;
		margin-right:8px;
		}
		
		
		/* NEWSLETTER */
		
		.newsletter{
		display:flex;
		margin-top:10px;
		}
		
		.newsletter input{
		flex:1;
		padding:12px;
		border:none;
		outline:none;
		background:#111827;
		color:white;
		border-radius:8px 0 0 8px;
		}
		
		.newsletter button{
		padding:12px 20px;
		border:none;
		background:#23cfff;
		color:black;
		border-radius:0 8px 8px 0;
		cursor:pointer;
		transition:0.3s;
		}
		
		.newsletter button:hover{
		box-shadow:0 0 12px #23cfff;
		}
		
		
		/* BOTTOM */
		
		.footer-bottom{
		margin-top:60px;
		border-top:1px solid rgba(255,255,255,0.05);
		padding-top:20px;
		text-align:center;
		font-size:14px;
		}
		/*--------------- footer-section-end------------------- */