:root {
			--blue: #0d6efd;
			--blue-dark: #0b5ed7;
			--blue-light: #eff6ff;
			--dark: #1a1a2e;
			--mid: #5a6172;
			--light-bg: #f4f6fb;
			--white: #ffffff;
			--border: #e2e8f0;
			--success: #16a34a;
			--shadow-sm: 0 2px 8px rgba(0,0,0,0.06);
			--shadow-md: 0 8px 28px rgba(0,0,0,0.09);
			--radius: 16px;
			--radius-sm: 10px;
		}

		body {
			font-family: 'DM Sans', sans-serif;
			background: var(--light-bg);
			color: var(--dark);
		}

		h1,h2,h3,h4,h5,h6 {
			font-family: 'Plus Jakarta Sans', sans-serif;
			font-weight: 700;
		}

		/* ===== HERO BANNER ===== */
		.hero-banner {
			background: linear-gradient(135deg, #1a1a2e 0%, #16213e 55%, #0f3460 100%);
			padding: 60px 0 52px;
			position: relative;
			overflow: hidden;
		}

		.hero-banner::before {
			content: '';
			position: absolute;
			top: -80px; right: -80px;
			width: 360px; height: 360px;
			background: radial-gradient(circle, rgba(13,110,253,0.18) 0%, transparent 70%);
			border-radius: 50%;
			pointer-events: none;
		}

		.hero-banner::after {
			content: '';
			position: absolute;
			bottom: -40px; left: 5%;
			width: 200px; height: 200px;
			background: radial-gradient(circle, rgba(13,110,253,0.10) 0%, transparent 70%);
			border-radius: 50%;
			pointer-events: none;
		}

		.videoText {
			font-size: 16px;
			color: rgba(255,255,255,0.75);
			margin: 0 0 10px;
			display: block;
			line-height: 1.6;
			font-weight: 300;
		}

		.hero-title {
			font-size: 28px;
			font-weight: 800;
			color: #fff;
			line-height: 1.3;
			margin-bottom: 0;
		}

		.hero-title span { color: #60a5fa; }

		/* ===== PAGE LAYOUT ===== */
		.page-section { padding: 40px 0; }

		/* ===== PURCHASE CARD ===== */
		.purchase-card {
			background: var(--white);
			border-radius: var(--radius);
			border: 2px solid var(--border);
			padding: 26px 22px;
			box-shadow: var(--shadow-md);
			position: sticky;
			top: 20px;
		}

		.purchase-card .card-title {
			font-size: 15px;
			font-weight: 700;
			color: var(--dark);
			text-align: center;
			margin-bottom: 18px;
			font-family: 'Plus Jakarta Sans', sans-serif;
			padding-bottom: 14px;
			border-bottom: 2px solid var(--border);
		}

		.price-display {
			text-align: center;
			background: var(--blue-light);
			border-radius: var(--radius-sm);
			padding: 18px 12px 14px;
			margin-bottom: 20px;
			border: 1px solid #bfdbfe;
		}

		.price-display .price-amount {
			font-size: 38px;
			font-weight: 800;
			color: var(--blue);
			font-family: 'Plus Jakarta Sans', sans-serif;
			line-height: 1;
		}

		.price-display .price-label {
			font-size: 12px;
			color: var(--mid);
			margin-top: 5px;
			font-weight: 500;
			text-transform: uppercase;
			letter-spacing: 0.5px;
		}

		.btn-buy {
			background: linear-gradient(135deg, #0d6efd 0%, #0b5ed7 100%);
			color: #fff !important;
			border: none;
			border-radius: var(--radius-sm);
			padding: 14px 28px;
			font-size: 15px;
			font-weight: 700;
			font-family: 'Plus Jakarta Sans', sans-serif;
			box-shadow: 0 4px 16px rgba(13,110,253,0.35);
			transition: all 0.3s ease;
			width: 100%;
			cursor: pointer;
			display: block;
			text-align: center;
		}

		.btn-buy:hover {
			transform: translateY(-2px);
			box-shadow: 0 8px 24px rgba(13,110,253,0.48);
		}

		/* ===== COUPON SECTION ===== */
		.coupon-section {
			margin-top: 20px;
			padding-top: 18px;
			border-top: 1px dashed var(--border);
		}

		.coupon-toggle-label {
			display: flex;
			align-items: center;
			gap: 9px;
			font-size: 13px;
			font-weight: 500;
			color: var(--mid);
			cursor: pointer;
			user-select: none;
		}

		.coupon-toggle-label input[type="checkbox"] {
			width: 16px; height: 16px;
			accent-color: var(--blue);
			cursor: pointer;
			flex-shrink: 0;
		}

		#inputContainer {
			margin-top: 12px;
			background: var(--light-bg);
			border-radius: var(--radius-sm);
			padding: 14px;
			border: 1px solid var(--border);
		}

		#inputContainer label {
			font-size: 11px;
			font-weight: 600;
			color: var(--mid);
			text-transform: uppercase;
			letter-spacing: 0.6px;
			margin-bottom: 7px;
			display: block;
		}

		#inputContainer input[type="text"] {
			width: 100%;
			border: 2px solid var(--border);
			border-radius: var(--radius-sm);
			padding: 10px 14px;
			font-size: 14px;
			font-family: 'DM Sans', sans-serif;
			background: var(--white);
			color: var(--dark);
			outline: none;
			transition: border-color 0.2s;
			box-sizing: border-box;
		}

		#inputContainer input[type="text"]:focus {
			border-color: var(--blue);
			box-shadow: 0 0 0 3px rgba(13,110,253,0.10);
		}

		.btn-coupon-submit {
			background: linear-gradient(135deg, #16a34a, #15803d);
			color: #fff !important;
			border: none;
			border-radius: var(--radius-sm);
			padding: 10px 20px;
			font-size: 13px;
			font-weight: 600;
			font-family: 'Plus Jakarta Sans', sans-serif;
			box-shadow: 0 3px 10px rgba(22,163,74,0.28);
			transition: all 0.3s ease;
			display: block;
			width: 100%;
			margin-top: 10px;
			cursor: pointer;
		}

		.btn-coupon-submit:hover {
			transform: translateY(-1px);
			box-shadow: 0 6px 16px rgba(22,163,74,0.40);
		}

		/* ===== CONTENT CARD ===== */
		.content-card {
			background: var(--white);
			border-radius: var(--radius);
			box-shadow: var(--shadow-md);
			padding: 36px 32px;
			margin-bottom: 24px;
		}

		.section-heading {
			font-size: 24px;
			font-weight: 800;
			color: var(--dark);
			margin-bottom: 24px;
			display: flex;
			align-items: center;
			gap: 12px;
		}

		.section-heading::before {
			content: '';
			display: inline-block;
			width: 5px; height: 26px;
			background: var(--blue);
			border-radius: 4px;
			flex-shrink: 0;
		}

		/* ===== CONTACT ITEMS ===== */
		.contact-item {
			display: flex;
			align-items: flex-start;
			gap: 16px;
			padding: 18px;
			background: var(--light-bg);
			border-radius: var(--radius-sm);
			border: 1px solid var(--border);
			margin-bottom: 14px;
			transition: all 0.3s ease;
		}

		.contact-item:hover {
			box-shadow: var(--shadow-sm);
			border-color: var(--blue);
		}

		.contact-icon {
			width: 46px; height: 46px;
			background: var(--blue);
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			color: #fff;
			font-size: 17px;
			flex-shrink: 0;
		}

		.contact-item h5 {
			font-size: 16px;
			font-weight: 700;
			margin-bottom: 4px;
			color: var(--dark);
		}

		.contact-item p {
			font-size: 14px;
			color: var(--mid);
			margin: 0;
		}

		.contact-item .phone-num {
			font-size: 17px;
			font-weight: 700;
			color: var(--blue);
			font-family: 'Plus Jakarta Sans', sans-serif;
		}

		.chat-btn {
			display: inline-block;
			margin-top: 10px;
			background: #25D366;
			color: #fff !important;
			padding: 8px 18px;
			border-radius: 20px;
			font-size: 13px;
			font-weight: 600;
			text-decoration: none !important;
			transition: all 0.3s ease;
		}

		.chat-btn:hover {
			background: #1ebe57;
			transform: translateY(-1px);
		}

		/* ===== CONTACT FORM ===== */
		.contact-form-wrap {
			background: var(--light-bg);
			border-radius: var(--radius);
			padding: 28px 24px;
			border: 1px solid var(--border);
			height: 100%;
		}

		.contact-form-wrap h3 {
			font-size: 20px;
			margin-bottom: 20px;
			color: var(--dark);
		}

		.contact-form-wrap .form-control {
			background: var(--white);
			border: 2px solid var(--border);
			border-radius: var(--radius-sm) !important;
			padding: 12px 16px;
			font-size: 14px;
			font-family: 'DM Sans', sans-serif;
			height: auto;
			transition: border-color 0.2s;
			width: 100%;
			display: block;
			box-sizing: border-box;
			color: var(--dark);
			margin-bottom: 14px;
		}

		.contact-form-wrap .form-control:focus {
			border-color: var(--blue);
			outline: none;
			box-shadow: 0 0 0 3px rgba(13,110,253,0.10);
		}

		.btn-callback {
			background: linear-gradient(135deg, #0d6efd, #0b5ed7);
			color: #fff !important;
			border: none;
			border-radius: var(--radius-sm);
			padding: 12px 28px;
			font-size: 15px;
			font-weight: 700;
			font-family: 'Plus Jakarta Sans', sans-serif;
			box-shadow: 0 4px 16px rgba(13,110,253,0.30);
			transition: all 0.3s ease;
			cursor: pointer;
		}

		.btn-callback:hover {
			transform: translateY(-2px);
			box-shadow: 0 8px 24px rgba(13,110,253,0.45);
		}

		/* ===== RESPONSIVE ===== */
		@media (max-width: 991px) {
			.purchase-card { position: static; margin-top: 28px; }
			.hero-title { font-size: 22px; }
			.content-card { padding: 24px 18px; }
		}

		@media (max-width: 768px) {
			.hero-banner { padding: 40px 0 32px; }
		}