	:root {
		--primary-color: #e74c3c;
		--secondary-color: #2c3e50;
		--accent-color: #f39c12;
		--success-color: #27ae60;
		--text-dark: #2c3e50;
		--text-light: #7f8c8d;
		--bg-light: #f8f9fa;
		--white: #ffffff;
		--dark-bg: #1a1a1a;
		--dark-card: #2d2d2d;
		--dark-text: #e0e0e0;
		--gradient-primary: linear-gradient(135deg, #e74c3c 0%, #f39c12 100%);
		--gradient-dark: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
		--shadow-sm: 0 2px 10px rgba(0,0,0,0.08);
		--shadow-md: 0 5px 20px rgba(0,0,0,0.1);
		--shadow-lg: 0 10px 40px rgba(0,0,0,0.15);
		--shadow-xl: 0 20px 60px rgba(0,0,0,0.2);
	}

	[data-theme="dark"] {
		--bg-light: #1a1a1a;
		--white: #2d2d2d;
		--text-dark: #e0e0e0;
		--text-light: #b0b0b0;
		--dark-bg: #0d0d0d;
		--dark-card: #1a1a1a;
		--shadow-sm: 0 2px 10px rgba(0,0,0,0.3);
		--shadow-md: 0 5px 20px rgba(0,0,0,0.4);
		--shadow-lg: 0 10px 40px rgba(0,0,0,0.5);
	}

	* {
		margin: 0;
		padding: 0;
		box-sizing: border-box;
	}

	body {
		font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
		color: var(--text-dark);
		background-color: var(--bg-light);
		overflow-x: hidden;
		transition: background-color 0.3s, color 0.3s;
	}

	/* Custom Scrollbar */
	::-webkit-scrollbar {
		width: 10px;
	}

	::-webkit-scrollbar-track {
		background: var(--bg-light);
	}

	::-webkit-scrollbar-thumb {
		background: var(--gradient-primary);
		border-radius: 5px;
	}

	/* Scroll Progress Bar */
	.scroll-progress {
		position: fixed;
		top: 0;
		left: 0;
		width: 0%;
		height: 3px;
		background: var(--gradient-primary);
		z-index: 10000;
		transition: width 0.2s;
	}

	/* Dark Mode Toggle Enhanced */
	.theme-toggle {
		position: fixed;
		bottom: 20px;
		right: 20px;
		background: var(--white);
		border: 2px solid var(--primary-color);
		border-radius: 50px;
		width: 55px;
		height: 55px;
		cursor: pointer;
		z-index: 997;
		box-shadow: 0 5px 20px rgba(0,0,0,0.3);
		transition: all 0.3s;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.theme-toggle:hover {
		transform: scale(1.1) rotate(180deg);
		box-shadow: 0 8px 30px rgba(0,0,0,0.4);
	}

	.theme-toggle i {
		font-size: 24px;
		color: var(--primary-color);
	}

	[data-theme="dark"] .theme-toggle {
		background: var(--dark-card);
		border-color: var(--accent-color);
	}

	[data-theme="dark"] .theme-toggle i {
		color: var(--accent-color);
	}

	/* Top Header */
	.top-header {
		background: var(--gradient-dark);
		color: white;
		padding: 10px 0;
		font-size: 13px;
		border-bottom: 1px solid rgba(255,255,255,0.1);
	}

	.top-header a {
		color: white;
		text-decoration: none;
		margin: 0 15px;
		transition: all 0.3s;
		display: inline-flex;
		align-items: center;
		gap: 5px;
		opacity: 0.9;
	}

	.top-header a:hover {
		color: var(--accent-color);
		opacity: 1;
		transform: translateY(-1px);
	}

	/* Main Header */
	.main-header {
		background: var(--white);
		box-shadow: var(--shadow-md);
		position: sticky;
		top: 0;
		padding: 10px 0 0 0;
		z-index: 1000;
		transition: all 0.3s;
		backdrop-filter: blur(10px);
		background: rgba(255,255,255,0.95);
	}

	[data-theme="dark"] .main-header {
		background: rgba(45,45,45,0.95);
	}

	[data-theme="dark"] .search-box input {
		background: rgba(255,255,255,0.1);
		color: var(--dark-text);
	}

	[data-theme="dark"] .nav-icons a {
		color: var(--dark-text);
	}

	[data-theme="dark"] .nav-icons a:hover {
		color: var(--primary-color);
	}

	[data-theme="dark"] .search-box input {
		background: rgba(255,255,255,0.1);
		color: var(--dark-text);
		border-color: rgba(255,255,255,0.2);
	}

	[data-theme="dark"] .search-box input::placeholder {
		color: rgba(255,255,255,0.5);
	}

	[data-theme="dark"] .search-box input:focus {
		background: rgba(255,255,255,0.15);
		border-color: var(--primary-color);
	}

	.header-scrolled {
		box-shadow: var(--shadow-lg);
	}

	/* Logo */
	.logo-container {
		display: flex;
		align-items: center;
		gap: 12px;
		font-size: 24px;
		font-weight: 800;
		color: var(--primary-color);
		text-decoration: none;
		transition: all 0.3s;
	}

	.logo-container:hover {
		transform: scale(1.05);
		color: var(--primary-color);
	}

	.logo-container i {
		font-size: 36px;
		background: var(--gradient-primary);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		filter: drop-shadow(2px 2px 4px rgba(0,0,0,0.1));
	}

	[data-theme="dark"] .logo-container span {
		color: var(--primary-color);
	}

	/* Search Box Enhanced */
	.search-box {
		position: relative;
		max-width: 400px;
		margin: 0 auto;
	}

	.search-box input {
		width: 100%;
		padding: 12px 50px 12px 20px;
		border: 2px solid transparent;
		border-radius: 50px;
		background: rgba(0,0,0,0.05);
		font-size: 14px;
		transition: all 0.3s;
	}

	.search-box input:focus {
		border-color: var(--primary-color);
		background: var(--white);
		box-shadow: var(--shadow-lg);
		transform: translateY(-2px);
		outline: none;
	}

	.search-box button {
		position: absolute;
		right: 3px;
		top: 50%;
		transform: translateY(-50%);
		background: var(--gradient-primary);
		border: none;
		color: white;
		width: 40px;
		height: 40px;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all 0.3s;
	}

	.search-box button:hover {
		transform: translateY(-50%) scale(1.1);
		box-shadow: var(--shadow-md);
	}

	/* Navigation Enhanced */
	.navbar {
		padding: 0;
	}

	.navbar-nav {
		background: transparent;
		border-radius: 0;
		padding: 0;
		width: 100%;
		justify-content: center;
	}

	[data-theme="dark"] .navbar-nav {
		background: transparent;
	}

	.navbar-nav .nav-link {
		color: var(--text-dark);
		font-weight: 600;
		padding: 18px 25px;
		transition: all 0.3s;
		position: relative;
		text-transform: uppercase;
		font-size: 13px;
		letter-spacing: 1px;
		border-radius: 8px;
		margin: 0 2px;
	}

	.navbar-nav .nav-link:hover {
		background: rgba(231, 76, 60, 0.08);
		color: var(--primary-color);
	}

	[data-theme="dark"] .navbar-nav .nav-link {
		color: var(--dark-text);
	}

	[data-theme="dark"] .navbar-nav .nav-link i {
		color: var(--dark-text);
	}

	.navbar-nav .nav-link::before {
		content: '';
		position: absolute;
		bottom: 5px;
		left: 50%;
		transform: translateX(-50%);
		width: 0;
		height: 3px;
		background: var(--gradient-primary);
		transition: width 0.3s;
		border-radius: 2px;
	}

	.navbar-nav .nav-link:hover::before,
	.navbar-nav .nav-link.active::before {
		width: 60%;
	}

	.navbar-nav .nav-link:hover,
	.navbar-nav .nav-link.active {
		color: var(--primary-color) !important;
	}

	/* Mobile Menu Toggle Enhanced */
	.navbar-toggler {
		border: none;
		padding: 0;
		width: 48px;
		height: 48px;
		position: relative;
		background: rgba(231, 76, 60, 0.08);
		border-radius: 12px;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all 0.3s ease;
		box-shadow: 0 2px 8px rgba(0,0,0,0.06);
	}

	.navbar-toggler:hover {
		background: rgba(231, 76, 60, 0.12);
		transform: scale(1.05);
		box-shadow: 0 4px 12px rgba(0,0,0,0.1);
	}

	.navbar-toggler:active {
		transform: scale(0.95);
	}

	.navbar-toggler:focus {
		box-shadow: 0 0 0 3px rgba(231, 76, 60, 0.2);
		outline: none;
	}

	.navbar-toggler-icon {
		width: 22px;
		height: 18px;
		position: relative;
		display: inline-block;
		transition: all 0.3s;
	}

	.navbar-toggler-icon span {
		position: absolute;
		left: 0;
		width: 100%;
		height: 2px;
		border-radius: 2px;
		transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
		transform-origin: center;
	}

	[data-theme="dark"] .navbar-toggler {
		background: rgba(243, 156, 18, 0.08);
	}

	[data-theme="dark"] .navbar-toggler:hover {
		background: rgba(243, 156, 18, 0.12);
	}

	[data-theme="dark"] .navbar-toggler-icon span {
		background: var(--accent-color);
	}

	.navbar-toggler-icon span:nth-child(1) {
		top: 0;
	}

	.navbar-toggler-icon span:nth-child(2) {
		top: 50%;
		transform: translateY(-50%);
		opacity: 1;
	}

	.navbar-toggler-icon span:nth-child(3) {
		bottom: 0;
	}

	/* Hamburger Animation */
	.navbar-toggler[aria-expanded="true"] {
		background: var(--primary-color);
	}

	.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon span {
		background: white;
	}

	.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon span:nth-child(1) {
		transform: rotate(45deg) translate(5px, 5px);
	}

	.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon span:nth-child(2) {
		opacity: 0;
		transform: translateX(-20px);
	}

	.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon span:nth-child(3) {
		transform: rotate(-45deg) translate(5px, -5px);
	}

	/* Cart Badge Enhanced */
	.nav-icons {
		display: flex;
		align-items: center;
	}

	.nav-icons a {
		color: var(--text-dark);
		text-decoration: none;
		font-size: 18px;
		transition: all 0.3s;
		position: relative;
	}

	.nav-icons a:hover {
		color: var(--primary-color);
	}

	[data-theme="dark"] .nav-icons a {
		color: var(--dark-text);
	}

	[data-theme="dark"] .nav-icons a:hover {
		color: var(--primary-color);
	}

	.cart-badge {
		position: absolute;
		top: -10px;
		right: -10px;
		background: var(--gradient-primary);
		color: white;
		border-radius: 50%;
		width: 20px;
		height: 20px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 11px;
		font-weight: bold;
		animation: pulse 2s infinite;
		box-shadow: 0 2px 5px rgba(0,0,0,0.2);
	}

	/* Hero Section Redesigned */
	.hero-section {
		position: relative;
		min-height: 100vh;
		display: flex;
		align-items: center;
		background: var(--gradient-dark);
		overflow: hidden;
	}

	/* Animated Background */
	.hero-bg-animation {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}

	.hero-bg-animation::before {
		content: '';
		position: absolute;
		top: -50%;
		left: -50%;
		width: 200%;
		height: 200%;
		background: radial-gradient(circle at 20% 80%, rgba(231, 76, 60, 0.3) 0%, transparent 50%),
					radial-gradient(circle at 80% 20%, rgba(243, 156, 18, 0.3) 0%, transparent 50%),
					radial-gradient(circle at 40% 40%, rgba(46, 204, 113, 0.2) 0%, transparent 50%);
		animation: gradient-shift 20s ease infinite;
	}

	@keyframes gradient-shift {
		0%, 100% { transform: translate(0, 0) rotate(0deg); }
		33% { transform: translate(-100px, -100px) rotate(120deg); }
		66% { transform: translate(100px, -100px) rotate(240deg); }
	}

	/* Floating Elements */
	.floating-element {
		position: absolute;
		opacity: 0.1;
		animation: float 6s ease-in-out infinite;
	}

	.floating-element:nth-child(1) {
		top: 20%;
		left: 10%;
		animation-delay: 0s;
	}

	.floating-element:nth-child(2) {
		top: 60%;
		right: 10%;
		animation-delay: 2s;
	}

	.floating-element:nth-child(3) {
		bottom: 20%;
		left: 50%;
		animation-delay: 4s;
	}

	@keyframes float {
		0%, 100% { transform: translateY(0) rotate(0deg); }
		50% { transform: translateY(-30px) rotate(10deg); }
	}

	/* Hero Content */
	.hero-content {
		position: relative;
		z-index: 2;
		padding: 80px 0;
	}

	.hero-title {
		font-size: clamp(36px, 8vw, 64px);
		font-weight: 900;
		color: white;
		margin-bottom: 24px;
		line-height: 1.1;
		letter-spacing: -1px;
	}

	.hero-title .gradient-text {
		background: linear-gradient(120deg, #fff 0%, var(--accent-color) 50%, var(--primary-color) 100%);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		display: inline-block;
		animation: gradient-animation 3s ease infinite;
	}

	@keyframes gradient-animation {
		0%, 100% { filter: hue-rotate(0deg); }
		50% { filter: hue-rotate(30deg); }
	}

	.hero-subtitle {
		font-size: clamp(18px, 3vw, 24px);
		color: rgba(255,255,255,0.8);
		margin-bottom: 40px;
		line-height: 1.6;
		font-weight: 300;
	}

	/* Hero Slider Mobile Optimized */
	.hero-slider {
		position: relative;
		width: 100%;
		max-width: 600px;
		margin: 0 auto;
	}

	.hero-swiper {
		width: 100%;
		padding: 20px 0 50px;
	}

	.hero-swiper .swiper-slide {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.battery-card {
		background: rgba(255,255,255,0.1);
		backdrop-filter: blur(10px);
		border: 1px solid rgba(255,255,255,0.2);
		border-radius: 24px;
		padding: 30px;
		text-align: center;
		transform: scale(0.9);
		transition: all 0.5s;
		box-shadow: 0 10px 40px rgba(0,0,0,0.3);
	}

	.hero-swiper .swiper-slide-active .battery-card {
		transform: scale(1);
		background: rgba(255,255,255,0.15);
		box-shadow: 0 20px 60px rgba(0,0,0,0.4);
	}

	.battery-card img {
		width: 100%;
		max-width: 300px;
		height: 250px;
		object-fit: contain;
		margin-bottom: 20px;
		filter: drop-shadow(0 10px 20px rgba(0,0,0,0.3));
		transition: all 0.5s;
	}

	.hero-swiper .swiper-slide-active .battery-card img {
		transform: scale(1.05);
		filter: drop-shadow(0 15px 30px rgba(0,0,0,0.4));
	}

	.battery-card h3 {
		color: white;
		font-size: 24px;
		margin-bottom: 10px;
		font-weight: 700;
	}

	.battery-card p {
		color: rgba(255,255,255,0.7);
		font-size: 16px;
		margin-bottom: 20px;
	}

	.battery-card .price {
		font-size: 32px;
		color: var(--accent-color);
		font-weight: 800;
		text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
	}

	/* Swiper Custom Pagination */
	.hero-swiper .swiper-pagination {
		bottom: 0;
	}

	.hero-swiper .swiper-pagination-bullet {
		width: 12px;
		height: 12px;
		background: rgba(255,255,255,0.5);
		opacity: 1;
		transition: all 0.3s;
	}

	.hero-swiper .swiper-pagination-bullet-active {
		width: 40px;
		border-radius: 6px;
		background: var(--gradient-primary);
	}

	/* CTA Buttons Enhanced */
	.hero-cta {
		display: flex;
		gap: 20px;
		flex-wrap: wrap;
		margin-top: 40px;
	}

	.btn-hero {
		padding: 16px 40px;
		font-size: 16px;
		font-weight: 600;
		border-radius: 50px;
		text-decoration: none;
		display: inline-flex;
		align-items: center;
		gap: 10px;
		transition: all 0.3s;
		position: relative;
		overflow: hidden;
	}

	.btn-hero-primary {
		background: var(--gradient-primary);
		color: white;
		box-shadow: 0 10px 30px rgba(231, 76, 60, 0.3);
	}

	.btn-hero-primary:hover {
		transform: translateY(-3px);
		box-shadow: 0 15px 40px rgba(231, 76, 60, 0.4);
		color: white;
	}

	.btn-hero-outline {
		background: transparent;
		color: white;
		border: 2px solid rgba(255,255,255,0.5);
		backdrop-filter: blur(10px);
	}

	.btn-hero-outline:hover {
		background: rgba(255,255,255,0.1);
		border-color: white;
		transform: translateY(-3px);
		color: white;
	}

	/* Modern Search Section */
	.search-section {
		margin-top: -60px;
		position: relative;
		z-index: 10;
		padding: 0 15px;
	}

	.search-card {
		background: var(--white);
		border-radius: 24px;
		padding: 40px;
		box-shadow: var(--shadow-xl);
		backdrop-filter: blur(10px);
		border: 1px solid rgba(0,0,0,0.05);
	}

	/* Product Cards Ultra Modern */
	.products-section {
		padding: 100px 0;
		background: var(--bg-light);
	}

	.product-card {
		background: var(--white);
		border-radius: 24px;
		padding: 24px;
		height: 100%;
		position: relative;
		overflow: hidden;
		box-shadow: var(--shadow-md);
		transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
		border: 1px solid rgba(0,0,0,0.05);
	}

	.product-card::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 4px;
		background: var(--gradient-primary);
		transform: scaleX(0);
		transition: transform 0.4s;
	}

	.product-card:hover {
		transform: translateY(-10px) scale(1.02);
		box-shadow: var(--shadow-xl);
	}

	.product-card:hover::before {
		transform: scaleX(1);
	}

	/* Product Badge Enhanced */
	.product-badge {
		position: absolute;
		top: 20px;
		right: 20px;
		padding: 8px 16px;
		border-radius: 50px;
		font-size: 12px;
		font-weight: 700;
		z-index: 2;
		text-transform: uppercase;
		letter-spacing: 0.5px;
		box-shadow: var(--shadow-sm);
	}

	.badge-new {
		background: var(--gradient-primary);
		color: white;
	}

	.badge-promo {
		background: linear-gradient(135deg, var(--success-color), #27ae60);
		color: white;
	}

	.badge-premium {
		background: linear-gradient(135deg, #ffd700, #ffed4e);
		color: var(--text-dark);
	}

	/* Product Images */
	.product-image img {
		width: 100%;
		height: 200px;
		object-fit: cover;
		border-radius: 12px;
		transition: all 0.3s;
	}

	.product-card:hover .product-image img {
		transform: scale(1.05);
	}

	/* Button Group */
	.btn-group {
		width: 100%;
		display: flex;
	}

	.btn-group .btn:first-child {
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
	}

	.btn-group .btn:last-child {
		border-top-left-radius: 0;
		border-bottom-left-radius: 0;
	}

	/* Floating Elements */
	.floating-battery {
		position: fixed;
		pointer-events: none;
		opacity: 0.05;
		z-index: 1;
	}

	.floating-battery:nth-child(1) {
		top: 10%;
		left: 5%;
		animation: float-1 20s infinite;
	}

	.floating-battery:nth-child(2) {
		top: 70%;
		right: 5%;
		animation: float-2 25s infinite;
	}

	@keyframes float-1 {
		0%, 100% { transform: translate(0, 0) rotate(0deg); }
		33% { transform: translate(100px, -100px) rotate(120deg); }
		66% { transform: translate(-100px, 100px) rotate(240deg); }
	}

	@keyframes float-2 {
		0%, 100% { transform: translate(0, 0) rotate(0deg); }
		33% { transform: translate(-150px, 100px) rotate(-120deg); }
		66% { transform: translate(150px, -100px) rotate(-240deg); }
	}

	/* Mobile Optimizations */
	@media (max-width: 768px) {
		.top-header {
			display: none;
		}

		.header-top {
			padding: 10px 0;
		}

		.logo-container {
			font-size: 18px;
		}

		.logo-container i {
			font-size: 28px;
		}

		.search-box {
			margin-top: 10px;
		}

		.navbar-nav {
			background: var(--white);
			margin: 10px -15px 0;
			border-radius: 0 0 12px 12px;
			box-shadow: 0 5px 20px rgba(0,0,0,0.1);
			padding: 10px 0;
		}

		[data-theme="dark"] .navbar-nav {
			background: var(--dark-card);
		}

		.navbar-nav .nav-link {
			padding: 15px 20px;
			border-radius: 8px;
			margin: 5px 10px;
			background: rgba(255,255,255,0.5);
			border: 1px solid transparent;
		}

		.navbar-nav .nav-link:hover {
			background: rgba(231, 76, 60, 0.1);
			border-color: rgba(231, 76, 60, 0.2);
		}

		[data-theme="dark"] .navbar-nav .nav-link {
			background: rgba(255,255,255,0.05);
			border-color: transparent;
		}

		[data-theme="dark"] .navbar-nav .nav-link:hover {
			background: rgba(231, 76, 60, 0.15);
			border-color: rgba(231, 76, 60, 0.3);
		}

		.navbar-nav .nav-link::before {
			display: none;
		}

		.navbar-nav .nav-link i {
			margin-right: 8px;
			font-size: 16px;
		}

		/* Toggle Button Mobile */
		.navbar-toggler {
			margin-right: 0;
			background: white;
			box-shadow: 0 4px 12px rgba(0,0,0,0.08);
			width: 44px;
			height: 44px;
		}

		[data-theme="dark"] .navbar-toggler {
			background: var(--dark-card);
			box-shadow: 0 4px 12px rgba(0,0,0,0.3);
		}

		.navbar-toggler[aria-expanded="true"] {
			transform: none;
		}

		/* Hero Mobile */
		.hero-section {
			min-height: calc(100vh - 150px);
			padding: 40px 0;
		}

		.hero-content {
			text-align: center;
			padding: 20px 0;
		}

		.hero-title {
			font-size: 36px;
			margin-bottom: 20px;
		}

		.hero-subtitle {
			font-size: 18px;
			margin-bottom: 30px;
		}

		.hero-cta {
			justify-content: center;
		}

		.btn-hero {
			padding: 14px 30px;
			font-size: 14px;
			width: 100%;
			justify-content: center;
			max-width: 250px;
		}

		/* Battery Card Mobile */
		.battery-card {
			padding: 20px;
		}

		.battery-card img {
			height: 200px;
		}

		.battery-card h3 {
			font-size: 20px;
		}

		.battery-card .price {
			font-size: 28px;
		}

		/* Search Section Mobile */
		.search-section {
			margin-top: -40px;
		}

		.search-card {
			padding: 20px;
			border-radius: 16px;
		}

		.search-card h3 {
			font-size: 20px;
			margin-bottom: 20px;
		}

		/* Product Grid Mobile */
		.products-section {
			padding: 60px 0;
		}

		.product-card {
			margin-bottom: 20px;
		}

		/* Floating Buttons Mobile */
		.whatsapp-float {
			bottom: 20px;
			left: 20px;
			width: 55px;
			height: 55px;
			font-size: 28px;
		}

		.back-to-top {
			bottom: 20px;
			right: 20px;
			width: 45px;
			height: 45px;
			font-size: 20px;
		}

		.chat-toggle {
			bottom: 75px;
			right: 20px;
			width: 55px;
			height: 55px;
		}

		.chat-widget {
			width: calc(100% - 20px);
			right: 10px;
			left: 10px;
			bottom: 140px;
			height: 400px;
		}

		/* Theme Toggle Mobile */
		.theme-toggle {
			bottom: 135px;
			right: 20px;
			width: 45px;
			height: 45px;
		}

		/* Quick Actions Mobile */
		.quick-actions {
			opacity: 1;
			transform: translateX(0);
			flex-direction: row;
			top: auto;
			bottom: 20px;
			left: 50%;
			transform: translateX(-50%);
		}

		.quick-action-btn {
			width: 35px;
			height: 35px;
		}
	}

	/* Advantage Cards */
	.advantages-section {
		background: var(--white);
	}

	[data-theme="dark"] .advantages-section {
		background: var(--dark-bg);
	}

	.advantage-card {
		background: var(--white);
		border-radius: 20px;
		box-shadow: var(--shadow-sm);
		transition: all 0.3s;
		border: 1px solid rgba(0,0,0,0.05);
	}

	[data-theme="dark"] .advantage-card {
		background: var(--dark-card);
		border-color: rgba(255,255,255,0.1);
	}

	[data-theme="dark"] .advantage-card h4 {
		color: var(--dark-text);
	}

	[data-theme="dark"] .advantage-card p {
		color: var(--text-light);
	}

	.advantage-card:hover {
		transform: translateY(-10px);
		box-shadow: var(--shadow-lg);
	}

	.advantage-card .icon-box {
		width: 80px;
		height: 80px;
		margin: 0 auto;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 50%;
		background: rgba(231, 76, 60, 0.1);
		transition: all 0.3s;
	}

	.advantage-card:hover .icon-box {
		transform: scale(1.1);
		background: rgba(231, 76, 60, 0.15);
	}

	/* Testimonials */
	.testimonials-section {
		background: var(--bg-light);
	}

	[data-theme="dark"] .testimonials-section {
		background: var(--dark-bg);
	}

	.testimonial-card {
		background: var(--white);
		border-radius: 20px;
		box-shadow: var(--shadow-md);
		min-height: 250px;
		transition: all 0.3s;
	}

	[data-theme="dark"] .testimonial-card {
		background: var(--dark-card);
		color: var(--dark-text);
	}

	.testimonial-card:hover {
		box-shadow: var(--shadow-lg);
	}

	[data-theme="dark"] .testimonial-card p {
		color: var(--dark-text);
	}

	[data-theme="dark"] .testimonial-card h6 {
		color: var(--dark-text);
	}

	[data-theme="dark"] .testimonial-card small {
		color: var(--text-light);
	}

	/* Partners */
	.partners-section {
		background: var(--white);
	}

	[data-theme="dark"] .partners-section {
		background: var(--dark-bg);
	}

	.partner-logo {
		max-height: 80px;
		width: auto;
		filter: grayscale(100%);
		opacity: 0.6;
		transition: all 0.3s;
	}

	[data-theme="dark"] .partner-logo {
		filter: grayscale(100%) brightness(0.8);
	}

	.partner-logo:hover {
		filter: grayscale(0%);
		opacity: 1;
		transform: scale(1.1);
	}

	[data-theme="dark"] .partner-logo:hover {
		filter: grayscale(0%) brightness(1.2);
	}

	/* Stats Section */
	.stats-section {
		background: var(--gradient-primary);
		color: white;
	}

	[data-theme="dark"] .stats-section {
		background: linear-gradient(135deg, #c0392b 0%, #e74c3c 100%);
	}

	.stat-card {
		background: rgba(255,255,255,0.1);
		backdrop-filter: blur(10px);
		border-radius: 20px;
		border: 1px solid rgba(255,255,255,0.2);
		transition: all 0.3s;
	}

	.stat-card:hover {
		transform: translateY(-10px);
		background: rgba(255,255,255,0.15);
	}

	.stat-card i {
		color: white;
		opacity: 0.8;
	}

	/* Newsletter */
	.newsletter-section {
		background: var(--bg-light);
	}

	[data-theme="dark"] .newsletter-section {
		background: var(--dark-bg);
	}

	.newsletter-box {
		background: var(--gradient-primary);
		padding: 60px 40px;
		border-radius: 30px;
		color: white;
		box-shadow: var(--shadow-lg);
	}

	[data-theme="dark"] .newsletter-box {
		background: linear-gradient(135deg, #c0392b 0%, #e74c3c 100%);
	}

	.newsletter-form input {
		border: none;
		border-radius: 50px;
		padding: 15px 25px;
	}

	.newsletter-form button {
		border-radius: 50px;
		white-space: nowrap;
	}

	/* Footer */
	.footer-section {
		background: var(--secondary-color);
		color: white;
	}

	[data-theme="dark"] .footer-section {
		background: #0d0d0d;
		border-top: 1px solid rgba(255,255,255,0.1);
	}

	.footer-links li {
		margin-bottom: 10px;
	}

	.footer-links a {
		color: rgba(255,255,255,0.7);
		text-decoration: none;
		transition: all 0.3s;
	}

	.footer-links a:hover {
		color: white;
		transform: translateX(5px);
		display: inline-block;
	}

	.contact-info li {
		margin-bottom: 10px;
		color: rgba(255,255,255,0.8);
	}

	.social-link {
		width: 40px;
		height: 40px;
		background: rgba(255,255,255,0.1);
		border-radius: 50%;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		color: white;
		text-decoration: none;
		transition: all 0.3s;
	}

	.social-link:hover {
		background: var(--primary-color);
		transform: translateY(-3px);
		color: white;
	}

	/* Floating Buttons */
	.whatsapp-float {
		position: fixed;
		bottom: 30px;
		left: 30px;
		width: 60px;
		height: 60px;
		background: #25d366;
		color: white;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 30px;
		box-shadow: 0 5px 20px rgba(37, 211, 102, 0.4);
		text-decoration: none;
		transition: all 0.3s;
		z-index: 996;
	}

	.whatsapp-float:hover {
		transform: scale(1.1);
		color: white;
		box-shadow: 0 10px 30px rgba(37, 211, 102, 0.5);
	}

	.back-to-top {
		position: fixed;
		bottom: 85px;
		right: 25px;
		width: 45px;
		height: 45px;
		background: var(--gradient-primary);
		color: white;
		border-radius: 50%;
		display: none;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		box-shadow: 0 5px 15px rgba(231, 76, 60, 0.3);
		transition: all 0.3s;
		z-index: 995;
	}

	.back-to-top:hover {
		transform: scale(1.1);
		box-shadow: 0 8px 25px rgba(231, 76, 60, 0.4);
	}

	/* Chat Widget */
	.chat-widget {
		position: fixed;
		bottom: 200px;
		right: 30px;
		width: 350px;
		background: var(--white);
		border-radius: 20px;
		box-shadow: var(--shadow-xl);
		display: none;
		flex-direction: column;
		z-index: 1000;
		overflow: hidden;
	}

	[data-theme="dark"] .chat-widget {
		background: var(--dark-card);
	}

	.chat-header {
		background: var(--gradient-primary);
		color: white;
		padding: 20px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.chat-body {
		padding: 20px;
		height: 300px;
		overflow-y: auto;
		background: var(--white);
	}

	[data-theme="dark"] .chat-body {
		background: var(--dark-card);
		color: var(--dark-text);
	}

	.chat-footer {
		padding: 15px;
		border-top: 1px solid #eee;
		display: flex;
		gap: 10px;
		background: var(--white);
	}

	[data-theme="dark"] .chat-footer {
		background: var(--dark-card);
		border-top-color: rgba(255,255,255,0.1);
	}

	.chat-toggle {
		position: fixed;
		bottom: 140px;
		right: 20px;
		width: 60px;
		height: 60px;
		background: var(--gradient-primary);
		color: white;
		border-radius: 50%;
		border: none;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 26px;
		box-shadow: 0 5px 20px rgba(231, 76, 60, 0.4);
		cursor: pointer;
		transition: all 0.3s;
		z-index: 994;
	}

	.chat-toggle:hover {
		transform: scale(1.1);
		box-shadow: 0 8px 30px rgba(231, 76, 60, 0.5);
	}

	/* Dark Mode Styles */
	[data-theme="dark"] .search-card,
	[data-theme="dark"] .product-card,
	[data-theme="dark"] .advantage-card,
	[data-theme="dark"] .testimonial-card {
		background: var(--dark-card);
		border-color: rgba(255,255,255,0.1);
	}

	[data-theme="dark"] h1,
	[data-theme="dark"] h2,
	[data-theme="dark"] h3,
	[data-theme="dark"] h4,
	[data-theme="dark"] h5,
	[data-theme="dark"] h6 {
		color: var(--dark-text);
	}

	[data-theme="dark"] .text-dark {
		color: var(--dark-text) !important;
	}

	[data-theme="dark"] .bg-light {
		background-color: var(--dark-bg) !important;
	}

	[data-theme="dark"] .text-muted {
		color: var(--text-light) !important;
	}

	[data-theme="dark"] .navbar-nav {
		background: var(--dark-card);
	}

	[data-theme="dark"] .form-control,
	[data-theme="dark"] .form-select {
		background: var(--dark-card);
		border-color: rgba(255,255,255,0.1);
		color: var(--dark-text);
	}

	[data-theme="dark"] .form-control:focus,
	[data-theme="dark"] .form-select:focus {
		background: var(--dark-card);
		border-color: var(--primary-color);
		color: var(--dark-text);
	}

	[data-theme="dark"] .chat-widget {
		background: var(--dark-card);
	}

	[data-theme="dark"] .chat-body,
	[data-theme="dark"] .chat-footer {
		background: var(--dark-card);
		border-color: rgba(255,255,255,0.1);
	}

	/* Smooth Animations */
	@keyframes fadeInUp {
		from {
			opacity: 0;
			transform: translateY(30px);
		}
		to {
			opacity: 1;
			transform: translateY(0);
		}
	}

	@keyframes pulse {
		0%, 100% {
			transform: scale(1);
			box-shadow: 0 0 0 0 rgba(231, 76, 60, 0.4);
		}
		50% {
			transform: scale(1.05);
			box-shadow: 0 0 0 10px rgba(231, 76, 60, 0);
		}
	}

	@media (min-width: 992px) {
		.navbar-nav {
			background: transparent !important;
			margin: 0 !important;
			border: none !important;
			box-shadow: none !important;
			padding: 0 !important;
		}

		.navbar-nav .nav-link {
			background: transparent !important;
			border: none !important;
			margin: 0 !important;
		}

		.navbar-nav .nav-link::before {
			display: block !important;
		}
	}

	/* Performance Optimizations */
	.product-card img,
	.battery-card img {
		will-change: transform;
	}

	/* Smooth Scrolling */
	html {
		scroll-behavior: smooth;
	}

	/* Focus States */
	button:focus,
	a:focus,
	input:focus,
	select:focus {
		outline: 2px solid var(--primary-color);
		outline-offset: 2px;
	}

	/* Loading Animation */
	.skeleton-loader {
		background: linear-gradient(90deg, var(--bg-light) 25%, rgba(0,0,0,0.05) 50%, var(--bg-light) 75%);
		background-size: 200% 100%;
		animation: loading 1.5s infinite;
	}

	[data-theme="dark"] .skeleton-loader {
		background: linear-gradient(90deg, var(--dark-card) 25%, rgba(255,255,255,0.05) 50%, var(--dark-card) 75%);
		background-size: 200% 100%;
	}

	@keyframes loading {
		0% { background-position: 200% 0; }
		100% { background-position: -200% 0; }
	}