body.page-template-page-demo-showcase header .header_wrapper {
   	border-bottom: 0;
   }

   body.page-template-page-demo-showcase header.sticky_header {
   	position: relative;
   }

   .demo_showcase_banner_wrapper {
   	/*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
   	padding: 150px 0 60px 0;
   	position: relative;
   	overflow: hidden;
   }

   .demo_showcase_banner_wrapper .shape1 {
   	border-radius: 465px;
   	opacity: .8;
   	background: #f9dbb9;
   	filter: blur(100px);
   	width: 269px;
   	height: 465px;
   	flex-shrink: 0;
   	position: absolute;
   	left: -220px;
   	top: 100px;
   }

   .demo_showcase_banner_wrapper .banner_title h1 {
   	color: #141126;
   	font-size: 3rem;
   	font-weight: 700;
   	margin-bottom: 20px;
   	text-align: center;
   }

   .demo_showcase_banner_wrapper .banner_title p {
   	/*color: rgba(255, 255, 255, 0.9);*/
   	font-size: 1.2rem;
   	text-align: center;
   	max-width: 800px;
   	margin: 0 auto;
   	line-height: 1.6;
   }

   .demo_showcase_banner_wrapper .security_btn {
   	display: flex;
   	flex-wrap: wrap;
   	justify-content: center;
   	align-items: center;
   	gap: 24px;
   	margin: 45px 0 0 0;
   }

   .demo_showcase_banner_wrapper .security_btn .see_btn a {
   	margin: 0;
   	min-width: 247px;
   	height: 50px;
   	color: #f161a1;
   	font-size: 14px;
   	font-weight: 600;
   	text-transform: capitalize;
   	border: 1px solid #f161a1;
   	display: inline-flex;
   	border-radius: 10px;
   	text-align: center;
   	align-items: center;
   	justify-content: center;
   }

   .demo_showcase_banner_wrapper .security_btn .see_btn span {
   	padding-left: 10px;
   }

   .demo_banner_shape {
   	position: absolute;
   	top: 0;
   	left: 0;
   	z-index: 0;
   }

   .demo_showcase_wrapper {
   	padding: 60px 0;
   	background: #f8f9ff;
   }

   .demo_card {
   	background: #fff;
   	border-radius: 20px;
   	padding: 40px 30px;
   	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
   	position: relative;
   	height: 100%;
   	transition: transform 0.3s ease, box-shadow 0.3s ease;
   }

   .demo_card:hover {
   	transform: translateY(-10px);
   	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.15);
   }

   .demo_badge {
   	position: absolute;
   	top: -15px;
   	right: 30px;
   	z-index: 2;
   }

   .badge {
   	background: #82b440;
   	color: #fff;
   	padding: 8px 16px;
   	border-radius: 25px;
   	font-size: 0.9rem;
   	font-weight: 600;
   	display: flex;
   	align-items: center;
   	gap: 6px;
   }

   .badge.premium_badge {
   	background: #f161a1;
   }

   .demo_icon {
   	text-align: center;
   	margin-bottom: 30px;
   }

   .demo_icon img {
   	width: 80px;
   	height: 80px;
   	object-fit: contain;
   }

   .demo_content h3 {
   	font-size: 1.8rem;
   	font-weight: 700;
   	color: #2c3e50;
   	margin-bottom: 15px;
   	text-align: center;
   }

   .demo_content p {
   	color: #64748b;
   	line-height: 1.6;
   	margin-bottom: 30px;
   	text-align: center;
   }

   .demo_features {
   	display: flex;
   	justify-content: space-between;
   }

   .demo_features ul {
   	list-style: none;
   	padding: 0;
   	margin-bottom: 30px;
   }

   .demo_features li {
   	color: #475569;
   	margin-bottom: 10px;
   	font-size: 0.95rem;
   }

   /* New Attractive Live Demos Section */
   .live_demos_section {
   	margin-top: 80px;
   	padding: 80px 40px;
   	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
   	border-radius: 30px;
   	position: relative;
   	overflow: hidden;
   }

   .live_demos_section::before {
   	content: '';
   	position: absolute;
   	top: -50%;
   	left: -50%;
   	width: 200%;
   	height: 200%;
   	background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
   	animation: float 6s ease-in-out infinite;
   }

   @keyframes float {

   	0%,
   	100% {
   		transform: translateY(0px) rotate(0deg);
   	}

   	50% {
   		transform: translateY(-20px) rotate(5deg);
   	}
   }

   .live_demos_title {
   	text-align: center;
   	margin-bottom: 60px;
   	position: relative;
   	z-index: 2;
   }

   .live_demos_title h2 {
   	font-size: 3rem;
   	font-weight: 800;
   	color: #fff;
   	margin-bottom: 15px;
   	text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
   }

   .live_demos_title p {
   	color: rgba(255, 255, 255, 0.9);
   	font-size: 1.3rem;
   	font-weight: 300;
   }

   .demo_cards_container {
   	display: flex;
   	gap: 40px;
   	justify-content: center;
   	align-items: stretch;
   	position: relative;
   	z-index: 2;
   }

   .demo_card_wrapper {
   	flex: 1;
   	max-width: 450px;
   }

   .attractive_demo_card {
   	background: rgba(255, 255, 255, 0.95);
   	backdrop-filter: blur(20px);
   	border-radius: 25px;
   	padding: 30px;
   	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
   	transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
   	border: 2px solid rgba(255, 255, 255, 0.3);
   	position: relative;
   	overflow: hidden;
   }

   .attractive_demo_card::before {
   	content: '';
   	position: absolute;
   	top: 0;
   	left: 0;
   	right: 0;
   	height: 4px;
   	background: linear-gradient(90deg, #82b440 0%, #a8d650 100%);
   	border-radius: 25px 25px 0 0;
   }

   .premium_card::before {
   	background: linear-gradient(90deg, #f161a1 0%, #ff6bbf 100%);
   }

   .attractive_demo_card:hover {
   	transform: translateY(-10px) scale(1.02);
   	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.3);
   }

   .demo_card_header {
   	text-align: center;
   	margin-bottom: 30px;
   }

   .demo_version_badge {
   	display: inline-flex;
   	align-items: center;
   	gap: 8px;
   	padding: 8px 16px;
   	border-radius: 50px;
   	font-weight: 600;
   	margin-bottom: 20px;
   	font-size: 0.9rem;
   }

   .themeforest_version {
   	background: linear-gradient(135deg, #82b440 0%, #a8d650 100%);
   	color: #fff;
   }

   .premium_version {
   	background: linear-gradient(135deg, #f161a1 0%, #ff6bbf 100%);
   	color: #fff;
   }

   .demo_card_title h3 {
   	font-size: 1.8rem;
   	font-weight: 700;
   	color: #2c3e50;
   	margin-bottom: 8px;
   }

   .demo_card_title p {
   	color: #64748b;
   	font-size: 1rem;
   	margin: 0;
   }

   .demo_card_visual {
   	margin-bottom: 30px;
   }

   .demo_screen {
   	background: #f8fafc;
   	border-radius: 15px;
   	overflow: hidden;
   	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
   }

   .screen_header {
   	background: #e2e8f0;
   	padding: 12px 16px;
   	display: flex;
   	align-items: center;
   	gap: 12px;
   	border-bottom: 1px solid #cbd5e1;
   }

   .screen_dots {
   	display: flex;
   	gap: 6px;
   }

   .screen_dots .dot {
   	width: 12px;
   	height: 12px;
   	border-radius: 50%;
   }

   .dot.red {
   	background: #ef4444;
   }

   .dot.yellow {
   	background: #f59e0b;
   }

   .dot.green {
   	background: #10b981;
   }

   .screen_url {
   	font-size: 0.8rem;
   	color: #64748b;
   	background: #fff;
   	padding: 4px 12px;
   	border-radius: 6px;
   	flex: 1;
   }

   .screen_content {
   	padding: 20px;
   }

   .demo_feature_list {
   	display: flex;
   	flex-direction: column;
   	gap: 12px;
   }

   .feature_row {
   	display: flex;
   	align-items: center;
   	gap: 12px;
   	padding: 8px 0;
   	font-weight: 500;
   	color: #475569;
   }

   .feature_icon {
   	font-size: 1.2rem;
   }

   .demo_card_action {
   	text-align: center;
   }

   .demo_launch_btn {
   	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
   	color: #fff;
   	padding: 16px 32px;
   	border-radius: 50px;
   	text-decoration: none;
   	font-weight: 700;
   	font-size: 1.1rem;
   	display: inline-flex;
   	align-items: center;
   	gap: 10px;
   	transition: all 0.3s ease;
   	border: none;
   	box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4);
   }

   .themeforest_btn {
   	background: linear-gradient(135deg, #82b440 0%, #a8d650 100%);
   	box-shadow: 0 6px 20px rgba(130, 180, 64, 0.4);
   }

   .premium_btn {
   	background: linear-gradient(135deg, #f161a1 0%, #ff6bbf 100%);
   	box-shadow: 0 6px 20px rgba(241, 97, 161, 0.4);
   }

   .demo_launch_btn:hover {
   	transform: translateY(-3px);
   	box-shadow: 0 10px 30px rgba(102, 126, 234, 0.6);
   	color: #fff;
   }

   .themeforest_btn:hover {
   	box-shadow: 0 10px 30px rgba(130, 180, 64, 0.6);
   }

   .premium_btn:hover {
   	box-shadow: 0 10px 30px rgba(241, 97, 161, 0.6);
   }

   .demo_cta_section {
   	margin-top: 50px;
   	text-align: center;
   	position: relative;
   	z-index: 2;
   }

   .demo_note {
   	background: rgba(255, 255, 255, 0.15);
   	backdrop-filter: blur(10px);
   	border: 1px solid rgba(255, 255, 255, 0.2);
   	border-radius: 15px;
   	padding: 15px 25px;
   	display: inline-flex;
   	align-items: center;
   	gap: 10px;
   	color: rgba(255, 255, 255, 0.9);
   	font-weight: 500;
   }

   .note_icon {
   	font-size: 1.2rem;
   }

   /* Demo Icon Placeholder Styles */
   .demo_icon_placeholder {
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	width: 80px;
   	height: 80px;
   	margin: 0 auto;
   }

   /* Interactive Demos Section Styles */
   .interactive_demos_section {
   	margin-top: 80px;
   	padding: 60px;
   	background: #fff;
   	border-radius: 20px;
   	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);
   }

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

   .demos_title h2 {
   	font-size: 2.2rem;
   	font-weight: 700;
   	color: #2c3e50;
   	margin-bottom: 15px;
   }

   .demos_title p {
   	color: #64748b;
   	font-size: 1.1rem;
   }

   .demo_feature_card {
   	background: #fff;
   	border: 2px solid #f1f5f9;
   	border-radius: 16px;
   	padding: 30px 20px;
   	text-align: center;
   	transition: all 0.3s ease;
   	height: 100%;
   }

   .demo_feature_card:hover {
   	border-color: #667eea;
   	transform: translateY(-5px);
   	box-shadow: 0 15px 40px rgba(102, 126, 234, 0.1);
   }

   .demo_feature_card .demo_icon {
   	margin-bottom: 20px;
   }

   .demo_feature_card h4 {
   	font-size: 1.3rem;
   	font-weight: 600;
   	color: #2c3e50;
   	margin-bottom: 10px;
   }

   .demo_feature_card p {
   	color: #64748b;
   	font-size: 0.95rem;
   	margin-bottom: 20px;
   	line-height: 1.5;
   }

   .demo_link {
   	color: #667eea;
   	font-weight: 600;
   	text-decoration: none;
   	font-size: 0.9rem;
   	transition: color 0.3s ease;
   }

   .demo_link:hover {
   	color: #5a6fd8;
   }

   /* Documentation Section Styles */
   .documentation_section {
   	margin-top: 60px;
   	padding: 60px;
   	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
   	border-radius: 20px;
   	color: #fff;
   }

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

   .documentation_title h2 {
   	font-size: 2.2rem;
   	font-weight: 700;
   	color: #fff;
   	margin-bottom: 15px;
   }

   .documentation_title p {
   	color: rgba(255, 255, 255, 0.9);
   	font-size: 1.1rem;
   }

   .documentation_grid {
   	margin-bottom: 40px;
   }

   .doc_card {
   	background: rgba(255, 255, 255, 0.1);
   	backdrop-filter: blur(10px);
   	border: 1px solid rgba(255, 255, 255, 0.2);
   	border-radius: 16px;
   	padding: 30px 20px;
   	text-align: center;
   	transition: all 0.3s ease;
   	height: 100%;
   }

   .doc_card:hover {
   	background: rgba(255, 255, 255, 0.15);
   	transform: translateY(-5px);
   }

   .doc_card .doc_icon {
   	margin-bottom: 20px;
   }

   .doc_card h5 {
   	font-size: 1.2rem;
   	font-weight: 600;
   	color: #fff;
   	margin-bottom: 10px;
   }

   .doc_card p {
   	color: rgba(255, 255, 255, 0.8);
   	font-size: 0.9rem;
   	margin-bottom: 20px;
   	line-height: 1.5;
   }

   .doc_link {
   	color: #fff;
   	font-weight: 600;
   	text-decoration: none;
   	font-size: 0.9rem;
   	opacity: 0.9;
   	transition: opacity 0.3s ease;
   }

   .doc_link:hover {
   	opacity: 1;
   	color: #fff;
   }

   /* Documentation Resources */
   .documentation_resources {
   	margin-top: 40px;
   }

   .resource_card {
   	background: rgba(255, 255, 255, 0.15);
   	backdrop-filter: blur(10px);
   	border: 1px solid rgba(255, 255, 255, 0.2);
   	border-radius: 16px;
   	padding: 25px;
   	transition: all 0.3s ease;
   	height: 100%;
   }

   .resource_card:hover {
   	background: rgba(255, 255, 255, 0.2);
   	transform: translateY(-3px);
   }

   .resource_header {
   	display: flex;
   	align-items: center;
   	gap: 15px;
   	margin-bottom: 20px;
   }

   .resource_icon {
   	background: rgba(241, 97, 161, 0.2);
   	border-radius: 12px;
   	padding: 10px;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   }

   .video_resource .resource_icon {
   	background: rgba(102, 126, 234, 0.2);
   }

   .resource_content h5 {
   	font-size: 1.1rem;
   	font-weight: 600;
   	color: #fff;
   	margin-bottom: 5px;
   }

   .resource_content p {
   	color: rgba(255, 255, 255, 0.8);
   	font-size: 0.9rem;
   	line-height: 1.4;
   	margin: 0;
   }

   .resource_btn {
   	background: rgba(255, 255, 255, 0.2);
   	color: #fff;
   	border: 1px solid rgba(255, 255, 255, 0.3);
   	padding: 10px 20px;
   	border-radius: 8px;
   	text-decoration: none;
   	font-weight: 600;
   	font-size: 0.9rem;
   	transition: all 0.3s ease;
   	display: inline-block;
   }

   .resource_btn:hover {
   	background: rgba(255, 255, 255, 0.3);
   	color: #fff;
   	transform: translateY(-1px);
   }

   .demo_buttons {
   	display: flex;
   	flex-direction: column;
   	gap: 12px;
   }

   .demo_btn {
   	padding: 12px 24px;
   	border-radius: 8px;
   	font-weight: 600;
   	text-decoration: none;
   	text-align: center;
   	transition: all 0.3s ease;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	gap: 8px;
   }

   .primary_btn {
   	background: #667eea;
   	color: #fff;
   	border: 2px solid #667eea;
   }

   .primary_btn:hover {
   	background: #5a6fd8;
   	color: #fff;
   	transform: translateY(-2px);
   }

   .premium_primary {
   	background: #f161a1;
   	border-color: #f161a1;
   }

   .premium_primary:hover {
   	background: #e04d8f;
   }

   .secondary_btn {
   	background: transparent;
   	color: #667eea;
   	border: 2px solid #667eea;
   }

   .secondary_btn:hover {
   	background: #667eea;
   	color: #fff;
   }

   .premium_secondary {
   	color: #f161a1;
   	border-color: #f161a1;
   }

   .premium_secondary:hover {
   	background: #f161a1;
   	color: #fff;
   }

   /* What Makes Woffice Special Section Styles */
   .enough_w_wrapper {
   	position: relative;
   	padding: 90px 0 45px;
   }

   .enough_container {
   	max-width: 1170px;
   	margin: 0 auto;
   }

   .enough_container .title {
   	max-width: 873px;
   	margin: 0 auto 50px;
   }

   .enough_container .title h2 {
   	color: #141126;
   	text-align: center;
   	font-size: 45px;
   	font-weight: 700;
   	line-height: 60px;
   	text-transform: capitalize;
   	margin-bottom: 40px;
   }

   /* Interactive Stats */
   .interactive-stats {
   	display: flex;
   	justify-content: center;
   	gap: 60px;
   	margin-bottom: 50px;
   	padding: 30px;
   	background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
   	border-radius: 20px;
   	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
   }

   .stat-item {
   	text-align: center;
   	animation: fadeInUp 0.6s ease forwards;
   }

   .stat-number {
   	font-size: 2.5rem;
   	font-weight: 800;
   	color: #667eea;
   	line-height: 1;
   	margin-bottom: 8px;
   	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
   	-webkit-background-clip: text;
   	-webkit-text-fill-color: transparent;
   	background-clip: text;
   }

   .stat-label {
   	font-size: 0.9rem;
   	font-weight: 600;
   	color: #64748b;
   	text-transform: uppercase;
   	letter-spacing: 1px;
   }

   /* Filter Buttons */
   .demo-filters {
   	display: flex;
   	justify-content: center;
   	gap: 15px;
   	margin-bottom: 50px;
   	flex-wrap: wrap;
   }

   .filter-btn {
   	background: transparent;
   	border: 2px solid #e2e8f0;
   	color: #64748b;
   	padding: 12px 24px;
   	border-radius: 50px;
   	font-weight: 600;
   	font-size: 0.9rem;
   	cursor: pointer;
   	transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
   	position: relative;
   	overflow: hidden;
   }

   .filter-btn::before {
   	content: '';
   	position: absolute;
   	top: 0;
   	left: -100%;
   	width: 100%;
   	height: 100%;
   	background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
   	transition: left 0.3s ease;
   	z-index: -1;
   }

   .filter-btn:hover::before,
   .filter-btn.active::before {
   	left: 0;
   }

   .filter-btn:hover,
   .filter-btn.active {
   	color: #fff;
   	border-color: #667eea;
   	transform: translateY(-2px);
   	box-shadow: 0 10px 25px rgba(102, 126, 234, 0.3);
   }

   /* Interactive Demo Items */
   .demo-item-wrapper {
   	transition: all 0.3s ease;
   }

   .demo-item-wrapper.fade-out {
   	opacity: 0;
   	transform: scale(0.8);
   	pointer-events: none;
   }

   .interactive-demo {
   	position: relative;
   	height: 100%;
   }

   .demo_img_container {
   	position: relative;
   	overflow: hidden;
   	border-radius: 30px;
   }

   .demo-overlay {
   	position: absolute;
   	top: 0;
   	left: 0;
   	right: 0;
   	bottom: 0;
   	background: linear-gradient(135deg, rgba(102, 126, 234, 0.9) 0%, rgba(118, 75, 162, 0.9) 100%);
   	opacity: 0;
   	visibility: hidden;
   	transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	border-radius: 30px;
   }

   .interactive-demo:hover .demo-overlay {
   	opacity: 1;
   	visibility: visible;
   }

   .overlay-content {
   	display: flex;
   	flex-direction: column;
   	gap: 15px;
   	align-items: center;
   	padding: 10px;
   }

   .demo-preview-btn,
   .demo-live-btn a {
   	background: rgba(255, 255, 255, 0.2);
   	backdrop-filter: blur(10px);
   	border: 1px solid rgba(255, 255, 255, 0.3);
   	color: #fff;
   	padding: 12px 20px;
   	border-radius: 50px;
   	font-weight: 600;
   	text-decoration: none;
   	display: flex;
   	align-items: center;
   	gap: 8px;
   	transition: all 0.3s ease;
   	cursor: pointer;
   }

   .demo-preview-btn:hover,
   .demo-live-btn a:hover {
   	background: rgba(255, 255, 255, 0.3);
   	transform: translateY(-2px);
   	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
   }

   .demo-content {
   	padding: 20px 0;
   }

   .demo-content h5 {
   	color: #141126;
   	text-align: center;
   	font-size: 18px;
   	font-weight: 600;
   	line-height: normal;
   	text-transform: capitalize;
   	margin-top: 0px !important;
   	margin-bottom: 10px;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	gap: 8px;
   }

   .demo-description {
   	color: #ffffff;
   	text-align: center;
   	font-size: 14px;
   	line-height: 1.5;
   	margin: 0;
   	opacity: 0;
   	transform: translateY(10px);
   	transition: all 0.3s ease;
   }

   .interactive-demo:hover .demo-description {
   	opacity: 1;
   	transform: translateY(0);
   }

   /* Tooltips */
   .demo-tooltip {
   	position: relative;
   	cursor: help;
   	color: #667eea;
   	opacity: 0.7;
   	transition: opacity 0.3s ease;
   }

   .demo-tooltip:hover {
   	opacity: 1;
   }

   .demo-tooltip::after {
   	content: attr(data-tooltip);
   	position: absolute;
   	bottom: 30px;
   	left: 50%;
   	transform: translateX(-50%);
   	background: #1e293b;
   	color: #fff;
   	padding: 8px 12px;
   	border-radius: 8px;
   	font-size: 12px;
   	font-weight: 500;
   	white-space: nowrap;
   	opacity: 0;
   	visibility: hidden;
   	transition: all 0.3s ease;
   	z-index: 1000;
   	width: 200px;
   	max-width: 200px;
   	white-space: normal;
   	text-align: center;
   	line-height: 1.4;
   }

   .demo-tooltip::before {
   	content: '';
   	position: absolute;
   	bottom: 25px;
   	left: 50%;
   	transform: translateX(-50%);
   	border: 5px solid transparent;
   	border-top-color: #1e293b;
   	opacity: 0;
   	visibility: hidden;
   	transition: all 0.3s ease;
   	z-index: 1001;
   }

   .demo-tooltip:hover::after,
   .demo-tooltip:hover::before {
   	opacity: 1;
   	visibility: visible;
   }

   /* Enhanced Buttons */
   .enhanced-buttons {
   	margin-top: 50px;
   }

   .interactive-btn {
   	position: relative;
   	overflow: hidden;
   	display: flex !important;
   	align-items: center;
   	gap: 10px;
   	transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
   }

   .btn-icon {
   	transition: transform 0.3s ease;
   }

   .btn-arrow {
   	transition: transform 0.3s ease;
   }

   .interactive-btn:hover .btn-icon {
   	transform: scale(1.1) rotate(5deg);
   }

   .interactive-btn:hover .btn-arrow {
   	transform: translateX(5px);
   }

   .interactive-btn:hover {
   	transform: translateY(-3px);
   	box-shadow: 0 5px 11px rgba(0, 0, 0, 0.10);
   }

   /* Animations */
   @keyframes fadeInUp {
   	from {
   		opacity: 0;
   		transform: translateY(30px);
   	}

   	to {
   		opacity: 1;
   		transform: translateY(0);
   	}
   }

   @keyframes pulse {

   	0%,
   	100% {
   		transform: scale(1);
   	}

   	50% {
   		transform: scale(1.05);
   	}
   }

   @keyframes slideIn {
   	from {
   		opacity: 0;
   		transform: translateX(-20px);
   	}

   	to {
   		opacity: 1;
   		transform: translateX(0);
   	}
   }

   .interactive-section {
   	animation: fadeInUp 0.8s ease forwards;
   }

   .interactive-section h2 {
   	text-align: center;
   	padding-bottom: 30px;
   }

   /* Loading States */
   .loading {
   	opacity: 0.6;
   	pointer-events: none;
   }

   .loading .demo_item {
   	animation: pulse 1.5s infinite;
   }

   /* Original Styles */
   .demos_row .demo_item {
   	padding: 0px 17px;
   	margin-bottom: 0px !important;
   	transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
   }

   .demo_item_inner .demo_img {
   	border-radius: 30px;
   	overflow: hidden;
   	transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
   }

   .demo_item_inner .demo_img img {
   	width: 100%;
   	height: 100%;
   	transition: transform 0.4s ease;
   }

   .demo_item:hover .demo_item_inner .demo_img {
   	box-shadow: 0px 40px 80px 0px rgba(102, 126, 234, 0.3);
   	transform: translateY(-5px);
   }

   .demo_item:hover .demo_item_inner .demo_img img {
   	transform: scale(1.02);
   }

   .demo_btn {
   	display: flex;
   	gap: 30px;
   	justify-content: center;
   	position: relative;
   	z-index: 5;
   	margin-top: 25px;
   }

   .demo_btn .live_btn a {
   	justify-content: center;
   	margin: 0;
   	width: 100%;
   	height: 60px;
   	line-height: 61px !important;
   	font-size: 18px;
   	font-weight: 500;
   	padding: 15px;
   }

   .demo_btn .get_btn a {
   	margin: 0;
   	min-width: 247px;
   	height: 60px;
   	color: #f161a1;
   	/*font-size: 18px;*/
   	font-weight: 500;
   	text-transform: capitalize;
   	border: 1px solid #f161a1;
   	display: inline-flex;
   	border-radius: 10px;
   	text-align: center;
   	align-items: center;
   	justify-content: center;
   }

   .demo_btn .get_btn a span {
   	margin-left: 7px;
   }

   .demo_item_shape .shape {
   	position: absolute;
   	z-index: -1;
   }

   .demo_item_shape .shape1 {
   	top: 0;
   	left: 0;
   }

   .demo_item_shape .shape2 {
   	bottom: 0;
   	right: 0;
   }

   .demo_item_shape .shape3 {
   	bottom: 20px;
   	left: 18%;
   }

   section.question_main_wrapper {
   	padding-top: 120px;
   }

   @media (max-width: 768px) {
   	.demo_showcase_banner_wrapper .banner_title h1 {
   		font-size: 2rem;
   	}


   	.demo_card {
   		padding: 30px 20px;
   	}

   	.comparison_header,
   	.comparison_row {
   		grid-template-columns: 1fr;
   	}

   	.comparison_header>div,
   	.comparison_row>div {
   		border-bottom: 1px solid #e2e8f0;
   		text-align: center !important;
   	}

   	.feature_name {
   		font-weight: 700;
   		background: #f8fafc;
   	}

   	.demo_features {
   		flex-wrap: wrap;
   	}

   	.demo_features ul {
   		margin-bottom: 0;
   	}

   	/* Mobile styles for new sections */
   	.live_demos_section {
   		margin-top: 40px;
   		padding: 60px 20px;
   	}

   	.live_demos_title h2 {
   		font-size: 2.2rem;
   	}

   	.live_demos_title p {
   		font-size: 1.1rem;
   	}

   	.demo_cards_container {
   		flex-direction: column;
   		gap: 30px;
   		align-items: center;
   	}

   	.demo_card_wrapper {
   		width: 100%;
   		max-width: 380px;
   	}

   	.attractive_demo_card {
   		padding: 25px 20px;
   	}

   	.demo_card_title h3 {
   		font-size: 1.5rem;
   	}

   	.demo_launch_btn {
   		padding: 14px 28px;
   		font-size: 1rem;
   	}

   	.interactive_demos_section,
   	.documentation_section {
   		margin-top: 40px;
   		padding: 40px 20px;
   	}

   	.demos_title h2,
   	.documentation_title h2 {
   		font-size: 1.8rem;
   	}

   	.demos_grid,
   	.documentation_grid {
   		gap: 20px;
   	}

   	.demo_feature_card,
   	.doc_card {
   		padding: 25px 15px;
   		margin-bottom: 20px;
   	}

   	.resource_card {
   		padding: 20px;
   		margin-bottom: 20px;
   	}

   	.resource_header {
   		flex-direction: column;
   		text-align: center;
   		gap: 10px;
   	}

   	.resource_actions {
   		text-align: center;
   	}

   	.documentation_resources .col-lg-6 {
   		margin-bottom: 20px;
   	}

   	/* Mobile styles for What Makes Woffice Special section */
   	.enough_w_wrapper {
   		padding: 60px 0 35px;
   	}

   	.enough_container .title h2 {
   		font-size: 32px;
   		line-height: 42px;
   		margin-bottom: 30px;
   	}

   	/* Interactive Stats Mobile */
   	.interactive-stats {
   		flex-direction: column;
   		gap: 30px;
   		padding: 25px 15px;
   		margin-bottom: 35px;
   	}

   	.stat-number {
   		font-size: 2rem;
   	}

   	.stat-label {
   		font-size: 0.8rem;
   	}

   	/* Filter Buttons Mobile */
   	.demo-filters {
   		gap: 10px;
   		margin-bottom: 35px;
   		padding: 0 10px;
   	}

   	.filter-btn {
   		padding: 10px 18px;
   		font-size: 0.8rem;
   		min-width: auto;
   	}

   	/* Demo Items Mobile */
   	.demos_row .demo_item {
   		padding: 0px 10px;
   		margin-bottom: 35px;
   	}

   	.demo_item_inner .demo_img {
   		border-radius: 20px;
   	}

   	.demo-content h5 {
   		font-size: 16px;
   		margin-top: 15px;
   		margin-bottom: 8px;
   	}

   	.demo-description {
   		font-size: 13px;
   	}

   	/* Overlay Mobile */
   	.demo-overlay {
   		background: linear-gradient(135deg, rgba(102, 126, 234, 0.95) 0%, rgba(118, 75, 162, 0.95) 100%);
   	}

   	.overlay-content {
   		gap: 12px;
   	}

   	.demo-preview-btn,
   	.demo-live-btn a {
   		padding: 10px 16px;
   		font-size: 14px;
   		gap: 6px;
   	}

   	/* Tooltips Mobile */
   	.demo-tooltip::after {
   		font-size: 11px;
   		padding: 6px 10px;
   		max-width: 180px;
   		bottom: 25px;
   	}

   	.demo-tooltip::before {
   		bottom: 20px;
   	}

   	/* Buttons Mobile */
   	.demo_btn {
   		gap: 20px;
   		align-items: center;
   		margin-top: 0;
   	}

   	.demo_btn .live_btn a,
   	.demo_btn .get_btn a {
   		width: 100%;
   		max-width: 280px;
   		height: 50px;
   		font-size: 16px;
   		gap: 8px;
   	}

   	.demo_btn .live_btn a {
   		line-height: 51px !important;
   	}

   	.demo_btn .get_btn a {
   		border-radius: 8px;
   	}

   	.btn-icon {
   		width: 16px;
   		height: 16px;
   	}

   	.demo_item_shape .shape3 {
   		display: none;
   	}

   	/* Enhanced buttons mobile */
   	.enhanced-buttons {
   		margin-top: 35px;
   	}
   }

   /* ==========================================
      IMPROVED SECTIONS STYLES
      ========================================== */

   /* Improved Demo Showcase Row */
   .row.demo_showcase_row_improved {
   	margin-top: 50px;
   }

   .demo_card_improved {
   	background: radial-gradient(circle, rgba(102, 126, 234, 0.05) 0%, #fff 70%);
   	border-radius: 20px;
   	padding: 40px;
   	position: relative;
   	/*overflow: hidden;*/
   	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
   	transition: all 0.4s ease;
   	border: 1px solid rgba(0, 0, 0, 0.05);
   }

   .demo_card_improved:hover {
   	transform: translateY(-8px);
   	box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15);
   }


   .premium_glow {
   	background: radial-gradient(circle, rgba(241, 97, 161, 0.05) 0%, transparent 70%);
   }

   .demo_badge_improved {
   	position: absolute;
   	top: -20px;
   	right: 20px;
   	z-index: 2;
   }

   .badge_improved {
   	display: flex;
   	align-items: center;
   	gap: 8px;
   	padding: 8px 16px;
   	border-radius: 25px;
   	font-size: 0.9rem;
   	font-weight: 600;
   	color: #fff;
   	background: linear-gradient(135deg, #82b440 0%, #6a9635 100%);
   	box-shadow: 0 4px 15px rgba(130, 180, 64, 0.3);
   }

   .premium_badge_improved {
   	background: linear-gradient(135deg, #f161a1 0%, #d84789 100%);
   	box-shadow: 0 4px 15px rgba(241, 97, 161, 0.3);
   }

   .demo_screenshot_section {
   	margin: 30px 0;
   	position: relative;
   }

   .screenshot_container {
   	position: relative;
   	border-radius: 15px;
   	overflow: hidden;
   	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
   	transition: all 0.3s ease;
   }

   .screenshot_container:hover {
   	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.2);
   	transform: translateY(-5px);
   }

   .demo_screenshot_placeholder {
   	width: 100%;
   	height: 200px;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
   	color: #64748b;
   	transition: all 0.3s ease;
   }

   .themeforest_placeholder {
   	background: linear-gradient(135deg, rgba(130, 180, 64, 0.1) 0%, rgba(106, 150, 53, 0.1) 100%);
   	color: #82b440;
   }

   .premium_placeholder {
   	background: linear-gradient(135deg, rgba(241, 97, 161, 0.1) 0%, rgba(216, 71, 137, 0.1) 100%);
   	color: #f161a1;
   }

   .placeholder_content {
   	text-align: center;
   	padding: 40px 20px;
   }

   .placeholder_content h4 {
   	font-weight: 600;
   }

   .placeholder_content p {
   	font-size: 1rem;
   	opacity: 0.8;
   	margin: 0;
   }

   .demo_screenshot {
   	width: 100%;
   	height: auto;
   	display: block;
   	transition: transform 0.3s ease;
   }

   .screenshot_overlay {
   	position: absolute;
   	top: 0;
   	left: 0;
   	right: 0;
   	bottom: 0;
   	background: rgba(0, 0, 0, 0.8);
   	display: flex;
   	flex-direction: column;
   	align-items: center;
   	justify-content: center;
   	opacity: 0;
   	transition: all 0.3s ease;
   	gap: 15px;
   	backdrop-filter: blur(5px);
   }

   .screenshot_container:hover .screenshot_overlay {
   	opacity: 1;
   }

   .screenshot_container:hover .demo_screenshot {
   	transform: scale(1.05);
   }

   .screenshot_container:hover .demo_screenshot_placeholder {
   	transform: scale(1.02);
   	filter: brightness(1.1);
   }

   .play_button {
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	cursor: pointer;
   	transition: transform 0.2s ease;
   }

   .play_button:hover {
   	transform: scale(1.1);
   }

   .preview_text {
   	color: #fff;
   	font-weight: 600;
   	font-size: 1.1rem;
   }

   .demo_content_improved h3 {
   	font-size: 1.8rem;
   	font-weight: 700;
   	color: #1a1a1a;
   	margin-bottom: 15px;
   }

   .demo_content_improved p {
   	font-size: 1.1rem;
   	color: #666;
   	line-height: 1.6;
   	margin-bottom: 25px;
   }

   .demo_stats {
   	display: flex;
   	justify-content: space-between;
   	margin: 30px 0;
   	padding: 25px;
   	background: #f8fafc;
   	border-radius: 15px;
   }

   .stat_item {
   	text-align: center;
   }

   .stat_number {
   	display: block;
   	font-size: 1.5rem;
   	font-weight: 700;
   	color: #82b440;
   	margin-bottom: 5px;
   }

   .premium_demo_improved .stat_number {
   	color: #f161a1;
   }

   .stat_label {
   	font-size: 0.9rem;
   	color: #666;
   }

   .demo_features_improved {
   	margin: 30px 0;
   }

   .feature_grid {
   	display: grid;
   	grid-template-columns: repeat(2, 1fr);
   	gap: 15px;
   }

   .feature_item {
   	display: flex;
   	align-items: center;
   	justify-content: left;
   	gap: 12px;
   	padding: 15px;
   	background: #fff;
   	border: 1px solid #e2e8f0;
   	border-radius: 10px;
   	transition: all 0.2s ease;
   }

   .feature_item:hover {
   	border-color: #82b440;
   	transform: translateX(5px);
   }

   .premium_feature:hover {
   	border-color: #f161a1;
   }

   .feature_icon {
   	font-size: 1.2rem;
   }

   .demo_buttons_improved {
   	display: flex;
   	gap: 15px;
   	margin-top: 30px;
   	align-items: center;
   	justify-content: center;
   }

   .btn_improved {
   	position: relative;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	padding: 15px 22px;
   	border: none;
   	border-radius: 12px;
   	font-weight: 600;
   	text-decoration: none;
   	overflow: hidden;
   	transition: all 0.3s ease;
   	cursor: pointer;
   }

   .primary_improved {
   	background: linear-gradient(135deg, #82b440 0%, #6a9635 100%);
   	color: #fff;
   }

   .premium_primary {
   	background: linear-gradient(135deg, #f161a1 0%, #d84789 100%);
   }

   .secondary_improved {
   	background: transparent;
   	color: #667eea;
   	border: 2px solid #667eea;
   }

   .premium_secondary_btn {
   	color: #f161a1;
   	border-color: #f161a1;
   }

   .btn_improved:hover {
   	transform: translateY(-2px);
   	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
   }

   .btn_content {
   	display: flex;
   	align-items: center;
   	gap: 10px;
   	z-index: 1;
   }

   .btn_ripple {
   	position: absolute;
   	top: 0;
   	left: 0;
   	right: 0;
   	bottom: 0;
   	background: rgba(255, 255, 255, 0.2);
   	transform: scale(0);
   	border-radius: 50%;
   	transition: transform 0.6s ease;
   }

   .btn_improved:active .btn_ripple {
   	transform: scale(4);
   }

   /* Enhanced Live Demos Section */
   .live_demos_section_improved {
   	padding: 80px 0;
   	background: linear-gradient(135deg, #1e3a8a 0%, #3730a3 50%, #581c87 100%);
   	color: #fff;
   	position: relative;
   	overflow: hidden;
   	margin-bottom: 80px;
   }

   .live_demos_header_improved {
   	text-align: center;
   	margin-bottom: 60px;
   	position: relative;
   	z-index: 1;
   }

   .live_demos_header_improved h2 {
   	font-size: 2.8rem;
   	font-weight: 700;
   	/*margin-bottom: 15px;*/
   	background: linear-gradient(135deg, #fff 0%, #e0e7ff 100%);
   	-webkit-background-clip: text;
   	-webkit-text-fill-color: transparent;
   	background-clip: text;
   }

   .live_demos_header_improved p {
   	font-size: 1.2rem;
   	opacity: 0.9;
   	color: #ffffff;
   }

   .demo_showcase_grid {
   	position: relative;
   	z-index: 1;
   }

   .demo_preview_card {
   	background: rgba(255, 255, 255, 0.95);
   	backdrop-filter: blur(10px);
   	border-radius: 25px;
   	padding: 40px;
   	color: #1a1a1a;
   	box-shadow: 0 15px 50px rgba(0, 0, 0, 0.1);
   	position: relative;
   	overflow: hidden;
   }

   .demo_preview_header {
   	margin-bottom: 30px;
   }

   .demo_preview_badge {
   	display: flex;
   	align-items: center;
   	justify-content: space-between;
   	padding: 15px 20px;
   	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
   	color: #fff;
   	border-radius: 15px;
   	position: relative;
   }

   .premium_badge_improved {
   	background: linear-gradient(135deg, #f161a1 0%, #d84789 100%);
   }

   .badge_text {
   	font-size: 1.1rem;
   	font-weight: 600;
   }

   .badge_price {
   	font-size: 1.3rem;
   	font-weight: 700;
   }

   .most_popular_tag {
   	position: absolute;
   	top: -10px;
   	right: 10px;
   	background: #fbbf24;
   	color: #92400e;
   	padding: 4px 12px;
   	border-radius: 10px;
   	font-size: 0.8rem;
   	font-weight: 600;
   }

   .demo_screenshot_gallery {
   	margin-bottom: 30px;
   }

   .main_screenshot {
   	position: relative;
   	border-radius: 15px;
   	overflow: hidden;
   	margin-bottom: 20px;
   	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
   	transition: all 0.3s ease;
   }

   .main_screenshot:hover {
   	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
   	transform: translateY(-3px);
   }

   .main_screenshot_placeholder {
   	width: 100%;
   	height: 200px;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
   	color: #64748b;
   	transition: all 0.3s ease;
   }

   .themeforest_main_placeholder {
   	background: linear-gradient(135deg, rgba(130, 180, 64, 0.15) 0%, rgba(106, 150, 53, 0.15) 100%);
   	color: #82b440;
   }

   .premium_main_placeholder {
   	background: linear-gradient(135deg, rgba(241, 97, 161, 0.15) 0%, rgba(216, 71, 137, 0.15) 100%);
   	color: #f161a1;
   }

   .placeholder_main_content {
   	text-align: center;
   	padding: 30px 20px;
   }

   .placeholder_main_content h5 {
   	font-size: 1.3rem;
   	font-weight: 600;
   	margin: 15px 0 8px 0;
   	color: inherit;
   }

   .placeholder_main_content p {
   	font-size: 0.9rem;
   	opacity: 0.8;
   	margin: 0;
   }

   .screenshot_img {
   	width: 100%;
   	height: auto;
   	display: block;
   	transition: transform 0.3s ease;
   }

   .screenshot_overlay_improved {
   	position: absolute;
   	top: 0;
   	left: 0;
   	right: 0;
   	bottom: 0;
   	background: rgba(0, 0, 0, 0.8);
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	gap: 20px;
   	opacity: 0;
   	transition: opacity 0.3s ease;
   }

   .main_screenshot:hover .screenshot_overlay_improved {
   	opacity: 1;
   }

   .main_screenshot:hover .screenshot_img {
   	transform: scale(1.05);
   }

   .screenshot_btn {
   	display: flex;
   	align-items: center;
   	gap: 8px;
   	padding: 12px 20px;
   	background: rgba(255, 255, 255, 0.9);
   	color: #1a1a1a;
   	border: none;
   	border-radius: 10px;
   	font-weight: 600;
   	cursor: pointer;
   	transition: all 0.2s ease;
   }

   .screenshot_btn:hover {
   	background: #fff;
   	transform: translateY(-2px);
   }

   .screenshot_thumbnails {
   	display: flex;
   	gap: 15px;
   	overflow-x: auto;
   	padding: 10px 0;
   	align-items: center;
   	justify-content: center;
   }

   .thumbnail_item {
   	flex-shrink: 0;
   	width: 80px;
   	text-align: center;
   	cursor: pointer;
   	transition: all 0.2s ease;
   }

   .thumbnail_placeholder {
   	width: 100%;
   	height: 50px;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
   	border-radius: 8px;
   	border: 2px solid transparent;
   	transition: all 0.2s ease;
   	color: #64748b;
   }

   .premium_thumb {
   	background: linear-gradient(135deg, rgba(241, 97, 161, 0.1) 0%, rgba(216, 71, 137, 0.1) 100%);
   	color: #f161a1;
   }

   .thumbnail_item.active .thumbnail_placeholder,
   .thumbnail_item:hover .thumbnail_placeholder {
   	border-color: #667eea;
   	transform: scale(1.05);
   	background: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%);
   }

   .thumbnail_item.active .premium_thumb,
   .thumbnail_item:hover .premium_thumb {
   	border-color: #f161a1;
   	background: linear-gradient(135deg, rgba(241, 97, 161, 0.2) 0%, rgba(216, 71, 137, 0.2) 100%);
   }

   .thumbnail_item img {
   	width: 100%;
   	height: 50px;
   	object-fit: cover;
   	border-radius: 8px;
   	border: 2px solid transparent;
   	transition: all 0.2s ease;
   }

   .thumbnail_item.active img,
   .thumbnail_item:hover img {
   	border-color: #667eea;
   	transform: scale(1.1);
   }

   .main_screenshot:hover .main_screenshot_placeholder {
   	transform: scale(1.02);
   	filter: brightness(1.05);
   }

   .thumb_label {
   	display: block;
   	font-size: 0.8rem;
   	color: #666;
   	margin-top: 5px;
   }

   .demo_features_showcase {
   	margin-bottom: 30px;
   }

   .demo_features_showcase h4 {
   	font-size: 1.3rem;
   	font-weight: 600;
   	color: #1a1a1a;
   	margin-bottom: 20px;
   }

   .feature_showcase_grid {
   	display: grid;
   	grid-template-columns: repeat(2, 1fr);
   	gap: 15px;
   }

   .feature_showcase_item {
   	display: flex;
   	align-items: center;
   	gap: 15px;
   	padding: 15px;
   	background: #f8fafc;
   	border-radius: 12px;
   	transition: all 0.2s ease;
   }

   .feature_showcase_item:hover {
   	background: #e2e8f0;
   	transform: translateX(5px);
   }

   .premium_feature_item:hover {
   	background: linear-gradient(135deg, rgba(241, 97, 161, 0.1), rgba(216, 71, 137, 0.1));
   }

   .feature_icon_improved {
   	font-size: 1.5rem;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   	width: 40px;
   	height: 40px;
   	background: #fff;
   	border-radius: 10px;
   	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
   }

   .feature_details h5 {
   	font-size: 1rem;
   	font-weight: 600;
   	color: #1a1a1a;
   	margin-bottom: 5px;
   }

   .feature_details p {
   	font-size: 0.9rem;
   	color: #666;
   }

   .demo_action_improved {
   	text-align: center;
   }

   .demo_cta_btn {
   	display: inline-flex;
   	align-items: center;
   	gap: 10px;
   	padding: 15px 35px;
   	border-radius: 15px;
   	text-decoration: none;
   	font-weight: 600;
   	font-size: 1.1rem;
   	transition: all 0.3s ease;
   }

   .themeforest_cta {
   	background: linear-gradient(135deg, #82b440 0%, #6a9635 100%);
   	color: #fff;
   }

   .premium_cta {
   	background: linear-gradient(135deg, #f161a1 0%, #d84789 100%);
   	color: #fff;
   }

   .demo_cta_btn:hover {
   	transform: translateY(-3px);
   	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
   }

   .demo_comparison_quick {
   	/*margin-top: 60px;*/
   	padding: 40px;
   	background: rgba(255, 255, 255, 0.1);
   	backdrop-filter: blur(10px);
   	border-radius: 20px;
   	border: 1px solid rgba(255, 255, 255, 0.2);
   }

   .comparison_quick_title {
   	text-align: center;
   	margin-bottom: 30px;
   }

   .comparison_quick_title h3 {
   	font-size: 1.8rem;
   	font-weight: 600;
   	margin-bottom: 10px;
   }

   .comparison_quick_title p {
   	color: #ffffff;
   }

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

   .compare_item {
   	text-align: center;
   	padding: 20px;
   	background: rgba(255, 255, 255, 0.1);
   	border-radius: 15px;
   }

   .compare_icon {
   	font-size: 2rem;
   	margin-bottom: 10px;
   }

   .compare_label {
   	font-size: 1rem;
   	font-weight: 600;
   	margin-bottom: 15px;
   }

   .compare_values {
   	display: flex;
   	flex-direction: column;
   	gap: 5px;
   }

   .themeforest_value {
   	color: #82b440;
   	font-weight: 600;
   }

   .premium_value {
   	color: #f161a1;
   	font-weight: 600;
   }

   .vs {
   	font-size: 0.8rem;
   	opacity: 0.7;
   }

   .compare_cta {
   	margin-top: 15px;
   }

   .compare_btn {
   	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
   	color: #fff;
   	padding: 10px 20px;
   	border-radius: 25px;
   	text-decoration: none;
   	font-size: 0.85rem;
   	font-weight: 600;
   	transition: all 0.3s ease;
   	display: inline-block;
   }

   .compare_btn:hover {
   	transform: translateY(-2px);
   	box-shadow: 0 8px 20px rgba(102, 126, 234, 0.4);
   	color: #fff;
   }


   /* Mobile Responsiveness for Improved Sections */
   @media (max-width: 768px) {
   	.demo_showcase_row_improved {
   		margin-top: 40px;
   		gap: 30px;
   	}

   	.demo_card_improved {
   		padding: 30px 20px;
   	}

   	.demo_content_improved h3 {
   		font-size: 1.5rem;
   	}

   	.demo_stats {
   		flex-direction: column;
   		gap: 20px;
   	}

   	.feature_grid {
   		grid-template-columns: 1fr;
   	}

   	.demo_buttons_improved {
   		flex-direction: column;
   	}

   	.comparison_cards_container {
   		grid-template-columns: 1fr;
   		gap: 20px;
   	}

   	.featured_card {
   		transform: none;
   	}

   	.summary_actions {
   		flex-direction: column;
   	}

   	.live_demos_header_improved h2 {
   		font-size: 2rem;
   	}

   	.demo_preview_card {
   		padding: 30px 20px;
   	}

   	.feature_showcase_grid {
   		grid-template-columns: 1fr;
   	}

   	.quick_compare_grid {
   		grid-template-columns: 1fr;
   	}

   	.trial_buttons {
   		flex-direction: column;
   	}
   }

   /*comparison table improved*/

   .comparison_improved_wrap h1 {
   	margin: 60px 0 6px;
   	font-size: clamp(28px, 2.2vw + 18px, 44px);
   	line-height: 1.15;
   	text-align: center;
   }

   .comparison_improved_sub {
   	text-align: center;
   	color: #6b7280;
   	margin: 0 0 28px;
   }

   .comparison_improved {
   	display: grid;
   	grid-template-columns: 1fr 1fr 1fr;
   	background: #ffffff;
   	border-radius: 14px;
   	box-shadow: 0 12px 30px rgba(0, 0, 0, .06);
   	overflow: hidden;
   }

   .comparison_improved_col {
   	padding: 18px;
   }

   .comparison_improved_col.head {
   	background: #f9fafb;
   	font-weight: 700;
   }

   .comparison_improved_col.premium {
   	background: #fefcf6;
   	/* light gray highlight for Premium */
   }

   .comparison_improved_feature {
   	display: contents;
   	/* keep row alignment in grid */
   }

   .comparison_improved_feature>div {
   	padding: 18px;
   	border-top: 1px solid #e5e7eb;
   	display: flex;
   	align-items: center;
   }

   .comparison_improved_feature>.comparison_improved_label {
   	justify-content: flex-start;
   	font-weight: 500;
   }

   .comparison_improved_badge {
   	padding: 6px 12px;
   	border-radius: 999px;
   	background: #fff4e0;
   	color: #9a6500;
   	font-weight: 600;
   	font-size: 14px;
   	margin-left: 6px;
   	border: 1px solid #f59e0b33;
   }

   .comparison_improved_pill {
   	padding: .3rem .6rem;
   	background: #e8efff;
   	color: #2b6bdc;
   	border-radius: 10px;
   	font-weight: 700;
   	font-size: 14px;
   }

   .comparison_improved_hot {
   	color: #ec4899;
   	font-weight: 700;
   }

   .comparison_improved_icon {
   	width: 22px;
   	height: 22px;
   }

   .comparison_improved_check {
   	color: #22c55e;
   }

   .comparison_improved_cross {
   	color: #9aa3af;
   }

   /* Responsive: stack columns */
   @media (max-width: 760px) {
   	.comparison_improved {
   		grid-template-columns: 1fr;
   	}

   	.comparison_improved_col.head {
   		display: none;
   	}

   	.comparison_improved_feature>div {
   		justify-content: space-between;
   	}

   	.comparison_improved_label {
   		font-weight: 600;
   	}
   }

   /* Edition Badges Styles */
   .edition_badges {
   	display: flex;
   	justify-content: center;
   	gap: 20px;
   	/*margin-top: 25px;*/
   	/*padding: 15px 25px;*/
   	/*background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #a855f7 100%);*/
   	/*border-radius: 50px;*/
   	/*box-shadow: 0 8px 25px rgba(99, 102, 241, 0.3);*/
   	/*backdrop-filter: blur(10px);*/
   }

   .edition_badge {
   	display: flex;
   	align-items: center;
   	gap: 10px;
   	padding: 8px 16px;
   	border-radius: 25px;
   	background: rgba(255, 255, 255, 0.1);
   	backdrop-filter: blur(5px);
   	transition: all 0.3s ease;
   	border: 1px solid rgba(255, 255, 255, 0.2);
   	color: #ffffff;
   	font-weight: 600;
   	font-size: 14px;
   	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
   }

   .edition_badge:hover {
   	background: rgba(255, 255, 255, 0.15);
   	transform: translateY(-2px);
   }

   .badge_dot {
   	width: 12px;
   	height: 12px;
   	border-radius: 50%;
   	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
   }

   .themeforest_edition .badge_dot {
   	background: #82b440;
   }

   .premium_edition .badge_dot {
   	background: #f161a1;
   }

   @media (max-width: 768px) {
   	.edition_badges {
   		flex-direction: column;
   		gap: 10px;
   		padding: 12px 20px;
   		border-radius: 15px;
   	}

   	.edition_badge {
   		justify-content: center;
   		padding: 10px 20px;
   	}
   }


   /* New Pricing Cards Improved */
   .demo_showcase_banner_wrapper {
   	padding-bottom: 300px;
   }

   .demo_showcase_banner_wrapper .banner_title p {
   	max-width: 990px;
   }

   #pricing_cards_improved {
   	margin-top: -260px;
   	position: relative;
   	z-index: 10;
   	padding-top: 30px;
   }

   .pricing_cards_grid {
   	display: grid;
   	grid-template-columns: repeat(2, 1fr);
   	max-width: 1000px;
   	margin: 0 auto;
   }

   .pricing_card_improved {
   	background: #ffffff;
   	border-radius: 16px;
   	padding: 32px;
   	box-shadow: 0 -4px 14px rgba(0, 0, 0, 0.10);
   	transition: all 0.3s ease;
   	position: relative;
   	overflow: hidden;
   }

   .pricing_cards_improved_wrap .demo_btn {
   	flex-wrap: wrap;
   	margin: 0;
   	padding: 0;
   	gap: 20px;
   }

   .pricing_cards_improved_wrap .demo_btn div {
   	width: 100%;
   }

   .essential_card a.btn-hover.color-9.first_btn.interactive-btn {
   	background: linear-gradient(135deg, #82b440 0%, #6a9635 100%);
   	color: #fff;
   }

   .essential_card a.btn-hover.color-9.get_btn.interactive-btn {
   	border: 1px solid #82b440;
   	color: #82b440;
   }

   .pricing_card_improved:hover {
   	transform: translateY(-5px);
   	box-shadow: 0 30px 70px rgba(0, 0, 0, 0.15);
   }

   .premium_card {
   	border: 2px solid #f161a1;
   	background: linear-gradient(135deg, #ffffff 0%, #f8f9ff 100%);
   	overflow: inherit;
   }

   .premium_card {
   	transform: scale(1.05);
   	margin: -20px 0;
   }

   .popular_choice_badge {
   	position: absolute;
   	top: -20px;
   	right: 20px;
   	display: inline-flex;
   	align-items: center;
   	gap: 6px;
   	background: linear-gradient(135deg, #f161a1 0%, #d84789 100%);
   	color: #ffffff;
   	padding: 8px 16px;
   	border-radius: 20px;
   	font-size: 13px;
   	font-weight: 600;
   	box-shadow: 0 4px 15px rgba(241, 97, 161, .3);
   	z-index: 1000;
   	white-space: nowrap;
   	transform: translateZ(0);
   	border: 2px solid rgba(255, 255, 255, 0.2);
   }

   .popular_choice_badge svg {
   	width: 14px;
   	height: 14px;
   	fill: #ffd700;
   }

   .pricing_card_header h3 {
   	font-size: 24px;
   	font-weight: 600;
   	color: #1f2937;
   	margin: 0 0 8px;
   }

   .pricing_card_header p {
   	font-size: 16px;
   	color: #6b7280;
   	margin: 0 0 24px;
   }

   .pricing_card_features h4 {
   	font-size: 18px;
   	font-weight: 600;
   	color: #1f2937;
   	margin: 0 0 8px;
   }

   .pricing_card_features h5 {
   	font-size: 16px;
   	font-weight: 500;
   	color: #4b5563;
   	margin: 0 0 20px;
   }

   .feature_list {
   	margin-bottom: 32px;
   }

   .feature_item {
   	display: flex;
   	align-items: center;
   	gap: 12px;
   	margin-bottom: 8px;
   	padding: 8px 10px;
   	border: none;
   	border-radius: none;
   	border-bottom: 1px solid #ececec;
   }

   .feature_icon {
   	width: 20px;
   	height: 20px;
   	flex-shrink: 0;
   }

   .feature_check {
   	fill: #10b981;
   }

   .feature_cross {
   	fill: #ef4444;
   }

   .feature_pill {
   	background: #e5e7eb;
   	color: #374151;
   	padding: 4px 12px;
   	border-radius: 12px;
   	font-size: 12px;
   	font-weight: 500;
   	min-width: 60px;
   	text-align: center;
   }

   .feature_pill.premium {
   	background: #667eea;
   	color: #ffffff;
   }

   .feature_text {
   	font-size: 14px;
   	color: #6b7280;
   	min-width: 100px;
   }

   .feature_text.premium {
   	color: #667eea;
   	font-weight: 500;
   }

   .pricing_card_improved .pricing_card_actions {
   	display: flex;
   	flex-direction: column;
   	gap: 12px;
   	width: 100%;
   	justify-content: stretch;
   }

   .pricing_card_improved .pricing_card_button {
   	display: inline-flex;
   	align-items: center;
   	justify-content: center;
   	padding: 12px 24px;
   	border-radius: 8px;
   	font-size: 16px;
   	font-weight: 500;
   	text-decoration: none;
   	transition: all 0.3s ease;
   	cursor: pointer;
   	max-width: none;
   	width: 100%;
   	box-sizing: border-box;
   }

   .pricing_card_improved .primary_button {
   	background: linear-gradient(to right, #3146c5, #3146c5, #3146c5, #3f86ed);
   	color: #ffffff;
   	border: 1px solid #4f46e5;
   	border-radius: 25px;
   }

   .pricing_card_improved .primary_button:hover {
   	background-image: linear-gradient(to right, #3146c5, #4481eb, #3146c5, #3f86ed);
   	background-position: 100% 0;
   	color: #fff;
   	transition: all .3s ease-in-out;
   }

   .pricing_card_improved .premium_primary {
   	background: #4f46e5;
   	border-color: #4f46e5;
   }

   .pricing_card_improved .premium_primary:hover {
   	background: #4338ca;
   	border-color: #4338ca;
   }

   .pricing_card_improved .secondary_button {
   	background: transparent;
   	color: #f161a1;
   	border: 1px solid #f161a1;
   	border-radius: 25px;
   }

   .pricing_card_improved .secondary_button:hover {
   	background: #f161a1;
   	border-color: #f161a1;
   	color: #ffffff;
   }

   .pricing_card_improved .premium_secondary {
   	color: #f161a1;
   	border-color: #f161a1;
   }

   .pricing_card_improved .premium_secondary:hover {
   	background: #f161a1;
   	border-color: #f161a1;
   	color: #ffffff;
   }

   @media (max-width: 768px) {
   	.pricing_cards_grid {
   		grid-template-columns: 1fr;
   		gap: 30px;
   	}

   	.pricing_card_improved {
   		padding: 24px;
   	}

   	.premium_card {
   		transform: scale(1.02);
   		margin: -10px 0;
   	}

   	.demo_showcase_banner_wrapper {
   		padding-bottom: 150px;
   	}

   	#pricing_cards_improved {
   		margin-top: -180px;
   		padding-top: 40px;
   	}

   	.pricing_card_improved .pricing_card_button {
   		padding: 14px 18px;
   		font-size: 15px;
   	}

   	.popular_choice_badge {
   		top: -12px;
   		right: 15px;
   		padding: 6px 12px;
   		font-size: 12px;
   	}
   }